@salt-ds/lab 1.0.0-alpha.0

package/dist-es/packages/lab/src/accordion/Accordion.js.map

@@ -0,0 +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\";\nimport \"./Accordion.css\";\nimport cn from \"classnames\";\nimport { AccordionContext } from \"./AccordionContext\";\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 [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={cn(withBaseName(), className)} {...restProps} ref={ref}>\n        <AccordionContext.Provider value={contextValue}>\n          {children}\n        </AccordionContext.Provider>\n      </div>\n    );\n  }\n);\n"],"names":["Accordion","isExpanded","sectionIds","cn"],"mappings":"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"}

package/dist-es/packages/lab/src/accordion/AccordionContext.js

@@ -0,0 +1,16 @@
+import { createContext, useContext } from 'react';
+import { isNotProduction } from './utils.js';
+
+const AccordionContext = createContext(
+  void 0
+);
+const useAccordionContext = () => {
+  const context = useContext(AccordionContext);
+  if (isNotProduction() && !context) {
+    console.error("useAccordionContext should be used inside of Accordion");
+  }
+  return context;
+};
+
+export { AccordionContext, useAccordionContext };
+//# sourceMappingURL=AccordionContext.js.map

package/dist-es/packages/lab/src/accordion/AccordionContext.js.map

@@ -0,0 +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":[],"mappings":";;;AAWO,MAAM,gBAAmB,GAAA,aAAA;AAAA,EAC9B,KAAA,CAAA;AACF,EAAA;AAEO,MAAM,sBAAsB,MAAM;AACvC,EAAM,MAAA,OAAA,GAAU,WAAW,gBAAgB,CAAA,CAAA;AAC3C,EAAI,IAAA,eAAA,EAAqB,IAAA,CAAC,OAAS,EAAA;AACjC,IAAA,OAAA,CAAQ,MAAM,wDAAwD,CAAA,CAAA;AAAA,GACxE;AACA,EAAO,OAAA,OAAA,CAAA;AACT;;;;"}

package/dist-es/packages/lab/src/accordion/AccordionDetails.js

@@ -0,0 +1,75 @@
+import { jsx } from 'react/jsx-runtime';
+import { makePrefixer, useForkRef, useIsomorphicLayoutEffect } from '@salt-ds/core';
+import cx from 'classnames';
+import { forwardRef, useRef, useState } from 'react';
+import { useAccordionSectionContext } from './AccordionSectionContext.js';
+import './Accordion.css.js';
+
+const withBaseName = makePrefixer("saltAccordionDetails");
+const msCollapseAnimationDuration = 150;
+const AccordionDetails = forwardRef(function AccordionDetails2({ children, className, preventUnmountOnCollapse, ...restProps }, ref) {
+  const { isDisabled, isExpanded } = useAccordionSectionContext();
+  const rootRef = useRef(null);
+  const contentRef = useRef(null);
+  const forkedRef = useForkRef(ref, rootRef);
+  const [state, setState] = useState(
+    isExpanded ? "expanded" : "collapsed"
+  );
+  useIsomorphicLayoutEffect(() => {
+    if (!rootRef.current) {
+      return;
+    }
+    if (isExpanded) {
+      if (state === "collapsed") {
+        setState("measuring");
+      } else if (state === "measuring") {
+        rootRef.current.style.height = `${contentRef.current.getBoundingClientRect().height}px`;
+        setState("expanding");
+      } else if (state === "expanding") {
+        setTimeout(() => {
+          setState("expanded");
+        }, msCollapseAnimationDuration);
+      } else if (state === "expanded") {
+        rootRef.current.style.height = "auto";
+      }
+    } else {
+      if (state === "expanded") {
+        rootRef.current.style.height = `${rootRef.current.getBoundingClientRect().height}px`;
+        setTimeout(() => {
+          setState("collapsing");
+        }, 0);
+      } else if (state === "collapsing") {
+        rootRef.current.style.height = "0";
+        setTimeout(() => {
+          setState("collapsed");
+        }, msCollapseAnimationDuration);
+      } else if (state === "collapsed") {
+        rootRef.current.style.height = "0";
+      }
+    }
+  }, [isExpanded, state]);
+  return /* @__PURE__ */ jsx("div", {
+    ...restProps,
+    ref: forkedRef,
+    className: cx(
+      withBaseName(),
+      {
+        [withBaseName("disabled")]: isDisabled
+      },
+      className
+    ),
+    children: /* @__PURE__ */ jsx("div", {
+      ref: contentRef,
+      className: cx({
+        [withBaseName("dummy")]: state === "measuring"
+      }),
+      children: preventUnmountOnCollapse || state !== "collapsed" ? /* @__PURE__ */ jsx("div", {
+        className: withBaseName("content"),
+        children
+      }) : null
+    })
+  });
+});
+
+export { AccordionDetails };
+//# sourceMappingURL=AccordionDetails.js.map

package/dist-es/packages/lab/src/accordion/AccordionDetails.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionDetails.js","sources":["../src/accordion/AccordionDetails.tsx"],"sourcesContent":["import {\n  makePrefixer,\n  useForkRef,\n  useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\nimport cn from \"classnames\";\nimport { forwardRef, HTMLAttributes, useRef, useState } from \"react\";\nimport { useAccordionSectionContext } from \"./AccordionSectionContext\";\n\nimport \"./Accordion.css\";\n\nconst withBaseName = makePrefixer(\"saltAccordionDetails\");\n\nexport interface AccordionDetailsProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Render children even if the component is collapsed. Prevents unmounting of children components.\n   * */\n  preventUnmountOnCollapse?: boolean;\n}\n\nconst msCollapseAnimationDuration = 150;\n\n// Collapsed - the section is completely collapsed, don't render anything, height is 0\n// Measuring - the section is about to expand, rendering a dummy preview to measure\n//   the height of expanded section\n// Expanding - the section is expanding but hasn't yet expanded to full size. height is set to\n//   the value measured in the previous step\n// Expanded - the section is expanded, need to render the content, height is set to auto\n// Collapsing - the section is about to start collapsing, the height is set to current height\n//   (auto has to be replaced by a number, then the component has to be rendered, then the value can\n//    be set to 0)\ntype State =\n  | \"collapsed\"\n  | \"measuring\"\n  | \"expanding\"\n  | \"expanded\"\n  | \"collapsing\";\n\nexport const AccordionDetails = forwardRef<\n  HTMLDivElement,\n  AccordionDetailsProps\n>(function AccordionDetails(\n  { children, className, preventUnmountOnCollapse, ...restProps },\n  ref\n) {\n  const { isDisabled, isExpanded } = useAccordionSectionContext();\n  const rootRef = useRef<HTMLDivElement>(null);\n  const contentRef = useRef<HTMLDivElement>(null);\n  const forkedRef = useForkRef(ref, rootRef);\n\n  const [state, setState] = useState<State>(\n    isExpanded ? \"expanded\" : \"collapsed\"\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    if (!rootRef.current) {\n      return;\n    }\n    if (isExpanded) {\n      if (state === \"collapsed\") {\n        setState(\"measuring\");\n      } else if (state === \"measuring\") {\n        rootRef.current.style.height = `${\n          contentRef.current!.getBoundingClientRect().height\n        }px`;\n        setState(\"expanding\");\n      } else if (state === \"expanding\") {\n        setTimeout(() => {\n          setState(\"expanded\");\n        }, msCollapseAnimationDuration);\n      } else if (state === \"expanded\") {\n        rootRef.current.style.height = \"auto\";\n      }\n    } else {\n      if (state === \"expanded\") {\n        rootRef.current.style.height = `${\n          rootRef.current.getBoundingClientRect().height\n        }px`;\n        setTimeout(() => {\n          setState(\"collapsing\");\n        }, 0);\n      } else if (state === \"collapsing\") {\n        rootRef.current.style.height = \"0\";\n        setTimeout(() => {\n          setState(\"collapsed\");\n        }, msCollapseAnimationDuration);\n      } else if (state === \"collapsed\") {\n        rootRef.current.style.height = \"0\";\n      }\n    }\n  }, [isExpanded, state]);\n\n  return (\n    <div\n      {...restProps}\n      ref={forkedRef}\n      className={cn(\n        withBaseName(),\n        {\n          [withBaseName(\"disabled\")]: isDisabled,\n        },\n        className\n      )}\n    >\n      <div\n        ref={contentRef}\n        className={cn({\n          [withBaseName(\"dummy\")]: state === \"measuring\",\n        })}\n      >\n        {preventUnmountOnCollapse || state !== \"collapsed\" ? (\n          <div className={withBaseName(\"content\")}>{children}</div>\n        ) : null}\n      </div>\n    </div>\n  );\n});\n"],"names":["AccordionDetails","cn"],"mappings":"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"}

