@hitachivantara/uikit-react-core 3.66.2 → 3.67.2
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/BaseInput/BaseInput.js +6 -1
- package/dist/BaseInput/BaseInput.js.map +1 -1
- package/dist/BaseInput/styles.js +3 -0
- package/dist/BaseInput/styles.js.map +1 -1
- package/dist/FilterGroup/Counter/Counter.js +9 -7
- package/dist/FilterGroup/Counter/Counter.js.map +1 -1
- package/dist/FilterGroup/FilterContent/FilterContent.js +1 -1
- package/dist/FilterGroup/FilterContent/FilterContent.js.map +1 -1
- package/dist/FilterGroup/FilterGroup.d.ts +4 -7
- package/dist/FilterGroup/RightPanel/RightPanel.js +2 -1
- package/dist/FilterGroup/RightPanel/RightPanel.js.map +1 -1
- package/dist/Forms/FormElement/index.d.ts +4 -0
- package/dist/Forms/FormElement/index.js +14 -0
- package/dist/Forms/FormElement/index.js.map +1 -1
- package/dist/Slider/Slider.d.ts +185 -0
- package/dist/Slider/Slider.js +803 -0
- package/dist/Slider/Slider.js.map +1 -0
- package/dist/Slider/SliderInput/SliderInput.js +194 -0
- package/dist/Slider/SliderInput/SliderInput.js.map +1 -0
- package/dist/Slider/SliderInput/index.d.ts +1 -0
- package/dist/Slider/SliderInput/index.js +16 -0
- package/dist/Slider/SliderInput/index.js.map +1 -0
- package/dist/Slider/SliderInput/styles.js +24 -0
- package/dist/Slider/SliderInput/styles.js.map +1 -0
- package/dist/Slider/index.d.ts +2 -0
- package/dist/Slider/index.js +16 -0
- package/dist/Slider/index.js.map +1 -0
- package/dist/Slider/styles.js +239 -0
- package/dist/Slider/styles.js.map +1 -0
- package/dist/Slider/utils.js +413 -0
- package/dist/Slider/utils.js.map +1 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +9 -0
- package/dist/index.js.map +1 -1
- package/dist/legacy/BaseInput/BaseInput.js +6 -1
- package/dist/legacy/BaseInput/BaseInput.js.map +1 -1
- package/dist/legacy/BaseInput/styles.js +3 -0
- package/dist/legacy/BaseInput/styles.js.map +1 -1
- package/dist/legacy/FilterGroup/Counter/Counter.js +8 -6
- package/dist/legacy/FilterGroup/Counter/Counter.js.map +1 -1
- package/dist/legacy/FilterGroup/FilterContent/FilterContent.js +1 -1
- package/dist/legacy/FilterGroup/FilterContent/FilterContent.js.map +1 -1
- package/dist/legacy/FilterGroup/FilterGroup.d.ts +4 -7
- package/dist/legacy/FilterGroup/RightPanel/RightPanel.js +2 -1
- package/dist/legacy/FilterGroup/RightPanel/RightPanel.js.map +1 -1
- package/dist/legacy/Forms/FormElement/index.d.ts +4 -0
- package/dist/legacy/Forms/FormElement/index.js +1 -0
- package/dist/legacy/Forms/FormElement/index.js.map +1 -1
- package/dist/legacy/Slider/Slider.d.ts +185 -0
- package/dist/legacy/Slider/Slider.js +752 -0
- package/dist/legacy/Slider/Slider.js.map +1 -0
- package/dist/legacy/Slider/SliderInput/SliderInput.js +151 -0
- package/dist/legacy/Slider/SliderInput/SliderInput.js.map +1 -0
- package/dist/legacy/Slider/SliderInput/index.d.ts +1 -0
- package/dist/legacy/Slider/SliderInput/index.js +2 -0
- package/dist/legacy/Slider/SliderInput/index.js.map +1 -0
- package/dist/legacy/Slider/SliderInput/styles.js +16 -0
- package/dist/legacy/Slider/SliderInput/styles.js.map +1 -0
- package/dist/legacy/Slider/index.d.ts +2 -0
- package/dist/legacy/Slider/index.js +2 -0
- package/dist/legacy/Slider/index.js.map +1 -0
- package/dist/legacy/Slider/styles.js +222 -0
- package/dist/legacy/Slider/styles.js.map +1 -0
- package/dist/legacy/Slider/utils.js +347 -0
- package/dist/legacy/Slider/utils.js.map +1 -0
- package/dist/legacy/index.d.ts +3 -0
- package/dist/legacy/index.js +1 -0
- package/dist/legacy/index.js.map +1 -1
- package/dist/modern/BaseInput/BaseInput.js +6 -1
- package/dist/modern/BaseInput/BaseInput.js.map +1 -1
- package/dist/modern/BaseInput/styles.js +3 -0
- package/dist/modern/BaseInput/styles.js.map +1 -1
- package/dist/modern/FilterGroup/Counter/Counter.js +4 -4
- package/dist/modern/FilterGroup/Counter/Counter.js.map +1 -1
- package/dist/modern/FilterGroup/FilterContent/FilterContent.js +1 -1
- package/dist/modern/FilterGroup/FilterContent/FilterContent.js.map +1 -1
- package/dist/modern/FilterGroup/FilterGroup.d.ts +4 -7
- package/dist/modern/FilterGroup/RightPanel/RightPanel.js +1 -1
- package/dist/modern/FilterGroup/RightPanel/RightPanel.js.map +1 -1
- package/dist/modern/Forms/FormElement/index.d.ts +4 -0
- package/dist/modern/Forms/FormElement/index.js +1 -0
- package/dist/modern/Forms/FormElement/index.js.map +1 -1
- package/dist/modern/Slider/Slider.d.ts +185 -0
- package/dist/modern/Slider/Slider.js +689 -0
- package/dist/modern/Slider/Slider.js.map +1 -0
- package/dist/modern/Slider/SliderInput/SliderInput.js +129 -0
- package/dist/modern/Slider/SliderInput/SliderInput.js.map +1 -0
- package/dist/modern/Slider/SliderInput/index.d.ts +1 -0
- package/dist/modern/Slider/SliderInput/index.js +2 -0
- package/dist/modern/Slider/SliderInput/index.js.map +1 -0
- package/dist/modern/Slider/SliderInput/styles.js +16 -0
- package/dist/modern/Slider/SliderInput/styles.js.map +1 -0
- package/dist/modern/Slider/index.d.ts +2 -0
- package/dist/modern/Slider/index.js +2 -0
- package/dist/modern/Slider/index.js.map +1 -0
- package/dist/modern/Slider/styles.js +215 -0
- package/dist/modern/Slider/styles.js.map +1 -0
- package/dist/modern/Slider/utils.js +302 -0
- package/dist/modern/Slider/utils.js.map +1 -0
- package/dist/modern/index.d.ts +3 -0
- package/dist/modern/index.js +1 -0
- package/dist/modern/index.js.map +1 -1
- package/package.json +9 -7
|
@@ -119,7 +119,7 @@ var HvBaseInput = function HvBaseInput(props) {
|
|
|
119
119
|
focused: classes.inputRootFocused,
|
|
120
120
|
disabled: classes.inputRootDisabled,
|
|
121
121
|
multiline: classes.inputRootMultiline,
|
|
122
|
-
input: (0, _clsx.default)(classes.input, !formElementProps.disabled && resizable && classes.inputResizable)
|
|
122
|
+
input: (0, _clsx.default)(classes.input, !formElementProps.disabled && resizable && classes.inputResizable, disabled && classes.inputDisabled)
|
|
123
123
|
},
|
|
124
124
|
inputProps: _objectSpread(_objectSpread({
|
|
125
125
|
// avoid the required attribute at the root node
|
|
@@ -190,6 +190,11 @@ process.env.NODE_ENV !== "production" ? HvBaseInput.propTypes = {
|
|
|
190
190
|
*/
|
|
191
191
|
input: _propTypes.default.string,
|
|
192
192
|
|
|
193
|
+
/**
|
|
194
|
+
* Styles applied to input html element when is disabled.
|
|
195
|
+
*/
|
|
196
|
+
inputDisabled: _propTypes.default.string,
|
|
197
|
+
|
|
193
198
|
/**
|
|
194
199
|
* Styles applied to input html element when it is resizable.
|
|
195
200
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseInput.js","names":["HvBaseInput","props","classes","className","id","name","value","defaultValue","required","readOnly","disabled","onChange","type","placeholder","multiline","resizable","invalid","inputRef","inputProps","others","formElementContext","HvFormElementContext","formElementProps","localInvalid","status","formElementDescriptorsContext","HvFormElementDescriptorsContext","ariaProps","onChangeHandler","event","target","root","inputRoot","focused","inputRootFocused","inputRootDisabled","inputRootMultiline","input","inputResizable","inputBorderContainer","formElementType","propTypes","PropTypes","string","shape","isRequired","bool","func","instanceOf","Object","refType","styles"],"sources":["../../src/BaseInput/BaseInput.js"],"sourcesContent":["import React, { useContext } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { Input, withStyles } from \"@material-ui/core\";\nimport { refType } from \"../utils\";\nimport styles from \"./styles\";\n\nimport {\n HvFormElementContext,\n HvFormElementDescriptorsContext,\n buildFormElementPropsFromContext,\n buildAriaPropsFromContext,\n} from \"../Forms/FormElement\";\n\n/**\n * An Input component that only posses the most basic functionalities.\n * It should be used alongside the other form elements to construct a proper accessible form.\n */\nconst HvBaseInput = (props) => {\n const {\n classes,\n className = \"\",\n\n id,\n name,\n\n value,\n defaultValue,\n\n required,\n readOnly,\n disabled,\n\n onChange,\n\n type = \"text\",\n\n placeholder,\n\n multiline = false,\n resizable = false,\n invalid = false,\n\n inputRef,\n inputProps = {},\n\n ...others\n } = props;\n\n const formElementContext = useContext(HvFormElementContext);\n const formElementProps = buildFormElementPropsFromContext(props, formElementContext);\n\n const localInvalid = invalid || formElementProps.status === \"invalid\";\n\n const formElementDescriptorsContext = useContext(HvFormElementDescriptorsContext);\n const ariaProps = buildAriaPropsFromContext(\n inputProps,\n formElementDescriptorsContext,\n localInvalid,\n id\n );\n\n const onChangeHandler = (event) => {\n onChange?.(event, event.target.value);\n };\n\n return (\n <div\n className={clsx(classes.root, className, {\n [classes.disabled]: formElementProps.disabled,\n [classes.invalid]: localInvalid,\n [classes.resizable]: multiline && resizable,\n [classes.readOnly]: readOnly,\n })}\n >\n <Input\n id={id}\n name={formElementProps.name}\n value={value}\n defaultValue={defaultValue}\n type={type}\n placeholder={placeholder}\n readOnly={formElementProps.readOnly}\n disabled={formElementProps.disabled}\n onChange={onChangeHandler}\n classes={{\n root: classes.inputRoot,\n focused: classes.inputRootFocused,\n disabled: classes.inputRootDisabled,\n multiline: classes.inputRootMultiline,\n input: clsx(classes.input, {\n [classes.inputResizable]: !formElementProps.disabled && resizable,\n }),\n }}\n inputProps={{\n // avoid the required attribute at the root node\n required: formElementProps.required,\n ...inputProps,\n ...ariaProps,\n }}\n inputRef={inputRef}\n multiline={multiline}\n rows={10}\n {...others}\n />\n {!multiline && <div role=\"presentation\" className={classes.inputBorderContainer} />}\n </div>\n );\n};\n\nHvBaseInput.formElementType = \"input\";\n\nHvBaseInput.propTypes = {\n /**\n * Class names to be applied.\n */\n className: PropTypes.string,\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes: PropTypes.shape({\n /**\n * Styles applied to the root container of the input.\n */\n root: PropTypes.string,\n /**\n * Styles applied to the root container of the input when it is disabled.\n */\n disabled: PropTypes.string,\n /**\n * Styles applied to the root container of the input when it is invalid.\n */\n invalid: PropTypes.string,\n /**\n * Styles applied to the root container of the input when it is resizable.\n */\n resizable: PropTypes.string,\n\n /**\n * Styles applied to input root which is the input that encloses all the other elements.\n */\n inputRoot: PropTypes.string,\n /**\n * Styles applied to input root when it is focused.\n */\n inputRootFocused: PropTypes.string,\n /**\n * Styles applied to input html element when it is disabled.\n */\n inputRootDisabled: PropTypes.string,\n /**\n * Styles applied to input html element when it is multiline mode.\n */\n inputRootMultiline: PropTypes.string,\n\n /**\n * Styles applied to input html element.\n */\n input: PropTypes.string,\n /**\n * Styles applied to input html element when it is resizable.\n */\n inputResizable: PropTypes.string,\n\n /**\n * Styles applied to the container of the border element.\n */\n inputBorderContainer: PropTypes.string,\n /**\n * Styles applied to the container of the border element, when in read only mode.\n */\n readOnly: PropTypes.string,\n }).isRequired,\n\n /**\n * Id to be applied to the root node.\n */\n id: PropTypes.string,\n /**\n * The input name.\n */\n name: PropTypes.string,\n\n /**\n * The value of the input, when controlled.\n */\n value: PropTypes.string,\n /**\n * The initial value of the input, when uncontrolled.\n */\n defaultValue: PropTypes.string,\n\n /**\n * If `true` the input is disabled.\n */\n disabled: PropTypes.bool,\n /**\n * Indicates that the input is not editable.\n */\n readOnly: PropTypes.bool,\n /**\n * If true, the input element will be required.\n */\n required: PropTypes.bool,\n\n /**\n * The function that will be executed onChange, allows modification of the input,\n * it receives the value. If a new value should be presented it must returned it.\n */\n onChange: PropTypes.func,\n\n /**\n * The input type.\n */\n type: PropTypes.string,\n\n /**\n * Label inside the input used to help user.\n */\n placeholder: PropTypes.string,\n\n /**\n * If true, a textarea element will be rendered.\n */\n multiline: PropTypes.bool,\n /**\n * If true and multiline is also true the textarea element will be resizable.\n */\n resizable: PropTypes.bool,\n /**\n * Denotes if the input is in an invalid state.\n */\n invalid: PropTypes.bool,\n\n /**\n * Attributes applied to the input element.\n */\n inputProps: PropTypes.instanceOf(Object),\n /**\n * Allows passing a ref to the underlying input\n */\n inputRef: refType,\n};\n\nexport default withStyles(styles, { name: \"HvBaseInput\" })(HvBaseInput);\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseInput.js","names":["HvBaseInput","props","classes","className","id","name","value","defaultValue","required","readOnly","disabled","onChange","type","placeholder","multiline","resizable","invalid","inputRef","inputProps","others","formElementContext","HvFormElementContext","formElementProps","localInvalid","status","formElementDescriptorsContext","HvFormElementDescriptorsContext","ariaProps","onChangeHandler","event","target","root","inputRoot","focused","inputRootFocused","inputRootDisabled","inputRootMultiline","input","inputResizable","inputDisabled","inputBorderContainer","formElementType","propTypes","PropTypes","string","shape","isRequired","bool","func","instanceOf","Object","refType","styles"],"sources":["../../src/BaseInput/BaseInput.js"],"sourcesContent":["import React, { useContext } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { Input, withStyles } from \"@material-ui/core\";\nimport { refType } from \"../utils\";\nimport styles from \"./styles\";\n\nimport {\n HvFormElementContext,\n HvFormElementDescriptorsContext,\n buildFormElementPropsFromContext,\n buildAriaPropsFromContext,\n} from \"../Forms/FormElement\";\n\n/**\n * An Input component that only posses the most basic functionalities.\n * It should be used alongside the other form elements to construct a proper accessible form.\n */\nconst HvBaseInput = (props) => {\n const {\n classes,\n className = \"\",\n\n id,\n name,\n\n value,\n defaultValue,\n\n required,\n readOnly,\n disabled,\n\n onChange,\n\n type = \"text\",\n\n placeholder,\n\n multiline = false,\n resizable = false,\n invalid = false,\n\n inputRef,\n inputProps = {},\n\n ...others\n } = props;\n\n const formElementContext = useContext(HvFormElementContext);\n const formElementProps = buildFormElementPropsFromContext(props, formElementContext);\n\n const localInvalid = invalid || formElementProps.status === \"invalid\";\n\n const formElementDescriptorsContext = useContext(HvFormElementDescriptorsContext);\n const ariaProps = buildAriaPropsFromContext(\n inputProps,\n formElementDescriptorsContext,\n localInvalid,\n id\n );\n\n const onChangeHandler = (event) => {\n onChange?.(event, event.target.value);\n };\n\n return (\n <div\n className={clsx(classes.root, className, {\n [classes.disabled]: formElementProps.disabled,\n [classes.invalid]: localInvalid,\n [classes.resizable]: multiline && resizable,\n [classes.readOnly]: readOnly,\n })}\n >\n <Input\n id={id}\n name={formElementProps.name}\n value={value}\n defaultValue={defaultValue}\n type={type}\n placeholder={placeholder}\n readOnly={formElementProps.readOnly}\n disabled={formElementProps.disabled}\n onChange={onChangeHandler}\n classes={{\n root: classes.inputRoot,\n focused: classes.inputRootFocused,\n disabled: classes.inputRootDisabled,\n multiline: classes.inputRootMultiline,\n input: clsx(classes.input, {\n [classes.inputResizable]: !formElementProps.disabled && resizable,\n [classes.inputDisabled]: disabled,\n }),\n }}\n inputProps={{\n // avoid the required attribute at the root node\n required: formElementProps.required,\n ...inputProps,\n ...ariaProps,\n }}\n inputRef={inputRef}\n multiline={multiline}\n rows={10}\n {...others}\n />\n {!multiline && <div role=\"presentation\" className={classes.inputBorderContainer} />}\n </div>\n );\n};\n\nHvBaseInput.formElementType = \"input\";\n\nHvBaseInput.propTypes = {\n /**\n * Class names to be applied.\n */\n className: PropTypes.string,\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes: PropTypes.shape({\n /**\n * Styles applied to the root container of the input.\n */\n root: PropTypes.string,\n /**\n * Styles applied to the root container of the input when it is disabled.\n */\n disabled: PropTypes.string,\n /**\n * Styles applied to the root container of the input when it is invalid.\n */\n invalid: PropTypes.string,\n /**\n * Styles applied to the root container of the input when it is resizable.\n */\n resizable: PropTypes.string,\n\n /**\n * Styles applied to input root which is the input that encloses all the other elements.\n */\n inputRoot: PropTypes.string,\n /**\n * Styles applied to input root when it is focused.\n */\n inputRootFocused: PropTypes.string,\n /**\n * Styles applied to input html element when it is disabled.\n */\n inputRootDisabled: PropTypes.string,\n /**\n * Styles applied to input html element when it is multiline mode.\n */\n inputRootMultiline: PropTypes.string,\n\n /**\n * Styles applied to input html element.\n */\n input: PropTypes.string,\n /**\n * Styles applied to input html element when is disabled.\n */\n inputDisabled: PropTypes.string,\n /**\n * Styles applied to input html element when it is resizable.\n */\n inputResizable: PropTypes.string,\n\n /**\n * Styles applied to the container of the border element.\n */\n inputBorderContainer: PropTypes.string,\n /**\n * Styles applied to the container of the border element, when in read only mode.\n */\n readOnly: PropTypes.string,\n }).isRequired,\n\n /**\n * Id to be applied to the root node.\n */\n id: PropTypes.string,\n /**\n * The input name.\n */\n name: PropTypes.string,\n\n /**\n * The value of the input, when controlled.\n */\n value: PropTypes.string,\n /**\n * The initial value of the input, when uncontrolled.\n */\n defaultValue: PropTypes.string,\n\n /**\n * If `true` the input is disabled.\n */\n disabled: PropTypes.bool,\n /**\n * Indicates that the input is not editable.\n */\n readOnly: PropTypes.bool,\n /**\n * If true, the input element will be required.\n */\n required: PropTypes.bool,\n\n /**\n * The function that will be executed onChange, allows modification of the input,\n * it receives the value. If a new value should be presented it must returned it.\n */\n onChange: PropTypes.func,\n\n /**\n * The input type.\n */\n type: PropTypes.string,\n\n /**\n * Label inside the input used to help user.\n */\n placeholder: PropTypes.string,\n\n /**\n * If true, a textarea element will be rendered.\n */\n multiline: PropTypes.bool,\n /**\n * If true and multiline is also true the textarea element will be resizable.\n */\n resizable: PropTypes.bool,\n /**\n * Denotes if the input is in an invalid state.\n */\n invalid: PropTypes.bool,\n\n /**\n * Attributes applied to the input element.\n */\n inputProps: PropTypes.instanceOf(Object),\n /**\n * Allows passing a ref to the underlying input\n */\n inputRef: refType,\n};\n\nexport default withStyles(styles, { name: \"HvBaseInput\" })(HvBaseInput);\n"],"mappings":"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"}
|
package/dist/BaseInput/styles.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","names":["styles","theme","root","display","width","position","overflow","border","hv","palette","accent","acce1","backgroundColor","resizable","readOnly","disabled","atmosphere","atmo4","atmo3","invalid","semantic","sema4","inputRoot","margin","borderRadius","atmo1","inputRootFocused","background","outlineStyles","inputRootDisabled","cursor","inputRootMultiline","padding","height","minHeight","marginLeft","marginRight","input","spacing","xs","typography","normalText","textOverflow","outline","placeholderText","opacity","flexGrow","inputResizable","resize","inputBorderContainer","top","left","color"],"sources":["../../src/BaseInput/styles.js"],"sourcesContent":["import { outlineStyles } from \"../Focus/styles\";\n\nconst styles = (theme) => ({\n root: {\n display: \"inline-block\",\n width: \"100%\",\n position: \"relative\",\n \"& $inputRootMultiline\": {\n overflow: \"auto\",\n border: \"none\",\n },\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.accent.acce1}`,\n },\n },\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.accent.acce1,\n },\n \"&:focus-within $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.accent.acce1,\n },\n // IE fallback code (using focus-within-polyfill)\n \"&.focus-within $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.accent.acce1,\n },\n \"&:focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.accent.acce1}`,\n },\n },\n // IE fallback code (using focus-within-polyfill)\n \"&.focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.accent.acce1}`,\n },\n },\n },\n resizable: {\n width: \"auto\",\n },\n readOnly: {\n \"& $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n \"&:hover $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n \"&:focus-within $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n\n // multiline\n \"& $inputRootMultiline\": {\n \"& $input\": {\n border: \"1px solid transparent\",\n },\n },\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n border: \"1px solid transparent\",\n },\n },\n \"&:focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: \"1px solid transparent\",\n },\n },\n },\n disabled: {\n \"& $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.atmosphere.atmo4,\n },\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.atmosphere.atmo4,\n },\n \"& $inputRootMultiline\": {\n \"& $input\": {\n backgroundColor: theme.hv.palette.atmosphere.atmo3,\n border: `1px solid ${theme.hv.palette.atmosphere.atmo4}`,\n },\n },\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n backgroundColor: theme.hv.palette.atmosphere.atmo3,\n border: `1px solid ${theme.hv.palette.atmosphere.atmo4}`,\n },\n },\n },\n invalid: {\n \"&:not($disabled)\": {\n \"& $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.semantic.sema4,\n },\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.semantic.sema4,\n },\n \"& $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.semantic.sema4}`,\n },\n },\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.semantic.sema4}`,\n },\n },\n \"&:focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.semantic.sema4}`,\n },\n },\n // IE fallback code (using focus-within-polyfill)\n \"&.focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.semantic.sema4}`,\n },\n },\n },\n },\n\n inputRoot: {\n margin: 0,\n width: \"100%\",\n borderRadius: \"2px\",\n backgroundColor: theme.hv.palette.atmosphere.atmo1,\n },\n inputRootFocused: {\n background: theme.hv.palette.atmosphere.atmo1,\n ...outlineStyles,\n \"&:hover\": {\n background: theme.hv.palette.atmosphere.atmo1,\n },\n },\n inputRootDisabled: {\n background: theme.hv.palette.atmosphere.atmo3,\n \"&:hover\": {\n background: theme.hv.palette.atmosphere.atmo3,\n cursor: \"not-allowed\",\n },\n cursor: \"not-allowed\",\n },\n inputRootMultiline: {\n padding: 0,\n backgroundColor: \"transparent\",\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.atmosphere.atmo4}`,\n borderRadius: \"2px\",\n backgroundColor: theme.hv.palette.atmosphere.atmo1,\n height: \"auto\",\n minHeight: \"21px\",\n padding: \"5px 10px\",\n overflow: \"auto\",\n marginLeft: \"0px\",\n marginRight: \"0px\",\n },\n },\n\n input: {\n height: \"21px\",\n marginLeft: theme.hv.spacing.xs,\n marginRight: theme.hv.spacing.xs,\n padding: \"6px 0 5px\",\n ...theme.hv.typography.normalText,\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n outline: \"none\",\n \"&::placeholder\": {\n ...theme.hv.typography.placeholderText,\n opacity: 1,\n },\n \"&::-ms-clear\": {\n display: \"none\",\n },\n width: \"initial\",\n flexGrow: 1,\n },\n inputResizable: {\n resize: \"both\",\n width: \"100%\",\n },\n\n inputBorderContainer: {\n position: \"absolute\",\n width: \"calc(100% - 4px)\",\n height: \"1px\",\n top: \"31px\",\n left: \"2px\",\n backgroundColor: theme.hv.palette.atmosphere.atmo4,\n },\n\n \"@global\": {\n \"input:-webkit-autofill\": {\n \"-webkit-box-shadow\": `0 0 0px 1000px ${theme.hv.palette.atmosphere.atmo1} inset`,\n \"-webkit-text-fill-color\": theme.hv.typography.normalText.color,\n },\n },\n});\n\nexport default styles;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"styles.js","names":["styles","theme","root","display","width","position","overflow","border","hv","palette","accent","acce1","backgroundColor","resizable","readOnly","disabled","atmosphere","atmo4","atmo3","invalid","semantic","sema4","inputRoot","margin","borderRadius","atmo1","inputRootFocused","background","outlineStyles","inputRootDisabled","cursor","inputRootMultiline","padding","height","minHeight","marginLeft","marginRight","input","spacing","xs","typography","normalText","textOverflow","outline","placeholderText","opacity","flexGrow","inputDisabled","color","atmo5","inputResizable","resize","inputBorderContainer","top","left"],"sources":["../../src/BaseInput/styles.js"],"sourcesContent":["import { outlineStyles } from \"../Focus/styles\";\n\nconst styles = (theme) => ({\n root: {\n display: \"inline-block\",\n width: \"100%\",\n position: \"relative\",\n \"& $inputRootMultiline\": {\n overflow: \"auto\",\n border: \"none\",\n },\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.accent.acce1}`,\n },\n },\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.accent.acce1,\n },\n \"&:focus-within $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.accent.acce1,\n },\n // IE fallback code (using focus-within-polyfill)\n \"&.focus-within $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.accent.acce1,\n },\n \"&:focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.accent.acce1}`,\n },\n },\n // IE fallback code (using focus-within-polyfill)\n \"&.focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.accent.acce1}`,\n },\n },\n },\n resizable: {\n width: \"auto\",\n },\n readOnly: {\n \"& $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n \"&:hover $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n \"&:focus-within $inputBorderContainer\": {\n backgroundColor: \"transparent\",\n },\n\n // multiline\n \"& $inputRootMultiline\": {\n \"& $input\": {\n border: \"1px solid transparent\",\n },\n },\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n border: \"1px solid transparent\",\n },\n },\n \"&:focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: \"1px solid transparent\",\n },\n },\n },\n disabled: {\n \"& $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.atmosphere.atmo4,\n },\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.atmosphere.atmo4,\n },\n \"& $inputRootMultiline\": {\n \"& $input\": {\n backgroundColor: theme.hv.palette.atmosphere.atmo3,\n border: `1px solid ${theme.hv.palette.atmosphere.atmo4}`,\n },\n },\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n backgroundColor: theme.hv.palette.atmosphere.atmo3,\n border: `1px solid ${theme.hv.palette.atmosphere.atmo4}`,\n },\n },\n },\n invalid: {\n \"&:not($disabled)\": {\n \"& $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.semantic.sema4,\n },\n \"&:hover $inputBorderContainer\": {\n backgroundColor: theme.hv.palette.semantic.sema4,\n },\n \"& $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.semantic.sema4}`,\n },\n },\n \"&:hover $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.semantic.sema4}`,\n },\n },\n \"&:focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.semantic.sema4}`,\n },\n },\n // IE fallback code (using focus-within-polyfill)\n \"&.focus-within $inputRootMultiline\": {\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.semantic.sema4}`,\n },\n },\n },\n },\n\n inputRoot: {\n margin: 0,\n width: \"100%\",\n borderRadius: \"2px\",\n backgroundColor: theme.hv.palette.atmosphere.atmo1,\n },\n inputRootFocused: {\n background: theme.hv.palette.atmosphere.atmo1,\n ...outlineStyles,\n \"&:hover\": {\n background: theme.hv.palette.atmosphere.atmo1,\n },\n },\n inputRootDisabled: {\n background: theme.hv.palette.atmosphere.atmo3,\n \"&:hover\": {\n background: theme.hv.palette.atmosphere.atmo3,\n cursor: \"not-allowed\",\n },\n cursor: \"not-allowed\",\n },\n inputRootMultiline: {\n padding: 0,\n backgroundColor: \"transparent\",\n \"& $input\": {\n border: `1px solid ${theme.hv.palette.atmosphere.atmo4}`,\n borderRadius: \"2px\",\n backgroundColor: theme.hv.palette.atmosphere.atmo1,\n height: \"auto\",\n minHeight: \"21px\",\n padding: \"5px 10px\",\n overflow: \"auto\",\n marginLeft: \"0px\",\n marginRight: \"0px\",\n },\n },\n\n input: {\n height: \"21px\",\n marginLeft: theme.hv.spacing.xs,\n marginRight: theme.hv.spacing.xs,\n padding: \"6px 0 5px\",\n ...theme.hv.typography.normalText,\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n outline: \"none\",\n \"&::placeholder\": {\n ...theme.hv.typography.placeholderText,\n opacity: 1,\n },\n \"&::-ms-clear\": {\n display: \"none\",\n },\n width: \"initial\",\n flexGrow: 1,\n },\n inputDisabled: {\n color: theme.hv.palette.atmosphere.atmo5,\n },\n inputResizable: {\n resize: \"both\",\n width: \"100%\",\n },\n\n inputBorderContainer: {\n position: \"absolute\",\n width: \"calc(100% - 4px)\",\n height: \"1px\",\n top: \"31px\",\n left: \"2px\",\n backgroundColor: theme.hv.palette.atmosphere.atmo4,\n },\n\n \"@global\": {\n \"input:-webkit-autofill\": {\n \"-webkit-box-shadow\": `0 0 0px 1000px ${theme.hv.palette.atmosphere.atmo1} inset`,\n \"-webkit-text-fill-color\": theme.hv.typography.normalText.color,\n },\n },\n});\n\nexport default styles;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;AAEA,IAAMA,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;EAAA,OAAY;IACzBC,IAAI,EAAE;MACJC,OAAO,EAAE,cADL;MAEJC,KAAK,EAAE,MAFH;MAGJC,QAAQ,EAAE,UAHN;MAIJ,yBAAyB;QACvBC,QAAQ,EAAE,MADa;QAEvBC,MAAM,EAAE;MAFe,CAJrB;MAQJ,+BAA+B;QAC7B,YAAY;UACVA,MAAM,sBAAeN,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBC,MAAjB,CAAwBC,KAAvC;QADI;MADiB,CAR3B;MAaJ,iCAAiC;QAC/BC,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBC,MAAjB,CAAwBC;MADV,CAb7B;MAgBJ,wCAAwC;QACtCC,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBC,MAAjB,CAAwBC;MADH,CAhBpC;MAmBJ;MACA,wCAAwC;QACtCC,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBC,MAAjB,CAAwBC;MADH,CApBpC;MAuBJ,sCAAsC;QACpC,YAAY;UACVJ,MAAM,sBAAeN,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBC,MAAjB,CAAwBC,KAAvC;QADI;MADwB,CAvBlC;MA4BJ;MACA,sCAAsC;QACpC,YAAY;UACVJ,MAAM,sBAAeN,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBC,MAAjB,CAAwBC,KAAvC;QADI;MADwB;IA7BlC,CADmB;IAoCzBE,SAAS,EAAE;MACTT,KAAK,EAAE;IADE,CApCc;IAuCzBU,QAAQ,EAAE;MACR,2BAA2B;QACzBF,eAAe,EAAE;MADQ,CADnB;MAIR,iCAAiC;QAC/BA,eAAe,EAAE;MADc,CAJzB;MAOR,wCAAwC;QACtCA,eAAe,EAAE;MADqB,CAPhC;MAWR;MACA,yBAAyB;QACvB,YAAY;UACVL,MAAM,EAAE;QADE;MADW,CAZjB;MAiBR,+BAA+B;QAC7B,YAAY;UACVA,MAAM,EAAE;QADE;MADiB,CAjBvB;MAsBR,sCAAsC;QACpC,YAAY;UACVA,MAAM,EAAE;QADE;MADwB;IAtB9B,CAvCe;IAmEzBQ,QAAQ,EAAE;MACR,2BAA2B;QACzBH,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BC;MADpB,CADnB;MAIR,iCAAiC;QAC/BL,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BC;MADd,CAJzB;MAOR,yBAAyB;QACvB,YAAY;UACVL,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BE,KADnC;UAEVX,MAAM,sBAAeN,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BC,KAA3C;QAFI;MADW,CAPjB;MAaR,+BAA+B;QAC7B,YAAY;UACVL,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BE,KADnC;UAEVX,MAAM,sBAAeN,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BC,KAA3C;QAFI;MADiB;IAbvB,CAnEe;IAuFzBE,OAAO,EAAE;MACP,oBAAoB;QAClB,2BAA2B;UACzBP,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBW,QAAjB,CAA0BC;QADlB,CADT;QAIlB,iCAAiC;UAC/BT,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBW,QAAjB,CAA0BC;QADZ,CAJf;QAOlB,yBAAyB;UACvB,YAAY;YACVd,MAAM,sBAAeN,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBW,QAAjB,CAA0BC,KAAzC;UADI;QADW,CAPP;QAYlB,+BAA+B;UAC7B,YAAY;YACVd,MAAM,sBAAeN,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBW,QAAjB,CAA0BC,KAAzC;UADI;QADiB,CAZb;QAiBlB,sCAAsC;UACpC,YAAY;YACVd,MAAM,sBAAeN,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBW,QAAjB,CAA0BC,KAAzC;UADI;QADwB,CAjBpB;QAsBlB;QACA,sCAAsC;UACpC,YAAY;YACVd,MAAM,sBAAeN,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBW,QAAjB,CAA0BC,KAAzC;UADI;QADwB;MAvBpB;IADb,CAvFgB;IAuHzBC,SAAS,EAAE;MACTC,MAAM,EAAE,CADC;MAETnB,KAAK,EAAE,MAFE;MAGToB,YAAY,EAAE,KAHL;MAITZ,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BS;IAJpC,CAvHc;IA6HzBC,gBAAgB;MACdC,UAAU,EAAE1B,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BS;IAD1B,GAEXG,qBAFW;MAGd,WAAW;QACTD,UAAU,EAAE1B,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BS;MAD/B;IAHG,EA7HS;IAoIzBI,iBAAiB,EAAE;MACjBF,UAAU,EAAE1B,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BE,KADvB;MAEjB,WAAW;QACTS,UAAU,EAAE1B,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BE,KAD/B;QAETY,MAAM,EAAE;MAFC,CAFM;MAMjBA,MAAM,EAAE;IANS,CApIM;IA4IzBC,kBAAkB,EAAE;MAClBC,OAAO,EAAE,CADS;MAElBpB,eAAe,EAAE,aAFC;MAGlB,YAAY;QACVL,MAAM,sBAAeN,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BC,KAA3C,CADI;QAEVO,YAAY,EAAE,KAFJ;QAGVZ,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BS,KAHnC;QAIVQ,MAAM,EAAE,MAJE;QAKVC,SAAS,EAAE,MALD;QAMVF,OAAO,EAAE,UANC;QAOV1B,QAAQ,EAAE,MAPA;QAQV6B,UAAU,EAAE,KARF;QASVC,WAAW,EAAE;MATH;IAHM,CA5IK;IA4JzBC,KAAK;MACHJ,MAAM,EAAE,MADL;MAEHE,UAAU,EAAElC,KAAK,CAACO,EAAN,CAAS8B,OAAT,CAAiBC,EAF1B;MAGHH,WAAW,EAAEnC,KAAK,CAACO,EAAN,CAAS8B,OAAT,CAAiBC,EAH3B;MAIHP,OAAO,EAAE;IAJN,GAKA/B,KAAK,CAACO,EAAN,CAASgC,UAAT,CAAoBC,UALpB;MAMHnC,QAAQ,EAAE,QANP;MAOHoC,YAAY,EAAE,UAPX;MAQHC,OAAO,EAAE,MARN;MASH,kDACK1C,KAAK,CAACO,EAAN,CAASgC,UAAT,CAAoBI,eADzB;QAEEC,OAAO,EAAE;MAFX,EATG;MAaH,gBAAgB;QACd1C,OAAO,EAAE;MADK,CAbb;MAgBHC,KAAK,EAAE,SAhBJ;MAiBH0C,QAAQ,EAAE;IAjBP,EA5JoB;IA+KzBC,aAAa,EAAE;MACbC,KAAK,EAAE/C,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BiC;IADtB,CA/KU;IAkLzBC,cAAc,EAAE;MACdC,MAAM,EAAE,MADM;MAEd/C,KAAK,EAAE;IAFO,CAlLS;IAuLzBgD,oBAAoB,EAAE;MACpB/C,QAAQ,EAAE,UADU;MAEpBD,KAAK,EAAE,kBAFa;MAGpB6B,MAAM,EAAE,KAHY;MAIpBoB,GAAG,EAAE,MAJe;MAKpBC,IAAI,EAAE,KALc;MAMpB1C,eAAe,EAAEX,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BC;IANzB,CAvLG;IAgMzB,WAAW;MACT,0BAA0B;QACxB,+CAAwChB,KAAK,CAACO,EAAN,CAASC,OAAT,CAAiBO,UAAjB,CAA4BS,KAApE,WADwB;QAExB,2BAA2BxB,KAAK,CAACO,EAAN,CAASgC,UAAT,CAAoBC,UAApB,CAA+BO;MAFlC;IADjB;EAhMc,CAAZ;AAAA,CAAf;;eAwMehD,M"}
|
|
@@ -25,12 +25,12 @@ require("core-js/modules/es.object.to-string.js");
|
|
|
25
25
|
|
|
26
26
|
require("core-js/modules/es.array.find-index.js");
|
|
27
27
|
|
|
28
|
-
require("core-js/modules/es.array.filter.js");
|
|
29
|
-
|
|
30
28
|
require("core-js/modules/es.array.flat.js");
|
|
31
29
|
|
|
32
30
|
require("core-js/modules/es.array.unscopables.flat.js");
|
|
33
31
|
|
|
32
|
+
require("core-js/modules/es.array.filter.js");
|
|
33
|
+
|
|
34
34
|
var _react = _interopRequireWildcard(require("react"));
|
|
35
35
|
|
|
36
36
|
var _clsx = _interopRequireDefault(require("clsx"));
|
|
@@ -46,7 +46,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
46
46
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
47
47
|
|
|
48
48
|
var Counter = function Counter(_ref) {
|
|
49
|
-
var _filterValues$optionI;
|
|
49
|
+
var _appliedFilters$flat, _filterValues$optionI;
|
|
50
50
|
|
|
51
51
|
var className = _ref.className,
|
|
52
52
|
id = _ref.id;
|
|
@@ -54,8 +54,10 @@ var Counter = function Counter(_ref) {
|
|
|
54
54
|
|
|
55
55
|
var _useContext = (0, _react.useContext)(_FilterGroupContext.FilterGroupContext),
|
|
56
56
|
filterOptions = _useContext.filterOptions,
|
|
57
|
-
|
|
58
|
-
|
|
57
|
+
_useContext$filterVal = _useContext.filterValues,
|
|
58
|
+
filterValues = _useContext$filterVal === void 0 ? [] : _useContext$filterVal,
|
|
59
|
+
_useContext$appliedFi = _useContext.appliedFilters,
|
|
60
|
+
appliedFilters = _useContext$appliedFi === void 0 ? [] : _useContext$appliedFi;
|
|
59
61
|
|
|
60
62
|
var options = id ? [filterOptions.find(function (option) {
|
|
61
63
|
return option.id === id;
|
|
@@ -63,9 +65,9 @@ var Counter = function Counter(_ref) {
|
|
|
63
65
|
var optionIdx = filterOptions.findIndex(function (option) {
|
|
64
66
|
return option.id === id;
|
|
65
67
|
});
|
|
66
|
-
var groupsCounter = appliedFilters.flat().filter(function (elem) {
|
|
68
|
+
var groupsCounter = (appliedFilters === null || appliedFilters === void 0 ? void 0 : (_appliedFilters$flat = appliedFilters.flat()) === null || _appliedFilters$flat === void 0 ? void 0 : _appliedFilters$flat.filter(function (elem) {
|
|
67
69
|
return elem !== undefined;
|
|
68
|
-
}).length || 0;
|
|
70
|
+
}).length) || 0;
|
|
69
71
|
var partialCounter = id ? ((_filterValues$optionI = filterValues[optionIdx]) === null || _filterValues$optionI === void 0 ? void 0 : _filterValues$optionI.length) || 0 : groupsCounter;
|
|
70
72
|
var totalCounter = options.reduce(function (acc, option) {
|
|
71
73
|
return acc + option.data.length;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Counter.js","names":["Counter","className","id","classes","FilterGroupContext","filterOptions","filterValues","appliedFilters","options","find","option","optionIdx","findIndex","groupsCounter","flat","filter","elem","undefined","length","partialCounter","totalCounter","reduce","acc","data","root","propTypes","PropTypes","string"],"sources":["../../../src/FilterGroup/Counter/Counter.js"],"sourcesContent":["import React, { useContext } from \"react\";\nimport clsx from \"clsx\";\nimport PropTypes from \"prop-types\";\nimport { FilterGroupContext } from \"../FilterGroupContext\";\nimport useStyles from \"./styles\";\n\nconst Counter = ({ className, id }) => {\n const classes = useStyles();\n const { filterOptions, filterValues, appliedFilters } = useContext(FilterGroupContext);\n\n const options = id ? [filterOptions.find((option) => option.id === id)] : filterOptions;\n const optionIdx = filterOptions.findIndex((option) => option.id === id);\n\n const groupsCounter = appliedFilters
|
|
1
|
+
{"version":3,"file":"Counter.js","names":["Counter","className","id","classes","FilterGroupContext","filterOptions","filterValues","appliedFilters","options","find","option","optionIdx","findIndex","groupsCounter","flat","filter","elem","undefined","length","partialCounter","totalCounter","reduce","acc","data","root","propTypes","PropTypes","string"],"sources":["../../../src/FilterGroup/Counter/Counter.js"],"sourcesContent":["import React, { useContext } from \"react\";\nimport clsx from \"clsx\";\nimport PropTypes from \"prop-types\";\nimport { FilterGroupContext } from \"../FilterGroupContext\";\nimport useStyles from \"./styles\";\n\nconst Counter = ({ className, id }) => {\n const classes = useStyles();\n const { filterOptions, filterValues = [], appliedFilters = [] } = useContext(FilterGroupContext);\n\n const options = id ? [filterOptions.find((option) => option.id === id)] : filterOptions;\n const optionIdx = filterOptions.findIndex((option) => option.id === id);\n\n const groupsCounter = appliedFilters?.flat()?.filter((elem) => elem !== undefined).length || 0;\n const partialCounter = id ? filterValues[optionIdx]?.length || 0 : groupsCounter;\n const totalCounter = options.reduce((acc, option) => acc + option.data.length, 0);\n\n return (\n <div className={clsx(classes.root, className)}>\n {partialCounter > 0 ? <b>{partialCounter}</b> : partialCounter}\n {` / ${totalCounter}`}\n </div>\n );\n};\n\nCounter.propTypes = {\n className: PropTypes.string,\n id: PropTypes.string,\n};\n\nexport default Counter;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,OAAO,GAAG,SAAVA,OAAU,OAAuB;EAAA;;EAAA,IAApBC,SAAoB,QAApBA,SAAoB;EAAA,IAATC,EAAS,QAATA,EAAS;EACrC,IAAMC,OAAO,GAAG,sBAAhB;;EACA,kBAAkE,uBAAWC,sCAAX,CAAlE;EAAA,IAAQC,aAAR,eAAQA,aAAR;EAAA,wCAAuBC,YAAvB;EAAA,IAAuBA,YAAvB,sCAAsC,EAAtC;EAAA,wCAA0CC,cAA1C;EAAA,IAA0CA,cAA1C,sCAA2D,EAA3D;;EAEA,IAAMC,OAAO,GAAGN,EAAE,GAAG,CAACG,aAAa,CAACI,IAAd,CAAmB,UAACC,MAAD;IAAA,OAAYA,MAAM,CAACR,EAAP,KAAcA,EAA1B;EAAA,CAAnB,CAAD,CAAH,GAAwDG,aAA1E;EACA,IAAMM,SAAS,GAAGN,aAAa,CAACO,SAAd,CAAwB,UAACF,MAAD;IAAA,OAAYA,MAAM,CAACR,EAAP,KAAcA,EAA1B;EAAA,CAAxB,CAAlB;EAEA,IAAMW,aAAa,GAAG,CAAAN,cAAc,SAAd,IAAAA,cAAc,WAAd,oCAAAA,cAAc,CAAEO,IAAhB,gFAAwBC,MAAxB,CAA+B,UAACC,IAAD;IAAA,OAAUA,IAAI,KAAKC,SAAnB;EAAA,CAA/B,EAA6DC,MAA7D,KAAuE,CAA7F;EACA,IAAMC,cAAc,GAAGjB,EAAE,GAAG,0BAAAI,YAAY,CAACK,SAAD,CAAZ,gFAAyBO,MAAzB,KAAmC,CAAtC,GAA0CL,aAAnE;EACA,IAAMO,YAAY,GAAGZ,OAAO,CAACa,MAAR,CAAe,UAACC,GAAD,EAAMZ,MAAN;IAAA,OAAiBY,GAAG,GAAGZ,MAAM,CAACa,IAAP,CAAYL,MAAnC;EAAA,CAAf,EAA0D,CAA1D,CAArB;EAEA,oBACE;IAAK,SAAS,EAAE,mBAAKf,OAAO,CAACqB,IAAb,EAAmBvB,SAAnB;EAAhB,GACGkB,cAAc,GAAG,CAAjB,gBAAqB,wCAAIA,cAAJ,CAArB,GAA+CA,cADlD,eAESC,YAFT,EADF;AAMD,CAjBD;;AAmBA,wCAAApB,OAAO,CAACyB,SAAR,GAAoB;EAClBxB,SAAS,EAAEyB,mBAAUC,MADH;EAElBzB,EAAE,EAAEwB,mBAAUC;AAFI,CAApB;eAKe3B,O"}
|
|
@@ -192,7 +192,7 @@ var FilterContent = function FilterContent(_ref) {
|
|
|
192
192
|
className: classes.actionBar
|
|
193
193
|
}, /*#__PURE__*/_react.default.createElement(_.HvButton, {
|
|
194
194
|
id: (0, _.setId)(id, "clearFilters-button"),
|
|
195
|
-
disabled: defaultValue ? defaultValue.flat().length === filterValues.flat().length : filterValues.flat().length === 0,
|
|
195
|
+
disabled: defaultValue ? (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.flat().length) === (filterValues === null || filterValues === void 0 ? void 0 : filterValues.flat().length) : (filterValues === null || filterValues === void 0 ? void 0 : filterValues.flat().length) === 0,
|
|
196
196
|
category: "ghost",
|
|
197
197
|
onClick: onClearHandler
|
|
198
198
|
}, labels.clearLabel), /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FilterContent.js","names":["FilterContent","id","status","disabled","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onCancel","onClear","labels","horizontalPlacement","disablePortal","escapeWithReference","height","others","classes","filterGroupOpen","setFilterGroupOpen","FilterGroupContext","defaultValue","filterValues","rollbackFilters","clearFilters","applyFilters","applyDisabled","focusTarget","focusOnContainer","current","focus","onApplyHandler","evt","onCancelHandler","onClearHandler","handleToggle","open","Header","placeholder","root","dropdown","panel","selection","baseDropdownSelection","header","modifiers","name","enabled","undefined","join","trim","leftSidePanel","rightSidePanel","actionBar","flat","length","clearLabel","space","applyLabel","cancelLabel","propTypes","PropTypes","string","node","bool","oneOf","func","shape","searchBoxPlaceholder","selectAll","multiSelectionConjunction","any"],"sources":["../../../src/FilterGroup/FilterContent/FilterContent.js"],"sourcesContent":["import React, { useMemo, useState, useRef, useContext } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { Filters } from \"@hitachivantara/uikit-react-icons\";\nimport { FilterGroupContext } from \"../FilterGroupContext\";\nimport LeftPanel from \"../LeftPanel\";\nimport RightPanel from \"../RightPanel\";\nimport Counter from \"../Counter\";\n\nimport useStyles from \"./styles\";\n\nimport { setId, HvBaseDropdown, HvTypography, HvButton, HvActionBar } from \"../..\";\n\nconst FilterContent = ({\n id,\n status,\n disabled = false,\n\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n\n onChange,\n onCancel,\n onClear,\n\n labels,\n\n horizontalPlacement = \"right\",\n disablePortal = true,\n escapeWithReference = true,\n\n height,\n\n ...others\n}) => {\n const classes = useStyles();\n const [filterGroupOpen, setFilterGroupOpen] = useState(false);\n\n const { defaultValue, filterValues, rollbackFilters, clearFilters, applyFilters, applyDisabled } =\n useContext(FilterGroupContext);\n\n const focusTarget = useRef();\n\n const focusOnContainer = () => {\n focusTarget.current?.focus();\n };\n\n const onApplyHandler = (evt) => {\n applyFilters();\n onChange?.(evt, filterValues);\n setFilterGroupOpen(false);\n };\n\n const onCancelHandler = (evt) => {\n rollbackFilters();\n onCancel?.(evt);\n setFilterGroupOpen(false);\n };\n\n const onClearHandler = (evt) => {\n clearFilters();\n onClear?.(evt);\n };\n\n const handleToggle = (evt, open) => {\n /* \n If evt is null this toggle wasn't triggered by the user.\n instead it was triggered by the baseDropdown useEffect after\n the datepicker changed the expanded value this baseDropdown behavior needs a review\n */\n if (evt === null) return;\n setFilterGroupOpen(open);\n if (!open) onCancelHandler?.(evt);\n };\n\n const Header = useMemo(\n () => (\n <>\n <Filters />\n <HvTypography variant=\"highlightText\">{labels.placeholder}</HvTypography>\n </>\n ),\n [labels.placeholder]\n );\n\n return (\n <HvBaseDropdown\n id={setId(id, \"dropdown\")}\n role=\"combobox\"\n classes={{\n root: classes.dropdown,\n panel: classes.panel,\n selection: classes.baseDropdownSelection,\n header: classes.header,\n }}\n disabled={disabled}\n disablePortal={disablePortal}\n variableWidth\n placement={horizontalPlacement}\n expanded={filterGroupOpen}\n onToggle={handleToggle}\n onClickOutside={onCancelHandler}\n onContainerCreation={focusOnContainer}\n placeholder={Header}\n adornment={<Counter />}\n popperProps={{ modifiers: [{ name: \"preventOverflow\", enabled: escapeWithReference }] }}\n aria-haspopup=\"dialog\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-invalid={status === \"invalid\" ? true : undefined}\n aria-errormessage={status === \"invalid\" ? setId(id, \"error\") : undefined}\n aria-describedby={\n [description && setId(id, \"description\"), ariaDescribedBy].join(\" \").trim() || undefined\n }\n {...others}\n >\n <div ref={focusTarget} tabIndex={-1} />\n <div className={classes.root} style={{ height }}>\n <LeftPanel id={id} className={classes.leftSidePanel} />\n <RightPanel id={id} className={classes.rightSidePanel} labels={labels} />\n </div>\n <HvActionBar className={classes.actionBar}>\n <HvButton\n id={setId(id, \"clearFilters-button\")}\n disabled={\n defaultValue\n ? defaultValue.flat().length === filterValues.flat().length\n : filterValues.flat().length === 0\n }\n category=\"ghost\"\n onClick={onClearHandler}\n >\n {labels.clearLabel}\n </HvButton>\n <div aria-hidden=\"true\" className={classes.space}>\n \n </div>\n <HvButton\n id={setId(id, \"apply-button\")}\n disabled={applyDisabled}\n category=\"ghost\"\n onClick={onApplyHandler}\n >\n {labels.applyLabel}\n </HvButton>\n <HvButton id={setId(id, \"cancel-button\")} category=\"ghost\" onClick={onCancelHandler}>\n {labels.cancelLabel}\n </HvButton>\n </HvActionBar>\n </HvBaseDropdown>\n );\n};\n\nFilterContent.propTypes = {\n id: PropTypes.string,\n\n \"aria-label\": PropTypes.string,\n \"aria-labelledby\": PropTypes.string,\n description: PropTypes.node,\n \"aria-describedby\": PropTypes.string,\n disabled: PropTypes.bool,\n status: PropTypes.oneOf([\"standBy\", \"valid\", \"invalid\"]),\n\n onChange: PropTypes.func,\n onCancel: PropTypes.func,\n onClear: PropTypes.func,\n\n labels: PropTypes.shape({\n applyLabel: PropTypes.string,\n cancelLabel: PropTypes.string,\n clearLabel: PropTypes.string,\n placeholder: PropTypes.string,\n searchBoxPlaceholder: PropTypes.string,\n selectAll: PropTypes.string,\n multiSelectionConjunction: PropTypes.string,\n }),\n\n horizontalPlacement: PropTypes.oneOf([\"left\", \"right\"]),\n disablePortal: PropTypes.bool,\n escapeWithReference: PropTypes.bool,\n height: PropTypes.any,\n};\n\nexport default FilterContent;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"FilterContent.js","names":["FilterContent","id","status","disabled","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onCancel","onClear","labels","horizontalPlacement","disablePortal","escapeWithReference","height","others","classes","filterGroupOpen","setFilterGroupOpen","FilterGroupContext","defaultValue","filterValues","rollbackFilters","clearFilters","applyFilters","applyDisabled","focusTarget","focusOnContainer","current","focus","onApplyHandler","evt","onCancelHandler","onClearHandler","handleToggle","open","Header","placeholder","root","dropdown","panel","selection","baseDropdownSelection","header","modifiers","name","enabled","undefined","join","trim","leftSidePanel","rightSidePanel","actionBar","flat","length","clearLabel","space","applyLabel","cancelLabel","propTypes","PropTypes","string","node","bool","oneOf","func","shape","searchBoxPlaceholder","selectAll","multiSelectionConjunction","any"],"sources":["../../../src/FilterGroup/FilterContent/FilterContent.js"],"sourcesContent":["import React, { useMemo, useState, useRef, useContext } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { Filters } from \"@hitachivantara/uikit-react-icons\";\nimport { FilterGroupContext } from \"../FilterGroupContext\";\nimport LeftPanel from \"../LeftPanel\";\nimport RightPanel from \"../RightPanel\";\nimport Counter from \"../Counter\";\n\nimport useStyles from \"./styles\";\n\nimport { setId, HvBaseDropdown, HvTypography, HvButton, HvActionBar } from \"../..\";\n\nconst FilterContent = ({\n id,\n status,\n disabled = false,\n\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n\n onChange,\n onCancel,\n onClear,\n\n labels,\n\n horizontalPlacement = \"right\",\n disablePortal = true,\n escapeWithReference = true,\n\n height,\n\n ...others\n}) => {\n const classes = useStyles();\n const [filterGroupOpen, setFilterGroupOpen] = useState(false);\n\n const { defaultValue, filterValues, rollbackFilters, clearFilters, applyFilters, applyDisabled } =\n useContext(FilterGroupContext);\n\n const focusTarget = useRef();\n\n const focusOnContainer = () => {\n focusTarget.current?.focus();\n };\n\n const onApplyHandler = (evt) => {\n applyFilters();\n onChange?.(evt, filterValues);\n setFilterGroupOpen(false);\n };\n\n const onCancelHandler = (evt) => {\n rollbackFilters();\n onCancel?.(evt);\n setFilterGroupOpen(false);\n };\n\n const onClearHandler = (evt) => {\n clearFilters();\n onClear?.(evt);\n };\n\n const handleToggle = (evt, open) => {\n /* \n If evt is null this toggle wasn't triggered by the user.\n instead it was triggered by the baseDropdown useEffect after\n the datepicker changed the expanded value this baseDropdown behavior needs a review\n */\n if (evt === null) return;\n setFilterGroupOpen(open);\n if (!open) onCancelHandler?.(evt);\n };\n\n const Header = useMemo(\n () => (\n <>\n <Filters />\n <HvTypography variant=\"highlightText\">{labels.placeholder}</HvTypography>\n </>\n ),\n [labels.placeholder]\n );\n\n return (\n <HvBaseDropdown\n id={setId(id, \"dropdown\")}\n role=\"combobox\"\n classes={{\n root: classes.dropdown,\n panel: classes.panel,\n selection: classes.baseDropdownSelection,\n header: classes.header,\n }}\n disabled={disabled}\n disablePortal={disablePortal}\n variableWidth\n placement={horizontalPlacement}\n expanded={filterGroupOpen}\n onToggle={handleToggle}\n onClickOutside={onCancelHandler}\n onContainerCreation={focusOnContainer}\n placeholder={Header}\n adornment={<Counter />}\n popperProps={{ modifiers: [{ name: \"preventOverflow\", enabled: escapeWithReference }] }}\n aria-haspopup=\"dialog\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-invalid={status === \"invalid\" ? true : undefined}\n aria-errormessage={status === \"invalid\" ? setId(id, \"error\") : undefined}\n aria-describedby={\n [description && setId(id, \"description\"), ariaDescribedBy].join(\" \").trim() || undefined\n }\n {...others}\n >\n <div ref={focusTarget} tabIndex={-1} />\n <div className={classes.root} style={{ height }}>\n <LeftPanel id={id} className={classes.leftSidePanel} />\n <RightPanel id={id} className={classes.rightSidePanel} labels={labels} />\n </div>\n <HvActionBar className={classes.actionBar}>\n <HvButton\n id={setId(id, \"clearFilters-button\")}\n disabled={\n defaultValue\n ? defaultValue?.flat().length === filterValues?.flat().length\n : filterValues?.flat().length === 0\n }\n category=\"ghost\"\n onClick={onClearHandler}\n >\n {labels.clearLabel}\n </HvButton>\n <div aria-hidden=\"true\" className={classes.space}>\n \n </div>\n <HvButton\n id={setId(id, \"apply-button\")}\n disabled={applyDisabled}\n category=\"ghost\"\n onClick={onApplyHandler}\n >\n {labels.applyLabel}\n </HvButton>\n <HvButton id={setId(id, \"cancel-button\")} category=\"ghost\" onClick={onCancelHandler}>\n {labels.cancelLabel}\n </HvButton>\n </HvActionBar>\n </HvBaseDropdown>\n );\n};\n\nFilterContent.propTypes = {\n id: PropTypes.string,\n\n \"aria-label\": PropTypes.string,\n \"aria-labelledby\": PropTypes.string,\n description: PropTypes.node,\n \"aria-describedby\": PropTypes.string,\n disabled: PropTypes.bool,\n status: PropTypes.oneOf([\"standBy\", \"valid\", \"invalid\"]),\n\n onChange: PropTypes.func,\n onCancel: PropTypes.func,\n onClear: PropTypes.func,\n\n labels: PropTypes.shape({\n applyLabel: PropTypes.string,\n cancelLabel: PropTypes.string,\n clearLabel: PropTypes.string,\n placeholder: PropTypes.string,\n searchBoxPlaceholder: PropTypes.string,\n selectAll: PropTypes.string,\n multiSelectionConjunction: PropTypes.string,\n }),\n\n horizontalPlacement: PropTypes.oneOf([\"left\", \"right\"]),\n disablePortal: PropTypes.bool,\n escapeWithReference: PropTypes.bool,\n height: PropTypes.any,\n};\n\nexport default FilterContent;\n"],"mappings":"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"}
|
|
@@ -3,21 +3,19 @@ import { HvFormElementProps } from "..";
|
|
|
3
3
|
|
|
4
4
|
export type HvFilterGroupClassKey = "root" | "labelContainer" | "label" | "description" | "error";
|
|
5
5
|
|
|
6
|
-
|
|
7
|
-
value: string | number[][];
|
|
8
|
-
}
|
|
6
|
+
export type FilterValue = (string | number)[][];
|
|
9
7
|
|
|
10
8
|
export interface HvFilterGroupProps
|
|
11
|
-
extends StandardProps<HvFormElementProps, HvFilterGroupClassKey> {
|
|
9
|
+
extends StandardProps<HvFormElementProps, HvFilterGroupClassKey, "defaultValue"> {
|
|
12
10
|
/**
|
|
13
11
|
* The callback fired when the cancel button is clicked.
|
|
14
12
|
*/
|
|
15
|
-
onCancel
|
|
13
|
+
onCancel?: (event: Event) => void;
|
|
16
14
|
|
|
17
15
|
/**
|
|
18
16
|
* The callback fired when the clear filters button is clicked.
|
|
19
17
|
*/
|
|
20
|
-
onClear
|
|
18
|
+
onClear?: (event: Event) => void;
|
|
21
19
|
|
|
22
20
|
/**
|
|
23
21
|
* The callback fired when the value changes.
|
|
@@ -72,7 +70,6 @@ export interface HvFilterGroupProps
|
|
|
72
70
|
data: {
|
|
73
71
|
id: string | number;
|
|
74
72
|
name: string;
|
|
75
|
-
checked?: boolean;
|
|
76
73
|
}[];
|
|
77
74
|
}[];
|
|
78
75
|
|
|
@@ -96,7 +96,8 @@ var RightPanel = function RightPanel(_ref) {
|
|
|
96
96
|
|
|
97
97
|
var _useContext = (0, _react.useContext)(_FilterGroupContext.FilterGroupContext),
|
|
98
98
|
filterOptions = _useContext.filterOptions,
|
|
99
|
-
|
|
99
|
+
_useContext$filterVal = _useContext.filterValues,
|
|
100
|
+
filterValues = _useContext$filterVal === void 0 ? [] : _useContext$filterVal,
|
|
100
101
|
setFilterValues = _useContext.setFilterValues,
|
|
101
102
|
activeGroup = _useContext.activeGroup;
|
|
102
103
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightPanel.js","names":["RightPanel","id","className","labels","classes","searchStr","setSearchStr","allSelected","setAllSelected","anySelected","setAnySelected","FilterGroupContext","filterOptions","filterValues","setFilterValues","activeGroup","activeGroupOptions","data","map","option","activeFilterValues","filter","value","includes","listValues","label","name","selected","isHidden","toLowerCase","indexOf","updateSelectAll","nbrSelected","length","hasSelection","allSelect","onChangeHandler","values","newFilterValues","i","v","handleSelectAll","SelectAll","selectAll","multiSelectionConjunction","defaultLabel","selectAllContainer","container","selection","root","search","searchBoxPlaceholder","event","str","list","propTypes","PropTypes","string","shape"],"sources":["../../../src/FilterGroup/RightPanel/RightPanel.js"],"sourcesContent":["import React, { useMemo, useContext, useState, useEffect, useCallback } from \"react\";\nimport PropTypes from \"prop-types\";\nimport cloneDeep from \"lodash/cloneDeep\";\nimport clsx from \"clsx\";\nimport { FilterGroupContext } from \"../FilterGroupContext\";\nimport useStyles from \"./styles\";\nimport { setId, HvTypography, HvList, HvInput, HvPanel, HvCheckBox } from \"../..\";\n\nconst RightPanel = ({ id, className, labels }) => {\n const classes = useStyles();\n const [searchStr, setSearchStr] = useState(\"\");\n const [allSelected, setAllSelected] = useState(false);\n const [anySelected, setAnySelected] = useState(false);\n\n const { filterOptions, filterValues, setFilterValues, activeGroup } =\n useContext(FilterGroupContext);\n\n const activeGroupOptions = useMemo(\n () => filterOptions[activeGroup].data.map((option) => option.id),\n [filterOptions, activeGroup]\n );\n\n const activeFilterValues = useMemo(\n () => filterValues[activeGroup]?.filter((value) => activeGroupOptions.includes(value)),\n [filterValues, activeGroupOptions, activeGroup]\n );\n\n const listValues = useMemo(\n () =>\n filterOptions[activeGroup].data.map((option) => ({\n ...option,\n label: option.name,\n selected: filterValues[activeGroup]?.includes(option.id),\n isHidden: option.name.toLowerCase().indexOf(searchStr.toLowerCase()) < 0,\n })),\n [filterOptions, filterValues, activeGroup, searchStr]\n );\n\n const updateSelectAll = useCallback(() => {\n const nbrSelected = activeFilterValues?.length;\n const hasSelection = nbrSelected > 0;\n const allSelect = nbrSelected === activeGroupOptions.length;\n\n setAnySelected(hasSelection);\n setAllSelected(hasSelection && allSelect);\n }, [activeFilterValues, activeGroupOptions]);\n\n useEffect(() => {\n updateSelectAll();\n }, [activeFilterValues, updateSelectAll]);\n\n useEffect(() => setSearchStr(\"\"), [activeGroup]);\n\n const onChangeHandler = (values) => {\n const newFilterValues = filterOptions.map((option, i) =>\n activeGroup === i\n ? values.filter((v) => v.selected).map((v) => v.id)\n : [...(filterValues[i] || [])]\n );\n setFilterValues(newFilterValues);\n };\n\n const handleSelectAll = useCallback(() => {\n const newFilterValues = cloneDeep(filterValues);\n newFilterValues[activeGroup] = anySelected ? [] : activeGroupOptions;\n\n setFilterValues(newFilterValues);\n }, [activeGroup, activeGroupOptions, anySelected, filterValues, setFilterValues]);\n\n /**\n * Create selecteAll component.\n *\n * @returns {*}\n */\n const SelectAll = useCallback(() => {\n const { selectAll, multiSelectionConjunction } = labels;\n const nbrSelected = activeFilterValues?.length;\n\n const defaultLabel = (\n <HvTypography component=\"span\">\n {nbrSelected > 0 ? (\n <>\n <b>{nbrSelected}</b>\n {` ${multiSelectionConjunction} ${activeGroupOptions.length}`}\n </>\n ) : (\n <>\n <b>{selectAll}</b>\n {` (${activeGroupOptions.length})`}\n </>\n )}\n </HvTypography>\n );\n\n return (\n <div className={classes.selectAllContainer}>\n <HvCheckBox\n id={setId(id, \"select-all\")}\n label={defaultLabel}\n onChange={() => handleSelectAll()}\n classes={{ container: classes.selection }}\n className={classes.selectAll}\n indeterminate={anySelected && !allSelected}\n checked={allSelected}\n />\n </div>\n );\n }, [\n activeFilterValues?.length,\n activeGroupOptions.length,\n allSelected,\n anySelected,\n classes.selectAll,\n classes.selectAllContainer,\n classes.selection,\n handleSelectAll,\n id,\n labels,\n ]);\n\n return (\n <HvPanel id={setId(id, \"rightPanel\")} className={clsx(className, classes.root)}>\n <HvInput\n id={setId(id, \"search\")}\n classes={{\n root: classes.search,\n }}\n type=\"search\"\n placeholder={labels.searchBoxPlaceholder}\n value={searchStr}\n onChange={(event, str) => setSearchStr(str)}\n />\n <SelectAll />\n <HvList\n key={activeGroup}\n id={setId(id, \"list\")}\n className={classes.list}\n values={listValues}\n multiSelect\n useSelector\n showSelectAll={false}\n onChange={onChangeHandler}\n selectable\n condensed\n hasTooltips\n />\n </HvPanel>\n );\n};\n\nRightPanel.propTypes = {\n id: PropTypes.string,\n className: PropTypes.string,\n labels: PropTypes.shape({\n searchBoxPlaceholder: PropTypes.string,\n selectAll: PropTypes.string,\n multiSelectionConjunction: PropTypes.string,\n }),\n};\n\nexport default RightPanel;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"RightPanel.js","names":["RightPanel","id","className","labels","classes","searchStr","setSearchStr","allSelected","setAllSelected","anySelected","setAnySelected","FilterGroupContext","filterOptions","filterValues","setFilterValues","activeGroup","activeGroupOptions","data","map","option","activeFilterValues","filter","value","includes","listValues","label","name","selected","isHidden","toLowerCase","indexOf","updateSelectAll","nbrSelected","length","hasSelection","allSelect","onChangeHandler","values","newFilterValues","i","v","handleSelectAll","SelectAll","selectAll","multiSelectionConjunction","defaultLabel","selectAllContainer","container","selection","root","search","searchBoxPlaceholder","event","str","list","propTypes","PropTypes","string","shape"],"sources":["../../../src/FilterGroup/RightPanel/RightPanel.js"],"sourcesContent":["import React, { useMemo, useContext, useState, useEffect, useCallback } from \"react\";\nimport PropTypes from \"prop-types\";\nimport cloneDeep from \"lodash/cloneDeep\";\nimport clsx from \"clsx\";\nimport { FilterGroupContext } from \"../FilterGroupContext\";\nimport useStyles from \"./styles\";\nimport { setId, HvTypography, HvList, HvInput, HvPanel, HvCheckBox } from \"../..\";\n\nconst RightPanel = ({ id, className, labels }) => {\n const classes = useStyles();\n const [searchStr, setSearchStr] = useState(\"\");\n const [allSelected, setAllSelected] = useState(false);\n const [anySelected, setAnySelected] = useState(false);\n\n const {\n filterOptions,\n filterValues = [],\n setFilterValues,\n activeGroup,\n } = useContext(FilterGroupContext);\n\n const activeGroupOptions = useMemo(\n () => filterOptions[activeGroup].data.map((option) => option.id),\n [filterOptions, activeGroup]\n );\n\n const activeFilterValues = useMemo(\n () => filterValues[activeGroup]?.filter((value) => activeGroupOptions.includes(value)),\n [filterValues, activeGroupOptions, activeGroup]\n );\n\n const listValues = useMemo(\n () =>\n filterOptions[activeGroup].data.map((option) => ({\n ...option,\n label: option.name,\n selected: filterValues[activeGroup]?.includes(option.id),\n isHidden: option.name.toLowerCase().indexOf(searchStr.toLowerCase()) < 0,\n })),\n [filterOptions, filterValues, activeGroup, searchStr]\n );\n\n const updateSelectAll = useCallback(() => {\n const nbrSelected = activeFilterValues?.length;\n const hasSelection = nbrSelected > 0;\n const allSelect = nbrSelected === activeGroupOptions.length;\n\n setAnySelected(hasSelection);\n setAllSelected(hasSelection && allSelect);\n }, [activeFilterValues, activeGroupOptions]);\n\n useEffect(() => {\n updateSelectAll();\n }, [activeFilterValues, updateSelectAll]);\n\n useEffect(() => setSearchStr(\"\"), [activeGroup]);\n\n const onChangeHandler = (values) => {\n const newFilterValues = filterOptions.map((option, i) =>\n activeGroup === i\n ? values.filter((v) => v.selected).map((v) => v.id)\n : [...(filterValues[i] || [])]\n );\n setFilterValues(newFilterValues);\n };\n\n const handleSelectAll = useCallback(() => {\n const newFilterValues = cloneDeep(filterValues);\n newFilterValues[activeGroup] = anySelected ? [] : activeGroupOptions;\n\n setFilterValues(newFilterValues);\n }, [activeGroup, activeGroupOptions, anySelected, filterValues, setFilterValues]);\n\n /**\n * Create selecteAll component.\n *\n * @returns {*}\n */\n const SelectAll = useCallback(() => {\n const { selectAll, multiSelectionConjunction } = labels;\n const nbrSelected = activeFilterValues?.length;\n\n const defaultLabel = (\n <HvTypography component=\"span\">\n {nbrSelected > 0 ? (\n <>\n <b>{nbrSelected}</b>\n {` ${multiSelectionConjunction} ${activeGroupOptions.length}`}\n </>\n ) : (\n <>\n <b>{selectAll}</b>\n {` (${activeGroupOptions.length})`}\n </>\n )}\n </HvTypography>\n );\n\n return (\n <div className={classes.selectAllContainer}>\n <HvCheckBox\n id={setId(id, \"select-all\")}\n label={defaultLabel}\n onChange={() => handleSelectAll()}\n classes={{ container: classes.selection }}\n className={classes.selectAll}\n indeterminate={anySelected && !allSelected}\n checked={allSelected}\n />\n </div>\n );\n }, [\n activeFilterValues?.length,\n activeGroupOptions.length,\n allSelected,\n anySelected,\n classes.selectAll,\n classes.selectAllContainer,\n classes.selection,\n handleSelectAll,\n id,\n labels,\n ]);\n\n return (\n <HvPanel id={setId(id, \"rightPanel\")} className={clsx(className, classes.root)}>\n <HvInput\n id={setId(id, \"search\")}\n classes={{\n root: classes.search,\n }}\n type=\"search\"\n placeholder={labels.searchBoxPlaceholder}\n value={searchStr}\n onChange={(event, str) => setSearchStr(str)}\n />\n <SelectAll />\n <HvList\n key={activeGroup}\n id={setId(id, \"list\")}\n className={classes.list}\n values={listValues}\n multiSelect\n useSelector\n showSelectAll={false}\n onChange={onChangeHandler}\n selectable\n condensed\n hasTooltips\n />\n </HvPanel>\n );\n};\n\nRightPanel.propTypes = {\n id: PropTypes.string,\n className: PropTypes.string,\n labels: PropTypes.shape({\n searchBoxPlaceholder: PropTypes.string,\n selectAll: PropTypes.string,\n multiSelectionConjunction: PropTypes.string,\n }),\n};\n\nexport default RightPanel;\n"],"mappings":"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"}
|
|
@@ -1,3 +1,7 @@
|
|
|
1
1
|
export { default } from "./FormElement";
|
|
2
2
|
export * from "./FormElement";
|
|
3
3
|
export * from "./context/FormElementContext";
|
|
4
|
+
export * from "./context/FormElementValueContext";
|
|
5
|
+
export * from "./context/FormElementDescriptorsContext";
|
|
6
|
+
export * from "./utils/FormUtils";
|
|
7
|
+
export * from "./validationStates";
|
|
@@ -76,4 +76,18 @@ Object.keys(_FormUtils).forEach(function (key) {
|
|
|
76
76
|
}
|
|
77
77
|
});
|
|
78
78
|
});
|
|
79
|
+
|
|
80
|
+
var _validationStates = require("./validationStates");
|
|
81
|
+
|
|
82
|
+
Object.keys(_validationStates).forEach(function (key) {
|
|
83
|
+
if (key === "default" || key === "__esModule") return;
|
|
84
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
85
|
+
if (key in exports && exports[key] === _validationStates[key]) return;
|
|
86
|
+
Object.defineProperty(exports, key, {
|
|
87
|
+
enumerable: true,
|
|
88
|
+
get: function get() {
|
|
89
|
+
return _validationStates[key];
|
|
90
|
+
}
|
|
91
|
+
});
|
|
92
|
+
});
|
|
79
93
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../src/Forms/FormElement/index.js"],"sourcesContent":["export { default } from \"./FormElement\";\nexport * from \"./context/FormElementContext\";\nexport * from \"./context/FormElementValueContext\";\nexport * from \"./context/FormElementDescriptorsContext\";\nexport * from \"./utils/FormUtils\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../src/Forms/FormElement/index.js"],"sourcesContent":["export { default } from \"./FormElement\";\nexport * from \"./context/FormElementContext\";\nexport * from \"./context/FormElementValueContext\";\nexport * from \"./context/FormElementDescriptorsContext\";\nexport * from \"./utils/FormUtils\";\nexport * from \"./validationStates\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
|
|
@@ -0,0 +1,185 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { StandardProps } from "@material-ui/core";
|
|
3
|
+
import { SliderProps, RangeProps } from "rc-slider";
|
|
4
|
+
import { HvFormStatus } from "../Forms/FormElement";
|
|
5
|
+
import { HvInputProps } from "..";
|
|
6
|
+
|
|
7
|
+
export interface KnobProperty {
|
|
8
|
+
color?: string;
|
|
9
|
+
defaultValue?: number;
|
|
10
|
+
hidden?: boolean;
|
|
11
|
+
fixed?: boolean;
|
|
12
|
+
hoverColor?: string;
|
|
13
|
+
trackColor?: string;
|
|
14
|
+
dragColor?: string;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
export interface MarkProperty {
|
|
18
|
+
position?: number;
|
|
19
|
+
label?: string;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export type HvSliderClassKey =
|
|
23
|
+
| "root"
|
|
24
|
+
| "rootRange"
|
|
25
|
+
| "labelContainer"
|
|
26
|
+
| "label"
|
|
27
|
+
| "handleContainer"
|
|
28
|
+
| "sliderRoot"
|
|
29
|
+
| "trackDragging"
|
|
30
|
+
| "rootDisabled"
|
|
31
|
+
| "trackStandBy"
|
|
32
|
+
| "error"
|
|
33
|
+
| "handleHiddenContainer"
|
|
34
|
+
| "handleContainerDisabled"
|
|
35
|
+
| "labelIncluded"
|
|
36
|
+
| "onlyInput"
|
|
37
|
+
| "dot"
|
|
38
|
+
| "rail"
|
|
39
|
+
| "knobInner"
|
|
40
|
+
| "knobOuter"
|
|
41
|
+
| "knobHidden"
|
|
42
|
+
| "knobHiddenLast"
|
|
43
|
+
| "track"
|
|
44
|
+
| "mark"
|
|
45
|
+
| "sliderTooltip"
|
|
46
|
+
| "sliderContainer";
|
|
47
|
+
|
|
48
|
+
export interface HvSliderProps
|
|
49
|
+
extends StandardProps<React.HTMLAttributes<HTMLDivElement>, HvSliderClassKey, "onChange"> {
|
|
50
|
+
/**
|
|
51
|
+
* The label of the slider element.
|
|
52
|
+
*
|
|
53
|
+
* The form element must be labeled for accessibility reasons.
|
|
54
|
+
* If not provided, an aria-label or aria-labelledby must be provided instead.
|
|
55
|
+
*/
|
|
56
|
+
label?: React.ReactNode;
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* The status of the slider element.
|
|
60
|
+
*
|
|
61
|
+
* Valid is correct, invalid is incorrect and standBy means no validations have run.
|
|
62
|
+
*
|
|
63
|
+
* When uncontrolled and unspecified it will default to "standBy" and change to either "valid"
|
|
64
|
+
* or "invalid" after any change to the state.
|
|
65
|
+
*/
|
|
66
|
+
status?: HvFormStatus;
|
|
67
|
+
/**
|
|
68
|
+
* The error message to show when `status` is "invalid".
|
|
69
|
+
*/
|
|
70
|
+
statusMessage?: React.ReactNode;
|
|
71
|
+
|
|
72
|
+
/**
|
|
73
|
+
* Whether the slider is disabled.
|
|
74
|
+
*/
|
|
75
|
+
disabled?: boolean;
|
|
76
|
+
|
|
77
|
+
/**
|
|
78
|
+
* The object created by material to apply to the component.
|
|
79
|
+
*/
|
|
80
|
+
theme?: any;
|
|
81
|
+
|
|
82
|
+
/**
|
|
83
|
+
* Name of the form element.
|
|
84
|
+
*
|
|
85
|
+
* Part of a name/value pair, should be the name property of the undelying native input.
|
|
86
|
+
*/
|
|
87
|
+
name?: string;
|
|
88
|
+
|
|
89
|
+
/**
|
|
90
|
+
* The values array to apply to the component
|
|
91
|
+
*/
|
|
92
|
+
values?: number[];
|
|
93
|
+
|
|
94
|
+
/**
|
|
95
|
+
* The default values array to apply to the component
|
|
96
|
+
*/
|
|
97
|
+
defaultValues?: number[];
|
|
98
|
+
|
|
99
|
+
/**
|
|
100
|
+
* The object used to set the knob properties,
|
|
101
|
+
* for every item in the array a new knob will be created.
|
|
102
|
+
*/
|
|
103
|
+
knobProperties?: KnobProperty[];
|
|
104
|
+
|
|
105
|
+
/**
|
|
106
|
+
* The object used to set the mark properties individually.
|
|
107
|
+
*/
|
|
108
|
+
markProperties?: MarkProperty[];
|
|
109
|
+
|
|
110
|
+
/**
|
|
111
|
+
* the function executed before a change will occur in the slider.
|
|
112
|
+
*/
|
|
113
|
+
onBeforeChange?: (value: number[]) => any;
|
|
114
|
+
|
|
115
|
+
/**
|
|
116
|
+
* the function executed while a change is occurring in the slider.
|
|
117
|
+
*/
|
|
118
|
+
onChange?: (value: number[]) => any;
|
|
119
|
+
|
|
120
|
+
/**
|
|
121
|
+
* the function executed after a change ocurred in the slider.
|
|
122
|
+
*/
|
|
123
|
+
onAfterChange?: (value: number[]) => any;
|
|
124
|
+
|
|
125
|
+
/**
|
|
126
|
+
* the separation in points between marks.
|
|
127
|
+
* example: if 10 divisions and a markstep of 2 there will be 5 marks.
|
|
128
|
+
*/
|
|
129
|
+
markStep?: number;
|
|
130
|
+
|
|
131
|
+
/**
|
|
132
|
+
* how many subdivisions there are in the slider.
|
|
133
|
+
*/
|
|
134
|
+
divisionQuantity?: number;
|
|
135
|
+
|
|
136
|
+
/**
|
|
137
|
+
* the value of the first point in the slider from left to right.
|
|
138
|
+
*/
|
|
139
|
+
minPointValue?: number;
|
|
140
|
+
|
|
141
|
+
/**
|
|
142
|
+
* the value of the last point in the slider from left to right.
|
|
143
|
+
*/
|
|
144
|
+
maxPointValue?: number;
|
|
145
|
+
|
|
146
|
+
/**
|
|
147
|
+
* the nax number of decimals if no format function is applied
|
|
148
|
+
*/
|
|
149
|
+
markDigits?: number;
|
|
150
|
+
|
|
151
|
+
/**
|
|
152
|
+
* a formatting function used to add format to the marks in the track,
|
|
153
|
+
* the function receives the mark text
|
|
154
|
+
*/
|
|
155
|
+
formatMark?: (label: React.ReactNode | string) => React.ReactNode | string;
|
|
156
|
+
|
|
157
|
+
/**
|
|
158
|
+
* a formatting function used to add format to the tooltip in the track,
|
|
159
|
+
* the function receives the mark text
|
|
160
|
+
*/
|
|
161
|
+
formatTooltip?: (label: React.ReactNode | string) => React.ReactNode | string;
|
|
162
|
+
/**
|
|
163
|
+
* if `true` the input that controls the slider is hidden.
|
|
164
|
+
*/
|
|
165
|
+
hideInput?: boolean;
|
|
166
|
+
|
|
167
|
+
/**
|
|
168
|
+
* if `true` the knobs can't have the same value, if `false` knobs can have the same value.
|
|
169
|
+
*/
|
|
170
|
+
noOverlap?: boolean;
|
|
171
|
+
/**
|
|
172
|
+
* Attributes applied to the input element.
|
|
173
|
+
*/
|
|
174
|
+
inputProps?: HvInputProps[];
|
|
175
|
+
/**
|
|
176
|
+
* Attributes applied to the knob element.
|
|
177
|
+
*/
|
|
178
|
+
knobProps?: React.HTMLAttributes<HTMLDivElement>[];
|
|
179
|
+
/**
|
|
180
|
+
* Attributes applied to the input element.
|
|
181
|
+
*/
|
|
182
|
+
sliderProps?: RangeProps | SliderProps;
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
export default function HvSlider(props: HvSliderProps): JSX.Element | null;
|