@laerdal/life-react-components 1.8.0-dev.4 → 1.8.0-dev.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Dropdown/DropdownFilter.cjs +25 -15
- package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
- package/dist/Dropdown/DropdownFilter.js +24 -14
- package/dist/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/Tile/Tile.cjs +61 -0
- package/dist/Tile/Tile.cjs.map +1 -0
- package/dist/Tile/Tile.d.ts +4 -0
- package/dist/Tile/Tile.js +43 -0
- package/dist/Tile/Tile.js.map +1 -0
- package/dist/Tile/TileBody.cjs +37 -0
- package/dist/Tile/TileBody.cjs.map +1 -0
- package/dist/Tile/TileBody.d.ts +6 -0
- package/dist/Tile/TileBody.js +22 -0
- package/dist/Tile/TileBody.js.map +1 -0
- package/dist/Tile/TileCommonItems.cjs +165 -0
- package/dist/Tile/TileCommonItems.cjs.map +1 -0
- package/dist/Tile/TileCommonItems.d.ts +9 -0
- package/dist/Tile/TileCommonItems.js +126 -0
- package/dist/Tile/TileCommonItems.js.map +1 -0
- package/dist/Tile/TileFooter.cjs +48 -0
- package/dist/Tile/TileFooter.cjs.map +1 -0
- package/dist/Tile/TileFooter.d.ts +7 -0
- package/dist/Tile/TileFooter.js +32 -0
- package/dist/Tile/TileFooter.js.map +1 -0
- package/dist/Tile/TileHeader.cjs +90 -0
- package/dist/Tile/TileHeader.cjs.map +1 -0
- package/dist/Tile/TileHeader.d.ts +7 -0
- package/dist/Tile/TileHeader.js +68 -0
- package/dist/Tile/TileHeader.js.map +1 -0
- package/dist/Tile/TileTypes.cjs +6 -0
- package/dist/Tile/TileTypes.cjs.map +1 -0
- package/dist/Tile/TileTypes.d.ts +57 -0
- package/dist/Tile/TileTypes.js +2 -0
- package/dist/Tile/TileTypes.js.map +1 -0
- package/dist/Tile/index.cjs +33 -0
- package/dist/Tile/index.cjs.map +1 -0
- package/dist/Tile/index.d.ts +3 -0
- package/dist/Tile/index.js +4 -0
- package/dist/Tile/index.js.map +1 -0
- package/dist/index.cjs +14 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -67,7 +67,7 @@ var DropdownFilter = function DropdownFilter(_ref) {
|
|
|
67
67
|
isOpen = _React$useState2[0],
|
|
68
68
|
setIsOpen = _React$useState2[1];
|
|
69
69
|
|
|
70
|
-
var _React$useState3 = React.useState(
|
|
70
|
+
var _React$useState3 = React.useState(),
|
|
71
71
|
_React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
|
|
72
72
|
input = _React$useState4[0],
|
|
73
73
|
setInput = _React$useState4[1];
|
|
@@ -97,6 +97,11 @@ var DropdownFilter = function DropdownFilter(_ref) {
|
|
|
97
97
|
focused = _React$useState14[0],
|
|
98
98
|
setFocused = _React$useState14[1];
|
|
99
99
|
|
|
100
|
+
var _React$useState15 = React.useState(true),
|
|
101
|
+
_React$useState16 = (0, _slicedToArray2.default)(_React$useState15, 2),
|
|
102
|
+
init = _React$useState16[0],
|
|
103
|
+
setInit = _React$useState16[1];
|
|
104
|
+
|
|
100
105
|
var styledFieldRef = (0, _common.useFocusVisibleRef)();
|
|
101
106
|
var inputRef = (0, _common.useFocusVisibleRef)([styledFieldRef]);
|
|
102
107
|
var clearButtonRef = React.useRef(null);
|
|
@@ -122,35 +127,35 @@ var DropdownFilter = function DropdownFilter(_ref) {
|
|
|
122
127
|
};
|
|
123
128
|
|
|
124
129
|
React.useEffect(function () {
|
|
130
|
+
setInit(true);
|
|
125
131
|
setSelectedValues(!!value ? [value] : []);
|
|
126
132
|
}, [value]);
|
|
127
133
|
React.useEffect(function () {
|
|
128
134
|
if (selectedValues !== null && selectedValues !== void 0 && selectedValues.length) {
|
|
129
|
-
var
|
|
135
|
+
var _ref2, _item$displayLabel;
|
|
130
136
|
|
|
131
|
-
var val =
|
|
137
|
+
var val = selectedValues[0];
|
|
132
138
|
var item = list.find(function (a) {
|
|
133
139
|
return a.value === val;
|
|
134
140
|
});
|
|
135
141
|
setSelectedItem(item);
|
|
136
142
|
setInput((_ref2 = (_item$displayLabel = item === null || item === void 0 ? void 0 : item.displayLabel) !== null && _item$displayLabel !== void 0 ? _item$displayLabel : item === null || item === void 0 ? void 0 : item.value) !== null && _ref2 !== void 0 ? _ref2 : '');
|
|
143
|
+
onSelect && !init && onSelect(val);
|
|
137
144
|
} else {
|
|
138
145
|
setSelectedItem(undefined);
|
|
146
|
+
onSelect && !init && onSelect('');
|
|
139
147
|
setInput('');
|
|
140
148
|
}
|
|
141
149
|
}, [selectedValues]);
|
|
142
150
|
React.useEffect(function () {
|
|
143
|
-
if (!isOpen) {
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
} else if (!!selectedItem) {
|
|
148
|
-
var _ref3, _selectedItem$display;
|
|
149
|
-
|
|
150
|
-
setInput((_ref3 = (_selectedItem$display = selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.displayLabel) !== null && _selectedItem$display !== void 0 ? _selectedItem$display : selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.value) !== null && _ref3 !== void 0 ? _ref3 : '');
|
|
151
|
-
}
|
|
151
|
+
if (!isOpen && !!selectedItem) {
|
|
152
|
+
var _ref3, _selectedItem$display;
|
|
153
|
+
|
|
154
|
+
setInput((_ref3 = (_selectedItem$display = selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.displayLabel) !== null && _selectedItem$display !== void 0 ? _selectedItem$display : selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.value) !== null && _ref3 !== void 0 ? _ref3 : '');
|
|
152
155
|
}
|
|
153
|
-
|
|
156
|
+
|
|
157
|
+
setRestartFilter(true);
|
|
158
|
+
}, [isOpen, selectedItem]);
|
|
154
159
|
|
|
155
160
|
var handleInputClear = function handleInputClear(e) {
|
|
156
161
|
var _inputRef$current;
|
|
@@ -199,7 +204,11 @@ var DropdownFilter = function DropdownFilter(_ref) {
|
|
|
199
204
|
onKeyDown: handleInputKeyDown,
|
|
200
205
|
value: input,
|
|
201
206
|
onChange: function onChange(e) {
|
|
202
|
-
if (!
|
|
207
|
+
if (!e.target.value) {
|
|
208
|
+
setSelectedValues([]);
|
|
209
|
+
}
|
|
210
|
+
|
|
211
|
+
if (!locked && !disabled && e.target.value !== input) {
|
|
203
212
|
setRestartFilter(false);
|
|
204
213
|
setIsOpen(true);
|
|
205
214
|
setInput(e.target.value);
|
|
@@ -273,10 +282,11 @@ var DropdownFilter = function DropdownFilter(_ref) {
|
|
|
273
282
|
action: function action() {},
|
|
274
283
|
onValueUpdate: function onValueUpdate(values) {
|
|
275
284
|
setRestartFilter(true);
|
|
285
|
+
setInit(false);
|
|
276
286
|
},
|
|
277
287
|
items: list
|
|
278
288
|
},
|
|
279
|
-
filter: !disableFiltering && !restartFilter ? input : '',
|
|
289
|
+
filter: !disableFiltering && !restartFilter ? input || '' : '',
|
|
280
290
|
setIsOpen: setIsOpen,
|
|
281
291
|
alignLeft: false,
|
|
282
292
|
isButton: false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["DropdownFilter","id","list","placeholder","onSelect","onInputChange","value","required","messageOnNoResults","disabled","locked","scrollable","activeValidationMessage","autofilledMessage","size","disableFiltering","buttonFontSize","margin","loading","React","useState","isOpen","setIsOpen","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedItem","setSelectedItem","selectedValues","setSelectedValues","focused","setFocused","styledFieldRef","inputRef","clearButtonRef","useRef","containerRef","handleInputKeyDown","e","key","preventDefault","useEffect","length","val","item","find","a","displayLabel","undefined","handleInputClear","current","focus","focusVisible","detail","renderInput","stopPropagation","blur","defaultOnMouseDownHandler","Math","floor","random","target","marginLeft","Size","Small","COLORS","neutral_600","itemsType","multiSelect","action","onValueUpdate","values","items","warning_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {COLORS} from '../styles';\nimport {ArrowDropDown, ArrowDropUp, Information, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport {StyledField, Dropdown, InputField} from './CommonStyling';\nimport DropdownContent, {DropdownItem} from './DropdownContent';\nimport {Size} from '../types'\nimport {AutofilledMessage, WarningMessage} from '../InputFields/styling';\nimport {\n defaultOnMouseDownHandler,\n useActionWithin,\n useClickOutsideRef,\n useFocusOutsideRef,\n useFocusVisibleRef\n} from '../common';\nimport {IconButton} from '../Button';\nimport {SystemIcons} from '../icons';\n\ninterface DropdownFilterProps {\n id: string;\n list: DropdownItem[];\n placeholder?: string;\n\n value?: string;\n onSelect?: (value: string) => void;\n onInputChange?: (input: string) => void;\n\n required?: boolean;\n disabled?: boolean;\n locked?: boolean;\n\n disableFiltering?: boolean;\n\n messageOnNoResults?: string;\n activeValidationMessage?: string;\n autofilledMessage?: string;\n size?: Size.Small | Size.Medium;\n\n buttonFontSize?: string;\n margin?: string;\n scrollable?: boolean;\n\n loading?: boolean;\n}\n\nconst DropdownFilter = ({\n id,\n list,\n placeholder,\n onSelect,\n onInputChange,\n value,\n required,\n messageOnNoResults,\n disabled,\n locked,\n scrollable,\n activeValidationMessage,\n autofilledMessage,\n size,\n disableFiltering,\n buttonFontSize,\n margin = '4px 0',\n loading\n }: DropdownFilterProps) => {\n const [isOpen, setIsOpen] = React.useState<boolean>(false);\n const [input, setInput] = React.useState<string>(value ?? '');\n const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n const [selectedItem, setSelectedItem] = React.useState<DropdownItem>();\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n const [focused, setFocused] = React.useState<number | null>(null);\n\n const styledFieldRef = useFocusVisibleRef();\n const inputRef = useFocusVisibleRef([styledFieldRef]);\n const clearButtonRef = React.useRef<HTMLButtonElement>(null);\n\n useActionWithin(styledFieldRef, input && !locked && !disabled ? [clearButtonRef] : []);\n\n const containerRef = useClickOutsideRef(() => setIsOpen(false), [], useFocusOutsideRef(() => setIsOpen(false)));\n\n const handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Esc' || e.key === 'Escape') {\n e.preventDefault();\n }\n if (e.key === 'ArrowDown' || e.key === 'Down' || e.key === 'ArrowUp' || e.key === 'Up') {\n e.preventDefault();\n if (!isOpen) {\n setIsOpen(true);\n }\n }\n };\n\n React.useEffect(() => {\n setSelectedValues(!!value ? [value] : []);\n }, [value]);\n\n React.useEffect(() => {\n if (selectedValues?.length) {\n const val = selectedValues[0] ?? '';\n const item = list.find(a => a.value === val);\n setSelectedItem(item);\n setInput(item?.displayLabel ?? item?.value ?? '');\n } else {\n setSelectedItem(undefined);\n setInput('');\n }\n }, [selectedValues])\n\n React.useEffect(() => {\n if (!isOpen) {\n if (!input) {\n setSelectedValues([]);\n setPlaceholderSearch(placeholder || '');\n } else if (!!selectedItem) {\n setInput(selectedItem?.displayLabel ?? selectedItem?.value ?? '');\n }\n }\n }, [isOpen]);\n\n const handleInputClear = (e: any) => {\n setInput('');\n setSelectedValues([]);\n onSelect && onSelect('');\n inputRef.current?.focus({focusVisible: e?.detail !== 1} as any)\n };\n\n const renderInput = () => {\n return (\n <StyledField\n ref={styledFieldRef}\n className={size ? size : ''}\n onClick={(e: any) => {\n if (!locked && !disabled) {\n e.stopPropagation();\n setIsOpen(!isOpen);\n if (isOpen) {\n inputRef.current?.blur();\n } else {\n inputRef.current?.focus();\n }\n }\n }}\n disabled={disabled || false}\n locked={locked || false}\n isPlaceholder={!input}\n fontSize={buttonFontSize}\n showValidationMessage={!!activeValidationMessage}\n onMouseDown={defaultOnMouseDownHandler}\n data-testid={`otherdiv_${id}`}>\n <InputField\n id={id}\n ref={inputRef}\n autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n type=\"search\"\n placeholder={placeholderSearch}\n onKeyDown={handleInputKeyDown}\n value={input}\n onChange={(e: any) => {\n if (!locked && !disabled) {\n setRestartFilter(false);\n setIsOpen(true);\n setInput(e.target.value);\n if (onInputChange) {\n onInputChange(e.target.value || '');\n }\n }\n }}\n onFocus={() => setPlaceholderSearch('')}\n onBlur={() => setPlaceholderSearch(placeholder || '')}\n required={required}\n tabIndex={disabled || locked ? -1 : 0}\n disabled={disabled || false}\n />\n {\n input && !locked && !disabled && !loading &&\n <IconButton action={handleInputClear}\n ref={clearButtonRef}\n useTransparentBackground={true}\n shape={'circular'}\n style={{marginLeft: '-4px'}}\n variant={'secondary'}>\n <SystemIcons.Clear/>\n </IconButton>\n }\n\n {\n !disabled && !locked && loading &&\n <div style={{marginLeft: '-4xp'}}>\n <LoadingIndicator size={Size.Small} color={COLORS.neutral_600}/>\n </div>\n }\n\n <div className={'dropdown-arrow'}>\n {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''}/> :\n <ArrowDropDown size=\"24px\" className={size ? size : ''}/>}\n </div>\n </StyledField>\n );\n };\n\n return (\n <>\n <Dropdown ref={containerRef}\n disabled={disabled}\n isButton={false}\n locked={locked}\n className={size ? size : ''}\n margin={margin}>\n {renderInput()}\n {!locked && !disabled && (\n <DropdownContent\n isOpen={isOpen && !loading}\n messageOnNoResults={messageOnNoResults ?? ''}\n selectedValues={selectedValues}\n setSelectedValues={setSelectedValues}\n size={size ?? Size.Small}\n focused={focused}\n setFocused={setFocused}\n outline={false}\n customizationProps={{\n itemsType: 'normal',\n scrollable: scrollable,\n multiSelect: false,\n action: () => {\n },\n onValueUpdate: (values: string[]) => {\n setRestartFilter(true);\n },\n items: list,\n }}\n filter={!disableFiltering && !restartFilter ? input : ''}\n setIsOpen={setIsOpen}\n alignLeft={false}\n isButton={false}\n id={`${id}_dropdowncontent`}/>\n )}\n </Dropdown>\n {activeValidationMessage && (\n <WarningMessage className={size || ''}>\n <TechnicalWarning size=\"20px\" color={COLORS.warning_400}/>\n <span>{activeValidationMessage}</span>\n </WarningMessage>\n )}\n {autofilledMessage && (\n <AutofilledMessage className={size || ''}>\n <Information size=\"20px\" color={COLORS.neutral_600}/>\n <span>{autofilledMessage}</span>\n </AutofilledMessage>\n )}\n </>\n );\n};\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.cjs"}
|
|
1
|
+
{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["DropdownFilter","id","list","placeholder","onSelect","onInputChange","value","required","messageOnNoResults","disabled","locked","scrollable","activeValidationMessage","autofilledMessage","size","disableFiltering","buttonFontSize","margin","loading","React","useState","isOpen","setIsOpen","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedItem","setSelectedItem","selectedValues","setSelectedValues","focused","setFocused","init","setInit","styledFieldRef","inputRef","clearButtonRef","useRef","containerRef","handleInputKeyDown","e","key","preventDefault","useEffect","length","val","item","find","a","displayLabel","undefined","handleInputClear","current","focus","focusVisible","detail","renderInput","stopPropagation","blur","defaultOnMouseDownHandler","Math","floor","random","target","marginLeft","Size","Small","COLORS","neutral_600","itemsType","multiSelect","action","onValueUpdate","values","items","warning_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {COLORS} from '../styles';\nimport {ArrowDropDown, ArrowDropUp, Information, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport {StyledField, Dropdown, InputField} from './CommonStyling';\nimport DropdownContent, {DropdownItem} from './DropdownContent';\nimport {Size} from '../types'\nimport {AutofilledMessage, WarningMessage} from '../InputFields/styling';\nimport {\n defaultOnMouseDownHandler,\n useActionWithin,\n useClickOutsideRef,\n useFocusOutsideRef,\n useFocusVisibleRef\n} from '../common';\nimport {IconButton} from '../Button';\nimport {SystemIcons} from '../icons';\n\ninterface DropdownFilterProps {\n id: string;\n list: DropdownItem[];\n placeholder?: string;\n\n value?: string;\n onSelect?: (value: string) => void;\n onInputChange?: (input: string) => void;\n\n required?: boolean;\n disabled?: boolean;\n locked?: boolean;\n\n disableFiltering?: boolean;\n\n messageOnNoResults?: string;\n activeValidationMessage?: string;\n autofilledMessage?: string;\n size?: Size.Small | Size.Medium;\n\n buttonFontSize?: string;\n margin?: string;\n scrollable?: boolean;\n\n loading?: boolean;\n}\n\nconst DropdownFilter = ({\n id,\n list,\n placeholder,\n onSelect,\n onInputChange,\n value,\n required,\n messageOnNoResults,\n disabled,\n locked,\n scrollable,\n activeValidationMessage,\n autofilledMessage,\n size,\n disableFiltering,\n buttonFontSize,\n margin = '4px 0',\n loading\n }: DropdownFilterProps) => {\n const [isOpen, setIsOpen] = React.useState<boolean>(false);\n const [input, setInput] = React.useState<string>();\n const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n const [selectedItem, setSelectedItem] = React.useState<DropdownItem>();\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n const [focused, setFocused] = React.useState<number | null>(null);\n const [init, setInit] = React.useState<boolean>(true);\n\n const styledFieldRef = useFocusVisibleRef();\n const inputRef = useFocusVisibleRef([styledFieldRef]);\n const clearButtonRef = React.useRef<HTMLButtonElement>(null);\n\n useActionWithin(styledFieldRef, input && !locked && !disabled ? [clearButtonRef] : []);\n\n const containerRef = useClickOutsideRef(() => setIsOpen(false), [], useFocusOutsideRef(() => setIsOpen(false)));\n\n const handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Esc' || e.key === 'Escape') {\n e.preventDefault();\n }\n if (e.key === 'ArrowDown' || e.key === 'Down' || e.key === 'ArrowUp' || e.key === 'Up') {\n e.preventDefault();\n if (!isOpen) {\n setIsOpen(true);\n }\n }\n };\n\n React.useEffect(() => {\n setInit(true);\n setSelectedValues(!!value ? [value] : []);\n }, [value]);\n\n React.useEffect(() => {\n if (selectedValues?.length) {\n const val = selectedValues[0];\n const item = list.find(a => a.value === val);\n setSelectedItem(item);\n setInput(item?.displayLabel ?? item?.value ?? '');\n onSelect && !init && onSelect(val);\n } else {\n setSelectedItem(undefined);\n onSelect && !init && onSelect('');\n setInput('');\n }\n }, [selectedValues])\n\n React.useEffect(() => {\n if (!isOpen && !!selectedItem) {\n setInput(selectedItem?.displayLabel ?? selectedItem?.value ?? '');\n }\n\n setRestartFilter(true);\n }, [isOpen, selectedItem]);\n\n const handleInputClear = (e: any) => {\n setInput('');\n setSelectedValues([]);\n onSelect && onSelect('');\n inputRef.current?.focus({focusVisible: e?.detail !== 1} as any)\n };\n\n const renderInput = () => {\n return (\n <StyledField\n ref={styledFieldRef}\n className={size ? size : ''}\n onClick={(e: any) => {\n if (!locked && !disabled) {\n e.stopPropagation();\n setIsOpen(!isOpen);\n if (isOpen) {\n inputRef.current?.blur();\n } else {\n inputRef.current?.focus();\n }\n }\n }}\n disabled={disabled || false}\n locked={locked || false}\n isPlaceholder={!input}\n fontSize={buttonFontSize}\n showValidationMessage={!!activeValidationMessage}\n onMouseDown={defaultOnMouseDownHandler}\n data-testid={`otherdiv_${id}`}>\n <InputField\n id={id}\n ref={inputRef}\n autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n type=\"search\"\n placeholder={placeholderSearch}\n onKeyDown={handleInputKeyDown}\n value={input}\n onChange={(e: any) => {\n if (!e.target.value) {\n setSelectedValues([])\n }\n if (!locked && !disabled && e.target.value !== input) {\n setRestartFilter(false);\n setIsOpen(true);\n setInput(e.target.value);\n if (onInputChange) {\n onInputChange(e.target.value || '');\n }\n }\n }}\n onFocus={() => setPlaceholderSearch('')}\n onBlur={() => setPlaceholderSearch(placeholder || '')}\n required={required}\n tabIndex={disabled || locked ? -1 : 0}\n disabled={disabled || false}\n />\n {\n input && !locked && !disabled && !loading &&\n <IconButton action={handleInputClear}\n ref={clearButtonRef}\n useTransparentBackground={true}\n shape={'circular'}\n style={{marginLeft: '-4px'}}\n variant={'secondary'}>\n <SystemIcons.Clear/>\n </IconButton>\n }\n\n {\n !disabled && !locked && loading &&\n <div style={{marginLeft: '-4xp'}}>\n <LoadingIndicator size={Size.Small} color={COLORS.neutral_600}/>\n </div>\n }\n\n <div className={'dropdown-arrow'}>\n {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''}/> :\n <ArrowDropDown size=\"24px\" className={size ? size : ''}/>}\n </div>\n </StyledField>\n );\n };\n\n return (\n <>\n <Dropdown ref={containerRef}\n disabled={disabled}\n isButton={false}\n locked={locked}\n className={size ? size : ''}\n margin={margin}>\n {renderInput()}\n {!locked && !disabled && (\n <DropdownContent\n isOpen={isOpen && !loading}\n messageOnNoResults={messageOnNoResults ?? ''}\n selectedValues={selectedValues}\n setSelectedValues={setSelectedValues}\n size={size ?? Size.Small}\n focused={focused}\n setFocused={setFocused}\n outline={false}\n customizationProps={{\n itemsType: 'normal',\n scrollable: scrollable,\n multiSelect: false,\n action: () => {\n },\n onValueUpdate: (values: string[]) => {\n setRestartFilter(true);\n setInit(false);\n },\n items: list,\n }}\n filter={!disableFiltering && !restartFilter ? input || '' : ''}\n setIsOpen={setIsOpen}\n alignLeft={false}\n isButton={false}\n id={`${id}_dropdowncontent`}/>\n )}\n </Dropdown>\n {activeValidationMessage && (\n <WarningMessage className={size || ''}>\n <TechnicalWarning size=\"20px\" color={COLORS.warning_400}/>\n <span>{activeValidationMessage}</span>\n </WarningMessage>\n )}\n {autofilledMessage && (\n <AutofilledMessage className={size || ''}>\n <Information size=\"20px\" color={COLORS.neutral_600}/>\n <span>{autofilledMessage}</span>\n </AutofilledMessage>\n )}\n </>\n );\n};\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.cjs"}
|
|
@@ -41,7 +41,7 @@ var DropdownFilter = function DropdownFilter(_ref) {
|
|
|
41
41
|
isOpen = _React$useState2[0],
|
|
42
42
|
setIsOpen = _React$useState2[1];
|
|
43
43
|
|
|
44
|
-
var _React$useState3 = React.useState(
|
|
44
|
+
var _React$useState3 = React.useState(),
|
|
45
45
|
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
|
46
46
|
input = _React$useState4[0],
|
|
47
47
|
setInput = _React$useState4[1];
|
|
@@ -71,6 +71,11 @@ var DropdownFilter = function DropdownFilter(_ref) {
|
|
|
71
71
|
focused = _React$useState14[0],
|
|
72
72
|
setFocused = _React$useState14[1];
|
|
73
73
|
|
|
74
|
+
var _React$useState15 = React.useState(true),
|
|
75
|
+
_React$useState16 = _slicedToArray(_React$useState15, 2),
|
|
76
|
+
init = _React$useState16[0],
|
|
77
|
+
setInit = _React$useState16[1];
|
|
78
|
+
|
|
74
79
|
var styledFieldRef = useFocusVisibleRef();
|
|
75
80
|
var inputRef = useFocusVisibleRef([styledFieldRef]);
|
|
76
81
|
var clearButtonRef = React.useRef(null);
|
|
@@ -96,35 +101,35 @@ var DropdownFilter = function DropdownFilter(_ref) {
|
|
|
96
101
|
};
|
|
97
102
|
|
|
98
103
|
React.useEffect(function () {
|
|
104
|
+
setInit(true);
|
|
99
105
|
setSelectedValues(!!value ? [value] : []);
|
|
100
106
|
}, [value]);
|
|
101
107
|
React.useEffect(function () {
|
|
102
108
|
if (selectedValues !== null && selectedValues !== void 0 && selectedValues.length) {
|
|
103
|
-
var
|
|
109
|
+
var _ref2, _item$displayLabel;
|
|
104
110
|
|
|
105
|
-
var val =
|
|
111
|
+
var val = selectedValues[0];
|
|
106
112
|
var item = list.find(function (a) {
|
|
107
113
|
return a.value === val;
|
|
108
114
|
});
|
|
109
115
|
setSelectedItem(item);
|
|
110
116
|
setInput((_ref2 = (_item$displayLabel = item === null || item === void 0 ? void 0 : item.displayLabel) !== null && _item$displayLabel !== void 0 ? _item$displayLabel : item === null || item === void 0 ? void 0 : item.value) !== null && _ref2 !== void 0 ? _ref2 : '');
|
|
117
|
+
onSelect && !init && onSelect(val);
|
|
111
118
|
} else {
|
|
112
119
|
setSelectedItem(undefined);
|
|
120
|
+
onSelect && !init && onSelect('');
|
|
113
121
|
setInput('');
|
|
114
122
|
}
|
|
115
123
|
}, [selectedValues]);
|
|
116
124
|
React.useEffect(function () {
|
|
117
|
-
if (!isOpen) {
|
|
118
|
-
|
|
119
|
-
setSelectedValues([]);
|
|
120
|
-
setPlaceholderSearch(placeholder || '');
|
|
121
|
-
} else if (!!selectedItem) {
|
|
122
|
-
var _ref3, _selectedItem$display;
|
|
125
|
+
if (!isOpen && !!selectedItem) {
|
|
126
|
+
var _ref3, _selectedItem$display;
|
|
123
127
|
|
|
124
|
-
|
|
125
|
-
}
|
|
128
|
+
setInput((_ref3 = (_selectedItem$display = selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.displayLabel) !== null && _selectedItem$display !== void 0 ? _selectedItem$display : selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.value) !== null && _ref3 !== void 0 ? _ref3 : '');
|
|
126
129
|
}
|
|
127
|
-
|
|
130
|
+
|
|
131
|
+
setRestartFilter(true);
|
|
132
|
+
}, [isOpen, selectedItem]);
|
|
128
133
|
|
|
129
134
|
var handleInputClear = function handleInputClear(e) {
|
|
130
135
|
var _inputRef$current;
|
|
@@ -173,7 +178,11 @@ var DropdownFilter = function DropdownFilter(_ref) {
|
|
|
173
178
|
onKeyDown: handleInputKeyDown,
|
|
174
179
|
value: input,
|
|
175
180
|
onChange: function onChange(e) {
|
|
176
|
-
if (!
|
|
181
|
+
if (!e.target.value) {
|
|
182
|
+
setSelectedValues([]);
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
if (!locked && !disabled && e.target.value !== input) {
|
|
177
186
|
setRestartFilter(false);
|
|
178
187
|
setIsOpen(true);
|
|
179
188
|
setInput(e.target.value);
|
|
@@ -247,10 +256,11 @@ var DropdownFilter = function DropdownFilter(_ref) {
|
|
|
247
256
|
action: function action() {},
|
|
248
257
|
onValueUpdate: function onValueUpdate(values) {
|
|
249
258
|
setRestartFilter(true);
|
|
259
|
+
setInit(false);
|
|
250
260
|
},
|
|
251
261
|
items: list
|
|
252
262
|
},
|
|
253
|
-
filter: !disableFiltering && !restartFilter ? input : '',
|
|
263
|
+
filter: !disableFiltering && !restartFilter ? input || '' : '',
|
|
254
264
|
setIsOpen: setIsOpen,
|
|
255
265
|
alignLeft: false,
|
|
256
266
|
isButton: false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["React","COLORS","ArrowDropDown","ArrowDropUp","Information","TechnicalWarning","LoadingIndicator","StyledField","Dropdown","InputField","DropdownContent","Size","AutofilledMessage","WarningMessage","defaultOnMouseDownHandler","useActionWithin","useClickOutsideRef","useFocusOutsideRef","useFocusVisibleRef","IconButton","SystemIcons","DropdownFilter","id","list","placeholder","onSelect","onInputChange","value","required","messageOnNoResults","disabled","locked","scrollable","activeValidationMessage","autofilledMessage","size","disableFiltering","buttonFontSize","margin","loading","useState","isOpen","setIsOpen","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedItem","setSelectedItem","selectedValues","setSelectedValues","focused","setFocused","styledFieldRef","inputRef","clearButtonRef","useRef","containerRef","handleInputKeyDown","e","key","preventDefault","useEffect","length","val","item","find","a","displayLabel","undefined","handleInputClear","current","focus","focusVisible","detail","renderInput","stopPropagation","blur","Math","floor","random","target","marginLeft","Small","neutral_600","itemsType","multiSelect","action","onValueUpdate","values","items","warning_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {COLORS} from '../styles';\nimport {ArrowDropDown, ArrowDropUp, Information, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport {StyledField, Dropdown, InputField} from './CommonStyling';\nimport DropdownContent, {DropdownItem} from './DropdownContent';\nimport {Size} from '../types'\nimport {AutofilledMessage, WarningMessage} from '../InputFields/styling';\nimport {\n defaultOnMouseDownHandler,\n useActionWithin,\n useClickOutsideRef,\n useFocusOutsideRef,\n useFocusVisibleRef\n} from '../common';\nimport {IconButton} from '../Button';\nimport {SystemIcons} from '../icons';\n\ninterface DropdownFilterProps {\n id: string;\n list: DropdownItem[];\n placeholder?: string;\n\n value?: string;\n onSelect?: (value: string) => void;\n onInputChange?: (input: string) => void;\n\n required?: boolean;\n disabled?: boolean;\n locked?: boolean;\n\n disableFiltering?: boolean;\n\n messageOnNoResults?: string;\n activeValidationMessage?: string;\n autofilledMessage?: string;\n size?: Size.Small | Size.Medium;\n\n buttonFontSize?: string;\n margin?: string;\n scrollable?: boolean;\n\n loading?: boolean;\n}\n\nconst DropdownFilter = ({\n id,\n list,\n placeholder,\n onSelect,\n onInputChange,\n value,\n required,\n messageOnNoResults,\n disabled,\n locked,\n scrollable,\n activeValidationMessage,\n autofilledMessage,\n size,\n disableFiltering,\n buttonFontSize,\n margin = '4px 0',\n loading\n }: DropdownFilterProps) => {\n const [isOpen, setIsOpen] = React.useState<boolean>(false);\n const [input, setInput] = React.useState<string>(value ?? '');\n const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n const [selectedItem, setSelectedItem] = React.useState<DropdownItem>();\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n const [focused, setFocused] = React.useState<number | null>(null);\n\n const styledFieldRef = useFocusVisibleRef();\n const inputRef = useFocusVisibleRef([styledFieldRef]);\n const clearButtonRef = React.useRef<HTMLButtonElement>(null);\n\n useActionWithin(styledFieldRef, input && !locked && !disabled ? [clearButtonRef] : []);\n\n const containerRef = useClickOutsideRef(() => setIsOpen(false), [], useFocusOutsideRef(() => setIsOpen(false)));\n\n const handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Esc' || e.key === 'Escape') {\n e.preventDefault();\n }\n if (e.key === 'ArrowDown' || e.key === 'Down' || e.key === 'ArrowUp' || e.key === 'Up') {\n e.preventDefault();\n if (!isOpen) {\n setIsOpen(true);\n }\n }\n };\n\n React.useEffect(() => {\n setSelectedValues(!!value ? [value] : []);\n }, [value]);\n\n React.useEffect(() => {\n if (selectedValues?.length) {\n const val = selectedValues[0] ?? '';\n const item = list.find(a => a.value === val);\n setSelectedItem(item);\n setInput(item?.displayLabel ?? item?.value ?? '');\n } else {\n setSelectedItem(undefined);\n setInput('');\n }\n }, [selectedValues])\n\n React.useEffect(() => {\n if (!isOpen) {\n if (!input) {\n setSelectedValues([]);\n setPlaceholderSearch(placeholder || '');\n } else if (!!selectedItem) {\n setInput(selectedItem?.displayLabel ?? selectedItem?.value ?? '');\n }\n }\n }, [isOpen]);\n\n const handleInputClear = (e: any) => {\n setInput('');\n setSelectedValues([]);\n onSelect && onSelect('');\n inputRef.current?.focus({focusVisible: e?.detail !== 1} as any)\n };\n\n const renderInput = () => {\n return (\n <StyledField\n ref={styledFieldRef}\n className={size ? size : ''}\n onClick={(e: any) => {\n if (!locked && !disabled) {\n e.stopPropagation();\n setIsOpen(!isOpen);\n if (isOpen) {\n inputRef.current?.blur();\n } else {\n inputRef.current?.focus();\n }\n }\n }}\n disabled={disabled || false}\n locked={locked || false}\n isPlaceholder={!input}\n fontSize={buttonFontSize}\n showValidationMessage={!!activeValidationMessage}\n onMouseDown={defaultOnMouseDownHandler}\n data-testid={`otherdiv_${id}`}>\n <InputField\n id={id}\n ref={inputRef}\n autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n type=\"search\"\n placeholder={placeholderSearch}\n onKeyDown={handleInputKeyDown}\n value={input}\n onChange={(e: any) => {\n if (!locked && !disabled) {\n setRestartFilter(false);\n setIsOpen(true);\n setInput(e.target.value);\n if (onInputChange) {\n onInputChange(e.target.value || '');\n }\n }\n }}\n onFocus={() => setPlaceholderSearch('')}\n onBlur={() => setPlaceholderSearch(placeholder || '')}\n required={required}\n tabIndex={disabled || locked ? -1 : 0}\n disabled={disabled || false}\n />\n {\n input && !locked && !disabled && !loading &&\n <IconButton action={handleInputClear}\n ref={clearButtonRef}\n useTransparentBackground={true}\n shape={'circular'}\n style={{marginLeft: '-4px'}}\n variant={'secondary'}>\n <SystemIcons.Clear/>\n </IconButton>\n }\n\n {\n !disabled && !locked && loading &&\n <div style={{marginLeft: '-4xp'}}>\n <LoadingIndicator size={Size.Small} color={COLORS.neutral_600}/>\n </div>\n }\n\n <div className={'dropdown-arrow'}>\n {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''}/> :\n <ArrowDropDown size=\"24px\" className={size ? size : ''}/>}\n </div>\n </StyledField>\n );\n };\n\n return (\n <>\n <Dropdown ref={containerRef}\n disabled={disabled}\n isButton={false}\n locked={locked}\n className={size ? size : ''}\n margin={margin}>\n {renderInput()}\n {!locked && !disabled && (\n <DropdownContent\n isOpen={isOpen && !loading}\n messageOnNoResults={messageOnNoResults ?? ''}\n selectedValues={selectedValues}\n setSelectedValues={setSelectedValues}\n size={size ?? Size.Small}\n focused={focused}\n setFocused={setFocused}\n outline={false}\n customizationProps={{\n itemsType: 'normal',\n scrollable: scrollable,\n multiSelect: false,\n action: () => {\n },\n onValueUpdate: (values: string[]) => {\n setRestartFilter(true);\n },\n items: list,\n }}\n filter={!disableFiltering && !restartFilter ? input : ''}\n setIsOpen={setIsOpen}\n alignLeft={false}\n isButton={false}\n id={`${id}_dropdowncontent`}/>\n )}\n </Dropdown>\n {activeValidationMessage && (\n <WarningMessage className={size || ''}>\n <TechnicalWarning size=\"20px\" color={COLORS.warning_400}/>\n <span>{activeValidationMessage}</span>\n </WarningMessage>\n )}\n {autofilledMessage && (\n <AutofilledMessage className={size || ''}>\n <Information size=\"20px\" color={COLORS.neutral_600}/>\n <span>{autofilledMessage}</span>\n </AutofilledMessage>\n )}\n </>\n );\n};\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.js"}
|
|
1
|
+
{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["React","COLORS","ArrowDropDown","ArrowDropUp","Information","TechnicalWarning","LoadingIndicator","StyledField","Dropdown","InputField","DropdownContent","Size","AutofilledMessage","WarningMessage","defaultOnMouseDownHandler","useActionWithin","useClickOutsideRef","useFocusOutsideRef","useFocusVisibleRef","IconButton","SystemIcons","DropdownFilter","id","list","placeholder","onSelect","onInputChange","value","required","messageOnNoResults","disabled","locked","scrollable","activeValidationMessage","autofilledMessage","size","disableFiltering","buttonFontSize","margin","loading","useState","isOpen","setIsOpen","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedItem","setSelectedItem","selectedValues","setSelectedValues","focused","setFocused","init","setInit","styledFieldRef","inputRef","clearButtonRef","useRef","containerRef","handleInputKeyDown","e","key","preventDefault","useEffect","length","val","item","find","a","displayLabel","undefined","handleInputClear","current","focus","focusVisible","detail","renderInput","stopPropagation","blur","Math","floor","random","target","marginLeft","Small","neutral_600","itemsType","multiSelect","action","onValueUpdate","values","items","warning_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {COLORS} from '../styles';\nimport {ArrowDropDown, ArrowDropUp, Information, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport {StyledField, Dropdown, InputField} from './CommonStyling';\nimport DropdownContent, {DropdownItem} from './DropdownContent';\nimport {Size} from '../types'\nimport {AutofilledMessage, WarningMessage} from '../InputFields/styling';\nimport {\n defaultOnMouseDownHandler,\n useActionWithin,\n useClickOutsideRef,\n useFocusOutsideRef,\n useFocusVisibleRef\n} from '../common';\nimport {IconButton} from '../Button';\nimport {SystemIcons} from '../icons';\n\ninterface DropdownFilterProps {\n id: string;\n list: DropdownItem[];\n placeholder?: string;\n\n value?: string;\n onSelect?: (value: string) => void;\n onInputChange?: (input: string) => void;\n\n required?: boolean;\n disabled?: boolean;\n locked?: boolean;\n\n disableFiltering?: boolean;\n\n messageOnNoResults?: string;\n activeValidationMessage?: string;\n autofilledMessage?: string;\n size?: Size.Small | Size.Medium;\n\n buttonFontSize?: string;\n margin?: string;\n scrollable?: boolean;\n\n loading?: boolean;\n}\n\nconst DropdownFilter = ({\n id,\n list,\n placeholder,\n onSelect,\n onInputChange,\n value,\n required,\n messageOnNoResults,\n disabled,\n locked,\n scrollable,\n activeValidationMessage,\n autofilledMessage,\n size,\n disableFiltering,\n buttonFontSize,\n margin = '4px 0',\n loading\n }: DropdownFilterProps) => {\n const [isOpen, setIsOpen] = React.useState<boolean>(false);\n const [input, setInput] = React.useState<string>();\n const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n const [selectedItem, setSelectedItem] = React.useState<DropdownItem>();\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n const [focused, setFocused] = React.useState<number | null>(null);\n const [init, setInit] = React.useState<boolean>(true);\n\n const styledFieldRef = useFocusVisibleRef();\n const inputRef = useFocusVisibleRef([styledFieldRef]);\n const clearButtonRef = React.useRef<HTMLButtonElement>(null);\n\n useActionWithin(styledFieldRef, input && !locked && !disabled ? [clearButtonRef] : []);\n\n const containerRef = useClickOutsideRef(() => setIsOpen(false), [], useFocusOutsideRef(() => setIsOpen(false)));\n\n const handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Esc' || e.key === 'Escape') {\n e.preventDefault();\n }\n if (e.key === 'ArrowDown' || e.key === 'Down' || e.key === 'ArrowUp' || e.key === 'Up') {\n e.preventDefault();\n if (!isOpen) {\n setIsOpen(true);\n }\n }\n };\n\n React.useEffect(() => {\n setInit(true);\n setSelectedValues(!!value ? [value] : []);\n }, [value]);\n\n React.useEffect(() => {\n if (selectedValues?.length) {\n const val = selectedValues[0];\n const item = list.find(a => a.value === val);\n setSelectedItem(item);\n setInput(item?.displayLabel ?? item?.value ?? '');\n onSelect && !init && onSelect(val);\n } else {\n setSelectedItem(undefined);\n onSelect && !init && onSelect('');\n setInput('');\n }\n }, [selectedValues])\n\n React.useEffect(() => {\n if (!isOpen && !!selectedItem) {\n setInput(selectedItem?.displayLabel ?? selectedItem?.value ?? '');\n }\n\n setRestartFilter(true);\n }, [isOpen, selectedItem]);\n\n const handleInputClear = (e: any) => {\n setInput('');\n setSelectedValues([]);\n onSelect && onSelect('');\n inputRef.current?.focus({focusVisible: e?.detail !== 1} as any)\n };\n\n const renderInput = () => {\n return (\n <StyledField\n ref={styledFieldRef}\n className={size ? size : ''}\n onClick={(e: any) => {\n if (!locked && !disabled) {\n e.stopPropagation();\n setIsOpen(!isOpen);\n if (isOpen) {\n inputRef.current?.blur();\n } else {\n inputRef.current?.focus();\n }\n }\n }}\n disabled={disabled || false}\n locked={locked || false}\n isPlaceholder={!input}\n fontSize={buttonFontSize}\n showValidationMessage={!!activeValidationMessage}\n onMouseDown={defaultOnMouseDownHandler}\n data-testid={`otherdiv_${id}`}>\n <InputField\n id={id}\n ref={inputRef}\n autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n type=\"search\"\n placeholder={placeholderSearch}\n onKeyDown={handleInputKeyDown}\n value={input}\n onChange={(e: any) => {\n if (!e.target.value) {\n setSelectedValues([])\n }\n if (!locked && !disabled && e.target.value !== input) {\n setRestartFilter(false);\n setIsOpen(true);\n setInput(e.target.value);\n if (onInputChange) {\n onInputChange(e.target.value || '');\n }\n }\n }}\n onFocus={() => setPlaceholderSearch('')}\n onBlur={() => setPlaceholderSearch(placeholder || '')}\n required={required}\n tabIndex={disabled || locked ? -1 : 0}\n disabled={disabled || false}\n />\n {\n input && !locked && !disabled && !loading &&\n <IconButton action={handleInputClear}\n ref={clearButtonRef}\n useTransparentBackground={true}\n shape={'circular'}\n style={{marginLeft: '-4px'}}\n variant={'secondary'}>\n <SystemIcons.Clear/>\n </IconButton>\n }\n\n {\n !disabled && !locked && loading &&\n <div style={{marginLeft: '-4xp'}}>\n <LoadingIndicator size={Size.Small} color={COLORS.neutral_600}/>\n </div>\n }\n\n <div className={'dropdown-arrow'}>\n {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''}/> :\n <ArrowDropDown size=\"24px\" className={size ? size : ''}/>}\n </div>\n </StyledField>\n );\n };\n\n return (\n <>\n <Dropdown ref={containerRef}\n disabled={disabled}\n isButton={false}\n locked={locked}\n className={size ? size : ''}\n margin={margin}>\n {renderInput()}\n {!locked && !disabled && (\n <DropdownContent\n isOpen={isOpen && !loading}\n messageOnNoResults={messageOnNoResults ?? ''}\n selectedValues={selectedValues}\n setSelectedValues={setSelectedValues}\n size={size ?? Size.Small}\n focused={focused}\n setFocused={setFocused}\n outline={false}\n customizationProps={{\n itemsType: 'normal',\n scrollable: scrollable,\n multiSelect: false,\n action: () => {\n },\n onValueUpdate: (values: string[]) => {\n setRestartFilter(true);\n setInit(false);\n },\n items: list,\n }}\n filter={!disableFiltering && !restartFilter ? input || '' : ''}\n setIsOpen={setIsOpen}\n alignLeft={false}\n isButton={false}\n id={`${id}_dropdowncontent`}/>\n )}\n </Dropdown>\n {activeValidationMessage && (\n <WarningMessage className={size || ''}>\n <TechnicalWarning size=\"20px\" color={COLORS.warning_400}/>\n <span>{activeValidationMessage}</span>\n </WarningMessage>\n )}\n {autofilledMessage && (\n <AutofilledMessage className={size || ''}>\n <Information size=\"20px\" color={COLORS.neutral_600}/>\n <span>{autofilledMessage}</span>\n </AutofilledMessage>\n )}\n </>\n );\n};\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.js"}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
|
|
10
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
+
|
|
12
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
13
|
+
|
|
14
|
+
var _react = _interopRequireDefault(require("react"));
|
|
15
|
+
|
|
16
|
+
var _types = require("../types");
|
|
17
|
+
|
|
18
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
19
|
+
|
|
20
|
+
var _TileHeader = _interopRequireDefault(require("./TileHeader"));
|
|
21
|
+
|
|
22
|
+
var _TileFooter = _interopRequireDefault(require("./TileFooter"));
|
|
23
|
+
|
|
24
|
+
var _TileBody = _interopRequireDefault(require("./TileBody"));
|
|
25
|
+
|
|
26
|
+
var _styles = require("../styles");
|
|
27
|
+
|
|
28
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
29
|
+
|
|
30
|
+
var _templateObject;
|
|
31
|
+
|
|
32
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
33
|
+
|
|
34
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
35
|
+
|
|
36
|
+
var Wrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n display: flex;\n flex-flow: column;\n flex-direction: column;\n background: ", ";\n border-radius: 8px;\n border: 1px solid ", ";\n box-sizing: border-box;\n"])), _styles.COLORS.white, _styles.COLORS.neutral_200);
|
|
37
|
+
|
|
38
|
+
var Tile = function Tile(_ref) {
|
|
39
|
+
var header = _ref.header,
|
|
40
|
+
footer = _ref.footer,
|
|
41
|
+
_ref$size = _ref.size,
|
|
42
|
+
size = _ref$size === void 0 ? _types.Size.Medium : _ref$size,
|
|
43
|
+
style = _ref.style,
|
|
44
|
+
children = _ref.children;
|
|
45
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Wrapper, {
|
|
46
|
+
style: style,
|
|
47
|
+
className: size,
|
|
48
|
+
children: [header && /*#__PURE__*/(0, _jsxRuntime.jsx)(_TileHeader.default, _objectSpread(_objectSpread({}, header), {}, {
|
|
49
|
+
size: size
|
|
50
|
+
})), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TileBody.default, {
|
|
51
|
+
size: size,
|
|
52
|
+
children: children
|
|
53
|
+
}), footer && /*#__PURE__*/(0, _jsxRuntime.jsx)(_TileFooter.default, _objectSpread(_objectSpread({}, footer), {}, {
|
|
54
|
+
size: size
|
|
55
|
+
}))]
|
|
56
|
+
});
|
|
57
|
+
};
|
|
58
|
+
|
|
59
|
+
var _default = Tile;
|
|
60
|
+
exports.default = _default;
|
|
61
|
+
//# sourceMappingURL=Tile.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Tile/Tile.tsx"],"names":["Wrapper","styled","div","COLORS","white","neutral_200","Tile","header","footer","size","Size","Medium","style","children"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,OAAO,GAAGC,0BAAOC,GAAV,4RAMGC,eAAOC,KANV,EAQSD,eAAOE,WARhB,CAAb;;AAYA,IAAMC,IAAwC,GAAG,SAA3CA,IAA2C,OAMO;AAAA,MALJC,MAKI,QALJA,MAKI;AAAA,MAJJC,MAII,QAJJA,MAII;AAAA,uBAHJC,IAGI;AAAA,MAHJA,IAGI,0BAHGC,YAAKC,MAGR;AAAA,MAFJC,KAEI,QAFJA,KAEI;AAAA,MADJC,QACI,QADJA,QACI;AAEtD,sBACE,sBAAC,OAAD;AAAS,IAAA,KAAK,EAAED,KAAhB;AACS,IAAA,SAAS,EAAEH,IADpB;AAAA,eAEGF,MAAM,iBAAI,qBAAC,mBAAD,kCAAgBA,MAAhB;AAAwB,MAAA,IAAI,EAAEE;AAA9B,OAFb,eAGE,qBAAC,iBAAD;AAAU,MAAA,IAAI,EAAEA,IAAhB;AAAA,gBACGI;AADH,MAHF,EAMGL,MAAM,iBAAI,qBAAC,mBAAD,kCAAgBA,MAAhB;AAAwB,MAAA,IAAI,EAAEC;AAA9B,OANb;AAAA,IADF;AAUD,CAlBD;;eAqBeH,I","sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport {TileProps} from './TileTypes';\nimport styled from 'styled-components';\nimport TileHeader from './TileHeader';\nimport TileFooter from './TileFooter';\nimport TileBody from './TileBody';\nimport {COLORS} from '../styles';\n\nconst Wrapper = styled.div`\n width: 100%;\n height: 100%;\n display: flex;\n flex-flow: column;\n flex-direction: column;\n background: ${COLORS.white};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n box-sizing: border-box;\n`;\n\nconst Tile: React.FunctionComponent<TileProps> = ({\n header,\n footer,\n size = Size.Medium,\n style,\n children\n }) => {\n\n return (\n <Wrapper style={style}\n className={size}>\n {header && <TileHeader {...header} size={size}/>}\n <TileBody size={size}>\n {children}\n </TileBody>\n {footer && <TileFooter {...footer} size={size}/>}\n </Wrapper>\n )\n}\n\n\nexport default Tile;\n"],"file":"Tile.cjs"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
+
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
3
|
+
|
|
4
|
+
var _templateObject;
|
|
5
|
+
|
|
6
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
7
|
+
|
|
8
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
9
|
+
|
|
10
|
+
import React from 'react';
|
|
11
|
+
import { Size } from '../types';
|
|
12
|
+
import styled from 'styled-components';
|
|
13
|
+
import TileHeader from './TileHeader';
|
|
14
|
+
import TileFooter from './TileFooter';
|
|
15
|
+
import TileBody from './TileBody';
|
|
16
|
+
import { COLORS } from '../styles';
|
|
17
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
18
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
19
|
+
var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: 100%;\n height: 100%;\n display: flex;\n flex-flow: column;\n flex-direction: column;\n background: ", ";\n border-radius: 8px;\n border: 1px solid ", ";\n box-sizing: border-box;\n"])), COLORS.white, COLORS.neutral_200);
|
|
20
|
+
|
|
21
|
+
var Tile = function Tile(_ref) {
|
|
22
|
+
var header = _ref.header,
|
|
23
|
+
footer = _ref.footer,
|
|
24
|
+
_ref$size = _ref.size,
|
|
25
|
+
size = _ref$size === void 0 ? Size.Medium : _ref$size,
|
|
26
|
+
style = _ref.style,
|
|
27
|
+
children = _ref.children;
|
|
28
|
+
return /*#__PURE__*/_jsxs(Wrapper, {
|
|
29
|
+
style: style,
|
|
30
|
+
className: size,
|
|
31
|
+
children: [header && /*#__PURE__*/_jsx(TileHeader, _objectSpread(_objectSpread({}, header), {}, {
|
|
32
|
+
size: size
|
|
33
|
+
})), /*#__PURE__*/_jsx(TileBody, {
|
|
34
|
+
size: size,
|
|
35
|
+
children: children
|
|
36
|
+
}), footer && /*#__PURE__*/_jsx(TileFooter, _objectSpread(_objectSpread({}, footer), {}, {
|
|
37
|
+
size: size
|
|
38
|
+
}))]
|
|
39
|
+
});
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
export default Tile;
|
|
43
|
+
//# sourceMappingURL=Tile.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Tile/Tile.tsx"],"names":["React","Size","styled","TileHeader","TileFooter","TileBody","COLORS","Wrapper","div","white","neutral_200","Tile","header","footer","size","Medium","style","children"],"mappings":";;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAQC,IAAR,QAAmB,UAAnB;AAEA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,OAAOC,UAAP,MAAuB,cAAvB;AACA,OAAOC,UAAP,MAAuB,cAAvB;AACA,OAAOC,QAAP,MAAqB,YAArB;AACA,SAAQC,MAAR,QAAqB,WAArB;;;AAEA,IAAMC,OAAO,GAAGL,MAAM,CAACM,GAAV,8QAMGF,MAAM,CAACG,KANV,EAQSH,MAAM,CAACI,WARhB,CAAb;;AAYA,IAAMC,IAAwC,GAAG,SAA3CA,IAA2C,OAMO;AAAA,MALJC,MAKI,QALJA,MAKI;AAAA,MAJJC,MAII,QAJJA,MAII;AAAA,uBAHJC,IAGI;AAAA,MAHJA,IAGI,0BAHGb,IAAI,CAACc,MAGR;AAAA,MAFJC,KAEI,QAFJA,KAEI;AAAA,MADJC,QACI,QADJA,QACI;AAEtD,sBACE,MAAC,OAAD;AAAS,IAAA,KAAK,EAAED,KAAhB;AACS,IAAA,SAAS,EAAEF,IADpB;AAAA,eAEGF,MAAM,iBAAI,KAAC,UAAD,kCAAgBA,MAAhB;AAAwB,MAAA,IAAI,EAAEE;AAA9B,OAFb,eAGE,KAAC,QAAD;AAAU,MAAA,IAAI,EAAEA,IAAhB;AAAA,gBACGG;AADH,MAHF,EAMGJ,MAAM,iBAAI,KAAC,UAAD,kCAAgBA,MAAhB;AAAwB,MAAA,IAAI,EAAEC;AAA9B,OANb;AAAA,IADF;AAUD,CAlBD;;AAqBA,eAAeH,IAAf","sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport {TileProps} from './TileTypes';\nimport styled from 'styled-components';\nimport TileHeader from './TileHeader';\nimport TileFooter from './TileFooter';\nimport TileBody from './TileBody';\nimport {COLORS} from '../styles';\n\nconst Wrapper = styled.div`\n width: 100%;\n height: 100%;\n display: flex;\n flex-flow: column;\n flex-direction: column;\n background: ${COLORS.white};\n border-radius: 8px;\n border: 1px solid ${COLORS.neutral_200};\n box-sizing: border-box;\n`;\n\nconst Tile: React.FunctionComponent<TileProps> = ({\n header,\n footer,\n size = Size.Medium,\n style,\n children\n }) => {\n\n return (\n <Wrapper style={style}\n className={size}>\n {header && <TileHeader {...header} size={size}/>}\n <TileBody size={size}>\n {children}\n </TileBody>\n {footer && <TileFooter {...footer} size={size}/>}\n </Wrapper>\n )\n}\n\n\nexport default Tile;\n"],"file":"Tile.js"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
|
|
10
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
11
|
+
|
|
12
|
+
var _react = _interopRequireDefault(require("react"));
|
|
13
|
+
|
|
14
|
+
var _types = require("../types");
|
|
15
|
+
|
|
16
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
17
|
+
|
|
18
|
+
var _styles = require("../styles");
|
|
19
|
+
|
|
20
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
21
|
+
|
|
22
|
+
var _templateObject;
|
|
23
|
+
|
|
24
|
+
var Wrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n flex: 1;\n margin: 8px 6px 8px 4px;\n overflow: auto;\n box-sizing: border-box;\n\n &.small {\n padding-right: 10px;\n padding-left: 12px;\n }\n\n &.medium {\n padding-right: 14px;\n padding-left: 16px;\n }\n\n &.large {\n padding-right: 18px;\n padding-left: 20px;\n }\n\n ", "\n"])), (0, _styles.scrollBarStyling)(_types.Size.Small));
|
|
25
|
+
|
|
26
|
+
var TileBody = function TileBody(_ref) {
|
|
27
|
+
var children = _ref.children,
|
|
28
|
+
size = _ref.size;
|
|
29
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Wrapper, {
|
|
30
|
+
className: size,
|
|
31
|
+
children: children
|
|
32
|
+
});
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
var _default = TileBody;
|
|
36
|
+
exports.default = _default;
|
|
37
|
+
//# sourceMappingURL=TileBody.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Tile/TileBody.tsx"],"names":["Wrapper","styled","div","Size","Small","TileBody","children","size"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,OAAO,GAAGC,0BAAOC,GAAV,4YAqBT,8BAAiBC,YAAKC,KAAtB,CArBS,CAAb;;AAwBA,IAAMC,QAAiD,GAAG,SAApDA,QAAoD,OAAsB;AAAA,MAApBC,QAAoB,QAApBA,QAAoB;AAAA,MAAVC,IAAU,QAAVA,IAAU;AAG9E,sBACE,qBAAC,OAAD;AAAS,IAAA,SAAS,EAAEA,IAApB;AAAA,cACGD;AADH,IADF;AAKD,CARD;;eAWeD,Q","sourcesContent":["import React from 'react'\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {scrollBarStyling} from '../styles';\n\nconst Wrapper = styled.div`\n flex: 1;\n margin: 8px 6px 8px 4px;\n overflow: auto;\n box-sizing: border-box;\n\n &.small {\n padding-right: 10px;\n padding-left: 12px;\n }\n\n &.medium {\n padding-right: 14px;\n padding-left: 16px;\n }\n\n &.large {\n padding-right: 18px;\n padding-left: 20px;\n }\n\n ${scrollBarStyling(Size.Small)}\n`;\n\nconst TileBody: React.FunctionComponent<{ size: Size }> = ({children, size}) => {\n\n\n return (\n <Wrapper className={size}>\n {children}\n </Wrapper>\n )\n}\n\n\nexport default TileBody;\n"],"file":"TileBody.cjs"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
|
+
|
|
3
|
+
var _templateObject;
|
|
4
|
+
|
|
5
|
+
import React from 'react';
|
|
6
|
+
import { Size } from '../types';
|
|
7
|
+
import styled from 'styled-components';
|
|
8
|
+
import { scrollBarStyling } from '../styles';
|
|
9
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
+
var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n flex: 1;\n margin: 8px 6px 8px 4px;\n overflow: auto;\n box-sizing: border-box;\n\n &.small {\n padding-right: 10px;\n padding-left: 12px;\n }\n\n &.medium {\n padding-right: 14px;\n padding-left: 16px;\n }\n\n &.large {\n padding-right: 18px;\n padding-left: 20px;\n }\n\n ", "\n"])), scrollBarStyling(Size.Small));
|
|
11
|
+
|
|
12
|
+
var TileBody = function TileBody(_ref) {
|
|
13
|
+
var children = _ref.children,
|
|
14
|
+
size = _ref.size;
|
|
15
|
+
return /*#__PURE__*/_jsx(Wrapper, {
|
|
16
|
+
className: size,
|
|
17
|
+
children: children
|
|
18
|
+
});
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
export default TileBody;
|
|
22
|
+
//# sourceMappingURL=TileBody.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Tile/TileBody.tsx"],"names":["React","Size","styled","scrollBarStyling","Wrapper","div","Small","TileBody","children","size"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAQC,IAAR,QAAmB,UAAnB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,gBAAR,QAA+B,WAA/B;;AAEA,IAAMC,OAAO,GAAGF,MAAM,CAACG,GAAV,8XAqBTF,gBAAgB,CAACF,IAAI,CAACK,KAAN,CArBP,CAAb;;AAwBA,IAAMC,QAAiD,GAAG,SAApDA,QAAoD,OAAsB;AAAA,MAApBC,QAAoB,QAApBA,QAAoB;AAAA,MAAVC,IAAU,QAAVA,IAAU;AAG9E,sBACE,KAAC,OAAD;AAAS,IAAA,SAAS,EAAEA,IAApB;AAAA,cACGD;AADH,IADF;AAKD,CARD;;AAWA,eAAeD,QAAf","sourcesContent":["import React from 'react'\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {scrollBarStyling} from '../styles';\n\nconst Wrapper = styled.div`\n flex: 1;\n margin: 8px 6px 8px 4px;\n overflow: auto;\n box-sizing: border-box;\n\n &.small {\n padding-right: 10px;\n padding-left: 12px;\n }\n\n &.medium {\n padding-right: 14px;\n padding-left: 16px;\n }\n\n &.large {\n padding-right: 18px;\n padding-left: 20px;\n }\n\n ${scrollBarStyling(Size.Small)}\n`;\n\nconst TileBody: React.FunctionComponent<{ size: Size }> = ({children, size}) => {\n\n\n return (\n <Wrapper className={size}>\n {children}\n </Wrapper>\n )\n}\n\n\nexport default TileBody;\n"],"file":"TileBody.js"}
|