@salt-ds/lab 1.0.0-alpha.91 → 1.0.0-alpha.93

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salt-ds/lab",
-  "version": "1.0.0-alpha.91",
+  "version": "1.0.0-alpha.93",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -21,7 +21,7 @@
   ],
   "dependencies": {
     "@floating-ui/react": "^0.26.28",
-    "@salt-ds/core": "^1.61.0",
+    "@salt-ds/core": "^1.62.0",
     "@salt-ds/date-components": "0.1.0",
     "@salt-ds/icons": "^1.18.0",
     "@salt-ds/styles": "0.3.0",

package/dist-cjs/side-panel/SidePanel.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var css_248z = ".saltSidePanel {\n  background-color: var(--sidePanel-background, var(--salt-container-primary-background));\n  --saltSidePanel-width: 300px;\n  --sidePanel-border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--sidePanel-borderColor, var(--salt-container-primary-borderColor));\n  --saltSidePanel-padding: var(--salt-spacing-300);\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n}\n\n.saltSidePanel-primary {\n  --sidePanel-background: var(--salt-container-primary-background);\n  --sidePanel-borderColor: var(--salt-container-primary-borderColor);\n}\n\n.saltSidePanel-secondary {\n  --sidePanel-background: var(--salt-container-secondary-background);\n  --sidePanel-borderColor: var(--salt-container-secondary-borderColor);\n}\n\n.saltSidePanel-tertiary {\n  --sidePanel-background: var(--salt-container-tertiary-background);\n  --sidePanel-borderColor: var(--salt-container-tertiary-borderColor);\n}\n\n.saltSidePanel-left {\n  border-right: var(--sidePanel-border);\n}\n.saltSidePanel-right {\n  border-left: var(--sidePanel-border);\n}\n\n.saltSidePanel-none {\n  --sidePanel-background: none;\n  border: none;\n}\n\n.saltSidePanel-none {\n  --saltSidePanel-padding: var(--salt-spacing-200);\n}\n\n.saltSidePanel-left,\n.saltSidePanel-right {\n  width: var(--saltSidePanel-width);\n  height: 100%;\n  min-height: 0;\n  align-self: stretch;\n}\n\n.saltSidePanel-enterAnimation,\n.saltSidePanel-exitAnimation {\n  overflow: hidden;\n}\n\n.saltSidePanel-left.saltSidePanel-enterAnimation,\n.saltSidePanel-right.saltSidePanel-enterAnimation {\n  animation: saltSidePanel-expandWidth var(--salt-duration-perceptible) var(--salt-animation-timing-function);\n}\n\n.saltSidePanel-left.saltSidePanel-exitAnimation,\n.saltSidePanel-right.saltSidePanel-exitAnimation {\n  animation: saltSidePanel-collapseWidth var(--salt-duration-perceptible) var(--salt-animation-timing-function) both;\n}\n\n.saltSidePanel-exitAnimation {\n  pointer-events: none;\n}\n\n.saltSidePanel-inner {\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0;\n  padding: var(--saltSidePanel-padding);\n}\n\n.saltSidePanel-left .saltSidePanel-inner,\n.saltSidePanel-right .saltSidePanel-inner {\n  width: var(--saltSidePanel-width);\n  height: 100%;\n}\n\n@keyframes saltSidePanel-expandWidth {\n  from {\n    width: 0;\n  }\n}\n@keyframes saltSidePanel-collapseWidth {\n  to {\n    width: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .saltSidePanel-left.saltSidePanel-enterAnimation,\n  .saltSidePanel-right.saltSidePanel-enterAnimation,\n  .saltSidePanel-left.saltSidePanel-exitAnimation,\n  .saltSidePanel-right.saltSidePanel-exitAnimation {\n    animation: none;\n  }\n}\n";
-
-module.exports = css_248z;
-//# sourceMappingURL=SidePanel.css.js.map

package/dist-cjs/side-panel/SidePanel.css.js.map

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

package/dist-cjs/side-panel/SidePanel.js

@@ -1,151 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var react$1 = require('@floating-ui/react');
-var core = require('@salt-ds/core');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var clsx = require('clsx');
-var react = require('react');
-var SidePanelContext = require('./internal/SidePanelContext.js');
-require('tabbable');
-var SidePanel$1 = require('./SidePanel.css.js');
-
-const withBaseName = core.makePrefixer("saltSidePanel");
-const SidePanel = react.forwardRef(
-  function SidePanel2(props, ref) {
-    const {
-      disableAnimation = false,
-      position = "right",
-      initialFocus,
-      variant = "primary",
-      children,
-      id: idProp,
-      className,
-      "aria-labelledby": ariaLabelledBy,
-      onAnimationEnd,
-      ...rest
-    } = props;
-    const sidePanelContext = SidePanelContext.useSidePanelContext();
-    const { openState, floatingRootContext, setFloating, setPanelId, titleId } = sidePanelContext;
-    const positionedContext = react.useMemo(
-      () => ({ ...sidePanelContext, position }),
-      [sidePanelContext, position]
-    );
-    const id = core.useId(idProp);
-    const [showComponent, setShowComponent] = react.useState(openState);
-    const [animating, setAnimating] = react.useState(false);
-    const shouldAnimateOpen = react.useRef(!openState);
-    const [skipInitialFocus, setSkipInitialFocus] = react.useState(() => {
-      var _a;
-      if (!openState) return false;
-      const reference = floatingRootContext.elements.reference;
-      if (!(reference instanceof Element)) return true;
-      const activeElement = (_a = reference.ownerDocument) == null ? void 0 : _a.activeElement;
-      return !activeElement || !reference.contains(activeElement);
-    });
-    const targetWindow = window.useWindow();
-    styles.useComponentCssInjection({
-      testId: "salt-side-panel",
-      css: SidePanel$1,
-      window: targetWindow
-    });
-    const { context } = core.useFloatingUI({
-      rootContext: floatingRootContext
-    });
-    const handleRef = core.useForkRef(setFloating, ref);
-    const handleAnimationEnd = (event) => {
-      onAnimationEnd == null ? void 0 : onAnimationEnd(event);
-      if (event.currentTarget !== event.target || disableAnimation) return;
-      setAnimating(false);
-      if (!openState) {
-        setShowComponent(false);
-      }
-    };
-    react.useEffect(() => {
-      setPanelId(id);
-      return () => {
-        setPanelId(void 0);
-      };
-    }, [id, setPanelId]);
-    react.useEffect(() => {
-      if (!openState) {
-        setSkipInitialFocus(false);
-      }
-    }, [openState]);
-    core.useIsomorphicLayoutEffect(() => {
-      var _a, _b;
-      if (disableAnimation) {
-        setShowComponent(openState);
-        setAnimating(false);
-        if (!openState) shouldAnimateOpen.current = true;
-        return;
-      }
-      if (!openState) {
-        shouldAnimateOpen.current = true;
-      }
-      if (openState && !shouldAnimateOpen.current) {
-        setShowComponent(true);
-        setAnimating(false);
-        return;
-      }
-      const prefersReducedMotion = (_b = (_a = targetWindow == null ? void 0 : targetWindow.matchMedia) == null ? void 0 : _a.call(
-        targetWindow,
-        "(prefers-reduced-motion: reduce)"
-      )) == null ? void 0 : _b.matches;
-      if (openState) {
-        setShowComponent(true);
-      }
-      if (prefersReducedMotion) {
-        setAnimating(false);
-        if (!openState) {
-          setShowComponent(false);
-        }
-      } else {
-        setAnimating(true);
-      }
-    }, [openState, targetWindow, disableAnimation]);
-    if (!showComponent) return null;
-    const resolvedInitialFocus = skipInitialFocus ? -1 : initialFocus ?? 0;
-    const panelDiv = /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        role: "region",
-        "aria-labelledby": clsx.clsx(ariaLabelledBy, titleId) || void 0,
-        ref: handleRef,
-        className: clsx.clsx(
-          withBaseName(),
-          {
-            [withBaseName(position)]: position,
-            [withBaseName(variant)]: variant,
-            [withBaseName("enterAnimation")]: !disableAnimation && openState && animating,
-            [withBaseName("exitAnimation")]: !disableAnimation && !openState && animating
-          },
-          className
-        ),
-        onAnimationEnd: handleAnimationEnd,
-        tabIndex: -1,
-        ...rest,
-        id,
-        children: /* @__PURE__ */ jsxRuntime.jsx(SidePanelContext.SidePanelContext.Provider, { value: positionedContext, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: withBaseName("inner"), children }) })
-      }
-    );
-    if (openState || animating) {
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        react$1.FloatingFocusManager,
-        {
-          context,
-          modal: false,
-          initialFocus: resolvedInitialFocus,
-          closeOnFocusOut: false,
-          guards: false,
-          children: panelDiv
-        }
-      );
-    }
-    return panelDiv;
-  }
-);
-
-exports.SidePanel = SidePanel;
-//# sourceMappingURL=SidePanel.js.map

