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

package/dist-cjs/packages/lab/src/overlay/useOverlay.js

@@ -1,96 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var react = require('@floating-ui/react');
-var core = require('@salt-ds/core');
-var React = require('react');
-var WindowContext = require('../window/WindowContext.js');
-require('../window/ElectronWindow.js');
-
-function useOverlay(props) {
-  const { open: openProp, placement = "right", onOpenChange } = props;
-  const arrowRef = React.useRef(null);
-  const [open, setOpen] = core.useControlled({
-    controlled: openProp,
-    default: false,
-    name: "Overlay",
-    state: "open"
-  });
-  const handleOpenChange = (newOpen) => {
-    setOpen(newOpen);
-    onOpenChange == null ? void 0 : onOpenChange(newOpen);
-  };
-  const middleware = WindowContext.isDesktop ? [core.margin(24), react.arrow({ element: arrowRef })] : [
-    react.offset(24),
-    react.flip(),
-    react.shift({ limiter: react.limitShift() }),
-    react.arrow({ element: arrowRef })
-  ];
-  const {
-    reference,
-    floating,
-    x,
-    y,
-    strategy,
-    context,
-    middlewareData,
-    update
-  } = core.useFloatingUI({
-    open,
-    onOpenChange: handleOpenChange,
-    placement,
-    middleware
-  });
-  const handleArrowRef = React.useCallback(
-    (node) => {
-      arrowRef.current = node;
-      update();
-    },
-    [update]
-  );
-  const { getFloatingProps, getReferenceProps } = react.useInteractions([
-    react.useDismiss(context),
-    react.useRole(context, { role: "dialog" }),
-    react.useClick(context)
-  ]);
-  const getTriggerProps = (userProps) => {
-    return getReferenceProps({
-      ...userProps,
-      ref: reference
-    });
-  };
-  const getOverlayProps = (userProps) => {
-    var _a, _b, _c, _d;
-    const arrowProps = {
-      ref: handleArrowRef,
-      style: {
-        left: (_b = (_a = middlewareData.arrow) == null ? void 0 : _a.x) != null ? _b : "",
-        top: (_d = (_c = middlewareData.arrow) == null ? void 0 : _c.y) != null ? _d : ""
-      }
-    };
-    return {
-      arrowProps,
-      open,
-      onOpenChange: handleOpenChange,
-      ...getFloatingProps({
-        "data-placement": placement,
-        ...userProps,
-        style: {
-          top: y != null ? y : "",
-          left: x != null ? x : "",
-          position: strategy,
-          ...(userProps == null ? void 0 : userProps.style) || {}
-        },
-        ref: floating
-      })
-    };
-  };
-  return {
-    getTriggerProps,
-    getOverlayProps
-  };
-}
-
-exports.useOverlay = useOverlay;
-//# sourceMappingURL=useOverlay.js.map

