@salt-ds/lab 1.0.0-alpha.4 → 1.0.0-alpha.40

package/dist-cjs/content-status/internal/StatusIndicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusIndicator.js","sources":["../src/content-status/internal/StatusIndicator.tsx"],"sourcesContent":["import {\n  makePrefixer,\n  StatusIndicator as BaseStatusIndicator,\n  StatusIndicatorProps as BaseStatusIndicatorProps,\n  Spinner,\n  SpinnerProps,\n} from \"@salt-ds/core\";\nimport { ReactElement } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport { CircularProgress, CircularProgressProps } from \"@salt-ds/core\";\n\nexport interface StatusIndicatorProps\n  extends Pick<SpinnerProps, \"disableAnnouncer\">,\n    Pick<CircularProgressProps, \"value\"> {\n  title?: string;\n  message?: string;\n  CircularProgressProps?: Partial<CircularProgressProps>;\n  SpinnerProps?: Partial<SpinnerProps>;\n  id?: string;\n  status?: BaseStatusIndicatorProps[\"status\"] | \"loading\";\n}\n\nconst withBaseName = makePrefixer(\"saltContentStatus\");\n\nexport function StatusIndicator({\n  status = \"info\",\n  disableAnnouncer,\n  value,\n  title,\n  message,\n  CircularProgressProps: {\n    className: circularProgressClassName,\n    ...restCircularProgressProps\n  } = {},\n  SpinnerProps: { className: spinnerClassName, ...restSpinnerProps } = {},\n  id,\n}: StatusIndicatorProps): ReactElement {\n  if (status === \"loading\") {\n    if (value !== undefined) {\n      return (\n        <CircularProgress\n          aria-label={title || message}\n          className={clsx(\n            withBaseName(\"determinateLoading\"),\n            circularProgressClassName\n          )}\n          value={value}\n          {...restCircularProgressProps}\n        />\n      );\n    }\n    return (\n      <Spinner\n        className={clsx(withBaseName(\"indeterminateLoading\"), spinnerClassName)}\n        // Announcement of the content status is more useful than completion announcement from spinner\n        completionAnnouncement={null}\n        data-testid={`spinner-${id!}`}\n        disableAnnouncer={disableAnnouncer}\n        {...restSpinnerProps}\n      />\n    );\n  }\n\n  return (\n    <BaseStatusIndicator\n      status={status}\n      data-jpmui-test={`icon-${status}-${id!}`}\n      size={2}\n    />\n  );\n}\n"],"names":["makePrefixer","jsx","CircularProgress","clsx","Spinner","BaseStatusIndicator"],"mappings":";;;;;;;;AAuBA,MAAM,YAAA,GAAeA,kBAAa,mBAAmB,CAAA,CAAA;AAE9C,SAAS,eAAgB,CAAA;AAAA,EAC9B,MAAS,GAAA,MAAA;AAAA,EACT,gBAAA;AAAA,EACA,KAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,qBAAuB,EAAA;AAAA,IACrB,SAAW,EAAA,yBAAA;AAAA,IACR,GAAA,yBAAA;AAAA,MACD,EAAC;AAAA,EACL,cAAc,EAAE,SAAA,EAAW,gBAAqB,EAAA,GAAA,gBAAA,KAAqB,EAAC;AAAA,EACtE,EAAA;AACF,CAAuC,EAAA;AACrC,EAAA,IAAI,WAAW,SAAW,EAAA;AACxB,IAAA,IAAI,UAAU,KAAW,CAAA,EAAA;AACvB,MAAA,uBACGC,cAAA,CAAAC,qBAAA,EAAA;AAAA,QACC,cAAY,KAAS,IAAA,OAAA;AAAA,QACrB,SAAW,EAAAC,SAAA;AAAA,UACT,aAAa,oBAAoB,CAAA;AAAA,UACjC,yBAAA;AAAA,SACF;AAAA,QACA,KAAA;AAAA,QACC,GAAG,yBAAA;AAAA,OACN,CAAA,CAAA;AAAA,KAEJ;AACA,IAAA,uBACGF,cAAA,CAAAG,YAAA,EAAA;AAAA,MACC,SAAW,EAAAD,SAAA,CAAK,YAAa,CAAA,sBAAsB,GAAG,gBAAgB,CAAA;AAAA,MAEtE,sBAAwB,EAAA,IAAA;AAAA,MACxB,eAAa,CAAW,QAAA,EAAA,EAAA,CAAA,CAAA;AAAA,MACxB,gBAAA;AAAA,MACC,GAAG,gBAAA;AAAA,KACN,CAAA,CAAA;AAAA,GAEJ;AAEA,EAAA,uBACGF,cAAA,CAAAI,oBAAA,EAAA;AAAA,IACC,MAAA;AAAA,IACA,iBAAA,EAAiB,QAAQ,MAAU,CAAA,CAAA,EAAA,EAAA,CAAA,CAAA;AAAA,IACnC,IAAM,EAAA,CAAA;AAAA,GACR,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/date-input/DateInput.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = "/* Style applied to the root element */\n.saltDateInput {\n  --input-borderColor: var(--salt-editable-borderColor);\n  --input-borderStyle: var(--salt-editable-borderStyle);\n  --input-outlineColor: var(--salt-focused-outlineColor);\n  --input-borderWidth: var(--salt-size-border);\n\n  align-items: center;\n  background: var(--saltDateInput-background, var(--input-background));\n  color: var(--saltDateInput-color, var(--salt-content-primary-foreground));\n  display: inline-flex;\n  gap: var(--salt-spacing-50);\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--saltDateInput-fontSize, var(--salt-text-fontSize));\n  height: var(--saltDateInput-height, var(--salt-size-base));\n  line-height: var(--saltDateInput-lineHeight, var(--salt-text-lineHeight));\n  min-height: var(--saltDateInput-minHeight, var(--salt-size-base));\n  min-width: var(--saltDateInput-minWidth, 4em);\n  padding-left: var(--saltDateInput-paddingLeft, var(--salt-spacing-100));\n  padding-right: var(--saltDateInput-paddingRight, var(--salt-spacing-100));\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.saltDateInput:hover {\n  --input-borderStyle: var(--salt-editable-borderStyle-hover);\n  --input-borderColor: var(--salt-editable-borderColor-hover);\n\n  background: var(--saltDateInput-background-hover, var(--input-background-hover));\n  cursor: var(--salt-editable-cursor-hover);\n}\n\n.saltDateInput:active {\n  --input-borderColor: var(--salt-editable-borderColor-active);\n  --input-borderStyle: var(--salt-editable-borderStyle-active);\n  --input-borderWidth: var(--salt-editable-borderWidth-active);\n\n  background: var(--saltDateInput-background-active, var(--input-background-active));\n  cursor: var(--salt-editable-cursor-active);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltDateInput-primary {\n  --input-background: var(--salt-editable-primary-background);\n  --input-background-active: var(--salt-editable-primary-background-active);\n  --input-background-hover: var(--salt-editable-primary-background-hover);\n  --input-background-disabled: var(--salt-editable-primary-background-disabled);\n  --input-background-readonly: var(--salt-editable-primary-background-readonly);\n}\n\n/* Class applied if `variant=\"secondary\"` */\n.saltDateInput-secondary {\n  --input-background: var(--salt-editable-secondary-background);\n  --input-background-active: var(--salt-editable-secondary-background-active);\n  --input-background-hover: var(--salt-editable-secondary-background-active);\n  --input-background-disabled: var(--salt-editable-secondary-background-disabled);\n  --input-background-readonly: var(--salt-editable-secondary-background-readonly);\n}\n\n/* Style applied to input if `validationState=\"error\"` */\n.saltDateInput-error,\n.saltDateInput-error:hover {\n  --input-background: var(--salt-status-error-background);\n  --input-background-active: var(--salt-status-error-background);\n  --input-background-hover: var(--salt-status-error-background);\n  --input-borderColor: var(--salt-status-error-borderColor);\n  --input-outlineColor: var(--salt-status-error-borderColor);\n}\n\n/* Style applied to input if `validationState=\"warning\"` */\n.saltDateInput-warning,\n.saltDateInput-warning:hover {\n  --input-background: var(--salt-status-warning-background);\n  --input-background-active: var(--salt-status-warning-background);\n  --input-background-hover: var(--salt-status-warning-background);\n  --input-borderColor: var(--salt-status-warning-borderColor);\n  --input-outlineColor: var(--salt-status-warning-borderColor);\n}\n\n/* Style applied to input if `validationState=\"success\"` */\n.saltDateInput-success,\n.saltDateInput-success:hover {\n  --input-background: var(--salt-status-success-background);\n  --input-background-active: var(--salt-status-success-background);\n  --input-background-hover: var(--salt-status-success-background);\n  --input-borderColor: var(--salt-status-success-borderColor);\n  --input-outlineColor: var(--salt-status-success-borderColor);\n}\n\n/* Style applied to inner input component */\n.saltDateInput-input {\n  background: none;\n  border: none;\n  box-sizing: content-box;\n  color: inherit;\n  cursor: inherit;\n  display: block;\n  flex: 1;\n  font: inherit;\n  height: 100%;\n  letter-spacing: var(--saltDateInput-letterSpacing, 0);\n  margin: 0;\n  min-width: 0;\n  overflow: hidden;\n  padding: 0;\n  text-align: left;\n  width: min-content;\n}\n\n/* Reset in the  class */\n.saltDateInput-input:focus {\n  outline: none;\n}\n\n/* Style applied to selected input */\n.saltDateInput-input::selection {\n  background: var(--salt-content-foreground-highlight);\n}\n\n/* Style applied to placeholder text */\n.saltDateInput-input::placeholder {\n  color: var(--salt-content-secondary-foreground);\n  font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Styling when focused */\n.saltDateInput-focused {\n  --input-borderColor: var(--input-outlineColor);\n  --input-borderWidth: var(--salt-editable-borderWidth-active);\n\n  outline: var(--saltDateInput-outline, var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--input-outlineColor));\n}\n\n/* Style applied if `readOnly={true}` */\n.saltDateInput.saltDateInput-readOnly {\n  --input-borderColor: var(--salt-editable-borderColor-readonly);\n  --input-borderStyle: var(--salt-editable-borderStyle-readonly);\n  --input-borderWidth: var(--salt-size-border);\n\n  background: var(--input-background-readonly);\n  cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Styling when focused if `disabled={true}` */\n.saltDateInput-focused.saltDateInput-disabled {\n  --input-borderWidth: var(--salt-size-border);\n  outline: none;\n}\n\n/* Styling when focused if `readOnly={true}` */\n.saltDateInput-focused.saltDateInput-readOnly {\n  --input-borderWidth: var(--salt-size-border);\n}\n\n/* Style applied to selected input if `disabled={true}` */\n.saltDateInput-disabled .saltDateInput-input::selection {\n  background: none;\n}\n\n/* Style applied to input if `disabled={true}` */\n.saltDateInput.saltDateInput-disabled,\n.saltDateInput.saltDateInput-disabled:hover,\n.saltDateInput.saltDateInput-disabled:active {\n  --input-borderColor: var(--salt-editable-borderColor-disabled);\n  --input-borderStyle: var(--salt-editable-borderStyle-disabled);\n  --input-borderWidth: var(--salt-size-border);\n\n  background: var(--input-background-disabled);\n  cursor: var(--salt-editable-cursor-disabled);\n  color: var(--saltDateInput-color-disabled, var(--salt-content-primary-foreground-disabled));\n}\n\n.saltDateInput-activationIndicator {\n  left: 0;\n  bottom: 0;\n  width: 100%;\n  position: absolute;\n  border-bottom: var(--input-borderWidth) var(--input-borderStyle) var(--input-borderColor);\n}\n\n/* Style applied to start adornments */\n.saltDateInput-startAdornmentContainer {\n  align-items: center;\n  display: inline-flex;\n  padding-right: var(--salt-spacing-100);\n  column-gap: var(--salt-spacing-100);\n}\n\n/* Style applied to end adornments */\n.saltDateInput-endAdornmentContainer {\n  align-items: center;\n  display: inline-flex;\n  padding-left: var(--salt-spacing-100);\n  column-gap: var(--salt-spacing-100);\n}\n\n.saltDateInput-readOnly .saltDateInput-startAdornmentContainer {\n  margin-left: var(--salt-spacing-50);\n}\n\n.saltDateInput-startAdornmentContainer .saltButton ~ .saltButton {\n  margin-left: calc(-1 * var(--salt-spacing-50));\n}\n.saltDateInput-endAdornmentContainer .saltButton ~ .saltButton {\n  margin-left: calc(-1 * var(--salt-spacing-50));\n}\n\n.saltDateInput-startAdornmentContainer .saltButton:first-child {\n  margin-left: calc(var(--salt-spacing-50) * -1);\n}\n.saltDateInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: calc(var(--salt-spacing-50) * -1);\n}\n\n.saltDateInput-startAdornmentContainer > .saltButton,\n.saltDateInput-endAdornmentContainer > .saltButton {\n  --saltButton-padding: var(--salt-spacing-50);\n  --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=DateInput.css.js.map

package/dist-cjs/date-input/DateInput.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateInput.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist-cjs/date-input/DateInput.js

@@ -0,0 +1,153 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var clsx = require('clsx');
+var React = require('react');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var DateInput$1 = require('./DateInput.css.js');
+var core = require('@salt-ds/core');
+var date = require('@internationalized/date');
+
+const withBaseName = core.makePrefixer("saltDateInput");
+const isInvalidDate = (value) => value && isNaN(new Date(value));
+const defaultDateFormatter = (input) => {
+  const date$1 = new Date(input);
+  return isInvalidDate(input) ? input : new date.DateFormatter("EN-GB", {
+    day: "2-digit",
+    month: "short",
+    year: "numeric"
+  }).format(date$1);
+};
+const DateInput = React.forwardRef(
+  function DateInput2({
+    "aria-activedescendant": ariaActiveDescendant,
+    "aria-expanded": ariaExpanded,
+    "aria-owns": ariaOwns,
+    className,
+    disabled,
+    emptyReadOnlyMarker = "\u2014",
+    inputProps = {},
+    inputRef,
+    readOnly: readOnlyProp,
+    role,
+    value: valueProp,
+    defaultValue: defaultStartDateProp = valueProp === void 0 ? "" : void 0,
+    validationStatus: validationStatusProp,
+    variant = "primary",
+    dateFormatter = defaultDateFormatter,
+    placeholder = "dd mmm yyyy",
+    ...rest
+  }, ref) {
+    var _a;
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-dateInput",
+      css: DateInput$1,
+      window: targetWindow
+    });
+    const {
+      a11yProps: {
+        "aria-describedby": formFieldDescribedBy,
+        "aria-labelledby": formFieldLabelledBy
+      } = {},
+      disabled: formFieldDisabled,
+      readOnly: formFieldReadOnly,
+      necessity: formFieldRequired,
+      validationStatus: formFieldValidationStatus
+    } = core.useFormFieldProps();
+    const restA11yProps = {
+      "aria-activedescendant": ariaActiveDescendant,
+      "aria-expanded": ariaExpanded,
+      "aria-owns": ariaOwns
+    };
+    const isReadOnly = readOnlyProp || formFieldReadOnly;
+    const isEmptyReadOnly = isReadOnly && !defaultStartDateProp && !valueProp;
+    const defaultValue = isEmptyReadOnly ? emptyReadOnlyMarker : defaultStartDateProp;
+    const [value, setValue] = core.useControlled({
+      controlled: valueProp,
+      default: defaultValue,
+      name: "DateInput",
+      state: "value"
+    });
+    const getDateValidationStatus = (value2) => isInvalidDate(value2) ? "error" : void 0;
+    const [dateStatus, setDateStatus] = React.useState(
+      getDateValidationStatus(value)
+    );
+    const isDisabled = disabled || formFieldDisabled;
+    const validationStatus = (_a = dateStatus != null ? dateStatus : formFieldValidationStatus) != null ? _a : validationStatusProp;
+    const [focused, setFocused] = React.useState(false);
+    const {
+      "aria-describedby": dateInputDescribedBy,
+      "aria-labelledby": dateInputLabelledBy,
+      onBlur,
+      onChange,
+      onFocus,
+      required: dateInputPropsRequired,
+      ...restDateInputProps
+    } = inputProps;
+    const isRequired = formFieldRequired ? ["required", "asterisk"].includes(formFieldRequired) : dateInputPropsRequired;
+    const format = (date) => {
+      const formattedDate = dateFormatter(date);
+      setValue(formattedDate);
+    };
+    const handleStartDateChange = (event) => {
+      setValue(event.target.value);
+      onChange == null ? void 0 : onChange(event);
+    };
+    const handleStartDateBlur = (event) => {
+      const stringDate = value;
+      value && format(stringDate);
+      onBlur == null ? void 0 : onBlur(event);
+      setDateStatus(getDateValidationStatus(stringDate));
+      setFocused(false);
+    };
+    const handleFocus = (event) => {
+      onFocus == null ? void 0 : onFocus(event);
+      setFocused(true);
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+      className: clsx.clsx(
+        withBaseName(),
+        withBaseName(variant),
+        {
+          [withBaseName("focused")]: !isDisabled && focused,
+          [withBaseName("disabled")]: isDisabled,
+          [withBaseName("readOnly")]: isReadOnly,
+          [withBaseName(validationStatus != null ? validationStatus : "")]: validationStatus
+        },
+        className
+      ),
+      ref,
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("input", {
+          "aria-describedby": clsx.clsx(formFieldDescribedBy, dateInputDescribedBy),
+          "aria-labelledby": clsx.clsx(formFieldLabelledBy, dateInputLabelledBy),
+          className: clsx.clsx(withBaseName("input"), inputProps == null ? void 0 : inputProps.className),
+          disabled: isDisabled,
+          readOnly: isReadOnly,
+          ref: inputRef,
+          role,
+          tabIndex: isDisabled ? -1 : 0,
+          onBlur: handleStartDateBlur,
+          onChange: handleStartDateChange,
+          onFocus: !isDisabled ? handleFocus : void 0,
+          placeholder,
+          value,
+          ...restA11yProps,
+          ...restDateInputProps,
+          required: isRequired
+        }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", {
+          className: withBaseName("activationIndicator")
+        })
+      ]
+    });
+  }
+);
+
+exports.DateInput = DateInput;
+//# sourceMappingURL=DateInput.js.map

