@danske/sapphire-react-lab 0.101.1 → 0.102.0

package/build/esm/Accordion/src/Accordion.js

@@ -60,7 +60,7 @@ const _Accordion = (_a, ref) => {
   const { accordionProps } = useAccordion(props, state, forwardedRef);
   return /* @__PURE__ */ React.createElement(AccordionContext.Provider, {
     value: { sidePadding }
-  }, /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, mergeProps(accordionProps, filterDOMProps(props, { labelable: true }))), {
+  }, /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, mergeProps(accordionProps, filterDOMProps(props, { global: true, labelable: true }))), {
     ref: forwardedRef,
     className: clsx(styles["sapphire-accordion"], {
       [styles["sapphire-accordion--without-last-divider"]]: hideLastDivider,

package/build/esm/Accordion/src/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sources":["../../../../src/Accordion/src/Accordion.tsx"],"sourcesContent":["import React, { ForwardedRef, Ref, forwardRef } from 'react';\nimport clsx from 'clsx';\nimport { useAccordion } from '@react-aria/accordion';\nimport { filterDOMProps, mergeProps, useObjectRef } from '@react-aria/utils';\nimport { CollectionBase, DOMProps, Expandable } from '@react-types/shared';\nimport styles from '@danske/sapphire-css/components/accordion/accordion.module.css';\nimport {\n  SapphireStyleProps,\n  TypographyHeadingProps,\n  useSapphireStyleProps,\n  useThemeCheck,\n  withTruthyZero as hasAllowedCustomSidePadding,\n} from '@danske/sapphire-react';\n\nimport { _AccordionItem } from './AccordionItem';\nimport { AccordionContext } from './AccordionContext';\nimport { TreeExpansionMode, useTreeState } from './useTreeState';\n\nexport interface AccordionProps<T>\n  extends SapphireStyleProps,\n    CollectionBase<T>,\n    DOMProps,\n    Expandable {\n  /** Allow one or many expanded items\n   * @default 'multiple'\n   */\n  expansionMode?: TreeExpansionMode;\n  /** Set aria-level attribute for item's header. Accessibility requirement.\n   * Defines the hierarchical level of an element within a page structure.\n   * @default 5\n   */\n  headerLevel?: TypographyHeadingProps['level'];\n  /**\n   * Removes the divider after the last accordion item.\n   * Useful when rendered in a container which already has borders.\n   */\n  hideLastDivider?: boolean;\n  /**\n   * Counter acts the side padding, so that accordion is shifted to the left with same amount\n   * and having side padding * 2 added to width – resulting in full width accordion.\n   * Useful in scenarions where accordion is inside a padded container and desired layout has accordion going from edge to edge horizontally.\n   * @example\n   * ```tsx\n   * <Accordion hasNegativeSideMargin>...</Accordion>\n   * ```\n   */\n  hasNegativeSideMargin?: boolean;\n  /**\n   * Add custom sized padding to the sides of the accordion items.\n   * @example\n   * ```tsx\n   * <Accordion sidePadding={tokens.size.spacingContainerHorizontalM.value} hasNegativeSideMargin>...</Accordion>\n   * ```\n   */\n  sidePadding?: number | string;\n}\n\nconst _Accordion = <T extends object>(\n  {\n    expansionMode = 'multiple',\n    headerLevel = 5,\n    hideLastDivider = false,\n    hasNegativeSideMargin = false,\n    sidePadding,\n    ...props\n  }: AccordionProps<T>,\n  ref: ForwardedRef<HTMLDivElement>\n) => {\n  useThemeCheck();\n  const { styleProps } = useSapphireStyleProps(props);\n  const state = useTreeState<T>({ ...props, expansionMode });\n  const forwardedRef = useObjectRef<HTMLDivElement>(ref);\n\n  const { accordionProps } = useAccordion(props, state, forwardedRef);\n\n  return (\n    <AccordionContext.Provider value={{ sidePadding }}>\n      <div\n        {...mergeProps(\n          accordionProps,\n          filterDOMProps(props, { labelable: true })\n        )}\n        ref={forwardedRef}\n        className={clsx(\n          styles['sapphire-accordion'],\n          {\n            [styles['sapphire-accordion--without-last-divider']]:\n              hideLastDivider,\n            [styles['sapphire-accordion--negative-margin-self']]:\n              !hasAllowedCustomSidePadding(sidePadding) &&\n              hasNegativeSideMargin,\n          },\n          styleProps.className\n        )}\n        style={{\n          ...(hasAllowedCustomSidePadding(sidePadding) && hasNegativeSideMargin\n            ? {\n                marginLeft:\n                  typeof sidePadding === 'string'\n                    ? `calc(${sidePadding} * -1)`\n                    : `-${sidePadding}px`,\n                width: `calc(100% + calc(${sidePadding} * 2${\n                  typeof sidePadding === 'string' ? '' : 'px'\n                }))`,\n              }\n            : {}),\n          ...styleProps.style,\n        }}\n      >\n        {Array.from(state.collection).map((item) => (\n          <_AccordionItem<T>\n            headerLevel={headerLevel}\n            key={item.key}\n            item={item}\n            state={state}\n          />\n        ))}\n      </div>\n    </AccordionContext.Provider>\n  );\n};\n\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore Expression produces a union type that is too complex to represent.\nexport const Accordion = forwardRef(_Accordion) as <T extends object>(\n  props: AccordionProps<T> & { ref?: Ref<HTMLDivElement> }\n) => React.ReactElement;\n"],"names":["hasAllowedCustomSidePadding"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDA,MAAM,UAAA,GAAa,CACjB,EAAA,EAQA,GACG,KAAA;AATH,EACE,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAgB,aAAA,GAAA,UAAA;AAAA,IAChB,WAAc,GAAA,CAAA;AAAA,IACd,eAAkB,GAAA,KAAA;AAAA,IAClB,qBAAwB,GAAA,KAAA;AAAA,IACxB,WAAA;AAAA,GALF,GAAA,EAAA,EAMK,kBANL,EAMK,EAAA;AAAA,IALH,eAAA;AAAA,IACA,aAAA;AAAA,IACA,iBAAA;AAAA,IACA,uBAAA;AAAA,IACA,aAAA;AAAA,GAAA,CAAA,CAAA;AAKF,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAC7C,EAAA,MAAM,KAAQ,GAAA,YAAA,CAAgB,aAAK,CAAA,cAAA,CAAA,EAAA,EAAA,KAAA,CAAA,EAAL,EAAY,aAAA,EAAA,CAAA,CAAA,CAAA;AAC1C,EAAA,MAAM,eAAe,YAA6B,CAAA,GAAA,CAAA,CAAA;AAElD,EAAA,MAAM,EAAE,cAAA,EAAA,GAAmB,YAAa,CAAA,KAAA,EAAO,KAAO,EAAA,YAAA,CAAA,CAAA;AAEtD,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,iBAAiB,QAAlB,EAAA;AAAA,IAA2B,OAAO,EAAE,WAAA,EAAA;AAAA,GAClC,kBAAA,KAAA,CAAA,aAAA,CAAC,OAAD,aACM,CAAA,cAAA,CAAA,EAAA,EAAA,UAAA,CACF,gBACA,cAAe,CAAA,KAAA,EAAO,EAAE,SAAA,EAAW,IAHvC,EAAA,CAAA,CAAA,CAAA,EAAA;AAAA,IAKE,GAAK,EAAA,YAAA;AAAA,IACL,SAAA,EAAW,IACT,CAAA,MAAA,CAAO,oBACP,CAAA,EAAA;AAAA,MAAA,CACG,OAAO,0CACN,CAAA,GAAA,eAAA;AAAA,MAAA,CACD,MAAO,CAAA,0CAAA,CAAA,GACN,CAACA,cAAA,CAA4B,WAC7B,CAAA,IAAA,qBAAA;AAAA,KAAA,EAEJ,UAAW,CAAA,SAAA,CAAA;AAAA,IAEb,KAAO,EAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EACDA,cAA4B,CAAA,WAAA,CAAA,IAAgB,qBAC5C,GAAA;AAAA,MACE,YACE,OAAO,WAAA,KAAgB,QACnB,GAAA,CAAA,KAAA,EAAQ,sBACR,CAAI,CAAA,EAAA,WAAA,CAAA,EAAA,CAAA;AAAA,MACV,OAAO,CAAoB,iBAAA,EAAA,WAAA,CAAA,IAAA,EACzB,OAAO,WAAA,KAAgB,WAAW,EAAK,GAAA,IAAA,CAAA,EAAA,CAAA;AAAA,KAAA,GAG3C,KACD,UAAW,CAAA,KAAA,CAAA;AAAA,GAGf,CAAA,EAAA,KAAA,CAAM,KAAK,KAAM,CAAA,UAAA,CAAA,CAAY,IAAI,CAAC,IAAA,yCAChC,cAAD,EAAA;AAAA,IACE,WAAA;AAAA,IACA,KAAK,IAAK,CAAA,GAAA;AAAA,IACV,IAAA;AAAA,IACA,KAAA;AAAA,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA,CAAA,CAAA;AAUL,MAAM,YAAY,UAAW,CAAA,UAAA;;;;"}
+{"version":3,"file":"Accordion.js","sources":["../../../../src/Accordion/src/Accordion.tsx"],"sourcesContent":["import React, { ForwardedRef, Ref, forwardRef } from 'react';\nimport clsx from 'clsx';\nimport { useAccordion } from '@react-aria/accordion';\nimport { filterDOMProps, mergeProps, useObjectRef } from '@react-aria/utils';\nimport { CollectionBase, DOMProps, Expandable } from '@react-types/shared';\nimport styles from '@danske/sapphire-css/components/accordion/accordion.module.css';\nimport {\n  SapphireStyleProps,\n  TypographyHeadingProps,\n  useSapphireStyleProps,\n  useThemeCheck,\n  withTruthyZero as hasAllowedCustomSidePadding,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\n\nimport { _AccordionItem } from './AccordionItem';\nimport { AccordionContext } from './AccordionContext';\nimport { TreeExpansionMode, useTreeState } from './useTreeState';\n\nexport interface AccordionProps<T>\n  extends GlobalDomAttributes,\n    SapphireStyleProps,\n    CollectionBase<T>,\n    DOMProps,\n    Expandable {\n  /** Allow one or many expanded items\n   * @default 'multiple'\n   */\n  expansionMode?: TreeExpansionMode;\n  /** Set aria-level attribute for item's header. Accessibility requirement.\n   * Defines the hierarchical level of an element within a page structure.\n   * @default 5\n   */\n  headerLevel?: TypographyHeadingProps['level'];\n  /**\n   * Removes the divider after the last accordion item.\n   * Useful when rendered in a container which already has borders.\n   */\n  hideLastDivider?: boolean;\n  /**\n   * Counter acts the side padding, so that accordion is shifted to the left with same amount\n   * and having side padding * 2 added to width – resulting in full width accordion.\n   * Useful in scenarions where accordion is inside a padded container and desired layout has accordion going from edge to edge horizontally.\n   * @example\n   * ```tsx\n   * <Accordion hasNegativeSideMargin>...</Accordion>\n   * ```\n   */\n  hasNegativeSideMargin?: boolean;\n  /**\n   * Add custom sized padding to the sides of the accordion items.\n   * @example\n   * ```tsx\n   * <Accordion sidePadding={tokens.size.spacingContainerHorizontalM.value} hasNegativeSideMargin>...</Accordion>\n   * ```\n   */\n  sidePadding?: number | string;\n}\n\nconst _Accordion = <T extends object>(\n  {\n    expansionMode = 'multiple',\n    headerLevel = 5,\n    hideLastDivider = false,\n    hasNegativeSideMargin = false,\n    sidePadding,\n    ...props\n  }: AccordionProps<T>,\n  ref: ForwardedRef<HTMLDivElement>\n) => {\n  useThemeCheck();\n  const { styleProps } = useSapphireStyleProps(props);\n  const state = useTreeState<T>({ ...props, expansionMode });\n  const forwardedRef = useObjectRef<HTMLDivElement>(ref);\n\n  const { accordionProps } = useAccordion(props, state, forwardedRef);\n\n  return (\n    <AccordionContext.Provider value={{ sidePadding }}>\n      <div\n        {...mergeProps(\n          accordionProps,\n          filterDOMProps(props, { global: true, labelable: true })\n        )}\n        ref={forwardedRef}\n        className={clsx(\n          styles['sapphire-accordion'],\n          {\n            [styles['sapphire-accordion--without-last-divider']]:\n              hideLastDivider,\n            [styles['sapphire-accordion--negative-margin-self']]:\n              !hasAllowedCustomSidePadding(sidePadding) &&\n              hasNegativeSideMargin,\n          },\n          styleProps.className\n        )}\n        style={{\n          ...(hasAllowedCustomSidePadding(sidePadding) && hasNegativeSideMargin\n            ? {\n                marginLeft:\n                  typeof sidePadding === 'string'\n                    ? `calc(${sidePadding} * -1)`\n                    : `-${sidePadding}px`,\n                width: `calc(100% + calc(${sidePadding} * 2${\n                  typeof sidePadding === 'string' ? '' : 'px'\n                }))`,\n              }\n            : {}),\n          ...styleProps.style,\n        }}\n      >\n        {Array.from(state.collection).map((item) => (\n          <_AccordionItem<T>\n            headerLevel={headerLevel}\n            key={item.key}\n            item={item}\n            state={state}\n          />\n        ))}\n      </div>\n    </AccordionContext.Provider>\n  );\n};\n\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore Expression produces a union type that is too complex to represent.\nexport const Accordion = forwardRef(_Accordion) as <T extends object>(\n  props: AccordionProps<T> & { ref?: Ref<HTMLDivElement> }\n) => React.ReactElement;\n"],"names":["hasAllowedCustomSidePadding"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2DA,MAAM,UAAA,GAAa,CACjB,EAAA,EAQA,GACG,KAAA;AATH,EACE,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAgB,aAAA,GAAA,UAAA;AAAA,IAChB,WAAc,GAAA,CAAA;AAAA,IACd,eAAkB,GAAA,KAAA;AAAA,IAClB,qBAAwB,GAAA,KAAA;AAAA,IACxB,WAAA;AAAA,GALF,GAAA,EAAA,EAMK,kBANL,EAMK,EAAA;AAAA,IALH,eAAA;AAAA,IACA,aAAA;AAAA,IACA,iBAAA;AAAA,IACA,uBAAA;AAAA,IACA,aAAA;AAAA,GAAA,CAAA,CAAA;AAKF,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAC7C,EAAA,MAAM,KAAQ,GAAA,YAAA,CAAgB,aAAK,CAAA,cAAA,CAAA,EAAA,EAAA,KAAA,CAAA,EAAL,EAAY,aAAA,EAAA,CAAA,CAAA,CAAA;AAC1C,EAAA,MAAM,eAAe,YAA6B,CAAA,GAAA,CAAA,CAAA;AAElD,EAAA,MAAM,EAAE,cAAA,EAAA,GAAmB,YAAa,CAAA,KAAA,EAAO,KAAO,EAAA,YAAA,CAAA,CAAA;AAEtD,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,iBAAiB,QAAlB,EAAA;AAAA,IAA2B,OAAO,EAAE,WAAA,EAAA;AAAA,GAClC,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EACM,UACF,CAAA,cAAA,EACA,cAAe,CAAA,KAAA,EAAO,EAAE,MAAA,EAAQ,IAAM,EAAA,SAAA,EAAW,IAHrD,EAAA,CAAA,CAAA,CAAA,EAAA;AAAA,IAKE,GAAK,EAAA,YAAA;AAAA,IACL,SAAA,EAAW,IACT,CAAA,MAAA,CAAO,oBACP,CAAA,EAAA;AAAA,MAAA,CACG,OAAO,0CACN,CAAA,GAAA,eAAA;AAAA,MAAA,CACD,MAAO,CAAA,0CAAA,CAAA,GACN,CAACA,cAAA,CAA4B,WAC7B,CAAA,IAAA,qBAAA;AAAA,KAAA,EAEJ,UAAW,CAAA,SAAA,CAAA;AAAA,IAEb,KAAO,EAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EACDA,cAA4B,CAAA,WAAA,CAAA,IAAgB,qBAC5C,GAAA;AAAA,MACE,YACE,OAAO,WAAA,KAAgB,QACnB,GAAA,CAAA,KAAA,EAAQ,sBACR,CAAI,CAAA,EAAA,WAAA,CAAA,EAAA,CAAA;AAAA,MACV,OAAO,CAAoB,iBAAA,EAAA,WAAA,CAAA,IAAA,EACzB,OAAO,WAAA,KAAgB,WAAW,EAAK,GAAA,IAAA,CAAA,EAAA,CAAA;AAAA,KAAA,GAG3C,KACD,UAAW,CAAA,KAAA,CAAA;AAAA,GAGf,CAAA,EAAA,KAAA,CAAM,KAAK,KAAM,CAAA,UAAA,CAAA,CAAY,IAAI,CAAC,IAAA,yCAChC,cAAD,EAAA;AAAA,IACE,WAAA;AAAA,IACA,KAAK,IAAK,CAAA,GAAA;AAAA,IACV,IAAA;AAAA,IACA,KAAA;AAAA,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA,CAAA,CAAA;AAUL,MAAM,YAAY,UAAW,CAAA,UAAA;;;;"}

package/build/esm/Accordion/src/AccordionHeading.js

@@ -40,7 +40,7 @@ const AccordionHeading = (_a) => {
   } = _b, props = __objRest(_b, [
     "children"
   ]);
-  return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, filterDOMProps(props)), {
+  return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, filterDOMProps(props, { global: true })), {
     className: clsx(styles["sapphire-accordion__item-heading"])
   }), children);
 };