package/dist-es/packages/lab/src/accordion/AccordionSection.js

@@ -0,0 +1,98 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef, useState, useEffect, useCallback, useMemo } from 'react';
+import { makePrefixer } from '@salt-ds/core';
+import { useLayoutEffectSkipFirst } from '../utils/useLayoutEffectSkipFirst.js';
+import { AccordionSectionContext } from './AccordionSectionContext.js';
+import cx from 'classnames';
+import './Accordion.css.js';
+import { useAccordionContext } from './AccordionContext.js';
+import { isNotProduction } from './utils.js';
+
+const withBaseName = makePrefixer("saltAccordionSection");
+const AccordionSection = forwardRef(function Accordion({
+  id: idProp,
+  disabled: disabledProp,
+  onChange: onChangeProp,
+  defaultExpanded: defaultExpandedProp,
+  expanded: expandedProp,
+  children,
+  className,
+  ...restProps
+}, ref) {
+  const [id, setId] = useState(
+    () => idProp != null ? idProp : `salt-${Math.round(Math.random() * 1e5)}`
+  );
+  if (idProp != null && idProp != id) {
+    setId(idProp);
+  }
+  const {
+    registerSection,
+    unregisterSection,
+    onChange,
+    isExpanded,
+    disabled: accordionDisabled
+  } = useAccordionContext();
+  const isControlled = expandedProp != null;
+  const expanded = isControlled ? expandedProp : isExpanded(id);
+  const disabled = disabledProp != null ? disabledProp : accordionDisabled;
+  useEffect(() => {
+    registerSection(
+      id,
+      expandedProp != null ? expandedProp : !!defaultExpandedProp
+    );
+    return () => {
+      unregisterSection(id);
+    };
+  }, [id, registerSection, unregisterSection]);
+  const onToggle = useCallback(() => {
+    const newExpanded = !expanded;
+    if (onChangeProp) {
+      onChangeProp(newExpanded);
+    }
+    if (!isControlled) {
+      onChange(id, newExpanded);
+    }
+  }, [id, expanded, onChangeProp, onChange, isControlled]);
+  useEffect(() => {
+    const isControlled2 = expandedProp != null;
+    if (isControlled2) {
+      onChange(id, expandedProp);
+    }
+  }, [expandedProp, isControlled]);
+  useLayoutEffectSkipFirst(() => {
+    if (isNotProduction()) {
+      const mode = (isControlled2) => isControlled2 ? "controlled" : "uncontrolled";
+      console.error(
+        `A component is changing from ${mode(!isControlled)} to ${mode(
+          isControlled
+        )} mode.`
+      );
+    }
+  }, [isControlled]);
+  const contextValue = useMemo(() => {
+    return {
+      isExpanded: expanded,
+      isDisabled: disabled,
+      onToggle
+    };
+  }, [expanded, disabled, onToggle]);
+  return /* @__PURE__ */ jsx("div", {
+    ...restProps,
+    className: cx(
+      withBaseName(),
+      {
+        [withBaseName("expanded")]: expanded,
+        [withBaseName("disabled")]: disabled
+      },
+      className
+    ),
+    ref,
+    children: /* @__PURE__ */ jsx(AccordionSectionContext.Provider, {
+      value: contextValue,
+      children
+    })
+  });
+});
+
+export { AccordionSection };
+//# sourceMappingURL=AccordionSection.js.map

package/dist-es/packages/lab/src/accordion/AccordionSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionSection.js","sources":["../src/accordion/AccordionSection.tsx"],"sourcesContent":["import {\n  forwardRef,\n  HTMLAttributes,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from \"react\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { useLayoutEffectSkipFirst } from \"../utils\";\nimport { AccordionSectionContext } from \"./AccordionSectionContext\";\nimport cn from \"classnames\";\nimport \"./Accordion.css\";\nimport { useAccordionContext } from \"./AccordionContext\";\nimport { isNotProduction } from \"./utils\";\n\nconst withBaseName = makePrefixer(\"saltAccordionSection\");\n\nexport interface AccordionSectionProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  defaultExpanded?: boolean;\n  disabled?: boolean;\n  expanded?: boolean;\n  onChange?: (isExpanded: boolean) => void;\n  className?: string;\n}\n\nexport const AccordionSection = forwardRef<\n  HTMLDivElement,\n  AccordionSectionProps\n>(function Accordion(\n  {\n    id: idProp,\n    disabled: disabledProp,\n    onChange: onChangeProp,\n    defaultExpanded: defaultExpandedProp,\n    expanded: expandedProp,\n    children,\n    className,\n    ...restProps\n  },\n  ref\n) {\n  const [id, setId] = useState(() =>\n    idProp != null ? idProp : `salt-${Math.round(Math.random() * 1e5)}`\n  );\n\n  if (idProp != null && idProp != id) {\n    setId(idProp);\n  }\n\n  const {\n    registerSection,\n    unregisterSection,\n    onChange,\n    isExpanded,\n    disabled: accordionDisabled,\n  } = useAccordionContext();\n\n  const isControlled = expandedProp != null;\n  const expanded = isControlled ? expandedProp : isExpanded(id);\n  const disabled = disabledProp != null ? disabledProp : accordionDisabled;\n\n  useEffect(() => {\n    registerSection(\n      id,\n      expandedProp != null ? expandedProp : !!defaultExpandedProp\n    );\n    return () => {\n      unregisterSection(id);\n    };\n  }, [id, registerSection, unregisterSection]);\n\n  const onToggle = useCallback(() => {\n    const newExpanded = !expanded;\n    if (onChangeProp) {\n      onChangeProp(newExpanded);\n    }\n    if (!isControlled) {\n      onChange(id, newExpanded);\n    }\n  }, [id, expanded, onChangeProp, onChange, isControlled]);\n\n  useEffect(() => {\n    const isControlled = expandedProp != null;\n    if (isControlled) {\n      onChange(id, expandedProp);\n    }\n  }, [expandedProp, isControlled]);\n\n  useLayoutEffectSkipFirst(() => {\n    if (isNotProduction()) {\n      const mode = (isControlled: boolean) =>\n        isControlled ? \"controlled\" : \"uncontrolled\";\n      console.error(\n        `A component is changing from ${mode(!isControlled)} to ${mode(\n          isControlled\n        )} mode.`\n      );\n    }\n  }, [isControlled]);\n\n  const contextValue: AccordionSectionContext = useMemo(() => {\n    return {\n      isExpanded: expanded,\n      isDisabled: disabled,\n      onToggle,\n    };\n  }, [expanded, disabled, onToggle]);\n\n  return (\n    <div\n      {...restProps}\n      className={cn(\n        withBaseName(),\n        {\n          [withBaseName(\"expanded\")]: expanded,\n          [withBaseName(\"disabled\")]: disabled,\n        },\n        className\n      )}\n      ref={ref}\n    >\n      <AccordionSectionContext.Provider value={contextValue}>\n        {children}\n      </AccordionSectionContext.Provider>\n    </div>\n  );\n});\n"],"names":["isControlled","cn"],"mappings":"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"}

