npm - @hitachivantara/uikit-react-core - Versions diffs - 5.66.12 → 5.66.14 - Mend

@hitachivantara/uikit-react-core 5.66.12 → 5.66.14

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 (263) hide show

package/dist/esm/QueryBuilder/utils/reducer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"reducer.js","sources":["../../../../src/QueryBuilder/utils/reducer.tsx"],"sourcesContent":["import { Reducer } from \"react\";\n\nimport { Query, QueryAction } from \"../types\";\nimport { emptyGroup, emptyRule, findNodeById, findParentById } from \"./index\";\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":[],"mappings":";~~AAKA~~,~~MAAM~~,UAAuC,CAAC,OAAO,WAAW;AACxD,QAAA,QAAQ,gBAAgB,KAAK;AAEnC,UAAQ,OAAO,MAAM;AAAA,IACnB,KAAK,eAAe;AAClB,aAAO,WAAW;AAAA,IACpB;AAAA,IACA,KAAK;AACH,aAAO,OAAO;AAAA,IAChB,KAAK,eAAe;AAClB,YAAM,QAAQ,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AACvB,cAAA,QAAQ,CAAC,UAAA,CAAW;AAEnB,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,YAAY;AACf,YAAM,QAAQ,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AAC7B,cAAM,OAAO;AAEP,cAAA,MAAM,KAAK,IAAI;AAEd,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,aAAa;AAChB,YAAM,QAAQ,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AAC7B,cAAM,MAAM,KAAK,WAAW,IAAI,CAAC;AAE1B,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,eAAe;AAClB,YAAM,SAAS,eAAe,OAAO,IAAI,KAAK;AAC9C,UAAI,QAAQ;AACH,eAAA,QAAQ,OAAO,MAAM,OAAO,CAAC,SAAS,KAAK,OAAO,OAAO,EAAE;AAE3D,eAAA;AAAA,MACT;AAGA,aAAO,WAAW;AAAA,IACpB;AAAA,IACA,KAAK,kBAAkB;AACrB,YAAM,OAAO,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,OAAO,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,OAAO,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,OAAO,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;~~"}
1	+ {"version":3,"file":"reducer.js","sources":["../../../../src/QueryBuilder/utils/reducer.tsx"],"sourcesContent":["import { Reducer } from \"react\";\n\nimport { HvQueryBuilderQueryRule, Query, QueryAction } from \"../types\";\nimport { emptyGroup, emptyRule, findNodeById, findParentById } from \"./index\";\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) as HvQueryBuilderQueryRule;\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 // @ts-ignore\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":[],"mappings":";AAKM,MAAA,UAAuC,CAAC,OAAO,WAAW;AACxD,QAAA,QAAQ,gBAAgB,KAAK;AAEnC,UAAQ,OAAO,MAAM;AAAA,IACnB,KAAK,eAAe;AAClB,aAAO,WAAW;AAAA,IACpB;AAAA,IACA,KAAK;AACH,aAAO,OAAO;AAAA,IAChB,KAAK,eAAe;AAClB,YAAM,QAAQ,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AACvB,cAAA,QAAQ,CAAC,UAAA,CAAW;AAEnB,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,YAAY;AACf,YAAM,QAAQ,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AAC7B,cAAM,OAAO;AAEP,cAAA,MAAM,KAAK,IAAI;AAEd,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,aAAa;AAChB,YAAM,QAAQ,aAAa,OAAO,IAAI,KAAK;AACvC,UAAA,SAAS,WAAW,OAAO;AAC7B,cAAM,MAAM,KAAK,WAAW,IAAI,CAAC;AAE1B,eAAA;AAAA,MACT;AACA;AAAA,IACF;AAAA,IACA,KAAK,eAAe;AAClB,YAAM,SAAS,eAAe,OAAO,IAAI,KAAK;AAC9C,UAAI,QAAQ;AACH,eAAA,QAAQ,OAAO,MAAM,OAAO,CAAC,SAAS,KAAK,OAAO,OAAO,EAAE;AAE3D,eAAA;AAAA,MACT;AAGA,aAAO,WAAW;AAAA,IACpB;AAAA,IACA,KAAK,kBAAkB;AACrB,YAAM,OAAO,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,OAAO,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,OAAO,aAAa,OAAO,IAAI,KAAK;AACtC,UAAA,QAAQ,eAAe,MAAM;AAC3B,YAAA,KAAK,aAAa,OAAO,UAAU;AAErC,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,OAAO,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;"}

package/dist/esm/ScrollTo/Horizontal/ScrollToHorizontal.js CHANGED Viewed

@@ -14,6 +14,7 @@ const HvScrollToHorizontal = (props) => {
     id,
     defaultSelectedIndex = 0,
     scrollElementId,
+    // @ts-ignore
     href = true,
     navigationMode = href ? "push" : "none",
     relativeLinks = false,
@@ -51,8 +52,7 @@ const HvScrollToHorizontal = (props) => {
         onClick?.(event, index);
       },
       onKeyDown: (event) => {
-        if (isKey(event, "Enter") !== true)
-          return;
+        if (isKey(event, "Enter") !== true) return;
         event.preventDefault();
         setScrollTo(event, option.value, index, () => onChange?.(event, index));
         onEnter?.(event, index);

package/dist/esm/ScrollTo/Horizontal/ScrollToHorizontal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ScrollToHorizontal.js","sources":["../../../../src/ScrollTo/Horizontal/ScrollToHorizontal.tsx"],"sourcesContent":["import { useTheme as useMuiTheme } from \"@mui/material/styles\";\nimport useMediaQuery from \"@mui/material/useMediaQuery\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { isKey } from \"../../utils/keyboardUtils\";\nimport { setId } from \"../../utils/setId\";\nimport { HvScrollToOption, HvScrollToTooltipPositions } from \"../types\";\nimport { useScrollTo } from \"../useScrollTo\";\nimport { HvHorizontalScrollListItem } from \"./HorizontalScrollListItem\";\nimport { staticClasses, useClasses } from \"./ScrollToHorizontal.styles\";\n\nexport { staticClasses as scrollToHorizontalClasses };\n\nexport type HvScrollToHorizontalClasses = ExtractNames<typeof useClasses>;\n\nexport type HvScrollToHorizontalPositions = \"sticky\" \| \"fixed\" \| \"relative\";\n\nexport interface HvScrollToHorizontalProps\n extends HvBaseProps<HTMLOListElement, \"onChange\" \| \"onClick\"> {\n /** An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied /\n options: HvScrollToOption[];\n /\n Should the active element be reflected in the URL.\n \n @default true\n \n @deprecated Use `navigationMode` instead.\n * /\n href?: boolean;\n /\n The navigation mode to be used when the user clicks on a tab element.\n * - `push` will add a new entry to the history stack.\n * - `replace` will replace the current entry on the history stack.\n * - `none` will not add any entry to the history stack.\n \n Defaults to `push`, unless the deprecated `href` prop is set to `false`, in which case it defaults to `none`.\n \n When set to `none`, then each element will render a button instead of a link.\n \n @default \"push\"\n /\n navigationMode?: \"push\" \| \"replace\" \| \"none\";\n /\n When set to `true`, the generated links will be relative (e.g. `#section`).\n * Relative URLs take into account not only the current location, but also the base URL if it is set (i.e. a `<base>` tag).\n * This can lead to unexpected behavior.\n \n When set to `false`, the links will be generated from the current location's full URL (e.g. `http://example.com/hello/world?value=123#section`).\n \n @default false\n /\n relativeLinks?: boolean;\n /* Default selected index passed from the parent. /\n defaultSelectedIndex?: number;\n /\n The Id of the scrollable container containing displayed elements.\n \n Defaults to `window` if unspecified.\n /\n scrollElementId?: string;\n /\n Defines the offset from the top of each element for getting an optimal viewing region in the container.\n * This allows to exclude regions of the container that are obscured by other content (such as fixed-positioned toolbars or titles)\n * or to put more breathing room between the targeted element and the edges of the container.\n \n Each element can also have a specific offset via the options property.\n /\n offset?: number;\n /* Position of the Horizontal scroll to. /\n position?: HvScrollToHorizontalPositions;\n /* Position of tooltip identifying the current item. /\n tooltipPosition?: HvScrollToTooltipPositions;\n /* A function called each time the selected index changes. /\n onChange?: (\n event:\n \| Event\n \| React.MouseEvent<HTMLDivElement \| HTMLAnchorElement>\n \| React.KeyboardEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A function called each time an user clicks on a tab element. /\n onClick?: (\n event: React.MouseEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A function called each time an user press enter on a tab element. /\n onEnter?: (\n event: React.KeyboardEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A Jss Object used to override or extend the styles applied. /\n classes?: HvScrollToHorizontalClasses;\n}\n\n/\n The horizontal scroll to element can be used to quickly navigate in a page.\n /\nexport const HvScrollToHorizontal = (props: HvScrollToHorizontalProps) => {\n const {\n id,\n defaultSelectedIndex = 0,\n scrollElementId,\n href = true,\n navigationMode = href ? \"push\" : \"none\",\n relativeLinks = false,\n onChange,\n onClick,\n onEnter,\n className,\n classes: classesProp,\n options,\n offset = 0,\n position = \"relative\",\n tooltipPosition = \"top\",\n ...others\n } = useDefaultProps(\"HvScrollToHorizontal\", props);\n\n const { classes, css, cx } = useClasses(classesProp);\n const muiTheme = useMuiTheme();\n\n const downSm = useMediaQuery(muiTheme.breakpoints.down(\"sm\"));\n const upMd = useMediaQuery(muiTheme.breakpoints.up(\"md\"));\n\n const [selectedIndex, setScrollTo, elements] = useScrollTo(\n defaultSelectedIndex,\n scrollElementId,\n navigationMode,\n relativeLinks,\n offset,\n options,\n onChange,\n );\n\n const tabs = elements.map((option, index) => (\n <HvHorizontalScrollListItem\n id={setId(id, `item-${index}`)}\n onClick={(event) => {\n event.preventDefault();\n\n setScrollTo(event, option.value, index, () => onChange?.(event, index));\n onClick?.(event, index);\n }}\n onKeyDown={(event) => {\n if (isKey(event, \"Enter\") !== true) return;\n event.preventDefault();\n\n setScrollTo(event, option.value, index, () => onChange?.(event, index));\n onEnter?.(event, index);\n }}\n href={navigationMode !== \"none\" ? option.href : undefined}\n tooltipPlacement={tooltipPosition}\n selected={selectedIndex === index}\n key={option.key \|\| option.label}\n label={option.label}\n iconClasses={cx({\n [classes.selected]: selectedIndex === index,\n [classes.notSelected]: selectedIndex !== index,\n [classes.notSelectedRoot]: selectedIndex !== index,\n })}\n />\n ));\n\n return (\n <ol\n className={cx(\n css({\n width:\n position === \"fixed\" && (upMd \|\| downSm)\n ? `calc(100% - 2${theme.spacing(upMd ? 4 : 2)})`\n : \"100%\",\n marginTop: 0,\n marginBottom: 0,\n marginRight:\n position === \"fixed\" && (upMd \|\| downSm)\n ? theme.spacing(upMd ? 4 : 2)\n : 0,\n marginLeft:\n position === \"fixed\" && (upMd \|\| downSm)\n ? theme.spacing(upMd ? 4 : 2)\n : 0,\n }),\n classes.root,\n {\n [classes.positionSticky]: position === \"sticky\",\n [classes.positionFixed]: position === \"fixed\",\n },\n className,\n )}\n id={id}\n {...others}\n >\n {tabs}\n </ol>\n );\n};\n"],"names":["useMuiTheme"],"mappings":";;;;;;;;;;;AAoGa,MAAA,uBAAuB,CAAC,UAAqC;AAClE,QAAA;AAAA,IACJ;AAAA,IACA,uBAAuB;AAAA,IACvB;AAAA,~~IACA~~,OAAO;AAAA,IACP,iBAAiB,OAAO,SAAS;AAAA,IACjC,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB,GAAG;AAAA,EAAA,IACD,gBAAgB,wBAAwB,KAAK;AAEjD,QAAM,EAAE,SAAS,KAAK,GAAG,IAAI,WAAW,WAAW;AACnD,QAAM,WAAWA;AAEjB,QAAM,SAAS,cAAc,SAAS,YAAY,KAAK,IAAI,CAAC;AAC5D,QAAM,OAAO,cAAc,SAAS,YAAY,GAAG,IAAI,CAAC;AAExD,QAAM,CAAC,eAAe,aAAa,QAAQ,IAAI;AAAA,IAC7C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAGF,QAAM,OAAO,SAAS,IAAI,CAAC,QAAQ,UACjC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI,MAAM,IAAI,QAAQ,KAAK,EAAE;AAAA,MAC7B,SAAS,CAAC,UAAU;AAClB,cAAM,eAAe;AAET,oBAAA,OAAO,OAAO,OAAO,OAAO,MAAM,WAAW,OAAO,KAAK,CAAC;AACtE,kBAAU,OAAO,KAAK;AAAA,MACxB;AAAA,MACA,WAAW,CAAC,UAAU;~~AAChB~~,~~YAAA~~,MAAM,OAAO,OAAO,MAAM;~~AAAM;~~AACpC,cAAM,eAAe;AAET,oBAAA,OAAO,OAAO,OAAO,OAAO,MAAM,WAAW,OAAO,KAAK,CAAC;AACtE,kBAAU,OAAO,KAAK;AAAA,MACxB;AAAA,MACA,MAAM,mBAAmB,SAAS,OAAO,OAAO;AAAA,MAChD,kBAAkB;AAAA,MAClB,UAAU,kBAAkB;AAAA,MAE5B,OAAO,OAAO;AAAA,MACd,aAAa,GAAG;AAAA,QACd,CAAC,QAAQ,QAAQ,GAAG,kBAAkB;AAAA,QACtC,CAAC,QAAQ,WAAW,GAAG,kBAAkB;AAAA,QACzC,CAAC,QAAQ,eAAe,GAAG,kBAAkB;AAAA,MAAA,CAC9C;AAAA,IAAA;AAAA,IANI,OAAO,OAAO,OAAO;AAAA,EAAA,CAQ7B;AAGC,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,IAAI;AAAA,UACF,OACE,aAAa,YAAY,QAAQ,UAC7B,iBAAiB,MAAM,QAAQ,OAAO,IAAI,CAAC,CAAC,MAC5C;AAAA,UACN,WAAW;AAAA,UACX,cAAc;AAAA,UACd,aACE,aAAa,YAAY,QAAQ,UAC7B,MAAM,QAAQ,OAAO,IAAI,CAAC,IAC1B;AAAA,UACN,YACE,aAAa,YAAY,QAAQ,UAC7B,MAAM,QAAQ,OAAO,IAAI,CAAC,IAC1B;AAAA,QAAA,CACP;AAAA,QACD,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,cAAc,GAAG,aAAa;AAAA,UACvC,CAAC,QAAQ,aAAa,GAAG,aAAa;AAAA,QACxC;AAAA,QACA;AAAA,MACF;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}
1	+ {"version":3,"file":"ScrollToHorizontal.js","sources":["../../../../src/ScrollTo/Horizontal/ScrollToHorizontal.tsx"],"sourcesContent":["import { useTheme as useMuiTheme } from \"@mui/material/styles\";\nimport useMediaQuery from \"@mui/material/useMediaQuery\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { isKey } from \"../../utils/keyboardUtils\";\nimport { setId } from \"../../utils/setId\";\nimport { HvScrollToOption, HvScrollToTooltipPositions } from \"../types\";\nimport { useScrollTo } from \"../useScrollTo\";\nimport { HvHorizontalScrollListItem } from \"./HorizontalScrollListItem\";\nimport { staticClasses, useClasses } from \"./ScrollToHorizontal.styles\";\n\nexport { staticClasses as scrollToHorizontalClasses };\n\nexport type HvScrollToHorizontalClasses = ExtractNames<typeof useClasses>;\n\nexport type HvScrollToHorizontalPositions = \"sticky\" \| \"fixed\" \| \"relative\";\n\nexport interface HvScrollToHorizontalProps\n extends HvBaseProps<HTMLOListElement, \"onChange\" \| \"onClick\"> {\n /** An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied /\n options: HvScrollToOption[];\n /\n Should the active element be reflected in the URL.\n \n @default true\n \n @deprecated Use `navigationMode` instead.\n * /\n href?: boolean;\n /\n The navigation mode to be used when the user clicks on a tab element.\n * - `push` will add a new entry to the history stack.\n * - `replace` will replace the current entry on the history stack.\n * - `none` will not add any entry to the history stack.\n \n Defaults to `push`, unless the deprecated `href` prop is set to `false`, in which case it defaults to `none`.\n \n When set to `none`, then each element will render a button instead of a link.\n \n @default \"push\"\n /\n navigationMode?: \"push\" \| \"replace\" \| \"none\";\n /\n When set to `true`, the generated links will be relative (e.g. `#section`).\n * Relative URLs take into account not only the current location, but also the base URL if it is set (i.e. a `<base>` tag).\n * This can lead to unexpected behavior.\n \n When set to `false`, the links will be generated from the current location's full URL (e.g. `http://example.com/hello/world?value=123#section`).\n \n @default false\n /\n relativeLinks?: boolean;\n /* Default selected index passed from the parent. /\n defaultSelectedIndex?: number;\n /\n The Id of the scrollable container containing displayed elements.\n \n Defaults to `window` if unspecified.\n /\n scrollElementId?: string;\n /\n Defines the offset from the top of each element for getting an optimal viewing region in the container.\n * This allows to exclude regions of the container that are obscured by other content (such as fixed-positioned toolbars or titles)\n * or to put more breathing room between the targeted element and the edges of the container.\n \n Each element can also have a specific offset via the options property.\n /\n offset?: number;\n /* Position of the Horizontal scroll to. /\n position?: HvScrollToHorizontalPositions;\n /* Position of tooltip identifying the current item. /\n tooltipPosition?: HvScrollToTooltipPositions;\n /* A function called each time the selected index changes. /\n onChange?: (\n event:\n \| Event\n \| React.MouseEvent<HTMLDivElement \| HTMLAnchorElement>\n \| React.KeyboardEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A function called each time an user clicks on a tab element. /\n onClick?: (\n event: React.MouseEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A function called each time an user press enter on a tab element. /\n onEnter?: (\n event: React.KeyboardEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A Jss Object used to override or extend the styles applied. /\n classes?: HvScrollToHorizontalClasses;\n}\n\n/\n The horizontal scroll to element can be used to quickly navigate in a page.\n /\nexport const HvScrollToHorizontal = (props: HvScrollToHorizontalProps) => {\n const {\n id,\n defaultSelectedIndex = 0,\n scrollElementId,\n // @ts-ignore\n href = true,\n navigationMode = href ? \"push\" : \"none\",\n relativeLinks = false,\n onChange,\n onClick,\n onEnter,\n className,\n classes: classesProp,\n options,\n offset = 0,\n position = \"relative\",\n tooltipPosition = \"top\",\n ...others\n } = useDefaultProps(\"HvScrollToHorizontal\", props);\n\n const { classes, css, cx } = useClasses(classesProp);\n const muiTheme = useMuiTheme();\n\n const downSm = useMediaQuery(muiTheme.breakpoints.down(\"sm\"));\n const upMd = useMediaQuery(muiTheme.breakpoints.up(\"md\"));\n\n const [selectedIndex, setScrollTo, elements] = useScrollTo(\n defaultSelectedIndex,\n scrollElementId,\n navigationMode,\n relativeLinks,\n offset,\n options,\n onChange,\n );\n\n const tabs = elements.map((option, index) => (\n <HvHorizontalScrollListItem\n id={setId(id, `item-${index}`)}\n onClick={(event) => {\n event.preventDefault();\n\n setScrollTo(event, option.value, index, () => onChange?.(event, index));\n onClick?.(event, index);\n }}\n onKeyDown={(event) => {\n if (isKey(event, \"Enter\") !== true) return;\n event.preventDefault();\n\n setScrollTo(event, option.value, index, () => onChange?.(event, index));\n onEnter?.(event, index);\n }}\n href={navigationMode !== \"none\" ? option.href : undefined}\n tooltipPlacement={tooltipPosition}\n selected={selectedIndex === index}\n key={option.key \|\| option.label}\n label={option.label}\n iconClasses={cx({\n [classes.selected]: selectedIndex === index,\n [classes.notSelected]: selectedIndex !== index,\n [classes.notSelectedRoot]: selectedIndex !== index,\n })}\n />\n ));\n\n return (\n <ol\n className={cx(\n css({\n width:\n position === \"fixed\" && (upMd \|\| downSm)\n ? `calc(100% - 2${theme.spacing(upMd ? 4 : 2)})`\n : \"100%\",\n marginTop: 0,\n marginBottom: 0,\n marginRight:\n position === \"fixed\" && (upMd \|\| downSm)\n ? theme.spacing(upMd ? 4 : 2)\n : 0,\n marginLeft:\n position === \"fixed\" && (upMd \|\| downSm)\n ? theme.spacing(upMd ? 4 : 2)\n : 0,\n }),\n classes.root,\n {\n [classes.positionSticky]: position === \"sticky\",\n [classes.positionFixed]: position === \"fixed\",\n },\n className,\n )}\n id={id}\n {...others}\n >\n {tabs}\n </ol>\n );\n};\n"],"names":["useMuiTheme"],"mappings":";;;;;;;;;;;AAoGa,MAAA,uBAAuB,CAAC,UAAqC;AAClE,QAAA;AAAA,IACJ;AAAA,IACA,uBAAuB;AAAA,IACvB;AAAA;AAAA,IAEA,OAAO;AAAA,IACP,iBAAiB,OAAO,SAAS;AAAA,IACjC,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB,GAAG;AAAA,EAAA,IACD,gBAAgB,wBAAwB,KAAK;AAEjD,QAAM,EAAE,SAAS,KAAK,GAAG,IAAI,WAAW,WAAW;AACnD,QAAM,WAAWA;AAEjB,QAAM,SAAS,cAAc,SAAS,YAAY,KAAK,IAAI,CAAC;AAC5D,QAAM,OAAO,cAAc,SAAS,YAAY,GAAG,IAAI,CAAC;AAExD,QAAM,CAAC,eAAe,aAAa,QAAQ,IAAI;AAAA,IAC7C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAGF,QAAM,OAAO,SAAS,IAAI,CAAC,QAAQ,UACjC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI,MAAM,IAAI,QAAQ,KAAK,EAAE;AAAA,MAC7B,SAAS,CAAC,UAAU;AAClB,cAAM,eAAe;AAET,oBAAA,OAAO,OAAO,OAAO,OAAO,MAAM,WAAW,OAAO,KAAK,CAAC;AACtE,kBAAU,OAAO,KAAK;AAAA,MACxB;AAAA,MACA,WAAW,CAAC,UAAU;AACpB,YAAI,MAAM,OAAO,OAAO,MAAM,KAAM;AACpC,cAAM,eAAe;AAET,oBAAA,OAAO,OAAO,OAAO,OAAO,MAAM,WAAW,OAAO,KAAK,CAAC;AACtE,kBAAU,OAAO,KAAK;AAAA,MACxB;AAAA,MACA,MAAM,mBAAmB,SAAS,OAAO,OAAO;AAAA,MAChD,kBAAkB;AAAA,MAClB,UAAU,kBAAkB;AAAA,MAE5B,OAAO,OAAO;AAAA,MACd,aAAa,GAAG;AAAA,QACd,CAAC,QAAQ,QAAQ,GAAG,kBAAkB;AAAA,QACtC,CAAC,QAAQ,WAAW,GAAG,kBAAkB;AAAA,QACzC,CAAC,QAAQ,eAAe,GAAG,kBAAkB;AAAA,MAAA,CAC9C;AAAA,IAAA;AAAA,IANI,OAAO,OAAO,OAAO;AAAA,EAAA,CAQ7B;AAGC,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,IAAI;AAAA,UACF,OACE,aAAa,YAAY,QAAQ,UAC7B,iBAAiB,MAAM,QAAQ,OAAO,IAAI,CAAC,CAAC,MAC5C;AAAA,UACN,WAAW;AAAA,UACX,cAAc;AAAA,UACd,aACE,aAAa,YAAY,QAAQ,UAC7B,MAAM,QAAQ,OAAO,IAAI,CAAC,IAC1B;AAAA,UACN,YACE,aAAa,YAAY,QAAQ,UAC7B,MAAM,QAAQ,OAAO,IAAI,CAAC,IAC1B;AAAA,QAAA,CACP;AAAA,QACD,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,cAAc,GAAG,aAAa;AAAA,UACvC,CAAC,QAAQ,aAAa,GAAG,aAAa;AAAA,QACxC;AAAA,QACA;AAAA,MACF;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/esm/ScrollTo/Vertical/ScrollToVertical.js CHANGED Viewed

@@ -11,6 +11,7 @@ const HvScrollToVertical = (props) => {
     id,
     defaultSelectedIndex = 0,
     scrollElementId,
+    // @ts-ignore
     href = true,
     navigationMode = href ? "push" : "none",
     relativeLinks = false,
@@ -46,8 +47,7 @@ const HvScrollToVertical = (props) => {
         onClick?.(event, index);
       },
       onKeyDown: (event) => {
-        if (isKey(event, "Enter") !== true)
-          return;
+        if (isKey(event, "Enter") !== true) return;
         event.preventDefault();
         setScrollTo(event, option.value, index, () => onChange?.(event, index));
         onEnter?.(event, index);

package/dist/esm/ScrollTo/Vertical/ScrollToVertical.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ScrollToVertical.js","sources":["../../../../src/ScrollTo/Vertical/ScrollToVertical.tsx"],"sourcesContent":["import { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { isKey } from \"../../utils/keyboardUtils\";\nimport { setId } from \"../../utils/setId\";\nimport {\n HvScrollToOption,\n HvScrollToTooltipPositions,\n HvScrollToVerticalPositions,\n} from \"../types\";\nimport { useScrollTo } from \"../useScrollTo\";\nimport {\n calculateOffset,\n staticClasses,\n useClasses,\n} from \"./ScrollToVertical.styles\";\nimport { HvVerticalScrollListItem } from \"./VerticalScrollListItem\";\n\nexport { staticClasses as scrollToVerticalClasses };\n\nexport type HvScrollToVerticalClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvScrollToVerticalProps\n extends HvBaseProps<HTMLOListElement, \"onChange\" \| \"onClick\"> {\n /** An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied /\n options: HvScrollToOption[];\n /\n Should the active element be reflected in the URL.\n \n @default true\n \n @deprecated Use `navigationMode` instead.\n * /\n href?: boolean;\n /\n The navigation mode to be used when the user clicks on a tab element.\n * - `push` will add a new entry to the history stack.\n * - `replace` will replace the current entry on the history stack.\n * - `none` will not add any entry to the history stack.\n \n Defaults to `push`, unless the deprecated `href` prop is set to `false`, in which case it defaults to `none`.\n \n When set to `none`, then each element will render a button instead of a link.\n \n @default \"push\"\n /\n navigationMode?: \"push\" \| \"replace\" \| \"none\";\n /\n When set to `true`, the generated links will be relative (e.g. `#section`).\n * Relative URLs take into account not only the current location, but also the base URL if it is set (i.e. a `<base>` tag).\n * This can lead to unexpected behavior.\n \n When set to `false`, the links will be generated from the current location's full URL (e.g. `http://example.com/hello/world?value=123#section`).\n \n @default false\n /\n relativeLinks?: boolean;\n /* Default selected index passed from the parent. /\n defaultSelectedIndex?: number;\n /\n The Id of the scrollable container containing displayed elements.\n \n Defaults to `window` if unspecified.\n /\n scrollElementId?: string;\n /\n Defines the offset from the top of each element for getting an optimal viewing region in the container.\n * This allows to exclude regions of the container that are obscured by other content (such as fixed-positioned toolbars or titles)\n * or to put more breathing room between the targeted element and the edges of the container.\n \n Each element can also have a specific offset via the options property.\n /\n offset?: number;\n /* Position of the Vertical scroll to. /\n position?: HvScrollToVerticalPositions;\n /* Position of tooltip identifying the current item. /\n tooltipPosition?: HvScrollToTooltipPositions;\n /* A function called each time the selected index changes. /\n onChange?: (\n event:\n \| Event\n \| React.MouseEvent<HTMLDivElement \| HTMLAnchorElement>\n \| React.KeyboardEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A function called each time an user clicks on a tab element. /\n onClick?: (\n event: React.MouseEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A function called each time an user press enter on a tab element. /\n onEnter?: (\n event: React.KeyboardEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A Jss Object used to override or extend the styles applied. /\n classes?: HvScrollToVerticalClasses;\n}\n\n/\n The vertical scroll to element can be used to quickly navigate in a page.\n */\nexport const HvScrollToVertical = (props: HvScrollToVerticalProps) => {\n const {\n id,\n defaultSelectedIndex = 0,\n scrollElementId,\n href = true,\n navigationMode = href ? \"push\" : \"none\",\n relativeLinks = false,\n onChange,\n onClick,\n onEnter,\n className,\n classes: classesProp,\n options,\n offset = 0,\n position = \"relative\",\n tooltipPosition = \"left\",\n style,\n ...others\n } = useDefaultProps(\"HvScrollToVertical\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [selectedIndex, setScrollTo, elements] = useScrollTo(\n defaultSelectedIndex,\n scrollElementId,\n navigationMode,\n relativeLinks,\n offset,\n options,\n onChange,\n );\n\n const tabs = elements.map((option, index) => (\n <HvVerticalScrollListItem\n id={setId(id, `item-${index}`)}\n onClick={(event) => {\n event.preventDefault();\n\n setScrollTo(event, option.value, index, () => onChange?.(event, index));\n onClick?.(event, index);\n }}\n onKeyDown={(event) => {\n if (isKey(event, \"Enter\") !== true) return;\n event.preventDefault();\n\n setScrollTo(event, option.value, index, () => onChange?.(event, index));\n onEnter?.(event, index);\n }}\n href={navigationMode !== \"none\" ? option.href : undefined}\n tooltipPlacement={tooltipPosition}\n selected={selectedIndex === index}\n key={option.key \|\| option.label}\n label={option.label}\n />\n ));\n\n const positionOffset = calculateOffset(options.length);\n\n return (\n <ol\n className={cx(\n classes.root,\n {\n [classes.positionFixed]: position === \"fixed\",\n [classes.positionAbsolute]: position === \"absolute\",\n },\n className,\n )}\n style={{ top: `calc(50% - ${positionOffset}px)`, ...style }}\n id={id}\n {...others}\n >\n {tabs}\n </ol>\n );\n};\n"],"names":[],"mappings":";;;;;;;;AAsGa,MAAA,qBAAqB,CAAC,UAAmC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA,uBAAuB;AAAA,IACvB;AAAA,~~IACA~~,OAAO;AAAA,IACP,iBAAiB,OAAO,SAAS;AAAA,IACjC,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,sBAAsB,KAAK;AAE/C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,CAAC,eAAe,aAAa,QAAQ,IAAI;AAAA,IAC7C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAGF,QAAM,OAAO,SAAS,IAAI,CAAC,QAAQ,UACjC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI,MAAM,IAAI,QAAQ,KAAK,EAAE;AAAA,MAC7B,SAAS,CAAC,UAAU;AAClB,cAAM,eAAe;AAET,oBAAA,OAAO,OAAO,OAAO,OAAO,MAAM,WAAW,OAAO,KAAK,CAAC;AACtE,kBAAU,OAAO,KAAK;AAAA,MACxB;AAAA,MACA,WAAW,CAAC,UAAU;~~AAChB~~,~~YAAA~~,MAAM,OAAO,OAAO,MAAM;~~AAAM;~~AACpC,cAAM,eAAe;AAET,oBAAA,OAAO,OAAO,OAAO,OAAO,MAAM,WAAW,OAAO,KAAK,CAAC;AACtE,kBAAU,OAAO,KAAK;AAAA,MACxB;AAAA,MACA,MAAM,mBAAmB,SAAS,OAAO,OAAO;AAAA,MAChD,kBAAkB;AAAA,MAClB,UAAU,kBAAkB;AAAA,MAE5B,OAAO,OAAO;AAAA,IAAA;AAAA,IADT,OAAO,OAAO,OAAO;AAAA,EAAA,CAG7B;AAEK,QAAA,iBAAiB,gBAAgB,QAAQ,MAAM;AAGnD,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,aAAa,GAAG,aAAa;AAAA,UACtC,CAAC,QAAQ,gBAAgB,GAAG,aAAa;AAAA,QAC3C;AAAA,QACA;AAAA,MACF;AAAA,MACA,OAAO,EAAE,KAAK,cAAc,cAAc,OAAO,GAAG,MAAM;AAAA,MAC1D;AAAA,MACC,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}
1	+ {"version":3,"file":"ScrollToVertical.js","sources":["../../../../src/ScrollTo/Vertical/ScrollToVertical.tsx"],"sourcesContent":["import { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { isKey } from \"../../utils/keyboardUtils\";\nimport { setId } from \"../../utils/setId\";\nimport {\n HvScrollToOption,\n HvScrollToTooltipPositions,\n HvScrollToVerticalPositions,\n} from \"../types\";\nimport { useScrollTo } from \"../useScrollTo\";\nimport {\n calculateOffset,\n staticClasses,\n useClasses,\n} from \"./ScrollToVertical.styles\";\nimport { HvVerticalScrollListItem } from \"./VerticalScrollListItem\";\n\nexport { staticClasses as scrollToVerticalClasses };\n\nexport type HvScrollToVerticalClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvScrollToVerticalProps\n extends HvBaseProps<HTMLOListElement, \"onChange\" \| \"onClick\"> {\n /** An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied /\n options: HvScrollToOption[];\n /\n Should the active element be reflected in the URL.\n \n @default true\n \n @deprecated Use `navigationMode` instead.\n * /\n href?: boolean;\n /\n The navigation mode to be used when the user clicks on a tab element.\n * - `push` will add a new entry to the history stack.\n * - `replace` will replace the current entry on the history stack.\n * - `none` will not add any entry to the history stack.\n \n Defaults to `push`, unless the deprecated `href` prop is set to `false`, in which case it defaults to `none`.\n \n When set to `none`, then each element will render a button instead of a link.\n \n @default \"push\"\n /\n navigationMode?: \"push\" \| \"replace\" \| \"none\";\n /\n When set to `true`, the generated links will be relative (e.g. `#section`).\n * Relative URLs take into account not only the current location, but also the base URL if it is set (i.e. a `<base>` tag).\n * This can lead to unexpected behavior.\n \n When set to `false`, the links will be generated from the current location's full URL (e.g. `http://example.com/hello/world?value=123#section`).\n \n @default false\n /\n relativeLinks?: boolean;\n /* Default selected index passed from the parent. /\n defaultSelectedIndex?: number;\n /\n The Id of the scrollable container containing displayed elements.\n \n Defaults to `window` if unspecified.\n /\n scrollElementId?: string;\n /\n Defines the offset from the top of each element for getting an optimal viewing region in the container.\n * This allows to exclude regions of the container that are obscured by other content (such as fixed-positioned toolbars or titles)\n * or to put more breathing room between the targeted element and the edges of the container.\n \n Each element can also have a specific offset via the options property.\n /\n offset?: number;\n /* Position of the Vertical scroll to. /\n position?: HvScrollToVerticalPositions;\n /* Position of tooltip identifying the current item. /\n tooltipPosition?: HvScrollToTooltipPositions;\n /* A function called each time the selected index changes. /\n onChange?: (\n event:\n \| Event\n \| React.MouseEvent<HTMLDivElement \| HTMLAnchorElement>\n \| React.KeyboardEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A function called each time an user clicks on a tab element. /\n onClick?: (\n event: React.MouseEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A function called each time an user press enter on a tab element. /\n onEnter?: (\n event: React.KeyboardEvent<HTMLDivElement \| HTMLAnchorElement>,\n index: number,\n ) => void;\n /* A Jss Object used to override or extend the styles applied. /\n classes?: HvScrollToVerticalClasses;\n}\n\n/\n The vertical scroll to element can be used to quickly navigate in a page.\n */\nexport const HvScrollToVertical = (props: HvScrollToVerticalProps) => {\n const {\n id,\n defaultSelectedIndex = 0,\n scrollElementId,\n // @ts-ignore\n href = true,\n navigationMode = href ? \"push\" : \"none\",\n relativeLinks = false,\n onChange,\n onClick,\n onEnter,\n className,\n classes: classesProp,\n options,\n offset = 0,\n position = \"relative\",\n tooltipPosition = \"left\",\n style,\n ...others\n } = useDefaultProps(\"HvScrollToVertical\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [selectedIndex, setScrollTo, elements] = useScrollTo(\n defaultSelectedIndex,\n scrollElementId,\n navigationMode,\n relativeLinks,\n offset,\n options,\n onChange,\n );\n\n const tabs = elements.map((option, index) => (\n <HvVerticalScrollListItem\n id={setId(id, `item-${index}`)}\n onClick={(event) => {\n event.preventDefault();\n\n setScrollTo(event, option.value, index, () => onChange?.(event, index));\n onClick?.(event, index);\n }}\n onKeyDown={(event) => {\n if (isKey(event, \"Enter\") !== true) return;\n event.preventDefault();\n\n setScrollTo(event, option.value, index, () => onChange?.(event, index));\n onEnter?.(event, index);\n }}\n href={navigationMode !== \"none\" ? option.href : undefined}\n tooltipPlacement={tooltipPosition}\n selected={selectedIndex === index}\n key={option.key \|\| option.label}\n label={option.label}\n />\n ));\n\n const positionOffset = calculateOffset(options.length);\n\n return (\n <ol\n className={cx(\n classes.root,\n {\n [classes.positionFixed]: position === \"fixed\",\n [classes.positionAbsolute]: position === \"absolute\",\n },\n className,\n )}\n style={{ top: `calc(50% - ${positionOffset}px)`, ...style }}\n id={id}\n {...others}\n >\n {tabs}\n </ol>\n );\n};\n"],"names":[],"mappings":";;;;;;;;AAsGa,MAAA,qBAAqB,CAAC,UAAmC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA,uBAAuB;AAAA,IACvB;AAAA;AAAA,IAEA,OAAO;AAAA,IACP,iBAAiB,OAAO,SAAS;AAAA,IACjC,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,sBAAsB,KAAK;AAE/C,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,QAAM,CAAC,eAAe,aAAa,QAAQ,IAAI;AAAA,IAC7C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAGF,QAAM,OAAO,SAAS,IAAI,CAAC,QAAQ,UACjC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI,MAAM,IAAI,QAAQ,KAAK,EAAE;AAAA,MAC7B,SAAS,CAAC,UAAU;AAClB,cAAM,eAAe;AAET,oBAAA,OAAO,OAAO,OAAO,OAAO,MAAM,WAAW,OAAO,KAAK,CAAC;AACtE,kBAAU,OAAO,KAAK;AAAA,MACxB;AAAA,MACA,WAAW,CAAC,UAAU;AACpB,YAAI,MAAM,OAAO,OAAO,MAAM,KAAM;AACpC,cAAM,eAAe;AAET,oBAAA,OAAO,OAAO,OAAO,OAAO,MAAM,WAAW,OAAO,KAAK,CAAC;AACtE,kBAAU,OAAO,KAAK;AAAA,MACxB;AAAA,MACA,MAAM,mBAAmB,SAAS,OAAO,OAAO;AAAA,MAChD,kBAAkB;AAAA,MAClB,UAAU,kBAAkB;AAAA,MAE5B,OAAO,OAAO;AAAA,IAAA;AAAA,IADT,OAAO,OAAO,OAAO;AAAA,EAAA,CAG7B;AAEK,QAAA,iBAAiB,gBAAgB,QAAQ,MAAM;AAGnD,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,aAAa,GAAG,aAAa;AAAA,UACtC,CAAC,QAAQ,gBAAgB,GAAG,aAAa;AAAA,QAC3C;AAAA,QACA;AAAA,MACF;AAAA,MACA,OAAO,EAAE,KAAK,cAAc,cAAc,OAAO,GAAG,MAAM;AAAA,MAC1D;AAAA,MACC,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/esm/Section/Section.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Section.js","sources":["../../../src/Section/Section.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Down, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvButton, HvButtonProps } from \"../Button\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./Section.styles\";\n\nexport { staticClasses as sectionClasses };\n\nexport type HvSectionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSectionProps\n extends Omit<HvBaseProps<HTMLDivElement>, \"title\"> {\n /** The title of the section /\n title?: React.ReactNode;\n /* Whether or not the section is expandable. /\n expandable?: boolean;\n /* Whether the section is open or not, if this property is defined the accordion must be fully controlled. /\n expanded?: boolean;\n /* When uncontrolled, defines the initial expanded state. /\n defaultExpanded?: boolean;\n /* Section actions /\n actions?: React.ReactNode;\n /* Section onExpand callback /\n onToggle?: (\n event: React.MouseEvent<HTMLButtonElement>,\n open: boolean,\n ) => void;\n /* Props to be passed to the expand button /\n expandButtonProps?: HvButtonProps;\n /* Determines whether or not the header has a shadow on the bottom border. /\n raisedHeader?: boolean;\n /* A Jss Object used to override or extend the styles applied to the empty state component. /\n classes?: HvSectionClasses;\n /* Content container ref. /\n contentRef?: React.Ref<HTMLDivElement>;\n}\n\n/\n Sections allow grouping information on a page under the same topic.\n */\nexport const HvSection = forwardRef<HTMLDivElement, HvSectionProps>(\n (props, ref) => {\n const {\n id,\n classes: classesProp,\n className,\n title,\n expandable,\n expanded,\n defaultExpanded = true,\n actions,\n onToggle,\n expandButtonProps,\n raisedHeader,\n contentRef,\n children,\n ...others\n } = useDefaultProps(\"HvSection\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [isOpen, setIsOpen] = useControlled(\n expanded,\n Boolean(defaultExpanded),\n );\n\n const elementId = useUniqueId(id);\n const contentId = setId(elementId, \"content\");\n\n const showContent = expandable ? !!isOpen : true;\n\n return (\n <div\n ref={ref}\n id={elementId}\n className={cx(classes.root, className)}\n {...others}\n >\n {(title \|\| actions \|\| expandable) && (\n <div\n className={cx(classes.header, {\n [classes.raisedHeader]: raisedHeader && isOpen,\n })}\n >\n {expandable && (\n <HvButton\n icon\n onClick={(event) => {\n setIsOpen((o) => !o);\n onToggle?.(event, !isOpen);\n }}\n aria-expanded={isOpen}\n aria-controls={contentId}\n aria-label={isOpen ? \"Collapse\" : \"Expand\"}\n {...expandButtonProps}\n >\n {isOpen ? <Up /> : <Down />}\n </HvButton>\n )}\n {title}\n <div className={classes.actions}>{actions}</div>\n </div>\n )}\n <div\n ref={contentRef}\n id={contentId}\n hidden={!isOpen}\n className={cx(classes.content, {\n [classes.hidden]: !showContent,\n [classes.spaceTop]: !(title \|\| actions \|\| expandable),\n })}\n >\n {children}\n </div>\n </div>\n );\n },\n);\n"],"names":[],"mappings":";;;;;;;;;;AA8CO,MAAM,YAAY;AAAA,EACvB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ;AAAA,MACA,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,kBAAkB;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IAAA,IACD,gBAAgB,aAAa,KAAK;AAEtC,UAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,UAAA,CAAC,QAAQ,SAAS,IAAI;AAAA,MAC1B;AAAA,MACA,QAAQ,eAAe;AAAA,IAAA;AAGnB,UAAA,YAAY,YAAY,EAAE;AAC1B,UAAA,YAAY,MAAM,WAAW,SAAS;AAE5C,UAAM,cAAc,aAAa,CAAC,CAAC,SAAS;AAG1C,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,IAAI;AAAA,QACJ,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,QACpC,GAAG;AAAA,QAEF,UAAA;AAAA,WAAA,SAAS,WAAW,eACpB;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,GAAG,QAAQ,QAAQ;AAAA,gBAC5B,CAAC,QAAQ,YAAY,GAAG,gBAAgB;AAAA,cAAA,CACzC;AAAA,cAEA,UAAA;AAAA,gBACC,cAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAI;AAAA,oBACJ,SAAS,CAAC,UAAU;AACR,gCAAA,CAAC,MAAM,CAAC,CAAC;AACR,iCAAA,OAAO,CAAC,MAAM;AAAA,oBAC3B;AAAA,oBACA,iBAAe;AAAA,oBACf,iBAAe;AAAA,oBACf,cAAY,SAAS,aAAa;AAAA,oBACjC,GAAG;AAAA,oBAEH,UAAS,SAAA,oBAAC,IAAG,CAAA,CAAA,wBAAM,MAAK,EAAA;AAAA,kBAAA;AAAA,gBAC3B;AAAA,gBAED;AAAA,gBACA,oBAAA,OAAA,EAAI,WAAW,QAAQ,SAAU,UAAQ,SAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UAC5C;AAAA,UAEF;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAK;AAAA,cACL,IAAI;AAAA,cACJ,QAAQ,CAAC;AAAA,cACT,WAAW,GAAG,QAAQ,SAAS;AAAA,gBAC7B,CAAC,QAAQ,MAAM,GAAG,CAAC;AAAA,gBACnB,CAAC,QAAQ,QAAQ,GAAG,EAAE,SAAS,WAAW;AAAA,cAAA,CAC3C;AAAA,cAEA;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}
1	+ {"version":3,"file":"Section.js","sources":["../../../src/Section/Section.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Down, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvButton, HvButtonProps } from \"../Button\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./Section.styles\";\n\nexport { staticClasses as sectionClasses };\n\nexport type HvSectionClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSectionProps\n extends Omit<HvBaseProps<HTMLDivElement>, \"title\" \| \"onToggle\"> {\n /** The title of the section /\n title?: React.ReactNode;\n /* Whether or not the section is expandable. /\n expandable?: boolean;\n /* Whether the section is open or not, if this property is defined the accordion must be fully controlled. /\n expanded?: boolean;\n /* When uncontrolled, defines the initial expanded state. /\n defaultExpanded?: boolean;\n /* Section actions /\n actions?: React.ReactNode;\n /* Section onExpand callback /\n onToggle?: (\n event: React.MouseEvent<HTMLButtonElement>,\n open: boolean,\n ) => void;\n /* Props to be passed to the expand button /\n expandButtonProps?: HvButtonProps;\n /* Determines whether or not the header has a shadow on the bottom border. /\n raisedHeader?: boolean;\n /* A Jss Object used to override or extend the styles applied to the empty state component. /\n classes?: HvSectionClasses;\n /* Content container ref. /\n contentRef?: React.Ref<HTMLDivElement>;\n}\n\n/\n Sections allow grouping information on a page under the same topic.\n */\nexport const HvSection = forwardRef<HTMLDivElement, HvSectionProps>(\n (props, ref) => {\n const {\n id,\n classes: classesProp,\n className,\n title,\n expandable,\n expanded,\n defaultExpanded = true,\n actions,\n onToggle,\n expandButtonProps,\n raisedHeader,\n contentRef,\n children,\n ...others\n } = useDefaultProps(\"HvSection\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [isOpen, setIsOpen] = useControlled(\n expanded,\n Boolean(defaultExpanded),\n );\n\n const elementId = useUniqueId(id);\n const contentId = setId(elementId, \"content\");\n\n const showContent = expandable ? !!isOpen : true;\n\n return (\n <div\n ref={ref}\n id={elementId}\n className={cx(classes.root, className)}\n {...others}\n >\n {(title \|\| actions \|\| expandable) && (\n <div\n className={cx(classes.header, {\n [classes.raisedHeader]: raisedHeader && isOpen,\n })}\n >\n {expandable && (\n <HvButton\n icon\n onClick={(event) => {\n setIsOpen((o) => !o);\n onToggle?.(event, !isOpen);\n }}\n aria-expanded={isOpen}\n aria-controls={contentId}\n aria-label={isOpen ? \"Collapse\" : \"Expand\"}\n {...expandButtonProps}\n >\n {isOpen ? <Up /> : <Down />}\n </HvButton>\n )}\n {title}\n <div className={classes.actions}>{actions}</div>\n </div>\n )}\n <div\n ref={contentRef}\n id={contentId}\n hidden={!isOpen}\n className={cx(classes.content, {\n [classes.hidden]: !showContent,\n [classes.spaceTop]: !(title \|\| actions \|\| expandable),\n })}\n >\n {children}\n </div>\n </div>\n );\n },\n);\n"],"names":[],"mappings":";;;;;;;;;;AA8CO,MAAM,YAAY;AAAA,EACvB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ;AAAA,MACA,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,kBAAkB;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IAAA,IACD,gBAAgB,aAAa,KAAK;AAEtC,UAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,UAAA,CAAC,QAAQ,SAAS,IAAI;AAAA,MAC1B;AAAA,MACA,QAAQ,eAAe;AAAA,IAAA;AAGnB,UAAA,YAAY,YAAY,EAAE;AAC1B,UAAA,YAAY,MAAM,WAAW,SAAS;AAE5C,UAAM,cAAc,aAAa,CAAC,CAAC,SAAS;AAG1C,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,IAAI;AAAA,QACJ,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,QACpC,GAAG;AAAA,QAEF,UAAA;AAAA,WAAA,SAAS,WAAW,eACpB;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,GAAG,QAAQ,QAAQ;AAAA,gBAC5B,CAAC,QAAQ,YAAY,GAAG,gBAAgB;AAAA,cAAA,CACzC;AAAA,cAEA,UAAA;AAAA,gBACC,cAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAI;AAAA,oBACJ,SAAS,CAAC,UAAU;AACR,gCAAA,CAAC,MAAM,CAAC,CAAC;AACR,iCAAA,OAAO,CAAC,MAAM;AAAA,oBAC3B;AAAA,oBACA,iBAAe;AAAA,oBACf,iBAAe;AAAA,oBACf,cAAY,SAAS,aAAa;AAAA,oBACjC,GAAG;AAAA,oBAEH,UAAS,SAAA,oBAAC,IAAG,CAAA,CAAA,wBAAM,MAAK,EAAA;AAAA,kBAAA;AAAA,gBAC3B;AAAA,gBAED;AAAA,gBACA,oBAAA,OAAA,EAAI,WAAW,QAAQ,SAAU,UAAQ,SAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UAC5C;AAAA,UAEF;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAK;AAAA,cACL,IAAI;AAAA,cACJ,QAAQ,CAAC;AAAA,cACT,WAAW,GAAG,QAAQ,SAAS;AAAA,gBAC7B,CAAC,QAAQ,MAAM,GAAG,CAAC;AAAA,gBACnB,CAAC,QAAQ,QAAQ,GAAG,EAAE,SAAS,WAAW;AAAA,cAAA,CAC3C;AAAA,cAEA;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}

package/dist/esm/Select/Select.js CHANGED Viewed

@@ -21,8 +21,7 @@ import { HvListContainer } from "../ListContainer/ListContainer.js";
 import { HvWarningText } from "../Forms/WarningText/WarningText.js";
 function defaultRenderValue(options) {
   if (Array.isArray(options)) {
-    if (options.length === 0)
-      return null;
+    if (options.length === 0) return null;
     return /* @__PURE__ */ jsx(Fragment, { children: options.map((o) => o.label).join(", ") });
   }
   return options?.label ?? null;
@@ -173,6 +172,7 @@ const HvSelect = fixedForwardRef(function HvSelect2(props, ref) {
         /* @__PURE__ */ jsx(
           Popper,
           {
+            role: "none",
             open: isOpen,
             keepMounted: true,
             disablePortal: !enablePortal,

package/dist/esm/Select/Select.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Select.js","sources":["../../../src/Select/Select.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-use-before-define /\nimport { useRef, useState } from \"react\";\nimport { Popper } from \"@mui/base/Popper\";\nimport { SelectOption } from \"@mui/base/useOption\";\nimport {\n SelectProvider,\n useSelect,\n UseSelectParameters,\n} from \"@mui/base/useSelect\";\nimport { useControlled, useForkRef } from \"@mui/material/utils\";\nimport type { Placement } from \"@popperjs/core\";\nimport clsx from \"clsx\";\n\nimport { HvButtonProps } from \"../Button\";\nimport { HvDropdownButton } from \"../DropdownButton\";\nimport {\n HvFormElement,\n HvFormElementProps,\n HvFormStatus,\n HvInfoMessage,\n HvLabel,\n HvWarningText,\n} from \"../Forms\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useTheme } from \"../hooks/useTheme\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { HvListContainer } from \"../ListContainer\";\nimport { HvPanel } from \"../Panel\";\nimport { fixedForwardRef } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { getContainerElement } from \"../utils/document\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./Select.styles\";\n\nfunction defaultRenderValue<Value>(\n options: SelectOption<Value> \| SelectOption<Value>[] \| null,\n) {\n if (Array.isArray(options)) {\n if (options.length === 0) return null;\n return <>{options.map((o) => o.label).join(\", \")}</>;\n }\n\n return options?.label ?? null;\n}\n\nconst mergeIds = (...ids: clsx.ClassValue[]) => clsx(ids) \|\| undefined;\n\nexport { staticClasses as selectClasses };\n\nexport type HvSelectClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSelectProps<\n OptionValue extends {},\n Multiple extends boolean = false,\n> extends Omit<HvFormElementProps, \"value\" \| \"defaultValue\" \| \"onChange\">,\n Pick<\n UseSelectParameters<OptionValue, Multiple>,\n \| \"name\"\n \| \"required\"\n \| \"disabled\"\n \| \"multiple\"\n \| \"open\"\n \| \"defaultOpen\"\n \| \"value\"\n \| \"defaultValue\"\n \| \"buttonRef\"\n \| \"options\"\n \| \"getSerializedValue\"\n \| \"onChange\"\n \| \"onOpenChange\"\n >,\n Pick<HvButtonProps, \"size\" \| \"variant\"> {\n classes?: HvSelectClasses;\n placeholder?: React.ReactNode;\n autoComplete?: string;\n /* Whether the width of the select panel can vary independently. /\n variableWidth?: boolean;\n /\n Properties passed on to the input element.\n /\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /* If enabled the panel will be rendered using a portal , if disabled will be under the DOM hierarchy of the parent component. /\n enablePortal?: boolean;\n}\n\n/\n The `HvSelect` component is a form control element that allows selection from a list of options.\n \n It aims to be aligned with the native HTML `<select>` and `<option>` APIs and be easily integrated with forms.\n \n @example\n * <HvSelect name=\"pets\">\n * <HvOption value=\"dog\">Dog</HvOption>\n * <HvOption value=\"cat\">Cat</HvOption>\n * </HvSelect>\n * */\nexport const HvSelect = fixedForwardRef(function HvSelect<\n OptionValue extends {},\n Multiple extends boolean = false,\n>(\n props: HvSelectProps<OptionValue, Multiple>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const {\n children,\n classes: classesProp,\n className,\n id: idProp,\n size,\n variant = \"secondarySubtle\",\n name,\n required,\n disabled: disabledProp,\n readOnly,\n label,\n open: openProp,\n defaultOpen,\n multiple,\n autoComplete,\n options: optionsProp,\n variableWidth,\n value: valueProp,\n defaultValue,\n placeholder,\n inputProps,\n enablePortal,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n getSerializedValue,\n onClick,\n onChange,\n onOpenChange,\n ...others\n } = useDefaultProps(\"HvSelect\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const { rootId } = useTheme();\n\n const [placement, setPlacement] = useState<Placement>(\"bottom-start\");\n\n const buttonRef = useRef<HTMLButtonElement>(null);\n const handleButtonRef = useForkRef(ref, buttonRef);\n\n const {\n contextValue,\n disabled,\n getButtonProps,\n getListboxProps,\n getHiddenInputProps,\n getOptionMetadata,\n value,\n open,\n } = useSelect<OptionValue, Multiple>({\n componentName: \"HvSelect\",\n name,\n required,\n disabled: disabledProp,\n multiple,\n open: openProp,\n defaultOpen,\n value: valueProp,\n defaultValue,\n options: optionsProp,\n buttonRef: handleButtonRef,\n getSerializedValue,\n onChange,\n onOpenChange: handleOpenChange,\n });\n\n const id = useUniqueId(idProp);\n const labelId = useUniqueId(setId(idProp, \"label\"));\n const descriptionId = useUniqueId(setId(idProp, \"description\"));\n const errorMessageId = useUniqueId(setId(idProp, \"error\"));\n\n const [validationMessage] = useControlled({\n name: \"HvSelect.statusMessage\",\n controlled: statusMessage,\n default: \"Required\",\n });\n const [validationState, setValidationState] = useControlled<HvFormStatus>({\n name: \"HvSelect.status\",\n controlled: status,\n default: \"standBy\",\n });\n\n function handleOpenChange(newOpen: boolean) {\n if (!newOpen) {\n const hasValue = multiple ? (value as OptionValue[]).length > 0 : !!value;\n setValidationState(required && !hasValue ? \"invalid\" : \"valid\");\n }\n onOpenChange?.(newOpen);\n }\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and required is true\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) \|\|\n (status === undefined && required));\n\n const isInvalid = validationState === \"invalid\";\n\n const actualValue = multiple\n ? (value as OptionValue[])\n .map((v) => getOptionMetadata(v))\n .filter((v): v is SelectOption<OptionValue> => v !== undefined)\n : getOptionMetadata(value as OptionValue) ?? null;\n\n const isOpen = open && !!children;\n\n return (\n <HvFormElement\n name={name}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n status={validationState}\n className={cx(classes.root, className, {\n [classes.disabled]: disabled,\n [classes.readOnly]: readOnly,\n })}\n {...others}\n >\n {(label \|\| description) && (\n <div className={classes.labelContainer}>\n {label && (\n <HvLabel\n id={labelId}\n htmlFor={id}\n label={label}\n className={classes.label}\n />\n )}\n {description && (\n <HvInfoMessage id={descriptionId} className={classes.description}>\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvDropdownButton\n id={id}\n open={isOpen}\n disabled={disabled}\n readOnly={readOnly}\n className={cx(classes.select, {\n [classes.invalid]: validationState === \"invalid\",\n })}\n placement={placement}\n size={size}\n variant={variant}\n aria-label={ariaLabel}\n aria-labelledby={mergeIds(ariaLabelledBy, { [labelId]: label })}\n aria-invalid={isInvalid ? true : undefined}\n aria-errormessage={errorMessageId}\n aria-describedby={mergeIds(ariaDescribedBy, {\n [descriptionId]: description,\n })}\n {...getButtonProps()}\n >\n {defaultRenderValue(actualValue) ?? placeholder}\n </HvDropdownButton>\n <Popper\n open={isOpen}\n keepMounted\n disablePortal={!enablePortal}\n container={enablePortal ? getContainerElement(rootId) : undefined}\n anchorEl={buttonRef.current}\n className={classes.popper}\n placement={placement}\n modifiers={[\n {\n enabled: true,\n phase: \"main\",\n fn: ({ state }) => setPlacement(state.placement),\n },\n ]}\n >\n <HvPanel\n style={{\n width: variableWidth\n ? \"auto\"\n : (buttonRef.current?.clientWidth \|\| 0) + 2,\n }}\n className={cx(classes.panel, className, {\n [classes.panelOpenedUp]: placement.includes(\"top\"),\n [classes.panelOpenedDown]: placement.includes(\"bottom\"),\n })}\n >\n <SelectProvider value={contextValue}>\n <HvListContainer condensed selectable {...getListboxProps()}>\n {children}\n </HvListContainer>\n </SelectProvider>\n </HvPanel>\n </Popper>\n <input\n {...getHiddenInputProps()}\n autoComplete={autoComplete}\n {...inputProps}\n />\n {canShowError && (\n <HvWarningText\n id={errorMessageId}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n});\n"],"names":["HvSelect"],"mappings":"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"}
1	+ {"version":3,"file":"Select.js","sources":["../../../src/Select/Select.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-use-before-define /\nimport { useRef, useState } from \"react\";\nimport { Popper } from \"@mui/base/Popper\";\nimport { SelectOption } from \"@mui/base/useOption\";\nimport {\n SelectProvider,\n useSelect,\n UseSelectParameters,\n} from \"@mui/base/useSelect\";\nimport { useControlled, useForkRef } from \"@mui/material/utils\";\nimport type { Placement } from \"@popperjs/core\";\nimport clsx from \"clsx\";\n\nimport { HvButtonProps } from \"../Button\";\nimport { HvDropdownButton } from \"../DropdownButton\";\nimport {\n HvFormElement,\n HvFormElementProps,\n HvFormStatus,\n HvInfoMessage,\n HvLabel,\n HvWarningText,\n} from \"../Forms\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useTheme } from \"../hooks/useTheme\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { HvListContainer } from \"../ListContainer\";\nimport { HvPanel } from \"../Panel\";\nimport { fixedForwardRef } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { getContainerElement } from \"../utils/document\";\nimport { setId } from \"../utils/setId\";\nimport { staticClasses, useClasses } from \"./Select.styles\";\n\nfunction defaultRenderValue<Value>(\n options: SelectOption<Value> \| SelectOption<Value>[] \| null,\n) {\n if (Array.isArray(options)) {\n if (options.length === 0) return null;\n return <>{options.map((o) => o.label).join(\", \")}</>;\n }\n\n return options?.label ?? null;\n}\n\nconst mergeIds = (...ids: clsx.ClassValue[]) => clsx(ids) \|\| undefined;\n\nexport { staticClasses as selectClasses };\n\nexport type HvSelectClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSelectProps<\n OptionValue extends {},\n Multiple extends boolean = false,\n> extends Omit<HvFormElementProps, \"value\" \| \"defaultValue\" \| \"onChange\">,\n Pick<\n UseSelectParameters<OptionValue, Multiple>,\n \| \"name\"\n \| \"required\"\n \| \"disabled\"\n \| \"multiple\"\n \| \"open\"\n \| \"defaultOpen\"\n \| \"value\"\n \| \"defaultValue\"\n \| \"buttonRef\"\n \| \"options\"\n \| \"getSerializedValue\"\n \| \"onChange\"\n \| \"onOpenChange\"\n >,\n Pick<HvButtonProps, \"size\" \| \"variant\"> {\n classes?: HvSelectClasses;\n placeholder?: React.ReactNode;\n autoComplete?: string;\n /* Whether the width of the select panel can vary independently. /\n variableWidth?: boolean;\n /\n Properties passed on to the input element.\n /\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /* If enabled the panel will be rendered using a portal , if disabled will be under the DOM hierarchy of the parent component. /\n enablePortal?: boolean;\n}\n\n/\n The `HvSelect` component is a form control element that allows selection from a list of options.\n \n It aims to be aligned with the native HTML `<select>` and `<option>` APIs and be easily integrated with forms.\n \n @example\n * <HvSelect name=\"pets\">\n * <HvOption value=\"dog\">Dog</HvOption>\n * <HvOption value=\"cat\">Cat</HvOption>\n * </HvSelect>\n * */\nexport const HvSelect = fixedForwardRef(function HvSelect<\n OptionValue extends {},\n Multiple extends boolean = false,\n>(\n props: HvSelectProps<OptionValue, Multiple>,\n ref: React.Ref<HTMLButtonElement>,\n) {\n const {\n children,\n classes: classesProp,\n className,\n id: idProp,\n size,\n variant = \"secondarySubtle\",\n name,\n required,\n disabled: disabledProp,\n readOnly,\n label,\n open: openProp,\n defaultOpen,\n multiple,\n autoComplete,\n options: optionsProp,\n variableWidth,\n value: valueProp,\n defaultValue,\n placeholder,\n inputProps,\n enablePortal,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n getSerializedValue,\n onClick,\n onChange,\n onOpenChange,\n ...others\n } = useDefaultProps(\"HvSelect\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const { rootId } = useTheme();\n\n const [placement, setPlacement] = useState<Placement>(\"bottom-start\");\n\n const buttonRef = useRef<HTMLButtonElement>(null);\n const handleButtonRef = useForkRef(ref, buttonRef);\n\n const {\n contextValue,\n disabled,\n getButtonProps,\n getListboxProps,\n getHiddenInputProps,\n getOptionMetadata,\n value,\n open,\n } = useSelect<OptionValue, Multiple>({\n componentName: \"HvSelect\",\n name,\n required,\n disabled: disabledProp,\n multiple,\n open: openProp,\n defaultOpen,\n value: valueProp,\n defaultValue,\n options: optionsProp,\n buttonRef: handleButtonRef,\n getSerializedValue,\n onChange,\n onOpenChange: handleOpenChange,\n });\n\n const id = useUniqueId(idProp);\n const labelId = useUniqueId(setId(idProp, \"label\"));\n const descriptionId = useUniqueId(setId(idProp, \"description\"));\n const errorMessageId = useUniqueId(setId(idProp, \"error\"));\n\n const [validationMessage] = useControlled({\n name: \"HvSelect.statusMessage\",\n controlled: statusMessage,\n default: \"Required\",\n });\n const [validationState, setValidationState] = useControlled<HvFormStatus>({\n name: \"HvSelect.status\",\n controlled: status,\n default: \"standBy\",\n });\n\n function handleOpenChange(newOpen: boolean) {\n if (!newOpen) {\n const hasValue = multiple ? (value as OptionValue[]).length > 0 : !!value;\n setValidationState(required && !hasValue ? \"invalid\" : \"valid\");\n }\n onOpenChange?.(newOpen);\n }\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and required is true\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) \|\|\n (status === undefined && required));\n\n const isInvalid = validationState === \"invalid\";\n\n const actualValue = multiple\n ? (value as OptionValue[])\n .map((v) => getOptionMetadata(v))\n .filter((v): v is SelectOption<OptionValue> => v !== undefined)\n : (getOptionMetadata(value as OptionValue) ?? null);\n\n const isOpen = open && !!children;\n\n return (\n <HvFormElement\n name={name}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n status={validationState}\n className={cx(classes.root, className, {\n [classes.disabled]: disabled,\n [classes.readOnly]: readOnly,\n })}\n {...others}\n >\n {(label \|\| description) && (\n <div className={classes.labelContainer}>\n {label && (\n <HvLabel\n id={labelId}\n htmlFor={id}\n label={label}\n className={classes.label}\n />\n )}\n {description && (\n <HvInfoMessage id={descriptionId} className={classes.description}>\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvDropdownButton\n id={id}\n open={isOpen}\n disabled={disabled}\n readOnly={readOnly}\n className={cx(classes.select, {\n [classes.invalid]: validationState === \"invalid\",\n })}\n placement={placement}\n size={size}\n variant={variant}\n aria-label={ariaLabel}\n aria-labelledby={mergeIds(ariaLabelledBy, { [labelId]: label })}\n aria-invalid={isInvalid ? true : undefined}\n aria-errormessage={errorMessageId}\n aria-describedby={mergeIds(ariaDescribedBy, {\n [descriptionId]: description,\n })}\n {...getButtonProps()}\n >\n {defaultRenderValue(actualValue) ?? placeholder}\n </HvDropdownButton>\n <Popper\n role=\"none\"\n open={isOpen}\n keepMounted\n disablePortal={!enablePortal}\n container={enablePortal ? getContainerElement(rootId) : undefined}\n anchorEl={buttonRef.current}\n className={classes.popper}\n placement={placement}\n modifiers={[\n {\n enabled: true,\n phase: \"main\",\n fn: ({ state }) => setPlacement(state.placement),\n },\n ]}\n >\n <HvPanel\n style={{\n width: variableWidth\n ? \"auto\"\n : (buttonRef.current?.clientWidth \|\| 0) + 2,\n }}\n className={cx(classes.panel, className, {\n [classes.panelOpenedUp]: placement.includes(\"top\"),\n [classes.panelOpenedDown]: placement.includes(\"bottom\"),\n })}\n >\n <SelectProvider value={contextValue}>\n <HvListContainer condensed selectable {...getListboxProps()}>\n {children}\n </HvListContainer>\n </SelectProvider>\n </HvPanel>\n </Popper>\n <input\n {...getHiddenInputProps()}\n autoComplete={autoComplete}\n {...inputProps}\n />\n {canShowError && (\n <HvWarningText\n id={errorMessageId}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n});\n"],"names":["HvSelect"],"mappings":"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"}

package/dist/esm/SimpleGrid/SimpleGrid.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SimpleGrid.styles.js","sources":["../../../src/SimpleGrid/SimpleGrid.styles.tsx"],"sourcesContent":["import { CSSObject } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\nimport { Breakpoint, Spacing } from \"./types\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvSimpleGrid\", {\n root: {},\n});\n\nfunction size(props: { size: any; sizes: any }) {\n if (typeof props.size === \"number\") {\n return props.size;\n }\n\n return props.sizes[props.size] \|\| props.size \|\| props.sizes.md;\n}\n\nfunction getSortedBreakpoints(breakpoints: Breakpoint[]) {\n if (breakpoints.length === 0) {\n return breakpoints;\n }\n\n const property = \"maxWidth\" in breakpoints[0] ? \"maxWidth\" : \"minWidth\";\n const sorted = [...breakpoints].sort(\n (a, b) =>\n size({ size: b[property], sizes: theme.breakpoints }) -\n size({ size: a[property], sizes: theme.breakpoints }),\n );\n\n return property === \"minWidth\" ? sorted.reverse() : sorted;\n}\n\nexport const getContainerStyle = ({\n breakpoints,\n spacing,\n cols,\n}: {\n breakpoints?: Breakpoint[];\n spacing: Spacing;\n cols?: number;\n}): CSSObject => {\n return {\n boxSizing: \"border-box\",\n display: \"grid\",\n gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))`,\n gap: theme.space[spacing],\n ...(breakpoints &&\n getSortedBreakpoints(breakpoints).reduce((acc, breakpoint) => {\n const property = \"maxWidth\" in breakpoint ? \"max-width\" : \"min-width\";\n const breakpointSize = size({\n size:\n property === \"max-width\"\n ? breakpoint.maxWidth\n : breakpoint.minWidth,\n sizes: theme.breakpoints,\n });\n\n acc[\n `@media (${property}: ${\n breakpointSize + (property === \"max-width\" ? 0 : 1)\n }px)`\n ] = {\n gridTemplateColumns: `repeat(${breakpoint.cols}, minmax(0, 1fr))`,\n gap: theme.space[spacing],\n };\n\n return acc;\n }, {})),\n };\n};\n"],"names":[],"mappings":";;AAMO,MAAM,EAAE,eAAe,eAAe,cAAc,gBAAgB;AAAA,EACzE,MAAM,CAAC;AACT,CAAC;AAED,SAAS,KAAK,OAAkC;AAC1C,MAAA,OAAO,MAAM,SAAS,UAAU;AAClC,WAAO,MAAM;AAAA,EACf;AAEO,SAAA,MAAM,MAAM,MAAM,IAAI,KAAK,MAAM,QAAQ,MAAM,MAAM;AAC9D;AAEA,SAAS,qBAAqB,aAA2B;AACnD,MAAA,YAAY,WAAW,GAAG;AACrB,WAAA;AAAA,EACT;AAEA,QAAM,WAAW,cAAc,YAAY,CAAC,IAAI,aAAa;AAC7D,QAAM,SAAS,CAAC,GAAG,WAAW,EAAE;AAAA,IAC9B,CAAC,GAAG,MACF,KAAK,EAAE,MAAM,EAAE,QAAQ,GAAG,OAAO,MAAM,aAAa,IACpD,KAAK,EAAE,MAAM,EAAE,QAAQ,GAAG,OAAO,MAAM,aAAa;AAAA,EAAA;AAGxD,SAAO,aAAa,aAAa,OAAO,QAAA,IAAY;AACtD;AAEO,MAAM,oBAAoB,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AACF,MAIiB;AACR,SAAA;AAAA,IACL,WAAW;AAAA,IACX,SAAS;AAAA,IACT,qBAAqB,UAAU,IAAI;AAAA,IACnC,KAAK,MAAM,MAAM,OAAO;AAAA,IACxB,GAAI,eACF,qBAAqB,WAAW,EAAE,~~OAAO~~,CAAC,KAAK,eAAe;~~AACtD~~,YAAA,WAAW,cAAc,aAAa,cAAc;AAC1D,YAAM,iBAAiB,KAAK;AAAA,QAC1B,MACE,aAAa,cACT,WAAW,WACX,WAAW;AAAA,QACjB,OAAO,MAAM;AAAA,MAAA,CACd;AAGC,UAAA,WAAW,QAAQ,KACjB,kBAAkB,aAAa,cAAc,IAAI,EACnD,KACF,IAAI;AAAA,QACF,qBAAqB,UAAU,WAAW,IAAI;AAAA,QAC9C,KAAK,MAAM,MAAM,OAAO;AAAA,MAAA;AAGnB,aAAA;AAAA,IACT,GAAG,EAAE;AAAA,EAAA;AAEX;"}
1	+ {"version":3,"file":"SimpleGrid.styles.js","sources":["../../../src/SimpleGrid/SimpleGrid.styles.tsx"],"sourcesContent":["import { CSSObject } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\nimport { Breakpoint, Spacing } from \"./types\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvSimpleGrid\", {\n root: {},\n});\n\nfunction size(props: { size: any; sizes: any }) {\n if (typeof props.size === \"number\") {\n return props.size;\n }\n\n return props.sizes[props.size] \|\| props.size \|\| props.sizes.md;\n}\n\nfunction getSortedBreakpoints(breakpoints: Breakpoint[]) {\n if (breakpoints.length === 0) {\n return breakpoints;\n }\n\n const property = \"maxWidth\" in breakpoints[0] ? \"maxWidth\" : \"minWidth\";\n const sorted = [...breakpoints].sort(\n (a, b) =>\n size({ size: b[property], sizes: theme.breakpoints }) -\n size({ size: a[property], sizes: theme.breakpoints }),\n );\n\n return property === \"minWidth\" ? sorted.reverse() : sorted;\n}\n\nexport const getContainerStyle = ({\n breakpoints,\n spacing,\n cols,\n}: {\n breakpoints?: Breakpoint[];\n spacing: Spacing;\n cols?: number;\n}): CSSObject => {\n return {\n boxSizing: \"border-box\",\n display: \"grid\",\n gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))`,\n gap: theme.space[spacing],\n ...(breakpoints &&\n getSortedBreakpoints(breakpoints).reduce<\n Record<string, React.CSSProperties>\n >((acc, breakpoint) => {\n const property = \"maxWidth\" in breakpoint ? \"max-width\" : \"min-width\";\n const breakpointSize = size({\n size:\n property === \"max-width\"\n ? breakpoint.maxWidth\n : breakpoint.minWidth,\n sizes: theme.breakpoints,\n });\n\n acc[\n `@media (${property}: ${\n breakpointSize + (property === \"max-width\" ? 0 : 1)\n }px)`\n ] = {\n gridTemplateColumns: `repeat(${breakpoint.cols}, minmax(0, 1fr))`,\n gap: theme.space[spacing],\n };\n\n return acc;\n }, {})),\n };\n};\n"],"names":[],"mappings":";;AAMO,MAAM,EAAE,eAAe,eAAe,cAAc,gBAAgB;AAAA,EACzE,MAAM,CAAC;AACT,CAAC;AAED,SAAS,KAAK,OAAkC;AAC1C,MAAA,OAAO,MAAM,SAAS,UAAU;AAClC,WAAO,MAAM;AAAA,EACf;AAEO,SAAA,MAAM,MAAM,MAAM,IAAI,KAAK,MAAM,QAAQ,MAAM,MAAM;AAC9D;AAEA,SAAS,qBAAqB,aAA2B;AACnD,MAAA,YAAY,WAAW,GAAG;AACrB,WAAA;AAAA,EACT;AAEA,QAAM,WAAW,cAAc,YAAY,CAAC,IAAI,aAAa;AAC7D,QAAM,SAAS,CAAC,GAAG,WAAW,EAAE;AAAA,IAC9B,CAAC,GAAG,MACF,KAAK,EAAE,MAAM,EAAE,QAAQ,GAAG,OAAO,MAAM,aAAa,IACpD,KAAK,EAAE,MAAM,EAAE,QAAQ,GAAG,OAAO,MAAM,aAAa;AAAA,EAAA;AAGxD,SAAO,aAAa,aAAa,OAAO,QAAA,IAAY;AACtD;AAEO,MAAM,oBAAoB,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AACF,MAIiB;AACR,SAAA;AAAA,IACL,WAAW;AAAA,IACX,SAAS;AAAA,IACT,qBAAqB,UAAU,IAAI;AAAA,IACnC,KAAK,MAAM,MAAM,OAAO;AAAA,IACxB,GAAI,eACF,qBAAqB,WAAW,EAAE,OAEhC,CAAC,KAAK,eAAe;AACf,YAAA,WAAW,cAAc,aAAa,cAAc;AAC1D,YAAM,iBAAiB,KAAK;AAAA,QAC1B,MACE,aAAa,cACT,WAAW,WACX,WAAW;AAAA,QACjB,OAAO,MAAM;AAAA,MAAA,CACd;AAGC,UAAA,WAAW,QAAQ,KACjB,kBAAkB,aAAa,cAAc,IAAI,EACnD,KACF,IAAI;AAAA,QACF,qBAAqB,UAAU,WAAW,IAAI;AAAA,QAC9C,KAAK,MAAM,MAAM,OAAO;AAAA,MAAA;AAGnB,aAAA;AAAA,IACT,GAAG,EAAE;AAAA,EAAA;AAEX;"}

package/dist/esm/Skeleton/Skeleton.js CHANGED Viewed

@@ -17,8 +17,7 @@ const HvSkeleton = (props) => {
     ...others
   } = useDefaultProps("HvSkeleton", props);
   const { classes, cx } = useClasses(classesProp);
-  if (hidden)
-    return /* @__PURE__ */ jsx("div", { className: classes.content, children });
+  if (hidden) return /* @__PURE__ */ jsx("div", { className: classes.content, children });
   return /* @__PURE__ */ jsx(
     "div",
     {

package/dist/esm/Skeleton/Skeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Skeleton.js","sources":["../../../src/Skeleton/Skeleton.tsx"],"sourcesContent":["import { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./Skeleton.styles\";\n\nexport { staticClasses as skeletonClasses };\n\nexport type HvSkeletonClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSkeletonProps extends HvBaseProps {\n /** Whether the skeleton element is hidden or not. /\n hidden?: boolean;\n /* The type of skeleton element. @default \"text\" /\n variant?: \"circle\" \| \"square\" \| \"text\";\n /* The animation the skeleton element will display. @default \"pulse\" /\n animation?: \"pulse\" \| \"wave\";\n /* The width of the skeleton element. /\n width?: React.CSSProperties[\"width\"];\n /* The height of the skeleton element. /\n height?: React.CSSProperties[\"height\"];\n /* The url for a placeholder image to use on the skeleton element. /\n backgroundImage?: string;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvSkeletonClasses;\n}\n\n/\n The `HvSkeleton` component is used to create a placeholder element that represents the shape and size of the content that will be loaded.\n */\nexport const HvSkeleton = (props: HvSkeletonProps) => {\n const {\n classes: classesProp,\n className,\n children,\n hidden = false,\n variant = \"text\",\n animation = \"pulse\",\n backgroundImage,\n width,\n height,\n style,\n ...others\n } = useDefaultProps(\"HvSkeleton\", props);\n const { classes, cx } = useClasses(classesProp);\n\n if (hidden) return <div className={classes.content}>{children}</div>;\n\n return (\n <div\n className={cx(\n classes.root,\n classes[variant],\n animation && classes[animation],\n className,\n )}\n style={{\n width,\n height,\n ...(backgroundImage && {\n backgroundImage: `url(${backgroundImage})`,\n backgroundSize: \"contain\",\n backgroundPosition: \"center\",\n backgroundRepeat: \"no-repeat\",\n }),\n ...style,\n }}\n {...others}\n >\n {children}\n </div>\n );\n};\n"],"names":[],"mappings":";;;;AA6Ba,MAAA,aAAa,CAAC,UAA2B;AAC9C,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,UAAU;AAAA,IACV,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,cAAc,KAAK;AACvC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;~~AAE1C~~,~~MAAA;AAAQ~~,~~WAAQ~~,~~oBAAA~~,~~OAAA~~,~~EAAI~~,WAAW,QAAQ,SAAU,SAAS,CAAA;AAG5D,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,QAAQ,OAAO;AAAA,QACf,aAAa,QAAQ,SAAS;AAAA,QAC9B;AAAA,MACF;AAAA,MACA,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,GAAI,mBAAmB;AAAA,UACrB,iBAAiB,OAAO,eAAe;AAAA,UACvC,gBAAgB;AAAA,UAChB,oBAAoB;AAAA,UACpB,kBAAkB;AAAA,QACpB;AAAA,QACA,GAAG;AAAA,MACL;AAAA,MACC,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;"}
1	+ {"version":3,"file":"Skeleton.js","sources":["../../../src/Skeleton/Skeleton.tsx"],"sourcesContent":["import { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./Skeleton.styles\";\n\nexport { staticClasses as skeletonClasses };\n\nexport type HvSkeletonClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSkeletonProps extends HvBaseProps {\n /** Whether the skeleton element is hidden or not. /\n hidden?: boolean;\n /* The type of skeleton element. @default \"text\" /\n variant?: \"circle\" \| \"square\" \| \"text\";\n /* The animation the skeleton element will display. @default \"pulse\" /\n animation?: \"pulse\" \| \"wave\";\n /* The width of the skeleton element. /\n width?: React.CSSProperties[\"width\"];\n /* The height of the skeleton element. /\n height?: React.CSSProperties[\"height\"];\n /* The url for a placeholder image to use on the skeleton element. /\n backgroundImage?: string;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvSkeletonClasses;\n}\n\n/\n The `HvSkeleton` component is used to create a placeholder element that represents the shape and size of the content that will be loaded.\n */\nexport const HvSkeleton = (props: HvSkeletonProps) => {\n const {\n classes: classesProp,\n className,\n children,\n hidden = false,\n variant = \"text\",\n animation = \"pulse\",\n backgroundImage,\n width,\n height,\n style,\n ...others\n } = useDefaultProps(\"HvSkeleton\", props);\n const { classes, cx } = useClasses(classesProp);\n\n if (hidden) return <div className={classes.content}>{children}</div>;\n\n return (\n <div\n className={cx(\n classes.root,\n classes[variant],\n animation && classes[animation],\n className,\n )}\n style={{\n width,\n height,\n ...(backgroundImage && {\n backgroundImage: `url(${backgroundImage})`,\n backgroundSize: \"contain\",\n backgroundPosition: \"center\",\n backgroundRepeat: \"no-repeat\",\n }),\n ...style,\n }}\n {...others}\n >\n {children}\n </div>\n );\n};\n"],"names":[],"mappings":";;;;AA6Ba,MAAA,aAAa,CAAC,UAA2B;AAC9C,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,UAAU;AAAA,IACV,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD,gBAAgB,cAAc,KAAK;AACvC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAE9C,MAAI,OAAe,QAAA,oBAAC,SAAI,WAAW,QAAQ,SAAU,SAAS,CAAA;AAG5D,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,QAAQ;AAAA,QACR,QAAQ,OAAO;AAAA,QACf,aAAa,QAAQ,SAAS;AAAA,QAC9B;AAAA,MACF;AAAA,MACA,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,GAAI,mBAAmB;AAAA,UACrB,iBAAiB,OAAO,eAAe;AAAA,UACvC,gBAAgB;AAAA,UAChB,oBAAoB;AAAA,UACpB,kBAAkB;AAAA,QACpB;AAAA,QACA,GAAG;AAAA,MACL;AAAA,MACC,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/esm/Slider/Slider.js CHANGED Viewed

@@ -255,8 +255,7 @@ const HvSlider = forwardRef((props, ref) => {
         );
       }
     });
-    if (disabled || readOnly)
-      return;
+    if (disabled || readOnly) return;
     onChange?.(knobs.knobsValues);
     setKnobsPositions(knobs.knobsPosition);
   };

package/dist/esm/Slider/Slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Slider.js","sources":["../../../src/Slider/Slider.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport Slider, { SliderProps, SliderRef } from \"rc-slider\";\nimport Tooltip from \"rc-tooltip\";\n\nimport { HvFormElement, HvFormStatus, HvLabel, HvWarningText } from \"../Forms\";\nimport validationStates from \"../Forms/FormElement/validationStates\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { HvInputProps } from \"../Input\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { getElementById } from \"../utils/document\";\nimport { setId } from \"../utils/setId\";\nimport { sliderStyles, staticClasses, useClasses } from \"./Slider.styles\";\nimport { HvSliderInput } from \"./SliderInput/SliderInput\";\nimport { HvKnobProperty, HvMarkProperty } from \"./types\";\nimport {\n calculateStepValue,\n convertStatusToArray,\n createKnobStyles,\n createMark,\n createTrackStyles,\n ensureValuesConsistency,\n generateDefaultKnobProperties,\n isSingleSlider,\n knobsPositionsToKnobsValues,\n knobsPositionToScaledValue,\n knobsValuesToKnobsPositions,\n scaledValueToKnobsPositionValue,\n statusArrayToFormStatus,\n} from \"./utils\";\n\nexport { staticClasses as sliderClasses };\n\nexport type HvSliderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSliderProps\n extends HvBaseProps<HTMLDivElement, \"onChange\" \| \"onBlur\"> {\n /** The slider name. /\n name?: string;\n /* The label of the slider. If not provided, an aria-label or aria-labelledby must be inputted via sliderProps. /\n label?: React.ReactNode;\n /* Indicates that the slider is disabled. /\n disabled?: boolean;\n /* Indicates that the slider is not editable. /\n readOnly?: boolean;\n /* Indicates that user slider is required on the form element. /\n required?: boolean;\n /* Error message to render when the value is required. /\n requiredMessage?: string;\n /* If `true` the input that controls the slider is hidden. /\n hideInput?: boolean;\n /* Attributes applied to the slider element. /\n sliderProps?: SliderProps;\n /\n The status of the slider element.\n \n Valid is correct, invalid is incorrect and standBy means no validations have run.\n \n When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to the state.\n /\n status?: HvFormStatus \| HvFormStatus[];\n /* The error message to show when `status` is \"invalid\". /\n statusMessage?: React.ReactNode;\n /* The values array to apply to the component /\n values?: number[];\n /* The default values array to apply to the component /\n defaultValues?: (number \| undefined)[];\n /\n The object used to set the knob properties,\n * for every item in the array a new knob will be created.\n /\n knobProperties?: HvKnobProperty[];\n /* The object used to set the mark properties individually. /\n markProperties?: HvMarkProperty[];\n /\n The function executed before a change will occur in the slider.\n * @deprecated It's always better to use onChange instead\n /\n onBeforeChange?: (value: number[]) => void;\n /* The function executed while a change is occurring in the slider. /\n onChange?: (value: number[]) => void;\n /\n The function executed after a change ocurred in the slider.\n * @deprecated It's always better to use onChange instead\n /\n onAfterChange?: (value: number[]) => void;\n /* The function executed after a blur ocurred in the slider. /\n onBlur?: (\n event: React.FocusEvent,\n knobsValues: number[],\n status?: HvFormStatus \| HvFormStatus[],\n ) => void;\n /\n The separation in points between marks.\n * example: if 10 divisions and a markstep of 2 there will be 5 marks.\n /\n markStep?: number;\n /* How many subdivisions there are in the slider. /\n divisionQuantity?: number;\n /* The value of the first point in the slider from left to right. /\n minPointValue?: number;\n /* The value of the last point in the slider from left to right. /\n maxPointValue?: number;\n /* Error message to render when the value is higher than maxPointValue or lower than minPointValue. /\n outOfRangeMessage?: string;\n /* The max number of decimals if no format function is applied /\n markDigits?: number;\n /\n A formatting function used to add format to the marks in the track,\n * the function receives the mark text\n /\n formatMark?: (label: React.ReactNode) => React.ReactNode;\n /\n A formatting function used to add format to the tooltip in the track,\n * the function receives the mark text\n /\n formatTooltip?: (label: React.ReactNode) => React.ReactNode;\n /* If `true` the knobs can't have the same value, if `false` knobs can have the same value. /\n noOverlap?: boolean;\n /* Attributes applied to the input element. /\n inputProps?: HvInputProps[];\n /* Attributes applied to the knob element. /\n knobProps?: React.HTMLAttributes<HTMLDivElement>[];\n /* The classes object to be applied into the root object. /\n classes?: HvSliderClasses;\n}\n\n/\n Sliders reflect a range of values along a bar, from which users may select a single value. They are ideal for adjusting settings such as volume, brightness, or applying image filters.\n /\nexport const HvSlider = forwardRef<SliderRef, HvSliderProps>((props, ref) => {\n const {\n id,\n className,\n name,\n label,\n status,\n statusMessage,\n disabled,\n classes: classesProp,\n sliderProps,\n knobProps,\n inputProps,\n requiredMessage = \"The value is required\",\n outOfRangeMessage = \"The value is out of range\",\n noOverlap = true,\n hideInput = false,\n required = false,\n readOnly = false,\n markProperties = [],\n defaultValues = [undefined],\n values: valuesProp = [],\n knobProperties: knobPropertiesProp,\n \"aria-errormessage\": ariaErrorMessage,\n maxPointValue = 100,\n minPointValue = 0,\n divisionQuantity = 100,\n markStep = 20,\n markDigits = 0,\n formatMark,\n onChange,\n onBlur,\n onBeforeChange,\n onAfterChange,\n formatTooltip,\n ...others\n } = useDefaultProps(\"HvSlider\", props);\n const { classes, cx } = useClasses(classesProp);\n\n // Miscellaneous state\n const hasLabel = label != null;\n\n // Signals that the user has manually edited the input value\n const isDirty = useRef(false);\n\n const elementId = useUniqueId(id);\n\n const sliderInputId = setId(elementId, \"input\");\n\n const stepValue = useMemo(\n () => calculateStepValue(maxPointValue, minPointValue, divisionQuantity),\n [divisionQuantity, maxPointValue, minPointValue],\n );\n\n const inverseStepValue = 1 / stepValue;\n\n const marks = useMemo(\n () =>\n createMark(\n markProperties,\n markStep,\n divisionQuantity,\n minPointValue,\n maxPointValue,\n stepValue,\n markDigits,\n !!disabled,\n formatMark,\n ),\n [\n disabled,\n divisionQuantity,\n formatMark,\n markDigits,\n markProperties,\n markStep,\n minPointValue,\n maxPointValue,\n stepValue,\n ],\n );\n\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) \|\|\n // We always show an error when the value(s) are not between maxPointValue and minPointValue; and when required is true (set by user).\n status === undefined);\n\n const isSingle: boolean = useMemo(\n () => isSingleSlider(valuesProp, defaultValues),\n [defaultValues, valuesProp],\n );\n\n const value: number[] \| undefined = useMemo(\n () =>\n valuesProp?.length > 0\n ? knobsValuesToKnobsPositions(\n valuesProp,\n inverseStepValue,\n minPointValue,\n )\n : undefined,\n [inverseStepValue, minPointValue, valuesProp],\n );\n\n const defaultKnobsPositions: number[] = useMemo(\n () =>\n knobsValuesToKnobsPositions(\n defaultValues,\n inverseStepValue,\n minPointValue,\n ),\n [defaultValues, inverseStepValue, minPointValue],\n );\n\n const [knobsPositions, setKnobsPositions] = useControlled(\n value,\n defaultKnobsPositions,\n );\n\n // Validation related state\n const { arrayStatus, arrayDefaultStatus } = useMemo(\n () => convertStatusToArray(knobsPositions.length, status),\n [knobsPositions.length, status],\n );\n\n const [validationStatus, setValidationState] = useControlled(\n arrayStatus,\n arrayDefaultStatus,\n );\n\n const [validationMessage, setValidationMessage] = useControlled(\n statusMessage,\n \"\",\n );\n\n const [isDraggingTrack, setIsDraggingTrack] = useState(false);\n\n const knobProperties = generateDefaultKnobProperties(\n knobsPositions.length,\n disabled,\n knobPropertiesProp,\n );\n\n const rangesCount = knobProperties.length - 1;\n\n const trackStyles = createTrackStyles(knobProperties);\n\n const knobStyles = createKnobStyles(knobProperties);\n\n /\n Generates an object which posses the current value and position of the knobs.\n \n @param {Array} knobsCurrentPosition - An array containing the current positions of the knobs.\n * @returns {Object} - An object with the positions and values of the knobs.\n * @memberof HvSlider\n /\n const generateKnobsPositionAndValues = useCallback(\n (\n knobsCurrentPosition: number[],\n ): { knobsPosition: number[]; knobsValues: number[] } => {\n const newKnobsPosition: number[] = knobsCurrentPosition.slice();\n const knobsValues: number[] = [];\n\n let duplicatedValue: number \| null = null;\n\n const findDuplicated: number[] = newKnobsPosition.filter(\n (item, index) => newKnobsPosition.indexOf(item) !== index,\n );\n\n if (noOverlap && findDuplicated.length > 0) {\n [duplicatedValue] = findDuplicated;\n }\n\n newKnobsPosition.forEach((position, index, array) => {\n const newArray: number[] = array;\n let newPosition: number = position;\n\n if (noOverlap && newPosition === duplicatedValue) {\n const previousValue = knobsPositions[index];\n if (previousValue !== newPosition) {\n newPosition += newPosition > previousValue ? -1 : 1;\n newArray[index] = newPosition;\n }\n }\n\n knobsValues[index] = knobsPositionToScaledValue(\n newPosition,\n minPointValue,\n stepValue,\n );\n }, this);\n\n return {\n knobsPosition: newKnobsPosition,\n knobsValues,\n };\n },\n [knobsPositions, minPointValue, noOverlap, stepValue],\n );\n\n const performValidation = useCallback(() => {\n let invalid = false;\n let requiredMsg = false;\n\n const mappedValues =\n generateKnobsPositionAndValues(knobsPositions).knobsValues;\n\n const newValidationState = mappedValues.map((knobValue) => {\n if (required && (knobValue == null \|\| Number.isNaN(knobValue))) {\n invalid = true;\n requiredMsg = true;\n return validationStates.invalid;\n }\n\n if (knobValue < minPointValue \|\| knobValue > maxPointValue) {\n invalid = true;\n return validationStates.invalid;\n }\n\n return validationStates.valid;\n });\n\n setValidationState([...newValidationState]);\n\n if (invalid) {\n setValidationMessage(requiredMsg ? requiredMessage : outOfRangeMessage);\n return;\n }\n\n setValidationMessage(\"\");\n }, [\n generateKnobsPositionAndValues,\n knobsPositions,\n maxPointValue,\n minPointValue,\n outOfRangeMessage,\n required,\n requiredMessage,\n setValidationMessage,\n setValidationState,\n ]);\n\n useEffect(() => {\n const stepVl = calculateStepValue(\n maxPointValue,\n minPointValue,\n divisionQuantity,\n );\n\n const inverseStepVl = 1 / stepVl;\n\n if (valuesProp?.length > 0) {\n setKnobsPositions(\n knobsValuesToKnobsPositions(\n valuesProp.length > 0 ? valuesProp : defaultValues,\n inverseStepVl,\n minPointValue,\n ),\n );\n }\n }, [\n defaultValues,\n divisionQuantity,\n maxPointValue,\n minPointValue,\n setKnobsPositions,\n valuesProp,\n ]);\n\n useEffect(() => {\n if (!isDirty.current) {\n // Skip validation if currently focused or if empty and\n // the user never manually edited the input value\n return;\n }\n\n performValidation();\n }, [knobsPositions, requiredMessage, performValidation]);\n\n const onMouseDownHandler = (event: React.MouseEvent<HTMLDivElement>) => {\n if ((event.target as HTMLDivElement).className.includes(\"track\")) {\n setIsDraggingTrack(true);\n }\n };\n\n const onMouseUpHandler = () => {\n setIsDraggingTrack(false);\n };\n\n const onBlurHandler = (event: React.FocusEvent) => {\n const knobs = generateKnobsPositionAndValues(knobsPositions);\n\n performValidation();\n\n onBlur?.(event, knobs.knobsValues, status);\n };\n\n /\n Function executed while the knobs changes.\n \n executes the callback provided by the user with the values and position of the knobs,\n * also lock the value of the knob in case one is fixed.\n /\n const onChangeHandler = (knobsPosition: number[]) => {\n isDirty.current = true;\n\n const knobs = generateKnobsPositionAndValues(knobsPosition);\n\n knobProperties.forEach((knobProperty, index) => {\n if (knobProperty.fixed) {\n knobs.knobsPosition[index] = scaledValueToKnobsPositionValue(\n defaultValues[index],\n minPointValue,\n inverseStepValue,\n );\n }\n });\n\n if (disabled \|\| readOnly) return;\n onChange?.(knobs.knobsValues);\n\n setKnobsPositions(knobs.knobsPosition);\n };\n\n const onInputChangeHandler = (inputValues: number[], index: number) => {\n let newKnobPositions = knobsValuesToKnobsPositions(\n inputValues,\n inverseStepValue,\n minPointValue,\n );\n\n newKnobPositions = ensureValuesConsistency(newKnobPositions, index);\n\n onChangeHandler(newKnobPositions);\n };\n\n /\n Function executed before a change.\n \n executes the callback provided by the user with the values and position of the knobs\n /\n const onBeforeChangeHandler = (knobsPosition: number[]) => {\n const knobs = generateKnobsPositionAndValues(knobsPosition);\n\n onBeforeChange?.(knobs.knobsValues);\n };\n\n /\n Function executed after a change.\n \n executes the callback provided by the user with the values and position of the knobs\n /\n const onAfterChangeHandler = (knobsPosition: number[]) => {\n const knobs = generateKnobsPositionAndValues(knobsPosition);\n\n onAfterChange?.(knobs.knobsValues);\n };\n\n /\n Function used to create a custom knob for the slider.\n \n TODO: This should be isolated because is creating a sub component,\n * but there were some problems regarding the underlying component losing\n * references of the handlers disabling the focus.\n */\n const createKnob: SliderProps[\"handleRender\"] = (knobNode, params) => {\n const { value: knobValue, dragging, index } = params;\n const { style = {}, ...restProps } = knobNode.props;\n const scaledKnobValue = knobsPositionToScaledValue(\n knobValue,\n minPointValue,\n stepValue,\n ).toFixed(markDigits);\n if (dragging) {\n style.backgroundColor = knobProperties[index]?.dragColor;\n } else {\n style.backgroundColor = knobProperties[index]?.color;\n }\n\n const isEmpty =\n Number.isNaN(knobsPositions[index]) \|\| knobsPositions[index] == null;\n const handleId = setId(elementId, \"knob\");\n const indexedHandleId = setId(handleId, index);\n\n return (\n <div\n key={index}\n className={cx({\n [classes.handleContainer]: !!(!disabled && !isEmpty),\n [classes.handleContainerDisabled]: !!(disabled && !isEmpty),\n [classes.handleHiddenContainer]: isEmpty \|\| readOnly,\n })}\n >\n <Tooltip\n prefixCls=\"rc-slider-tooltip\"\n overlay={formatTooltip?.(scaledKnobValue) \|\| scaledKnobValue}\n visible={dragging}\n placement=\"top\"\n overlayClassName={classes.sliderTooltip}\n getTooltipContainer={() => getElementById(indexedHandleId)!}\n >\n <div\n id={indexedHandleId}\n style={style}\n className={classes.handle}\n {...restProps}\n aria-label={`${label}-knob-${index}`}\n aria-valuenow={knobsPositionToScaledValue(\n knobValue,\n minPointValue,\n stepValue,\n )}\n aria-valuemin={minPointValue}\n aria-valuemax={maxPointValue}\n {...knobProps?.[index]}\n />\n </Tooltip>\n </div>\n );\n };\n\n const knobsValuesArray = knobsPositionsToKnobsValues(\n knobsPositions,\n stepValue,\n minPointValue,\n );\n\n const knobsValues = knobsValuesArray.map((v) =>\n Number(v.toFixed(markDigits)),\n );\n\n return (\n <HvFormElement\n className={cx(\n classes.root,\n {\n [classes.trackStandBy]:\n !readOnly && !disabled && !isSingle && !isDraggingTrack,\n [classes.trackDragging]:\n !readOnly && !disabled && !isSingle && isDraggingTrack,\n [classes.rootDisabled]: !!disabled,\n },\n className,\n )}\n id={id}\n name={name}\n status={statusArrayToFormStatus(validationStatus)}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n onMouseDown={onMouseDownHandler}\n onMouseUp={onMouseUpHandler}\n onBlur={onBlurHandler}\n {...others}\n >\n {(hasLabel \|\| !hideInput) && (\n <div\n className={cx(classes.labelContainer, {\n [classes.labelIncluded]: hasLabel,\n [classes.onlyInput]: !hasLabel,\n })}\n >\n {hasLabel && (\n <HvLabel\n id={setId(elementId, \"label\")}\n className={classes.label}\n htmlFor={sliderInputId}\n label={label}\n />\n )}\n\n {!hideInput && (\n <HvSliderInput\n id={sliderInputId}\n label={label}\n values={knobsValues}\n onChange={onInputChangeHandler}\n status={validationStatus}\n disabled={disabled}\n readOnly={readOnly}\n markDigits={markDigits}\n inputProps={inputProps}\n />\n )}\n </div>\n )}\n\n <div className={cx(classes.sliderBase, classes.sliderContainer)}>\n <Slider\n ref={ref}\n range={!isSingle}\n handleRender={createKnob}\n className={cx(classes.sliderRoot, {\n [classes.rootRange]: !isSingle,\n })}\n min={0}\n max={divisionQuantity}\n step={1}\n marks={marks}\n dotStyle={disabled ? sliderStyles.dotDisabled : sliderStyles.dot}\n onChange={(singleValue) =>\n onChangeHandler(Array<number>().concat(singleValue))\n }\n onBeforeChange={(singleValue) =>\n onBeforeChangeHandler(Array<number>().concat(singleValue))\n }\n onAfterChange={(singleValue) =>\n onAfterChangeHandler(Array<number>().concat(singleValue))\n }\n value={\n knobsPositions.length === 0\n ? undefined\n : isSingle\n ? knobsPositions[0]\n : [...knobsPositions]\n }\n allowCross={false}\n disabled={disabled}\n count={rangesCount}\n railStyle={sliderStyles.rail}\n handleStyle={knobStyles.knobInner}\n trackStyle={trackStyles}\n draggableTrack={!readOnly && !isSingle}\n {...sliderProps}\n />\n </div>\n\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n className={classes.error}\n disableBorder\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n});\n"],"names":["knobsValues","validationStates"],"mappings":"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"}
1	+ {"version":3,"file":"Slider.js","sources":["../../../src/Slider/Slider.tsx"],"sourcesContent":["import {\n forwardRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport Slider, { SliderProps, SliderRef } from \"rc-slider\";\nimport Tooltip from \"rc-tooltip\";\n\nimport { HvFormElement, HvFormStatus, HvLabel, HvWarningText } from \"../Forms\";\nimport validationStates from \"../Forms/FormElement/validationStates\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { HvInputProps } from \"../Input\";\nimport { HvBaseProps } from \"../types/generic\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { getElementById } from \"../utils/document\";\nimport { setId } from \"../utils/setId\";\nimport { sliderStyles, staticClasses, useClasses } from \"./Slider.styles\";\nimport { HvSliderInput } from \"./SliderInput/SliderInput\";\nimport { HvKnobProperty, HvMarkProperty } from \"./types\";\nimport {\n calculateStepValue,\n convertStatusToArray,\n createKnobStyles,\n createMark,\n createTrackStyles,\n ensureValuesConsistency,\n generateDefaultKnobProperties,\n isSingleSlider,\n knobsPositionsToKnobsValues,\n knobsPositionToScaledValue,\n knobsValuesToKnobsPositions,\n scaledValueToKnobsPositionValue,\n statusArrayToFormStatus,\n} from \"./utils\";\n\nexport { staticClasses as sliderClasses };\n\nexport type HvSliderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSliderProps\n extends HvBaseProps<HTMLDivElement, \"onChange\" \| \"onBlur\"> {\n /** The slider name. /\n name?: string;\n /* The label of the slider. If not provided, an aria-label or aria-labelledby must be inputted via sliderProps. /\n label?: React.ReactNode;\n /* Indicates that the slider is disabled. /\n disabled?: boolean;\n /* Indicates that the slider is not editable. /\n readOnly?: boolean;\n /* Indicates that user slider is required on the form element. /\n required?: boolean;\n /* Error message to render when the value is required. /\n requiredMessage?: string;\n /* If `true` the input that controls the slider is hidden. /\n hideInput?: boolean;\n /* Attributes applied to the slider element. /\n sliderProps?: SliderProps;\n /\n The status of the slider element.\n \n Valid is correct, invalid is incorrect and standBy means no validations have run.\n \n When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to the state.\n /\n status?: HvFormStatus \| HvFormStatus[];\n /* The error message to show when `status` is \"invalid\". /\n statusMessage?: React.ReactNode;\n /* The values array to apply to the component /\n values?: number[];\n /* The default values array to apply to the component /\n defaultValues?: (number \| undefined)[];\n /\n The object used to set the knob properties,\n * for every item in the array a new knob will be created.\n /\n knobProperties?: HvKnobProperty[];\n /* The object used to set the mark properties individually. /\n markProperties?: HvMarkProperty[];\n /\n The function executed before a change will occur in the slider.\n * @deprecated It's always better to use onChange instead\n /\n onBeforeChange?: (value: number[]) => void;\n /* The function executed while a change is occurring in the slider. /\n onChange?: (value: number[]) => void;\n /\n The function executed after a change ocurred in the slider.\n * @deprecated It's always better to use onChange instead\n /\n onAfterChange?: (value: number[]) => void;\n /* The function executed after a blur ocurred in the slider. /\n onBlur?: (\n event: React.FocusEvent,\n knobsValues: number[],\n status?: HvFormStatus \| HvFormStatus[],\n ) => void;\n /\n The separation in points between marks.\n * example: if 10 divisions and a markstep of 2 there will be 5 marks.\n /\n markStep?: number;\n /* How many subdivisions there are in the slider. /\n divisionQuantity?: number;\n /* The value of the first point in the slider from left to right. /\n minPointValue?: number;\n /* The value of the last point in the slider from left to right. /\n maxPointValue?: number;\n /* Error message to render when the value is higher than maxPointValue or lower than minPointValue. /\n outOfRangeMessage?: string;\n /* The max number of decimals if no format function is applied /\n markDigits?: number;\n /\n A formatting function used to add format to the marks in the track,\n * the function receives the mark text\n /\n formatMark?: (label: React.ReactNode) => React.ReactNode;\n /\n A formatting function used to add format to the tooltip in the track,\n * the function receives the mark text\n /\n formatTooltip?: (label: React.ReactNode) => React.ReactNode;\n /* If `true` the knobs can't have the same value, if `false` knobs can have the same value. /\n noOverlap?: boolean;\n /* Attributes applied to the input element. /\n inputProps?: HvInputProps[];\n /* Attributes applied to the knob element. /\n knobProps?: React.HTMLAttributes<HTMLDivElement>[];\n /* The classes object to be applied into the root object. /\n classes?: HvSliderClasses;\n}\n\n/\n Sliders reflect a range of values along a bar, from which users may select a single value. They are ideal for adjusting settings such as volume, brightness, or applying image filters.\n /\nexport const HvSlider = forwardRef<SliderRef, HvSliderProps>((props, ref) => {\n const {\n id,\n className,\n name,\n label,\n status,\n statusMessage,\n disabled,\n classes: classesProp,\n sliderProps,\n knobProps,\n inputProps,\n requiredMessage = \"The value is required\",\n outOfRangeMessage = \"The value is out of range\",\n noOverlap = true,\n hideInput = false,\n required = false,\n readOnly = false,\n markProperties = [],\n defaultValues = [undefined],\n values: valuesProp = [],\n knobProperties: knobPropertiesProp,\n \"aria-errormessage\": ariaErrorMessage,\n maxPointValue = 100,\n minPointValue = 0,\n divisionQuantity = 100,\n markStep = 20,\n markDigits = 0,\n formatMark,\n onChange,\n onBlur,\n onBeforeChange,\n onAfterChange,\n formatTooltip,\n ...others\n } = useDefaultProps(\"HvSlider\", props);\n const { classes, cx } = useClasses(classesProp);\n\n // Miscellaneous state\n const hasLabel = label != null;\n\n // Signals that the user has manually edited the input value\n const isDirty = useRef(false);\n\n const elementId = useUniqueId(id);\n\n const sliderInputId = setId(elementId, \"input\");\n\n const stepValue = useMemo(\n () => calculateStepValue(maxPointValue, minPointValue, divisionQuantity),\n [divisionQuantity, maxPointValue, minPointValue],\n );\n\n const inverseStepValue = 1 / stepValue;\n\n const marks = useMemo(\n () =>\n createMark(\n markProperties,\n markStep,\n divisionQuantity,\n minPointValue,\n maxPointValue,\n stepValue,\n markDigits,\n !!disabled,\n formatMark,\n ),\n [\n disabled,\n divisionQuantity,\n formatMark,\n markDigits,\n markProperties,\n markStep,\n minPointValue,\n maxPointValue,\n stepValue,\n ],\n );\n\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) \|\|\n // We always show an error when the value(s) are not between maxPointValue and minPointValue; and when required is true (set by user).\n status === undefined);\n\n const isSingle: boolean = useMemo(\n () => isSingleSlider(valuesProp, defaultValues),\n [defaultValues, valuesProp],\n );\n\n const value: number[] \| undefined = useMemo(\n () =>\n valuesProp?.length > 0\n ? knobsValuesToKnobsPositions(\n valuesProp,\n inverseStepValue,\n minPointValue,\n )\n : undefined,\n [inverseStepValue, minPointValue, valuesProp],\n );\n\n const defaultKnobsPositions: number[] = useMemo(\n () =>\n knobsValuesToKnobsPositions(\n defaultValues,\n inverseStepValue,\n minPointValue,\n ),\n [defaultValues, inverseStepValue, minPointValue],\n );\n\n const [knobsPositions, setKnobsPositions] = useControlled(\n value,\n defaultKnobsPositions,\n );\n\n // Validation related state\n const { arrayStatus, arrayDefaultStatus } = useMemo(\n () => convertStatusToArray(knobsPositions.length, status),\n [knobsPositions.length, status],\n );\n\n const [validationStatus, setValidationState] = useControlled(\n arrayStatus,\n arrayDefaultStatus,\n );\n\n const [validationMessage, setValidationMessage] = useControlled(\n statusMessage,\n \"\",\n );\n\n const [isDraggingTrack, setIsDraggingTrack] = useState(false);\n\n const knobProperties = generateDefaultKnobProperties(\n knobsPositions.length,\n disabled,\n knobPropertiesProp,\n );\n\n const rangesCount = knobProperties.length - 1;\n\n const trackStyles = createTrackStyles(knobProperties);\n\n const knobStyles = createKnobStyles(knobProperties);\n\n /\n Generates an object which posses the current value and position of the knobs.\n \n @param {Array} knobsCurrentPosition - An array containing the current positions of the knobs.\n * @returns {Object} - An object with the positions and values of the knobs.\n * @memberof HvSlider\n /\n const generateKnobsPositionAndValues = useCallback(\n (\n knobsCurrentPosition: number[],\n ): { knobsPosition: number[]; knobsValues: number[] } => {\n const newKnobsPosition: number[] = knobsCurrentPosition.slice();\n const knobsValues: number[] = [];\n\n let duplicatedValue: number \| null = null;\n\n const findDuplicated: number[] = newKnobsPosition.filter(\n (item, index) => newKnobsPosition.indexOf(item) !== index,\n );\n\n if (noOverlap && findDuplicated.length > 0) {\n [duplicatedValue] = findDuplicated;\n }\n\n newKnobsPosition.forEach((position, index, array) => {\n const newArray: number[] = array;\n let newPosition: number = position;\n\n if (noOverlap && newPosition === duplicatedValue) {\n const previousValue = knobsPositions[index];\n if (previousValue !== newPosition) {\n newPosition += newPosition > previousValue ? -1 : 1;\n newArray[index] = newPosition;\n }\n }\n\n knobsValues[index] = knobsPositionToScaledValue(\n newPosition,\n minPointValue,\n stepValue,\n );\n }, this);\n\n return {\n knobsPosition: newKnobsPosition,\n knobsValues,\n };\n },\n [knobsPositions, minPointValue, noOverlap, stepValue],\n );\n\n const performValidation = useCallback(() => {\n let invalid = false;\n let requiredMsg = false;\n\n const mappedValues =\n generateKnobsPositionAndValues(knobsPositions).knobsValues;\n\n const newValidationState = mappedValues.map((knobValue) => {\n if (required && (knobValue == null \|\| Number.isNaN(knobValue))) {\n invalid = true;\n requiredMsg = true;\n return validationStates.invalid;\n }\n\n if (knobValue < minPointValue \|\| knobValue > maxPointValue) {\n invalid = true;\n return validationStates.invalid;\n }\n\n return validationStates.valid;\n });\n\n setValidationState([...newValidationState]);\n\n if (invalid) {\n setValidationMessage(requiredMsg ? requiredMessage : outOfRangeMessage);\n return;\n }\n\n setValidationMessage(\"\");\n }, [\n generateKnobsPositionAndValues,\n knobsPositions,\n maxPointValue,\n minPointValue,\n outOfRangeMessage,\n required,\n requiredMessage,\n setValidationMessage,\n setValidationState,\n ]);\n\n useEffect(() => {\n const stepVl = calculateStepValue(\n maxPointValue,\n minPointValue,\n divisionQuantity,\n );\n\n const inverseStepVl = 1 / stepVl;\n\n if (valuesProp?.length > 0) {\n setKnobsPositions(\n knobsValuesToKnobsPositions(\n valuesProp.length > 0 ? valuesProp : defaultValues,\n inverseStepVl,\n minPointValue,\n ),\n );\n }\n }, [\n defaultValues,\n divisionQuantity,\n maxPointValue,\n minPointValue,\n setKnobsPositions,\n valuesProp,\n ]);\n\n useEffect(() => {\n if (!isDirty.current) {\n // Skip validation if currently focused or if empty and\n // the user never manually edited the input value\n return;\n }\n\n performValidation();\n }, [knobsPositions, requiredMessage, performValidation]);\n\n const onMouseDownHandler = (event: React.MouseEvent<HTMLDivElement>) => {\n if ((event.target as HTMLDivElement).className.includes(\"track\")) {\n setIsDraggingTrack(true);\n }\n };\n\n const onMouseUpHandler = () => {\n setIsDraggingTrack(false);\n };\n\n const onBlurHandler = (event: React.FocusEvent) => {\n const knobs = generateKnobsPositionAndValues(knobsPositions);\n\n performValidation();\n\n onBlur?.(event, knobs.knobsValues, status);\n };\n\n /\n Function executed while the knobs changes.\n \n executes the callback provided by the user with the values and position of the knobs,\n * also lock the value of the knob in case one is fixed.\n /\n const onChangeHandler = (knobsPosition: number[]) => {\n isDirty.current = true;\n\n const knobs = generateKnobsPositionAndValues(knobsPosition);\n\n knobProperties.forEach((knobProperty, index) => {\n if (knobProperty.fixed) {\n knobs.knobsPosition[index] = scaledValueToKnobsPositionValue(\n defaultValues[index],\n minPointValue,\n inverseStepValue,\n );\n }\n });\n\n if (disabled \|\| readOnly) return;\n onChange?.(knobs.knobsValues);\n\n setKnobsPositions(knobs.knobsPosition);\n };\n\n const onInputChangeHandler = (inputValues: number[], index: number) => {\n let newKnobPositions = knobsValuesToKnobsPositions(\n inputValues,\n inverseStepValue,\n minPointValue,\n );\n\n newKnobPositions = ensureValuesConsistency(newKnobPositions, index);\n\n onChangeHandler(newKnobPositions);\n };\n\n /\n Function executed before a change.\n \n executes the callback provided by the user with the values and position of the knobs\n /\n const onBeforeChangeHandler = (knobsPosition: number[]) => {\n const knobs = generateKnobsPositionAndValues(knobsPosition);\n\n onBeforeChange?.(knobs.knobsValues);\n };\n\n /\n Function executed after a change.\n \n executes the callback provided by the user with the values and position of the knobs\n /\n const onAfterChangeHandler = (knobsPosition: number[]) => {\n const knobs = generateKnobsPositionAndValues(knobsPosition);\n\n onAfterChange?.(knobs.knobsValues);\n };\n\n /\n Function used to create a custom knob for the slider.\n \n TODO: This should be isolated because is creating a sub component,\n * but there were some problems regarding the underlying component losing\n * references of the handlers disabling the focus.\n */\n const createKnob: SliderProps[\"handleRender\"] = (knobNode, params) => {\n const { value: knobValue, dragging, index } = params;\n const { style = {}, ...restProps } = knobNode.props;\n const scaledKnobValue = knobsPositionToScaledValue(\n knobValue,\n minPointValue,\n stepValue,\n ).toFixed(markDigits);\n if (dragging) {\n style.backgroundColor = knobProperties[index]?.dragColor;\n } else {\n style.backgroundColor = knobProperties[index]?.color;\n }\n\n const isEmpty =\n Number.isNaN(knobsPositions[index]) \|\| knobsPositions[index] == null;\n const handleId = setId(elementId, \"knob\");\n const indexedHandleId = setId(handleId, index);\n\n return (\n <div\n key={index}\n className={cx({\n [classes.handleContainer]: !!(!disabled && !isEmpty),\n [classes.handleContainerDisabled]: !!(disabled && !isEmpty),\n [classes.handleHiddenContainer]: isEmpty \|\| readOnly,\n })}\n >\n <Tooltip\n prefixCls=\"rc-slider-tooltip\"\n overlay={formatTooltip?.(scaledKnobValue) \|\| scaledKnobValue}\n visible={dragging}\n placement=\"top\"\n overlayClassName={classes.sliderTooltip}\n getTooltipContainer={() => getElementById(indexedHandleId)!}\n >\n <div\n id={indexedHandleId}\n style={style}\n className={classes.handle}\n {...restProps}\n aria-label={`${label}-knob-${index}`}\n aria-valuenow={knobsPositionToScaledValue(\n knobValue,\n minPointValue,\n stepValue,\n )}\n aria-valuemin={minPointValue}\n aria-valuemax={maxPointValue}\n {...knobProps?.[index]}\n />\n </Tooltip>\n </div>\n );\n };\n\n const knobsValuesArray = knobsPositionsToKnobsValues(\n knobsPositions,\n stepValue,\n minPointValue,\n );\n\n const knobsValues = knobsValuesArray.map((v) =>\n Number(v.toFixed(markDigits)),\n );\n\n return (\n <HvFormElement\n className={cx(\n classes.root,\n {\n [classes.trackStandBy]:\n !readOnly && !disabled && !isSingle && !isDraggingTrack,\n [classes.trackDragging]:\n !readOnly && !disabled && !isSingle && isDraggingTrack,\n [classes.rootDisabled]: !!disabled,\n },\n className,\n )}\n id={id}\n name={name}\n status={statusArrayToFormStatus(validationStatus)}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n onMouseDown={onMouseDownHandler}\n onMouseUp={onMouseUpHandler}\n onBlur={onBlurHandler}\n {...others}\n >\n {(hasLabel \|\| !hideInput) && (\n <div\n className={cx(classes.labelContainer, {\n [classes.labelIncluded]: hasLabel,\n [classes.onlyInput]: !hasLabel,\n })}\n >\n {hasLabel && (\n <HvLabel\n id={setId(elementId, \"label\")}\n className={classes.label}\n htmlFor={sliderInputId}\n label={label}\n />\n )}\n\n {!hideInput && (\n <HvSliderInput\n id={sliderInputId}\n label={label}\n values={knobsValues}\n onChange={onInputChangeHandler}\n status={validationStatus}\n disabled={disabled}\n readOnly={readOnly}\n markDigits={markDigits}\n inputProps={inputProps}\n />\n )}\n </div>\n )}\n\n <div className={cx(classes.sliderBase, classes.sliderContainer)}>\n <Slider\n ref={ref}\n range={!isSingle}\n handleRender={createKnob}\n className={cx(classes.sliderRoot, {\n [classes.rootRange]: !isSingle,\n })}\n min={0}\n max={divisionQuantity}\n step={1}\n marks={marks}\n dotStyle={disabled ? sliderStyles.dotDisabled : sliderStyles.dot}\n onChange={(singleValue) =>\n onChangeHandler(Array<number>().concat(singleValue))\n }\n onBeforeChange={(singleValue) =>\n onBeforeChangeHandler(Array<number>().concat(singleValue))\n }\n onAfterChange={(singleValue) =>\n onAfterChangeHandler(Array<number>().concat(singleValue))\n }\n value={\n knobsPositions.length === 0\n ? undefined\n : isSingle\n ? knobsPositions[0]\n : [...knobsPositions]\n }\n allowCross={false}\n disabled={disabled}\n count={rangesCount}\n railStyle={sliderStyles.rail}\n handleStyle={knobStyles.knobInner}\n trackStyle={trackStyles}\n draggableTrack={!readOnly && !isSingle}\n {...sliderProps}\n />\n </div>\n\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n className={classes.error}\n disableBorder\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n});\n"],"names":["knobsValues","validationStates"],"mappings":"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"}

package/dist/esm/Slider/SliderInput/SliderInput.js CHANGED Viewed

@@ -25,8 +25,7 @@ const HvSliderInput = ({
     knobsValuesToString(valuesProp, markDigits)
   );
   const handleChange = (index) => {
-    if (disabled)
-      return;
+    if (disabled) return;
     onChange?.(stringValuesToKnobs(inputValues), index);
   };
   useEffect(() => {

package/dist/esm/Slider/SliderInput/SliderInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SliderInput.js","sources":["../../../../src/Slider/SliderInput/SliderInput.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { Remove } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvFormStatus } from \"../../Forms\";\nimport { HvInput, HvInputProps } from \"../../Input\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { setId } from \"../../utils/setId\";\nimport { knobsValuesToString, stringValuesToKnobs } from \"../utils\";\nimport { staticClasses, useClasses } from \"./SliderInput.styles\";\n\nexport { staticClasses as sliderInputClasses };\n\nexport type HvSliderInputClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSliderInputProps\n extends HvBaseProps<HTMLDivElement, \"onChange\"> {\n /*\n Used to generate the aria-label for the inputs.\n /\n label?: React.ReactNode;\n /\n Input status.\n /\n status?: HvFormStatus[];\n /\n The values array to apply to the component\n /\n values?: number[];\n /\n Callback function to be triggered when the selected date has changed.\n /\n onChange?: (values: number[], index: number) => void;\n /\n Attributes applied to the input element.\n /\n inputProps?: HvInputProps[];\n /\n Indicates that the form element is disabled.\n /\n disabled?: boolean;\n /\n Indicates that the form element is read only.\n /\n readOnly?: boolean;\n /\n Indicates how many decimals to use.\n /\n markDigits?: number;\n /\n Styles applied from the theme.\n */\n classes?: HvSliderInputClasses;\n}\n\nexport const HvSliderInput = ({\n classes: classesProp,\n className,\n id,\n label,\n status,\n values: valuesProp = [],\n inputProps = [],\n readOnly = false,\n disabled = false,\n markDigits = 0,\n onChange,\n ...others\n}: HvSliderInputProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n const [inputValues, setInputValues] = useState<string[]>(\n knobsValuesToString(valuesProp, markDigits),\n );\n\n const handleChange = (index: number) => {\n if (disabled) return;\n\n onChange?.(stringValuesToKnobs(inputValues), index);\n };\n\n useEffect(() => {\n setInputValues(knobsValuesToString(valuesProp, markDigits));\n }, [markDigits, valuesProp]);\n\n return (\n <div className={cx(classes.inputRoot, className)} {...others}>\n {inputValues.map((value, index) => (\n <div key={setId(id, index)} className={classes.inputContainer}>\n {index !== 0 && <Remove color={disabled ? [\"atmo4\"] : undefined} />}\n <HvInput\n id={setId(id, index)}\n aria-label={`${label}-${index}`}\n className={classes.input}\n disabled={disabled}\n type=\"number\"\n value={Number.isNaN(value) \|\| value == null ? \"\" : value.toString()}\n onEnter={() => handleChange(index)}\n onBlur={() => handleChange(index)}\n onChange={(_, inputValue) => {\n const newValues = [...inputValues];\n newValues[index] = inputValue;\n setInputValues(newValues);\n }}\n status={status?.[index] \|\| \"standBy\"}\n readOnly={readOnly}\n disableClear\n {...inputProps[index]}\n />\n </div>\n ))}\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;AAuDO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ,aAAa,CAAC;AAAA,EACtB,aAAa,CAAC;AAAA,EACd,WAAW;AAAA,EACX,WAAW;AAAA,EACX,aAAa;AAAA,EACb;AAAA,EACA,GAAG;AACL,MAA0B;AACxB,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,CAAC,aAAa,cAAc,IAAI;AAAA,IACpC,oBAAoB,YAAY,UAAU;AAAA,EAAA;AAGtC,QAAA,eAAe,CAAC,UAAkB;~~AAClC~~,~~QAAA~~;~~AAAU;~~AAEH,eAAA,oBAAoB,WAAW,GAAG,KAAK;AAAA,EAAA;AAGpD,YAAU,MAAM;AACC,mBAAA,oBAAoB,YAAY,UAAU,CAAC;AAAA,EAAA,GACzD,CAAC,YAAY,UAAU,CAAC;AAE3B,6BACG,OAAI,EAAA,WAAW,GAAG,QAAQ,WAAW,SAAS,GAAI,GAAG,QACnD,UAAY,YAAA,IAAI,CAAC,OAAO,+BACtB,OAA2B,EAAA,WAAW,QAAQ,gBAC5C,UAAA;AAAA,IAAU,UAAA,yBAAM,QAAO,EAAA,OAAO,WAAW,CAAC,OAAO,IAAI,QAAW;AAAA,IACjE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAI,MAAM,IAAI,KAAK;AAAA,QACnB,cAAY,GAAG,KAAK,IAAI,KAAK;AAAA,QAC7B,WAAW,QAAQ;AAAA,QACnB;AAAA,QACA,MAAK;AAAA,QACL,OAAO,OAAO,MAAM,KAAK,KAAK,SAAS,OAAO,KAAK,MAAM,SAAS;AAAA,QAClE,SAAS,MAAM,aAAa,KAAK;AAAA,QACjC,QAAQ,MAAM,aAAa,KAAK;AAAA,QAChC,UAAU,CAAC,GAAG,eAAe;AACrB,gBAAA,YAAY,CAAC,GAAG,WAAW;AACjC,oBAAU,KAAK,IAAI;AACnB,yBAAe,SAAS;AAAA,QAC1B;AAAA,QACA,QAAQ,SAAS,KAAK,KAAK;AAAA,QAC3B;AAAA,QACA,cAAY;AAAA,QACX,GAAG,WAAW,KAAK;AAAA,MAAA;AAAA,IACtB;AAAA,EAAA,EAAA,GApBQ,MAAM,IAAI,KAAK,CAqBzB,CACD,EACH,CAAA;AAEJ;"}
1	+ {"version":3,"file":"SliderInput.js","sources":["../../../../src/Slider/SliderInput/SliderInput.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { Remove } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvFormStatus } from \"../../Forms\";\nimport { HvInput, HvInputProps } from \"../../Input\";\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { setId } from \"../../utils/setId\";\nimport { knobsValuesToString, stringValuesToKnobs } from \"../utils\";\nimport { staticClasses, useClasses } from \"./SliderInput.styles\";\n\nexport { staticClasses as sliderInputClasses };\n\nexport type HvSliderInputClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSliderInputProps\n extends HvBaseProps<HTMLDivElement, \"onChange\"> {\n /*\n Used to generate the aria-label for the inputs.\n /\n label?: React.ReactNode;\n /\n Input status.\n /\n status?: HvFormStatus[];\n /\n The values array to apply to the component\n /\n values?: number[];\n /\n Callback function to be triggered when the selected date has changed.\n /\n onChange?: (values: number[], index: number) => void;\n /\n Attributes applied to the input element.\n /\n inputProps?: HvInputProps[];\n /\n Indicates that the form element is disabled.\n /\n disabled?: boolean;\n /\n Indicates that the form element is read only.\n /\n readOnly?: boolean;\n /\n Indicates how many decimals to use.\n /\n markDigits?: number;\n /\n Styles applied from the theme.\n */\n classes?: HvSliderInputClasses;\n}\n\nexport const HvSliderInput = ({\n classes: classesProp,\n className,\n id,\n label,\n status,\n values: valuesProp = [],\n inputProps = [],\n readOnly = false,\n disabled = false,\n markDigits = 0,\n onChange,\n ...others\n}: HvSliderInputProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n const [inputValues, setInputValues] = useState<string[]>(\n knobsValuesToString(valuesProp, markDigits),\n );\n\n const handleChange = (index: number) => {\n if (disabled) return;\n\n onChange?.(stringValuesToKnobs(inputValues), index);\n };\n\n useEffect(() => {\n setInputValues(knobsValuesToString(valuesProp, markDigits));\n }, [markDigits, valuesProp]);\n\n return (\n <div className={cx(classes.inputRoot, className)} {...others}>\n {inputValues.map((value, index) => (\n <div key={setId(id, index)} className={classes.inputContainer}>\n {index !== 0 && <Remove color={disabled ? [\"atmo4\"] : undefined} />}\n <HvInput\n id={setId(id, index)}\n aria-label={`${label}-${index}`}\n className={classes.input}\n disabled={disabled}\n type=\"number\"\n value={Number.isNaN(value) \|\| value == null ? \"\" : value.toString()}\n onEnter={() => handleChange(index)}\n onBlur={() => handleChange(index)}\n onChange={(_, inputValue) => {\n const newValues = [...inputValues];\n newValues[index] = inputValue;\n setInputValues(newValues);\n }}\n status={status?.[index] \|\| \"standBy\"}\n readOnly={readOnly}\n disableClear\n {...inputProps[index]}\n />\n </div>\n ))}\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;AAuDO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ,aAAa,CAAC;AAAA,EACtB,aAAa,CAAC;AAAA,EACd,WAAW;AAAA,EACX,WAAW;AAAA,EACX,aAAa;AAAA,EACb;AAAA,EACA,GAAG;AACL,MAA0B;AACxB,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,CAAC,aAAa,cAAc,IAAI;AAAA,IACpC,oBAAoB,YAAY,UAAU;AAAA,EAAA;AAGtC,QAAA,eAAe,CAAC,UAAkB;AACtC,QAAI,SAAU;AAEH,eAAA,oBAAoB,WAAW,GAAG,KAAK;AAAA,EAAA;AAGpD,YAAU,MAAM;AACC,mBAAA,oBAAoB,YAAY,UAAU,CAAC;AAAA,EAAA,GACzD,CAAC,YAAY,UAAU,CAAC;AAE3B,6BACG,OAAI,EAAA,WAAW,GAAG,QAAQ,WAAW,SAAS,GAAI,GAAG,QACnD,UAAY,YAAA,IAAI,CAAC,OAAO,+BACtB,OAA2B,EAAA,WAAW,QAAQ,gBAC5C,UAAA;AAAA,IAAU,UAAA,yBAAM,QAAO,EAAA,OAAO,WAAW,CAAC,OAAO,IAAI,QAAW;AAAA,IACjE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAI,MAAM,IAAI,KAAK;AAAA,QACnB,cAAY,GAAG,KAAK,IAAI,KAAK;AAAA,QAC7B,WAAW,QAAQ;AAAA,QACnB;AAAA,QACA,MAAK;AAAA,QACL,OAAO,OAAO,MAAM,KAAK,KAAK,SAAS,OAAO,KAAK,MAAM,SAAS;AAAA,QAClE,SAAS,MAAM,aAAa,KAAK;AAAA,QACjC,QAAQ,MAAM,aAAa,KAAK;AAAA,QAChC,UAAU,CAAC,GAAG,eAAe;AACrB,gBAAA,YAAY,CAAC,GAAG,WAAW;AACjC,oBAAU,KAAK,IAAI;AACnB,yBAAe,SAAS;AAAA,QAC1B;AAAA,QACA,QAAQ,SAAS,KAAK,KAAK;AAAA,QAC3B;AAAA,QACA,cAAY;AAAA,QACX,GAAG,WAAW,KAAK;AAAA,MAAA;AAAA,IACtB;AAAA,EAAA,EAAA,GApBQ,MAAM,IAAI,KAAK,CAqBzB,CACD,EACH,CAAA;AAEJ;"}

package/dist/esm/Slider/utils.js CHANGED Viewed

@@ -167,10 +167,8 @@ const generateDefaultKnobProperties = (numberOfKnobs = 1, disabled = false, knob
     });
   } else {
     for (let i = 0; i < numberOfKnobs; i += 1) {
-      if (!disabled)
-        knobProperties.push(defaultKnobStyles);
-      if (disabled)
-        knobProperties.push(disabledKnobStyles);
+      if (!disabled) knobProperties.push(defaultKnobStyles);
+      if (disabled) knobProperties.push(disabledKnobStyles);
     }
   }
   return knobProperties;
@@ -222,11 +220,9 @@ const statusArrayToFormStatus = (arrayStatus) => {
   const invalid = arrayStatus.some(
     (status) => status === validationState.invalid
   );
-  if (invalid)
-    return validationState.invalid;
+  if (invalid) return validationState.invalid;
   const valid = arrayStatus.some((status) => status === validationState.valid);
-  if (valid)
-    return validationState.valid;
+  if (valid) return validationState.valid;
   return validationState.standBy;
 };
 const knobsValuesToString = (knobsValues, markDigits) => knobsValues.map(