@salt-ds/lab 1.0.0-alpha.11 → 1.0.0-alpha.12

package/dist-cjs/accordion/Accordion.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".saltAccordion {\n  --accordion-borderStyle: var(--saltAccordion-borderStyle, none);\n  --accordion-borderColor: var(--saltAccordion-borderColor, transparent);\n  --accordion-borderWidth: var(--saltAccordion-borderWidth, 0);\n  --accordion-borderRadius: var(--saltAccordion-borderRadius, 0);\n  --accordion-padding: var(--saltAccordion-padding, 0);\n  --accordion-margin: var(--saltAccordion-margin, 0);\n}\n\n.saltAccordion {\n  border-style: var(--accordion-borderStyle);\n  border-color: var(--accordion-borderColor);\n  border-width: var(--accordion-borderWidth);\n  padding: var(--accordion-padding);\n  margin: var(--accordion-margin);\n  border-radius: var(--accordion-borderRadius);\n}\n\n.salt-density-high {\n  --accordion-summary-paddingLeft: 20px;\n  --accordion-details-padding: 3px 4px 5px 20px;\n}\n\n.salt-density-medium {\n  --accordion-summary-paddingLeft: 28px;\n  --accordion-details-padding: 8px 8px 9px 28px;\n}\n\n.salt-density-low {\n  --accordion-summary-paddingLeft: 36px;\n  --accordion-details-padding: 12px 12px 13px 38px;\n}\n\n.salt-density-touch {\n  --accordion-summary-paddingLeft: 44px;\n  --accordion-details-padding: 18px 16px 17px 44px;\n}\n\n.saltAccordionSection {\n  --accordion-summary-height: var(--saltAccordion-summary-height, var(--salt-size-stackable));\n  --accordion-summary-fontWeight: var(--saltAccordion-summary-fontWeight, initial);\n\n  --accordion-summary-background: var(--saltAccordion-summary-background, var(--salt-container-primary-background));\n  --accordion-summary-background-active: var(--saltAccordion-summary-background-active, var(--salt-container-primary-background));\n  --accordion-summary-background-disabled: var(--saltAccordion-summary-background-disabled, var(--salt-container-primary-background));\n  --accordion-summary-background-hover: var(--saltAccordion-summary-background-hover, var(--salt-actionable-primary-background-hover));\n\n  --accordion-summary-text-color: var(--saltAccordion-summary-text-color, var(--salt-text-primary-foreground));\n  --accordion-summary-text-color-active: var(--saltAccordion-summary-text-color-active, var(--salt-text-primary-foreground));\n  --accordion-summary-text-color-disabled: var(--saltAccordion-summary-text-color-disabled, var(--salt-text-primary-foreground-disabled));\n  --accordion-summary-text-color-hover: var(--saltAccordion-summary-text-color-hover, var(--salt-text-primary-foreground));\n\n  --accordion-summary-icon-transition-default: transform 150ms cubic-bezier(0.4, 0, 0.2, 1);\n  --accordion-summary-icon-transform: var(--saltAccordion-summary-icon-expand-transform, rotate(90deg));\n  --accordion-summary-icon-transition: var(--saltAccordion-summary-icon-transition, var(--accordion-summary-icon-transition-default));\n}\n\n.saltAccordionSection {\n  border-color: var(--saltAccordion-section-borderColor, var(--salt-separable-secondary-borderColor));\n  border-style: var(--saltAccordion-section-borderStyle, var(--salt-container-borderStyle));\n  border-width: var(--saltAccordion-section-borderWidth, 0 0 1px 0);\n  margin: var(--saltAccordion-section-margin, 0);\n  position: relative;\n}\n\n.saltAccordionSection:focus-within {\n  z-index: var(--salt-zIndex-default);\n}\n\n.saltAccordionSection-expanded {\n}\n\n.saltAccordionSection-disabled {\n}\n\n.saltAccordionSummary {\n  height: var(--accordion-summary-height);\n  line-height: var(--accordion-summary-height);\n  font-weight: var(--accordion-summary-fontWeight);\n  background: var(--accordion-summary-background);\n  color: var(--accordion-summary-text-color);\n  font-size: var(--saltAccordion-summary-fontSize, var(--salt-text-fontSize));\n  font-family: var(--saltAccordion-summary-fontFamily, var(--salt-text-fontFamily));\n  display: flex;\n  align-items: center;\n}\n\n.saltAccordionSummary:focus-visible {\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-color: var(--salt-focused-outlineColor);\n  outline-offset: var(--salt-focused-outlineOffset);\n}\n\n.saltAccordionSummary:hover {\n  background: var(--accordion-summary-background-hover);\n  color: var(--accordion-summary-text-color-hover);\n  cursor: var(--salt-selectable-cursor-hover);\n}\n\n.saltAccordionSummary-expanded {\n  background: var(--accordion-summary-background-active);\n  color: var(--accordion-summary-text-color-active);\n}\n\n.saltAccordionSummary-disabled,\n.saltAccordionSummary.saltAccordionSummary-disabled:hover {\n  background: var(--accordion-summary-background-disabled);\n  color: var(--accordion-summary-text-color-disabled);\n  cursor: var(--salt-selectable-cursor-disabled);\n}\n\n.saltAccordionSummary-icon {\n  width: var(--accordion-summary-paddingLeft);\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  transition: var(--accordion-summary-icon-transition);\n}\n\n.saltAccordionSummary-expanded .saltAccordionSummary-icon {\n  transform: var(--accordion-summary-icon-transform);\n}\n\n.saltAccordionDetails {\n  transition: height 150ms cubic-bezier(0.4, 0, 0.2, 1);\n  overflow: hidden;\n}\n\n.saltAccordionDetails-content {\n  padding: var(--saltAccordion-details-padding, var(--accordion-details-padding));\n}\n\n.saltAccordionDetails-disabled {\n}\n\n.saltAccordionDetails-dummy {\n  position: fixed;\n  top: -10000px;\n  left: 0;\n}\n";
+var css_248z = ".saltAccordion {\n  border-bottom: var(--salt-size-border) var(--salt-separable-borderStyle) var(--salt-separable-tertiary-borderColor);\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=Accordion.css.js.map

package/dist-cjs/accordion/Accordion.js

@@ -12,122 +12,47 @@ var styles = require('@salt-ds/styles');
 var Accordion$1 = require('./Accordion.css.js');
 
 const withBaseName = core.makePrefixer("saltAccordion");
