npm - @kaizen/components - Versions diffs - 1.26.0 → 1.27.0 - Mend

@kaizen/components 1.26.0 → 1.27.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 (83) hide show

package/dist/cjs/FilterDateRangePicker/subcomponents/DateRangeInputField/DateRangeInputField.cjs CHANGED Viewed

@@ -3,9 +3,9 @@
 var tslib = require('tslib');
 var React = require('react');
 var classnames = require('classnames');
-var a11y = require('@kaizen/a11y');
 var DateInput = require('@kaizen/date-picker/src/_subcomponents/DateInput');
 var draftForm = require('@kaizen/draft-form');
+var VisuallyHidden = require('../../../VisuallyHidden/VisuallyHidden.cjs');
 var isRefObject = require('../../../utils/isRefObject.cjs');
 var DateInputDescription = require('../DateInputDescription/DateInputDescription.cjs');
 var DateRangeValidationMessage = require('../DateRangeValidationMessage/DateRangeValidationMessage.cjs');
@@ -41,7 +41,7 @@ const DateRangeInputField = /*#__PURE__*/function () {
       className: classNameOverride
     }, restProps), React.createElement("fieldset", {
       className: DateRangeInputField_module.dateRangeInputContainer
-    }, React.createElement("legend", null, React.createElement(a11y.VisuallyHidden, null, legend)), React.createElement(DateInput.DateInput, tslib.__assign({
+    }, React.createElement("legend", null, React.createElement(VisuallyHidden.VisuallyHidden, null, legend)), React.createElement(DateInput.DateInput, tslib.__assign({
       ref: inputStartDateRef,
       id: "".concat(id, "--from"),
       "aria-describedby": dateStartInputDescribedBy,

package/dist/cjs/FilterDateRangePicker/subcomponents/DateRangeInputField/DateRangeInputField.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateRangeInputField.cjs","sources":["../../../../../src/FilterDateRangePicker/subcomponents/DateRangeInputField/DateRangeInputField.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport classnames from \"classnames\"\nimport { ~~VisuallyHidden } from~~ \~~"@kaizen/a11y\"\nimport {\~~n DateInput,\n DateInputProps,\n} from \"@kaizen/date-picker/src/_subcomponents/DateInput\"\nimport { FieldMessage } from \"@kaizen/draft-form\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { isRefObject } from \"~utils/isRefObject\"\nimport {\n DateInputDescription,\n DateInputDescriptionProps,\n} from \"../DateInputDescription\"\nimport {\n DateRangeValidationMessage,\n DateRangeValidationMessageProps,\n} from \"../DateRangeValidationMessage\"\nimport styles from \"./DateRangeInputField.module.scss\"\n\nexport type DateRangeInputFieldProps = {\n id: string\n legend: string\n inputStartDateProps: Omit<DateInputProps, \"id\">\n inputEndDateProps: Omit<DateInputProps, \"id\">\n locale: Locale\n /*\n A description that provides context for the text field\n */\n description?: DateInputDescriptionProps[\"description\"]\n isReversed?: boolean\n validationMessage?: DateRangeValidationMessageProps[\"validationMessage\"]\n disabled?: boolean\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\nexport type DateRangeInputFieldRefs = {\n inputStartDateRef?: React.RefObject<HTMLInputElement>\n inputEndDateRef?: React.RefObject<HTMLInputElement>\n}\n\nexport const DateRangeInputField = React.forwardRef<\n DateRangeInputFieldRefs,\n DateRangeInputFieldProps\n>(\n (\n {\n id,\n legend,\n inputStartDateProps,\n inputEndDateProps,\n description,\n disabled,\n isReversed = false,\n validationMessage,\n locale,\n classNameOverride,\n ...restProps\n },\n ref\n ) => {\n const customRefObject = isRefObject(ref) ? ref.current : null\n const inputStartDateRef = customRefObject?.inputStartDateRef\n const inputEndDateRef = customRefObject?.inputEndDateRef\n\n const descriptionId = `${id}--field-message`\n\n // Date Start aria labels\n const dateStartErrorMessageId = validationMessage?.dateStart\n ? `${id}--date-start-error-message`\n : undefined\n\n const dateStartInputDescribedBy = dateStartErrorMessageId\n ? `${dateStartErrorMessageId} ${descriptionId}`\n : descriptionId\n\n const dateStartIsInvalid = dateStartErrorMessageId !== undefined\n\n // Date End aria labels\n const dateEndErrorMessageId = validationMessage?.dateEnd\n ? `${id}--date-end-error-message`\n : undefined\n\n const dateEndInputDescribedBy = dateEndErrorMessageId\n ? `${dateEndErrorMessageId} ${descriptionId}`\n : descriptionId\n\n const dateEndIsInvalid = dateEndErrorMessageId !== undefined\n\n return (\n <div className={classNameOverride} {...restProps}>\n <fieldset className={styles.dateRangeInputContainer}>\n <legend>\n <VisuallyHidden>{legend}</VisuallyHidden>\n </legend>\n <DateInput\n ref={inputStartDateRef}\n id={`${id}--from`}\n aria-describedby={dateStartInputDescribedBy}\n aria-errormessage={dateStartErrorMessageId}\n aria-invalid={dateStartIsInvalid}\n autoComplete=\"off\"\n disabled={disabled}\n status={validationMessage?.dateStart?.status}\n {...inputStartDateProps}\n classNameOverride={classnames(\n styles.inputStartDate,\n inputStartDateProps.classNameOverride\n )}\n />\n <DateInput\n ref={inputEndDateRef}\n id={`${id}--to`}\n aria-describedby={dateEndInputDescribedBy}\n aria-errormessage={dateEndErrorMessageId}\n aria-invalid={dateEndIsInvalid}\n autoComplete=\"off\"\n disabled={disabled}\n status={validationMessage?.dateEnd?.status}\n {...inputEndDateProps}\n classNameOverride={classnames(\n styles.inputEndDate,\n inputEndDateProps.classNameOverride\n )}\n />\n </fieldset>\n\n {validationMessage && (\n <DateRangeValidationMessage\n validationMessage={validationMessage}\n isReversed={isReversed}\n dateStartId={dateStartErrorMessageId}\n dateEndId={dateEndErrorMessageId}\n />\n )}\n\n <FieldMessage\n id={descriptionId}\n message={\n <DateInputDescription description={description} locale={locale} />\n }\n reversed={isReversed}\n classNameOverride={disabled ? styles.disabled : undefined}\n />\n </div>\n )\n }\n)\n\nDateRangeInputField.displayName = \"DateRangeInputField\"\n"],"names":["DateRangeInputField","React","forwardRef","_a","ref","id","legend","inputStartDateProps","inputEndDateProps","description","disabled","_d","isReversed","validationMessage","locale","classNameOverride","restProps","__rest","customRefObject","isRefObject","current","inputStartDateRef","inputEndDateRef","descriptionId","concat","dateStartErrorMessageId","dateStart","undefined","dateStartInputDescribedBy","dateStartIsInvalid","dateEndErrorMessageId","dateEnd","dateEndInputDescribedBy","dateEndIsInvalid","createElement","__assign","className","styles","dateRangeInputContainer","VisuallyHidden","DateInput","autoComplete","status","_b","classnames","inputStartDate","_c","inputEndDate","DateRangeValidationMessage","dateStartId","dateEndId","FieldMessage","message","DateInputDescription","reversed","displayName"],"mappings":";;;;;;;;;;;;MAwCaA,mBAAmB;EAAA,MAAnBA,mBAAmB,GAAGC,KAAK,CAACC,UAAU,CAIjD,UACEC,EAYC,EACDC,GAAG,EAAA;;IAZD,IAAAC,EAAE,GAAAF,EAAA,CAAAE,EAAA;MACFC,MAAM,GAAAH,EAAA,CAAAG,MAAA;MACNC,mBAAmB,GAAAJ,EAAA,CAAAI,mBAAA;MACnBC,iBAAiB,uBAAA;MACjBC,WAAW,GAAAN,EAAA,CAAAM,WAAA;MACXC,QAAQ,GAAAP,EAAA,CAAAO,QAAA;MACRC,EAAkB,GAAAR,EAAA,CAAAS,UAAA;MAAlBA,UAAU,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAK,GAAAA,EAAA;MAClBE,iBAAiB,GAAAV,EAAA,CAAAU,iBAAA;MACjBC,MAAM,GAAAX,EAAA,CAAAW,MAAA;MACNC,iBAAiB,GAAAZ,EAAA,CAAAY,iBAAA;MACdC,SAAS,GAAAC,KAAA,CAAAA,MAAA,CAAAd,EAAA,EAXd,yJAYC,CADa;IAId,IAAMe,eAAe,GAAGC,WAAAA,CAAAA,WAAW,CAACf,GAAG,CAAC,GAAGA,GAAG,CAACgB,OAAO,GAAG,IAAI;IAC7D,IAAMC,iBAAiB,GAAGH,eAAe,KAAA,IAAA,IAAfA,eAAe,KAAf,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,eAAe,CAAEG,iBAAiB;IAC5D,IAAMC,eAAe,GAAGJ,eAAe,KAAA,IAAA,IAAfA,eAAe,KAAf,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,eAAe,CAAEI,eAAe;IAExD,IAAMC,aAAa,GAAG,EAAG,CAAAC,MAAA,CAAAnB,EAAE,oBAAiB;;IAG5C,IAAMoB,uBAAuB,GAAG,CAAAZ,iBAAiB,aAAjBA,iBAAiB,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAjBA,iBAAiB,CAAEa,SAAS,IACxD,EAAG,CAAAF,MAAA,CAAAnB,EAAE,EAA4B,4BAAA,CAAA,GACjCsB,SAAS;IAEb,IAAMC,yBAAyB,GAAGH,uBAAuB,GACrD,EAAA,CAAAD,MAAA,CAAGC,uBAAuB,EAAA,GAAA,CAAA,CAAAD,MAAA,CAAID,aAAa,CAAE,GAC7CA,aAAa;IAEjB,IAAMM,kBAAkB,GAAGJ,uBAAuB,KAAKE,SAAS;;IAGhE,IAAMG,qBAAqB,GAAG,CAAAjB,iBAAiB,aAAjBA,iBAAiB,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAjBA,iBAAiB,CAAEkB,OAAO,IACpD,EAAG,CAAAP,MAAA,CAAAnB,EAAE,EAA0B,0BAAA,CAAA,GAC/BsB,SAAS;IAEb,IAAMK,uBAAuB,GAAGF,qBAAqB,GACjD,EAAA,CAAAN,MAAA,CAAGM,qBAAqB,EAAA,GAAA,CAAA,CAAAN,MAAA,CAAID,aAAa,CAAE,GAC3CA,aAAa;IAEjB,IAAMU,gBAAgB,GAAGH,qBAAqB,KAAKH,SAAS;IAE5D,OACE1B,KAAK,CAAAiC,aAAA,CAAA,KAAA,EAAAC,KAAAA,CAAAA,QAAA,CAAA;MAAAC,SAAS,EAAErB;OAAuBC,SAAS,CAAA,EAC9Cf,KAAA,CAAAiC,aAAA,CAAA,UAAA,EAAA;MAAUE,SAAS,EAAEC,0BAAM,CAACC;IAAuB,CAAA,EACjDrC,KAAA,CAAAiC,aAAA,CAAA,QAAA,EAAA,IAAA,EACEjC,KAAA,CAAAiC,aAAA,CAACK,~~IAAAA~~,CAAAA,cAAc,EAAA,IAAA,EAAEjC,MAAM,CAAkB,CAClC,EACTL,KAAC,CAAAiC,aAAA,CAAAM,mBAAS,EACRL,KAAAA,CAAAA,QAAA,CAAA;MAAA/B,GAAG,EAAEiB,iBAAiB;MACtBhB,EAAE,EAAE,EAAG,CAAAmB,MAAA,CAAAnB,EAAE,EAAQ,QAAA,CAAA;MAAA,kBAAA,EACCuB,yBAAyB;MACxB,mBAAA,EAAAH,uBAAuB;MAC5B,cAAA,EAAAI,kBAAkB;MAChCY,YAAY,EAAC,KAAK;MAClB/B,QAAQ,EAAEA,QAAQ;MAClBgC,MAAM,EAAE,CAAAC,EAAA,GAAA9B,iBAAiB,KAAA,IAAA,IAAjBA,iBAAiB,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAjBA,iBAAiB,CAAEa,SAAS,MAAE,IAAA,IAAAiB,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,EAAA,CAAAD;IAAM,CACxC,EAAAnC,mBAAmB;MACvBQ,iBAAiB,EAAE6B,UAAU,CAC3BP,0BAAM,CAACQ,cAAc,EACrBtC,mBAAmB,CAACQ,iBAAiB;IAEvC,CAAA,CAAA,CAAA,EACFd,KAAC,CAAAiC,aAAA,CAAAM,mBAAS,EACRL,KAAAA,CAAAA,QAAA,CAAA;MAAA/B,GAAG,EAAEkB,eAAe;MACpBjB,EAAE,EAAE,EAAG,CAAAmB,MAAA,CAAAnB,EAAE,EAAM,MAAA,CAAA;MAAA,kBAAA,EACG2B,uBAAuB;MACtB,mBAAA,EAAAF,qBAAqB;MAC1B,cAAA,EAAAG,gBAAgB;MAC9BQ,YAAY,EAAC,KAAK;MAClB/B,QAAQ,EAAEA,QAAQ;MAClBgC,MAAM,EAAE,CAAAI,EAAA,GAAAjC,iBAAiB,KAAjB,IAAA,IAAAA,iBAAiB,KAAjB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,iBAAiB,CAAEkB,OAAO,MAAA,IAAA,IAAAe,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,EAAA,CAAEJ;IAAM,CAAA,EACtClC,iBAAiB,EAAA;MACrBO,iBAAiB,EAAE6B,UAAU,CAC3BP,0BAAM,CAACU,YAAY,EACnBvC,iBAAiB,CAACO,iBAAiB;IACpC,CAAA,CAAA,CACD,CACO,EAEVF,iBAAiB,IAChBZ,KAAC,CAAAiC,aAAA,CAAAc,0BAAAA,CAAAA,0BAA0B;MACzBnC,iBAAiB,EAAEA,iBAAiB;MACpCD,UAAU,EAAEA,UAAU;MACtBqC,WAAW,EAAExB,uBAAuB;MACpCyB,SAAS,EAAEpB;IAAqB,CAAA,CAEnC,EAED7B,KAAA,CAAAiC,aAAA,CAACiB,sBAAY,EACX;MAAA9C,EAAE,EAAEkB,aAAa;MACjB6B,OAAO,EACLnD,KAAA,CAAAiC,aAAA,CAACmB,oBAAoB,CAAAA,oBAAA,EAAA;QAAC5C,WAAW,EAAEA,WAAW;QAAEK,MAAM,EAAEA;MAAU,CAAA,CAAA;MAEpEwC,QAAQ,EAAE1C,UAAU;MACpBG,iBAAiB,EAAEL,QAAQ,GAAG2B,0BAAM,CAAC3B,QAAQ,GAAGiB;IAAS,CACzD,CAAA,CACE;EAEV,CAAC,CACF;EAED3B,mBAAmB,CAACuD,WAAW,GAAG,qBAAqB;EAAA,OA5G1CvD,mBAAmB;AAAA;"}
1	+ {"version":3,"file":"DateRangeInputField.cjs","sources":["../../../../../src/FilterDateRangePicker/subcomponents/DateRangeInputField/DateRangeInputField.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport classnames from \"classnames\"\nimport {\n DateInput,\n DateInputProps,\n} from \"@kaizen/date-picker/src/_subcomponents/DateInput\"\nimport { FieldMessage } from \"@kaizen/draft-form\"\nimport { VisuallyHidden } from \"~components/VisuallyHidden\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { isRefObject } from \"~utils/isRefObject\"\nimport {\n DateInputDescription,\n DateInputDescriptionProps,\n} from \"../DateInputDescription\"\nimport {\n DateRangeValidationMessage,\n DateRangeValidationMessageProps,\n} from \"../DateRangeValidationMessage\"\nimport styles from \"./DateRangeInputField.module.scss\"\n\nexport type DateRangeInputFieldProps = {\n id: string\n legend: string\n inputStartDateProps: Omit<DateInputProps, \"id\">\n inputEndDateProps: Omit<DateInputProps, \"id\">\n locale: Locale\n /*\n A description that provides context for the text field\n */\n description?: DateInputDescriptionProps[\"description\"]\n isReversed?: boolean\n validationMessage?: DateRangeValidationMessageProps[\"validationMessage\"]\n disabled?: boolean\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\nexport type DateRangeInputFieldRefs = {\n inputStartDateRef?: React.RefObject<HTMLInputElement>\n inputEndDateRef?: React.RefObject<HTMLInputElement>\n}\n\nexport const DateRangeInputField = React.forwardRef<\n DateRangeInputFieldRefs,\n DateRangeInputFieldProps\n>(\n (\n {\n id,\n legend,\n inputStartDateProps,\n inputEndDateProps,\n description,\n disabled,\n isReversed = false,\n validationMessage,\n locale,\n classNameOverride,\n ...restProps\n },\n ref\n ) => {\n const customRefObject = isRefObject(ref) ? ref.current : null\n const inputStartDateRef = customRefObject?.inputStartDateRef\n const inputEndDateRef = customRefObject?.inputEndDateRef\n\n const descriptionId = `${id}--field-message`\n\n // Date Start aria labels\n const dateStartErrorMessageId = validationMessage?.dateStart\n ? `${id}--date-start-error-message`\n : undefined\n\n const dateStartInputDescribedBy = dateStartErrorMessageId\n ? `${dateStartErrorMessageId} ${descriptionId}`\n : descriptionId\n\n const dateStartIsInvalid = dateStartErrorMessageId !== undefined\n\n // Date End aria labels\n const dateEndErrorMessageId = validationMessage?.dateEnd\n ? `${id}--date-end-error-message`\n : undefined\n\n const dateEndInputDescribedBy = dateEndErrorMessageId\n ? `${dateEndErrorMessageId} ${descriptionId}`\n : descriptionId\n\n const dateEndIsInvalid = dateEndErrorMessageId !== undefined\n\n return (\n <div className={classNameOverride} {...restProps}>\n <fieldset className={styles.dateRangeInputContainer}>\n <legend>\n <VisuallyHidden>{legend}</VisuallyHidden>\n </legend>\n <DateInput\n ref={inputStartDateRef}\n id={`${id}--from`}\n aria-describedby={dateStartInputDescribedBy}\n aria-errormessage={dateStartErrorMessageId}\n aria-invalid={dateStartIsInvalid}\n autoComplete=\"off\"\n disabled={disabled}\n status={validationMessage?.dateStart?.status}\n {...inputStartDateProps}\n classNameOverride={classnames(\n styles.inputStartDate,\n inputStartDateProps.classNameOverride\n )}\n />\n <DateInput\n ref={inputEndDateRef}\n id={`${id}--to`}\n aria-describedby={dateEndInputDescribedBy}\n aria-errormessage={dateEndErrorMessageId}\n aria-invalid={dateEndIsInvalid}\n autoComplete=\"off\"\n disabled={disabled}\n status={validationMessage?.dateEnd?.status}\n {...inputEndDateProps}\n classNameOverride={classnames(\n styles.inputEndDate,\n inputEndDateProps.classNameOverride\n )}\n />\n </fieldset>\n\n {validationMessage && (\n <DateRangeValidationMessage\n validationMessage={validationMessage}\n isReversed={isReversed}\n dateStartId={dateStartErrorMessageId}\n dateEndId={dateEndErrorMessageId}\n />\n )}\n\n <FieldMessage\n id={descriptionId}\n message={\n <DateInputDescription description={description} locale={locale} />\n }\n reversed={isReversed}\n classNameOverride={disabled ? styles.disabled : undefined}\n />\n </div>\n )\n }\n)\n\nDateRangeInputField.displayName = \"DateRangeInputField\"\n"],"names":["DateRangeInputField","React","forwardRef","_a","ref","id","legend","inputStartDateProps","inputEndDateProps","description","disabled","_d","isReversed","validationMessage","locale","classNameOverride","restProps","__rest","customRefObject","isRefObject","current","inputStartDateRef","inputEndDateRef","descriptionId","concat","dateStartErrorMessageId","dateStart","undefined","dateStartInputDescribedBy","dateStartIsInvalid","dateEndErrorMessageId","dateEnd","dateEndInputDescribedBy","dateEndIsInvalid","createElement","__assign","className","styles","dateRangeInputContainer","VisuallyHidden","DateInput","autoComplete","status","_b","classnames","inputStartDate","_c","inputEndDate","DateRangeValidationMessage","dateStartId","dateEndId","FieldMessage","message","DateInputDescription","reversed","displayName"],"mappings":";;;;;;;;;;;;MAwCaA,mBAAmB;EAAA,MAAnBA,mBAAmB,GAAGC,KAAK,CAACC,UAAU,CAIjD,UACEC,EAYC,EACDC,GAAG,EAAA;;IAZD,IAAAC,EAAE,GAAAF,EAAA,CAAAE,EAAA;MACFC,MAAM,GAAAH,EAAA,CAAAG,MAAA;MACNC,mBAAmB,GAAAJ,EAAA,CAAAI,mBAAA;MACnBC,iBAAiB,uBAAA;MACjBC,WAAW,GAAAN,EAAA,CAAAM,WAAA;MACXC,QAAQ,GAAAP,EAAA,CAAAO,QAAA;MACRC,EAAkB,GAAAR,EAAA,CAAAS,UAAA;MAAlBA,UAAU,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAK,GAAAA,EAAA;MAClBE,iBAAiB,GAAAV,EAAA,CAAAU,iBAAA;MACjBC,MAAM,GAAAX,EAAA,CAAAW,MAAA;MACNC,iBAAiB,GAAAZ,EAAA,CAAAY,iBAAA;MACdC,SAAS,GAAAC,KAAA,CAAAA,MAAA,CAAAd,EAAA,EAXd,yJAYC,CADa;IAId,IAAMe,eAAe,GAAGC,WAAAA,CAAAA,WAAW,CAACf,GAAG,CAAC,GAAGA,GAAG,CAACgB,OAAO,GAAG,IAAI;IAC7D,IAAMC,iBAAiB,GAAGH,eAAe,KAAA,IAAA,IAAfA,eAAe,KAAf,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,eAAe,CAAEG,iBAAiB;IAC5D,IAAMC,eAAe,GAAGJ,eAAe,KAAA,IAAA,IAAfA,eAAe,KAAf,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,eAAe,CAAEI,eAAe;IAExD,IAAMC,aAAa,GAAG,EAAG,CAAAC,MAAA,CAAAnB,EAAE,oBAAiB;;IAG5C,IAAMoB,uBAAuB,GAAG,CAAAZ,iBAAiB,aAAjBA,iBAAiB,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAjBA,iBAAiB,CAAEa,SAAS,IACxD,EAAG,CAAAF,MAAA,CAAAnB,EAAE,EAA4B,4BAAA,CAAA,GACjCsB,SAAS;IAEb,IAAMC,yBAAyB,GAAGH,uBAAuB,GACrD,EAAA,CAAAD,MAAA,CAAGC,uBAAuB,EAAA,GAAA,CAAA,CAAAD,MAAA,CAAID,aAAa,CAAE,GAC7CA,aAAa;IAEjB,IAAMM,kBAAkB,GAAGJ,uBAAuB,KAAKE,SAAS;;IAGhE,IAAMG,qBAAqB,GAAG,CAAAjB,iBAAiB,aAAjBA,iBAAiB,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAjBA,iBAAiB,CAAEkB,OAAO,IACpD,EAAG,CAAAP,MAAA,CAAAnB,EAAE,EAA0B,0BAAA,CAAA,GAC/BsB,SAAS;IAEb,IAAMK,uBAAuB,GAAGF,qBAAqB,GACjD,EAAA,CAAAN,MAAA,CAAGM,qBAAqB,EAAA,GAAA,CAAA,CAAAN,MAAA,CAAID,aAAa,CAAE,GAC3CA,aAAa;IAEjB,IAAMU,gBAAgB,GAAGH,qBAAqB,KAAKH,SAAS;IAE5D,OACE1B,KAAK,CAAAiC,aAAA,CAAA,KAAA,EAAAC,KAAAA,CAAAA,QAAA,CAAA;MAAAC,SAAS,EAAErB;OAAuBC,SAAS,CAAA,EAC9Cf,KAAA,CAAAiC,aAAA,CAAA,UAAA,EAAA;MAAUE,SAAS,EAAEC,0BAAM,CAACC;IAAuB,CAAA,EACjDrC,KAAA,CAAAiC,aAAA,CAAA,QAAA,EAAA,IAAA,EACEjC,KAAA,CAAAiC,aAAA,CAACK,cAAAA,CAAAA,cAAc,EAAA,IAAA,EAAEjC,MAAM,CAAkB,CAClC,EACTL,KAAC,CAAAiC,aAAA,CAAAM,mBAAS,EACRL,KAAAA,CAAAA,QAAA,CAAA;MAAA/B,GAAG,EAAEiB,iBAAiB;MACtBhB,EAAE,EAAE,EAAG,CAAAmB,MAAA,CAAAnB,EAAE,EAAQ,QAAA,CAAA;MAAA,kBAAA,EACCuB,yBAAyB;MACxB,mBAAA,EAAAH,uBAAuB;MAC5B,cAAA,EAAAI,kBAAkB;MAChCY,YAAY,EAAC,KAAK;MAClB/B,QAAQ,EAAEA,QAAQ;MAClBgC,MAAM,EAAE,CAAAC,EAAA,GAAA9B,iBAAiB,KAAA,IAAA,IAAjBA,iBAAiB,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAjBA,iBAAiB,CAAEa,SAAS,MAAE,IAAA,IAAAiB,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,EAAA,CAAAD;IAAM,CACxC,EAAAnC,mBAAmB;MACvBQ,iBAAiB,EAAE6B,UAAU,CAC3BP,0BAAM,CAACQ,cAAc,EACrBtC,mBAAmB,CAACQ,iBAAiB;IAEvC,CAAA,CAAA,CAAA,EACFd,KAAC,CAAAiC,aAAA,CAAAM,mBAAS,EACRL,KAAAA,CAAAA,QAAA,CAAA;MAAA/B,GAAG,EAAEkB,eAAe;MACpBjB,EAAE,EAAE,EAAG,CAAAmB,MAAA,CAAAnB,EAAE,EAAM,MAAA,CAAA;MAAA,kBAAA,EACG2B,uBAAuB;MACtB,mBAAA,EAAAF,qBAAqB;MAC1B,cAAA,EAAAG,gBAAgB;MAC9BQ,YAAY,EAAC,KAAK;MAClB/B,QAAQ,EAAEA,QAAQ;MAClBgC,MAAM,EAAE,CAAAI,EAAA,GAAAjC,iBAAiB,KAAjB,IAAA,IAAAA,iBAAiB,KAAjB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,iBAAiB,CAAEkB,OAAO,MAAA,IAAA,IAAAe,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,EAAA,CAAEJ;IAAM,CAAA,EACtClC,iBAAiB,EAAA;MACrBO,iBAAiB,EAAE6B,UAAU,CAC3BP,0BAAM,CAACU,YAAY,EACnBvC,iBAAiB,CAACO,iBAAiB;IACpC,CAAA,CAAA,CACD,CACO,EAEVF,iBAAiB,IAChBZ,KAAC,CAAAiC,aAAA,CAAAc,0BAAAA,CAAAA,0BAA0B;MACzBnC,iBAAiB,EAAEA,iBAAiB;MACpCD,UAAU,EAAEA,UAAU;MACtBqC,WAAW,EAAExB,uBAAuB;MACpCyB,SAAS,EAAEpB;IAAqB,CAAA,CAEnC,EAED7B,KAAA,CAAAiC,aAAA,CAACiB,sBAAY,EACX;MAAA9C,EAAE,EAAEkB,aAAa;MACjB6B,OAAO,EACLnD,KAAA,CAAAiC,aAAA,CAACmB,oBAAoB,CAAAA,oBAAA,EAAA;QAAC5C,WAAW,EAAEA,WAAW;QAAEK,MAAM,EAAEA;MAAU,CAAA,CAAA;MAEpEwC,QAAQ,EAAE1C,UAAU;MACpBG,iBAAiB,EAAEL,QAAQ,GAAG2B,0BAAM,CAAC3B,QAAQ,GAAGiB;IAAS,CACzD,CAAA,CACE;EAEV,CAAC,CACF;EAED3B,mBAAmB,CAACuD,WAAW,GAAG,qBAAqB;EAAA,OA5G1CvD,mBAAmB;AAAA;"}

package/dist/cjs/FilterMultiSelect/context/SelectionProvider/SelectionProvider.cjs CHANGED Viewed

@@ -5,7 +5,7 @@ var React = require('react');
 var listbox = require('@react-aria/listbox');
 var collections = require('@react-stately/collections');
 var list = require('@react-stately/list');
-var a11y = require('@kaizen/a11y');
+var VisuallyHidden = require('../../../VisuallyHidden/VisuallyHidden.cjs');
 var MenuTriggerProvider = require('../MenuTriggerProvider/MenuTriggerProvider.cjs');
 var SelectionContext = React.createContext({});
 var SelectionProvider = function (props) {
@@ -55,7 +55,7 @@ var SelectionProvider = function (props) {
       setSearchQuery: setSearchQuery,
       searchQuery: searchQuery
     }
-  }, React.createElement(a11y.VisuallyHidden, tslib.__assign({}, labelProps), otherProps.label), otherProps.children);
+  }, React.createElement(VisuallyHidden.VisuallyHidden, tslib.__assign({}, labelProps), otherProps.label), otherProps.children);
 };
 var useSelectionContext = function () {
   return React.useContext(SelectionContext);

package/dist/cjs/FilterMultiSelect/context/SelectionProvider/SelectionProvider.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SelectionProvider.cjs","sources":["../../../../../src/FilterMultiSelect/context/SelectionProvider/SelectionProvider.tsx"],"sourcesContent":["import React, { HTMLAttributes, useCallback, useContext, useState } from \"react\"\nimport { useListBox } from \"@react-aria/listbox\"\nimport { Item } from \"@react-stately/collections\"\nimport { ListState, useListState } from \"@react-stately/list\"\nimport { SelectionMode, Selection } from \"@react-types/shared\"\nimport { VisuallyHidden } from \"~~@kaizen~~/~~a11y~~\"\nimport { ItemType, MultiSelectItem } from \"../../types\"\nimport { useMenuTriggerContext } from \"../MenuTriggerProvider\"\n\nexport type SelectionProviderProps = {\n selectionMode: SelectionMode\n children: React.ReactNode // control how menu should look like\n items?: ItemType[]\n onSelectionChange?: (keys: Selection) => void\n /** The currently selected keys in the collection (controlled). /\n selectedKeys?: Selection\n /* The initial selected keys in the collection (uncontrolled). /\n defaultSelectedKeys?: Selection\n label: string\n disabledKeys?: Selection\n onSearchInputChange?: (searchInput: string) => void\n}\n\nexport type SelectionProviderContextType = {\n listBoxProps: HTMLAttributes<HTMLElement>\n labelProps: HTMLAttributes<HTMLElement>\n selectionState: ListState<ItemType>\n listRef: React.RefObject<HTMLUListElement>\n searchQuery?: string\n setSearchQuery: React.Dispatch<React.SetStateAction<string>>\n}\n\nconst SelectionContext = React.createContext<SelectionProviderContextType>(\n {} as SelectionProviderContextType\n)\n\nexport const SelectionProvider = (\n props: SelectionProviderProps\n): JSX.Element => {\n const { onSearchInputChange, ...otherProps } = props\n const [searchQuery, setSearchQuery] = useState<string>(\"\")\n const { menuProps } = useMenuTriggerContext()\n /\n While the onSearchInputChange is a side-effect, this useEffect should be fine.\n * If the search input state becomes controlled, this useEffect could cause synchronisation\n * issues and should be replaced.\n */\n\n React.useEffect(() => {\n if (onSearchInputChange) {\n onSearchInputChange(searchQuery)\n }\n }, [searchQuery, onSearchInputChange])\n\n const searchFilter = useCallback(\n (nodes: Iterable<MultiSelectItem>): Iterable<MultiSelectItem> =>\n searchQuery\n ? Array.from(nodes).filter(f =>\n f.textValue.toLowerCase().includes(searchQuery.toLowerCase())\n )\n : nodes,\n [searchQuery]\n )\n\n // Create state based on the incoming props to manage the selection\n const state = useListState({\n ...otherProps,\n children: item => <Item key={item.value}>{item.label}</Item>, // For initialising selection and determined item.renderer, can be only Item or Section\n filter: onSearchInputChange ? undefined : searchFilter, // If the user has passed an `onSearchInputChange` we opt them out of the default filtering\n })\n\n // Get A11y attributes and events for the listbox\n const ref = React.createRef<HTMLUListElement>()\n const { listBoxProps, labelProps } = useListBox(\n {\n ...menuProps,\n ...otherProps,\n disallowEmptySelection: true, // stop escape key from clearing selection\n },\n state,\n ref\n )\n\n return (\n <SelectionContext.Provider\n value={{\n listBoxProps,\n labelProps,\n selectionState: state,\n listRef: ref,\n setSearchQuery,\n searchQuery,\n }}\n >\n <VisuallyHidden {...labelProps}>{otherProps.label}</VisuallyHidden>\n {otherProps.children}\n </SelectionContext.Provider>\n )\n}\n\nexport const useSelectionContext = (): SelectionProviderContextType =>\n useContext(SelectionContext)\n\nexport const SelectionConsumer = ({\n children,\n}: React.ConsumerProps<SelectionProviderContextType>): JSX.Element => (\n <SelectionContext.Consumer>{children}</SelectionContext.Consumer>\n)\n"],"names":["SelectionContext","React","createContext","SelectionProvider","props","onSearchInputChange","otherProps","__rest","_a","useState","searchQuery","setSearchQuery","menuProps","useMenuTriggerContext","useEffect","searchFilter","useCallback","nodes","Array","from","filter","f","textValue","toLowerCase","includes","state","useListState","children","item","createElement","Item","key","value","label","undefined","ref","createRef","_b","useListBox","__assign","disallowEmptySelection","listBoxProps","labelProps","Provider","selectionState","listRef","VisuallyHidden","useSelectionContext","useContext","SelectionConsumer","Consumer"],"mappings":";;;;;;;;;AAgCA,IAAMA,gBAAgB,GAAGC,KAAK,CAACC,aAAa,CAC1C,CAAA,CAAkC,CACnC;AAEM,IAAMC,iBAAiB,GAAG,SAAAA,CAC/BC,KAA6B,EAAA;EAErB,IAAAC,mBAAmB,GAAoBD,KAAK,CAAzBC,mBAAA;IAAKC,UAAU,GAAAC,KAAAA,CAAAA,MAAA,CAAKH,KAAK,EAA9C,CAAsC,qBAAA,CAAA,CAAF;EACpC,IAAAI,EAAA,GAAgCC,KAAAA,CAAAA,QAAQ,CAAS,EAAE,CAAC;IAAnDC,WAAW,GAAAF,EAAA,CAAA,CAAA,CAAA;IAAEG,cAAc,GAAAH,EAAA,CAAA,CAAA,CAAwB;EAClD,IAAAI,SAAS,GAAKC,yCAAqB,CAAE,CAAA,UAA5B;EACjB;;;;AAIG;EAEHZ,KAAK,CAACa,SAAS,CAAC,YAAA;IACd,IAAIT,mBAAmB,EAAE;MACvBA,mBAAmB,CAACK,WAAW,CAAC;IACjC;EACH,CAAC,EAAE,CAACA,WAAW,EAAEL,mBAAmB,CAAC,CAAC;EAEtC,IAAMU,YAAY,GAAGC,iBAAW,CAC9B,UAACC,KAAgC,EAAA;IAC/B,OAAAP,WAAW,GACPQ,KAAK,CAACC,IAAI,CAACF,KAAK,CAAC,CAACG,MAAM,CAAC,UAAAC,CAAC,EAAA;MACxB,OAAAA,CAAC,CAACC,SAAS,CAACC,WAAW,CAAA,CAAE,CAACC,QAAQ,CAACd,WAAW,CAACa,WAAW,CAAA,CAAE,CAAC;IAA7D,CAA6D,CAC9D,GACDN,KAAK;EAJT,CAIS,EACX,CAACP,WAAW,CAAC,CACd;;EAGD,IAAMe,KAAK,GAAGC,IAAY,CAAAA,YAAA,mCACrBpB,UAAU,CAAA,EAAA;IACbqB,QAAQ,EAAE,SAAAA,CAAAC,IAAI,EAAA;MAAI,OAAA3B,KAAC,CAAA4B,aAAA,CAAAC,gBAAI;QAACC,GAAG,EAAEH,IAAI,CAACI;MAAQ,CAAA,EAAAJ,IAAI,CAACK,KAAK,CAAQ;IAAA,CAAA;IAC5Db,MAAM,EAAEf,mBAAmB,GAAG6B,SAAS,GAAGnB;EAAY,GACtD;;EAGF,IAAMoB,GAAG,GAAGlC,KAAK,CAACmC,SAAS,EAAoB;EACzC,IAAAC,EAAA,GAA+BC,kBAAU,CAExCC,KAAAA,CAAAA,QAAA,CAAAA,KAAA,CAAAA,QAAA,CAAAA,cAAA,CAAA,CAAA,CAAA,EAAA3B,SAAS,GACTN,UAAU,CAAA,EAAA;MACbkC,sBAAsB,EAAE;QAE1Bf,KAAK,EACLU,GAAG,CACJ;IAROM,YAAY,GAAAJ,EAAA,CAAAI,YAAA;IAAEC,UAAU,GAAAL,EAAA,CAAAK,UAQ/B;EAED,OACEzC,KAAC,CAAA4B,aAAA,CAAA7B,gBAAgB,CAAC2C,QAAQ,EAAA;IACxBX,KAAK,EAAE;MACLS,YAAY,EAAAA,YAAA;MACZC,UAAU,EAAAA,UAAA;MACVE,cAAc,EAAEnB,KAAK;MACrBoB,OAAO,EAAEV,GAAG;MACZxB,cAAc,EAAAA,cAAA;MACdD,WAAW,EAAAA;IACZ;EAAA,CAAA,EAEDT,KAAA,CAAA4B,aAAA,CAACiB,~~IAAAA~~,CAAAA,cAAc,EAAKP,KAAA,CAAAA,QAAA,CAAA,CAAA,CAAA,EAAAG,UAAU,GAAGpC,UAAU,CAAC2B,KAAK,CAAkB,EAClE3B,UAAU,CAACqB,QAAQ,CACM;AAEhC,CAAC;AAEY,IAAAoB,mBAAmB,GAAG,SAAAA,CAAA,EAAA;EACjC,OAAAC,KAAAA,CAAAA,UAAU,CAAChD,gBAAgB,CAAC;AAA5B,CAA4B;AAEvB,IAAMiD,iBAAiB,GAAG,SAAAA,CAACzC,EAEkB,EAAA;EADlD,IAAAmB,QAAQ,GAAAnB,EAAA,CAAAmB,QAAA;EAC4D,OACpE1B,oBAACD,gBAAgB,CAACkD,QAAQ,EAAE,IAAA,EAAAvB,QAAQ,CAA6B;AADG,CAAA;;;"}
1	+ {"version":3,"file":"SelectionProvider.cjs","sources":["../../../../../src/FilterMultiSelect/context/SelectionProvider/SelectionProvider.tsx"],"sourcesContent":["import React, { HTMLAttributes, useCallback, useContext, useState } from \"react\"\nimport { useListBox } from \"@react-aria/listbox\"\nimport { Item } from \"@react-stately/collections\"\nimport { ListState, useListState } from \"@react-stately/list\"\nimport { SelectionMode, Selection } from \"@react-types/shared\"\nimport { VisuallyHidden } from \"~components/VisuallyHidden\"\nimport { ItemType, MultiSelectItem } from \"../../types\"\nimport { useMenuTriggerContext } from \"../MenuTriggerProvider\"\n\nexport type SelectionProviderProps = {\n selectionMode: SelectionMode\n children: React.ReactNode // control how menu should look like\n items?: ItemType[]\n onSelectionChange?: (keys: Selection) => void\n /** The currently selected keys in the collection (controlled). /\n selectedKeys?: Selection\n /* The initial selected keys in the collection (uncontrolled). /\n defaultSelectedKeys?: Selection\n label: string\n disabledKeys?: Selection\n onSearchInputChange?: (searchInput: string) => void\n}\n\nexport type SelectionProviderContextType = {\n listBoxProps: HTMLAttributes<HTMLElement>\n labelProps: HTMLAttributes<HTMLElement>\n selectionState: ListState<ItemType>\n listRef: React.RefObject<HTMLUListElement>\n searchQuery?: string\n setSearchQuery: React.Dispatch<React.SetStateAction<string>>\n}\n\nconst SelectionContext = React.createContext<SelectionProviderContextType>(\n {} as SelectionProviderContextType\n)\n\nexport const SelectionProvider = (\n props: SelectionProviderProps\n): JSX.Element => {\n const { onSearchInputChange, ...otherProps } = props\n const [searchQuery, setSearchQuery] = useState<string>(\"\")\n const { menuProps } = useMenuTriggerContext()\n /\n While the onSearchInputChange is a side-effect, this useEffect should be fine.\n * If the search input state becomes controlled, this useEffect could cause synchronisation\n * issues and should be replaced.\n */\n\n React.useEffect(() => {\n if (onSearchInputChange) {\n onSearchInputChange(searchQuery)\n }\n }, [searchQuery, onSearchInputChange])\n\n const searchFilter = useCallback(\n (nodes: Iterable<MultiSelectItem>): Iterable<MultiSelectItem> =>\n searchQuery\n ? Array.from(nodes).filter(f =>\n f.textValue.toLowerCase().includes(searchQuery.toLowerCase())\n )\n : nodes,\n [searchQuery]\n )\n\n // Create state based on the incoming props to manage the selection\n const state = useListState({\n ...otherProps,\n children: item => <Item key={item.value}>{item.label}</Item>, // For initialising selection and determined item.renderer, can be only Item or Section\n filter: onSearchInputChange ? undefined : searchFilter, // If the user has passed an `onSearchInputChange` we opt them out of the default filtering\n })\n\n // Get A11y attributes and events for the listbox\n const ref = React.createRef<HTMLUListElement>()\n const { listBoxProps, labelProps } = useListBox(\n {\n ...menuProps,\n ...otherProps,\n disallowEmptySelection: true, // stop escape key from clearing selection\n },\n state,\n ref\n )\n\n return (\n <SelectionContext.Provider\n value={{\n listBoxProps,\n labelProps,\n selectionState: state,\n listRef: ref,\n setSearchQuery,\n searchQuery,\n }}\n >\n <VisuallyHidden {...labelProps}>{otherProps.label}</VisuallyHidden>\n {otherProps.children}\n </SelectionContext.Provider>\n )\n}\n\nexport const useSelectionContext = (): SelectionProviderContextType =>\n useContext(SelectionContext)\n\nexport const SelectionConsumer = ({\n children,\n}: React.ConsumerProps<SelectionProviderContextType>): JSX.Element => (\n <SelectionContext.Consumer>{children}</SelectionContext.Consumer>\n)\n"],"names":["SelectionContext","React","createContext","SelectionProvider","props","onSearchInputChange","otherProps","__rest","_a","useState","searchQuery","setSearchQuery","menuProps","useMenuTriggerContext","useEffect","searchFilter","useCallback","nodes","Array","from","filter","f","textValue","toLowerCase","includes","state","useListState","children","item","createElement","Item","key","value","label","undefined","ref","createRef","_b","useListBox","__assign","disallowEmptySelection","listBoxProps","labelProps","Provider","selectionState","listRef","VisuallyHidden","useSelectionContext","useContext","SelectionConsumer","Consumer"],"mappings":"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"}