package/build/esm/Accordion/src/AccordionHeading.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionHeading.js","sources":["../../../../src/Accordion/src/AccordionHeading.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport clsx from 'clsx';\nimport { filterDOMProps } from '@react-aria/utils';\nimport { DOMProps } from '@react-types/shared';\nimport styles from '@danske/sapphire-css/components/accordion/accordion.module.css';\n\nexport interface AccordionHeadingProps extends DOMProps {\n  children?: ReactNode;\n}\n\nexport const AccordionHeading = ({\n  children,\n  ...props\n}: AccordionHeadingProps): React.JSX.Element => {\n  return (\n    <div\n      {...filterDOMProps(props)}\n      className={clsx(styles['sapphire-accordion__item-heading'])}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUa,MAAA,gBAAA,GAAmB,CAAC,EAGe,KAAA;AAHf,EAC/B,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAA,QAAA;AAAA,GAD+B,GAAA,EAAA,EAE5B,kBAF4B,EAE5B,EAAA;AAAA,IADH,UAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAD,aACM,CAAA,cAAA,CAAA,EAAA,EAAA,cAAA,CAAe,KADrB,CAAA,CAAA,EAAA;AAAA,IAEE,SAAA,EAAW,KAAK,MAAO,CAAA,kCAAA,CAAA,CAAA;AAAA,GAEtB,CAAA,EAAA,QAAA,CAAA,CAAA;AAAA;;;;"}
+{"version":3,"file":"AccordionHeading.js","sources":["../../../../src/Accordion/src/AccordionHeading.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport clsx from 'clsx';\nimport { filterDOMProps } from '@react-aria/utils';\nimport { DOMProps } from '@react-types/shared';\nimport styles from '@danske/sapphire-css/components/accordion/accordion.module.css';\n\nexport interface AccordionHeadingProps extends DOMProps {\n  children?: ReactNode;\n}\n\nexport const AccordionHeading = ({\n  children,\n  ...props\n}: AccordionHeadingProps): React.JSX.Element => {\n  return (\n    <div\n      {...filterDOMProps(props, { global: true })}\n      className={clsx(styles['sapphire-accordion__item-heading'])}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUa,MAAA,gBAAA,GAAmB,CAAC,EAGe,KAAA;AAHf,EAC/B,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAA,QAAA;AAAA,GAD+B,GAAA,EAAA,EAE5B,kBAF4B,EAE5B,EAAA;AAAA,IADH,UAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,2CACG,KAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EACM,eAAe,KAAO,EAAA,EAAE,QAAQ,IADtC,EAAA,CAAA,CAAA,EAAA;AAAA,IAEE,SAAA,EAAW,KAAK,MAAO,CAAA,kCAAA,CAAA,CAAA;AAAA,GAEtB,CAAA,EAAA,QAAA,CAAA,CAAA;AAAA;;;;"}

package/build/esm/Alert/src/Alert.js

@@ -3,10 +3,27 @@ import { useThemeCheck, useSapphireStyleProps, Icon, Typography } from '@danske/
 import { Information, Error, CheckmarkOutline, Warning } from '@danske/sapphire-icons/react';
 import alertStyles from '@danske/sapphire-css/components/alert/alert.module.css';
 import { clsx } from 'clsx';
+import { filterDOMProps } from '@react-aria/utils';
 
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -45,7 +62,7 @@ function Alert(_a) {
         return /* @__PURE__ */ React.createElement(Information, null);
     }
   };
-  return /* @__PURE__ */ React.createElement("div", {
+  return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, filterDOMProps(props, { global: true })), {
     className: clsx(alertStyles["sapphire-alert"], {
       [alertStyles["sapphire-alert--positive"]]: variant === "positive",
       [alertStyles["sapphire-alert--negative"]]: variant === "negative",
@@ -53,7 +70,7 @@ function Alert(_a) {
     }, className),
     style,
     role: "alert"
-  }, /* @__PURE__ */ React.createElement("span", {
+  }), /* @__PURE__ */ React.createElement("span", {
     className: alertStyles["sapphire-alert__icon"]
   }, /* @__PURE__ */ React.createElement(Icon, {
     size: "sm"

package/build/esm/Alert/src/Alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","sources":["../../../../src/Alert/src/Alert.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport {\n  SapphireStyleProps,\n  useThemeCheck,\n  useSapphireStyleProps,\n  Typography,\n  Icon,\n} from '@danske/sapphire-react';\nimport {\n  CheckmarkOutline,\n  Information,\n  Warning,\n  Error,\n} from '@danske/sapphire-icons/react';\nimport alertStyles from '@danske/sapphire-css/components/alert/alert.module.css';\nimport { clsx } from 'clsx';\n\nexport interface SapphireAlertProps extends SapphireStyleProps {\n  /**\n   * The content of the alert.\n   */\n  children?: ReactNode;\n\n  /**\n   * The title of the alert.\n   */\n  title?: ReactNode;\n\n  /**\n   * @default 'info'\n   */\n  variant?: 'info' | 'positive' | 'negative' | 'warning';\n}\n\nexport function Alert({\n  children,\n  title,\n  variant = 'info',\n  ...props\n}: SapphireAlertProps): React.JSX.Element {\n  useThemeCheck();\n  const {\n    styleProps: { style, className },\n  } = useSapphireStyleProps(props);\n\n  const getIcon = (variant: string) => {\n    switch (variant) {\n      case 'warning':\n        return <Warning />;\n      case 'positive':\n        return <CheckmarkOutline />;\n      case 'negative':\n        return <Error />;\n      default:\n        return <Information />;\n    }\n  };\n\n  return (\n    <div\n      className={clsx(\n        alertStyles['sapphire-alert'],\n        {\n          [alertStyles['sapphire-alert--positive']]: variant === 'positive',\n          [alertStyles['sapphire-alert--negative']]: variant === 'negative',\n          [alertStyles['sapphire-alert--warning']]: variant === 'warning',\n        },\n        className\n      )}\n      style={style}\n      role=\"alert\"\n    >\n      <span className={alertStyles['sapphire-alert__icon']}>\n        <Icon size=\"sm\">{getIcon(variant)}</Icon>\n      </span>\n      <div className={alertStyles['sapphire-alert__title']}>\n        <Typography.Body size=\"sm\" isSemibold>\n          {title}\n        </Typography.Body>\n      </div>\n      <div className={alertStyles['sapphire-alert__content']}>\n        <Typography.Body elementType=\"section\" size=\"md\">\n          {children}\n        </Typography.Body>\n      </div>\n    </div>\n  );\n}\n"],"names":["Error2"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAkCO,SAAA,KAAA,CAAe,EAKoB,EAAA;AALpB,EACpB,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAU,GAAA,MAAA;AAAA,GAHU,GAAA,EAAA,EAIjB,kBAJiB,EAIjB,EAAA;AAAA,IAHH,UAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA;AAAA,IACJ,UAAA,EAAY,EAAE,KAAO,EAAA,SAAA,EAAA;AAAA,GAAA,GACnB,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAE1B,EAAM,MAAA,OAAA,GAAU,CAAC,QAAoB,KAAA;AACnC,IAAQ,QAAA,QAAA;AAAA,MACD,KAAA,SAAA;AACH,QAAA,2CAAQ,OAAD,EAAA,IAAA,CAAA,CAAA;AAAA,MACJ,KAAA,UAAA;AACH,QAAA,2CAAQ,gBAAD,EAAA,IAAA,CAAA,CAAA;AAAA,MACJ,KAAA,UAAA;AACH,QAAA,2CAAQA,KAAD,EAAA,IAAA,CAAA,CAAA;AAAA,MAAA;AAEP,QAAA,2CAAQ,WAAD,EAAA,IAAA,CAAA,CAAA;AAAA,KAAA;AAAA,GAAA,CAAA;AAIb,EAAA,2CACG,KAAD,EAAA;AAAA,IACE,SAAA,EAAW,IACT,CAAA,WAAA,CAAY,gBACZ,CAAA,EAAA;AAAA,MACG,CAAA,WAAA,CAAY,8BAA8B,OAAY,KAAA,UAAA;AAAA,MACtD,CAAA,WAAA,CAAY,8BAA8B,OAAY,KAAA,UAAA;AAAA,MACtD,CAAA,WAAA,CAAY,6BAA6B,OAAY,KAAA,SAAA;AAAA,KAExD,EAAA,SAAA,CAAA;AAAA,IAEF,KAAA;AAAA,IACA,IAAK,EAAA,OAAA;AAAA,GAAA,sCAEJ,MAAD,EAAA;AAAA,IAAM,WAAW,WAAY,CAAA,sBAAA,CAAA;AAAA,GAAA,sCAC1B,IAAD,EAAA;AAAA,IAAM,IAAK,EAAA,IAAA;AAAA,GAAM,EAAA,OAAA,CAAQ,OAE3B,CAAA,CAAA,CAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAD,EAAA;AAAA,IAAK,WAAW,WAAY,CAAA,uBAAA,CAAA;AAAA,GAC1B,kBAAA,KAAA,CAAA,aAAA,CAAC,WAAW,IAAZ,EAAA;AAAA,IAAiB,IAAK,EAAA,IAAA;AAAA,IAAK,UAAU,EAAA,IAAA;AAAA,GAClC,EAAA,KAAA,CAAA,CAAA,sCAGJ,KAAD,EAAA;AAAA,IAAK,WAAW,WAAY,CAAA,yBAAA,CAAA;AAAA,GAC1B,kBAAA,KAAA,CAAA,aAAA,CAAC,WAAW,IAAZ,EAAA;AAAA,IAAiB,WAAY,EAAA,SAAA;AAAA,IAAU,IAAK,EAAA,IAAA;AAAA,GACzC,EAAA,QAAA,CAAA,CAAA,CAAA,CAAA;AAAA;;;;"}
+{"version":3,"file":"Alert.js","sources":["../../../../src/Alert/src/Alert.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport {\n  SapphireStyleProps,\n  useThemeCheck,\n  useSapphireStyleProps,\n  Typography,\n  Icon,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport {\n  CheckmarkOutline,\n  Information,\n  Warning,\n  Error,\n} from '@danske/sapphire-icons/react';\nimport alertStyles from '@danske/sapphire-css/components/alert/alert.module.css';\nimport { clsx } from 'clsx';\nimport { filterDOMProps } from '@react-aria/utils';\n\nexport interface SapphireAlertProps\n  extends GlobalDomAttributes,\n    SapphireStyleProps {\n  /**\n   * The content of the alert.\n   */\n  children?: ReactNode;\n\n  /**\n   * The title of the alert.\n   */\n  title?: ReactNode;\n\n  /**\n   * @default 'info'\n   */\n  variant?: 'info' | 'positive' | 'negative' | 'warning';\n}\n\nexport function Alert({\n  children,\n  title,\n  variant = 'info',\n  ...props\n}: SapphireAlertProps): React.JSX.Element {\n  useThemeCheck();\n  const {\n    styleProps: { style, className },\n  } = useSapphireStyleProps(props);\n\n  const getIcon = (variant: string) => {\n    switch (variant) {\n      case 'warning':\n        return <Warning />;\n      case 'positive':\n        return <CheckmarkOutline />;\n      case 'negative':\n        return <Error />;\n      default:\n        return <Information />;\n    }\n  };\n\n  return (\n    <div\n      {...filterDOMProps(props, { global: true })}\n      className={clsx(\n        alertStyles['sapphire-alert'],\n        {\n          [alertStyles['sapphire-alert--positive']]: variant === 'positive',\n          [alertStyles['sapphire-alert--negative']]: variant === 'negative',\n          [alertStyles['sapphire-alert--warning']]: variant === 'warning',\n        },\n        className\n      )}\n      style={style}\n      role=\"alert\"\n    >\n      <span className={alertStyles['sapphire-alert__icon']}>\n        <Icon size=\"sm\">{getIcon(variant)}</Icon>\n      </span>\n      <div className={alertStyles['sapphire-alert__title']}>\n        <Typography.Body size=\"sm\" isSemibold>\n          {title}\n        </Typography.Body>\n      </div>\n      <div className={alertStyles['sapphire-alert__content']}>\n        <Typography.Body elementType=\"section\" size=\"md\">\n          {children}\n        </Typography.Body>\n      </div>\n    </div>\n  );\n}\n"],"names":["Error2"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCO,SAAA,KAAA,CAAe,EAKoB,EAAA;AALpB,EACpB,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAU,GAAA,MAAA;AAAA,GAHU,GAAA,EAAA,EAIjB,kBAJiB,EAIjB,EAAA;AAAA,IAHH,UAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA;AAAA,IACJ,UAAA,EAAY,EAAE,KAAO,EAAA,SAAA,EAAA;AAAA,GAAA,GACnB,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAE1B,EAAM,MAAA,OAAA,GAAU,CAAC,QAAoB,KAAA;AACnC,IAAQ,QAAA,QAAA;AAAA,MACD,KAAA,SAAA;AACH,QAAA,2CAAQ,OAAD,EAAA,IAAA,CAAA,CAAA;AAAA,MACJ,KAAA,UAAA;AACH,QAAA,2CAAQ,gBAAD,EAAA,IAAA,CAAA,CAAA;AAAA,MACJ,KAAA,UAAA;AACH,QAAA,2CAAQA,KAAD,EAAA,IAAA,CAAA,CAAA;AAAA,MAAA;AAEP,QAAA,2CAAQ,WAAD,EAAA,IAAA,CAAA,CAAA;AAAA,KAAA;AAAA,GAAA,CAAA;AAIb,EAAA,2CACG,KAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EACM,eAAe,KAAO,EAAA,EAAE,QAAQ,IADtC,EAAA,CAAA,CAAA,EAAA;AAAA,IAEE,SAAA,EAAW,IACT,CAAA,WAAA,CAAY,gBACZ,CAAA,EAAA;AAAA,MACG,CAAA,WAAA,CAAY,8BAA8B,OAAY,KAAA,UAAA;AAAA,MACtD,CAAA,WAAA,CAAY,8BAA8B,OAAY,KAAA,UAAA;AAAA,MACtD,CAAA,WAAA,CAAY,6BAA6B,OAAY,KAAA,SAAA;AAAA,KAExD,EAAA,SAAA,CAAA;AAAA,IAEF,KAAA;AAAA,IACA,IAAK,EAAA,OAAA;AAAA,GAAA,CAAA,sCAEJ,MAAD,EAAA;AAAA,IAAM,WAAW,WAAY,CAAA,sBAAA,CAAA;AAAA,GAAA,sCAC1B,IAAD,EAAA;AAAA,IAAM,IAAK,EAAA,IAAA;AAAA,GAAM,EAAA,OAAA,CAAQ,OAE3B,CAAA,CAAA,CAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAD,EAAA;AAAA,IAAK,WAAW,WAAY,CAAA,uBAAA,CAAA;AAAA,GAC1B,kBAAA,KAAA,CAAA,aAAA,CAAC,WAAW,IAAZ,EAAA;AAAA,IAAiB,IAAK,EAAA,IAAA;AAAA,IAAK,UAAU,EAAA,IAAA;AAAA,GAClC,EAAA,KAAA,CAAA,CAAA,sCAGJ,KAAD,EAAA;AAAA,IAAK,WAAW,WAAY,CAAA,yBAAA,CAAA;AAAA,GAC1B,kBAAA,KAAA,CAAA,aAAA,CAAC,WAAW,IAAZ,EAAA;AAAA,IAAiB,WAAY,EAAA,SAAA;AAAA,IAAU,IAAK,EAAA,IAAA;AAAA,GACzC,EAAA,QAAA,CAAA,CAAA,CAAA,CAAA;AAAA;;;;"}

package/build/esm/Autocomplete/src/Autocomplete.js

@@ -4,6 +4,7 @@ import { useComboBox } from '@react-aria/combobox';
 import { useMessageFormatter } from '@react-aria/i18n';
 import intlMessages from '../i18n/index.js';
 import { useFocusableRef } from '@react-spectrum/utils';
+import { filterDOMProps } from '@react-aria/utils';
 
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
@@ -24,17 +25,35 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 function Autocomplete(props) {
-  var _a;
+  var _b;
   useThemeCheck();
   const formatMessage = useMessageFormatter(intlMessages);
-  const {
+  const _a = props, {
     inputValue,
     renderInput,
     loadingState,
     loadingSkeletonRowsCount,
     listboxAriaLabel
-  } = props;
+  } = _a, otherProps = __objRest(_a, [
+    "inputValue",
+    "renderInput",
+    "loadingState",
+    "loadingSkeletonRowsCount",
+    "listboxAriaLabel"
+  ]);
   const {
     styleProps: { style, className }
   } = useSapphireStyleProps(props);
@@ -67,11 +86,12 @@ function Autocomplete(props) {
       });
     }
   }));
-  return /* @__PURE__ */ React.createElement("div", {
-    ref: triggerRef,
+  return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({
+    ref: triggerRef
+  }, filterDOMProps(otherProps, { global: true })), {
     style: __spreadValues({ display: "inline-flex" }, style),
     className
-  }, inputElement, state.isOpen && /* @__PURE__ */ React.createElement(ListBoxPopover, {
+  }), inputElement, state.isOpen && /* @__PURE__ */ React.createElement(ListBoxPopover, {
     state,
     triggerRef,
     popoverRef,
@@ -79,7 +99,7 @@ function Autocomplete(props) {
     listBoxProps,
     loadingState,
     loadingSkeletonRowsCount,
-    selectWidth: (_a = triggerRef.current) == null ? void 0 : _a.offsetWidth,
+    selectWidth: (_b = triggerRef.current) == null ? void 0 : _b.offsetWidth,
     disableSelectedStyles: true,
     isNonModal: true
   }, props.children || []));

package/build/esm/Autocomplete/src/Autocomplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"Autocomplete.js","sources":["../../../../src/Autocomplete/src/Autocomplete.tsx"],"sourcesContent":["import React, { ReactElement, useRef } from 'react';\nimport {\n  ListBoxProps,\n  useThemeCheck,\n  useSapphireStyleProps,\n  SapphireStyleProps,\n  ListBoxPopover,\n  useComboBoxState,\n} from '@danske/sapphire-react';\nimport { useComboBox } from '@react-aria/combobox';\nimport { useMessageFormatter } from '@react-aria/i18n';\nimport intlMessages from '../i18n';\nimport { useFocusableRef } from '@react-spectrum/utils';\nimport type { ComboBoxProps } from '@react-types/combobox';\n\nexport type AutocompleteProps<T extends object> = SapphireStyleProps &\n  Pick<\n    ComboBoxProps<T>,\n    | 'items'\n    | 'children'\n    | 'inputValue'\n    | 'defaultInputValue'\n    | 'onInputChange'\n    | 'onSelectionChange'\n    | 'isDisabled'\n  > &\n  Pick<ListBoxProps<T>, 'loadingState' | 'loadingSkeletonRowsCount'> & {\n    /**\n     * Render function for the input element.\n     * Receives props that should be spread onto the input component.\n     */\n    renderInput: (inputProps: any) => ReactElement;\n\n    /**\n     * Accessible label for the suggestions listbox.\n     */\n    listboxAriaLabel?: string;\n\n    /**\n     * Controlled selected value.\n     */\n    value?: React.Key | null;\n\n    /**\n     * Decide what items to display in the dropdown menu.\n     * @default 'String.includes'\n     */\n    defaultFilter?: (textValue: string, inputValue: string) => boolean;\n  };\n\nexport function Autocomplete<T extends object>(\n  props: AutocompleteProps<T>\n): ReactElement {\n  useThemeCheck();\n  const formatMessage = useMessageFormatter(intlMessages);\n\n  const {\n    inputValue,\n    renderInput,\n    loadingState,\n    loadingSkeletonRowsCount,\n    listboxAriaLabel,\n  } = props;\n\n  const {\n    styleProps: { style, className },\n  } = useSapphireStyleProps(props);\n\n  const inputRef = useRef<HTMLInputElement>(null);\n  const listBoxRef = useFocusableRef<HTMLUListElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useFocusableRef<HTMLDivElement>(null);\n\n  const state = useComboBoxState({\n    ...props,\n    inputValue,\n    allowsEmptyCollection: loadingState === 'loading',\n    allowsCustomValue: true,\n    shouldCloseOnBlur: true,\n  });\n\n  const { inputProps, listBoxProps } = useComboBox(\n    {\n      ...props,\n      'aria-label': listboxAriaLabel || formatMessage('listbox-suggestions'),\n      inputRef,\n      listBoxRef,\n      popoverRef,\n    },\n    state\n  );\n\n  const inputElement = renderInput({\n    ...inputProps,\n    isDisabled: props.isDisabled,\n    inputRef,\n    'aria-haspopup': 'listbox',\n    'aria-expanded': state.isOpen,\n    onChange: (value: string) => {\n      inputProps.onChange?.({\n        target: { value },\n        currentTarget: { value },\n      } as React.ChangeEvent<HTMLInputElement>);\n    },\n  });\n\n  return (\n    <div\n      ref={triggerRef}\n      style={{ display: 'inline-flex', ...style }}\n      className={className}\n    >\n      {inputElement}\n      {state.isOpen && (\n        <ListBoxPopover<T>\n          state={state}\n          triggerRef={triggerRef}\n          popoverRef={popoverRef}\n          listBoxRef={listBoxRef}\n          listBoxProps={listBoxProps}\n          loadingState={loadingState}\n          loadingSkeletonRowsCount={loadingSkeletonRowsCount}\n          selectWidth={triggerRef.current?.offsetWidth}\n          disableSelectedStyles\n          isNonModal\n        >\n          {props.children || []}\n        </ListBoxPopover>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAkDO,SAAA,YAAA,CACL,KACc,EAAA;AApDhB,EAAA,IAAA,EAAA,CAAA;AAqDE,EAAA,aAAA,EAAA,CAAA;AACA,EAAA,MAAM,gBAAgB,mBAAoB,CAAA,YAAA,CAAA,CAAA;AAE1C,EAAM,MAAA;AAAA,IACJ,UAAA;AAAA,IACA,WAAA;AAAA,IACA,YAAA;AAAA,IACA,wBAAA;AAAA,IACA,gBAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EAAM,MAAA;AAAA,IACJ,UAAA,EAAY,EAAE,KAAO,EAAA,SAAA,EAAA;AAAA,GAAA,GACnB,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAE1B,EAAA,MAAM,WAAW,MAAyB,CAAA,IAAA,CAAA,CAAA;AAC1C,EAAA,MAAM,aAAa,eAAkC,CAAA,IAAA,CAAA,CAAA;AACrD,EAAA,MAAM,aAAa,MAAuB,CAAA,IAAA,CAAA,CAAA;AAC1C,EAAA,MAAM,aAAa,eAAgC,CAAA,IAAA,CAAA,CAAA;AAEnD,EAAM,MAAA,KAAA,GAAQ,gBAAiB,CAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EAC1B,KAD0B,CAAA,EAAA;AAAA,IAE7B,UAAA;AAAA,IACA,uBAAuB,YAAiB,KAAA,SAAA;AAAA,IACxC,iBAAmB,EAAA,IAAA;AAAA,IACnB,iBAAmB,EAAA,IAAA;AAAA,GAAA,CAAA,CAAA,CAAA;AAGrB,EAAA,MAAM,EAAE,UAAA,EAAY,YAAiB,EAAA,GAAA,WAAA,CACnC,iCACK,KADL,CAAA,EAAA;AAAA,IAEE,YAAA,EAAc,oBAAoB,aAAc,CAAA,qBAAA,CAAA;AAAA,IAChD,QAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,GAEF,CAAA,EAAA,KAAA,CAAA,CAAA;AAGF,EAAM,MAAA,YAAA,GAAe,WAAY,CAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EAC5B,UAD4B,CAAA,EAAA;AAAA,IAE/B,YAAY,KAAM,CAAA,UAAA;AAAA,IAClB,QAAA;AAAA,IACA,eAAiB,EAAA,SAAA;AAAA,IACjB,iBAAiB,KAAM,CAAA,MAAA;AAAA,IACvB,QAAA,EAAU,CAAC,KAAkB,KAAA;AAlGjC,MAAA,IAAA,GAAA,CAAA;AAmGM,MAAA,CAAA,GAAA,GAAA,UAAA,CAAW,aAAX,IAAsB,GAAA,KAAA,CAAA,GAAA,GAAA,CAAA,IAAA,CAAA,UAAA,EAAA;AAAA,QACpB,QAAQ,EAAE,KAAA,EAAA;AAAA,QACV,eAAe,EAAE,KAAA,EAAA;AAAA,OAAA,CAAA,CAAA;AAAA,KAAA;AAAA,GAAA,CAAA,CAAA,CAAA;AAKvB,EAAA,2CACG,KAAD,EAAA;AAAA,IACE,GAAK,EAAA,UAAA;AAAA,IACL,KAAA,EAAO,cAAE,CAAA,EAAA,OAAA,EAAS,aAAkB,EAAA,EAAA,KAAA,CAAA;AAAA,IACpC,SAAA;AAAA,GAAA,EAEC,YACA,EAAA,KAAA,CAAM,MACL,oBAAA,KAAA,CAAA,aAAA,CAAC,cAAD,EAAA;AAAA,IACE,KAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,IACA,YAAA;AAAA,IACA,wBAAA;AAAA,IACA,WAAA,EAAa,CAAW,EAAA,GAAA,UAAA,CAAA,OAAA,KAAX,IAAoB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,WAAA;AAAA,IACjC,qBAAqB,EAAA,IAAA;AAAA,IACrB,UAAU,EAAA,IAAA;AAAA,GAAA,EAET,MAAM,QAAY,IAAA,EAAA,CAAA,CAAA,CAAA;AAAA;;;;"}
+{"version":3,"file":"Autocomplete.js","sources":["../../../../src/Autocomplete/src/Autocomplete.tsx"],"sourcesContent":["import React, { ReactElement, useRef } from 'react';\nimport {\n  ListBoxProps,\n  useThemeCheck,\n  useSapphireStyleProps,\n  SapphireStyleProps,\n  ListBoxPopover,\n  useComboBoxState,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport { useComboBox } from '@react-aria/combobox';\nimport { useMessageFormatter } from '@react-aria/i18n';\nimport intlMessages from '../i18n';\nimport { useFocusableRef } from '@react-spectrum/utils';\nimport type { ComboBoxProps } from '@react-types/combobox';\nimport { filterDOMProps } from '@react-aria/utils';\n\nexport type AutocompleteProps<T extends object> = GlobalDomAttributes &\n  SapphireStyleProps &\n  Pick<\n    ComboBoxProps<T>,\n    | 'items'\n    | 'children'\n    | 'inputValue'\n    | 'defaultInputValue'\n    | 'onInputChange'\n    | 'onSelectionChange'\n    | 'isDisabled'\n  > &\n  Pick<ListBoxProps<T>, 'loadingState' | 'loadingSkeletonRowsCount'> & {\n    /**\n     * Render function for the input element.\n     * Receives props that should be spread onto the input component.\n     */\n    renderInput: (inputProps: any) => ReactElement;\n\n    /**\n     * Accessible label for the suggestions listbox.\n     */\n    listboxAriaLabel?: string;\n\n    /**\n     * Controlled selected value.\n     */\n    value?: React.Key | null;\n\n    /**\n     * Decide what items to display in the dropdown menu.\n     * @default 'String.includes'\n     */\n    defaultFilter?: (textValue: string, inputValue: string) => boolean;\n  };\n\nexport function Autocomplete<T extends object>(\n  props: AutocompleteProps<T>\n): ReactElement {\n  useThemeCheck();\n  const formatMessage = useMessageFormatter(intlMessages);\n\n  const {\n    inputValue,\n    renderInput,\n    loadingState,\n    loadingSkeletonRowsCount,\n    listboxAriaLabel,\n    ...otherProps\n  } = props;\n\n  const {\n    styleProps: { style, className },\n  } = useSapphireStyleProps(props);\n\n  const inputRef = useRef<HTMLInputElement>(null);\n  const listBoxRef = useFocusableRef<HTMLUListElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useFocusableRef<HTMLDivElement>(null);\n\n  const state = useComboBoxState({\n    ...props,\n    inputValue,\n    allowsEmptyCollection: loadingState === 'loading',\n    allowsCustomValue: true,\n    shouldCloseOnBlur: true,\n  });\n\n  const { inputProps, listBoxProps } = useComboBox(\n    {\n      ...props,\n      'aria-label': listboxAriaLabel || formatMessage('listbox-suggestions'),\n      inputRef,\n      listBoxRef,\n      popoverRef,\n    },\n    state\n  );\n\n  const inputElement = renderInput({\n    ...inputProps,\n    isDisabled: props.isDisabled,\n    inputRef,\n    'aria-haspopup': 'listbox',\n    'aria-expanded': state.isOpen,\n    onChange: (value: string) => {\n      inputProps.onChange?.({\n        target: { value },\n        currentTarget: { value },\n      } as React.ChangeEvent<HTMLInputElement>);\n    },\n  });\n\n  return (\n    <div\n      ref={triggerRef}\n      {...filterDOMProps(otherProps, { global: true })}\n      style={{ display: 'inline-flex', ...style }}\n      className={className}\n    >\n      {inputElement}\n      {state.isOpen && (\n        <ListBoxPopover<T>\n          state={state}\n          triggerRef={triggerRef}\n          popoverRef={popoverRef}\n          listBoxRef={listBoxRef}\n          listBoxProps={listBoxProps}\n          loadingState={loadingState}\n          loadingSkeletonRowsCount={loadingSkeletonRowsCount}\n          selectWidth={triggerRef.current?.offsetWidth}\n          disableSelectedStyles\n          isNonModal\n        >\n          {props.children || []}\n        </ListBoxPopover>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

package/build/esm/Breadcrumbs/src/BreadcrumbItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"BreadcrumbItem.js","sources":["../../../../src/Breadcrumbs/src/BreadcrumbItem.tsx"],"sourcesContent":["import React, { createContext, useContext } from 'react';\nimport {\n  Breadcrumb as RACBreadcrumb,\n  BreadcrumbProps as RACBreadcrumbProps,\n  BreadcrumbRenderProps as RACBreadcrumbRenderProps,\n} from 'react-aria-components';\nimport {\n  useSapphireStyleProps,\n  useThemeCheck,\n  SapphireStyleProps,\n  Typography,\n} from '@danske/sapphire-react';\nimport { BreadcrumbsSeparator } from './BreadcrumbsSeparator';\nimport clsx from 'clsx';\nimport styles from '@danske/sapphire-css/components/breadcrumbs/breadcrumbs.module.css';\nimport { BreadcrumbsContext } from './Breadcrumbs';\n\nexport const BreadcrumbItemContext = createContext<\n  Pick<RACBreadcrumbRenderProps, 'isDisabled'>\n>({\n  isDisabled: false,\n});\n\nexport type BreadcrumbItemProps = {\n  isDisabled?: boolean;\n} & SapphireStyleProps &\n  Pick<RACBreadcrumbProps, 'children'>;\n\nexport const BreadcrumbItem = ({\n  children,\n  isDisabled: individualDisabled = false,\n  ...props\n}: BreadcrumbItemProps): JSX.Element => {\n  useThemeCheck();\n  const { styleProps } = useSapphireStyleProps(props);\n  const { size } = useContext(BreadcrumbsContext);\n\n  return (\n    <RACBreadcrumb\n      className={clsx(styles['sapphire-breadcrumbs__item'])}\n      style={{ ...styleProps.style }}\n    >\n      {({ isCurrent, isDisabled }) => (\n        <BreadcrumbItemContext.Provider\n          value={{ isDisabled: isDisabled || individualDisabled }}\n        >\n          {isCurrent ? (\n            <Typography.Body\n              elementType=\"span\"\n              isSemibold\n              size={size === 'lg' ? 'md' : size === 'md' ? 'sm' : 'xs'}\n            >\n              {children}\n            </Typography.Body>\n          ) : (\n            children\n          )}\n          {!isCurrent && <BreadcrumbsSeparator />}\n        </BreadcrumbItemContext.Provider>\n      )}\n    </RACBreadcrumb>\n  );\n};\n"],"names":["RACBreadcrumb"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBO,MAAM,wBAAwB,aAEnC,CAAA;AAAA,EACA,UAAY,EAAA,KAAA;AAAA,CAAA,EAAA;AAQD,MAAA,cAAA,GAAiB,CAAC,EAIS,KAAA;AAJT,EAC7B,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,YAAY,kBAAqB,GAAA,KAAA;AAAA,GAFJ,GAAA,EAAA,EAG1B,kBAH0B,EAG1B,EAAA;AAAA,IAFH,UAAA;AAAA,IACA,YAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAC7C,EAAM,MAAA,EAAE,SAAS,UAAW,CAAA,kBAAA,CAAA,CAAA;AAE5B,EAAA,2CACGA,UAAD,EAAA;AAAA,IACE,SAAA,EAAW,KAAK,MAAO,CAAA,4BAAA,CAAA,CAAA;AAAA,IACvB,KAAA,EAAO,mBAAK,UAAW,CAAA,KAAA,CAAA;AAAA,GAAA,EAEtB,CAAC,EAAE,SAAA,EAAW,UACb,EAAA,qBAAA,KAAA,CAAA,aAAA,CAAC,sBAAsB,QAAvB,EAAA;AAAA,IACE,KAAA,EAAO,EAAE,UAAA,EAAY,UAAc,IAAA,kBAAA,EAAA;AAAA,GAElC,EAAA,SAAA,mBACE,KAAA,CAAA,aAAA,CAAA,UAAA,CAAW,IAAZ,EAAA;AAAA,IACE,WAAY,EAAA,MAAA;AAAA,IACZ,UAAU,EAAA,IAAA;AAAA,IACV,MAAM,IAAS,KAAA,IAAA,GAAO,IAAO,GAAA,IAAA,KAAS,OAAO,IAAO,GAAA,IAAA;AAAA,GAAA,EAEnD,QAGH,CAAA,GAAA,QAAA,EAED,CAAC,SAAA,wCAAc,oBAAD,EAAA,IAAA,CAAA,CAAA,CAAA,CAAA;AAAA;;;;"}
+{"version":3,"file":"BreadcrumbItem.js","sources":["../../../../src/Breadcrumbs/src/BreadcrumbItem.tsx"],"sourcesContent":["import React, { createContext, useContext } from 'react';\nimport {\n  Breadcrumb as RACBreadcrumb,\n  BreadcrumbProps as RACBreadcrumbProps,\n  BreadcrumbRenderProps as RACBreadcrumbRenderProps,\n} from 'react-aria-components';\nimport {\n  useSapphireStyleProps,\n  useThemeCheck,\n  SapphireStyleProps,\n  Typography,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport { BreadcrumbsSeparator } from './BreadcrumbsSeparator';\nimport clsx from 'clsx';\nimport styles from '@danske/sapphire-css/components/breadcrumbs/breadcrumbs.module.css';\nimport { BreadcrumbsContext } from './Breadcrumbs';\n\nexport const BreadcrumbItemContext = createContext<\n  Pick<RACBreadcrumbRenderProps, 'isDisabled'>\n>({\n  isDisabled: false,\n});\n\nexport type BreadcrumbItemProps = {\n  isDisabled?: boolean;\n} & SapphireStyleProps &\n  GlobalDomAttributes &\n  Pick<RACBreadcrumbProps, 'children'>;\n\nexport const BreadcrumbItem = ({\n  children,\n  isDisabled: individualDisabled = false,\n  ...props\n}: BreadcrumbItemProps): JSX.Element => {\n  useThemeCheck();\n  const { styleProps } = useSapphireStyleProps(props);\n  const { size } = useContext(BreadcrumbsContext);\n\n  return (\n    <RACBreadcrumb\n      className={clsx(styles['sapphire-breadcrumbs__item'])}\n      style={{ ...styleProps.style }}\n    >\n      {({ isCurrent, isDisabled }) => (\n        <BreadcrumbItemContext.Provider\n          value={{ isDisabled: isDisabled || individualDisabled }}\n        >\n          {isCurrent ? (\n            <Typography.Body\n              elementType=\"span\"\n              isSemibold\n              size={size === 'lg' ? 'md' : size === 'md' ? 'sm' : 'xs'}\n            >\n              {children}\n            </Typography.Body>\n          ) : (\n            children\n          )}\n          {!isCurrent && <BreadcrumbsSeparator />}\n        </BreadcrumbItemContext.Provider>\n      )}\n    </RACBreadcrumb>\n  );\n};\n"],"names":["RACBreadcrumb"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBO,MAAM,wBAAwB,aAEnC,CAAA;AAAA,EACA,UAAY,EAAA,KAAA;AAAA,CAAA,EAAA;AASD,MAAA,cAAA,GAAiB,CAAC,EAIS,KAAA;AAJT,EAC7B,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,YAAY,kBAAqB,GAAA,KAAA;AAAA,GAFJ,GAAA,EAAA,EAG1B,kBAH0B,EAG1B,EAAA;AAAA,IAFH,UAAA;AAAA,IACA,YAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAC7C,EAAM,MAAA,EAAE,SAAS,UAAW,CAAA,kBAAA,CAAA,CAAA;AAE5B,EAAA,2CACGA,UAAD,EAAA;AAAA,IACE,SAAA,EAAW,KAAK,MAAO,CAAA,4BAAA,CAAA,CAAA;AAAA,IACvB,KAAA,EAAO,mBAAK,UAAW,CAAA,KAAA,CAAA;AAAA,GAAA,EAEtB,CAAC,EAAE,SAAA,EAAW,UACb,EAAA,qBAAA,KAAA,CAAA,aAAA,CAAC,sBAAsB,QAAvB,EAAA;AAAA,IACE,KAAA,EAAO,EAAE,UAAA,EAAY,UAAc,IAAA,kBAAA,EAAA;AAAA,GAElC,EAAA,SAAA,mBACE,KAAA,CAAA,aAAA,CAAA,UAAA,CAAW,IAAZ,EAAA;AAAA,IACE,WAAY,EAAA,MAAA;AAAA,IACZ,UAAU,EAAA,IAAA;AAAA,IACV,MAAM,IAAS,KAAA,IAAA,GAAO,IAAO,GAAA,IAAA,KAAS,OAAO,IAAO,GAAA,IAAA;AAAA,GAAA,EAEnD,QAGH,CAAA,GAAA,QAAA,EAED,CAAC,SAAA,wCAAc,oBAAD,EAAA,IAAA,CAAA,CAAA,CAAA,CAAA;AAAA;;;;"}

package/build/esm/Breadcrumbs/src/BreadcrumbItemLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"BreadcrumbItemLink.js","sources":["../../../../src/Breadcrumbs/src/BreadcrumbItemLink.tsx"],"sourcesContent":["import React, { useContext, forwardRef } from 'react';\nimport {\n  Button,\n  ButtonProps,\n  SapphireStyleProps,\n  useSapphireStyleProps,\n  useThemeCheck,\n} from '@danske/sapphire-react';\nimport { FocusableRef } from '@react-types/shared';\nimport { BreadcrumbsContext } from './Breadcrumbs';\nimport { BreadcrumbItemContext } from './BreadcrumbItem';\nimport { BreadcrumbItemStatic } from './BreadcrumbItemStatic';\n\nexport type BreadcrumbItemLinkProps = Omit<\n  ButtonProps<'a'>,\n  'variant' | 'iconAlign'\n> &\n  SapphireStyleProps;\n\nexport const BreadcrumbItemLink = forwardRef(function BreadcrumbItemLink(\n  { children, ...props }: BreadcrumbItemLinkProps,\n  ref: FocusableRef<HTMLAnchorElement>\n): JSX.Element {\n  useThemeCheck();\n  const { styleProps } = useSapphireStyleProps(props);\n  const { size } = useContext(BreadcrumbsContext);\n  const { isDisabled } = useContext(BreadcrumbItemContext);\n\n  if (!props.href) {\n    return (\n      <BreadcrumbItemStatic {...props} size={size}>\n        {children}\n      </BreadcrumbItemStatic>\n    );\n  }\n\n  return (\n    <Button\n      {...props}\n      {...styleProps}\n      ref={ref}\n      size={size}\n      variant=\"tertiary\"\n      isDisabled={isDisabled}\n    >\n      {children}\n    </Button>\n  );\n});\n\nBreadcrumbItemLink.displayName = 'BreadcrumbItemLink';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAM,kBAAqB,GAAA,UAAA,CAAW,SAC3C,mBAAA,CAAA,EAAA,EACA,GACa,EAAA;AAFb,EAAA,IAAA,EAAA,GAAA,EAAA,EAAE,EAAF,QAAA,EAAA,GAAA,EAAA,EAAe,KAAf,GAAA,SAAA,CAAA,EAAA,EAAe,CAAb,UAAA,CAAA,CAAA,CAAA;AAGF,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAC7C,EAAM,MAAA,EAAE,SAAS,UAAW,CAAA,kBAAA,CAAA,CAAA;AAC5B,EAAM,MAAA,EAAE,eAAe,UAAW,CAAA,qBAAA,CAAA,CAAA;AAElC,EAAI,IAAA,CAAC,MAAM,IAAM,EAAA;AACf,IACE,uBAAA,KAAA,CAAA,aAAA,CAAC,oBAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EAA0B,KAA1B,CAAA,EAAA;AAAA,MAAiC,IAAA;AAAA,KAC9B,CAAA,EAAA,QAAA,CAAA,CAAA;AAAA,GAAA;AAKP,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,MAAA,EAAD,aACM,CAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EAAA,KAAA,CAAA,EACA,UAFN,CAAA,EAAA;AAAA,IAGE,GAAA;AAAA,IACA,IAAA;AAAA,IACA,OAAQ,EAAA,UAAA;AAAA,IACR,UAAA;AAAA,GAEC,CAAA,EAAA,QAAA,CAAA,CAAA;AAAA,CAAA,EAAA;AAKP,kBAAA,CAAmB,WAAc,GAAA,oBAAA;;;;"}
+{"version":3,"file":"BreadcrumbItemLink.js","sources":["../../../../src/Breadcrumbs/src/BreadcrumbItemLink.tsx"],"sourcesContent":["import React, { useContext, forwardRef } from 'react';\nimport {\n  Button,\n  ButtonProps,\n  SapphireStyleProps,\n  useSapphireStyleProps,\n  useThemeCheck,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport { FocusableRef } from '@react-types/shared';\nimport { BreadcrumbsContext } from './Breadcrumbs';\nimport { BreadcrumbItemContext } from './BreadcrumbItem';\nimport { BreadcrumbItemStatic } from './BreadcrumbItemStatic';\n\nexport type BreadcrumbItemLinkProps = Omit<\n  ButtonProps<'a'>,\n  'variant' | 'iconAlign'\n> &\n  SapphireStyleProps &\n  GlobalDomAttributes;\n\nexport const BreadcrumbItemLink = forwardRef(function BreadcrumbItemLink(\n  { children, ...props }: BreadcrumbItemLinkProps,\n  ref: FocusableRef<HTMLAnchorElement>\n): JSX.Element {\n  useThemeCheck();\n  const { styleProps } = useSapphireStyleProps(props);\n  const { size } = useContext(BreadcrumbsContext);\n  const { isDisabled } = useContext(BreadcrumbItemContext);\n\n  if (!props.href) {\n    return (\n      <BreadcrumbItemStatic {...props} size={size}>\n        {children}\n      </BreadcrumbItemStatic>\n    );\n  }\n\n  return (\n    <Button\n      {...props}\n      {...styleProps}\n      ref={ref}\n      size={size}\n      variant=\"tertiary\"\n      isDisabled={isDisabled}\n    >\n      {children}\n    </Button>\n  );\n});\n\nBreadcrumbItemLink.displayName = 'BreadcrumbItemLink';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBO,MAAM,kBAAqB,GAAA,UAAA,CAAW,SAC3C,mBAAA,CAAA,EAAA,EACA,GACa,EAAA;AAFb,EAAA,IAAA,EAAA,GAAA,EAAA,EAAE,EAAF,QAAA,EAAA,GAAA,EAAA,EAAe,KAAf,GAAA,SAAA,CAAA,EAAA,EAAe,CAAb,UAAA,CAAA,CAAA,CAAA;AAGF,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAC7C,EAAM,MAAA,EAAE,SAAS,UAAW,CAAA,kBAAA,CAAA,CAAA;AAC5B,EAAM,MAAA,EAAE,eAAe,UAAW,CAAA,qBAAA,CAAA,CAAA;AAElC,EAAI,IAAA,CAAC,MAAM,IAAM,EAAA;AACf,IACE,uBAAA,KAAA,CAAA,aAAA,CAAC,oBAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EAA0B,KAA1B,CAAA,EAAA;AAAA,MAAiC,IAAA;AAAA,KAC9B,CAAA,EAAA,QAAA,CAAA,CAAA;AAAA,GAAA;AAKP,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,MAAA,EAAD,aACM,CAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EAAA,KAAA,CAAA,EACA,UAFN,CAAA,EAAA;AAAA,IAGE,GAAA;AAAA,IACA,IAAA;AAAA,IACA,OAAQ,EAAA,UAAA;AAAA,IACR,UAAA;AAAA,GAEC,CAAA,EAAA,QAAA,CAAA,CAAA;AAAA,CAAA,EAAA;AAKP,kBAAA,CAAmB,WAAc,GAAA,oBAAA;;;;"}

package/build/esm/Breadcrumbs/src/BreadcrumbItemStatic.js.map

@@ -1 +1 @@
-{"version":3,"file":"BreadcrumbItemStatic.js","sources":["../../../../src/Breadcrumbs/src/BreadcrumbItemStatic.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n  SapphireStyleProps,\n  useSapphireStyleProps,\n  useThemeCheck,\n} from '@danske/sapphire-react';\nimport clsx from 'clsx';\nimport styles from '@danske/sapphire-css/components/breadcrumbs/breadcrumbs.module.css';\n\nexport type BreadcrumbItemStaticProps = Pick<\n  React.HTMLAttributes<HTMLSpanElement>,\n  'children'\n> &\n  SapphireStyleProps & { size: 'sm' | 'md' | 'lg' };\n\nexport const BreadcrumbItemStatic = forwardRef<\n  HTMLSpanElement,\n  BreadcrumbItemStaticProps\n>(function BreadcrumbItemStatic({ size, ...props }, ref): JSX.Element {\n  useThemeCheck();\n  const { styleProps } = useSapphireStyleProps(props);\n  return (\n    <span\n      ref={ref}\n      className={clsx(\n        styles['sapphire-breadcrumbs__item--static'],\n        {\n          [styles['sapphire-breadcrumbs__item--static--sm']]: size === 'sm',\n          [styles['sapphire-breadcrumbs__item--static--lg']]: size === 'lg',\n        },\n        styleProps.className\n      )}\n      style={styleProps.style}\n    >\n      {props.children}\n    </span>\n  );\n});\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAeO,MAAM,oBAAuB,GAAA,UAAA,CAGlC,SAA8B,qBAAA,CAAA,EAAA,EAAoB,GAAkB,EAAA;AAAtC,EAAA,IAAA,EAAA,GAAA,EAAA,EAAE,EAAF,IAAA,EAAA,GAAA,EAAA,EAAW,KAAX,GAAA,SAAA,CAAA,EAAA,EAAW,CAAT,MAAA,CAAA,CAAA,CAAA;AAChC,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAC7C,EAAA,2CACG,MAAD,EAAA;AAAA,IACE,GAAA;AAAA,IACA,SAAA,EAAW,IACT,CAAA,MAAA,CAAO,oCACP,CAAA,EAAA;AAAA,MACG,CAAA,MAAA,CAAO,4CAA4C,IAAS,KAAA,IAAA;AAAA,MAC5D,CAAA,MAAA,CAAO,4CAA4C,IAAS,KAAA,IAAA;AAAA,KAAA,EAE/D,UAAW,CAAA,SAAA,CAAA;AAAA,IAEb,OAAO,UAAW,CAAA,KAAA;AAAA,GAAA,EAEjB,KAAM,CAAA,QAAA,CAAA,CAAA;AAAA,CAAA;;;;"}
+{"version":3,"file":"BreadcrumbItemStatic.js","sources":["../../../../src/Breadcrumbs/src/BreadcrumbItemStatic.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n  SapphireStyleProps,\n  useSapphireStyleProps,\n  useThemeCheck,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport clsx from 'clsx';\nimport styles from '@danske/sapphire-css/components/breadcrumbs/breadcrumbs.module.css';\n\nexport type BreadcrumbItemStaticProps = Pick<\n  React.HTMLAttributes<HTMLSpanElement>,\n  'children'\n> &\n  SapphireStyleProps &\n  GlobalDomAttributes & { size: 'sm' | 'md' | 'lg' };\n\nexport const BreadcrumbItemStatic = forwardRef<\n  HTMLSpanElement,\n  BreadcrumbItemStaticProps\n>(function BreadcrumbItemStatic({ size, ...props }, ref): JSX.Element {\n  useThemeCheck();\n  const { styleProps } = useSapphireStyleProps(props);\n  return (\n    <span\n      ref={ref}\n      className={clsx(\n        styles['sapphire-breadcrumbs__item--static'],\n        {\n          [styles['sapphire-breadcrumbs__item--static--sm']]: size === 'sm',\n          [styles['sapphire-breadcrumbs__item--static--lg']]: size === 'lg',\n        },\n        styleProps.className\n      )}\n      style={styleProps.style}\n    >\n      {props.children}\n    </span>\n  );\n});\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAiBO,MAAM,oBAAuB,GAAA,UAAA,CAGlC,SAA8B,qBAAA,CAAA,EAAA,EAAoB,GAAkB,EAAA;AAAtC,EAAA,IAAA,EAAA,GAAA,EAAA,EAAE,EAAF,IAAA,EAAA,GAAA,EAAA,EAAW,KAAX,GAAA,SAAA,CAAA,EAAA,EAAW,CAAT,MAAA,CAAA,CAAA,CAAA;AAChC,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAC7C,EAAA,2CACG,MAAD,EAAA;AAAA,IACE,GAAA;AAAA,IACA,SAAA,EAAW,IACT,CAAA,MAAA,CAAO,oCACP,CAAA,EAAA;AAAA,MACG,CAAA,MAAA,CAAO,4CAA4C,IAAS,KAAA,IAAA;AAAA,MAC5D,CAAA,MAAA,CAAO,4CAA4C,IAAS,KAAA,IAAA;AAAA,KAAA,EAE/D,UAAW,CAAA,SAAA,CAAA;AAAA,IAEb,OAAO,UAAW,CAAA,KAAA;AAAA,GAAA,EAEjB,KAAM,CAAA,QAAA,CAAA,CAAA;AAAA,CAAA;;;;"}

package/build/esm/Breadcrumbs/src/Breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumbs.js","sources":["../../../../src/Breadcrumbs/src/Breadcrumbs.tsx"],"sourcesContent":["import React, { createContext, useRef } from 'react';\nimport clsx from 'clsx';\nimport styles from '@danske/sapphire-css/components/breadcrumbs/breadcrumbs.module.css';\nimport {\n  SapphireStyleProps,\n  useThemeCheck,\n  useSapphireStyleProps,\n} from '@danske/sapphire-react';\nimport {\n  Breadcrumbs as RACBreadcrumbs,\n  BreadcrumbsProps as RACBreadcrumbsProps,\n} from 'react-aria-components';\nimport { BreadcrumbItemProps } from './BreadcrumbItem';\n\nexport type BreadcrumbsProps<T extends object> = Pick<\n  RACBreadcrumbsProps<T>,\n  'aria-label' | 'isDisabled'\n> & {\n  children: React.ReactElement<BreadcrumbItemProps>[];\n  /**\n   * The size of the breadcrumbs component.\n   *\n   * @default 'md'\n   */\n  size?: 'sm' | 'md' | 'lg';\n  /**\n   * Maximum width for the breadcrumbs container. When content overflows,\n   * it will show an overflow menu with the first and last items.\n   */\n  maxWidth?: React.CSSProperties['maxWidth'];\n} & SapphireStyleProps;\n\nexport const BreadcrumbsContext = createContext<{\n  size: 'sm' | 'md' | 'lg';\n}>({ size: 'md' });\n\n/**\n * Breadcrumbs display a hierarchy of links to the current page or resource in an application.\n */\nexport const Breadcrumbs = <T extends object>({\n  size = 'md',\n  children,\n  maxWidth,\n  ...props\n}: BreadcrumbsProps<T>): JSX.Element => {\n  useThemeCheck();\n  const { styleProps } = useSapphireStyleProps(props);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const breadcrumbRef = useRef<HTMLOListElement>(null);\n\n  // TODO UC-4667 - re-enable computation of overflow\n  // const { shouldRenderOverflow, maxVisibleTailChildren } =\n  //   useBreadcrumbThreshold(children, containerRef, breadcrumbRef);\n\n  return (\n    <BreadcrumbsContext.Provider value={{ size }}>\n      <div\n        ref={containerRef}\n        style={{\n          ...styleProps.style,\n          maxWidth,\n          display: 'flex',\n        }}\n      >\n        <RACBreadcrumbs\n          {...props}\n          ref={breadcrumbRef}\n          className={clsx(styles['sapphire-breadcrumbs'], {\n            [styles['sapphire-breadcrumbs--sm']]: size === 'sm',\n            [styles['sapphire-breadcrumbs--lg']]: size === 'lg',\n          })}\n        >\n          {/* TODO UC-4667 - do not manipulate children directly */}\n          {/* {shouldRenderOverflow ? (\n            <>\n              {children[0]}\n              {children.length > 2 ? (\n                <OverflowBreadcrumbItem size={size}>\n                  {children.slice(1, children.length - maxVisibleTailChildren)}\n                </OverflowBreadcrumbItem>\n              ) : null}\n              {children\n                .slice(\n                  children.length -\n                    (maxVisibleTailChildren > 1 ? maxVisibleTailChildren : 1)\n                )\n                .map((child) => (\n                  <React.Fragment key={child.key}>{child}</React.Fragment>\n                ))}\n            </>\n          ) : (\n            children\n          )} */}\n          {children}\n        </RACBreadcrumbs>\n      </div>\n    </BreadcrumbsContext.Provider>\n  );\n};\n"],"names":["RACBreadcrumbs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCa,MAAA,kBAAA,GAAqB,aAE/B,CAAA,EAAE,IAAM,EAAA,IAAA,EAAA,EAAA;AAKE,MAAA,WAAA,GAAc,CAAmB,EAKN,KAAA;AALM,EAC5C,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAO,IAAA,GAAA,IAAA;AAAA,IACP,QAAA;AAAA,IACA,QAAA;AAAA,GAH4C,GAAA,EAAA,EAIzC,kBAJyC,EAIzC,EAAA;AAAA,IAHH,MAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAC7C,EAAA,MAAM,eAAe,MAAuB,CAAA,IAAA,CAAA,CAAA;AAC5C,EAAA,MAAM,gBAAgB,MAAyB,CAAA,IAAA,CAAA,CAAA;AAM/C,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,mBAAmB,QAApB,EAAA;AAAA,IAA6B,OAAO,EAAE,IAAA,EAAA;AAAA,GAAA,sCACnC,KAAD,EAAA;AAAA,IACE,GAAK,EAAA,YAAA;AAAA,IACL,KAAA,EAAO,aACF,CAAA,cAAA,CAAA,EAAA,EAAA,UAAA,CAAW,KADT,CAAA,EAAA;AAAA,MAEL,QAAA;AAAA,MACA,OAAS,EAAA,MAAA;AAAA,KAAA,CAAA;AAAA,GAGX,kBAAA,KAAA,CAAA,aAAA,CAACA,aAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EACM,KADN,CAAA,EAAA;AAAA,IAEE,GAAK,EAAA,aAAA;AAAA,IACL,SAAA,EAAW,IAAK,CAAA,MAAA,CAAO,sBAAyB,CAAA,EAAA;AAAA,MAC7C,CAAA,MAAA,CAAO,8BAA8B,IAAS,KAAA,IAAA;AAAA,MAC9C,CAAA,MAAA,CAAO,8BAA8B,IAAS,KAAA,IAAA;AAAA,KAAA,CAAA;AAAA,GAwBhD,CAAA,EAAA,QAAA,CAAA,CAAA,CAAA,CAAA;AAAA;;;;"}
+{"version":3,"file":"Breadcrumbs.js","sources":["../../../../src/Breadcrumbs/src/Breadcrumbs.tsx"],"sourcesContent":["import React, { createContext, useRef } from 'react';\nimport clsx from 'clsx';\nimport styles from '@danske/sapphire-css/components/breadcrumbs/breadcrumbs.module.css';\nimport {\n  SapphireStyleProps,\n  useThemeCheck,\n  useSapphireStyleProps,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport {\n  Breadcrumbs as RACBreadcrumbs,\n  BreadcrumbsProps as RACBreadcrumbsProps,\n} from 'react-aria-components';\nimport { BreadcrumbItemProps } from './BreadcrumbItem';\n\nexport type BreadcrumbsProps<T extends object> = Pick<\n  RACBreadcrumbsProps<T>,\n  'aria-label' | 'isDisabled'\n> & {\n  children: React.ReactElement<BreadcrumbItemProps>[];\n  /**\n   * The size of the breadcrumbs component.\n   *\n   * @default 'md'\n   */\n  size?: 'sm' | 'md' | 'lg';\n  /**\n   * Maximum width for the breadcrumbs container. When content overflows,\n   * it will show an overflow menu with the first and last items.\n   */\n  maxWidth?: React.CSSProperties['maxWidth'];\n} & SapphireStyleProps &\n  GlobalDomAttributes;\n\nexport const BreadcrumbsContext = createContext<{\n  size: 'sm' | 'md' | 'lg';\n}>({ size: 'md' });\n\n/**\n * Breadcrumbs display a hierarchy of links to the current page or resource in an application.\n */\nexport const Breadcrumbs = <T extends object>({\n  size = 'md',\n  children,\n  maxWidth,\n  ...props\n}: BreadcrumbsProps<T>): JSX.Element => {\n  useThemeCheck();\n  const { styleProps } = useSapphireStyleProps(props);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const breadcrumbRef = useRef<HTMLOListElement>(null);\n\n  // TODO UC-4667 - re-enable computation of overflow\n  // const { shouldRenderOverflow, maxVisibleTailChildren } =\n  //   useBreadcrumbThreshold(children, containerRef, breadcrumbRef);\n\n  return (\n    <BreadcrumbsContext.Provider value={{ size }}>\n      <div\n        ref={containerRef}\n        style={{\n          ...styleProps.style,\n          maxWidth,\n          display: 'flex',\n        }}\n      >\n        <RACBreadcrumbs\n          {...props}\n          ref={breadcrumbRef}\n          className={clsx(styles['sapphire-breadcrumbs'], {\n            [styles['sapphire-breadcrumbs--sm']]: size === 'sm',\n            [styles['sapphire-breadcrumbs--lg']]: size === 'lg',\n          })}\n        >\n          {/* TODO UC-4667 - do not manipulate children directly */}\n          {/* {shouldRenderOverflow ? (\n            <>\n              {children[0]}\n              {children.length > 2 ? (\n                <OverflowBreadcrumbItem size={size}>\n                  {children.slice(1, children.length - maxVisibleTailChildren)}\n                </OverflowBreadcrumbItem>\n              ) : null}\n              {children\n                .slice(\n                  children.length -\n                    (maxVisibleTailChildren > 1 ? maxVisibleTailChildren : 1)\n                )\n                .map((child) => (\n                  <React.Fragment key={child.key}>{child}</React.Fragment>\n                ))}\n            </>\n          ) : (\n            children\n          )} */}\n          {children}\n        </RACBreadcrumbs>\n      </div>\n    </BreadcrumbsContext.Provider>\n  );\n};\n"],"names":["RACBreadcrumbs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCa,MAAA,kBAAA,GAAqB,aAE/B,CAAA,EAAE,IAAM,EAAA,IAAA,EAAA,EAAA;AAKE,MAAA,WAAA,GAAc,CAAmB,EAKN,KAAA;AALM,EAC5C,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAO,IAAA,GAAA,IAAA;AAAA,IACP,QAAA;AAAA,IACA,QAAA;AAAA,GAH4C,GAAA,EAAA,EAIzC,kBAJyC,EAIzC,EAAA;AAAA,IAHH,MAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAC7C,EAAA,MAAM,eAAe,MAAuB,CAAA,IAAA,CAAA,CAAA;AAC5C,EAAA,MAAM,gBAAgB,MAAyB,CAAA,IAAA,CAAA,CAAA;AAM/C,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,mBAAmB,QAApB,EAAA;AAAA,IAA6B,OAAO,EAAE,IAAA,EAAA;AAAA,GAAA,sCACnC,KAAD,EAAA;AAAA,IACE,GAAK,EAAA,YAAA;AAAA,IACL,KAAA,EAAO,aACF,CAAA,cAAA,CAAA,EAAA,EAAA,UAAA,CAAW,KADT,CAAA,EAAA;AAAA,MAEL,QAAA;AAAA,MACA,OAAS,EAAA,MAAA;AAAA,KAAA,CAAA;AAAA,GAGX,kBAAA,KAAA,CAAA,aAAA,CAACA,aAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EACM,KADN,CAAA,EAAA;AAAA,IAEE,GAAK,EAAA,aAAA;AAAA,IACL,SAAA,EAAW,IAAK,CAAA,MAAA,CAAO,sBAAyB,CAAA,EAAA;AAAA,MAC7C,CAAA,MAAA,CAAO,8BAA8B,IAAS,KAAA,IAAA;AAAA,MAC9C,CAAA,MAAA,CAAO,8BAA8B,IAAS,KAAA,IAAA;AAAA,KAAA,CAAA;AAAA,GAwBhD,CAAA,EAAA,QAAA,CAAA,CAAA,CAAA,CAAA;AAAA;;;;"}

package/build/esm/FileDropzone/src/FileDropzone.js

@@ -4,7 +4,7 @@ import { useSapphireStyleProps, useButton, Icon, Typography } from '@danske/sapp
 import styles from '@danske/sapphire-css/components/dropzone/dropzone.module.css';
 import { Upload } from '@danske/sapphire-icons/react';
 import { useHover, Pressable } from '@react-aria/interactions';
-import { useId, useObjectRef, mergeProps } from '@react-aria/utils';
+import { useId, useObjectRef, filterDOMProps, mergeProps } from '@react-aria/utils';
 import { FileTrigger } from './FileTrigger.js';
 import { useDrop, useClipboard } from '@react-aria/dnd';
 import { convertFileListToFileDropItems } from './utils.js';
@@ -31,8 +31,20 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 const FileDropzone = React.forwardRef(function DropzoneWrapper(props, forwardedRef) {
-  const {
+  const _a = props, {
     isDisabled = false,
     hasError,
     renderInstruction,
@@ -41,7 +53,16 @@ const FileDropzone = React.forwardRef(function DropzoneWrapper(props, forwardedR
     allowsMultiple,
     onDrop = () => null,
     getDropOperation = () => "copy"
-  } = props;
+  } = _a, otherProps = __objRest(_a, [
+    "isDisabled",
+    "hasError",
+    "renderInstruction",
+    "onFileSelectOpen",
+    "acceptedFileTypes",
+    "allowsMultiple",
+    "onDrop",
+    "getDropOperation"
+  ]);
   const id = useId();
   const paragraphId = props["aria-label"] ? void 0 : id;
   const format = useMessageFormatter(intlMessages);
@@ -84,7 +105,7 @@ const FileDropzone = React.forwardRef(function DropzoneWrapper(props, forwardedR
   }, /* @__PURE__ */ React.createElement(Pressable, {
     ref: pressableRef,
     onPress: onFileSelectOpen
-  }, /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, mergeProps(dropProps, hoverProps, clipboardProps, focusProps, buttonProps)), {
+  }, /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues(__spreadValues({}, mergeProps(dropProps, hoverProps, clipboardProps, focusProps, buttonProps)), filterDOMProps(otherProps, { global: true })), {
     style: __spreadValues({}, styleProps.style),
     className: clsx(styles["sapphire-dropzone"], styles["js-focus"], styles["js-hover"], {
       [styles["is-hover"]]: isHovered && !isDropping,

package/build/esm/FileDropzone/src/FileDropzone.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileDropzone.js","sources":["../../../../src/FileDropzone/src/FileDropzone.tsx"],"sourcesContent":["import React, { ForwardedRef } from 'react';\nimport clsx from 'clsx';\nimport {\n  Typography,\n  Icon,\n  SapphireStyleProps,\n  useButton,\n  useSapphireStyleProps,\n} from '@danske/sapphire-react';\nimport styles from '@danske/sapphire-css/components/dropzone/dropzone.module.css';\nimport { Upload } from '@danske/sapphire-icons/react';\nimport { HoverProps, Pressable, useHover } from '@react-aria/interactions';\nimport { mergeProps, useId, useObjectRef } from '@react-aria/utils';\nimport { FileSelectProps, FileTrigger } from './FileTrigger';\nimport { DropOptions, useClipboard, useDrop } from '@react-aria/dnd';\nimport { convertFileListToFileDropItems } from './utils';\nimport { useFocusRing } from '@react-aria/focus';\nimport { AriaLabelingProps } from '@react-types/shared';\nimport { useMessageFormatter } from '@react-aria/i18n';\nimport intlMessages from '../i18n';\n\nexport interface FileDropzoneProps\n  extends SapphireStyleProps,\n    Pick<\n      DropOptions,\n      | 'getDropOperation'\n      | 'onDropEnter'\n      | 'onDropActivate'\n      | 'onDropMove'\n      | 'onDropExit'\n      | 'onDrop'\n    >,\n    HoverProps,\n    FileSelectProps,\n    // TODO when moving to \"core\", use types under `types.ts` instead of plain strings\n    Pick<\n      AriaLabelingProps,\n      'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'aria-details'\n    > {\n  /**\n   * Whether the dropzone has an error\n   * @default false\n   */\n  hasError?: boolean;\n  /**\n   * The body text of the dropzone which can contain the instructions for the files to be uploaded.\n   * Can be rendered differently based on the `isDropping` parameter, which is true if a file is about to be dropped in the zone.\n   * @param isDropping - boolean that marks whether a payload is about to be dropped in the dropzone.\n   */\n  renderInstruction: (isDropping: boolean) => string;\n  /**\n   * Function that is called when the file select is opened on press, before any file is selected.\n   * @default \"() => null\"\n   */\n  onFileSelectOpen?: () => void;\n}\n\nexport const FileDropzone = React.forwardRef(function DropzoneWrapper(\n  props: FileDropzoneProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const {\n    isDisabled = false,\n    hasError,\n    renderInstruction,\n    onFileSelectOpen = () => null,\n    acceptedFileTypes,\n    allowsMultiple,\n    onDrop = () => null,\n    getDropOperation = () => 'copy',\n  } = props;\n\n  const id = useId();\n  const paragraphId = props['aria-label'] ? undefined : id;\n  const format = useMessageFormatter(intlMessages);\n  const pressableRef = useObjectRef(forwardedRef);\n  const { hoverProps, isHovered } = useHover({ isDisabled });\n  const { styleProps } = useSapphireStyleProps(props);\n  const { dropProps, isDropTarget: isDropping } = useDrop({\n    ...props,\n    ref: pressableRef,\n    hasDropButton: true,\n    isDisabled,\n    getDropOperation,\n  });\n  const { buttonProps, isPressed } = useButton(\n    { elementType: 'div' },\n    pressableRef as React.RefObject<Element>\n  );\n  const { focusProps, isFocusVisible } = useFocusRing();\n\n  const { clipboardProps } = useClipboard({\n    isDisabled,\n    onPaste: (items) =>\n      onDrop({\n        type: 'drop',\n        items,\n        x: 0,\n        y: 0,\n        dropOperation: 'copy',\n      }),\n  });\n\n  const ariaLabel: string = props['aria-label'] || 'Dropzone';\n\n  const onFileTriggerSelect = (files: FileList | null) => {\n    onDrop({\n      type: 'drop',\n      items: convertFileListToFileDropItems(files),\n      x: 0,\n      y: 0,\n      dropOperation: 'copy',\n    });\n  };\n\n  return (\n    <FileTrigger\n      acceptedFileTypes={acceptedFileTypes}\n      allowsMultiple={allowsMultiple}\n      onSelect={onFileTriggerSelect}\n      isDisabled={isDisabled}\n    >\n      <Pressable ref={pressableRef} onPress={onFileSelectOpen}>\n        <div\n          {...mergeProps(\n            dropProps,\n            hoverProps,\n            clipboardProps,\n            focusProps,\n            buttonProps\n          )}\n          style={{ ...styleProps.style }}\n          className={clsx(\n            styles['sapphire-dropzone'],\n            styles['js-focus'],\n            styles['js-hover'],\n            {\n              [styles['is-hover']]: isHovered && !isDropping,\n              [styles['is-active']]: isPressed,\n              [styles['is-disabled']]: isDisabled,\n              [styles['is-focus']]: isFocusVisible,\n              [styles['sapphire-dropzone--dropping']]: isDropping,\n              [styles['sapphire-dropzone--error']]: hasError,\n            },\n            styleProps.className\n          )}\n          aria-label={ariaLabel}\n          aria-invalid={hasError}\n          aria-describedby={paragraphId}\n        >\n          <div className={clsx(styles['sapphire-dropzone__content'])}>\n            <div className={clsx(styles['sapphire-dropzone__icon'])}>\n              <Icon size=\"lg\">\n                <Upload />\n              </Icon>\n            </div>\n            <div className={clsx(styles['sapphire-dropzone__heading'])}>\n              <Typography.Heading level={6}>\n                {isDropping\n                  ? format('dropzone-heading-dropping')\n                  : allowsMultiple\n                  ? format('dropzone-heading-default')\n                  : format('dropzone-heading-default-single')}\n              </Typography.Heading>\n            </div>\n            <div\n              id={paragraphId}\n              className={clsx(styles['sapphire-dropzone__paragraph'])}\n            >\n              <Typography.Body size=\"sm\" color=\"secondary\">\n                {renderInstruction(isDropping)}\n              </Typography.Body>\n            </div>\n          </div>\n        </div>\n      </Pressable>\n    </FileTrigger>\n  );\n});\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"FileDropzone.js","sources":["../../../../src/FileDropzone/src/FileDropzone.tsx"],"sourcesContent":["import React, { ForwardedRef } from 'react';\nimport clsx from 'clsx';\nimport {\n  Typography,\n  Icon,\n  SapphireStyleProps,\n  useButton,\n  useSapphireStyleProps,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport styles from '@danske/sapphire-css/components/dropzone/dropzone.module.css';\nimport { Upload } from '@danske/sapphire-icons/react';\nimport { HoverProps, Pressable, useHover } from '@react-aria/interactions';\nimport {\n  mergeProps,\n  useId,\n  useObjectRef,\n  filterDOMProps,\n} from '@react-aria/utils';\nimport { FileSelectProps, FileTrigger } from './FileTrigger';\nimport { DropOptions, useClipboard, useDrop } from '@react-aria/dnd';\nimport { convertFileListToFileDropItems } from './utils';\nimport { useFocusRing } from '@react-aria/focus';\nimport { AriaLabelingProps } from '@react-types/shared';\nimport { useMessageFormatter } from '@react-aria/i18n';\nimport intlMessages from '../i18n';\n\nexport interface FileDropzoneProps\n  extends GlobalDomAttributes,\n    SapphireStyleProps,\n    Pick<\n      DropOptions,\n      | 'getDropOperation'\n      | 'onDropEnter'\n      | 'onDropActivate'\n      | 'onDropMove'\n      | 'onDropExit'\n      | 'onDrop'\n    >,\n    HoverProps,\n    FileSelectProps,\n    // TODO when moving to \"core\", use types under `types.ts` instead of plain strings\n    Pick<\n      AriaLabelingProps,\n      'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'aria-details'\n    > {\n  /**\n   * Whether the dropzone has an error\n   * @default false\n   */\n  hasError?: boolean;\n  /**\n   * The body text of the dropzone which can contain the instructions for the files to be uploaded.\n   * Can be rendered differently based on the `isDropping` parameter, which is true if a file is about to be dropped in the zone.\n   * @param isDropping - boolean that marks whether a payload is about to be dropped in the dropzone.\n   */\n  renderInstruction: (isDropping: boolean) => string;\n  /**\n   * Function that is called when the file select is opened on press, before any file is selected.\n   * @default \"() => null\"\n   */\n  onFileSelectOpen?: () => void;\n}\n\nexport const FileDropzone = React.forwardRef(function DropzoneWrapper(\n  props: FileDropzoneProps,\n  forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n  const {\n    isDisabled = false,\n    hasError,\n    renderInstruction,\n    onFileSelectOpen = () => null,\n    acceptedFileTypes,\n    allowsMultiple,\n    onDrop = () => null,\n    getDropOperation = () => 'copy',\n    ...otherProps\n  } = props;\n\n  const id = useId();\n  const paragraphId = props['aria-label'] ? undefined : id;\n  const format = useMessageFormatter(intlMessages);\n  const pressableRef = useObjectRef(forwardedRef);\n  const { hoverProps, isHovered } = useHover({ isDisabled });\n  const { styleProps } = useSapphireStyleProps(props);\n  const { dropProps, isDropTarget: isDropping } = useDrop({\n    ...props,\n    ref: pressableRef,\n    hasDropButton: true,\n    isDisabled,\n    getDropOperation,\n  });\n  const { buttonProps, isPressed } = useButton(\n    { elementType: 'div' },\n    pressableRef as React.RefObject<Element>\n  );\n  const { focusProps, isFocusVisible } = useFocusRing();\n\n  const { clipboardProps } = useClipboard({\n    isDisabled,\n    onPaste: (items) =>\n      onDrop({\n        type: 'drop',\n        items,\n        x: 0,\n        y: 0,\n        dropOperation: 'copy',\n      }),\n  });\n\n  const ariaLabel: string = props['aria-label'] || 'Dropzone';\n\n  const onFileTriggerSelect = (files: FileList | null) => {\n    onDrop({\n      type: 'drop',\n      items: convertFileListToFileDropItems(files),\n      x: 0,\n      y: 0,\n      dropOperation: 'copy',\n    });\n  };\n\n  return (\n    <FileTrigger\n      acceptedFileTypes={acceptedFileTypes}\n      allowsMultiple={allowsMultiple}\n      onSelect={onFileTriggerSelect}\n      isDisabled={isDisabled}\n    >\n      <Pressable ref={pressableRef} onPress={onFileSelectOpen}>\n        <div\n          {...mergeProps(\n            dropProps,\n            hoverProps,\n            clipboardProps,\n            focusProps,\n            buttonProps\n          )}\n          {...filterDOMProps(otherProps, { global: true })}\n          style={{ ...styleProps.style }}\n          className={clsx(\n            styles['sapphire-dropzone'],\n            styles['js-focus'],\n            styles['js-hover'],\n            {\n              [styles['is-hover']]: isHovered && !isDropping,\n              [styles['is-active']]: isPressed,\n              [styles['is-disabled']]: isDisabled,\n              [styles['is-focus']]: isFocusVisible,\n              [styles['sapphire-dropzone--dropping']]: isDropping,\n              [styles['sapphire-dropzone--error']]: hasError,\n            },\n            styleProps.className\n          )}\n          aria-label={ariaLabel}\n          aria-invalid={hasError}\n          aria-describedby={paragraphId}\n        >\n          <div className={clsx(styles['sapphire-dropzone__content'])}>\n            <div className={clsx(styles['sapphire-dropzone__icon'])}>\n              <Icon size=\"lg\">\n                <Upload />\n              </Icon>\n            </div>\n            <div className={clsx(styles['sapphire-dropzone__heading'])}>\n              <Typography.Heading level={6}>\n                {isDropping\n                  ? format('dropzone-heading-dropping')\n                  : allowsMultiple\n                  ? format('dropzone-heading-default')\n                  : format('dropzone-heading-default-single')}\n              </Typography.Heading>\n            </div>\n            <div\n              id={paragraphId}\n              className={clsx(styles['sapphire-dropzone__paragraph'])}\n            >\n              <Typography.Body size=\"sm\" color=\"secondary\">\n                {renderInstruction(isDropping)}\n              </Typography.Body>\n            </div>\n          </div>\n        </div>\n      </Pressable>\n    </FileTrigger>\n  );\n});\n"],"names":[],"mappings":"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"}

package/build/esm/FileDropzone/src/FileTrigger.js

@@ -55,7 +55,7 @@ const FileTrigger = React.forwardRef(function FileTriggerWrapper(props, ref) {
     "isDisabled"
   ]);
   const inputRef = useObjectRef(ref);
-  const domProps = filterDOMProps(rest);
+  const domProps = filterDOMProps(rest, { global: true });
   return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(PressResponder, {
     isDisabled,
     onPress: () => {

package/build/esm/FileDropzone/src/FileTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileTrigger.js","sources":["../../../../src/FileDropzone/src/FileTrigger.tsx"],"sourcesContent":["import React, { ForwardedRef } from 'react';\nimport { filterDOMProps, useObjectRef } from '@react-aria/utils';\nimport { PressResponder } from '@react-aria/interactions';\n\nexport interface FileSelectProps {\n  /**\n   * List of file types that are allowed to be selected using the file select.\n   * When no list is passed, all file types will be allowed to be selected.\n   * @default \"\"\n   */\n  acceptedFileTypes?: string[];\n  /**\n   * Whether multiple files are allowed to be selected using the file select.\n   * @default \"false\"\n   */\n  allowsMultiple?: boolean;\n}\n\nexport interface FileTriggerProps extends FileSelectProps {\n  /**\n   * Callback for file selection.\n   * @param files - the list of selected files\n   * @default \"() => null\"\n   */\n  onSelect?: (files: FileList | null) => void;\n  isDisabled?: boolean;\n  children?: React.ReactNode;\n}\n\nconst HiddenFileInput = React.forwardRef(function InputWrapper(\n  props: React.HTMLProps<HTMLInputElement>,\n  ref: ForwardedRef<HTMLInputElement>\n) {\n  return <input {...props} ref={ref} type=\"file\" style={{ display: 'none' }} />;\n});\n\nexport const FileTrigger = React.forwardRef(function FileTriggerWrapper(\n  props: FileTriggerProps,\n  ref: ForwardedRef<HTMLInputElement>\n) {\n  const {\n    acceptedFileTypes,\n    allowsMultiple = false,\n    onSelect = () => null,\n    children,\n    isDisabled = false,\n    ...rest\n  } = props;\n  const inputRef = useObjectRef(ref);\n  const domProps = filterDOMProps(rest);\n\n  return (\n    <>\n      <PressResponder\n        isDisabled={isDisabled}\n        onPress={() => {\n          if (inputRef.current) {\n            inputRef.current.value = '';\n          }\n          inputRef.current?.click();\n        }}\n      >\n        {children}\n      </PressResponder>\n      <HiddenFileInput\n        {...domProps}\n        disabled={isDisabled}\n        ref={inputRef}\n        accept={acceptedFileTypes?.toString()}\n        onChange={(e) => onSelect?.((e.target as HTMLInputElement).files)}\n        multiple={allowsMultiple}\n      />\n    </>\n  );\n});\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA,MAAM,eAAkB,GAAA,KAAA,CAAM,UAAW,CAAA,SAAA,YAAA,CACvC,OACA,GACA,EAAA;AACA,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EAAW,KAAX,CAAA,EAAA;AAAA,IAAkB,GAAA;AAAA,IAAU,IAAK,EAAA,MAAA;AAAA,IAAO,KAAA,EAAO,EAAE,OAAS,EAAA,MAAA,EAAA;AAAA,GAAA,CAAA,CAAA,CAAA;AAAA,CAAA,CAAA,CAAA;AAG5D,MAAM,WAAc,GAAA,KAAA,CAAM,UAAW,CAAA,SAAA,kBAAA,CAC1C,OACA,GACA,EAAA;AACA,EAAA,MAOI,EANF,GAAA,KAAA,EAAA;AAAA,IAAA,iBAAA;AAAA,IACA,cAAiB,GAAA,KAAA;AAAA,IACjB,WAAW,MAAM,IAAA;AAAA,IACjB,QAAA;AAAA,IACA,UAAa,GAAA,KAAA;AAAA,GAEX,GAAA,EAAA,EADC,iBACD,EADC,EAAA;AAAA,IALH,mBAAA;AAAA,IACA,gBAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,GAAA,CAAA,CAAA;AAGF,EAAA,MAAM,WAAW,YAAa,CAAA,GAAA,CAAA,CAAA;AAC9B,EAAA,MAAM,WAAW,cAAe,CAAA,IAAA,CAAA,CAAA;AAEhC,EACE,uBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,sCACG,cAAD,EAAA;AAAA,IACE,UAAA;AAAA,IACA,SAAS,MAAM;AAvDvB,MAAA,IAAA,GAAA,CAAA;AAwDU,MAAA,IAAI,SAAS,OAAS,EAAA;AACpB,QAAA,QAAA,CAAS,QAAQ,KAAQ,GAAA,EAAA,CAAA;AAAA,OAAA;AAE3B,MAAA,CAAA,GAAA,GAAA,QAAA,CAAS,YAAT,IAAkB,GAAA,KAAA,CAAA,GAAA,GAAA,CAAA,KAAA,EAAA,CAAA;AAAA,KAAA;AAAA,GAAA,EAGnB,QAEH,CAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,eAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EACM,QADN,CAAA,EAAA;AAAA,IAEE,QAAU,EAAA,UAAA;AAAA,IACV,GAAK,EAAA,QAAA;AAAA,IACL,QAAQ,iBAAmB,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,iBAAA,CAAA,QAAA,EAAA;AAAA,IAC3B,QAAU,EAAA,CAAC,CAAM,KAAA,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAY,EAAE,MAA4B,CAAA,KAAA,CAAA;AAAA,IAC3D,QAAU,EAAA,cAAA;AAAA,GAAA,CAAA,CAAA,CAAA,CAAA;AAAA,CAAA;;;;"}
+{"version":3,"file":"FileTrigger.js","sources":["../../../../src/FileDropzone/src/FileTrigger.tsx"],"sourcesContent":["import React, { ForwardedRef } from 'react';\nimport { filterDOMProps, useObjectRef } from '@react-aria/utils';\nimport { PressResponder } from '@react-aria/interactions';\n\nexport interface FileSelectProps {\n  /**\n   * List of file types that are allowed to be selected using the file select.\n   * When no list is passed, all file types will be allowed to be selected.\n   * @default \"\"\n   */\n  acceptedFileTypes?: string[];\n  /**\n   * Whether multiple files are allowed to be selected using the file select.\n   * @default \"false\"\n   */\n  allowsMultiple?: boolean;\n}\n\nexport interface FileTriggerProps extends FileSelectProps {\n  /**\n   * Callback for file selection.\n   * @param files - the list of selected files\n   * @default \"() => null\"\n   */\n  onSelect?: (files: FileList | null) => void;\n  isDisabled?: boolean;\n  children?: React.ReactNode;\n}\n\nconst HiddenFileInput = React.forwardRef(function InputWrapper(\n  props: React.HTMLProps<HTMLInputElement>,\n  ref: ForwardedRef<HTMLInputElement>\n) {\n  return <input {...props} ref={ref} type=\"file\" style={{ display: 'none' }} />;\n});\n\nexport const FileTrigger = React.forwardRef(function FileTriggerWrapper(\n  props: FileTriggerProps,\n  ref: ForwardedRef<HTMLInputElement>\n) {\n  const {\n    acceptedFileTypes,\n    allowsMultiple = false,\n    onSelect = () => null,\n    children,\n    isDisabled = false,\n    ...rest\n  } = props;\n  const inputRef = useObjectRef(ref);\n  const domProps = filterDOMProps(rest, { global: true });\n\n  return (\n    <>\n      <PressResponder\n        isDisabled={isDisabled}\n        onPress={() => {\n          if (inputRef.current) {\n            inputRef.current.value = '';\n          }\n          inputRef.current?.click();\n        }}\n      >\n        {children}\n      </PressResponder>\n      <HiddenFileInput\n        {...domProps}\n        disabled={isDisabled}\n        ref={inputRef}\n        accept={acceptedFileTypes?.toString()}\n        onChange={(e) => onSelect?.((e.target as HTMLInputElement).files)}\n        multiple={allowsMultiple}\n      />\n    </>\n  );\n});\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA,MAAM,eAAkB,GAAA,KAAA,CAAM,UAAW,CAAA,SAAA,YAAA,CACvC,OACA,GACA,EAAA;AACA,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EAAW,KAAX,CAAA,EAAA;AAAA,IAAkB,GAAA;AAAA,IAAU,IAAK,EAAA,MAAA;AAAA,IAAO,KAAA,EAAO,EAAE,OAAS,EAAA,MAAA,EAAA;AAAA,GAAA,CAAA,CAAA,CAAA;AAAA,CAAA,CAAA,CAAA;AAG5D,MAAM,WAAc,GAAA,KAAA,CAAM,UAAW,CAAA,SAAA,kBAAA,CAC1C,OACA,GACA,EAAA;AACA,EAAA,MAOI,EANF,GAAA,KAAA,EAAA;AAAA,IAAA,iBAAA;AAAA,IACA,cAAiB,GAAA,KAAA;AAAA,IACjB,WAAW,MAAM,IAAA;AAAA,IACjB,QAAA;AAAA,IACA,UAAa,GAAA,KAAA;AAAA,GAEX,GAAA,EAAA,EADC,iBACD,EADC,EAAA;AAAA,IALH,mBAAA;AAAA,IACA,gBAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,GAAA,CAAA,CAAA;AAGF,EAAA,MAAM,WAAW,YAAa,CAAA,GAAA,CAAA,CAAA;AAC9B,EAAA,MAAM,QAAW,GAAA,cAAA,CAAe,IAAM,EAAA,EAAE,MAAQ,EAAA,IAAA,EAAA,CAAA,CAAA;AAEhD,EACE,uBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,sCACG,cAAD,EAAA;AAAA,IACE,UAAA;AAAA,IACA,SAAS,MAAM;AAvDvB,MAAA,IAAA,GAAA,CAAA;AAwDU,MAAA,IAAI,SAAS,OAAS,EAAA;AACpB,QAAA,QAAA,CAAS,QAAQ,KAAQ,GAAA,EAAA,CAAA;AAAA,OAAA;AAE3B,MAAA,CAAA,GAAA,GAAA,QAAA,CAAS,YAAT,IAAkB,GAAA,KAAA,CAAA,GAAA,GAAA,CAAA,KAAA,EAAA,CAAA;AAAA,KAAA;AAAA,GAAA,EAGnB,QAEH,CAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,eAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EACM,QADN,CAAA,EAAA;AAAA,IAEE,QAAU,EAAA,UAAA;AAAA,IACV,GAAK,EAAA,QAAA;AAAA,IACL,QAAQ,iBAAmB,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,iBAAA,CAAA,QAAA,EAAA;AAAA,IAC3B,QAAU,EAAA,CAAC,CAAM,KAAA,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAY,EAAE,MAA4B,CAAA,KAAA,CAAA;AAAA,IAC3D,QAAU,EAAA,cAAA;AAAA,GAAA,CAAA,CAAA,CAAA,CAAA;AAAA,CAAA;;;;"}

package/build/esm/Filtering/src/FilterDropdown.js

@@ -1,39 +1,88 @@
 import React, { useRef } from 'react';
 import { VisuallyHidden } from '@react-aria/visually-hidden';
-import { useEffectEvent } from '@react-aria/utils';
+import { useEffectEvent, filterDOMProps } from '@react-aria/utils';
 import { useControlledState } from '@react-stately/utils';
 import { PopoverTrigger, ButtonGroup, Button, ToggleButton } from '@danske/sapphire-react';
 import { ChevronUp, ChevronDown } from '@danske/sapphire-icons/react';
 import styles from '@danske/sapphire-css/components/filterDropdown/filterDropdown.module.css';
 
-function FilterDropdown({
-  children,
-  label,
-  value,
-  isDisabled = false,
-  isApplyDisabled = false,
-  isClearDisabled,
-  isOpen: isOpenProp,
-  applyButtonLabel = "Apply",
-  clearButtonLabel = "Clear",
-  defaultOpen = false,
-  hasApplyButton = false,
-  noMaxWidth,
-  onApply,
-  onClear,
-  onOpenChange,
-  buttonSize = "md"
-}) {
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+function FilterDropdown(_a) {
+  var _b = _a, {
+    children,
+    label,
+    value,
+    isDisabled = false,
+    isApplyDisabled = false,
+    isClearDisabled,
+    isOpen: isOpenProp,
+    applyButtonLabel = "Apply",
+    clearButtonLabel = "Clear",
+    defaultOpen = false,
+    hasApplyButton = false,
+    noMaxWidth,
+    onApply,
+    onClear,
+    onOpenChange,
+    buttonSize = "md"
+  } = _b, props = __objRest(_b, [
+    "children",
+    "label",
+    "value",
+    "isDisabled",
+    "isApplyDisabled",
+    "isClearDisabled",
+    "isOpen",
+    "applyButtonLabel",
+    "clearButtonLabel",
+    "defaultOpen",
+    "hasApplyButton",
+    "noMaxWidth",
+    "onApply",
+    "onClear",
+    "onOpenChange",
+    "buttonSize"
+  ]);
   const triggerRef = useRef(null);
   const [isOpen, setIsOpen] = useControlledState(isOpenProp, defaultOpen, useEffectEvent(onOpenChange));
   const hasValue = value != null && value !== "";
   const close = () => setIsOpen(false);
   const onSubmit = (e) => {
-    var _a;
+    var _a2;
     e.preventDefault();
     onApply == null ? void 0 : onApply();
     close();
-    (_a = triggerRef.current) == null ? void 0 : _a.focus();
+    (_a2 = triggerRef.current) == null ? void 0 : _a2.focus();
   };
   const applyButton = /* @__PURE__ */ React.createElement(Button, {
     type: "submit",
@@ -48,10 +97,10 @@ function FilterDropdown({
     onOpenChange: setIsOpen,
     noMaxWidth,
     noPadding: true,
-    popoverContent: /* @__PURE__ */ React.createElement("form", {
+    popoverContent: /* @__PURE__ */ React.createElement("form", __spreadProps(__spreadValues({}, filterDOMProps(props, { global: true })), {
       onSubmit,
       className: styles["sapphire-filter-dropdown"]
-    }, /* @__PURE__ */ React.createElement("div", {
+    }), /* @__PURE__ */ React.createElement("div", {
       className: styles["sapphire-filter-dropdown__body"]
     }, children), /* @__PURE__ */ React.createElement("div", {
       className: styles["sapphire-filter-dropdown__footer"]