package/dist-cjs/date-input/DateInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateInput.js","sources":["../src/date-input/DateInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEvent,\n  ComponentPropsWithoutRef,\n  FocusEvent,\n  forwardRef,\n  InputHTMLAttributes,\n  Ref,\n  useState,\n} from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport dateInputCss from \"./DateInput.css\";\nimport { makePrefixer, useControlled, useFormFieldProps } from \"@salt-ds/core\";\nimport { DateFormatter } from \"@internationalized/date\";\n\nconst withBaseName = makePrefixer(\"saltDateInput\");\n\nconst isInvalidDate = (value: string) =>\n  // @ts-ignore evaluating validity of date\n  value && isNaN(new Date(value));\n\nconst defaultDateFormatter = (input: string): string => {\n  const date = new Date(input);\n\n  return isInvalidDate(input)\n    ? input\n    : new DateFormatter(\"EN-GB\", {\n        day: \"2-digit\",\n        month: \"short\",\n        year: \"numeric\",\n      }).format(date);\n};\nexport interface DateInputProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n    Pick<\n      ComponentPropsWithoutRef<\"input\">,\n      \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n    > {\n  /**\n   * The marker to use in an empty read only DateInput.\n   * Use `''` to disable this feature. Defaults to '—'.\n   */\n  emptyReadOnlyMarker?: string;\n  /**\n   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes) applied to the `input` elements.\n   */\n  inputProps?: InputHTMLAttributes<HTMLInputElement>;\n  /**\n   * Optional ref for the dateInput component\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  /**\n   * If `true`, the component is read only.\n   */\n  readOnly?: boolean;\n  /**\n   * Validation status.\n   */\n  validationStatus?: \"error\" | \"warning\" | \"success\";\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n  /**\n   * Function to format the input value.\n   */\n  dateFormatter?: (input: string) => string;\n}\n\nexport const DateInput = forwardRef<HTMLDivElement, DateInputProps>(\n  function DateInput(\n    {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n      className,\n      disabled,\n      emptyReadOnlyMarker = \"—\",\n      inputProps = {},\n      inputRef,\n      readOnly: readOnlyProp,\n      role,\n      value: valueProp,\n      defaultValue: defaultStartDateProp = valueProp === undefined\n        ? \"\"\n        : undefined,\n      validationStatus: validationStatusProp,\n      variant = \"primary\",\n      dateFormatter = defaultDateFormatter,\n      placeholder = \"dd mmm yyyy\",\n      ...rest\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-dateInput\",\n      css: dateInputCss,\n      window: targetWindow,\n    });\n\n    const {\n      a11yProps: {\n        \"aria-describedby\": formFieldDescribedBy,\n        \"aria-labelledby\": formFieldLabelledBy,\n      } = {},\n      disabled: formFieldDisabled,\n      readOnly: formFieldReadOnly,\n      necessity: formFieldRequired,\n      validationStatus: formFieldValidationStatus,\n    } = useFormFieldProps();\n\n    const restA11yProps = {\n      \"aria-activedescendant\": ariaActiveDescendant,\n      \"aria-expanded\": ariaExpanded,\n      \"aria-owns\": ariaOwns,\n    };\n\n    const isReadOnly = readOnlyProp || formFieldReadOnly;\n    const isEmptyReadOnly = isReadOnly && !defaultStartDateProp && !valueProp;\n    const defaultValue = isEmptyReadOnly\n      ? emptyReadOnlyMarker\n      : defaultStartDateProp;\n    const [value, setValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValue,\n      name: \"DateInput\",\n      state: \"value\",\n    });\n\n    const getDateValidationStatus = (value: string) =>\n      isInvalidDate(value) ? \"error\" : undefined;\n\n    const [dateStatus, setDateStatus] = useState<\"error\" | undefined>(\n      getDateValidationStatus(value as string)\n    );\n\n    const isDisabled = disabled || formFieldDisabled;\n    const validationStatus =\n      dateStatus ?? formFieldValidationStatus ?? validationStatusProp;\n\n    const [focused, setFocused] = useState(false);\n\n    const {\n      \"aria-describedby\": dateInputDescribedBy,\n      \"aria-labelledby\": dateInputLabelledBy,\n      onBlur,\n      onChange,\n      onFocus,\n      required: dateInputPropsRequired,\n      ...restDateInputProps\n    } = inputProps;\n\n    const isRequired = formFieldRequired\n      ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n      : dateInputPropsRequired;\n\n    const format = (date: string) => {\n      const formattedDate = dateFormatter(date);\n      setValue(formattedDate);\n    };\n    const handleStartDateChange = (event: ChangeEvent<HTMLInputElement>) => {\n      setValue(event.target.value);\n      onChange?.(event);\n    };\n\n    const handleStartDateBlur = (event: FocusEvent<HTMLInputElement>) => {\n      const stringDate = value as string;\n      value && format(stringDate);\n      onBlur?.(event);\n      setDateStatus(getDateValidationStatus(stringDate));\n      setFocused(false);\n    };\n\n    const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n      onFocus?.(event);\n      setFocused(true);\n    };\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"focused\")]: !isDisabled && focused,\n            [withBaseName(\"disabled\")]: isDisabled,\n            [withBaseName(\"readOnly\")]: isReadOnly,\n            [withBaseName(validationStatus ?? \"\")]: validationStatus,\n          },\n          className\n        )}\n        ref={ref}\n        {...rest}\n      >\n        <input\n          aria-describedby={clsx(formFieldDescribedBy, dateInputDescribedBy)}\n          aria-labelledby={clsx(formFieldLabelledBy, dateInputLabelledBy)}\n          className={clsx(withBaseName(\"input\"), inputProps?.className)}\n          disabled={isDisabled}\n          readOnly={isReadOnly}\n          ref={inputRef}\n          role={role}\n          tabIndex={isDisabled ? -1 : 0}\n          onBlur={handleStartDateBlur}\n          onChange={handleStartDateChange}\n          onFocus={!isDisabled ? handleFocus : undefined}\n          placeholder={placeholder}\n          value={value}\n          {...restA11yProps}\n          {...restDateInputProps}\n          required={isRequired}\n        />\n        <div className={withBaseName(\"activationIndicator\")} />\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","date","DateFormatter","forwardRef","DateInput","useWindow","useComponentCssInjection","dateInputCss","useFormFieldProps","useControlled","value","useState","jsxs","clsx","jsx"],"mappings":"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"}

