npm - @hitachivantara/uikit-react-core - Versions diffs - 5.58.2 → 5.59.0 - Mend

@hitachivantara/uikit-react-core 5.58.2 → 5.59.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (200) hide show

package/dist/cjs/DropdownButton/DropdownButton.cjs ADDED Viewed

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const React = require("react");
+const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
+const useDefaultProps = require("../hooks/useDefaultProps.cjs");
+const DropdownButton_styles = require("./DropdownButton.styles.cjs");
+const Button = require("../Button/Button.cjs");
+const HvDropdownButton = React.forwardRef((props, ref) => {
+  const {
+    className,
+    classes: classesProp,
+    placement = "bottom",
+    disabled,
+    open,
+    icon,
+    readOnly,
+    children,
+    variant,
+    ...others
+  } = useDefaultProps.useDefaultProps("HvDropdownButton", props);
+  const { classes, cx } = DropdownButton_styles.useClasses(classesProp);
+  const endIcon = icon ? void 0 : /* @__PURE__ */ jsxRuntime.jsx(
+    uikitReactIcons.DropDownXS,
+    {
+      iconSize: "XS",
+      style: { rotate: open ? "180deg" : void 0 },
+      className: classes.arrow
+    }
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Button.HvButton,
+    {
+      ref,
+      icon,
+      disabled: disabled || readOnly,
+      className: cx(
+        classes.root,
+        {
+          [classes.open]: open,
+          [classes.openUp]: open && placement.includes("top"),
+          [classes.openDown]: open && placement.includes("bottom"),
+          [classes.disabled]: disabled,
+          [classes.readOnly]: readOnly
+        },
+        className
+      ),
+      classes: { endIcon: classes.arrowContainer },
+      endIcon,
+      variant: open ? "secondarySubtle" : variant,
+      ...others,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx({ [classes.selection]: !icon }), children: children && typeof children === "string" ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.placeholder, children }) : children })
+    }
+  );
+});
+exports.dropdownButtonClasses = DropdownButton_styles.staticClasses;
+exports.HvDropdownButton = HvDropdownButton;

package/dist/cjs/DropdownButton/DropdownButton.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DropdownButton.cjs","sources":["../../../src/DropdownButton/DropdownButton.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { Placement } from \"@popperjs/core\";\nimport { DropDownXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvButton, HvButtonProps } from \"../Button\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { staticClasses, useClasses } from \"./DropdownButton.styles\";\n\nexport { staticClasses as dropdownButtonClasses };\n\nexport type HvDropdownButtonClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropdownButtonProps\n extends Omit<HvButtonProps, \"startAdornment\" | \"endAdornment\" | \"classes\"> {\n /** Whether the button is in read only mode when used as a form element. */\n readOnly?: boolean;\n /** Whether the content triggered by the button is opened or not. */\n open?: boolean;\n /** Placement of the content triggered by the button. @default bottom */\n placement?: Placement;\n /** A Jss Object used to override or extend the styles applied. */\n classes?: HvDropdownButtonClasses;\n}\n\n/**\n * IMPORTANT: This component is not ready to be exported to external users.\n *\n * Implements the DS dropdown button pattern.\n */\nexport const HvDropdownButton = forwardRef<\n HTMLButtonElement,\n HvDropdownButtonProps\n>((props, ref) => {\n const {\n className,\n classes: classesProp,\n placement = \"bottom\",\n disabled,\n open,\n icon,\n readOnly,\n children,\n variant,\n ...others\n } = useDefaultProps(\"HvDropdownButton\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const endIcon = icon ? undefined : (\n <DropDownXS\n iconSize=\"XS\"\n style={{ rotate: open ? \"180deg\" : undefined }}\n className={classes.arrow}\n />\n );\n\n return (\n <HvButton\n ref={ref}\n icon={icon}\n disabled={disabled || readOnly}\n className={cx(\n classes.root,\n {\n [classes.open]: open,\n [classes.openUp]: open && placement.includes(\"top\"),\n [classes.openDown]: open && placement.includes(\"bottom\"),\n [classes.disabled]: disabled,\n [classes.readOnly]: readOnly,\n },\n className\n )}\n classes={{ endIcon: classes.arrowContainer }}\n endIcon={endIcon}\n variant={open ? \"secondarySubtle\" : variant}\n {...others}\n >\n <div className={cx({ [classes.selection]: !icon })}>\n {children && typeof children === \"string\" ? (\n <div className={classes.placeholder}>{children}</div>\n ) : (\n children\n )}\n </div>\n </HvButton>\n );\n});\n"],"names":["forwardRef","useDefaultProps","useClasses","jsx","DropDownXS","HvButton"],"mappings":";;;;;;;;AA8BO,MAAM,mBAAmBA,MAAA,WAG9B,CAAC,OAAO,QAAQ;AACV,QAAA;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDC,gBAAgB,gBAAA,oBAAoB,KAAK;AAE7C,QAAM,EAAE,SAAS,GAAG,IAAIC,iCAAW,WAAW;AAExC,QAAA,UAAU,OAAO,SACrBC,2BAAA;AAAA,IAACC,gBAAA;AAAA,IAAA;AAAA,MACC,UAAS;AAAA,MACT,OAAO,EAAE,QAAQ,OAAO,WAAW,OAAU;AAAA,MAC7C,WAAW,QAAQ;AAAA,IAAA;AAAA,EAAA;AAKrB,SAAAD,2BAAA;AAAA,IAACE,OAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,UAAU,YAAY;AAAA,MACtB,WAAW;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,UACE,CAAC,QAAQ,IAAI,GAAG;AAAA,UAChB,CAAC,QAAQ,MAAM,GAAG,QAAQ,UAAU,SAAS,KAAK;AAAA,UAClD,CAAC,QAAQ,QAAQ,GAAG,QAAQ,UAAU,SAAS,QAAQ;AAAA,UACvD,CAAC,QAAQ,QAAQ,GAAG;AAAA,UACpB,CAAC,QAAQ,QAAQ,GAAG;AAAA,QACtB;AAAA,QACA;AAAA,MACF;AAAA,MACA,SAAS,EAAE,SAAS,QAAQ,eAAe;AAAA,MAC3C;AAAA,MACA,SAAS,OAAO,oBAAoB;AAAA,MACnC,GAAG;AAAA,MAEJ,UAAAF,2BAAA,IAAC,OAAI,EAAA,WAAW,GAAG,EAAE,CAAC,QAAQ,SAAS,GAAG,CAAC,KAAK,CAAC,GAC9C,UAAY,YAAA,OAAO,aAAa,WAC9BA,2BAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,aAAc,UAAS,IAE/C,SAEJ,CAAA;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;;;"}

package/dist/cjs/DropdownButton/DropdownButton.styles.cjs ADDED Viewed

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const classes = require("../utils/classes.cjs");
+const Button_styles = require("../Button/Button.styles.cjs");
+require("../Button/Button.cjs");
+const disabledStyle = {
+  backgroundColor: uikitStyles.theme.colors.atmo3,
+  borderColor: uikitStyles.theme.colors.atmo3,
+  [`&.${Button_styles.staticClasses.subtle}`]: {
+    backgroundColor: uikitStyles.theme.colors.atmo3,
+    borderColor: uikitStyles.theme.colors.atmo3,
+    "&:hover": { backgroundColor: uikitStyles.theme.colors.atmo3 }
+  },
+  [`&.${Button_styles.staticClasses.ghost}`]: {
+    backgroundColor: uikitStyles.theme.colors.atmo3,
+    borderColor: uikitStyles.theme.colors.atmo3,
+    "&:hover": { backgroundColor: uikitStyles.theme.colors.atmo3 }
+  }
+};
+const { staticClasses, useClasses } = classes.createClasses("HvDropdownButton", {
+  root: {
+    userSelect: "none",
+    position: "relative",
+    [`&:not(.${Button_styles.staticClasses.icon})`]: {
+      width: "100%",
+      minWidth: "unset",
+      justifyContent: "flex-start",
+      paddingLeft: uikitStyles.theme.space.xs
+    }
+  },
+  disabled: {
+    ...disabledStyle
+  },
+  readOnly: {
+    userSelect: "text",
+    ...disabledStyle
+  },
+  open: {
+    backgroundColor: uikitStyles.theme.colors.atmo1
+  },
+  openUp: {
+    borderRadius: `0px 0px ${uikitStyles.theme.radii.base} ${uikitStyles.theme.radii.base}`
+  },
+  openDown: {
+    borderRadius: `${uikitStyles.theme.radii.base} ${uikitStyles.theme.radii.base} 0px 0px`
+  },
+  selection: {
+    color: "inherit",
+    flex: 1,
+    textAlign: "start",
+    overflow: "clip visible",
+    textOverflow: "ellipsis",
+    whiteSpace: "nowrap"
+  },
+  placeholder: {},
+  arrowContainer: {
+    marginRight: uikitStyles.theme.spacing(-2)
+  },
+  arrow: {
+    transition: "rotate 0.2s ease"
+  }
+});
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;

package/dist/cjs/DropdownButton/DropdownButton.styles.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DropdownButton.styles.cjs","sources":["../../../src/DropdownButton/DropdownButton.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../utils/classes\";\nimport { buttonClasses } from \"../Button\";\n\nconst disabledStyle = {\n backgroundColor: theme.colors.atmo3,\n borderColor: theme.colors.atmo3,\n [`&.${buttonClasses.subtle}`]: {\n backgroundColor: theme.colors.atmo3,\n borderColor: theme.colors.atmo3,\n \"&:hover\": { backgroundColor: theme.colors.atmo3 },\n },\n [`&.${buttonClasses.ghost}`]: {\n backgroundColor: theme.colors.atmo3,\n borderColor: theme.colors.atmo3,\n \"&:hover\": { backgroundColor: theme.colors.atmo3 },\n },\n};\n\nexport const { staticClasses, useClasses } = createClasses(\"HvDropdownButton\", {\n root: {\n userSelect: \"none\",\n position: \"relative\",\n\n [`&:not(.${buttonClasses.icon})`]: {\n width: \"100%\",\n minWidth: \"unset\",\n justifyContent: \"flex-start\",\n paddingLeft: theme.space.xs,\n },\n },\n disabled: {\n ...disabledStyle,\n },\n readOnly: {\n userSelect: \"text\",\n ...disabledStyle,\n },\n open: {\n backgroundColor: theme.colors.atmo1,\n },\n openUp: {\n borderRadius: `0px 0px ${theme.radii.base} ${theme.radii.base}`,\n },\n openDown: {\n borderRadius: `${theme.radii.base} ${theme.radii.base} 0px 0px`,\n },\n selection: {\n color: \"inherit\",\n flex: 1,\n textAlign: \"start\",\n overflow: \"clip visible\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n },\n placeholder: {},\n arrowContainer: {\n marginRight: theme.spacing(-2),\n },\n arrow: {\n transition: \"rotate 0.2s ease\",\n },\n});\n"],"names":["theme","buttonClasses","createClasses"],"mappings":";;;;;;AAKA,MAAM,gBAAgB;AAAA,EACpB,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,EAC9B,aAAaA,YAAAA,MAAM,OAAO;AAAA,EAC1B,CAAC,KAAKC,4BAAc,MAAM,EAAE,GAAG;AAAA,IAC7B,iBAAiBD,YAAAA,MAAM,OAAO;AAAA,IAC9B,aAAaA,YAAAA,MAAM,OAAO;AAAA,IAC1B,WAAW,EAAE,iBAAiBA,kBAAM,OAAO,MAAM;AAAA,EACnD;AAAA,EACA,CAAC,KAAKC,4BAAc,KAAK,EAAE,GAAG;AAAA,IAC5B,iBAAiBD,YAAAA,MAAM,OAAO;AAAA,IAC9B,aAAaA,YAAAA,MAAM,OAAO;AAAA,IAC1B,WAAW,EAAE,iBAAiBA,kBAAM,OAAO,MAAM;AAAA,EACnD;AACF;AAEO,MAAM,EAAE,eAAe,eAAeE,QAAAA,cAAc,oBAAoB;AAAA,EAC7E,MAAM;AAAA,IACJ,YAAY;AAAA,IACZ,UAAU;AAAA,IAEV,CAAC,UAAUD,cAAAA,cAAc,IAAI,GAAG,GAAG;AAAA,MACjC,OAAO;AAAA,MACP,UAAU;AAAA,MACV,gBAAgB;AAAA,MAChB,aAAaD,YAAAA,MAAM,MAAM;AAAA,IAC3B;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,GAAG;AAAA,EACL;AAAA,EACA,UAAU;AAAA,IACR,YAAY;AAAA,IACZ,GAAG;AAAA,EACL;AAAA,EACA,MAAM;AAAA,IACJ,iBAAiBA,YAAAA,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,QAAQ;AAAA,IACN,cAAc,WAAWA,YAAAA,MAAM,MAAM,IAAI,IAAIA,YAAA,MAAM,MAAM,IAAI;AAAA,EAC/D;AAAA,EACA,UAAU;AAAA,IACR,cAAc,GAAGA,YAAM,MAAA,MAAM,IAAI,IAAIA,kBAAM,MAAM,IAAI;AAAA,EACvD;AAAA,EACA,WAAW;AAAA,IACT,OAAO;AAAA,IACP,MAAM;AAAA,IACN,WAAW;AAAA,IACX,UAAU;AAAA,IACV,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA,EACA,aAAa,CAAC;AAAA,EACd,gBAAgB;AAAA,IACd,aAAaA,YAAM,MAAA,QAAQ,EAAE;AAAA,EAC/B;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,EACd;AACF,CAAC;;;"}

