@salt-ds/lab 1.0.0-alpha.70 → 1.0.0-alpha.72

package/dist-cjs/carousel/Carousel.js

@@ -1,62 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var clsx = require('clsx');
-var react = require('react');
-var Carousel$1 = require('./Carousel.css.js');
-var CarouselContext = require('./CarouselContext.js');
-
-const withBaseName = core.makePrefixer("saltCarousel");
-const Carousel = react.forwardRef(
-  function Carousel2({
-    defaultActiveSlideIndex = 0,
-    activeSlideIndex,
-    visibleSlides: visibleSlidesProp = 1,
-    children,
-    controlsPlacement = "top",
-    id: idProp,
-    ...rest
-  }, ref) {
-    const targetWindow = window.useWindow();
-    styles.useComponentCssInjection({
-      testId: "salt-carousel",
-      css: Carousel$1,
-      window: targetWindow
-    });
-    const { matchedBreakpoints } = core.useBreakpoint();
-    const visibleSlides = core.resolveResponsiveValue(
-      visibleSlidesProp,
-      matchedBreakpoints
-    );
-    const id = core.useId(idProp);
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      CarouselContext.CarouselProvider,
-      {
-        defaultActiveSlideIndex,
-        activeSlideIndex,
-        visibleSlides,
-        id,
-        children: /* @__PURE__ */ jsxRuntime.jsx(
-          "section",
-          {
-            role: "region",
-            className: clsx.clsx(withBaseName(), {
-              [withBaseName(controlsPlacement)]: controlsPlacement === "bottom"
-            }),
-            "aria-roledescription": "carousel",
-            id,
-            ref,
-            ...rest,
-            children
-          }
-        )
-      }
-    );
-  }
-);
-
-exports.Carousel = Carousel;
-//# sourceMappingURL=Carousel.js.map

package/dist-cjs/carousel/Carousel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Carousel.js","sources":["../src/carousel/Carousel.tsx"],"sourcesContent":["import {\n  type ResponsiveProp,\n  makePrefixer,\n  resolveResponsiveValue,\n  useBreakpoint,\n  useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type HTMLAttributes, forwardRef } from \"react\";\nimport carouselCss from \"./Carousel.css\";\nimport { CarouselProvider } from \"./CarouselContext\";\n\nconst withBaseName = makePrefixer(\"saltCarousel\");\n\nexport interface CarouselProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * The initial Index enables you to select the active slide in the carousel.\n   * Optional, default 0.\n   **/\n  defaultActiveSlideIndex?: number;\n  /**\n   * Controlled index of active slide in the carousel.\n   **/\n  activeSlideIndex?: number;\n  /**\n   * Set the placement of the CarouselControls relative to the CarouselSlider element. Defaults to `top`.\n   */\n  controlsPlacement?: \"top\" | \"bottom\";\n  /**\n   * Number of slides visible at a time.\n   * Optional, default 1.\n   **/\n  visibleSlides?: ResponsiveProp<number>;\n}\n\nexport const Carousel = forwardRef<HTMLDivElement, CarouselProps>(\n  function Carousel(\n    {\n      defaultActiveSlideIndex = 0,\n      activeSlideIndex,\n      visibleSlides: visibleSlidesProp = 1,\n      children,\n      controlsPlacement = \"top\",\n      id: idProp,\n      ...rest\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-carousel\",\n      css: carouselCss,\n      window: targetWindow,\n    });\n    const { matchedBreakpoints } = useBreakpoint();\n\n    const visibleSlides = resolveResponsiveValue(\n      visibleSlidesProp,\n      matchedBreakpoints,\n    );\n    const id = useId(idProp);\n    return (\n      <CarouselProvider\n        defaultActiveSlideIndex={defaultActiveSlideIndex}\n        activeSlideIndex={activeSlideIndex}\n        visibleSlides={visibleSlides}\n        id={id}\n      >\n        <section\n          role=\"region\"\n          className={clsx(withBaseName(), {\n            [withBaseName(controlsPlacement)]: controlsPlacement === \"bottom\",\n          })}\n          aria-roledescription=\"carousel\"\n          id={id}\n          ref={ref}\n          {...rest}\n        >\n          {children}\n        </section>\n      </CarouselProvider>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","Carousel","useWindow","useComponentCssInjection","carouselCss","useBreakpoint","resolveResponsiveValue","useId","jsx","CarouselProvider","clsx"],"mappings":";;;;;;;;;;;AAcA,MAAM,YAAA,GAAeA,kBAAa,cAAc,CAAA;AAuBzC,MAAM,QAAW,GAAAC,gBAAA;AAAA,EACtB,SAASC,SACP,CAAA;AAAA,IACE,uBAA0B,GAAA,CAAA;AAAA,IAC1B,gBAAA;AAAA,IACA,eAAe,iBAAoB,GAAA,CAAA;AAAA,IACnC,QAAA;AAAA,IACA,iBAAoB,GAAA,KAAA;AAAA,IACpB,EAAI,EAAA,MAAA;AAAA,IACJ,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,eAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AACD,IAAM,MAAA,EAAE,kBAAmB,EAAA,GAAIC,kBAAc,EAAA;AAE7C,IAAA,MAAM,aAAgB,GAAAC,2BAAA;AAAA,MACpB,iBAAA;AAAA,MACA;AAAA,KACF;AACA,IAAM,MAAA,EAAA,GAAKC,WAAM,MAAM,CAAA;AACvB,IACE,uBAAAC,cAAA;AAAA,MAACC,gCAAA;AAAA,MAAA;AAAA,QACC,uBAAA;AAAA,QACA,gBAAA;AAAA,QACA,aAAA;AAAA,QACA,EAAA;AAAA,QAEA,QAAA,kBAAAD,cAAA;AAAA,UAAC,SAAA;AAAA,UAAA;AAAA,YACC,IAAK,EAAA,QAAA;AAAA,YACL,SAAA,EAAWE,SAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,cAC9B,CAAC,YAAA,CAAa,iBAAiB,CAAC,GAAG,iBAAsB,KAAA;AAAA,aAC1D,CAAA;AAAA,YACD,sBAAqB,EAAA,UAAA;AAAA,YACrB,EAAA;AAAA,YACA,GAAA;AAAA,YACC,GAAG,IAAA;AAAA,YAEH;AAAA;AAAA;AACH;AAAA,KACF;AAAA;AAGN;;;;"}

package/dist-cjs/carousel/CarouselContext.js