package/dist-cjs/deck-item/DeckItem.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltDeckItem {\n  display: inline-block;\n}\n\n.saltDeckLayout-slide-vertical .saltDeckItem {\n  display: block;\n}\n\n.saltDeckItem-fade-previous,\n.saltDeckItem-fade-next,\n.saltDeckItem-static-previous,\n.saltDeckItem-static-next {\n  display: none;\n}\n\n.saltDeckItem-fade-in {\n  animation: var(--salt-animation-fade-in-center);\n}\n.saltDeckItem-fade-out {\n  animation: var(--salt-animation-fade-out-back);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=DeckItem.css.js.map

package/dist-cjs/deck-item/DeckItem.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeckItem.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist-cjs/deck-item/DeckItem.js

@@ -0,0 +1,62 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var clsx = require('clsx');
+var React = require('react');
+var core = require('@salt-ds/core');
+var window = require('@salt-ds/window');
+var styles = require('@salt-ds/styles');
+var DeckItem$1 = require('./DeckItem.css.js');
+
+const withBaseName = core.makePrefixer("saltDeckItem");
+const DeckItem = React.forwardRef(
+  function DeckItem2({
+    activeIndex = 0,
+    animation,
+    children,
+    className,
+    index,
+    role = "group",
+    id: idProp,
+    ...rest
+  }, ref) {
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-deck-item",
+      css: DeckItem$1,
+      window: targetWindow
+    });
+    const sliderRef = React.useRef(null);
+    const isCurrent = activeIndex === index;
+    const position = React.useMemo(() => {
+      return isCurrent ? "current" : activeIndex < index ? "next" : "previous";
+    }, [activeIndex, index, isCurrent]);
+    const classesIndex = animation && position === "current" ? 0 : 1;
+    const getActiveClasses = [
+      `${animation || "fade"}-in`,
+      `${animation || "fade"}-out`
+    ];
+    const id = core.useId(idProp);
+    return /* @__PURE__ */ jsxRuntime.jsx("div", {
+      className: clsx.clsx(
+        withBaseName(),
+        withBaseName(`${animation ? animation : "static"}-${position}`),
+        {
+          [withBaseName(getActiveClasses[classesIndex])]: animation === "fade"
+        },
+        className
+      ),
+      ref: core.useForkRef(ref, sliderRef),
+      role,
+      tabIndex: isCurrent ? 0 : -1,
+      id,
+      ...rest,
+      children
+    });
+  }
+);
+
+exports.DeckItem = DeckItem;
+//# sourceMappingURL=DeckItem.js.map