package/dist-cjs/side-panel/SidePanel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SidePanel.js","sources":["../src/side-panel/SidePanel.tsx"],"sourcesContent":["import { FloatingFocusManager } from \"@floating-ui/react\";\nimport {\n  makePrefixer,\n  useFloatingUI,\n  useForkRef,\n  useId,\n  useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type AnimationEvent,\n  type ComponentProps,\n  type ComponentPropsWithRef,\n  forwardRef,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { SidePanelContext, useSidePanelContext } from \"./internal\";\nimport sidePanelCss from \"./SidePanel.css\";\n\nconst withBaseName = makePrefixer(\"saltSidePanel\");\n\nexport interface SidePanelProps extends ComponentPropsWithRef<\"div\"> {\n  /**\n   * Disable the panel's own open/close animation.\n   * Set to `true` when the parent controls sizing and animation (e.g. inside a splitter).\n   * @default false\n   */\n  disableAnimation?: boolean;\n  /**\n   * Edge the panel is anchored to; controls animation direction and divider side.\n   * @default \"right\"\n   */\n  position?: \"right\" | \"left\";\n  /**\n   * Which element receives focus when the panel opens.\n   * Pass a number for the tabbable element index (0 = first), or a ref to a specific element.\n   * Defaults to the side panel close button.\n   */\n  initialFocus?: ComponentProps<typeof FloatingFocusManager>[\"initialFocus\"];\n  /**\n   * The background color palette. Options are 'primary', 'secondary', 'tertiary' and 'none'.\n   * @default \"primary\"\n   */\n  variant?: \"primary\" | \"secondary\" | \"tertiary\" | \"none\";\n}\n\nexport const SidePanel = forwardRef<HTMLDivElement, SidePanelProps>(\n  function SidePanel(props, ref) {\n    const {\n      disableAnimation = false,\n      position = \"right\",\n      initialFocus,\n      variant = \"primary\",\n      children,\n      id: idProp,\n      className,\n      \"aria-labelledby\": ariaLabelledBy,\n      onAnimationEnd,\n      ...rest\n    } = props;\n\n    const sidePanelContext = useSidePanelContext();\n    const { openState, floatingRootContext, setFloating, setPanelId, titleId } =\n      sidePanelContext;\n    const positionedContext = useMemo(\n      () => ({ ...sidePanelContext, position }),\n      [sidePanelContext, position],\n    );\n\n    const id = useId(idProp);\n\n    const [showComponent, setShowComponent] = useState(openState);\n    const [animating, setAnimating] = useState(false);\n    const shouldAnimateOpen = useRef(!openState);\n    // On first mount while open, skip moving focus when focus did not come from the trigger.\n    const [skipInitialFocus, setSkipInitialFocus] = useState(() => {\n      if (!openState) return false;\n      const reference = floatingRootContext.elements.reference;\n      if (!(reference instanceof Element)) return true;\n      const activeElement = reference.ownerDocument?.activeElement;\n      return !activeElement || !reference.contains(activeElement);\n    });\n    const targetWindow = useWindow();\n\n    useComponentCssInjection({\n      testId: \"salt-side-panel\",\n      css: sidePanelCss,\n      window: targetWindow,\n    });\n\n    const { context } = useFloatingUI({\n      rootContext: floatingRootContext,\n    });\n\n    const handleRef = useForkRef<HTMLDivElement>(setFloating, ref);\n\n    const handleAnimationEnd = (event: AnimationEvent<HTMLDivElement>) => {\n      onAnimationEnd?.(event);\n\n      if (event.currentTarget !== event.target || disableAnimation) return;\n      setAnimating(false);\n      if (!openState) {\n        setShowComponent(false);\n      }\n    };\n\n    useEffect(() => {\n      setPanelId(id);\n      return () => {\n        setPanelId(undefined);\n      };\n    }, [id, setPanelId]);\n\n    useEffect(() => {\n      if (!openState) {\n        setSkipInitialFocus(false);\n      }\n    }, [openState]);\n\n    useIsomorphicLayoutEffect(() => {\n      if (disableAnimation) {\n        setShowComponent(openState);\n        setAnimating(false);\n        if (!openState) shouldAnimateOpen.current = true;\n        return;\n      }\n\n      if (!openState) {\n        shouldAnimateOpen.current = true;\n      }\n\n      // Don't animate if the panel has never been closed (defaultOpen scenario).\n      if (openState && !shouldAnimateOpen.current) {\n        setShowComponent(true);\n        setAnimating(false);\n        return;\n      }\n\n      const prefersReducedMotion = targetWindow?.matchMedia?.(\n        \"(prefers-reduced-motion: reduce)\",\n      )?.matches;\n\n      if (openState) {\n        setShowComponent(true);\n      }\n\n      if (prefersReducedMotion) {\n        setAnimating(false);\n        if (!openState) {\n          setShowComponent(false);\n        }\n      } else {\n        setAnimating(true);\n      }\n    }, [openState, targetWindow, disableAnimation]);\n\n    if (!showComponent) return null;\n\n    const resolvedInitialFocus = skipInitialFocus ? -1 : (initialFocus ?? 0);\n\n    const panelDiv = (\n      <div\n        role=\"region\"\n        aria-labelledby={clsx(ariaLabelledBy, titleId) || undefined}\n        ref={handleRef}\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(position)]: position,\n            [withBaseName(variant)]: variant,\n            [withBaseName(\"enterAnimation\")]:\n              !disableAnimation && openState && animating,\n            [withBaseName(\"exitAnimation\")]:\n              !disableAnimation && !openState && animating,\n          },\n          className,\n        )}\n        onAnimationEnd={handleAnimationEnd}\n        tabIndex={-1}\n        {...rest}\n        id={id}\n      >\n        <SidePanelContext.Provider value={positionedContext}>\n          <div className={withBaseName(\"inner\")}>{children}</div>\n        </SidePanelContext.Provider>\n      </div>\n    );\n\n    if (openState || animating) {\n      return (\n        <FloatingFocusManager\n          context={context}\n          modal={false}\n          initialFocus={resolvedInitialFocus}\n          closeOnFocusOut={false}\n          guards={false}\n        >\n          {panelDiv}\n        </FloatingFocusManager>\n      );\n    }\n\n    return panelDiv;\n  },\n);\n"],"names":["makePrefixer","forwardRef","SidePanel","useSidePanelContext","useMemo","useId","useState","useRef","useWindow","useComponentCssInjection","sidePanelCss","useFloatingUI","useForkRef","useEffect","useIsomorphicLayoutEffect","jsx","clsx","SidePanelContext","FloatingFocusManager"],"mappings":";;;;;;;;;;;;;AAwBA,MAAM,YAAA,GAAeA,kBAAa,eAAe,CAAA;AA2B1C,MAAM,SAAA,GAAYC,gBAAA;AAAA,EACvB,SAASC,UAAAA,CAAU,KAAA,EAAO,GAAA,EAAK;AAC7B,IAAA,MAAM;AAAA,MACJ,gBAAA,GAAmB,KAAA;AAAA,MACnB,QAAA,GAAW,OAAA;AAAA,MACX,YAAA;AAAA,MACA,OAAA,GAAU,SAAA;AAAA,MACV,QAAA;AAAA,MACA,EAAA,EAAI,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,iBAAA,EAAmB,cAAA;AAAA,MACnB,cAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,mBAAmBC,oCAAA,EAAoB;AAC7C,IAAA,MAAM,EAAE,SAAA,EAAW,mBAAA,EAAqB,WAAA,EAAa,UAAA,EAAY,SAAQ,GACvE,gBAAA;AACF,IAAA,MAAM,iBAAA,GAAoBC,aAAA;AAAA,MACxB,OAAO,EAAE,GAAG,gBAAA,EAAkB,QAAA,EAAS,CAAA;AAAA,MACvC,CAAC,kBAAkB,QAAQ;AAAA,KAC7B;AAEA,IAAA,MAAM,EAAA,GAAKC,WAAM,MAAM,CAAA;AAEvB,IAAA,MAAM,CAAC,aAAA,EAAe,gBAAgB,CAAA,GAAIC,eAAS,SAAS,CAAA;AAC5D,IAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIA,eAAS,KAAK,CAAA;AAChD,IAAA,MAAM,iBAAA,GAAoBC,YAAA,CAAO,CAAC,SAAS,CAAA;AAE3C,IAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAID,eAAS,MAAM;AAhFnE,MAAA,IAAA,EAAA;AAiFM,MAAA,IAAI,CAAC,WAAW,OAAO,KAAA;AACvB,MAAA,MAAM,SAAA,GAAY,oBAAoB,QAAA,CAAS,SAAA;AAC/C,MAAA,IAAI,EAAE,SAAA,YAAqB,OAAA,CAAA,EAAU,OAAO,IAAA;AAC5C,MAAA,MAAM,aAAA,GAAA,CAAgB,EAAA,GAAA,SAAA,CAAU,aAAA,KAAV,IAAA,GAAA,MAAA,GAAA,EAAA,CAAyB,aAAA;AAC/C,MAAA,OAAO,CAAC,aAAA,IAAiB,CAAC,SAAA,CAAU,SAAS,aAAa,CAAA;AAAA,IAC5D,CAAC,CAAA;AACD,IAAA,MAAM,eAAeE,gBAAA,EAAU;AAE/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,iBAAA;AAAA,MACR,GAAA,EAAKC,WAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,OAAA,EAAQ,GAAIC,kBAAA,CAAc;AAAA,MAChC,WAAA,EAAa;AAAA,KACd,CAAA;AAED,IAAA,MAAM,SAAA,GAAYC,eAAA,CAA2B,WAAA,EAAa,GAAG,CAAA;AAE7D,IAAA,MAAM,kBAAA,GAAqB,CAAC,KAAA,KAA0C;AACpE,MAAA,cAAA,IAAA,IAAA,GAAA,MAAA,GAAA,cAAA,CAAiB,KAAA,CAAA;AAEjB,MAAA,IAAI,KAAA,CAAM,aAAA,KAAkB,KAAA,CAAM,MAAA,IAAU,gBAAA,EAAkB;AAC9D,MAAA,YAAA,CAAa,KAAK,CAAA;AAClB,MAAA,IAAI,CAAC,SAAA,EAAW;AACd,QAAA,gBAAA,CAAiB,KAAK,CAAA;AAAA,MACxB;AAAA,IACF,CAAA;AAEA,IAAAC,eAAA,CAAU,MAAM;AACd,MAAA,UAAA,CAAW,EAAE,CAAA;AACb,MAAA,OAAO,MAAM;AACX,QAAA,UAAA,CAAW,MAAS,CAAA;AAAA,MACtB,CAAA;AAAA,IACF,CAAA,EAAG,CAAC,EAAA,EAAI,UAAU,CAAC,CAAA;AAEnB,IAAAA,eAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,SAAA,EAAW;AACd,QAAA,mBAAA,CAAoB,KAAK,CAAA;AAAA,MAC3B;AAAA,IACF,CAAA,EAAG,CAAC,SAAS,CAAC,CAAA;AAEd,IAAAC,8BAAA,CAA0B,MAAM;AA5HpC,MAAA,IAAA,EAAA,EAAA,EAAA;AA6HM,MAAA,IAAI,gBAAA,EAAkB;AACpB,QAAA,gBAAA,CAAiB,SAAS,CAAA;AAC1B,QAAA,YAAA,CAAa,KAAK,CAAA;AAClB,QAAA,IAAI,CAAC,SAAA,EAAW,iBAAA,CAAkB,OAAA,GAAU,IAAA;AAC5C,QAAA;AAAA,MACF;AAEA,MAAA,IAAI,CAAC,SAAA,EAAW;AACd,QAAA,iBAAA,CAAkB,OAAA,GAAU,IAAA;AAAA,MAC9B;AAGA,MAAA,IAAI,SAAA,IAAa,CAAC,iBAAA,CAAkB,OAAA,EAAS;AAC3C,QAAA,gBAAA,CAAiB,IAAI,CAAA;AACrB,QAAA,YAAA,CAAa,KAAK,CAAA;AAClB,QAAA;AAAA,MACF;AAEA,MAAA,MAAM,oBAAA,GAAA,CAAuB,wDAAc,UAAA,KAAd,IAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA;AAAA,QAAA,YAAA;AAAA,QAC3B;AAAA,OAAA,KAD2B,IAAA,GAAA,MAAA,GAAA,EAAA,CAE1B,OAAA;AAEH,MAAA,IAAI,SAAA,EAAW;AACb,QAAA,gBAAA,CAAiB,IAAI,CAAA;AAAA,MACvB;AAEA,MAAA,IAAI,oBAAA,EAAsB;AACxB,QAAA,YAAA,CAAa,KAAK,CAAA;AAClB,QAAA,IAAI,CAAC,SAAA,EAAW;AACd,UAAA,gBAAA,CAAiB,KAAK,CAAA;AAAA,QACxB;AAAA,MACF,CAAA,MAAO;AACL,QAAA,YAAA,CAAa,IAAI,CAAA;AAAA,MACnB;AAAA,IACF,CAAA,EAAG,CAAC,SAAA,EAAW,YAAA,EAAc,gBAAgB,CAAC,CAAA;AAE9C,IAAA,IAAI,CAAC,eAAe,OAAO,IAAA;AAE3B,IAAA,MAAM,oBAAA,GAAuB,gBAAA,GAAmB,EAAA,GAAM,YAAA,IAAgB,CAAA;AAEtE,IAAA,MAAM,QAAA,mBACJC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,QAAA;AAAA,QACL,iBAAA,EAAiBC,SAAA,CAAK,cAAA,EAAgB,OAAO,CAAA,IAAK,MAAA;AAAA,QAClD,GAAA,EAAK,SAAA;AAAA,QACL,SAAA,EAAWA,SAAA;AAAA,UACT,YAAA,EAAa;AAAA,UACb;AAAA,YACE,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG,QAAA;AAAA,YAC1B,CAAC,YAAA,CAAa,OAAO,CAAC,GAAG,OAAA;AAAA,YACzB,CAAC,YAAA,CAAa,gBAAgB,CAAC,GAC7B,CAAC,oBAAoB,SAAA,IAAa,SAAA;AAAA,YACpC,CAAC,aAAa,eAAe,CAAC,GAC5B,CAAC,gBAAA,IAAoB,CAAC,SAAA,IAAa;AAAA,WACvC;AAAA,UACA;AAAA,SACF;AAAA,QACA,cAAA,EAAgB,kBAAA;AAAA,QAChB,QAAA,EAAU,EAAA;AAAA,QACT,GAAG,IAAA;AAAA,QACJ,EAAA;AAAA,QAEA,QAAA,kBAAAD,cAAA,CAACE,iCAAA,CAAiB,QAAA,EAAjB,EAA0B,KAAA,EAAO,iBAAA,EAChC,QAAA,kBAAAF,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,YAAA,CAAa,OAAO,CAAA,EAAI,UAAS,CAAA,EACnD;AAAA;AAAA,KACF;AAGF,IAAA,IAAI,aAAa,SAAA,EAAW;AAC1B,MAAA,uBACEA,cAAA;AAAA,QAACG,4BAAA;AAAA,QAAA;AAAA,UACC,OAAA;AAAA,UACA,KAAA,EAAO,KAAA;AAAA,UACP,YAAA,EAAc,oBAAA;AAAA,UACd,eAAA,EAAiB,KAAA;AAAA,UACjB,MAAA,EAAQ,KAAA;AAAA,UAEP,QAAA,EAAA;AAAA;AAAA,OACH;AAAA,IAEJ;AAEA,IAAA,OAAO,QAAA;AAAA,EACT;AACF;;;;"}

