@salt-ds/lab 1.0.0-alpha.2 → 1.0.0-alpha.21

package/dist-es/packages/lab/src/pagination/GoToInput.js

@@ -1,95 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { clsx } from 'clsx';
-import { forwardRef, useRef, useState, useCallback, useEffect } from 'react';
-import { useId, useForkRef, useIsomorphicLayoutEffect } from '@salt-ds/core';
-import { usePaginationContext } from './usePaginationContext.js';
-import { withBaseName } from './utils.js';
-import { FormField } from '../form-field/FormField.js';
-import '../form-field/FormLabel.js';
-import { Input } from '../input/Input.js';
-import '../input/StaticInputAdornment.js';
-
-const GoToInput = forwardRef(
-  ({
-    className,
-    id: idProp,
-    label = "Go to",
-    FormFieldProps: { ...restFormFieldProps } = {},
-    ...restProps
-  }, forwardedRef) => {
-    const { compact, count, onPageChange, paginatorElement } = usePaginationContext();
-    const id = useId(idProp);
-    const rootRef = useRef(null);
-    const forkedRef = useForkRef(rootRef, forwardedRef);
-    const [inputValue, setInputValue] = useState("");
-    const onChange = useCallback(
-      (event) => {
-        setInputValue(event.target.value);
-      },
-      [setInputValue]
-    );
-    const onKeyDown = (event) => {
-      if (event.key === "Enter") {
-        const pageValue = Number(inputValue);
-        if (!inputValue.startsWith("0") && !isNaN(pageValue) && pageValue > 0 && pageValue <= count) {
-          onPageChange(pageValue);
-        }
-        setInputValue("");
-      }
-    };
-    const onBlur = useCallback(() => {
-      setInputValue("");
-    }, [setInputValue]);
-    useEffect(() => {
-      if (compact) {
-        setInputValue("");
-      }
-    }, [compact]);
-    const [position, setPosition] = useState();
-    useIsomorphicLayoutEffect(() => {
-      if (paginatorElement && !compact && rootRef.current) {
-        setPosition(
-          rootRef.current.compareDocumentPosition(paginatorElement) === Node.DOCUMENT_POSITION_PRECEDING ? "right" : "left"
-        );
-      }
-    }, [paginatorElement, compact, rootRef.current]);
-    if (compact) {
-      return null;
-    }
-    const widthCh = `${`${count}`.length}ch`;
-    return /* @__PURE__ */ jsx("span", {
-      className: clsx(
-        withBaseName("goToInputWrapper"),
-        { [withBaseName(`${position}GoToInput`)]: position },
-        className
-      ),
-      ref: forkedRef,
-      children: /* @__PURE__ */ jsx(FormField, {
-        className: withBaseName("goToInputField"),
-        fullWidth: false,
-        label,
-        labelPlacement: "left",
-        ...restFormFieldProps,
-        children: /* @__PURE__ */ jsx(Input, {
-          className: clsx(withBaseName("goToInput"), {
-            [withBaseName("goToInputFixed")]: count < 100
-          }),
-          id,
-          inputProps: {
-            "aria-labelledby": id,
-            "aria-label": `Page, ${count} total`,
-            style: { width: widthCh }
-          },
-          onBlur,
-          onChange,
-          onKeyDown,
-          value: inputValue,
-          textAlign: "center"
-        })
-      })
-    });
-  }
-);
-
-export { GoToInput };
-//# sourceMappingURL=GoToInput.js.map

package/dist-es/packages/lab/src/pagination/GoToInput.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"GoToInput.js","sources":["../src/pagination/GoToInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEventHandler,\n  forwardRef,\n  HTMLAttributes,\n  KeyboardEventHandler,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useForkRef, useId, useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport { usePaginationContext } from \"./usePaginationContext\";\nimport { withBaseName } from \"./utils\";\nimport { FormField, FormFieldProps } from \"../form-field\";\nimport { Input } from \"../input\";\n\nexport interface GoToInputProps extends HTMLAttributes<HTMLSpanElement> {\n  label?: string;\n  FormFieldProps?: Partial<FormFieldProps>;\n}\n\nexport const GoToInput = forwardRef<HTMLSpanElement, GoToInputProps>(\n  (\n    {\n      className,\n      id: idProp,\n      label = \"Go to\",\n      FormFieldProps: { ...restFormFieldProps } = {},\n      ...restProps\n    },\n\n    forwardedRef\n  ) => {\n    const { compact, count, onPageChange, paginatorElement } =\n      usePaginationContext();\n\n    const id = useId(idProp);\n\n    const rootRef = useRef<HTMLSpanElement>(null);\n    const forkedRef = useForkRef(rootRef, forwardedRef);\n\n    const [inputValue, setInputValue] = useState(\"\");\n\n    const onChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n      (event) => {\n        setInputValue(event.target.value);\n      },\n      [setInputValue]\n    );\n\n    const onKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n      if (event.key === \"Enter\") {\n        const pageValue = Number(inputValue);\n        if (\n          !inputValue.startsWith(\"0\") &&\n          !isNaN(pageValue) &&\n          pageValue > 0 &&\n          pageValue <= count\n        ) {\n          onPageChange(pageValue);\n        }\n        setInputValue(\"\");\n      }\n    };\n\n    const onBlur = useCallback(() => {\n      setInputValue(\"\");\n    }, [setInputValue]);\n\n    useEffect(() => {\n      if (compact) {\n        setInputValue(\"\");\n      }\n    }, [compact]);\n\n    const [position, setPosition] = useState<\"left\" | \"right\">();\n\n    useIsomorphicLayoutEffect(() => {\n      if (paginatorElement && !compact && rootRef.current) {\n        setPosition(\n          rootRef.current.compareDocumentPosition(paginatorElement) ===\n            Node.DOCUMENT_POSITION_PRECEDING\n            ? \"right\"\n            : \"left\"\n        );\n      }\n    }, [paginatorElement, compact, rootRef.current]);\n\n    if (compact) {\n      return null;\n    }\n\n    const widthCh = `${`${count}`.length}ch`;\n\n    return (\n      <span\n        className={clsx(\n          withBaseName(\"goToInputWrapper\"),\n          { [withBaseName(`${position!}GoToInput`)]: position },\n          className\n        )}\n        ref={forkedRef}\n      >\n        <FormField\n          className={withBaseName(\"goToInputField\")}\n          fullWidth={false}\n          label={label}\n          labelPlacement=\"left\"\n          {...restFormFieldProps}\n        >\n          <Input\n            className={clsx(withBaseName(\"goToInput\"), {\n              [withBaseName(\"goToInputFixed\")]: count < 100,\n            })}\n            id={id}\n            inputProps={{\n              \"aria-labelledby\": id,\n              \"aria-label\": `Page, ${count} total`,\n              style: { width: widthCh },\n            }}\n            onBlur={onBlur}\n            onChange={onChange}\n            onKeyDown={onKeyDown}\n            value={inputValue}\n            textAlign={\"center\"}\n          />\n        </FormField>\n      </span>\n    );\n  }\n);\n"],"names":[],"mappings":"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"}

package/dist-es/packages/lab/src/pagination/Pagination.css.js