package/dist-cjs/packages/lab/src/overlay/useOverlay.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useOverlay.js","sources":["../src/overlay/useOverlay.ts"],"sourcesContent":["import {\n  arrow,\n  flip,\n  limitShift,\n  offset,\n  shift,\n  useClick,\n  useDismiss,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\nimport {\n  margin,\n  useControlled,\n  useFloatingUI,\n  UseFloatingUIProps,\n} from \"@salt-ds/core\";\nimport {\n  ComponentPropsWithoutRef,\n  ComponentPropsWithRef,\n  JSXElementConstructor,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { OverlayProps } from \"./Overlay\";\nimport { isDesktop } from \"../window\";\n\nexport type UseOverlayProps = Partial<\n  Pick<UseFloatingUIProps, \"onOpenChange\" | \"open\" | \"placement\">\n>;\n\nexport function useOverlay(props: UseOverlayProps) {\n  const { open: openProp, placement = \"right\", onOpenChange } = props;\n\n  const arrowRef = useRef<HTMLDivElement | null>(null);\n\n  const [open, setOpen] = useControlled({\n    controlled: openProp,\n    default: false,\n    name: \"Overlay\",\n    state: \"open\",\n  });\n  const handleOpenChange = (newOpen: boolean) => {\n    setOpen(newOpen);\n    onOpenChange?.(newOpen);\n  };\n  const middleware = isDesktop\n    ? [margin(24), arrow({ element: arrowRef })]\n    : [\n        offset(24),\n        flip(),\n        shift({ limiter: limitShift() }),\n        arrow({ element: arrowRef }),\n      ];\n  const {\n    reference,\n    floating,\n    x,\n    y,\n    strategy,\n    context,\n    middlewareData,\n    update,\n  } = useFloatingUI({\n    open,\n    onOpenChange: handleOpenChange,\n    placement,\n    middleware,\n  });\n\n  const handleArrowRef = useCallback(\n    (node: HTMLDivElement) => {\n      arrowRef.current = node;\n      update();\n    },\n    [update]\n  );\n\n  const { getFloatingProps, getReferenceProps } = useInteractions([\n    useDismiss(context),\n    useRole(context, { role: \"dialog\" }),\n    useClick(context),\n  ]);\n\n  const getTriggerProps = <\n    Element extends\n      | keyof JSX.IntrinsicElements\n      | JSXElementConstructor<any> = \"div\"\n  >(\n    userProps?: ComponentPropsWithoutRef<Element>\n  ) => {\n    return getReferenceProps({\n      ...userProps,\n      ref: reference,\n    }) as ComponentPropsWithRef<Element>;\n  };\n\n  const getOverlayProps = (userProps?: OverlayProps) => {\n    const arrowProps = {\n      ref: handleArrowRef,\n      style: {\n        left: middlewareData.arrow?.x ?? \"\",\n        top: middlewareData.arrow?.y ?? \"\",\n      },\n    };\n\n    return {\n      arrowProps,\n      open,\n      onOpenChange: handleOpenChange,\n      ...getFloatingProps({\n        // @ts-ignore\n        \"data-placement\": placement,\n        ...userProps,\n        style: {\n          top: y ?? \"\",\n          left: x ?? \"\",\n          position: strategy,\n          ...(userProps?.style || {}),\n        },\n        ref: floating,\n      }),\n    } as OverlayProps;\n  };\n\n  return {\n    getTriggerProps,\n    getOverlayProps,\n  };\n}\n"],"names":["useRef","useControlled","isDesktop","margin","arrow","offset","flip","shift","limitShift","useFloatingUI","useCallback","useInteractions","useDismiss","useRole","useClick"],"mappings":"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"}

package/dist-cjs/packages/lab/src/pagination/CompactControls.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CompactControls.js","sources":["../src/pagination/CompactControls.tsx"],"sourcesContent":["import { FormFieldProps } from \"../form-field\";\nimport { CompactInput } from \"./CompactInput\";\nimport { PageButton } from \"./PageButton\";\nimport { withBaseName } from \"./utils\";\n\nexport interface CompactControlsProps {\n  count: number;\n  page: number;\n  onPageChange: (page: number) => void;\n  FormFieldProps?: Partial<FormFieldProps>;\n}\n\nexport const CompactControls = ({\n  page,\n  count,\n  onPageChange,\n  FormFieldProps,\n}: CompactControlsProps) => {\n  return (\n    <>\n      <CompactInput\n        page={page}\n        count={count}\n        onPageChange={onPageChange}\n        FormFieldProps={FormFieldProps}\n      />\n      <span className={withBaseName(\"compactSeparator\")}>of</span>\n      <PageButton\n        page={count}\n        onPageChange={onPageChange}\n        disabled={page === count}\n      />\n    </>\n  );\n};\n"],"names":["FormFieldProps","jsxs","Fragment","jsx","CompactInput","withBaseName","PageButton"],"mappings":";;;;;;;;;AAYO,MAAM,kBAAkB,CAAC;AAAA,EAC9B,IAAA;AAAA,EACA,KAAA;AAAA,EACA,YAAA;AAAA,EACA,cAAAA,EAAAA,eAAAA;AACF,CAA4B,KAAA;AAC1B,EACE,uBAAAC,eAAA,CAAAC,mBAAA,EAAA;AAAA,IACE,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAAC,yBAAA,EAAA;AAAA,QACC,IAAA;AAAA,QACA,KAAA;AAAA,QACA,YAAA;AAAA,QACA,cAAgBJ,EAAAA,eAAAA;AAAA,OAClB,CAAA;AAAA,sBACCG,cAAA,CAAA,MAAA,EAAA;AAAA,QAAK,SAAA,EAAWE,mBAAa,kBAAkB,CAAA;AAAA,QAAG,QAAA,EAAA,IAAA;AAAA,OAAE,CAAA;AAAA,sBACpDF,cAAA,CAAAG,qBAAA,EAAA;AAAA,QACC,IAAM,EAAA,KAAA;AAAA,QACN,YAAA;AAAA,QACA,UAAU,IAAS,KAAA,KAAA;AAAA,OACrB,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/packages/lab/src/pagination/CompactInput.js