@@ -1,62 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var react = require('react');
-var CarouselReducer = require('./CarouselReducer.js');
-
-const CarouselStateContext = core.createContext(
-  "CarouselStateContext",
-  {
-    slides: /* @__PURE__ */ new Map(),
-    activeSlideIndex: 0,
-    visibleSlides: 1,
-    focusedSlideIndex: 0,
-    carouselId: void 0
-  }
-);
-const CarouselDispatchContext = core.createContext(
-  "CarouselDispatchContext",
-  () => {
-    return;
-  }
-);
-function CarouselProvider({
-  children,
-  activeSlideIndex: activeSlideIndexProp,
-  defaultActiveSlideIndex = 0,
-  visibleSlides = 1,
-  id
-}) {
-  const [activeSlideIndex, setActiveSlideIndex] = core.useControlled({
-    controlled: activeSlideIndexProp,
-    default: defaultActiveSlideIndex,
-    name: "Carousel",
-    state: "activeSlideIndex"
-  });
-  const [state, dispatch] = react.useReducer(CarouselReducer.carouselReducer, {
-    slides: /* @__PURE__ */ new Map(),
-    focusedSlideIndex: activeSlideIndex,
-    activeSlideIndex,
-    visibleSlides,
-    carouselId: id
-  });
-  react.useEffect(() => {
-    dispatch({
-      type: "updateSlideCount",
-      payload: visibleSlides
-    });
-  }, [visibleSlides]);
-  react.useEffect(() => {
-    dispatch({
-      type: "moveToIndex",
-      payload: activeSlideIndex
-    });
-  }, [activeSlideIndex]);
-  return /* @__PURE__ */ jsxRuntime.jsx(CarouselStateContext.Provider, { value: state, children: /* @__PURE__ */ jsxRuntime.jsx(CarouselDispatchContext.Provider, { value: dispatch, children }) });
-}
-
-exports.CarouselDispatchContext = CarouselDispatchContext;
-exports.CarouselProvider = CarouselProvider;
-exports.CarouselStateContext = CarouselStateContext;
-//# sourceMappingURL=CarouselContext.js.map

package/dist-cjs/carousel/CarouselContext.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CarouselContext.js","sources":["../src/carousel/CarouselContext.tsx"],"sourcesContent":["import { createContext, useControlled } from \"@salt-ds/core\";\nimport { type ReactNode, useEffect, useReducer } from \"react\";\nimport {\n  type CarouselReducerDispatch,\n  type CarouselReducerState,\n  carouselReducer,\n} from \"./CarouselReducer\";\n\nexport const CarouselStateContext = createContext<CarouselReducerState>(\n  \"CarouselStateContext\",\n  {\n    slides: new Map(),\n    activeSlideIndex: 0,\n    visibleSlides: 1,\n    focusedSlideIndex: 0,\n    carouselId: undefined,\n  },\n);\nexport const CarouselDispatchContext = createContext<CarouselReducerDispatch>(\n  \"CarouselDispatchContext\",\n  () => {\n    return;\n  },\n);\n\nexport function CarouselProvider({\n  children,\n  activeSlideIndex: activeSlideIndexProp,\n  defaultActiveSlideIndex = 0,\n  visibleSlides = 1,\n  id,\n}: {\n  children: ReactNode;\n  activeSlideIndex?: number;\n  defaultActiveSlideIndex?: number;\n  visibleSlides?: number;\n  id?: string;\n}) {\n  const [activeSlideIndex, setActiveSlideIndex] = useControlled({\n    controlled: activeSlideIndexProp,\n    default: defaultActiveSlideIndex,\n    name: \"Carousel\",\n    state: \"activeSlideIndex\",\n  });\n  const [state, dispatch] = useReducer(carouselReducer, {\n    slides: new Map(),\n    focusedSlideIndex: activeSlideIndex,\n    activeSlideIndex,\n    visibleSlides,\n    carouselId: id,\n  });\n\n  useEffect(() => {\n    dispatch({\n      type: \"updateSlideCount\",\n      payload: visibleSlides,\n    });\n  }, [visibleSlides]);\n\n  useEffect(() => {\n    dispatch({\n      type: \"moveToIndex\",\n      payload: activeSlideIndex,\n    });\n  }, [activeSlideIndex]);\n\n  return (\n    <CarouselStateContext.Provider value={state}>\n      <CarouselDispatchContext.Provider value={dispatch}>\n        {children}\n      </CarouselDispatchContext.Provider>\n    </CarouselStateContext.Provider>\n  );\n}\n"],"names":["createContext","useControlled","useReducer","carouselReducer","useEffect","jsx"],"mappings":";;;;;;;AAQO,MAAM,oBAAuB,GAAAA,kBAAA;AAAA,EAClC,sBAAA;AAAA,EACA;AAAA,IACE,MAAA,sBAAY,GAAI,EAAA;AAAA,IAChB,gBAAkB,EAAA,CAAA;AAAA,IAClB,aAAe,EAAA,CAAA;AAAA,IACf,iBAAmB,EAAA,CAAA;AAAA,IACnB,UAAY,EAAA;AAAA;AAEhB;AACO,MAAM,uBAA0B,GAAAA,kBAAA;AAAA,EACrC,yBAAA;AAAA,EACA,MAAM;AACJ,IAAA;AAAA;AAEJ;AAEO,SAAS,gBAAiB,CAAA;AAAA,EAC/B,QAAA;AAAA,EACA,gBAAkB,EAAA,oBAAA;AAAA,EAClB,uBAA0B,GAAA,CAAA;AAAA,EAC1B,aAAgB,GAAA,CAAA;AAAA,EAChB;AACF,CAMG,EAAA;AACD,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAIC,kBAAc,CAAA;AAAA,IAC5D,UAAY,EAAA,oBAAA;AAAA,IACZ,OAAS,EAAA,uBAAA;AAAA,IACT,IAAM,EAAA,UAAA;AAAA,IACN,KAAO,EAAA;AAAA,GACR,CAAA;AACD,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIC,iBAAWC,+BAAiB,EAAA;AAAA,IACpD,MAAA,sBAAY,GAAI,EAAA;AAAA,IAChB,iBAAmB,EAAA,gBAAA;AAAA,IACnB,gBAAA;AAAA,IACA,aAAA;AAAA,IACA,UAAY,EAAA;AAAA,GACb,CAAA;AAED,EAAAC,eAAA,CAAU,MAAM;AACd,IAAS,QAAA,CAAA;AAAA,MACP,IAAM,EAAA,kBAAA;AAAA,MACN,OAAS,EAAA;AAAA,KACV,CAAA;AAAA,GACH,EAAG,CAAC,aAAa,CAAC,CAAA;AAElB,EAAAA,eAAA,CAAU,MAAM;AACd,IAAS,QAAA,CAAA;AAAA,MACP,IAAM,EAAA,aAAA;AAAA,MACN,OAAS,EAAA;AAAA,KACV,CAAA;AAAA,GACH,EAAG,CAAC,gBAAgB,CAAC,CAAA;AAErB,EAAA,uBACGC,cAAA,CAAA,oBAAA,CAAqB,QAArB,EAAA,EAA8B,KAAO,EAAA,KAAA,EACpC,QAAC,kBAAAA,cAAA,CAAA,uBAAA,CAAwB,QAAxB,EAAA,EAAiC,KAAO,EAAA,QAAA,EACtC,UACH,CACF,EAAA,CAAA;AAEJ;;;;;;"}