@@ -1,7 +0,0 @@
-import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".salt-density-medium {\n  --pagination-button-size: 28px;\n  --pagination-fontSize: 12px;\n}\n\n.salt-density-high {\n  --pagination-button-size: 20px;\n  --pagination-fontSize: 11px;\n}\n\n.salt-density-low {\n  --pagination-button-size: 36px;\n  --pagination-fontSize: 14px;\n}\n\n.salt-density-touch {\n  --pagination-button-size: 44px;\n  --pagination-fontSize: 16px;\n}\n\n.saltPagination {\n  display: flex;\n  flex-direction: row;\n}\n\n.saltPagination-arrowButton {\n  width: var(--pagination-button-size);\n  height: var(--pagination-button-size);\n}\n\n.saltPagination-previousButton {\n  margin-right: var(--salt-size-unit);\n}\n\n.saltPagination-nextButton {\n  margin-left: var(--salt-size-unit);\n}\n\n.saltPagination-pageButton {\n  min-width: var(--pagination-button-size);\n  height: var(--pagination-button-size);\n  --saltButton-fontWeight: var(--salt-text-fontWeight);\n}\n\n.saltPagination-pageButtonSelected {\n  background: var(--salt-selectable-background-selected);\n  color: var(--salt-selectable-cta-foreground-selected);\n}\n\n.saltPagination-pageButtonFixed {\n  padding: 0;\n}\n\n.saltPagination-ellipsis {\n  width: var(--pagination-button-size);\n  height: var(--pagination-button-size);\n  text-align: center;\n}\n\n.saltPagination-accessibleText {\n  display: block;\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  top: 0;\n  left: 0;\n  opacity: 0;\n}\n\n.saltPagination-compactInputField {\n}\n\n.saltPagination-compactInput {\n  height: var(--pagination-button-size);\n  min-width: unset;\n}\n\n.saltPagination-compactInputFixed {\n  min-width: var(--pagination-button-size);\n  width: var(--pagination-button-size);\n}\n\n.saltPagination-compactSeparator {\n  height: var(--pagination-button-size);\n  width: var(--pagination-button-size);\n  text-align: center;\n  font-size: var(--pagination-fontSize);\n  line-height: var(--pagination-button-size);\n}\n\n.saltPagination-goToInputWrapper {\n}\n\n.saltPagination-leftGoToInput {\n  margin-right: var(--salt-size-unit);\n}\n\n.saltPagination-rightGoToInput {\n  margin-left: var(--salt-size-unit);\n  min-width: unset;\n}\n\n.saltPagination-goToInputField {\n}\n\n.saltPagination-goToInput {\n  height: var(--pagination-button-size);\n  min-width: unset;\n}\n\n.saltPagination-goToInputFixed {\n  min-width: var(--pagination-button-size);\n  width: var(--pagination-button-size);\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=Pagination.css.js.map

package/dist-es/packages/lab/src/pagination/Pagination.css.js.map

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

package/dist-es/packages/lab/src/pagination/Paginator.js

@@ -1,67 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useForkRef } from '@salt-ds/core';
-import { ChevronLeftIcon, ChevronRightIcon } from '@salt-ds/icons';
-import { clsx } from 'clsx';
-import { forwardRef, useCallback } from 'react';
-import { ArrowButton } from './ArrowButton.js';
-import { CompactControls } from './CompactControls.js';
-import { RegularControls } from './RegularControls.js';
-import { usePaginationContext } from './usePaginationContext.js';
-import { withBaseName } from './utils.js';
-import './Pagination.css.js';
-
-const Paginator = forwardRef(
-  ({
-    className,
-    boundaryCount,
-    siblingCount,
-    showPreviousNext = true,
-    FormFieldProps: FormFieldProps2,
-    ...restProps
-  }, forwardedRef) => {
-    const { count, page, onPageChange, compact, setPaginatorElement } = usePaginationContext();
-    const ref = useForkRef(setPaginatorElement, forwardedRef);
-    const onPreviousPage = useCallback(() => {
-      onPageChange(Math.max(1, page - 1));
-    }, [page, onPageChange]);
-    const onNextPage = useCallback(() => {
-      onPageChange(Math.min(page + 1, count));
-    }, [page, onPageChange, count]);
-    const isOnFirstPage = page === 1;
-    const isOnLastPage = page === count;
-    return /* @__PURE__ */ jsxs("div", {
-      className: clsx(withBaseName(), className),
-      ...restProps,
-      ref,
-      children: [
-        showPreviousNext && /* @__PURE__ */ jsx(ArrowButton, {
-          arrowButtonType: "previous",
-          onPress: onPreviousPage,
-          disabled: isOnFirstPage,
-          children: /* @__PURE__ */ jsx(ChevronLeftIcon, {})
-        }),
-        compact ? /* @__PURE__ */ jsx(CompactControls, {
-          count,
-          page,
-          onPageChange,
-          FormFieldProps: FormFieldProps2
-        }) : /* @__PURE__ */ jsx(RegularControls, {
-          count,
-          page,
-          onPageChange,
-          siblingCount,
-          boundaryCount
-        }),
-        showPreviousNext && /* @__PURE__ */ jsx(ArrowButton, {
-          arrowButtonType: "next",
-          onPress: onNextPage,
-          disabled: isOnLastPage,
-          children: /* @__PURE__ */ jsx(ChevronRightIcon, {})
-        })
-      ]
-    });
-  }
-);
-
-export { Paginator };
-//# sourceMappingURL=Paginator.js.map

package/dist-es/packages/lab/src/pagination/Paginator.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Paginator.js","sources":["../src/pagination/Paginator.tsx"],"sourcesContent":["import { useForkRef } from \"@salt-ds/core\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, useCallback } from \"react\";\nimport { ArrowButton } from \"./ArrowButton\";\nimport { CompactControls } from \"./CompactControls\";\nimport { RegularControls } from \"./RegularControls\";\nimport { usePaginationContext } from \"./usePaginationContext\";\nimport { withBaseName } from \"./utils\";\nimport { FormFieldProps } from \"../form-field\";\n\nimport \"./Pagination.css\";\n\nexport interface PaginatorProps extends HTMLAttributes<HTMLDivElement> {\n  boundaryCount?: number;\n  siblingCount?: number;\n  showPreviousNext?: boolean;\n  FormFieldProps?: Partial<FormFieldProps>;\n}\n\nexport const Paginator = forwardRef<HTMLDivElement, PaginatorProps>(\n  (\n    {\n      className,\n      boundaryCount,\n      siblingCount,\n      showPreviousNext = true,\n      FormFieldProps,\n      ...restProps\n    },\n    forwardedRef\n  ) => {\n    const { count, page, onPageChange, compact, setPaginatorElement } =\n      usePaginationContext();\n\n    const ref = useForkRef(setPaginatorElement, forwardedRef);\n\n    const onPreviousPage = useCallback(() => {\n      onPageChange(Math.max(1, page - 1));\n    }, [page, onPageChange]);\n\n    const onNextPage = useCallback(() => {\n      onPageChange(Math.min(page + 1, count));\n    }, [page, onPageChange, count]);\n\n    const isOnFirstPage = page === 1;\n    const isOnLastPage = page === count;\n\n    return (\n      <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n        {showPreviousNext && (\n          <ArrowButton\n            arrowButtonType=\"previous\"\n            onPress={onPreviousPage}\n            disabled={isOnFirstPage}\n          >\n            <ChevronLeftIcon />\n          </ArrowButton>\n        )}\n        {compact ? (\n          <CompactControls\n            count={count}\n            page={page}\n            onPageChange={onPageChange}\n            FormFieldProps={FormFieldProps}\n          />\n        ) : (\n          <RegularControls\n            count={count}\n            page={page}\n            onPageChange={onPageChange}\n            siblingCount={siblingCount}\n            boundaryCount={boundaryCount}\n          />\n        )}\n        {showPreviousNext && (\n          <ArrowButton\n            arrowButtonType=\"next\"\n            onPress={onNextPage}\n            disabled={isOnLastPage}\n          >\n            <ChevronRightIcon />\n          </ArrowButton>\n        )}\n      </div>\n    );\n  }\n);\n"],"names":["FormFieldProps"],"mappings":";;;;;;;;;;;;AAoBO,MAAM,SAAY,GAAA,UAAA;AAAA,EACvB,CACE;AAAA,IACE,SAAA;AAAA,IACA,aAAA;AAAA,IACA,YAAA;AAAA,IACA,gBAAmB,GAAA,IAAA;AAAA,IACnB,cAAAA,EAAAA,eAAAA;AAAA,IACG,GAAA,SAAA;AAAA,KAEL,YACG,KAAA;AACH,IAAA,MAAM,EAAE,KAAO,EAAA,IAAA,EAAM,cAAc,OAAS,EAAA,mBAAA,KAC1C,oBAAqB,EAAA,CAAA;AAEvB,IAAM,MAAA,GAAA,GAAM,UAAW,CAAA,mBAAA,EAAqB,YAAY,CAAA,CAAA;AAExD,IAAM,MAAA,cAAA,GAAiB,YAAY,MAAM;AACvC,MAAA,YAAA,CAAa,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,GAAO,CAAC,CAAC,CAAA,CAAA;AAAA,KACjC,EAAA,CAAC,IAAM,EAAA,YAAY,CAAC,CAAA,CAAA;AAEvB,IAAM,MAAA,UAAA,GAAa,YAAY,MAAM;AACnC,MAAA,YAAA,CAAa,IAAK,CAAA,GAAA,CAAI,IAAO,GAAA,CAAA,EAAG,KAAK,CAAC,CAAA,CAAA;AAAA,KACrC,EAAA,CAAC,IAAM,EAAA,YAAA,EAAc,KAAK,CAAC,CAAA,CAAA;AAE9B,IAAA,MAAM,gBAAgB,IAAS,KAAA,CAAA,CAAA;AAC/B,IAAA,MAAM,eAAe,IAAS,KAAA,KAAA,CAAA;AAE9B,IAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAI,GAAG,SAAA;AAAA,MAAW,GAAA;AAAA,MAC7D,QAAA,EAAA;AAAA,QAAA,gBAAA,oBACE,GAAA,CAAA,WAAA,EAAA;AAAA,UACC,eAAgB,EAAA,UAAA;AAAA,UAChB,OAAS,EAAA,cAAA;AAAA,UACT,QAAU,EAAA,aAAA;AAAA,UAEV,8BAAC,eAAgB,EAAA,EAAA,CAAA;AAAA,SACnB,CAAA;AAAA,QAED,0BACE,GAAA,CAAA,eAAA,EAAA;AAAA,UACC,KAAA;AAAA,UACA,IAAA;AAAA,UACA,YAAA;AAAA,UACA,cAAgBA,EAAAA,eAAAA;AAAA,SAClB,oBAEC,GAAA,CAAA,eAAA,EAAA;AAAA,UACC,KAAA;AAAA,UACA,IAAA;AAAA,UACA,YAAA;AAAA,UACA,YAAA;AAAA,UACA,aAAA;AAAA,SACF,CAAA;AAAA,QAED,oCACE,GAAA,CAAA,WAAA,EAAA;AAAA,UACC,eAAgB,EAAA,MAAA;AAAA,UAChB,OAAS,EAAA,UAAA;AAAA,UACT,QAAU,EAAA,YAAA;AAAA,UAEV,8BAAC,gBAAiB,EAAA,EAAA,CAAA;AAAA,SACpB,CAAA;AAAA,OAAA;AAAA,KAEJ,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/packages/lab/src/parent-child-item/ParentChildItem.css.js