-function sliceToSize(items, size) {
-  if (size !== void 0) {
-    const cutOffCount = items ? items.length - size : 0;
-    if (cutOffCount > 0) {
-      items = items.slice(cutOffCount);
-    }
-  }
-  return items;
-}
 const Accordion = React.forwardRef(
-  function Accordion2({
-    disabled = false,
-    expandedSectionIds: expandedSectionIdsProp,
-    defaultExpandedSectionIds = [],
-    maxExpandedItems,
-    onChange: onChangeProp,
-    className,
-    children,
-    ...restProps
-  }, ref) {
+  function Accordion2(props, ref) {
+    const {
+      className,
+      defaultExpanded,
+      expanded: expandedProp,
+      disabled,
+      id: idProp,
+      onToggle,
+      value,
+      ...rest
+    } = props;
+    const id = core.useId(idProp);
     const targetWindow = window.useWindow();
     styles.useComponentCssInjection({
       testId: "salt-accordion",
       css: Accordion$1,
       window: targetWindow
     });
-    const [sectionIds, setSectionIds] = React.useState(/* @__PURE__ */ new Set());
-    const [expandedSectionIds, setExpandedSectionIds] = core.useControlled(
-      {
-        controlled: expandedSectionIdsProp,
-        default: defaultExpandedSectionIds,
-        name: "Accordion",
-        state: "ExpandedSectionIds"
-      }
-    );
-    const registerSection = React.useCallback(
-      (sectionId, isExpanded2) => {
-        setSectionIds((sectionIds2) => {
-          const newSectionIds = new Set(sectionIds2);
-          newSectionIds.add(sectionId);
-          return newSectionIds;
-        });
-        if (isExpanded2) {
-          setExpandedSectionIds((oldExpandedSectionIds) => {
-            const newExpandedSectionIds = [...oldExpandedSectionIds];
-            newExpandedSectionIds.push(sectionId);
-            return newExpandedSectionIds;
-          });
-        }
-      },
-      []
-    );
-    const unregisterSection = React.useCallback((sectionId) => {
-      if (expandedSectionIds.includes(sectionId)) {
-        setExpandedSectionIds(
-          (oldValue) => oldValue.filter((id) => id !== sectionId)
-        );
-      }
-      setSectionIds((sectionIds2) => {
-        const newSectionIds = new Set(sectionIds2);
-        newSectionIds.delete(sectionId);
-        return newSectionIds;
-      });
-    }, []);
-    React.useEffect(() => {
-      if (expandedSectionIds && maxExpandedItems !== void 0 && expandedSectionIds.length > maxExpandedItems) {
-        const newExpandedSectionIds = sliceToSize(
-          expandedSectionIds,
-          maxExpandedItems
-        );
-        setExpandedSectionIds(newExpandedSectionIds || []);
-        if (onChangeProp) {
-          onChangeProp(newExpandedSectionIds || null);
-        }
-      }
-    }, [maxExpandedItems]);
-    const onChange = React.useCallback(
-      (sectionId, isExpanded2) => {
-        let newExpandedSectionIds = [...expandedSectionIds];
-        if (isExpanded2) {
-          newExpandedSectionIds.push(sectionId);
-          if (maxExpandedItems != null && newExpandedSectionIds.length > maxExpandedItems) {
-            newExpandedSectionIds.shift();
-          }
-        } else {
-          newExpandedSectionIds = newExpandedSectionIds.filter(
-            (id) => id !== sectionId
-          );
-        }
-        setExpandedSectionIds(newExpandedSectionIds);
-        if (onChangeProp) {
-          onChangeProp(newExpandedSectionIds);
-        }
+    const [expanded, setExpanded] = core.useControlled({
+      controlled: expandedProp,
+      default: Boolean(defaultExpanded),
+      name: "Accordion",
+      state: "expanded"
+    });
+    const toggle = (event) => {
+      setExpanded((prev) => !prev);
+      onToggle == null ? void 0 : onToggle(event);
+    };
+    return /* @__PURE__ */ jsxRuntime.jsx(AccordionContext.AccordionContext.Provider, {
+      value: {
+        value,
+        toggle,
+        expanded,
+        disabled: Boolean(disabled),
+        id: id != null ? id : ""
       },
-      [expandedSectionIds, onChangeProp]
-    );
-    const isExpanded = React.useCallback(
-      (sectionId) => expandedSectionIds.includes(sectionId),
-      [expandedSectionIds]
-    );
-    const contextValue = React.useMemo(() => {
-      return {
-        registerSection,
-        unregisterSection,
-        onChange,
-        isExpanded,
-        disabled
-      };
-    }, [registerSection, unregisterSection, onChange, isExpanded, disabled]);
-    return /* @__PURE__ */ jsxRuntime.jsx("div", {
-      className: clsx.clsx(withBaseName(), className),
-      ...restProps,
-      ref,
-      children: /* @__PURE__ */ jsxRuntime.jsx(AccordionContext.AccordionContext.Provider, {
-        value: contextValue,
-        children
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+        ref,
+        className: clsx.clsx(withBaseName(), className),
+        ...rest
       })
     });
   }

package/dist-cjs/accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sources":["../src/accordion/Accordion.tsx"],"sourcesContent":["import {\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from \"react\";\nimport { makePrefixer, useControlled } from \"@salt-ds/core\";\n\nimport { clsx } from \"clsx\";\nimport { AccordionContext } from \"./AccordionContext\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport accordionCss from \"./Accordion.css\";\n\nconst withBaseName = makePrefixer(\"saltAccordion\");\n\nexport interface AccordionProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  disabled?: boolean;\n  maxExpandedItems?: number;\n  expandedSectionIds?: string[];\n  defaultExpandedSectionIds?: string[];\n  // expandedSectionIds in the order they were expanded.\n  // The oldest expanded item is the first in this list.\n  // When maxExpandedItems is reached, the first item in this list is the first to be collapsed\n  onChange?: (expandedSectionIds: string[] | null) => void;\n}\n\nfunction sliceToSize<T>(items?: T[], size?: number) {\n  if (size !== undefined) {\n    const cutOffCount = items ? items.length - size : 0;\n    if (cutOffCount > 0) {\n      items = items!.slice(cutOffCount);\n    }\n  }\n  return items;\n}\n\nexport const Accordion = forwardRef<HTMLDivElement, AccordionProps>(\n  function Accordion(\n    {\n      disabled = false,\n      expandedSectionIds: expandedSectionIdsProp,\n      defaultExpandedSectionIds = [],\n      maxExpandedItems,\n      onChange: onChangeProp,\n      className,\n      children,\n      ...restProps\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-accordion\",\n      css: accordionCss,\n      window: targetWindow,\n    });\n\n    const [sectionIds, setSectionIds] = useState<Set<string>>(new Set());\n\n    const [expandedSectionIds, setExpandedSectionIds] = useControlled<string[]>(\n      {\n        controlled: expandedSectionIdsProp,\n        default: defaultExpandedSectionIds,\n        name: \"Accordion\",\n        state: \"ExpandedSectionIds\",\n      }\n    );\n\n    const registerSection = useCallback(\n      (sectionId: string, isExpanded: boolean) => {\n        setSectionIds((sectionIds) => {\n          const newSectionIds = new Set(sectionIds);\n          newSectionIds.add(sectionId);\n          return newSectionIds;\n        });\n        if (isExpanded) {\n          setExpandedSectionIds((oldExpandedSectionIds) => {\n            const newExpandedSectionIds = [...oldExpandedSectionIds];\n            newExpandedSectionIds.push(sectionId);\n            return newExpandedSectionIds;\n          });\n        }\n      },\n      []\n    );\n\n    const unregisterSection = useCallback((sectionId: string) => {\n      if (expandedSectionIds.includes(sectionId)) {\n        setExpandedSectionIds((oldValue) =>\n          oldValue.filter((id) => id !== sectionId)\n        );\n      }\n      setSectionIds((sectionIds) => {\n        const newSectionIds = new Set(sectionIds);\n        newSectionIds.delete(sectionId);\n        return newSectionIds;\n      });\n    }, []);\n\n    useEffect(() => {\n      if (\n        expandedSectionIds &&\n        maxExpandedItems !== undefined &&\n        expandedSectionIds.length > maxExpandedItems\n      ) {\n        const newExpandedSectionIds = sliceToSize(\n          expandedSectionIds,\n          maxExpandedItems\n        );\n        setExpandedSectionIds(newExpandedSectionIds || []);\n        if (onChangeProp) {\n          onChangeProp(newExpandedSectionIds || null);\n        }\n      }\n    }, [maxExpandedItems]);\n\n    const onChange = useCallback(\n      (sectionId: string, isExpanded: boolean) => {\n        let newExpandedSectionIds = [...expandedSectionIds];\n        if (isExpanded) {\n          newExpandedSectionIds.push(sectionId);\n          if (\n            maxExpandedItems != null &&\n            newExpandedSectionIds.length > maxExpandedItems\n          ) {\n            newExpandedSectionIds.shift();\n          }\n        } else {\n          newExpandedSectionIds = newExpandedSectionIds.filter(\n            (id) => id !== sectionId\n          );\n        }\n        setExpandedSectionIds(newExpandedSectionIds);\n        if (onChangeProp) {\n          onChangeProp(newExpandedSectionIds);\n        }\n      },\n      [expandedSectionIds, onChangeProp]\n    );\n\n    const isExpanded = useCallback(\n      (sectionId: string) => expandedSectionIds.includes(sectionId),\n      [expandedSectionIds]\n    );\n\n    const contextValue: AccordionContext = useMemo(() => {\n      return {\n        registerSection,\n        unregisterSection,\n        onChange,\n        isExpanded,\n        disabled,\n      };\n    }, [registerSection, unregisterSection, onChange, isExpanded, disabled]);\n\n    return (\n      <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n        <AccordionContext.Provider value={contextValue}>\n          {children}\n        </AccordionContext.Provider>\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","Accordion","useWindow","useComponentCssInjection","accordionCss","useState","useControlled","useCallback","isExpanded","sectionIds","useEffect","useMemo","jsx","clsx","AccordionContext"],"mappings":"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"}
+{"version":3,"file":"Accordion.js","sources":["../src/accordion/Accordion.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, SyntheticEvent } from \"react\";\nimport { makePrefixer, useControlled, useId } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { AccordionContext } from \"./AccordionContext\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport accordionCss from \"./Accordion.css\";\nexport interface AccordionProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * AccordionGroup value.\n   */\n  value: string;\n  /**\n   * Whether the accordion is expanded.\n   */\n  expanded?: boolean;\n  /**\n   * Whether the accordion is expanded by default.\n   */\n  defaultExpanded?: boolean;\n  /**\n   * Callback fired when the accordion is toggled.\n   * @param event\n   */\n  onToggle?: (event: SyntheticEvent<HTMLButtonElement>) => void;\n  /**\n   * Whether the accordion is disabled.\n   */\n  disabled?: boolean;\n}\n\nconst withBaseName = makePrefixer(\"saltAccordion\");\n\nexport const Accordion = forwardRef<HTMLDivElement, AccordionProps>(\n  function Accordion(props, ref) {\n    const {\n      className,\n      defaultExpanded,\n      expanded: expandedProp,\n      disabled,\n      id: idProp,\n      onToggle,\n      value,\n      ...rest\n    } = props;\n\n    const id = useId(idProp);\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-accordion\",\n      css: accordionCss,\n      window: targetWindow,\n    });\n\n    const [expanded, setExpanded] = useControlled({\n      controlled: expandedProp,\n      default: Boolean(defaultExpanded),\n      name: \"Accordion\",\n      state: \"expanded\",\n    });\n\n    const toggle = (event: SyntheticEvent<HTMLButtonElement>) => {\n      setExpanded((prev) => !prev);\n      onToggle?.(event);\n    };\n\n    return (\n      <AccordionContext.Provider\n        value={{\n          value,\n          toggle,\n          expanded,\n          disabled: Boolean(disabled),\n          id: id ?? \"\",\n        }}\n      >\n        <div ref={ref} className={clsx(withBaseName(), className)} {...rest} />\n      </AccordionContext.Provider>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","Accordion","useId","useWindow","useComponentCssInjection","accordionCss","useControlled","jsx","AccordionContext","clsx"],"mappings":";;;;;;;;;;;;;AA+BA,MAAM,YAAA,GAAeA,kBAAa,eAAe,CAAA,CAAA;AAE1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,UAAU,CAAA,KAAA,EAAO,GAAK,EAAA;AAC7B,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,eAAA;AAAA,MACA,QAAU,EAAA,YAAA;AAAA,MACV,QAAA;AAAA,MACA,EAAI,EAAA,MAAA;AAAA,MACJ,QAAA;AAAA,MACA,KAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAM,MAAA,EAAA,GAAKC,WAAM,MAAM,CAAA,CAAA;AACvB,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAIC,kBAAc,CAAA;AAAA,MAC5C,UAAY,EAAA,YAAA;AAAA,MACZ,OAAA,EAAS,QAAQ,eAAe,CAAA;AAAA,MAChC,IAAM,EAAA,WAAA;AAAA,MACN,KAAO,EAAA,UAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,MAAA,GAAS,CAAC,KAA6C,KAAA;AAC3D,MAAY,WAAA,CAAA,CAAC,IAAS,KAAA,CAAC,IAAI,CAAA,CAAA;AAC3B,MAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,KACb,CAAA;AAEA,IACE,uBAAAC,cAAA,CAACC,kCAAiB,QAAjB,EAAA;AAAA,MACC,KAAO,EAAA;AAAA,QACL,KAAA;AAAA,QACA,MAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAA,EAAU,QAAQ,QAAQ,CAAA;AAAA,QAC1B,IAAI,EAAM,IAAA,IAAA,GAAA,EAAA,GAAA,EAAA;AAAA,OACZ;AAAA,MAEA,QAAC,kBAAAD,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,GAAA;AAAA,QAAU,SAAW,EAAAE,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QAAI,GAAG,IAAA;AAAA,OAAM,CAAA;AAAA,KACvE,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/accordion/AccordionContext.js

@@ -2,20 +2,24 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var core = require('@salt-ds/core');
 var React = require('react');
-var utils = require('./utils.js');
 
-const AccordionContext = React.createContext(
-  void 0
-);
-const useAccordionContext = () => {
-  const context = React.useContext(AccordionContext);
-  if (utils.isNotProduction() && !context) {
-    console.error("useAccordionContext should be used inside of Accordion");
+const AccordionContext = core.createContext(
+  "AccordionContext",
+  {
+    value: "",
+    expanded: false,
+    toggle: () => {
+    },
+    disabled: false,
+    id: ""
   }
-  return context;
-};
+);
+function useAccordion() {
+  return React.useContext(AccordionContext);
+}
 
 exports.AccordionContext = AccordionContext;
-exports.useAccordionContext = useAccordionContext;
+exports.useAccordion = useAccordion;
 //# sourceMappingURL=AccordionContext.js.map

package/dist-cjs/accordion/AccordionContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionContext.js","sources":["../src/accordion/AccordionContext.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport { isNotProduction } from \"./utils\";\n\nexport interface AccordionContext {\n  isExpanded: (id: string) => boolean;\n  disabled: boolean;\n  registerSection: (id: string, isExpanded: boolean) => void;\n  unregisterSection: (id: string) => void;\n  onChange: (id: string, isExpanded: boolean) => void;\n}\n\nexport const AccordionContext = createContext<AccordionContext | undefined>(\n  undefined\n);\n\nexport const useAccordionContext = () => {\n  const context = useContext(AccordionContext);\n  if (isNotProduction() && !context) {\n    console.error(\"useAccordionContext should be used inside of Accordion\");\n  }\n  return context!;\n};\n"],"names":["createContext","useContext","isNotProduction"],"mappings":";;;;;;;AAWO,MAAM,gBAAmB,GAAAA,mBAAA;AAAA,EAC9B,KAAA,CAAA;AACF,EAAA;AAEO,MAAM,sBAAsB,MAAM;AACvC,EAAM,MAAA,OAAA,GAAUC,iBAAW,gBAAgB,CAAA,CAAA;AAC3C,EAAI,IAAAC,qBAAA,EAAqB,IAAA,CAAC,OAAS,EAAA;AACjC,IAAA,OAAA,CAAQ,MAAM,wDAAwD,CAAA,CAAA;AAAA,GACxE;AACA,EAAO,OAAA,OAAA,CAAA;AACT;;;;;"}
+{"version":3,"file":"AccordionContext.js","sources":["../src/accordion/AccordionContext.ts"],"sourcesContent":["import { createContext } from \"@salt-ds/core\";\nimport { SyntheticEvent, useContext } from \"react\";\n\nexport interface AccordionContextValue {\n  value: string;\n  expanded: boolean;\n  toggle: (event: SyntheticEvent<HTMLButtonElement>) => void;\n  disabled: boolean;\n  id: string;\n}\n\nexport const AccordionContext = createContext<AccordionContextValue>(\n  \"AccordionContext\",\n  {\n    value: \"\",\n    expanded: false,\n    toggle: () => {},\n    disabled: false,\n    id: \"\",\n  }\n);\n\nexport function useAccordion() {\n  return useContext(AccordionContext);\n}\n"],"names":["createContext","useContext"],"mappings":";;;;;;;AAWO,MAAM,gBAAmB,GAAAA,kBAAA;AAAA,EAC9B,kBAAA;AAAA,EACA;AAAA,IACE,KAAO,EAAA,EAAA;AAAA,IACP,QAAU,EAAA,KAAA;AAAA,IACV,QAAQ,MAAM;AAAA,KAAC;AAAA,IACf,QAAU,EAAA,KAAA;AAAA,IACV,EAAI,EAAA,EAAA;AAAA,GACN;AACF,EAAA;AAEO,SAAS,YAAe,GAAA;AAC7B,EAAA,OAAOC,iBAAW,gBAAgB,CAAA,CAAA;AACpC;;;;;"}

package/dist-cjs/accordion/AccordionGroup.js

@@ -0,0 +1,23 @@
+'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 clsx = require('clsx');
+
+const withBaseName = core.makePrefixer("saltAccordionGroup");
+const AccordionGroup = React.forwardRef(
+  function AccordionGroup2(props, ref) {
+    const { className, ...rest } = props;
+    return /* @__PURE__ */ jsxRuntime.jsx("div", {
+      className: clsx.clsx(withBaseName(), className),
+      ref,
+      ...rest
+    });
+  }
+);
+
+exports.AccordionGroup = AccordionGroup;
+//# sourceMappingURL=AccordionGroup.js.map

package/dist-cjs/accordion/AccordionGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionGroup.js","sources":["../src/accordion/AccordionGroup.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nexport interface AccordionGroupProps extends ComponentPropsWithoutRef<\"div\"> {}\n\nconst withBaseName = makePrefixer(\"saltAccordionGroup\");\n\nexport const AccordionGroup = forwardRef<HTMLDivElement, AccordionGroupProps>(\n  function AccordionGroup(props, ref) {\n    const { className, ...rest } = props;\n\n    return (\n      <div className={clsx(withBaseName(), className)} ref={ref} {...rest} />\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","AccordionGroup","jsx","clsx"],"mappings":";;;;;;;;;AAKA,MAAM,YAAA,GAAeA,kBAAa,oBAAoB,CAAA,CAAA;AAE/C,MAAM,cAAiB,GAAAC,gBAAA;AAAA,EAC5B,SAASC,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AAClC,IAAM,MAAA,EAAE,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAE/B,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAG,GAAA;AAAA,MAAW,GAAG,IAAA;AAAA,KAAM,CAAA,CAAA;AAAA,GAEzE;AACF;;;;"}

package/dist-cjs/accordion/AccordionHeader.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltAccordionHeader {\n  display: flex;\n  gap: var(--salt-spacing-100);\n  padding-block: var(--salt-spacing-50);\n  padding-inline: var(--salt-spacing-100);\n  align-items: center;\n  border: 0;\n  width: 100%;\n  min-height: var(--salt-size-base);\n  background: var(--salt-actionable-secondary-background);\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n  font-family: var(--salt-text-fontFamily);\n  color: var(--salt-text-primary-foreground);\n  --saltIcon-color: var(--salt-text-primary-foreground);\n  text-align: left;\n}\n\n.saltAccordionHeader:focus-visible {\n  background: var(--salt-actionable-primary-background-hover);\n  outline: var(--salt-focused-outline);\n}\n\n@media (hover: hover) and (pointer: fine) {\n  .saltAccordionHeader:hover {\n    background: var(--salt-actionable-primary-background-hover);\n  }\n}\n\n.saltAccordionHeader:disabled {\n  background: var(--salt-actionable-secondary-background);\n  color: var(--salt-text-primary-foreground-disabled);\n  --saltIcon-fill: var(--salt-text-primary-foreground-disabled);\n}\n\n.saltAccordionHeader-icon {\n  transition: transform var(--salt-duration-instant) cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.saltAccordionHeader[aria-expanded=\"true\"] > .saltAccordionHeader-icon {\n  transform: rotate(90deg);\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=AccordionHeader.css.js.map

package/dist-cjs/accordion/AccordionHeader.css.js.map

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

package/dist-cjs/accordion/AccordionHeader.js

@@ -0,0 +1,50 @@
+'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 clsx = require('clsx');
+var icons = require('@salt-ds/icons');
+var window = require('@salt-ds/window');
+var styles = require('@salt-ds/styles');
+var AccordionContext = require('./AccordionContext.js');
+var AccordionHeader$1 = require('./AccordionHeader.css.js');
+
+const withBaseName = core.makePrefixer("saltAccordionHeader");
+const AccordionHeader = React.forwardRef(function AccordionHeader2(props, ref) {
+  const { children, className, onClick, ...rest } = props;
+  const { value, expanded, toggle, disabled, id } = AccordionContext.useAccordion();
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "salt-accordion-header",
+    css: AccordionHeader$1,
+    window: targetWindow
+  });
+  const handleClick = (event) => {
+    toggle(event);
+    onClick == null ? void 0 : onClick(event);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("button", {
+    ref,
+    className: clsx.clsx(withBaseName(), className),
+    disabled,
+    onClick: handleClick,
+    "aria-expanded": expanded,
+    id: `${id}-header`,
+    "aria-controls": `${id}-panel`,
+    value,
+    ...rest,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx(icons.ChevronRightIcon, {
+        "aria-hidden": "true",
+        className: withBaseName("icon")
+      }),
+      children
+    ]
+  });
+});
+
+exports.AccordionHeader = AccordionHeader;
+//# sourceMappingURL=AccordionHeader.js.map

package/dist-cjs/accordion/AccordionHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionHeader.js","sources":["../src/accordion/AccordionHeader.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, MouseEvent } from \"react\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { ChevronRightIcon } from \"@salt-ds/icons\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport { useAccordion } from \"./AccordionContext\";\nimport accordionHeaderCss from \"./AccordionHeader.css\";\n\nexport interface AccordionHeaderProps\n  extends ComponentPropsWithoutRef<\"button\"> {}\n\nconst withBaseName = makePrefixer(\"saltAccordionHeader\");\n\nexport const AccordionHeader = forwardRef<\n  HTMLButtonElement,\n  AccordionHeaderProps\n>(function AccordionHeader(props, ref) {\n  const { children, className, onClick, ...rest } = props;\n  const { value, expanded, toggle, disabled, id } = useAccordion();\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-accordion-header\",\n    css: accordionHeaderCss,\n    window: targetWindow,\n  });\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    toggle(event);\n    onClick?.(event);\n  };\n\n  return (\n    <button\n      ref={ref}\n      className={clsx(withBaseName(), className)}\n      disabled={disabled}\n      onClick={handleClick}\n      aria-expanded={expanded}\n      id={`${id}-header`}\n      aria-controls={`${id}-panel`}\n      value={value}\n      {...rest}\n    >\n      <ChevronRightIcon aria-hidden=\"true\" className={withBaseName(\"icon\")} />\n      {children}\n    </button>\n  );\n});\n"],"names":["makePrefixer","forwardRef","AccordionHeader","useAccordion","useWindow","useComponentCssInjection","accordionHeaderCss","jsxs","clsx","jsx","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAeA,kBAAa,qBAAqB,CAAA,CAAA;AAEhD,MAAM,eAAkB,GAAAC,gBAAA,CAG7B,SAASC,gBAAAA,CAAgB,OAAO,GAAK,EAAA;AACrC,EAAA,MAAM,EAAE,QAAA,EAAU,SAAW,EAAA,OAAA,EAAA,GAAY,MAAS,GAAA,KAAA,CAAA;AAClD,EAAA,MAAM,EAAE,KAAO,EAAA,QAAA,EAAU,QAAQ,QAAU,EAAA,EAAA,KAAOC,6BAAa,EAAA,CAAA;AAE/D,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAC,iBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,WAAA,GAAc,CAAC,KAAyC,KAAA;AAC5D,IAAA,MAAA,CAAO,KAAK,CAAA,CAAA;AACZ,IAAU,OAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACZ,CAAA;AAEA,EAAA,uBACGC,eAAA,CAAA,QAAA,EAAA;AAAA,IACC,GAAA;AAAA,IACA,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,QAAA;AAAA,IACA,OAAS,EAAA,WAAA;AAAA,IACT,eAAe,EAAA,QAAA;AAAA,IACf,IAAI,CAAG,EAAA,EAAA,CAAA,OAAA,CAAA;AAAA,IACP,iBAAe,CAAG,EAAA,EAAA,CAAA,MAAA,CAAA;AAAA,IAClB,KAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEJ,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAAC,sBAAA,EAAA;AAAA,QAAiB,aAAY,EAAA,MAAA;AAAA,QAAO,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,OAAG,CAAA;AAAA,MACrE,QAAA;AAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/accordion/AccordionPanel.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var css_248z = ".saltAccordionPanel {\n  display: grid;\n  grid-template-rows: 0fr;\n  transition: grid-template-rows var(--salt-duration-perceptible) cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.saltAccordionHeader[aria-expanded=\"true\"] + .saltAccordionPanel {\n  grid-template-rows: 1fr;\n}\n\n.saltAccordionPanel-inner {\n  overflow: hidden;\n}\n\n.saltAccordionPanel-content {\n  padding: var(--salt-spacing-200);\n  padding-left: calc(var(--salt-spacing-200) + var(--salt-size-icon));\n}\n";
+
+module.exports = css_248z;
+//# sourceMappingURL=AccordionPanel.css.js.map

package/dist-cjs/accordion/AccordionPanel.css.js.map

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

package/dist-cjs/accordion/AccordionPanel.js

@@ -0,0 +1,45 @@
+'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 window = require('@salt-ds/window');
+var styles = require('@salt-ds/styles');
+var clsx = require('clsx');
+var AccordionContext = require('./AccordionContext.js');
+var AccordionPanel$1 = require('./AccordionPanel.css.js');
+
+const withBaseName = core.makePrefixer("saltAccordionPanel");
+const AccordionPanel = React.forwardRef(
+  function AccordionPanel2(props, ref) {
+    const { children, className, ...rest } = props;
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-accordion-panel",
+      css: AccordionPanel$1,
+      window: targetWindow
+    });
+    const { id, expanded } = AccordionContext.useAccordion();
+    return /* @__PURE__ */ jsxRuntime.jsx("div", {
+      ref,
+      className: clsx.clsx(withBaseName(), className),
+      role: "region",
+      id: `${id}-panel`,
+      "aria-labelledby": `${id}-header`,
+      "aria-hidden": !expanded ? "true" : void 0,
+      ...rest,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+        className: withBaseName("inner"),
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+          className: withBaseName("content"),
+          children
+        })
+      })
+    });
+  }
+);
+
+exports.AccordionPanel = AccordionPanel;
+//# sourceMappingURL=AccordionPanel.js.map