package/dist/cjs/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.cjs CHANGED Viewed

@@ -3,7 +3,7 @@
 var tslib = require('tslib');
 var React = require('react');
 var uuid = require('uuid');
-var a11y = require('@kaizen/a11y');
+var VisuallyHidden = require('../../../VisuallyHidden/VisuallyHidden.cjs');
 var ListBoxSection_module = require('./ListBoxSection.module.scss.cjs');
 const ListBoxSection = /*#__PURE__*/function () {
   const ListBoxSection = function (_a) {
@@ -24,7 +24,7 @@ const ListBoxSection = /*#__PURE__*/function () {
       className: ListBoxSection_module.listBoxSectionHeader,
       id: listSectionId,
       role: "presentation"
-    }, sectionName && React.createElement(a11y.VisuallyHidden, null, sectionName, ". "), restProps.sectionHeader), Array.from(items).map(function (node) {
+    }, sectionName && React.createElement(VisuallyHidden.VisuallyHidden, null, sectionName, ". "), restProps.sectionHeader), Array.from(items).map(function (node) {
       return node != undefined && children(node);
     })));
   };

package/dist/cjs/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListBoxSection.cjs","sources":["../../../../../src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.tsx"],"sourcesContent":["import React, { ReactNode, useState } from \"react\"\nimport { v4 } from \"uuid\"\nimport { VisuallyHidden } from \"~~@kaizen~~/~~a11y~~\"\nimport { MultiSelectItem } from \"../../types\"\nimport styles from \"./ListBoxSection.module.scss\"\n\ntype SectionNameProps = {\n /*\n Becomes an aria-label on the section, informing\n * unsighted users\n /\n sectionName: string\n}\n\ntype SectionHeaderProps = {\n /\n Becomes an aria-label on the section, informing\n * unsighted users\n /\n sectionName?: string\n /\n Can be used for a visual title of the ListBoxSection or to provide addition information in a React node.\n * If this is the same title as sectionName, you should only pass in a sectionHeader to avoid duplicate descriptions.\n /\n sectionHeader: ReactNode\n}\n\nexport type ListBoxSectionProps = {\n items: MultiSelectItem[]\n children: (item: MultiSelectItem) => React.ReactNode\n} & (SectionHeaderProps \| SectionNameProps)\n\nexport const ListBoxSection = ({\n items,\n children,\n sectionName,\n ...restProps\n}: ListBoxSectionProps): JSX.Element => {\n const [listSectionId] = useState<string>(v4())\n const hasSectionHeader = \"sectionHeader\" in restProps\n return (\n <li role=\"presentation\">\n <ul\n className={styles.listBoxSection}\n aria-label={!hasSectionHeader ? sectionName : undefined}\n aria-labelledby={hasSectionHeader ? listSectionId : undefined}\n role=\"group\"\n >\n {hasSectionHeader && (\n <li\n className={styles.listBoxSectionHeader}\n id={listSectionId}\n role=\"presentation\"\n >\n {sectionName && <VisuallyHidden>{sectionName}. </VisuallyHidden>}\n {restProps.sectionHeader}\n </li>\n )}\n {/\n * This seems semantically strange but most closely aligns to WCAGs suggested pattern:\n https://www.w3.org/WAI/ARIA/apg/patterns/listbox/examples/listbox-grouped/\n * the role=\"presentation\" will throw an error a11y warning \"Element has children which are not allowed\".\n This is expected and is an accepted issue / potential limitation with axe\n */}\n {Array.from(items).map(node => node != undefined && children(node))}\n </ul>\n </li>\n )\n}\nListBoxSection.displayName = \"ListBoxSection\"\n"],"names":["ListBoxSection","_a","items","children","sectionName","restProps","__rest","listSectionId","useState","v4","hasSectionHeader","React","createElement","role","className","styles","listBoxSection","undefined","listBoxSectionHeader","id","VisuallyHidden","sectionHeader","Array","from","map","node","displayName"],"mappings":";;;;;;;MAgCaA,cAAc;EAAA,MAAdA,cAAc,GAAG,SAAAA,CAACC,EAKT,EAAA;IAJpB,IAAAC,KAAK,GAAAD,EAAA,CAAAC,KAAA;MACLC,QAAQ,GAAAF,EAAA,CAAAE,QAAA;MACRC,WAAW,GAAAH,EAAA,CAAAG,WAAA;MACRC,SAAS,GAJiBC,KAAAA,CAAAA,MAAA,CAAAL,EAAA,EAAA,CAAA,OAAA,EAAA,UAAA,EAAA,aAAA,CAK9B,CADa;IAEL,IAAAM,aAAa,GAAIC,KAAQ,CAAAA,QAAA,CAASC,IAAE,CAAAA,EAAA,CAAA,CAAE,CAAC,GAA1B;IACpB,IAAMC,gBAAgB,IAAG,eAAe,IAAIL,SAAS;IACrD,OACEM,KAAA,CAAAC,aAAA,CAAA,IAAA,EAAA;MAAIC,IAAI,EAAC;IAAc,CAAA,EACrBF,KAAA,CAAAC,aAAA,CAAA,IAAA,EAAA;MACEE,SAAS,EAAEC,qBAAM,CAACC,cAAc;MAAA,YAAA,EACpB,CAACN,gBAAgB,GAAGN,WAAW,GAAGa,SAAS;MACtC,iBAAA,EAAAP,gBAAgB,GAAGH,aAAa,GAAGU,SAAS;MAC7DJ,IAAI,EAAC;IAAO,CAAA,EAEXH,gBAAgB,IACfC,KACE,CAAAC,aAAA,CAAA,IAAA,EAAA;MAAAE,SAAS,EAAEC,qBAAM,CAACG,oBAAoB;MACtCC,EAAE,EAAEZ,aAAa;MACjBM,IAAI,EAAC;IAAc,CAAA,EAElBT,WAAW,IAAIO,oBAACS,~~IAAAA~~,CAAAA,cAAc,EAAA,IAAA,EAAEhB,WAAW,EAAoB,IAAA,CAAA,EAC/DC,SAAS,CAACgB,aAAa,CAE3B,EAOAC,KAAK,CAACC,IAAI,CAACrB,KAAK,CAAC,CAACsB,GAAG,CAAC,UAAAC,IAAI,EAAA;MAAI,OAAAA,IAAI,IAAIR,SAAS,IAAId,QAAQ,CAACsB,IAAI,CAAC;IAAA,CAAA,CAAC,CAChE,CACF;EAET,CAAC;EACDzB,cAAc,CAAC0B,WAAW,GAAG,gBAAgB;EAAA,OArChC1B,cAAc;AAAA;"}
1	+ {"version":3,"file":"ListBoxSection.cjs","sources":["../../../../../src/FilterMultiSelect/subcomponents/ListBoxSection/ListBoxSection.tsx"],"sourcesContent":["import React, { ReactNode, useState } from \"react\"\nimport { v4 } from \"uuid\"\nimport { VisuallyHidden } from \"~components/VisuallyHidden\"\nimport { MultiSelectItem } from \"../../types\"\nimport styles from \"./ListBoxSection.module.scss\"\n\ntype SectionNameProps = {\n /*\n Becomes an aria-label on the section, informing\n * unsighted users\n /\n sectionName: string\n}\n\ntype SectionHeaderProps = {\n /\n Becomes an aria-label on the section, informing\n * unsighted users\n /\n sectionName?: string\n /\n Can be used for a visual title of the ListBoxSection or to provide addition information in a React node.\n * If this is the same title as sectionName, you should only pass in a sectionHeader to avoid duplicate descriptions.\n /\n sectionHeader: ReactNode\n}\n\nexport type ListBoxSectionProps = {\n items: MultiSelectItem[]\n children: (item: MultiSelectItem) => React.ReactNode\n} & (SectionHeaderProps \| SectionNameProps)\n\nexport const ListBoxSection = ({\n items,\n children,\n sectionName,\n ...restProps\n}: ListBoxSectionProps): JSX.Element => {\n const [listSectionId] = useState<string>(v4())\n const hasSectionHeader = \"sectionHeader\" in restProps\n return (\n <li role=\"presentation\">\n <ul\n className={styles.listBoxSection}\n aria-label={!hasSectionHeader ? sectionName : undefined}\n aria-labelledby={hasSectionHeader ? listSectionId : undefined}\n role=\"group\"\n >\n {hasSectionHeader && (\n <li\n className={styles.listBoxSectionHeader}\n id={listSectionId}\n role=\"presentation\"\n >\n {sectionName && <VisuallyHidden>{sectionName}. </VisuallyHidden>}\n {restProps.sectionHeader}\n </li>\n )}\n {/\n * This seems semantically strange but most closely aligns to WCAGs suggested pattern:\n https://www.w3.org/WAI/ARIA/apg/patterns/listbox/examples/listbox-grouped/\n * the role=\"presentation\" will throw an error a11y warning \"Element has children which are not allowed\".\n This is expected and is an accepted issue / potential limitation with axe\n */}\n {Array.from(items).map(node => node != undefined && children(node))}\n </ul>\n </li>\n )\n}\nListBoxSection.displayName = \"ListBoxSection\"\n"],"names":["ListBoxSection","_a","items","children","sectionName","restProps","__rest","listSectionId","useState","v4","hasSectionHeader","React","createElement","role","className","styles","listBoxSection","undefined","listBoxSectionHeader","id","VisuallyHidden","sectionHeader","Array","from","map","node","displayName"],"mappings":";;;;;;;MAgCaA,cAAc;EAAA,MAAdA,cAAc,GAAG,SAAAA,CAACC,EAKT,EAAA;IAJpB,IAAAC,KAAK,GAAAD,EAAA,CAAAC,KAAA;MACLC,QAAQ,GAAAF,EAAA,CAAAE,QAAA;MACRC,WAAW,GAAAH,EAAA,CAAAG,WAAA;MACRC,SAAS,GAJiBC,KAAAA,CAAAA,MAAA,CAAAL,EAAA,EAAA,CAAA,OAAA,EAAA,UAAA,EAAA,aAAA,CAK9B,CADa;IAEL,IAAAM,aAAa,GAAIC,KAAQ,CAAAA,QAAA,CAASC,IAAE,CAAAA,EAAA,CAAA,CAAE,CAAC,GAA1B;IACpB,IAAMC,gBAAgB,IAAG,eAAe,IAAIL,SAAS;IACrD,OACEM,KAAA,CAAAC,aAAA,CAAA,IAAA,EAAA;MAAIC,IAAI,EAAC;IAAc,CAAA,EACrBF,KAAA,CAAAC,aAAA,CAAA,IAAA,EAAA;MACEE,SAAS,EAAEC,qBAAM,CAACC,cAAc;MAAA,YAAA,EACpB,CAACN,gBAAgB,GAAGN,WAAW,GAAGa,SAAS;MACtC,iBAAA,EAAAP,gBAAgB,GAAGH,aAAa,GAAGU,SAAS;MAC7DJ,IAAI,EAAC;IAAO,CAAA,EAEXH,gBAAgB,IACfC,KACE,CAAAC,aAAA,CAAA,IAAA,EAAA;MAAAE,SAAS,EAAEC,qBAAM,CAACG,oBAAoB;MACtCC,EAAE,EAAEZ,aAAa;MACjBM,IAAI,EAAC;IAAc,CAAA,EAElBT,WAAW,IAAIO,oBAACS,cAAAA,CAAAA,cAAc,EAAA,IAAA,EAAEhB,WAAW,EAAoB,IAAA,CAAA,EAC/DC,SAAS,CAACgB,aAAa,CAE3B,EAOAC,KAAK,CAACC,IAAI,CAACrB,KAAK,CAAC,CAACsB,GAAG,CAAC,UAAAC,IAAI,EAAA;MAAI,OAAAA,IAAI,IAAIR,SAAS,IAAId,QAAQ,CAACsB,IAAI,CAAC;IAAA,CAAA,CAAC,CAChE,CACF;EAET,CAAC;EACDzB,cAAc,CAAC0B,WAAW,GAAG,gBAAgB;EAAA,OArChC1B,cAAc;AAAA;"}