package/dist-cjs/deck-item/DeckItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeckItem.js","sources":["../src/deck-item/DeckItem.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, useMemo, useRef } from \"react\";\nimport { makePrefixer, useForkRef, useId } from \"@salt-ds/core\";\nimport { LayoutAnimation } from \"../deck-layout\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport deckItemCss from \"./DeckItem.css\";\n\nconst withBaseName = makePrefixer(\"saltDeckItem\");\n\nexport interface DeckItemProps extends HTMLAttributes<HTMLDivElement> {\n  activeIndex?: number;\n  animation?: LayoutAnimation;\n  index: number;\n  role?: string;\n}\n\nexport const DeckItem = forwardRef<HTMLDivElement, DeckItemProps>(\n  function DeckItem(\n    {\n      activeIndex = 0,\n      animation,\n      children,\n      className,\n      index,\n      role = \"group\",\n      id: idProp,\n      ...rest\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-deck-item\",\n      css: deckItemCss,\n      window: targetWindow,\n    });\n\n    const sliderRef = useRef<HTMLDivElement | null>(null);\n\n    const isCurrent = activeIndex === index;\n\n    const position = useMemo(() => {\n      return isCurrent ? \"current\" : activeIndex < index ? \"next\" : \"previous\";\n    }, [activeIndex, index, isCurrent]);\n\n    const classesIndex = animation && position === \"current\" ? 0 : 1;\n\n    const getActiveClasses = [\n      `${animation || \"fade\"}-in`, // in-right\n      `${animation || \"fade\"}-out`, // out-left\n    ];\n\n    const id = useId(idProp);\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          withBaseName(`${animation ? animation : \"static\"}-${position}`),\n          {\n            [withBaseName(getActiveClasses[classesIndex])]:\n              animation === \"fade\",\n          },\n          className\n        )}\n        ref={useForkRef(ref, sliderRef)}\n        role={role}\n        tabIndex={isCurrent ? 0 : -1}\n        id={id}\n        {...rest}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","DeckItem","useWindow","useComponentCssInjection","deckItemCss","useRef","useMemo","useId","jsx","clsx","useForkRef"],"mappings":";;;;;;;;;;;;AAUA,MAAM,YAAA,GAAeA,kBAAa,cAAc,CAAA,CAAA;AASzC,MAAM,QAAW,GAAAC,gBAAA;AAAA,EACtB,SAASC,SACP,CAAA;AAAA,IACE,WAAc,GAAA,CAAA;AAAA,IACd,SAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAO,GAAA,OAAA;AAAA,IACP,EAAI,EAAA,MAAA;AAAA,IACD,GAAA,IAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,SAAA,GAAYC,aAA8B,IAAI,CAAA,CAAA;AAEpD,IAAA,MAAM,YAAY,WAAgB,KAAA,KAAA,CAAA;AAElC,IAAM,MAAA,QAAA,GAAWC,cAAQ,MAAM;AAC7B,MAAA,OAAO,SAAY,GAAA,SAAA,GAAY,WAAc,GAAA,KAAA,GAAQ,MAAS,GAAA,UAAA,CAAA;AAAA,KAC7D,EAAA,CAAC,WAAa,EAAA,KAAA,EAAO,SAAS,CAAC,CAAA,CAAA;AAElC,IAAA,MAAM,YAAe,GAAA,SAAA,IAAa,QAAa,KAAA,SAAA,GAAY,CAAI,GAAA,CAAA,CAAA;AAE/D,IAAA,MAAM,gBAAmB,GAAA;AAAA,MACvB,GAAG,SAAa,IAAA,MAAA,CAAA,GAAA,CAAA;AAAA,MAChB,GAAG,SAAa,IAAA,MAAA,CAAA,IAAA,CAAA;AAAA,KAClB,CAAA;AAEA,IAAM,MAAA,EAAA,GAAKC,WAAM,MAAM,CAAA,CAAA;AAEvB,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,YAAa,CAAA,CAAA,EAAG,SAAY,GAAA,SAAA,GAAY,YAAY,QAAU,CAAA,CAAA,CAAA;AAAA,QAC9D;AAAA,UACE,CAAC,YAAA,CAAa,gBAAiB,CAAA,YAAA,CAAa,IAC1C,SAAc,KAAA,MAAA;AAAA,SAClB;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,GAAA,EAAKC,eAAW,CAAA,GAAA,EAAK,SAAS,CAAA;AAAA,MAC9B,IAAA;AAAA,MACA,QAAA,EAAU,YAAY,CAAI,GAAA,CAAA,CAAA;AAAA,MAC1B,EAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/deck-layout/DeckLayout.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltDeckLayout {\n  overflow: hidden;\n}\n\n.saltDeckLayout-animate {\n  white-space: nowrap;\n}\n\n.saltDeckLayout-slide-horizontal {\n  width: var(--deckLayout-width);\n  transition: transform var(--salt-animation-duration);\n  transform: translateX(var(--deckLayout-transform-value));\n}\n\n.saltDeckLayout-slide-vertical {\n  height: var(--deckLayout-height);\n  transition: transform var(--salt-animation-duration);\n  transform: translateY(var(--deckLayout-transform-value));\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=DeckLayout.css.js.map