package/dist-cjs/side-panel/SidePanelCloseButton.js

@@ -1,38 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var clsx = require('clsx');
-var react = require('react');
-var SidePanelContext = require('./internal/SidePanelContext.js');
-require('tabbable');
-
-const withBaseName = core.makePrefixer("saltSidePanelCloseButton");
-const SidePanelCloseButton = react.forwardRef(
-  function SidePanelCloseButton2({ className, onClick, id: idProp, ...rest }, ref) {
-    const { CollapseLeftIcon, CollapseRightIcon } = core.useIcon();
-    const { setOpen, titleId, position } = SidePanelContext.useSidePanelContext();
-    const closeButtonId = core.useId(idProp);
-    const handleClick = (event) => {
-      onClick == null ? void 0 : onClick(event);
-      setOpen(false);
-    };
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      core.Button,
-      {
-        ref,
-        id: closeButtonId,
-        "aria-label": "Close",
-        "aria-labelledby": titleId ? clsx.clsx(closeButtonId, titleId) : void 0,
-        appearance: "transparent",
-        className: clsx.clsx(withBaseName(), className),
-        onClick: handleClick,
-        ...rest,
-        children: position === "left" ? /* @__PURE__ */ jsxRuntime.jsx(CollapseLeftIcon, { "aria-hidden": true }) : /* @__PURE__ */ jsxRuntime.jsx(CollapseRightIcon, { "aria-hidden": true })
-      }
-    );
-  }
-);
-
-exports.SidePanelCloseButton = SidePanelCloseButton;
-//# sourceMappingURL=SidePanelCloseButton.js.map