package/dist-cjs/carousel/CarouselControls.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var css_248z = ".saltCarouselControls {\n  display: flex;\n  gap: var(--salt-spacing-100);\n  align-items: center;\n  grid-area: controls;\n}\n.saltCarouselControls-container {\n  display: flex;\n  flex-flow: wrap;\n  align-items: center;\n  gap: var(--salt-spacing-100);\n  justify-content: space-between;\n}\n.saltCarouselControls-container:last-child {\n  margin-left: auto;\n}\n.saltCarouselControls-container h2 {\n  margin: 0;\n}\n\n.saltCarouselControls-sr-only {\n  display: none;\n}\n.saltCarouselControls:focus-within .saltCarouselControls-sr-only {\n  display: block;\n  position: fixed;\n  top: 0;\n  left: 0;\n  transform: translate(-100%, -100%);\n}\n";
-
-module.exports = css_248z;
-//# sourceMappingURL=CarouselControls.css.js.map

package/dist-cjs/carousel/CarouselControls.css.js.map

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

package/dist-cjs/carousel/CarouselControls.js

@@ -1,122 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var react = require('react');
-var CarouselContext = require('./CarouselContext.js');
-var CarouselControls$1 = require('./CarouselControls.css.js');
-
-const withBaseName = core.makePrefixer("saltCarouselControls");
-const CarouselControls = react.forwardRef(function CarouselControls2({
-  onPrevious,
-  onNext,
-  disabled,
-  className,
-  title,
-  labelPlacement = "right",
-  ...rest
-}, ref) {
-  var _a;
-  const targetWindow = window.useWindow();
-  styles.useComponentCssInjection({
-    testId: "salt-carousel-controls",
-    css: CarouselControls$1,
-    window: targetWindow
-  });
-  const { slides, carouselId, activeSlideIndex, visibleSlides } = react.useContext(CarouselContext.CarouselStateContext);
-  const dispatch = react.useContext(CarouselContext.CarouselDispatchContext);
-  const slideCount = slides.size;
-  const { NextIcon, PreviousIcon } = core.useIcon();
-  const [isFocused, setIsFocused] = react.useState(false);
-  function handleFocusCapture() {
-    !isFocused && setIsFocused(true);
-  }
-  function handleBlurCapture() {
-    isFocused && setIsFocused(false);
-  }
-  const prevButtonRef = react.useRef(null);
-  const nextButtonRef = react.useRef(null);
-  const slideIds = [...slides.keys()];
-  const currentId = slideIds[activeSlideIndex] || null;
-  const prevId = slideIds[activeSlideIndex - 1] || null;
-  const nextId = slideIds[activeSlideIndex + 1] || null;
-  const isOnFirstSlide = activeSlideIndex === 0;
-  const isOnLastSlide = activeSlideIndex === slideCount - visibleSlides;
-  const isAnnouncerOn = nextButtonRef.current === document.activeElement || prevButtonRef.current === document.activeElement;
-  const currentSlideDescription = visibleSlides === 1 && currentId && ((_a = slides.get(currentId)) == null ? void 0 : _a.slideDescription) || void 0;
-  const controlsLabel = slideCount >= 1 && /* @__PURE__ */ jsxRuntime.jsx(
-    core.Text,
-    {
-      as: "span",
-      "aria-live": isAnnouncerOn ? "polite" : void 0,
-      "aria-atomic": "false",
-      children: /* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
-        `${activeSlideIndex + 1} ${visibleSlides > 1 && slideCount > 1 ? ` - ${activeSlideIndex + visibleSlides}` : ""} of
-        ${slideCount}`,
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "saltCarouselControls-sr-only", children: currentSlideDescription })
-      ] })
-    }
-  );
-  function handlePrevClick(event) {
-    if (!prevId) return;
-    dispatch({ type: "scroll", payload: prevId });
-    onPrevious == null ? void 0 : onPrevious(event, slideIds.indexOf(prevId));
-  }
-  function handleNextClick(event) {
-    if (!nextId) return;
-    dispatch({ type: "scroll", payload: nextId });
-    onNext == null ? void 0 : onNext(event, slideIds.indexOf(nextId));
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: withBaseName("container"), ref, ...rest, children: [
-    title,
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: withBaseName(),
-        ref,
-        ...rest,
-        onFocusCapture: handleFocusCapture,
-        onBlurCapture: handleBlurCapture,
-        children: [
-          (labelPlacement === "left" || title) && controlsLabel,
-          /* @__PURE__ */ jsxRuntime.jsx(
-            core.Button,
-            {
-              ref: prevButtonRef,
-              focusableWhenDisabled: true,
-              appearance: "bordered",
-              sentiment: "neutral",
-              className: withBaseName("prev-button"),
-              onClick: handlePrevClick,
-              disabled: isOnFirstSlide || disabled,
-              "aria-controls": carouselId,
-              "aria-label": `Previous slide${visibleSlides > 1 ? "s" : ""}`,
-              children: /* @__PURE__ */ jsxRuntime.jsx(PreviousIcon, { "aria-hidden": true })
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            core.Button,
-            {
-              ref: nextButtonRef,
-              focusableWhenDisabled: true,
-              appearance: "bordered",
-              sentiment: "neutral",
-              className: withBaseName("next-button"),
-              onClick: handleNextClick,
-              disabled: isOnLastSlide || disabled,
-              "aria-controls": carouselId,
-              "aria-label": `Next slide${visibleSlides > 1 ? "s" : ""}`,
-              children: /* @__PURE__ */ jsxRuntime.jsx(NextIcon, { "aria-hidden": true })
-            }
-          ),
-          labelPlacement === "right" && !title && controlsLabel
-        ]
-      }
-    )
-  ] });
-});
-
-exports.CarouselControls = CarouselControls;
-//# sourceMappingURL=CarouselControls.js.map