package/dist-cjs/accordion/AccordionPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionPanel.js","sources":["../src/accordion/AccordionPanel.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { clsx } from \"clsx\";\n\nimport { useAccordion } from \"./AccordionContext\";\nimport accordionPanelCss from \"./AccordionPanel.css\";\n\nexport interface AccordionPanelProps extends ComponentPropsWithoutRef<\"div\"> {}\n\nconst withBaseName = makePrefixer(\"saltAccordionPanel\");\n\nexport const AccordionPanel = forwardRef<HTMLDivElement, AccordionPanelProps>(\n  function AccordionPanel(props, ref) {\n    const { children, className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-accordion-panel\",\n      css: accordionPanelCss,\n      window: targetWindow,\n    });\n\n    const { id, expanded } = useAccordion();\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(withBaseName(), className)}\n        role=\"region\"\n        id={`${id}-panel`}\n        aria-labelledby={`${id}-header`}\n        aria-hidden={!expanded ? \"true\" : undefined}\n        {...rest}\n      >\n        <div className={withBaseName(\"inner\")}>\n          <div className={withBaseName(\"content\")}>{children}</div>\n        </div>\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","AccordionPanel","useWindow","useComponentCssInjection","accordionPanelCss","useAccordion","jsx","clsx"],"mappings":";;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,kBAAa,oBAAoB,CAAA,CAAA;AAE/C,MAAM,cAAiB,GAAAC,gBAAA;AAAA,EAC5B,SAASC,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AAClC,IAAA,MAAM,EAAE,QAAA,EAAU,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAEzC,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,gBAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,EAAA,EAAI,QAAS,EAAA,GAAIC,6BAAa,EAAA,CAAA;AAEtC,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,IAAK,EAAA,QAAA;AAAA,MACL,IAAI,CAAG,EAAA,EAAA,CAAA,MAAA,CAAA;AAAA,MACP,mBAAiB,CAAG,EAAA,EAAA,CAAA,OAAA,CAAA;AAAA,MACpB,aAAA,EAAa,CAAC,QAAA,GAAW,MAAS,GAAA,KAAA,CAAA;AAAA,MACjC,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAAD,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,QAClC,QAAC,kBAAAA,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,SAAS,CAAA;AAAA,UAAI,QAAA;AAAA,SAAS,CAAA;AAAA,OACrD,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/form-field-legacy/FormFieldLegacy.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".salt-density-high {\n  --formFieldLegacy-label-top-marginBottom: 2px;\n}\n.salt-density-medium {\n  --formFieldLegacy-label-top-marginBottom: 2px;\n}\n.salt-density-low {\n  --formFieldLegacy-label-top-marginBottom: 4px;\n}\n.salt-density-touch {\n  --formFieldLegacy-label-top-marginBottom: 8px;\n}\n\n/* Style applied to the root element */\n.saltFormFieldLegacy {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle);\n  --formFieldLegacy-background: var(--salt-editable-primary-background);\n  --formFieldLegacy-focused-outlineColor: var(--salt-focused-outlineColor);\n  /* Set to 0 until helper text class provided */\n  --formFieldLegacy-helperText-height: 0px;\n}\n\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy {\n  --formFieldLegacy-background: var(--salt-editable-secondary-background);\n}\n\n.saltFormFieldLegacy {\n  border: 0;\n  display: inline-grid;\n  font-size: var(--saltFormFieldLegacy-fontSize, var(--salt-text-fontSize));\n  margin: var(--saltFormFieldLegacy-margin, 0);\n  padding: 0;\n  position: relative;\n  min-width: 0;\n  vertical-align: top;\n  width: var(--saltFormFieldLegacy-width, auto);\n}\n\n/* Class applied to the root element on hover */\n.saltFormFieldLegacy:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-hover);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-hover);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-hover);\n}\n\n/* Class applied to the root element when focused */\n.saltFormFieldLegacy-focused,\n.saltFormFieldLegacy-lowFocused,\n.saltFormFieldLegacy.saltFormFieldLegacy-focused:hover,\n.saltFormFieldLegacy.saltFormFieldLegacy-lowFocused:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-active);\n  --formFieldLegacy-activationIndicator-size: var(--salt-editable-borderWidth-active);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-active);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-active);\n}\n\n/* Class applied when helper text is provided */\n.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-marginTop: var(--formFieldLegacy-helperText-marginTop-default);\n  --formFieldLegacy-activationIndicator-offsetBottom: calc(var(--formFieldLegacy-helperText-marginTop) + var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height)));\n}\n\n/* Class applied if `fullWidth={true}` and helper text is provided */\n.saltFormFieldLegacy-fullWidth.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-marginTop: var(--formFieldLegacy-helperText-marginTop-fullWidth);\n  --formFieldLegacy-activationIndicator-offsetBottom: calc(\n    var(--formFieldLegacy-helperText-marginTop-fullWidth) + var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height))\n  );\n}\n\n/* Class applied when helper text is provided */\n.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-fontSize: var(--saltFormFieldLegacy-helperText-fontSize, var(--salt-text-fontSize));\n  --formFieldLegacy-helperText-baseHeight: calc(1.3 * var(--formFieldLegacy-helperText-fontSize));\n  --formFieldLegacy-helperText-calculatedHeight: max(var(--salt-text-label-minHeight), var(--formFieldLegacy-helperText-baseHeight));\n  --formFieldLegacy-helperText-height: calc(var(--formFieldLegacy-helperText-calculatedHeight) + var(--formFieldLegacy-helperText-marginTop));\n}\n\n/* Class applied to the root element if `fillWidth={true}` */\n.saltFormFieldLegacy-fullWidth {\n  width: 100%;\n}\n\n/* Class applied to the root element if `disabled={true}` */\n.saltFormFieldLegacy-disabled {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-disabled);\n  --formFieldLegacy-activationIndicator-opacity: var(--salt-palette-opacity-foreground);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-disabled);\n  --formFieldLegacy-helperText-opacity: var(--salt-palette-opacity-foreground);\n\n  --saltControlLabel-color: var(--salt-text-primary-foreground-disabled);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-disabled);\n}\n\n/* Class applied to the root element on hover if `disabled={true}` */\n.saltFormFieldLegacy.saltFormFieldLegacy-disabled:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-disabled);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-disabled);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-disabled);\n}\n\n/* Class applied to the root element on warning state */\n.saltFormFieldLegacy.saltFormFieldLegacy-warning {\n  --formFieldLegacy-focused-outlineColor: var(--salt-status-warning-borderColor);\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-warning-borderColor);\n}\n\n/* Class applied to the root element on warning state on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-warning:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-warning-borderColor);\n}\n\n/* Class applied to the root element on error state */\n.saltFormFieldLegacy.saltFormFieldLegacy-error {\n  --formFieldLegacy-focused-outlineColor: var(--salt-status-error-borderColor);\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-error-borderColor);\n}\n\n/* Class applied to the root element on error state on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-error:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-error-borderColor);\n}\n\n/* Error state styling when `variant=\"secondary\"` */\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy-error {\n  --formFieldLegacy-background: var(--salt-status-error-background);\n}\n\n/* Warning state styling when `variant=\"secondary\"` */\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy-warning {\n  --formFieldLegacy-background: var(--salt-status-warning-background);\n}\n\n/* Class applied to the root element if `labelPlacement=\"left\"` */\n.saltFormFieldLegacy-labelLeft {\n  --formFieldLegacy-label-marginTop: var(--salt-size-unit);\n  --formFieldLegacy-label-paddingLeft: 0px;\n  --formFieldLegacy-label-paddingRight: calc(0.75 * var(--salt-size-unit));\n\n  align-self: start;\n  grid-template-columns: auto 1fr;\n}\n\n/* Class applied to the root element if `labelPlacement=\"top\"` or labelPlacement omitted (default is 'top') */\n.saltFormFieldLegacy-labelTop {\n  --formFieldLegacy-label-marginBottom: var(--formFieldLegacy-label-top-marginBottom);\n  --formFieldLegacy-label-marginTop: 0;\n  --formFieldLegacy-label-paddingLeft: var(--salt-size-unit);\n  --formFieldLegacy-label-paddingRight: var(--salt-size-unit);\n  /* Uses density invariant value unless helper text provided */\n  --formFieldLegacy-background-offset-height: calc(var(--formFieldLegacy-helperText-marginTop, 0px) + var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height)));\n\n  background: linear-gradient(\n    to top,\n    transparent var(--formFieldLegacy-background-offset-height),\n    var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background)) var(--formFieldLegacy-background-offset-height)\n  );\n}\n\n/* Class applied if `labelPlacement=\"top\"` and helper text is provided */\n.saltFormFieldLegacy-labelTop.saltFormFieldLegacy-withHelperText {\n  /* Uses density aware value from FormHelperText */\n  --formFieldLegacy-background-offset-height: var(--formFieldLegacy-helperText-background-offset-height);\n}\n\n.saltFormFieldLegacy > * {\n  grid-column-start: 1;\n  grid-column-end: 2;\n  grid-row-start: 2;\n  grid-row-end: 3;\n}\n\n.saltFormFieldLegacy-labelLeft > * {\n  grid-row-start: 1;\n  grid-row-end: 2;\n}\n\n.saltFormFieldLegacy > .saltFormLabel {\n  grid-row-start: 1;\n  grid-row-end: 2;\n}\n\n.saltFormFieldLegacy > .saltFormActivationIndicator {\n  grid-row-start: 3;\n  grid-row-end: 4;\n}\n\n.saltFormFieldLegacy > .saltFormHelperText {\n  grid-row-start: 4;\n  grid-row-end: 5;\n}\n\n.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ * {\n  grid-column-start: 2;\n  grid-column-end: 2;\n}\n\n/* Class applied if `readOnly={true}\"` */\n.saltFormFieldLegacy-readOnly {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-readonly);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Class applied to the root element if `readOnly={true}\"` on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-readOnly:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-readonly);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-readonly);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Class applied on focus with `labelTop={true}` and no helper text provided */\n.saltFormFieldLegacy:not(.saltFormFieldLegacy-withHelperText):not(.saltFormFieldLegacy-labelLeft).saltFormFieldLegacy-focused:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height, 0px));\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n}\n\n/* Class applied on focus with `labelTop={true}` and helper text provided */\n.saltFormFieldLegacy-withHelperText:not(.saltFormFieldLegacy-labelLeft).saltFormFieldLegacy-focused:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: var(--formFieldLegacy-helperText-height, 0px);\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused:before {\n  content: none;\n}\n\n/* Class applied on focus with `labelLeft={true}` */\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > *:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0px;\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  z-index: -1;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > :is(.saltFormActivationIndicator, .saltFormHelperText, .saltFormLabel):before {\n  content: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused {\n  outline: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > :is(.saltFormFieldLegacy-activationIndicator, .saltFormFieldLegacy-helperText, .saltFormLabel):before {\n  content: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused .saltFormLabel + * {\n  outline: none;\n}\n\n.saltFormFieldLegacy-tertiary.saltFormFieldLegacy.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ * {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n}\n\n/* TODO: I don't think this is needed, but commenting until work on FF done\n.saltFormFieldLegacy-primary.saltFormFieldLegacy > :not(.saltFormLabel):first-child {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n} */\n\n.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ :not(.saltFormHelperText) {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n}\n\n/* **Deprecated:** Tertiary variant no longer supported */\n.saltFormFieldLegacy-tertiary.saltFormFieldLegacy {\n  --formFieldLegacy-background: var(--salt-editable-tertiary-background);\n}\n";
+var css_248z = ".salt-density-high {\n  --formFieldLegacy-label-top-marginBottom: 2px;\n}\n.salt-density-medium {\n  --formFieldLegacy-label-top-marginBottom: 2px;\n}\n.salt-density-low {\n  --formFieldLegacy-label-top-marginBottom: 4px;\n}\n.salt-density-touch {\n  --formFieldLegacy-label-top-marginBottom: 8px;\n}\n\n/* Style applied to the root element */\n.saltFormFieldLegacy {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle);\n  --formFieldLegacy-background: var(--salt-editable-primary-background);\n  --formFieldLegacy-focused-outlineColor: var(--salt-focused-outlineColor);\n  /* Set to 0 until helper text class provided */\n  --formFieldLegacy-helperText-height: 0px;\n}\n\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy {\n  --formFieldLegacy-background: var(--salt-editable-secondary-background);\n}\n\n.saltFormFieldLegacy {\n  border: 0;\n  display: inline-grid;\n  font-size: var(--saltFormFieldLegacy-fontSize, var(--salt-text-fontSize));\n  margin: var(--saltFormFieldLegacy-margin, 0);\n  padding: 0;\n  position: relative;\n  min-width: 0;\n  vertical-align: top;\n  width: var(--saltFormFieldLegacy-width, auto);\n}\n\n/* Class applied to the root element on hover */\n.saltFormFieldLegacy:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-hover);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-hover);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-hover);\n}\n\n/* Class applied to the root element when focused */\n.saltFormFieldLegacy-focused,\n.saltFormFieldLegacy-lowFocused,\n.saltFormFieldLegacy.saltFormFieldLegacy-focused:hover,\n.saltFormFieldLegacy.saltFormFieldLegacy-lowFocused:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-active);\n  --formFieldLegacy-activationIndicator-size: var(--salt-editable-borderWidth-active);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-active);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-active);\n}\n\n/* Class applied when helper text is provided */\n.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-marginTop: var(--formFieldLegacy-helperText-marginTop-default);\n  --formFieldLegacy-activationIndicator-offsetBottom: calc(var(--formFieldLegacy-helperText-marginTop) + var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height)));\n}\n\n/* Class applied if `fullWidth={true}` and helper text is provided */\n.saltFormFieldLegacy-fullWidth.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-marginTop: var(--formFieldLegacy-helperText-marginTop-fullWidth);\n  --formFieldLegacy-activationIndicator-offsetBottom: calc(\n    var(--formFieldLegacy-helperText-marginTop-fullWidth) + var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height))\n  );\n}\n\n/* Class applied when helper text is provided */\n.saltFormFieldLegacy-withHelperText {\n  --formFieldLegacy-helperText-fontSize: var(--saltFormFieldLegacy-helperText-fontSize, var(--salt-text-fontSize));\n  --formFieldLegacy-helperText-baseHeight: calc(1.3 * var(--formFieldLegacy-helperText-fontSize));\n  --formFieldLegacy-helperText-calculatedHeight: max(var(--salt-text-label-minHeight), var(--formFieldLegacy-helperText-baseHeight));\n  --formFieldLegacy-helperText-height: calc(var(--formFieldLegacy-helperText-calculatedHeight) + var(--formFieldLegacy-helperText-marginTop));\n}\n\n/* Class applied to the root element if `fillWidth={true}` */\n.saltFormFieldLegacy-fullWidth {\n  width: 100%;\n}\n\n/* Class applied to the root element if `disabled={true}` */\n.saltFormFieldLegacy-disabled {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-disabled);\n  --formFieldLegacy-activationIndicator-opacity: var(--salt-palette-opacity-disabled);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-disabled);\n  --formFieldLegacy-helperText-opacity: var(--salt-palette-opacity-disabled);\n\n  --saltControlLabel-color: var(--salt-text-primary-foreground-disabled);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-disabled);\n}\n\n/* Class applied to the root element on hover if `disabled={true}` */\n.saltFormFieldLegacy.saltFormFieldLegacy-disabled:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-disabled);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-disabled);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-disabled);\n}\n\n/* Class applied to the root element on warning state */\n.saltFormFieldLegacy.saltFormFieldLegacy-warning {\n  --formFieldLegacy-focused-outlineColor: var(--salt-status-warning-borderColor);\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-warning-borderColor);\n}\n\n/* Class applied to the root element on warning state on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-warning:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-warning-borderColor);\n}\n\n/* Class applied to the root element on error state */\n.saltFormFieldLegacy.saltFormFieldLegacy-error {\n  --formFieldLegacy-focused-outlineColor: var(--salt-status-error-borderColor);\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-error-borderColor);\n}\n\n/* Class applied to the root element on error state on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-error:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-status-error-borderColor);\n}\n\n/* Error state styling when `variant=\"secondary\"` */\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy-error {\n  --formFieldLegacy-background: var(--salt-status-error-background);\n}\n\n/* Warning state styling when `variant=\"secondary\"` */\n.saltFormFieldLegacy-secondary.saltFormFieldLegacy-warning {\n  --formFieldLegacy-background: var(--salt-status-warning-background);\n}\n\n/* Class applied to the root element if `labelPlacement=\"left\"` */\n.saltFormFieldLegacy-labelLeft {\n  --formFieldLegacy-label-marginTop: var(--salt-size-unit);\n  --formFieldLegacy-label-paddingLeft: 0px;\n  --formFieldLegacy-label-paddingRight: calc(0.75 * var(--salt-size-unit));\n\n  align-self: start;\n  grid-template-columns: auto 1fr;\n}\n\n/* Class applied to the root element if `labelPlacement=\"top\"` or labelPlacement omitted (default is 'top') */\n.saltFormFieldLegacy-labelTop {\n  --formFieldLegacy-label-marginBottom: var(--formFieldLegacy-label-top-marginBottom);\n  --formFieldLegacy-label-marginTop: 0;\n  --formFieldLegacy-label-paddingLeft: var(--salt-size-unit);\n  --formFieldLegacy-label-paddingRight: var(--salt-size-unit);\n  /* Uses density invariant value unless helper text provided */\n  --formFieldLegacy-background-offset-height: calc(var(--formFieldLegacy-helperText-marginTop, 0px) + var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height)));\n\n  background: linear-gradient(\n    to top,\n    transparent var(--formFieldLegacy-background-offset-height),\n    var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background)) var(--formFieldLegacy-background-offset-height)\n  );\n}\n\n/* Class applied if `labelPlacement=\"top\"` and helper text is provided */\n.saltFormFieldLegacy-labelTop.saltFormFieldLegacy-withHelperText {\n  /* Uses density aware value from FormHelperText */\n  --formFieldLegacy-background-offset-height: var(--formFieldLegacy-helperText-background-offset-height);\n}\n\n.saltFormFieldLegacy > * {\n  grid-column-start: 1;\n  grid-column-end: 2;\n  grid-row-start: 2;\n  grid-row-end: 3;\n}\n\n.saltFormFieldLegacy-labelLeft > * {\n  grid-row-start: 1;\n  grid-row-end: 2;\n}\n\n.saltFormFieldLegacy > .saltFormLabel {\n  grid-row-start: 1;\n  grid-row-end: 2;\n}\n\n.saltFormFieldLegacy > .saltFormActivationIndicator {\n  grid-row-start: 3;\n  grid-row-end: 4;\n}\n\n.saltFormFieldLegacy > .saltFormHelperText {\n  grid-row-start: 4;\n  grid-row-end: 5;\n}\n\n.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ * {\n  grid-column-start: 2;\n  grid-column-end: 2;\n}\n\n/* Class applied if `readOnly={true}\"` */\n.saltFormFieldLegacy-readOnly {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-readonly);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Class applied to the root element if `readOnly={true}\"` on hover */\n.saltFormFieldLegacy.saltFormFieldLegacy-readOnly:hover {\n  --formFieldLegacy-activationIndicator-color: var(--salt-editable-borderColor-readonly);\n  --formFieldLegacy-activationIndicator-size: var(--salt-size-border);\n  --formFieldLegacy-activationIndicator-style: var(--salt-editable-borderStyle-readonly);\n\n  --saltInputLegacy-cursor: var(--salt-editable-cursor-readonly);\n}\n\n/* Class applied on focus with `labelTop={true}` and no helper text provided */\n.saltFormFieldLegacy:not(.saltFormFieldLegacy-withHelperText):not(.saltFormFieldLegacy-labelLeft).saltFormFieldLegacy-focused:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: var(--saltFormFieldLegacy-helperText-lineHeight, var(--formFieldLegacy-helperText-height, 0px));\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n}\n\n/* Class applied on focus with `labelTop={true}` and helper text provided */\n.saltFormFieldLegacy-withHelperText:not(.saltFormFieldLegacy-labelLeft).saltFormFieldLegacy-focused:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: var(--formFieldLegacy-helperText-height, 0px);\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused:before {\n  content: none;\n}\n\n/* Class applied on focus with `labelLeft={true}` */\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > *:before {\n  content: \" \";\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0px;\n  outline-color: var(--formFieldLegacy-focused-outlineColor);\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  z-index: -1;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > :is(.saltFormActivationIndicator, .saltFormHelperText, .saltFormLabel):before {\n  content: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused {\n  outline: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused > :is(.saltFormFieldLegacy-activationIndicator, .saltFormFieldLegacy-helperText, .saltFormLabel):before {\n  content: none;\n}\n\n.saltFormFieldLegacy-labelLeft.saltFormFieldLegacy-focused .saltFormLabel + * {\n  outline: none;\n}\n\n.saltFormFieldLegacy-tertiary.saltFormFieldLegacy.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ * {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n}\n\n/* TODO: I don't think this is needed, but commenting until work on FF done\n.saltFormFieldLegacy-primary.saltFormFieldLegacy > :not(.saltFormLabel):first-child {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n} */\n\n.saltFormFieldLegacy-labelLeft > .saltFormLabel ~ :not(.saltFormHelperText) {\n  background: var(--saltFormFieldLegacy-background, var(--formFieldLegacy-background));\n}\n\n/* **Deprecated:** Tertiary variant no longer supported */\n.saltFormFieldLegacy-tertiary.saltFormFieldLegacy {\n  --formFieldLegacy-background: var(--salt-editable-tertiary-background);\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=FormFieldLegacy.css.js.map

package/dist-cjs/index.js

@@ -24,11 +24,10 @@ var useLayoutEffectOnce = require('./utils/useLayoutEffectOnce.js');
 var useLayoutEffectSkipFirst = require('./utils/useLayoutEffectSkipFirst.js');
 var useOverflowDetection = require('./utils/useOverflowDetection.js');
 var useSlideSelection = require('./utils/useSlideSelection.js');
-var AccordionSection = require('./accordion/AccordionSection.js');
-var AccordionSectionContext = require('./accordion/AccordionSectionContext.js');
+var AccordionGroup = require('./accordion/AccordionGroup.js');
+var AccordionPanel = require('./accordion/AccordionPanel.js');
 var Accordion = require('./accordion/Accordion.js');
-var AccordionSummary = require('./accordion/AccordionSummary.js');
-var AccordionDetails = require('./accordion/AccordionDetails.js');
+var AccordionHeader = require('./accordion/AccordionHeader.js');
 var AppHeader = require('./app-header/AppHeader.js');
 var Badge = require('./badge/Badge.js');
 var Breadcrumb = require('./breadcrumbs/Breadcrumb.js');
@@ -104,6 +103,7 @@ var MenuButton = require('./menu-button/MenuButton.js');
 var Metric = require('./metric/Metric.js');
 var MetricHeader = require('./metric/MetricHeader.js');
 var MetricContent = require('./metric/MetricContent.js');
+var MultilineInput = require('./multiline-input/MultilineInput.js');
 var NavItem = require('./nav-item/NavItem.js');
 var Overlay = require('./overlay/Overlay.js');
 var useOverlay = require('./overlay/useOverlay.js');
@@ -178,12 +178,10 @@ exports.useLayoutEffectOnce = useLayoutEffectOnce.useLayoutEffectOnce;
 exports.useLayoutEffectSkipFirst = useLayoutEffectSkipFirst.useLayoutEffectSkipFirst;
 exports.useOverflowDetection = useOverflowDetection.useOverflowDetection;
 exports.useSlideSelection = useSlideSelection.useSlideSelection;
-exports.AccordionSection = AccordionSection.AccordionSection;
-exports.AccordionSectionContext = AccordionSectionContext.AccordionSectionContext;
-exports.useAccordionSectionContext = AccordionSectionContext.useAccordionSectionContext;
+exports.AccordionGroup = AccordionGroup.AccordionGroup;
+exports.AccordionPanel = AccordionPanel.AccordionPanel;
 exports.Accordion = Accordion.Accordion;
-exports.AccordionSummary = AccordionSummary.AccordionSummary;
-exports.AccordionDetails = AccordionDetails.AccordionDetails;
+exports.AccordionHeader = AccordionHeader.AccordionHeader;
 exports.AppHeader = AppHeader.AppHeader;
 exports.Badge = Badge.Badge;
 exports.Breadcrumb = Breadcrumb.Breadcrumb;
@@ -272,6 +270,7 @@ exports.MenuButton = MenuButton.MenuButton;
 exports.Metric = Metric.Metric;
 exports.MetricHeader = MetricHeader.MetricHeader;
 exports.MetricContent = MetricContent.MetricContent;
+exports.MultilineInput = MultilineInput.MultilineInput;
 exports.NavItem = NavItem.NavItem;
 exports.Overlay = Overlay.Overlay;
 exports.useOverlay = useOverlay.useOverlay;

package/dist-cjs/index.js.map

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

package/dist-cjs/list-deprecated/ListItem.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = ".saltListItemDeprecated {\n  /* Color */\n  --list-item-text-color: var(--salt-selectable-foreground);\n  --list-item-background: var(--salt-selectable-background);\n  --list-item-background-hover: var(--salt-selectable-background-hover);\n  --list-item-selected-focus-outlineColor: var(--salt-accent-foreground); /* TODO: Check token with design */\n\n  --list-item-text-color-active: var(--salt-selectable-foreground-selected);\n  --list-item-background-active: var(--salt-selectable-background-selected);\n\n  /* Text, Font */\n  --list-item-textAlign: var(--salt-text-textAlign);\n  --list-item-fontSize: var(--salt-text-fontSize);\n  --list-item-lineHeight: var(--salt-text-lineHeight);\n\n  /* Spacing */\n  --list-item-padding: 0 var(--salt-size-unit);\n\n  /* Misc. */\n  --list-item-gap: 0px;\n  --list-item-alignItems: center;\n  --list-item-selectable-cursor: pointer;\n  --list-item-cursor: default;\n\n  --list-item-disabled-cursor: var(--salt-selectable-cursor-disabled);\n  --list-item-disabled-regular-opacity: var(--salt-palette-opacity-foreground);\n}\n\n.saltListItemDeprecated {\n  color: var(--list-item-text-color);\n  background: var(--list-item-background);\n  text-align: var(--list-item-textAlign);\n  line-height: var(--list-item-lineHeight);\n  font-size: var(--list-item-fontSize);\n  padding: var(--list-item-padding);\n  left: 0;\n  right: 0;\n  display: flex;\n  position: relative;\n  align-items: var(--list-item-alignItems);\n  white-space: nowrap;\n}\n\n.saltListItemDeprecated {\n  /* Replaced border-bottom with margin. In design spec, the height of the items should not include gap */\n  margin-bottom: var(--list-item-gap);\n  cursor: var(--list-item-selectable-cursor);\n}\n\n.saltListItemDeprecated:last-child {\n  margin-bottom: 0px;\n}\n\n.saltListItemDeprecated.saltListItemDeprecated-highlighted:not(.saltListItemDeprecated-selected) {\n  background: var(--list-item-background-hover);\n}\n\n.saltListItemDeprecated.saltListItemDeprecated-deselectable {\n  cursor: var(--list-item-selectable-cursor);\n}\n\n.saltListItemDeprecated-textWrapper {\n  flex: 1;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.saltListItemDeprecated-selected {\n  color: var(--list-item-text-color-active);\n  background: var(--list-item-background-active);\n  cursor: var(--list-item-cursor);\n}\n\n.saltListItemDeprecated-disabled {\n  cursor: var(--list-item-disabled-cursor);\n  opacity: var(--list-item-disabled-regular-opacity);\n}\n\n.saltListItemDeprecated-focusVisible:after {\n  top: 2px;\n  left: 2px;\n  right: 2px;\n  bottom: 2px;\n  content: \"\";\n  position: absolute;\n\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-color: var(--salt-focused-outlineColor);\n  outline-offset: var(--salt-focused-outlineOffset);\n}\n\n.saltListItemDeprecated-focusVisible.saltListItemDeprecated-selected:after {\n  outline-color: var(--list-item-selected-focus-outlineColor);\n}\n";
+var css_248z = ".saltListItemDeprecated {\n  /* Color */\n  --list-item-text-color: var(--salt-selectable-foreground);\n  --list-item-background: var(--salt-selectable-background);\n  --list-item-background-hover: var(--salt-selectable-background-hover);\n  --list-item-selected-focus-outlineColor: var(--salt-accent-foreground); /* TODO: Check token with design */\n\n  --list-item-text-color-active: var(--salt-selectable-foreground-selected);\n  --list-item-background-active: var(--salt-selectable-background-selected);\n\n  /* Text, Font */\n  --list-item-textAlign: var(--salt-text-textAlign);\n  --list-item-fontSize: var(--salt-text-fontSize);\n  --list-item-lineHeight: var(--salt-text-lineHeight);\n\n  /* Spacing */\n  --list-item-padding: 0 var(--salt-size-unit);\n\n  /* Misc. */\n  --list-item-gap: 0px;\n  --list-item-alignItems: center;\n  --list-item-selectable-cursor: pointer;\n  --list-item-cursor: default;\n\n  --list-item-disabled-cursor: var(--salt-selectable-cursor-disabled);\n  --list-item-disabled-regular-opacity: var(--salt-palette-opacity-disabled);\n}\n\n.saltListItemDeprecated {\n  color: var(--list-item-text-color);\n  background: var(--list-item-background);\n  text-align: var(--list-item-textAlign);\n  line-height: var(--list-item-lineHeight);\n  font-size: var(--list-item-fontSize);\n  padding: var(--list-item-padding);\n  left: 0;\n  right: 0;\n  display: flex;\n  position: relative;\n  align-items: var(--list-item-alignItems);\n  white-space: nowrap;\n}\n\n.saltListItemDeprecated {\n  /* Replaced border-bottom with margin. In design spec, the height of the items should not include gap */\n  margin-bottom: var(--list-item-gap);\n  cursor: var(--list-item-selectable-cursor);\n}\n\n.saltListItemDeprecated:last-child {\n  margin-bottom: 0px;\n}\n\n.saltListItemDeprecated.saltListItemDeprecated-highlighted:not(.saltListItemDeprecated-selected) {\n  background: var(--list-item-background-hover);\n}\n\n.saltListItemDeprecated.saltListItemDeprecated-deselectable {\n  cursor: var(--list-item-selectable-cursor);\n}\n\n.saltListItemDeprecated-textWrapper {\n  flex: 1;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.saltListItemDeprecated-selected {\n  color: var(--list-item-text-color-active);\n  background: var(--list-item-background-active);\n  cursor: var(--list-item-cursor);\n}\n\n.saltListItemDeprecated-disabled {\n  cursor: var(--list-item-disabled-cursor);\n  opacity: var(--list-item-disabled-regular-opacity);\n}\n\n.saltListItemDeprecated-focusVisible:after {\n  top: 2px;\n  left: 2px;\n  right: 2px;\n  bottom: 2px;\n  content: \"\";\n  position: absolute;\n\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-color: var(--salt-focused-outlineColor);\n  outline-offset: var(--salt-focused-outlineOffset);\n}\n\n.saltListItemDeprecated-focusVisible.saltListItemDeprecated-selected:after {\n  outline-color: var(--list-item-selected-focus-outlineColor);\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=ListItem.css.js.map

package/dist-cjs/list-next/ListItemNext.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var css_248z = "/* Default variables applied to the root element */\n.saltListItemNext {\n  --listNext-item-text-color: var(--salt-text-primary-foreground);\n  --listNext-item-background: none;\n}\n\n.saltListItemNext {\n  color: var(--listNext-item-text-color);\n  background: var(--listNext-item-background);\n  height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding-inline: var(--salt-spacing-100);\n  display: flex;\n  gap: var(--salt-size-unit);\n  position: relative;\n  align-items: center;\n  white-space: nowrap;\n  transition: background var(--salt-duration-perceptible) ease-in-out;\n}\n\n/* Class applied to list item on focus using keyboard navigation only */\n.saltListItemNext-focused {\n  outline: var(--salt-focused-outline);\n  outline-offset: calc(var(--salt-focused-outlineWidth) * -1);\n}\n\n/* Active list item on hover using mouse */\n.saltListItemNext:hover:not([aria-disabled=\"true\"]),\n/* Active list item on focus using keyboard navigation  */\n.saltListItemNext-focused {\n  --listNext-item-background: var(--salt-selectable-background-hover);\n  cursor: var(--salt-selectable-cursor-hover);\n}\n\n.saltListItemNext[aria-selected=\"true\"] {\n  border-block: var(--salt-size-border) var(--salt-container-borderStyle) var(--salt-selectable-borderColor-selected);\n  --listNext-item-background: var(--salt-selectable-background-selected);\n  --saltIcon-color: var(--salt-selectable-foreground-selected);\n}\n\n/* Style applied to disabled items */\n.saltListItemNext[aria-disabled=\"true\"] {\n  --listNext-item-text-color: var(--salt-text-primary-foreground-disabled);\n  cursor: var(--salt-selectable-cursor-disabled);\n}\n.saltListItemNext[aria-disabled=\"true\"] .saltText {\n  color: var(--listNext-item-text-color);\n}\n\n/* disabled list item when selected */\n.saltListItemNext[aria-disabled=\"true\"][aria-selected=\"true\"] {\n  border-block: var(--salt-size-border) var(--salt-container-borderStyle) var(--salt-selectable-borderColor-selectedDisabled);\n  --listNext-item-background: var(--salt-selectable-background-selectedDisabled);\n}\n";
+var css_248z = "/* Default variables applied to the root element */\n.saltListItemNext {\n  --listNext-item-text-color: var(--salt-text-primary-foreground);\n  --listNext-item-background: none;\n}\n\n.saltListItemNext {\n  color: var(--listNext-item-text-color);\n  background: var(--listNext-item-background);\n  height: calc(var(--salt-size-base) + var(--salt-spacing-100));\n  padding-inline: var(--salt-spacing-100);\n  display: flex;\n  gap: var(--salt-size-unit);\n  position: relative;\n  align-items: center;\n  white-space: nowrap;\n}\n\n/* Class applied to list item on focus using keyboard navigation only */\n.saltListItemNext-focused {\n  outline: var(--salt-focused-outline);\n  outline-offset: calc(var(--salt-focused-outlineWidth) * -1);\n}\n\n/* Active list item on hover using mouse */\n.saltListItemNext:hover:not([aria-disabled=\"true\"]),\n/* Active list item on focus using keyboard navigation  */\n.saltListItemNext-focused {\n  --listNext-item-background: var(--salt-selectable-background-hover);\n  cursor: var(--salt-selectable-cursor-hover);\n}\n\n.saltListItemNext[aria-selected=\"true\"] {\n  border-block: var(--salt-size-border) var(--salt-container-borderStyle) var(--salt-selectable-borderColor-selected);\n  --listNext-item-background: var(--salt-selectable-background-selected);\n  --saltIcon-color: var(--salt-selectable-foreground-selected);\n}\n\n/* Style applied to disabled items */\n.saltListItemNext[aria-disabled=\"true\"] {\n  --listNext-item-text-color: var(--salt-text-primary-foreground-disabled);\n  cursor: var(--salt-selectable-cursor-disabled);\n}\n.saltListItemNext[aria-disabled=\"true\"] .saltText {\n  color: var(--listNext-item-text-color);\n}\n\n/* disabled list item when selected */\n.saltListItemNext[aria-disabled=\"true\"][aria-selected=\"true\"] {\n  border-block: var(--salt-size-border) var(--salt-container-borderStyle) var(--salt-selectable-borderColor-selectedDisabled);\n  --listNext-item-background: var(--salt-selectable-background-selectedDisabled);\n}\n";
 
 module.exports = css_248z;
 //# sourceMappingURL=ListItemNext.css.js.map