package/dist-cjs/side-panel/SidePanelCloseButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SidePanelCloseButton.js","sources":["../src/side-panel/SidePanelCloseButton.tsx"],"sourcesContent":["import {\n  Button,\n  type ButtonProps,\n  makePrefixer,\n  useIcon,\n  useId,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, type MouseEvent } from \"react\";\nimport { useSidePanelContext } from \"./internal\";\n\nconst withBaseName = makePrefixer(\"saltSidePanelCloseButton\");\n\nexport const SidePanelCloseButton = forwardRef<HTMLButtonElement, ButtonProps>(\n  function SidePanelCloseButton(\n    { className, onClick, id: idProp, ...rest },\n    ref,\n  ) {\n    const { CollapseLeftIcon, CollapseRightIcon } = useIcon();\n    const { setOpen, titleId, position } = useSidePanelContext();\n    const closeButtonId = useId(idProp);\n\n    const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n      onClick?.(event);\n      setOpen(false);\n    };\n\n    return (\n      <Button\n        ref={ref}\n        id={closeButtonId}\n        aria-label=\"Close\"\n        aria-labelledby={titleId ? clsx(closeButtonId, titleId) : undefined}\n        appearance=\"transparent\"\n        className={clsx(withBaseName(), className)}\n        onClick={handleClick}\n        {...rest}\n      >\n        {position === \"left\" ? (\n          <CollapseLeftIcon aria-hidden />\n        ) : (\n          <CollapseRightIcon aria-hidden />\n        )}\n      </Button>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","SidePanelCloseButton","useIcon","useSidePanelContext","useId","jsx","Button","clsx"],"mappings":";;;;;;;;;AAWA,MAAM,YAAA,GAAeA,kBAAa,0BAA0B,CAAA;AAErD,MAAM,oBAAA,GAAuBC,gBAAA;AAAA,EAClC,SAASC,qBAAAA,CACP,EAAE,SAAA,EAAW,OAAA,EAAS,IAAI,MAAA,EAAQ,GAAG,IAAA,EAAK,EAC1C,GAAA,EACA;AACA,IAAA,MAAM,EAAE,gBAAA,EAAkB,iBAAA,EAAkB,GAAIC,YAAA,EAAQ;AACxD,IAAA,MAAM,EAAE,OAAA,EAAS,OAAA,EAAS,QAAA,KAAaC,oCAAA,EAAoB;AAC3D,IAAA,MAAM,aAAA,GAAgBC,WAAM,MAAM,CAAA;AAElC,IAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyC;AAC5D,MAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AACV,MAAA,OAAA,CAAQ,KAAK,CAAA;AAAA,IACf,CAAA;AAEA,IAAA,uBACEC,cAAA;AAAA,MAACC,WAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,EAAA,EAAI,aAAA;AAAA,QACJ,YAAA,EAAW,OAAA;AAAA,QACX,iBAAA,EAAiB,OAAA,GAAUC,SAAA,CAAK,aAAA,EAAe,OAAO,CAAA,GAAI,MAAA;AAAA,QAC1D,UAAA,EAAW,aAAA;AAAA,QACX,SAAA,EAAWA,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,OAAA,EAAS,WAAA;AAAA,QACR,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA,QAAA,KAAa,MAAA,mBACZF,cAAA,CAAC,gBAAA,EAAA,EAAiB,aAAA,EAAW,MAAC,CAAA,mBAE9BA,cAAA,CAAC,iBAAA,EAAA,EAAkB,aAAA,EAAW,IAAA,EAAC;AAAA;AAAA,KAEnC;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/side-panel/SidePanelContent.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var css_248z = ".saltSidePanelContent {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0;\n}\n\n.saltSidePanelContent-body {\n  flex: 1;\n  min-height: 0;\n  overflow: auto;\n}\n";
-
-module.exports = css_248z;
-//# sourceMappingURL=SidePanelContent.css.js.map

package/dist-cjs/side-panel/SidePanelContent.css.js.map

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

package/dist-cjs/side-panel/SidePanelContent.js

