@salt-ds/lab 1.0.0-alpha.8 → 1.0.0-alpha.81

package/dist-es/packages/lab/src/list-deprecated/useTypeSelect.js

@@ -1,83 +0,0 @@
-import { useCallback, useRef } from 'react';
-import { escapeRegExp } from '../utils/escapeRegExp.js';
-import '@salt-ds/core';
-import '../utils/useFloatingUI.js';
-import { itemToString } from './itemToString.js';
-
-const TYPE_SELECT_TIMEOUT = 1500;
-function useTypeSelect(options) {
-  const {
-    getItemAtIndex,
-    highlightedIndex,
-    itemCount,
-    itemToString: itemToString$1 = itemToString,
-    onTypeSelect,
-    setFocusVisible,
-    setHighlightedIndex
-  } = options;
-  const getItemIndexForSearch = useCallback(
-    (searchTerm, fromIndex) => {
-      if (itemCount === 0) {
-        return null;
-      }
-      let index = fromIndex || 0;
-      while (index < itemCount) {
-        const item = getItemAtIndex(index);
-        const textValue = itemToString$1 ? itemToString$1(item) : item;
-        if (textValue && textValue.match(new RegExp(`^${escapeRegExp(searchTerm)}`, "i"))) {
-          return index;
-        }
-        index = index + 1;
-      }
-      return null;
-    },
-    [itemCount, itemToString$1, getItemAtIndex]
-  );
-  const state = useRef({
-    search: "",
-    timeout: null
-  }).current;
-  const onKeyDownCapture = (event) => {
-    const character = getStringForKey(event.key);
-    if (!character || event.ctrlKey || event.metaKey) {
-      return;
-    }
-    if (character !== " " || state.search.trim().length > 0) {
-      event.preventDefault();
-      event.stopPropagation();
-    }
-    if (character !== state.search) {
-      state.search += character;
-    }
-    let index = getItemIndexForSearch(
-      state.search,
-      state.search.length > 1 ? highlightedIndex : highlightedIndex + 1
-    );
-    if (index == null) {
-      index = getItemIndexForSearch(state.search);
-    }
-    if (index != null) {
-      setFocusVisible(true);
-      setHighlightedIndex(index);
-      if (onTypeSelect) {
-        onTypeSelect(index);
-      }
-    }
-    clearTimeout(state.timeout);
-    state.timeout = setTimeout(() => {
-      state.search = "";
-    }, TYPE_SELECT_TIMEOUT);
-  };
-  return {
-    onKeyDownCapture
-  };
-}
-function getStringForKey(key) {
-  if (key.length === 1 || !/^[A-Z]/i.test(key)) {
-    return key;
-  }
-  return "";
-}
-
-export { useTypeSelect };
-//# sourceMappingURL=useTypeSelect.js.map

package/dist-es/packages/lab/src/list-deprecated/useTypeSelect.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useTypeSelect.js","sources":["../src/list-deprecated/useTypeSelect.js"],"sourcesContent":["import { useCallback, useRef } from \"react\";\nimport { escapeRegExp } from \"../utils\";\n\nimport { itemToString as defaultItemToString } from \"./itemToString\";\n\nconst TYPE_SELECT_TIMEOUT = 1500;\n\nexport function useTypeSelect(options) {\n  const {\n    getItemAtIndex,\n    highlightedIndex,\n    itemCount,\n    itemToString = defaultItemToString,\n    onTypeSelect,\n    setFocusVisible,\n    setHighlightedIndex,\n  } = options;\n\n  const getItemIndexForSearch = useCallback(\n    (searchTerm, fromIndex) => {\n      if (itemCount === 0) {\n        return null;\n      }\n\n      let index = fromIndex || 0;\n      while (index < itemCount) {\n        const item = getItemAtIndex(index);\n        const textValue = itemToString ? itemToString(item) : item;\n        if (\n          textValue &&\n          textValue.match(new RegExp(`^${escapeRegExp(searchTerm)}`, \"i\"))\n        ) {\n          return index;\n        }\n\n        index = index + 1;\n      }\n\n      return null;\n    },\n    [itemCount, itemToString, getItemAtIndex]\n  );\n\n  const state = useRef({\n    search: \"\",\n    timeout: null,\n  }).current;\n\n  // eslint-disable-next-line complexity\n  const onKeyDownCapture = (event) => {\n    const character = getStringForKey(event.key);\n    if (!character || event.ctrlKey || event.metaKey) {\n      return;\n    }\n\n    // Do not propagate the Spacebar event if it's meant to be part of the search.\n    // When we time out, the search term becomes empty, hence the check on length.\n    // Trimming is to account for the case of pressing the Spacebar more than once,\n    // which should cycle through the selection/deselection of the focused item.\n    if (character !== \" \" || state.search.trim().length > 0) {\n      event.preventDefault();\n      event.stopPropagation();\n    }\n\n    // When typing same character sebsequently and *quickly*, we treat it as cyling through items\n    // starting with that char instead of seaching for double character, because in most cases\n    // there won't be any option having same characters at the beginning. This should be only\n    // impacting beginning of the words because length of `character` would be 1.\n    if (character !== state.search) {\n      state.search += character;\n    }\n\n    // Prioritize items after the currently focused item, falling back to searching the whole list.\n    // We want to cycle through choices when keep typing the same first character, hence the +1\n    // condition. All subsequent characters should stay at the current item otherwise it will\n    // always jumping around.\n    let index = getItemIndexForSearch(\n      state.search,\n      state.search.length > 1 ? highlightedIndex : highlightedIndex + 1\n    );\n\n    // If no key found, search from the top.\n    if (index == null) {\n      index = getItemIndexForSearch(state.search);\n    }\n\n    if (index != null) {\n      setFocusVisible(true);\n      // TODO: Maybe we can repurpose this setHighlightedIndex so that the user controls it's meant to set\n      // hightlighted index when expanded v.s. selected item when collapsed\n      setHighlightedIndex(index);\n      if (onTypeSelect) {\n        onTypeSelect(index);\n      }\n    }\n\n    clearTimeout(state.timeout);\n    state.timeout = setTimeout(() => {\n      state.search = \"\";\n    }, TYPE_SELECT_TIMEOUT);\n  };\n\n  return {\n    // Using a capturing listener to catch the keydown event before\n    // other hooks in order to handle the Spacebar event.\n    onKeyDownCapture,\n  };\n}\n\nfunction getStringForKey(key) {\n  // If the key is of length 1, it is an ASCII value.\n  // Otherwise, if there are no ASCII characters in the key name,\n  // it is a Unicode character.\n  // See https://www.w3.org/TR/uievents-key/\n  if (key.length === 1 || !/^[A-Z]/i.test(key)) {\n    return key;\n  }\n\n  return \"\";\n}\n"],"names":["itemToString","defaultItemToString"],"mappings":"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"}

package/dist-es/packages/lab/src/logo/Logo.css.js

