@danske/sapphire-react-lab 0.93.2 → 0.94.1

package/build/cjs/index.js

@@ -4,40 +4,44 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var visuallyHidden = require('@react-aria/visually-hidden');
+var utils$1 = require('@react-aria/utils');
 var utils = require('@react-stately/utils');
 var sapphireReact = require('@danske/sapphire-react');
 var react = require('@danske/sapphire-icons/react');
+var styles = require('@danske/sapphire-css/components/filterDropdown/filterDropdown.module.css');
 var clsx = require('clsx');
 var accordion = require('@react-aria/accordion');
-var utils$1 = require('@react-aria/utils');
-var styles = require('@danske/sapphire-css/components/accordion/accordion.module.css');
+var styles$1 = require('@danske/sapphire-css/components/accordion/accordion.module.css');
 var focus = require('@react-aria/focus');
 var interactions = require('@react-aria/interactions');
 var collections = require('@react-stately/collections');
 var tree = require('@react-stately/tree');
-var styles$1 = require('@danske/sapphire-css/components/dropzone/dropzone.module.css');
+var styles$2 = require('@danske/sapphire-css/components/dropzone/dropzone.module.css');
 var dnd = require('@react-aria/dnd');
 var i18n = require('@react-aria/i18n');
 var utils$2 = require('@react-spectrum/utils');
+var styles$3 = require('@danske/sapphire-css/components/flag/flag.module.css');
 var textFieldStyles = require('@danske/sapphire-css/components/textField/textField.module.css');
 var numberfield$1 = require('@react-aria/numberfield');
 var numberfield = require('@react-stately/numberfield');
 var tag = require('@react-aria/tag');
 var list = require('@react-stately/list');
-var styles$2 = require('@danske/sapphire-css/components/tag/tag.module.css');
+var styles$4 = require('@danske/sapphire-css/components/tag/tag.module.css');
 var button = require('@react-aria/button');
 var label = require('@react-aria/label');
-var styles$3 = require('@danske/sapphire-css/components/labeledValue/labeledValue.module.css');
+var styles$5 = require('@danske/sapphire-css/components/labeledValue/labeledValue.module.css');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var clsx__default = /*#__PURE__*/_interopDefaultLegacy(clsx);
 var styles__default = /*#__PURE__*/_interopDefaultLegacy(styles);
+var clsx__default = /*#__PURE__*/_interopDefaultLegacy(clsx);
 var styles__default$1 = /*#__PURE__*/_interopDefaultLegacy(styles$1);
-var textFieldStyles__default = /*#__PURE__*/_interopDefaultLegacy(textFieldStyles);
 var styles__default$2 = /*#__PURE__*/_interopDefaultLegacy(styles$2);
 var styles__default$3 = /*#__PURE__*/_interopDefaultLegacy(styles$3);