package/dist/cjs/FileUploader/DropZone/DropZone.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DropZone.cjs","sources":["../../../../src/FileUploader/DropZone/DropZone.tsx"],"sourcesContent":["import React, { useRef, useState } from \"react\";\nimport { Doc } from \"@hitachivantara/uikit-react-icons\";\n\nimport { setId } from \"../../utils/setId\";\nimport { useUniqueId } from \"../../hooks/useUniqueId\";\nimport { uniqueId } from \"../../utils/helpers\";\nimport { HvTypography } from \"../../Typography\";\nimport { HvInfoMessage, HvLabel } from \"../../Forms\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport { convertUnits } from \"../utils\";\nimport { HvFileData, HvFilesAddedEvent } from \"../File\";\n\nimport { staticClasses, useClasses } from \"./DropZone.styles\";\n\nexport { staticClasses as dropZoneClasses };\n\nexport type HvDropZoneClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropZoneLabels {\n /*\n Extensions of the accepted file types\n /\n acceptedFiles?: string;\n /\n Dropzone area label.\n /\n dropzone?: string;\n /\n Size file warning label.\n /\n sizeWarning?: string;\n /\n Size file warning label.\n /\n drag?: string;\n /\n Size file warning label.\n /\n selectFiles?: string;\n /\n Theming sheet used to style components\n * /\n dropFiles?: string;\n /\n Message to display when file size is greater than allowed\n * /\n fileSizeError?: string;\n /\n Message to display when file type is greater than allowed\n * /\n fileTypeError?: string;\n}\n\nexport interface HvDropZoneProps {\n /\n Id to be applied to the root node.\n /\n id?: string;\n /\n Labels to present in FileUploader.\n /\n labels?: HvDropZoneLabels;\n /\n Whether the Dropzone should accept multiple files at once.\n /\n multiple?: boolean;\n /\n If the input is disabled or not\n /\n disabled?: boolean;\n /\n Files extensions accepted for upload.\n /\n accept?: React.InputHTMLAttributes<HTMLInputElement>[\"accept\"];\n /\n Max upload size\n * /\n maxFileSize: number;\n /\n Function responsible for processing files added to the drop zone.\n /\n onFilesAdded?: HvFilesAddedEvent;\n /\n Whether the DropZone should hide labels or not.\n /\n hideLabels?: boolean;\n /\n Attributes applied to the input element.\n /\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /\n A Jss Object used to override or extend the styles applied to the component.\n /\n classes?: HvDropZoneClasses;\n}\n\n// TODO: remove/review in `v6`: delegate to HTML `accept` and/or add custom validation\nfunction validateAccept(file?: File, acceptAttr?: string) {\n if (!file \|\| !acceptAttr) return true;\n\n const acceptEntries = acceptAttr.split(\",\");\n const fileName = file.name \|\| \"\";\n const mimeType = (file.type \|\| \"\").toLowerCase();\n const baseMimeType = mimeType.replace(/\\/.$/, \"\");\n\n return acceptEntries.some((type) => {\n const validType = type.trim().toLowerCase();\n if (validType.charAt(0) === \".\") {\n return fileName.toLowerCase().endsWith(validType);\n }\n // This is something like a image/* mime type\n if (validType.endsWith(\"/\")) {\n return baseMimeType === validType.replace(/\\/.$/, \"\");\n }\n return mimeType === validType;\n });\n}\n\nexport const HvDropZone = (props: HvDropZoneProps) => {\n const {\n id: idProp,\n classes: classesProp,\n labels,\n accept,\n maxFileSize,\n inputProps,\n hideLabels,\n multiple = true,\n disabled = false,\n onFilesAdded,\n } = useDefaultProps(\"HvDropZone\", props);\n const id = useUniqueId(idProp);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [dragState, setDragState] = useState(false);\n\n const inputRef = useRef<HTMLInputElement \| null>(null);\n\n const handleDragLeave = () => {\n setDragState(false);\n };\n\n const handleDragEnter: React.DragEventHandler = (event) => {\n if (disabled) return;\n event.stopPropagation();\n event.preventDefault();\n setDragState(true);\n };\n\n const onChangeHandler = (filesList: FileList) => {\n const filesToProcess = Object.values(filesList);\n\n const newFiles = filesToProcess.map((file) => {\n const newFile: HvFileData = new File([file], file.name, {\n type: file.type,\n lastModified: file.lastModified,\n });\n newFile.id = uniqueId(\"uploaded-file-data-\");\n\n const isSizeAllowed = file.size <= maxFileSize;\n const isFileAccepted =\n !accept \|\|\n accept.includes(file.type?.split(\"/\")[1]) \|\| // TODO: remove in v6\n validateAccept(file, accept);\n\n if (!isFileAccepted) {\n newFile.errorMessage = labels?.fileTypeError;\n newFile.status = \"fail\";\n } else if (!isSizeAllowed) {\n newFile.errorMessage = labels?.fileSizeError;\n newFile.status = \"fail\";\n }\n\n return newFile;\n });\n\n onFilesAdded?.(newFiles);\n };\n\n return (\n <>\n {!hideLabels && (\n <div id={id} className={classes.dropZoneLabelsGroup}>\n <HvLabel\n id={setId(id, \"input-file-label\")}\n htmlFor={setId(id, \"input-file\")}\n label={labels?.dropzone}\n className={classes.dropZoneLabel}\n />\n <HvInfoMessage id={setId(id, \"description\")}>\n {Number.isInteger(maxFileSize) &&\n `${labels?.sizeWarning} ${convertUnits(maxFileSize)}`}\n {labels?.acceptedFiles\n ? labels.acceptedFiles\n : accept && `\\u00A0(${accept?.replaceAll(\",\", \", \")})`}\n </HvInfoMessage>\n </div>\n )}\n <div\n id={setId(id, \"input-file-container\")}\n className={cx(classes.dropZoneContainer, {\n [classes.dragAction]: dragState,\n [classes.dropZoneContainerDisabled]: disabled,\n })}\n >\n <input\n id={setId(id, \"input-file\")}\n className={classes.inputArea}\n type=\"file\"\n multiple={multiple}\n disabled={disabled}\n title={!disabled ? `${labels?.drag}\\xa0${labels?.selectFiles}` : \"\"}\n onClick={() => {\n if (inputRef.current) {\n inputRef.current.value = \"\";\n }\n }}\n onChange={() => {\n if (!disabled && inputRef.current?.files) {\n onChangeHandler(inputRef.current.files);\n }\n }}\n onDragEnter={handleDragEnter}\n onDragOver={handleDragEnter}\n onDragLeave={handleDragLeave}\n onDropCapture={handleDragLeave}\n onDrop={(event) => {\n if (disabled) return;\n\n const { files } = event.dataTransfer;\n if (multiple === true \|\| files.length === 1) {\n event.stopPropagation();\n event.preventDefault();\n onChangeHandler(files);\n }\n }}\n ref={inputRef}\n accept={accept}\n {...inputProps}\n />\n <div className={classes?.dropArea}>\n {dragState ? (\n <div className={classes.dropZoneAreaLabels}>\n <HvTypography className={classes.dragText}>\n {labels?.dropFiles}\n </HvTypography>\n </div>\n ) : (\n <>\n <Doc\n iconSize=\"M\"\n className={classes.dropZoneAreaIcon}\n color={disabled ? \"secondary_60\" : \"secondary\"}\n />\n <div className={classes.dropZoneAreaLabels}>\n <HvTypography className={classes.dragText}>\n {labels?.drag}\n <span\n className={classes.selectFilesText}\n >{`\\xa0${labels?.selectFiles}`}</span>\n </HvTypography>\n </div>\n </>\n )}\n </div>\n </div>\n </>\n );\n};\n"],"names":["useDefaultProps","useUniqueId","useClasses","useState","useRef","uniqueId","jsxs","Fragment","jsx","HvLabel","setId","HvInfoMessage","convertUnits","HvTypography","Doc"],"mappings":"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"}
1	+ {"version":3,"file":"DropZone.cjs","sources":["../../../../src/FileUploader/DropZone/DropZone.tsx"],"sourcesContent":["import { useRef, useState } from \"react\";\nimport { Doc } from \"@hitachivantara/uikit-react-icons\";\n\nimport { setId } from \"../../utils/setId\";\nimport { useUniqueId } from \"../../hooks/useUniqueId\";\nimport { uniqueId } from \"../../utils/helpers\";\nimport { HvTypography } from \"../../Typography\";\nimport { HvInfoMessage, HvLabel } from \"../../Forms\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\n\nimport { convertUnits } from \"../utils\";\nimport { HvFileData, HvFilesAddedEvent } from \"../File\";\n\nimport { staticClasses, useClasses } from \"./DropZone.styles\";\n\nexport { staticClasses as dropZoneClasses };\n\nexport type HvDropZoneClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropZoneLabels {\n /*\n Extensions of the accepted file types\n /\n acceptedFiles?: string;\n /\n Dropzone area label.\n /\n dropzone?: string;\n /\n Size file warning label.\n /\n sizeWarning?: string;\n /\n Size file warning label.\n /\n drag?: string;\n /\n Size file warning label.\n /\n selectFiles?: string;\n /\n Theming sheet used to style components\n * /\n dropFiles?: string;\n /\n Message to display when file size is greater than allowed\n * /\n fileSizeError?: string;\n /\n Message to display when file type is greater than allowed\n * /\n fileTypeError?: string;\n}\n\nexport interface HvDropZoneProps {\n /\n Id to be applied to the root node.\n /\n id?: string;\n /\n Labels to present in FileUploader.\n /\n labels?: HvDropZoneLabels;\n /\n Whether the Dropzone should accept multiple files at once.\n /\n multiple?: boolean;\n /\n If the input is disabled or not\n /\n disabled?: boolean;\n /\n Files extensions accepted for upload.\n /\n accept?: React.InputHTMLAttributes<HTMLInputElement>[\"accept\"];\n /\n Max upload size\n * /\n maxFileSize: number;\n /\n Function responsible for processing files added to the drop zone.\n /\n onFilesAdded?: HvFilesAddedEvent;\n /\n Whether the DropZone should hide labels or not.\n /\n hideLabels?: boolean;\n /\n Attributes applied to the input element.\n /\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /\n A Jss Object used to override or extend the styles applied to the component.\n /\n classes?: HvDropZoneClasses;\n}\n\n// TODO: remove/review in `v6`: delegate to HTML `accept` and/or add custom validation\nfunction validateAccept(file?: File, acceptAttr?: string) {\n if (!file \|\| !acceptAttr) return true;\n\n const acceptEntries = acceptAttr.split(\",\");\n const fileName = file.name \|\| \"\";\n const mimeType = (file.type \|\| \"\").toLowerCase();\n const baseMimeType = mimeType.replace(/\\/.$/, \"\");\n\n return acceptEntries.some((type) => {\n const validType = type.trim().toLowerCase();\n if (validType.charAt(0) === \".\") {\n return fileName.toLowerCase().endsWith(validType);\n }\n // This is something like a image/* mime type\n if (validType.endsWith(\"/\")) {\n return baseMimeType === validType.replace(/\\/.$/, \"\");\n }\n return mimeType === validType;\n });\n}\n\nexport const HvDropZone = (props: HvDropZoneProps) => {\n const {\n id: idProp,\n classes: classesProp,\n labels,\n accept,\n maxFileSize,\n inputProps,\n hideLabels,\n multiple = true,\n disabled = false,\n onFilesAdded,\n } = useDefaultProps(\"HvDropZone\", props);\n const id = useUniqueId(idProp);\n\n const { classes, cx } = useClasses(classesProp);\n\n const [dragState, setDragState] = useState(false);\n\n const inputRef = useRef<HTMLInputElement \| null>(null);\n\n const handleDragLeave = () => {\n setDragState(false);\n };\n\n const handleDragEnter: React.DragEventHandler = (event) => {\n if (disabled) return;\n event.stopPropagation();\n event.preventDefault();\n setDragState(true);\n };\n\n const onChangeHandler = (filesList: FileList) => {\n const filesToProcess = Object.values(filesList);\n\n const newFiles = filesToProcess.map((file) => {\n const newFile: HvFileData = new File([file], file.name, {\n type: file.type,\n lastModified: file.lastModified,\n });\n newFile.id = uniqueId(\"uploaded-file-data-\");\n\n const isSizeAllowed = file.size <= maxFileSize;\n const isFileAccepted =\n !accept \|\|\n accept.includes(file.type?.split(\"/\")[1]) \|\| // TODO: remove in v6\n validateAccept(file, accept);\n\n if (!isFileAccepted) {\n newFile.errorMessage = labels?.fileTypeError;\n newFile.status = \"fail\";\n } else if (!isSizeAllowed) {\n newFile.errorMessage = labels?.fileSizeError;\n newFile.status = \"fail\";\n }\n\n return newFile;\n });\n\n onFilesAdded?.(newFiles);\n };\n\n return (\n <>\n {!hideLabels && (\n <div id={id} className={classes.dropZoneLabelsGroup}>\n <HvLabel\n id={setId(id, \"input-file-label\")}\n htmlFor={setId(id, \"input-file\")}\n label={labels?.dropzone}\n className={classes.dropZoneLabel}\n />\n <HvInfoMessage id={setId(id, \"description\")}>\n {Number.isInteger(maxFileSize) &&\n `${labels?.sizeWarning} ${convertUnits(maxFileSize)}`}\n {labels?.acceptedFiles\n ? labels.acceptedFiles\n : accept && `\\u00A0(${accept?.replaceAll(\",\", \", \")})`}\n </HvInfoMessage>\n </div>\n )}\n <div\n id={setId(id, \"input-file-container\")}\n className={cx(classes.dropZoneContainer, {\n [classes.dragAction]: dragState,\n [classes.dropZoneContainerDisabled]: disabled,\n })}\n >\n <input\n id={setId(id, \"input-file\")}\n className={classes.inputArea}\n type=\"file\"\n multiple={multiple}\n disabled={disabled}\n title={!disabled ? `${labels?.drag}\\xa0${labels?.selectFiles}` : \"\"}\n onClick={() => {\n if (inputRef.current) {\n inputRef.current.value = \"\";\n }\n }}\n onChange={() => {\n if (!disabled && inputRef.current?.files) {\n onChangeHandler(inputRef.current.files);\n }\n }}\n onDragEnter={handleDragEnter}\n onDragOver={handleDragEnter}\n onDragLeave={handleDragLeave}\n onDropCapture={handleDragLeave}\n onDrop={(event) => {\n if (disabled) return;\n\n const { files } = event.dataTransfer;\n if (multiple === true \|\| files.length === 1) {\n event.stopPropagation();\n event.preventDefault();\n onChangeHandler(files);\n }\n }}\n ref={inputRef}\n accept={accept}\n {...inputProps}\n />\n <div className={classes?.dropArea}>\n {dragState ? (\n <div className={classes.dropZoneAreaLabels}>\n <HvTypography className={classes.dragText}>\n {labels?.dropFiles}\n </HvTypography>\n </div>\n ) : (\n <>\n <Doc\n iconSize=\"M\"\n className={classes.dropZoneAreaIcon}\n color={disabled ? \"secondary_60\" : \"secondary\"}\n />\n <div className={classes.dropZoneAreaLabels}>\n <HvTypography className={classes.dragText}>\n {labels?.drag}\n <span\n className={classes.selectFilesText}\n >{`\\xa0${labels?.selectFiles}`}</span>\n </HvTypography>\n </div>\n </>\n )}\n </div>\n </div>\n </>\n );\n};\n"],"names":["useDefaultProps","useUniqueId","useClasses","useState","useRef","uniqueId","jsxs","Fragment","jsx","HvLabel","setId","HvInfoMessage","convertUnits","HvTypography","Doc"],"mappings":"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"}