@@ -1,7 +0,0 @@
-import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".salt-density-high {\n  --logo-height: var(--saltLogo-logo-height, 14px);\n}\n.salt-density-medium {\n  --logo-height: var(--saltLogo-logo-height, 20px);\n}\n.salt-density-low {\n  --logo-height: var(--saltLogo-logo-height, 26px);\n}\n.salt-density-touch {\n  --logo-height: var(--saltLogo-logo-height, 32px);\n}\n\n.saltLogo {\n  --logo-color: var(--saltLogo-color, var(--salt-text-secondary-foreground));\n  --logo-divider-color: var(--saltLogo-pipe-color, var(--salt-separable-secondary-borderColor));\n  --logo-divider-height: var(--saltLogo-title-height, var(--salt-size-separator-height));\n  --logo-divider-margin: 0 calc(var(--salt-size-unit) * 2);\n  --logo-fontSize: var(--salt-text-fontSize);\n  --logo-lineHeight: var(--salt-text-lineHeight);\n}\n\n.saltLogo-compact {\n  --logo-pipe-margin: 0 calc(var(--salt-size-unit) * 1.5);\n}\n\n.saltLogo {\n  display: inline-flex;\n  position: relative;\n  align-items: center;\n  justify-content: center;\n  height: var(--logo-height);\n}\n\n.saltLogo img {\n  max-height: 100%;\n}\n\n.saltLogo-wrapper {\n  display: inline-flex;\n  position: relative;\n  height: var(--logo-height);\n}\n\n.saltLogo-logo {\n  fill: var(--logo-color);\n  margin: auto;\n  stroke: none !important;\n  text-align: center;\n  font-size: var(--logo-fontSize);\n  line-height: var(--logo-lineHeight);\n}\n\n.saltLogo-appTitle {\n  align-self: center;\n  color: var(--logo-color);\n  position: relative;\n}\n\n.saltLogo-titlePipe {\n  border-right: 1px solid var(--logo-divider-color);\n  margin: var(--logo-divider-margin);\n  height: var(--logo-divider-height);\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=Logo.css.js.map

package/dist-es/packages/lab/src/logo/Logo.css.js.map

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

package/dist-es/packages/lab/src/logo/Logo.js

@@ -1,50 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { clsx } from 'clsx';
-import { makePrefixer } from '@salt-ds/core';
-import { LogoTitle } from './internal/LogoTitle.js';
-import './Logo.css.js';
-
-const withBaseName = makePrefixer("saltLogo");
-const Logo = forwardRef(function Logo2(props, ref) {
-  const {
-    appTitle,
-    className,
-    compact,
-    src,
-    ImageProps,
-    LogoImageComponent = "img",
-    TitleProps,
-    ...rest
-  } = props;
-  return /* @__PURE__ */ jsxs("span", {
-    className: clsx(withBaseName(), className, {
-      [withBaseName("compact")]: compact
-    }),
-    ref,
-    ...rest,
-    children: [
-      /* @__PURE__ */ jsx("span", {
-        className: withBaseName("wrapper"),
-        children: /* @__PURE__ */ jsx(LogoImageComponent, {
-          ...ImageProps,
-          className: clsx(withBaseName("logo"), ImageProps == null ? void 0 : ImageProps.className),
-          src,
-          alt: (ImageProps == null ? void 0 : ImageProps.alt) || "Logo"
-        })
-      }),
-      /* @__PURE__ */ jsx(LogoTitle, {
-        ...TitleProps,
-        className: clsx(withBaseName("appTitle"), TitleProps == null ? void 0 : TitleProps.className),
-        label: appTitle,
-        separatorClassname: clsx(
-          withBaseName("titlePipe"),
-          TitleProps == null ? void 0 : TitleProps.separatorClassname
-        )
-      })
-    ]
-  });
-});
-
-export { Logo };
-//# sourceMappingURL=Logo.js.map

package/dist-es/packages/lab/src/logo/Logo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Logo.js","sources":["../src/logo/Logo.tsx"],"sourcesContent":["import { ComponentType, forwardRef, ComponentPropsWithoutRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"@salt-ds/core\";\n\nimport { LogoTitle, LogoTitleProps } from \"./internal/LogoTitle\";\nimport \"./Logo.css\";\n\nexport interface LogoProps extends ComponentPropsWithoutRef<\"span\"> {\n  /**\n   * Used to provide application title\n   */\n  appTitle?: string;\n  /**\n   * If `true`, the logo will be compact;\n   */\n  compact?: boolean;\n  /**\n   * Props passed to the Logo.\n   */\n  ImageProps?: Partial<ComponentPropsWithoutRef<\"img\">>;\n  /**\n   * Custom Component to render the logo image.\n   * e.g. if a custom renderer instead of static image using `src` prop.\n   */\n  LogoImageComponent?: ComponentType<Partial<ComponentPropsWithoutRef<\"img\">>>;\n  /**\n   * Image src for logo.\n   */\n  src?: string;\n  /**\n   * Props passed to the Application Title if used.\n   * If using a custom image then ImageProps.alt should be set to include a screen reader alternative text.\n   */\n  TitleProps?: Omit<Partial<LogoTitleProps>, \"label\">;\n}\n\nconst withBaseName = makePrefixer(\"saltLogo\");\n\nexport const Logo = forwardRef<HTMLSpanElement, LogoProps>(function Logo(\n  props,\n  ref\n) {\n  const {\n    appTitle,\n    className,\n    compact,\n    src,\n    ImageProps,\n    LogoImageComponent = \"img\",\n    TitleProps,\n    ...rest\n  } = props;\n\n  // TODO check if we need ImageProps and TitleProps classNames interface.\n  return (\n    <span\n      className={clsx(withBaseName(), className, {\n        [withBaseName(\"compact\")]: compact,\n      })}\n      ref={ref}\n      {...rest}\n    >\n      <span className={withBaseName(\"wrapper\")}>\n        <LogoImageComponent\n          {...ImageProps}\n          className={clsx(withBaseName(\"logo\"), ImageProps?.className)}\n          src={src}\n          alt={ImageProps?.alt || \"Logo\"}\n        />\n      </span>\n      <LogoTitle\n        {...TitleProps}\n        className={clsx(withBaseName(\"appTitle\"), TitleProps?.className)}\n        label={appTitle}\n        separatorClassname={clsx(\n          withBaseName(\"titlePipe\"),\n          TitleProps?.separatorClassname\n        )}\n      />\n    </span>\n  );\n});\n"],"names":["Logo"],"mappings":";;;;;;;AAoCA,MAAM,YAAA,GAAe,aAAa,UAAU,CAAA,CAAA;AAErC,MAAM,IAAO,GAAA,UAAA,CAAuC,SAASA,KAAAA,CAClE,OACA,GACA,EAAA;AACA,EAAM,MAAA;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,GAAA;AAAA,IACA,UAAA;AAAA,IACA,kBAAqB,GAAA,KAAA;AAAA,IACrB,UAAA;AAAA,IACG,GAAA,IAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAGJ,EAAA,uBACG,IAAA,CAAA,MAAA,EAAA;AAAA,IACC,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAW,EAAA;AAAA,MACzC,CAAC,YAAa,CAAA,SAAS,CAAI,GAAA,OAAA;AAAA,KAC5B,CAAA;AAAA,IACD,GAAA;AAAA,IACC,GAAG,IAAA;AAAA,IAEJ,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,MAAA,EAAA;AAAA,QAAK,SAAA,EAAW,aAAa,SAAS,CAAA;AAAA,QACrC,QAAC,kBAAA,GAAA,CAAA,kBAAA,EAAA;AAAA,UACE,GAAG,UAAA;AAAA,UACJ,WAAW,IAAK,CAAA,YAAA,CAAa,MAAM,CAAA,EAAG,yCAAY,SAAS,CAAA;AAAA,UAC3D,GAAA;AAAA,UACA,GAAA,EAAA,CAAK,yCAAY,GAAO,KAAA,MAAA;AAAA,SAC1B,CAAA;AAAA,OACF,CAAA;AAAA,sBACC,GAAA,CAAA,SAAA,EAAA;AAAA,QACE,GAAG,UAAA;AAAA,QACJ,WAAW,IAAK,CAAA,YAAA,CAAa,UAAU,CAAA,EAAG,yCAAY,SAAS,CAAA;AAAA,QAC/D,KAAO,EAAA,QAAA;AAAA,QACP,kBAAoB,EAAA,IAAA;AAAA,UAClB,aAAa,WAAW,CAAA;AAAA,UACxB,UAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,kBAAA;AAAA,SACd;AAAA,OACF,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/packages/lab/src/logo/internal/LogoTitle.js