@@ -1,66 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var clsx = require('clsx');
-var react = require('react');
-var SidePanelContext = require('./internal/SidePanelContext.js');
-var useIsScrollable = require('./internal/useIsScrollable.js');
-require('tabbable');
-var SidePanelContent$1 = require('./SidePanelContent.css.js');
-
-const withBaseName = core.makePrefixer("saltSidePanelContent");
-const SidePanelContent = react.forwardRef(function SidePanelContent2(props, ref) {
-  const {
-    children,
-    className,
-    "aria-labelledby": ariaLabelledBy,
-    "aria-label": ariaLabel,
-    ...rest
-  } = props;
-  const { titleId } = SidePanelContext.useSidePanelContext();
-  const targetWindow = window.useWindow();
-  const contentSuffixId = core.useId();
-  const bodyRef = react.useRef(null);
-  const isScrollable = useIsScrollable.useIsScrollable(bodyRef);
-  styles.useComponentCssInjection({
-    testId: "salt-side-panel-content",
-    css: SidePanelContent$1,
-    window: targetWindow
-  });
-  const explicitLabelledBy = ariaLabelledBy;
-  const explicitLabel = ariaLabel;
-  let bodyAriaLabelledBy;
-  let bodyAriaLabel;
-  if (isScrollable) {
-    if (explicitLabelledBy) {
-      bodyAriaLabelledBy = explicitLabelledBy;
-    } else if (titleId) {
-      bodyAriaLabelledBy = clsx.clsx(titleId, contentSuffixId) || void 0;
-    } else {
-      bodyAriaLabel = explicitLabel ?? "Content";
-    }
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: clsx.clsx(withBaseName(), className), ...rest, children: [
-    isScrollable ? /* @__PURE__ */ jsxRuntime.jsx("span", { id: contentSuffixId, hidden: true, children: "content" }) : null,
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        ref: bodyRef,
-        className: withBaseName("body"),
-        ...isScrollable && {
-          role: "region",
-          tabIndex: 0,
-          "aria-labelledby": bodyAriaLabelledBy,
-          "aria-label": bodyAriaLabel
-        },
-        children
-      }
-    )
-  ] });
-});
-
-exports.SidePanelContent = SidePanelContent;
-//# sourceMappingURL=SidePanelContent.js.map

package/dist-cjs/side-panel/SidePanelContent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SidePanelContent.js","sources":["../src/side-panel/SidePanelContent.tsx"],"sourcesContent":["import { makePrefixer, useId } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithRef, forwardRef, useRef } from \"react\";\nimport { useIsScrollable, useSidePanelContext } from \"./internal\";\nimport sidePanelContentCss from \"./SidePanelContent.css\";\n\nconst withBaseName = makePrefixer(\"saltSidePanelContent\");\n\nexport interface SidePanelContentProps extends ComponentPropsWithRef<\"div\"> {}\n\nexport const SidePanelContent = forwardRef<\n  HTMLDivElement,\n  SidePanelContentProps\n>(function SidePanelContent(props, ref) {\n  const {\n    children,\n    className,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props;\n\n  const { titleId } = useSidePanelContext();\n  const targetWindow = useWindow();\n  const contentSuffixId = useId();\n  const bodyRef = useRef<HTMLDivElement>(null);\n  const isScrollable = useIsScrollable(bodyRef);\n\n  useComponentCssInjection({\n    testId: \"salt-side-panel-content\",\n    css: sidePanelContentCss,\n    window: targetWindow,\n  });\n\n  const explicitLabelledBy = ariaLabelledBy;\n  const explicitLabel = ariaLabel;\n\n  let bodyAriaLabelledBy: string | undefined;\n  let bodyAriaLabel: string | undefined;\n\n  if (isScrollable) {\n    if (explicitLabelledBy) {\n      bodyAriaLabelledBy = explicitLabelledBy;\n    } else if (titleId) {\n      bodyAriaLabelledBy = clsx(titleId, contentSuffixId) || undefined;\n    } else {\n      bodyAriaLabel = explicitLabel ?? \"Content\";\n    }\n  }\n\n  return (\n    <div ref={ref} className={clsx(withBaseName(), className)} {...rest}>\n      {isScrollable ? (\n        <span id={contentSuffixId} hidden>\n          content\n        </span>\n      ) : null}\n      <div\n        ref={bodyRef}\n        className={withBaseName(\"body\")}\n        {...(isScrollable && {\n          role: \"region\",\n          tabIndex: 0,\n          \"aria-labelledby\": bodyAriaLabelledBy,\n          \"aria-label\": bodyAriaLabel,\n        })}\n      >\n        {children}\n      </div>\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","SidePanelContent","useSidePanelContext","useWindow","useId","useRef","useIsScrollable","useComponentCssInjection","sidePanelContentCss","clsx","jsxs","jsx"],"mappings":";;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAeA,kBAAa,sBAAsB,CAAA;AAIjD,MAAM,gBAAA,GAAmBC,gBAAA,CAG9B,SAASC,iBAAAA,CAAiB,OAAO,GAAA,EAAK;AACtC,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,iBAAA,EAAmB,cAAA;AAAA,IACnB,YAAA,EAAc,SAAA;AAAA,IACd,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,EAAE,OAAA,EAAQ,GAAIC,oCAAA,EAAoB;AACxC,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAA,MAAM,kBAAkBC,UAAA,EAAM;AAC9B,EAAA,MAAM,OAAA,GAAUC,aAAuB,IAAI,CAAA;AAC3C,EAAA,MAAM,YAAA,GAAeC,gCAAgB,OAAO,CAAA;AAE5C,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,yBAAA;AAAA,IACR,GAAA,EAAKC,kBAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,MAAM,kBAAA,GAAqB,cAAA;AAC3B,EAAA,MAAM,aAAA,GAAgB,SAAA;AAEtB,EAAA,IAAI,kBAAA;AACJ,EAAA,IAAI,aAAA;AAEJ,EAAA,IAAI,YAAA,EAAc;AAChB,IAAA,IAAI,kBAAA,EAAoB;AACtB,MAAA,kBAAA,GAAqB,kBAAA;AAAA,IACvB,WAAW,OAAA,EAAS;AAClB,MAAA,kBAAA,GAAqBC,SAAA,CAAK,OAAA,EAAS,eAAe,CAAA,IAAK,MAAA;AAAA,IACzD,CAAA,MAAO;AACL,MAAA,aAAA,GAAgB,aAAA,IAAiB,SAAA;AAAA,IACnC;AAAA,EACF;AAEA,EAAA,uBACEC,eAAA,CAAC,KAAA,EAAA,EAAI,GAAA,EAAU,SAAA,EAAWD,SAAA,CAAK,cAAa,EAAG,SAAS,CAAA,EAAI,GAAG,IAAA,EAC5D,QAAA,EAAA;AAAA,IAAA,YAAA,kCACE,MAAA,EAAA,EAAK,EAAA,EAAI,iBAAiB,MAAA,EAAM,IAAA,EAAC,qBAElC,CAAA,GACE,IAAA;AAAA,oBACJE,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK,OAAA;AAAA,QACL,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,QAC7B,GAAI,YAAA,IAAgB;AAAA,UACnB,IAAA,EAAM,QAAA;AAAA,UACN,QAAA,EAAU,CAAA;AAAA,UACV,iBAAA,EAAmB,kBAAA;AAAA,UACnB,YAAA,EAAc;AAAA,SAChB;AAAA,QAEC;AAAA;AAAA;AACH,GAAA,EACF,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/side-panel/SidePanelHeader.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var css_248z = ".saltSidePanelHeader {\n  display: flex;\n  align-items: flex-start;\n  flex-shrink: 0;\n  gap: var(--salt-spacing-100);\n  padding: 0 0 var(--salt-spacing-300);\n}\n";
-
-module.exports = css_248z;
-//# sourceMappingURL=SidePanelHeader.css.js.map