package/dist-cjs/carousel/CarouselControls.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CarouselControls.js","sources":["../src/carousel/CarouselControls.tsx"],"sourcesContent":["import { Button, Text, makePrefixer, useIcon } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n  type HTMLAttributes,\n  type MouseEvent,\n  type ReactNode,\n  type SyntheticEvent,\n  forwardRef,\n  useContext,\n  useRef,\n  useState,\n} from \"react\";\nimport {\n  CarouselDispatchContext,\n  CarouselStateContext,\n} from \"./CarouselContext\";\n\nimport carouselControlsCss from \"./CarouselControls.css\";\n\nconst withBaseName = makePrefixer(\"saltCarouselControls\");\n\nexport interface CarouselControlsProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  /**\n   * Callback when Back button is clicked.\n   */\n  onPrevious?: (\n    event: SyntheticEvent<HTMLButtonElement>,\n    index: number,\n  ) => void;\n  /**\n   * Callback when Next button is clicked.\n   */\n  onNext?: (event: SyntheticEvent<HTMLButtonElement>, index: number) => void;\n  /**\n   * Location of the label relative to the controls.\n   *\n   * Either 'left', or 'right'`.\n   */\n  labelPlacement?: \"left\" | \"right\";\n  /**\n   * If `true`, the carousel controls will be disabled.\n   * **/\n  disabled?: boolean;\n  /**\n   * The title of the carousel that accompanies the controls.\n   */\n  title?: ReactNode;\n}\n\nexport const CarouselControls = forwardRef<\n  HTMLDivElement,\n  CarouselControlsProps\n>(function CarouselControls(\n  {\n    onPrevious,\n    onNext,\n    disabled,\n    className,\n    title,\n    labelPlacement = \"right\",\n    ...rest\n  },\n  ref,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-carousel-controls\",\n    css: carouselControlsCss,\n    window: targetWindow,\n  });\n  const { slides, carouselId, activeSlideIndex, visibleSlides } =\n    useContext(CarouselStateContext);\n  const dispatch = useContext(CarouselDispatchContext);\n\n  const slideCount = slides.size;\n  const { NextIcon, PreviousIcon } = useIcon();\n\n  const [isFocused, setIsFocused] = useState(false);\n  function handleFocusCapture() {\n    !isFocused && setIsFocused(true);\n  }\n  function handleBlurCapture() {\n    isFocused && setIsFocused(false);\n  }\n\n  const prevButtonRef = useRef<HTMLButtonElement>(null);\n  const nextButtonRef = useRef<HTMLButtonElement>(null);\n  const slideIds = [...slides.keys()];\n\n  const currentId = slideIds[activeSlideIndex] || null;\n  const prevId = slideIds[activeSlideIndex - 1] || null;\n  const nextId = slideIds[activeSlideIndex + 1] || null;\n\n  const isOnFirstSlide = activeSlideIndex === 0;\n  const isOnLastSlide = activeSlideIndex === slideCount - visibleSlides;\n\n  const isAnnouncerOn =\n    nextButtonRef.current === document.activeElement ||\n    prevButtonRef.current === document.activeElement;\n\n  const currentSlideDescription =\n    (visibleSlides === 1 &&\n      currentId &&\n      slides.get(currentId)?.slideDescription) ||\n    undefined;\n\n  const controlsLabel = slideCount >= 1 && (\n    <Text\n      as=\"span\"\n      aria-live={isAnnouncerOn ? \"polite\" : undefined}\n      aria-atomic=\"false\"\n    >\n      <strong>\n        {`${activeSlideIndex + 1} ${visibleSlides > 1 && slideCount > 1 ? ` - ${activeSlideIndex + visibleSlides}` : \"\"} of\n        ${slideCount}`}\n\n        {\n          <span className=\"saltCarouselControls-sr-only\">\n            {currentSlideDescription}\n          </span>\n        }\n      </strong>\n    </Text>\n  );\n\n  function handlePrevClick(event: MouseEvent<HTMLButtonElement>) {\n    if (!prevId) return;\n    dispatch({ type: \"scroll\", payload: prevId });\n    onPrevious?.(event, slideIds.indexOf(prevId));\n  }\n\n  function handleNextClick(event: MouseEvent<HTMLButtonElement>) {\n    if (!nextId) return;\n    dispatch({ type: \"scroll\", payload: nextId });\n    onNext?.(event, slideIds.indexOf(nextId));\n  }\n\n  return (\n    <div className={withBaseName(\"container\")} ref={ref} {...rest}>\n      {title}\n      <div\n        className={withBaseName()}\n        ref={ref}\n        {...rest}\n        onFocusCapture={handleFocusCapture}\n        onBlurCapture={handleBlurCapture}\n      >\n        {(labelPlacement === \"left\" || title) && controlsLabel}\n        <Button\n          ref={prevButtonRef}\n          focusableWhenDisabled\n          appearance=\"bordered\"\n          sentiment=\"neutral\"\n          className={withBaseName(\"prev-button\")}\n          onClick={handlePrevClick}\n          disabled={isOnFirstSlide || disabled}\n          aria-controls={carouselId}\n          aria-label={`Previous slide${visibleSlides > 1 ? \"s\" : \"\"}`}\n        >\n          <PreviousIcon aria-hidden />\n        </Button>\n        <Button\n          ref={nextButtonRef}\n          focusableWhenDisabled\n          appearance=\"bordered\"\n          sentiment=\"neutral\"\n          className={withBaseName(\"next-button\")}\n          onClick={handleNextClick}\n          disabled={isOnLastSlide || disabled}\n          aria-controls={carouselId}\n          aria-label={`Next slide${visibleSlides > 1 ? \"s\" : \"\"}`}\n        >\n          <NextIcon aria-hidden />\n        </Button>\n        {labelPlacement === \"right\" && !title && controlsLabel}\n      </div>\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","CarouselControls","useWindow","useComponentCssInjection","carouselControlsCss","useContext","CarouselStateContext","CarouselDispatchContext","useIcon","useState","useRef","jsx","Text","jsxs","Button"],"mappings":"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"}

package/dist-cjs/carousel/CarouselReducer.js

@@ -1,77 +0,0 @@
-'use strict';
-
-function carouselReducer(state, action) {
-  switch (action.type) {
-    case "register": {
-      const { slides } = state;
-      const [id, { element, slideDescription }] = action.payload;
-      const newSlides = new Map(slides);
-      newSlides.set(id, { element, slideDescription });
-      return {
-        ...state,
-        slides: newSlides
-      };
-    }
-    case "unregister": {
-      const { slides } = state;
-      const id = action.payload;
-      if (!slides.has(id)) {
-        return state;
-      }
-      const newSlides = new Map(slides);
-      newSlides.delete(id);
-      return {
-        ...state,
-        slides: newSlides
-      };
-    }
-    // moves the first visible item
-    case "move": {
-      const { slides } = state;
-      const id = action.payload;
-      if (!slides.has(id)) {
-        return state;
-      }
-      const slideIds = [...slides.keys()];
-      const index = slideIds.indexOf(id || slideIds[0]);
-      return {
-        ...state,
-        activeSlideIndex: index
-      };
-    }
-    case "moveToIndex": {
-      const { slides } = state;
-      const index = action.payload;
-      if (index === -1 || index > slides.size) {
-        return state;
-      }
-      return {
-        ...state,
-        focusedSlideIndex: index
-      };
-    }
-    case "updateSlideCount": {
-      const visibleSlides = action.payload;
-      return { ...state, visibleSlides };
-    }
-    case "scroll": {
-      const id = action.payload;
-      const { slides } = state;
-      const focusedSlideIndex = [...slides.keys()].indexOf(id);
-      if (focusedSlideIndex === -1) {
-        return state;
-      }
-      return {
-        ...state,
-        focusedSlideIndex
-      };
-    }
-    default: {
-      const exhaustiveCheck = action;
-      throw new Error(`Action of type ${exhaustiveCheck} does not exist`);
-    }
-  }
-}
-
-exports.carouselReducer = carouselReducer;
-//# sourceMappingURL=CarouselReducer.js.map