@@ -1,24 +0,0 @@
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-
-const LogoTitle = forwardRef(
-  function LogoTitle2({ label, separatorClassname, ...rest }, ref) {
-    return label ? /* @__PURE__ */ jsxs(Fragment, {
-      children: [
-        /* @__PURE__ */ jsx("span", {
-          className: separatorClassname
-        }),
-        /* @__PURE__ */ jsx("span", {
-          ref,
-          ...rest,
-          children: /* @__PURE__ */ jsx("span", {
-            children: label
-          })
-        })
-      ]
-    }) : null;
-  }
-);
-
-export { LogoTitle };
-//# sourceMappingURL=LogoTitle.js.map

package/dist-es/packages/lab/src/logo/internal/LogoTitle.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LogoTitle.js","sources":["../src/logo/internal/LogoTitle.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\n\nexport interface LogoTitleProps extends ComponentPropsWithoutRef<\"span\"> {\n  label?: string;\n  separatorClassname?: string;\n}\n\nexport const LogoTitle = forwardRef<HTMLSpanElement, LogoTitleProps>(\n  function LogoTitle({ label, separatorClassname, ...rest }, ref) {\n    return label ? (\n      <>\n        <span className={separatorClassname} />\n        <span ref={ref} {...rest}>\n          <span>{label}</span>\n        </span>\n      </>\n    ) : null;\n  }\n);\n"],"names":["LogoTitle"],"mappings":";;;AAOO,MAAM,SAAY,GAAA,UAAA;AAAA,EACvB,SAASA,UAAU,CAAA,EAAE,OAAO,kBAAuB,EAAA,GAAA,IAAA,IAAQ,GAAK,EAAA;AAC9D,IAAA,OAAO,KACL,mBAAA,IAAA,CAAA,QAAA,EAAA;AAAA,MACE,QAAA,EAAA;AAAA,wBAAC,GAAA,CAAA,MAAA,EAAA;AAAA,UAAK,SAAW,EAAA,kBAAA;AAAA,SAAoB,CAAA;AAAA,wBACpC,GAAA,CAAA,MAAA,EAAA;AAAA,UAAK,GAAA;AAAA,UAAW,GAAG,IAAA;AAAA,UAClB,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA;AAAA,YAAM,QAAA,EAAA,KAAA;AAAA,WAAM,CAAA;AAAA,SACf,CAAA;AAAA,OAAA;AAAA,KACF,CACE,GAAA,IAAA,CAAA;AAAA,GACN;AACF;;;;"}

package/dist-es/packages/lab/src/menu-button/MenuButton.js

@@ -1,42 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useState, useCallback } from 'react';
-import { CascadingMenu } from '../cascading-menu/CascadingMenu.js';
-import { MenuButtonTrigger } from './MenuButtonTrigger.js';
-
-const MenuButton = forwardRef(
-  function MenuButton2({ variant = "secondary", CascadingMenuProps: CascadingMenuProps2 = {}, children, ...restProps }, ref) {
-    const {
-      initialSource = { menuItems: [] },
-      onOpen,
-      onClose,
-      ...restMenuProps
-    } = CascadingMenuProps2;
-    const [isMenuOpen, setMenuOpen] = useState(false);
-    const handleOpen = useCallback(() => {
-      setMenuOpen(true);
-      onOpen && onOpen();
-    }, [onOpen]);
-    const handleClose = useCallback(() => {
-      setMenuOpen(false);
-      onClose && onClose();
-    }, [onClose]);
-    return /* @__PURE__ */ jsx(CascadingMenu, {
-      initialSource,
-      onClose: handleClose,
-      onOpen: handleOpen,
-      ...restMenuProps,
-      children: /* @__PURE__ */ jsx(MenuButtonTrigger, {
-        "aria-expanded": isMenuOpen,
-        "aria-haspopup": true,
-        isMenuOpen,
-        ref,
-        variant,
-        ...restProps,
-        children
-      })
-    });
-  }
-);
-
-export { MenuButton };
-//# sourceMappingURL=MenuButton.js.map

package/dist-es/packages/lab/src/menu-button/MenuButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"MenuButton.js","sources":["../src/menu-button/MenuButton.tsx"],"sourcesContent":["import { forwardRef, ReactNode, useCallback, useState } from \"react\";\nimport { ButtonProps } from \"@salt-ds/core\";\nimport { CascadingMenu, CascadingMenuProps } from \"../cascading-menu\";\nimport { MenuButtonTrigger } from \"./MenuButtonTrigger\";\n\nexport interface MenuButtonProps extends ButtonProps {\n  CascadingMenuProps: CascadingMenuProps;\n  children: ReactNode;\n  className?: string;\n  hideCaret?: boolean;\n}\n\nexport const MenuButton = forwardRef<HTMLButtonElement, MenuButtonProps>(\n  function MenuButton(\n    { variant = \"secondary\", CascadingMenuProps = {}, children, ...restProps },\n    ref\n  ) {\n    const {\n      initialSource = { menuItems: [] },\n      onOpen,\n      onClose,\n      ...restMenuProps\n    } = CascadingMenuProps;\n\n    const [isMenuOpen, setMenuOpen] = useState(false);\n\n    const handleOpen = useCallback(() => {\n      setMenuOpen(true);\n      onOpen && onOpen();\n    }, [onOpen]);\n\n    const handleClose = useCallback(() => {\n      setMenuOpen(false);\n      onClose && onClose();\n    }, [onClose]);\n\n    return (\n      <CascadingMenu\n        initialSource={initialSource}\n        onClose={handleClose}\n        onOpen={handleOpen}\n        {...restMenuProps}\n      >\n        <MenuButtonTrigger\n          aria-expanded={isMenuOpen}\n          aria-haspopup\n          isMenuOpen={isMenuOpen}\n          ref={ref}\n          variant={variant}\n          {...restProps}\n        >\n          {children}\n        </MenuButtonTrigger>\n      </CascadingMenu>\n    );\n  }\n);\n"],"names":["MenuButton","CascadingMenuProps"],"mappings":";;;;;AAYO,MAAM,UAAa,GAAA,UAAA;AAAA,EACxB,SAASA,WAAAA,CACP,EAAE,OAAA,GAAU,WAAa,EAAA,kBAAA,EAAAC,mBAAqB,GAAA,EAAI,EAAA,QAAA,EAAA,GAAa,SAAU,EAAA,EACzE,GACA,EAAA;AACA,IAAM,MAAA;AAAA,MACJ,aAAgB,GAAA,EAAE,SAAW,EAAA,EAAG,EAAA;AAAA,MAChC,MAAA;AAAA,MACA,OAAA;AAAA,MACG,GAAA,aAAA;AAAA,KACDA,GAAAA,mBAAAA,CAAAA;AAEJ,IAAA,MAAM,CAAC,UAAA,EAAY,WAAW,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAEhD,IAAM,MAAA,UAAA,GAAa,YAAY,MAAM;AACnC,MAAA,WAAA,CAAY,IAAI,CAAA,CAAA;AAChB,MAAA,MAAA,IAAU,MAAO,EAAA,CAAA;AAAA,KACnB,EAAG,CAAC,MAAM,CAAC,CAAA,CAAA;AAEX,IAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,MAAA,WAAA,CAAY,KAAK,CAAA,CAAA;AACjB,MAAA,OAAA,IAAW,OAAQ,EAAA,CAAA;AAAA,KACrB,EAAG,CAAC,OAAO,CAAC,CAAA,CAAA;AAEZ,IAAA,uBACG,GAAA,CAAA,aAAA,EAAA;AAAA,MACC,aAAA;AAAA,MACA,OAAS,EAAA,WAAA;AAAA,MACT,MAAQ,EAAA,UAAA;AAAA,MACP,GAAG,aAAA;AAAA,MAEJ,QAAC,kBAAA,GAAA,CAAA,iBAAA,EAAA;AAAA,QACC,eAAe,EAAA,UAAA;AAAA,QACf,eAAa,EAAA,IAAA;AAAA,QACb,UAAA;AAAA,QACA,GAAA;AAAA,QACA,OAAA;AAAA,QACC,GAAG,SAAA;AAAA,QAEH,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/packages/lab/src/menu-button/MenuButtonTrigger.css.js