@@ -1,7 +0,0 @@
-import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".saltParentChildItem-slide-top {\n  animation: var(--salt-animation-slide-in-top);\n}\n.saltParentChildItem-slide-bottom {\n  animation: var(--salt-animation-slide-in-bottom);\n}\n.saltParentChildItem-slide-left {\n  animation: var(--salt-animation-slide-in-left);\n}\n.saltParentChildItem-slide-right {\n  animation: var(--salt-animation-slide-in-right);\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=ParentChildItem.css.js.map

package/dist-es/packages/lab/src/parent-child-item/ParentChildItem.css.js.map

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

package/dist-es/packages/lab/src/parent-child-item/ParentChildItem.js

@@ -1,32 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { clsx } from 'clsx';
-import { makePrefixer, FlexItem } from '@salt-ds/core';
-import './ParentChildItem.css.js';
-
-const withBaseName = makePrefixer("saltParentChildItem");
-const ParentChildItem = forwardRef(
-  function ParentChildItem2({
-    disableAnimations = false,
-    direction,
-    isStacked,
-    children,
-    className,
-    ...rest
-  }, ref) {
-    return /* @__PURE__ */ jsx(FlexItem, {
-      className: clsx(className, withBaseName(), {
-        ...direction && {
-          [withBaseName(`slide-${direction}`)]: !disableAnimations
-        },
-        "saltFlexItem-stacked": isStacked
-      }),
-      ref,
-      ...rest,
-      children
-    });
-  }
-);
-
-export { ParentChildItem };
-//# sourceMappingURL=ParentChildItem.js.map

package/dist-es/packages/lab/src/parent-child-item/ParentChildItem.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ParentChildItem.js","sources":["../src/parent-child-item/ParentChildItem.tsx"],"sourcesContent":["import { forwardRef, HTMLAttributes } from \"react\";\nimport { clsx } from \"clsx\";\nimport {\n  FlexItem,\n  flexItemAlignment,\n  makePrefixer,\n  ResponsiveProp,\n} from \"@salt-ds/core\";\nimport \"./ParentChildItem.css\";\n\nexport type SlideDirection = \"top\" | \"bottom\" | \"left\" | \"right\";\n\nexport interface ParentChildItemProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Allows the alignment specified by parent to be overridden for individual items, default is \"start\".\n   */\n  align?: flexItemAlignment;\n  /**\n   * Disable all animations.\n   */\n  disableAnimations?: boolean;\n  /**\n   * Direction for slide animations.\n   */\n  direction?: SlideDirection;\n  /**\n   * Defines the ability for an item to grow x times more compared to it's siblings, default is 0.\n   */\n  grow?: ResponsiveProp<number>;\n  /**\n   * Determines whether the component is stacked\n   */\n  isStacked?: boolean;\n  /**\n   * Defines the ability for an item to shrink x times more compared to it's siblings, default is 1.\n\n   */\n  shrink?: ResponsiveProp<number>;\n}\n\nconst withBaseName = makePrefixer(\"saltParentChildItem\");\nexport const ParentChildItem = forwardRef<HTMLDivElement, ParentChildItemProps>(\n  function ParentChildItem(\n    {\n      disableAnimations = false,\n      direction,\n      isStacked,\n      children,\n      className,\n      ...rest\n    },\n    ref\n  ) {\n    return (\n      <FlexItem\n        className={clsx(className, withBaseName(), {\n          ...(direction && {\n            [withBaseName(`slide-${direction}`)]: !disableAnimations,\n          }),\n          \"saltFlexItem-stacked\": isStacked,\n        })}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </FlexItem>\n    );\n  }\n);\n"],"names":["ParentChildItem"],"mappings":";;;;;;AAwCA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAChD,MAAM,eAAkB,GAAA,UAAA;AAAA,EAC7B,SAASA,gBACP,CAAA;AAAA,IACE,iBAAoB,GAAA,KAAA;AAAA,IACpB,SAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACG,GAAA,IAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAA,uBACG,GAAA,CAAA,QAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA,CAAK,SAAW,EAAA,YAAA,EAAgB,EAAA;AAAA,QACzC,GAAI,SAAa,IAAA;AAAA,UACf,CAAC,YAAA,CAAa,CAAS,MAAA,EAAA,SAAA,CAAA,CAAW,IAAI,CAAC,iBAAA;AAAA,SACzC;AAAA,QACA,sBAAwB,EAAA,SAAA;AAAA,OACzB,CAAA;AAAA,MACD,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-es/packages/lab/src/parent-child-layout/ParentChildLayout.css.js

@@ -1,7 +0,0 @@
-import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".saltParentChildLayout {\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=ParentChildLayout.css.js.map

package/dist-es/packages/lab/src/parent-child-layout/ParentChildLayout.css.js.map

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

package/dist-es/packages/lab/src/parent-child-layout/ParentChildLayout.js