package/dist-cjs/carousel/CarouselReducer.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CarouselReducer.js","sources":["../src/carousel/CarouselReducer.ts"],"sourcesContent":["import type { Dispatch } from \"react\";\n\nimport type { CarouselSlideId, CarouselSlideMeta } from \"./CarouselSlide\";\n\nexport interface CarouselReducerState {\n  slides: Map<CarouselSlideId, CarouselSlideMeta>;\n  activeSlideIndex: number;\n  visibleSlides: number;\n  focusedSlideIndex: number;\n  carouselId?: string;\n}\nexport type CarouselReducerAction =\n  | { type: \"register\"; payload: [CarouselSlideId, CarouselSlideMeta] }\n  | { type: \"unregister\"; payload: CarouselSlideId }\n  | { type: \"updateSlideCount\"; payload: number }\n  | { type: \"move\"; payload: CarouselSlideId }\n  | { type: \"moveToIndex\"; payload: number }\n  | { type: \"scroll\"; payload: CarouselSlideId };\n\nexport type CarouselReducerDispatch = Dispatch<CarouselReducerAction>;\n\nexport function carouselReducer(\n  state: CarouselReducerState,\n  action: CarouselReducerAction,\n) {\n  switch (action.type) {\n    case \"register\": {\n      const { slides } = state;\n      const [id, { element, slideDescription }] = action.payload;\n      const newSlides = new Map(slides);\n      newSlides.set(id, { element, slideDescription });\n      return {\n        ...state,\n        slides: newSlides,\n      };\n    }\n    case \"unregister\": {\n      const { slides } = state;\n      const id = action.payload;\n      if (!slides.has(id)) {\n        return state;\n      }\n      const newSlides = new Map(slides);\n      newSlides.delete(id);\n      return {\n        ...state,\n        slides: newSlides,\n      };\n    }\n    // moves the first visible item\n    case \"move\": {\n      const { slides } = state;\n      const id = action.payload;\n      if (!slides.has(id)) {\n        return state;\n      }\n      const slideIds = [...slides.keys()];\n      const index = slideIds.indexOf(id || slideIds[0]);\n      return {\n        ...state,\n        activeSlideIndex: index,\n      };\n    }\n    case \"moveToIndex\": {\n      const { slides } = state;\n\n      const index = action.payload;\n\n      if (index === -1 || index > slides.size) {\n        return state;\n      }\n\n      return {\n        ...state,\n        focusedSlideIndex: index,\n      };\n    }\n    case \"updateSlideCount\": {\n      const visibleSlides = action.payload;\n\n      return { ...state, visibleSlides: visibleSlides };\n    }\n\n    case \"scroll\": {\n      const id = action.payload;\n      const { slides } = state;\n\n      const focusedSlideIndex = [...slides.keys()].indexOf(id);\n\n      if (focusedSlideIndex === -1) {\n        return state;\n      }\n\n      return {\n        ...state,\n        focusedSlideIndex,\n      };\n    }\n    default: {\n      const exhaustiveCheck: never = action;\n      throw new Error(`Action of type ${exhaustiveCheck} does not exist`);\n    }\n  }\n}\n"],"names":[],"mappings":";;AAqBgB,SAAA,eAAA,CACd,OACA,MACA,EAAA;AACA,EAAA,QAAQ,OAAO,IAAM;AAAA,IACnB,KAAK,UAAY,EAAA;AACf,MAAM,MAAA,EAAE,QAAW,GAAA,KAAA;AACnB,MAAA,MAAM,CAAC,EAAI,EAAA,EAAE,SAAS,gBAAiB,EAAC,IAAI,MAAO,CAAA,OAAA;AACnD,MAAM,MAAA,SAAA,GAAY,IAAI,GAAA,CAAI,MAAM,CAAA;AAChC,MAAA,SAAA,CAAU,GAAI,CAAA,EAAA,EAAI,EAAE,OAAA,EAAS,kBAAkB,CAAA;AAC/C,MAAO,OAAA;AAAA,QACL,GAAG,KAAA;AAAA,QACH,MAAQ,EAAA;AAAA,OACV;AAAA;AACF,IACA,KAAK,YAAc,EAAA;AACjB,MAAM,MAAA,EAAE,QAAW,GAAA,KAAA;AACnB,MAAA,MAAM,KAAK,MAAO,CAAA,OAAA;AAClB,MAAA,IAAI,CAAC,MAAA,CAAO,GAAI,CAAA,EAAE,CAAG,EAAA;AACnB,QAAO,OAAA,KAAA;AAAA;AAET,MAAM,MAAA,SAAA,GAAY,IAAI,GAAA,CAAI,MAAM,CAAA;AAChC,MAAA,SAAA,CAAU,OAAO,EAAE,CAAA;AACnB,MAAO,OAAA;AAAA,QACL,GAAG,KAAA;AAAA,QACH,MAAQ,EAAA;AAAA,OACV;AAAA;AACF;AAAA,IAEA,KAAK,MAAQ,EAAA;AACX,MAAM,MAAA,EAAE,QAAW,GAAA,KAAA;AACnB,MAAA,MAAM,KAAK,MAAO,CAAA,OAAA;AAClB,MAAA,IAAI,CAAC,MAAA,CAAO,GAAI,CAAA,EAAE,CAAG,EAAA;AACnB,QAAO,OAAA,KAAA;AAAA;AAET,MAAA,MAAM,QAAW,GAAA,CAAC,GAAG,MAAA,CAAO,MAAM,CAAA;AAClC,MAAA,MAAM,QAAQ,QAAS,CAAA,OAAA,CAAQ,EAAM,IAAA,QAAA,CAAS,CAAC,CAAC,CAAA;AAChD,MAAO,OAAA;AAAA,QACL,GAAG,KAAA;AAAA,QACH,gBAAkB,EAAA;AAAA,OACpB;AAAA;AACF,IACA,KAAK,aAAe,EAAA;AAClB,MAAM,MAAA,EAAE,QAAW,GAAA,KAAA;AAEnB,MAAA,MAAM,QAAQ,MAAO,CAAA,OAAA;AAErB,MAAA,IAAI,KAAU,KAAA,EAAA,IAAM,KAAQ,GAAA,MAAA,CAAO,IAAM,EAAA;AACvC,QAAO,OAAA,KAAA;AAAA;AAGT,MAAO,OAAA;AAAA,QACL,GAAG,KAAA;AAAA,QACH,iBAAmB,EAAA;AAAA,OACrB;AAAA;AACF,IACA,KAAK,kBAAoB,EAAA;AACvB,MAAA,MAAM,gBAAgB,MAAO,CAAA,OAAA;AAE7B,MAAO,OAAA,EAAE,GAAG,KAAA,EAAO,aAA6B,EAAA;AAAA;AAClD,IAEA,KAAK,QAAU,EAAA;AACb,MAAA,MAAM,KAAK,MAAO,CAAA,OAAA;AAClB,MAAM,MAAA,EAAE,QAAW,GAAA,KAAA;AAEnB,MAAM,MAAA,iBAAA,GAAoB,CAAC,GAAG,MAAA,CAAO,MAAM,CAAA,CAAE,QAAQ,EAAE,CAAA;AAEvD,MAAA,IAAI,sBAAsB,EAAI,EAAA;AAC5B,QAAO,OAAA,KAAA;AAAA;AAGT,MAAO,OAAA;AAAA,QACL,GAAG,KAAA;AAAA,QACH;AAAA,OACF;AAAA;AACF,IACA,SAAS;AACP,MAAA,MAAM,eAAyB,GAAA,MAAA;AAC/B,MAAA,MAAM,IAAI,KAAA,CAAM,CAAkB,eAAA,EAAA,eAAe,CAAiB,eAAA,CAAA,CAAA;AAAA;AACpE;AAEJ;;;;"}