@@ -1,7 +0,0 @@
-import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".saltMenuButtonTrigger {\n  --menuButton-trigger-open-color: var(--saltMenuButton-trigger-open-color, var(--salt-actionable-primary-foreground-active));\n}\n\n.saltMenuButtonTrigger {\n  display: inline-flex;\n  line-height: 1;\n}\n\n.saltMenuButtonTrigger-buttonOpen {\n  background: var(--saltMenuButton-trigger-open-background, var(--salt-actionable-primary-background-active));\n  color: var(--menuButton-trigger-open-color);\n}\n\n.saltMenuButtonTrigger-buttonOpen:not(:hover) .saltMenuButtonTrigger-caretIcon {\n  color: var(--menuButton-trigger-open-color);\n}\n\n.saltMenuButtonTrigger-buttonOpen:not(:hover) .saltMenuButtonTrigger-icon {\n  color: var(--menuButton-trigger-open-color);\n}\n\n.saltMenuButtonTrigger-icon {\n}\n\n.saltMenuButtonTrigger-caretIcon {\n  --saltIcon-margin: 0 0 0 var(--salt-size-unit);\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=MenuButtonTrigger.css.js.map

package/dist-es/packages/lab/src/menu-button/MenuButtonTrigger.css.js.map

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

package/dist-es/packages/lab/src/menu-button/MenuButtonTrigger.js

@@ -1,28 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { clsx } from 'clsx';
-import { makePrefixer, Button } from '@salt-ds/core';
-import { ChevronDownIcon } from '@salt-ds/icons';
-import './MenuButtonTrigger.css.js';
-
-const withBaseName = makePrefixer("saltMenuButtonTrigger");
-const MenuButtonTrigger = forwardRef(function MenuButtonTrigger2({ className, hideCaret, isMenuOpen, children, ...rest }, ref) {
-  return /* @__PURE__ */ jsxs(Button, {
-    ref,
-    className: clsx(withBaseName(), className, {
-      [withBaseName("buttonOpen")]: isMenuOpen
-    }),
-    "data-testid": "menu-button-trigger",
-    ...rest,
-    children: [
-      children,
-      !hideCaret && /* @__PURE__ */ jsx(ChevronDownIcon, {
-        className: withBaseName("caretIcon"),
-        "data-testid": "menu-button-trigger-caret"
-      })
-    ]
-  });
-});
-
-export { MenuButtonTrigger };
-//# sourceMappingURL=MenuButtonTrigger.js.map

package/dist-es/packages/lab/src/menu-button/MenuButtonTrigger.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"MenuButtonTrigger.js","sources":["../src/menu-button/MenuButtonTrigger.tsx"],"sourcesContent":["import { forwardRef, ReactNode } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer, Button, ButtonProps } from \"@salt-ds/core\";\nimport { ChevronDownIcon } from \"@salt-ds/icons\";\nimport \"./MenuButtonTrigger.css\";\n\nconst withBaseName = makePrefixer(\"saltMenuButtonTrigger\");\n\nexport interface MenuButtonTriggerProps extends ButtonProps {\n  className?: string;\n  hideCaret?: boolean;\n  isMenuOpen?: boolean;\n  children?: ReactNode;\n}\n\nexport const MenuButtonTrigger = forwardRef<\n  HTMLButtonElement,\n  MenuButtonTriggerProps\n>(function MenuButtonTrigger(\n  { className, hideCaret, isMenuOpen, children, ...rest },\n  ref\n) {\n  return (\n    <Button\n      ref={ref}\n      className={clsx(withBaseName(), className, {\n        [withBaseName(\"buttonOpen\")]: isMenuOpen,\n      })}\n      data-testid=\"menu-button-trigger\"\n      {...rest}\n    >\n      {children}\n      {!hideCaret && (\n        <ChevronDownIcon\n          className={withBaseName(\"caretIcon\")}\n          data-testid=\"menu-button-trigger-caret\"\n        />\n      )}\n    </Button>\n  );\n});\n"],"names":["MenuButtonTrigger"],"mappings":";;;;;;;AAMA,MAAM,YAAA,GAAe,aAAa,uBAAuB,CAAA,CAAA;AAS5C,MAAA,iBAAA,GAAoB,UAG/B,CAAA,SAASA,kBACT,CAAA,EAAE,SAAW,EAAA,SAAA,EAAW,UAAY,EAAA,QAAA,EAAA,GAAa,IAAK,EAAA,EACtD,GACA,EAAA;AACA,EAAA,uBACG,IAAA,CAAA,MAAA,EAAA;AAAA,IACC,GAAA;AAAA,IACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAW,EAAA;AAAA,MACzC,CAAC,YAAa,CAAA,YAAY,CAAI,GAAA,UAAA;AAAA,KAC/B,CAAA;AAAA,IACD,aAAY,EAAA,qBAAA;AAAA,IACX,GAAG,IAAA;AAAA,IAEH,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,MACA,CAAC,6BACC,GAAA,CAAA,eAAA,EAAA;AAAA,QACC,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,QACnC,aAAY,EAAA,2BAAA;AAAA,OACd,CAAA;AAAA,KAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/packages/lab/src/metric/Metric.css.js

@@ -1,7 +0,0 @@
-import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".saltMetric {\n  display: flex;\n  align-items: flex-start;\n  padding: 0px;\n  color: var(--saltMetric-color, var(--salt-text-primary-foreground));\n}\n\n.saltMetric-orientation-horizontal {\n  flex-direction: row;\n  gap: var(--metric-horizontal-gap, 16px);\n  margin-top: var(--metric-horizontal-marginTop, 0px);\n}\n\n.saltMetric-orientation-vertical {\n  flex-direction: column;\n  justify-content: center;\n}\n\n.saltMetric-orientation-vertical.saltMetric-align-center {\n  align-items: center;\n}\n.saltMetric-orientation-vertical.saltMetric-align-right {\n  align-items: flex-end;\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=Metric.css.js.map

package/dist-es/packages/lab/src/metric/Metric.css.js.map

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

package/dist-es/packages/lab/src/metric/Metric.js