package/dist-cjs/deck-layout/DeckLayout.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeckLayout.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist-cjs/deck-layout/DeckLayout.js

@@ -0,0 +1,96 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var core = require('@salt-ds/core');
+var DeckItem = require('../deck-item/DeckItem.js');
+require('../responsive/useResizeObserver.js');
+var useWidth = require('../responsive/useWidth.js');
+var clsx = require('clsx');
+var window = require('@salt-ds/window');
+var styles = require('@salt-ds/styles');
+var DeckLayout$1 = require('./DeckLayout.css.js');
+
+const withBaseName = core.makePrefixer("saltDeckLayout");
+const DeckLayout = React.forwardRef(
+  function DeckLayout2({
+    activeIndex = 0,
+    animation,
+    className,
+    children,
+    direction = "horizontal",
+    style,
+    deckItemProps,
+    ...rest
+  }, ref) {
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-deck-layout",
+      css: DeckLayout$1,
+      window: targetWindow
+    });
+    const [deckItemRef, deckItemWidth] = useWidth.useWidth(true);
+    const [deckItemHeight, setDeckItemHeight] = React.useState(0);
+    const handleResize = React.useCallback(
+      function handleResize2(contentRect) {
+        setDeckItemHeight(contentRect.height);
+      },
+      []
+    );
+    core.useIsomorphicLayoutEffect(() => {
+      if (!deckItemRef.current) {
+        return void 0;
+      }
+      handleResize(deckItemRef.current.getBoundingClientRect());
+      const observer = new ResizeObserver(
+        ([{ contentRect }]) => {
+          handleResize(contentRect);
+        }
+      );
+      observer.observe(deckItemRef.current);
+      return () => {
+        observer.disconnect();
+      };
+    }, [deckItemRef, handleResize]);
+    const deckLayoutStyles = {
+      ...style,
+      "--deckLayout-width": `${deckItemWidth}px`,
+      "--deckLayout-height": `${deckItemHeight}px`
+    };
+    const innerStyles = {
+      "--deckLayout-transform-value": `-${activeIndex * 100}%`
+    };
+    return /* @__PURE__ */ jsxRuntime.jsx("div", {
+      className: clsx.clsx(withBaseName(), className),
+      style: deckLayoutStyles,
+      ref,
+      ...rest,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+        className: clsx.clsx(
+          {
+            [withBaseName("animate")]: animation
+          },
+          {
+            [withBaseName(`${animation || "slide"}-${direction}`)]: animation
+          }
+        ),
+        style: innerStyles,
+        children: React.Children.map(children, (child, index) => {
+          return /* @__PURE__ */ jsxRuntime.jsx(DeckItem.DeckItem, {
+            ref: deckItemRef,
+            index,
+            activeIndex,
+            animation,
+            ...deckItemProps,
+            children: child
+          });
+        })
+      })
+    });
+  }
+);
+
+exports.DeckLayout = DeckLayout;
+//# sourceMappingURL=DeckLayout.js.map