package/dist-cjs/carousel/CarouselSlide.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var css_248z = ".saltCarouselSlide {\n  scroll-snap-align: start;\n  display: flex;\n  flex-direction: column;\n  flex: 0 0 auto;\n  box-sizing: border-box;\n  width: var(--carousel-slide-width, 100%);\n  gap: var(--salt-spacing-200);\n}\n.saltCarouselSlide:focus-visible {\n  outline: var(--salt-focused-outline);\n  outline-offset: calc(0px - var(--salt-focused-outlineWidth));\n}\n\n.saltCarouselSlide-actions {\n  display: none;\n}\n\n.saltCarouselSlide-sr-only {\n  position: fixed;\n  top: 0;\n  left: 0;\n  transform: translate(-100%, -100%);\n}\n\n.saltCarouselSlide-actions.saltCarouselSlide-visible {\n  display: flex;\n}\n.saltCarouselSlide-container {\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  gap: var(--salt-spacing-200);\n  padding-left: var(--salt-spacing-25);\n  padding-bottom: var(--salt-spacing-25);\n  flex-grow: 1;\n}\n.saltCarouselSlide-content {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  gap: var(--salt-spacing-100);\n}\n.saltCarouselSlide-card {\n  padding: var(--salt-spacing-200);\n  padding-top: 0;\n}\n.saltCarouselSlide-content h2,\n.saltCarouselSlide-content h3 {\n  margin: 0;\n}\n.saltCarouselSlide-bordered {\n  border: var(--salt-size-border) var(--salt-container-borderStyle) var(--salt-container-primary-borderColor);\n  border-radius: var(--salt-palette-corner, 0);\n  overflow: hidden;\n}\n";
-
-module.exports = css_248z;
-//# sourceMappingURL=CarouselSlide.css.js.map

package/dist-cjs/carousel/CarouselSlide.css.js.map

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

package/dist-cjs/carousel/CarouselSlide.js

@@ -1,110 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var clsx = require('clsx');
-var react = require('react');
-var CarouselContext = require('./CarouselContext.js');
-var CarouselSlide$1 = require('./CarouselSlide.css.js');
-
-const withBaseName = core.makePrefixer("saltCarouselSlide");
-const CarouselSlide = react.forwardRef(
-  function CarouselSlide2({
-    actions,
-    appearance,
-    media,
-    header,
-    children,
-    "aria-labelledby": ariaLabelledBy,
-    style,
-    id: idProp,
-    ...rest
-  }, refProp) {
-    const targetWindow = window.useWindow();
-    styles.useComponentCssInjection({
-      testId: "salt-carousel-slide",
-      css: CarouselSlide$1,
-      window: targetWindow
-    });
-    const dispatch = react.useContext(CarouselContext.CarouselDispatchContext);
-    const { slides, visibleSlides, activeSlideIndex } = react.useContext(CarouselContext.CarouselStateContext);
-    const slideRef = react.useRef(null);
-    const headerRef = react.useRef(null);
-    const id = core.useIdMemo(idProp);
-    const announcerId = core.useId();
-    const slideCount = slides.size;
-    react.useEffect(() => {
-      var _a;
-      if (!slideRef.current) return;
-      dispatch({
-        type: "register",
-        payload: [
-          id,
-          {
-            element: slideRef.current,
-            slideDescription: (_a = headerRef == null ? void 0 : headerRef.current) == null ? void 0 : _a.innerText
-          }
-        ]
-      });
-      return () => dispatch({ type: "unregister", payload: id });
-    }, [dispatch, id]);
-    const SlideStyles = {
-      "--carousel-slide-width": visibleSlides > 1 ? `calc((100% / ${visibleSlides}) - var(--salt-spacing-200)/${visibleSlides})` : void 0,
-      ...style
-    };
-    const ref = core.useForkRef(refProp, slideRef);
-    const slideIds = [...slides.keys()];
-    const index = slideIds.indexOf(id || slideIds[0]);
-    const helperText = `${index + 1} of ${slideCount}`;
-    const isVisible = index >= activeSlideIndex && index < activeSlideIndex + visibleSlides;
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        role: "group",
-        "aria-roledescription": "slide",
-        "aria-labelledby": clsx.clsx(ariaLabelledBy, announcerId),
-        id,
-        className: clsx.clsx(withBaseName(), {
-          [withBaseName("bordered")]: appearance === "bordered"
-        }),
-        style: SlideStyles,
-        tabIndex: isVisible ? 0 : -1,
-        hidden: !isVisible,
-        ...rest,
-        ref,
-        children: [
-          media,
-          children && /* @__PURE__ */ jsxRuntime.jsxs(
-            "div",
-            {
-              className: clsx.clsx(withBaseName("container"), {
-                [withBaseName("card")]: appearance === "bordered"
-              }),
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: withBaseName("content"), children: [
-                  isVisible && /* @__PURE__ */ jsxRuntime.jsx(
-                    "span",
-                    {
-                      id: announcerId,
-                      className: withBaseName("sr-only"),
-                      "aria-hidden": "true",
-                      children: helperText
-                    }
-                  ),
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { ref: headerRef, children: header }),
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { children })
-                ] }),
-                isVisible && actions
-              ]
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-
-exports.CarouselSlide = CarouselSlide;
-//# sourceMappingURL=CarouselSlide.js.map