package/dist/cjs/FilterMultiSelect/subcomponents/MultiSelectOption/MultiSelectOption.cjs CHANGED Viewed

@@ -7,10 +7,10 @@ var listbox = require('@react-aria/listbox');
 var utils = require('@react-aria/utils');
 var classnames = require('classnames');
 var uuid = require('uuid');
-var a11y = require('@kaizen/a11y');
 var draftBadge = require('@kaizen/draft-badge');
 require('../../../Icon/subcomponents/SVG/SVG.cjs');
 var CheckIcon = require('../../../Icon/CheckIcon.cjs');
+var VisuallyHidden = require('../../../VisuallyHidden/VisuallyHidden.cjs');
 require('../../context/MenuTriggerProvider/MenuTriggerProvider.cjs');
 var SelectionProvider = require('../../context/SelectionProvider/SelectionProvider.cjs');
 var MultiSelectOption_module = require('./MultiSelectOption.module.scss.cjs');
@@ -50,7 +50,7 @@ const MultiSelectOption = /*#__PURE__*/function () {
       className: MultiSelectOption_module.badgeContainer
     }, React.createElement(draftBadge.Badge, {
       classNameOverride: MultiSelectOption_module.badge
-    }, item.value.count), React.createElement(a11y.VisuallyHidden, null, " available")));
+    }, item.value.count), React.createElement(VisuallyHidden.VisuallyHidden, null, " available")));
   };
   MultiSelectOption.displayName = "FilterMultiSelect.Option";
   return MultiSelectOption;