@@ -1,74 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { makePrefixer, useId } from '@salt-ds/core';
-import { clsx } from 'clsx';
-import { forwardRef, useMemo } from 'react';
-import { MetricContextProvider } from './internal/MetricContext.js';
-import './Metric.css.js';
-
-const withBaseName = makePrefixer("saltMetric");
-const Metric = forwardRef(function Metric2({
-  className,
-  children,
-  direction,
-  showIndicator,
-  align = "left",
-  orientation = "vertical",
-  indicatorPosition = "end",
-  headingAriaLevel = 2,
-  id: idProp,
-  size = "medium",
-  ...restProps
-}, ref) {
-  const id = useId(idProp);
-  const titleId = `metric-title-${id}`;
-  const subtitleId = `metric-subtitle-${id}`;
-  const valueId = `metric-value-${id}`;
-  const value = useMemo(
-    () => ({
-      align,
-      direction,
-      orientation,
-      showIndicator,
-      indicatorPosition,
-      headingAriaLevel,
-      size,
-      titleId,
-      subtitleId,
-      valueId
-    }),
-    [
-      align,
-      direction,
-      orientation,
-      showIndicator,
-      indicatorPosition,
-      headingAriaLevel,
-      size,
-      titleId,
-      subtitleId,
-      valueId
-    ]
-  );
-  return /* @__PURE__ */ jsx(MetricContextProvider, {
-    value,
-    children: /* @__PURE__ */ jsx("div", {
-      ...restProps,
-      className: clsx(
-        withBaseName(),
-        withBaseName(`size-${size}`),
-        {
-          [withBaseName(`direction-${direction}`)]: direction,
-          [withBaseName(`orientation-${orientation}`)]: orientation,
-          [withBaseName(`align-${align}`)]: align
-        },
-        className
-      ),
-      id,
-      ref,
-      children
-    })
-  });
-});
-
-export { Metric };
-//# sourceMappingURL=Metric.js.map

package/dist-es/packages/lab/src/metric/Metric.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Metric.js","sources":["../src/metric/Metric.tsx"],"sourcesContent":["import { makePrefixer, useId } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, useMemo } from \"react\";\nimport { MetricContextProvider, MetricContextValue } from \"./internal\";\n\nimport \"./Metric.css\";\n\nconst withBaseName = makePrefixer(\"saltMetric\");\n\nexport interface MetricProps\n  extends MetricContextValue,\n    HTMLAttributes<HTMLDivElement> {\n  /**\n   * The aria-level attribute to be applied to the heading component. The default is 2.\n   *\n   * As an ADA requirement, the heading component should be the first valid component inside the Metric. It is the title\n   * if <MetricHeader/> is placed before <MerticContent/>. It is the main value if <MerticContent/> is placed before <MetricHeader/>.\n   */\n  headingAriaLevel?: number;\n  /**\n   * This prop is used to help implement the accessibility logic.\n   * If you don't provide this prop. It falls back to a randomly generated id.\n   */\n  id?: string;\n}\n\nexport const Metric = forwardRef<HTMLDivElement, MetricProps>(function Metric(\n  {\n    className,\n    children,\n    direction,\n    showIndicator,\n    align = \"left\",\n    orientation = \"vertical\",\n    indicatorPosition = \"end\",\n    headingAriaLevel = 2,\n    id: idProp,\n    size = \"medium\",\n    ...restProps\n  },\n  ref\n) {\n  const id = useId(idProp);\n  const titleId = `metric-title-${id}`;\n  const subtitleId = `metric-subtitle-${id}`;\n  const valueId = `metric-value-${id}`;\n\n  const value = useMemo(\n    () => ({\n      align,\n      direction,\n      orientation,\n      showIndicator,\n      indicatorPosition,\n      headingAriaLevel,\n      size,\n      titleId,\n      subtitleId,\n      valueId,\n    }),\n    [\n      align,\n      direction,\n      orientation,\n      showIndicator,\n      indicatorPosition,\n      headingAriaLevel,\n      size,\n      titleId,\n      subtitleId,\n      valueId,\n    ]\n  );\n\n  return (\n    <MetricContextProvider value={value}>\n      <div\n        {...restProps}\n        className={clsx(\n          withBaseName(),\n          withBaseName(`size-${size}`),\n          {\n            [withBaseName(`direction-${direction}`)]: direction,\n            [withBaseName(`orientation-${orientation}`)]: orientation,\n            [withBaseName(`align-${align}`)]: align,\n          },\n          className\n        )}\n        id={id}\n        ref={ref}\n      >\n        {children}\n      </div>\n    </MetricContextProvider>\n  );\n});\n"],"names":["Metric"],"mappings":";;;;;;;AAOA,MAAM,YAAA,GAAe,aAAa,YAAY,CAAA,CAAA;AAmBjC,MAAA,MAAA,GAAS,UAAwC,CAAA,SAASA,OACrE,CAAA;AAAA,EACE,SAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,aAAA;AAAA,EACA,KAAQ,GAAA,MAAA;AAAA,EACR,WAAc,GAAA,UAAA;AAAA,EACd,iBAAoB,GAAA,KAAA;AAAA,EACpB,gBAAmB,GAAA,CAAA;AAAA,EACnB,EAAI,EAAA,MAAA;AAAA,EACJ,IAAO,GAAA,QAAA;AAAA,EACJ,GAAA,SAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAM,MAAA,EAAA,GAAK,MAAM,MAAM,CAAA,CAAA;AACvB,EAAA,MAAM,UAAU,CAAgB,aAAA,EAAA,EAAA,CAAA,CAAA,CAAA;AAChC,EAAA,MAAM,aAAa,CAAmB,gBAAA,EAAA,EAAA,CAAA,CAAA,CAAA;AACtC,EAAA,MAAM,UAAU,CAAgB,aAAA,EAAA,EAAA,CAAA,CAAA,CAAA;AAEhC,EAAA,MAAM,KAAQ,GAAA,OAAA;AAAA,IACZ,OAAO;AAAA,MACL,KAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,OAAA;AAAA,KACF,CAAA;AAAA,IACA;AAAA,MACE,KAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,OAAA;AAAA,KACF;AAAA,GACF,CAAA;AAEA,EAAA,uBACG,GAAA,CAAA,qBAAA,EAAA;AAAA,IAAsB,KAAA;AAAA,IACrB,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,YAAA,CAAa,QAAQ,IAAM,CAAA,CAAA,CAAA;AAAA,QAC3B;AAAA,UACE,CAAC,YAAA,CAAa,CAAa,UAAA,EAAA,SAAA,CAAA,CAAW,CAAI,GAAA,SAAA;AAAA,UAC1C,CAAC,YAAA,CAAa,CAAe,YAAA,EAAA,WAAA,CAAA,CAAa,CAAI,GAAA,WAAA;AAAA,UAC9C,CAAC,YAAA,CAAa,CAAS,MAAA,EAAA,KAAA,CAAA,CAAO,CAAI,GAAA,KAAA;AAAA,SACpC;AAAA,QACA,SAAA;AAAA,OACF;AAAA,MACA,EAAA;AAAA,MACA,GAAA;AAAA,MAEC,QAAA;AAAA,KACH,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/packages/lab/src/metric/MetricContent.css.js

@@ -1,7 +0,0 @@
-import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".saltMetricContent {\n  display: flex;\n  flex-direction: column;\n  margin-top: var(--metric-content-marginTop, 0px);\n}\n\n.saltMetricContent-value-container {\n  align-items: baseline;\n  display: flex;\n  flex-direction: row;\n  gap: calc(var(--salt-size-unit) / 2);\n  margin-top: var(--metric-content-valueContainer-marginTop, 0px);\n}\n\n.saltMetric-direction-up .saltMetricContent-indicator {\n  fill: var(--salt-status-positive-foreground);\n}\n.saltMetric-direction-up .saltMetricContent-subvalue {\n  color: var(--salt-status-positive-foreground);\n}\n\n.saltMetric-direction-down .saltMetricContent-indicator {\n  fill: var(--salt-status-negative-foreground);\n}\n.saltMetric-direction-down .saltMetricContent-subvalue {\n  color: var(--salt-status-negative-foreground);\n}\n\n.saltMetricContent-subvalue {\n  margin-top: var(--metric-content-subvalue-marginTop, 0px);\n}\n\n.saltMetric-align-left .saltMetricContent {\n  text-align: left;\n}\n\n.saltMetric-align-center .saltMetricContent {\n  align-items: center;\n  text-align: center;\n}\n\n.saltMetric-align-right .saltMetricContent {\n  align-items: flex-end;\n  text-align: right;\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=MetricContent.css.js.map