package/dist-cjs/deck-layout/DeckLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeckLayout.js","sources":["../src/deck-layout/DeckLayout.tsx"],"sourcesContent":["import {\n  Children,\n  CSSProperties,\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useState,\n} from \"react\";\nimport { makePrefixer, useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport { DeckItem, DeckItemProps } from \"../deck-item\";\nimport { useWidth } from \"../responsive\";\n\nimport { clsx } from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport deckLayoutCss from \"./DeckLayout.css\";\n\nexport type LayoutAnimation = \"slide\" | \"fade\";\nexport type LayoutAnimationDirection = \"horizontal\" | \"vertical\";\nexport type LayoutAnimationTransition = \"increase\" | \"decrease\";\n\nexport interface DeckLayoutProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * The initial item to render.\n   **/\n  activeIndex?: number;\n  /**\n   * The animation when the slides are shown.\n   **/\n  animation?: LayoutAnimation;\n  /**\n   * The direction in which items will transition.\n   **/\n  direction?: LayoutAnimationDirection;\n  /**\n   * Props to be passed to the DeckItem component.\n   */\n  deckItemProps?: Partial<DeckItemProps>;\n}\n\nconst withBaseName = makePrefixer(\"saltDeckLayout\");\n\nexport const DeckLayout = forwardRef<HTMLDivElement, DeckLayoutProps>(\n  function DeckLayout(\n    {\n      activeIndex = 0,\n      animation,\n      className,\n      children,\n      direction = \"horizontal\",\n      style,\n      deckItemProps,\n      ...rest\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-deck-layout\",\n      css: deckLayoutCss,\n      window: targetWindow,\n    });\n\n    const [deckItemRef, deckItemWidth] = useWidth<HTMLDivElement>(true);\n\n    const [deckItemHeight, setDeckItemHeight] = useState<number>(0);\n\n    const handleResize = useCallback(function handleResize(\n      contentRect: DOMRect\n    ) {\n      setDeckItemHeight(contentRect.height);\n    },\n    []);\n\n    useIsomorphicLayoutEffect(() => {\n      if (!deckItemRef.current) {\n        return undefined;\n      }\n\n      handleResize(deckItemRef.current.getBoundingClientRect());\n\n      const observer = new ResizeObserver(\n        ([{ contentRect }]: ResizeObserverEntry[]) => {\n          handleResize(contentRect);\n        }\n      );\n      observer.observe(deckItemRef.current);\n\n      return () => {\n        observer.disconnect();\n      };\n    }, [deckItemRef, handleResize]);\n\n    const deckLayoutStyles = {\n      ...style,\n      \"--deckLayout-width\": `${deckItemWidth}px`,\n      \"--deckLayout-height\": `${deckItemHeight}px`,\n    };\n\n    const innerStyles = {\n      \"--deckLayout-transform-value\": `-${activeIndex * 100}%`,\n    } as CSSProperties;\n\n    return (\n      <div\n        className={clsx(withBaseName(), className)}\n        style={deckLayoutStyles}\n        ref={ref}\n        {...rest}\n      >\n        <div\n          className={clsx(\n            {\n              [withBaseName(\"animate\")]: animation,\n            },\n            {\n              [withBaseName(`${animation || \"slide\"}-${direction}`)]: animation,\n            }\n          )}\n          style={innerStyles}\n        >\n          {Children.map(children, (child, index) => {\n            return (\n              <DeckItem\n                ref={deckItemRef}\n                index={index}\n                activeIndex={activeIndex}\n                animation={animation}\n                {...deckItemProps}\n              >\n                {child}\n              </DeckItem>\n            );\n          })}\n        </div>\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","DeckLayout","useWindow","useComponentCssInjection","deckLayoutCss","useWidth","useState","useCallback","handleResize","useIsomorphicLayoutEffect","jsx","clsx","Children","DeckItem"],"mappings":"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"}