package/dist-es/packages/lab/src/accordion/AccordionSectionContext.js

@@ -0,0 +1,19 @@
+import { createContext, useContext } from 'react';
+import { isNotProduction } from './utils.js';
+
+const AccordionSectionContext = createContext(void 0);
+if (isNotProduction()) {
+  AccordionSectionContext.displayName = "AccordionSectionContext";
+}
+const useAccordionSectionContext = () => {
+  const context = useContext(AccordionSectionContext);
+  if (isNotProduction() && !context) {
+    console.error(
+      "useAccordionSectionContext should be used inside of AccordionSection"
+    );
+  }
+  return context;
+};
+
+export { AccordionSectionContext, useAccordionSectionContext };
+//# sourceMappingURL=AccordionSectionContext.js.map

package/dist-es/packages/lab/src/accordion/AccordionSectionContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionSectionContext.js","sources":["../src/accordion/AccordionSectionContext.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport { isNotProduction } from \"./utils\";\n\nexport interface AccordionSectionContext {\n  isDisabled?: boolean;\n  isExpanded: boolean;\n  onToggle: () => void;\n}\n\nexport const AccordionSectionContext = createContext<\n  AccordionSectionContext | undefined\n>(undefined);\n\nif (isNotProduction()) {\n  AccordionSectionContext.displayName = \"AccordionSectionContext\";\n}\n\nexport const useAccordionSectionContext = () => {\n  const context = useContext(AccordionSectionContext);\n  if (isNotProduction() && !context) {\n    console.error(\n      \"useAccordionSectionContext should be used inside of AccordionSection\"\n    );\n  }\n  return context!;\n};\n"],"names":[],"mappings":";;;AASa,MAAA,uBAAA,GAA0B,cAErC,KAAS,CAAA,EAAA;AAEX,IAAI,iBAAmB,EAAA;AACrB,EAAA,uBAAA,CAAwB,WAAc,GAAA,yBAAA,CAAA;AACxC,CAAA;AAEO,MAAM,6BAA6B,MAAM;AAC9C,EAAM,MAAA,OAAA,GAAU,WAAW,uBAAuB,CAAA,CAAA;AAClD,EAAI,IAAA,eAAA,EAAqB,IAAA,CAAC,OAAS,EAAA;AACjC,IAAQ,OAAA,CAAA,KAAA;AAAA,MACN,sEAAA;AAAA,KACF,CAAA;AAAA,GACF;AACA,EAAO,OAAA,OAAA,CAAA;AACT;;;;"}

package/dist-es/packages/lab/src/accordion/AccordionSummary.js

@@ -0,0 +1,52 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { forwardRef, useCallback } from 'react';
+import cx from 'classnames';
+import { makePrefixer } from '@salt-ds/core';
+import { ChevronRightIcon } from '@salt-ds/icons';
+import { useAccordionSectionContext } from './AccordionSectionContext.js';
+import './Accordion.css.js';
+
+const withBaseName = makePrefixer("saltAccordionSummary");
+const AccordionSummary = forwardRef(function AccordionSummary2({ className, children, icon, ...restProps }, ref) {
+  const { isDisabled, isExpanded, onToggle } = useAccordionSectionContext();
+  const onKeyDown = useCallback(
+    ({ key }) => {
+      if (key === "Enter" || key === " ") {
+        onToggle();
+      }
+    },
+    [onToggle]
+  );
+  if (!icon) {
+    icon = /* @__PURE__ */ jsx(ChevronRightIcon, {
+      "aria-hidden": true
+    });
+  }
+  return /* @__PURE__ */ jsxs("div", {
+    ...restProps,
+    className: cx(
+      withBaseName(),
+      {
+        [withBaseName("disabled")]: isDisabled,
+        [withBaseName("expanded")]: isExpanded
+      },
+      className
+    ),
+    ref,
+    role: "button",
+    "aria-expanded": isExpanded,
+    onClick: isDisabled ? void 0 : onToggle,
+    onKeyDown: isDisabled ? void 0 : onKeyDown,
+    tabIndex: isDisabled ? -1 : 0,
+    children: [
+      /* @__PURE__ */ jsx("div", {
+        className: withBaseName("icon"),
+        children: icon
+      }),
+      children
+    ]
+  });
+});
+
+export { AccordionSummary };
+//# sourceMappingURL=AccordionSummary.js.map

