@hitachivantara/uikit-react-core 5.59.0 → 5.61.0

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.
Files changed (66) hide show
  1. package/dist/cjs/BaseCheckBox/BaseCheckBox.cjs +16 -13
  2. package/dist/cjs/BaseCheckBox/BaseCheckBox.cjs.map +1 -1
  3. package/dist/cjs/BaseCheckBox/BaseCheckBox.styles.cjs +54 -6
  4. package/dist/cjs/BaseCheckBox/BaseCheckBox.styles.cjs.map +1 -1
  5. package/dist/cjs/BaseCheckBox/icons.cjs +21 -0
  6. package/dist/cjs/BaseCheckBox/icons.cjs.map +1 -0
  7. package/dist/cjs/CheckBox/CheckBox.cjs +4 -1
  8. package/dist/cjs/CheckBox/CheckBox.cjs.map +1 -1
  9. package/dist/cjs/CheckBox/CheckBox.styles.cjs +4 -1
  10. package/dist/cjs/CheckBox/CheckBox.styles.cjs.map +1 -1
  11. package/dist/cjs/List/List.styles.cjs +1 -1
  12. package/dist/cjs/List/List.styles.cjs.map +1 -1
  13. package/dist/cjs/LoadingContainer/LoadingContainer.cjs +37 -0
  14. package/dist/cjs/LoadingContainer/LoadingContainer.cjs.map +1 -0
  15. package/dist/cjs/LoadingContainer/LoadingContainer.styles.cjs +20 -0
  16. package/dist/cjs/LoadingContainer/LoadingContainer.styles.cjs.map +1 -0
  17. package/dist/cjs/QueryBuilder/Context.cjs +1 -0
  18. package/dist/cjs/QueryBuilder/Context.cjs.map +1 -1
  19. package/dist/cjs/QueryBuilder/QueryBuilder.cjs +39 -18
  20. package/dist/cjs/QueryBuilder/QueryBuilder.cjs.map +1 -1
  21. package/dist/cjs/QueryBuilder/RuleGroup/RuleGroup.cjs.map +1 -1
  22. package/dist/cjs/QueryBuilder/types.cjs.map +1 -1
  23. package/dist/cjs/QueryBuilder/utils/index.cjs +29 -5
  24. package/dist/cjs/QueryBuilder/utils/index.cjs.map +1 -1
  25. package/dist/cjs/QueryBuilder/utils/reducer.cjs +6 -2
  26. package/dist/cjs/QueryBuilder/utils/reducer.cjs.map +1 -1
  27. package/dist/cjs/Table/hooks/useRowState.cjs +7 -0
  28. package/dist/cjs/Table/hooks/useRowState.cjs.map +1 -0
  29. package/dist/cjs/hooks/useControlled.cjs.map +1 -1
  30. package/dist/cjs/index.cjs +6 -0
  31. package/dist/cjs/index.cjs.map +1 -1
  32. package/dist/cjs/types/generic.cjs.map +1 -1
  33. package/dist/esm/BaseCheckBox/BaseCheckBox.js +13 -10
  34. package/dist/esm/BaseCheckBox/BaseCheckBox.js.map +1 -1
  35. package/dist/esm/BaseCheckBox/BaseCheckBox.styles.js +54 -6
  36. package/dist/esm/BaseCheckBox/BaseCheckBox.styles.js.map +1 -1
  37. package/dist/esm/BaseCheckBox/icons.js +21 -0
  38. package/dist/esm/BaseCheckBox/icons.js.map +1 -0
  39. package/dist/esm/CheckBox/CheckBox.js +4 -1
  40. package/dist/esm/CheckBox/CheckBox.js.map +1 -1
  41. package/dist/esm/CheckBox/CheckBox.styles.js +4 -1
  42. package/dist/esm/CheckBox/CheckBox.styles.js.map +1 -1
  43. package/dist/esm/List/List.styles.js +1 -1
  44. package/dist/esm/List/List.styles.js.map +1 -1
  45. package/dist/esm/LoadingContainer/LoadingContainer.js +38 -0
  46. package/dist/esm/LoadingContainer/LoadingContainer.js.map +1 -0
  47. package/dist/esm/LoadingContainer/LoadingContainer.styles.js +20 -0
  48. package/dist/esm/LoadingContainer/LoadingContainer.styles.js.map +1 -0
  49. package/dist/esm/QueryBuilder/Context.js +1 -0
  50. package/dist/esm/QueryBuilder/Context.js.map +1 -1
  51. package/dist/esm/QueryBuilder/QueryBuilder.js +40 -19
  52. package/dist/esm/QueryBuilder/QueryBuilder.js.map +1 -1
  53. package/dist/esm/QueryBuilder/RuleGroup/RuleGroup.js.map +1 -1
  54. package/dist/esm/QueryBuilder/types.js.map +1 -1
  55. package/dist/esm/QueryBuilder/utils/index.js +30 -6
  56. package/dist/esm/QueryBuilder/utils/index.js.map +1 -1
  57. package/dist/esm/QueryBuilder/utils/reducer.js +6 -2
  58. package/dist/esm/QueryBuilder/utils/reducer.js.map +1 -1
  59. package/dist/esm/Table/hooks/useRowState.js +7 -0
  60. package/dist/esm/Table/hooks/useRowState.js.map +1 -0
  61. package/dist/esm/hooks/useControlled.js.map +1 -1
  62. package/dist/esm/index.js +102 -96
  63. package/dist/esm/index.js.map +1 -1
  64. package/dist/esm/types/generic.js.map +1 -1
  65. package/dist/types/index.d.ts +241 -149
  66. package/package.json +5 -5