@@ -1,66 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('react/jsx-runtime');
-var clsx = require('clsx');
-var React = require('react');
-var FormField = require('../form-field/FormField.js');
-require('../form-field/FormLabel.js');
-var Input = require('../input/Input.js');
-require('../input/StaticInputAdornment.js');
-var utils = require('./utils.js');
-
-const CompactInput = ({
-  page,
-  count,
-  onPageChange,
-  FormFieldProps: { className, ...restFormFieldProps } = {}
-}) => {
-  const [inputValue, setInputValue] = React.useState(`${page}`);
-  React.useEffect(() => {
-    setInputValue(`${page}`);
-  }, [page]);
-  const handleChange = (event) => {
-    setInputValue(event.target.value);
-  };
-  const handleKeyDown = (event) => {
-    if (event.key === "Enter") {
-      const pageValue = Number(inputValue);
-      if (!isNaN(pageValue) && pageValue <= count && pageValue > 0) {
-        onPageChange(pageValue);
-      } else {
-        setInputValue(`${page}`);
-      }
-    }
-  };
-  const handleBlur = () => {
-    setInputValue(`${page}`);
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx("span", {
-    children: /* @__PURE__ */ jsxRuntime.jsx(FormField.FormField, {
-      className: clsx.clsx(utils.withBaseName("compactInputField"), className),
-      fullWidth: false,
-      ...restFormFieldProps,
-      children: /* @__PURE__ */ jsxRuntime.jsx(Input.Input, {
-        className: clsx.clsx(utils.withBaseName("compactInput"), {
-          [utils.withBaseName("compactInputFixed")]: count < 100
-        }),
-        highlightOnFocus: true,
-        inputProps: {
-          "aria-label": `Go to page, ${count} total`,
-          style: { width: `${`${count}`.length}ch` },
-          role: "textbox"
-        },
-        onBlur: handleBlur,
-        onChange: handleChange,
-        onKeyDown: handleKeyDown,
-        value: inputValue,
-        textAlign: "center"
-      })
-    })
-  });
-};
-
-exports.CompactInput = CompactInput;
-//# sourceMappingURL=CompactInput.js.map

package/dist-cjs/packages/lab/src/pagination/CompactInput.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CompactInput.js","sources":["../src/pagination/CompactInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEventHandler,\n  KeyboardEventHandler,\n  useEffect,\n  useState,\n} from \"react\";\nimport { FormField, FormFieldProps } from \"../form-field\";\nimport { Input } from \"../input\";\nimport { withBaseName } from \"./utils\";\n\nexport interface CompactInputProps {\n  count: number;\n  page: number;\n  onPageChange: (page: number) => void;\n  FormFieldProps?: Partial<FormFieldProps>;\n}\n\nexport const CompactInput = ({\n  page,\n  count,\n  onPageChange,\n  FormFieldProps: { className, ...restFormFieldProps } = {},\n}: CompactInputProps) => {\n  const [inputValue, setInputValue] = useState(`${page}`);\n\n  useEffect(() => {\n    setInputValue(`${page}`);\n  }, [page]);\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    setInputValue(event.target.value);\n  };\n\n  const handleKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n    if (event.key === \"Enter\") {\n      const pageValue = Number(inputValue);\n      if (!isNaN(pageValue) && pageValue <= count && pageValue > 0) {\n        onPageChange(pageValue);\n      } else {\n        setInputValue(`${page}`);\n      }\n    }\n  };\n\n  const handleBlur = () => {\n    setInputValue(`${page}`);\n  };\n\n  return (\n    <span>\n      <FormField\n        className={clsx(withBaseName(\"compactInputField\"), className)}\n        fullWidth={false}\n        {...restFormFieldProps}\n      >\n        <Input\n          className={clsx(withBaseName(\"compactInput\"), {\n            [withBaseName(\"compactInputFixed\")]: count < 100,\n          })}\n          highlightOnFocus\n          inputProps={{\n            \"aria-label\": `Go to page, ${count} total`,\n            style: { width: `${`${count}`.length}ch` },\n            role: \"textbox\",\n          }}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          value={inputValue}\n          textAlign={\"center\"}\n        />\n      </FormField>\n    </span>\n  );\n};\n"],"names":["useState","useEffect","jsx","FormField","clsx","withBaseName","Input"],"mappings":";;;;;;;;;;;;;AAkBO,MAAM,eAAe,CAAC;AAAA,EAC3B,IAAA;AAAA,EACA,KAAA;AAAA,EACA,YAAA;AAAA,EACA,cAAgB,EAAA,EAAE,SAAc,EAAA,GAAA,kBAAA,KAAuB,EAAC;AAC1D,CAAyB,KAAA;AACvB,EAAA,MAAM,CAAC,UAAY,EAAA,aAAa,CAAI,GAAAA,cAAA,CAAS,GAAG,IAAM,CAAA,CAAA,CAAA,CAAA;AAEtD,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,aAAA,CAAc,GAAG,IAAM,CAAA,CAAA,CAAA,CAAA;AAAA,GACzB,EAAG,CAAC,IAAI,CAAC,CAAA,CAAA;AAET,EAAM,MAAA,YAAA,GAAqD,CAAC,KAAU,KAAA;AACpE,IAAc,aAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA,CAAA;AAAA,GAClC,CAAA;AAEA,EAAM,MAAA,aAAA,GAAwD,CAAC,KAAU,KAAA;AACvE,IAAI,IAAA,KAAA,CAAM,QAAQ,OAAS,EAAA;AACzB,MAAM,MAAA,SAAA,GAAY,OAAO,UAAU,CAAA,CAAA;AACnC,MAAA,IAAI,CAAC,KAAM,CAAA,SAAS,KAAK,SAAa,IAAA,KAAA,IAAS,YAAY,CAAG,EAAA;AAC5D,QAAA,YAAA,CAAa,SAAS,CAAA,CAAA;AAAA,OACjB,MAAA;AACL,QAAA,aAAA,CAAc,GAAG,IAAM,CAAA,CAAA,CAAA,CAAA;AAAA,OACzB;AAAA,KACF;AAAA,GACF,CAAA;AAEA,EAAA,MAAM,aAAa,MAAM;AACvB,IAAA,aAAA,CAAc,GAAG,IAAM,CAAA,CAAA,CAAA,CAAA;AAAA,GACzB,CAAA;AAEA,EAAA,uBACGC,cAAA,CAAA,MAAA,EAAA;AAAA,IACC,QAAC,kBAAAA,cAAA,CAAAC,mBAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA,CAAKC,kBAAa,CAAA,mBAAmB,GAAG,SAAS,CAAA;AAAA,MAC5D,SAAW,EAAA,KAAA;AAAA,MACV,GAAG,kBAAA;AAAA,MAEJ,QAAC,kBAAAH,cAAA,CAAAI,WAAA,EAAA;AAAA,QACC,SAAW,EAAAF,SAAA,CAAKC,kBAAa,CAAA,cAAc,CAAG,EAAA;AAAA,UAC5C,CAACA,kBAAA,CAAa,mBAAmB,CAAA,GAAI,KAAQ,GAAA,GAAA;AAAA,SAC9C,CAAA;AAAA,QACD,gBAAgB,EAAA,IAAA;AAAA,QAChB,UAAY,EAAA;AAAA,UACV,cAAc,CAAe,YAAA,EAAA,KAAA,CAAA,MAAA,CAAA;AAAA,UAC7B,OAAO,EAAE,KAAA,EAAO,CAAG,EAAA,CAAA,EAAG,QAAQ,MAAW,CAAA,EAAA,CAAA,EAAA;AAAA,UACzC,IAAM,EAAA,SAAA;AAAA,SACR;AAAA,QACA,MAAQ,EAAA,UAAA;AAAA,QACR,QAAU,EAAA,YAAA;AAAA,QACV,SAAW,EAAA,aAAA;AAAA,QACX,KAAO,EAAA,UAAA;AAAA,QACP,SAAW,EAAA,QAAA;AAAA,OACb,CAAA;AAAA,KACF,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}

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

