Commitcf94b94

committed

Adds ability to add custom tags for multiselect component

1 parentd4ac9e3 commitcf94b94Copy full SHA for cf94b94

File tree

+18

-7

lines changed

client/packages/lowcoder/src
- comps/comps/selectInputComp
- i18n/locales
  - en.ts

+18

-7

lines changed

Lines changed: 7 additions & 3 deletions

Original file line number	Diff line number	Diff line change
`@@ -14,7 +14,7 @@ import { SelectInputInvalidConfig, useSelectInputValidate } from "./selectInputC`
`14`	`14`
`15`	`15`	`import{PaddingControl}from"../../controls/paddingControl";`
`16`	`16`	`import{MarginControl}from"../../controls/marginControl";`
`17`		`-import{migrateOldData,withDefault}from"comps/generators/simpleGenerators";`
	`17`	`+import{migrateOldData}from"comps/generators/simpleGenerators";`
`18`	`18`	`import{fixOldInputCompData}from"../textInputComp/textInputConstants";`
`19`	`19`
`20`	`20`	`letMultiSelectBasicComp=(function(){`
`@@ -35,6 +35,10 @@ let MultiSelectBasicComp = (function () {`
`35`	`35`	`validateState,`
`36`	`36`	`handleChange,`
`37`	`37`	`]=useSelectInputValidate(props);`
	`38`	`+`
	`39`	`+constremoveIllegalEntries=()=>{`
	`40`	`+returnprops.value.value.filter?.((v)=>valueSet.has(v))`
	`41`	`+}`
`38`	`42`
`39`	`43`	`returnprops.label({`
`40`	`44`	`required:props.required,`
`@@ -45,8 +49,8 @@ let MultiSelectBasicComp = (function () {`
`45`	`49`	`children:(`
`46`	`50`	`<SelectUIView`
`47`	`51`	`{...props}`
`48`		`-mode={"multiple"}`
`49`		`-value={props.value.value.filter?.((v)=>valueSet.has(v))}`
	`52`	`+mode={props.allowCustomTags ?"tags" :"multiple"}`
	`53`	`+value={props.allowCustomTags ?props.value.value :removeIllegalEntries()}`
`50`	`54`	`onChange={handleChange}`
`51`	`55`	`dispatch={dispatch}`
`52`	`56`	`/>`

Lines changed: 6 additions & 4 deletions

Original file line number	Diff line number	Diff line change
`@@ -76,7 +76,8 @@ export const getStyle = (`
`76`	`76`	`padding:${style.padding};`
`77`	`77`	`height: auto;`
`78`	`78`	`}`
`79`		`- .ant-select-selection-search {`
	`79`	`+ .ant-select-selection-search {`
	`80`	`+ min-width: 50px;`
`80`	`81`	`padding:${style.padding};`
`81`	`82`	`}`
`82`	`83`	`.ant-select-selection-search-input,`
`@@ -268,9 +269,10 @@ export const SelectUIView = (`
`268`	`269`	`placeholder={props.placeholder}`
`269`	`270`	`value={props.value}`
`270`	`271`	`showSearch={props.showSearch}`
`271`		`-filterOption={(input,option)=>`
`272`		`-option?.label.toLowerCase().includes(input.toLowerCase())`
`273`		`-}`
	`272`	`+filterOption={(input,option)=>{`
	`273`	`+if(!option)returnfalse;`
	`274`	`+returnString(option.label??option.value??"").toLowerCase().includes(input.toLowerCase());`
	`275`	`+}}`
`274`	`276`	`popupRender={(originNode:ReactNode)=>(`
`275`	`277`	`<DropdownStyled$style={props.childrenInputFieldStyleasChildrenMultiSelectStyleType}>`
`276`	`278`	`{originNode}`

Lines changed: 4 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -19,6 +19,7 @@ import { blurMethod, focusWithOptions } from "comps/utils/methodUtils";`
`19`	`19`	`exportconstSelectInputValidationChildren={`
`20`	`20`	`required:BoolControl,`
`21`	`21`	`showValidationWhenEmpty:BoolControl,`
	`22`	`+allowCustomTags:BoolControl,`
`22`	`23`	`customRule:CustomRuleControl,`
`23`	`24`	`};`
`24`	`25`	`typeValidationComp=RecordConstructorToComp<typeofSelectInputValidationChildren>;`
`@@ -126,6 +127,9 @@ export const SelectInputValidationSection = (children: ValidationComp) => (`
`126`	`127`	`{children.showValidationWhenEmpty.propertyView({`
`127`	`128`	`label:trans("prop.showEmptyValidation"),`
`128`	`129`	`})}`
	`130`	`+{children.allowCustomTags.propertyView({`
	`131`	`+label:trans("prop.customTags")`
	`132`	`+})}`
`129`	`133`	`{children.customRule.propertyView({})}`
`130`	`134`	`</Section>`
`131`	`135`	`);`

Lines changed: 1 addition & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -234,6 +234,7 @@ export const en = {`
`234`	`234`	`"verticalGridCells":"Vertical Grid Cells",`
`235`	`235`	`"timeZone":"TimeZone",`
`236`	`236`	`"pickerMode":"Picker Mode",`
	`237`	`+"customTags":"Custom Tags"`
`237`	`238`	`},`
`238`	`239`	`"autoHeightProp":{`
`239`	`240`	`"auto":"Auto",`

Comments

(0)