package/dist-es/packages/lab/src/accordion/AccordionSummary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionSummary.js","sources":["../src/accordion/AccordionSummary.tsx"],"sourcesContent":["import {\n  forwardRef,\n  HTMLAttributes,\n  KeyboardEventHandler,\n  ReactNode,\n  useCallback,\n} from \"react\";\nimport cn from \"classnames\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { ChevronRightIcon } from \"@salt-ds/icons\";\nimport { useAccordionSectionContext } from \"./AccordionSectionContext\";\nimport \"./Accordion.css\";\n\nconst withBaseName = makePrefixer(\"saltAccordionSummary\");\n\nexport interface AccordionSummaryProps extends HTMLAttributes<HTMLDivElement> {\n  icon?: ReactNode;\n}\n\nexport const AccordionSummary = forwardRef<\n  HTMLDivElement,\n  AccordionSummaryProps\n>(function AccordionSummary({ className, children, icon, ...restProps }, ref) {\n  const { isDisabled, isExpanded, onToggle } = useAccordionSectionContext();\n\n  const onKeyDown: KeyboardEventHandler<HTMLDivElement> = useCallback(\n    ({ key }) => {\n      if (key === \"Enter\" || key === \" \") {\n        onToggle();\n      }\n    },\n    [onToggle]\n  );\n\n  if (!icon) {\n    icon = <ChevronRightIcon aria-hidden />;\n  }\n\n  return (\n    <div\n      {...restProps}\n      className={cn(\n        withBaseName(),\n        {\n          [withBaseName(\"disabled\")]: isDisabled,\n          [withBaseName(\"expanded\")]: isExpanded,\n        },\n        className\n      )}\n      ref={ref}\n      role=\"button\"\n      aria-expanded={isExpanded}\n      onClick={isDisabled ? undefined : onToggle}\n      onKeyDown={isDisabled ? undefined : onKeyDown}\n      tabIndex={isDisabled ? -1 : 0}\n    >\n      <div className={withBaseName(\"icon\")}>{icon}</div>\n      {children}\n    </div>\n  );\n});\n"],"names":["AccordionSummary","cn"],"mappings":";;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,sBAAsB,CAAA,CAAA;AAM3C,MAAA,gBAAA,GAAmB,UAG9B,CAAA,SAASA,iBAAiB,CAAA,EAAE,WAAW,QAAU,EAAA,IAAA,EAAA,GAAS,SAAU,EAAA,EAAG,GAAK,EAAA;AAC5E,EAAA,MAAM,EAAE,UAAA,EAAY,UAAY,EAAA,QAAA,KAAa,0BAA2B,EAAA,CAAA;AAExE,EAAA,MAAM,SAAkD,GAAA,WAAA;AAAA,IACtD,CAAC,EAAE,GAAA,EAAU,KAAA;AACX,MAAI,IAAA,GAAA,KAAQ,OAAW,IAAA,GAAA,KAAQ,GAAK,EAAA;AAClC,QAAS,QAAA,EAAA,CAAA;AAAA,OACX;AAAA,KACF;AAAA,IACA,CAAC,QAAQ,CAAA;AAAA,GACX,CAAA;AAEA,EAAA,IAAI,CAAC,IAAM,EAAA;AACT,IAAA,IAAA,mBAAQ,GAAA,CAAA,gBAAA,EAAA;AAAA,MAAiB,aAAW,EAAA,IAAA;AAAA,KAAC,CAAA,CAAA;AAAA,GACvC;AAEA,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACE,GAAG,SAAA;AAAA,IACJ,SAAW,EAAAC,EAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb;AAAA,QACE,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,UAAA;AAAA,QAC5B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,UAAA;AAAA,OAC9B;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACA,GAAA;AAAA,IACA,IAAK,EAAA,QAAA;AAAA,IACL,eAAe,EAAA,UAAA;AAAA,IACf,OAAA,EAAS,aAAa,KAAY,CAAA,GAAA,QAAA;AAAA,IAClC,SAAA,EAAW,aAAa,KAAY,CAAA,GAAA,SAAA;AAAA,IACpC,QAAA,EAAU,aAAa,CAAK,CAAA,GAAA,CAAA;AAAA,IAE5B,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,QAAI,QAAA,EAAA,IAAA;AAAA,OAAK,CAAA;AAAA,MAC3C,QAAA;AAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/packages/lab/src/accordion/utils.js

@@ -0,0 +1,4 @@
+const isNotProduction = () => process.env.NODE_ENV !== "production";
+
+export { isNotProduction };
+//# sourceMappingURL=utils.js.map

package/dist-es/packages/lab/src/accordion/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../src/accordion/utils.ts"],"sourcesContent":["export const isNotProduction = () => process.env.NODE_ENV !== \"production\";\n"],"names":[],"mappings":"AAAO,MAAM,eAAkB,GAAA,MAAM,OAAQ,CAAA,GAAA,CAAI,QAAa,KAAA;;;;"}

package/dist-es/packages/lab/src/app-header/AppHeader.css.js

@@ -0,0 +1,7 @@
+import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".salt-density-medium,\n.salt-density-low,\n.salt-density-touch {\n  --appHeader-height: var(--saltAppHeader-height, calc(var(--salt-size-base) + var(--salt-size-unit) * 2));\n}\n\n.salt-density-high {\n  --appHeader-height: var(--saltAppHeader-height, calc(var(--salt-size-base) + var(--salt-size-unit) * 3));\n}\n\n.saltAppHeader {\n  --appHeader-background: var(--salt-container-primary-background);\n  --appHeader-separable-bar: var(--salt-separable-secondary-borderColor);\n  --appHeader-shadow: var(--saltAppHeader-shadow, var(--salt-overlayable-shadow-borderRegion));\n  --appHeader-padding: calc(var(--salt-size-unit) * 3);\n  --appHeader-paddingLeft: 8px;\n  --appHeader-paddingRight: var(--appHeader-padding);\n\n  --saltTabs-tabstrip-height: var(--appHeader-height);\n  --saltToolbar-width: auto;\n}\n\n.saltAppHeader {\n  align-items: flex-start;\n  background: var(--appHeader-background);\n  border-bottom: var(--salt-container-borderStyle) var(--salt-size-border) var(--salt-container-primary-borderColor);\n  box-shadow: var(--appHeader-shadow);\n  box-sizing: content-box;\n  display: flex;\n  flex: 0 0 auto;\n  height: var(--appHeader-height);\n  overflow: hidden;\n  padding: 0 var(--appHeader-paddingRight) 0 var(--appHeader-paddingLeft);\n  width: 100%;\n}\n\n.saltAppHeader > .Responsive-inner {\n  width: 100%;\n  /* overflow: hidden; */\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  /* justify-content: space-between; */\n  flex: 1;\n  min-height: var(--appHeader-height);\n}\n\n.saltAppHeader > .Responsive-inner > .responsive-pillar {\n  width: 0;\n  height: var(--appHeader-height);\n}\n\n.saltAppHeader-navMenu {\n  margin-right: 12px;\n  padding-right: 8px;\n}\n\n.saltAppHeader-navMenu::after {\n  top: 0;\n  right: 0;\n  width: var(--salt-size-border);\n  bottom: 0;\n  content: \"\";\n  position: absolute;\n  background: var(--appHeader-separable-bar);\n}\n\n.saltAppHeader .saltLogo:not(.saltLogo-compact) {\n  margin-left: 16px;\n}\n\n.saltAppHeader > .Responsive-inner > .Tabstrip {\n  align-self: flex-end;\n  flex: 0 0 auto;\n  margin-left: 48px;\n}\n\n.saltAppHeader > .Responsive-inner > [data-pad-end] {\n  margin-right: auto;\n}\n\n.saltAppHeader > .Responsive-inner > * {\n  flex-shrink: 0;\n}\n\n.saltAppHeader > .Responsive-inner > .Toolbar {\n  justify-content: flex-end;\n  margin-left: 48px;\n}\n\n.saltAppHeader > .Responsive-inner > [data-pad-start=\"true\"] {\n  margin-left: auto;\n}\n\n.saltAppHeader > .Responsive-inner[data-collapsing=\"true\"] {\n  flex-wrap: nowrap;\n}\n\n.saltAppHeader > .Responsive-inner > *[data-collapsing=\"true\"] {\n  flex-shrink: 1;\n}\n\n.saltAppHeader > .Responsive-inner > *[data-collapsible=\"dynamic\"][data-collapsed=\"true\"] {\n  flex-basis: 0;\n  flex-grow: 0;\n  flex-shrink: 0;\n}\n";
+styleInject(css_248z);
+
+export { css_248z as default };
+//# sourceMappingURL=AppHeader.css.js.map