package/dist/cjs/FileUploader/DropZone/DropZone.styles.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DropZone.styles.cjs","sources":["../../../../src/FileUploader/DropZone/DropZone.styles.tsx"],"sourcesContent":["import { ~~CSSProperties } from \"react\";\nimport {~~ theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../../utils/classes\";\nimport { outlineStyles } from \"../../utils/focusUtils\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvDropZone\", {\n dropZoneContainer: {\n position: \"relative\",\n width: \"100%\",\n display: \"flex\",\n border: `1px dashed ${theme.colors.secondary_60}`,\n cursor: \"pointer\",\n background: theme.colors.atmo1,\n borderRadius: theme.radii.round,\n\n \"&:hover\": {\n background: `${theme.colors.atmo1}`,\n border: `1px dashed ${theme.colors.secondary}`,\n },\n\n \"&:focus-within\": {\n background: `${theme.colors.atmo1}`,\n border: `1px dashed ${theme.colors.secondary}`,\n ...outlineStyles,\n },\n },\n dropZoneLabelsGroup: {\n display: \"flex\",\n justifyContent: \"start\",\n\n \"& label:nth-of-type(1)\": {},\n\n \"& p:nth-of-type(2)\": {\n marginLeft: \"auto\",\n },\n },\n dragAction: {\n background: `${theme.colors.atmo1}`,\n border: `1px dashed ${theme.colors.primary}`,\n },\n dropZoneContainerDisabled: {\n background: `${theme.colors.atmo3}`,\n border: `1px dashed ${theme.colors.secondary_60}`,\n cursor: \"not-allowed\",\n \"&:hover\": {\n background: `${theme.colors.atmo3}`,\n border: `1px dashed ${theme.colors.secondary_60}`,\n },\n\n \"& $dragText\": {\n color: theme.colors.secondary_60,\n },\n \"& $selectFilesText\": {\n color: theme.colors.secondary_60,\n },\n },\n inputArea: {\n opacity: 0,\n width: \"100%\",\n position: \"absolute\",\n height: \"100%\",\n cursor: \"pointer\",\n\n \"&:disabled\": {\n cursor: \"not-allowed\",\n },\n },\n dropArea: {\n display: \"flex\",\n margin: `${theme.space.md} auto`,\n minHeight: 48,\n },\n dropZoneAreaLabels: {\n display: \"flex\",\n maxWidth: 120,\n margin: \"auto\",\n },\n dropZoneAreaIcon: {\n margin: \"auto\",\n marginRight: theme.space.xs,\n },\n dropZoneLabel: {\n paddingBottom: 6,\n },\n dragText: {\n ...(theme.typography.body as CSSProperties),\n },\n selectFilesText: {\n ...(theme.typography.label as CSSProperties),\n },\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":";;;;;~~AAMO~~,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,cAAc;AAAA,EACvE,mBAAmB;AAAA,IACjB,UAAU;AAAA,IACV,OAAO;AAAA,IACP,SAAS;AAAA,IACT,QAAQ,cAAcC,YAAM,MAAA,OAAO,YAAY;AAAA,IAC/C,QAAQ;AAAA,IACR,YAAYA,YAAAA,MAAM,OAAO;AAAA,IACzB,cAAcA,YAAAA,MAAM,MAAM;AAAA,IAE1B,WAAW;AAAA,MACT,YAAY,GAAGA,YAAAA,MAAM,OAAO,KAAK;AAAA,MACjC,QAAQ,cAAcA,YAAM,MAAA,OAAO,SAAS;AAAA,IAC9C;AAAA,IAEA,kBAAkB;AAAA,MAChB,YAAY,GAAGA,YAAAA,MAAM,OAAO,KAAK;AAAA,MACjC,QAAQ,cAAcA,YAAM,MAAA,OAAO,SAAS;AAAA,MAC5C,GAAGC,WAAA;AAAA,IACL;AAAA,EACF;AAAA,EACA,qBAAqB;AAAA,IACnB,SAAS;AAAA,IACT,gBAAgB;AAAA,IAEhB,0BAA0B,CAAC;AAAA,IAE3B,sBAAsB;AAAA,MACpB,YAAY;AAAA,IACd;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,YAAY,GAAGD,YAAAA,MAAM,OAAO,KAAK;AAAA,IACjC,QAAQ,cAAcA,YAAM,MAAA,OAAO,OAAO;AAAA,EAC5C;AAAA,EACA,2BAA2B;AAAA,IACzB,YAAY,GAAGA,YAAAA,MAAM,OAAO,KAAK;AAAA,IACjC,QAAQ,cAAcA,YAAM,MAAA,OAAO,YAAY;AAAA,IAC/C,QAAQ;AAAA,IACR,WAAW;AAAA,MACT,YAAY,GAAGA,YAAAA,MAAM,OAAO,KAAK;AAAA,MACjC,QAAQ,cAAcA,YAAM,MAAA,OAAO,YAAY;AAAA,IACjD;AAAA,IAEA,eAAe;AAAA,MACb,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACtB;AAAA,IACA,sBAAsB;AAAA,MACpB,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACtB;AAAA,EACF;AAAA,EACA,WAAW;AAAA,IACT,SAAS;AAAA,IACT,OAAO;AAAA,IACP,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,QAAQ;AAAA,IAER,cAAc;AAAA,MACZ,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,IACT,QAAQ,GAAGA,YAAAA,MAAM,MAAM,EAAE;AAAA,IACzB,WAAW;AAAA,EACb;AAAA,EACA,oBAAoB;AAAA,IAClB,SAAS;AAAA,IACT,UAAU;AAAA,IACV,QAAQ;AAAA,EACV;AAAA,EACA,kBAAkB;AAAA,IAChB,QAAQ;AAAA,IACR,aAAaA,YAAAA,MAAM,MAAM;AAAA,EAC3B;AAAA,EACA,eAAe;AAAA,IACb,eAAe;AAAA,EACjB;AAAA,EACA,UAAU;AAAA,IACR,GAAIA,YAAAA,MAAM,WAAW;AAAA,EACvB;AAAA,EACA,iBAAiB;AAAA,IACf,GAAIA,YAAAA,MAAM,WAAW;AAAA,EACvB;AACF,CAAC;;;"}
1	+ {"version":3,"file":"DropZone.styles.cjs","sources":["../../../../src/FileUploader/DropZone/DropZone.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"../../utils/classes\";\nimport { outlineStyles } from \"../../utils/focusUtils\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvDropZone\", {\n dropZoneContainer: {\n position: \"relative\",\n width: \"100%\",\n display: \"flex\",\n border: `1px dashed ${theme.colors.secondary_60}`,\n cursor: \"pointer\",\n background: theme.colors.atmo1,\n borderRadius: theme.radii.round,\n\n \"&:hover\": {\n background: `${theme.colors.atmo1}`,\n border: `1px dashed ${theme.colors.secondary}`,\n },\n\n \"&:focus-within\": {\n background: `${theme.colors.atmo1}`,\n border: `1px dashed ${theme.colors.secondary}`,\n ...outlineStyles,\n },\n },\n dropZoneLabelsGroup: {\n display: \"flex\",\n justifyContent: \"start\",\n\n \"& label:nth-of-type(1)\": {},\n\n \"& p:nth-of-type(2)\": {\n marginLeft: \"auto\",\n },\n },\n dragAction: {\n background: `${theme.colors.atmo1}`,\n border: `1px dashed ${theme.colors.primary}`,\n },\n dropZoneContainerDisabled: {\n background: `${theme.colors.atmo3}`,\n border: `1px dashed ${theme.colors.secondary_60}`,\n cursor: \"not-allowed\",\n \"&:hover\": {\n background: `${theme.colors.atmo3}`,\n border: `1px dashed ${theme.colors.secondary_60}`,\n },\n\n \"& $dragText\": {\n color: theme.colors.secondary_60,\n },\n \"& $selectFilesText\": {\n color: theme.colors.secondary_60,\n },\n },\n inputArea: {\n opacity: 0,\n width: \"100%\",\n position: \"absolute\",\n height: \"100%\",\n cursor: \"pointer\",\n\n \"&:disabled\": {\n cursor: \"not-allowed\",\n },\n },\n dropArea: {\n display: \"flex\",\n margin: `${theme.space.md} auto`,\n minHeight: 48,\n },\n dropZoneAreaLabels: {\n display: \"flex\",\n maxWidth: 120,\n margin: \"auto\",\n },\n dropZoneAreaIcon: {\n margin: \"auto\",\n marginRight: theme.space.xs,\n },\n dropZoneLabel: {\n paddingBottom: 6,\n },\n dragText: {\n ...(theme.typography.body as React.CSSProperties),\n },\n selectFilesText: {\n ...(theme.typography.label as React.CSSProperties),\n },\n});\n"],"names":["createClasses","theme","outlineStyles"],"mappings":";;;;;AAKO,MAAM,EAAE,eAAe,eAAeA,QAAAA,cAAc,cAAc;AAAA,EACvE,mBAAmB;AAAA,IACjB,UAAU;AAAA,IACV,OAAO;AAAA,IACP,SAAS;AAAA,IACT,QAAQ,cAAcC,YAAM,MAAA,OAAO,YAAY;AAAA,IAC/C,QAAQ;AAAA,IACR,YAAYA,YAAAA,MAAM,OAAO;AAAA,IACzB,cAAcA,YAAAA,MAAM,MAAM;AAAA,IAE1B,WAAW;AAAA,MACT,YAAY,GAAGA,YAAAA,MAAM,OAAO,KAAK;AAAA,MACjC,QAAQ,cAAcA,YAAM,MAAA,OAAO,SAAS;AAAA,IAC9C;AAAA,IAEA,kBAAkB;AAAA,MAChB,YAAY,GAAGA,YAAAA,MAAM,OAAO,KAAK;AAAA,MACjC,QAAQ,cAAcA,YAAM,MAAA,OAAO,SAAS;AAAA,MAC5C,GAAGC,WAAA;AAAA,IACL;AAAA,EACF;AAAA,EACA,qBAAqB;AAAA,IACnB,SAAS;AAAA,IACT,gBAAgB;AAAA,IAEhB,0BAA0B,CAAC;AAAA,IAE3B,sBAAsB;AAAA,MACpB,YAAY;AAAA,IACd;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,YAAY,GAAGD,YAAAA,MAAM,OAAO,KAAK;AAAA,IACjC,QAAQ,cAAcA,YAAM,MAAA,OAAO,OAAO;AAAA,EAC5C;AAAA,EACA,2BAA2B;AAAA,IACzB,YAAY,GAAGA,YAAAA,MAAM,OAAO,KAAK;AAAA,IACjC,QAAQ,cAAcA,YAAM,MAAA,OAAO,YAAY;AAAA,IAC/C,QAAQ;AAAA,IACR,WAAW;AAAA,MACT,YAAY,GAAGA,YAAAA,MAAM,OAAO,KAAK;AAAA,MACjC,QAAQ,cAAcA,YAAM,MAAA,OAAO,YAAY;AAAA,IACjD;AAAA,IAEA,eAAe;AAAA,MACb,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACtB;AAAA,IACA,sBAAsB;AAAA,MACpB,OAAOA,YAAAA,MAAM,OAAO;AAAA,IACtB;AAAA,EACF;AAAA,EACA,WAAW;AAAA,IACT,SAAS;AAAA,IACT,OAAO;AAAA,IACP,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,QAAQ;AAAA,IAER,cAAc;AAAA,MACZ,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,IACT,QAAQ,GAAGA,YAAAA,MAAM,MAAM,EAAE;AAAA,IACzB,WAAW;AAAA,EACb;AAAA,EACA,oBAAoB;AAAA,IAClB,SAAS;AAAA,IACT,UAAU;AAAA,IACV,QAAQ;AAAA,EACV;AAAA,EACA,kBAAkB;AAAA,IAChB,QAAQ;AAAA,IACR,aAAaA,YAAAA,MAAM,MAAM;AAAA,EAC3B;AAAA,EACA,eAAe;AAAA,IACb,eAAe;AAAA,EACjB;AAAA,EACA,UAAU;AAAA,IACR,GAAIA,YAAAA,MAAM,WAAW;AAAA,EACvB;AAAA,EACA,iBAAiB;AAAA,IACf,GAAIA,YAAAA,MAAM,WAAW;AAAA,EACvB;AACF,CAAC;;;"}

package/dist/cjs/Focus/Focus.cjs CHANGED Viewed

@@ -7,8 +7,6 @@ const browser = require("../utils/browser.cjs");
 const ConditionalWrapper = require("../utils/ConditionalWrapper.cjs");
 const utils = require("./utils.cjs");
 const Focus_styles = require("./Focus.styles.cjs");
-const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
-const React__default = /* @__PURE__ */ _interopDefault(React);
 const HvFocus = ({
   classes: classesProp,
   children,
@@ -311,7 +309,7 @@ const HvFocus = ({
     childrenToWrap,
     showFocus && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.falseFocus })
   ] });