package/dist/cjs/FilterMultiSelect/subcomponents/MultiSelectOption/MultiSelectOption.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MultiSelectOption.cjs","sources":["../../../../../src/FilterMultiSelect/subcomponents/MultiSelectOption/MultiSelectOption.tsx"],"sourcesContent":["import React, { useMemo } from \"react\"\nimport { useFocusRing } from \"@react-aria/focus\"\nimport { useOption } from \"@react-aria/listbox\"\nimport { mergeProps } from \"@react-aria/utils\"\nimport classnames from \"classnames\"\nimport { v4 } from \"uuid\"\nimport { ~~VisuallyHidden~~ } from \"@kaizen/~~a11y~~\"\nimport { ~~Badge~~ } from \"~~@kaizen~~/~~draft-badge~~\"\nimport { ~~CheckIcon~~ } from \"~components/~~Icon~~\"\nimport { useSelectionContext } from \"../../context\"\nimport { MultiSelectItem } from \"../../types\"\nimport styles from \"./MultiSelectOption.module.scss\"\n\nexport interface MultiSelectOptionProps {\n classNameOverride?: string\n item: MultiSelectItem\n}\n\nexport const MultiSelectOption = ({\n classNameOverride,\n item,\n}: MultiSelectOptionProps): JSX.Element => {\n const { selectionState: state } = useSelectionContext()\n // Get props for the option element\n const ref = React.createRef<HTMLLIElement>()\n const { optionProps, isSelected, isDisabled } = useOption(\n { key: item.key },\n state,\n ref\n )\n\n // Determine whether we should show a keyboard\n // focus ring for accessibility\n const { isFocusVisible, focusProps } = useFocusRing()\n const countElementId = useMemo(() => v4(), [])\n\n return (\n <li\n {...mergeProps(optionProps, focusProps)}\n ref={ref}\n className={classnames(\n styles.option,\n classNameOverride,\n isSelected && styles.isSelected,\n isFocusVisible && styles.isFocusVisible,\n isDisabled && styles.isDisabled\n )}\n aria-label={item.value?.label}\n aria-describedby={item.value?.count ? countElementId : undefined}\n >\n <span\n className={classnames(styles.icon, isSelected && styles.isSelected)}\n >\n {isSelected && <CheckIcon role=\"presentation\" />}\n </span>\n {/* can also be item.value since 'rendered' is defined as item.value in SelectionProvider*/}\n {item.rendered}\n {item.value?.count && (\n <span id={countElementId} className={styles.badgeContainer}>\n <Badge classNameOverride={styles.badge}>{item.value.count}</Badge>\n <VisuallyHidden> available</VisuallyHidden>\n </span>\n )}\n </li>\n )\n}\n\nMultiSelectOption.displayName = \"FilterMultiSelect.Option\"\n"],"names":["MultiSelectOption","_a","classNameOverride","item","state","useSelectionContext","ref","React","createRef","_e","useOption","key","optionProps","isSelected","isDisabled","_f","useFocusRing","isFocusVisible","focusProps","countElementId","useMemo","v4","createElement","__assign","mergeProps","className","classnames","styles","option","_b","value","label","_c","count","undefined","icon","CheckIcon","role","rendered","_d","id","badgeContainer","Badge","badge","VisuallyHidden","displayName"],"mappings":";;;;;;;;;;;;;;;;MAkBaA,iBAAiB;EAAA,MAAjBA,iBAAiB,GAAG,SAAAA,CAACC,EAGT,EAAA;;QAFvBC,iBAAiB,GAAAD,EAAA,CAAAC,iBAAA;MACjBC,IAAI,GAAAF,EAAA,CAAAE,IAAA;IAEI,IAAgBC,KAAK,GAAKC,qCAAmB,CAAE,CAAA,eAA1B;;IAE7B,IAAMC,GAAG,GAAGC,KAAK,CAACC,SAAS,EAAiB;IACtC,IAAAC,EAAA,GAA0CC,OAAAA,CAAAA,SAAS,CACvD;QAAEC,GAAG,EAAER,IAAI,CAACQ;MAAG,CAAE,EACjBP,KAAK,EACLE,GAAG,CACJ;MAJOM,WAAW,GAAAH,EAAA,CAAAG,WAAA;MAAEC,UAAU,GAAAJ,EAAA,CAAAI,UAAA;MAAEC,UAAU,GAAAL,EAAA,CAAAK,UAI1C;;;IAIK,IAAAC,EAAA,GAAiCC,KAAY,CAAAA,YAAA,CAAA,CAAE;MAA7CC,cAAc,GAAAF,EAAA,CAAAE,cAAA;MAAEC,UAAU,GAAAH,EAAA,CAAAG,UAAmB;IACrD,IAAMC,cAAc,GAAGC,KAAAA,CAAAA,OAAO,CAAC,YAAM;MAAA,OAAAC,IAAAA,CAAAA,EAAE,EAAE;IAAJ,CAAI,EAAE,EAAE,CAAC;IAE9C,OACEd,KAAA,CAAAe,aAAA,CAAA,IAAA,EAAAC,KAAA,CAAAA,QAAA,CAAA,CAAA,CAAA,EACMC,gBAAU,CAACZ,WAAW,EAAEM,UAAU,CAAC,EACvC;MAAAZ,GAAG,EAAEA,GAAG;MACRmB,SAAS,EAAEC,UAAU,CACnBC,wBAAM,CAACC,MAAM,EACb1B,iBAAiB,EACjBW,UAAU,IAAIc,wBAAM,CAACd,UAAU,EAC/BI,cAAc,IAAIU,wBAAM,CAACV,cAAc,EACvCH,UAAU,IAAIa,wBAAM,CAACb,UAAU,CAChC;MACW,YAAA,EAAA,CAAAe,EAAA,GAAA1B,IAAI,CAAC2B,KAAK,MAAE,IAAA,IAAAD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,EAAA,CAAAE,KAAK;MACX,kBAAA,EAAA,CAAA,CAAAC,EAAA,GAAA7B,IAAI,CAAC2B,KAAK,MAAE,IAAA,IAAAE,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,EAAA,CAAAC,KAAK,IAAGd,cAAc,GAAGe;IAAS,CAAA,CAAA,EAEhE3B,KACE,CAAAe,aAAA,CAAA,MAAA,EAAA;MAAAG,SAAS,EAAEC,UAAU,CAACC,wBAAM,CAACQ,IAAI,EAAEtB,UAAU,IAAIc,wBAAM,CAACd,UAAU;IAAC,CAAA,EAElEA,UAAU,IAAIN,KAAC,CAAAe,aAAA,CAAAc,SAAAA,CAAAA,SAAS;MAACC,IAAI,EAAC;IAAc,CAAA,CAAG,CAC3C,EAENlC,IAAI,CAACmC,QAAQ,EACb,CAAA,MAAAnC,IAAI,CAAC2B,KAAK,MAAA,IAAA,IAAAS,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,EAAA,CAAEN,KAAK,KAChB1B,KAAM,CAAAe,aAAA,CAAA,MAAA,EAAA;MAAAkB,EAAE,EAAErB,cAAc;MAAEM,SAAS,EAAEE,wBAAM,CAACc;IAAc,CAAA,EACxDlC,KAAA,CAAAe,aAAA,CAACoB,UAAK,CAAAA,KAAA,EAAA;MAACxC,iBAAiB,EAAEyB,wBAAM,CAACgB;KAAK,EAAGxC,IAAI,CAAC2B,KAAK,CAACG,KAAK,CAAS,EAClE1B,KAAA,CAAAe,aAAA,CAACsB,~~IAAc~~,CAAAA,cAAA,EAA4B,IAAA,EAAA,YAAA,CAAA,CAE9C,CACE;EAET,CAAC;EAED5C,iBAAiB,CAAC6C,WAAW,GAAG,0BAA0B;EAAA,OAjD7C7C,iBAAiB;AAAA;"}
1	+ {"version":3,"file":"MultiSelectOption.cjs","sources":["../../../../../src/FilterMultiSelect/subcomponents/MultiSelectOption/MultiSelectOption.tsx"],"sourcesContent":["import React, { useMemo } from \"react\"\nimport { useFocusRing } from \"@react-aria/focus\"\nimport { useOption } from \"@react-aria/listbox\"\nimport { mergeProps } from \"@react-aria/utils\"\nimport classnames from \"classnames\"\nimport { v4 } from \"uuid\"\nimport { Badge } from \"@kaizen/draft-badge\"\nimport { CheckIcon } from \"~components/Icon\"\nimport { VisuallyHidden } from \"~components/VisuallyHidden\"\nimport { useSelectionContext } from \"../../context\"\nimport { MultiSelectItem } from \"../../types\"\nimport styles from \"./MultiSelectOption.module.scss\"\n\nexport interface MultiSelectOptionProps {\n classNameOverride?: string\n item: MultiSelectItem\n}\n\nexport const MultiSelectOption = ({\n classNameOverride,\n item,\n}: MultiSelectOptionProps): JSX.Element => {\n const { selectionState: state } = useSelectionContext()\n // Get props for the option element\n const ref = React.createRef<HTMLLIElement>()\n const { optionProps, isSelected, isDisabled } = useOption(\n { key: item.key },\n state,\n ref\n )\n\n // Determine whether we should show a keyboard\n // focus ring for accessibility\n const { isFocusVisible, focusProps } = useFocusRing()\n const countElementId = useMemo(() => v4(), [])\n\n return (\n <li\n {...mergeProps(optionProps, focusProps)}\n ref={ref}\n className={classnames(\n styles.option,\n classNameOverride,\n isSelected && styles.isSelected,\n isFocusVisible && styles.isFocusVisible,\n isDisabled && styles.isDisabled\n )}\n aria-label={item.value?.label}\n aria-describedby={item.value?.count ? countElementId : undefined}\n >\n <span\n className={classnames(styles.icon, isSelected && styles.isSelected)}\n >\n {isSelected && <CheckIcon role=\"presentation\" />}\n </span>\n {/* can also be item.value since 'rendered' is defined as item.value in SelectionProvider*/}\n {item.rendered}\n {item.value?.count && (\n <span id={countElementId} className={styles.badgeContainer}>\n <Badge classNameOverride={styles.badge}>{item.value.count}</Badge>\n <VisuallyHidden> available</VisuallyHidden>\n </span>\n )}\n </li>\n )\n}\n\nMultiSelectOption.displayName = \"FilterMultiSelect.Option\"\n"],"names":["MultiSelectOption","_a","classNameOverride","item","state","useSelectionContext","ref","React","createRef","_e","useOption","key","optionProps","isSelected","isDisabled","_f","useFocusRing","isFocusVisible","focusProps","countElementId","useMemo","v4","createElement","__assign","mergeProps","className","classnames","styles","option","_b","value","label","_c","count","undefined","icon","CheckIcon","role","rendered","_d","id","badgeContainer","Badge","badge","VisuallyHidden","displayName"],"mappings":";;;;;;;;;;;;;;;;MAkBaA,iBAAiB;EAAA,MAAjBA,iBAAiB,GAAG,SAAAA,CAACC,EAGT,EAAA;;QAFvBC,iBAAiB,GAAAD,EAAA,CAAAC,iBAAA;MACjBC,IAAI,GAAAF,EAAA,CAAAE,IAAA;IAEI,IAAgBC,KAAK,GAAKC,qCAAmB,CAAE,CAAA,eAA1B;;IAE7B,IAAMC,GAAG,GAAGC,KAAK,CAACC,SAAS,EAAiB;IACtC,IAAAC,EAAA,GAA0CC,OAAAA,CAAAA,SAAS,CACvD;QAAEC,GAAG,EAAER,IAAI,CAACQ;MAAG,CAAE,EACjBP,KAAK,EACLE,GAAG,CACJ;MAJOM,WAAW,GAAAH,EAAA,CAAAG,WAAA;MAAEC,UAAU,GAAAJ,EAAA,CAAAI,UAAA;MAAEC,UAAU,GAAAL,EAAA,CAAAK,UAI1C;;;IAIK,IAAAC,EAAA,GAAiCC,KAAY,CAAAA,YAAA,CAAA,CAAE;MAA7CC,cAAc,GAAAF,EAAA,CAAAE,cAAA;MAAEC,UAAU,GAAAH,EAAA,CAAAG,UAAmB;IACrD,IAAMC,cAAc,GAAGC,KAAAA,CAAAA,OAAO,CAAC,YAAM;MAAA,OAAAC,IAAAA,CAAAA,EAAE,EAAE;IAAJ,CAAI,EAAE,EAAE,CAAC;IAE9C,OACEd,KAAA,CAAAe,aAAA,CAAA,IAAA,EAAAC,KAAA,CAAAA,QAAA,CAAA,CAAA,CAAA,EACMC,gBAAU,CAACZ,WAAW,EAAEM,UAAU,CAAC,EACvC;MAAAZ,GAAG,EAAEA,GAAG;MACRmB,SAAS,EAAEC,UAAU,CACnBC,wBAAM,CAACC,MAAM,EACb1B,iBAAiB,EACjBW,UAAU,IAAIc,wBAAM,CAACd,UAAU,EAC/BI,cAAc,IAAIU,wBAAM,CAACV,cAAc,EACvCH,UAAU,IAAIa,wBAAM,CAACb,UAAU,CAChC;MACW,YAAA,EAAA,CAAAe,EAAA,GAAA1B,IAAI,CAAC2B,KAAK,MAAE,IAAA,IAAAD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,EAAA,CAAAE,KAAK;MACX,kBAAA,EAAA,CAAA,CAAAC,EAAA,GAAA7B,IAAI,CAAC2B,KAAK,MAAE,IAAA,IAAAE,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,EAAA,CAAAC,KAAK,IAAGd,cAAc,GAAGe;IAAS,CAAA,CAAA,EAEhE3B,KACE,CAAAe,aAAA,CAAA,MAAA,EAAA;MAAAG,SAAS,EAAEC,UAAU,CAACC,wBAAM,CAACQ,IAAI,EAAEtB,UAAU,IAAIc,wBAAM,CAACd,UAAU;IAAC,CAAA,EAElEA,UAAU,IAAIN,KAAC,CAAAe,aAAA,CAAAc,SAAAA,CAAAA,SAAS;MAACC,IAAI,EAAC;IAAc,CAAA,CAAG,CAC3C,EAENlC,IAAI,CAACmC,QAAQ,EACb,CAAA,MAAAnC,IAAI,CAAC2B,KAAK,MAAA,IAAA,IAAAS,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,EAAA,CAAEN,KAAK,KAChB1B,KAAM,CAAAe,aAAA,CAAA,MAAA,EAAA;MAAAkB,EAAE,EAAErB,cAAc;MAAEM,SAAS,EAAEE,wBAAM,CAACc;IAAc,CAAA,EACxDlC,KAAA,CAAAe,aAAA,CAACoB,UAAK,CAAAA,KAAA,EAAA;MAACxC,iBAAiB,EAAEyB,wBAAM,CAACgB;KAAK,EAAGxC,IAAI,CAAC2B,KAAK,CAACG,KAAK,CAAS,EAClE1B,KAAA,CAAAe,aAAA,CAACsB,cAAc,CAAAA,cAAA,EAA4B,IAAA,EAAA,YAAA,CAAA,CAE9C,CACE;EAET,CAAC;EAED5C,iBAAiB,CAAC6C,WAAW,GAAG,0BAA0B;EAAA,OAjD7C7C,iBAAiB;AAAA;"}

