@salt-ds/core 1.25.0 → 1.26.0

package/dist-cjs/option/OptionListBase.js

@@ -22,6 +22,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/option/OptionListBase.js.map

@@ -1 +1 @@
-{"version":3,"file":"OptionListBase.js","sources":["../src/option/OptionListBase.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"../utils\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport optionListCss from \"./OptionList.css\";\n\nconst withBaseName = makePrefixer(\"saltOptionList\");\n\nexport interface OptionListBaseProps extends ComponentPropsWithoutRef<\"div\"> {}\n\nexport const OptionListBase = forwardRef<HTMLDivElement, OptionListBaseProps>(\n  function OptionListBase(props, ref) {\n    const { children, className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-option-list\",\n      css: optionListCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div\n        className={clsx(withBaseName(\"container\"), className)}\n        {...rest}\n        ref={ref}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","OptionListBase","useWindow","useComponentCssInjection","optionListCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAI3C,MAAM,cAAiB,GAAAC,gBAAA;AAAA,EAC5B,SAASC,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AAClC,IAAA,MAAM,EAAE,QAAA,EAAU,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAEzC,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA,CAAK,YAAa,CAAA,WAAW,GAAG,SAAS,CAAA;AAAA,MACnD,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MAEC,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"OptionListBase.js","sources":["../src/option/OptionListBase.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"../utils\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport optionListCss from \"./OptionList.css\";\n\nconst withBaseName = makePrefixer(\"saltOptionList\");\n\nexport interface OptionListBaseProps extends ComponentPropsWithoutRef<\"div\"> {}\n\nexport const OptionListBase = forwardRef<HTMLDivElement, OptionListBaseProps>(\n  function OptionListBase(props, ref) {\n    const { children, className, ...rest } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-option-list\",\n      css: optionListCss,\n      window: targetWindow,\n    });\n\n    return (\n      <div\n        className={clsx(withBaseName(\"container\"), className)}\n        {...rest}\n        ref={ref}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","OptionListBase","useWindow","useComponentCssInjection","optionListCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAI3C,MAAM,cAAiB,GAAAC,gBAAA;AAAA,EAC5B,SAASC,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AAClC,IAAA,MAAM,EAAE,QAAA,EAAU,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAEzC,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,UAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,SAAW,EAAAC,SAAA,CAAK,YAAa,CAAA,WAAW,GAAG,SAAS,CAAA;AAAA,MACnD,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MAEC,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/overlay/Overlay.js

@@ -23,6 +23,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/overlay/Overlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"Overlay.js","sources":["../src/overlay/Overlay.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, useMemo, useRef } from \"react\";\nimport { OverlayContext } from \"./OverlayContext\";\nimport { useControlled, useFloatingUI } from \"../utils\";\nimport {\n  flip,\n  offset,\n  shift,\n  limitShift,\n  arrow,\n  useClick,\n  useDismiss,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\n\nexport interface OverlayProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Display or hide the component.\n   */\n  open?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /*\n   * Set the placement of the Overlay component relative to the trigger element. Defaults to `top`.\n   */\n  placement?: \"top\" | \"bottom\" | \"left\" | \"right\";\n}\n\nexport const Overlay = ({\n  children,\n  open,\n  onOpenChange,\n  placement: placementProp = \"top\",\n}: OverlayProps) => {\n  const arrowRef = useRef<SVGSVGElement | null>(null);\n\n  const [openState, setOpenState] = useControlled({\n    controlled: open,\n    default: false,\n    name: \"Overlay\",\n    state: \"open\",\n  });\n\n  const handleOpenChange = (newOpen: boolean) => {\n    setOpenState(newOpen);\n    onOpenChange?.(newOpen);\n  };\n\n  const { x, y, strategy, context, elements, floating, reference } =\n    useFloatingUI({\n      open: openState,\n      onOpenChange: handleOpenChange,\n      placement: placementProp,\n      middleware: [\n        offset(11),\n        flip(),\n        shift({ limiter: limitShift() }),\n        arrow({ element: arrowRef }),\n      ],\n    });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useRole(context, { role: \"dialog\" }),\n    useClick(context),\n    useDismiss(context),\n  ]);\n\n  const floatingStyles = useMemo(() => {\n    return {\n      top: y ?? 0,\n      left: x ?? 0,\n      position: strategy,\n      width: elements.floating?.offsetWidth,\n      height: elements.floating?.offsetHeight,\n    };\n  }, [elements.floating, strategy, x, y]);\n\n  const arrowProps = {\n    ref: arrowRef,\n    context,\n  };\n\n  return (\n    <OverlayContext.Provider\n      value={{\n        openState,\n        floatingStyles,\n        context,\n        arrowProps,\n        floating,\n        reference,\n        getFloatingProps,\n        getReferenceProps,\n      }}\n    >\n      {children}\n    </OverlayContext.Provider>\n  );\n};\n"],"names":["useRef","useControlled","useFloatingUI","offset","flip","shift","limitShift","arrow","useInteractions","useRole","useClick","useDismiss","useMemo","jsx","OverlayContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BO,MAAM,UAAU,CAAC;AAAA,EACtB,QAAA;AAAA,EACA,IAAA;AAAA,EACA,YAAA;AAAA,EACA,WAAW,aAAgB,GAAA,KAAA;AAC7B,CAAoB,KAAA;AAClB,EAAM,MAAA,QAAA,GAAWA,aAA6B,IAAI,CAAA,CAAA;AAElD,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIC,2BAAc,CAAA;AAAA,IAC9C,UAAY,EAAA,IAAA;AAAA,IACZ,OAAS,EAAA,KAAA;AAAA,IACT,IAAM,EAAA,SAAA;AAAA,IACN,KAAO,EAAA,MAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAM,MAAA,gBAAA,GAAmB,CAAC,OAAqB,KAAA;AAC7C,IAAA,YAAA,CAAa,OAAO,CAAA,CAAA;AACpB,IAAe,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAA,OAAA,CAAA,CAAA;AAAA,GACjB,CAAA;AAEA,EAAM,MAAA,EAAE,GAAG,CAAG,EAAA,QAAA,EAAU,SAAS,QAAU,EAAA,QAAA,EAAU,SAAU,EAAA,GAC7DC,2BAAc,CAAA;AAAA,IACZ,IAAM,EAAA,SAAA;AAAA,IACN,YAAc,EAAA,gBAAA;AAAA,IACd,SAAW,EAAA,aAAA;AAAA,IACX,UAAY,EAAA;AAAA,MACVC,aAAO,EAAE,CAAA;AAAA,MACTC,UAAK,EAAA;AAAA,MACLC,WAAM,CAAA,EAAE,OAAS,EAAAC,gBAAA,IAAc,CAAA;AAAA,MAC/BC,WAAM,CAAA,EAAE,OAAS,EAAA,QAAA,EAAU,CAAA;AAAA,KAC7B;AAAA,GACD,CAAA,CAAA;AAEH,EAAA,MAAM,EAAE,iBAAA,EAAmB,gBAAiB,EAAA,GAAIC,qBAAgB,CAAA;AAAA,IAC9DC,aAAQ,CAAA,OAAA,EAAS,EAAE,IAAA,EAAM,UAAU,CAAA;AAAA,IACnCC,eAAS,OAAO,CAAA;AAAA,IAChBC,iBAAW,OAAO,CAAA;AAAA,GACnB,CAAA,CAAA;AAED,EAAM,MAAA,cAAA,GAAiBC,cAAQ,MAAM;AArEvC,IAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AAsEI,IAAO,OAAA;AAAA,MACL,KAAK,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,MACV,MAAM,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,MACX,QAAU,EAAA,QAAA;AAAA,MACV,KAAA,EAAA,CAAO,EAAS,GAAA,QAAA,CAAA,QAAA,KAAT,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,WAAA;AAAA,MAC1B,MAAA,EAAA,CAAQ,EAAS,GAAA,QAAA,CAAA,QAAA,KAAT,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,KAC7B,CAAA;AAAA,KACC,CAAC,QAAA,CAAS,UAAU,QAAU,EAAA,CAAA,EAAG,CAAC,CAAC,CAAA,CAAA;AAEtC,EAAA,MAAM,UAAa,GAAA;AAAA,IACjB,GAAK,EAAA,QAAA;AAAA,IACL,OAAA;AAAA,GACF,CAAA;AAEA,EACE,uBAAAC,cAAA,CAACC,8BAAe,QAAf,EAAA;AAAA,IACC,KAAO,EAAA;AAAA,MACL,SAAA;AAAA,MACA,cAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,gBAAA;AAAA,MACA,iBAAA;AAAA,KACF;AAAA,IAEC,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"Overlay.js","sources":["../src/overlay/Overlay.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, useMemo, useRef } from \"react\";\nimport { OverlayContext } from \"./OverlayContext\";\nimport { useControlled, useFloatingUI } from \"../utils\";\nimport {\n  flip,\n  offset,\n  shift,\n  limitShift,\n  arrow,\n  useClick,\n  useDismiss,\n  useInteractions,\n  useRole,\n} from \"@floating-ui/react\";\n\nexport interface OverlayProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Display or hide the component.\n   */\n  open?: boolean;\n  /**\n   * Callback function triggered when open state changes.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /*\n   * Set the placement of the Overlay component relative to the trigger element. Defaults to `top`.\n   */\n  placement?: \"top\" | \"bottom\" | \"left\" | \"right\";\n}\n\nexport const Overlay = ({\n  children,\n  open,\n  onOpenChange,\n  placement: placementProp = \"top\",\n}: OverlayProps) => {\n  const arrowRef = useRef<SVGSVGElement | null>(null);\n\n  const [openState, setOpenState] = useControlled({\n    controlled: open,\n    default: false,\n    name: \"Overlay\",\n    state: \"open\",\n  });\n\n  const handleOpenChange = (newOpen: boolean) => {\n    setOpenState(newOpen);\n    onOpenChange?.(newOpen);\n  };\n\n  const { x, y, strategy, context, elements, floating, reference } =\n    useFloatingUI({\n      open: openState,\n      onOpenChange: handleOpenChange,\n      placement: placementProp,\n      middleware: [\n        offset(11),\n        flip(),\n        shift({ limiter: limitShift() }),\n        arrow({ element: arrowRef }),\n      ],\n    });\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    useRole(context, { role: \"dialog\" }),\n    useClick(context),\n    useDismiss(context),\n  ]);\n\n  const floatingStyles = useMemo(() => {\n    return {\n      top: y ?? 0,\n      left: x ?? 0,\n      position: strategy,\n      width: elements.floating?.offsetWidth,\n      height: elements.floating?.offsetHeight,\n    };\n  }, [elements.floating, strategy, x, y]);\n\n  const arrowProps = {\n    ref: arrowRef,\n    context,\n  };\n\n  return (\n    <OverlayContext.Provider\n      value={{\n        openState,\n        floatingStyles,\n        context,\n        arrowProps,\n        floating,\n        reference,\n        getFloatingProps,\n        getReferenceProps,\n      }}\n    >\n      {children}\n    </OverlayContext.Provider>\n  );\n};\n"],"names":["useRef","useControlled","useFloatingUI","offset","flip","shift","limitShift","arrow","useInteractions","useRole","useClick","useDismiss","useMemo","jsx","OverlayContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BO,MAAM,UAAU,CAAC;AAAA,EACtB,QAAA;AAAA,EACA,IAAA;AAAA,EACA,YAAA;AAAA,EACA,WAAW,aAAgB,GAAA,KAAA;AAC7B,CAAoB,KAAA;AAClB,EAAM,MAAA,QAAA,GAAWA,aAA6B,IAAI,CAAA,CAAA;AAElD,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIC,2BAAc,CAAA;AAAA,IAC9C,UAAY,EAAA,IAAA;AAAA,IACZ,OAAS,EAAA,KAAA;AAAA,IACT,IAAM,EAAA,SAAA;AAAA,IACN,KAAO,EAAA,MAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAM,MAAA,gBAAA,GAAmB,CAAC,OAAqB,KAAA;AAC7C,IAAA,YAAA,CAAa,OAAO,CAAA,CAAA;AACpB,IAAe,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAA,OAAA,CAAA,CAAA;AAAA,GACjB,CAAA;AAEA,EAAM,MAAA,EAAE,GAAG,CAAG,EAAA,QAAA,EAAU,SAAS,QAAU,EAAA,QAAA,EAAU,SAAU,EAAA,GAC7DC,2BAAc,CAAA;AAAA,IACZ,IAAM,EAAA,SAAA;AAAA,IACN,YAAc,EAAA,gBAAA;AAAA,IACd,SAAW,EAAA,aAAA;AAAA,IACX,UAAY,EAAA;AAAA,MACVC,aAAO,EAAE,CAAA;AAAA,MACTC,UAAK,EAAA;AAAA,MACLC,WAAM,CAAA,EAAE,OAAS,EAAAC,gBAAA,IAAc,CAAA;AAAA,MAC/BC,WAAM,CAAA,EAAE,OAAS,EAAA,QAAA,EAAU,CAAA;AAAA,KAC7B;AAAA,GACD,CAAA,CAAA;AAEH,EAAA,MAAM,EAAE,iBAAA,EAAmB,gBAAiB,EAAA,GAAIC,qBAAgB,CAAA;AAAA,IAC9DC,aAAQ,CAAA,OAAA,EAAS,EAAE,IAAA,EAAM,UAAU,CAAA;AAAA,IACnCC,eAAS,OAAO,CAAA;AAAA,IAChBC,iBAAW,OAAO,CAAA;AAAA,GACnB,CAAA,CAAA;AAED,EAAM,MAAA,cAAA,GAAiBC,cAAQ,MAAM;AArEvC,IAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AAsEI,IAAO,OAAA;AAAA,MACL,KAAK,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,MACV,MAAM,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,MACX,QAAU,EAAA,QAAA;AAAA,MACV,KAAA,EAAA,CAAO,EAAS,GAAA,QAAA,CAAA,QAAA,KAAT,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,WAAA;AAAA,MAC1B,MAAA,EAAA,CAAQ,EAAS,GAAA,QAAA,CAAA,QAAA,KAAT,IAAmB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,KAC7B,CAAA;AAAA,KACC,CAAC,QAAA,CAAS,UAAU,QAAU,EAAA,CAAA,EAAG,CAAC,CAAC,CAAA,CAAA;AAEtC,EAAA,MAAM,UAAa,GAAA;AAAA,IACjB,GAAK,EAAA,QAAA;AAAA,IACL,OAAA;AAAA,GACF,CAAA;AAEA,EACE,uBAAAC,cAAA,CAACC,8BAAe,QAAf,EAAA;AAAA,IACC,KAAO,EAAA;AAAA,MACL,SAAA;AAAA,MACA,cAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,gBAAA;AAAA,MACA,iBAAA;AAAA,KACF;AAAA,IAEC,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/overlay/OverlayContext.js

@@ -22,6 +22,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/overlay/OverlayContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverlayContext.js","sources":["../src/overlay/OverlayContext.ts"],"sourcesContent":["import {\n  FloatingArrowProps,\n  FloatingContext,\n  ReferenceType,\n  Strategy,\n} from \"@floating-ui/react\";\nimport { createContext, useFloatingUI } from \"../utils\";\nimport { useContext } from \"react\";\n\ntype FloatingReturn = ReturnType<typeof useFloatingUI>;\ntype FloatingStyleProps = {\n  top: number;\n  left: number;\n  position: Strategy;\n  width?: number;\n  height?: number;\n};\n\nexport interface OverlayContextValue {\n  openState: boolean;\n  floatingStyles: FloatingStyleProps;\n  arrowProps: FloatingArrowProps;\n  context: FloatingContext;\n  reference?: (node: ReferenceType | null) => void;\n  floating?: (node: HTMLElement | null) => void;\n  getFloatingProps: (\n    userProps?: React.HTMLProps<HTMLElement> | undefined\n  ) => Record<string, unknown>;\n  getReferenceProps: (\n    userProps?: React.HTMLProps<Element> | undefined\n  ) => Record<string, unknown>;\n}\n\nexport const OverlayContext = createContext<OverlayContextValue>(\n  \"OverlayContext\",\n  {\n    openState: false,\n    floatingStyles: {\n      top: 0,\n      left: 0,\n      position: \"\" as Strategy,\n    },\n    context: {} as FloatingContext,\n    arrowProps: {} as FloatingArrowProps,\n    reference: {} as FloatingReturn[\"reference\"],\n    floating: {} as FloatingReturn[\"floating\"],\n    getFloatingProps() {\n      return {} as Record<string, unknown>;\n    },\n    getReferenceProps() {\n      return {} as Record<string, unknown>;\n    },\n  }\n);\n\nexport function useOverlayContext() {\n  return useContext(OverlayContext);\n}\n"],"names":["createContext","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCO,MAAM,cAAiB,GAAAA,2BAAA;AAAA,EAC5B,gBAAA;AAAA,EACA;AAAA,IACE,SAAW,EAAA,KAAA;AAAA,IACX,cAAgB,EAAA;AAAA,MACd,GAAK,EAAA,CAAA;AAAA,MACL,IAAM,EAAA,CAAA;AAAA,MACN,QAAU,EAAA,EAAA;AAAA,KACZ;AAAA,IACA,SAAS,EAAC;AAAA,IACV,YAAY,EAAC;AAAA,IACb,WAAW,EAAC;AAAA,IACZ,UAAU,EAAC;AAAA,IACX,gBAAmB,GAAA;AACjB,MAAA,OAAO,EAAC,CAAA;AAAA,KACV;AAAA,IACA,iBAAoB,GAAA;AAClB,MAAA,OAAO,EAAC,CAAA;AAAA,KACV;AAAA,GACF;AACF,EAAA;AAEO,SAAS,iBAAoB,GAAA;AAClC,EAAA,OAAOC,iBAAW,cAAc,CAAA,CAAA;AAClC;;;;;"}
+{"version":3,"file":"OverlayContext.js","sources":["../src/overlay/OverlayContext.ts"],"sourcesContent":["import {\n  FloatingArrowProps,\n  FloatingContext,\n  ReferenceType,\n  Strategy,\n} from \"@floating-ui/react\";\nimport { createContext, useFloatingUI } from \"../utils\";\nimport { useContext } from \"react\";\n\ntype FloatingReturn = ReturnType<typeof useFloatingUI>;\ntype FloatingStyleProps = {\n  top: number;\n  left: number;\n  position: Strategy;\n  width?: number;\n  height?: number;\n};\n\nexport interface OverlayContextValue {\n  openState: boolean;\n  floatingStyles: FloatingStyleProps;\n  arrowProps: FloatingArrowProps;\n  context: FloatingContext;\n  reference?: (node: ReferenceType | null) => void;\n  floating?: (node: HTMLElement | null) => void;\n  getFloatingProps: (\n    userProps?: React.HTMLProps<HTMLElement> | undefined\n  ) => Record<string, unknown>;\n  getReferenceProps: (\n    userProps?: React.HTMLProps<Element> | undefined\n  ) => Record<string, unknown>;\n}\n\nexport const OverlayContext = createContext<OverlayContextValue>(\n  \"OverlayContext\",\n  {\n    openState: false,\n    floatingStyles: {\n      top: 0,\n      left: 0,\n      position: \"\" as Strategy,\n    },\n    context: {} as FloatingContext,\n    arrowProps: {} as FloatingArrowProps,\n    reference: {} as FloatingReturn[\"reference\"],\n    floating: {} as FloatingReturn[\"floating\"],\n    getFloatingProps() {\n      return {} as Record<string, unknown>;\n    },\n    getReferenceProps() {\n      return {} as Record<string, unknown>;\n    },\n  }\n);\n\nexport function useOverlayContext() {\n  return useContext(OverlayContext);\n}\n"],"names":["createContext","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCO,MAAM,cAAiB,GAAAA,2BAAA;AAAA,EAC5B,gBAAA;AAAA,EACA;AAAA,IACE,SAAW,EAAA,KAAA;AAAA,IACX,cAAgB,EAAA;AAAA,MACd,GAAK,EAAA,CAAA;AAAA,MACL,IAAM,EAAA,CAAA;AAAA,MACN,QAAU,EAAA,EAAA;AAAA,KACZ;AAAA,IACA,SAAS,EAAC;AAAA,IACV,YAAY,EAAC;AAAA,IACb,WAAW,EAAC;AAAA,IACZ,UAAU,EAAC;AAAA,IACX,gBAAmB,GAAA;AACjB,MAAA,OAAO,EAAC,CAAA;AAAA,KACV;AAAA,IACA,iBAAoB,GAAA;AAClB,MAAA,OAAO,EAAC,CAAA;AAAA,KACV;AAAA,GACF;AACF,EAAA;AAEO,SAAS,iBAAoB,GAAA;AAClC,EAAA,OAAOC,iBAAW,cAAc,CAAA,CAAA;AAClC;;;;;"}

package/dist-cjs/overlay/OverlayPanel.js

@@ -23,6 +23,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/overlay/OverlayPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverlayPanel.js","sources":["../src/overlay/OverlayPanel.tsx"],"sourcesContent":["import { forwardRef, ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport { makePrefixer, useFloatingComponent, useForkRef } from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { useOverlayContext } from \"./OverlayContext\";\nimport { FloatingArrow } from \"@floating-ui/react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport overlayPanelCss from \"./OverlayPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanel\");\nexport interface OverlayPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of Overlay Panel\n   */\n  children?: ReactNode;\n}\n\nexport const OverlayPanel = forwardRef<HTMLDivElement, OverlayPanelProps>(\n  function OverlayPanel(props, ref) {\n    const {\n      className,\n      [\"aria-labelledby\"]: ariaLabelledby,\n      children,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-overlay-panel\",\n      css: overlayPanelCss,\n      window: targetWindow,\n    });\n\n    const { Component: FloatingComponent } = useFloatingComponent();\n\n    const {\n      openState,\n      floatingStyles,\n      context,\n      getFloatingProps,\n      floating,\n      arrowProps,\n    } = useOverlayContext();\n\n    const handleRef = useForkRef<HTMLDivElement>(floating, ref);\n\n    const { top, left, width, height, position } = floatingStyles;\n\n    return (\n      <FloatingComponent\n        open={openState}\n        className={clsx(withBaseName(), className)}\n        aria-modal=\"true\"\n        {...getFloatingProps()}\n        ref={handleRef}\n        width={width}\n        height={height}\n        top={top}\n        left={left}\n        position={position}\n        focusManagerProps={{\n          context: context,\n        }}\n        aria-labelledby={ariaLabelledby}\n      >\n        <div {...rest}> {children} </div>\n        <FloatingArrow\n          {...arrowProps}\n          strokeWidth={1}\n          fill=\"var(--overlay-background)\"\n          stroke=\"var(--overlay-borderColor)\"\n          height={5}\n          width={10}\n        />\n      </FloatingComponent>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","OverlayPanel","useWindow","useComponentCssInjection","overlayPanelCss","useFloatingComponent","useOverlayContext","useForkRef","jsxs","clsx","jsx","FloatingArrow"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AAQ7C,MAAM,YAAe,GAAAC,gBAAA;AAAA,EAC1B,SAASC,aAAa,CAAA,KAAA,EAAO,GAAK,EAAA;AAChC,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MAAA,CACC,iBAAoB,GAAA,cAAA;AAAA,MACrB,QAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,oBAAA;AAAA,MACR,GAAK,EAAAC,cAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,SAAA,EAAW,iBAAkB,EAAA,GAAIC,kCAAqB,EAAA,CAAA;AAE9D,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,cAAA;AAAA,MACA,OAAA;AAAA,MACA,gBAAA;AAAA,MACA,QAAA;AAAA,MACA,UAAA;AAAA,QACEC,gCAAkB,EAAA,CAAA;AAEtB,IAAM,MAAA,SAAA,GAAYC,qBAA2B,CAAA,QAAA,EAAU,GAAG,CAAA,CAAA;AAE1D,IAAA,MAAM,EAAE,GAAK,EAAA,IAAA,EAAM,KAAO,EAAA,MAAA,EAAQ,UAAa,GAAA,cAAA,CAAA;AAE/C,IAAA,uBACGC,eAAA,CAAA,iBAAA,EAAA;AAAA,MACC,IAAM,EAAA,SAAA;AAAA,MACN,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,YAAW,EAAA,MAAA;AAAA,MACV,GAAG,gBAAiB,EAAA;AAAA,MACrB,GAAK,EAAA,SAAA;AAAA,MACL,KAAA;AAAA,MACA,MAAA;AAAA,MACA,GAAA;AAAA,MACA,IAAA;AAAA,MACA,QAAA;AAAA,MACA,iBAAmB,EAAA;AAAA,QACjB,OAAA;AAAA,OACF;AAAA,MACA,iBAAiB,EAAA,cAAA;AAAA,MAEjB,QAAA,EAAA;AAAA,wBAACD,eAAA,CAAA,KAAA,EAAA;AAAA,UAAK,GAAG,IAAA;AAAA,UAAM,QAAA,EAAA;AAAA,YAAA,GAAA;AAAA,YAAE,QAAA;AAAA,YAAS,GAAA;AAAA,WAAA;AAAA,SAAC,CAAA;AAAA,wBAC1BE,cAAA,CAAAC,mBAAA,EAAA;AAAA,UACE,GAAG,UAAA;AAAA,UACJ,WAAa,EAAA,CAAA;AAAA,UACb,IAAK,EAAA,2BAAA;AAAA,UACL,MAAO,EAAA,4BAAA;AAAA,UACP,MAAQ,EAAA,CAAA;AAAA,UACR,KAAO,EAAA,EAAA;AAAA,SACT,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"OverlayPanel.js","sources":["../src/overlay/OverlayPanel.tsx"],"sourcesContent":["import { forwardRef, ComponentPropsWithoutRef, ReactNode } from \"react\";\nimport { makePrefixer, useFloatingComponent, useForkRef } from \"../utils\";\nimport { clsx } from \"clsx\";\nimport { useOverlayContext } from \"./OverlayContext\";\nimport { FloatingArrow } from \"@floating-ui/react\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport overlayPanelCss from \"./OverlayPanel.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanel\");\nexport interface OverlayPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of Overlay Panel\n   */\n  children?: ReactNode;\n}\n\nexport const OverlayPanel = forwardRef<HTMLDivElement, OverlayPanelProps>(\n  function OverlayPanel(props, ref) {\n    const {\n      className,\n      [\"aria-labelledby\"]: ariaLabelledby,\n      children,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-overlay-panel\",\n      css: overlayPanelCss,\n      window: targetWindow,\n    });\n\n    const { Component: FloatingComponent } = useFloatingComponent();\n\n    const {\n      openState,\n      floatingStyles,\n      context,\n      getFloatingProps,\n      floating,\n      arrowProps,\n    } = useOverlayContext();\n\n    const handleRef = useForkRef<HTMLDivElement>(floating, ref);\n\n    const { top, left, width, height, position } = floatingStyles;\n\n    return (\n      <FloatingComponent\n        open={openState}\n        className={clsx(withBaseName(), className)}\n        aria-modal=\"true\"\n        {...getFloatingProps()}\n        ref={handleRef}\n        width={width}\n        height={height}\n        top={top}\n        left={left}\n        position={position}\n        focusManagerProps={{\n          context: context,\n        }}\n        aria-labelledby={ariaLabelledby}\n      >\n        <div {...rest}> {children} </div>\n        <FloatingArrow\n          {...arrowProps}\n          strokeWidth={1}\n          fill=\"var(--overlay-background)\"\n          stroke=\"var(--overlay-borderColor)\"\n          height={5}\n          width={10}\n        />\n      </FloatingComponent>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","OverlayPanel","useWindow","useComponentCssInjection","overlayPanelCss","useFloatingComponent","useOverlayContext","useForkRef","jsxs","clsx","jsx","FloatingArrow"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AAQ7C,MAAM,YAAe,GAAAC,gBAAA;AAAA,EAC1B,SAASC,aAAa,CAAA,KAAA,EAAO,GAAK,EAAA;AAChC,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MAAA,CACC,iBAAoB,GAAA,cAAA;AAAA,MACrB,QAAA;AAAA,MACG,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,oBAAA;AAAA,MACR,GAAK,EAAAC,cAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,SAAA,EAAW,iBAAkB,EAAA,GAAIC,kCAAqB,EAAA,CAAA;AAE9D,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,cAAA;AAAA,MACA,OAAA;AAAA,MACA,gBAAA;AAAA,MACA,QAAA;AAAA,MACA,UAAA;AAAA,QACEC,gCAAkB,EAAA,CAAA;AAEtB,IAAM,MAAA,SAAA,GAAYC,qBAA2B,CAAA,QAAA,EAAU,GAAG,CAAA,CAAA;AAE1D,IAAA,MAAM,EAAE,GAAK,EAAA,IAAA,EAAM,KAAO,EAAA,MAAA,EAAQ,UAAa,GAAA,cAAA,CAAA;AAE/C,IAAA,uBACGC,eAAA,CAAA,iBAAA,EAAA;AAAA,MACC,IAAM,EAAA,SAAA;AAAA,MACN,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,YAAW,EAAA,MAAA;AAAA,MACV,GAAG,gBAAiB,EAAA;AAAA,MACrB,GAAK,EAAA,SAAA;AAAA,MACL,KAAA;AAAA,MACA,MAAA;AAAA,MACA,GAAA;AAAA,MACA,IAAA;AAAA,MACA,QAAA;AAAA,MACA,iBAAmB,EAAA;AAAA,QACjB,OAAA;AAAA,OACF;AAAA,MACA,iBAAiB,EAAA,cAAA;AAAA,MAEjB,QAAA,EAAA;AAAA,wBAACD,eAAA,CAAA,KAAA,EAAA;AAAA,UAAK,GAAG,IAAA;AAAA,UAAM,QAAA,EAAA;AAAA,YAAA,GAAA;AAAA,YAAE,QAAA;AAAA,YAAS,GAAA;AAAA,WAAA;AAAA,SAAC,CAAA;AAAA,wBAC1BE,cAAA,CAAAC,mBAAA,EAAA;AAAA,UACE,GAAG,UAAA;AAAA,UACJ,WAAa,EAAA,CAAA;AAAA,UACb,IAAK,EAAA,2BAAA;AAAA,UACL,MAAO,EAAA,4BAAA;AAAA,UACP,MAAQ,EAAA,CAAA;AAAA,UACR,KAAO,EAAA,EAAA;AAAA,SACT,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/overlay/OverlayPanelCloseButton.js

@@ -22,6 +22,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 var Button = require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/overlay/OverlayPanelCloseButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverlayPanelCloseButton.js","sources":["../src/overlay/OverlayPanelCloseButton.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport clsx from \"clsx\";\nimport { makePrefixer } from \"../utils\";\nimport { Button, ButtonProps } from \"../button\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { CloseIcon } from \"@salt-ds/icons\";\nimport overlayPanelCloseButtonCss from \"./OverlayPanelCloseButton.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanelCloseButton\");\n\nexport const OverlayPanelCloseButton = forwardRef<\n  HTMLButtonElement,\n  ButtonProps\n>(function OverlayPanelButton({ className, ...rest }, ref) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-overlay-panel-close-button\",\n    css: overlayPanelCloseButtonCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div className={clsx(withBaseName(), className)}>\n      <Button\n        ref={ref}\n        aria-label=\"Close overlay\"\n        variant=\"secondary\"\n        className={withBaseName(\"button\")}\n        {...rest}\n      >\n        <CloseIcon aria-hidden />\n      </Button>\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","overlayPanelCloseButtonCss","jsx","clsx","Button","CloseIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,6BAA6B,CAAA,CAAA;AAElD,MAAA,uBAAA,GAA0BC,iBAGrC,SAAS,kBAAA,CAAmB,EAAE,SAAc,EAAA,GAAA,IAAA,IAAQ,GAAK,EAAA;AACzD,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iCAAA;AAAA,IACR,GAAK,EAAAC,yBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAAC,wBAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAC5C,QAAC,kBAAAD,cAAA,CAAAE,aAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,YAAW,EAAA,eAAA;AAAA,MACX,OAAQ,EAAA,WAAA;AAAA,MACR,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,MAC/B,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAAF,cAAA,CAAAG,eAAA,EAAA;AAAA,QAAU,aAAW,EAAA,IAAA;AAAA,OAAC,CAAA;AAAA,KACzB,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"OverlayPanelCloseButton.js","sources":["../src/overlay/OverlayPanelCloseButton.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport clsx from \"clsx\";\nimport { makePrefixer } from \"../utils\";\nimport { Button, ButtonProps } from \"../button\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { CloseIcon } from \"@salt-ds/icons\";\nimport overlayPanelCloseButtonCss from \"./OverlayPanelCloseButton.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanelCloseButton\");\n\nexport const OverlayPanelCloseButton = forwardRef<\n  HTMLButtonElement,\n  ButtonProps\n>(function OverlayPanelButton({ className, ...rest }, ref) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-overlay-panel-close-button\",\n    css: overlayPanelCloseButtonCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div className={clsx(withBaseName(), className)}>\n      <Button\n        ref={ref}\n        aria-label=\"Close overlay\"\n        variant=\"secondary\"\n        className={withBaseName(\"button\")}\n        {...rest}\n      >\n        <CloseIcon aria-hidden />\n      </Button>\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","overlayPanelCloseButtonCss","jsx","clsx","Button","CloseIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,6BAA6B,CAAA,CAAA;AAElD,MAAA,uBAAA,GAA0BC,iBAGrC,SAAS,kBAAA,CAAmB,EAAE,SAAc,EAAA,GAAA,IAAA,IAAQ,GAAK,EAAA;AACzD,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iCAAA;AAAA,IACR,GAAK,EAAAC,yBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAAC,wBAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAC5C,QAAC,kBAAAD,cAAA,CAAAE,aAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,YAAW,EAAA,eAAA;AAAA,MACX,OAAQ,EAAA,WAAA;AAAA,MACR,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,MAC/B,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAAF,cAAA,CAAAG,eAAA,EAAA;AAAA,QAAU,aAAW,EAAA,IAAA;AAAA,OAAC,CAAA;AAAA,KACzB,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/overlay/OverlayPanelContent.js

@@ -24,6 +24,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/overlay/OverlayPanelContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverlayPanelContent.js","sources":["../src/overlay/OverlayPanelContent.tsx"],"sourcesContent":["import { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer } from \"../utils\";\nimport { ReactNode, ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport clsx from \"clsx\";\nimport overlayPanelContentCss from \"./OverlayPanelContent.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanelContent\");\n\nexport interface OverlayPanelContentProps\n  extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of Overlay Panel Content\n   */\n  children?: ReactNode;\n}\n\nexport const OverlayPanelContent = forwardRef<\n  HTMLDivElement,\n  OverlayPanelContentProps\n>(function OverlayPanelContent(props, ref) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-overlay-panel-content\",\n    css: overlayPanelContentCss,\n    window: targetWindow,\n  });\n\n  const { children, className, ...rest } = props;\n\n  return (\n    <div className={clsx(withBaseName(), className)} {...rest} ref={ref}>\n      {children}\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","OverlayPanelContent","useWindow","useComponentCssInjection","overlayPanelContentCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,YAAA,GAAeA,0BAAa,yBAAyB,CAAA,CAAA;AAUpD,MAAM,mBAAsB,GAAAC,gBAAA,CAGjC,SAASC,oBAAAA,CAAoB,OAAO,GAAK,EAAA;AACzC,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,4BAAA;AAAA,IACR,GAAK,EAAAC,qBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,QAAA,EAAU,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAEzC,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAAC,wBAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAI,GAAG,IAAA;AAAA,IAAM,GAAA;AAAA,IACxD,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"OverlayPanelContent.js","sources":["../src/overlay/OverlayPanelContent.tsx"],"sourcesContent":["import { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { makePrefixer } from \"../utils\";\nimport { ReactNode, ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport clsx from \"clsx\";\nimport overlayPanelContentCss from \"./OverlayPanelContent.css\";\n\nconst withBaseName = makePrefixer(\"saltOverlayPanelContent\");\n\nexport interface OverlayPanelContentProps\n  extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content of Overlay Panel Content\n   */\n  children?: ReactNode;\n}\n\nexport const OverlayPanelContent = forwardRef<\n  HTMLDivElement,\n  OverlayPanelContentProps\n>(function OverlayPanelContent(props, ref) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-overlay-panel-content\",\n    css: overlayPanelContentCss,\n    window: targetWindow,\n  });\n\n  const { children, className, ...rest } = props;\n\n  return (\n    <div className={clsx(withBaseName(), className)} {...rest} ref={ref}>\n      {children}\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","OverlayPanelContent","useWindow","useComponentCssInjection","overlayPanelContentCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,MAAM,YAAA,GAAeA,0BAAa,yBAAyB,CAAA,CAAA;AAUpD,MAAM,mBAAsB,GAAAC,gBAAA,CAGjC,SAASC,oBAAAA,CAAoB,OAAO,GAAK,EAAA;AACzC,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,4BAAA;AAAA,IACR,GAAK,EAAAC,qBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,QAAA,EAAU,SAAc,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAEzC,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAAC,wBAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAI,GAAG,IAAA;AAAA,IAAM,GAAA;AAAA,IACxD,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/overlay/OverlayTrigger.js

@@ -22,6 +22,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/overlay/OverlayTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverlayTrigger.js","sources":["../src/overlay/OverlayTrigger.tsx"],"sourcesContent":["import { cloneElement, isValidElement, ReactNode } from \"react\";\nimport { mergeProps, useForkRef } from \"../utils\";\nimport { useOverlayContext } from \"./OverlayContext\";\n\nexport interface OverlayTriggerProps {\n  children?: ReactNode;\n}\n\nexport function OverlayTrigger(props: OverlayTriggerProps) {\n  const { children } = props;\n\n  const { reference, getReferenceProps } = useOverlayContext();\n\n  const triggerRef = useForkRef(\n    // @ts-ignore error TS2339 missing property ref\n    isValidElement(children) ? children.ref : null,\n    reference\n  );\n\n  if (!children || !isValidElement(children)) {\n    return <>{children}</>;\n  }\n\n  return (\n    <>\n      {cloneElement(children, {\n        ...mergeProps(getReferenceProps(), children.props),\n        ref: triggerRef,\n      })}\n    </>\n  );\n}\n"],"names":["useOverlayContext","useForkRef","isValidElement","jsx","Fragment","mergeProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQO,SAAS,eAAe,KAA4B,EAAA;AACzD,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA,CAAA;AAErB,EAAA,MAAM,EAAE,SAAA,EAAW,iBAAkB,EAAA,GAAIA,gCAAkB,EAAA,CAAA;AAE3D,EAAA,MAAM,UAAa,GAAAC,qBAAA;AAAA,IAEjBC,oBAAe,CAAA,QAAQ,CAAI,GAAA,QAAA,CAAS,GAAM,GAAA,IAAA;AAAA,IAC1C,SAAA;AAAA,GACF,CAAA;AAEA,EAAA,IAAI,CAAC,QAAA,IAAY,CAACA,oBAAA,CAAe,QAAQ,CAAG,EAAA;AAC1C,IAAO,uBAAAC,cAAA,CAAAC,mBAAA,EAAA;AAAA,MAAG,QAAA;AAAA,KAAS,CAAA,CAAA;AAAA,GACrB;AAEA,EACE,uBAAAD,cAAA,CAAAC,mBAAA,EAAA;AAAA,IACG,6BAAa,QAAU,EAAA;AAAA,MACtB,GAAGC,qBAAA,CAAW,iBAAkB,EAAA,EAAG,SAAS,KAAK,CAAA;AAAA,MACjD,GAAK,EAAA,UAAA;AAAA,KACN,CAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"OverlayTrigger.js","sources":["../src/overlay/OverlayTrigger.tsx"],"sourcesContent":["import { cloneElement, isValidElement, ReactNode } from \"react\";\nimport { mergeProps, useForkRef } from \"../utils\";\nimport { useOverlayContext } from \"./OverlayContext\";\n\nexport interface OverlayTriggerProps {\n  children?: ReactNode;\n}\n\nexport function OverlayTrigger(props: OverlayTriggerProps) {\n  const { children } = props;\n\n  const { reference, getReferenceProps } = useOverlayContext();\n\n  const triggerRef = useForkRef(\n    // @ts-ignore error TS2339 missing property ref\n    isValidElement(children) ? children.ref : null,\n    reference\n  );\n\n  if (!children || !isValidElement(children)) {\n    return <>{children}</>;\n  }\n\n  return (\n    <>\n      {cloneElement(children, {\n        ...mergeProps(getReferenceProps(), children.props),\n        ref: triggerRef,\n      })}\n    </>\n  );\n}\n"],"names":["useOverlayContext","useForkRef","isValidElement","jsx","Fragment","mergeProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQO,SAAS,eAAe,KAA4B,EAAA;AACzD,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA,CAAA;AAErB,EAAA,MAAM,EAAE,SAAA,EAAW,iBAAkB,EAAA,GAAIA,gCAAkB,EAAA,CAAA;AAE3D,EAAA,MAAM,UAAa,GAAAC,qBAAA;AAAA,IAEjBC,oBAAe,CAAA,QAAQ,CAAI,GAAA,QAAA,CAAS,GAAM,GAAA,IAAA;AAAA,IAC1C,SAAA;AAAA,GACF,CAAA;AAEA,EAAA,IAAI,CAAC,QAAA,IAAY,CAACA,oBAAA,CAAe,QAAQ,CAAG,EAAA;AAC1C,IAAO,uBAAAC,cAAA,CAAAC,mBAAA,EAAA;AAAA,MAAG,QAAA;AAAA,KAAS,CAAA,CAAA;AAAA,GACrB;AAEA,EACE,uBAAAD,cAAA,CAAAC,mBAAA,EAAA;AAAA,IACG,6BAAa,QAAU,EAAA;AAAA,MACtB,GAAGC,qBAAA,CAAW,iBAAkB,EAAA,EAAG,SAAS,KAAK,CAAA;AAAA,MACjD,GAAK,EAAA,UAAA;AAAA,KACN,CAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/pagination/CompactInput.js

@@ -23,6 +23,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/pagination/CompactInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"CompactInput.js","sources":["../src/pagination/CompactInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEventHandler,\n  KeyboardEventHandler,\n  forwardRef,\n  useEffect,\n  useState,\n} from \"react\";\nimport { Input, InputProps } from \"../input\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport compactInputCss from \"./CompactInput.css\";\n\nconst withBaseName = makePrefixer(\"saltCompactInput\");\n\nexport const CompactInput = forwardRef<\n  HTMLInputElement,\n  Pick<InputProps, \"inputRef\" | \"variant\">\n>(function CompactInput(props, ref) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-compact-input\",\n    css: compactInputCss,\n    window: targetWindow,\n  });\n\n  const { count, page, onPageChange } = usePaginationContext();\n\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(event, pageValue);\n      } else {\n        setInputValue(`${page}`);\n      }\n    }\n  };\n\n  const handleBlur = () => {\n    setInputValue(`${page}`);\n  };\n\n  return (\n    <Input\n      className={clsx(withBaseName(), {\n        [withBaseName(\"defaultSize\")]: count < 100,\n      })}\n      inputProps={{\n        \"aria-label\": `Go to page, ${count} total`,\n        style: { width: `${`${count}`.length}ch` },\n      }}\n      onBlur={handleBlur}\n      onChange={handleChange}\n      onKeyDown={handleKeyDown}\n      value={inputValue}\n      textAlign={\"center\"}\n      ref={ref}\n      {...props}\n    />\n  );\n});\n"],"names":["makePrefixer","forwardRef","CompactInput","useWindow","useComponentCssInjection","compactInputCss","usePaginationContext","useState","useEffect","jsx","Input","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AAE7C,MAAM,YAAe,GAAAC,gBAAA,CAG1B,SAASC,aAAAA,CAAa,OAAO,GAAK,EAAA;AAClC,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,oBAAA;AAAA,IACR,GAAK,EAAAC,cAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,KAAA,EAAO,IAAM,EAAA,YAAA,KAAiBC,yCAAqB,EAAA,CAAA;AAE3D,EAAA,MAAM,CAAC,UAAY,EAAA,aAAa,CAAI,GAAAC,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,OAAO,SAAS,CAAA,CAAA;AAAA,OACxB,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,CAAAC,WAAA,EAAA;AAAA,IACC,SAAA,EAAWC,SAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,YAAA,CAAa,aAAa,CAAA,GAAI,KAAQ,GAAA,GAAA;AAAA,KACxC,CAAA;AAAA,IACD,UAAY,EAAA;AAAA,MACV,cAAc,CAAe,YAAA,EAAA,KAAA,CAAA,MAAA,CAAA;AAAA,MAC7B,OAAO,EAAE,KAAA,EAAO,CAAG,EAAA,CAAA,EAAG,QAAQ,MAAW,CAAA,EAAA,CAAA,EAAA;AAAA,KAC3C;AAAA,IACA,MAAQ,EAAA,UAAA;AAAA,IACR,QAAU,EAAA,YAAA;AAAA,IACV,SAAW,EAAA,aAAA;AAAA,IACX,KAAO,EAAA,UAAA;AAAA,IACP,SAAW,EAAA,QAAA;AAAA,IACX,GAAA;AAAA,IACC,GAAG,KAAA;AAAA,GACN,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"CompactInput.js","sources":["../src/pagination/CompactInput.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ChangeEventHandler,\n  KeyboardEventHandler,\n  forwardRef,\n  useEffect,\n  useState,\n} from \"react\";\nimport { Input, InputProps } from \"../input\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport compactInputCss from \"./CompactInput.css\";\n\nconst withBaseName = makePrefixer(\"saltCompactInput\");\n\nexport const CompactInput = forwardRef<\n  HTMLInputElement,\n  Pick<InputProps, \"inputRef\" | \"variant\">\n>(function CompactInput(props, ref) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-compact-input\",\n    css: compactInputCss,\n    window: targetWindow,\n  });\n\n  const { count, page, onPageChange } = usePaginationContext();\n\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(event, pageValue);\n      } else {\n        setInputValue(`${page}`);\n      }\n    }\n  };\n\n  const handleBlur = () => {\n    setInputValue(`${page}`);\n  };\n\n  return (\n    <Input\n      className={clsx(withBaseName(), {\n        [withBaseName(\"defaultSize\")]: count < 100,\n      })}\n      inputProps={{\n        \"aria-label\": `Go to page, ${count} total`,\n        style: { width: `${`${count}`.length}ch` },\n      }}\n      onBlur={handleBlur}\n      onChange={handleChange}\n      onKeyDown={handleKeyDown}\n      value={inputValue}\n      textAlign={\"center\"}\n      ref={ref}\n      {...props}\n    />\n  );\n});\n"],"names":["makePrefixer","forwardRef","CompactInput","useWindow","useComponentCssInjection","compactInputCss","usePaginationContext","useState","useEffect","jsx","Input","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAM,YAAA,GAAeA,0BAAa,kBAAkB,CAAA,CAAA;AAE7C,MAAM,YAAe,GAAAC,gBAAA,CAG1B,SAASC,aAAAA,CAAa,OAAO,GAAK,EAAA;AAClC,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,oBAAA;AAAA,IACR,GAAK,EAAAC,cAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,KAAA,EAAO,IAAM,EAAA,YAAA,KAAiBC,yCAAqB,EAAA,CAAA;AAE3D,EAAA,MAAM,CAAC,UAAY,EAAA,aAAa,CAAI,GAAAC,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,OAAO,SAAS,CAAA,CAAA;AAAA,OACxB,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,CAAAC,WAAA,EAAA;AAAA,IACC,SAAA,EAAWC,SAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,YAAA,CAAa,aAAa,CAAA,GAAI,KAAQ,GAAA,GAAA;AAAA,KACxC,CAAA;AAAA,IACD,UAAY,EAAA;AAAA,MACV,cAAc,CAAe,YAAA,EAAA,KAAA,CAAA,MAAA,CAAA;AAAA,MAC7B,OAAO,EAAE,KAAA,EAAO,CAAG,EAAA,CAAA,EAAG,QAAQ,MAAW,CAAA,EAAA,CAAA,EAAA;AAAA,KAC3C;AAAA,IACA,MAAQ,EAAA,UAAA;AAAA,IACR,QAAU,EAAA,YAAA;AAAA,IACV,SAAW,EAAA,aAAA;AAAA,IACX,KAAO,EAAA,UAAA;AAAA,IACP,SAAW,EAAA,QAAA;AAAA,IACX,GAAA;AAAA,IACC,GAAG,KAAA;AAAA,GACN,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/pagination/CompactPaginator.js

@@ -30,6 +30,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');
 require('../checkbox/CheckboxGroup.js');

package/dist-cjs/pagination/CompactPaginator.js.map

@@ -1 +1 @@
-{"version":3,"file":"CompactPaginator.js","sources":["../src/pagination/CompactPaginator.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, MouseEventHandler } from \"react\";\nimport { clsx } from \"clsx\";\nimport { Button } from \"../button\";\nimport { Text } from \"../text\";\nimport { makePrefixer } from \"../utils\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { PageButton } from \"./PageButton\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport compactPaginatorCss from \"./CompactPaginator.css\";\n\nconst withBaseName = makePrefixer(\"saltCompactPaginator\");\n\nexport const CompactPaginator = forwardRef<\n  HTMLDivElement,\n  ComponentPropsWithoutRef<\"div\">\n>(function CompactPaginator({ children, className, ...restProps }, ref) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-compact-paginator\",\n    css: compactPaginatorCss,\n    window: targetWindow,\n  });\n\n  const { count, page, onPageChange } = usePaginationContext();\n\n  const onPreviousPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n    onPageChange(event, Math.max(1, page - 1));\n  };\n\n  const onNextPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n    onPageChange(event, Math.min(page + 1, count));\n  };\n\n  const isOnFirstPage = page === 1;\n  const isOnLastPage = page === count;\n\n  return (\n    <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n      <Button\n        variant=\"secondary\"\n        aria-label=\"Previous Page\"\n        onClick={onPreviousPage}\n        disabled={isOnFirstPage}\n        className={withBaseName(\"arrowButton\")}\n      >\n        <ChevronLeftIcon aria-hidden />\n      </Button>\n      {children ? children : <PageButton page={page} disabled />}\n      <Text as=\"span\" variant=\"secondary\">\n        of\n      </Text>\n      <PageButton page={count} disabled={isOnLastPage} />\n      <Button\n        variant=\"secondary\"\n        aria-label=\"Next Page\"\n        onClick={onNextPage}\n        disabled={isOnLastPage}\n        className={withBaseName(\"arrowButton\")}\n      >\n        <ChevronRightIcon aria-hidden />\n      </Button>\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","CompactPaginator","useWindow","useComponentCssInjection","compactPaginatorCss","usePaginationContext","jsxs","clsx","jsx","Button","ChevronLeftIcon","PageButton","Text","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAeA,0BAAa,sBAAsB,CAAA,CAAA;AAE3C,MAAA,gBAAA,GAAmBC,iBAG9B,SAASC,iBAAAA,CAAiB,EAAE,QAAU,EAAA,SAAA,EAAA,GAAc,SAAU,EAAA,EAAG,GAAK,EAAA;AACtE,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,wBAAA;AAAA,IACR,GAAK,EAAAC,kBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,KAAA,EAAO,IAAM,EAAA,YAAA,KAAiBC,yCAAqB,EAAA,CAAA;AAE3D,EAAM,MAAA,cAAA,GAAuD,CAAC,KAAU,KAAA;AACtE,IAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,GAAO,CAAC,CAAC,CAAA,CAAA;AAAA,GAC3C,CAAA;AAEA,EAAM,MAAA,UAAA,GAAmD,CAAC,KAAU,KAAA;AAClE,IAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,IAAO,GAAA,CAAA,EAAG,KAAK,CAAC,CAAA,CAAA;AAAA,GAC/C,CAAA;AAEA,EAAA,MAAM,gBAAgB,IAAS,KAAA,CAAA,CAAA;AAC/B,EAAA,MAAM,eAAe,IAAS,KAAA,KAAA,CAAA;AAE9B,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAI,GAAG,SAAA;AAAA,IAAW,GAAA;AAAA,IAC9D,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAAC,aAAA,EAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACR,YAAW,EAAA,eAAA;AAAA,QACX,OAAS,EAAA,cAAA;AAAA,QACT,QAAU,EAAA,aAAA;AAAA,QACV,SAAA,EAAW,aAAa,aAAa,CAAA;AAAA,QAErC,QAAC,kBAAAD,cAAA,CAAAE,qBAAA,EAAA;AAAA,UAAgB,aAAW,EAAA,IAAA;AAAA,SAAC,CAAA;AAAA,OAC/B,CAAA;AAAA,MACC,QAAA,GAAW,2BAAYF,cAAA,CAAAG,qBAAA,EAAA;AAAA,QAAW,IAAA;AAAA,QAAY,QAAQ,EAAA,IAAA;AAAA,OAAC,CAAA;AAAA,sBACvDH,cAAA,CAAAI,SAAA,EAAA;AAAA,QAAK,EAAG,EAAA,MAAA;AAAA,QAAO,OAAQ,EAAA,WAAA;AAAA,QAAY,QAAA,EAAA,IAAA;AAAA,OAEpC,CAAA;AAAA,sBACCJ,cAAA,CAAAG,qBAAA,EAAA;AAAA,QAAW,IAAM,EAAA,KAAA;AAAA,QAAO,QAAU,EAAA,YAAA;AAAA,OAAc,CAAA;AAAA,sBAChDH,cAAA,CAAAC,aAAA,EAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACR,YAAW,EAAA,WAAA;AAAA,QACX,OAAS,EAAA,UAAA;AAAA,QACT,QAAU,EAAA,YAAA;AAAA,QACV,SAAA,EAAW,aAAa,aAAa,CAAA;AAAA,QAErC,QAAC,kBAAAD,cAAA,CAAAK,sBAAA,EAAA;AAAA,UAAiB,aAAW,EAAA,IAAA;AAAA,SAAC,CAAA;AAAA,OAChC,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"CompactPaginator.js","sources":["../src/pagination/CompactPaginator.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, MouseEventHandler } from \"react\";\nimport { clsx } from \"clsx\";\nimport { Button } from \"../button\";\nimport { Text } from \"../text\";\nimport { makePrefixer } from \"../utils\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { PageButton } from \"./PageButton\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport compactPaginatorCss from \"./CompactPaginator.css\";\n\nconst withBaseName = makePrefixer(\"saltCompactPaginator\");\n\nexport const CompactPaginator = forwardRef<\n  HTMLDivElement,\n  ComponentPropsWithoutRef<\"div\">\n>(function CompactPaginator({ children, className, ...restProps }, ref) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-compact-paginator\",\n    css: compactPaginatorCss,\n    window: targetWindow,\n  });\n\n  const { count, page, onPageChange } = usePaginationContext();\n\n  const onPreviousPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n    onPageChange(event, Math.max(1, page - 1));\n  };\n\n  const onNextPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n    onPageChange(event, Math.min(page + 1, count));\n  };\n\n  const isOnFirstPage = page === 1;\n  const isOnLastPage = page === count;\n\n  return (\n    <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n      <Button\n        variant=\"secondary\"\n        aria-label=\"Previous Page\"\n        onClick={onPreviousPage}\n        disabled={isOnFirstPage}\n        className={withBaseName(\"arrowButton\")}\n      >\n        <ChevronLeftIcon aria-hidden />\n      </Button>\n      {children ? children : <PageButton page={page} disabled />}\n      <Text as=\"span\" variant=\"secondary\">\n        of\n      </Text>\n      <PageButton page={count} disabled={isOnLastPage} />\n      <Button\n        variant=\"secondary\"\n        aria-label=\"Next Page\"\n        onClick={onNextPage}\n        disabled={isOnLastPage}\n        className={withBaseName(\"arrowButton\")}\n      >\n        <ChevronRightIcon aria-hidden />\n      </Button>\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","CompactPaginator","useWindow","useComponentCssInjection","compactPaginatorCss","usePaginationContext","jsxs","clsx","jsx","Button","ChevronLeftIcon","PageButton","Text","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA,MAAM,YAAA,GAAeA,0BAAa,sBAAsB,CAAA,CAAA;AAE3C,MAAA,gBAAA,GAAmBC,iBAG9B,SAASC,iBAAAA,CAAiB,EAAE,QAAU,EAAA,SAAA,EAAA,GAAc,SAAU,EAAA,EAAG,GAAK,EAAA;AACtE,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,wBAAA;AAAA,IACR,GAAK,EAAAC,kBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,KAAA,EAAO,IAAM,EAAA,YAAA,KAAiBC,yCAAqB,EAAA,CAAA;AAE3D,EAAM,MAAA,cAAA,GAAuD,CAAC,KAAU,KAAA;AACtE,IAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,GAAO,CAAC,CAAC,CAAA,CAAA;AAAA,GAC3C,CAAA;AAEA,EAAM,MAAA,UAAA,GAAmD,CAAC,KAAU,KAAA;AAClE,IAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,IAAO,GAAA,CAAA,EAAG,KAAK,CAAC,CAAA,CAAA;AAAA,GAC/C,CAAA;AAEA,EAAA,MAAM,gBAAgB,IAAS,KAAA,CAAA,CAAA;AAC/B,EAAA,MAAM,eAAe,IAAS,KAAA,KAAA,CAAA;AAE9B,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IAAI,GAAG,SAAA;AAAA,IAAW,GAAA;AAAA,IAC9D,QAAA,EAAA;AAAA,sBAACC,cAAA,CAAAC,aAAA,EAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACR,YAAW,EAAA,eAAA;AAAA,QACX,OAAS,EAAA,cAAA;AAAA,QACT,QAAU,EAAA,aAAA;AAAA,QACV,SAAA,EAAW,aAAa,aAAa,CAAA;AAAA,QAErC,QAAC,kBAAAD,cAAA,CAAAE,qBAAA,EAAA;AAAA,UAAgB,aAAW,EAAA,IAAA;AAAA,SAAC,CAAA;AAAA,OAC/B,CAAA;AAAA,MACC,QAAA,GAAW,2BAAYF,cAAA,CAAAG,qBAAA,EAAA;AAAA,QAAW,IAAA;AAAA,QAAY,QAAQ,EAAA,IAAA;AAAA,OAAC,CAAA;AAAA,sBACvDH,cAAA,CAAAI,SAAA,EAAA;AAAA,QAAK,EAAG,EAAA,MAAA;AAAA,QAAO,OAAQ,EAAA,WAAA;AAAA,QAAY,QAAA,EAAA,IAAA;AAAA,OAEpC,CAAA;AAAA,sBACCJ,cAAA,CAAAG,qBAAA,EAAA;AAAA,QAAW,IAAM,EAAA,KAAA;AAAA,QAAO,QAAU,EAAA,YAAA;AAAA,OAAc,CAAA;AAAA,sBAChDH,cAAA,CAAAC,aAAA,EAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACR,YAAW,EAAA,WAAA;AAAA,QACX,OAAS,EAAA,UAAA;AAAA,QACT,QAAU,EAAA,YAAA;AAAA,QACV,SAAA,EAAW,aAAa,aAAa,CAAA;AAAA,QAErC,QAAC,kBAAAD,cAAA,CAAAK,sBAAA,EAAA;AAAA,UAAiB,aAAW,EAAA,IAAA;AAAA,SAAC,CAAA;AAAA,OAChC,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/pagination/GoToInput.js

@@ -31,6 +31,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/pagination/GoToInput.js.map

@@ -1 +1 @@
-{"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  Ref,\n  useState,\n} from \"react\";\nimport { FormField, FormFieldLabel } from \"../form-field\";\nimport { Input } from \"../input\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport goToInputCss from \"./GoToInput.css\";\n\nconst withBaseName = makePrefixer(\"saltGoToInput\");\nexport interface GoToInputProps extends HTMLAttributes<HTMLSpanElement> {\n  /**\n   * Input label.\n   */\n  label?: string;\n  /**\n   * Optional ref for the input component\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  /**\n   * Change input variant.\n   */\n  inputVariant?: \"primary\" | \"secondary\";\n}\n\nexport const GoToInput = forwardRef<HTMLDivElement, GoToInputProps>(\n  function GoToInput(\n    {\n      className,\n      inputRef,\n      inputVariant = \"primary\",\n      label = \"Go to\",\n      ...restProps\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-go-to-input\",\n      css: goToInputCss,\n      window: targetWindow,\n    });\n\n    const { count, onPageChange } = usePaginationContext();\n    const [inputValue, setInputValue] = useState(\"\");\n\n    const onChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n      setInputValue(event.target.value);\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(event, pageValue);\n        }\n        setInputValue(\"\");\n      }\n    };\n\n    const onBlur = () => {\n      setInputValue(\"\");\n    };\n\n    const widthCh = `${`${count}`.length}ch`;\n\n    return (\n      <FormField\n        labelPlacement=\"left\"\n        className={clsx(withBaseName(), className)}\n        ref={ref}\n        {...restProps}\n      >\n        <FormFieldLabel>{label}</FormFieldLabel>\n        <Input\n          className={clsx(withBaseName(\"input\"), {\n            [withBaseName(\"inputDefaultSize\")]: count < 100,\n          })}\n          ref={inputRef}\n          inputProps={{\n            style: { width: widthCh },\n          }}\n          onBlur={onBlur}\n          onChange={onChange}\n          onKeyDown={onKeyDown}\n          value={inputValue}\n          textAlign={\"center\"}\n          variant={inputVariant}\n        />\n      </FormField>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","GoToInput","useWindow","useComponentCssInjection","goToInputCss","usePaginationContext","useState","jsxs","FormField","clsx","jsx","FormFieldLabel","Input"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA,CAAA;AAgB1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,UACP,CAAA;AAAA,IACE,SAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAe,GAAA,SAAA;AAAA,IACf,KAAQ,GAAA,OAAA;AAAA,IACL,GAAA,SAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,YAAa,EAAA,GAAIC,yCAAqB,EAAA,CAAA;AACrD,IAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAIC,eAAS,EAAE,CAAA,CAAA;AAE/C,IAAM,MAAA,QAAA,GAAiD,CAAC,KAAU,KAAA;AAChE,MAAc,aAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA,CAAA;AAAA,KAClC,CAAA;AAEA,IAAM,MAAA,SAAA,GAAoD,CAAC,KAAU,KAAA;AACnE,MAAI,IAAA,KAAA,CAAM,QAAQ,OAAS,EAAA;AACzB,QAAM,MAAA,SAAA,GAAY,OAAO,UAAU,CAAA,CAAA;AACnC,QAAA,IACE,CAAC,UAAA,CAAW,UAAW,CAAA,GAAG,CAC1B,IAAA,CAAC,KAAM,CAAA,SAAS,CAChB,IAAA,SAAA,GAAY,CACZ,IAAA,SAAA,IAAa,KACb,EAAA;AACA,UAAA,YAAA,CAAa,OAAO,SAAS,CAAA,CAAA;AAAA,SAC/B;AACA,QAAA,aAAA,CAAc,EAAE,CAAA,CAAA;AAAA,OAClB;AAAA,KACF,CAAA;AAEA,IAAA,MAAM,SAAS,MAAM;AACnB,MAAA,aAAA,CAAc,EAAE,CAAA,CAAA;AAAA,KAClB,CAAA;AAEA,IAAM,MAAA,OAAA,GAAU,CAAG,EAAA,CAAA,EAAG,KAAQ,CAAA,CAAA,CAAA,MAAA,CAAA,EAAA,CAAA,CAAA;AAE9B,IAAA,uBACGC,eAAA,CAAAC,mBAAA,EAAA;AAAA,MACC,cAAe,EAAA,MAAA;AAAA,MACf,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACC,GAAG,SAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAACC,cAAA,CAAAC,6BAAA,EAAA;AAAA,UAAgB,QAAA,EAAA,KAAA;AAAA,SAAM,CAAA;AAAA,wBACtBD,cAAA,CAAAE,WAAA,EAAA;AAAA,UACC,SAAW,EAAAH,SAAA,CAAK,YAAa,CAAA,OAAO,CAAG,EAAA;AAAA,YACrC,CAAC,YAAA,CAAa,kBAAkB,CAAA,GAAI,KAAQ,GAAA,GAAA;AAAA,WAC7C,CAAA;AAAA,UACD,GAAK,EAAA,QAAA;AAAA,UACL,UAAY,EAAA;AAAA,YACV,KAAA,EAAO,EAAE,KAAA,EAAO,OAAQ,EAAA;AAAA,WAC1B;AAAA,UACA,MAAA;AAAA,UACA,QAAA;AAAA,UACA,SAAA;AAAA,UACA,KAAO,EAAA,UAAA;AAAA,UACP,SAAW,EAAA,QAAA;AAAA,UACX,OAAS,EAAA,YAAA;AAAA,SACX,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"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  Ref,\n  useState,\n} from \"react\";\nimport { FormField, FormFieldLabel } from \"../form-field\";\nimport { Input } from \"../input\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport goToInputCss from \"./GoToInput.css\";\n\nconst withBaseName = makePrefixer(\"saltGoToInput\");\nexport interface GoToInputProps extends HTMLAttributes<HTMLSpanElement> {\n  /**\n   * Input label.\n   */\n  label?: string;\n  /**\n   * Optional ref for the input component\n   */\n  inputRef?: Ref<HTMLInputElement>;\n  /**\n   * Change input variant.\n   */\n  inputVariant?: \"primary\" | \"secondary\";\n}\n\nexport const GoToInput = forwardRef<HTMLDivElement, GoToInputProps>(\n  function GoToInput(\n    {\n      className,\n      inputRef,\n      inputVariant = \"primary\",\n      label = \"Go to\",\n      ...restProps\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-go-to-input\",\n      css: goToInputCss,\n      window: targetWindow,\n    });\n\n    const { count, onPageChange } = usePaginationContext();\n    const [inputValue, setInputValue] = useState(\"\");\n\n    const onChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n      setInputValue(event.target.value);\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(event, pageValue);\n        }\n        setInputValue(\"\");\n      }\n    };\n\n    const onBlur = () => {\n      setInputValue(\"\");\n    };\n\n    const widthCh = `${`${count}`.length}ch`;\n\n    return (\n      <FormField\n        labelPlacement=\"left\"\n        className={clsx(withBaseName(), className)}\n        ref={ref}\n        {...restProps}\n      >\n        <FormFieldLabel>{label}</FormFieldLabel>\n        <Input\n          className={clsx(withBaseName(\"input\"), {\n            [withBaseName(\"inputDefaultSize\")]: count < 100,\n          })}\n          ref={inputRef}\n          inputProps={{\n            style: { width: widthCh },\n          }}\n          onBlur={onBlur}\n          onChange={onChange}\n          onKeyDown={onKeyDown}\n          value={inputValue}\n          textAlign={\"center\"}\n          variant={inputVariant}\n        />\n      </FormField>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","GoToInput","useWindow","useComponentCssInjection","goToInputCss","usePaginationContext","useState","jsxs","FormField","clsx","jsx","FormFieldLabel","Input"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA,CAAA;AAgB1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,UACP,CAAA;AAAA,IACE,SAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAe,GAAA,SAAA;AAAA,IACf,KAAQ,GAAA,OAAA;AAAA,IACL,GAAA,SAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,YAAa,EAAA,GAAIC,yCAAqB,EAAA,CAAA;AACrD,IAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAIC,eAAS,EAAE,CAAA,CAAA;AAE/C,IAAM,MAAA,QAAA,GAAiD,CAAC,KAAU,KAAA;AAChE,MAAc,aAAA,CAAA,KAAA,CAAM,OAAO,KAAK,CAAA,CAAA;AAAA,KAClC,CAAA;AAEA,IAAM,MAAA,SAAA,GAAoD,CAAC,KAAU,KAAA;AACnE,MAAI,IAAA,KAAA,CAAM,QAAQ,OAAS,EAAA;AACzB,QAAM,MAAA,SAAA,GAAY,OAAO,UAAU,CAAA,CAAA;AACnC,QAAA,IACE,CAAC,UAAA,CAAW,UAAW,CAAA,GAAG,CAC1B,IAAA,CAAC,KAAM,CAAA,SAAS,CAChB,IAAA,SAAA,GAAY,CACZ,IAAA,SAAA,IAAa,KACb,EAAA;AACA,UAAA,YAAA,CAAa,OAAO,SAAS,CAAA,CAAA;AAAA,SAC/B;AACA,QAAA,aAAA,CAAc,EAAE,CAAA,CAAA;AAAA,OAClB;AAAA,KACF,CAAA;AAEA,IAAA,MAAM,SAAS,MAAM;AACnB,MAAA,aAAA,CAAc,EAAE,CAAA,CAAA;AAAA,KAClB,CAAA;AAEA,IAAM,MAAA,OAAA,GAAU,CAAG,EAAA,CAAA,EAAG,KAAQ,CAAA,CAAA,CAAA,MAAA,CAAA,EAAA,CAAA,CAAA;AAE9B,IAAA,uBACGC,eAAA,CAAAC,mBAAA,EAAA;AAAA,MACC,cAAe,EAAA,MAAA;AAAA,MACf,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACC,GAAG,SAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAACC,cAAA,CAAAC,6BAAA,EAAA;AAAA,UAAgB,QAAA,EAAA,KAAA;AAAA,SAAM,CAAA;AAAA,wBACtBD,cAAA,CAAAE,WAAA,EAAA;AAAA,UACC,SAAW,EAAAH,SAAA,CAAK,YAAa,CAAA,OAAO,CAAG,EAAA;AAAA,YACrC,CAAC,YAAA,CAAa,kBAAkB,CAAA,GAAI,KAAQ,GAAA,GAAA;AAAA,WAC7C,CAAA;AAAA,UACD,GAAK,EAAA,QAAA;AAAA,UACL,UAAY,EAAA;AAAA,YACV,KAAA,EAAO,EAAE,KAAA,EAAO,OAAQ,EAAA;AAAA,WAC1B;AAAA,UACA,MAAA;AAAA,UACA,QAAA;AAAA,UACA,SAAA;AAAA,UACA,KAAO,EAAA,UAAA;AAAA,UACP,SAAW,EAAA,QAAA;AAAA,UACX,OAAS,EAAA,YAAA;AAAA,SACX,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/pagination/PageButton.js

@@ -23,6 +23,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');
 require('../checkbox/CheckboxGroup.js');

package/dist-cjs/pagination/PageButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageButton.js","sources":["../src/pagination/PageButton.tsx"],"sourcesContent":["import { MouseEventHandler, forwardRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport { Button } from \"../button\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport pageButtonCss from \"./PageButton.css\";\n\nconst withBaseName = makePrefixer(\"saltPageButton\");\n\nexport interface PageButtonProps {\n  page: number;\n  selected?: boolean;\n  disabled?: boolean;\n}\nexport const PageButton = forwardRef<HTMLButtonElement, PageButtonProps>(\n  function PageButton({ page, selected, disabled }: PageButtonProps, ref) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-page-button\",\n      css: pageButtonCss,\n      window: targetWindow,\n    });\n\n    const { count, onPageChange } = usePaginationContext();\n\n    const onClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n      onPageChange(event, page);\n    };\n\n    return (\n      <Button\n        aria-label={`Page ${page} of ${count}`}\n        aria-current={selected ? \"page\" : undefined}\n        variant=\"secondary\"\n        className={clsx(withBaseName(), {\n          [withBaseName(\"selected\")]: selected,\n          [withBaseName(\"fixed\")]: page < 100,\n        })}\n        onClick={onClick}\n        disabled={disabled}\n        ref={ref}\n      >\n        {page}\n      </Button>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","PageButton","useWindow","useComponentCssInjection","pageButtonCss","usePaginationContext","jsx","Button","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAO3C,MAAM,UAAa,GAAAC,gBAAA;AAAA,EACxB,SAASC,WAAW,CAAA,EAAE,MAAM,QAAU,EAAA,QAAA,IAA6B,GAAK,EAAA;AACtE,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,YAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,YAAa,EAAA,GAAIC,yCAAqB,EAAA,CAAA;AAErD,IAAM,MAAA,OAAA,GAAgD,CAAC,KAAU,KAAA;AAC/D,MAAA,YAAA,CAAa,OAAO,IAAI,CAAA,CAAA;AAAA,KAC1B,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAAC,aAAA,EAAA;AAAA,MACC,YAAA,EAAY,QAAQ,IAAW,CAAA,IAAA,EAAA,KAAA,CAAA,CAAA;AAAA,MAC/B,cAAA,EAAc,WAAW,MAAS,GAAA,KAAA,CAAA;AAAA,MAClC,OAAQ,EAAA,WAAA;AAAA,MACR,SAAA,EAAWC,SAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,QAC9B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAA,CAAa,OAAO,CAAA,GAAI,IAAO,GAAA,GAAA;AAAA,OACjC,CAAA;AAAA,MACD,OAAA;AAAA,MACA,QAAA;AAAA,MACA,GAAA;AAAA,MAEC,QAAA,EAAA,IAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"PageButton.js","sources":["../src/pagination/PageButton.tsx"],"sourcesContent":["import { MouseEventHandler, forwardRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport { Button } from \"../button\";\nimport { makePrefixer } from \"../utils\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport pageButtonCss from \"./PageButton.css\";\n\nconst withBaseName = makePrefixer(\"saltPageButton\");\n\nexport interface PageButtonProps {\n  page: number;\n  selected?: boolean;\n  disabled?: boolean;\n}\nexport const PageButton = forwardRef<HTMLButtonElement, PageButtonProps>(\n  function PageButton({ page, selected, disabled }: PageButtonProps, ref) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-page-button\",\n      css: pageButtonCss,\n      window: targetWindow,\n    });\n\n    const { count, onPageChange } = usePaginationContext();\n\n    const onClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n      onPageChange(event, page);\n    };\n\n    return (\n      <Button\n        aria-label={`Page ${page} of ${count}`}\n        aria-current={selected ? \"page\" : undefined}\n        variant=\"secondary\"\n        className={clsx(withBaseName(), {\n          [withBaseName(\"selected\")]: selected,\n          [withBaseName(\"fixed\")]: page < 100,\n        })}\n        onClick={onClick}\n        disabled={disabled}\n        ref={ref}\n      >\n        {page}\n      </Button>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","PageButton","useWindow","useComponentCssInjection","pageButtonCss","usePaginationContext","jsx","Button","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAO3C,MAAM,UAAa,GAAAC,gBAAA;AAAA,EACxB,SAASC,WAAW,CAAA,EAAE,MAAM,QAAU,EAAA,QAAA,IAA6B,GAAK,EAAA;AACtE,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,kBAAA;AAAA,MACR,GAAK,EAAAC,YAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,YAAa,EAAA,GAAIC,yCAAqB,EAAA,CAAA;AAErD,IAAM,MAAA,OAAA,GAAgD,CAAC,KAAU,KAAA;AAC/D,MAAA,YAAA,CAAa,OAAO,IAAI,CAAA,CAAA;AAAA,KAC1B,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAAC,aAAA,EAAA;AAAA,MACC,YAAA,EAAY,QAAQ,IAAW,CAAA,IAAA,EAAA,KAAA,CAAA,CAAA;AAAA,MAC/B,cAAA,EAAc,WAAW,MAAS,GAAA,KAAA,CAAA;AAAA,MAClC,OAAQ,EAAA,WAAA;AAAA,MACR,SAAA,EAAWC,SAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,QAC9B,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,QAAA;AAAA,QAC5B,CAAC,YAAA,CAAa,OAAO,CAAA,GAAI,IAAO,GAAA,GAAA;AAAA,OACjC,CAAA;AAAA,MACD,OAAA;AAAA,MACA,QAAA;AAAA,MACA,GAAA;AAAA,MAEC,QAAA,EAAA,IAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/pagination/PageRanges.js

@@ -22,6 +22,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/pagination/PageRanges.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageRanges.js","sources":["../src/pagination/PageRanges.tsx"],"sourcesContent":["import { ReactElement, useCallback } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { PageButton } from \"./PageButton\";\nimport { PageRange, usePagination } from \"./usePagination\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport pageRangesCss from \"./PageRanges.css\";\n\nconst withBaseName = makePrefixer(\"saltPageRanges\");\n\nexport interface PageRangesProps {\n  boundaryCount?: number;\n  siblingCount?: number;\n}\n\nconst Ellipsis = () => {\n  return <div className={withBaseName(\"ellipsis\")}>{`\\u2026`}</div>;\n};\n\nconst mapRange = (range: PageRange, fn: (i: number) => ReactElement) => {\n  const result: ReactElement[] = [];\n  for (let i = range[0]; i <= range[1]; ++i) {\n    result.push(fn(i));\n  }\n  return result;\n};\n\nexport function PageRanges({\n  siblingCount = 2,\n  boundaryCount = 1,\n}: PageRangesProps) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-page-ranges\",\n    css: pageRangesCss,\n    window: targetWindow,\n  });\n\n  const { count, page } = usePaginationContext();\n\n  const renderPages = useCallback(\n    (range: PageRange) =>\n      mapRange(range, (i) => (\n        <PageButton key={i} page={i} selected={page === i} />\n      )),\n    [page]\n  );\n\n  const [leftPages, middlePages, rightPages] = usePagination(\n    page,\n    count,\n    Math.max(1, boundaryCount),\n    siblingCount\n  );\n\n  return (\n    <>\n      {leftPages && (\n        <>\n          {renderPages(leftPages)}\n          <Ellipsis />\n        </>\n      )}\n      {middlePages && renderPages(middlePages)}\n      {rightPages && (\n        <>\n          <Ellipsis />\n          {renderPages(rightPages)}\n        </>\n      )}\n    </>\n  );\n}\n"],"names":["makePrefixer","jsx","useWindow","useComponentCssInjection","pageRangesCss","usePaginationContext","useCallback","PageButton","usePagination","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAOlD,MAAM,WAAW,MAAM;AACrB,EAAA,uBAAQC,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,IAAI,QAAA,EAAA,CAAA,MAAA,CAAA;AAAA,GAAS,CAAA,CAAA;AAC7D,CAAA,CAAA;AAEA,MAAM,QAAA,GAAW,CAAC,KAAA,EAAkB,EAAoC,KAAA;AACtE,EAAA,MAAM,SAAyB,EAAC,CAAA;AAChC,EAAA,KAAA,IAAS,IAAI,KAAM,CAAA,CAAA,CAAA,EAAI,KAAK,KAAM,CAAA,CAAA,CAAA,EAAI,EAAE,CAAG,EAAA;AACzC,IAAO,MAAA,CAAA,IAAA,CAAK,EAAG,CAAA,CAAC,CAAC,CAAA,CAAA;AAAA,GACnB;AACA,EAAO,OAAA,MAAA,CAAA;AACT,CAAA,CAAA;AAEO,SAAS,UAAW,CAAA;AAAA,EACzB,YAAe,GAAA,CAAA;AAAA,EACf,aAAgB,GAAA,CAAA;AAClB,CAAoB,EAAA;AAClB,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAC,YAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,KAAA,EAAO,IAAK,EAAA,GAAIC,yCAAqB,EAAA,CAAA;AAE7C,EAAA,MAAM,WAAc,GAAAC,iBAAA;AAAA,IAClB,CAAC,KACC,KAAA,QAAA,CAAS,KAAO,EAAA,CAAC,sBACdL,cAAA,CAAAM,qBAAA,EAAA;AAAA,MAAmB,IAAM,EAAA,CAAA;AAAA,MAAG,UAAU,IAAS,KAAA,CAAA;AAAA,KAAA,EAA/B,CAAkC,CACpD,CAAA;AAAA,IACH,CAAC,IAAI,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,MAAM,CAAC,SAAA,EAAW,WAAa,EAAA,UAAU,CAAI,GAAAC,2BAAA;AAAA,IAC3C,IAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA,CAAK,GAAI,CAAA,CAAA,EAAG,aAAa,CAAA;AAAA,IACzB,YAAA;AAAA,GACF,CAAA;AAEA,EACE,uBAAAC,eAAA,CAAAC,mBAAA,EAAA;AAAA,IACG,QAAA,EAAA;AAAA,MACC,SAAA,oBAAAD,eAAA,CAAAC,mBAAA,EAAA;AAAA,QACG,QAAA,EAAA;AAAA,UAAA,WAAA,CAAY,SAAS,CAAA;AAAA,yCACrB,QAAS,EAAA,EAAA,CAAA;AAAA,SAAA;AAAA,OACZ,CAAA;AAAA,MAED,WAAA,IAAe,YAAY,WAAW,CAAA;AAAA,MACtC,UACC,oBAAAD,eAAA,CAAAC,mBAAA,EAAA;AAAA,QACE,QAAA,EAAA;AAAA,0BAAAT,cAAA,CAAC,QAAS,EAAA,EAAA,CAAA;AAAA,UACT,YAAY,UAAU,CAAA;AAAA,SAAA;AAAA,OACzB,CAAA;AAAA,KAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"PageRanges.js","sources":["../src/pagination/PageRanges.tsx"],"sourcesContent":["import { ReactElement, useCallback } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { PageButton } from \"./PageButton\";\nimport { PageRange, usePagination } from \"./usePagination\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport pageRangesCss from \"./PageRanges.css\";\n\nconst withBaseName = makePrefixer(\"saltPageRanges\");\n\nexport interface PageRangesProps {\n  boundaryCount?: number;\n  siblingCount?: number;\n}\n\nconst Ellipsis = () => {\n  return <div className={withBaseName(\"ellipsis\")}>{`\\u2026`}</div>;\n};\n\nconst mapRange = (range: PageRange, fn: (i: number) => ReactElement) => {\n  const result: ReactElement[] = [];\n  for (let i = range[0]; i <= range[1]; ++i) {\n    result.push(fn(i));\n  }\n  return result;\n};\n\nexport function PageRanges({\n  siblingCount = 2,\n  boundaryCount = 1,\n}: PageRangesProps) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-page-ranges\",\n    css: pageRangesCss,\n    window: targetWindow,\n  });\n\n  const { count, page } = usePaginationContext();\n\n  const renderPages = useCallback(\n    (range: PageRange) =>\n      mapRange(range, (i) => (\n        <PageButton key={i} page={i} selected={page === i} />\n      )),\n    [page]\n  );\n\n  const [leftPages, middlePages, rightPages] = usePagination(\n    page,\n    count,\n    Math.max(1, boundaryCount),\n    siblingCount\n  );\n\n  return (\n    <>\n      {leftPages && (\n        <>\n          {renderPages(leftPages)}\n          <Ellipsis />\n        </>\n      )}\n      {middlePages && renderPages(middlePages)}\n      {rightPages && (\n        <>\n          <Ellipsis />\n          {renderPages(rightPages)}\n        </>\n      )}\n    </>\n  );\n}\n"],"names":["makePrefixer","jsx","useWindow","useComponentCssInjection","pageRangesCss","usePaginationContext","useCallback","PageButton","usePagination","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAOlD,MAAM,WAAW,MAAM;AACrB,EAAA,uBAAQC,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAA,EAAW,aAAa,UAAU,CAAA;AAAA,IAAI,QAAA,EAAA,CAAA,MAAA,CAAA;AAAA,GAAS,CAAA,CAAA;AAC7D,CAAA,CAAA;AAEA,MAAM,QAAA,GAAW,CAAC,KAAA,EAAkB,EAAoC,KAAA;AACtE,EAAA,MAAM,SAAyB,EAAC,CAAA;AAChC,EAAA,KAAA,IAAS,IAAI,KAAM,CAAA,CAAA,CAAA,EAAI,KAAK,KAAM,CAAA,CAAA,CAAA,EAAI,EAAE,CAAG,EAAA;AACzC,IAAO,MAAA,CAAA,IAAA,CAAK,EAAG,CAAA,CAAC,CAAC,CAAA,CAAA;AAAA,GACnB;AACA,EAAO,OAAA,MAAA,CAAA;AACT,CAAA,CAAA;AAEO,SAAS,UAAW,CAAA;AAAA,EACzB,YAAe,GAAA,CAAA;AAAA,EACf,aAAgB,GAAA,CAAA;AAClB,CAAoB,EAAA;AAClB,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAC,YAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,KAAA,EAAO,IAAK,EAAA,GAAIC,yCAAqB,EAAA,CAAA;AAE7C,EAAA,MAAM,WAAc,GAAAC,iBAAA;AAAA,IAClB,CAAC,KACC,KAAA,QAAA,CAAS,KAAO,EAAA,CAAC,sBACdL,cAAA,CAAAM,qBAAA,EAAA;AAAA,MAAmB,IAAM,EAAA,CAAA;AAAA,MAAG,UAAU,IAAS,KAAA,CAAA;AAAA,KAAA,EAA/B,CAAkC,CACpD,CAAA;AAAA,IACH,CAAC,IAAI,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,MAAM,CAAC,SAAA,EAAW,WAAa,EAAA,UAAU,CAAI,GAAAC,2BAAA;AAAA,IAC3C,IAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA,CAAK,GAAI,CAAA,CAAA,EAAG,aAAa,CAAA;AAAA,IACzB,YAAA;AAAA,GACF,CAAA;AAEA,EACE,uBAAAC,eAAA,CAAAC,mBAAA,EAAA;AAAA,IACG,QAAA,EAAA;AAAA,MACC,SAAA,oBAAAD,eAAA,CAAAC,mBAAA,EAAA;AAAA,QACG,QAAA,EAAA;AAAA,UAAA,WAAA,CAAY,SAAS,CAAA;AAAA,yCACrB,QAAS,EAAA,EAAA,CAAA;AAAA,SAAA;AAAA,OACZ,CAAA;AAAA,MAED,WAAA,IAAe,YAAY,WAAW,CAAA;AAAA,MACtC,UACC,oBAAAD,eAAA,CAAAC,mBAAA,EAAA;AAAA,QACE,QAAA,EAAA;AAAA,0BAAAT,cAAA,CAAC,QAAS,EAAA,EAAA,CAAA;AAAA,UACT,YAAY,UAAU,CAAA;AAAA,SAAA;AAAA,OACzB,CAAA;AAAA,KAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/pagination/Pagination.js

@@ -24,6 +24,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/pagination/Pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","sources":["../src/pagination/Pagination.tsx"],"sourcesContent":["import {\n  forwardRef,\n  HTMLAttributes,\n  SyntheticEvent,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { PaginationContext, paginationContext } from \"./PaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport paginationCss from \"./Pagination.css\";\n\nconst withBaseName = makePrefixer(\"saltPagination\");\n\nconst { Provider } = paginationContext;\n\nexport interface PaginationProps extends HTMLAttributes<HTMLElement> {\n  /**\n   * Number of pages.\n   */\n  count: number;\n  /**\n   * Current/active page.\n   */\n  page?: number;\n  /**\n   * Default current/active page.\n   */\n  defaultPage?: number;\n  /**\n   * Callback function triggered when current page changed.\n   */\n  onPageChange?: (event: SyntheticEvent, page: number) => void;\n}\n\nexport const Pagination = forwardRef<HTMLElement, PaginationProps>(\n  function Pagination(\n    {\n      className,\n      count,\n      children,\n      defaultPage = 1,\n      page: pageProp,\n      onPageChange: onPageChangeProp,\n      ...restProps\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-pagination\",\n      css: paginationCss,\n      window: targetWindow,\n    });\n\n    const [pageState, setPageState] = useControlled({\n      controlled: pageProp,\n      default: defaultPage,\n      name: \"Pagination\",\n      state: \"page\",\n    });\n\n    const onPageChange = useCallback(\n      (event: SyntheticEvent, page: number) => {\n        setPageState(page);\n        onPageChangeProp && onPageChangeProp(event, page);\n      },\n      [onPageChangeProp, setPageState]\n    );\n\n    const contextValue: PaginationContext = useMemo(\n      () => ({\n        page: pageState,\n        count,\n        onPageChange,\n      }),\n      [pageState, count, onPageChange]\n    );\n\n    const { announce } = useAriaAnnouncer();\n    const mounted = useRef<boolean>(false);\n\n    useEffect(() => {\n      if (mounted.current) {\n        announce(`Page ${pageState}`);\n      } else {\n        mounted.current = true;\n      }\n    }, [announce, pageState]);\n\n    if (count < 2) {\n      return null;\n    }\n\n    return (\n      <Provider value={contextValue}>\n        <nav\n          className={clsx(withBaseName(), className)}\n          ref={ref}\n          {...restProps}\n        >\n          {children}\n        </nav>\n      </Provider>\n    );\n  }\n);\n"],"names":["makePrefixer","paginationContext","forwardRef","Pagination","useWindow","useComponentCssInjection","paginationCss","useControlled","useCallback","useMemo","useAriaAnnouncer","useRef","useEffect","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAElD,MAAM,EAAE,UAAa,GAAAC,mCAAA,CAAA;AAqBd,MAAM,UAAa,GAAAC,gBAAA;AAAA,EACxB,SAASC,WACP,CAAA;AAAA,IACE,SAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAc,GAAA,CAAA;AAAA,IACd,IAAM,EAAA,QAAA;AAAA,IACN,YAAc,EAAA,gBAAA;AAAA,IACX,GAAA,SAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAC,YAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIC,2BAAc,CAAA;AAAA,MAC9C,UAAY,EAAA,QAAA;AAAA,MACZ,OAAS,EAAA,WAAA;AAAA,MACT,IAAM,EAAA,YAAA;AAAA,MACN,KAAO,EAAA,MAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAA,MAAM,YAAe,GAAAC,iBAAA;AAAA,MACnB,CAAC,OAAuB,IAAiB,KAAA;AACvC,QAAA,YAAA,CAAa,IAAI,CAAA,CAAA;AACjB,QAAoB,gBAAA,IAAA,gBAAA,CAAiB,OAAO,IAAI,CAAA,CAAA;AAAA,OAClD;AAAA,MACA,CAAC,kBAAkB,YAAY,CAAA;AAAA,KACjC,CAAA;AAEA,IAAA,MAAM,YAAkC,GAAAC,aAAA;AAAA,MACtC,OAAO;AAAA,QACL,IAAM,EAAA,SAAA;AAAA,QACN,KAAA;AAAA,QACA,YAAA;AAAA,OACF,CAAA;AAAA,MACA,CAAC,SAAW,EAAA,KAAA,EAAO,YAAY,CAAA;AAAA,KACjC,CAAA;AAEA,IAAM,MAAA,EAAE,QAAS,EAAA,GAAIC,iCAAiB,EAAA,CAAA;AACtC,IAAM,MAAA,OAAA,GAAUC,aAAgB,KAAK,CAAA,CAAA;AAErC,IAAAC,eAAA,CAAU,MAAM;AACd,MAAA,IAAI,QAAQ,OAAS,EAAA;AACnB,QAAA,QAAA,CAAS,QAAQ,SAAW,CAAA,CAAA,CAAA,CAAA;AAAA,OACvB,MAAA;AACL,QAAA,OAAA,CAAQ,OAAU,GAAA,IAAA,CAAA;AAAA,OACpB;AAAA,KACC,EAAA,CAAC,QAAU,EAAA,SAAS,CAAC,CAAA,CAAA;AAExB,IAAA,IAAI,QAAQ,CAAG,EAAA;AACb,MAAO,OAAA,IAAA,CAAA;AAAA,KACT;AAEA,IAAA,uBACGC,cAAA,CAAA,QAAA,EAAA;AAAA,MAAS,KAAO,EAAA,YAAA;AAAA,MACf,QAAC,kBAAAA,cAAA,CAAA,KAAA,EAAA;AAAA,QACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG,SAAA;AAAA,QAEH,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"Pagination.js","sources":["../src/pagination/Pagination.tsx"],"sourcesContent":["import {\n  forwardRef,\n  HTMLAttributes,\n  SyntheticEvent,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { clsx } from \"clsx\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport { PaginationContext, paginationContext } from \"./PaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport paginationCss from \"./Pagination.css\";\n\nconst withBaseName = makePrefixer(\"saltPagination\");\n\nconst { Provider } = paginationContext;\n\nexport interface PaginationProps extends HTMLAttributes<HTMLElement> {\n  /**\n   * Number of pages.\n   */\n  count: number;\n  /**\n   * Current/active page.\n   */\n  page?: number;\n  /**\n   * Default current/active page.\n   */\n  defaultPage?: number;\n  /**\n   * Callback function triggered when current page changed.\n   */\n  onPageChange?: (event: SyntheticEvent, page: number) => void;\n}\n\nexport const Pagination = forwardRef<HTMLElement, PaginationProps>(\n  function Pagination(\n    {\n      className,\n      count,\n      children,\n      defaultPage = 1,\n      page: pageProp,\n      onPageChange: onPageChangeProp,\n      ...restProps\n    },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-pagination\",\n      css: paginationCss,\n      window: targetWindow,\n    });\n\n    const [pageState, setPageState] = useControlled({\n      controlled: pageProp,\n      default: defaultPage,\n      name: \"Pagination\",\n      state: \"page\",\n    });\n\n    const onPageChange = useCallback(\n      (event: SyntheticEvent, page: number) => {\n        setPageState(page);\n        onPageChangeProp && onPageChangeProp(event, page);\n      },\n      [onPageChangeProp, setPageState]\n    );\n\n    const contextValue: PaginationContext = useMemo(\n      () => ({\n        page: pageState,\n        count,\n        onPageChange,\n      }),\n      [pageState, count, onPageChange]\n    );\n\n    const { announce } = useAriaAnnouncer();\n    const mounted = useRef<boolean>(false);\n\n    useEffect(() => {\n      if (mounted.current) {\n        announce(`Page ${pageState}`);\n      } else {\n        mounted.current = true;\n      }\n    }, [announce, pageState]);\n\n    if (count < 2) {\n      return null;\n    }\n\n    return (\n      <Provider value={contextValue}>\n        <nav\n          className={clsx(withBaseName(), className)}\n          ref={ref}\n          {...restProps}\n        >\n          {children}\n        </nav>\n      </Provider>\n    );\n  }\n);\n"],"names":["makePrefixer","paginationContext","forwardRef","Pagination","useWindow","useComponentCssInjection","paginationCss","useControlled","useCallback","useMemo","useAriaAnnouncer","useRef","useEffect","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA,CAAA;AAElD,MAAM,EAAE,UAAa,GAAAC,mCAAA,CAAA;AAqBd,MAAM,UAAa,GAAAC,gBAAA;AAAA,EACxB,SAASC,WACP,CAAA;AAAA,IACE,SAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAc,GAAA,CAAA;AAAA,IACd,IAAM,EAAA,QAAA;AAAA,IACN,YAAc,EAAA,gBAAA;AAAA,IACX,GAAA,SAAA;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,iBAAA;AAAA,MACR,GAAK,EAAAC,YAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIC,2BAAc,CAAA;AAAA,MAC9C,UAAY,EAAA,QAAA;AAAA,MACZ,OAAS,EAAA,WAAA;AAAA,MACT,IAAM,EAAA,YAAA;AAAA,MACN,KAAO,EAAA,MAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAA,MAAM,YAAe,GAAAC,iBAAA;AAAA,MACnB,CAAC,OAAuB,IAAiB,KAAA;AACvC,QAAA,YAAA,CAAa,IAAI,CAAA,CAAA;AACjB,QAAoB,gBAAA,IAAA,gBAAA,CAAiB,OAAO,IAAI,CAAA,CAAA;AAAA,OAClD;AAAA,MACA,CAAC,kBAAkB,YAAY,CAAA;AAAA,KACjC,CAAA;AAEA,IAAA,MAAM,YAAkC,GAAAC,aAAA;AAAA,MACtC,OAAO;AAAA,QACL,IAAM,EAAA,SAAA;AAAA,QACN,KAAA;AAAA,QACA,YAAA;AAAA,OACF,CAAA;AAAA,MACA,CAAC,SAAW,EAAA,KAAA,EAAO,YAAY,CAAA;AAAA,KACjC,CAAA;AAEA,IAAM,MAAA,EAAE,QAAS,EAAA,GAAIC,iCAAiB,EAAA,CAAA;AACtC,IAAM,MAAA,OAAA,GAAUC,aAAgB,KAAK,CAAA,CAAA;AAErC,IAAAC,eAAA,CAAU,MAAM;AACd,MAAA,IAAI,QAAQ,OAAS,EAAA;AACnB,QAAA,QAAA,CAAS,QAAQ,SAAW,CAAA,CAAA,CAAA,CAAA;AAAA,OACvB,MAAA;AACL,QAAA,OAAA,CAAQ,OAAU,GAAA,IAAA,CAAA;AAAA,OACpB;AAAA,KACC,EAAA,CAAC,QAAU,EAAA,SAAS,CAAC,CAAA,CAAA;AAExB,IAAA,IAAI,QAAQ,CAAG,EAAA;AACb,MAAO,OAAA,IAAA,CAAA;AAAA,KACT;AAEA,IAAA,uBACGC,cAAA,CAAA,QAAA,EAAA;AAAA,MAAS,KAAO,EAAA,YAAA;AAAA,MACf,QAAC,kBAAAA,cAAA,CAAA,KAAA,EAAA;AAAA,QACC,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG,SAAA;AAAA,QAEH,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/pagination/Paginator.js

@@ -23,6 +23,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');
 require('../checkbox/CheckboxGroup.js');

package/dist-cjs/pagination/Paginator.js.map

@@ -1 +1 @@
-{"version":3,"file":"Paginator.js","sources":["../src/pagination/Paginator.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, MouseEventHandler } from \"react\";\nimport { Button } from \"../button\";\nimport { makePrefixer } from \"../utils\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { PageRanges } from \"./PageRanges\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport paginatorCss from \"./Paginator.css\";\n\nconst withBaseName = makePrefixer(\"saltPaginator\");\n\nexport interface PaginatorProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Number of pages next to the arrow buttons when page range is truncated.\n   */\n  boundaryCount?: number;\n  /**\n   * Number of pages on each side of the current page when page range is truncated.\n   */\n  siblingCount?: number;\n}\n\nexport const Paginator = forwardRef<HTMLDivElement, PaginatorProps>(\n  function Paginator(\n    { className, boundaryCount, siblingCount, ...restProps },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-paginator\",\n      css: paginatorCss,\n      window: targetWindow,\n    });\n\n    const { count, page, onPageChange } = usePaginationContext();\n\n    const onPreviousPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n      onPageChange(event, Math.max(1, page - 1));\n    };\n\n    const onNextPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n      onPageChange(event, Math.min(page + 1, count));\n    };\n\n    const isOnFirstPage = page === 1;\n    const isOnLastPage = page === count;\n\n    return (\n      <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n        <Button\n          variant=\"secondary\"\n          aria-label=\"Previous Page\"\n          onClick={onPreviousPage}\n          disabled={isOnFirstPage}\n          className={withBaseName(\"arrowButton-previous\")}\n        >\n          <ChevronLeftIcon aria-hidden />\n        </Button>\n        <PageRanges siblingCount={siblingCount} boundaryCount={boundaryCount} />\n        <Button\n          variant=\"secondary\"\n          aria-label=\"Next Page\"\n          onClick={onNextPage}\n          disabled={isOnLastPage}\n          className={withBaseName(\"arrowButton-next\")}\n        >\n          <ChevronRightIcon aria-hidden />\n        </Button>\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","Paginator","useWindow","useComponentCssInjection","paginatorCss","usePaginationContext","jsxs","clsx","jsx","Button","ChevronLeftIcon","PageRanges","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA,CAAA;AAa1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,WACP,EAAE,SAAA,EAAW,eAAe,YAAiB,EAAA,GAAA,SAAA,IAC7C,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,IAAM,EAAA,YAAA,KAAiBC,yCAAqB,EAAA,CAAA;AAE3D,IAAM,MAAA,cAAA,GAAuD,CAAC,KAAU,KAAA;AACtE,MAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,GAAO,CAAC,CAAC,CAAA,CAAA;AAAA,KAC3C,CAAA;AAEA,IAAM,MAAA,UAAA,GAAmD,CAAC,KAAU,KAAA;AAClE,MAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,IAAO,GAAA,CAAA,EAAG,KAAK,CAAC,CAAA,CAAA;AAAA,KAC/C,CAAA;AAEA,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,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAI,GAAG,SAAA;AAAA,MAAW,GAAA;AAAA,MAC9D,QAAA,EAAA;AAAA,wBAACC,cAAA,CAAAC,aAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,YAAW,EAAA,eAAA;AAAA,UACX,OAAS,EAAA,cAAA;AAAA,UACT,QAAU,EAAA,aAAA;AAAA,UACV,SAAA,EAAW,aAAa,sBAAsB,CAAA;AAAA,UAE9C,QAAC,kBAAAD,cAAA,CAAAE,qBAAA,EAAA;AAAA,YAAgB,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAC/B,CAAA;AAAA,wBACCF,cAAA,CAAAG,qBAAA,EAAA;AAAA,UAAW,YAAA;AAAA,UAA4B,aAAA;AAAA,SAA8B,CAAA;AAAA,wBACrEH,cAAA,CAAAC,aAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,YAAW,EAAA,WAAA;AAAA,UACX,OAAS,EAAA,UAAA;AAAA,UACT,QAAU,EAAA,YAAA;AAAA,UACV,SAAA,EAAW,aAAa,kBAAkB,CAAA;AAAA,UAE1C,QAAC,kBAAAD,cAAA,CAAAI,sBAAA,EAAA;AAAA,YAAiB,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAChC,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"Paginator.js","sources":["../src/pagination/Paginator.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes, MouseEventHandler } from \"react\";\nimport { Button } from \"../button\";\nimport { makePrefixer } from \"../utils\";\nimport { ChevronLeftIcon, ChevronRightIcon } from \"@salt-ds/icons\";\nimport { PageRanges } from \"./PageRanges\";\nimport { usePaginationContext } from \"./usePaginationContext\";\n\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport paginatorCss from \"./Paginator.css\";\n\nconst withBaseName = makePrefixer(\"saltPaginator\");\n\nexport interface PaginatorProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Number of pages next to the arrow buttons when page range is truncated.\n   */\n  boundaryCount?: number;\n  /**\n   * Number of pages on each side of the current page when page range is truncated.\n   */\n  siblingCount?: number;\n}\n\nexport const Paginator = forwardRef<HTMLDivElement, PaginatorProps>(\n  function Paginator(\n    { className, boundaryCount, siblingCount, ...restProps },\n    ref\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-paginator\",\n      css: paginatorCss,\n      window: targetWindow,\n    });\n\n    const { count, page, onPageChange } = usePaginationContext();\n\n    const onPreviousPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n      onPageChange(event, Math.max(1, page - 1));\n    };\n\n    const onNextPage: MouseEventHandler<HTMLButtonElement> = (event) => {\n      onPageChange(event, Math.min(page + 1, count));\n    };\n\n    const isOnFirstPage = page === 1;\n    const isOnLastPage = page === count;\n\n    return (\n      <div className={clsx(withBaseName(), className)} {...restProps} ref={ref}>\n        <Button\n          variant=\"secondary\"\n          aria-label=\"Previous Page\"\n          onClick={onPreviousPage}\n          disabled={isOnFirstPage}\n          className={withBaseName(\"arrowButton-previous\")}\n        >\n          <ChevronLeftIcon aria-hidden />\n        </Button>\n        <PageRanges siblingCount={siblingCount} boundaryCount={boundaryCount} />\n        <Button\n          variant=\"secondary\"\n          aria-label=\"Next Page\"\n          onClick={onNextPage}\n          disabled={isOnLastPage}\n          className={withBaseName(\"arrowButton-next\")}\n        >\n          <ChevronRightIcon aria-hidden />\n        </Button>\n      </div>\n    );\n  }\n);\n"],"names":["makePrefixer","forwardRef","Paginator","useWindow","useComponentCssInjection","paginatorCss","usePaginationContext","jsxs","clsx","jsx","Button","ChevronLeftIcon","PageRanges","ChevronRightIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,MAAM,YAAA,GAAeA,0BAAa,eAAe,CAAA,CAAA;AAa1C,MAAM,SAAY,GAAAC,gBAAA;AAAA,EACvB,SAASC,WACP,EAAE,SAAA,EAAW,eAAe,YAAiB,EAAA,GAAA,SAAA,IAC7C,GACA,EAAA;AACA,IAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,IAAyBC,+BAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,gBAAA;AAAA,MACR,GAAK,EAAAC,WAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,EAAE,KAAA,EAAO,IAAM,EAAA,YAAA,KAAiBC,yCAAqB,EAAA,CAAA;AAE3D,IAAM,MAAA,cAAA,GAAuD,CAAC,KAAU,KAAA;AACtE,MAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,CAAG,EAAA,IAAA,GAAO,CAAC,CAAC,CAAA,CAAA;AAAA,KAC3C,CAAA;AAEA,IAAM,MAAA,UAAA,GAAmD,CAAC,KAAU,KAAA;AAClE,MAAA,YAAA,CAAa,OAAO,IAAK,CAAA,GAAA,CAAI,IAAO,GAAA,CAAA,EAAG,KAAK,CAAC,CAAA,CAAA;AAAA,KAC/C,CAAA;AAEA,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,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MAAI,GAAG,SAAA;AAAA,MAAW,GAAA;AAAA,MAC9D,QAAA,EAAA;AAAA,wBAACC,cAAA,CAAAC,aAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,YAAW,EAAA,eAAA;AAAA,UACX,OAAS,EAAA,cAAA;AAAA,UACT,QAAU,EAAA,aAAA;AAAA,UACV,SAAA,EAAW,aAAa,sBAAsB,CAAA;AAAA,UAE9C,QAAC,kBAAAD,cAAA,CAAAE,qBAAA,EAAA;AAAA,YAAgB,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAC/B,CAAA;AAAA,wBACCF,cAAA,CAAAG,qBAAA,EAAA;AAAA,UAAW,YAAA;AAAA,UAA4B,aAAA;AAAA,SAA8B,CAAA;AAAA,wBACrEH,cAAA,CAAAC,aAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,YAAW,EAAA,WAAA;AAAA,UACX,OAAS,EAAA,UAAA;AAAA,UACT,QAAU,EAAA,YAAA;AAAA,UACV,SAAA,EAAW,aAAa,kBAAkB,CAAA;AAAA,UAE1C,QAAC,kBAAAD,cAAA,CAAAI,sBAAA,EAAA;AAAA,YAAiB,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAChC,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}

package/dist-cjs/panel/Panel.js

@@ -22,6 +22,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/panel/Panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"Panel.js","sources":["../src/panel/Panel.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport panelCss from \"./Panel.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\n/**\n * Panel component that acts as wrapper around a node\n *\n * @example\n * const PanelExample = () => (\n *   <Panel>\n *     <p>This is a panel around some text.</p>\n *   </Panel>\n * );\n *\n */\n\nexport interface PanelProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Styling variant; defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n}\n\nconst withBaseName = makePrefixer(\"saltPanel\");\n\nexport const Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n  { className, children, variant = \"primary\", ...restProps },\n  ref\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-panel\",\n    css: panelCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      className={clsx(withBaseName(), withBaseName(variant), className)}\n      ref={ref}\n      {...restProps}\n    >\n      {children}\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Panel","useWindow","useComponentCssInjection","panelCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAM,YAAA,GAAeA,0BAAa,WAAW,CAAA,CAAA;AAEhC,MAAA,KAAA,GAAQC,gBAAuC,CAAA,SAASC,MACnE,CAAA,EAAE,SAAW,EAAA,QAAA,EAAU,OAAU,GAAA,SAAA,EAAA,GAAc,SAAU,EAAA,EACzD,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,OAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,OAAO,GAAG,SAAS,CAAA;AAAA,IAChE,GAAA;AAAA,IACC,GAAG,SAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Panel.js","sources":["../src/panel/Panel.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { forwardRef, HTMLAttributes } from \"react\";\nimport { makePrefixer } from \"../utils\";\n\nimport panelCss from \"./Panel.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\n/**\n * Panel component that acts as wrapper around a node\n *\n * @example\n * const PanelExample = () => (\n *   <Panel>\n *     <p>This is a panel around some text.</p>\n *   </Panel>\n * );\n *\n */\n\nexport interface PanelProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Styling variant; defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n}\n\nconst withBaseName = makePrefixer(\"saltPanel\");\n\nexport const Panel = forwardRef<HTMLDivElement, PanelProps>(function Panel(\n  { className, children, variant = \"primary\", ...restProps },\n  ref\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-panel\",\n    css: panelCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      className={clsx(withBaseName(), withBaseName(variant), className)}\n      ref={ref}\n      {...restProps}\n    >\n      {children}\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Panel","useWindow","useComponentCssInjection","panelCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAM,YAAA,GAAeA,0BAAa,WAAW,CAAA,CAAA;AAEhC,MAAA,KAAA,GAAQC,gBAAuC,CAAA,SAASC,MACnE,CAAA,EAAE,SAAW,EAAA,QAAA,EAAU,OAAU,GAAA,SAAA,EAAA,GAAc,SAAU,EAAA,EACzD,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,YAAA;AAAA,IACR,GAAK,EAAAC,OAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,WAAWC,SAAK,CAAA,YAAA,IAAgB,YAAa,CAAA,OAAO,GAAG,SAAS,CAAA;AAAA,IAChE,GAAA;AAAA,IACC,GAAG,SAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/parent-child-layout/ParentChildLayout.js

@@ -22,6 +22,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/parent-child-layout/ParentChildLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"ParentChildLayout.js","sources":["../src/parent-child-layout/ParentChildLayout.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  ReactNode,\n  useEffect,\n} from \"react\";\nimport { Breakpoints } from \"../breakpoints\";\nimport { makePrefixer } from \"../utils\";\nimport { useIsViewportLargerThanBreakpoint } from \"./useIsViewportLargerThanBreakpoint\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport parentChildLayoutCss from \"./ParentChildLayout.css\";\nexport interface ParentChildLayoutProps\n  extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Breakpoint at which the parent and child will stack.\n   */\n  collapseAtBreakpoint?: keyof Breakpoints;\n  /**\n   * View that is displayed when in a collapsed state.\n   */\n  visibleView?: \"child\" | \"parent\";\n  /**\n   * Controls the space between parent and child components, default is 0.\n   */\n  gap?: number;\n  /**\n   * Parent component to be rendered\n   */\n  parent: ReactNode;\n  /**\n   * Child component to be rendered\n   */\n  child: ReactNode;\n  /**\n   * Function called when the viewport size equal to or less than the collapseAtBreakpoint variable\n   */\n  onCollapseChange?: (isCollapsed: boolean) => void;\n}\n\nconst withBaseName = makePrefixer(\"saltParentChildLayout\");\n\nexport const ParentChildLayout = forwardRef<\n  HTMLDivElement,\n  ParentChildLayoutProps\n>(function ParentChildLayout(\n  {\n    collapseAtBreakpoint = \"sm\",\n    visibleView = \"child\",\n    parent,\n    child,\n    className,\n    gap = 0,\n    onCollapseChange,\n    style,\n    ...rest\n  },\n  ref\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-parent-child-layout\",\n    css: parentChildLayoutCss,\n    window: targetWindow,\n  });\n\n  const isCollapsed = useIsViewportLargerThanBreakpoint(collapseAtBreakpoint);\n\n  useEffect(() => {\n    onCollapseChange?.(isCollapsed);\n  }, [isCollapsed, onCollapseChange]);\n\n  const parentChildLayoutStyles = {\n    ...style,\n    \"--parentChildLayout-gap\": `calc(var(--salt-spacing-100) * ${gap})`,\n  };\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(withBaseName(), className)}\n      style={parentChildLayoutStyles}\n      {...rest}\n    >\n      {isCollapsed ? (\n        <div\n          key={visibleView}\n          className={clsx({\n            [withBaseName(\"collapsed\")]: isCollapsed,\n            [withBaseName(\"childAnimation\")]: visibleView === \"child\",\n            [withBaseName(\"parentAnimation\")]: visibleView === \"parent\",\n          })}\n        >\n          {isCollapsed && visibleView === \"child\" ? child : parent}\n        </div>\n      ) : (\n        <>\n          <div className={withBaseName(\"parent\")}>{parent}</div>\n          <div className={withBaseName(\"child\")}>{child}</div>\n        </>\n      )}\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","ParentChildLayout","useWindow","useComponentCssInjection","parentChildLayoutCss","useIsViewportLargerThanBreakpoint","useEffect","jsx","clsx","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,MAAM,YAAA,GAAeA,0BAAa,uBAAuB,CAAA,CAAA;AAE5C,MAAA,iBAAA,GAAoBC,gBAG/B,CAAA,SAASC,kBACT,CAAA;AAAA,EACE,oBAAuB,GAAA,IAAA;AAAA,EACvB,WAAc,GAAA,OAAA;AAAA,EACd,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAM,GAAA,CAAA;AAAA,EACN,gBAAA;AAAA,EACA,KAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,WAAA,GAAcC,oEAAkC,oBAAoB,CAAA,CAAA;AAE1E,EAAAC,eAAA,CAAU,MAAM;AACd,IAAmB,gBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAAA,WAAA,CAAA,CAAA;AAAA,GAClB,EAAA,CAAC,WAAa,EAAA,gBAAgB,CAAC,CAAA,CAAA;AAElC,EAAA,MAAM,uBAA0B,GAAA;AAAA,IAC9B,GAAG,KAAA;AAAA,IACH,2BAA2B,CAAkC,+BAAA,EAAA,GAAA,CAAA,CAAA,CAAA;AAAA,GAC/D,CAAA;AAEA,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAA;AAAA,IACA,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,KAAO,EAAA,uBAAA;AAAA,IACN,GAAG,IAAA;AAAA,IAEH,wCACED,cAAA,CAAA,KAAA,EAAA;AAAA,MAEC,WAAWC,SAAK,CAAA;AAAA,QACd,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,WAAA;AAAA,QAC7B,CAAC,YAAA,CAAa,gBAAgB,CAAA,GAAI,WAAgB,KAAA,OAAA;AAAA,QAClD,CAAC,YAAA,CAAa,iBAAiB,CAAA,GAAI,WAAgB,KAAA,QAAA;AAAA,OACpD,CAAA;AAAA,MAEA,QAAA,EAAA,WAAA,IAAe,WAAgB,KAAA,OAAA,GAAU,KAAQ,GAAA,MAAA;AAAA,KAAA,EAP7C,WAQP,CAEA,mBAAAC,eAAA,CAAAC,mBAAA,EAAA;AAAA,MACE,QAAA,EAAA;AAAA,wBAACH,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,UAAI,QAAA,EAAA,MAAA;AAAA,SAAO,CAAA;AAAA,wBAC/CA,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,UAAI,QAAA,EAAA,KAAA;AAAA,SAAM,CAAA;AAAA,OAAA;AAAA,KAChD,CAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"ParentChildLayout.js","sources":["../src/parent-child-layout/ParentChildLayout.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n  ComponentPropsWithoutRef,\n  forwardRef,\n  ReactNode,\n  useEffect,\n} from \"react\";\nimport { Breakpoints } from \"../breakpoints\";\nimport { makePrefixer } from \"../utils\";\nimport { useIsViewportLargerThanBreakpoint } from \"./useIsViewportLargerThanBreakpoint\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\n\nimport parentChildLayoutCss from \"./ParentChildLayout.css\";\nexport interface ParentChildLayoutProps\n  extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Breakpoint at which the parent and child will stack.\n   */\n  collapseAtBreakpoint?: keyof Breakpoints;\n  /**\n   * View that is displayed when in a collapsed state.\n   */\n  visibleView?: \"child\" | \"parent\";\n  /**\n   * Controls the space between parent and child components, default is 0.\n   */\n  gap?: number;\n  /**\n   * Parent component to be rendered\n   */\n  parent: ReactNode;\n  /**\n   * Child component to be rendered\n   */\n  child: ReactNode;\n  /**\n   * Function called when the viewport size equal to or less than the collapseAtBreakpoint variable\n   */\n  onCollapseChange?: (isCollapsed: boolean) => void;\n}\n\nconst withBaseName = makePrefixer(\"saltParentChildLayout\");\n\nexport const ParentChildLayout = forwardRef<\n  HTMLDivElement,\n  ParentChildLayoutProps\n>(function ParentChildLayout(\n  {\n    collapseAtBreakpoint = \"sm\",\n    visibleView = \"child\",\n    parent,\n    child,\n    className,\n    gap = 0,\n    onCollapseChange,\n    style,\n    ...rest\n  },\n  ref\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-parent-child-layout\",\n    css: parentChildLayoutCss,\n    window: targetWindow,\n  });\n\n  const isCollapsed = useIsViewportLargerThanBreakpoint(collapseAtBreakpoint);\n\n  useEffect(() => {\n    onCollapseChange?.(isCollapsed);\n  }, [isCollapsed, onCollapseChange]);\n\n  const parentChildLayoutStyles = {\n    ...style,\n    \"--parentChildLayout-gap\": `calc(var(--salt-spacing-100) * ${gap})`,\n  };\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(withBaseName(), className)}\n      style={parentChildLayoutStyles}\n      {...rest}\n    >\n      {isCollapsed ? (\n        <div\n          key={visibleView}\n          className={clsx({\n            [withBaseName(\"collapsed\")]: isCollapsed,\n            [withBaseName(\"childAnimation\")]: visibleView === \"child\",\n            [withBaseName(\"parentAnimation\")]: visibleView === \"parent\",\n          })}\n        >\n          {isCollapsed && visibleView === \"child\" ? child : parent}\n        </div>\n      ) : (\n        <>\n          <div className={withBaseName(\"parent\")}>{parent}</div>\n          <div className={withBaseName(\"child\")}>{child}</div>\n        </>\n      )}\n    </div>\n  );\n});\n"],"names":["makePrefixer","forwardRef","ParentChildLayout","useWindow","useComponentCssInjection","parentChildLayoutCss","useIsViewportLargerThanBreakpoint","useEffect","jsx","clsx","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,MAAM,YAAA,GAAeA,0BAAa,uBAAuB,CAAA,CAAA;AAE5C,MAAA,iBAAA,GAAoBC,gBAG/B,CAAA,SAASC,kBACT,CAAA;AAAA,EACE,oBAAuB,GAAA,IAAA;AAAA,EACvB,WAAc,GAAA,OAAA;AAAA,EACd,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAM,GAAA,CAAA;AAAA,EACN,gBAAA;AAAA,EACA,KAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,mBAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,WAAA,GAAcC,oEAAkC,oBAAoB,CAAA,CAAA;AAE1E,EAAAC,eAAA,CAAU,MAAM;AACd,IAAmB,gBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAAA,WAAA,CAAA,CAAA;AAAA,GAClB,EAAA,CAAC,WAAa,EAAA,gBAAgB,CAAC,CAAA,CAAA;AAElC,EAAA,MAAM,uBAA0B,GAAA;AAAA,IAC9B,GAAG,KAAA;AAAA,IACH,2BAA2B,CAAkC,+BAAA,EAAA,GAAA,CAAA,CAAA,CAAA;AAAA,GAC/D,CAAA;AAEA,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAA;AAAA,IACA,SAAW,EAAAC,SAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,IACzC,KAAO,EAAA,uBAAA;AAAA,IACN,GAAG,IAAA;AAAA,IAEH,wCACED,cAAA,CAAA,KAAA,EAAA;AAAA,MAEC,WAAWC,SAAK,CAAA;AAAA,QACd,CAAC,YAAa,CAAA,WAAW,CAAI,GAAA,WAAA;AAAA,QAC7B,CAAC,YAAA,CAAa,gBAAgB,CAAA,GAAI,WAAgB,KAAA,OAAA;AAAA,QAClD,CAAC,YAAA,CAAa,iBAAiB,CAAA,GAAI,WAAgB,KAAA,QAAA;AAAA,OACpD,CAAA;AAAA,MAEA,QAAA,EAAA,WAAA,IAAe,WAAgB,KAAA,OAAA,GAAU,KAAQ,GAAA,MAAA;AAAA,KAAA,EAP7C,WAQP,CAEA,mBAAAC,eAAA,CAAAC,mBAAA,EAAA;AAAA,MACE,QAAA,EAAA;AAAA,wBAACH,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,QAAQ,CAAA;AAAA,UAAI,QAAA,EAAA,MAAA;AAAA,SAAO,CAAA;AAAA,wBAC/CA,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,UAAI,QAAA,EAAA,KAAA;AAAA,SAAM,CAAA;AAAA,OAAA;AAAA,KAChD,CAAA;AAAA,GAEJ,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js

@@ -20,6 +20,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');

package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js.map

@@ -1 +1 @@
-{"version":3,"file":"useIsViewportLargerThanBreakpoint.js","sources":["../src/parent-child-layout/useIsViewportLargerThanBreakpoint.ts"],"sourcesContent":["import { Breakpoints } from \"../breakpoints\";\nimport { useCurrentBreakpoint, useOrderedBreakpoints } from \"../utils\";\n\nexport const useIsViewportLargerThanBreakpoint = (\n  targetedBreakpoint: keyof Breakpoints\n): boolean => {\n  const orderedBreakpoints = useOrderedBreakpoints();\n  const index = orderedBreakpoints.indexOf(targetedBreakpoint);\n  const currentBreakpoint = useCurrentBreakpoint();\n  const currentBreakpointIndex = orderedBreakpoints.indexOf(currentBreakpoint);\n  return index >= currentBreakpointIndex;\n};\n"],"names":["useOrderedBreakpoints","useCurrentBreakpoint"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGa,MAAA,iCAAA,GAAoC,CAC/C,kBACY,KAAA;AACZ,EAAA,MAAM,qBAAqBA,uCAAsB,EAAA,CAAA;AACjD,EAAM,MAAA,KAAA,GAAQ,kBAAmB,CAAA,OAAA,CAAQ,kBAAkB,CAAA,CAAA;AAC3D,EAAA,MAAM,oBAAoBC,sCAAqB,EAAA,CAAA;AAC/C,EAAM,MAAA,sBAAA,GAAyB,kBAAmB,CAAA,OAAA,CAAQ,iBAAiB,CAAA,CAAA;AAC3E,EAAA,OAAO,KAAS,IAAA,sBAAA,CAAA;AAClB;;;;"}
+{"version":3,"file":"useIsViewportLargerThanBreakpoint.js","sources":["../src/parent-child-layout/useIsViewportLargerThanBreakpoint.ts"],"sourcesContent":["import { Breakpoints } from \"../breakpoints\";\nimport { useCurrentBreakpoint, useOrderedBreakpoints } from \"../utils\";\n\nexport const useIsViewportLargerThanBreakpoint = (\n  targetedBreakpoint: keyof Breakpoints\n): boolean => {\n  const orderedBreakpoints = useOrderedBreakpoints();\n  const index = orderedBreakpoints.indexOf(targetedBreakpoint);\n  const currentBreakpoint = useCurrentBreakpoint();\n  const currentBreakpointIndex = orderedBreakpoints.indexOf(currentBreakpoint);\n  return index >= currentBreakpointIndex;\n};\n"],"names":["useOrderedBreakpoints","useCurrentBreakpoint"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGa,MAAA,iCAAA,GAAoC,CAC/C,kBACY,KAAA;AACZ,EAAA,MAAM,qBAAqBA,uCAAsB,EAAA,CAAA;AACjD,EAAM,MAAA,KAAA,GAAQ,kBAAmB,CAAA,OAAA,CAAQ,kBAAkB,CAAA,CAAA;AAC3D,EAAA,MAAM,oBAAoBC,sCAAqB,EAAA,CAAA;AAC/C,EAAM,MAAA,sBAAA,GAAyB,kBAAmB,CAAA,OAAA,CAAQ,iBAAiB,CAAA,CAAA;AAC3E,EAAA,OAAO,KAAS,IAAA,sBAAA,CAAA;AAClB;;;;"}

package/dist-cjs/pill/Pill.js

@@ -25,6 +25,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 var useButton = require('../button/useButton.js');
 require('../card/Card.js');

package/dist-cjs/pill/Pill.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pill.js","sources":["../src/pill/Pill.tsx"],"sourcesContent":["import { forwardRef, ComponentPropsWithoutRef } from \"react\";\nimport clsx from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport pillCss from \"./Pill.css\";\nimport { makePrefixer } from \"../utils\";\nimport { useButton } from \"../button\";\n\nconst withBaseName = makePrefixer(\"saltPill\");\n\n/* eslint-disable @typescript-eslint/no-empty-interface */\nexport interface PillProps extends ComponentPropsWithoutRef<\"button\"> {}\n\nexport const Pill = forwardRef<HTMLButtonElement, PillProps>(function Pill(\n  {\n    children,\n    className,\n    disabled,\n    onKeyUp,\n    onKeyDown,\n    onClick,\n    onBlur,\n    ...rest\n  },\n  ref\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-pill\",\n    css: pillCss,\n    window: targetWindow,\n  });\n  const { buttonProps, active } = useButton<HTMLButtonElement>({\n    disabled,\n    onKeyUp,\n    onKeyDown,\n    onClick,\n    onBlur,\n  });\n  // we do not want to spread tab index in this case because the button element\n  // does not require tabindex=\"0\" attribute\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  const { tabIndex, ...restButtonProps } = buttonProps;\n  return (\n    <button\n      data-testid=\"pill\"\n      ref={ref}\n      className={clsx(\n        withBaseName(),\n        withBaseName(\"clickable\"),\n        { [withBaseName(\"active\")]: active },\n        className\n      )}\n      type=\"button\"\n      {...restButtonProps}\n      {...rest}\n    >\n      {children}\n    </button>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Pill","useWindow","useComponentCssInjection","pillCss","useButton","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA,CAAA;AAK/B,MAAA,IAAA,GAAOC,gBAAyC,CAAA,SAASC,KACpE,CAAA;AAAA,EACE,QAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AACD,EAAA,MAAM,EAAE,WAAA,EAAa,MAAO,EAAA,GAAIC,mBAA6B,CAAA;AAAA,IAC3D,QAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,GACD,CAAA,CAAA;AAID,EAAM,MAAA,EAAE,QAAa,EAAA,GAAA,eAAA,EAAoB,GAAA,WAAA,CAAA;AACzC,EAAA,uBACGC,cAAA,CAAA,QAAA,EAAA;AAAA,IACC,aAAY,EAAA,MAAA;AAAA,IACZ,GAAA;AAAA,IACA,SAAW,EAAAC,wBAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,WAAW,CAAA;AAAA,MACxB,EAAE,CAAC,YAAa,CAAA,QAAQ,IAAI,MAAO,EAAA;AAAA,MACnC,SAAA;AAAA,KACF;AAAA,IACA,IAAK,EAAA,QAAA;AAAA,IACJ,GAAG,eAAA;AAAA,IACH,GAAG,IAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Pill.js","sources":["../src/pill/Pill.tsx"],"sourcesContent":["import { forwardRef, ComponentPropsWithoutRef } from \"react\";\nimport clsx from \"clsx\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport pillCss from \"./Pill.css\";\nimport { makePrefixer } from \"../utils\";\nimport { useButton } from \"../button\";\n\nconst withBaseName = makePrefixer(\"saltPill\");\n\n/* eslint-disable @typescript-eslint/no-empty-interface */\nexport interface PillProps extends ComponentPropsWithoutRef<\"button\"> {}\n\nexport const Pill = forwardRef<HTMLButtonElement, PillProps>(function Pill(\n  {\n    children,\n    className,\n    disabled,\n    onKeyUp,\n    onKeyDown,\n    onClick,\n    onBlur,\n    ...rest\n  },\n  ref\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-pill\",\n    css: pillCss,\n    window: targetWindow,\n  });\n  const { buttonProps, active } = useButton<HTMLButtonElement>({\n    disabled,\n    onKeyUp,\n    onKeyDown,\n    onClick,\n    onBlur,\n  });\n  // we do not want to spread tab index in this case because the button element\n  // does not require tabindex=\"0\" attribute\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  const { tabIndex, ...restButtonProps } = buttonProps;\n  return (\n    <button\n      data-testid=\"pill\"\n      ref={ref}\n      className={clsx(\n        withBaseName(),\n        withBaseName(\"clickable\"),\n        { [withBaseName(\"active\")]: active },\n        className\n      )}\n      type=\"button\"\n      {...restButtonProps}\n      {...rest}\n    >\n      {children}\n    </button>\n  );\n});\n"],"names":["makePrefixer","forwardRef","Pill","useWindow","useComponentCssInjection","pillCss","useButton","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA,CAAA;AAK/B,MAAA,IAAA,GAAOC,gBAAyC,CAAA,SAASC,KACpE,CAAA;AAAA,EACE,QAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAeC,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,WAAA;AAAA,IACR,GAAK,EAAAC,MAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AACD,EAAA,MAAM,EAAE,WAAA,EAAa,MAAO,EAAA,GAAIC,mBAA6B,CAAA;AAAA,IAC3D,QAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,GACD,CAAA,CAAA;AAID,EAAM,MAAA,EAAE,QAAa,EAAA,GAAA,eAAA,EAAoB,GAAA,WAAA,CAAA;AACzC,EAAA,uBACGC,cAAA,CAAA,QAAA,EAAA;AAAA,IACC,aAAY,EAAA,MAAA;AAAA,IACZ,GAAA;AAAA,IACA,SAAW,EAAAC,wBAAA;AAAA,MACT,YAAa,EAAA;AAAA,MACb,aAAa,WAAW,CAAA;AAAA,MACxB,EAAE,CAAC,YAAa,CAAA,QAAQ,IAAI,MAAO,EAAA;AAAA,MACnC,SAAA;AAAA,KACF;AAAA,IACA,IAAK,EAAA,QAAA;AAAA,IACJ,GAAG,eAAA;AAAA,IACH,GAAG,IAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist-cjs/pill-input/PillInput.js

@@ -27,6 +27,7 @@ require('../banner/BannerActions.js');
 require('../banner/BannerContent.js');
 require('../border-item/BorderItem.js');
 require('../border-layout/BorderLayout.js');
+require('../breakpoints/BreakpointProvider.js');
 require('../button/Button.js');
 require('../card/Card.js');
 require('../checkbox/Checkbox.js');