@@ -1,76 +0,0 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { makePrefixer, FlexLayout } from '@salt-ds/core';
-import { clsx } from 'clsx';
-import { forwardRef } from 'react';
-import { ParentChildItem } from '../parent-child-item/ParentChildItem.js';
-import '../utils/useFloatingUI.js';
-import { useIsViewportLargerThanBreakpoint } from '../utils/useIsViewportLargerThanBreakpoint.js';
-import './ParentChildLayout.css.js';
-
-const withBaseName = makePrefixer("saltParentChildLayout");
-const getDirection = (orientation, stackedViewElement) => {
-  let direction = "right";
-  if (orientation === "horizontal") {
-    if (stackedViewElement === "parent") {
-      direction = "left";
-    } else {
-      direction = "right";
-    }
-  } else {
-    if (stackedViewElement === "parent") {
-      direction = "bottom";
-    } else {
-      direction = "top";
-    }
-  }
-  return direction;
-};
-const ParentChildLayout = forwardRef(function ParentChildLayout2({
-  stackedAtBreakpoint = "sm",
-  stackedViewElement = "parent",
-  disableAnimations = false,
-  parent,
-  child,
-  className,
-  orientation = "horizontal",
-  ...rest
-}, ref) {
-  const stackedView = useIsViewportLargerThanBreakpoint(stackedAtBreakpoint);
-  const parentChildDirection = getDirection(orientation, stackedViewElement);
-  const stackedViewChildren = {
-    parent: /* @__PURE__ */ jsx(ParentChildItem, {
-      disableAnimations,
-      direction: parentChildDirection,
-      isStacked: stackedView,
-      children: parent
-    }),
-    child: /* @__PURE__ */ jsx(ParentChildItem, {
-      disableAnimations,
-      direction: parentChildDirection,
-      isStacked: stackedView,
-      children: child
-    })
-  };
-  return /* @__PURE__ */ jsx(FlexLayout, {
-    className: clsx(className, withBaseName()),
-    ref,
-    ...rest,
-    children: stackedView ? stackedViewChildren[stackedViewElement] : /* @__PURE__ */ jsxs(Fragment, {
-      children: [
-        /* @__PURE__ */ jsx(ParentChildItem, {
-          grow: 0,
-          disableAnimations,
-          children: parent
-        }),
-        /* @__PURE__ */ jsx(ParentChildItem, {
-          grow: 2,
-          disableAnimations,
-          children: child
-        })
-      ]
-    })
-  });
-});
-
-export { ParentChildLayout };
-//# sourceMappingURL=ParentChildLayout.js.map