@@ -1,99 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('react/jsx-runtime');
-var clsx = require('clsx');
-var React = require('react');
-var core = require('@salt-ds/core');
-var usePaginationContext = require('./usePaginationContext.js');
-var utils = require('./utils.js');
-var FormField = require('../form-field/FormField.js');
-require('../form-field/FormLabel.js');
-var Input = require('../input/Input.js');
-require('../input/StaticInputAdornment.js');
-
-const GoToInput = React.forwardRef(
-  ({
-    className,
-    id: idProp,
-    label = "Go to",
-    FormFieldProps: { ...restFormFieldProps } = {},
-    ...restProps
-  }, forwardedRef) => {
-    const { compact, count, onPageChange, paginatorElement } = usePaginationContext.usePaginationContext();
-    const id = core.useId(idProp);
-    const rootRef = React.useRef(null);
-    const forkedRef = core.useForkRef(rootRef, forwardedRef);
-    const [inputValue, setInputValue] = React.useState("");
-    const onChange = React.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 = React.useCallback(() => {
-      setInputValue("");
-    }, [setInputValue]);
-    React.useEffect(() => {
-      if (compact) {
-        setInputValue("");
-      }
-    }, [compact]);
-    const [position, setPosition] = React.useState();
-    core.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__ */ jsxRuntime.jsx("span", {
-      className: clsx.clsx(
-        utils.withBaseName("goToInputWrapper"),
-        { [utils.withBaseName(`${position}GoToInput`)]: position },
-        className
-      ),
-      ref: forkedRef,
-      children: /* @__PURE__ */ jsxRuntime.jsx(FormField.FormField, {
-        className: utils.withBaseName("goToInputField"),
-        fullWidth: false,
-        label,
-        labelPlacement: "left",
-        ...restFormFieldProps,
-        children: /* @__PURE__ */ jsxRuntime.jsx(Input.Input, {
-          className: clsx.clsx(utils.withBaseName("goToInput"), {
-            [utils.withBaseName("goToInputFixed")]: count < 100
-          }),
-          id,
-          inputProps: {
-            "aria-labelledby": id,
-            "aria-label": `Page, ${count} total`,
-            style: { width: widthCh }
-          },
-          onBlur,
-          onChange,
-          onKeyDown,
-          value: inputValue,
-          textAlign: "center"
-        })
-      })
-    });
-  }
-);
-
-exports.GoToInput = GoToInput;
-//# sourceMappingURL=GoToInput.js.map