package/dist/cjs/FilterMultiSelect/subcomponents/SelectionControlButton/ClearButton/ClearButton.cjs CHANGED Viewed

@@ -2,7 +2,7 @@
 var React = require('react');
 var classnames = require('classnames');
-var a11y = require('@kaizen/a11y');
+var VisuallyHidden = require('../../../../VisuallyHidden/VisuallyHidden.cjs');
 require('../../../context/MenuTriggerProvider/MenuTriggerProvider.cjs');
 var SelectionProvider = require('../../../context/SelectionProvider/SelectionProvider.cjs');
 var SelectionControlButton_module = require('../SelectionControlButton.module.scss.cjs');
@@ -23,7 +23,7 @@ const ClearButton = /*#__PURE__*/function () {
           return !filteredOptions.includes(option);
         }));
       }
-    }, "Clear", React.createElement(a11y.VisuallyHidden, null, " selections"));
+    }, "Clear", React.createElement(VisuallyHidden.VisuallyHidden, null, " selections"));
   };
   ClearButton.displayName = "FilterMultiSelect.ClearButton";
   return ClearButton;

package/dist/cjs/FilterMultiSelect/subcomponents/SelectionControlButton/ClearButton/ClearButton.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ClearButton.cjs","sources":["../../../../../../src/FilterMultiSelect/subcomponents/SelectionControlButton/ClearButton/ClearButton.tsx"],"sourcesContent":["import React from \"react\"\nimport classnames from \"classnames\"\nimport { VisuallyHidden } from \"~~@kaizen~~/~~a11y~~\"\nimport { useSelectionContext } from \"../../../context\"\nimport styles from \"../SelectionControlButton.module.scss\"\n\nexport const ClearButton = (): JSX.Element => {\n const { selectionState } = useSelectionContext()\n const filteredOptions = Array.from(selectionState.collection.getKeys())\n const selectedOptions = Array.from(\n selectionState.selectionManager.selectedKeys\n )\n const isDisabled =\n filteredOptions.length === 0 \|\|\n !Boolean(\n filteredOptions.find(key =>\n selectionState.selectionManager.isSelected(key)\n )\n )\n\n return (\n <button\n type=\"button\"\n className={classnames(styles.button, isDisabled && styles.isDisabled)}\n aria-disabled={isDisabled}\n onClick={\n (): void => {\n !isDisabled &&\n selectionState.selectionManager.setSelectedKeys(\n selectedOptions.filter(\n option => !filteredOptions.includes(option)\n )\n )\n }\n // TODO: add announcement here to inform selection cleared\n }\n >\n Clear<VisuallyHidden> selections</VisuallyHidden>\n </button>\n )\n}\n\nClearButton.displayName = \"FilterMultiSelect.ClearButton\"\n"],"names":["ClearButton","selectionState","useSelectionContext","filteredOptions","Array","from","collection","getKeys","selectedOptions","selectionManager","selectedKeys","isDisabled","length","Boolean","find","key","isSelected","React","createElement","type","className","classnames","styles","button","onClick","setSelectedKeys","filter","option","includes","VisuallyHidden","displayName"],"mappings":";;;;;;;;MAMaA,WAAW;EAAA,MAAXA,WAAW,GAAG,SAAAA,CAAA,EAAA;IACjB,IAAAC,cAAc,GAAKC,qCAAmB,CAAE,CAAA,eAA1B;IACtB,IAAMC,eAAe,GAAGC,KAAK,CAACC,IAAI,CAACJ,cAAc,CAACK,UAAU,CAACC,OAAO,CAAA,CAAE,CAAC;IACvE,IAAMC,eAAe,GAAGJ,KAAK,CAACC,IAAI,CAChCJ,cAAc,CAACQ,gBAAgB,CAACC,YAAY,CAC7C;IACD,IAAMC,UAAU,GACdR,eAAe,CAACS,MAAM,KAAK,CAAC,IAC5B,CAACC,OAAO,CACNV,eAAe,CAACW,IAAI,CAAC,UAAAC,GAAG,EAAA;MACtB,OAAAd,cAAc,CAACQ,gBAAgB,CAACO,UAAU,CAACD,GAAG,CAAC;IAAA,CAAA,CAChD,CACF;IAEH,OACEE,KACE,CAAAC,aAAA,CAAA,QAAA,EAAA;MAAAC,IAAI,EAAC,QAAQ;MACbC,SAAS,EAAEC,UAAU,CAACC,6BAAM,CAACC,MAAM,EAAEZ,UAAU,IAAIW,6BAAM,CAACX,UAAU,CAAC;MACtD,eAAA,EAAAA,UAAU;MACzBa,OAAO,EACL,SAAAA,CAAA,EAAA;QACE,CAACb,UAAU,IACTV,cAAc,CAACQ,gBAAgB,CAACgB,eAAe,CAC7CjB,eAAe,CAACkB,MAAM,CACpB,UAAAC,MAAM,EAAA;UAAI,OAAA,CAACxB,eAAe,CAACyB,QAAQ,CAACD,MAAM,CAAC;QAAjC,CAAiC,CAC5C,CACF;;IACJ,CAAA,WAIEV,KAAA,CAAAC,aAAA,CAACW,~~IAAAA~~,CAAAA,cAAc,EAAA,IAAA,EAAA,aAAA,CAA6B,CAC1C;EAEb,CAAC;EAED7B,WAAW,CAAC8B,WAAW,GAAG,+BAA+B;EAAA,OApC5C9B,WAAW;AAAA;"}
1	+ {"version":3,"file":"ClearButton.cjs","sources":["../../../../../../src/FilterMultiSelect/subcomponents/SelectionControlButton/ClearButton/ClearButton.tsx"],"sourcesContent":["import React from \"react\"\nimport classnames from \"classnames\"\nimport { VisuallyHidden } from \"~components/VisuallyHidden\"\nimport { useSelectionContext } from \"../../../context\"\nimport styles from \"../SelectionControlButton.module.scss\"\n\nexport const ClearButton = (): JSX.Element => {\n const { selectionState } = useSelectionContext()\n const filteredOptions = Array.from(selectionState.collection.getKeys())\n const selectedOptions = Array.from(\n selectionState.selectionManager.selectedKeys\n )\n const isDisabled =\n filteredOptions.length === 0 \|\|\n !Boolean(\n filteredOptions.find(key =>\n selectionState.selectionManager.isSelected(key)\n )\n )\n\n return (\n <button\n type=\"button\"\n className={classnames(styles.button, isDisabled && styles.isDisabled)}\n aria-disabled={isDisabled}\n onClick={\n (): void => {\n !isDisabled &&\n selectionState.selectionManager.setSelectedKeys(\n selectedOptions.filter(\n option => !filteredOptions.includes(option)\n )\n )\n }\n // TODO: add announcement here to inform selection cleared\n }\n >\n Clear<VisuallyHidden> selections</VisuallyHidden>\n </button>\n )\n}\n\nClearButton.displayName = \"FilterMultiSelect.ClearButton\"\n"],"names":["ClearButton","selectionState","useSelectionContext","filteredOptions","Array","from","collection","getKeys","selectedOptions","selectionManager","selectedKeys","isDisabled","length","Boolean","find","key","isSelected","React","createElement","type","className","classnames","styles","button","onClick","setSelectedKeys","filter","option","includes","VisuallyHidden","displayName"],"mappings":";;;;;;;;MAMaA,WAAW;EAAA,MAAXA,WAAW,GAAG,SAAAA,CAAA,EAAA;IACjB,IAAAC,cAAc,GAAKC,qCAAmB,CAAE,CAAA,eAA1B;IACtB,IAAMC,eAAe,GAAGC,KAAK,CAACC,IAAI,CAACJ,cAAc,CAACK,UAAU,CAACC,OAAO,CAAA,CAAE,CAAC;IACvE,IAAMC,eAAe,GAAGJ,KAAK,CAACC,IAAI,CAChCJ,cAAc,CAACQ,gBAAgB,CAACC,YAAY,CAC7C;IACD,IAAMC,UAAU,GACdR,eAAe,CAACS,MAAM,KAAK,CAAC,IAC5B,CAACC,OAAO,CACNV,eAAe,CAACW,IAAI,CAAC,UAAAC,GAAG,EAAA;MACtB,OAAAd,cAAc,CAACQ,gBAAgB,CAACO,UAAU,CAACD,GAAG,CAAC;IAAA,CAAA,CAChD,CACF;IAEH,OACEE,KACE,CAAAC,aAAA,CAAA,QAAA,EAAA;MAAAC,IAAI,EAAC,QAAQ;MACbC,SAAS,EAAEC,UAAU,CAACC,6BAAM,CAACC,MAAM,EAAEZ,UAAU,IAAIW,6BAAM,CAACX,UAAU,CAAC;MACtD,eAAA,EAAAA,UAAU;MACzBa,OAAO,EACL,SAAAA,CAAA,EAAA;QACE,CAACb,UAAU,IACTV,cAAc,CAACQ,gBAAgB,CAACgB,eAAe,CAC7CjB,eAAe,CAACkB,MAAM,CACpB,UAAAC,MAAM,EAAA;UAAI,OAAA,CAACxB,eAAe,CAACyB,QAAQ,CAACD,MAAM,CAAC;QAAjC,CAAiC,CAC5C,CACF;;IACJ,CAAA,WAIEV,KAAA,CAAAC,aAAA,CAACW,cAAAA,CAAAA,cAAc,EAAA,IAAA,EAAA,aAAA,CAA6B,CAC1C;EAEb,CAAC;EAED7B,WAAW,CAAC8B,WAAW,GAAG,+BAA+B;EAAA,OApC5C9B,WAAW;AAAA;"}

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