package/dist-es/packages/lab/src/parent-child-layout/ParentChildLayout.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ParentChildLayout.js","sources":["../src/parent-child-layout/ParentChildLayout.tsx"],"sourcesContent":["import {\n  Breakpoints,\n  FlexLayout,\n  FlexLayoutProps,\n  makePrefixer,\n} from \"@salt-ds/core\";\n\nimport { clsx } from \"clsx\";\nimport { ElementType, forwardRef, HTMLAttributes, ReactNode } from \"react\";\nimport { ParentChildItem, SlideDirection } from \"../parent-child-item\";\nimport { useIsViewportLargerThanBreakpoint } from \"../utils\";\n\nimport \"./ParentChildLayout.css\";\n\nexport type StackedViewElement = \"parent\" | \"child\";\n\ntype Orientation = \"horizontal\" | \"vertical\";\n\nexport interface ParentChildLayoutProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Breakpoint at which the parent and child will stack.\n   */\n  stackedAtBreakpoint?: keyof Breakpoints;\n  /**\n   * Change element that is displayed when in staked view.\n   */\n  stackedViewElement?: StackedViewElement;\n  /**\n   * Disable all animations.\n   */\n  disableAnimations?: boolean;\n  /**\n   * Orientation for slide animations.\n   */\n  orientation?: Orientation;\n  /**\n   * Controls the space between columns.\n   */\n  gap?: FlexLayoutProps<ElementType>[\"gap\"];\n  /**\n   * Parent component to be rendered\n   */\n  parent: ReactNode;\n  /**\n   * Child component to be rendered\n   */\n  child: ReactNode;\n}\n\nconst withBaseName = makePrefixer(\"saltParentChildLayout\");\n\nconst getDirection = (\n  orientation: Orientation,\n  stackedViewElement: StackedViewElement\n) => {\n  let direction: SlideDirection = \"right\";\n\n  if (orientation === \"horizontal\") {\n    if (stackedViewElement === \"parent\") {\n      direction = \"left\";\n    } else {\n      direction = \"right\";\n    }\n  } else {\n    if (stackedViewElement === \"parent\") {\n      direction = \"bottom\";\n    } else {\n      direction = \"top\";\n    }\n  }\n\n  return direction;\n};\n\nexport const ParentChildLayout = forwardRef<\n  HTMLDivElement,\n  ParentChildLayoutProps\n>(function ParentChildLayout(\n  {\n    stackedAtBreakpoint = \"sm\",\n    stackedViewElement = \"parent\",\n    disableAnimations = false,\n    parent,\n    child,\n    className,\n    orientation = \"horizontal\",\n    ...rest\n  },\n  ref\n) {\n  const stackedView = useIsViewportLargerThanBreakpoint(stackedAtBreakpoint);\n\n  const parentChildDirection = getDirection(orientation, stackedViewElement);\n\n  const stackedViewChildren = {\n    parent: (\n      <ParentChildItem\n        disableAnimations={disableAnimations}\n        direction={parentChildDirection}\n        isStacked={stackedView}\n      >\n        {parent}\n      </ParentChildItem>\n    ),\n    child: (\n      <ParentChildItem\n        disableAnimations={disableAnimations}\n        direction={parentChildDirection}\n        isStacked={stackedView}\n      >\n        {child}\n      </ParentChildItem>\n    ),\n  };\n\n  return (\n    <FlexLayout className={clsx(className, withBaseName())} ref={ref} {...rest}>\n      {stackedView ? (\n        stackedViewChildren[stackedViewElement]\n      ) : (\n        <>\n          <ParentChildItem grow={0} disableAnimations={disableAnimations}>\n            {parent}\n          </ParentChildItem>\n          <ParentChildItem grow={2} disableAnimations={disableAnimations}>\n            {child}\n          </ParentChildItem>\n        </>\n      )}\n    </FlexLayout>\n  );\n});\n"],"names":["ParentChildLayout"],"mappings":";;;;;;;;;AAiDA,MAAM,YAAA,GAAe,aAAa,uBAAuB,CAAA,CAAA;AAEzD,MAAM,YAAA,GAAe,CACnB,WAAA,EACA,kBACG,KAAA;AACH,EAAA,IAAI,SAA4B,GAAA,OAAA,CAAA;AAEhC,EAAA,IAAI,gBAAgB,YAAc,EAAA;AAChC,IAAA,IAAI,uBAAuB,QAAU,EAAA;AACnC,MAAY,SAAA,GAAA,MAAA,CAAA;AAAA,KACP,MAAA;AACL,MAAY,SAAA,GAAA,OAAA,CAAA;AAAA,KACd;AAAA,GACK,MAAA;AACL,IAAA,IAAI,uBAAuB,QAAU,EAAA;AACnC,MAAY,SAAA,GAAA,QAAA,CAAA;AAAA,KACP,MAAA;AACL,MAAY,SAAA,GAAA,KAAA,CAAA;AAAA,KACd;AAAA,GACF;AAEA,EAAO,OAAA,SAAA,CAAA;AACT,CAAA,CAAA;AAEa,MAAA,iBAAA,GAAoB,UAG/B,CAAA,SAASA,kBACT,CAAA;AAAA,EACE,mBAAsB,GAAA,IAAA;AAAA,EACtB,kBAAqB,GAAA,QAAA;AAAA,EACrB,iBAAoB,GAAA,KAAA;AAAA,EACpB,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAc,GAAA,YAAA;AAAA,EACX,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAM,MAAA,WAAA,GAAc,kCAAkC,mBAAmB,CAAA,CAAA;AAEzE,EAAM,MAAA,oBAAA,GAAuB,YAAa,CAAA,WAAA,EAAa,kBAAkB,CAAA,CAAA;AAEzE,EAAA,MAAM,mBAAsB,GAAA;AAAA,IAC1B,wBACG,GAAA,CAAA,eAAA,EAAA;AAAA,MACC,iBAAA;AAAA,MACA,SAAW,EAAA,oBAAA;AAAA,MACX,SAAW,EAAA,WAAA;AAAA,MAEV,QAAA,EAAA,MAAA;AAAA,KACH,CAAA;AAAA,IAEF,uBACG,GAAA,CAAA,eAAA,EAAA;AAAA,MACC,iBAAA;AAAA,MACA,SAAW,EAAA,oBAAA;AAAA,MACX,SAAW,EAAA,WAAA;AAAA,MAEV,QAAA,EAAA,KAAA;AAAA,KACH,CAAA;AAAA,GAEJ,CAAA;AAEA,EAAA,uBACG,GAAA,CAAA,UAAA,EAAA;AAAA,IAAW,SAAW,EAAA,IAAA,CAAK,SAAW,EAAA,YAAA,EAAc,CAAA;AAAA,IAAG,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IACnE,QAAA,EAAA,WAAA,GACC,oBAAoB,kBAEpB,CAAA,mBAAA,IAAA,CAAA,QAAA,EAAA;AAAA,MACE,QAAA,EAAA;AAAA,wBAAC,GAAA,CAAA,eAAA,EAAA;AAAA,UAAgB,IAAM,EAAA,CAAA;AAAA,UAAG,iBAAA;AAAA,UACvB,QAAA,EAAA,MAAA;AAAA,SACH,CAAA;AAAA,wBACC,GAAA,CAAA,eAAA,EAAA;AAAA,UAAgB,IAAM,EAAA,CAAA;AAAA,UAAG,iBAAA;AAAA,UACvB,QAAA,EAAA,KAAA;AAAA,SACH,CAAA;AAAA,OAAA;AAAA,KACF,CAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-es/packages/lab/src/pill/Pill.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  --pill-icon-offset: 1px;\n}\n\n.salt-density-medium {\n  --pill-icon-offset: 2px;\n}\n\n.salt-density-low {\n  --pill-icon-offset: 3px;\n}\n\n.salt-density-touch {\n  --pill-icon-offset: 4px;\n}\n\n/* Styles applied to the root element */\n.saltPill {\n  --pill-background: var(--saltPill-background, var(--salt-taggable-background));\n  --pill-background-active: var(--saltPill-background-active, var(--salt-taggable-background-active));\n  --pill-background-disabled: var(--saltPill-background-disabled, var(--salt-taggable-background-disabled));\n  --pill-background-hover: var(--saltPill-background-hover, var(--salt-taggable-background-hover));\n  --pill-checkbox-size: var(--saltPill-checkbox-size, calc(var(--pill-height) - 2px));\n  --pill-fontSize: var(--saltPill-fontSize, var(--salt-text-label-fontSize));\n  --pill-height: calc(var(--salt-size-base) - (var(--salt-size-unit) * 1.5));\n  --pill-icon-color: var(--saltPill-icon-color, var(--salt-taggable-foreground));\n  --pill-icon-color-active: var(--saltPill-icon-color-active, var(--salt-taggable-foreground-active));\n  --pill-icon-color-hover: var(--saltPill-icon-color-hover, var(--salt-taggable-foreground-hover));\n  --pill-icon-color-disabled: var(--saltPill-icon-color-disabled, var(--salt-taggable-foreground-disabled));\n  --pill-text-color: var(--saltPill-text-color, var(--salt-taggable-foreground));\n  --pill-text-color-active: var(--saltPill-text-color-active, var(--salt-taggable-foreground-active));\n  --pill-text-color-hover: var(--saltPill-text-color-hover, var(--salt-taggable-foreground-hover));\n  --pill-text-color-disabled: var(--saltPill-text-color-disabled, var(--salt-taggable-foreground-disabled));\n\n  /* Button API */\n  --saltButton-fontWeight: var(--saltPill-button-fontWeight, var(--salt-text-fontWeight));\n  --saltButton-padding: var(--saltPill-button-padding, 0);\n  --saltButton-textTransform: var(--saltPill-button-textTransform, unset);\n  --saltButton-cursor: normal;\n}\n\n.saltPill {\n  align-items: center;\n  background: var(--pill-background);\n  border-radius: var(--saltPill-borderRadius, 0);\n  color: var(--pill-text-color);\n  display: inline-flex;\n  font-size: var(--pill-fontSize);\n  height: var(--saltPill-height, var(--pill-checkbox-size)); /* TODO: Check with design vs checkbox height */\n  letter-spacing: var(--saltPill-letterSpacing, 0);\n  line-height: var(--saltPill-lineHeight, var(--salt-text-label-lineHeight));\n  max-width: var(--saltPill-maxWidth, 160px);\n  min-width: var(--saltPill-minWidth, 40px);\n  min-height: var(--saltPill-minHeight, var(--salt-text-minHeight));\n  outline: var(--saltPill-outline, 0);\n  position: relative;\n}\n\n.saltPill:hover {\n  --saltButton-background-active: var(--pill-background-active);\n  --saltButton-background-hover: var(--pill-background-hover);\n\n  --saltIcon-color: var(--pill-icon-color);\n  --saltIcon-color-hover: var(--pill-icon-color-hover);\n\n  background: var(--pill-background-hover);\n}\n\n/* Style applied to Pill when active */\n.saltPill:active,\n.saltPill-active {\n  --saltButton-background-active: var(--pill-background-active);\n}\n\n/* Style applied to Pill on focus */\n.saltPill:focus {\n  outline-color: var(--saltPill-focused-outlineColor, var(--salt-focused-outlineColor));\n  outline-style: var(--saltPill-focused-outlineStyle, var(--salt-focused-outlineStyle));\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-offset: var(--salt-focused-outlineOffset);\n}\n\n/* Style applied to Pill icon if `clickable={true}`  */\n.saltPill-clickable {\n  --saltButton-background-active: var(--pill-background);\n  --saltButton-background-hover: var(--pill-background);\n\n  cursor: var(--salt-selectable-cursor-hover);\n  user-select: none;\n}\n\n/* Style applied to Pill when `deletable={true}` */\n.saltPill-deletable {\n  --saltButton-background-active: var(--pill-background);\n  --saltButton-background-hover: var(--pill-background);\n}\n\n.saltPill-selectable:hover,\n.saltPill-deletable:hover {\n  --saltButton-background-active: var(--pill-background);\n  --saltButton-background-hover: var(--pill-background);\n}\n\n/* Style applied to Pill when active if `selectable={true}` */\n.saltPill-selectable:active,\n.saltPill-active.saltPill-selectable {\n  --saltButton-background-active: var(--pill-background);\n}\n\n/* Style applied to Pill when disabled */\n.saltPill-disabled,\n.saltPill-disabled:hover,\n.saltPill-disabled:active {\n  --saltButton-background-active: var(--pill-background-disabled);\n  --saltButton-background-hover: var(--pill-background-disabled);\n  --saltButton-text-color-active: var(--pill-text-color);\n  --saltButton-text-color-hover: var(--pill-text-color);\n  --saltCheckbox-icon-tick-color: var(--salt-taggable-foreground-disabled);\n  --saltCheckbox-icon-stroke-hover: var(--salt-selectable-borderColor-disabled);\n\n  background: var(--pill-background-disabled);\n  cursor: var(--salt-selectable-cursor-disabled);\n}\n\n/* Checkbox styles for selectable Pill when `disabled={true}` */\n.saltPill-disabled .saltPill-checkbox {\n  --saltCheckbox-icon-tick-color: var(--salt-taggable-foreground-disabled);\n  --saltCheckbox-icon-stroke: var(--salt-selectable-borderColor-disabled);\n  --saltCheckbox-icon-stroke-hover: var(--salt-selectable-borderColor-disabled);\n}\n\n/* Style applied to Pill label */\n.saltPill-label {\n  color: var(--saltPill-text-color, var(--pill-text-color));\n  display: inline;\n  flex-grow: 1;\n  font-weight: var(--saltPill-fontWeight, var(--salt-text-fontWeight));\n  overflow: hidden;\n  padding-left: var(--saltPill-label-paddingLeft, calc(var(--salt-size-unit) * 0.75));\n  padding-right: var(--saltPill-label-paddingRight, calc(var(--salt-size-unit) * 0.75));\n  pointer-events: none;\n  text-align: center;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* Style applied to Pill label when `deletable={true}` */\n.saltPill-deletable .saltPill-label {\n  padding-right: 0px;\n}\n\n/* Style applied to Pill label inner text */\n.saltPill-innerLabel {\n  vertical-align: top;\n  line-height: var(--pill-height);\n}\n\n/* Style applied to Pill label and icon when `disabled={true}` */\n.saltPill-disabled .saltPill-label,\n.saltPill-disabled .saltIcon {\n  cursor: var(--salt-selectable-cursor-disabled);\n  opacity: var(--salt-palette-opacity-foreground);\n\n  --saltIcon-color: var(--pill-icon-color-disabled);\n  --saltIcon-color-hover: var(--pill-icon-color-disabled);\n}\n\n/* Style applied to Pill delete button */\n.saltPill-deleteButton {\n  --saltButton-background-hover: var(--pill-background-hover);\n  --saltButton-background-active: var(--pill-background-active);\n  --saltButton-cursor: pointer;\n\n  flex-shrink: 0;\n  height: var(--pill-checkbox-size);\n  margin-left: calc(var(--salt-size-unit) / 2);\n  min-height: var(--saltPill-minHeight, var(--salt-text-minHeight));\n  padding-right: calc(var(--salt-size-unit) / 2);\n}\n\n/* Style applied to Pill delete button if `disabled={true}` */\n.saltPill-deleteButton-disabled {\n  --saltButton-background-hover: var(--pill-background-disabled);\n  --saltButton-background-active: var(--pill-background-disabled);\n  --saltButton-background-disabled: initial;\n}\n\n/* Style applied to Pill delete button icon  */\n.saltPill-deleteButton .saltPill-deleteIcon {\n  left: var(--saltPill-deleteButton-left, var(--pill-icon-offset));\n  position: relative;\n}\n\n/* Style applied to Pill delete button icon on active state  */\n.saltPill-deleteButton:active .saltPill-deleteIcon {\n  --saltIcon-color: var(--saltPill-deleteButton-color-active, var(--pill-icon-color-active));\n}\n\n/* Style applied to Pill delete button icon if `disabled={true}` on active state  */\n.saltPill-disabled:active .saltPill-deleteIcon {\n  --saltButton-background-active: var(--pill-background-disabled);\n  --saltIcon-color: var(--saltPill-deleteButton-color-disabled, var(--pill-icon-color));\n}\n\n/* Style applied to Pill icon */\n.saltPill .saltPill-icon {\n  fill: var(--pill-icon-color);\n  height: var(--salt-size-graphic-small);\n  margin-left: calc(var(--salt-size-unit) * 0.75);\n  margin-right: calc(var(--salt-size-unit) * 0.5);\n}\n\n/* Style applied to Pill icon on active state */\n.saltPill:active .saltPill-icon,\n.saltPill-active .saltPill-icon {\n  fill: var(--pill-icon-color-active);\n}\n\n.saltPill:not(.saltPill-deletable) .saltPill-icon + .saltPill-label {\n  padding-left: 0;\n}\n\n/* Pill label styles on hover */\n.saltPill:hover .saltPill-label {\n  color: var(--pill-text-color-hover);\n}\n\n/* Pill label styles on active state */\n.saltPill:active .saltPill-label {\n  color: var(--pill-text-color-active);\n}\n\n/* Pill label styles when `selectable={true}` or `deletable={true}` */\n.saltPill-selectable .saltPill-label,\n.saltPill-selectable:active .saltPill-label,\n.saltPill-deletable .saltPill-label,\n.saltPill-deletable:active .saltPill-label {\n  background: var(--pill-background);\n  color: var(--pill-text-color);\n}\n\n/* Pill label styles when  `disabled={true}` */\n.saltPill-disabled .saltPill-label,\n.saltPill-disabled:active .saltPill-label {\n  background: initial;\n  color: var(--pill-text-color-disabled);\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=Pill.css.js.map