package/dist-cjs/side-panel/SidePanelHeader.css.js.map

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

package/dist-cjs/side-panel/SidePanelHeader.js

@@ -1,26 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var clsx = require('clsx');
-var react = require('react');
-var SidePanelHeader$1 = require('./SidePanelHeader.css.js');
-
-const withBaseName = core.makePrefixer("saltSidePanelHeader");
-const SidePanelHeader = react.forwardRef(
-  function SidePanelHeader2(props, ref) {
-    const { children, className, ...rest } = props;
-    const targetWindow = window.useWindow();
-    styles.useComponentCssInjection({
-      testId: "salt-side-panel-header",
-      css: SidePanelHeader$1,
-      window: targetWindow
-    });
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx.clsx(withBaseName(), className), ...rest, children });
-  }
-);
-
-exports.SidePanelHeader = SidePanelHeader;
-//# sourceMappingURL=SidePanelHeader.js.map

package/dist-cjs/side-panel/SidePanelHeader.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SidePanelHeader.js","sources":["../src/side-panel/SidePanelHeader.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithRef, forwardRef } from \"react\";\nimport sidePanelHeaderCss from \"./SidePanelHeader.css\";\n\nconst withBaseName = makePrefixer(\"saltSidePanelHeader\");\n\nexport interface SidePanelHeaderProps extends ComponentPropsWithRef<\"div\"> {}\n\nexport const SidePanelHeader = forwardRef<HTMLDivElement, SidePanelHeaderProps>(\n  function SidePanelHeader(props, ref) {\n    const { children, className, ...rest } = props;\n\n    const targetWindow = useWindow();\n\n    useComponentCssInjection({\n      testId: \"salt-side-panel-header\",\n      css: sidePanelHeaderCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div ref={ref} className={clsx(withBaseName(), className)} {...rest}>\n        {children}\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","SidePanelHeader","useWindow","useComponentCssInjection","sidePanelHeaderCss","jsx","clsx"],"mappings":";;;;;;;;;;AAOA,MAAM,YAAA,GAAeA,kBAAa,qBAAqB,CAAA;AAIhD,MAAM,eAAA,GAAkBC,gBAAA;AAAA,EAC7B,SAASC,gBAAAA,CAAgB,KAAA,EAAO,GAAA,EAAK;AACnC,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,GAAI,KAAA;AAEzC,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAE/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,wBAAA;AAAA,MACR,GAAA,EAAKC,iBAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,cAAA,CAAC,KAAA,EAAA,EAAI,GAAA,EAAU,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA,EAAI,GAAG,IAAA,EAC5D,QAAA,EACH,CAAA;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/side-panel/SidePanelProvider.js

@@ -1,89 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var react$1 = require('@floating-ui/react');
-var core = require('@salt-ds/core');
-var react = require('react');
-var SidePanelContext = require('./internal/SidePanelContext.js');
-var useSidePanelTabOrder = require('./internal/useSidePanelTabOrder.js');
-
-function SidePanelProvider(props) {
-  const { children, open: openProp, defaultOpen, onOpenChange } = props;
-  const [openState, setOpenState] = core.useControlled({
-    default: Boolean(defaultOpen),
-    controlled: openProp,
-    name: "SidePanelProvider",
-    state: "open"
-  });
-  const handleOpenChange = react.useCallback(
-    (newOpen) => {
-      setOpenState(newOpen);
-      onOpenChange == null ? void 0 : onOpenChange(newOpen);
-    },
-    [onOpenChange]
-  );
-  const [reference, setReference] = react.useState(null);
-  const [floating, setFloating] = react.useState(null);
-  const [panelId, setPanelId] = react.useState(void 0);
-  const [titleId, setTitleId] = react.useState(void 0);
-  const [position, setPosition] = react.useState(
-    void 0
-  );
-  const floatingRootContext = react$1.useFloatingRootContext({
-    open: openState,
-    onOpenChange: handleOpenChange,
-    elements: {
-      reference,
-      floating
-    }
-  });
-  react.useEffect(() => {
-    if (!openState || !floating) {
-      return;
-    }
-    const onKeyDown = (event) => {
-      if (event.key !== "Escape") {
-        return;
-      }
-      event.preventDefault();
-      event.stopPropagation();
-      handleOpenChange(false);
-    };
-    floating.addEventListener("keydown", onKeyDown);
-    return () => {
-      floating.removeEventListener("keydown", onKeyDown);
-    };
-  }, [floating, openState, handleOpenChange]);
-  useSidePanelTabOrder.useSidePanelTabOrder({
-    floating,
-    open: openState,
-    reference
-  });
-  const context = react.useMemo(
-    () => ({
-      openState,
-      floatingRootContext,
-      setFloating,
-      setReference,
-      setOpen: handleOpenChange,
-      panelId,
-      setPanelId,
-      titleId,
-      setTitleId,
-      position,
-      setPosition
-    }),
-    [
-      openState,
-      floatingRootContext,
-      handleOpenChange,
-      panelId,
-      titleId,
-      position
-    ]
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx(SidePanelContext.SidePanelContext.Provider, { value: context, children });
-}
-
-exports.SidePanelProvider = SidePanelProvider;
-//# sourceMappingURL=SidePanelProvider.js.map

package/dist-cjs/side-panel/SidePanelProvider.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SidePanelProvider.js","sources":["../src/side-panel/SidePanelProvider.tsx"],"sourcesContent":["import { useFloatingRootContext } from \"@floating-ui/react\";\nimport { useControlled } from \"@salt-ds/core\";\nimport {\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from \"react\";\nimport { SidePanelContext, useSidePanelTabOrder } from \"./internal\";\n\nexport interface SidePanelProviderProps {\n  /**\n   * Whether the panel is open.\n   */\n  open?: boolean;\n  /**\n   * Default open state when initially rendered.\n   */\n  defaultOpen?: boolean;\n  /**\n   * Callback when open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * SidePanelProvider children, should include SidePanel and SidePanelTrigger.\n   */\n  children: ReactNode;\n}\n\nexport function SidePanelProvider(props: SidePanelProviderProps) {\n  const { children, open: openProp, defaultOpen, onOpenChange } = props;\n\n  const [openState, setOpenState] = useControlled({\n    default: Boolean(defaultOpen),\n    controlled: openProp,\n    name: \"SidePanelProvider\",\n    state: \"open\",\n  });\n\n  const handleOpenChange = useCallback(\n    (newOpen: boolean) => {\n      setOpenState(newOpen);\n      onOpenChange?.(newOpen);\n    },\n    [onOpenChange],\n  );\n\n  const [reference, setReference] = useState<HTMLElement | null>(null);\n  const [floating, setFloating] = useState<HTMLDivElement | null>(null);\n  const [panelId, setPanelId] = useState<string | undefined>(undefined);\n  const [titleId, setTitleId] = useState<string | undefined>(undefined);\n  const [position, setPosition] = useState<\"right\" | \"left\" | undefined>(\n    undefined,\n  );\n\n  const floatingRootContext = useFloatingRootContext({\n    open: openState,\n    onOpenChange: handleOpenChange,\n    elements: {\n      reference,\n      floating,\n    },\n  });\n\n  useEffect(() => {\n    if (!openState || !floating) {\n      return;\n    }\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key !== \"Escape\") {\n        return;\n      }\n\n      event.preventDefault();\n      event.stopPropagation();\n      handleOpenChange(false);\n    };\n\n    floating.addEventListener(\"keydown\", onKeyDown);\n    return () => {\n      floating.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [floating, openState, handleOpenChange]);\n\n  useSidePanelTabOrder({\n    floating,\n    open: openState,\n    reference,\n  });\n\n  const context = useMemo(\n    () => ({\n      openState,\n      floatingRootContext,\n      setFloating,\n      setReference,\n      setOpen: handleOpenChange,\n      panelId,\n      setPanelId,\n      titleId,\n      setTitleId,\n      position,\n      setPosition,\n    }),\n    [\n      openState,\n      floatingRootContext,\n      handleOpenChange,\n      panelId,\n      titleId,\n      position,\n    ],\n  );\n\n  return (\n    <SidePanelContext.Provider value={context}>\n      {children}\n    </SidePanelContext.Provider>\n  );\n}\n"],"names":["useControlled","useCallback","useState","useFloatingRootContext","useEffect","useSidePanelTabOrder","useMemo","SidePanelContext"],"mappings":";;;;;;;;;AA8BO,SAAS,kBAAkB,KAAA,EAA+B;AAC/D,EAAA,MAAM,EAAE,QAAA,EAAU,IAAA,EAAM,QAAA,EAAU,WAAA,EAAa,cAAa,GAAI,KAAA;AAEhE,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIA,kBAAA,CAAc;AAAA,IAC9C,OAAA,EAAS,QAAQ,WAAW,CAAA;AAAA,IAC5B,UAAA,EAAY,QAAA;AAAA,IACZ,IAAA,EAAM,mBAAA;AAAA,IACN,KAAA,EAAO;AAAA,GACR,CAAA;AAED,EAAA,MAAM,gBAAA,GAAmBC,iBAAA;AAAA,IACvB,CAAC,OAAA,KAAqB;AACpB,MAAA,YAAA,CAAa,OAAO,CAAA;AACpB,MAAA,YAAA,IAAA,IAAA,GAAA,MAAA,GAAA,YAAA,CAAe,OAAA,CAAA;AAAA,IACjB,CAAA;AAAA,IACA,CAAC,YAAY;AAAA,GACf;AAEA,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIC,eAA6B,IAAI,CAAA;AACnE,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAIA,eAAgC,IAAI,CAAA;AACpE,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAIA,eAA6B,MAAS,CAAA;AACpE,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAIA,eAA6B,MAAS,CAAA;AACpE,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAIA,cAAA;AAAA,IAC9B;AAAA,GACF;AAEA,EAAA,MAAM,sBAAsBC,8BAAA,CAAuB;AAAA,IACjD,IAAA,EAAM,SAAA;AAAA,IACN,YAAA,EAAc,gBAAA;AAAA,IACd,QAAA,EAAU;AAAA,MACR,SAAA;AAAA,MACA;AAAA;AACF,GACD,CAAA;AAED,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,SAAA,IAAa,CAAC,QAAA,EAAU;AAC3B,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,SAAA,GAAY,CAAC,KAAA,KAAyB;AAC1C,MAAA,IAAI,KAAA,CAAM,QAAQ,QAAA,EAAU;AAC1B,QAAA;AAAA,MACF;AAEA,MAAA,KAAA,CAAM,cAAA,EAAe;AACrB,MAAA,KAAA,CAAM,eAAA,EAAgB;AACtB,MAAA,gBAAA,CAAiB,KAAK,CAAA;AAAA,IACxB,CAAA;AAEA,IAAA,QAAA,CAAS,gBAAA,CAAiB,WAAW,SAAS,CAAA;AAC9C,IAAA,OAAO,MAAM;AACX,MAAA,QAAA,CAAS,mBAAA,CAAoB,WAAW,SAAS,CAAA;AAAA,IACnD,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,QAAA,EAAU,SAAA,EAAW,gBAAgB,CAAC,CAAA;AAE1C,EAAAC,yCAAA,CAAqB;AAAA,IACnB,QAAA;AAAA,IACA,IAAA,EAAM,SAAA;AAAA,IACN;AAAA,GACD,CAAA;AAED,EAAA,MAAM,OAAA,GAAUC,aAAA;AAAA,IACd,OAAO;AAAA,MACL,SAAA;AAAA,MACA,mBAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,OAAA,EAAS,gBAAA;AAAA,MACT,OAAA;AAAA,MACA,UAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA;AAAA,MACE,SAAA;AAAA,MACA,mBAAA;AAAA,MACA,gBAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EAAA,sCACGC,iCAAA,CAAiB,QAAA,EAAjB,EAA0B,KAAA,EAAO,SAC/B,QAAA,EACH,CAAA;AAEJ;;;;"}