package/dist-es/packages/lab/src/app-header/AppHeader.css.js.map

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

package/dist-es/packages/lab/src/app-header/AppHeader.js

@@ -0,0 +1,27 @@
+import { jsx } from 'react/jsx-runtime';
+import cx from 'classnames';
+import { Toolbar } from '../toolbar/Toolbar.js';
+import { makePrefixer } from '@salt-ds/core';
+import { forwardRef } from 'react';
+import '../toolbar/overflow-panel/OverflowPanel.js';
+import '../responsive/useResizeObserver.js';
+import '../toolbar/toolbar-field/ToolbarField.js';
+import '../toolbar/Tooltray.css.js';
+import '../toolbar/ToolbarButton.js';
+import { MenuIcon } from '@salt-ds/icons';
+import './AppHeader.css.js';
+
+const withBaseName = makePrefixer("saltAppHeader");
+const AppHeader = forwardRef(
+  ({ children, className, ...rest }, ref) => {
+    return /* @__PURE__ */ jsx(Toolbar, {
+      className: cx(withBaseName(), className),
+      ref,
+      overflowButtonIcon: /* @__PURE__ */ jsx(MenuIcon, {}),
+      children
+    });
+  }
+);
+
+export { AppHeader };
+//# sourceMappingURL=AppHeader.js.map

package/dist-es/packages/lab/src/app-header/AppHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppHeader.js","sources":["../src/app-header/AppHeader.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport { Toolbar } from \"../toolbar\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { MenuIcon } from \"@salt-ds/icons\";\n\nimport \"./AppHeader.css\";\nimport { forwardRef, HTMLAttributes } from \"react\";\n\nconst withBaseName = makePrefixer(\"saltAppHeader\");\n\nexport type AppHeaderProps = HTMLAttributes<HTMLDivElement>;\n\nexport const AppHeader = forwardRef<HTMLDivElement, AppHeaderProps>(\n  ({ children, className, ...rest }, ref) => {\n    // const [innerContainerRef, overflowedItems] = useOverflowObserver(\n    //   \"horizontal\",\n    //   null\n    // );\n\n    return (\n      <Toolbar\n        className={cx(withBaseName(), className)}\n        ref={ref}\n        overflowButtonIcon={<MenuIcon />}\n        // OverflowButtonProps={{ align: \"start\" }}\n      >\n        {children}\n      </Toolbar>\n    );\n    // return (\n    //   <div className={cx(withBaseName(), className)} ref={ref} {...rest}>\n    //     <div className={withBaseName(\"innerContainer\")} ref={innerContainerRef}>\n    //       <OverflowMenu\n    //         className={withBaseName(\"navMenu\")}\n    //         IconComponent={MenuIcon}\n    //         source={overflowedItems}\n    //       />\n    //       {children}\n    //     </div>\n    //   </div>\n    // );\n  }\n);\n"],"names":[],"mappings":";;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAe,aAAa,eAAe,CAAA,CAAA;AAI1C,MAAM,SAAY,GAAA,UAAA;AAAA,EACvB,CAAC,EAAE,QAAA,EAAU,SAAc,EAAA,GAAA,IAAA,IAAQ,GAAQ,KAAA;AAMzC,IAAA,uBACG,GAAA,CAAA,OAAA,EAAA;AAAA,MACC,SAAW,EAAA,EAAA,CAAG,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACvC,GAAA;AAAA,MACA,kBAAA,sBAAqB,QAAS,EAAA,EAAA,CAAA;AAAA,MAG7B,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAcJ;AACF;;;;"}

package/dist-es/packages/lab/src/avatar/Avatar.css.js

@@ -0,0 +1,7 @@
+import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = "/* Default variables applied to the root element */\n.saltAvatar {\n  --avatar-background: var(--saltAvatar-background, var(--salt-accent-background));\n  --avatar-foreground: var(--saltAvatar-foreground, var(--salt-accent-foreground));\n}\n\n/* Style applied to the root element */\n.saltAvatar {\n  background: var(--avatar-background);\n  color: var(--avatar-foreground);\n  font-size: var(--avatar-fontSize);\n  line-height: var(--avatar-container-size);\n  width: var(--avatar-container-size);\n  height: var(--avatar-container-size);\n  letter-spacing: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n  position: relative;\n  flex-shrink: 0;\n  user-select: none;\n  border-radius: 50%;\n}\n\n/* Style applied to the image element */\n.saltAvatar-image {\n  width: 100%;\n  height: 100%;\n  text-align: center;\n  object-fit: cover;\n  color: transparent;\n  text-indent: 10000px;\n}\n\n/* Style applied to the svg element */\n.saltAvatar > svg {\n  width: var(--avatar-container-size);\n  height: var(--avatar-container-size);\n}\n\n.saltAvatar-svgDisc {\n  fill: var(--avatar-background);\n}\n\n.saltAvatar-svgHead {\n  fill: var(--avatar-foreground);\n}\n\n/* Style applied when size is small */\n.saltAvatar-small {\n  --avatar-fontSize: 8px;\n  --avatar-container-size: var(--salt-size-graphic-small);\n}\n\n/* Style applied when size is medium */\n.saltAvatar-medium {\n  --avatar-fontSize: 11px;\n  --avatar-container-size: var(--salt-size-graphic-medium);\n}\n\n/* Style applied when size is large */\n.saltAvatar-large {\n  --avatar-fontSize: 14px;\n  --avatar-container-size: var(--salt-size-graphic-large);\n}\n";
+styleInject(css_248z);
+
+export { css_248z as default };
+//# sourceMappingURL=Avatar.css.js.map

package/dist-es/packages/lab/src/avatar/Avatar.css.js.map

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

package/dist-es/packages/lab/src/avatar/Avatar.js

@@ -0,0 +1,58 @@
+import { jsx } from 'react/jsx-runtime';
+import { makePrefixer, useId } from '@salt-ds/core';
+import cx from 'classnames';
+import { forwardRef } from 'react';
+import { classBase } from './internal/constants.js';
+import { DefaultAvatar } from './internal/DefaultAvatar.js';
+import { useLoaded } from './internal/useLoaded.js';
+import './Avatar.css.js';
+
+const withBaseName = makePrefixer(classBase);
+const Avatar = forwardRef(function Avatar2({
+  alt = "",
+  className,
+  children: childrenProp,
+  id: idProp,
+  size = "medium",
+  src,
+  srcSet,
+  title = "user",
+  imgProps,
+  sizes,
+  ...rest
+}, ref) {
+  let children;
+  const id = useId(idProp);
+  const loaded = useLoaded({ ...imgProps, src, srcSet });
+  const hasImg = src || srcSet;
+  const hasImgNotFailing = hasImg && loaded !== "error";
+  if (hasImgNotFailing) {
+    children = /* @__PURE__ */ jsx("img", {
+      className: withBaseName("image"),
+      alt,
+      src,
+      srcSet,
+      sizes,
+      ...imgProps
+    });
+  } else if (childrenProp != null) {
+    children = childrenProp;
+  } else if (hasImg && alt) {
+    children = alt[0];
+  } else {
+    children = /* @__PURE__ */ jsx(DefaultAvatar, {
+      id,
+      title,
+      ...rest
+    });
+  }
+  return /* @__PURE__ */ jsx("div", {
+    ref,
+    className: cx(withBaseName(), withBaseName(size), className),
+    ...rest,
+    children
+  });
+});
+
+export { Avatar };
+//# sourceMappingURL=Avatar.js.map