-  return /* @__PURE__ */ jsxRuntime.jsx(ConditionalWrapper.ConditionalWrapper, { condition: useFalseFocus, wrapper: focusWrapper, children: React__default.default.cloneElement(children, {
+  return /* @__PURE__ */ jsxRuntime.jsx(ConditionalWrapper.ConditionalWrapper, { condition: useFalseFocus, wrapper: focusWrapper, children: React.cloneElement(children, {
     className: cx(
       [classes.root, filterClass],
       {

package/dist/cjs/Focus/Focus.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Focus.cjs","sources":["../../../src/Focus/Focus.tsx"],"sourcesContent":["import React, { RefObject, useState } from \"react\";\n\nimport { HvBaseProps } from \"../types/generic\";\nimport { isKey, isOneOfKeys } from \"../utils/keyboardUtils\";\nimport { isBrowser } from \"../utils/browser\";\nimport { ConditionalWrapper } from \"../utils/ConditionalWrapper\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { getFocusableChildren, setFocusTo } from \"./utils\";\nimport { staticClasses, useClasses } from \"./Focus.styles\";\n\nexport { staticClasses as focusClasses };\nexport type HvFocusClasses = ExtractNames<typeof useClasses>;\n\nexport type HvFocusStrategies = \"listbox\" \| \"menu\" \| \"card\" \| \"grid\";\n\nexport interface HvFocusProps extends HvBaseProps<HTMLElement, \"children\"> {\n children: React.ReactElement;\n /** Extra configuration for the child element. /\n configuration?: {\n tabIndex?: number;\n };\n /* Indicates that the disabled class should be applied. /\n disabledClass?: boolean;\n /* Whether the focus is selected. /\n selected?: boolean;\n /* Whether the focus is disabled. /\n disabled?: boolean;\n /* The reference to the root element to hold all Focus' context. /\n rootRef?: RefObject<HTMLElement>;\n /* Show focus when click element. v /\n focusOnClick?: boolean;\n /* Show focus when click element. v /\n focusDisabled?: boolean;\n /* Focus and navigation strategy to be used. v /\n strategy?: HvFocusStrategies;\n /* Uses an absolute positioned div as a focus. v /\n useFalseFocus?: boolean;\n /* Narrows the results of the focus to only theses class v /\n filterClass?: string;\n /* How much the navigation will skip when using the arrows. v /\n navigationJump?: number;\n /* A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFocusClasses;\n}\n\nexport const HvFocus = ({\n classes: classesProp,\n children,\n configuration = {},\n disabledClass = false,\n selected = false,\n disabled = false,\n rootRef = undefined,\n focusOnClick = false,\n focusDisabled = true,\n strategy = \"listbox\",\n useFalseFocus = false,\n filterClass,\n navigationJump = 4,\n}: HvFocusProps) => {\n const [showFocus, setShowFocus] = useState<boolean>(false);\n const [childFocus, setChildFocus] = useState<any>();\n const [hasRunConfig, setHasRunConfig] = useState(false);\n const { classes, cx } = useClasses(classesProp);\n\n const getFocuses = () => {\n const focuses = rootRef?.current\n ? Array.from(\n rootRef.current.getElementsByClassName(\n filterClass \|\| staticClasses.root \|\| \"root\"\n )\n )\n : [];\n return focuses;\n };\n\n const setTabIndex = (el, tabIndex = 0) => {\n if (!el) return;\n const elChildFocus = getFocusableChildren(el)[0];\n if (elChildFocus) {\n el.tabIndex = -1;\n elChildFocus.tabIndex = tabIndex;\n } else {\n el.tabIndex = tabIndex;\n }\n };\n\n const setSelectedTabIndex = () => {\n const focuses = getFocuses();\n const firstSelected = focuses.find((focus) =>\n focus.classList.contains(classes.selected \|\| \"selected\")\n );\n\n if (!firstSelected) return;\n focuses.forEach((focus) => setTabIndex(focus, -1));\n setTabIndex(firstSelected, 0);\n };\n\n const clearTabSiblings = (el) => {\n getFocuses().forEach((focus) => setTabIndex(focus, -1));\n setTabIndex(el, 0);\n };\n\n const onFocusStrategy = (evt) => {\n if (strategy === \"listbox\") {\n clearTabSiblings(evt.currentTarget);\n }\n };\n\n const onBlurStrategy = () => {\n if (\n strategy === \"listbox\" &&\n rootRef &&\n rootRef.current &&\n !rootRef.current.contains(document.activeElement)\n ) {\n setTimeout(() => {\n setSelectedTabIndex();\n }, 10);\n }\n };\n\n const config = (el) => {\n const { tabIndex } = configuration;\n if (!el \|\| hasRunConfig) return;\n if (strategy === \"card\") {\n setChildFocus(children);\n return;\n }\n\n if (strategy === \"grid\") {\n return;\n }\n\n const focusableChildren = getFocusableChildren(el);\n if (focusableChildren.length) {\n focusableChildren.forEach((child) => setTabIndex(child, -1));\n setChildFocus(focusableChildren[0]);\n }\n\n if (tabIndex != null) setTabIndex(el, tabIndex);\n setHasRunConfig(true);\n };\n\n const addFocusClass = (evt) => {\n if (!useFalseFocus) {\n // evt.currentTarget.classList.add(classes.focused);\n classes.focused\n .split(\" \")\n .forEach((c) => evt.currentTarget.classList.add(c));\n // add global class HvIsFocused as a marker\n // not to be styled directly, only as helper in specific css queries\n evt.currentTarget.classList.add(\"HvIsFocused\");\n classes?.focus\n ?.split(\" \")\n .forEach((c) => evt.currentTarget.classList.add(c));\n }\n };\n\n const removeFocusClass = () => {\n if (!useFalseFocus) {\n getFocuses().forEach((element) => {\n // element.classList.remove(classes.focused);\n classes.focused.split(\" \").forEach((c) => element.classList.remove(c));\n // remove the global class HvIsFocused\n element.classList.remove(\"HvIsFocused\");\n classes?.focus?.split(\" \").forEach((c) => element.classList.remove(c));\n });\n }\n };\n\n const onFocus = (evt) => {\n addFocusClass(evt);\n setShowFocus(true);\n // give focus to child element if any focusable\n\n if (childFocus && childFocus.focus) childFocus.focus();\n onFocusStrategy(evt);\n };\n\n const onBlur = () => {\n setShowFocus(false);\n removeFocusClass();\n onBlurStrategy();\n };\n\n const onMouseDown = (evt) => {\n const hasCard = !!evt.currentTarget?.querySelector(\".HvIsCardGridElement\");\n if (strategy === \"grid\" && hasCard) return;\n\n setFocusTo(evt.currentTarget);\n setTabIndex(evt.currentTarget, 0);\n // remove focus outline unless explicitly enabled\n if (!focusOnClick) {\n // TODO this piece of code works only because onMouseDown is happening after the focus event\n // There is nothing in here that guarantees the order of these events, so it may present a problem in the future\n removeFocusClass();\n setShowFocus(false);\n }\n };\n\n const focusAndUpdateIndex = (nextFocus, previousFocus, focusesList) => {\n if (focusesList?.includes(previousFocus)) {\n setTabIndex(previousFocus, -1);\n }\n setTabIndex(nextFocus, 0);\n setFocusTo(nextFocus);\n };\n\n const getEnabledKeys = (currentFocusIndex, jump, listSize) => ({\n right:\n (currentFocusIndex + 1) % jump === 0 \|\|\n currentFocusIndex + 1 > listSize - 1,\n left: currentFocusIndex % jump === 0,\n up: currentFocusIndex - jump < 0,\n down:\n currentFocusIndex + jump > listSize \|\|\n currentFocusIndex + jump > listSize - 1,\n });\n\n const onGridKeyDownHandler = (\n evt,\n focuses,\n focusesList,\n currentFocusIndex,\n jump\n ) => {\n const childFocusIsInput = childFocus && childFocus.nodeName === \"INPUT\";\n\n if (\n !isOneOfKeys(evt, [\n \"ArrowUp\",\n \"ArrowDown\",\n \"ArrowLeft\",\n \"ArrowRight\",\n \"Home\",\n \"End\",\n \"Space\",\n \"Enter\",\n ]) \|\|\n (childFocusIsInput && isKey(evt, \"Enter\"))\n ) {\n // nothing to do\n return;\n }\n\n // we'll do something with the key so prevent default and stop propagation\n // except for Enter and SpaceBar\n if (!isOneOfKeys(evt, [\"Enter\", \"Space\"])) {\n evt.preventDefault();\n evt.stopPropagation();\n }\n\n const blockedKeys = getEnabledKeys(\n currentFocusIndex,\n jump,\n focusesList.length\n );\n\n switch (evt.code) {\n case \"Space\":\n case \"Enter\":\n if (isBrowser(\"firefox\")) {\n evt.target.click();\n } else {\n evt.currentTarget.click();\n }\n break;\n case \"ArrowUp\":\n if (!blockedKeys.up) {\n focusAndUpdateIndex(\n focuses.jump \|\| focuses.last,\n evt.current,\n focusesList\n );\n }\n break;\n case \"ArrowDown\":\n if (!blockedKeys.down) {\n focusAndUpdateIndex(\n focuses.fall \|\| focuses.first,\n evt.current,\n focusesList\n );\n }\n break;\n case \"ArrowLeft\":\n if (!blockedKeys.left) {\n focusAndUpdateIndex(\n focuses.previous \|\| focuses.last,\n evt.current,\n focusesList\n );\n }\n break;\n case \"ArrowRight\":\n if (!blockedKeys.right) {\n focusAndUpdateIndex(\n focuses.next \|\| focuses.first,\n evt.current,\n focusesList\n );\n }\n break;\n case \"Home\":\n focusAndUpdateIndex(focuses.first, evt.current, focusesList);\n break;\n case \"End\":\n focusAndUpdateIndex(focuses.last, evt.current, focusesList);\n break;\n default:\n }\n };\n\n const onVerticalArrangementHandler = (evt, focuses, focusesList) => {\n const childFocusIsInput = childFocus && childFocus.nodeName === \"INPUT\";\n\n if (\n !isOneOfKeys(evt, [\n \"ArrowUp\",\n \"ArrowDown\",\n \"Home\",\n \"End\",\n \"Space\",\n \"Enter\",\n ]) \|\|\n (childFocusIsInput && isKey(evt, \"Enter\"))\n ) {\n // nothing to do\n return;\n }\n\n // we'll do something with the key so prevent default and stop propagation\n evt.preventDefault();\n evt.stopPropagation();\n\n switch (evt.code) {\n case \"Space\":\n case \"Enter\":\n evt.target.click();\n break;\n case \"ArrowUp\":\n focusAndUpdateIndex(\n focuses.previous \|\| focuses.last,\n evt.current,\n focusesList\n );\n break;\n case \"ArrowDown\":\n focusAndUpdateIndex(\n focuses.next \|\| focuses.first,\n evt.current,\n focusesList\n );\n break;\n case \"Home\":\n focusAndUpdateIndex(focuses.first, evt.current, focusesList);\n break;\n case \"End\":\n focusAndUpdateIndex(focuses.last, evt.current, focusesList);\n break;\n default:\n }\n };\n\n const onSingleHandler = (evt) => {\n const childFocusIsInput = childFocus && childFocus.nodeName === \"INPUT\";\n\n if (\n !isOneOfKeys(evt, [\"Space\", \"Enter\"]) \|\|\n (childFocusIsInput && isKey(evt, \"Enter\"))\n ) {\n // nothing to do\n return;\n }\n\n // we'll do something with the key so prevent default and stop propagation\n evt.preventDefault();\n evt.stopPropagation();\n\n evt.currentTarget.click();\n };\n\n const onKeyDown = (evt) => {\n if (rootRef?.current == null) {\n // operating outside of a composite widget\n // nothing to manage, just style and trigger clicks\n onSingleHandler(evt);\n return;\n }\n\n // TODO keep the smart default, but allow to explicitly override if disabled elements should be focusable\n const isDisabledFocusable = strategy === \"menu\";\n const focusesList = getFocuses().filter(\n (el) =>\n isDisabledFocusable \|\|\n !el.classList.contains(classes?.disabled as string)\n );\n\n const currentFocus = focusesList.indexOf(evt.currentTarget);\n\n const focuses = {\n first: focusesList[0],\n last: focusesList[focusesList.length - 1],\n previous: focusesList[currentFocus - 1],\n next: focusesList[currentFocus + 1],\n fall: focusesList[currentFocus + navigationJump],\n jump: focusesList[currentFocus - navigationJump],\n };\n\n if (strategy === \"grid\") {\n onGridKeyDownHandler(\n evt,\n focuses,\n focusesList,\n currentFocus,\n navigationJump\n );\n return;\n }\n\n // TODO add property for specifying the composite widget orientation\n // TODO implement handler for horizontal orientation\n onVerticalArrangementHandler(evt, focuses, focusesList);\n };\n\n const onKeyUp = (evt) => {\n if (isBrowser(\"firefox\")) evt.preventDefault();\n };\n\n if (disabled) return children;\n\n const focusWrapper = (childrenToWrap) => (\n <div className={classes.externalReference}>\n {childrenToWrap}\n {showFocus && <div className={classes.falseFocus} />}\n </div>\n );\n\n return (\n <ConditionalWrapper condition={useFalseFocus} wrapper={focusWrapper}>\n {React.cloneElement(children, {\n className: cx(\n [classes.root, filterClass],\n {\n [classes.selected]: selected,\n [classes.disabled]: disabledClass,\n [classes.focusDisabled]: focusDisabled,\n },\n children.props.className\n ),\n ref: config,\n onFocus,\n onBlur,\n onMouseDown,\n onKeyDown,\n onKeyUp,\n selected,\n })}\n </ConditionalWrapper>\n );\n};\n"],"names":["useState","useClasses","staticClasses","getFocusableChildren","setFocusTo","isOneOfKeys","isKey","isBrowser","jsx","ConditionalWrapper","React"],"mappings":"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"}
1	+ {"version":3,"file":"Focus.cjs","sources":["../../../src/Focus/Focus.tsx"],"sourcesContent":["import { cloneElement, useState } from \"react\";\n\nimport { HvBaseProps } from \"../types/generic\";\nimport { isKey, isOneOfKeys } from \"../utils/keyboardUtils\";\nimport { isBrowser } from \"../utils/browser\";\nimport { ConditionalWrapper } from \"../utils/ConditionalWrapper\";\nimport { ExtractNames } from \"../utils/classes\";\n\nimport { getFocusableChildren, setFocusTo } from \"./utils\";\nimport { staticClasses, useClasses } from \"./Focus.styles\";\n\nexport { staticClasses as focusClasses };\nexport type HvFocusClasses = ExtractNames<typeof useClasses>;\n\nexport type HvFocusStrategies = \"listbox\" \| \"menu\" \| \"card\" \| \"grid\";\n\nexport interface HvFocusProps extends HvBaseProps<HTMLElement, \"children\"> {\n children: React.ReactElement;\n /** Extra configuration for the child element. /\n configuration?: {\n tabIndex?: number;\n };\n /* Indicates that the disabled class should be applied. /\n disabledClass?: boolean;\n /* Whether the focus is selected. /\n selected?: boolean;\n /* Whether the focus is disabled. /\n disabled?: boolean;\n /* The reference to the root element to hold all Focus' context. /\n rootRef?: React.RefObject<HTMLElement>;\n /* Show focus when click element. v /\n focusOnClick?: boolean;\n /* Show focus when click element. v /\n focusDisabled?: boolean;\n /* Focus and navigation strategy to be used. v /\n strategy?: HvFocusStrategies;\n /* Uses an absolute positioned div as a focus. v /\n useFalseFocus?: boolean;\n /* Narrows the results of the focus to only theses class v /\n filterClass?: string;\n /* How much the navigation will skip when using the arrows. v /\n navigationJump?: number;\n /* A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFocusClasses;\n}\n\nexport const HvFocus = ({\n classes: classesProp,\n children,\n configuration = {},\n disabledClass = false,\n selected = false,\n disabled = false,\n rootRef = undefined,\n focusOnClick = false,\n focusDisabled = true,\n strategy = \"listbox\",\n useFalseFocus = false,\n filterClass,\n navigationJump = 4,\n}: HvFocusProps) => {\n const [showFocus, setShowFocus] = useState<boolean>(false);\n const [childFocus, setChildFocus] = useState<any>();\n const [hasRunConfig, setHasRunConfig] = useState(false);\n const { classes, cx } = useClasses(classesProp);\n\n const getFocuses = () => {\n const focuses = rootRef?.current\n ? Array.from(\n rootRef.current.getElementsByClassName(\n filterClass \|\| staticClasses.root \|\| \"root\"\n )\n )\n : [];\n return focuses;\n };\n\n const setTabIndex = (el, tabIndex = 0) => {\n if (!el) return;\n const elChildFocus = getFocusableChildren(el)[0];\n if (elChildFocus) {\n el.tabIndex = -1;\n elChildFocus.tabIndex = tabIndex;\n } else {\n el.tabIndex = tabIndex;\n }\n };\n\n const setSelectedTabIndex = () => {\n const focuses = getFocuses();\n const firstSelected = focuses.find((focus) =>\n focus.classList.contains(classes.selected \|\| \"selected\")\n );\n\n if (!firstSelected) return;\n focuses.forEach((focus) => setTabIndex(focus, -1));\n setTabIndex(firstSelected, 0);\n };\n\n const clearTabSiblings = (el) => {\n getFocuses().forEach((focus) => setTabIndex(focus, -1));\n setTabIndex(el, 0);\n };\n\n const onFocusStrategy = (evt) => {\n if (strategy === \"listbox\") {\n clearTabSiblings(evt.currentTarget);\n }\n };\n\n const onBlurStrategy = () => {\n if (\n strategy === \"listbox\" &&\n rootRef &&\n rootRef.current &&\n !rootRef.current.contains(document.activeElement)\n ) {\n setTimeout(() => {\n setSelectedTabIndex();\n }, 10);\n }\n };\n\n const config = (el) => {\n const { tabIndex } = configuration;\n if (!el \|\| hasRunConfig) return;\n if (strategy === \"card\") {\n setChildFocus(children);\n return;\n }\n\n if (strategy === \"grid\") {\n return;\n }\n\n const focusableChildren = getFocusableChildren(el);\n if (focusableChildren.length) {\n focusableChildren.forEach((child) => setTabIndex(child, -1));\n setChildFocus(focusableChildren[0]);\n }\n\n if (tabIndex != null) setTabIndex(el, tabIndex);\n setHasRunConfig(true);\n };\n\n const addFocusClass = (evt) => {\n if (!useFalseFocus) {\n // evt.currentTarget.classList.add(classes.focused);\n classes.focused\n .split(\" \")\n .forEach((c) => evt.currentTarget.classList.add(c));\n // add global class HvIsFocused as a marker\n // not to be styled directly, only as helper in specific css queries\n evt.currentTarget.classList.add(\"HvIsFocused\");\n classes?.focus\n ?.split(\" \")\n .forEach((c) => evt.currentTarget.classList.add(c));\n }\n };\n\n const removeFocusClass = () => {\n if (!useFalseFocus) {\n getFocuses().forEach((element) => {\n // element.classList.remove(classes.focused);\n classes.focused.split(\" \").forEach((c) => element.classList.remove(c));\n // remove the global class HvIsFocused\n element.classList.remove(\"HvIsFocused\");\n classes?.focus?.split(\" \").forEach((c) => element.classList.remove(c));\n });\n }\n };\n\n const onFocus = (evt) => {\n addFocusClass(evt);\n setShowFocus(true);\n // give focus to child element if any focusable\n\n if (childFocus && childFocus.focus) childFocus.focus();\n onFocusStrategy(evt);\n };\n\n const onBlur = () => {\n setShowFocus(false);\n removeFocusClass();\n onBlurStrategy();\n };\n\n const onMouseDown = (evt) => {\n const hasCard = !!evt.currentTarget?.querySelector(\".HvIsCardGridElement\");\n if (strategy === \"grid\" && hasCard) return;\n\n setFocusTo(evt.currentTarget);\n setTabIndex(evt.currentTarget, 0);\n // remove focus outline unless explicitly enabled\n if (!focusOnClick) {\n // TODO this piece of code works only because onMouseDown is happening after the focus event\n // There is nothing in here that guarantees the order of these events, so it may present a problem in the future\n removeFocusClass();\n setShowFocus(false);\n }\n };\n\n const focusAndUpdateIndex = (nextFocus, previousFocus, focusesList) => {\n if (focusesList?.includes(previousFocus)) {\n setTabIndex(previousFocus, -1);\n }\n setTabIndex(nextFocus, 0);\n setFocusTo(nextFocus);\n };\n\n const getEnabledKeys = (currentFocusIndex, jump, listSize) => ({\n right:\n (currentFocusIndex + 1) % jump === 0 \|\|\n currentFocusIndex + 1 > listSize - 1,\n left: currentFocusIndex % jump === 0,\n up: currentFocusIndex - jump < 0,\n down:\n currentFocusIndex + jump > listSize \|\|\n currentFocusIndex + jump > listSize - 1,\n });\n\n const onGridKeyDownHandler = (\n evt,\n focuses,\n focusesList,\n currentFocusIndex,\n jump\n ) => {\n const childFocusIsInput = childFocus && childFocus.nodeName === \"INPUT\";\n\n if (\n !isOneOfKeys(evt, [\n \"ArrowUp\",\n \"ArrowDown\",\n \"ArrowLeft\",\n \"ArrowRight\",\n \"Home\",\n \"End\",\n \"Space\",\n \"Enter\",\n ]) \|\|\n (childFocusIsInput && isKey(evt, \"Enter\"))\n ) {\n // nothing to do\n return;\n }\n\n // we'll do something with the key so prevent default and stop propagation\n // except for Enter and SpaceBar\n if (!isOneOfKeys(evt, [\"Enter\", \"Space\"])) {\n evt.preventDefault();\n evt.stopPropagation();\n }\n\n const blockedKeys = getEnabledKeys(\n currentFocusIndex,\n jump,\n focusesList.length\n );\n\n switch (evt.code) {\n case \"Space\":\n case \"Enter\":\n if (isBrowser(\"firefox\")) {\n evt.target.click();\n } else {\n evt.currentTarget.click();\n }\n break;\n case \"ArrowUp\":\n if (!blockedKeys.up) {\n focusAndUpdateIndex(\n focuses.jump \|\| focuses.last,\n evt.current,\n focusesList\n );\n }\n break;\n case \"ArrowDown\":\n if (!blockedKeys.down) {\n focusAndUpdateIndex(\n focuses.fall \|\| focuses.first,\n evt.current,\n focusesList\n );\n }\n break;\n case \"ArrowLeft\":\n if (!blockedKeys.left) {\n focusAndUpdateIndex(\n focuses.previous \|\| focuses.last,\n evt.current,\n focusesList\n );\n }\n break;\n case \"ArrowRight\":\n if (!blockedKeys.right) {\n focusAndUpdateIndex(\n focuses.next \|\| focuses.first,\n evt.current,\n focusesList\n );\n }\n break;\n case \"Home\":\n focusAndUpdateIndex(focuses.first, evt.current, focusesList);\n break;\n case \"End\":\n focusAndUpdateIndex(focuses.last, evt.current, focusesList);\n break;\n default:\n }\n };\n\n const onVerticalArrangementHandler = (evt, focuses, focusesList) => {\n const childFocusIsInput = childFocus && childFocus.nodeName === \"INPUT\";\n\n if (\n !isOneOfKeys(evt, [\n \"ArrowUp\",\n \"ArrowDown\",\n \"Home\",\n \"End\",\n \"Space\",\n \"Enter\",\n ]) \|\|\n (childFocusIsInput && isKey(evt, \"Enter\"))\n ) {\n // nothing to do\n return;\n }\n\n // we'll do something with the key so prevent default and stop propagation\n evt.preventDefault();\n evt.stopPropagation();\n\n switch (evt.code) {\n case \"Space\":\n case \"Enter\":\n evt.target.click();\n break;\n case \"ArrowUp\":\n focusAndUpdateIndex(\n focuses.previous \|\| focuses.last,\n evt.current,\n focusesList\n );\n break;\n case \"ArrowDown\":\n focusAndUpdateIndex(\n focuses.next \|\| focuses.first,\n evt.current,\n focusesList\n );\n break;\n case \"Home\":\n focusAndUpdateIndex(focuses.first, evt.current, focusesList);\n break;\n case \"End\":\n focusAndUpdateIndex(focuses.last, evt.current, focusesList);\n break;\n default:\n }\n };\n\n const onSingleHandler = (evt) => {\n const childFocusIsInput = childFocus && childFocus.nodeName === \"INPUT\";\n\n if (\n !isOneOfKeys(evt, [\"Space\", \"Enter\"]) \|\|\n (childFocusIsInput && isKey(evt, \"Enter\"))\n ) {\n // nothing to do\n return;\n }\n\n // we'll do something with the key so prevent default and stop propagation\n evt.preventDefault();\n evt.stopPropagation();\n\n evt.currentTarget.click();\n };\n\n const onKeyDown = (evt) => {\n if (rootRef?.current == null) {\n // operating outside of a composite widget\n // nothing to manage, just style and trigger clicks\n onSingleHandler(evt);\n return;\n }\n\n // TODO keep the smart default, but allow to explicitly override if disabled elements should be focusable\n const isDisabledFocusable = strategy === \"menu\";\n const focusesList = getFocuses().filter(\n (el) =>\n isDisabledFocusable \|\|\n !el.classList.contains(classes?.disabled as string)\n );\n\n const currentFocus = focusesList.indexOf(evt.currentTarget);\n\n const focuses = {\n first: focusesList[0],\n last: focusesList[focusesList.length - 1],\n previous: focusesList[currentFocus - 1],\n next: focusesList[currentFocus + 1],\n fall: focusesList[currentFocus + navigationJump],\n jump: focusesList[currentFocus - navigationJump],\n };\n\n if (strategy === \"grid\") {\n onGridKeyDownHandler(\n evt,\n focuses,\n focusesList,\n currentFocus,\n navigationJump\n );\n return;\n }\n\n // TODO add property for specifying the composite widget orientation\n // TODO implement handler for horizontal orientation\n onVerticalArrangementHandler(evt, focuses, focusesList);\n };\n\n const onKeyUp = (evt) => {\n if (isBrowser(\"firefox\")) evt.preventDefault();\n };\n\n if (disabled) return children;\n\n const focusWrapper = (childrenToWrap) => (\n <div className={classes.externalReference}>\n {childrenToWrap}\n {showFocus && <div className={classes.falseFocus} />}\n </div>\n );\n\n return (\n <ConditionalWrapper condition={useFalseFocus} wrapper={focusWrapper}>\n {cloneElement(children, {\n className: cx(\n [classes.root, filterClass],\n {\n [classes.selected]: selected,\n [classes.disabled]: disabledClass,\n [classes.focusDisabled]: focusDisabled,\n },\n children.props.className\n ),\n ref: config,\n onFocus,\n onBlur,\n onMouseDown,\n onKeyDown,\n onKeyUp,\n selected,\n })}\n </ConditionalWrapper>\n );\n};\n"],"names":["useState","useClasses","staticClasses","getFocusableChildren","setFocusTo","isOneOfKeys","isKey","isBrowser","jsx","ConditionalWrapper"],"mappings":"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"}

package/dist/cjs/Forms/Adornment/Adornment.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Adornment.cjs","sources":["../../../../src/Forms/Adornment/Adornment.tsx"],"sourcesContent":["import { useContext, forwardRef, ~~MouseEventHandler, ForwardedRef~~ } from \"react\";\n\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Adornment.styles\";\nimport {\n HvFormElementContext,\n HvFormElementDescriptorsContext,\n HvFormStatus,\n} from \"../FormElement\";\n\nconst noop = () => {};\n\nexport { staticClasses as adornmentClasses };\n\nexport type HvAdornmentClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvAdornmentProps\n extends HvBaseProps<\n HTMLDivElement \| HTMLButtonElement,\n \"onMouseDown\" \| \"onKeyDown\"\n > {\n /** The icon to be added into the input. /\n icon: React.ReactNode;\n /* When the adornment should be displayed. /\n showWhen?: HvFormStatus;\n /* Function to be executed when this element is clicked. /\n onClick?: MouseEventHandler<HTMLButtonElement~~> \| undefined;\~~n /* If this property is defined the adornment visibility will be exclusively controlled by this value. /\n isVisible?: boolean;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvAdornmentClasses;\n}\n\n/\n Allows to add a decorative icon or an action to a form element, usually on the right side of an input.\n * E.g., the reveal password button.\n \n In addition to the showWhen feature, which uses the form element's context validation state to determine\n * its visibility, this component also ensures that it does not steal focus from the input and that it is\n * not accessible using the keyboard.\n \n As such, its functionality, if any, for accessibility purposes must be provided through an alternative mean,\n * or by using a regular icon button or toggle button instead.\n */\nexport const HvAdornment = forwardRef<\n HTMLDivElement \| HTMLButtonElement,\n HvAdornmentProps\n>(\n (\n {\n id,\n classes: classesProp,\n className,\n icon,\n showWhen = undefined,\n onClick,\n isVisible = undefined,\n ...others\n },\n ref\n ) => {\n const { classes, cx } = useClasses(classesProp);\n\n const { elementStatus = \"\" } = useContext(HvFormElementContext);\n\n const { input } = useContext(HvFormElementDescriptorsContext);\n\n const displayIcon =\n isVisible ?? (showWhen === undefined \|\| elementStatus === showWhen);\n\n const isClickable = !!onClick;\n\n return isClickable ? (\n <button\n id={id}\n ref={ref as ForwardedRef<HTMLButtonElement>}\n type=\"button\"\n tabIndex={-1}\n aria-controls={input?.[0]?.id}\n className={cx(\n classes.root,\n classes.adornment,\n classes.adornmentButton,\n { [classes.hideIcon]: !displayIcon },\n className\n )}\n onClick={onClick}\n onMouseDown={(event) => event.preventDefault()}\n onKeyDown={noop}\n {...others}\n >\n <div className={classes.icon}>{icon}</div>\n </button>\n ) : (\n <div\n id={id}\n ref={ref as ForwardedRef<HTMLDivElement>}\n className={cx(\n classes.root,\n classes.adornment,\n classes.adornmentIcon,\n { [classes.hideIcon]: !displayIcon },\n className\n )}\n role=\"presentation\"\n {...others}\n >\n <div className={classes.icon}>{icon}</div>\n </div>\n );\n }\n);\n"],"names":["forwardRef","useClasses","useContext","HvFormElementContext","HvFormElementDescriptorsContext","jsx"],"mappings":";;;;;;;AAYA,MAAM,OAAO,MAAM;AAAC;AAkCb,MAAM,cAAcA,MAAA;AAAA,EAIzB,CACE;AAAA,IACE;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA,YAAY;AAAA,IACZ,GAAG;AAAA,KAEL,QACG;AACH,UAAM,EAAE,SAAS,GAAG,IAAIC,4BAAW,WAAW;AAE9C,UAAM,EAAE,gBAAgB,GAAG,IAAIC,iBAAWC,mBAAoB,oBAAA;AAE9D,UAAM,EAAE,MAAA,IAAUD,MAAA,WAAWE,8BAA+B,+BAAA;AAE5D,UAAM,cACJ,cAAc,aAAa,UAAa,kBAAkB;AAEtD,UAAA,cAAc,CAAC,CAAC;AAEtB,WAAO,cACLC,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,MAAK;AAAA,QACL,UAAU;AAAA,QACV,iBAAe,QAAQ,CAAC,GAAG;AAAA,QAC3B,WAAW;AAAA,UACT,QAAQ;AAAA,UACR,QAAQ;AAAA,UACR,QAAQ;AAAA,UACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,CAAC,YAAY;AAAA,UACnC;AAAA,QACF;AAAA,QACA;AAAA,QACA,aAAa,CAAC,UAAU,MAAM,eAAe;AAAA,QAC7C,WAAW;AAAA,QACV,GAAG;AAAA,QAEJ,UAACA,2BAAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,MAAO,UAAK,MAAA;AAAA,MAAA;AAAA,IAAA,IAGtCA,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAW;AAAA,UACT,QAAQ;AAAA,UACR,QAAQ;AAAA,UACR,QAAQ;AAAA,UACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,CAAC,YAAY;AAAA,UACnC;AAAA,QACF;AAAA,QACA,MAAK;AAAA,QACJ,GAAG;AAAA,QAEJ,UAACA,2BAAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,MAAO,UAAK,MAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAG1C;AACF;;;"}
1	+ {"version":3,"file":"Adornment.cjs","sources":["../../../../src/Forms/Adornment/Adornment.tsx"],"sourcesContent":["import { useContext, forwardRef } from \"react\";\n\nimport { HvBaseProps } from \"../../types/generic\";\nimport { ExtractNames } from \"../../utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Adornment.styles\";\nimport {\n HvFormElementContext,\n HvFormElementDescriptorsContext,\n HvFormStatus,\n} from \"../FormElement\";\n\nconst noop = () => {};\n\nexport { staticClasses as adornmentClasses };\n\nexport type HvAdornmentClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvAdornmentProps\n extends HvBaseProps<\n HTMLDivElement \| HTMLButtonElement,\n \"onMouseDown\" \| \"onKeyDown\"\n > {\n /** The icon to be added into the input. /\n icon: React.ReactNode;\n /* When the adornment should be displayed. /\n showWhen?: HvFormStatus;\n /* Function to be executed when this element is clicked. /\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n /* If this property is defined the adornment visibility will be exclusively controlled by this value. /\n isVisible?: boolean;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvAdornmentClasses;\n}\n\n/\n Allows to add a decorative icon or an action to a form element, usually on the right side of an input.\n * E.g., the reveal password button.\n \n In addition to the showWhen feature, which uses the form element's context validation state to determine\n * its visibility, this component also ensures that it does not steal focus from the input and that it is\n * not accessible using the keyboard.\n \n As such, its functionality, if any, for accessibility purposes must be provided through an alternative mean,\n * or by using a regular icon button or toggle button instead.\n */\nexport const HvAdornment = forwardRef<\n HTMLDivElement \| HTMLButtonElement,\n HvAdornmentProps\n>(\n (\n {\n id,\n classes: classesProp,\n className,\n icon,\n showWhen = undefined,\n onClick,\n isVisible = undefined,\n ...others\n },\n ref\n ) => {\n const { classes, cx } = useClasses(classesProp);\n\n const { elementStatus = \"\" } = useContext(HvFormElementContext);\n\n const { input } = useContext(HvFormElementDescriptorsContext);\n\n const displayIcon =\n isVisible ?? (showWhen === undefined \|\| elementStatus === showWhen);\n\n const isClickable = !!onClick;\n\n return isClickable ? (\n <button\n id={id}\n ref={ref as React.ForwardedRef<HTMLButtonElement>}\n type=\"button\"\n tabIndex={-1}\n aria-controls={input?.[0]?.id}\n className={cx(\n classes.root,\n classes.adornment,\n classes.adornmentButton,\n { [classes.hideIcon]: !displayIcon },\n className\n )}\n onClick={onClick}\n onMouseDown={(event) => event.preventDefault()}\n onKeyDown={noop}\n {...others}\n >\n <div className={classes.icon}>{icon}</div>\n </button>\n ) : (\n <div\n id={id}\n ref={ref as React.ForwardedRef<HTMLDivElement>}\n className={cx(\n classes.root,\n classes.adornment,\n classes.adornmentIcon,\n { [classes.hideIcon]: !displayIcon },\n className\n )}\n role=\"presentation\"\n {...others}\n >\n <div className={classes.icon}>{icon}</div>\n </div>\n );\n }\n);\n"],"names":["forwardRef","useClasses","useContext","HvFormElementContext","HvFormElementDescriptorsContext","jsx"],"mappings":";;;;;;;AAYA,MAAM,OAAO,MAAM;AAAC;AAkCb,MAAM,cAAcA,MAAA;AAAA,EAIzB,CACE;AAAA,IACE;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA,YAAY;AAAA,IACZ,GAAG;AAAA,KAEL,QACG;AACH,UAAM,EAAE,SAAS,GAAG,IAAIC,4BAAW,WAAW;AAE9C,UAAM,EAAE,gBAAgB,GAAG,IAAIC,iBAAWC,mBAAoB,oBAAA;AAE9D,UAAM,EAAE,MAAA,IAAUD,MAAA,WAAWE,8BAA+B,+BAAA;AAE5D,UAAM,cACJ,cAAc,aAAa,UAAa,kBAAkB;AAEtD,UAAA,cAAc,CAAC,CAAC;AAEtB,WAAO,cACLC,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,MAAK;AAAA,QACL,UAAU;AAAA,QACV,iBAAe,QAAQ,CAAC,GAAG;AAAA,QAC3B,WAAW;AAAA,UACT,QAAQ;AAAA,UACR,QAAQ;AAAA,UACR,QAAQ;AAAA,UACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,CAAC,YAAY;AAAA,UACnC;AAAA,QACF;AAAA,QACA;AAAA,QACA,aAAa,CAAC,UAAU,MAAM,eAAe;AAAA,QAC7C,WAAW;AAAA,QACV,GAAG;AAAA,QAEJ,UAACA,2BAAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,MAAO,UAAK,MAAA;AAAA,MAAA;AAAA,IAAA,IAGtCA,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAW;AAAA,UACT,QAAQ;AAAA,UACR,QAAQ;AAAA,UACR,QAAQ;AAAA,UACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,CAAC,YAAY;AAAA,UACnC;AAAA,QACF;AAAA,QACA,MAAK;AAAA,QACJ,GAAG;AAAA,QAEJ,UAACA,2BAAAA,IAAA,OAAA,EAAI,WAAW,QAAQ,MAAO,UAAK,MAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAG1C;AACF;;;"}

package/dist/cjs/Forms/Suggestions/Suggestions.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Suggestions.cjs","sources":["../../../../src/Forms/Suggestions/Suggestions.tsx"],"sourcesContent":["import ~~React~~, ~~{\n forwardRef,\n~~ useContext~~,\n~~ useEffect~~,\n~~ useRef~~,\n~~ useState~~,\n~~} from \"react\";\n\nimport MuiPopper from \"@mui/material/Popper\";\nimport { useForkRef } from \"@mui/material/utils\";\n\nimport { HvBaseProps } from \"../../types/generic\";\nimport { setId } from \"../../utils/setId\";\nimport { HvListItem } from \"../../ListContainer\";\nimport {\n HvClickOutsideEvent,\n useClickOutside,\n} from \"../../hooks/useClickOutside\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { HvSelectionList } from \"../../SelectionList\";\n\nimport { staticClasses, useClasses } from \"./Suggestions.styles\";\nimport { HvFormElementContext } from \"../FormElement\";\n\nexport { staticClasses as suggestionsClasses };\n\nexport type HvSuggestionsClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSuggestion {\n id?: string;\n label: React.ReactNode;\n value?: string;\n disabled?: boolean;\n}\n\nexport interface HvSuggestionsProps extends HvBaseProps {\n /** Whether suggestions is visible. /\n expanded?: boolean;\n /* The HTML element Suggestions attaches to. /\n anchorEl?: HTMLElement \| null;\n /* Array of { id, label, ...others } values to display in the suggestion list /\n suggestionValues?: HvSuggestion[] \| null;\n /* Function called when a suggestion is selected /\n onSuggestionSelected?: (event: React.MouseEvent, value: HvSuggestion) => void;\n /* Function called when suggestion list is closed /\n onClose?: (event: HvClickOutsideEvent) => void;\n /* A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvSuggestionsClasses;\n}\n\nexport const HvSuggestions = forwardRef((props: HvSuggestionsProps, extRef) => {\n const {\n id,\n className,\n classes: classesProp,\n expanded = false,\n anchorEl,\n suggestionValues = [],\n onClose,\n onSuggestionSelected,\n ...others\n } = props;\n const { classes, cx } = useClasses(classesProp);\n\n const { elementId } = useContext(HvFormElementContext);\n const localId = id ?? setId(elementId, \"suggestions\");\n\n const ref = useRef<HTMLDivElement>(null);\n const forkedRef = useForkRef(ref, extRef);\n\n const [isOpen, setIsOpen] = useState(expanded);\n\n useClickOutside(ref, (event) => {\n setIsOpen(false);\n onClose?.(event);\n });\n\n useEffect(() => {\n setIsOpen(expanded);\n }, [expanded]);\n\n return (\n <div\n id={localId}\n ref={forkedRef}\n className={cx(classes.root, className)}\n {...others}\n >\n <MuiPopper\n open={isOpen}\n disablePortal\n anchorEl={anchorEl}\n className={classes.popper}\n >\n <HvSelectionList\n className={classes.list}\n id={setId(localId, \"list\")}\n onChange={onSuggestionSelected}\n >\n {suggestionValues?.map((item, i) => {\n const itemKey = item.id \|\| setId(\"item\", i);\n\n return (\n <HvListItem\n key={itemKey}\n value={item}\n disabled={item.disabled \|\| undefined}\n >\n {item.label}\n </HvListItem>\n );\n })}\n </HvSelectionList>\n </MuiPopper>\n </div>\n );\n});\n"],"names":["forwardRef","useClasses","useContext","HvFormElementContext","setId","useRef","useForkRef","useState","useClickOutside","useEffect","jsx","MuiPopper","HvSelectionList","HvListItem"],"mappings":";;;;;;;;;;;;;;~~AAkDO~~,MAAM,gBAAgBA,MAAA,WAAW,CAAC,OAA2B,WAAW;AACvE,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX;AAAA,IACA,mBAAmB,CAAC;AAAA,IACpB;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACD,IAAA;AACJ,QAAM,EAAE,SAAS,GAAG,IAAIC,8BAAW,WAAW;AAE9C,QAAM,EAAE,UAAA,IAAcC,MAAA,WAAWC,mBAAoB,oBAAA;AACrD,QAAM,UAAU,MAAMC,MAAM,MAAA,WAAW,aAAa;AAE9C,QAAA,MAAMC,aAAuB,IAAI;AACjC,QAAA,YAAYC,MAAAA,WAAW,KAAK,MAAM;AAExC,QAAM,CAAC,QAAQ,SAAS,IAAIC,eAAS,QAAQ;AAE7BC,kCAAA,KAAK,CAAC,UAAU;AAC9B,cAAU,KAAK;AACf,cAAU,KAAK;AAAA,EAAA,CAChB;AAEDC,QAAAA,UAAU,MAAM;AACd,cAAU,QAAQ;AAAA,EAAA,GACjB,CAAC,QAAQ,CAAC;AAGX,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,MACJ,KAAK;AAAA,MACL,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,MACpC,GAAG;AAAA,MAEJ,UAAAA,2BAAA;AAAA,QAACC,mBAAA;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,eAAa;AAAA,UACb;AAAA,UACA,WAAW,QAAQ;AAAA,UAEnB,UAAAD,2BAAA;AAAA,YAACE,cAAA;AAAA,YAAA;AAAA,cACC,WAAW,QAAQ;AAAA,cACnB,IAAIR,MAAAA,MAAM,SAAS,MAAM;AAAA,cACzB,UAAU;AAAA,cAET,UAAkB,kBAAA,IAAI,CAAC,MAAM,MAAM;AAClC,sBAAM,UAAU,KAAK,MAAMA,MAAAA,MAAM,QAAQ,CAAC;AAGxC,uBAAAM,2BAAA;AAAA,kBAACG,SAAA;AAAA,kBAAA;AAAA,oBAEC,OAAO;AAAA,oBACP,UAAU,KAAK,YAAY;AAAA,oBAE1B,UAAK,KAAA;AAAA,kBAAA;AAAA,kBAJD;AAAA,gBAAA;AAAA,cAKP,CAEH;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;;;"}
1	+ {"version":3,"file":"Suggestions.cjs","sources":["../../../../src/Forms/Suggestions/Suggestions.tsx"],"sourcesContent":["import { forwardRef, useContext, useEffect, useRef, useState } from \"react\";\n\nimport MuiPopper from \"@mui/material/Popper\";\nimport { useForkRef } from \"@mui/material/utils\";\n\nimport { HvBaseProps } from \"../../types/generic\";\nimport { setId } from \"../../utils/setId\";\nimport { HvListItem } from \"../../ListContainer\";\nimport {\n HvClickOutsideEvent,\n useClickOutside,\n} from \"../../hooks/useClickOutside\";\nimport { ExtractNames } from \"../../utils/classes\";\nimport { HvSelectionList } from \"../../SelectionList\";\n\nimport { staticClasses, useClasses } from \"./Suggestions.styles\";\nimport { HvFormElementContext } from \"../FormElement\";\n\nexport { staticClasses as suggestionsClasses };\n\nexport type HvSuggestionsClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvSuggestion {\n id?: string;\n label: React.ReactNode;\n value?: string;\n disabled?: boolean;\n}\n\nexport interface HvSuggestionsProps extends HvBaseProps {\n /** Whether suggestions is visible. /\n expanded?: boolean;\n /* The HTML element Suggestions attaches to. /\n anchorEl?: HTMLElement \| null;\n /* Array of { id, label, ...others } values to display in the suggestion list /\n suggestionValues?: HvSuggestion[] \| null;\n /* Function called when a suggestion is selected /\n onSuggestionSelected?: (event: React.MouseEvent, value: HvSuggestion) => void;\n /* Function called when suggestion list is closed /\n onClose?: (event: HvClickOutsideEvent) => void;\n /* A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvSuggestionsClasses;\n}\n\nexport const HvSuggestions = forwardRef((props: HvSuggestionsProps, extRef) => {\n const {\n id,\n className,\n classes: classesProp,\n expanded = false,\n anchorEl,\n suggestionValues = [],\n onClose,\n onSuggestionSelected,\n ...others\n } = props;\n const { classes, cx } = useClasses(classesProp);\n\n const { elementId } = useContext(HvFormElementContext);\n const localId = id ?? setId(elementId, \"suggestions\");\n\n const ref = useRef<HTMLDivElement>(null);\n const forkedRef = useForkRef(ref, extRef);\n\n const [isOpen, setIsOpen] = useState(expanded);\n\n useClickOutside(ref, (event) => {\n setIsOpen(false);\n onClose?.(event);\n });\n\n useEffect(() => {\n setIsOpen(expanded);\n }, [expanded]);\n\n return (\n <div\n id={localId}\n ref={forkedRef}\n className={cx(classes.root, className)}\n {...others}\n >\n <MuiPopper\n open={isOpen}\n disablePortal\n anchorEl={anchorEl}\n className={classes.popper}\n >\n <HvSelectionList\n className={classes.list}\n id={setId(localId, \"list\")}\n onChange={onSuggestionSelected}\n >\n {suggestionValues?.map((item, i) => {\n const itemKey = item.id \|\| setId(\"item\", i);\n\n return (\n <HvListItem\n key={itemKey}\n value={item}\n disabled={item.disabled \|\| undefined}\n >\n {item.label}\n </HvListItem>\n );\n })}\n </HvSelectionList>\n </MuiPopper>\n </div>\n );\n});\n"],"names":["forwardRef","useClasses","useContext","HvFormElementContext","setId","useRef","useForkRef","useState","useClickOutside","useEffect","jsx","MuiPopper","HvSelectionList","HvListItem"],"mappings":";;;;;;;;;;;;;;AA4CO,MAAM,gBAAgBA,MAAA,WAAW,CAAC,OAA2B,WAAW;AACvE,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,WAAW;AAAA,IACX;AAAA,IACA,mBAAmB,CAAC;AAAA,IACpB;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACD,IAAA;AACJ,QAAM,EAAE,SAAS,GAAG,IAAIC,8BAAW,WAAW;AAE9C,QAAM,EAAE,UAAA,IAAcC,MAAA,WAAWC,mBAAoB,oBAAA;AACrD,QAAM,UAAU,MAAMC,MAAM,MAAA,WAAW,aAAa;AAE9C,QAAA,MAAMC,aAAuB,IAAI;AACjC,QAAA,YAAYC,MAAAA,WAAW,KAAK,MAAM;AAExC,QAAM,CAAC,QAAQ,SAAS,IAAIC,eAAS,QAAQ;AAE7BC,kCAAA,KAAK,CAAC,UAAU;AAC9B,cAAU,KAAK;AACf,cAAU,KAAK;AAAA,EAAA,CAChB;AAEDC,QAAAA,UAAU,MAAM;AACd,cAAU,QAAQ;AAAA,EAAA,GACjB,CAAC,QAAQ,CAAC;AAGX,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,MACJ,KAAK;AAAA,MACL,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,MACpC,GAAG;AAAA,MAEJ,UAAAA,2BAAA;AAAA,QAACC,mBAAA;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,eAAa;AAAA,UACb;AAAA,UACA,WAAW,QAAQ;AAAA,UAEnB,UAAAD,2BAAA;AAAA,YAACE,cAAA;AAAA,YAAA;AAAA,cACC,WAAW,QAAQ;AAAA,cACnB,IAAIR,MAAAA,MAAM,SAAS,MAAM;AAAA,cACzB,UAAU;AAAA,cAET,UAAkB,kBAAA,IAAI,CAAC,MAAM,MAAM;AAClC,sBAAM,UAAU,KAAK,MAAMA,MAAAA,MAAM,QAAQ,CAAC;AAGxC,uBAAAM,2BAAA;AAAA,kBAACG,SAAA;AAAA,kBAAA;AAAA,oBAEC,OAAO;AAAA,oBACP,UAAU,KAAK,YAAY;AAAA,oBAE1B,UAAK,KAAA;AAAA,kBAAA;AAAA,kBAJD;AAAA,gBAAA;AAAA,cAKP,CAEH;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;;;"}

package/dist/cjs/Header/Navigation/MenuBar/MenuBar.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenuBar.cjs","sources":["../../../../../src/Header/Navigation/MenuBar/MenuBar.tsx"],"sourcesContent":["import { ~~MouseEvent } from \"react\";\n\nimport {~~ HvBaseProps } from \"../../../types/generic\";\n\nimport { useDefaultProps } from \"../../../hooks/useDefaultProps\";\n\nimport { HvHeaderMenuItem } from \"../MenuItem\";\nimport { HvHeaderNavigationItemProp } from \"../useSelectionPath\";\nimport { Bar, BarProps, HvHeaderMenuBarClasses } from \"./Bar\";\n\nexport interface HvHeaderMenuBarProps\n extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n data: HvHeaderNavigationItemProp[];\n type?: BarProps[\"type\"];\n onClick?: (event: MouseEvent, selection: HvHeaderNavigationItemProp) => void;\n levels: number;\n currentLevel: number;\n classes?: HvHeaderMenuBarClasses;\n}\n\nexport const HvHeaderMenuBar = (props: HvHeaderMenuBarProps) => {\n const {\n data = [],\n onClick,\n type = \"menubar\",\n levels,\n currentLevel,\n classes,\n ...others\n } = useDefaultProps(\"HvHeaderMenuBar\", props);\n return (\n <Bar data={data} type={type} classes={classes} {...others}>\n {data.map((item~~: HvHeaderNavigationItemProp~~) => (\n <HvHeaderMenuItem\n key={item.id}\n item={item}\n type={type}\n onClick={onClick}\n levels={levels}\n currentLevel={currentLevel}\n />\n ))}\n </Bar>\n );\n};\n"],"names":["useDefaultProps","jsx","Bar","HvHeaderMenuItem"],"mappings":";;;;;;~~AAoBa~~,MAAA,kBAAkB,CAAC,UAAgC;AACxD,QAAA;AAAA,IACJ,OAAO,CAAC;AAAA,IACR;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,mBAAmB,KAAK;AAE1C,SAAAC,2BAAA,IAACC,IAAI,KAAA,EAAA,MAAY,MAAY,SAAmB,GAAG,QAChD,UAAA,KAAK,IAAI,CAAC,SACTD,2BAAA;AAAA,IAACE,SAAA;AAAA,IAAA;AAAA,MAEC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IALK,KAAK;AAAA,EAOb,CAAA,EACH,CAAA;AAEJ;;"}
1	+ {"version":3,"file":"MenuBar.cjs","sources":["../../../../../src/Header/Navigation/MenuBar/MenuBar.tsx"],"sourcesContent":["import { HvBaseProps } from \"../../../types/generic\";\n\nimport { useDefaultProps } from \"../../../hooks/useDefaultProps\";\n\nimport { HvHeaderMenuItem } from \"../MenuItem\";\nimport { HvHeaderNavigationItemProp } from \"../useSelectionPath\";\nimport { Bar, BarProps, HvHeaderMenuBarClasses } from \"./Bar\";\n\nexport interface HvHeaderMenuBarProps\n extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n data: HvHeaderNavigationItemProp[];\n type?: BarProps[\"type\"];\n onClick?: (\n event: React.MouseEvent,\n selection: HvHeaderNavigationItemProp\n ) => void;\n levels: number;\n currentLevel: number;\n classes?: HvHeaderMenuBarClasses;\n}\n\nexport const HvHeaderMenuBar = (props: HvHeaderMenuBarProps) => {\n const {\n data = [],\n onClick,\n type = \"menubar\",\n levels,\n currentLevel,\n classes,\n ...others\n } = useDefaultProps(\"HvHeaderMenuBar\", props);\n return (\n <Bar data={data} type={type} classes={classes} {...others}>\n {data.map((item) => (\n <HvHeaderMenuItem\n key={item.id}\n item={item}\n type={type}\n onClick={onClick}\n levels={levels}\n currentLevel={currentLevel}\n />\n ))}\n </Bar>\n );\n};\n"],"names":["useDefaultProps","jsx","Bar","HvHeaderMenuItem"],"mappings":";;;;;;AAqBa,MAAA,kBAAkB,CAAC,UAAgC;AACxD,QAAA;AAAA,IACJ,OAAO,CAAC;AAAA,IACR;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,mBAAmB,KAAK;AAE1C,SAAAC,2BAAA,IAACC,IAAI,KAAA,EAAA,MAAY,MAAY,SAAmB,GAAG,QAChD,UAAA,KAAK,IAAI,CAAC,SACTD,2BAAA;AAAA,IAACE,SAAA;AAAA,IAAA;AAAA,MAEC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IALK,KAAK;AAAA,EAOb,CAAA,EACH,CAAA;AAEJ;;"}

package/dist/cjs/Header/Navigation/MenuItem/MenuItem.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenuItem.cjs","sources":["../../../../../src/Header/Navigation/MenuItem/MenuItem.tsx"],"sourcesContent":["import ~~React,~~ { ~~MouseEvent,~~ useContext } from \"react\";\n\nimport { HvTypography } from \"../../../Typography\";\nimport { HvBaseProps } from \"../../../types/generic\";\nimport { isKey } from \"../../../utils/keyboardUtils\";\nimport { ExtractNames } from \"../../../utils/classes\";\n\nimport { useDefaultProps } from \"../../../hooks/useDefaultProps\";\n\nimport { FocusContext } from \"../utils/FocusContext\";\nimport { SelectionContext } from \"../utils/SelectionContext\";\nimport { useClasses, staticClasses } from \"./MenuItem.styles\";\nimport { HvHeaderNavigationItemProp } from \"../useSelectionPath\";\nimport { Bar } from \"../MenuBar/Bar\";\n\nexport { staticClasses as headerMenuItemClasses };\n\nexport type HvHeaderMenuItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvHeaderMenuItemProps\n extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n item: HvHeaderNavigationItemProp;\n type?: string;\n onClick?: (event: MouseEvent, selection: HvHeaderNavigationItemProp) => void;\n levels: number;\n currentLevel: number;\n classes?: HvHeaderMenuItemClasses;\n}\n\n// Traverse the tree of items and return the first href it finds\nconst traverseItem = (\n node: HvHeaderNavigationItemProp\n): { href?: string; target?: string } => {\n let href: string \| undefined;\n let target: string \| undefined;\n\n if (node?.href) {\n href = node?.href;\n target = node?.target;\n } else if (node?.data != null && node?.data?.length > 0) {\n let i = 0;\n while (href == null && i < node.data.length) {\n const childNavItem = traverseItem(node?.data[i]);\n if (childNavItem?.href != null) {\n href = childNavItem?.href;\n target = childNavItem?.target;\n break;\n }\n\n i += 1;\n }\n }\n\n return { href, target };\n};\n\nexport const HvHeaderMenuItem = (props: HvHeaderMenuItemProps) => {\n const {\n id,\n item,\n type,\n onClick,\n levels,\n currentLevel,\n classes: classesProp,\n className,\n } = useDefaultProps(\"HvHeaderMenuItem\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const selectionPath = useContext(SelectionContext);\n\n const { dispatch } = useContext(FocusContext);\n\n const { data } = item;\n\n const hasSubLevel = data && data.length;\n\n const isMenu = type === \"menu\";\n\n const isSelected = selectionPath?.[isMenu ? 1 : 0] === item.id;\n\n // true: if the item is part of the selection path but is not the current page the user is seeing, i.e has more sub levels\n // page: used when the selected item is actually the current page the user is seeing\n const isCurrent = isSelected ? (hasSubLevel ? true : \"page\") : undefined;\n\n const actionHandler = (event: any) => {\n if (\n event.type === \"click\" \|\|\n isKey(event, \"Enter\") \|\|\n isKey(event, \"Space\")\n ) {\n if (event.type === \"click\") {\n event.currentTarget.blur();\n }\n\n onClick?.(event, item);\n }\n };\n\n const handleFocus = (event: React.FocusEvent) => {\n dispatch?.({ type: \"setItemFocused\", itemFocused: event.currentTarget });\n };\n\n const itemProps = {\n onClick: actionHandler,\n onKeyDown: actionHandler,\n onFocus: handleFocus,\n };\n\n const label = (\n <HvTypography\n component=\"span\"\n variant={isSelected ? \"label\" : \"body\"}\n data-text={item.label}\n >\n {item.label}\n </HvTypography>\n );\n\n let itemHref = item?.href;\n let itemTarget = item?.target;\n\n // apps should configure the href even on parent items without content\n // so the fallback logic is theirs, but if not we'll do our best to find a link\n if (item?.href == null) {\n const { href, target } = traverseItem(item);\n itemHref = href;\n itemTarget = target;\n }\n\n return (\n <li\n id={id}\n key={item.label}\n className={cx(\n classes.root,\n {\n [classes.menu]: isMenu,\n [classes.menubar]: !isMenu,\n [classes.selected]: !!isSelected,\n },\n className\n )}\n >\n {itemHref ? (\n <a\n className={classes.link}\n href={itemHref}\n target={itemTarget}\n {...itemProps}\n aria-current={isCurrent}\n // Fix for a possible bug in playwright where, even though hidden from screen readers and not appearing in the accessibility\n // tree, due to the styling duplication (span::after - using 'data-text'), locators have to double the name.\n aria-label={item.label}\n >\n {label}\n </a>\n ) : (\n // keeping this code path for backwards compatibility, but\n // shouldn't really be used as it's not accessible\n <div\n className={classes.button}\n role=\"button\"\n {...itemProps}\n tabIndex={0}\n aria-current={isCurrent}\n >\n {label}\n </div>\n )}\n {/* Limits levels to no more than 2. More than that is not expected and not in DS. */}\n {hasSubLevel && currentLevel < levels && currentLevel < 2 && (\n <Bar data={data} type=\"menu\">\n {data.map((itm: HvHeaderNavigationItemProp) => (\n <HvHeaderMenuItem\n key={itm.id}\n item={itm}\n type=\"menu\"\n onClick={onClick}\n levels={levels}\n currentLevel={currentLevel + 1}\n />\n ))}\n </Bar>\n )}\n </li>\n );\n};\n"],"names":["useDefaultProps","useClasses","useContext","SelectionContext","FocusContext","isKey","jsx","HvTypography","jsxs","Bar"],"mappings":";;;;;;;;;;;~~AA8BA~~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"}
1	+ {"version":3,"file":"MenuItem.cjs","sources":["../../../../../src/Header/Navigation/MenuItem/MenuItem.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { HvTypography } from \"../../../Typography\";\nimport { HvBaseProps } from \"../../../types/generic\";\nimport { isKey } from \"../../../utils/keyboardUtils\";\nimport { ExtractNames } from \"../../../utils/classes\";\n\nimport { useDefaultProps } from \"../../../hooks/useDefaultProps\";\n\nimport { FocusContext } from \"../utils/FocusContext\";\nimport { SelectionContext } from \"../utils/SelectionContext\";\nimport { useClasses, staticClasses } from \"./MenuItem.styles\";\nimport { HvHeaderNavigationItemProp } from \"../useSelectionPath\";\nimport { Bar } from \"../MenuBar/Bar\";\n\nexport { staticClasses as headerMenuItemClasses };\n\nexport type HvHeaderMenuItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvHeaderMenuItemProps\n extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n item: HvHeaderNavigationItemProp;\n type?: string;\n onClick?: (\n event: React.MouseEvent,\n selection: HvHeaderNavigationItemProp\n ) => void;\n levels: number;\n currentLevel: number;\n classes?: HvHeaderMenuItemClasses;\n}\n\n// Traverse the tree of items and return the first href it finds\nconst traverseItem = (\n node: HvHeaderNavigationItemProp\n): { href?: string; target?: string } => {\n let href: string \| undefined;\n let target: string \| undefined;\n\n if (node?.href) {\n href = node?.href;\n target = node?.target;\n } else if (node?.data != null && node?.data?.length > 0) {\n let i = 0;\n while (href == null && i < node.data.length) {\n const childNavItem = traverseItem(node?.data[i]);\n if (childNavItem?.href != null) {\n href = childNavItem?.href;\n target = childNavItem?.target;\n break;\n }\n\n i += 1;\n }\n }\n\n return { href, target };\n};\n\nexport const HvHeaderMenuItem = (props: HvHeaderMenuItemProps) => {\n const {\n id,\n item,\n type,\n onClick,\n levels,\n currentLevel,\n classes: classesProp,\n className,\n } = useDefaultProps(\"HvHeaderMenuItem\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const selectionPath = useContext(SelectionContext);\n\n const { dispatch } = useContext(FocusContext);\n\n const { data } = item;\n\n const hasSubLevel = data && data.length;\n\n const isMenu = type === \"menu\";\n\n const isSelected = selectionPath?.[isMenu ? 1 : 0] === item.id;\n\n // true: if the item is part of the selection path but is not the current page the user is seeing, i.e has more sub levels\n // page: used when the selected item is actually the current page the user is seeing\n const isCurrent = isSelected ? (hasSubLevel ? true : \"page\") : undefined;\n\n const actionHandler = (event: any) => {\n if (\n event.type === \"click\" \|\|\n isKey(event, \"Enter\") \|\|\n isKey(event, \"Space\")\n ) {\n if (event.type === \"click\") {\n event.currentTarget.blur();\n }\n\n onClick?.(event, item);\n }\n };\n\n const handleFocus = (event: React.FocusEvent) => {\n dispatch?.({ type: \"setItemFocused\", itemFocused: event.currentTarget });\n };\n\n const itemProps = {\n onClick: actionHandler,\n onKeyDown: actionHandler,\n onFocus: handleFocus,\n };\n\n const label = (\n <HvTypography\n component=\"span\"\n variant={isSelected ? \"label\" : \"body\"}\n data-text={item.label}\n >\n {item.label}\n </HvTypography>\n );\n\n let itemHref = item?.href;\n let itemTarget = item?.target;\n\n // apps should configure the href even on parent items without content\n // so the fallback logic is theirs, but if not we'll do our best to find a link\n if (item?.href == null) {\n const { href, target } = traverseItem(item);\n itemHref = href;\n itemTarget = target;\n }\n\n return (\n <li\n id={id}\n key={item.label}\n className={cx(\n classes.root,\n {\n [classes.menu]: isMenu,\n [classes.menubar]: !isMenu,\n [classes.selected]: !!isSelected,\n },\n className\n )}\n >\n {itemHref ? (\n <a\n className={classes.link}\n href={itemHref}\n target={itemTarget}\n {...itemProps}\n aria-current={isCurrent}\n // Fix for a possible bug in playwright where, even though hidden from screen readers and not appearing in the accessibility\n // tree, due to the styling duplication (span::after - using 'data-text'), locators have to double the name.\n aria-label={item.label}\n >\n {label}\n </a>\n ) : (\n // keeping this code path for backwards compatibility, but\n // shouldn't really be used as it's not accessible\n <div\n className={classes.button}\n role=\"button\"\n {...itemProps}\n tabIndex={0}\n aria-current={isCurrent}\n >\n {label}\n </div>\n )}\n {/* Limits levels to no more than 2. More than that is not expected and not in DS. */}\n {hasSubLevel && currentLevel < levels && currentLevel < 2 && (\n <Bar data={data} type=\"menu\">\n {data.map((itm: HvHeaderNavigationItemProp) => (\n <HvHeaderMenuItem\n key={itm.id}\n item={itm}\n type=\"menu\"\n onClick={onClick}\n levels={levels}\n currentLevel={currentLevel + 1}\n />\n ))}\n </Bar>\n )}\n </li>\n );\n};\n"],"names":["useDefaultProps","useClasses","useContext","SelectionContext","FocusContext","isKey","jsx","HvTypography","jsxs","Bar"],"mappings":"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"}