package/dist-es/packages/lab/src/metric/MetricContent.css.js.map

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

package/dist-es/packages/lab/src/metric/MetricContent.js

@@ -1,80 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { makePrefixer, Text, Display3, Display2, Display1 } from '@salt-ds/core';
-import { ArrowDownIcon, ArrowUpIcon } from '@salt-ds/icons';
-import { clsx } from 'clsx';
-import { forwardRef } from 'react';
-import { useMetricContext } from './internal/MetricContext.js';
-import './MetricContent.css.js';
-
-const iconComponentMap = {
-  down: ArrowDownIcon,
-  up: ArrowUpIcon
-};
-const withBaseName = makePrefixer("saltMetricContent");
-const MetricContent = forwardRef(
-  function MetricContent2({
-    IndicatorIconProps,
-    IndicatorIconComponent,
-    className,
-    value,
-    subvalue,
-    ...restProps
-  }, ref) {
-    const {
-      direction,
-      showIndicator,
-      indicatorPosition,
-      size = "medium",
-      valueId,
-      titleId,
-      subtitleId
-    } = useMetricContext();
-    const iconSize = size === "large" ? 2 : 1;
-    const valueComponentMap = {
-      small: Display3,
-      medium: Display2,
-      large: Display1
-    };
-    const ValueComponent = valueComponentMap[size];
-    const iconProps = {
-      "aria-label": direction,
-      className: withBaseName("indicator"),
-      name: direction ? `movement-${direction}` : "",
-      size: iconSize,
-      ...IndicatorIconProps
-    };
-    const IconComponent = IndicatorIconComponent != null ? IndicatorIconComponent : direction ? iconComponentMap[direction] : void 0;
-    const icon = showIndicator && IconComponent ? /* @__PURE__ */ jsx(IconComponent, {
-      ...iconProps
-    }) : null;
-    return /* @__PURE__ */ jsxs("div", {
-      ...restProps,
-      className: clsx(withBaseName(), className),
-      "aria-labelledby": `${titleId || ""} ${subtitleId || ""}`,
-      ref,
-      children: [
-        /* @__PURE__ */ jsxs("div", {
-          className: withBaseName("value-container"),
-          children: [
-            indicatorPosition === "start" && icon,
-            /* @__PURE__ */ jsx(ValueComponent, {
-              "data-testid": "metric-value",
-              id: valueId,
-              className: withBaseName("value"),
-              children: value
-            }),
-            indicatorPosition === "end" && icon
-          ]
-        }),
-        subvalue && /* @__PURE__ */ jsx(Text, {
-          className: withBaseName("subvalue"),
-          "data-testid": "metric-subvalue",
-          children: subvalue
-        })
-      ]
-    });
-  }
-);
-
-export { MetricContent };
-//# sourceMappingURL=MetricContent.js.map

package/dist-es/packages/lab/src/metric/MetricContent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"MetricContent.js","sources":["../src/metric/MetricContent.tsx"],"sourcesContent":["import {\n  makePrefixer,\n  Text,\n  Display1,\n  Display2,\n  Display3,\n} from \"@salt-ds/core\";\nimport { ArrowDownIcon, ArrowUpIcon, IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { ComponentType, forwardRef, HTMLAttributes } from \"react\";\nimport { useMetricContext } from \"./internal\";\n\nimport \"./MetricContent.css\";\n\nexport interface MetricContentProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * These props will be passed to the indicator icon. Use this to render a\n   * custom icon.\n   *\n   * @see `Icon` for a list of valid props.\n   */\n  IndicatorIconProps?: Partial<IconProps>;\n  /**\n   * Replace the default Icon component\n   */\n  IndicatorIconComponent?: ComponentType<IconProps>;\n\n  /**\n   * Other data that may serve as additional information to the main value\n   */\n  subvalue?: string | number;\n  /**\n   * The main value to display in the metric\n   */\n  value: string | number;\n}\n\nconst iconComponentMap = {\n  down: ArrowDownIcon,\n  up: ArrowUpIcon,\n};\n\nconst withBaseName = makePrefixer(\"saltMetricContent\");\n\nexport const MetricContent = forwardRef<HTMLDivElement, MetricContentProps>(\n  function MetricContent(\n    {\n      IndicatorIconProps,\n      IndicatorIconComponent,\n      className,\n      value,\n      subvalue,\n      ...restProps\n    },\n    ref\n  ) {\n    const {\n      direction,\n      showIndicator,\n      indicatorPosition,\n      size = \"medium\",\n      valueId,\n      titleId,\n      subtitleId,\n    } = useMetricContext();\n\n    const iconSize = size === \"large\" ? 2 : 1;\n\n    const valueComponentMap = {\n      small: Display3,\n      medium: Display2,\n      large: Display1,\n    };\n    const ValueComponent = valueComponentMap[size];\n\n    const iconProps = {\n      \"aria-label\": direction,\n      className: withBaseName(\"indicator\"),\n      name: direction ? `movement-${direction}` : \"\",\n      size: iconSize,\n      ...IndicatorIconProps,\n    };\n\n    const IconComponent =\n      IndicatorIconComponent ??\n      (direction ? iconComponentMap[direction] : undefined);\n\n    const icon =\n      showIndicator && IconComponent ? <IconComponent {...iconProps} /> : null;\n\n    return (\n      <div\n        {...restProps}\n        className={clsx(withBaseName(), className)}\n        aria-labelledby={`${titleId || \"\"} ${subtitleId || \"\"}`}\n        ref={ref}\n      >\n        <div className={withBaseName(\"value-container\")}>\n          {indicatorPosition === \"start\" && icon}\n          <ValueComponent\n            data-testid=\"metric-value\"\n            id={valueId}\n            className={withBaseName(\"value\")}\n          >\n            {value}\n          </ValueComponent>\n          {indicatorPosition === \"end\" && icon}\n        </div>\n        {subvalue && (\n          <Text\n            className={withBaseName(\"subvalue\")}\n            data-testid=\"metric-subvalue\"\n          >\n            {subvalue}\n          </Text>\n        )}\n      </div>\n    );\n  }\n);\n"],"names":["MetricContent"],"mappings":";;;;;;;;AAqCA,MAAM,gBAAmB,GAAA;AAAA,EACvB,IAAM,EAAA,aAAA;AAAA,EACN,EAAI,EAAA,WAAA;AACN,CAAA,CAAA;AAEA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA,CAAA;AAE9C,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cACP,CAAA;AAAA,IACE,kBAAA;AAAA,IACA,sBAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACG,GAAA,SAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,IAAO,GAAA,QAAA;AAAA,MACP,OAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,QACE,gBAAiB,EAAA,CAAA;AAErB,IAAM,MAAA,QAAA,GAAW,IAAS,KAAA,OAAA,GAAU,CAAI,GAAA,CAAA,CAAA;AAExC,IAAA,MAAM,iBAAoB,GAAA;AAAA,MACxB,KAAO,EAAA,QAAA;AAAA,MACP,MAAQ,EAAA,QAAA;AAAA,MACR,KAAO,EAAA,QAAA;AAAA,KACT,CAAA;AACA,IAAA,MAAM,iBAAiB,iBAAkB,CAAA,IAAA,CAAA,CAAA;AAEzC,IAAA,MAAM,SAAY,GAAA;AAAA,MAChB,YAAc,EAAA,SAAA;AAAA,MACd,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,MACnC,IAAA,EAAM,SAAY,GAAA,CAAA,SAAA,EAAY,SAAc,CAAA,CAAA,GAAA,EAAA;AAAA,MAC5C,IAAM,EAAA,QAAA;AAAA,MACN,GAAG,kBAAA;AAAA,KACL,CAAA;AAEA,IAAA,MAAM,aACJ,GAAA,sBAAA,IAAA,IAAA,GAAA,sBAAA,GACC,SAAY,GAAA,gBAAA,CAAiB,SAAa,CAAA,GAAA,KAAA,CAAA,CAAA;AAE7C,IAAM,MAAA,IAAA,GACJ,aAAiB,IAAA,aAAA,mBAAiB,GAAA,CAAA,aAAA,EAAA;AAAA,MAAe,GAAG,SAAA;AAAA,KAAW,CAAK,GAAA,IAAA,CAAA;AAEtE,IAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,iBAAiB,EAAA,CAAA,EAAG,OAAW,IAAA,EAAA,CAAA,CAAA,EAAM,UAAc,IAAA,EAAA,CAAA,CAAA;AAAA,MACnD,GAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAC,IAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,iBAAiB,CAAA;AAAA,UAC3C,QAAA,EAAA;AAAA,YAAA,iBAAA,KAAsB,OAAW,IAAA,IAAA;AAAA,4BACjC,GAAA,CAAA,cAAA,EAAA;AAAA,cACC,aAAY,EAAA,cAAA;AAAA,cACZ,EAAI,EAAA,OAAA;AAAA,cACJ,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,cAE9B,QAAA,EAAA,KAAA;AAAA,aACH,CAAA;AAAA,YACC,sBAAsB,KAAS,IAAA,IAAA;AAAA,WAAA;AAAA,SAClC,CAAA;AAAA,QACC,4BACE,GAAA,CAAA,IAAA,EAAA;AAAA,UACC,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,UAClC,aAAY,EAAA,iBAAA;AAAA,UAEX,QAAA,EAAA,QAAA;AAAA,SACH,CAAA;AAAA,OAAA;AAAA,KAEJ,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/packages/lab/src/metric/MetricHeader.css.js