package/dist-es/packages/lab/src/pill/Pill.css.js.map

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

package/dist-es/packages/lab/src/pill/Pill.js

@@ -1,37 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { ClosablePill } from './ClosablePill.js';
-import { PillBase } from './PillBase.js';
-import { SelectablePill } from './SelectablePill.js';
-import './Pill.css.js';
-
-const getVariant = (deletable, variantProp) => {
-  if (variantProp) {
-    return variantProp;
-  } else {
-    return deletable !== void 0 ? "closable" : "basic";
-  }
-};
-const Pill = forwardRef(function Pill2({ variant: variantProp, ...restProps }, ref) {
-  const variant = getVariant(restProps.deletable, variantProp);
-  if (variant === "selectable") {
-    return /* @__PURE__ */ jsx(SelectablePill, {
-      ...restProps,
-      ref
-    });
-  } else if (variant === "closable") {
-    return /* @__PURE__ */ jsx(ClosablePill, {
-      ...restProps,
-      ref
-    });
-  } else {
-    return /* @__PURE__ */ jsx(PillBase, {
-      clickable: true,
-      ...restProps,
-      ref
-    });
-  }
-});
-
-export { Pill };
-//# sourceMappingURL=Pill.js.map

package/dist-es/packages/lab/src/pill/Pill.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Pill.js","sources":["../src/pill/Pill.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef, ReactElement } from \"react\";\n\nimport { ClosablePill, ClosablePillProps } from \"./ClosablePill\";\nimport { PillBase, PillBaseProps } from \"./PillBase\";\nimport { SelectablePill, SelectablePillProps } from \"./SelectablePill\";\n\nimport \"./Pill.css\";\n\nexport type PillVariant = \"basic\" | \"closable\" | \"selectable\";\n\nexport interface PillVariantProps<T extends PillVariant = \"basic\"> {\n  /**\n   * Determines the variant of pill\n   */\n  variant?: T;\n}\n\n// Generic checks makes sure that incompatiable props like `onChange` can be inferred correctly when using different variants\nexport type PillProps<T extends PillVariant = \"basic\"> = T extends \"closable\"\n  ? ClosablePillProps & PillVariantProps<T>\n  : T extends \"basic\"\n  ? PillBaseProps & PillVariantProps<T>\n  : SelectablePillProps & PillVariantProps<T>;\n\nconst getVariant = (deletable?: boolean, variantProp?: PillVariant) => {\n  if (variantProp) {\n    return variantProp;\n  } else {\n    return deletable !== undefined ? \"closable\" : \"basic\";\n  }\n};\n\nexport const Pill = forwardRef(function Pill(\n  { variant: variantProp, ...restProps }: PillProps,\n  ref: ForwardedRef<HTMLDivElement>\n) {\n  const variant = getVariant(restProps.deletable, variantProp);\n  if (variant === \"selectable\") {\n    return <SelectablePill {...(restProps as SelectablePillProps)} ref={ref} />;\n  } else if (variant === \"closable\") {\n    return <ClosablePill {...restProps} ref={ref} />;\n  } else {\n    return <PillBase clickable {...restProps} ref={ref} />;\n  }\n}) as <T extends PillVariant = \"basic\">(\n  p: PillProps<T> & { ref?: ForwardedRef<HTMLDivElement> }\n) => ReactElement<PillProps<T>>;\n"],"names":["Pill"],"mappings":";;;;;;;AAwBA,MAAM,UAAA,GAAa,CAAC,SAAA,EAAqB,WAA8B,KAAA;AACrE,EAAA,IAAI,WAAa,EAAA;AACf,IAAO,OAAA,WAAA,CAAA;AAAA,GACF,MAAA;AACL,IAAO,OAAA,SAAA,KAAc,SAAY,UAAa,GAAA,OAAA,CAAA;AAAA,GAChD;AACF,CAAA,CAAA;AAEa,MAAA,IAAA,GAAO,WAAW,SAASA,KAAAA,CACtC,EAAE,OAAS,EAAA,WAAA,EAAA,GAAgB,SAAU,EAAA,EACrC,GACA,EAAA;AACA,EAAA,MAAM,OAAU,GAAA,UAAA,CAAW,SAAU,CAAA,SAAA,EAAW,WAAW,CAAA,CAAA;AAC3D,EAAA,IAAI,YAAY,YAAc,EAAA;AAC5B,IAAA,uBAAQ,GAAA,CAAA,cAAA,EAAA;AAAA,MAAgB,GAAI,SAAA;AAAA,MAAmC,GAAA;AAAA,KAAU,CAAA,CAAA;AAAA,GAC3E,MAAA,IAAW,YAAY,UAAY,EAAA;AACjC,IAAA,uBAAQ,GAAA,CAAA,YAAA,EAAA;AAAA,MAAc,GAAG,SAAA;AAAA,MAAW,GAAA;AAAA,KAAU,CAAA,CAAA;AAAA,GACzC,MAAA;AACL,IAAA,uBAAQ,GAAA,CAAA,QAAA,EAAA;AAAA,MAAS,SAAS,EAAA,IAAA;AAAA,MAAE,GAAG,SAAA;AAAA,MAAW,GAAA;AAAA,KAAU,CAAA,CAAA;AAAA,GACtD;AACF,CAAC;;;;"}

package/dist-es/packages/lab/src/pill/PillBase.js