package/dist-es/packages/lab/src/avatar/Avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.js","sources":["../src/avatar/Avatar.tsx"],"sourcesContent":["import { makePrefixer, useId } from \"@salt-ds/core\";\nimport cn from \"classnames\";\nimport { forwardRef, HTMLAttributes, ImgHTMLAttributes } from \"react\";\nimport { classBase } from \"./internal/constants\";\nimport { DefaultAvatar } from \"./internal/DefaultAvatar\";\nimport { useLoaded } from \"./internal/useLoaded\";\n\nimport \"./Avatar.css\";\n\nexport interface AvatarProps extends HTMLAttributes<HTMLDivElement> {\n  alt?: string;\n  id?: string;\n  imgProps?: ImgHTMLAttributes<HTMLImageElement>;\n  size?: \"small\" | \"medium\" | \"large\";\n  sizes?: string;\n  src?: string;\n  srcSet?: string;\n  title?: string;\n}\n\nconst withBaseName = makePrefixer(classBase);\n\nexport const Avatar = forwardRef<HTMLDivElement, AvatarProps>(function Avatar(\n  {\n    alt = \"\",\n    className,\n    children: childrenProp,\n    id: idProp,\n    size = \"medium\",\n    src,\n    srcSet,\n    title = \"user\",\n    imgProps,\n    sizes,\n    ...rest\n  },\n  ref\n) {\n  let children;\n  const id = useId(idProp);\n\n  const loaded = useLoaded({ ...imgProps, src, srcSet });\n  const hasImg = src || srcSet;\n  const hasImgNotFailing = hasImg && loaded !== \"error\";\n\n  if (hasImgNotFailing) {\n    children = (\n      <img\n        className={withBaseName(\"image\")}\n        alt={alt}\n        src={src}\n        srcSet={srcSet}\n        sizes={sizes}\n        {...imgProps}\n      />\n    );\n  } else if (childrenProp != null) {\n    children = childrenProp;\n  } else if (hasImg && alt) {\n    children = alt[0];\n  } else {\n    children = <DefaultAvatar id={id} title={title} {...rest} />;\n  }\n\n  return (\n    <div\n      ref={ref}\n      className={cn(withBaseName(), withBaseName(size), className)}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n});\n"],"names":["Avatar","cn"],"mappings":";;;;;;;;;AAoBA,MAAM,YAAA,GAAe,aAAa,SAAS,CAAA,CAAA;AAE9B,MAAA,MAAA,GAAS,UAAwC,CAAA,SAASA,OACrE,CAAA;AAAA,EACE,GAAM,GAAA,EAAA;AAAA,EACN,SAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,EAAI,EAAA,MAAA;AAAA,EACJ,IAAO,GAAA,QAAA;AAAA,EACP,GAAA;AAAA,EACA,MAAA;AAAA,EACA,KAAQ,GAAA,MAAA;AAAA,EACR,QAAA;AAAA,EACA,KAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAI,IAAA,QAAA,CAAA;AACJ,EAAM,MAAA,EAAA,GAAK,MAAM,MAAM,CAAA,CAAA;AAEvB,EAAA,MAAM,SAAS,SAAU,CAAA,EAAE,GAAG,QAAU,EAAA,GAAA,EAAK,QAAQ,CAAA,CAAA;AACrD,EAAA,MAAM,SAAS,GAAO,IAAA,MAAA,CAAA;AACtB,EAAM,MAAA,gBAAA,GAAmB,UAAU,MAAW,KAAA,OAAA,CAAA;AAE9C,EAAA,IAAI,gBAAkB,EAAA;AACpB,IAAA,QAAA,mBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,MAC/B,GAAA;AAAA,MACA,GAAA;AAAA,MACA,MAAA;AAAA,MACA,KAAA;AAAA,MACC,GAAG,QAAA;AAAA,KACN,CAAA,CAAA;AAAA,GAEJ,MAAA,IAAW,gBAAgB,IAAM,EAAA;AAC/B,IAAW,QAAA,GAAA,YAAA,CAAA;AAAA,GACb,MAAA,IAAW,UAAU,GAAK,EAAA;AACxB,IAAA,QAAA,GAAW,GAAI,CAAA,CAAA,CAAA,CAAA;AAAA,GACV,MAAA;AACL,IAAA,QAAA,mBAAY,GAAA,CAAA,aAAA,EAAA;AAAA,MAAc,EAAA;AAAA,MAAQ,KAAA;AAAA,MAAe,GAAG,IAAA;AAAA,KAAM,CAAA,CAAA;AAAA,GAC5D;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAA;AAAA,IACA,WAAWC,EAAG,CAAA,YAAA,IAAgB,YAAa,CAAA,IAAI,GAAG,SAAS,CAAA;AAAA,IAC1D,GAAG,IAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/packages/lab/src/avatar/internal/DefaultAvatar.js

@@ -0,0 +1,41 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { makePrefixer } from '@salt-ds/core';
+import { classBase } from './constants.js';
+
+const withBaseName = makePrefixer(classBase);
+function DefaultAvatar({ id, title }) {
+  return /* @__PURE__ */ jsxs("svg", {
+    "aria-labelledby": id,
+    height: "64px",
+    role: "img",
+    viewBox: "0 0 64 64",
+    width: "64px",
+    children: [
+      /* @__PURE__ */ jsx("title", {
+        id,
+        children: title
+      }),
+      /* @__PURE__ */ jsx("g", {
+        className: withBaseName("svgRoot"),
+        fill: "none",
+        fillRule: "evenodd",
+        stroke: "none",
+        children: /* @__PURE__ */ jsxs("g", {
+          children: [
+            /* @__PURE__ */ jsx("path", {
+              className: withBaseName("svgDisc"),
+              d: "M0,32 C0,49.6769231 14.3230769,64 32,64 C49.6769231,64 64,49.6769231 64,32 C64,14.3230769 49.6769231,0 32,0 C14.3230769,0 0,14.3230769 0,32 Z"
+            }),
+            /* @__PURE__ */ jsx("path", {
+              className: withBaseName("svgHead"),
+              d: "M31.9995627,62.8538462 C22.4716151,62.8538462 13.9354845,58.5287108 8.24473082,51.7487468 C11.1388856,50.496781 18.3580131,47.8952936 22.9268753,46.5620313 C23.2845799,46.4482162 23.349617,46.4319569 23.349617,44.8222866 C23.349617,43.0988012 23.1545055,41.879354 22.7317638,40.9850927 C22.1626884,39.7656455 21.479798,37.7007148 21.2359085,35.8469925 C20.5530181,35.0504496 19.6262382,33.4893945 19.0246442,30.4978466 C18.5043468,27.8638406 18.7482362,26.9045421 19.0896814,26.0102808 C19.1222,25.9127251 19.1709779,25.8151693 19.1872372,25.7176135 C19.3173116,25.1160195 19.1384593,21.8966789 18.683199,19.4090065 C18.3742724,17.7017804 18.7644955,14.0759574 21.1220935,11.0679876 C22.6016894,9.16564991 25.4470663,6.84057054 30.5524853,6.51538462 L33.3978621,6.51538462 C38.5845776,6.84057054 41.4299545,9.16564991 42.9095504,11.0679876 C45.2671484,14.0759574 45.6573715,17.7017804 45.3321856,19.4090065 C44.8769253,21.8966789 44.698073,25.0997602 44.8281474,25.7176135 C44.8444067,25.8151693 44.8931846,25.9127251 44.9257032,25.9940215 C45.2671484,26.8882828 45.5272971,27.8475813 44.9907404,30.4815873 C44.3891464,33.4732978 43.4623665,35.0340277 42.7794761,35.8308958 C42.5355866,37.6844555 41.8526962,39.7331269 41.2836208,40.9686708 C40.747064,42.0907248 40.2105073,43.4239871 40.2105073,44.7572494 C40.2105073,46.3669197 40.2755445,46.383179 40.6495083,46.4968315 C44.9907404,47.7814785 52.4700167,50.3667066 55.7706538,51.7162282 C50.0799001,58.5126141 41.5437696,62.8538462 31.9995627,62.8538462"
+            })
+          ]
+        })
+      })
+    ]
+  });
+}
+
+export { DefaultAvatar };
+//# sourceMappingURL=DefaultAvatar.js.map