package/dist/cjs/Header/Navigation/Navigation.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Navigation.cjs","sources":["../../../../src/Header/Navigation/Navigation.tsx"],"sourcesContent":["import { ~~MouseEvent } from \"react\";\n\nimport {~~ HvBaseProps } from \"../../types/generic\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../../utils/classes\";\n\nimport { HvHeaderMenuBar, HvHeaderMenuBarProps } from \"./MenuBar\";\nimport { staticClasses, useClasses } from \"./Navigation.styles\";\nimport { FocusProvider } from \"./utils/FocusContext\";\nimport { SelectionContext } from \"./utils/SelectionContext\";\nimport {\n HvHeaderNavigationItemProp,\n useSelectionPath,\n} from \"./useSelectionPath\";\n\nexport { staticClasses as headerNavigationClasses };\n\nexport type HvHeaderNavigationClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvHeaderNavigationProps\n extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n data: HvHeaderNavigationItemProp[];\n selected?: string;\n onClick?: (event: MouseEvent, selection: HvHeaderNavigationItemProp) => void;\n classes?: HvHeaderNavigationClasses;\n /*\n The number of levels to show: the first level (1) or the first and second level (2).\n \n Defaults to `2`.\n * */\n levels?: 1 \| 2;\n}\n\nexport const HvHeaderNavigation = (props: HvHeaderNavigationProps) => {\n const {\n data,\n selected,\n onClick,\n className,\n classes: classesProp,\n levels = 2,\n ...others\n } = useDefaultProps(\"HvHeaderNavigation\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const selectionPath = useSelectionPath(data, selected);\n\n const handleClick: HvHeaderMenuBarProps[\"onClick\"] = (\n event: ~~MouseEvent,\n~~ selection~~: HvHeaderNavigationItemProp\n~~ ) => {\n event.preventDefault();\n\n onClick?.(event, selection);\n };\n\n return (\n <SelectionContext.Provider value={selectionPath}>\n <FocusProvider>\n <nav className={cx(classes.root, className)} {...others}>\n <HvHeaderMenuBar\n data={data}\n type=\"menubar\"\n onClick={handleClick}\n levels={levels}\n currentLevel={1}\n />\n </nav>\n </FocusProvider>\n </SelectionContext.Provider>\n );\n};\n"],"names":["useDefaultProps","useClasses","useSelectionPath","SelectionContext","jsx","FocusProvider","HvHeaderMenuBar"],"mappings":";;;;;;;;;~~AAiCa~~,MAAA,qBAAqB,CAAC,UAAmC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,sBAAsB,KAAK;AAE/C,QAAM,EAAE,SAAS,GAAG,IAAIC,6BAAW,WAAW;AAExC,QAAA,gBAAgBC,iBAAAA,iBAAiB,MAAM,QAAQ;AAE/C,QAAA,cAA+C,~~CACnD~~,~~OACA~~,~~cACG~~;~~AACH~~,UAAM,eAAe;AAErB,cAAU,OAAO,SAAS;AAAA,EAAA;AAG5B,wCACGC,kCAAiB,UAAjB,EAA0B,OAAO,eAChC,UAACC,2BAAAA,IAAAC,aAAA,eAAA,EACC,UAACD,2BAAA,IAAA,OAAA,EAAI,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QAC/C,UAAAA,2BAAA;AAAA,IAACE,QAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA,MAAK;AAAA,MACL,SAAS;AAAA,MACT;AAAA,MACA,cAAc;AAAA,IAAA;AAAA,EAAA,GAElB,GACF,EACF,CAAA;AAEJ;;;"}
1	+ {"version":3,"file":"Navigation.cjs","sources":["../../../../src/Header/Navigation/Navigation.tsx"],"sourcesContent":["import { HvBaseProps } from \"../../types/generic\";\nimport { useDefaultProps } from \"../../hooks/useDefaultProps\";\nimport { ExtractNames } from \"../../utils/classes\";\n\nimport { HvHeaderMenuBar, HvHeaderMenuBarProps } from \"./MenuBar\";\nimport { staticClasses, useClasses } from \"./Navigation.styles\";\nimport { FocusProvider } from \"./utils/FocusContext\";\nimport { SelectionContext } from \"./utils/SelectionContext\";\nimport {\n HvHeaderNavigationItemProp,\n useSelectionPath,\n} from \"./useSelectionPath\";\n\nexport { staticClasses as headerNavigationClasses };\n\nexport type HvHeaderNavigationClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvHeaderNavigationProps\n extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n data: HvHeaderNavigationItemProp[];\n selected?: string;\n onClick?: (\n event: React.MouseEvent,\n selection: HvHeaderNavigationItemProp\n ) => void;\n classes?: HvHeaderNavigationClasses;\n /*\n The number of levels to show: the first level (1) or the first and second level (2).\n \n Defaults to `2`.\n * */\n levels?: 1 \| 2;\n}\n\nexport const HvHeaderNavigation = (props: HvHeaderNavigationProps) => {\n const {\n data,\n selected,\n onClick,\n className,\n classes: classesProp,\n levels = 2,\n ...others\n } = useDefaultProps(\"HvHeaderNavigation\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const selectionPath = useSelectionPath(data, selected);\n\n const handleClick: HvHeaderMenuBarProps[\"onClick\"] = (event, selection) => {\n event.preventDefault();\n\n onClick?.(event, selection);\n };\n\n return (\n <SelectionContext.Provider value={selectionPath}>\n <FocusProvider>\n <nav className={cx(classes.root, className)} {...others}>\n <HvHeaderMenuBar\n data={data}\n type=\"menubar\"\n onClick={handleClick}\n levels={levels}\n currentLevel={1}\n />\n </nav>\n </FocusProvider>\n </SelectionContext.Provider>\n );\n};\n"],"names":["useDefaultProps","useClasses","useSelectionPath","SelectionContext","jsx","FocusProvider","HvHeaderMenuBar"],"mappings":";;;;;;;;;AAkCa,MAAA,qBAAqB,CAAC,UAAmC;AAC9D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACDA,gBAAgB,gBAAA,sBAAsB,KAAK;AAE/C,QAAM,EAAE,SAAS,GAAG,IAAIC,6BAAW,WAAW;AAExC,QAAA,gBAAgBC,iBAAAA,iBAAiB,MAAM,QAAQ;AAE/C,QAAA,cAA+C,CAAC,OAAO,cAAc;AACzE,UAAM,eAAe;AAErB,cAAU,OAAO,SAAS;AAAA,EAAA;AAG5B,wCACGC,kCAAiB,UAAjB,EAA0B,OAAO,eAChC,UAACC,2BAAAA,IAAAC,aAAA,eAAA,EACC,UAACD,2BAAA,IAAA,OAAA,EAAI,WAAW,GAAG,QAAQ,MAAM,SAAS,GAAI,GAAG,QAC/C,UAAAA,2BAAA;AAAA,IAACE,QAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA,MAAK;AAAA,MACL,SAAS;AAAA,MACT;AAAA,MACA,cAAc;AAAA,IAAA;AAAA,EAAA,GAElB,GACF,EACF,CAAA;AAEJ;;;"}