@@ -1 +1 @@
1
- {"version":3,"file":"QueryBuilder.cjs","sources":["../../../src/QueryBuilder/QueryBuilder.tsx"],"sourcesContent":["import { useEffect, useMemo, useReducer, useRef, useState } from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { isEqual } from \"../utils/helpers\";\n\nimport { ConfirmationDialog } from \"./ConfirmationDialog\";\nimport {\n HvQueryBuilderProvider,\n defaultCombinators,\n defaultLabels,\n defaultOperators,\n} from \"./Context\";\nimport { RuleGroup } from \"./RuleGroup\";\nimport {\n AskAction,\n HvQueryBuilderAttribute,\n HvQueryBuilderQuery,\n HvQueryBuilderLabels,\n HvQueryBuilderQueryCombinator,\n HvQueryBuilderQueryOperator,\n HvQueryBuilderChangedQuery,\n HvQueryBuilderRenderers,\n defaultRendererKey,\n} from \"./types\";\nimport { clearNodeIds, emptyGroup } from \"./utils\";\nimport reducer from \"./utils/reducer\";\nimport { useClasses, staticClasses } from \"./QueryBuilder.styles\";\n\nexport { staticClasses as queryBuilderClasses };\n\nexport type HvQueryBuilderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvQueryBuilderProps {\n /** The query attribute types. */\n attributes?: Record<string, HvQueryBuilderAttribute>;\n /** The query rules operators by attribute type and combinator. */\n operators?: Record<string, HvQueryBuilderQueryOperator[]>;\n /** The query combinators operands. */\n combinators?: HvQueryBuilderQueryCombinator[];\n /** The initial query representation. */\n query?: HvQueryBuilderQuery;\n /** Callback fired when query changes. */\n onChange?: (value: HvQueryBuilderChangedQuery) => void;\n /** Max depth of nested query groups. */\n maxDepth?: number;\n /** Object containing all the labels. */\n labels?: HvQueryBuilderLabels;\n /** Whether the query builder is in read-only mode. */\n readOnly?: boolean;\n /**\n * Operators that should use the empty value renderer when selected.\n *\n * When one of the listed operators is selected, the rule value is reset and an empty component is rendered.\n * This property takes priority over `renderers`.\n *\n * @default [\"Empty\", \"IsNotEmpty\"]\n * */\n emptyRenderer?: string[];\n /** Custom renderers for the rules' value. */\n renderers?: HvQueryBuilderRenderers;\n /** Whether to opt-out of the confirmation dialogs shown before removing rules and rule groups. @default false. */\n disableConfirmation?: boolean;\n /** A Jss Object used to override or extend the styles applied. */\n classes?: HvQueryBuilderClasses;\n}\n\n// TODO - v6\n// - uncontrolled vs controlled: users should be able to control the state\n// - \"query\" renamed to \"initialQuery\" and \"query\" used to control the state\n// - \"query\" provided with ids by the user but removed through \"onChange\"\n// - \"range\", \"Empty\", and \"IsNotEmpty\" operators with internal/built-in logic\n\n/**\n * This component allows you to create conditions and group them using logical operators.\n * It outputs a structured set of rules which can be easily parsed to create SQL/NoSQL/whatever queries.\n *\n * Take a look at the [usage page](https://lumada-design.github.io/uikit/master/?path=/docs/widgets-query-builder-usage--docs) to learn more about this component.\n */\nexport const HvQueryBuilder = (props: HvQueryBuilderProps) => {\n const {\n attributes,\n renderers,\n query,\n onChange,\n disableConfirmation = false,\n operators = defaultOperators,\n combinators = defaultCombinators,\n maxDepth = 1,\n labels = defaultLabels,\n readOnly = false,\n emptyRenderer = [\"Empty\", \"IsNotEmpty\"],\n classes: classesProp,\n } = useDefaultProps(\"HvQueryBuilder\", props);\n\n if (\n import.meta.env.DEV &&\n [\n Object.values(attributes || {}).map(({ type }) => type),\n Object.values(operators || {})\n .map((ops) => ops.map(({ operator }) => operator))\n .flat(),\n ]\n .flat()\n ?.find((key) => key === defaultRendererKey)\n ) {\n // eslint-disable-next-line no-console\n console.error(\n `${defaultRendererKey} is a restricted key and shouldn't be used as an attribute or operator type. Update the key to avoid unexpected behaviors.`\n );\n }\n\n const { classes } = useClasses(classesProp);\n\n const currentAttributes = useRef<HvQueryBuilderProps[\"attributes\"] | null>(\n null\n );\n\n const initialQuery = useRef(query ?? emptyGroup());\n\n const [pendingAction, setPendingAction] = useState<AskAction>();\n const [prevState, setPrevState] = useState(initialQuery.current);\n const [initialState, setInitialState] = useState(true);\n\n const [state, dispatchAction] = useReducer(\n reducer,\n // Deep clone is needed to make sure that the \"query\" prop and \"initialQuery\" are not mutated\n structuredClone(initialQuery.current)\n );\n\n const value = useMemo(\n () => ({\n dispatchAction,\n askAction: setPendingAction,\n attributes,\n operators,\n combinators,\n maxDepth,\n labels,\n initialTouched: initialState,\n readOnly,\n renderers,\n disableConfirmation,\n emptyRenderer,\n }),\n [\n attributes,\n operators,\n combinators,\n maxDepth,\n labels,\n readOnly,\n initialState,\n renderers,\n disableConfirmation,\n emptyRenderer,\n ]\n );\n\n // Keep track of attributes\n useEffect(() => {\n if (currentAttributes.current == null) {\n // First run, nothing to do\n currentAttributes.current = attributes;\n } else if (currentAttributes.current !== attributes) {\n // Attributes changed. The existing query is almost certainly invalid, so reset it\n currentAttributes.current = attributes;\n dispatchAction({ type: \"reset-query\" });\n }\n }, [attributes]);\n\n // Propagate the change if the query is modified\n useEffect(() => {\n if (!isEqual(state, prevState)) {\n if (initialState) {\n setInitialState(false);\n }\n\n onChange?.(clearNodeIds(state) as HvQueryBuilderChangedQuery);\n setPrevState(structuredClone(state));\n }\n }, [initialState, onChange, prevState, state]);\n\n const handleConfirm = () => {\n if (pendingAction) {\n setPendingAction(undefined);\n pendingAction.actions.forEach((action) => dispatchAction(action));\n }\n };\n\n const handleCancel = () => {\n setPendingAction(undefined);\n };\n\n return (\n <HvQueryBuilderProvider value={value}>\n <RuleGroup\n level={0}\n id={state.id}\n combinator={state.combinator}\n rules={state.rules}\n classes={classes}\n />\n <ConfirmationDialog\n isOpen={pendingAction != null}\n onConfirm={handleConfirm}\n onCancel={handleCancel}\n title={pendingAction?.dialog.dialogTitle || \"\"}\n message={pendingAction?.dialog.dialogMessage || \"\"}\n confirmButtonLabel={pendingAction?.dialog.dialogConfirm || \"\"}\n cancelButtonLabel={pendingAction?.dialog.dialogCancel || \"\"}\n closeButtonTooltip={pendingAction?.dialog.dialogCloseTooltip || \"\"}\n />\n </HvQueryBuilderProvider>\n );\n};\n"],"names":["defaultOperators","defaultCombinators","defaultLabels","useDefaultProps","useClasses","useRef","emptyGroup","useState","useReducer","reducer","useMemo","useEffect","isEqual","clearNodeIds","jsxs","HvQueryBuilderProvider","jsx","RuleGroup","ConfirmationDialog"],"mappings":"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"}
1
+ {"version":3,"file":"QueryBuilder.cjs","sources":["../../../src/QueryBuilder/QueryBuilder.tsx"],"sourcesContent":["import { useEffect, useMemo, useReducer, useRef, useState } from \"react\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { isEqual } from \"../utils/helpers\";\nimport { ConfirmationDialog } from \"./ConfirmationDialog\";\nimport {\n HvQueryBuilderProvider,\n defaultCombinators,\n defaultLabels,\n defaultOperators,\n} from \"./Context\";\nimport { RuleGroup } from \"./RuleGroup\";\nimport {\n AskAction,\n HvQueryBuilderAttribute,\n HvQueryBuilderQuery,\n HvQueryBuilderLabels,\n HvQueryBuilderQueryCombinator,\n HvQueryBuilderQueryOperator,\n HvQueryBuilderRenderers,\n defaultRendererKey,\n} from \"./types\";\nimport { clearNodeIds, emptyGroup, setNodeIds } from \"./utils\";\nimport reducer from \"./utils/reducer\";\nimport { useClasses, staticClasses } from \"./QueryBuilder.styles\";\nimport { useControlled } from \"../hooks/useControlled\";\n\nexport { staticClasses as queryBuilderClasses };\n\nexport type HvQueryBuilderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvQueryBuilderProps {\n /** The query attribute types. */\n attributes?: Record<string, HvQueryBuilderAttribute>;\n /** The query rules operators by attribute type and combinator. */\n operators?: Record<string, HvQueryBuilderQueryOperator[]>;\n /** The query combinators operands. */\n combinators?: HvQueryBuilderQueryCombinator[];\n /** The query when the component is controlled. */\n value?: HvQueryBuilderQuery;\n /** The initial query when the component is uncontrolled. */\n defaultValue?: HvQueryBuilderQuery;\n /**\n * The initial query when the component is uncontrolled.\n *\n * @deprecated Use `defaultValue` instead.\n * */\n query?: HvQueryBuilderQuery; // TODO - remove in v6\n /** Callback fired when the query changes. */\n onChange?: (value: HvQueryBuilderQuery) => void;\n /** Max depth of nested query groups. */\n maxDepth?: number;\n /** Object containing all the labels. */\n labels?: HvQueryBuilderLabels;\n /** Whether the query builder is in read-only mode. */\n readOnly?: boolean;\n /**\n * Operators that should use the empty value renderer when selected.\n *\n * When one of the listed operators is selected, the rule value is reset and an empty component is rendered.\n * This property takes priority over `renderers`.\n *\n * @default [\"Empty\", \"IsNotEmpty\"]\n * */\n emptyRenderer?: string[];\n /** Custom renderers for the rules' value. */\n renderers?: HvQueryBuilderRenderers;\n /** Whether to opt-out of the confirmation dialogs shown before removing rules and rule groups. @default false. */\n disableConfirmation?: boolean;\n /** A Jss Object used to override or extend the styles applied. */\n classes?: HvQueryBuilderClasses;\n}\n\n// TODO - v6\n// - \"range\", \"Empty\", and \"IsNotEmpty\" operators with internal/built-in logic\n\n// Notes:\n// Deep clone is needed throughout the component to avoid undesired mutations in props, state, and ref values\n\n/**\n * This component allows you to create conditions and group them using logical operators.\n * It outputs a structured set of rules which can be easily parsed to create SQL/NoSQL/whatever queries.\n *\n * Take a look at the [usage page](https://lumada-design.github.io/uikit/master/?path=/docs/widgets-query-builder-usage--docs) to learn more about this component.\n */\nexport const HvQueryBuilder = (props: HvQueryBuilderProps) => {\n const {\n attributes,\n renderers,\n query: queryProp, // TODO - remove in v6\n value,\n defaultValue,\n onChange,\n disableConfirmation = false,\n operators = defaultOperators,\n combinators = defaultCombinators,\n maxDepth = 1,\n labels = defaultLabels,\n readOnly = false,\n emptyRenderer = [\"Empty\", \"IsNotEmpty\"],\n classes: classesProp,\n } = useDefaultProps(\"HvQueryBuilder\", props);\n\n if (\n import.meta.env.DEV &&\n [\n Object.values(attributes || {}).map(({ type }) => type),\n Object.values(operators || {})\n .map((ops) => ops.map(({ operator }) => operator))\n .flat(),\n ]\n .flat()\n ?.find((key) => key === defaultRendererKey)\n ) {\n // eslint-disable-next-line no-console\n console.error(\n `${defaultRendererKey} is a restricted key and shouldn't be used as an attribute or operator type. Update the key to avoid unexpected behaviors.`\n );\n }\n\n const { classes } = useClasses(classesProp);\n\n const currentAttributes = useRef<HvQueryBuilderProps[\"attributes\"] | null>(\n null\n );\n\n const controlled = useRef(value != null);\n const initialQuery = useRef(\n value ?? defaultValue ?? queryProp ?? emptyGroup()\n );\n const [query, setQuery] = useControlled(value, initialQuery.current);\n const prevQuery = useRef(query);\n\n const [pendingAction, setPendingAction] = useState<AskAction>();\n const [initialState, setInitialState] = useState(true);\n\n const [state, dispatchAction] = useReducer(\n reducer,\n setNodeIds(structuredClone(initialQuery.current))\n );\n\n const contextValue = useMemo(\n () => ({\n dispatchAction,\n askAction: setPendingAction,\n attributes,\n operators,\n combinators,\n maxDepth,\n labels,\n initialTouched: initialState,\n readOnly,\n renderers,\n disableConfirmation,\n emptyRenderer,\n }),\n [\n attributes,\n operators,\n combinators,\n maxDepth,\n labels,\n readOnly,\n initialState,\n renderers,\n disableConfirmation,\n emptyRenderer,\n ]\n );\n\n // Keep track of attributes\n useEffect(() => {\n if (currentAttributes.current == null) {\n // First run, nothing to do\n currentAttributes.current = attributes;\n } else if (currentAttributes.current !== attributes) {\n // Attributes changed. The existing query is almost certainly invalid, so reset it\n currentAttributes.current = attributes;\n dispatchAction({ type: \"reset-query\" });\n }\n }, [attributes]);\n\n useEffect(() => {\n // \"value\" prop was updated by user (when controlled)\n if (!isEqual(prevQuery.current, query)) {\n dispatchAction({\n type: \"set-query\",\n query: setNodeIds(structuredClone(query), state),\n });\n prevQuery.current = query;\n } else if (\n !isEqual(\n clearNodeIds(structuredClone(state)),\n clearNodeIds(structuredClone(query))\n )\n ) {\n setInitialState(false);\n\n // TODO - remove \"true\" from clearNodeIds in v6 (only keep else statement)\n // To avoid breaking changes, clearNodeIds will delete all ids provided by the user when uncontrolled\n // In the future if the user provides ids, it doesn't make sense to remove them with onChange\n if (!controlled.current) {\n onChange?.(\n clearNodeIds(structuredClone(state), true) as HvQueryBuilderQuery\n );\n } else {\n // When controlled, the ids provided by the user are not removed. Only the auto generated ones.\n onChange?.(clearNodeIds(structuredClone(state)) as HvQueryBuilderQuery);\n }\n\n prevQuery.current = state;\n // This will only run if uncontrolled\n setQuery(state);\n }\n }, [onChange, query, setQuery, state]);\n\n const handleConfirm = () => {\n if (pendingAction) {\n setPendingAction(undefined);\n pendingAction.actions.forEach((action) => dispatchAction(action));\n }\n };\n\n const handleCancel = () => {\n setPendingAction(undefined);\n };\n\n return (\n <HvQueryBuilderProvider value={contextValue}>\n <RuleGroup\n level={0}\n id={state.id}\n combinator={state.combinator}\n rules={state.rules}\n classes={classes}\n />\n <ConfirmationDialog\n isOpen={pendingAction != null}\n onConfirm={handleConfirm}\n onCancel={handleCancel}\n title={pendingAction?.dialog.dialogTitle}\n message={pendingAction?.dialog.dialogMessage}\n confirmButtonLabel={pendingAction?.dialog.dialogConfirm}\n cancelButtonLabel={pendingAction?.dialog.dialogCancel}\n closeButtonTooltip={pendingAction?.dialog.dialogCloseTooltip}\n />\n </HvQueryBuilderProvider>\n );\n};\n"],"names":["defaultOperators","defaultCombinators","defaultLabels","useDefaultProps","useClasses","useRef","emptyGroup","useControlled","useState","useReducer","reducer","setNodeIds","useMemo","useEffect","isEqual","clearNodeIds","jsxs","HvQueryBuilderProvider","jsx","RuleGroup","ConfirmationDialog"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"RuleGroup.cjs","sources":["../../../../src/QueryBuilder/RuleGroup/RuleGroup.tsx"],"sourcesContent":["import { useCallback } from \"react\";\nimport { Add, Delete, Info } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvButton } from \"../../Button\";\nimport { HvEmptyState } from \"../../EmptyState\";\nimport { HvMultiButton } from \"../../MultiButton\";\nimport { HvTypography } from \"../../Typography\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { Rule } from \"../Rule\";\nimport { useQueryBuilderContext } from \"../Context\";\nimport { useClasses } from \"../QueryBuilder.styles\";\nimport { HvQueryBuilderQuery, HvQueryBuilderQueryCombinator } from \"../types\";\nimport { HvIconButton } from \"../../IconButton\";\n\nexport interface RuleGroupProps {\n id: React.Key;\n level?: number;\n combinator?: string;\n rules?: HvQueryBuilderQuery[\"rules\"];\n classes?: ExtractNames<typeof useClasses>;\n}\n\nexport const RuleGroup = ({\n level = 0,\n id,\n combinator = \"and\",\n rules = [],\n classes: classesProp,\n}: RuleGroupProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n const {\n dispatchAction,\n askAction,\n maxDepth,\n combinators,\n labels,\n readOnly,\n disableConfirmation,\n } = useQueryBuilderContext();\n\n const normalizedMaxDepth = maxDepth - 1;\n\n const actionButtons = (\n <>\n <div className={classes.buttonBackground}>\n <HvButton\n variant=\"secondarySubtle\"\n onClick={() => {\n dispatchAction({ type: \"add-rule\", id });\n }}\n disabled={readOnly}\n startIcon={<Add />}\n >\n {level === 0 && labels.query?.addRule?.label != null\n ? labels.query?.addRule?.label\n : labels.group.addRule.label}\n </HvButton>\n </div>\n {level <= normalizedMaxDepth && (\n <div className={classes.buttonBackground}>\n <HvButton\n variant=\"secondarySubtle\"\n onClick={() => {\n dispatchAction({ type: \"add-group\", id });\n }}\n disabled={readOnly}\n startIcon={<Add />}\n >\n {level === 0 && labels.query?.addGroup?.label != null\n ? labels.query?.addGroup?.label\n : labels.group.addGroup.label}\n </HvButton>\n </div>\n )}\n </>\n );\n\n const onClickCombinator = useCallback(\n (item: HvQueryBuilderQueryCombinator) => {\n dispatchAction({\n type: \"set-combinator\",\n id,\n combinator: item.operand,\n });\n },\n [dispatchAction, id]\n );\n\n return (\n <div\n className={cx(classes.root, {\n [classes.topGroup]: level === 0,\n [classes.subGroup]: level > 0,\n })}\n >\n <HvMultiButton\n className={cx(classes.combinator, classes.topCombinator)}\n disabled={readOnly}\n aria-disabled={readOnly}\n >\n {combinators?.map((item) => (\n <HvButton\n key={item.operand}\n className={classes.combinatorButton}\n selected={item.operand === combinator}\n onClick={() => item.operand && onClickCombinator(item)}\n disabled={readOnly}\n size=\"xs\"\n >\n {item.label}\n </HvButton>\n ))}\n </HvMultiButton>\n <div className={cx(classes.buttonBackground, classes.topRemoveButton)}>\n <HvIconButton\n className={classes.removeButton}\n onClick={() =>\n disableConfirmation\n ? dispatchAction({ type: \"remove-node\", id })\n : askAction({\n actions: [{ type: \"remove-node\", id }],\n dialog:\n level === 0 && labels.query?.delete != null\n ? labels.query.delete\n : labels.group.delete,\n })\n }\n title={\n (level === 0 && labels.query?.delete?.tooltip) ||\n labels.group.delete.tooltip ||\n (level === 0 && labels.query?.delete?.ariaLabel) ||\n labels.group.delete.ariaLabel\n }\n disabled={readOnly}\n >\n <Delete\n role=\"none\"\n className={cx({ [classes.topRemoveButtonDisabled]: readOnly })}\n />\n </HvIconButton>\n </div>\n {rules?.length > 0 && (\n <div\n className={cx(classes.rulesContainer, {\n [classes.subRulesContainer]: level > 0,\n [classes.topRulesContainer]: level === 0,\n })}\n >\n {rules.map((rule, index) => {\n if (\"combinator\" in rule) {\n return (\n <RuleGroup\n key={rule.id}\n level={level + 1}\n {...rule}\n id={rule.id}\n classes={classes}\n />\n );\n }\n\n const isInvalid =\n combinator === \"and\" &&\n rules.some((r, i) => {\n if (\"attribute\" in r) {\n if (\n r.attribute === rule.attribute &&\n r.id !== rule.id &&\n i < index\n ) {\n return true;\n }\n }\n return false;\n });\n\n return (\n <Rule\n key={rule.id}\n {...rule}\n isInvalid={isInvalid}\n id={rule.id}\n combinator={combinator}\n />\n );\n })}\n </div>\n )}\n {rules?.length === 0 && (\n <HvEmptyState\n title={labels.empty?.title}\n message={\n <>\n <HvTypography\n link\n component=\"button\"\n onClick={() => {\n dispatchAction({ type: \"add-rule\", id });\n }}\n className={classes.createConditionButton}\n disabled={readOnly}\n aria-disabled={readOnly}\n >\n {`${labels.empty?.createCondition}`}\n </HvTypography>\n {level <= normalizedMaxDepth && (\n <>\n {`${labels.empty?.spacer}`}\n <HvTypography\n link\n component=\"button\"\n onClick={() => {\n dispatchAction({ type: \"add-group\", id });\n }}\n className={classes.createGroupButton}\n disabled={readOnly}\n aria-disabled={readOnly}\n >\n {`${labels.empty?.createGroup}`}\n </HvTypography>\n </>\n )}\n </>\n }\n icon={<Info />}\n />\n )}\n <div\n className={cx(\n classes.actionButtonContainer,\n classes.topActionButtonContainer\n )}\n >\n {actionButtons}\n </div>\n </div>\n );\n};\n"],"names":["useClasses","useQueryBuilderContext","jsxs","Fragment","jsx","HvButton","Add","useCallback","HvMultiButton","HvIconButton","Delete","Rule","HvEmptyState","HvTypography","Info"],"mappings":"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"}
1
+ {"version":3,"file":"RuleGroup.cjs","sources":["../../../../src/QueryBuilder/RuleGroup/RuleGroup.tsx"],"sourcesContent":["import { useCallback } from \"react\";\nimport { Add, Delete, Info } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvButton } from \"../../Button\";\nimport { HvEmptyState } from \"../../EmptyState\";\nimport { HvMultiButton } from \"../../MultiButton\";\nimport { HvTypography } from \"../../Typography\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { Rule } from \"../Rule\";\nimport { useQueryBuilderContext } from \"../Context\";\nimport { useClasses } from \"../QueryBuilder.styles\";\nimport { HvQueryBuilderQueryCombinator, Query } from \"../types\";\nimport { HvIconButton } from \"../../IconButton\";\n\nexport interface RuleGroupProps {\n id: React.Key;\n level?: number;\n combinator?: string;\n rules?: Query[\"rules\"];\n classes?: ExtractNames<typeof useClasses>;\n}\n\nexport const RuleGroup = ({\n level = 0,\n id,\n combinator = \"and\",\n rules = [],\n classes: classesProp,\n}: RuleGroupProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n const {\n dispatchAction,\n askAction,\n maxDepth,\n combinators,\n labels,\n readOnly,\n disableConfirmation,\n } = useQueryBuilderContext();\n\n const normalizedMaxDepth = maxDepth - 1;\n\n const actionButtons = (\n <>\n <div className={classes.buttonBackground}>\n <HvButton\n variant=\"secondarySubtle\"\n onClick={() => {\n dispatchAction({ type: \"add-rule\", id });\n }}\n disabled={readOnly}\n startIcon={<Add />}\n >\n {level === 0 && labels.query?.addRule?.label != null\n ? labels.query?.addRule?.label\n : labels.group.addRule.label}\n </HvButton>\n </div>\n {level <= normalizedMaxDepth && (\n <div className={classes.buttonBackground}>\n <HvButton\n variant=\"secondarySubtle\"\n onClick={() => {\n dispatchAction({ type: \"add-group\", id });\n }}\n disabled={readOnly}\n startIcon={<Add />}\n >\n {level === 0 && labels.query?.addGroup?.label != null\n ? labels.query?.addGroup?.label\n : labels.group.addGroup.label}\n </HvButton>\n </div>\n )}\n </>\n );\n\n const onClickCombinator = useCallback(\n (item: HvQueryBuilderQueryCombinator) => {\n dispatchAction({\n type: \"set-combinator\",\n id,\n combinator: item.operand,\n });\n },\n [dispatchAction, id]\n );\n\n return (\n <div\n className={cx(classes.root, {\n [classes.topGroup]: level === 0,\n [classes.subGroup]: level > 0,\n })}\n >\n <HvMultiButton\n className={cx(classes.combinator, classes.topCombinator)}\n disabled={readOnly}\n aria-disabled={readOnly}\n >\n {combinators?.map((item) => (\n <HvButton\n key={item.operand}\n className={classes.combinatorButton}\n selected={item.operand === combinator}\n onClick={() => item.operand && onClickCombinator(item)}\n disabled={readOnly}\n size=\"xs\"\n >\n {item.label}\n </HvButton>\n ))}\n </HvMultiButton>\n <div className={cx(classes.buttonBackground, classes.topRemoveButton)}>\n <HvIconButton\n className={classes.removeButton}\n onClick={() =>\n disableConfirmation\n ? dispatchAction({ type: \"remove-node\", id })\n : askAction({\n actions: [{ type: \"remove-node\", id }],\n dialog:\n level === 0 && labels.query?.delete != null\n ? labels.query.delete\n : labels.group.delete,\n })\n }\n title={\n (level === 0 && labels.query?.delete?.tooltip) ||\n labels.group.delete.tooltip ||\n (level === 0 && labels.query?.delete?.ariaLabel) ||\n labels.group.delete.ariaLabel\n }\n disabled={readOnly}\n >\n <Delete\n role=\"none\"\n className={cx({ [classes.topRemoveButtonDisabled]: readOnly })}\n />\n </HvIconButton>\n </div>\n {rules?.length > 0 && (\n <div\n className={cx(classes.rulesContainer, {\n [classes.subRulesContainer]: level > 0,\n [classes.topRulesContainer]: level === 0,\n })}\n >\n {rules.map((rule, index) => {\n if (\"combinator\" in rule) {\n return (\n <RuleGroup\n key={rule.id}\n level={level + 1}\n {...rule}\n id={rule.id}\n classes={classes}\n />\n );\n }\n\n const isInvalid =\n combinator === \"and\" &&\n rules.some((r, i) => {\n if (\"attribute\" in r) {\n if (\n r.attribute === rule.attribute &&\n r.id !== rule.id &&\n i < index\n ) {\n return true;\n }\n }\n return false;\n });\n\n return (\n <Rule\n key={rule.id}\n {...rule}\n isInvalid={isInvalid}\n id={rule.id}\n combinator={combinator}\n />\n );\n })}\n </div>\n )}\n {rules?.length === 0 && (\n <HvEmptyState\n title={labels.empty?.title}\n message={\n <>\n <HvTypography\n link\n component=\"button\"\n onClick={() => {\n dispatchAction({ type: \"add-rule\", id });\n }}\n className={classes.createConditionButton}\n disabled={readOnly}\n aria-disabled={readOnly}\n >\n {`${labels.empty?.createCondition}`}\n </HvTypography>\n {level <= normalizedMaxDepth && (\n <>\n {`${labels.empty?.spacer}`}\n <HvTypography\n link\n component=\"button\"\n onClick={() => {\n dispatchAction({ type: \"add-group\", id });\n }}\n className={classes.createGroupButton}\n disabled={readOnly}\n aria-disabled={readOnly}\n >\n {`${labels.empty?.createGroup}`}\n </HvTypography>\n </>\n )}\n </>\n }\n icon={<Info />}\n />\n )}\n <div\n className={cx(\n classes.actionButtonContainer,\n classes.topActionButtonContainer\n )}\n >\n {actionButtons}\n </div>\n </div>\n );\n};\n"],"names":["useClasses","useQueryBuilderContext","jsxs","Fragment","jsx","HvButton","Add","useCallback","HvMultiButton","HvIconButton","Delete","Rule","HvEmptyState","HvTypography","Info"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"types.cjs","sources":["../../../src/QueryBuilder/types.ts"],"sourcesContent":["export const defaultRendererKey = \"DEFAULT\";\n\nconst defaultAttributes = [\n \"boolean\",\n \"numeric\",\n \"dateandtime\",\n \"text\",\n \"textarea\",\n] as const;\ntype DefaultAttributes = (typeof defaultAttributes)[number];\n\nexport interface HvQueryBuilderAttribute extends Record<string, unknown> {\n id?: string;\n label: string;\n type: DefaultAttributes | (string & {});\n}\n\nexport interface HvQueryBuilderNumericRange {\n from: number | string;\n to: number | string;\n}\n\nexport interface HvQueryBuilderDateTimeStrings {\n date?: string;\n time?: string;\n}\n\nexport interface HvQueryBuilderDateTimeRange {\n start?: HvQueryBuilderDateTimeStrings;\n end?: HvQueryBuilderDateTimeStrings;\n}\n\nexport type HvQueryBuilderQueryRuleValue =\n | string\n | number\n | boolean\n | HvQueryBuilderNumericRange\n | HvQueryBuilderDateTimeStrings\n | HvQueryBuilderDateTimeRange;\n\nexport interface HvQueryBuilderQueryRule {\n id: React.Key;\n attribute?: string;\n operator?: string;\n value?: HvQueryBuilderQueryRuleValue;\n}\n\nexport interface HvQueryBuilderQueryGroup {\n id: React.Key;\n combinator: string;\n rules: Array<HvQueryBuilderQueryRule | HvQueryBuilderQueryGroup>;\n}\n\nexport type HvQueryBuilderQuery = HvQueryBuilderQueryGroup;\n\nexport interface HvQueryBuilderChangedQuery\n extends Omit<HvQueryBuilderQuery, \"id\" | \"rules\"> {\n rules: Array<\n Omit<HvQueryBuilderQueryRule, \"id\"> | HvQueryBuilderChangedQuery\n >;\n}\n\nexport interface HvQueryBuilderQueryCombinator {\n operand: string;\n label: string;\n}\n\nexport interface HvQueryBuilderQueryOperator {\n operator: string;\n label: string;\n combinators: string[];\n}\n\ninterface DialogLabels {\n dialogTitle: string;\n dialogMessage: string;\n dialogConfirm: string;\n dialogCancel: string;\n dialogCloseTooltip: string;\n}\n\n/** @private label structure action icon buttons */\ninterface ActionIconLabels extends DialogLabels {\n // TODO: remove in v6 - duplicated labels - `tooltip` *is* the aria-label\n /** @deprecated use `tooltip` label instead */\n ariaLabel: string;\n tooltip?: string;\n}\n\nexport type QueryAction =\n | {\n type: \"reset-query\";\n }\n | {\n type: \"reset-group\";\n id: React.Key;\n }\n | {\n type: \"add-rule\" | \"add-group\" | \"remove-node\";\n id: React.Key;\n }\n | {\n type: \"set-combinator\";\n id: React.Key;\n combinator: string;\n }\n | {\n type: \"set-attribute\";\n id: React.Key;\n attribute?: string | null;\n operator?: string | null;\n value?: HvQueryBuilderQueryRuleValue | null;\n }\n | {\n type: \"set-operator\";\n id: React.Key;\n operator: string | null;\n value?: HvQueryBuilderQueryRuleValue | null;\n }\n | {\n type: \"set-value\";\n id: React.Key;\n value: HvQueryBuilderQueryRuleValue | null | any;\n };\n\nexport interface AskAction {\n actions: QueryAction[];\n dialog: DialogLabels;\n}\n\nexport interface HvQueryBuilderLabels {\n query?: {\n delete?: ActionIconLabels;\n addRule?: {\n label: string;\n };\n addGroup?: {\n label: string;\n };\n };\n rule: {\n attribute: {\n exists: string;\n label: string;\n placeholder: string;\n };\n operator: {\n label: string;\n placeholder: string;\n };\n value: {\n distance: {\n label: string;\n placeholder?: string;\n connectorText: string;\n button: string;\n validation: {\n required: string;\n invalid: string;\n };\n };\n text: {\n label: string;\n placeholder: string;\n validation: {\n required: string;\n };\n };\n boolean: {\n label: string;\n placeholder: string;\n options: Record<string, string>;\n };\n numeric: {\n label: string;\n placeholder: string;\n validation: {\n required: string;\n invalid: string;\n equal: string;\n greaterThan: string;\n };\n range: {\n leftLabel: string;\n rightLabel: string;\n };\n };\n datetime: {\n dateLabel: string;\n datePlaceholder: string;\n timeLabel: string;\n timePlaceholder: string;\n startDateLabel: string;\n startDatePlaceholder: string;\n startTimeLabel: string;\n startTimePlaceholder: string;\n endDateLabel: string;\n endDatePlaceholder: string;\n endTimeLabel: string;\n endTimePlaceholder: string;\n validation: {\n required: string;\n invalidInterval: string;\n };\n };\n };\n delete: ActionIconLabels;\n };\n group: {\n delete: ActionIconLabels;\n reset: ActionIconLabels;\n addRule: {\n label: string;\n };\n addGroup: {\n label: string;\n };\n };\n empty: {\n title: string;\n createCondition: string;\n createGroup: string;\n spacer: string;\n };\n}\n\nexport interface HvQueryBuilderRendererProps<V = any> {\n id: React.Key;\n attribute: string;\n operator?: string;\n value?: V;\n}\n\nexport type ValueRenderer =\n | React.FC<HvQueryBuilderRendererProps>\n | Record<string, React.FC<HvQueryBuilderRendererProps>>;\n\nexport type HvQueryBuilderRenderers = Record<string, ValueRenderer>;\n"],"names":[],"mappings":";;AAAO,MAAM,qBAAqB;;"}
1
+ {"version":3,"file":"types.cjs","sources":["../../../src/QueryBuilder/types.ts"],"sourcesContent":["import { HvOptional } from \"../types/generic\";\n\nexport const defaultRendererKey = \"DEFAULT\";\n\nconst defaultAttributes = [\n \"boolean\",\n \"numeric\",\n \"dateandtime\",\n \"text\",\n \"textarea\",\n] as const;\ntype DefaultAttributes = (typeof defaultAttributes)[number];\n\nexport interface HvQueryBuilderAttribute extends Record<string, unknown> {\n id?: string;\n label: string;\n type: DefaultAttributes | (string & {});\n}\n\nexport interface HvQueryBuilderNumericRange {\n from: number | string;\n to: number | string;\n}\n\nexport interface HvQueryBuilderDateTimeStrings {\n date?: string;\n time?: string;\n}\n\nexport interface HvQueryBuilderDateTimeRange {\n start?: HvQueryBuilderDateTimeStrings;\n end?: HvQueryBuilderDateTimeStrings;\n}\n\nexport type HvQueryBuilderQueryRuleValue =\n | string\n | number\n | boolean\n | HvQueryBuilderNumericRange\n | HvQueryBuilderDateTimeStrings\n | HvQueryBuilderDateTimeRange;\n\nexport type HvQueryBuilderQueryRule = HvOptional<QueryRule, \"id\">;\n\nexport interface HvQueryBuilderQueryGroup\n extends Omit<HvOptional<QueryGroup, \"id\">, \"rules\"> {\n rules: Array<HvQueryBuilderQueryRule | HvQueryBuilderQueryGroup>;\n}\n\nexport type HvQueryBuilderQuery = HvQueryBuilderQueryGroup;\n\nexport interface QueryRule {\n id: React.Key;\n attribute?: string;\n operator?: string;\n value?: HvQueryBuilderQueryRuleValue;\n}\n\nexport interface QueryGroup {\n id: React.Key;\n combinator: string;\n rules: Array<QueryRule | QueryGroup>;\n}\n\nexport type Query = QueryGroup;\n\n// TODO - remove this type in v6\n/** @deprecated */\nexport interface HvQueryBuilderChangedQuery\n extends Omit<HvQueryBuilderQuery, \"id\" | \"rules\"> {\n rules: Array<\n Omit<HvQueryBuilderQueryRule, \"id\"> | HvQueryBuilderChangedQuery\n >;\n}\n\nexport interface HvQueryBuilderQueryCombinator {\n operand: string;\n label: string;\n}\n\nexport interface HvQueryBuilderQueryOperator {\n operator: string;\n label: string;\n combinators: string[];\n}\n\ninterface DialogLabels {\n dialogTitle: string;\n dialogMessage: string;\n dialogConfirm: string;\n dialogCancel: string;\n dialogCloseTooltip: string;\n}\n\n/** @private label structure action icon buttons */\ninterface ActionIconLabels extends DialogLabels {\n // TODO: remove in v6 - duplicated labels - `tooltip` *is* the aria-label\n /** @deprecated use `tooltip` label instead */\n ariaLabel: string;\n tooltip?: string;\n}\n\nexport type QueryAction =\n | {\n type: \"reset-query\";\n }\n | {\n type: \"reset-group\";\n id: React.Key;\n }\n | {\n type: \"add-rule\" | \"add-group\" | \"remove-node\";\n id: React.Key;\n }\n | {\n type: \"set-combinator\";\n id: React.Key;\n combinator: string;\n }\n | {\n type: \"set-attribute\";\n id: React.Key;\n attribute?: string | null;\n operator?: string | null;\n value?: HvQueryBuilderQueryRuleValue | null;\n }\n | {\n type: \"set-operator\";\n id: React.Key;\n operator: string | null;\n value?: HvQueryBuilderQueryRuleValue | null;\n }\n | {\n type: \"set-value\";\n id: React.Key;\n value: HvQueryBuilderQueryRuleValue | null | any;\n }\n | {\n type: \"set-query\";\n // Query with ids\n query: Query;\n };\n\nexport interface AskAction {\n actions: QueryAction[];\n dialog: DialogLabels;\n}\n\nexport interface HvQueryBuilderLabels {\n query?: {\n delete?: ActionIconLabels;\n addRule?: {\n label: string;\n };\n addGroup?: {\n label: string;\n };\n };\n rule: {\n attribute: {\n exists: string;\n label: string;\n placeholder: string;\n };\n operator: {\n label: string;\n placeholder: string;\n };\n value: {\n distance: {\n label: string;\n placeholder?: string;\n connectorText: string;\n button: string;\n validation: {\n required: string;\n invalid: string;\n };\n };\n text: {\n label: string;\n placeholder: string;\n validation: {\n required: string;\n };\n };\n boolean: {\n label: string;\n placeholder: string;\n options: Record<string, string>;\n };\n numeric: {\n label: string;\n placeholder: string;\n validation: {\n required: string;\n invalid: string;\n equal: string;\n greaterThan: string;\n };\n range: {\n leftLabel: string;\n rightLabel: string;\n };\n };\n datetime: {\n dateLabel: string;\n datePlaceholder: string;\n timeLabel: string;\n timePlaceholder: string;\n startDateLabel: string;\n startDatePlaceholder: string;\n startTimeLabel: string;\n startTimePlaceholder: string;\n endDateLabel: string;\n endDatePlaceholder: string;\n endTimeLabel: string;\n endTimePlaceholder: string;\n validation: {\n required: string;\n invalidInterval: string;\n };\n };\n };\n delete: ActionIconLabels;\n };\n group: {\n delete: ActionIconLabels;\n reset: ActionIconLabels;\n addRule: {\n label: string;\n };\n addGroup: {\n label: string;\n };\n };\n empty: {\n title: string;\n createCondition: string;\n createGroup: string;\n spacer: string;\n };\n}\n\nexport interface HvQueryBuilderRendererProps<V = any> {\n id: React.Key;\n attribute: string;\n operator?: string;\n value?: V;\n}\n\nexport type ValueRenderer =\n | React.FC<HvQueryBuilderRendererProps>\n | Record<string, React.FC<HvQueryBuilderRendererProps>>;\n\nexport type HvQueryBuilderRenderers = Record<string, ValueRenderer>;\n"],"names":[],"mappings":";;AAEO,MAAM,qBAAqB;;"}
@@ -1,22 +1,45 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
+ const helpers = require("../../utils/helpers.cjs");
3
4
  const isBigList = (values) => values != null && values?.length > 10;
5
+ const ID_PREFIX = "@hv_";
6
+ const createId = () => helpers.uniqueId(ID_PREFIX);
4
7
  const emptyRule = () => ({
5
- id: Math.random()
8
+ id: createId()
6
9
  });
7
10
  const emptyGroup = (createEmptyRule = false) => ({
8
- id: Math.random(),
11
+ id: createId(),
9
12
  combinator: "and",
10
13
  rules: createEmptyRule ? [emptyRule()] : []
11
14
  });
12
- const clearNodeIds = (original) => {
15
+ const clearNodeIds = (original, full = false) => {
13
16
  const rule = { ...original };
14
- delete rule.id;
17
+ if (!full && rule.id?.toString().startsWith(ID_PREFIX) || full) {
18
+ delete rule.id;
19
+ }
15
20
  if ("rules" in rule) {
16
- rule.rules = rule.rules.map((r) => clearNodeIds(r));
21
+ rule.rules = rule.rules.map((r) => clearNodeIds(r, full));
17
22
  }
18
23
  return rule;
19
24
  };
25
+ const isQueryGroup = (value) => "rules" in value;
26
+ const setNodeIds = (query, prevQuery) => {
27
+ if (!query.id) {
28
+ query.id = prevQuery && prevQuery?.id && helpers.isEqual(
29
+ clearNodeIds(structuredClone(query)),
30
+ clearNodeIds(structuredClone(prevQuery))
31
+ ) ? prevQuery.id : createId();
32
+ }
33
+ if (isQueryGroup(query)) {
34
+ query.rules = query.rules.map(
35
+ (item, idx) => setNodeIds(
36
+ item,
37
+ prevQuery && isQueryGroup(prevQuery) ? prevQuery.rules[idx] : void 0
38
+ )
39
+ );
40
+ }
41
+ return query;
42
+ };
20
43
  const findNodeById = (id, node) => {
21
44
  if (node.id === id) {
22
45
  return node;
@@ -54,3 +77,4 @@ exports.emptyRule = emptyRule;
54
77
  exports.findNodeById = findNodeById;
55
78
  exports.findParentById = findParentById;
56
79
  exports.isBigList = isBigList;
80
+ exports.setNodeIds = setNodeIds;
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":["../../../../src/QueryBuilder/utils/index.tsx"],"sourcesContent":["import { HvQueryBuilderQueryGroup, HvQueryBuilderQueryRule } from \"../types\";\n\nexport const isBigList = (values: unknown[]) =>\n values != null && values?.length > 10;\n\nexport const emptyRule = () => ({\n id: Math.random(),\n});\n\nexport const emptyGroup = (createEmptyRule = false) => ({\n id: Math.random(),\n combinator: \"and\",\n rules: createEmptyRule ? [emptyRule()] : [],\n});\n\nexport const clearNodeIds = (\n original: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule\n) => {\n const rule = { ...original };\n\n // @ts-ignore\n delete rule.id;\n\n if (\"rules\" in rule) {\n rule.rules = rule.rules.map((r) => clearNodeIds(r));\n }\n\n return rule;\n};\n\nexport const findNodeById = (\n id: React.Key,\n node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule\n) => {\n if (node.id === id) {\n return node;\n }\n if (\"rules\" in node) {\n for (let i = 0; i < node.rules.length; ++i) {\n const rule = node.rules[i];\n\n const found = findNodeById(id, rule);\n if (found) {\n return found;\n }\n }\n }\n\n return null;\n};\n\nexport const findParentById = (\n id: React.Key,\n node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n parent?: HvQueryBuilderQueryGroup\n) => {\n if (node.id === id) {\n return parent ?? null;\n }\n\n if (\"rules\" in node) {\n const group = node;\n\n for (let i = 0; i < group.rules.length; ++i) {\n const rule = group.rules[i];\n\n const found = findParentById(id, rule, group);\n if (found) {\n return found;\n }\n }\n }\n\n return null;\n};\n"],"names":[],"mappings":";;AAEO,MAAM,YAAY,CAAC,WACxB,UAAU,QAAQ,QAAQ,SAAS;AAE9B,MAAM,YAAY,OAAO;AAAA,EAC9B,IAAI,KAAK,OAAO;AAClB;AAEa,MAAA,aAAa,CAAC,kBAAkB,WAAW;AAAA,EACtD,IAAI,KAAK,OAAO;AAAA,EAChB,YAAY;AAAA,EACZ,OAAO,kBAAkB,CAAC,UAAU,CAAC,IAAI,CAAC;AAC5C;AAEa,MAAA,eAAe,CAC1B,aACG;AACG,QAAA,OAAO,EAAE,GAAG;AAGlB,SAAO,KAAK;AAEZ,MAAI,WAAW,MAAM;AACd,SAAA,QAAQ,KAAK,MAAM,IAAI,CAAC,MAAM,aAAa,CAAC,CAAC;AAAA,EACpD;AAEO,SAAA;AACT;AAEa,MAAA,eAAe,CAC1B,IACA,SACG;AACC,MAAA,KAAK,OAAO,IAAI;AACX,WAAA;AAAA,EACT;AACA,MAAI,WAAW,MAAM;AACnB,aAAS,IAAI,GAAG,IAAI,KAAK,MAAM,QAAQ,EAAE,GAAG;AACpC,YAAA,OAAO,KAAK,MAAM,CAAC;AAEnB,YAAA,QAAQ,aAAa,IAAI,IAAI;AACnC,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;AAEO,MAAM,iBAAiB,CAC5B,IACA,MACA,WACG;AACC,MAAA,KAAK,OAAO,IAAI;AAClB,WAAO,UAAU;AAAA,EACnB;AAEA,MAAI,WAAW,MAAM;AACnB,UAAM,QAAQ;AAEd,aAAS,IAAI,GAAG,IAAI,MAAM,MAAM,QAAQ,EAAE,GAAG;AACrC,YAAA,OAAO,MAAM,MAAM,CAAC;AAE1B,YAAM,QAAQ,eAAe,IAAI,MAAM,KAAK;AAC5C,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;;;;;;;"}
1
+ {"version":3,"file":"index.cjs","sources":["../../../../src/QueryBuilder/utils/index.tsx"],"sourcesContent":["import { isEqual, uniqueId } from \"../../utils/helpers\";\nimport {\n HvQueryBuilderQueryGroup,\n HvQueryBuilderQueryRule,\n Query,\n} from \"../types\";\n\nexport const isBigList = (values: unknown[]) =>\n values != null && values?.length > 10;\n\nconst ID_PREFIX = \"@hv_\";\nconst createId = () => uniqueId(ID_PREFIX);\n\nexport const emptyRule = () => ({\n id: createId(),\n});\n\nexport const emptyGroup = (createEmptyRule = false) => ({\n id: createId(),\n combinator: \"and\",\n rules: createEmptyRule ? [emptyRule()] : [],\n});\n\nexport const clearNodeIds = (\n original: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n full: boolean = false\n) => {\n const rule = { ...original };\n\n if ((!full && rule.id?.toString().startsWith(ID_PREFIX)) || full) {\n delete rule.id;\n }\n\n if (\"rules\" in rule) {\n rule.rules = rule.rules.map((r) => clearNodeIds(r, full));\n }\n\n return rule;\n};\n\nconst isQueryGroup = (\n value: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule\n): value is HvQueryBuilderQueryGroup => \"rules\" in value;\n\nexport const setNodeIds = (\n query: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n prevQuery?: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule\n): Query => {\n // Use already existing autogenerated id when possible\n if (!query.id) {\n query.id =\n prevQuery &&\n prevQuery?.id &&\n isEqual(\n clearNodeIds(structuredClone(query)),\n clearNodeIds(structuredClone(prevQuery))\n )\n ? prevQuery.id\n : createId();\n }\n\n if (isQueryGroup(query)) {\n query.rules = query.rules.map((item, idx) =>\n setNodeIds(\n item,\n prevQuery && isQueryGroup(prevQuery) ? prevQuery.rules[idx] : undefined\n )\n );\n }\n\n return query as Query;\n};\n\nexport const findNodeById = (\n id: React.Key,\n node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule\n) => {\n if (node.id === id) {\n return node;\n }\n if (\"rules\" in node) {\n for (let i = 0; i < node.rules.length; ++i) {\n const rule = node.rules[i];\n\n const found = findNodeById(id, rule);\n if (found) {\n return found;\n }\n }\n }\n\n return null;\n};\n\nexport const findParentById = (\n id: React.Key,\n node: HvQueryBuilderQueryGroup | HvQueryBuilderQueryRule,\n parent?: HvQueryBuilderQueryGroup\n) => {\n if (node.id === id) {\n return parent ?? null;\n }\n\n if (\"rules\" in node) {\n const group = node;\n\n for (let i = 0; i < group.rules.length; ++i) {\n const rule = group.rules[i];\n\n const found = findParentById(id, rule, group);\n if (found) {\n return found;\n }\n }\n }\n\n return null;\n};\n"],"names":["uniqueId","isEqual"],"mappings":";;;AAOO,MAAM,YAAY,CAAC,WACxB,UAAU,QAAQ,QAAQ,SAAS;AAErC,MAAM,YAAY;AAClB,MAAM,WAAW,MAAMA,iBAAS,SAAS;AAElC,MAAM,YAAY,OAAO;AAAA,EAC9B,IAAI,SAAS;AACf;AAEa,MAAA,aAAa,CAAC,kBAAkB,WAAW;AAAA,EACtD,IAAI,SAAS;AAAA,EACb,YAAY;AAAA,EACZ,OAAO,kBAAkB,CAAC,UAAU,CAAC,IAAI,CAAC;AAC5C;AAEO,MAAM,eAAe,CAC1B,UACA,OAAgB,UACb;AACG,QAAA,OAAO,EAAE,GAAG;AAEb,MAAA,CAAC,QAAQ,KAAK,IAAI,WAAW,WAAW,SAAS,KAAM,MAAM;AAChE,WAAO,KAAK;AAAA,EACd;AAEA,MAAI,WAAW,MAAM;AACd,SAAA,QAAQ,KAAK,MAAM,IAAI,CAAC,MAAM,aAAa,GAAG,IAAI,CAAC;AAAA,EAC1D;AAEO,SAAA;AACT;AAEA,MAAM,eAAe,CACnB,UACsC,WAAW;AAEtC,MAAA,aAAa,CACxB,OACA,cACU;AAEN,MAAA,CAAC,MAAM,IAAI;AACP,UAAA,KACJ,aACA,WAAW,MACXC,QAAA;AAAA,MACE,aAAa,gBAAgB,KAAK,CAAC;AAAA,MACnC,aAAa,gBAAgB,SAAS,CAAC;AAAA,IAAA,IAErC,UAAU,KACV;EACR;AAEI,MAAA,aAAa,KAAK,GAAG;AACjB,UAAA,QAAQ,MAAM,MAAM;AAAA,MAAI,CAAC,MAAM,QACnC;AAAA,QACE;AAAA,QACA,aAAa,aAAa,SAAS,IAAI,UAAU,MAAM,GAAG,IAAI;AAAA,MAChE;AAAA,IAAA;AAAA,EAEJ;AAEO,SAAA;AACT;AAEa,MAAA,eAAe,CAC1B,IACA,SACG;AACC,MAAA,KAAK,OAAO,IAAI;AACX,WAAA;AAAA,EACT;AACA,MAAI,WAAW,MAAM;AACnB,aAAS,IAAI,GAAG,IAAI,KAAK,MAAM,QAAQ,EAAE,GAAG;AACpC,YAAA,OAAO,KAAK,MAAM,CAAC;AAEnB,YAAA,QAAQ,aAAa,IAAI,IAAI;AACnC,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;AAEO,MAAM,iBAAiB,CAC5B,IACA,MACA,WACG;AACC,MAAA,KAAK,OAAO,IAAI;AAClB,WAAO,UAAU;AAAA,EACnB;AAEA,MAAI,WAAW,MAAM;AACnB,UAAM,QAAQ;AAEd,aAAS,IAAI,GAAG,IAAI,MAAM,MAAM,QAAQ,EAAE,GAAG;AACrC,YAAA,OAAO,MAAM,MAAM,CAAC;AAE1B,YAAM,QAAQ,eAAe,IAAI,MAAM,KAAK;AAC5C,UAAI,OAAO;AACF,eAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF;AAEO,SAAA;AACT;;;;;;;;"}
@@ -2,11 +2,13 @@
2
2
  Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
3
3
  const index = require("./index.cjs");
4
4
  const reducer = (state, action) => {
5
- const query = { ...state };
5
+ const query = structuredClone(state);
6
6
  switch (action.type) {
7
7
  case "reset-query": {
8
8
  return index.emptyGroup();
9
9
  }
10
+ case "set-query":
11
+ return action.query;
10
12
  case "reset-group": {
11
13
  const group = index.findNodeById(action.id, query);
12
14
  if (group && "rules" in group) {
@@ -78,7 +80,9 @@ const reducer = (state, action) => {
78
80
  case "set-value": {
79
81
  const node = index.findNodeById(action.id, query);
80
82
  if (node && "operator" in node) {
81
- node.value = action.value ?? void 0;
83
+ if ("value" in node) {
84
+ node.value = action.value ?? void 0;
85
+ }
82
86
  return query;
83
87
  }
84
88
  break;
@@ -1 +1 @@
1
- {"version":3,"file":"reducer.cjs","sources":["../../../../src/QueryBuilder/utils/reducer.tsx"],"sourcesContent":["import { Reducer } from \"react\";\n\nimport { emptyRule, emptyGroup, findNodeById, findParentById } from \"./index\";\nimport { HvQueryBuilderQuery, QueryAction } from \"../types\";\n\nconst reducer: Reducer<HvQueryBuilderQuery, QueryAction> = (state, action) => {\n const query = { ...state };\n\n switch (action.type) {\n case \"reset-query\": {\n return emptyGroup();\n }\n case \"reset-group\": {\n const group = findNodeById(action.id, query);\n if (group && \"rules\" in group) {\n group.rules = [emptyRule()];\n\n return query;\n }\n break;\n }\n case \"add-rule\": {\n const group = findNodeById(action.id, query);\n if (group && \"rules\" in group) {\n const rule = emptyRule();\n\n group.rules.push(rule);\n\n return query;\n }\n break;\n }\n case \"add-group\": {\n const group = findNodeById(action.id, query);\n if (group && \"rules\" in group) {\n group.rules.push(emptyGroup(true));\n\n return query;\n }\n break;\n }\n case \"remove-node\": {\n const parent = findParentById(action.id, query);\n if (parent) {\n parent.rules = parent.rules.filter((rule) => rule.id !== action.id);\n\n return query;\n }\n\n // reset query if deleting top node\n return emptyGroup();\n }\n case \"set-combinator\": {\n const node = findNodeById(action.id, query);\n if (node && \"combinator\" in node) {\n if (node.combinator !== action.combinator) {\n node.combinator = action.combinator;\n\n return query;\n }\n }\n break;\n }\n case \"set-attribute\": {\n const node = findNodeById(action.id, query);\n if (node && node.attribute !== action.attribute) {\n node.attribute = action.attribute ?? undefined;\n\n // we keep the operator and value unless the operator is explicitly null (or set)\n if (action.operator !== undefined) {\n node.operator = action.operator ?? undefined;\n node.value = action.value ?? undefined;\n }\n\n return query;\n }\n break;\n }\n case \"set-operator\": {\n const node = findNodeById(action.id, query);\n if (node && \"attribute\" in node) {\n if (node.operator !== action.operator) {\n node.operator = action.operator;\n if (action.value !== undefined) {\n node.value = action.value ?? undefined;\n }\n\n return query;\n }\n }\n break;\n }\n case \"set-value\": {\n const node = findNodeById(action.id, query);\n if (node && \"operator\" in node) {\n node.value = action.value ?? undefined;\n\n return query;\n }\n break;\n }\n\n default:\n }\n\n // Return existing state if nothing changed\n return query;\n};\n\nexport default reducer;\n"],"names":["emptyGroup","findNodeById","emptyRule","findParentById"],"mappings":";;;AAKA,MAAM,UAAqD,CAAC,OAAO,WAAW;AACtE,QAAA,QAAQ,EAAE,GAAG;AAEnB,UAAQ,OAAO,MAAM;AAAA,IACnB,KAAK,eAAe;AAClB,aAAOA,MAAW,WAAA;AAAA,IACpB;AAAA,IACA,KAAK,eAAe;AAClB,YAAM,QAAQC,MAAA,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AACvB,cAAA,QAAQ,CAACC,MAAA,UAAA,CAAW;AAEnB,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,YAAY;AACf,YAAM,QAAQD,MAAA,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AAC7B,cAAM,OAAOC,MAAAA;AAEP,cAAA,MAAM,KAAK,IAAI;AAEd,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,aAAa;AAChB,YAAM,QAAQD,MAAA,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AAC7B,cAAM,MAAM,KAAKD,MAAAA,WAAW,IAAI,CAAC;AAE1B,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,eAAe;AAClB,YAAM,SAASG,MAAA,eAAe,OAAO,IAAI,KAAK;AAC9C,UAAI,QAAQ;AACH,eAAA,QAAQ,OAAO,MAAM,OAAO,CAAC,SAAS,KAAK,OAAO,OAAO,EAAE;AAE3D,eAAA;AAAA,MACT;AAGA,aAAOH,MAAW,WAAA;AAAA,IACpB;AAAA,IACA,KAAK,kBAAkB;AACrB,YAAM,OAAOC,MAAA,aAAa,OAAO,IAAI,KAAK;AACtC,UAAA,QAAQ,gBAAgB,MAAM;AAC5B,YAAA,KAAK,eAAe,OAAO,YAAY;AACzC,eAAK,aAAa,OAAO;AAElB,iBAAA;AAAA,QACT;AAAA,MACF;AACA;AAAA,IACF;AAAA,IACA,KAAK,iBAAiB;AACpB,YAAM,OAAOA,MAAA,aAAa,OAAO,IAAI,KAAK;AAC1C,UAAI,QAAQ,KAAK,cAAc,OAAO,WAAW;AAC1C,aAAA,YAAY,OAAO,aAAa;AAGjC,YAAA,OAAO,aAAa,QAAW;AAC5B,eAAA,WAAW,OAAO,YAAY;AAC9B,eAAA,QAAQ,OAAO,SAAS;AAAA,QAC/B;AAEO,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,gBAAgB;AACnB,YAAM,OAAOA,MAAA,aAAa,OAAO,IAAI,KAAK;AACtC,UAAA,QAAQ,eAAe,MAAM;AAC3B,YAAA,KAAK,aAAa,OAAO,UAAU;AACrC,eAAK,WAAW,OAAO;AACnB,cAAA,OAAO,UAAU,QAAW;AACzB,iBAAA,QAAQ,OAAO,SAAS;AAAA,UAC/B;AAEO,iBAAA;AAAA,QACT;AAAA,MACF;AACA;AAAA,IACF;AAAA,IACA,KAAK,aAAa;AAChB,YAAM,OAAOA,MAAA,aAAa,OAAO,IAAI,KAAK;AACtC,UAAA,QAAQ,cAAc,MAAM;AACzB,aAAA,QAAQ,OAAO,SAAS;AAEtB,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,EAGF;AAGO,SAAA;AACT;AAEA,MAAA,YAAe;;"}
1
+ {"version":3,"file":"reducer.cjs","sources":["../../../../src/QueryBuilder/utils/reducer.tsx"],"sourcesContent":["import { Reducer } from \"react\";\n\nimport { emptyRule, emptyGroup, findNodeById, findParentById } from \"./index\";\nimport { Query, QueryAction } from \"../types\";\n\nconst reducer: Reducer<Query, QueryAction> = (state, action) => {\n const query = structuredClone(state);\n\n switch (action.type) {\n case \"reset-query\": {\n return emptyGroup();\n }\n case \"set-query\":\n return action.query;\n case \"reset-group\": {\n const group = findNodeById(action.id, query);\n if (group && \"rules\" in group) {\n group.rules = [emptyRule()];\n\n return query;\n }\n break;\n }\n case \"add-rule\": {\n const group = findNodeById(action.id, query);\n if (group && \"rules\" in group) {\n const rule = emptyRule();\n\n group.rules.push(rule);\n\n return query;\n }\n break;\n }\n case \"add-group\": {\n const group = findNodeById(action.id, query);\n if (group && \"rules\" in group) {\n group.rules.push(emptyGroup(true));\n\n return query;\n }\n break;\n }\n case \"remove-node\": {\n const parent = findParentById(action.id, query);\n if (parent) {\n parent.rules = parent.rules.filter((rule) => rule.id !== action.id);\n\n return query;\n }\n\n // reset query if deleting top node\n return emptyGroup();\n }\n case \"set-combinator\": {\n const node = findNodeById(action.id, query);\n if (node && \"combinator\" in node) {\n if (node.combinator !== action.combinator) {\n node.combinator = action.combinator;\n\n return query;\n }\n }\n break;\n }\n case \"set-attribute\": {\n const node = findNodeById(action.id, query);\n if (node && node.attribute !== action.attribute) {\n node.attribute = action.attribute ?? undefined;\n\n // we keep the operator and value unless the operator is explicitly null (or set)\n if (action.operator !== undefined) {\n node.operator = action.operator ?? undefined;\n node.value = action.value ?? undefined;\n }\n\n return query;\n }\n break;\n }\n case \"set-operator\": {\n const node = findNodeById(action.id, query);\n if (node && \"attribute\" in node) {\n if (node.operator !== action.operator) {\n node.operator = action.operator;\n if (action.value !== undefined) {\n node.value = action.value ?? undefined;\n }\n\n return query;\n }\n }\n break;\n }\n case \"set-value\": {\n const node = findNodeById(action.id, query);\n if (node && \"operator\" in node) {\n // Making sure we are not adding \"value: undefined\" to the object when value wasn't even set (because of EmptyValue)\n // Without this we can trigger onChange\n if (\"value\" in node) {\n node.value = action.value ?? undefined;\n }\n\n return query;\n }\n break;\n }\n\n default:\n }\n\n // Return existing state if nothing changed\n return query;\n};\n\nexport default reducer;\n"],"names":["emptyGroup","findNodeById","emptyRule","findParentById"],"mappings":";;;AAKA,MAAM,UAAuC,CAAC,OAAO,WAAW;AACxD,QAAA,QAAQ,gBAAgB,KAAK;AAEnC,UAAQ,OAAO,MAAM;AAAA,IACnB,KAAK,eAAe;AAClB,aAAOA,MAAW,WAAA;AAAA,IACpB;AAAA,IACA,KAAK;AACH,aAAO,OAAO;AAAA,IAChB,KAAK,eAAe;AAClB,YAAM,QAAQC,MAAA,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AACvB,cAAA,QAAQ,CAACC,MAAA,UAAA,CAAW;AAEnB,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,YAAY;AACf,YAAM,QAAQD,MAAA,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AAC7B,cAAM,OAAOC,MAAAA;AAEP,cAAA,MAAM,KAAK,IAAI;AAEd,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,aAAa;AAChB,YAAM,QAAQD,MAAA,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AAC7B,cAAM,MAAM,KAAKD,MAAAA,WAAW,IAAI,CAAC;AAE1B,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,eAAe;AAClB,YAAM,SAASG,MAAA,eAAe,OAAO,IAAI,KAAK;AAC9C,UAAI,QAAQ;AACH,eAAA,QAAQ,OAAO,MAAM,OAAO,CAAC,SAAS,KAAK,OAAO,OAAO,EAAE;AAE3D,eAAA;AAAA,MACT;AAGA,aAAOH,MAAW,WAAA;AAAA,IACpB;AAAA,IACA,KAAK,kBAAkB;AACrB,YAAM,OAAOC,MAAA,aAAa,OAAO,IAAI,KAAK;AACtC,UAAA,QAAQ,gBAAgB,MAAM;AAC5B,YAAA,KAAK,eAAe,OAAO,YAAY;AACzC,eAAK,aAAa,OAAO;AAElB,iBAAA;AAAA,QACT;AAAA,MACF;AACA;AAAA,IACF;AAAA,IACA,KAAK,iBAAiB;AACpB,YAAM,OAAOA,MAAA,aAAa,OAAO,IAAI,KAAK;AAC1C,UAAI,QAAQ,KAAK,cAAc,OAAO,WAAW;AAC1C,aAAA,YAAY,OAAO,aAAa;AAGjC,YAAA,OAAO,aAAa,QAAW;AAC5B,eAAA,WAAW,OAAO,YAAY;AAC9B,eAAA,QAAQ,OAAO,SAAS;AAAA,QAC/B;AAEO,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,gBAAgB;AACnB,YAAM,OAAOA,MAAA,aAAa,OAAO,IAAI,KAAK;AACtC,UAAA,QAAQ,eAAe,MAAM;AAC3B,YAAA,KAAK,aAAa,OAAO,UAAU;AACrC,eAAK,WAAW,OAAO;AACnB,cAAA,OAAO,UAAU,QAAW;AACzB,iBAAA,QAAQ,OAAO,SAAS;AAAA,UAC/B;AAEO,iBAAA;AAAA,QACT;AAAA,MACF;AACA;AAAA,IACF;AAAA,IACA,KAAK,aAAa;AAChB,YAAM,OAAOA,MAAA,aAAa,OAAO,IAAI,KAAK;AACtC,UAAA,QAAQ,cAAc,MAAM;AAG9B,YAAI,WAAW,MAAM;AACd,eAAA,QAAQ,OAAO,SAAS;AAAA,QAC/B;AAEO,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,EAGF;AAGO,SAAA;AACT;AAEA,MAAA,YAAe;;"}
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
3
+ const reactTable = require("react-table");
4
+ const useHvRowState = reactTable.useRowState.bind({});
5
+ useHvRowState.pluginName = "useHvRowState";
6
+ const useHvRowState$1 = useHvRowState;
7
+ exports.default = useHvRowState$1;
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useRowState.cjs","sources":["../../../../src/Table/hooks/useRowState.ts"],"sourcesContent":["import { Hooks, useRowState } from \"react-table\";\n\n// #region ##### TYPES #####\n\nexport type UseRowStateProps = (<D extends object = Record<string, unknown>>(\n hooks: Hooks<D>\n) => void) & { pluginName: string };\n\n// #endregion ##### TYPES #####\n\nconst useHvRowState = useRowState.bind({});\n(useHvRowState.pluginName as string) = \"useHvRowState\";\n\nexport default useHvRowState;\n"],"names":["useRowState"],"mappings":";;;AAUA,MAAM,gBAAgBA,WAAA,YAAY,KAAK,CAAA,CAAE;AACxC,cAAc,aAAwB;AAEvC,MAAA,kBAAe;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"useControlled.cjs","sources":["../../../src/hooks/useControlled.ts"],"sourcesContent":["// based in https://raw.githubusercontent.com/mui-org/material-ui/next/packages/material-ui/src/utils/useControlled.js\n// modifications:\n// 1. renamed default to initialState, to convey the same meaning of the useState hook.\n// 2. removed the console error when initialState changes; that is acceptable and just ignored, like in useState.\n// 3. the console error regarding switching from controlled to uncontrolled (or vice-versa) is sent synchronously\n// so the stacktrace shows the caller\n// 4. given that, the hook signature was simplified, no need for metadata\n\nimport { useRef, useState, useCallback, SetStateAction } from \"react\";\n\n// export const useControlled = <T = any>(controlledProp: T, initialState: T) => {\nexport const useControlled = (controlledProp: any, initialState: any) => {\n const { current: isControlled } = useRef(controlledProp !== undefined);\n const [valueState, setValue] = useState(initialState);\n const value = isControlled ? controlledProp : valueState;\n\n if (import.meta.env.DEV && isControlled !== (controlledProp !== undefined)) {\n // eslint-disable-next-line no-console\n console.error(\n [\n `A component is changing the ${\n isControlled ? \"\" : \"un\"\n }controlled state to be ${isControlled ? \"un\" : \"\"}controlled.`,\n \"Elements should not switch from uncontrolled to controlled (or vice versa).\",\n \"Decide between using a controlled or uncontrolled element for the lifetime of the component.\",\n \"The nature of the state is determined during the first render, it's considered controlled if the value is not `undefined`.\",\n ].join(\"\\n\")\n );\n }\n\n const setValueIfUncontrolled = useCallback(\n (newValue: SetStateAction<any>) => {\n if (!isControlled) {\n setValue(newValue);\n }\n },\n [isControlled]\n );\n\n return [value, setValueIfUncontrolled];\n};\n"],"names":["useRef","useState","useCallback"],"mappings":";;;AAWa,MAAA,gBAAgB,CAAC,gBAAqB,iBAAsB;AACvE,QAAM,EAAE,SAAS,aAAiB,IAAAA,MAAA,OAAO,mBAAmB,MAAS;AACrE,QAAM,CAAC,YAAY,QAAQ,IAAIC,eAAS,YAAY;AAC9C,QAAA,QAAQ,eAAe,iBAAiB;AAgB9C,QAAM,yBAAyBC,MAAA;AAAA,IAC7B,CAAC,aAAkC;AACjC,UAAI,CAAC,cAAc;AACjB,iBAAS,QAAQ;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,YAAY;AAAA,EAAA;AAGR,SAAA,CAAC,OAAO,sBAAsB;AACvC;;"}
1
+ {"version":3,"file":"useControlled.cjs","sources":["../../../src/hooks/useControlled.ts"],"sourcesContent":["// based in https://raw.githubusercontent.com/mui-org/material-ui/next/packages/material-ui/src/utils/useControlled.js\n// modifications:\n// 1. renamed default to initialState, to convey the same meaning of the useState hook.\n// 2. removed the console error when initialState changes; that is acceptable and just ignored, like in useState.\n// 3. the console error regarding switching from controlled to uncontrolled (or vice-versa) is sent synchronously\n// so the stacktrace shows the caller\n// 4. given that, the hook signature was simplified, no need for metadata\n\nimport { useRef, useState, useCallback, SetStateAction } from \"react\";\n\nexport const useControlled = (controlledProp: any, initialState: any) => {\n const { current: isControlled } = useRef(controlledProp !== undefined);\n const [valueState, setValue] = useState(initialState);\n const value = isControlled ? controlledProp : valueState;\n\n if (import.meta.env.DEV && isControlled !== (controlledProp !== undefined)) {\n // eslint-disable-next-line no-console\n console.error(\n [\n `A component is changing the ${\n isControlled ? \"\" : \"un\"\n }controlled state to be ${isControlled ? \"un\" : \"\"}controlled.`,\n \"Elements should not switch from uncontrolled to controlled (or vice versa).\",\n \"Decide between using a controlled or uncontrolled element for the lifetime of the component.\",\n \"The nature of the state is determined during the first render, it's considered controlled if the value is not `undefined`.\",\n ].join(\"\\n\")\n );\n }\n\n const setValueIfUncontrolled = useCallback(\n (newValue: SetStateAction<any>) => {\n if (!isControlled) {\n setValue(newValue);\n }\n },\n [isControlled]\n );\n\n return [value, setValueIfUncontrolled];\n};\n"],"names":["useRef","useState","useCallback"],"mappings":";;;AAUa,MAAA,gBAAgB,CAAC,gBAAqB,iBAAsB;AACvE,QAAM,EAAE,SAAS,aAAiB,IAAAA,MAAA,OAAO,mBAAmB,MAAS;AACrE,QAAM,CAAC,YAAY,QAAQ,IAAIC,eAAS,YAAY;AAC9C,QAAA,QAAQ,eAAe,iBAAiB;AAgB9C,QAAM,yBAAyBC,MAAA;AAAA,IAC7B,CAAC,aAAkC;AACjC,UAAI,CAAC,cAAc;AACjB,iBAAS,QAAQ;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,YAAY;AAAA,EAAA;AAGR,SAAA,CAAC,OAAO,sBAAsB;AACvC;;"}
@@ -194,6 +194,8 @@ const List_styles = require("./List/List.styles.cjs");
194
194
  const List = require("./List/List.cjs");
195
195
  const Loading_styles = require("./Loading/Loading.styles.cjs");
196
196
  const Loading = require("./Loading/Loading.cjs");
197
+ const LoadingContainer_styles = require("./LoadingContainer/LoadingContainer.styles.cjs");
198
+ const LoadingContainer = require("./LoadingContainer/LoadingContainer.cjs");
197
199
  const Login_styles = require("./Login/Login.styles.cjs");
198
200
  const Login = require("./Login/Login.cjs");
199
201
  const MultiButton_styles = require("./MultiButton/MultiButton.styles.cjs");
@@ -262,6 +264,7 @@ const useHeaderGroups = require("./Table/hooks/useHeaderGroups.cjs");
262
264
  const useResizeColumns = require("./Table/hooks/useResizeColumns.cjs");
263
265
  const useGlobalFilter = require("./Table/hooks/useGlobalFilter.cjs");
264
266
  const useFilters = require("./Table/hooks/useFilters.cjs");
267
+ const useRowState = require("./Table/hooks/useRowState.cjs");
265
268
  const renderers = require("./Table/renderers/renderers.cjs");
266
269
  const DateColumnCell = require("./Table/renderers/DateColumnCell/DateColumnCell.cjs");
267
270
  const DropdownColumnCell = require("./Table/renderers/DropdownColumnCell/DropdownColumnCell.cjs");
@@ -553,6 +556,8 @@ exports.listClasses = List_styles.staticClasses;
553
556
  exports.HvList = List.HvList;
554
557
  exports.loadingClasses = Loading_styles.staticClasses;
555
558
  exports.HvLoading = Loading.HvLoading;
559
+ exports.loadingContainerClasses = LoadingContainer_styles.staticClasses;
560
+ exports.HvLoadingContainer = LoadingContainer.HvLoadingContainer;
556
561
  exports.loginClasses = Login_styles.staticClasses;
557
562
  exports.HvLogin = Login.HvLogin;
558
563
  exports.multiButtonClasses = MultiButton_styles.staticClasses;
@@ -638,6 +643,7 @@ exports.useHvHeaderGroups = useHeaderGroups.default;
638
643
  exports.useHvResizeColumns = useResizeColumns.default;
639
644
  exports.useHvGlobalFilter = useGlobalFilter.default;
640
645
  exports.useHvFilters = useFilters.default;
646
+ exports.useHvRowState = useRowState.default;
641
647
  exports.hvDateColumn = renderers.hvDateColumn;
642
648
  exports.hvDropdownColumn = renderers.hvDropdownColumn;
643
649
  exports.hvExpandColumn = renderers.hvExpandColumn;
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"generic.cjs","sources":["../../../src/types/generic.ts"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport type {\n HvExtraProps,\n HvExtraDeepProps,\n} from \"@hitachivantara/uikit-react-shared\";\n\nexport type { HvExtraProps, HvExtraDeepProps };\n\ntype AsProp<C extends React.ElementType> = {\n /** Custom element type to override the root component */\n component?: C;\n};\n\ntype PropsToOmit<C extends React.ElementType, P> = keyof (AsProp<C> & P);\n\n// Workaround to fix the use of Omit with ComponentPropsWithoutRef\n// Without this the event handlers return any instead of the type for the chosen element\ntype FixComponentProps<T> = T extends any ? T : never;\n\ntype PolymorphicComponent<\n C extends React.ElementType,\n Props = {}\n> = React.PropsWithChildren<Props & AsProp<C>> &\n FixComponentProps<\n Omit<React.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>\n >;\n\nexport type PolymorphicRef<C extends React.ElementType> =\n React.ComponentPropsWithRef<C>[\"ref\"];\n\nexport type PolymorphicComponentRef<\n C extends React.ElementType,\n Props = {}\n> = PolymorphicComponent<C, Props> & { ref?: PolymorphicRef<C> };\n\n/** HV Base Props. Extends `React.HTMLAttributes` of an element `E`, and filters `K` keys. */\nexport type HvBaseProps<\n E extends HTMLElement = HTMLDivElement,\n K extends keyof React.HTMLAttributes<E> = never\n> = Omit<React.HTMLAttributes<E>, K>;\n\n/** This type allows to do a deep partial by applying the Partial type to each key recursively */\nexport type DeepPartial<T> = T extends Object\n ? Partial<{\n [P in keyof T]: DeepPartial<T[P]>;\n }>\n : T;\n\n/** This type combines the HvExtraProps and DeepPartial types */\nexport type HvExtraDeepPartialProps<T> = Partial<{\n [P in keyof T]: DeepPartial<T[P]> & HvExtraProps;\n}> &\n HvExtraProps;\n\nexport type Arrayable<T> = T | T[];\n\n/** React.forwardRef with fixed type declarations */\nexport function fixedForwardRef<T, P = {}>(\n // TODO: change `React.ReactElement | null` to `React.ReactNode` in typescript@5\n render: (props: P, ref: React.Ref<T>) => React.ReactElement | null\n): (props: P & React.RefAttributes<T>) => React.ReactElement | null {\n return forwardRef(render) as any;\n}\n"],"names":["forwardRef"],"mappings":";;;AA0DO,SAAS,gBAEd,QACkE;AAClE,SAAOA,MAAAA,WAAW,MAAM;AAC1B;;"}
1
+ {"version":3,"file":"generic.cjs","sources":["../../../src/types/generic.ts"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport type {\n HvExtraProps,\n HvExtraDeepProps,\n} from \"@hitachivantara/uikit-react-shared\";\n\nexport type { HvExtraProps, HvExtraDeepProps };\n\ntype AsProp<C extends React.ElementType> = {\n /** Custom element type to override the root component */\n component?: C;\n};\n\ntype PropsToOmit<C extends React.ElementType, P> = keyof (AsProp<C> & P);\n\n// Workaround to fix the use of Omit with ComponentPropsWithoutRef\n// Without this the event handlers return any instead of the type for the chosen element\ntype FixComponentProps<T> = T extends any ? T : never;\n\ntype PolymorphicComponent<\n C extends React.ElementType,\n Props = {}\n> = React.PropsWithChildren<Props & AsProp<C>> &\n FixComponentProps<\n Omit<React.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>\n >;\n\nexport type PolymorphicRef<C extends React.ElementType> =\n React.ComponentPropsWithRef<C>[\"ref\"];\n\nexport type PolymorphicComponentRef<\n C extends React.ElementType,\n Props = {}\n> = PolymorphicComponent<C, Props> & { ref?: PolymorphicRef<C> };\n\n/** HV Base Props. Extends `React.HTMLAttributes` of an element `E`, and filters `K` keys. */\nexport type HvBaseProps<\n E extends HTMLElement = HTMLDivElement,\n K extends keyof React.HTMLAttributes<E> = never\n> = Omit<React.HTMLAttributes<E>, K>;\n\n/** This type allows to do a deep partial by applying the Partial type to each key recursively */\nexport type DeepPartial<T> = T extends Object\n ? Partial<{\n [P in keyof T]: DeepPartial<T[P]>;\n }>\n : T;\n\n/** This type combines the HvExtraProps and DeepPartial types */\nexport type HvExtraDeepPartialProps<T> = Partial<{\n [P in keyof T]: DeepPartial<T[P]> & HvExtraProps;\n}> &\n HvExtraProps;\n\nexport type Arrayable<T> = T | T[];\n\n/** React.forwardRef with fixed type declarations */\nexport function fixedForwardRef<T, P = {}>(\n // TODO: change `React.ReactElement | null` to `React.ReactNode` in typescript@5\n render: (props: P, ref: React.Ref<T>) => React.ReactElement | null\n): (props: P & React.RefAttributes<T>) => React.ReactElement | null {\n return forwardRef(render) as any;\n}\n\n// Source code from: https://github.com/piotrwitek/utility-types/blob/master/src/mapped-types.ts\n/**\n * Optional\n * @desc From `T` make a set of properties by key `K` become optional\n * @example\n * type Props = {\n * name: string;\n * age: number;\n * visible: boolean;\n * };\n *\n * // Expect: { name?: string; age?: number; visible?: boolean; }\n * type Props = Optional<Props>;\n *\n * // Expect: { name: string; age?: number; visible?: boolean; }\n * type Props = Optional<Props, 'age' | 'visible'>;\n */\nexport type HvOptional<T extends object, K extends keyof T = keyof T> = Omit<\n T,\n K\n> &\n Partial<Pick<T, K>>;\n"],"names":["forwardRef"],"mappings":";;;AA0DO,SAAS,gBAEd,QACkE;AAClE,SAAOA,MAAAA,WAAW,MAAM;AAC1B;;"}
@@ -1,18 +1,15 @@
1
1
  import { jsx } from "@emotion/react/jsx-runtime";
2
2
  import { forwardRef, useState, useCallback } from "react";
3
3
  import MuiCheckbox from "@mui/material/Checkbox";
4
- import { Checkbox, CheckboxPartial, CheckboxCheck } from "@hitachivantara/uikit-react-icons";
5
4
  import { useDefaultProps } from "../hooks/useDefaultProps.js";
6
5
  import { useClasses } from "./BaseCheckBox.styles.js";
7
6
  import { staticClasses } from "./BaseCheckBox.styles.js";
8
- const getSelectorIcons = (options, classes) => {
9
- const { disabled, semantic } = options;
10
- const color = disabled && ["atmo3", "secondary_60"] || semantic && ["base_light", "base_dark"] || void 0;
11
- const checkedColor = disabled && ["atmo3", "secondary_60"] || semantic && ["base_dark", "base_light"] || void 0;
7
+ import { Box, Partial, Check } from "./icons.js";
8
+ const getSelectorIcons = () => {
12
9
  return {
13
- checkbox: /* @__PURE__ */ jsx(Checkbox, { color, className: classes.icon }),
14
- checkboxPartial: /* @__PURE__ */ jsx(CheckboxPartial, { color, className: classes.icon }),
15
- checkboxChecked: /* @__PURE__ */ jsx(CheckboxCheck, { color: checkedColor, className: classes.icon })
10
+ checkbox: /* @__PURE__ */ jsx(Box, {}),
11
+ checkboxPartial: /* @__PURE__ */ jsx(Partial, {}),
12
+ checkboxChecked: /* @__PURE__ */ jsx(Check, {})
16
13
  };
17
14
  };
18
15
  const HvBaseCheckBox = forwardRef((props, ref) => {
@@ -37,7 +34,7 @@ const HvBaseCheckBox = forwardRef((props, ref) => {
37
34
  } = useDefaultProps("HvBaseCheckBox", props);
38
35
  const { classes, cx } = useClasses(classesProp);
39
36
  const [focusVisible, setFocusVisible] = useState(false);
40
- const icons = getSelectorIcons({ disabled, semantic }, classes);
37
+ const icons = getSelectorIcons();
41
38
  const onChangeCallback = useCallback(
42
39
  (event) => {
43
40
  if (readOnly) {
@@ -70,7 +67,13 @@ const HvBaseCheckBox = forwardRef((props, ref) => {
70
67
  value,
71
68
  className: cx(
72
69
  classes.root,
73
- { [classes.disabled]: disabled, [classes.focusVisible]: focusVisible },
70
+ {
71
+ [classes.disabled]: disabled,
72
+ [classes.focusVisible]: focusVisible,
73
+ [classes.checked]: checked,
74
+ [classes.indeterminate]: indeterminate,
75
+ [classes.semantic]: semantic
76
+ },
74
77
  className
75
78
  ),
76
79
  icon: icons.checkbox,
@@ -1 +1 @@
1
- {"version":3,"file":"BaseCheckBox.js","sources":["../../../src/BaseCheckBox/BaseCheckBox.tsx"],"sourcesContent":["import { forwardRef, useCallback, useState } from \"react\";\n\nimport MuiCheckbox, {\n CheckboxProps as MuiCheckboxProps,\n} from \"@mui/material/Checkbox\";\n\nimport {\n CheckboxCheck as CheckboxCheckIcon,\n CheckboxPartial as CheckboxPartialIcon,\n Checkbox as CheckboxIcon,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { ExtractNames } from \"../utils/classes\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { staticClasses, useClasses } from \"./BaseCheckBox.styles\";\n\nexport { staticClasses as baseCheckBoxClasses };\n\nexport type HvBaseCheckBoxClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBaseCheckBoxProps\n extends Omit<MuiCheckboxProps, \"onChange\" | \"classes\"> {\n /**\n * The input name.\n */\n name?: string;\n /**\n * The value of the input.\n *\n * Is up to the application's logic when to consider the submission of this value.\n * Generally it should be used only when the checkbox is neither unchecked nor indeterminate.\n *\n * The default value is \"on\".\n */\n value?: any;\n /**\n * Indicates that the input is disabled.\n */\n disabled?: boolean;\n /**\n * Indicates that the input is not editable.\n */\n readOnly?: boolean;\n /**\n * Indicates that user input is required.\n */\n required?: boolean;\n /**\n * If `true` the checkbox is selected, if set to `false` the checkbox is not selected.\n *\n * When defined the checkbox state becomes controlled.\n */\n checked?: boolean;\n /**\n * When uncontrolled, defines the initial checked state.\n */\n defaultChecked?: boolean;\n /**\n * If `true` the checkbox visually shows the indeterminate state.\n */\n indeterminate?: boolean;\n /**\n * The callback fired when the checkbox is pressed.\n */\n onChange?: (\n event: React.ChangeEvent<HTMLInputElement>,\n checked: boolean,\n value: any\n ) => void;\n /**\n * Whether the selector should use semantic colors.\n */\n semantic?: boolean;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /**\n * Callback fired when the component is focused with a keyboard.\n * We trigger a `onFocus` callback too.\n */\n onFocusVisible?: (event: React.FocusEvent<any>) => void;\n /**\n * Callback fired when the component is blurred.\n */\n onBlur?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n /**\n * A Jss Object used to override or extend the styles applied to the checkbox.\n */\n classes?: HvBaseCheckBoxClasses;\n}\n\nconst getSelectorIcons = (\n options: {\n disabled: boolean;\n semantic: boolean;\n },\n classes: HvBaseCheckBoxClasses\n) => {\n const { disabled, semantic } = options;\n const color =\n (disabled && [\"atmo3\", \"secondary_60\"]) ||\n (semantic && [\"base_light\", \"base_dark\"]) ||\n undefined;\n const checkedColor =\n (disabled && [\"atmo3\", \"secondary_60\"]) ||\n (semantic && [\"base_dark\", \"base_light\"]) ||\n undefined;\n\n // Default colors: [\"atmo1\",\"secondary\"]\n return {\n checkbox: <CheckboxIcon color={color} className={classes.icon} />,\n checkboxPartial: (\n <CheckboxPartialIcon color={color} className={classes.icon} />\n ),\n checkboxChecked: (\n <CheckboxCheckIcon color={checkedColor} className={classes.icon} />\n ),\n };\n};\n\n/**\n * A Checkbox is a mechanism that allows user to select one or more options.\n *\n * The Base Checkbox is a building block of the Checkbox form element. Don't use unless\n * implementing a custom use case not covered by the Checkbox form element.\n */\nexport const HvBaseCheckBox = forwardRef<\n HTMLButtonElement,\n HvBaseCheckBoxProps\n>((props, ref) => {\n const {\n id,\n classes: classesProp,\n className,\n name,\n inputProps,\n onChange,\n onFocusVisible,\n onBlur,\n checked,\n indeterminate,\n defaultChecked,\n value = \"on\",\n required = false,\n readOnly = false,\n disabled = false,\n semantic = false,\n ...others\n } = useDefaultProps(\"HvBaseCheckBox\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [focusVisible, setFocusVisible] = useState<boolean>(false);\n\n const icons = getSelectorIcons({ disabled, semantic }, classes);\n\n const onChangeCallback = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n return;\n }\n\n onChange?.(event, event.target.checked, value);\n },\n [onChange, readOnly, value]\n );\n\n const onBlurCallback = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n setFocusVisible(false);\n onBlur?.(event);\n },\n [onBlur]\n );\n\n const onFocusVisibleCallback = useCallback(\n (event: React.FocusEvent<any>) => {\n setFocusVisible(true);\n onFocusVisible?.(event);\n },\n [onFocusVisible]\n );\n\n return (\n <MuiCheckbox\n ref={ref}\n id={id}\n name={name}\n value={value}\n className={cx(\n classes.root,\n { [classes.disabled]: disabled, [classes.focusVisible]: focusVisible },\n className\n )}\n icon={icons.checkbox}\n indeterminateIcon={icons.checkboxPartial}\n checkedIcon={icons.checkboxChecked}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n checked={checked}\n defaultChecked={defaultChecked}\n indeterminate={indeterminate}\n inputProps={inputProps}\n onChange={onChangeCallback}\n onFocusVisible={onFocusVisibleCallback}\n onBlur={onBlurCallback}\n color=\"default\"\n disableRipple\n {...others}\n />\n );\n});\n"],"names":["CheckboxIcon","CheckboxPartialIcon","CheckboxCheckIcon"],"mappings":";;;;;;;AA6FA,MAAM,mBAAmB,CACvB,SAIA,YACG;AACG,QAAA,EAAE,UAAU,SAAa,IAAA;AACzB,QAAA,QACH,YAAY,CAAC,SAAS,cAAc,KACpC,YAAY,CAAC,cAAc,WAAW,KACvC;AACI,QAAA,eACH,YAAY,CAAC,SAAS,cAAc,KACpC,YAAY,CAAC,aAAa,YAAY,KACvC;AAGK,SAAA;AAAA,IACL,UAAW,oBAAAA,UAAA,EAAa,OAAc,WAAW,QAAQ,MAAM;AAAA,IAC/D,iBACG,oBAAAC,iBAAA,EAAoB,OAAc,WAAW,QAAQ,MAAM;AAAA,IAE9D,iBACG,oBAAAC,eAAA,EAAkB,OAAO,cAAc,WAAW,QAAQ,MAAM;AAAA,EAAA;AAGvE;AAQO,MAAM,iBAAiB,WAG5B,CAAC,OAAO,QAAQ;AACV,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,GAAG;AAAA,EAAA,IACD,gBAAgB,kBAAkB,KAAK;AAE3C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,CAAC,cAAc,eAAe,IAAI,SAAkB,KAAK;AAE/D,QAAM,QAAQ,iBAAiB,EAAE,UAAU,SAAA,GAAY,OAAO;AAE9D,QAAM,mBAAmB;AAAA,IACvB,CAAC,UAA+C;AAC9C,UAAI,UAAU;AACZ;AAAA,MACF;AAEA,iBAAW,OAAO,MAAM,OAAO,SAAS,KAAK;AAAA,IAC/C;AAAA,IACA,CAAC,UAAU,UAAU,KAAK;AAAA,EAAA;AAG5B,QAAM,iBAAiB;AAAA,IACrB,CAAC,UAA+C;AAC9C,sBAAgB,KAAK;AACrB,eAAS,KAAK;AAAA,IAChB;AAAA,IACA,CAAC,MAAM;AAAA,EAAA;AAGT,QAAM,yBAAyB;AAAA,IAC7B,CAAC,UAAiC;AAChC,sBAAgB,IAAI;AACpB,uBAAiB,KAAK;AAAA,IACxB;AAAA,IACA,CAAC,cAAc;AAAA,EAAA;AAIf,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,UAAU,CAAC,QAAQ,YAAY,GAAG,aAAa;AAAA,QACrE;AAAA,MACF;AAAA,MACA,MAAM,MAAM;AAAA,MACZ,mBAAmB,MAAM;AAAA,MACzB,aAAa,MAAM;AAAA,MACnB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,gBAAgB;AAAA,MAChB,QAAQ;AAAA,MACR,OAAM;AAAA,MACN,eAAa;AAAA,MACZ,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}
1
+ {"version":3,"file":"BaseCheckBox.js","sources":["../../../src/BaseCheckBox/BaseCheckBox.tsx"],"sourcesContent":["import { forwardRef, useCallback, useState } from \"react\";\n\nimport MuiCheckbox, {\n CheckboxProps as MuiCheckboxProps,\n} from \"@mui/material/Checkbox\";\n\nimport { ExtractNames } from \"../utils/classes\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { staticClasses, useClasses } from \"./BaseCheckBox.styles\";\n\nimport { Box, Check, Partial } from \"./icons\";\n\nexport { staticClasses as baseCheckBoxClasses };\n\nexport type HvBaseCheckBoxClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBaseCheckBoxProps\n extends Omit<MuiCheckboxProps, \"onChange\" | \"classes\"> {\n /**\n * The input name.\n */\n name?: string;\n /**\n * The value of the input.\n *\n * Is up to the application's logic when to consider the submission of this value.\n * Generally it should be used only when the checkbox is neither unchecked nor indeterminate.\n *\n * The default value is \"on\".\n */\n value?: any;\n /**\n * Indicates that the input is disabled.\n */\n disabled?: boolean;\n /**\n * Indicates that the input is not editable.\n */\n readOnly?: boolean;\n /**\n * Indicates that user input is required.\n */\n required?: boolean;\n /**\n * If `true` the checkbox is selected, if set to `false` the checkbox is not selected.\n *\n * When defined the checkbox state becomes controlled.\n */\n checked?: boolean;\n /**\n * When uncontrolled, defines the initial checked state.\n */\n defaultChecked?: boolean;\n /**\n * If `true` the checkbox visually shows the indeterminate state.\n */\n indeterminate?: boolean;\n /**\n * The callback fired when the checkbox is pressed.\n */\n onChange?: (\n event: React.ChangeEvent<HTMLInputElement>,\n checked: boolean,\n value: any\n ) => void;\n /**\n * Whether the selector should use semantic colors.\n */\n semantic?: boolean;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /**\n * Callback fired when the component is focused with a keyboard.\n * We trigger a `onFocus` callback too.\n */\n onFocusVisible?: (event: React.FocusEvent<any>) => void;\n /**\n * Callback fired when the component is blurred.\n */\n onBlur?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n /**\n * A Jss Object used to override or extend the styles applied to the checkbox.\n */\n classes?: HvBaseCheckBoxClasses;\n}\n\nconst getSelectorIcons = () => {\n return {\n checkbox: <Box />,\n checkboxPartial: <Partial />,\n checkboxChecked: <Check />,\n };\n};\n\n/**\n * A Checkbox is a mechanism that allows user to select one or more options.\n *\n * The Base Checkbox is a building block of the Checkbox form element. Don't use unless\n * implementing a custom use case not covered by the Checkbox form element.\n */\nexport const HvBaseCheckBox = forwardRef<\n HTMLButtonElement,\n HvBaseCheckBoxProps\n>((props, ref) => {\n const {\n id,\n classes: classesProp,\n className,\n name,\n inputProps,\n onChange,\n onFocusVisible,\n onBlur,\n checked,\n indeterminate,\n defaultChecked,\n value = \"on\",\n required = false,\n readOnly = false,\n disabled = false,\n semantic = false,\n ...others\n } = useDefaultProps(\"HvBaseCheckBox\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [focusVisible, setFocusVisible] = useState<boolean>(false);\n\n const icons = getSelectorIcons();\n\n const onChangeCallback = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n return;\n }\n\n onChange?.(event, event.target.checked, value);\n },\n [onChange, readOnly, value]\n );\n\n const onBlurCallback = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n setFocusVisible(false);\n onBlur?.(event);\n },\n [onBlur]\n );\n\n const onFocusVisibleCallback = useCallback(\n (event: React.FocusEvent<any>) => {\n setFocusVisible(true);\n onFocusVisible?.(event);\n },\n [onFocusVisible]\n );\n\n return (\n <MuiCheckbox\n ref={ref}\n id={id}\n name={name}\n value={value}\n className={cx(\n classes.root,\n {\n [classes.disabled]: disabled,\n [classes.focusVisible]: focusVisible,\n [classes.checked]: checked,\n [classes.indeterminate]: indeterminate,\n [classes.semantic]: semantic,\n },\n className\n )}\n icon={icons.checkbox}\n indeterminateIcon={icons.checkboxPartial}\n checkedIcon={icons.checkboxChecked}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n checked={checked}\n defaultChecked={defaultChecked}\n indeterminate={indeterminate}\n inputProps={inputProps}\n onChange={onChangeCallback}\n onFocusVisible={onFocusVisibleCallback}\n onBlur={onBlurCallback}\n color=\"default\"\n disableRipple\n {...others}\n />\n );\n});\n"],"names":[],"mappings":";;;;;;;AAyFA,MAAM,mBAAmB,MAAM;AACtB,SAAA;AAAA,IACL,8BAAW,KAAI,EAAA;AAAA,IACf,qCAAkB,SAAQ,EAAA;AAAA,IAC1B,qCAAkB,OAAM,EAAA;AAAA,EAAA;AAE5B;AAQO,MAAM,iBAAiB,WAG5B,CAAC,OAAO,QAAQ;AACV,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,GAAG;AAAA,EAAA,IACD,gBAAgB,kBAAkB,KAAK;AAE3C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,CAAC,cAAc,eAAe,IAAI,SAAkB,KAAK;AAE/D,QAAM,QAAQ;AAEd,QAAM,mBAAmB;AAAA,IACvB,CAAC,UAA+C;AAC9C,UAAI,UAAU;AACZ;AAAA,MACF;AAEA,iBAAW,OAAO,MAAM,OAAO,SAAS,KAAK;AAAA,IAC/C;AAAA,IACA,CAAC,UAAU,UAAU,KAAK;AAAA,EAAA;AAG5B,QAAM,iBAAiB;AAAA,IACrB,CAAC,UAA+C;AAC9C,sBAAgB,KAAK;AACrB,eAAS,KAAK;AAAA,IAChB;AAAA,IACA,CAAC,MAAM;AAAA,EAAA;AAGT,QAAM,yBAAyB;AAAA,IAC7B,CAAC,UAAiC;AAChC,sBAAgB,IAAI;AACpB,uBAAiB,KAAK;AAAA,IACxB;AAAA,IACA,CAAC,cAAc;AAAA,EAAA;AAIf,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,QAAQ,GAAG;AAAA,UACpB,CAAC,QAAQ,YAAY,GAAG;AAAA,UACxB,CAAC,QAAQ,OAAO,GAAG;AAAA,UACnB,CAAC,QAAQ,aAAa,GAAG;AAAA,UACzB,CAAC,QAAQ,QAAQ,GAAG;AAAA,QACtB;AAAA,QACA;AAAA,MACF;AAAA,MACA,MAAM,MAAM;AAAA,MACZ,mBAAmB,MAAM;AAAA,MACzB,aAAa,MAAM;AAAA,MACnB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,gBAAgB;AAAA,MAChB,QAAQ;AAAA,MACR,OAAM;AAAA,MACN,eAAa;AAAA,MACZ,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}
@@ -4,20 +4,29 @@ import { createClasses } from "../utils/classes.js";
4
4
  const { staticClasses, useClasses } = createClasses("HvBaseCheckBox", {
5
5
  root: {
6
6
  padding: 0,
7
+ width: 32,
8
+ minWidth: 32,
9
+ height: 32,
7
10
  borderRadius: theme.radii.base,
8
11
  cursor: "pointer",
9
12
  "&:hover": {
10
13
  backgroundColor: theme.colors.containerBackgroundHover
14
+ },
15
+ "& svg": {
16
+ width: 16,
17
+ height: 16,
18
+ color: theme.colors.atmo1,
19
+ borderRadius: theme.radii.none,
20
+ border: `1px solid ${theme.colors.secondary}`
11
21
  }
12
22
  },
13
23
  disabled: {
14
24
  "&$root": {
15
25
  cursor: "not-allowed",
16
- pointerEvents: "initial"
17
- },
18
- "& svg": {
19
- "& path:nth-of-type(2)": {
20
- fill: theme.colors.secondary_60
26
+ pointerEvents: "initial",
27
+ "& svg": {
28
+ color: theme.colors.atmo3,
29
+ borderColor: theme.colors.secondary_60
21
30
  }
22
31
  }
23
32
  },
@@ -26,7 +35,46 @@ const { staticClasses, useClasses } = createClasses("HvBaseCheckBox", {
26
35
  ...outlineStyles
27
36
  }
28
37
  },
29
- icon: {}
38
+ icon: {},
39
+ checked: {
40
+ "& svg": {
41
+ border: `1px solid ${theme.colors.secondary}`,
42
+ backgroundColor: theme.colors.secondary,
43
+ color: theme.colors.atmo1
44
+ },
45
+ "&$disabled": {
46
+ "& svg": {
47
+ backgroundColor: theme.colors.atmo3,
48
+ borderColor: theme.colors.atmo3,
49
+ color: theme.colors.secondary_60
50
+ }
51
+ }
52
+ },
53
+ indeterminate: {
54
+ "& svg": {
55
+ color: theme.colors.secondary
56
+ },
57
+ "&$disabled": {
58
+ "& svg": {
59
+ backgroundColor: theme.colors.atmo3,
60
+ borderColor: theme.colors.secondary_60,
61
+ color: theme.colors.secondary_60
62
+ }
63
+ }
64
+ },
65
+ semantic: {
66
+ "& svg": {
67
+ border: `1px solid ${theme.colors.base_dark}`,
68
+ color: theme.colors.base_light,
69
+ backgroundColor: theme.colors.base_dark
70
+ },
71
+ "&$indeterminate": {
72
+ "& svg": {
73
+ color: theme.colors.base_dark,
74
+ backgroundColor: theme.colors.base_light
75
+ }
76
+ }
77
+ }
30
78
  });
31
79
  export {
32
80
  staticClasses,
@@ -1 +1 @@
1
- {"version":3,"file":"BaseCheckBox.styles.js","sources":["../../../src/BaseCheckBox/BaseCheckBox.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../utils/focusUtils\";\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseCheckBox\", {\n root: {\n padding: 0,\n borderRadius: theme.radii.base,\n cursor: \"pointer\",\n \"&:hover\": {\n backgroundColor: theme.colors.containerBackgroundHover,\n },\n },\n disabled: {\n \"&$root\": {\n cursor: \"not-allowed\",\n pointerEvents: \"initial\",\n },\n\n \"& svg\": {\n \"& path:nth-of-type(2)\": {\n fill: theme.colors.secondary_60,\n },\n },\n },\n focusVisible: {\n \"& svg\": {\n ...outlineStyles,\n },\n },\n icon: {},\n});\n"],"names":[],"mappings":";;;AAKO,MAAM,EAAE,eAAe,eAAe,cAAc,kBAAkB;AAAA,EAC3E,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,cAAc,MAAM,MAAM;AAAA,IAC1B,QAAQ;AAAA,IACR,WAAW;AAAA,MACT,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,UAAU;AAAA,MACR,QAAQ;AAAA,MACR,eAAe;AAAA,IACjB;AAAA,IAEA,SAAS;AAAA,MACP,yBAAyB;AAAA,QACvB,MAAM,MAAM,OAAO;AAAA,MACrB;AAAA,IACF;AAAA,EACF;AAAA,EACA,cAAc;AAAA,IACZ,SAAS;AAAA,MACP,GAAG;AAAA,IACL;AAAA,EACF;AAAA,EACA,MAAM,CAAC;AACT,CAAC;"}
1
+ {"version":3,"file":"BaseCheckBox.styles.js","sources":["../../../src/BaseCheckBox/BaseCheckBox.styles.ts"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { outlineStyles } from \"../utils/focusUtils\";\nimport { createClasses } from \"../utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseCheckBox\", {\n root: {\n padding: 0,\n width: 32,\n minWidth: 32,\n height: 32,\n borderRadius: theme.radii.base,\n cursor: \"pointer\",\n \"&:hover\": {\n backgroundColor: theme.colors.containerBackgroundHover,\n },\n\n \"& svg\": {\n width: 16,\n height: 16,\n color: theme.colors.atmo1,\n borderRadius: theme.radii.none,\n border: `1px solid ${theme.colors.secondary}`,\n },\n },\n disabled: {\n \"&$root\": {\n cursor: \"not-allowed\",\n pointerEvents: \"initial\",\n \"& svg\": {\n color: theme.colors.atmo3,\n borderColor: theme.colors.secondary_60,\n },\n },\n },\n focusVisible: {\n \"& svg\": {\n ...outlineStyles,\n },\n },\n icon: {},\n checked: {\n \"& svg\": {\n border: `1px solid ${theme.colors.secondary}`,\n backgroundColor: theme.colors.secondary,\n color: theme.colors.atmo1,\n },\n \"&$disabled\": {\n \"& svg\": {\n backgroundColor: theme.colors.atmo3,\n borderColor: theme.colors.atmo3,\n color: theme.colors.secondary_60,\n },\n },\n },\n indeterminate: {\n \"& svg\": {\n color: theme.colors.secondary,\n },\n \"&$disabled\": {\n \"& svg\": {\n backgroundColor: theme.colors.atmo3,\n borderColor: theme.colors.secondary_60,\n color: theme.colors.secondary_60,\n },\n },\n },\n semantic: {\n \"& svg\": {\n border: `1px solid ${theme.colors.base_dark}`,\n color: theme.colors.base_light,\n backgroundColor: theme.colors.base_dark,\n },\n \"&$indeterminate\": {\n \"& svg\": {\n color: theme.colors.base_dark,\n backgroundColor: theme.colors.base_light,\n },\n },\n },\n});\n"],"names":[],"mappings":";;;AAKO,MAAM,EAAE,eAAe,eAAe,cAAc,kBAAkB;AAAA,EAC3E,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,cAAc,MAAM,MAAM;AAAA,IAC1B,QAAQ;AAAA,IACR,WAAW;AAAA,MACT,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,IAEA,SAAS;AAAA,MACP,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO,MAAM,OAAO;AAAA,MACpB,cAAc,MAAM,MAAM;AAAA,MAC1B,QAAQ,aAAa,MAAM,OAAO,SAAS;AAAA,IAC7C;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,UAAU;AAAA,MACR,QAAQ;AAAA,MACR,eAAe;AAAA,MACf,SAAS;AAAA,QACP,OAAO,MAAM,OAAO;AAAA,QACpB,aAAa,MAAM,OAAO;AAAA,MAC5B;AAAA,IACF;AAAA,EACF;AAAA,EACA,cAAc;AAAA,IACZ,SAAS;AAAA,MACP,GAAG;AAAA,IACL;AAAA,EACF;AAAA,EACA,MAAM,CAAC;AAAA,EACP,SAAS;AAAA,IACP,SAAS;AAAA,MACP,QAAQ,aAAa,MAAM,OAAO,SAAS;AAAA,MAC3C,iBAAiB,MAAM,OAAO;AAAA,MAC9B,OAAO,MAAM,OAAO;AAAA,IACtB;AAAA,IACA,cAAc;AAAA,MACZ,SAAS;AAAA,QACP,iBAAiB,MAAM,OAAO;AAAA,QAC9B,aAAa,MAAM,OAAO;AAAA,QAC1B,OAAO,MAAM,OAAO;AAAA,MACtB;AAAA,IACF;AAAA,EACF;AAAA,EACA,eAAe;AAAA,IACb,SAAS;AAAA,MACP,OAAO,MAAM,OAAO;AAAA,IACtB;AAAA,IACA,cAAc;AAAA,MACZ,SAAS;AAAA,QACP,iBAAiB,MAAM,OAAO;AAAA,QAC9B,aAAa,MAAM,OAAO;AAAA,QAC1B,OAAO,MAAM,OAAO;AAAA,MACtB;AAAA,IACF;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,QAAQ,aAAa,MAAM,OAAO,SAAS;AAAA,MAC3C,OAAO,MAAM,OAAO;AAAA,MACpB,iBAAiB,MAAM,OAAO;AAAA,IAChC;AAAA,IACA,mBAAmB;AAAA,MACjB,SAAS;AAAA,QACP,OAAO,MAAM,OAAO;AAAA,QACpB,iBAAiB,MAAM,OAAO;AAAA,MAChC;AAAA,IACF;AAAA,EACF;AACF,CAAC;"}
@@ -0,0 +1,21 @@
1
+ import { jsx } from "@emotion/react/jsx-runtime";
2
+ const Box = () => {
3
+ return /* @__PURE__ */ jsx("svg", { width: "14", height: "14", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { fill: "currentcolor", d: "m0,0l16,0l0,16l-16,0l0,-16z" }) });
4
+ };
5
+ const Check = () => {
6
+ return /* @__PURE__ */ jsx("svg", { width: "14", height: "14", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx(
7
+ "path",
8
+ {
9
+ d: "m5.03,12.06l-3.76,-3.75l1.42,-1.42l2.24,2.25l6.3,-7.2l1.5,1.31l-7.7,8.81z",
10
+ fill: "currentcolor"
11
+ }
12
+ ) });
13
+ };
14
+ const Partial = () => {
15
+ return /* @__PURE__ */ jsx("svg", { width: "14", height: "14", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { id: "svg_2", d: "m3,8l8,0l0,-2l-8,0l0,2z", fill: "currentcolor" }) });
16
+ };
17
+ export {
18
+ Box,
19
+ Check,
20
+ Partial
21
+ };
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icons.js","sources":["../../../src/BaseCheckBox/icons.tsx"],"sourcesContent":["export const Box = () => {\n return (\n <svg width=\"14\" height=\"14\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill=\"currentcolor\" d=\"m0,0l16,0l0,16l-16,0l0,-16z\" />\n </svg>\n );\n};\n\nexport const Check = () => {\n return (\n <svg width=\"14\" height=\"14\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"m5.03,12.06l-3.76,-3.75l1.42,-1.42l2.24,2.25l6.3,-7.2l1.5,1.31l-7.7,8.81z\"\n fill=\"currentcolor\"\n />\n </svg>\n );\n};\n\nexport const Partial = () => {\n return (\n <svg width=\"14\" height=\"14\" xmlns=\"http://www.w3.org/2000/svg\">\n <path id=\"svg_2\" d=\"m3,8l8,0l0,-2l-8,0l0,2z\" fill=\"currentcolor\" />\n </svg>\n );\n};\n"],"names":[],"mappings":";AAAO,MAAM,MAAM,MAAM;AACvB,SACG,oBAAA,OAAA,EAAI,OAAM,MAAK,QAAO,MAAK,OAAM,8BAChC,UAAA,oBAAC,QAAK,EAAA,MAAK,gBAAe,GAAE,+BAA8B,EAC5D,CAAA;AAEJ;AAEO,MAAM,QAAQ,MAAM;AACzB,6BACG,OAAI,EAAA,OAAM,MAAK,QAAO,MAAK,OAAM,8BAChC,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA,IAAA;AAAA,EAET,EAAA,CAAA;AAEJ;AAEO,MAAM,UAAU,MAAM;AAC3B,6BACG,OAAI,EAAA,OAAM,MAAK,QAAO,MAAK,OAAM,8BAChC,UAAC,oBAAA,QAAA,EAAK,IAAG,SAAQ,GAAE,2BAA0B,MAAK,gBAAe,EACnE,CAAA;AAEJ;"}
@@ -100,7 +100,10 @@ const HvCheckBox = forwardRef(
100
100
  id: hasLabel ? setId(elementId, "input") : setId(id, "input"),
101
101
  name,
102
102
  className: cx(classes.checkbox, {
103
- [classes.invalidCheckbox]: isStateInvalid
103
+ [classes.invalidCheckbox]: isStateInvalid,
104
+ [classes.checked]: isChecked,
105
+ [classes.indeterminate]: isIndeterminate,
106
+ [classes.semantic]: semantic
104
107
  }),
105
108
  disabled,
106
109
  readOnly,