package/dist-es/packages/lab/src/avatar/internal/DefaultAvatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultAvatar.js","sources":["../src/avatar/internal/DefaultAvatar.tsx"],"sourcesContent":["import { HTMLAttributes } from \"react\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { classBase } from \"./constants\";\n\nconst withBaseName = makePrefixer(classBase);\n\nexport function DefaultAvatar({ id, title }: HTMLAttributes<HTMLElement>) {\n  return (\n    <svg\n      aria-labelledby={id}\n      height=\"64px\"\n      role=\"img\"\n      viewBox=\"0 0 64 64\"\n      width=\"64px\"\n    >\n      <title id={id}>{title}</title>\n      <g\n        className={withBaseName(\"svgRoot\")}\n        fill=\"none\"\n        fillRule=\"evenodd\"\n        stroke=\"none\"\n      >\n        <g>\n          <path\n            className={withBaseName(\"svgDisc\")}\n            d=\"M0,32 C0,49.6769231 14.3230769,64 32,64 C49.6769231,64 64,49.6769231 64,32 C64,14.3230769 49.6769231,0 32,0 C14.3230769,0 0,14.3230769 0,32 Z\"\n          />\n          <path\n            className={withBaseName(\"svgHead\")}\n            d=\"M31.9995627,62.8538462 C22.4716151,62.8538462 13.9354845,58.5287108 8.24473082,51.7487468 C11.1388856,50.496781 18.3580131,47.8952936 22.9268753,46.5620313 C23.2845799,46.4482162 23.349617,46.4319569 23.349617,44.8222866 C23.349617,43.0988012 23.1545055,41.879354 22.7317638,40.9850927 C22.1626884,39.7656455 21.479798,37.7007148 21.2359085,35.8469925 C20.5530181,35.0504496 19.6262382,33.4893945 19.0246442,30.4978466 C18.5043468,27.8638406 18.7482362,26.9045421 19.0896814,26.0102808 C19.1222,25.9127251 19.1709779,25.8151693 19.1872372,25.7176135 C19.3173116,25.1160195 19.1384593,21.8966789 18.683199,19.4090065 C18.3742724,17.7017804 18.7644955,14.0759574 21.1220935,11.0679876 C22.6016894,9.16564991 25.4470663,6.84057054 30.5524853,6.51538462 L33.3978621,6.51538462 C38.5845776,6.84057054 41.4299545,9.16564991 42.9095504,11.0679876 C45.2671484,14.0759574 45.6573715,17.7017804 45.3321856,19.4090065 C44.8769253,21.8966789 44.698073,25.0997602 44.8281474,25.7176135 C44.8444067,25.8151693 44.8931846,25.9127251 44.9257032,25.9940215 C45.2671484,26.8882828 45.5272971,27.8475813 44.9907404,30.4815873 C44.3891464,33.4732978 43.4623665,35.0340277 42.7794761,35.8308958 C42.5355866,37.6844555 41.8526962,39.7331269 41.2836208,40.9686708 C40.747064,42.0907248 40.2105073,43.4239871 40.2105073,44.7572494 C40.2105073,46.3669197 40.2755445,46.383179 40.6495083,46.4968315 C44.9907404,47.7814785 52.4700167,50.3667066 55.7706538,51.7162282 C50.0799001,58.5126141 41.5437696,62.8538462 31.9995627,62.8538462\"\n          />\n        </g>\n      </g>\n    </svg>\n  );\n}\n"],"names":[],"mappings":";;;;AAIA,MAAM,YAAA,GAAe,aAAa,SAAS,CAAA,CAAA;AAEpC,SAAS,aAAc,CAAA,EAAE,EAAI,EAAA,KAAA,EAAsC,EAAA;AACxE,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACC,iBAAiB,EAAA,EAAA;AAAA,IACjB,MAAO,EAAA,MAAA;AAAA,IACP,IAAK,EAAA,KAAA;AAAA,IACL,OAAQ,EAAA,WAAA;AAAA,IACR,KAAM,EAAA,MAAA;AAAA,IAEN,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,OAAA,EAAA;AAAA,QAAM,EAAA;AAAA,QAAS,QAAA,EAAA,KAAA;AAAA,OAAM,CAAA;AAAA,sBACrB,GAAA,CAAA,GAAA,EAAA;AAAA,QACC,SAAA,EAAW,aAAa,SAAS,CAAA;AAAA,QACjC,IAAK,EAAA,MAAA;AAAA,QACL,QAAS,EAAA,SAAA;AAAA,QACT,MAAO,EAAA,MAAA;AAAA,QAEP,QAAC,kBAAA,IAAA,CAAA,GAAA,EAAA;AAAA,UACC,QAAA,EAAA;AAAA,4BAAC,GAAA,CAAA,MAAA,EAAA;AAAA,cACC,SAAA,EAAW,aAAa,SAAS,CAAA;AAAA,cACjC,CAAE,EAAA,+IAAA;AAAA,aACJ,CAAA;AAAA,4BACC,GAAA,CAAA,MAAA,EAAA;AAAA,cACC,SAAA,EAAW,aAAa,SAAS,CAAA;AAAA,cACjC,CAAE,EAAA,o+CAAA;AAAA,aACJ,CAAA;AAAA,WAAA;AAAA,SACF,CAAA;AAAA,OACF,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}

package/dist-es/packages/lab/src/avatar/internal/constants.js

@@ -0,0 +1,4 @@
+const classBase = "saltAvatar";
+
+export { classBase };
+//# sourceMappingURL=constants.js.map

package/dist-es/packages/lab/src/avatar/internal/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../src/avatar/internal/constants.ts"],"sourcesContent":["export const classBase = \"saltAvatar\";\n"],"names":[],"mappings":"AAAO,MAAM,SAAY,GAAA;;;;"}

package/dist-es/packages/lab/src/avatar/internal/useLoaded.js