package/dist/cjs/Header/Navigation/utils/FocusContext.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FocusContext.cjs","sources":["../../../../../src/Header/Navigation/utils/FocusContext.tsx"],"sourcesContent":["import ~~React,~~ { createContext, useMemo, useReducer } from \"react\";\n\ntype Action = { type: \"setItemFocused\"; itemFocused: EventTarget & Element };\n\nconst reducer: React.Reducer<FocusContextType, Action> = (state, action) => {\n switch (action.type) {\n case \"setItemFocused\":\n return { itemFocused: action.itemFocused };\n default:\n return state;\n }\n};\n\nconst initialState = { itemFocused: undefined, dispatch: undefined };\n\ntype FocusContextType = {\n itemFocused?: EventTarget & Element;\n dispatch?: React.Dispatch<Action>;\n};\n\nexport const FocusContext = createContext<FocusContextType>(initialState);\n\nexport const FocusProvider = ({ children }: { children?: React.ReactNode }) => {\n const [state, dispatch] = useReducer(reducer, initialState);\n const contextValue = useMemo(\n () => ({ ...state, dispatch }),\n [state, dispatch]\n );\n\n return (\n <FocusContext.Provider value={contextValue}>\n {children}\n </FocusContext.Provider>\n );\n};\n"],"names":["createContext","useReducer","useMemo"],"mappings":";;;;AAIA,MAAM,UAAmD,CAAC,OAAO,WAAW;AAC1E,UAAQ,OAAO,MAAM;AAAA,IACnB,KAAK;AACI,aAAA,EAAE,aAAa,OAAO;IAC/B;AACS,aAAA;AAAA,EACX;AACF;AAEA,MAAM,eAAe,EAAE,aAAa,QAAW,UAAU;AAO5C,MAAA,eAAeA,oBAAgC,YAAY;AAEjE,MAAM,gBAAgB,CAAC,EAAE,eAA+C;AAC7E,QAAM,CAAC,OAAO,QAAQ,IAAIC,MAAAA,WAAW,SAAS,YAAY;AAC1D,QAAM,eAAeC,MAAA;AAAA,IACnB,OAAO,EAAE,GAAG,OAAO;IACnB,CAAC,OAAO,QAAQ;AAAA,EAAA;AAGlB,wCACG,aAAa,UAAb,EAAsB,OAAO,cAC3B,SACH,CAAA;AAEJ;;;"}
1	+ {"version":3,"file":"FocusContext.cjs","sources":["../../../../../src/Header/Navigation/utils/FocusContext.tsx"],"sourcesContent":["import { createContext, useMemo, useReducer } from \"react\";\n\ntype Action = { type: \"setItemFocused\"; itemFocused: EventTarget & Element };\n\nconst reducer: React.Reducer<FocusContextType, Action> = (state, action) => {\n switch (action.type) {\n case \"setItemFocused\":\n return { itemFocused: action.itemFocused };\n default:\n return state;\n }\n};\n\nconst initialState = { itemFocused: undefined, dispatch: undefined };\n\ntype FocusContextType = {\n itemFocused?: EventTarget & Element;\n dispatch?: React.Dispatch<Action>;\n};\n\nexport const FocusContext = createContext<FocusContextType>(initialState);\n\nexport const FocusProvider = ({ children }: { children?: React.ReactNode }) => {\n const [state, dispatch] = useReducer(reducer, initialState);\n const contextValue = useMemo(\n () => ({ ...state, dispatch }),\n [state, dispatch]\n );\n\n return (\n <FocusContext.Provider value={contextValue}>\n {children}\n </FocusContext.Provider>\n );\n};\n"],"names":["createContext","useReducer","useMemo"],"mappings":";;;;AAIA,MAAM,UAAmD,CAAC,OAAO,WAAW;AAC1E,UAAQ,OAAO,MAAM;AAAA,IACnB,KAAK;AACI,aAAA,EAAE,aAAa,OAAO;IAC/B;AACS,aAAA;AAAA,EACX;AACF;AAEA,MAAM,eAAe,EAAE,aAAa,QAAW,UAAU;AAO5C,MAAA,eAAeA,oBAAgC,YAAY;AAEjE,MAAM,gBAAgB,CAAC,EAAE,eAA+C;AAC7E,QAAM,CAAC,OAAO,QAAQ,IAAIC,MAAAA,WAAW,SAAS,YAAY;AAC1D,QAAM,eAAeC,MAAA;AAAA,IACnB,OAAO,EAAE,GAAG,OAAO;IACnB,CAAC,OAAO,QAAQ;AAAA,EAAA;AAGlB,wCACG,aAAa,UAAb,EAAsB,OAAO,cAC3B,SACH,CAAA;AAEJ;;;"}