package/dist-cjs/side-panel/SidePanelTitle.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var css_248z = ".saltSidePanelTitle {\n  flex: 1;\n  min-width: 0;\n  min-height: var(--salt-size-base);\n  display: flex;\n  align-items: center;\n}\n";
-
-module.exports = css_248z;
-//# sourceMappingURL=SidePanelTitle.css.js.map

package/dist-cjs/side-panel/SidePanelTitle.css.js.map

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

package/dist-cjs/side-panel/SidePanelTitle.js

@@ -1,48 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var clsx = require('clsx');
-var react = require('react');
-var SidePanelContext = require('./internal/SidePanelContext.js');
-require('tabbable');
-var SidePanelTitle$1 = require('./SidePanelTitle.css.js');
-
-const withBaseName = core.makePrefixer("saltSidePanelTitle");
-const SidePanelTitle = react.forwardRef(
-  function SidePanelTitle2(props, ref) {
-    const { children, className, id, styleAs = "h2", ...rest } = props;
-    const { setTitleId } = SidePanelContext.useSidePanelContext();
-    const targetWindow = window.useWindow();
-    styles.useComponentCssInjection({
-      testId: "salt-side-panel-title",
-      css: SidePanelTitle$1,
-      window: targetWindow
-    });
-    const titleId = core.useId(id);
-    core.useIsomorphicLayoutEffect(() => {
-      if (titleId) {
-        setTitleId(titleId);
-      }
-      return () => {
-        setTitleId(void 0);
-      };
-    }, [titleId, setTitleId]);
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      core.Text,
-      {
-        ref,
-        id: titleId,
-        styleAs,
-        className: clsx.clsx(withBaseName(), className),
-        ...rest,
-        children
-      }
-    );
-  }
-);
-
-exports.SidePanelTitle = SidePanelTitle;
-//# sourceMappingURL=SidePanelTitle.js.map