+var textFieldStyles__default = /*#__PURE__*/_interopDefaultLegacy(textFieldStyles);
+var styles__default$4 = /*#__PURE__*/_interopDefaultLegacy(styles$4);
+var styles__default$5 = /*#__PURE__*/_interopDefaultLegacy(styles$5);
 
 function FilterDropdown({
   children,
@@ -55,7 +59,7 @@ function FilterDropdown({
   onClear,
   onOpenChange
 }) {
-  const [isOpen, setIsOpen] = utils.useControlledState(isOpenProp, defaultOpen, onOpenChange);
+  const [isOpen, setIsOpen] = utils.useControlledState(isOpenProp, defaultOpen, utils$1.useEffectEvent(onOpenChange));
   const hasValue = value != null && value !== "";
   const close = () => setIsOpen(false);
   const apply = () => {
@@ -69,10 +73,12 @@ function FilterDropdown({
   }, applyButtonLabel);
   return /* @__PURE__ */ React__default["default"].createElement(sapphireReact.PopoverTrigger, {
     popoverContent: /* @__PURE__ */ React__default["default"].createElement("form", {
-      onSubmit: apply
-    }, children, /* @__PURE__ */ React__default["default"].createElement(sapphireReact.Flex, {
-      justifyContent: "space-between",
-      marginTop: sapphireReact.tokens.size.spacing30
+      onSubmit: apply,
+      className: styles__default["default"]["sapphire-filter-dropdown"]
+    }, /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: styles__default["default"]["sapphire-filter-dropdown__body"]
+    }, children), /* @__PURE__ */ React__default["default"].createElement("div", {
+      className: styles__default["default"]["sapphire-filter-dropdown__footer"]
     }, /* @__PURE__ */ React__default["default"].createElement(sapphireReact.Button, {
       variant: "secondary",
       onPress: () => {
@@ -84,7 +90,8 @@ function FilterDropdown({
     placement: "bottom left",
     isOpen,
     onOpenChange: setIsOpen,
-    noMaxWidth
+    noMaxWidth,
+    noPadding: true
   }, /* @__PURE__ */ React__default["default"].createElement(sapphireReact.ToggleButton, {
     icon: isOpen ? /* @__PURE__ */ React__default["default"].createElement(react.ChevronUp, null) : /* @__PURE__ */ React__default["default"].createElement(react.ChevronDown, null),
     iconAlign: "right",
@@ -104,25 +111,25 @@ function useAccordionContext() {
   throw new Error("Accordion context can only be used within Accordion component.");
 }
 
-var __defProp$b = Object.defineProperty;
-var __defProps$b = Object.defineProperties;
-var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
-var __hasOwnProp$b = Object.prototype.hasOwnProperty;
-var __propIsEnum$b = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$b = (a, b) => {
+var __defProp$c = Object.defineProperty;
+var __defProps$c = Object.defineProperties;
+var __getOwnPropDescs$c = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
+var __hasOwnProp$c = Object.prototype.hasOwnProperty;
+var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$c = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$b.call(b, prop))
-      __defNormalProp$b(a, prop, b[prop]);
-  if (__getOwnPropSymbols$b)
-    for (var prop of __getOwnPropSymbols$b(b)) {
-      if (__propIsEnum$b.call(b, prop))
-        __defNormalProp$b(a, prop, b[prop]);
+    if (__hasOwnProp$c.call(b, prop))
+      __defNormalProp$c(a, prop, b[prop]);
+  if (__getOwnPropSymbols$c)
+    for (var prop of __getOwnPropSymbols$c(b)) {
+      if (__propIsEnum$c.call(b, prop))
+        __defNormalProp$c(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
+var __spreadProps$c = (a, b) => __defProps$c(a, __getOwnPropDescs$c(b));
 const customPaddingStyleProps = (sidePadding) => ({
   paddingLeft: typeof sidePadding === "string" ? sidePadding : `${sidePadding}px`,
   paddingRight: typeof sidePadding === "string" ? sidePadding : `${sidePadding}px`
@@ -141,59 +148,59 @@ function _AccordionItem(props) {
     e.stopPropagation();
   };
   return /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: clsx__default["default"](styles__default["default"]["sapphire-accordion__item"], {
-      [styles__default["default"]["sapphire-accordion__item--open"]]: isOpen,
-      [styles__default["default"]["is-disabled"]]: isDisabled
+    className: clsx__default["default"](styles__default$1["default"]["sapphire-accordion__item"], {
+      [styles__default$1["default"]["sapphire-accordion__item--open"]]: isOpen,
+      [styles__default$1["default"]["is-disabled"]]: isDisabled
     })
   }, /* @__PURE__ */ React__default["default"].createElement("div", {
     role: "heading",
     "aria-level": props.headerLevel
-  }, /* @__PURE__ */ React__default["default"].createElement("button", __spreadProps$b(__spreadValues$b({}, utils$1.mergeProps(buttonProps, hoverProps, pressProps, focusProps)), {
+  }, /* @__PURE__ */ React__default["default"].createElement("button", __spreadProps$c(__spreadValues$c({}, utils$1.mergeProps(buttonProps, hoverProps, pressProps, focusProps)), {
     "aria-disabled": isDisabled,
     ref,
-    className: clsx__default["default"](styles__default["default"]["sapphire-accordion__item-header"], styles__default["default"]["js-focus"], styles__default["default"]["js-hover"], {
-      [styles__default["default"]["is-focus"]]: isFocusVisible,
-      [styles__default["default"]["is-hover"]]: isHovered,
-      [styles__default["default"]["is-active"]]: isPressed
+    className: clsx__default["default"](styles__default$1["default"]["sapphire-accordion__item-header"], styles__default$1["default"]["js-focus"], styles__default$1["default"]["js-hover"], {
+      [styles__default$1["default"]["is-focus"]]: isFocusVisible,
+      [styles__default$1["default"]["is-hover"]]: isHovered,
+      [styles__default$1["default"]["is-active"]]: isPressed
     }),
     style: sidePadding ? customPaddingStyleProps(sidePadding) : {}
   }), item.props.heading, /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: clsx__default["default"](styles__default["default"]["sapphire-accordion__item-arrow"])
-  }, /* @__PURE__ */ React__default["default"].createElement(sapphireReact.Icon, null, /* @__PURE__ */ React__default["default"].createElement(react.ChevronDown, null))))), /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$b(__spreadValues$b({}, utils$1.mergeProps(regionProps, { onKeyDown })), {
+    className: clsx__default["default"](styles__default$1["default"]["sapphire-accordion__item-arrow"])
+  }, /* @__PURE__ */ React__default["default"].createElement(sapphireReact.Icon, null, /* @__PURE__ */ React__default["default"].createElement(react.ChevronDown, null))))), /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$c(__spreadValues$c({}, utils$1.mergeProps(regionProps, { onKeyDown })), {
     "aria-hidden": !isOpen,
-    className: clsx__default["default"](styles__default["default"]["sapphire-accordion__item-content-wrapper"])
+    className: clsx__default["default"](styles__default$1["default"]["sapphire-accordion__item-content-wrapper"])
   }), /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: clsx__default["default"](styles__default["default"]["sapphire-accordion__item-content"]),
+    className: clsx__default["default"](styles__default$1["default"]["sapphire-accordion__item-content"]),
     style: sidePadding ? customPaddingStyleProps(sidePadding) : {}
   }, item.props.children)));
 }
 const AccordionItem = collections.Item;
 
-var __defProp$a = Object.defineProperty;
-var __defProps$a = Object.defineProperties;
-var __getOwnPropDescs$a = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$a = Object.getOwnPropertySymbols;
-var __hasOwnProp$a = Object.prototype.hasOwnProperty;
-var __propIsEnum$a = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$a = (a, b) => {
+var __defProp$b = Object.defineProperty;
+var __defProps$b = Object.defineProperties;
+var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
+var __hasOwnProp$b = Object.prototype.hasOwnProperty;
+var __propIsEnum$b = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$b = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$a.call(b, prop))
-      __defNormalProp$a(a, prop, b[prop]);
-  if (__getOwnPropSymbols$a)
-    for (var prop of __getOwnPropSymbols$a(b)) {
-      if (__propIsEnum$a.call(b, prop))
-        __defNormalProp$a(a, prop, b[prop]);
+    if (__hasOwnProp$b.call(b, prop))
+      __defNormalProp$b(a, prop, b[prop]);
+  if (__getOwnPropSymbols$b)
+    for (var prop of __getOwnPropSymbols$b(b)) {
+      if (__propIsEnum$b.call(b, prop))
+        __defNormalProp$b(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
+var __spreadProps$b = (a, b) => __defProps$b(a, __getOwnPropDescs$b(b));
 function useTreeState(props) {
   const state = tree.useTreeState(props);
   const onToggle = (key) => {
     state.setExpandedKeys(toggleKey(state.expandedKeys, key, props.expansionMode));
   };
-  return __spreadProps$a(__spreadValues$a({}, state), { toggleKey: onToggle });
+  return __spreadProps$b(__spreadValues$b({}, state), { toggleKey: onToggle });
 }
 function toggleKey(set, key, expansionMode = "multiple") {
   const res = new Set(set);
@@ -207,33 +214,33 @@ function toggleKey(set, key, expansionMode = "multiple") {
   return res;
 }
 
-var __defProp$9 = Object.defineProperty;
-var __defProps$9 = Object.defineProperties;
-var __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$9 = Object.getOwnPropertySymbols;
-var __hasOwnProp$9 = Object.prototype.hasOwnProperty;
-var __propIsEnum$9 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$9 = (a, b) => {
+var __defProp$a = Object.defineProperty;
+var __defProps$a = Object.defineProperties;
+var __getOwnPropDescs$a = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$a = Object.getOwnPropertySymbols;
+var __hasOwnProp$a = Object.prototype.hasOwnProperty;
+var __propIsEnum$a = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$a = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$9.call(b, prop))
-      __defNormalProp$9(a, prop, b[prop]);
-  if (__getOwnPropSymbols$9)
-    for (var prop of __getOwnPropSymbols$9(b)) {
-      if (__propIsEnum$9.call(b, prop))
-        __defNormalProp$9(a, prop, b[prop]);
+    if (__hasOwnProp$a.call(b, prop))
+      __defNormalProp$a(a, prop, b[prop]);
+  if (__getOwnPropSymbols$a)
+    for (var prop of __getOwnPropSymbols$a(b)) {
+      if (__propIsEnum$a.call(b, prop))
+        __defNormalProp$a(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
-var __objRest$8 = (source, exclude) => {
+var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
+var __objRest$9 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$9.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$a.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$9)
-    for (var prop of __getOwnPropSymbols$9(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$9.call(source, prop))
+  if (source != null && __getOwnPropSymbols$a)
+    for (var prop of __getOwnPropSymbols$a(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$a.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -245,7 +252,7 @@ const _Accordion$1 = (_a, ref) => {
     hideLastDivider = false,
     hasNegativeSideMargin = false,
     sidePadding
-  } = _b, props = __objRest$8(_b, [
+  } = _b, props = __objRest$9(_b, [
     "expansionMode",
     "headerLevel",
     "hideLastDivider",
@@ -254,18 +261,18 @@ const _Accordion$1 = (_a, ref) => {
   ]);
   sapphireReact.useThemeCheck();
   const { styleProps } = sapphireReact.useSapphireStyleProps(props);
-  const state = useTreeState(__spreadProps$9(__spreadValues$9({}, props), { expansionMode }));
+  const state = useTreeState(__spreadProps$a(__spreadValues$a({}, props), { expansionMode }));
   const forwardedRef = utils$1.useObjectRef(ref);
   const { accordionProps } = accordion.useAccordion(props, state, forwardedRef);
   return /* @__PURE__ */ React__default["default"].createElement(AccordionContext.Provider, {
     value: { sidePadding }
-  }, /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$9(__spreadValues$9({}, utils$1.mergeProps(accordionProps, utils$1.filterDOMProps(props, { labelable: true }))), {
+  }, /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$a(__spreadValues$a({}, utils$1.mergeProps(accordionProps, utils$1.filterDOMProps(props, { labelable: true }))), {
     ref: forwardedRef,
-    className: clsx__default["default"](styles__default["default"]["sapphire-accordion"], {
-      [styles__default["default"]["sapphire-accordion--without-last-divider"]]: hideLastDivider,
-      [styles__default["default"]["sapphire-accordion--negative-margin-self"]]: !sidePadding && hasNegativeSideMargin
+    className: clsx__default["default"](styles__default$1["default"]["sapphire-accordion"], {
+      [styles__default$1["default"]["sapphire-accordion--without-last-divider"]]: hideLastDivider,
+      [styles__default$1["default"]["sapphire-accordion--negative-margin-self"]]: !sidePadding && hasNegativeSideMargin
     }, styleProps.className),
-    style: __spreadValues$9(__spreadValues$9({}, sidePadding && hasNegativeSideMargin ? {
+    style: __spreadValues$a(__spreadValues$a({}, sidePadding && hasNegativeSideMargin ? {
       marginLeft: typeof sidePadding === "string" ? `calc(${sidePadding} * -1)` : `-${sidePadding}px`,
       width: `calc(100% + calc(${sidePadding} * 2${typeof sidePadding === "string" ? "" : "px"}))`
     } : {}), styleProps.style)
@@ -278,33 +285,33 @@ const _Accordion$1 = (_a, ref) => {
 };
 const Accordion = React.forwardRef(_Accordion$1);
 
-var __defProp$8 = Object.defineProperty;
-var __defProps$8 = Object.defineProperties;
-var __getOwnPropDescs$8 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
-var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
-var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$8 = (a, b) => {
+var __defProp$9 = Object.defineProperty;
+var __defProps$9 = Object.defineProperties;
+var __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$9 = Object.getOwnPropertySymbols;
+var __hasOwnProp$9 = Object.prototype.hasOwnProperty;
+var __propIsEnum$9 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$9 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$8.call(b, prop))
-      __defNormalProp$8(a, prop, b[prop]);
-  if (__getOwnPropSymbols$8)
-    for (var prop of __getOwnPropSymbols$8(b)) {
-      if (__propIsEnum$8.call(b, prop))
-        __defNormalProp$8(a, prop, b[prop]);
+    if (__hasOwnProp$9.call(b, prop))
+      __defNormalProp$9(a, prop, b[prop]);
+  if (__getOwnPropSymbols$9)
+    for (var prop of __getOwnPropSymbols$9(b)) {
+      if (__propIsEnum$9.call(b, prop))
+        __defNormalProp$9(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$8 = (a, b) => __defProps$8(a, __getOwnPropDescs$8(b));
-var __objRest$7 = (source, exclude) => {
+var __spreadProps$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
+var __objRest$8 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$8.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$9.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$8)
-    for (var prop of __getOwnPropSymbols$8(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$8.call(source, prop))
+  if (source != null && __getOwnPropSymbols$9)
+    for (var prop of __getOwnPropSymbols$9(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$9.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -312,11 +319,11 @@ var __objRest$7 = (source, exclude) => {
 const AccordionHeading = (_a) => {
   var _b = _a, {
     children
-  } = _b, props = __objRest$7(_b, [
+  } = _b, props = __objRest$8(_b, [
     "children"
   ]);
-  return /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$8(__spreadValues$8({}, utils$1.filterDOMProps(props)), {
-    className: clsx__default["default"](styles__default["default"]["sapphire-accordion__item-heading"])
+  return /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$9(__spreadValues$9({}, utils$1.filterDOMProps(props)), {
+    className: clsx__default["default"](styles__default$1["default"]["sapphire-accordion__item-heading"])
   }), children);
 };
 
@@ -325,39 +332,39 @@ const _Accordion = Object.assign(Accordion, {
   Item: AccordionItem
 });
 
-var __defProp$7 = Object.defineProperty;
-var __defProps$7 = Object.defineProperties;
-var __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
-var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
-var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$7 = (a, b) => {
+var __defProp$8 = Object.defineProperty;
+var __defProps$8 = Object.defineProperties;
+var __getOwnPropDescs$8 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
+var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
+var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$8 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$7.call(b, prop))
-      __defNormalProp$7(a, prop, b[prop]);
-  if (__getOwnPropSymbols$7)
-    for (var prop of __getOwnPropSymbols$7(b)) {
-      if (__propIsEnum$7.call(b, prop))
-        __defNormalProp$7(a, prop, b[prop]);
+    if (__hasOwnProp$8.call(b, prop))
+      __defNormalProp$8(a, prop, b[prop]);
+  if (__getOwnPropSymbols$8)
+    for (var prop of __getOwnPropSymbols$8(b)) {
+      if (__propIsEnum$8.call(b, prop))
+        __defNormalProp$8(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$7 = (a, b) => __defProps$7(a, __getOwnPropDescs$7(b));
-var __objRest$6 = (source, exclude) => {
+var __spreadProps$8 = (a, b) => __defProps$8(a, __getOwnPropDescs$8(b));
+var __objRest$7 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$7.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$8.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$7)
-    for (var prop of __getOwnPropSymbols$7(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$7.call(source, prop))
+  if (source != null && __getOwnPropSymbols$8)
+    for (var prop of __getOwnPropSymbols$8(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$8.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
 };
 const HiddenFileInput = React__default["default"].forwardRef(function InputWrapper(props, ref) {
-  return /* @__PURE__ */ React__default["default"].createElement("input", __spreadProps$7(__spreadValues$7({}, props), {
+  return /* @__PURE__ */ React__default["default"].createElement("input", __spreadProps$8(__spreadValues$8({}, props), {
     ref,
     type: "file",
     style: { display: "none" }
@@ -370,7 +377,7 @@ const FileTrigger = React__default["default"].forwardRef(function FileTriggerWra
     onSelect = () => null,
     children,
     isDisabled = false
-  } = _a, rest = __objRest$6(_a, [
+  } = _a, rest = __objRest$7(_a, [
     "acceptedFileTypes",
     "allowsMultiple",
     "onSelect",
@@ -388,7 +395,7 @@ const FileTrigger = React__default["default"].forwardRef(function FileTriggerWra
       }
       (_a2 = inputRef.current) == null ? void 0 : _a2.click();
     }
-  }, children), /* @__PURE__ */ React__default["default"].createElement(HiddenFileInput, __spreadProps$7(__spreadValues$7({}, domProps), {
+  }, children), /* @__PURE__ */ React__default["default"].createElement(HiddenFileInput, __spreadProps$8(__spreadValues$8({}, domProps), {
     disabled: isDisabled,
     ref: inputRef,
     accept: acceptedFileTypes == null ? void 0 : acceptedFileTypes.toString(),
@@ -460,25 +467,25 @@ var intlMessages$1 = {
   "sv-SE": se$1
 };
 
-var __defProp$6 = Object.defineProperty;
-var __defProps$6 = Object.defineProperties;
-var __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
-var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
-var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$6 = (a, b) => {
+var __defProp$7 = Object.defineProperty;
+var __defProps$7 = Object.defineProperties;
+var __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
+var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
+var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$7 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$6.call(b, prop))
-      __defNormalProp$6(a, prop, b[prop]);
-  if (__getOwnPropSymbols$6)
-    for (var prop of __getOwnPropSymbols$6(b)) {
-      if (__propIsEnum$6.call(b, prop))
-        __defNormalProp$6(a, prop, b[prop]);
+    if (__hasOwnProp$7.call(b, prop))
+      __defNormalProp$7(a, prop, b[prop]);
+  if (__getOwnPropSymbols$7)
+    for (var prop of __getOwnPropSymbols$7(b)) {
+      if (__propIsEnum$7.call(b, prop))
+        __defNormalProp$7(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
+var __spreadProps$7 = (a, b) => __defProps$7(a, __getOwnPropDescs$7(b));
 const FileDropzone = React__default["default"].forwardRef(function DropzoneWrapper(props, forwardedRef) {
   const {
     isDisabled = false,
@@ -495,7 +502,7 @@ const FileDropzone = React__default["default"].forwardRef(function DropzoneWrapp
   const pressableRef = utils$1.useObjectRef(forwardedRef);
   const { hoverProps, isHovered } = interactions.useHover({ isDisabled });
   const { styleProps } = sapphireReact.useSapphireStyleProps(props);
-  const { dropProps, isDropTarget: isDropping } = dnd.useDrop(__spreadProps$6(__spreadValues$6({}, props), {
+  const { dropProps, isDropTarget: isDropping } = dnd.useDrop(__spreadProps$7(__spreadValues$7({}, props), {
     ref: pressableRef,
     hasDropButton: true,
     isDisabled
@@ -530,35 +537,86 @@ const FileDropzone = React__default["default"].forwardRef(function DropzoneWrapp
   }, /* @__PURE__ */ React__default["default"].createElement(interactions.Pressable, {
     ref: pressableRef,
     onPress: onFileSelectOpen
-  }, /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$6(__spreadValues$6({}, utils$1.mergeProps(dropProps, hoverProps, clipboardProps, focusProps, buttonProps)), {
-    style: __spreadValues$6({}, styleProps.style),
-    className: clsx__default["default"](styles__default$1["default"]["sapphire-dropzone"], styles__default$1["default"]["js-focus"], styles__default$1["default"]["js-hover"], {
-      [styles__default$1["default"]["is-hover"]]: isHovered && !isDropping,
-      [styles__default$1["default"]["is-active"]]: isPressed,
-      [styles__default$1["default"]["is-disabled"]]: isDisabled,
-      [styles__default$1["default"]["is-focus"]]: isFocusVisible,
-      [styles__default$1["default"]["sapphire-dropzone--dropping"]]: isDropping,
-      [styles__default$1["default"]["sapphire-dropzone--error"]]: hasError
+  }, /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$7(__spreadValues$7({}, utils$1.mergeProps(dropProps, hoverProps, clipboardProps, focusProps, buttonProps)), {
+    style: __spreadValues$7({}, styleProps.style),
+    className: clsx__default["default"](styles__default$2["default"]["sapphire-dropzone"], styles__default$2["default"]["js-focus"], styles__default$2["default"]["js-hover"], {
+      [styles__default$2["default"]["is-hover"]]: isHovered && !isDropping,
+      [styles__default$2["default"]["is-active"]]: isPressed,
+      [styles__default$2["default"]["is-disabled"]]: isDisabled,
+      [styles__default$2["default"]["is-focus"]]: isFocusVisible,
+      [styles__default$2["default"]["sapphire-dropzone--dropping"]]: isDropping,
+      [styles__default$2["default"]["sapphire-dropzone--error"]]: hasError
     }, styleProps.className),
     "aria-label": ariaLabel,
     "aria-invalid": hasError,
     "aria-describedby": paragraphId
   }), /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: clsx__default["default"](styles__default$1["default"]["sapphire-dropzone__content"])
+    className: clsx__default["default"](styles__default$2["default"]["sapphire-dropzone__content"])
   }, /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: clsx__default["default"](styles__default$1["default"]["sapphire-dropzone__icon"])
+    className: clsx__default["default"](styles__default$2["default"]["sapphire-dropzone__icon"])
   }, /* @__PURE__ */ React__default["default"].createElement(sapphireReact.Icon, null, /* @__PURE__ */ React__default["default"].createElement(react.Upload, null))), /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: clsx__default["default"](styles__default$1["default"]["sapphire-dropzone__heading"])
+    className: clsx__default["default"](styles__default$2["default"]["sapphire-dropzone__heading"])
   }, /* @__PURE__ */ React__default["default"].createElement(sapphireReact.Typography.Heading, {
     level: 6
   }, isDropping ? format("dropzone-heading-dropping") : format("dropzone-heading-default"))), /* @__PURE__ */ React__default["default"].createElement("div", {
     id: paragraphId,
-    className: clsx__default["default"](styles__default$1["default"]["sapphire-dropzone__paragraph"])
+    className: clsx__default["default"](styles__default$2["default"]["sapphire-dropzone__paragraph"])
   }, /* @__PURE__ */ React__default["default"].createElement(sapphireReact.Typography.Body, {
     level: 2
   }, renderInstruction(isDropping)))))));
 });
 
+var __defProp$6 = Object.defineProperty;
+var __defProps$6 = Object.defineProperties;
+var __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
+var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
+var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$6 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$6.call(b, prop))
+      __defNormalProp$6(a, prop, b[prop]);
+  if (__getOwnPropSymbols$6)
+    for (var prop of __getOwnPropSymbols$6(b)) {
+      if (__propIsEnum$6.call(b, prop))
+        __defNormalProp$6(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
+var __objRest$6 = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp$6.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols$6)
+    for (var prop of __getOwnPropSymbols$6(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$6.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const Flag = React__default["default"].forwardRef(function Flag2(_a, ref) {
+  var _b = _a, { size = "lg", rounded, "aria-label": ariaLabel } = _b, props = __objRest$6(_b, ["size", "rounded", "aria-label"]);
+  sapphireReact.useThemeCheck();
+  const { styleProps } = sapphireReact.useSapphireStyleProps(props);
+  return React__default["default"].cloneElement(utils$2.getWrappedElement(props.children), __spreadProps$6(__spreadValues$6({
+    ref,
+    role: "img"
+  }, ariaLabel ? { "aria-label": ariaLabel } : { "aria-hidden": true }), {
+    className: clsx__default["default"](styles__default$3["default"]["sapphire-flag"], styleProps.className, {
+      [styles__default$3["default"]["sapphire-flag--xs"]]: size === "xs",
+      [styles__default$3["default"]["sapphire-flag--sm"]]: size === "sm",
+      [styles__default$3["default"]["sapphire-flag--md"]]: size === "md",
+      [styles__default$3["default"]["sapphire-flag--lg"]]: size === "lg",
+      [styles__default$3["default"]["sapphire-flag--xl"]]: size === "xl",
+      [styles__default$3["default"]["sapphire-flag--rounded"]]: rounded
+    }),
+    style: styleProps.style
+  }));
+});
+
 var increment$6 = "øge";
 var decrement$6 = "formindske";
 var da = {
@@ -920,7 +978,7 @@ function Tag(props) {
   const { hoverProps, isHovered } = interactions.useHover({ isDisabled });
   const hasAction = otherProps.hasAction;
   return /* @__PURE__ */ React__default["default"].createElement(focus.FocusRing, {
-    focusRingClass: styles__default$2["default"]["is-focus"]
+    focusRingClass: styles__default$4["default"]["is-focus"]
   }, /* @__PURE__ */ React__default["default"].createElement("div", __spreadValues$2(__spreadProps$2(__spreadValues$2({
     ref
   }, utils$1.mergeProps({
@@ -932,28 +990,28 @@ function Tag(props) {
       }
     }
   }, rowProps, hoverProps)), {
-    className: clsx__default["default"](styles__default$2["default"]["sapphire-tag"], styles__default$2["default"]["js-focus"], styles__default$2["default"]["js-hover"], {
-      [styles__default$2["default"]["sapphire-tag--actionable"]]: hasAction,
-      [styles__default$2["default"]["is-active"]]: hasAction && isPressed,
-      [styles__default$2["default"]["is-hover"]]: hasAction && isHovered,
-      [styles__default$2["default"]["is-disabled"]]: isDisabled
+    className: clsx__default["default"](styles__default$4["default"]["sapphire-tag"], styles__default$4["default"]["js-focus"], styles__default$4["default"]["js-hover"], {
+      [styles__default$4["default"]["sapphire-tag--actionable"]]: hasAction,
+      [styles__default$4["default"]["is-active"]]: hasAction && isPressed,
+      [styles__default$4["default"]["is-hover"]]: hasAction && isHovered,
+      [styles__default$4["default"]["is-disabled"]]: isDisabled
     })
   }), hasError ? { "aria-invalid": true } : {}), /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$2(__spreadValues$2({}, gridCellProps), {
-    className: styles__default$2["default"]["sapphire-tag__content"]
+    className: styles__default$4["default"]["sapphire-tag__content"]
   }), hasError && /* @__PURE__ */ React__default["default"].createElement(IconError, null), item.rendered, allowsRemoving && /* @__PURE__ */ React__default["default"].createElement(RemoveButton, __spreadValues$2({}, removeButtonProps)))));
 }
 function RemoveButton(removeButtonProps) {
   const buttonRef = React.useRef(null);
   const { buttonProps } = button.useButton(removeButtonProps, buttonRef);
   return /* @__PURE__ */ React__default["default"].createElement("button", __spreadProps$2(__spreadValues$2({}, buttonProps), {
-    className: clsx__default["default"](styles__default$2["default"]["sapphire-tag__button"], styles__default$2["default"]["js-focus"])
+    className: clsx__default["default"](styles__default$4["default"]["sapphire-tag__button"], styles__default$4["default"]["js-focus"])
   }), /* @__PURE__ */ React__default["default"].createElement(sapphireReact.Icon, {
     size: "sm"
   }, /* @__PURE__ */ React__default["default"].createElement(react.Close, null)));
 }
 const IconError = () => {
   return /* @__PURE__ */ React__default["default"].createElement("span", {
-    className: clsx__default["default"](styles__default$2["default"]["sapphire-tag__error-icon"])
+    className: clsx__default["default"](styles__default$4["default"]["sapphire-tag__error-icon"])
   }, /* @__PURE__ */ React__default["default"].createElement(sapphireReact.Icon, {
     size: "sm"
   }, /* @__PURE__ */ React__default["default"].createElement(react.AlertCircle, null)));
@@ -1017,7 +1075,7 @@ function TagGroup(props) {
     contextualHelp
   }), labelText)), /* @__PURE__ */ React__default["default"].createElement(sapphireReact.Field.Control, null, /* @__PURE__ */ React__default["default"].createElement("div", __spreadProps$1(__spreadValues$1({}, gridProps), {
     ref,
-    className: styles__default$2["default"]["sapphire-tag-group"]
+    className: styles__default$4["default"]["sapphire-tag-group"]
   }), [...state.collection].map((item) => /* @__PURE__ */ React__default["default"].createElement(Tag, {
     key: item.key,
     item,
@@ -1083,8 +1141,8 @@ function LabeledValue(_a) {
     contextualHelp,
     size
   }, label$1)), /* @__PURE__ */ React__default["default"].createElement(sapphireReact.Field.Control, null, /* @__PURE__ */ React__default["default"].createElement("div", {
-    className: clsx__default["default"](styles__default$3["default"]["sapphire-labeled-value"], {
-      [styles__default$3["default"]["sapphire-labeled-value--md"]]: size === "md"
+    className: clsx__default["default"](styles__default$5["default"]["sapphire-labeled-value"], {
+      [styles__default$5["default"]["sapphire-labeled-value--md"]]: size === "md"
     })
   }, children)));
 }
@@ -1098,6 +1156,7 @@ exports.AccordionContext = AccordionContext;
 exports.FileDropzone = FileDropzone;
 exports.FileTrigger = FileTrigger;
 exports.FilterDropdown = FilterDropdown;
+exports.Flag = Flag;
 exports.LabeledValue = LabeledValue;
 exports.NumberField = NumberField;
 exports.TagGroup = TagGroup;