package/dist-cjs/carousel/CarouselSlide.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CarouselSlide.js","sources":["../src/carousel/CarouselSlide.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useId, useIdMemo } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentProps,\n  type ReactNode,\n  forwardRef,\n  useContext,\n  useEffect,\n  useRef,\n} from \"react\";\nimport {\n  CarouselDispatchContext,\n  CarouselStateContext,\n} from \"./CarouselContext\";\nimport carouselSlideCss from \"./CarouselSlide.css\";\n\nexport type CarouselSlideId = string;\nexport type CarouselSlideElement = HTMLDivElement;\nexport type CarouselSlideMeta = {\n  element: CarouselSlideElement;\n  slideDescription?: string;\n};\nexport interface CarouselSlideProps extends ComponentProps<\"div\"> {\n  /**\n   * Actions to be displayed in the content footer.\n   **/\n  actions?: ReactNode;\n  /**\n   * Media content to be displayed inside the slide. This could include images, videos, etc., that are visually prominent.\n   * It differs from children in that media is intended to be the main visual element of the slide.\n   **/\n  media?: ReactNode;\n  /**\n   * The appearance of the slide. Options are 'bordered', and 'transparent'.\n   * 'transparent' is the default value.\n   **/\n  appearance?: \"bordered\" | \"transparent\";\n  /**\n   * Header content to be displayed at the top of the slide. This can be text or any other React node.\n   **/\n  header?: ReactNode;\n  /**\n   * Carousel slide id.\n   */\n  id?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltCarouselSlide\");\n\nexport const CarouselSlide = forwardRef<HTMLDivElement, CarouselSlideProps>(\n  function CarouselSlide(\n    {\n      actions,\n      appearance,\n      media,\n      header,\n      children,\n      \"aria-labelledby\": ariaLabelledBy,\n      style,\n      id: idProp,\n      ...rest\n    },\n    refProp,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-carousel-slide\",\n      css: carouselSlideCss,\n      window: targetWindow,\n    });\n    const dispatch = useContext(CarouselDispatchContext);\n    const { slides, visibleSlides, activeSlideIndex } =\n      useContext(CarouselStateContext);\n\n    const slideRef = useRef<HTMLDivElement>(null);\n    const headerRef = useRef<HTMLDivElement>(null);\n    const id = useIdMemo(idProp);\n    const announcerId = useId();\n    const slideCount = slides.size;\n\n    useEffect(() => {\n      if (!slideRef.current) return;\n\n      dispatch({\n        type: \"register\",\n        payload: [\n          id,\n          {\n            element: slideRef.current,\n            slideDescription: headerRef?.current?.innerText,\n          },\n        ],\n      });\n      return () => dispatch({ type: \"unregister\", payload: id });\n    }, [dispatch, id]);\n\n    const SlideStyles = {\n      \"--carousel-slide-width\":\n        visibleSlides > 1\n          ? `calc((100% / ${visibleSlides}) - var(--salt-spacing-200)/${visibleSlides})`\n          : undefined,\n      ...style,\n    };\n\n    const ref = useForkRef(refProp, slideRef);\n    const slideIds = [...slides.keys()];\n    const index = slideIds.indexOf(id || slideIds[0]);\n    const helperText = `${index + 1} of ${slideCount}`;\n    const isVisible =\n      index >= activeSlideIndex && index < activeSlideIndex + visibleSlides;\n\n    return (\n      <div\n        role=\"group\"\n        aria-roledescription=\"slide\"\n        aria-labelledby={clsx(ariaLabelledBy, announcerId)}\n        id={id}\n        className={clsx(withBaseName(), {\n          [withBaseName(\"bordered\")]: appearance === \"bordered\",\n        })}\n        style={SlideStyles}\n        tabIndex={isVisible ? 0 : -1}\n        hidden={!isVisible}\n        {...rest}\n        ref={ref}\n      >\n        {media}\n        {children && (\n          <div\n            className={clsx(withBaseName(\"container\"), {\n              [withBaseName(\"card\")]: appearance === \"bordered\",\n            })}\n          >\n            <div className={withBaseName(\"content\")}>\n              {isVisible && (\n                <span\n                  id={announcerId}\n                  className={withBaseName(\"sr-only\")}\n                  aria-hidden=\"true\"\n                >\n                  {helperText}\n                </span>\n              )}\n              <div ref={headerRef}>{header}</div>\n              <div>{children}</div>\n            </div>\n            {isVisible && actions}\n          </div>\n        )}\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","forwardRef","CarouselSlide","useWindow","useComponentCssInjection","carouselSlideCss","useContext","CarouselDispatchContext","CarouselStateContext","useRef","useIdMemo","useId","useEffect","useForkRef","jsxs","clsx","jsx"],"mappings":";;;;;;;;;;;AAiDA,MAAM,YAAA,GAAeA,kBAAa,mBAAmB,CAAA;AAE9C,MAAM,aAAgB,GAAAC,gBAAA;AAAA,EAC3B,SAASC,cACP,CAAA;AAAA,IACE,OAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACA,MAAA;AAAA,IACA,QAAA;AAAA,IACA,iBAAmB,EAAA,cAAA;AAAA,IACnB,KAAA;AAAA,IACA,EAAI,EAAA,MAAA;AAAA,IACJ,GAAG;AAAA,KAEL,OACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,eAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AACD,IAAM,MAAA,QAAA,GAAWC,iBAAWC,uCAAuB,CAAA;AACnD,IAAA,MAAM,EAAE,MAAQ,EAAA,aAAA,EAAe,gBAAiB,EAAA,GAC9CD,iBAAWE,oCAAoB,CAAA;AAEjC,IAAM,MAAA,QAAA,GAAWC,aAAuB,IAAI,CAAA;AAC5C,IAAM,MAAA,SAAA,GAAYA,aAAuB,IAAI,CAAA;AAC7C,IAAM,MAAA,EAAA,GAAKC,eAAU,MAAM,CAAA;AAC3B,IAAA,MAAM,cAAcC,UAAM,EAAA;AAC1B,IAAA,MAAM,aAAa,MAAO,CAAA,IAAA;AAE1B,IAAAC,eAAA,CAAU,MAAM;AAlFpB,MAAA,IAAA,EAAA;AAmFM,MAAI,IAAA,CAAC,SAAS,OAAS,EAAA;AAEvB,MAAS,QAAA,CAAA;AAAA,QACP,IAAM,EAAA,UAAA;AAAA,QACN,OAAS,EAAA;AAAA,UACP,EAAA;AAAA,UACA;AAAA,YACE,SAAS,QAAS,CAAA,OAAA;AAAA,YAClB,gBAAA,EAAA,CAAkB,EAAW,GAAA,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAA,OAAA,KAAX,IAAoB,GAAA,MAAA,GAAA,EAAA,CAAA;AAAA;AACxC;AACF,OACD,CAAA;AACD,MAAA,OAAO,MAAM,QAAS,CAAA,EAAE,MAAM,YAAc,EAAA,OAAA,EAAS,IAAI,CAAA;AAAA,KACxD,EAAA,CAAC,QAAU,EAAA,EAAE,CAAC,CAAA;AAEjB,IAAA,MAAM,WAAc,GAAA;AAAA,MAClB,0BACE,aAAgB,GAAA,CAAA,GACZ,gBAAgB,aAAa,CAAA,4BAAA,EAA+B,aAAa,CACzE,CAAA,CAAA,GAAA,MAAA;AAAA,MACN,GAAG;AAAA,KACL;AAEA,IAAM,MAAA,GAAA,GAAMC,eAAW,CAAA,OAAA,EAAS,QAAQ,CAAA;AACxC,IAAA,MAAM,QAAW,GAAA,CAAC,GAAG,MAAA,CAAO,MAAM,CAAA;AAClC,IAAA,MAAM,QAAQ,QAAS,CAAA,OAAA,CAAQ,EAAM,IAAA,QAAA,CAAS,CAAC,CAAC,CAAA;AAChD,IAAA,MAAM,UAAa,GAAA,CAAA,EAAG,KAAQ,GAAA,CAAC,OAAO,UAAU,CAAA,CAAA;AAChD,IAAA,MAAM,SACJ,GAAA,KAAA,IAAS,gBAAoB,IAAA,KAAA,GAAQ,gBAAmB,GAAA,aAAA;AAE1D,IACE,uBAAAC,eAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,IAAK,EAAA,OAAA;AAAA,QACL,sBAAqB,EAAA,OAAA;AAAA,QACrB,iBAAA,EAAiBC,SAAK,CAAA,cAAA,EAAgB,WAAW,CAAA;AAAA,QACjD,EAAA;AAAA,QACA,SAAA,EAAWA,SAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,UAC9B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,UAAe,KAAA;AAAA,SAC5C,CAAA;AAAA,QACD,KAAO,EAAA,WAAA;AAAA,QACP,QAAA,EAAU,YAAY,CAAI,GAAA,EAAA;AAAA,QAC1B,QAAQ,CAAC,SAAA;AAAA,QACR,GAAG,IAAA;AAAA,QACJ,GAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,KAAA;AAAA,UACA,QACC,oBAAAD,eAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAW,EAAAC,SAAA,CAAK,YAAa,CAAA,WAAW,CAAG,EAAA;AAAA,gBACzC,CAAC,YAAA,CAAa,MAAM,CAAC,GAAG,UAAe,KAAA;AAAA,eACxC,CAAA;AAAA,cAED,QAAA,EAAA;AAAA,gCAAAD,eAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,SAAS,CACnC,EAAA,QAAA,EAAA;AAAA,kBACC,SAAA,oBAAAE,cAAA;AAAA,oBAAC,MAAA;AAAA,oBAAA;AAAA,sBACC,EAAI,EAAA,WAAA;AAAA,sBACJ,SAAA,EAAW,aAAa,SAAS,CAAA;AAAA,sBACjC,aAAY,EAAA,MAAA;AAAA,sBAEX,QAAA,EAAA;AAAA;AAAA,mBACH;AAAA,kCAEDA,cAAA,CAAA,KAAA,EAAA,EAAI,GAAK,EAAA,SAAA,EAAY,QAAO,EAAA,MAAA,EAAA,CAAA;AAAA,kCAC7BA,cAAA,CAAC,SAAK,QAAS,EAAA;AAAA,iBACjB,EAAA,CAAA;AAAA,gBACC,SAAa,IAAA;AAAA;AAAA;AAAA;AAChB;AAAA;AAAA,KAEJ;AAAA;AAGN;;;;"}