package/dist-cjs/side-panel/SidePanelTitle.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SidePanelTitle.js","sources":["../src/side-panel/SidePanelTitle.tsx"],"sourcesContent":["import {\n  makePrefixer,\n  Text,\n  type TextProps,\n  useId,\n  useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { useSidePanelContext } from \"./internal\";\nimport sidePanelTitleCss from \"./SidePanelTitle.css\";\n\nconst withBaseName = makePrefixer(\"saltSidePanelTitle\");\n\nexport interface SidePanelTitleProps extends TextProps<\"div\"> {}\n\nexport const SidePanelTitle = forwardRef<HTMLDivElement, SidePanelTitleProps>(\n  function SidePanelTitle(props, ref) {\n    const { children, className, id, styleAs = \"h2\", ...rest } = props;\n\n    const { setTitleId } = useSidePanelContext();\n    const targetWindow = useWindow();\n\n    useComponentCssInjection({\n      testId: \"salt-side-panel-title\",\n      css: sidePanelTitleCss,\n      window: targetWindow,\n    });\n\n    const titleId = useId(id);\n\n    useIsomorphicLayoutEffect(() => {\n      if (titleId) {\n        setTitleId(titleId);\n      }\n\n      return () => {\n        setTitleId(undefined);\n      };\n    }, [titleId, setTitleId]);\n\n    return (\n      <Text\n        ref={ref}\n        id={titleId}\n        styleAs={styleAs}\n        className={clsx(withBaseName(), className)}\n        {...rest}\n      >\n        {children}\n      </Text>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","SidePanelTitle","useSidePanelContext","useWindow","useComponentCssInjection","sidePanelTitleCss","useId","useIsomorphicLayoutEffect","jsx","Text","clsx"],"mappings":";;;;;;;;;;;;AAcA,MAAM,YAAA,GAAeA,kBAAa,oBAAoB,CAAA;AAI/C,MAAM,cAAA,GAAiBC,gBAAA;AAAA,EAC5B,SAASC,eAAAA,CAAe,KAAA,EAAO,GAAA,EAAK;AAClC,IAAA,MAAM,EAAE,UAAU,SAAA,EAAW,EAAA,EAAI,UAAU,IAAA,EAAM,GAAG,MAAK,GAAI,KAAA;AAE7D,IAAA,MAAM,EAAE,UAAA,EAAW,GAAIC,oCAAA,EAAoB;AAC3C,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAE/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,uBAAA;AAAA,MACR,GAAA,EAAKC,gBAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,OAAA,GAAUC,WAAM,EAAE,CAAA;AAExB,IAAAC,8BAAA,CAA0B,MAAM;AAC9B,MAAA,IAAI,OAAA,EAAS;AACX,QAAA,UAAA,CAAW,OAAO,CAAA;AAAA,MACpB;AAEA,MAAA,OAAO,MAAM;AACX,QAAA,UAAA,CAAW,MAAS,CAAA;AAAA,MACtB,CAAA;AAAA,IACF,CAAA,EAAG,CAAC,OAAA,EAAS,UAAU,CAAC,CAAA;AAExB,IAAA,uBACEC,cAAA;AAAA,MAACC,SAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,EAAA,EAAI,OAAA;AAAA,QACJ,OAAA;AAAA,QACA,SAAA,EAAWC,SAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACxC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;;;;"}

package/dist-cjs/side-panel/SidePanelTrigger.js

@@ -1,37 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var react = require('react');
-var SidePanelContext = require('./internal/SidePanelContext.js');
-require('tabbable');
-
-const SidePanelTrigger = react.forwardRef(function SidePanelTrigger2(props, ref) {
-  const { children, onClick, ...rest } = props;
-  const { setReference, openState, setOpen, panelId } = SidePanelContext.useSidePanelContext();
-  const combinedRef = core.useForkRef(setReference, ref);
-  const handleRef = core.useForkRef(combinedRef, core.getRefFromChildren(children));
-  const handleClick = (event) => {
-    onClick == null ? void 0 : onClick(event);
-    setOpen(!openState);
-  };
-  if (!children || !react.isValidElement(children)) {
-    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
-  }
-  const mergedProps = core.mergeProps(
-    {
-      "aria-expanded": openState,
-      "aria-controls": openState ? panelId : void 0,
-      onClick: handleClick,
-      ...rest
-    },
-    children.props
-  );
-  return react.cloneElement(children, {
-    ...mergedProps,
-    ref: handleRef
-  });
-});
-
-exports.SidePanelTrigger = SidePanelTrigger;
-//# sourceMappingURL=SidePanelTrigger.js.map

package/dist-cjs/side-panel/SidePanelTrigger.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SidePanelTrigger.js","sources":["../src/side-panel/SidePanelTrigger.tsx"],"sourcesContent":["import { getRefFromChildren, mergeProps, useForkRef } from \"@salt-ds/core\";\nimport {\n  type ComponentPropsWithoutRef,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  type MouseEvent,\n} from \"react\";\nimport { useSidePanelContext } from \"./internal\";\n\nexport interface SidePanelTriggerProps\n  extends ComponentPropsWithoutRef<\"button\"> {}\n\nexport const SidePanelTrigger = forwardRef<\n  HTMLButtonElement,\n  SidePanelTriggerProps\n>(function SidePanelTrigger(props, ref) {\n  const { children, onClick, ...rest } = props;\n  const { setReference, openState, setOpen, panelId } = useSidePanelContext();\n\n  const combinedRef = useForkRef(setReference, ref);\n  const handleRef = useForkRef(combinedRef, getRefFromChildren(children));\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    onClick?.(event);\n    setOpen(!openState);\n  };\n\n  if (!children || !isValidElement(children)) {\n    return <>{children}</>;\n  }\n\n  const mergedProps = mergeProps(\n    {\n      \"aria-expanded\": openState,\n      \"aria-controls\": openState ? panelId : undefined,\n      onClick: handleClick,\n      ...rest,\n    },\n    children.props,\n  );\n\n  return cloneElement(children, {\n    ...mergedProps,\n    ref: handleRef,\n  });\n});\n"],"names":["forwardRef","SidePanelTrigger","useSidePanelContext","useForkRef","getRefFromChildren","isValidElement","mergeProps","cloneElement"],"mappings":";;;;;;;;AAaO,MAAM,gBAAA,GAAmBA,gBAAA,CAG9B,SAASC,iBAAAA,CAAiB,OAAO,GAAA,EAAK;AACtC,EAAA,MAAM,EAAE,QAAA,EAAU,OAAA,EAAS,GAAG,MAAK,GAAI,KAAA;AACvC,EAAA,MAAM,EAAE,YAAA,EAAc,SAAA,EAAW,OAAA,EAAS,OAAA,KAAYC,oCAAA,EAAoB;AAE1E,EAAA,MAAM,WAAA,GAAcC,eAAA,CAAW,YAAA,EAAc,GAAG,CAAA;AAChD,EAAA,MAAM,SAAA,GAAYA,eAAA,CAAW,WAAA,EAAaC,uBAAA,CAAmB,QAAQ,CAAC,CAAA;AAEtE,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyC;AAC5D,IAAA,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAU,KAAA,CAAA;AACV,IAAA,OAAA,CAAQ,CAAC,SAAS,CAAA;AAAA,EACpB,CAAA;AAEA,EAAA,IAAI,CAAC,QAAA,IAAY,CAACC,oBAAA,CAAe,QAAQ,CAAA,EAAG;AAC1C,IAAA,6DAAU,QAAA,EAAS,CAAA;AAAA,EACrB;AAEA,EAAA,MAAM,WAAA,GAAcC,eAAA;AAAA,IAClB;AAAA,MACE,eAAA,EAAiB,SAAA;AAAA,MACjB,eAAA,EAAiB,YAAY,OAAA,GAAU,MAAA;AAAA,MACvC,OAAA,EAAS,WAAA;AAAA,MACT,GAAG;AAAA,KACL;AAAA,IACA,QAAA,CAAS;AAAA,GACX;AAEA,EAAA,OAAOC,mBAAa,QAAA,EAAU;AAAA,IAC5B,GAAG,WAAA;AAAA,IACH,GAAA,EAAK;AAAA,GACN,CAAA;AACH,CAAC;;;;"}

package/dist-cjs/side-panel/internal/SidePanelContext.js

@@ -1,34 +0,0 @@
-'use strict';
-
-var core = require('@salt-ds/core');
-var react = require('react');
-
-const SidePanelContext = core.createContext(
-  "SidePanelContext",
-  {
-    openState: false,
-    floatingRootContext: {},
-    setFloating: () => {
-    },
-    setReference: () => {
-    },
-    setOpen: () => {
-    },
-    panelId: void 0,
-    setPanelId: () => {
-    },
-    titleId: void 0,
-    setTitleId: () => {
-    },
-    position: void 0,
-    setPosition: () => {
-    }
-  }
-);
-function useSidePanelContext() {
-  return react.useContext(SidePanelContext);
-}
-
-exports.SidePanelContext = SidePanelContext;
-exports.useSidePanelContext = useSidePanelContext;
-//# sourceMappingURL=SidePanelContext.js.map