package/dist/cjs/IconButton/IconButton.cjs CHANGED Viewed

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const generic = require("../types/generic.cjs");
+const useDefaultProps = require("../hooks/useDefaultProps.cjs");
 const Button = require("../Button/Button.cjs");
 const Tooltip = require("../Tooltip/Tooltip.cjs");
 const HvIconButton = generic.fixedForwardRef(function HvIconButton2(props, ref) {
@@ -11,7 +12,7 @@ const HvIconButton = generic.fixedForwardRef(function HvIconButton2(props, ref)
     enterDelay = 500,
     tooltipProps,
     ...others
-  } = props;
+  } = useDefaultProps.useDefaultProps("HvIconButton", props);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Tooltip.HvTooltip,
     {

package/dist/cjs/IconButton/IconButton.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IconButton.cjs","sources":["../../../src/IconButton/IconButton.tsx"],"sourcesContent":["import { HvTooltip, HvTooltipProps } from \"../Tooltip\";\nimport { HvButton, HvButtonProps } from \"../Button\";\nimport {\n PolymorphicComponentRef,\n PolymorphicRef,\n fixedForwardRef,\n} from \"../types/generic\";\n\nexport type HvIconButtonProps<C extends React.ElementType = \"button\"> =\n PolymorphicComponentRef<\n C,\n Omit<\n HvButtonProps<C>,\n \| \"icon\"\n \| \"focusableWhenDisabled\"\n \| \"title\"\n \| \"startIcon\"\n \| \"endIcon\"\n \| \"children\"\n \| \"ref\"\n \| \"component\"\n > & {\n /** Label to be displayed in the tooltip when hovered. This label will be used as the button's `aria-label`. /\n title: React.ReactNode;\n /* Number of milliseconds to wait before showing the tooltip. @default 500 /\n enterDelay?: HvTooltipProps[\"enterDelay\"];\n /* Tooltip placement. @default top /\n placement?: HvTooltipProps[\"placement\"];\n /* Extra tooltip properties. /\n tooltipProps?: Omit<Partial<HvTooltipProps>, \"children\">;\n }\n >;\n\n/\n The `HvIconButton` component wraps a `HvTooltip` with a label around a `HvButton` with only an icon as its content.\n * As defined by Design System, a tooltip with the button’s label should always be displayed when hovering an icon only button.\n * This component provides this behavior out of the box.\n */\nexport const HvIconButton = fixedForwardRef(function HvIconButton<\n C extends React.ElementType = \"button\"\n>(props: HvIconButtonProps<C>, ref: PolymorphicRef<C>) {\n const {\n title,\n placement = \"top\",\n enterDelay = 500,\n tooltipProps,\n ...others\n } = props;\n\n return (\n <HvTooltip\n title={title}\n enterDelay={enterDelay}\n placement={placement}\n {...tooltipProps}\n >\n <HvButton\n icon\n ref={ref}\n focusableWhenDisabled\n {...(others as HvButtonProps)}\n />\n </HvTooltip>\n );\n});\n"],"names":["fixedForwardRef","HvIconButton","jsx","HvTooltip","HvButton"],"mappings":"~~;;;;;;AAsCO~~,MAAM,eAAeA,QAAAA,gBAAgB,SAASC,cAEnD,OAA6B,KAAwB;AAC/C,QAAA;AAAA,IACJ;AAAA,IACA,YAAY;AAAA,IACZ,aAAa;AAAA,IACb;AAAA,IACA,GAAG;AAAA,~~EACD~~,~~IAAA~~;~~AAGF~~,SAAAC,2BAAA;AAAA,IAACC,QAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEJ,UAAAD,2BAAA;AAAA,QAACE,OAAA;AAAA,QAAA;AAAA,UACC,MAAI;AAAA,UACJ;AAAA,UACA,uBAAqB;AAAA,UACpB,GAAI;AAAA,QAAA;AAAA,MACP;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;;"}
1	+ {"version":3,"file":"IconButton.cjs","sources":["../../../src/IconButton/IconButton.tsx"],"sourcesContent":["import { HvTooltip, HvTooltipProps } from \"../Tooltip\";\nimport { HvButton, HvButtonProps } from \"../Button\";\nimport {\n PolymorphicComponentRef,\n PolymorphicRef,\n fixedForwardRef,\n} from \"../types/generic\";\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nexport type HvIconButtonProps<C extends React.ElementType = \"button\"> =\n PolymorphicComponentRef<\n C,\n Omit<\n HvButtonProps<C>,\n \| \"icon\"\n \| \"focusableWhenDisabled\"\n \| \"title\"\n \| \"startIcon\"\n \| \"endIcon\"\n \| \"children\"\n \| \"ref\"\n \| \"component\"\n > & {\n /** Label to be displayed in the tooltip when hovered. This label will be used as the button's `aria-label`. /\n title: React.ReactNode;\n /* Number of milliseconds to wait before showing the tooltip. @default 500 /\n enterDelay?: HvTooltipProps[\"enterDelay\"];\n /* Tooltip placement. @default top /\n placement?: HvTooltipProps[\"placement\"];\n /* Extra tooltip properties. /\n tooltipProps?: Omit<Partial<HvTooltipProps>, \"children\">;\n }\n >;\n\n/\n The `HvIconButton` component wraps a `HvTooltip` with a label around a `HvButton` with only an icon as its content.\n * As defined by Design System, a tooltip with the button’s label should always be displayed when hovering an icon only button.\n * This component provides this behavior out of the box.\n */\nexport const HvIconButton = fixedForwardRef(function HvIconButton<\n C extends React.ElementType = \"button\"\n>(props: HvIconButtonProps<C>, ref: PolymorphicRef<C>) {\n const {\n title,\n placement = \"top\",\n enterDelay = 500,\n tooltipProps,\n ...others\n } = useDefaultProps(\"HvIconButton\", props);\n\n return (\n <HvTooltip\n title={title}\n enterDelay={enterDelay}\n placement={placement}\n {...tooltipProps}\n >\n <HvButton\n icon\n ref={ref}\n focusableWhenDisabled\n {...(others as HvButtonProps)}\n />\n </HvTooltip>\n );\n});\n"],"names":["fixedForwardRef","HvIconButton","useDefaultProps","jsx","HvTooltip","HvButton"],"mappings":";;;;;;;AAuCO,MAAM,eAAeA,QAAAA,gBAAgB,SAASC,cAEnD,OAA6B,KAAwB;AAC/C,QAAA;AAAA,IACJ;AAAA,IACA,YAAY;AAAA,IACZ,aAAa;AAAA,IACb;AAAA,IACA,GAAG;AAAA,EAAA,IACDC,gBAAgB,gBAAA,gBAAgB,KAAK;AAGvC,SAAAC,2BAAA;AAAA,IAACC,QAAA;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEJ,UAAAD,2BAAA;AAAA,QAACE,OAAA;AAAA,QAAA;AAAA,UACC,MAAI;AAAA,UACJ;AAAA,UACA,uBAAqB;AAAA,UACpB,GAAI;AAAA,QAAA;AAAA,MACP;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;;"}