@@ -1,121 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { clsx } from 'clsx';
-import { forwardRef, useState, isValidElement, cloneElement, useRef } from 'react';
-import { makePrefixer, Tooltip, useIsomorphicLayoutEffect } from '@salt-ds/core';
-import { DeleteButton } from './internal/DeleteButton.js';
-import { DivButton } from './internal/DivButton.js';
-import { pillBaseName } from './constants.js';
-import './Pill.css.js';
-
-const useEllipsisIsActive = () => {
-  const labelRef = useRef(null);
-  const [showEllipsis, setShowEllipsis] = useState(false);
-  useIsomorphicLayoutEffect(() => {
-    if (labelRef.current) {
-      setShowEllipsis(
-        labelRef.current.offsetWidth < labelRef.current.scrollWidth
-      );
-    }
-  }, []);
-  return [labelRef, showEllipsis];
-};
-const noop = () => void 0;
-const withBaseName = makePrefixer(pillBaseName);
-const PillBase = forwardRef(function PillBase2({
-  TooltipProps: TooltipProps2 = {},
-  "aria-roledescription": ariaRoledescription = "Pill",
-  label,
-  className,
-  clickable,
-  disabled,
-  deletable,
-  deleteIcon: deleteIconProp,
-  highlighted,
-  icon,
-  onClick = noop,
-  onDelete,
-  onKeyDown = noop,
-  onKeyUp = noop,
-  ...rest
-}, ref) {
-  const [active, setActive] = useState(false);
-  const [labelRef, ellipsis] = useEllipsisIsActive();
-  const clickKeys = ["Enter", " "];
-  const pillIcon = icon && isValidElement(icon) ? cloneElement(icon, {
-    ...icon.props,
-    className: clsx(withBaseName("icon"), icon.props.className)
-  }) : icon;
-  const handleKeyDown = (event) => {
-    onKeyDown(event);
-    if (!disabled && !deletable && clickKeys.indexOf(event.key) !== -1) {
-      setActive(true);
-    }
-  };
-  const handleKeyUp = (event) => {
-    onKeyUp(event);
-    setActive(false);
-  };
-  const handleClick = (event) => {
-    onClick(event);
-  };
-  const Component = deletable || clickable ? DivButton : "div";
-  const renderDeleteIcon = () => {
-    if (deleteIconProp && isValidElement(deleteIconProp)) {
-      return cloneElement(deleteIconProp, {
-        className: clsx(
-          withBaseName(`deleteButton`),
-          deleteIconProp.props.className
-        ),
-        disabled,
-        onClick: onDelete
-      });
-    } else {
-      return /* @__PURE__ */ jsx(DeleteButton, {
-        disabled,
-        onClick: onDelete
-      });
-    }
-  };
-  return /* @__PURE__ */ jsx(Tooltip, {
-    content: label,
-    disabled: !ellipsis && disabled,
-    ...TooltipProps2,
-    children: /* @__PURE__ */ jsxs(Component, {
-      "aria-disabled": disabled || void 0,
-      "aria-roledescription": ariaRoledescription,
-      className: clsx(
-        withBaseName(),
-        {
-          [withBaseName("clickable")]: clickable,
-          [withBaseName("deletable")]: deletable && !disabled,
-          [withBaseName("disabled")]: disabled,
-          [withBaseName("active")]: active
-        },
-        className
-      ),
-      "data-testid": "pill",
-      onKeyDown: disabled ? void 0 : handleKeyDown,
-      onKeyUp: disabled ? void 0 : handleKeyUp,
-      onClick: disabled ? void 0 : handleClick,
-      role: "button",
-      tabIndex: disabled ? -1 : 0,
-      ref,
-      ...rest,
-      children: [
-        pillIcon || null,
-        /* @__PURE__ */ jsx("div", {
-          className: withBaseName("label"),
-          ref: labelRef,
-          children: /* @__PURE__ */ jsx("span", {
-            className: withBaseName("innerLabel"),
-            children: label
-          })
-        }),
-        deletable ? renderDeleteIcon() : null
-      ]
-    })
-  });
-});
-
-export { PillBase };
-//# sourceMappingURL=PillBase.js.map

package/dist-es/packages/lab/src/pill/PillBase.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PillBase.js","sources":["../src/pill/PillBase.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  cloneElement,\n  ForwardedRef,\n  forwardRef,\n  HTMLAttributes,\n  isValidElement,\n  KeyboardEvent,\n  MutableRefObject,\n  ReactElement,\n  ReactEventHandler,\n  SyntheticEvent,\n  useRef,\n  useState,\n} from \"react\";\nimport {\n  makePrefixer,\n  Tooltip,\n  TooltipProps,\n  useIsomorphicLayoutEffect,\n} from \"@salt-ds/core\";\n\nimport { DeleteButton } from \"./internal/DeleteButton\";\nimport { DivButton } from \"./internal/DivButton\";\nimport { pillBaseName } from \"./constants\";\n\nimport \"./Pill.css\";\n\nconst useEllipsisIsActive = (): [\n  MutableRefObject<HTMLDivElement | null>,\n  boolean\n] => {\n  const labelRef = useRef<HTMLDivElement | null>(null);\n  const [showEllipsis, setShowEllipsis] = useState(false);\n\n  useIsomorphicLayoutEffect(() => {\n    if (labelRef.current) {\n      setShowEllipsis(\n        labelRef.current.offsetWidth < labelRef.current.scrollWidth\n      );\n    }\n  }, []);\n  return [labelRef, showEllipsis];\n};\n\nconst noop = () => undefined;\n\nconst withBaseName = makePrefixer(pillBaseName);\n\nexport interface PillBaseProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Props passed to the tooltip\n   */\n  TooltipProps?: Partial<TooltipProps>;\n  /**\n   * Defines a human-readable, author-localized description for the role of an element.\n   *\n   * This should be in favour of aria-label for `Pill`\n   **/\n  \"aria-roledescription\"?: string;\n  /**\n   * Clickable variation. Use 'onClick' for callback.\n   */\n  clickable?: boolean;\n  /**\n   * Shows delete icon. Use `onDelete` for callback.\n   */\n  deletable?: boolean;\n  /**\n   * Override the default delete icon element. Shown only if `deletable` is set.\n   */\n  // TODO: Should this be DeleteIcon (caps)?\n  deleteIcon?: ReactElement;\n  /**\n   * If `true`, the pill will be disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Whether the pill is been highlighted.\n   * If `true`, the pill will display Tooltip when text within is truncated.\n   */\n  highlighted?: boolean;\n  /**\n   * Icon element.\n   */\n  // TODO: Should this be Icon (caps)?\n  icon?: ReactElement;\n  /**\n   * The content of the label.\n   */\n  label?: string;\n  /**\n   * Callback function fired when pill is clicked.\n   */\n  onClick?: (event: SyntheticEvent<HTMLDivElement>) => void;\n  /**\n   * Callback function fired when the delete icon is clicked. Used when `deletable` is true.\n   */\n  onDelete?: ReactEventHandler<HTMLElement>;\n}\n\nexport const PillBase = forwardRef(function PillBase(\n  {\n    TooltipProps = {},\n    \"aria-roledescription\": ariaRoledescription = \"Pill\",\n    label,\n    className,\n    // New API\n    clickable,\n    disabled,\n    // TODO: Should this be a prop as we have variant: 'closable'\n    // New API.\n    deletable,\n    deleteIcon: deleteIconProp,\n    // TODO: Not implemented. Consider to add `useImperativeHandle` like API to Tooltip?\n    highlighted,\n    icon,\n    onClick = noop,\n    onDelete,\n    onKeyDown = noop,\n    onKeyUp = noop,\n    ...rest\n  }: PillBaseProps,\n  ref: ForwardedRef<HTMLDivElement>\n) {\n  const [active, setActive] = useState(false);\n  const [labelRef, ellipsis] = useEllipsisIsActive();\n  const clickKeys = [\"Enter\", \" \"];\n\n  const pillIcon =\n    // FIXME: icon type\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    icon && isValidElement<any>(icon)\n      ? cloneElement(icon, {\n          ...icon.props,\n          // FIXME: icon.props is any\n          // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n          className: clsx(withBaseName(\"icon\"), icon.props.className),\n        })\n      : icon;\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    onKeyDown(event);\n    if (!disabled && !deletable && clickKeys.indexOf(event.key) !== -1) {\n      setActive(true);\n    }\n  };\n\n  const handleKeyUp = (event: KeyboardEvent<HTMLDivElement>) => {\n    onKeyUp(event);\n    setActive(false);\n  };\n\n  const handleClick = (event: SyntheticEvent<HTMLDivElement, Event>) => {\n    onClick(event);\n  };\n\n  // FIXME: use polymorphic button as div for deletable and clickable cases.\n  const Component = deletable || clickable ? DivButton : \"div\";\n\n  const renderDeleteIcon = () => {\n    // FIXME: deleteIconProp type\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    if (deleteIconProp && isValidElement<any>(deleteIconProp)) {\n      return cloneElement(deleteIconProp, {\n        className: clsx(\n          withBaseName(`deleteButton`),\n          // FIXME: deleteIconProp.props is any\n          // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n          deleteIconProp.props.className\n        ),\n        disabled,\n        onClick: onDelete,\n      });\n    } else {\n      return <DeleteButton disabled={disabled} onClick={onDelete} />;\n    }\n  };\n\n  return (\n    <Tooltip content={label} disabled={!ellipsis && disabled} {...TooltipProps}>\n      <Component\n        aria-disabled={disabled || undefined}\n        aria-roledescription={ariaRoledescription}\n        className={clsx(\n          withBaseName(),\n          {\n            [withBaseName(\"clickable\")]: clickable,\n            [withBaseName(\"deletable\")]: deletable && !disabled,\n            [withBaseName(\"disabled\")]: disabled,\n            [withBaseName(\"active\")]: active,\n          },\n          className\n        )}\n        data-testid=\"pill\"\n        onKeyDown={disabled ? undefined : handleKeyDown}\n        onKeyUp={disabled ? undefined : handleKeyUp}\n        onClick={disabled ? undefined : handleClick}\n        role=\"button\"\n        tabIndex={disabled ? -1 : 0}\n        ref={ref}\n        {...rest}\n      >\n        {pillIcon || null}\n        <div className={withBaseName(\"label\")} ref={labelRef}>\n          <span className={withBaseName(\"innerLabel\")}>{label}</span>\n        </div>\n        {deletable ? renderDeleteIcon() : null}\n      </Component>\n    </Tooltip>\n  );\n});\n"],"names":["PillBase","TooltipProps"],"mappings":"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"}