@@ -3,8 +3,8 @@
 var tslib = require('tslib');
 var React = require('react');
 var classnames = require('classnames');
-var a11y = require('@kaizen/a11y');
 var Text = require('../../Text/Text.cjs');
+var VisuallyHidden = require('../../VisuallyHidden/VisuallyHidden.cjs');
 var InputRange_module = require('./InputRange.module.scss.cjs');
 /**
@@ -62,7 +62,7 @@ const InputRange = /*#__PURE__*/function () {
       }, React.createElement("div", {
         className: InputRange_module.spoke
       }));
-    })), React.createElement(a11y.VisuallyHidden, {
+    })), React.createElement(VisuallyHidden.VisuallyHidden, {
       id: visuallyHiddenHintId
     }, min, " is ", minLabel, ", ", max, " is ", maxLabel), React.createElement("div", {
       className: InputRange_module.labelsContainer

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

	@@ -1 +1 @@
1	- {"version":3,"file":"InputRange.cjs","sources":["../../../../src/Input/InputRange/InputRange.tsx"],"sourcesContent":["import React, { InputHTMLAttributes, ReactNode, useState } from \"react\"\nimport classnames from \"classnames\"\nimport { ~~VisuallyHidden~~ } from \"~~@kaizen~~/~~a11y~~\"\nimport { ~~Text~~ } from \"~components/~~Text~~\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./InputRange.module.scss\"\n\nexport type InputRangeProps = {\n id: string\n defaultValue?: number\n value?: number\n minLabel: ReactNode\n maxLabel: ReactNode\n min?: number\n max?: number\n} & OverrideClassName<InputHTMLAttributes<HTMLInputElement>>\n\n/*\n {@link https://cultureamp.design/?path=/docs/components-input-range--docs Storybook}\n */\nexport const InputRange = ({\n id,\n defaultValue,\n value,\n minLabel,\n maxLabel,\n min = 1,\n max = 10,\n onChange,\n \"aria-describedby\": ariaDescribedby,\n classNameOverride,\n disabled,\n readOnly,\n ...restProps\n}: InputRangeProps): JSX.Element => {\n const [step, setStep] = useState(0.5) // Let the dot center between the notch initially\n const visuallyHiddenHintId = `${id}-helper`\n const readOnlyWithNoValue = readOnly && !value && !defaultValue\n\n // This has been split out into a different variable to allow usage of defaultValue above^\n // Plus it lets us use max from props with its default value\n const defaultValueWithDefault = defaultValue \|\| (max + 1) / 2\n\n return (\n <>\n <input\n id={id}\n className={classnames(\n styles.ratingScaleRange,\n classNameOverride,\n readOnlyWithNoValue && styles.hideThumb,\n disabled && styles.disabled\n )}\n disabled={disabled \|\| readOnly}\n type=\"range\"\n min={min}\n max={max}\n step={step}\n defaultValue={value ? undefined : defaultValueWithDefault}\n value={value}\n aria-valuenow={value}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-describedby={`${visuallyHiddenHintId} ${\n ariaDescribedby ? ariaDescribedby : \"\"\n }`}\n onChange={(e: React.ChangeEvent<HTMLInputElement>): void => {\n setStep(1) // Put the stepper to 1 to avoid floating value\n onChange?.(e)\n }}\n {...restProps}\n />\n <div className={classnames(styles.spokes, disabled && styles.disabled)}>\n {[...Array(max)].map((_, index) => (\n <div key={`${id}-spoke-${index}`} className={styles.spokeContainer}>\n <div className={styles.spoke} />\n </div>\n ))}\n </div>\n <VisuallyHidden id={visuallyHiddenHintId}>\n {min} is {minLabel}, {max} is {maxLabel}\n </VisuallyHidden>\n <div className={styles.labelsContainer}>\n {!readOnlyWithNoValue && (\n <div\n className={classnames(\n styles.sliderLabels,\n disabled && styles.disabled\n )}\n >\n <Text variant=\"small\" color=\"dark-reduced-opacity\" tag=\"span\">\n {minLabel}\n </Text>\n <Text variant=\"small\" color=\"dark-reduced-opacity\" tag=\"span\">\n {maxLabel}\n </Text>\n </div>\n )}\n </div>\n </>\n )\n}\n\nInputRange.displayName = \"InputRange\"\n"],"names":["InputRange","_a","id","defaultValue","value","minLabel","maxLabel","_b","min","_c","max","onChange","ariaDescribedby","classNameOverride","disabled","readOnly","restProps","__rest","_d","useState","step","setStep","visuallyHiddenHintId","concat","readOnlyWithNoValue","defaultValueWithDefault","React","createElement","Fragment","__assign","className","classnames","styles","ratingScaleRange","hideThumb","type","undefined","e","spokes","__spreadArray","Array","map","_","index","key","spokeContainer","spoke","VisuallyHidden","labelsContainer","sliderLabels","Text","variant","color","tag","displayName"],"mappings":"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~~IAAAA~~,CAAAA,cAAc,EAAA;MAAC7C,EAAE,EAAEoB;IAAoB,CAAA,EACrCd,GAAG,UAAMH,QAAQ,QAAIK,GAAG,UAAMJ,QAAQ,CACxB,EACjBoB,KAAK,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAAG,SAAS,EAAEE,iBAAM,CAACgB;IAAe,GACnC,CAACxB,mBAAmB,IACnBE,KACE,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAAG,SAAS,EAAEC,UAAU,CACnBC,iBAAM,CAACiB,YAAY,EACnBnC,QAAQ,IAAIkB,iBAAM,CAAClB,QAAQ;IAC5B,CAAA,EAEDY,KAAA,CAAAC,aAAA,CAACuB,SAAI,EAAA;MAACC,OAAO,EAAC,OAAO;MAACC,KAAK,EAAC,sBAAsB;MAACC,GAAG,EAAC;IAAM,CAAA,EAC1DhD,QAAQ,CACJ,EACPqB,KAAC,CAAAC,aAAA,CAAAuB,IAAAA,CAAAA,IAAI;MAACC,OAAO,EAAC,OAAO;MAACC,KAAK,EAAC,sBAAsB;MAACC,GAAG,EAAC;OACpD/C,QAAQ,CACJ,CAEV,CACG,CACL;EAEP,CAAC;EAEDN,UAAU,CAACsD,WAAW,GAAG,YAAY;EAAA,OAnFxBtD,UAAU;AAAA;"}
1	+ {"version":3,"file":"InputRange.cjs","sources":["../../../../src/Input/InputRange/InputRange.tsx"],"sourcesContent":["import React, { InputHTMLAttributes, ReactNode, useState } from \"react\"\nimport classnames from \"classnames\"\nimport { Text } from \"~components/Text\"\nimport { VisuallyHidden } from \"~components/VisuallyHidden\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./InputRange.module.scss\"\n\nexport type InputRangeProps = {\n id: string\n defaultValue?: number\n value?: number\n minLabel: ReactNode\n maxLabel: ReactNode\n min?: number\n max?: number\n} & OverrideClassName<InputHTMLAttributes<HTMLInputElement>>\n\n/*\n {@link https://cultureamp.design/?path=/docs/components-input-range--docs Storybook}\n */\nexport const InputRange = ({\n id,\n defaultValue,\n value,\n minLabel,\n maxLabel,\n min = 1,\n max = 10,\n onChange,\n \"aria-describedby\": ariaDescribedby,\n classNameOverride,\n disabled,\n readOnly,\n ...restProps\n}: InputRangeProps): JSX.Element => {\n const [step, setStep] = useState(0.5) // Let the dot center between the notch initially\n const visuallyHiddenHintId = `${id}-helper`\n const readOnlyWithNoValue = readOnly && !value && !defaultValue\n\n // This has been split out into a different variable to allow usage of defaultValue above^\n // Plus it lets us use max from props with its default value\n const defaultValueWithDefault = defaultValue \|\| (max + 1) / 2\n\n return (\n <>\n <input\n id={id}\n className={classnames(\n styles.ratingScaleRange,\n classNameOverride,\n readOnlyWithNoValue && styles.hideThumb,\n disabled && styles.disabled\n )}\n disabled={disabled \|\| readOnly}\n type=\"range\"\n min={min}\n max={max}\n step={step}\n defaultValue={value ? undefined : defaultValueWithDefault}\n value={value}\n aria-valuenow={value}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-describedby={`${visuallyHiddenHintId} ${\n ariaDescribedby ? ariaDescribedby : \"\"\n }`}\n onChange={(e: React.ChangeEvent<HTMLInputElement>): void => {\n setStep(1) // Put the stepper to 1 to avoid floating value\n onChange?.(e)\n }}\n {...restProps}\n />\n <div className={classnames(styles.spokes, disabled && styles.disabled)}>\n {[...Array(max)].map((_, index) => (\n <div key={`${id}-spoke-${index}`} className={styles.spokeContainer}>\n <div className={styles.spoke} />\n </div>\n ))}\n </div>\n <VisuallyHidden id={visuallyHiddenHintId}>\n {min} is {minLabel}, {max} is {maxLabel}\n </VisuallyHidden>\n <div className={styles.labelsContainer}>\n {!readOnlyWithNoValue && (\n <div\n className={classnames(\n styles.sliderLabels,\n disabled && styles.disabled\n )}\n >\n <Text variant=\"small\" color=\"dark-reduced-opacity\" tag=\"span\">\n {minLabel}\n </Text>\n <Text variant=\"small\" color=\"dark-reduced-opacity\" tag=\"span\">\n {maxLabel}\n </Text>\n </div>\n )}\n </div>\n </>\n )\n}\n\nInputRange.displayName = \"InputRange\"\n"],"names":["InputRange","_a","id","defaultValue","value","minLabel","maxLabel","_b","min","_c","max","onChange","ariaDescribedby","classNameOverride","disabled","readOnly","restProps","__rest","_d","useState","step","setStep","visuallyHiddenHintId","concat","readOnlyWithNoValue","defaultValueWithDefault","React","createElement","Fragment","__assign","className","classnames","styles","ratingScaleRange","hideThumb","type","undefined","e","spokes","__spreadArray","Array","map","_","index","key","spokeContainer","spoke","VisuallyHidden","labelsContainer","sliderLabels","Text","variant","color","tag","displayName"],"mappings":"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"}

package/dist/cjs/TextArea/TextArea.cjs ADDED Viewed

@@ -0,0 +1,85 @@
+'use strict';
+var tslib = require('tslib');
+var React = require('react');
+var classnames = require('classnames');
+var TextArea_module = require('./TextArea.module.scss.cjs');
+const TextArea = /*#__PURE__*/function () {
+  const TextArea = function (_a) {
+    var propsTextAreaRef = _a.textAreaRef,
+      _b = _a.status,
+      status = _b === void 0 ? "default" : _b,
+      _c = _a.autogrow,
+      autogrow = _c === void 0 ? false : _c,
+      _d = _a.reversed,
+      reversed = _d === void 0 ? false : _d,
+      _e = _a.rows,
+      rows = _e === void 0 ? 3 : _e,
+      defaultValue = _a.defaultValue,
+      value = _a.value,
+      disabled = _a.disabled,
+      propsOnChange = _a.onChange,
+      restProps = tslib.__rest(_a, ["textAreaRef", "status", "autogrow", "reversed", "rows", "defaultValue", "value", "disabled", "onChange"]);
+    var _f = React.useState("auto"),
+      textAreaHeight = _f[0],
+      setTextAreaHeight = _f[1];
+    var _g = React.useState("auto"),
+      parentHeight = _g[0],
+      setParentHeight = _g[1];
+    var _h = React.useState(autogrow ? defaultValue : undefined),
+      internalValue = _h[0],
+      setInternalValue = _h[1];
+    // ^ holds an internal state of the value so that autogrow can still work with uncontrolled textareas
+    // essentially forces the textarea into an (interally) controlled mode if autogrow is true
+    var textAreaRef = propsTextAreaRef || React.useRef(null);
+    React.useEffect(function () {
+      if (!autogrow) return;
+      var scrollHeight = textAreaRef.current.scrollHeight;
+      if (scrollHeight < 1) return;
+      var borderWidth = textAreaRef.current ? parseInt(getComputedStyle(textAreaRef.current).borderTopWidth, 10) : 0;
+      var newHeight = scrollHeight + borderWidth * 2;
+      setParentHeight("".concat(newHeight, "px"));
+      setTextAreaHeight("".concat(newHeight, "px"));
+    }, [internalValue]);
+    var onChange = !autogrow ? undefined : function (event) {
+      setTextAreaHeight("auto");
+      // ^ this is required to avoid the textarea height from building up indefinitely
+      // see https://medium.com/@lucasalgus/creating-a-custom-auto-resize-textarea-component-for-your-react-web-application-6959c0ad68bc#2dee
+      setInternalValue(event.target.value);
+      if (propsOnChange) {
+        propsOnChange(event);
+      }
+    };
+    var getWrapperStyle = function () {
+      return autogrow ? {
+        minHeight: parentHeight
+      } : undefined;
+    };
+    var getTextAreaStyle = function () {
+      return autogrow ? {
+        height: textAreaHeight
+      } : undefined;
+    };
+    var controlledValue = value || internalValue;
+    return React.createElement("div", {
+      className: TextArea_module.wrapper,
+      style: getWrapperStyle()
+    }, React.createElement("textarea", tslib.__assign({
+      className: classnames(TextArea_module.textarea, TextArea_module[status], reversed ? TextArea_module.reversed : TextArea_module["default"], disabled && TextArea_module.disabled),
+      rows: rows,
+      onChange: onChange || propsOnChange,
+      value: controlledValue,
+      defaultValue: controlledValue ? undefined : defaultValue,
+      // ^ React throws a warning if you specify both a value and a defaultValue
+      ref: textAreaRef,
+      style: getTextAreaStyle(),
+      disabled: disabled
+    }, restProps)), React.createElement("div", {
+      className: TextArea_module.focusRing
+    }));
+  };
+  TextArea.displayName = "TextArea";
+  return TextArea;
+}();
+exports.TextArea = TextArea;
+//# sourceMappingURL=TextArea.cjs.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"TextArea.cjs","sources":["../../../src/TextArea/TextArea.tsx"],"sourcesContent":["import React, {\n TextareaHTMLAttributes,\n useEffect,\n useRef,\n useState,\n} from \"react\"\nimport classnames from \"classnames\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./TextArea.module.scss\"\n\nexport type TextAreaProps = {\n textAreaRef?: React.RefObject<HTMLTextAreaElement>\n status?: \"default\" | \"error\" | \"caution\"\n autogrow?: boolean\n reversed?: boolean\n} & OverrideClassName<TextareaHTMLAttributes<HTMLTextAreaElement>>\n\nexport const TextArea = ({\n textAreaRef: propsTextAreaRef,\n status = \"default\",\n autogrow = false,\n reversed = false,\n rows = 3,\n defaultValue,\n value,\n disabled,\n onChange: propsOnChange,\n ...restProps\n}: TextAreaProps): JSX.Element => {\n const [textAreaHeight, setTextAreaHeight] = useState<string>(\"auto\")\n const [parentHeight, setParentHeight] = useState<string>(\"auto\")\n const [internalValue, setInternalValue] = useState<\n string | number | readonly string[] | undefined\n >(autogrow ? defaultValue : undefined)\n // ^ holds an internal state of the value so that autogrow can still work with uncontrolled textareas\n // essentially forces the textarea into an (interally) controlled mode if autogrow is true\n const textAreaRef = propsTextAreaRef || useRef(null)\n\n useEffect(() => {\n if (!autogrow) return\n\n const scrollHeight = textAreaRef.current!.scrollHeight\n if (scrollHeight < 1) return\n\n const borderWidth = textAreaRef.current\n ? parseInt(getComputedStyle(textAreaRef.current).borderTopWidth, 10)\n : 0\n const newHeight = scrollHeight + borderWidth * 2\n setParentHeight(`${newHeight}px`)\n setTextAreaHeight(`${newHeight}px`)\n }, [internalValue])\n\n const onChange = !autogrow\n ? undefined\n : (event: React.ChangeEvent<HTMLTextAreaElement>): void => {\n setTextAreaHeight(\"auto\")\n // ^ this is required to avoid the textarea height from building up indefinitely\n // see https://medium.com/@lucasalgus/creating-a-custom-auto-resize-textarea-component-for-your-react-web-application-6959c0ad68bc#2dee\n\n setInternalValue(event.target.value)\n if (propsOnChange) {\n propsOnChange(event)\n }\n }\n\n const getWrapperStyle = (): { minHeight: string } | undefined =>\n autogrow ? { minHeight: parentHeight } : undefined\n\n const getTextAreaStyle = (): { height: string } | undefined =>\n autogrow ? { height: textAreaHeight } : undefined\n\n const controlledValue = value || internalValue\n\n return (\n <div className={styles.wrapper} style={getWrapperStyle()}>\n <textarea\n className={classnames(\n styles.textarea,\n styles[status],\n reversed ? styles.reversed : styles.default,\n disabled && styles.disabled\n )}\n rows={rows}\n onChange={onChange || propsOnChange}\n value={controlledValue}\n defaultValue={controlledValue ? undefined : defaultValue}\n // ^ React throws a warning if you specify both a value and a defaultValue\n ref={textAreaRef}\n style={getTextAreaStyle()}\n disabled={disabled}\n {...restProps}\n />\n\n {/* Textareas aren't able to have pseudo elements like ::after on them,\n so we have to create an element ourselves for the focus ring */}\n <div className={styles.focusRing} />\n </div>\n )\n}\n\nTextArea.displayName = \"TextArea\"\n"],"names":["TextArea","_a","propsTextAreaRef","_b","status","_c","autogrow","_d","reversed","_e","rows","defaultValue","value","disabled","propsOnChange","restProps","__rest","_f","useState","textAreaHeight","setTextAreaHeight","_g","parentHeight","setParentHeight","_h","undefined","internalValue","setInternalValue","textAreaRef","useRef","useEffect","scrollHeight","current","borderWidth","parseInt","getComputedStyle","borderTopWidth","newHeight","concat","onChange","event","target","getWrapperStyle","minHeight","getTextAreaStyle","height","controlledValue","React","createElement","className","styles","wrapper","style","__assign","classnames","textarea","ref","focusRing","displayName"],"mappings":"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"}

package/dist/cjs/TextArea/TextArea.module.scss.cjs ADDED Viewed

@@ -0,0 +1,14 @@
+'use strict';
+var styles = {
+  "wrapper": "TextArea-module_wrapper__ytS6M",
+  "textarea": "TextArea-module_textarea__GeHn4",
+  "focusRing": "TextArea-module_focusRing__kECqH",
+  "default": "TextArea-module_default__Z8jvR",
+  "error": "TextArea-module_error__XOQRm",
+  "caution": "TextArea-module_caution__9BGd0",
+  "disabled": "TextArea-module_disabled__N09tP",
+  "reversed": "TextArea-module_reversed__-SoNq"
+};
+module.exports = styles;
+//# sourceMappingURL=TextArea.module.scss.cjs.map

package/dist/cjs/TextArea/TextArea.module.scss.cjs.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"TextArea.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/dist/cjs/TextAreaField/TextAreaField.cjs ADDED Viewed

@@ -0,0 +1,85 @@
+'use strict';
+var tslib = require('tslib');
+var React = require('react');
+var classnames = require('classnames');
+var FieldGroup = require('../FieldGroup/FieldGroup.cjs');
+var FieldMessage = require('../FieldMessage/FieldMessage.cjs');
+var Label = require('../Label/Label.cjs');
+var TextArea = require('../TextArea/TextArea.cjs');
+var TextAreaField_module = require('./TextAreaField.module.scss.cjs');
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081895966/Text+Area+Field Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-text-area-field--docs Storybook}
+ */
+const TextAreaField = /*#__PURE__*/function () {
+  const TextAreaField = function (_a) {
+    var labelText = _a.labelText,
+      _b = _a.inline,
+      inline = _b === void 0 ? false : _b,
+      validationMessage = _a.validationMessage,
+      description = _a.description,
+      _c = _a.variant,
+      variant = _c === void 0 ? "default" : _c,
+      propsId = _a.id,
+      _d = _a.reversed,
+      reversed = _d === void 0 ? false : _d,
+      _e = _a.status,
+      status = _e === void 0 ? "default" : _e,
+      disabled = _a.disabled,
+      restProps = tslib.__rest(_a, ["labelText", "inline", "validationMessage", "description", "variant", "id", "reversed", "status", "disabled"]);
+    var id = propsId !== null && propsId !== void 0 ? propsId : React.useId();
+    var validationMessageAria = validationMessage ? "".concat(id, "-field-validation-message") : "";
+    var descriptionAria = description ? "".concat(id, "-field-message") : "";
+    var ariaDescribedBy = [validationMessageAria, descriptionAria].reduce(function (prev, curr) {
+      return curr ? [curr, prev].join(" ") : prev;
+    }, "");
+    var renderDescriptionOnTop = variant === "prominent";
+    var renderDescription = function (position) {
+      if (!description) return null;
+      return React.createElement("div", {
+        className: classnames(TextAreaField_module.message, disabled && TextAreaField_module.disabled)
+      }, React.createElement(FieldMessage.FieldMessage, {
+        id: descriptionAria,
+        "data-testid": "".concat(id, "-field-description"),
+        message: description,
+        reversed: reversed,
+        position: position
+      }));
+    };
+    return React.createElement(FieldGroup.FieldGroup, {
+      id: "".concat(id, "-field-group"),
+      inline: inline,
+      "data-testid": "".concat(id, "-field-group"),
+      classNameOverride: disabled ? TextAreaField_module.disabled : undefined
+    }, React.createElement("div", {
+      className: classnames(TextAreaField_module.textareaLabel, variant === "prominent" && TextAreaField_module.textareaLabelProminent)
+    }, React.createElement(Label.Label, {
+      id: "".concat(id, "-field-label"),
+      "data-testid": "".concat(id, "-field-label"),
+      htmlFor: "".concat(id, "-field-textarea"),
+      labelText: labelText,
+      reversed: reversed,
+      variant: variant,
+      disabled: disabled
+    })), renderDescriptionOnTop && renderDescription("top"), React.createElement(TextArea.TextArea, tslib.__assign({
+      id: "".concat(id, "-field-textarea"),
+      "data-testid": "".concat(id, "-field-textarea"),
+      reversed: reversed,
+      status: status,
+      disabled: disabled,
+      "aria-describedby": ariaDescribedBy
+    }, restProps)), !disabled && validationMessage && React.createElement(FieldMessage.FieldMessage, {
+      id: validationMessageAria,
+      "data-testid": validationMessageAria,
+      message: validationMessage,
+      status: status,
+      reversed: reversed
+    }), !renderDescriptionOnTop && renderDescription("bottom"));
+  };
+  TextAreaField.displayName = "TextAreaField";
+  return TextAreaField;
+}();
+exports.TextAreaField = TextAreaField;
+//# sourceMappingURL=TextAreaField.cjs.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"TextAreaField.cjs","sources":["../../../src/TextAreaField/TextAreaField.tsx"],"sourcesContent":["import React, { useId } from \"react\"\nimport classnames from \"classnames\"\nimport { FieldGroup } from \"~components/FieldGroup\"\nimport { FieldMessage } from \"~components/FieldMessage\"\nimport { Label } from \"~components/Label\"\nimport { TextArea, TextAreaProps } from \"~components/TextArea\"\nimport styles from \"./TextAreaField.module.scss\"\n\nexport type TextAreaFieldProps = {\n labelText: string | React.ReactNode\n inline?: boolean\n validationMessage?: string | React.ReactNode\n description?: string | React.ReactNode\n variant?: \"default\" | \"prominent\"\n} & TextAreaProps\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081895966/Text+Area+Field Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-text-area-field--docs Storybook}\n */\nexport const TextAreaField = ({\n labelText,\n inline = false,\n validationMessage,\n description,\n variant = \"default\",\n id: propsId,\n reversed = false,\n status = \"default\",\n disabled,\n ...restProps\n}: TextAreaFieldProps): JSX.Element => {\n const id = propsId ?? useId()\n\n const validationMessageAria = validationMessage\n ? `${id}-field-validation-message`\n : \"\"\n const descriptionAria = description ? `${id}-field-message` : \"\"\n const ariaDescribedBy = [validationMessageAria, descriptionAria].reduce(\n (prev, curr) => (curr ? [curr, prev].join(\" \") : prev),\n \"\"\n )\n\n const renderDescriptionOnTop = variant === \"prominent\"\n const renderDescription = (\n position: \"top\" | \"bottom\"\n ): JSX.Element | null => {\n if (!description) return null\n return (\n <div className={classnames(styles.message, disabled && styles.disabled)}>\n <FieldMessage\n id={descriptionAria}\n data-testid={`${id}-field-description`}\n message={description}\n reversed={reversed}\n position={position}\n />\n </div>\n )\n }\n\n return (\n <FieldGroup\n id={`${id}-field-group`}\n inline={inline}\n data-testid={`${id}-field-group`}\n classNameOverride={disabled ? styles.disabled : undefined}\n >\n <div\n className={classnames(\n styles.textareaLabel,\n variant === \"prominent\" && styles.textareaLabelProminent\n )}\n >\n <Label\n id={`${id}-field-label`}\n data-testid={`${id}-field-label`}\n htmlFor={`${id}-field-textarea`}\n labelText={labelText}\n reversed={reversed}\n variant={variant}\n disabled={disabled}\n />\n </div>\n {renderDescriptionOnTop && renderDescription(\"top\")}\n <TextArea\n id={`${id}-field-textarea`}\n data-testid={`${id}-field-textarea`}\n reversed={reversed}\n status={status}\n disabled={disabled}\n aria-describedby={ariaDescribedBy}\n {...restProps}\n />\n {!disabled && validationMessage && (\n <FieldMessage\n id={validationMessageAria}\n data-testid={validationMessageAria}\n message={validationMessage}\n status={status}\n reversed={reversed}\n />\n )}\n {!renderDescriptionOnTop && renderDescription(\"bottom\")}\n </FieldGroup>\n )\n}\n\nTextAreaField.displayName = \"TextAreaField\"\n"],"names":["TextAreaField","_a","labelText","_b","inline","validationMessage","description","_c","variant","propsId","id","_d","reversed","_e","status","disabled","restProps","__rest","useId","validationMessageAria","concat","descriptionAria","ariaDescribedBy","reduce","prev","curr","join","renderDescriptionOnTop","renderDescription","position","React","createElement","className","classnames","styles","message","FieldMessage","FieldGroup","classNameOverride","undefined","textareaLabel","textareaLabelProminent","Label","htmlFor","TextArea","__assign","displayName"],"mappings":"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"}

package/dist/cjs/TextAreaField/TextAreaField.module.scss.cjs ADDED Viewed

@@ -0,0 +1,10 @@
+'use strict';
+var styles = {
+  "message": "TextAreaField-module_message__hlao7",
+  "disabled": "TextAreaField-module_disabled__twCef",
+  "textareaLabel": "TextAreaField-module_textareaLabel__sOTRj",
+  "textareaLabelProminent": "TextAreaField-module_textareaLabelProminent__xqcY4"
+};
+module.exports = styles;
+//# sourceMappingURL=TextAreaField.module.scss.cjs.map

package/dist/cjs/TextAreaField/TextAreaField.module.scss.cjs.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"TextAreaField.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}