@@ -0,0 +1,43 @@
+import { useState, useEffect } from 'react';
+
+function useLoaded({
+  crossOrigin,
+  referrerPolicy,
+  src,
+  srcSet
+}) {
+  const [loaded, setLoaded] = useState(false);
+  useEffect(() => {
+    if (!src && !srcSet) {
+      return void 0;
+    }
+    setLoaded(false);
+    let active = true;
+    const image = new Image();
+    image.onload = () => {
+      if (!active) {
+        return;
+      }
+      setLoaded("loaded");
+    };
+    image.onerror = () => {
+      if (!active) {
+        return;
+      }
+      setLoaded("error");
+    };
+    image.crossOrigin = crossOrigin;
+    image.referrerPolicy = referrerPolicy;
+    image.src = src;
+    if (srcSet) {
+      image.srcset = srcSet;
+    }
+    return () => {
+      active = false;
+    };
+  }, [crossOrigin, referrerPolicy, src, srcSet]);
+  return loaded;
+}
+
+export { useLoaded };
+//# sourceMappingURL=useLoaded.js.map

package/dist-es/packages/lab/src/avatar/internal/useLoaded.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLoaded.js","sources":["../src/avatar/internal/useLoaded.ts"],"sourcesContent":["import { ImgHTMLAttributes, useEffect, useState } from \"react\";\n\nexport function useLoaded({\n  crossOrigin,\n  referrerPolicy,\n  src,\n  srcSet,\n}: ImgHTMLAttributes<HTMLImageElement>) {\n  const [loaded, setLoaded] = useState<false | \"loaded\" | \"error\">(false);\n\n  useEffect(() => {\n    if (!src && !srcSet) {\n      return undefined;\n    }\n\n    setLoaded(false);\n\n    let active = true;\n    const image = new Image();\n    image.onload = () => {\n      if (!active) {\n        return;\n      }\n      setLoaded(\"loaded\");\n    };\n    image.onerror = () => {\n      if (!active) {\n        return;\n      }\n      setLoaded(\"error\");\n    };\n    image.crossOrigin = crossOrigin as HTMLImageElement[\"crossOrigin\"];\n    image.referrerPolicy = referrerPolicy as HTMLImageElement[\"referrerPolicy\"];\n    image.src = src as HTMLImageElement[\"src\"];\n    if (srcSet) {\n      image.srcset = srcSet;\n    }\n\n    return () => {\n      active = false;\n    };\n  }, [crossOrigin, referrerPolicy, src, srcSet]);\n\n  return loaded;\n}\n"],"names":[],"mappings":";;AAEO,SAAS,SAAU,CAAA;AAAA,EACxB,WAAA;AAAA,EACA,cAAA;AAAA,EACA,GAAA;AAAA,EACA,MAAA;AACF,CAAwC,EAAA;AACtC,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAAqC,KAAK,CAAA,CAAA;AAEtE,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,CAAC,GAAO,IAAA,CAAC,MAAQ,EAAA;AACnB,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAEA,IAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AAEf,IAAA,IAAI,MAAS,GAAA,IAAA,CAAA;AACb,IAAM,MAAA,KAAA,GAAQ,IAAI,KAAM,EAAA,CAAA;AACxB,IAAA,KAAA,CAAM,SAAS,MAAM;AACnB,MAAA,IAAI,CAAC,MAAQ,EAAA;AACX,QAAA,OAAA;AAAA,OACF;AACA,MAAA,SAAA,CAAU,QAAQ,CAAA,CAAA;AAAA,KACpB,CAAA;AACA,IAAA,KAAA,CAAM,UAAU,MAAM;AACpB,MAAA,IAAI,CAAC,MAAQ,EAAA;AACX,QAAA,OAAA;AAAA,OACF;AACA,MAAA,SAAA,CAAU,OAAO,CAAA,CAAA;AAAA,KACnB,CAAA;AACA,IAAA,KAAA,CAAM,WAAc,GAAA,WAAA,CAAA;AACpB,IAAA,KAAA,CAAM,cAAiB,GAAA,cAAA,CAAA;AACvB,IAAA,KAAA,CAAM,GAAM,GAAA,GAAA,CAAA;AACZ,IAAA,IAAI,MAAQ,EAAA;AACV,MAAA,KAAA,CAAM,MAAS,GAAA,MAAA,CAAA;AAAA,KACjB;AAEA,IAAA,OAAO,MAAM;AACX,MAAS,MAAA,GAAA,KAAA,CAAA;AAAA,KACX,CAAA;AAAA,KACC,CAAC,WAAA,EAAa,cAAgB,EAAA,GAAA,EAAK,MAAM,CAAC,CAAA,CAAA;AAE7C,EAAO,OAAA,MAAA,CAAA;AACT;;;;"}

package/dist-es/packages/lab/src/badge/Badge.css.js

@@ -0,0 +1,7 @@
+import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = "/* Default variables applied to the root element */\n.saltBadge {\n  /* Colors */\n  --badge-content-text-color: var(--saltBadge-content-text-color, var(--salt-accent-foreground));\n  --badge-content-icon-color: var(--saltBadge-content-icon-color, var(--salt-accent-background));\n  /* Font, Typography */\n  --badge-content-borderRadius: 16px;\n  --badge-content-lineHeight: 15px;\n  --badge-content-padding: 0px 4px;\n  --badge-fontSize: var(--saltBadge-fontSize, var(--salt-text-label-fontSize));\n\n  /* Derived */\n  /* Same as content padding in x */\n  --badge-offset-inline: -4px;\n\n  --badge-sequence-gap: var(--salt-size-unit);\n}\n\n/* Style applied to the root element */\n.saltBadge {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  display: inline-flex;\n  position: relative;\n  flex-shrink: 0;\n  vertical-align: middle;\n  line-height: var(--salt-text-lineHeight);\n  font-size: var(--salt-text-fontSize);\n}\n\n/* Give automatic margin when they sit next to each other */\n.saltBadge + .saltBadge {\n  margin-left: var(--badge-sequence-gap);\n}\n\n/* Style applied to the badge in the corner of the node */\n.saltBadge-badge {\n  color: var(--badge-content-text-color);\n  display: inline-block;\n  font-weight: 700; /* TODO: Use characteristic once aligned */\n  font-size: var(--badge-fontSize);\n  /* default small type */\n  width: auto;\n  min-width: 15px;\n  line-height: var(--badge-content-lineHeight);\n  border-radius: var(--badge-content-borderRadius);\n  text-align: center;\n\n  transform: translate(var(--badge-offset-inline), -50%);\n  transform-origin: 100% 0%;\n  /*\n    We want offset the next inline element to be strictly next to the badge.\n    This negative margin makes sure this node \"appears\" to be narrower.\n   */\n  margin-right: var(--badge-offset-inline);\n\n  padding: var(--badge-content-padding);\n  background: var(--badge-content-icon-color);\n\n  position: relative;\n\n  flex-wrap: wrap;\n  align-items: center;\n  align-content: center;\n  flex-direction: row;\n  justify-content: center;\n}\n";
+styleInject(css_248z);
+
+export { css_248z as default };
+//# sourceMappingURL=Badge.css.js.map

package/dist-es/packages/lab/src/badge/Badge.css.js.map

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