package/dist-es/packages/lab/src/pill/internal/PillCheckbox.css.js

@@ -1,7 +0,0 @@
-import styleInject from '../../../../../node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = "/* Styles applied to the Pill checkbox */\n.saltPill-checkbox {\n  height: var(--pill-checkbox-size);\n  margin-left: 1px;\n  padding-right: 0;\n  width: var(--pill-checkbox-size);\n\n  --saltCheckbox-icon-stroke: var(--salt-selectable-borderColor);\n  --saltCheckbox-icon-stroke-hover: var(--salt-selectable-borderColor);\n  --saltCheckbox-icon-fill: none;\n  --saltCheckbox-icon-fill-checked: none;\n  --saltCheckbox-icon-borderWidth-checked: var(--salt-size-border);\n  --saltCheckbox-icon-tick-color: var(--salt-taggable-foreground);\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=PillCheckbox.css.js.map

package/dist-es/packages/lab/src/pill/internal/PillCheckbox.css.js.map

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

package/dist-es/packages/lab/src/pill/internal/PillCheckbox.js

@@ -1,19 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { makePrefixer } from '@salt-ds/core';
-import '../../checkbox/Checkbox.js';
-import '../../checkbox/CheckboxBase.js';
-import '../../checkbox/CheckboxGroup.js';
-import { CheckboxIcon } from '../../checkbox/CheckboxIcon.js';
-import { pillBaseName } from '../constants.js';
-import './PillCheckbox.css.js';
-
-const withBaseName = makePrefixer(`${pillBaseName}-checkbox`);
-const PillCheckbox = (props) => {
-  return /* @__PURE__ */ jsx(CheckboxIcon, {
-    checked: props.checked,
-    className: withBaseName()
-  });
-};
-
-export { PillCheckbox };
-//# sourceMappingURL=PillCheckbox.js.map

package/dist-es/packages/lab/src/pill/internal/PillCheckbox.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PillCheckbox.js","sources":["../src/pill/internal/PillCheckbox.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { CheckboxIcon } from \"../../checkbox\";\nimport { pillBaseName } from \"../constants\";\n\nimport \"./PillCheckbox.css\";\n\nconst withBaseName = makePrefixer(`${pillBaseName}-checkbox`);\n\nexport const PillCheckbox = (props: { checked?: boolean }): JSX.Element => {\n  return <CheckboxIcon checked={props.checked} className={withBaseName()} />;\n};\n"],"names":[],"mappings":";;;;;;;;;AAMA,MAAM,YAAA,GAAe,YAAa,CAAA,CAAA,EAAG,YAAuB,CAAA,SAAA,CAAA,CAAA,CAAA;AAE/C,MAAA,YAAA,GAAe,CAAC,KAA8C,KAAA;AACzE,EAAA,uBAAQ,GAAA,CAAA,YAAA,EAAA;AAAA,IAAa,SAAS,KAAM,CAAA,OAAA;AAAA,IAAS,WAAW,YAAa,EAAA;AAAA,GAAG,CAAA,CAAA;AAC1E;;;;"}

package/dist-es/packages/lab/src/progress/CircularProgress/CircularProgress.css.js

@@ -1,7 +0,0 @@
-import styleInject from '../../../../../node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".saltCircularProgress {\n  --circularProgress-gradient-color: var(--salt-measured-fill);\n\n  color: var(--salt-text-primary-foreground);\n  display: inline-flex;\n  position: relative;\n}\n\n.saltCircularProgress-disabled .saltCircularProgress-progressValue,\n.saltCircularProgress-disabled circle {\n  color: var(--salt-text-primary-foreground-disabled);\n  cursor: var(--salt-selectable-cursor-disabled);\n}\n\n.saltCircularProgress-circle {\n  stroke: url(\"#salt-circular-progress-gradient\");\n  stroke-width: 2px;\n}\n\n.saltCircularProgress-small {\n  font-size: 11px;\n}\n\n.saltCircularProgress-medium {\n  font-size: 14px;\n}\n\n.saltCircularProgress-large {\n  font-size: 16px;\n}\n\n.saltCircularProgress-progressValue {\n  align-items: center;\n  color: var(--salt-text-primary-foreground);\n  display: flex;\n  height: 100%;\n  justify-content: center;\n  left: 0;\n  position: absolute;\n  width: 100%;\n}\n\n.saltCircularProgress-disabled {\n}\n\n.saltCircularProgress-completed {\n}\n\n.saltCircularProgress-railCircle {\n  stroke: var(--salt-measured-background);\n  stroke-width: 1px;\n}\n\n.saltCircularProgress-gradientStart,\n.saltCircularProgress-gradientStop {\n  stop-color: var(--saltCircularProgress-gradient-color, var(--circularProgress-gradient-color));\n}\n\n.saltCircularProgress-container {\n  display: inline-block;\n}\n\n.saltCircularProgress-static {\n  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0s;\n}\n\n.saltCircularProgress-indeterminate {\n  animation: circular-rotate 1.4s linear infinite;\n}\n\n.saltCircularProgress-svg {\n  fill: var(--salt-measured-background);\n  display: block;\n}\n\n.saltCircularProgress-circle {\n  stroke: url(\"#salt-circular-progress-gradient\");\n}\n\n.saltCircularProgress-circleStatic {\n  transition: stroke-dashoffset 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0s;\n}\n\n.saltCircularProgress-circleIndeterminate {\n  animation: circular-dash 1.4s ease-in-out infinite;\n}\n\n@keyframes circular-rotate {\n  0% {\n    transform-origin: 50% 50%;\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n@keyframes circular-dash {\n  0% {\n    stroke-dasharray: 1px, 200px;\n    stroke-dashoffset: 0;\n  }\n  50% {\n    stroke-dasharray: 100px, 200px;\n    stroke-dashoffset: -15px;\n  }\n  100% {\n    stroke-dasharray: 100px, 200px;\n    stroke-dashoffset: -125px;\n  }\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };
-//# sourceMappingURL=CircularProgress.css.js.map