package/dist-cjs/carousel/CarouselSlider.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var css_248z = ".saltCarouselSlider {\n  display: flex;\n  scroll-snap-type: x mandatory;\n  overflow-x: auto;\n  scroll-behavior: smooth;\n  width: 100%;\n  gap: var(--salt-spacing-100);\n  grid-area: slider;\n}\n@supports (scrollbar-width: none) {\n  .saltCarouselSlider {\n    scrollbar-width: none;\n  }\n}\n@supports not (scrollbar-width: none) {\n  .saltCarouselSlider::-webkit-scrollbar {\n    display: none;\n  }\n}\n";
-
-module.exports = css_248z;
-//# sourceMappingURL=CarouselSlider.css.js.map

package/dist-cjs/carousel/CarouselSlider.css.js.map

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

package/dist-cjs/carousel/CarouselSlider.js

@@ -1,93 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var react = require('react');
-var CarouselContext = require('./CarouselContext.js');
-var CarouselSlider$1 = require('./CarouselSlider.css.js');
-
-const withBaseName = core.makePrefixer("saltCarouselSlider");
-const CarouselSlider = react.forwardRef(
-  function CarouselSlider2({ children, onKeyDown, onScroll, onSelectionChange, ...rest }, propRef) {
-    const targetWindow = window.useWindow();
-    styles.useComponentCssInjection({
-      testId: "salt-carousel-slider",
-      css: CarouselSlider$1,
-      window: targetWindow
-    });
-    const containerRef = react.useRef(null);
-    const hasRun = react.useRef(false);
-    const { slides, activeSlideIndex, focusedSlideIndex, visibleSlides } = react.useContext(CarouselContext.CarouselStateContext);
-    const dispatch = react.useContext(CarouselContext.CarouselDispatchContext);
-    const slideIds = [...slides.keys()];
-    const handleKeyDown = (event) => {
-      var _a, _b;
-      if (event.repeat) return;
-      switch (event.key) {
-        case "ArrowLeft": {
-          const prevIndex = focusedSlideIndex && focusedSlideIndex > activeSlideIndex ? focusedSlideIndex - 1 : activeSlideIndex - 1;
-          const prevId = slideIds[prevIndex] || null;
-          if (!prevId) break;
-          dispatch({ type: "scroll", payload: prevId });
-          onSelectionChange == null ? void 0 : onSelectionChange(event, prevIndex);
-          (_a = slides.get(prevId)) == null ? void 0 : _a.element.focus();
-          break;
-        }
-        case "ArrowRight": {
-          const nextIndex = activeSlideIndex + 1;
-          const nextId = slideIds[nextIndex] || null;
-          if (!nextId) break;
-          dispatch({ type: "scroll", payload: nextId });
-          onSelectionChange == null ? void 0 : onSelectionChange(event, nextIndex);
-          (_b = slides.get(nextId)) == null ? void 0 : _b.element.focus();
-          break;
-        }
-      }
-      onKeyDown == null ? void 0 : onKeyDown(event);
-    };
-    const handleScroll = (event) => {
-      const container = containerRef == null ? void 0 : containerRef.current;
-      if (!container) return;
-      const scrollLeft = container.scrollLeft;
-      const slideWidth = container.offsetWidth / visibleSlides;
-      const newIndex = Math.round(scrollLeft / slideWidth) || 0;
-      if (newIndex !== activeSlideIndex) {
-        dispatch({ type: "move", payload: slideIds[newIndex] });
-        onSelectionChange == null ? void 0 : onSelectionChange(event, newIndex);
-      }
-      onScroll == null ? void 0 : onScroll(event);
-    };
-    react.useLayoutEffect(() => {
-      const container = containerRef.current;
-      if (!container) return;
-      const scrollBehavior = hasRun.current ? "smooth" : "instant";
-      const slideWidth = container.offsetWidth / visibleSlides;
-      requestAnimationFrame(() => {
-        container.scrollTo({
-          left: focusedSlideIndex * slideWidth,
-          // @ts-ignore ScrollBehavior typescript definition missing instant
-          behavior: scrollBehavior
-        });
-      });
-      hasRun.current = true;
-    }, [focusedSlideIndex, visibleSlides]);
-    const ref = core.useForkRef(propRef, containerRef);
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        ref,
-        className: withBaseName(),
-        tabIndex: -1,
-        onKeyDown: handleKeyDown,
-        onScroll: handleScroll,
-        ...rest,
-        children
-      }
-    );
-  }
-);
-
-exports.CarouselSlider = CarouselSlider;
-//# sourceMappingURL=CarouselSlider.js.map