package/dist-cjs/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":["forwardRef","usePaginationContext","useId","useRef","useForkRef","useState","useCallback","useEffect","useIsomorphicLayoutEffect","jsx","clsx","withBaseName","FormField","Input"],"mappings":"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"}

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

@@ -1,9 +0,0 @@
-'use strict';
-
-var styleInject_es = require('../../../../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_es(css_248z);
-
-module.exports = css_248z;
-//# sourceMappingURL=Pagination.css.js.map

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

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

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

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

package/dist-cjs/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":["forwardRef","FormFieldProps","usePaginationContext","useForkRef","useCallback","jsxs","clsx","withBaseName","jsx","ArrowButton","ChevronLeftIcon","CompactControls","RegularControls","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;;;AAoBO,MAAM,SAAY,GAAAA,gBAAA;AAAA,EACvB,CACE;AAAA,IACE,SAAA;AAAA,IACA,aAAA;AAAA,IACA,YAAA;AAAA,IACA,gBAAmB,GAAA,IAAA;AAAA,IACnB,cAAAC,EAAAA,eAAAA;AAAA,IACG,GAAA,SAAA;AAAA,KAEL,YACG,KAAA;AACH,IAAA,MAAM,EAAE,KAAO,EAAA,IAAA,EAAM,cAAc,OAAS,EAAA,mBAAA,KAC1CC,yCAAqB,EAAA,CAAA;AAEvB,IAAM,MAAA,GAAA,GAAMC,eAAW,CAAA,mBAAA,EAAqB,YAAY,CAAA,CAAA;AAExD,IAAM,MAAA,cAAA,GAAiBC,kBAAY,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,GAAaA,kBAAY,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,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAW,EAAAC,SAAA,CAAKC,kBAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAI,GAAG,SAAA;AAAA,MAAW,GAAA;AAAA,MAC7D,QAAA,EAAA;AAAA,QAAA,gBAAA,oBACEC,cAAA,CAAAC,uBAAA,EAAA;AAAA,UACC,eAAgB,EAAA,UAAA;AAAA,UAChB,OAAS,EAAA,cAAA;AAAA,UACT,QAAU,EAAA,aAAA;AAAA,UAEV,yCAACC,qBAAgB,EAAA,EAAA,CAAA;AAAA,SACnB,CAAA;AAAA,QAED,0BACEF,cAAA,CAAAG,+BAAA,EAAA;AAAA,UACC,KAAA;AAAA,UACA,IAAA;AAAA,UACA,YAAA;AAAA,UACA,cAAgBV,EAAAA,eAAAA;AAAA,SAClB,oBAECO,cAAA,CAAAI,+BAAA,EAAA;AAAA,UACC,KAAA;AAAA,UACA,IAAA;AAAA,UACA,YAAA;AAAA,UACA,YAAA;AAAA,UACA,aAAA;AAAA,SACF,CAAA;AAAA,QAED,oCACEJ,cAAA,CAAAC,uBAAA,EAAA;AAAA,UACC,eAAgB,EAAA,MAAA;AAAA,UAChB,OAAS,EAAA,UAAA;AAAA,UACT,QAAU,EAAA,YAAA;AAAA,UAEV,yCAACI,sBAAiB,EAAA,EAAA,CAAA;AAAA,SACpB,CAAA;AAAA,OAAA;AAAA,KAEJ,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

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

@@ -1,9 +0,0 @@
-'use strict';
-
-var styleInject_es = require('../../../../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_es(css_248z);
-
-module.exports = css_248z;
-//# sourceMappingURL=ParentChildItem.css.js.map

package/dist-cjs/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-cjs/packages/lab/src/parent-child-item/ParentChildItem.js

@@ -1,36 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var clsx = require('clsx');
-var core = require('@salt-ds/core');
-require('./ParentChildItem.css.js');
-
-const withBaseName = core.makePrefixer("saltParentChildItem");
-const ParentChildItem = React.forwardRef(
-  function ParentChildItem2({
-    disableAnimations = false,
-    direction,
-    isStacked,
-    children,
-    className,
-    ...rest
-  }, ref) {
-    return /* @__PURE__ */ jsxRuntime.jsx(core.FlexItem, {
-      className: clsx.clsx(className, withBaseName(), {
-        ...direction && {
-          [withBaseName(`slide-${direction}`)]: !disableAnimations
-        },
-        "saltFlexItem-stacked": isStacked
-      }),
-      ref,
-      ...rest,
-      children
-    });
-  }
-);
-
-exports.ParentChildItem = ParentChildItem;
-//# sourceMappingURL=ParentChildItem.js.map

package/dist-cjs/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":["makePrefixer","forwardRef","ParentChildItem","jsx","FlexItem","clsx"],"mappings":";;;;;;;;;;AAwCA,MAAM,YAAA,GAAeA,kBAAa,qBAAqB,CAAA,CAAA;AAChD,MAAM,eAAkB,GAAAC,gBAAA;AAAA,EAC7B,SAASC,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,uBACGC,cAAA,CAAAC,aAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA,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-cjs/packages/lab/src/parent-child-layout/ParentChildLayout.css.js

@@ -1,9 +0,0 @@
-'use strict';
-
-var styleInject_es = require('../../../../node_modules/style-inject/dist/style-inject.es.js');
-
-var css_248z = ".saltParentChildLayout {\n}\n";
-styleInject_es(css_248z);
-
-module.exports = css_248z;
-//# sourceMappingURL=ParentChildLayout.css.js.map

package/dist-cjs/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-cjs/packages/lab/src/parent-child-layout/ParentChildLayout.js

@@ -1,80 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var clsx = require('clsx');
-var React = require('react');
-var ParentChildItem = require('../parent-child-item/ParentChildItem.js');
-require('../utils/useFloatingUI.js');
-var useIsViewportLargerThanBreakpoint = require('../utils/useIsViewportLargerThanBreakpoint.js');
-require('./ParentChildLayout.css.js');
-
-const withBaseName = core.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 = React.forwardRef(function ParentChildLayout2({
-  stackedAtBreakpoint = "sm",
-  stackedViewElement = "parent",
-  disableAnimations = false,
-  parent,
-  child,
-  className,
-  orientation = "horizontal",
-  ...rest
-}, ref) {
-  const stackedView = useIsViewportLargerThanBreakpoint.useIsViewportLargerThanBreakpoint(stackedAtBreakpoint);
-  const parentChildDirection = getDirection(orientation, stackedViewElement);
-  const stackedViewChildren = {
-    parent: /* @__PURE__ */ jsxRuntime.jsx(ParentChildItem.ParentChildItem, {
-      disableAnimations,
-      direction: parentChildDirection,
-      isStacked: stackedView,
-      children: parent
-    }),
-    child: /* @__PURE__ */ jsxRuntime.jsx(ParentChildItem.ParentChildItem, {
-      disableAnimations,
-      direction: parentChildDirection,
-      isStacked: stackedView,
-      children: child
-    })
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(core.FlexLayout, {
-    className: clsx.clsx(className, withBaseName()),
-    ref,
-    ...rest,
-    children: stackedView ? stackedViewChildren[stackedViewElement] : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ParentChildItem.ParentChildItem, {
-          grow: 0,
-          disableAnimations,
-          children: parent
-        }),
-        /* @__PURE__ */ jsxRuntime.jsx(ParentChildItem.ParentChildItem, {
-          grow: 2,
-          disableAnimations,
-          children: child
-        })
-      ]
-    })
-  });
-});
-
-exports.ParentChildLayout = ParentChildLayout;
-//# sourceMappingURL=ParentChildLayout.js.map