@@ -1,7 +0,0 @@
-import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".saltMetricHeader {\n  --metric-title-color: var(--salt-text-primary-foreground);\n  --metric-subtitle-color: var(--salt-text-secondary-foreground);\n}\n\n.saltMetricHeader {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: calc(var(--salt-size-unit) * 0.25);\n}\n\n.saltMetric-orientation-horizontal.saltMetric-size-small .saltMetricHeader {\n  padding-top: 4px;\n}\n.saltMetric-orientation-horizontal.saltMetric-size-medium .saltMetricHeader {\n  padding-top: 8px;\n}\n.saltMetric-orientation-horizontal.saltMetric-size-large .saltMetricHeader {\n  padding-top: 14px;\n}\n\n.saltMetricHeader-title {\n  color: var(--metric-title-color);\n}\n\n.saltMetricHeader-subtitle {\n  color: var(--metric-subtitle-color);\n  font-weight: var(--salt-text-fontWeight);\n}\n\n.saltMetric-align-center .saltMetricHeader {\n  align-items: center;\n}\n\n.saltMetric-align-right .saltMetricHeader {\n  align-items: flex-end;\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=MetricHeader.css.js.map

package/dist-es/packages/lab/src/metric/MetricHeader.css.js.map

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

package/dist-es/packages/lab/src/metric/MetricHeader.js

@@ -1,52 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { makePrefixer, Text, Link } from '@salt-ds/core';
-import { clsx } from 'clsx';
-import { forwardRef, useCallback } from 'react';
-import { useMetricContext } from './internal/MetricContext.js';
-import './MetricHeader.css.js';
-
-const withBaseName = makePrefixer("saltMetricHeader");
-const MetricHeader = forwardRef(
-  function MetricHeader2({ SubtitleLinkProps, className, title, subtitle, ...restProps }, ref) {
-    const { titleId, subtitleId, headingAriaLevel } = useMetricContext();
-    const renderSubtitle = useCallback(() => {
-      if (!subtitle)
-        return null;
-      const subtitleComponent = /* @__PURE__ */ jsx(Text, {
-        id: subtitleId,
-        className: withBaseName("subtitle"),
-        "data-testid": "metric-subtitle",
-        children: subtitle
-      });
-      if (SubtitleLinkProps) {
-        const { href = "", ...restLinkProps } = SubtitleLinkProps;
-        return /* @__PURE__ */ jsx(Link, {
-          href,
-          ...restLinkProps,
-          children: subtitleComponent
-        });
-      }
-      return subtitleComponent;
-    }, [subtitle, subtitleId, SubtitleLinkProps]);
-    return /* @__PURE__ */ jsxs("div", {
-      ...restProps,
-      className: clsx(withBaseName(), className),
-      ref,
-      children: [
-        /* @__PURE__ */ jsx(Text, {
-          styleAs: "h4",
-          className: withBaseName("title"),
-          "data-testid": "metric-title",
-          id: titleId,
-          role: "heading",
-          "aria-level": headingAriaLevel,
-          children: title
-        }),
-        renderSubtitle()
-      ]
-    });
-  }
-);
-
-export { MetricHeader };
-//# sourceMappingURL=MetricHeader.js.map