package/dist/cjs/InlineEditor/InlineEditor.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InlineEditor.cjs","sources":["../../../src/InlineEditor/InlineEditor.tsx"],"sourcesContent":["import ~~React,~~ { useLayoutEffect, useRef, useState } from \"react\";\n\nimport { Edit } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { HvBaseProps } from \"../types/generic\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useTheme } from \"../hooks/useTheme\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { isKey } from \"../utils/keyboardUtils\";\nimport { HvButtonProps, HvButton } from \"../Button\";\nimport {\n HvTypographyVariants,\n HvTypographyProps,\n HvTypography,\n} from \"../Typography\";\nimport { HvInput, HvInputProps } from \"../Input\";\n\nimport { staticClasses, useClasses } from \"./InlineEditor.styles\";\n\nexport { staticClasses as inlineEditorClasses };\n\nexport type HvInlineEditorClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvInlineEditorProps\n extends HvBaseProps<HTMLDivElement, \"onBlur\" \| \"onChange\"> {\n /** The value of the form element. /\n value?: string;\n /* Whether the Edit icon should always be visible /\n showIcon?: boolean;\n /* Component to use as the input. The component \"inherit\" from `HvBaseInput` (such as `HvInput` or `HvTextArea`) /\n component?: React.ElementType;\n /* Variant of the HvTypography to display /\n variant?: HvTypographyVariants;\n /* Called when the input is blurred. /\n onBlur?: (\n event: React.FocusEvent<HTMLTextAreaElement \| HTMLInputElement>,\n value: string\n ) => void;\n /* Called when the input value changes. /\n onChange?: (event: React.SyntheticEvent, value: string) => void;\n /* Props passed to the HvButton component /\n buttonProps?: HvButtonProps;\n /* Props passed to the HvTypography text component /\n typographyProps?: HvTypographyProps;\n /* Whether the editor is disabled or not. /\n disabled?: boolean;\n /* A Jss Object used to override or extend the styles applied to the empty state component. /\n classes?: HvInlineEditorClasses;\n /* The placeholder value of the input. /\n placeholder?: string;\n}\n\n/\n An Inline Editor allows the user to edit a record without making a major switch\n * between viewing and editing, making it an efficient method of updating a record.\n */\nexport const HvInlineEditor = (props: HvInlineEditorProps) => {\n const {\n className,\n classes: classesProp,\n value: valueProp,\n defaultValue,\n showIcon,\n component: InputComponent = HvInput,\n variant = \"body\",\n placeholder = \"Enter text\",\n onBlur,\n onChange,\n onKeyDown,\n buttonProps,\n typographyProps,\n disabled,\n ...others\n } = useDefaultProps(\"HvInlineEditor\", props);\n\n const { classes, cx } = useClasses(classesProp);\n const [value, setValue] = useControlled(valueProp, defaultValue);\n const [editMode, setEditMode] = useState(false);\n const [cachedValue, setCachedValue] = useState(value);\n const inputRef = useRef<HTMLInputElement>();\n const { activeTheme } = useTheme();\n\n const typographyStyles = activeTheme?.typography[variant] \|\| {};\n const { lineHeight } = typographyStyles;\n\n useLayoutEffect(() => {\n const input = inputRef.current;\n if (editMode && input) {\n input.focus();\n input.select();\n }\n }, [editMode]);\n\n const handleClick = () => {\n setEditMode(true);\n setCachedValue(value);\n };\n\n const handleBlur: HvInputProps[\"onBlur\"] = (event) => {\n setEditMode(false);\n\n const newValue = value \|\| cachedValue; // empty values should be ignored\n setValue(newValue);\n onBlur?.(event, newValue);\n };\n\n const handleKeyDown: HvInputProps[\"onKeyDown\"] = (event) => {\n if (isKey(event, \"Esc\")) {\n setEditMode(false);\n setValue(cachedValue);\n }\n onKeyDown?.(event as any);\n };\n\n const handleChange: HvInputProps[\"onChange\"] = (event, val) => {\n setValue(val);\n onChange?.(event, val);\n };\n\n return (\n <div className={cx(classes.root, className)}>\n {editMode && !disabled ? (\n <InputComponent\n inputRef={inputRef}\n classes={{\n root: classes.inputRoot,\n input: classes.input,\n inputBorderContainer: classes.inputBorderContainer,\n }}\n inputProps={{\n style: {\n ...typographyStyles,\n height: InputComponent === HvInput ? lineHeight : undefined,\n },\n }}\n value={value}\n onBlur={handleBlur}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n {...others}\n />\n ) : (\n <HvButton\n variant=\"secondaryGhost\"\n overrideIconColors={false}\n endIcon={\n <Edit\n color=\"secondary_60\"\n role=\"none\"\n className={cx(classes.icon, {\n [classes.iconVisible]: showIcon,\n })}\n />\n }\n className={cx(classes.button, {\n [classes.largeText]: parseInt(lineHeight as string, 10) >= 28,\n })}\n onClick={handleClick}\n disabled={disabled}\n {...buttonProps}\n >\n <HvTypography\n variant={variant}\n noWrap\n className={cx(classes.text, { [classes.textEmpty]: !value })}\n {...typographyProps}\n >\n {value \|\| placeholder}\n </HvTypography>\n </HvButton>\n )}\n </div>\n );\n};\n"],"names":["HvInput","useDefaultProps","useClasses","useControlled","useState","useRef","useTheme","useLayoutEffect","isKey","jsx","HvButton","Edit","HvTypography"],"mappings":"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"}
1	+ {"version":3,"file":"InlineEditor.cjs","sources":["../../../src/InlineEditor/InlineEditor.tsx"],"sourcesContent":["import { useLayoutEffect, useRef, useState } from \"react\";\n\nimport { Edit } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"../hooks/useDefaultProps\";\n\nimport { HvBaseProps } from \"../types/generic\";\nimport { useControlled } from \"../hooks/useControlled\";\nimport { useTheme } from \"../hooks/useTheme\";\nimport { ExtractNames } from \"../utils/classes\";\nimport { isKey } from \"../utils/keyboardUtils\";\nimport { HvButtonProps, HvButton } from \"../Button\";\nimport {\n HvTypographyVariants,\n HvTypographyProps,\n HvTypography,\n} from \"../Typography\";\nimport { HvInput, HvInputProps } from \"../Input\";\n\nimport { staticClasses, useClasses } from \"./InlineEditor.styles\";\n\nexport { staticClasses as inlineEditorClasses };\n\nexport type HvInlineEditorClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvInlineEditorProps\n extends HvBaseProps<HTMLDivElement, \"onBlur\" \| \"onChange\"> {\n /** The value of the form element. /\n value?: string;\n /* Whether the Edit icon should always be visible /\n showIcon?: boolean;\n /* Component to use as the input. The component \"inherit\" from `HvBaseInput` (such as `HvInput` or `HvTextArea`) /\n component?: React.ElementType;\n /* Variant of the HvTypography to display /\n variant?: HvTypographyVariants;\n /* Called when the input is blurred. /\n onBlur?: (\n event: React.FocusEvent<HTMLTextAreaElement \| HTMLInputElement>,\n value: string\n ) => void;\n /* Called when the input value changes. /\n onChange?: (event: React.SyntheticEvent, value: string) => void;\n /* Props passed to the HvButton component /\n buttonProps?: HvButtonProps;\n /* Props passed to the HvTypography text component /\n typographyProps?: HvTypographyProps;\n /* Whether the editor is disabled or not. /\n disabled?: boolean;\n /* A Jss Object used to override or extend the styles applied to the empty state component. /\n classes?: HvInlineEditorClasses;\n /* The placeholder value of the input. /\n placeholder?: string;\n}\n\n/\n An Inline Editor allows the user to edit a record without making a major switch\n * between viewing and editing, making it an efficient method of updating a record.\n */\nexport const HvInlineEditor = (props: HvInlineEditorProps) => {\n const {\n className,\n classes: classesProp,\n value: valueProp,\n defaultValue,\n showIcon,\n component: InputComponent = HvInput,\n variant = \"body\",\n placeholder = \"Enter text\",\n onBlur,\n onChange,\n onKeyDown,\n buttonProps,\n typographyProps,\n disabled,\n ...others\n } = useDefaultProps(\"HvInlineEditor\", props);\n\n const { classes, cx } = useClasses(classesProp);\n const [value, setValue] = useControlled(valueProp, defaultValue);\n const [editMode, setEditMode] = useState(false);\n const [cachedValue, setCachedValue] = useState(value);\n const inputRef = useRef<HTMLInputElement>();\n const { activeTheme } = useTheme();\n\n const typographyStyles = activeTheme?.typography[variant] \|\| {};\n const { lineHeight } = typographyStyles;\n\n useLayoutEffect(() => {\n const input = inputRef.current;\n if (editMode && input) {\n input.focus();\n input.select();\n }\n }, [editMode]);\n\n const handleClick = () => {\n setEditMode(true);\n setCachedValue(value);\n };\n\n const handleBlur: HvInputProps[\"onBlur\"] = (event) => {\n setEditMode(false);\n\n const newValue = value \|\| cachedValue; // empty values should be ignored\n setValue(newValue);\n onBlur?.(event, newValue);\n };\n\n const handleKeyDown: HvInputProps[\"onKeyDown\"] = (event) => {\n if (isKey(event, \"Esc\")) {\n setEditMode(false);\n setValue(cachedValue);\n }\n onKeyDown?.(event as any);\n };\n\n const handleChange: HvInputProps[\"onChange\"] = (event, val) => {\n setValue(val);\n onChange?.(event, val);\n };\n\n return (\n <div className={cx(classes.root, className)}>\n {editMode && !disabled ? (\n <InputComponent\n inputRef={inputRef}\n classes={{\n root: classes.inputRoot,\n input: classes.input,\n inputBorderContainer: classes.inputBorderContainer,\n }}\n inputProps={{\n style: {\n ...typographyStyles,\n height: InputComponent === HvInput ? lineHeight : undefined,\n },\n }}\n value={value}\n onBlur={handleBlur}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n {...others}\n />\n ) : (\n <HvButton\n variant=\"secondaryGhost\"\n overrideIconColors={false}\n endIcon={\n <Edit\n color=\"secondary_60\"\n role=\"none\"\n className={cx(classes.icon, {\n [classes.iconVisible]: showIcon,\n })}\n />\n }\n className={cx(classes.button, {\n [classes.largeText]: parseInt(lineHeight as string, 10) >= 28,\n })}\n onClick={handleClick}\n disabled={disabled}\n {...buttonProps}\n >\n <HvTypography\n variant={variant}\n noWrap\n className={cx(classes.text, { [classes.textEmpty]: !value })}\n {...typographyProps}\n >\n {value \|\| placeholder}\n </HvTypography>\n </HvButton>\n )}\n </div>\n );\n};\n"],"names":["HvInput","useDefaultProps","useClasses","useControlled","useState","useRef","useTheme","useLayoutEffect","isKey","jsx","HvButton","Edit","HvTypography"],"mappings":"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"}

package/dist/cjs/Input/Input.cjs CHANGED Viewed

@@ -23,8 +23,6 @@ const FormElement = require("../Forms/FormElement/FormElement.cjs");
 const Label = require("../Forms/Label/Label.cjs");
 const InfoMessage = require("../Forms/InfoMessage/InfoMessage.cjs");
 const WarningText = require("../Forms/WarningText/WarningText.cjs");
-const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
-const React__default = /* @__PURE__ */ _interopDefault(React);
 const DEFAULT_LABELS = {
   /** The label of the clear button. */
   clearButtonLabel: "Clear the text",
@@ -360,7 +358,7 @@ const HvInput = React.forwardRef((props, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Success, { color: "positive", className: classes.icon });
   }, [showValidationIcon, validationState, classes.icon]);
   const customIconEl = React.useMemo(
-    () => React.isValidElement(endAdornment) && React__default.default.cloneElement(endAdornment, {
+    () => React.isValidElement(endAdornment) && React.cloneElement(endAdornment, {
       className: cx(endAdornment.props.className, classes.icon)
     }),
     [classes.icon, endAdornment, cx]