package/dist-cjs/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":["makePrefixer","forwardRef","ParentChildLayout","useIsViewportLargerThanBreakpoint","jsx","ParentChildItem","FlexLayout","clsx","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;AAiDA,MAAM,YAAA,GAAeA,kBAAa,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,GAAoBC,gBAG/B,CAAA,SAASC,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,GAAcC,oEAAkC,mBAAmB,CAAA,CAAA;AAEzE,EAAM,MAAA,oBAAA,GAAuB,YAAa,CAAA,WAAA,EAAa,kBAAkB,CAAA,CAAA;AAEzE,EAAA,MAAM,mBAAsB,GAAA;AAAA,IAC1B,wBACGC,cAAA,CAAAC,+BAAA,EAAA;AAAA,MACC,iBAAA;AAAA,MACA,SAAW,EAAA,oBAAA;AAAA,MACX,SAAW,EAAA,WAAA;AAAA,MAEV,QAAA,EAAA,MAAA;AAAA,KACH,CAAA;AAAA,IAEF,uBACGD,cAAA,CAAAC,+BAAA,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,uBACGD,cAAA,CAAAE,eAAA,EAAA;AAAA,IAAW,SAAW,EAAAC,SAAA,CAAK,SAAW,EAAA,YAAA,EAAc,CAAA;AAAA,IAAG,GAAA;AAAA,IAAW,GAAG,IAAA;AAAA,IACnE,QAAA,EAAA,WAAA,GACC,oBAAoB,kBAEpB,CAAA,mBAAAC,eAAA,CAAAC,mBAAA,EAAA;AAAA,MACE,QAAA,EAAA;AAAA,wBAACL,cAAA,CAAAC,+BAAA,EAAA;AAAA,UAAgB,IAAM,EAAA,CAAA;AAAA,UAAG,iBAAA;AAAA,UACvB,QAAA,EAAA,MAAA;AAAA,SACH,CAAA;AAAA,wBACCD,cAAA,CAAAC,+BAAA,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-cjs/packages/lab/src/pill/Pill.css.js

@@ -1,9 +0,0 @@
-'use strict';
-
-var styleInject_es = require('../../../../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_es(css_248z);
-
-module.exports = css_248z;
-//# sourceMappingURL=Pill.css.js.map

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

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