package/dist-es/packages/lab/src/metric/MetricHeader.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"MetricHeader.js","sources":["../src/metric/MetricHeader.tsx"],"sourcesContent":["import { LinkProps, Link, makePrefixer, Text } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, useCallback } from \"react\";\nimport { useMetricContext } from \"./internal\";\nimport \"./MetricHeader.css\";\n\nexport interface MetricHeaderProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * If provided, subtitle will be rendered as a `Link` element with these props.\n   *\n   * @see `Link` for a list of valid props.\n   */\n  SubtitleLinkProps?: Omit<Partial<LinkProps>, \"children\">;\n  /**\n   * Subtitle of the Metric Header\n   */\n  subtitle?: string;\n  /**\n   * Title of the Metric Header\n   */\n  title: string;\n}\n\nconst withBaseName = makePrefixer(\"saltMetricHeader\");\n\nexport const MetricHeader = forwardRef<HTMLDivElement, MetricHeaderProps>(\n  function MetricHeader(\n    { SubtitleLinkProps, className, title, subtitle, ...restProps },\n    ref\n  ) {\n    const { titleId, subtitleId, headingAriaLevel } = useMetricContext();\n\n    const renderSubtitle = useCallback(() => {\n      if (!subtitle) return null;\n\n      const subtitleComponent = (\n        <Text\n          id={subtitleId}\n          className={withBaseName(\"subtitle\")}\n          data-testid=\"metric-subtitle\"\n        >\n          {subtitle}\n        </Text>\n      );\n\n      if (SubtitleLinkProps) {\n        const { href = \"\", ...restLinkProps } = SubtitleLinkProps;\n\n        return (\n          <Link href={href} {...restLinkProps}>\n            {subtitleComponent}\n          </Link>\n        );\n      }\n\n      return subtitleComponent;\n    }, [subtitle, subtitleId, SubtitleLinkProps]);\n\n    return (\n      <div {...restProps} className={clsx(withBaseName(), className)} ref={ref}>\n        <Text\n          styleAs=\"h4\"\n          className={withBaseName(\"title\")}\n          data-testid=\"metric-title\"\n          id={titleId}\n          role=\"heading\"\n          aria-level={headingAriaLevel}\n        >\n          {title}\n        </Text>\n        {renderSubtitle()}\n      </div>\n    );\n  }\n);\n"],"names":["MetricHeader"],"mappings":";;;;;;;AAuBA,MAAM,YAAA,GAAe,aAAa,kBAAkB,CAAA,CAAA;AAE7C,MAAM,YAAe,GAAA,UAAA;AAAA,EAC1B,SAASA,cACP,EAAE,iBAAA,EAAmB,WAAW,KAAO,EAAA,QAAA,EAAA,GAAa,SAAU,EAAA,EAC9D,GACA,EAAA;AACA,IAAA,MAAM,EAAE,OAAA,EAAS,UAAY,EAAA,gBAAA,KAAqB,gBAAiB,EAAA,CAAA;AAEnE,IAAM,MAAA,cAAA,GAAiB,YAAY,MAAM;AACvC,MAAA,IAAI,CAAC,QAAA;AAAU,QAAO,OAAA,IAAA,CAAA;AAEtB,MAAA,MAAM,oCACH,GAAA,CAAA,IAAA,EAAA;AAAA,QACC,EAAI,EAAA,UAAA;AAAA,QACJ,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,QAClC,aAAY,EAAA,iBAAA;AAAA,QAEX,QAAA,EAAA,QAAA;AAAA,OACH,CAAA,CAAA;AAGF,MAAA,IAAI,iBAAmB,EAAA;AACrB,QAAA,MAAM,EAAE,IAAA,GAAO,EAAO,EAAA,GAAA,aAAA,EAAkB,GAAA,iBAAA,CAAA;AAExC,QAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,UAAK,IAAA;AAAA,UAAa,GAAG,aAAA;AAAA,UACnB,QAAA,EAAA,iBAAA;AAAA,SACH,CAAA,CAAA;AAAA,OAEJ;AAEA,MAAO,OAAA,iBAAA,CAAA;AAAA,KACN,EAAA,CAAC,QAAU,EAAA,UAAA,EAAY,iBAAiB,CAAC,CAAA,CAAA;AAE5C,IAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,MAAK,GAAG,SAAA;AAAA,MAAW,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAG,GAAA;AAAA,MAC9D,QAAA,EAAA;AAAA,wBAAC,GAAA,CAAA,IAAA,EAAA;AAAA,UACC,OAAQ,EAAA,IAAA;AAAA,UACR,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,UAC/B,aAAY,EAAA,cAAA;AAAA,UACZ,EAAI,EAAA,OAAA;AAAA,UACJ,IAAK,EAAA,SAAA;AAAA,UACL,YAAY,EAAA,gBAAA;AAAA,UAEX,QAAA,EAAA,KAAA;AAAA,SACH,CAAA;AAAA,QACC,cAAe,EAAA;AAAA,OAAA;AAAA,KAClB,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/packages/lab/src/metric/internal/MetricContext.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"MetricContext.js","sources":["../src/metric/internal/MetricContext.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\n\nexport interface MetricContextValue {\n  /**\n   * Text and value alignment.\n   */\n  align?: \"left\" | \"center\" | \"right\";\n  /**\n   * The direction of the main value\n   */\n  direction?: \"up\" | \"down\";\n  /**\n   * The position of the indicator with regards to the main value.\n   */\n  indicatorPosition?: \"start\" | \"end\";\n  /**\n   * The metric orientation (layout flow direction).\n   */\n  orientation?: \"horizontal\" | \"vertical\";\n  /**\n   * If 'true', an indicator will be displayed which shows the direction of the main value\n   */\n  showIndicator?: boolean;\n  /**\n   * Set title's heading level. Defaults to 2\n   */\n  headingAriaLevel?: number;\n  /**\n   * Size of the metric value. Defaults to 'medium'\n   */\n  size?: \"small\" | \"medium\" | \"large\";\n}\n\nexport interface MetricContextComponentIds {\n  /**\n   * id of the subtitle\n   */\n  subtitleId?: string;\n  /**\n   * id of the title\n   */\n  titleId?: string;\n  /**\n   * id of the value\n   */\n  valueId?: string;\n}\n\nconst MetricContext = createContext<\n  MetricContextValue & MetricContextComponentIds\n>({});\n\nexport const { Provider: MetricContextProvider } = MetricContext;\nexport const useMetricContext = (): MetricContextValue &\n  MetricContextComponentIds => useContext(MetricContext);\n"],"names":[],"mappings":";;AAgDA,MAAM,aAAA,GAAgB,aAEpB,CAAA,EAAE,CAAA,CAAA;AAES,MAAA,EAAE,QAAU,EAAA,qBAAA,EAA0B,GAAA,cAAA;AACtC,MAAA,gBAAA,GAAmB,MACD,UAAA,CAAW,aAAa;;;;"}

package/dist-es/packages/lab/src/overlay/Overlay.css.js

@@ -1,7 +0,0 @@
-import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = "/* Experimental - Overlay css variable API */\n.saltOverlay {\n  --overlay-text-color: var(--salt-text-primary-foreground);\n  --overlay-spacing: var(--salt-size-unit);\n  --overlay-fontSize: var(--salt-text-fontSize);\n  --overlay-background: var(--salt-container-primary-background);\n  --overlay-borderColor: var(--salt-container-primary-borderColor);\n  /* TODO: z-index audit, provide z index here or rely on popper */\n  --overlay-zindex: var(--salt-zIndex-flyover);\n}\n\n.saltOverlay-secondary.saltOverlay {\n  --overlay-background: var(--salt-container-secondary-background);\n  --overlay-borderColor: var(--salt-container-secondary-borderColor);\n}\n\n.saltOverlay-content {\n  display: flex;\n  padding: calc(var(--overlay-spacing) * 2);\n  font-size: var(--overlay-fontSize);\n\n  border: 1px solid var(--overlay-borderColor);\n  box-shadow: var(--salt-overlayable-shadow-popout);\n  line-height: var(--salt-text-lineHeight);\n  background: var(--overlay-background);\n  color: var(--overlay-text-color);\n  position: relative;\n  opacity: 1;\n  overflow: visible;\n  z-index: var(--overlay-zindex);\n}\n\n.saltOverlay-arrow,\n.saltOverlay-arrow::after {\n  border: 8px solid transparent;\n  position: absolute;\n}\n\n.saltOverlay-arrow::after {\n  content: \"\";\n}\n\n.saltOverlay[data-placement^=\"top\"] .saltOverlay-arrow {\n  border-top-color: var(--overlay-borderColor);\n  bottom: -17px;\n}\n\n.saltOverlay[data-placement^=\"bottom\"] .saltOverlay-arrow {\n  border-bottom-color: var(--overlay-borderColor);\n  top: -17px;\n}\n\n.saltOverlay[data-placement^=\"left\"] .saltOverlay-arrow {\n  border-left-color: var(--overlay-borderColor);\n  right: -17px;\n}\n\n.saltOverlay[data-placement^=\"right\"] .saltOverlay-arrow {\n  border-right-color: var(--overlay-borderColor);\n  left: -17px;\n}\n\n.saltOverlay[data-placement^=\"top\"] .saltOverlay-arrow::after {\n  border-top-color: var(--overlay-background);\n  bottom: -7px;\n  left: calc(100% - 8px);\n}\n\n.saltOverlay[data-placement^=\"bottom\"] .saltOverlay-arrow::after {\n  border-bottom-color: var(--overlay-background);\n  top: -7px;\n  left: calc(100% - 8px);\n}\n\n.saltOverlay[data-placement^=\"left\"] .saltOverlay-arrow::after {\n  border-left-color: var(--overlay-background);\n  right: -7px;\n  top: calc(100% - 8px);\n}\n\n.saltOverlay[data-placement^=\"right\"] .saltOverlay-arrow::after {\n  border-right-color: var(--overlay-background);\n  left: -7px;\n  top: calc(100% - 8px);\n}\n\n/* Close Button */\n.saltOverlay-close {\n  position: absolute;\n  right: 0;\n  top: 0;\n  z-index: var(--salt-zIndex-default);\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=Overlay.css.js.map

package/dist-es/packages/lab/src/overlay/Overlay.css.js.map

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