package/dist-cjs/dropdown/Dropdown.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltDropdown {\n  --saltIcon-margin: 2px 0 0 8px;\n  display: inline-block;\n  line-height: 0;\n  position: relative;\n}\n\n.saltDropdown-fullWidth {\n  width: 100%;\n}\n\n.saltDropdown-popup {\n  background: var(--salt-container-primary-background);\n  z-index: calc(var(--salt-zIndex-flyover) - 1);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=Dropdown.css.js.map

package/dist-cjs/dropdown/Dropdown.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist-cjs/dropdown/Dropdown.js

@@ -0,0 +1,134 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var React = require('react');
+var collectionProvider = require('../common-hooks/collectionProvider.js');
+var itemToString = require('../common-hooks/itemToString.js');
+require('../common-hooks/keyUtils.js');
+var useCollectionItems = require('../common-hooks/useCollectionItems.js');
+require('../responsive/useResizeObserver.js');
+var forwardCallbackProps = require('../utils/forwardCallbackProps.js');
+var List = require('../list/List.js');
+var DropdownBase = require('./DropdownBase.js');
+var DropdownButton = require('./DropdownButton.js');
+var useDropdown = require('./useDropdown.js');
+
+const Dropdown = React.forwardRef(function Dropdown2({
+  "aria-label": ariaLabel,
+  children,
+  defaultIsOpen,
+  defaultSelected,
+  id: idProp,
+  isOpen: isOpenProp,
+  itemToString: itemToString$1 = itemToString.itemToString,
+  onOpenChange,
+  onSelectionChange,
+  onSelect,
+  selected: selectedProp,
+  selectionStrategy,
+  source,
+  triggerComponent,
+  ListItem,
+  ListProps: ListProps2,
+  width = 180,
+  ...props
+}, forwardedRef) {
+  const id = core.useIdMemo(idProp);
+  const rootRef = React.useRef(null);
+  const forkedRef = core.useForkRef(rootRef, forwardedRef);
+  const collectionHook = useCollectionItems.useCollectionItems({
+    id,
+    source,
+    children,
+    options: {
+      itemToString: itemToString$1
+    }
+  });
+  const {
+    highlightedIndex,
+    triggerLabel,
+    listHandlers,
+    listControlProps,
+    selected,
+    ...dropdownListHook
+  } = useDropdown.useDropdown({
+    collectionHook,
+    defaultHighlightedIndex: ListProps2 == null ? void 0 : ListProps2.defaultHighlightedIndex,
+    defaultIsOpen,
+    defaultSelected: collectionHook.itemToCollectionItem(defaultSelected),
+    highlightedIndex: ListProps2 == null ? void 0 : ListProps2.highlightedIndex,
+    isOpen: isOpenProp,
+    itemToString: itemToString$1,
+    label: "Dropdown",
+    onHighlight: ListProps2 == null ? void 0 : ListProps2.onHighlight,
+    onOpenChange,
+    onSelectionChange,
+    onSelect,
+    selected: collectionHook.itemToCollectionItem(selectedProp),
+    selectionStrategy
+  });
+  const collectionItemsToItem = React.useCallback(
+    (itemOrItems) => {
+      if (Array.isArray(itemOrItems)) {
+        return itemOrItems.map((i) => i.value);
+      } else if (itemOrItems) {
+        return itemOrItems.value;
+      }
+    },
+    []
+  );
+  const getTriggerComponent = () => {
+    const ariaProps = {
+      "aria-activedescendant": dropdownListHook.isOpen ? listControlProps == null ? void 0 : listControlProps["aria-activedescendant"] : void 0,
+      "aria-label": ariaLabel
+    };
+    if (triggerComponent) {
+      const ownProps = triggerComponent.props;
+      return React.cloneElement(
+        triggerComponent,
+        forwardCallbackProps.forwardCallbackProps(ownProps, {
+          ...dropdownListHook.isOpen ? listControlProps : {},
+          ...ariaProps
+        })
+      );
+    } else {
+      return /* @__PURE__ */ jsxRuntime.jsx(DropdownButton.DropdownButton, {
+        label: triggerLabel,
+        ...dropdownListHook.isOpen ? listControlProps : {},
+        ...ariaProps
+      });
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(collectionProvider.CollectionProvider, {
+    collectionHook,
+    children: /* @__PURE__ */ jsxRuntime.jsxs(DropdownBase.DropdownBase, {
+      ...props,
+      id,
+      isOpen: dropdownListHook.isOpen,
+      onOpenChange: dropdownListHook.onOpenChange,
+      ref: forkedRef,
+      width,
+      children: [
+        getTriggerComponent(),
+        /* @__PURE__ */ jsxRuntime.jsx(List.List, {
+          ListItem,
+          itemToString: itemToString$1,
+          ...ListProps2,
+          highlightedIndex,
+          listHandlers,
+          onSelectionChange,
+          onSelect,
+          selected: collectionItemsToItem(selected),
+          selectionStrategy,
+          "data-testid": "dropdown-list"
+        })
+      ]
+    })
+  });
+});
+
+exports.Dropdown = Dropdown;
+//# sourceMappingURL=Dropdown.js.map

package/dist-cjs/dropdown/Dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.js","sources":["../src/dropdown/Dropdown.tsx"],"sourcesContent":["import { useForkRef, useIdMemo as useId } from \"@salt-ds/core\";\nimport {\n  cloneElement,\n  ForwardedRef,\n  forwardRef,\n  ReactElement,\n  useCallback,\n  useRef,\n} from \"react\";\n\nimport {\n  CollectionItem,\n  CollectionProvider,\n  itemToString as defaultItemToString,\n  SelectionProps,\n  SelectionStrategy,\n  SingleSelectionStrategy,\n  useCollectionItems,\n} from \"../common-hooks\";\nimport { List } from \"../list/List\";\nimport { ListProps } from \"../list/listTypes\";\nimport { DropdownBase, MaybeChildProps } from \"./DropdownBase\";\nimport { DropdownButton } from \"./DropdownButton\";\nimport { DropdownBaseProps } from \"./dropdownTypes\";\nimport { useDropdown } from \"./useDropdown\";\nimport { forwardCallbackProps } from \"../utils\";\n\nexport interface DropdownProps<\n  Item = string,\n  Selection extends SelectionStrategy = \"default\"\n> extends DropdownBaseProps,\n    Pick<\n      ListProps<Item, Selection>,\n      \"ListItem\" | \"itemToString\" | \"source\" | \"width\"\n    >,\n    SelectionProps<Item, Selection> {\n  ListProps?: Omit<\n    ListProps<Item, Selection>,\n    \"ListItem\" | \"itemToString\" | \"source\"\n  >;\n}\n\nexport const Dropdown = forwardRef(function Dropdown<\n  Item = string,\n  Selection extends SelectionStrategy = \"default\"\n>(\n  {\n    \"aria-label\": ariaLabel,\n    children,\n    defaultIsOpen,\n    defaultSelected,\n    id: idProp,\n    isOpen: isOpenProp,\n    itemToString = defaultItemToString,\n    onOpenChange,\n    onSelectionChange,\n    onSelect,\n    selected: selectedProp,\n    selectionStrategy,\n    source,\n    triggerComponent,\n    ListItem,\n    ListProps,\n    width = 180,\n    ...props\n  }: DropdownProps<Item, Selection>,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const id = useId(idProp);\n  const rootRef = useRef<HTMLDivElement>(null);\n  const forkedRef = useForkRef<HTMLDivElement>(rootRef, forwardedRef);\n\n  const collectionHook = useCollectionItems<Item>({\n    id,\n    source,\n    children,\n    options: {\n      itemToString,\n    },\n  });\n\n  const {\n    highlightedIndex,\n    triggerLabel,\n    listHandlers,\n    listControlProps,\n    selected,\n    ...dropdownListHook\n  } = useDropdown<Item, Selection>({\n    collectionHook,\n    defaultHighlightedIndex: ListProps?.defaultHighlightedIndex,\n    defaultIsOpen,\n    defaultSelected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof defaultSelected\n    >(defaultSelected),\n    highlightedIndex: ListProps?.highlightedIndex,\n    isOpen: isOpenProp,\n    itemToString,\n    label: \"Dropdown\",\n    onHighlight: ListProps?.onHighlight,\n    onOpenChange,\n    onSelectionChange,\n    onSelect,\n    selected: collectionHook.itemToCollectionItem<\n      Selection,\n      typeof selectedProp\n    >(selectedProp),\n    selectionStrategy,\n  });\n\n  const collectionItemsToItem = useCallback(\n    (\n      itemOrItems?: CollectionItem<Item> | null | CollectionItem<Item>[]\n    ):\n      | undefined\n      | (Selection extends SingleSelectionStrategy ? Item | null : Item[]) => {\n      type returnType = Selection extends SingleSelectionStrategy\n        ? Item | null\n        : Item[];\n      if (Array.isArray(itemOrItems)) {\n        return itemOrItems.map((i) => i.value) as returnType;\n      } else if (itemOrItems) {\n        return itemOrItems.value as returnType;\n      }\n    },\n    []\n  );\n\n  const getTriggerComponent = () => {\n    const ariaProps = {\n      \"aria-activedescendant\": dropdownListHook.isOpen\n        ? listControlProps?.[\"aria-activedescendant\"]\n        : undefined,\n      \"aria-label\": ariaLabel,\n    };\n    if (triggerComponent) {\n      const ownProps = triggerComponent.props as MaybeChildProps;\n      return cloneElement(\n        triggerComponent,\n        forwardCallbackProps(ownProps, {\n          ...(dropdownListHook.isOpen ? listControlProps : {}),\n          ...ariaProps,\n        })\n      );\n    } else {\n      return (\n        <DropdownButton\n          label={triggerLabel}\n          {...(dropdownListHook.isOpen ? listControlProps : {})}\n          {...ariaProps}\n        />\n      );\n    }\n  };\n\n  return (\n    <CollectionProvider<Item> collectionHook={collectionHook}>\n      <DropdownBase\n        {...props}\n        id={id}\n        isOpen={dropdownListHook.isOpen}\n        onOpenChange={dropdownListHook.onOpenChange}\n        ref={forkedRef}\n        width={width}\n      >\n        {getTriggerComponent()}\n        <List<Item, Selection>\n          ListItem={ListItem}\n          itemToString={itemToString}\n          {...ListProps}\n          highlightedIndex={highlightedIndex}\n          listHandlers={listHandlers}\n          onSelectionChange={onSelectionChange}\n          onSelect={onSelect}\n          selected={collectionItemsToItem(selected)}\n          selectionStrategy={selectionStrategy}\n          data-testid=\"dropdown-list\"\n        />\n      </DropdownBase>\n    </CollectionProvider>\n  );\n}) as <Item, Selection extends SelectionStrategy = \"default\">(\n  props: DropdownProps<Item, Selection> & {\n    ref?: ForwardedRef<HTMLDivElement>;\n  }\n) => ReactElement<DropdownProps<Item, Selection>>;\n"],"names":["forwardRef","Dropdown","itemToString","defaultItemToString","ListProps","useId","useRef","useForkRef","useCollectionItems","useDropdown","useCallback","cloneElement","forwardCallbackProps","jsx","DropdownButton","CollectionProvider","jsxs","DropdownBase","List"],"mappings":"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"}