sit-onyx 1.6.0-dev-20260113131929 → 1.6.0-dev-20260114073557

package/dist/index.esm-bundler.js

@@ -49,7 +49,7 @@ const useVModel = (options) => {
 };
 const ACCORDION_INJECTION_KEY = /* @__PURE__ */ Symbol();
 const ACCORDION_TYPES = ["default", "nested-large", "nested-small", "card"];
-const _sfc_main$1S = /* @__PURE__ */ defineComponent({
+const _sfc_main$1T = /* @__PURE__ */ defineComponent({
   __name: "OnyxAccordion",
   props: {
     density: { type: null, required: false },
@@ -119,7 +119,7 @@ const _export_sfc = (sfc, props) => {
   }
   return target;
 };
-function _sfc_render$1S(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1T(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     {
@@ -137,7 +137,7 @@ function _sfc_render$1S(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   );
 }
-const OnyxAccordion = /* @__PURE__ */ _export_sfc(_sfc_main$1S, [["render", _sfc_render$1S], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAccordion/OnyxAccordion.vue"]]);
+const OnyxAccordion = /* @__PURE__ */ _export_sfc(_sfc_main$1T, [["render", _sfc_render$1T], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAccordion/OnyxAccordion.vue"]]);
 const ONYX_BREAKPOINTS = {
   "2xs": 320,
   xs: 577,
@@ -150,7 +150,7 @@ const ONYX_BREAKPOINTS = {
   md: ONYX_BREAKPOINTS.lg - 1,
   lg: ONYX_BREAKPOINTS.xl - 1
 });
-const _sfc_main$1R = /* @__PURE__ */ defineComponent({
+const _sfc_main$1S = /* @__PURE__ */ defineComponent({
   __name: "OnyxIcon",
   props: {
     size: { type: null, required: false },
@@ -166,8 +166,8 @@ const _sfc_main$1R = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1o = ["innerHTML"];
-function _sfc_render$1R(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$1p = ["innerHTML"];
+function _sfc_render$1S(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("figure", {
     class: normalizeClass({
       "onyx-component": true,
@@ -178,9 +178,9 @@ function _sfc_render$1R(_ctx, _cache, $props, $setup, $data, $options) {
     }),
     "aria-hidden": "true",
     innerHTML: $setup.props.icon
-  }, null, 10, _hoisted_1$1o);
+  }, null, 10, _hoisted_1$1p);
 }
-const OnyxIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1R, [["render", _sfc_render$1R], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxIcon/OnyxIcon.vue"]]);
+const OnyxIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1S, [["render", _sfc_render$1S], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxIcon/OnyxIcon.vue"]]);
 const isAlreadyTriggered = /* @__PURE__ */ new Set();
 const IDLE_TIMEOUT = 200;
 const onIdleCallback = globalThis.window && "requestIdleCallback" in globalThis.window ? globalThis.window.requestIdleCallback : (cb, _) => setTimeout(cb, 0);
@@ -196,7 +196,7 @@ const requestAnimationSync = (animationName) => {
   isAlreadyTriggered.add(animationName);
   onIdleCallback(() => syncAnimations(animationName), { timeout: IDLE_TIMEOUT });
 };
-const _sfc_main$1Q = /* @__PURE__ */ defineComponent({
+const _sfc_main$1R = /* @__PURE__ */ defineComponent({
   __name: "OnyxSkeleton",
   setup(__props, { expose: __expose }) {
     __expose();
@@ -206,15 +206,15 @@ const _sfc_main$1Q = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1n = {
+const _hoisted_1$1o = {
   "aria-hidden": "true",
   class: "onyx-component onyx-skeleton"
 };
-function _sfc_render$1Q(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("figure", _hoisted_1$1n);
+function _sfc_render$1R(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("figure", _hoisted_1$1o);
 }
-const OnyxSkeleton = /* @__PURE__ */ _export_sfc(_sfc_main$1Q, [["render", _sfc_render$1Q], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSkeleton/OnyxSkeleton.vue"]]);
-const _sfc_main$1P = /* @__PURE__ */ defineComponent({
+const OnyxSkeleton = /* @__PURE__ */ _export_sfc(_sfc_main$1R, [["render", _sfc_render$1R], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSkeleton/OnyxSkeleton.vue"]]);
+const _sfc_main$1Q = /* @__PURE__ */ defineComponent({
   __name: "OnyxAccordionItem",
   props: {
     density: { type: null, required: false },
@@ -251,11 +251,11 @@ const _sfc_main$1P = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1m = ["open"];
+const _hoisted_1$1n = ["open"];
 const _hoisted_2$Y = ["id", "tabindex", "aria-expanded", "aria-controls", "aria-disabled"];
 const _hoisted_3$D = { class: "onyx-accordion-item__header-content" };
 const _hoisted_4$q = ["id", "aria-labelledby"];
-function _sfc_render$1P(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1Q(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.showSkeleton ? (openBlock(), createBlock(resolveDynamicComponent($setup.type === "card" ? $setup.OnyxSkeleton : "div"), {
     key: 0,
     class: normalizeClass([
@@ -307,9 +307,9 @@ function _sfc_render$1P(_ctx, _cache, $props, $setup, $data, $options) {
     }, [
       renderSlot(_ctx.$slots, "default")
     ], 8, _hoisted_4$q)
-  ], 10, _hoisted_1$1m));
+  ], 10, _hoisted_1$1n));
 }
-const OnyxAccordionItem = /* @__PURE__ */ _export_sfc(_sfc_main$1P, [["render", _sfc_render$1P], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAccordionItem/OnyxAccordionItem.vue"]]);
+const OnyxAccordionItem = /* @__PURE__ */ _export_sfc(_sfc_main$1Q, [["render", _sfc_render$1Q], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAccordionItem/OnyxAccordionItem.vue"]]);
 const DATETIME_FORMATS = {
   date: { dateStyle: "medium" },
   "datetime-local": { dateStyle: "medium", timeStyle: "short" },
@@ -354,7 +354,7 @@ const languageSelect = { "label": "Language", "headline": "Change language", "su
 const resizeHandle = { "label": "Drag to change width" };
 const fileUpload = { "select": "Select", "clickToUpload": "Click to select", "orDragAndDrop": "or drag and drop file", "maxFileSize": "Maximum file size", "inTotal": "in total", "maxFileCount": "Maximum {n} files to select in total", "allowedFileTypes": "Allowed file types: {types}", "hideFilesButton": "Hide all files", "revealFilesButton": "Show all files", "removeFile": "Remove file", "requiredError": "You need to upload at least one file", "status": { "fileTypeError": "File with extension '.{extension}' is invalid", "fileSizeError": "File exceeds maximum allowed size of {size}", "maxFileSizeError": "Total size of all files exceeds maximum allowed of {size}", "maxCountError": "Number of files exceeds maximum allowed of {count}" } };
 const globalFAB = { "label": "Global actions" };
-const calendar = { "todayButton": { "label": "Today", "tooltip": "Jump to today" }, "calendarWeek": "CW", "calendarWeekButtonLabel": "Select calendar week {weekNumber}", "previousMonthButton": "Previous month", "nextMonthButton": "Next month" };
+const calendar = { "todayButton": { "label": "Today", "tooltip": "Jump to today" }, "calendarWeek": "CW", "calendarWeekButtonLabel": "Select calendar week {weekNumber}", "previousMonthButton": "Previous month", "nextMonthButton": "Next month", "monthYearPicker": "Month and year picker" };
 const flyoutMenu = { "moreActions": "More actions", "toggleActions": { "click": "Click to toggle action visibility", "hover": "Hover/Focus to toggle action visibility" } };
 const slider = { "decreaseValueBy": "Decrease value by {n}", "increaseValueBy": "Increase value by {n}", "changeValue": "Change value", "changeStartValue": "Change start value", "changeEndValue": "Change end value" };
 const codeTabs = { "label": "Code snippets", "copySnippet": "Copy code", "copied": "Copied!", "failed": "Failed!", "tabLabel": "Code" };
@@ -494,16 +494,18 @@ function createElRef() {
   const elementRef = shallowRef(null);
   return computed({
     set: (ref2) => {
-      const element = Array.isArray(ref2) ? ref2.at(0) : ref2;
-      if (element != null && "$el" in element) {
-        elementRef.value = element.$el;
-      } else {
-        elementRef.value = element ?? null;
-      }
+      const element = Array.isArray(ref2) ? ref2[0] : ref2;
+      elementRef.value = getNativeElement(element);
     },
     get: () => elementRef.value
   });
 }
+const getNativeElement = (element) => {
+  if (element && typeof element === "object" && "$el" in element) {
+    return element.$el;
+  }
+  return element ?? null;
+};
 function getISOWeekNumber(date) {
   const d = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()));
   const dayNum = d.getUTCDay() || 7;
@@ -880,7 +882,10 @@ const useOutsideClick = ({
     if (!target) return true;
     const raw = toValue(inside);
     const elements = Array.isArray(raw) ? raw : [raw];
-    return !elements.some((element) => element?.contains(target));
+    return !elements.some((element) => {
+      const nativeEl = getNativeElement(element);
+      return nativeEl?.contains(target);
+    });
   };
   const clickListener = (event) => {
     if (isOutsideClick(event.target)) onOutsideClick(event);
@@ -1898,7 +1903,7 @@ const createTooltip = createBuilder(({ debounce: debounce2, isVisible }) => {
     }
   };
 });
-const _sfc_main$1O = /* @__PURE__ */ defineComponent({
+const _sfc_main$1P = /* @__PURE__ */ defineComponent({
   __name: "OnyxBasicDialog",
   props: {
     density: { type: null, required: false },
@@ -1960,12 +1965,12 @@ const _sfc_main$1O = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1l = ["aria-modal", "aria-label", "role"];
+const _hoisted_1$1m = ["aria-modal", "aria-label", "role"];
 const _hoisted_2$X = {
   ref: "contentRef",
   class: "onyx-basic-dialog__content"
 };
-function _sfc_render$1O(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1P(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.props.open ? (openBlock(), createElementBlock("dialog", {
     key: 0,
     ref: "dialogRef",
@@ -1992,9 +1997,9 @@ function _sfc_render$1O(_ctx, _cache, $props, $setup, $data, $options) {
       512
       /* NEED_PATCH */
     )
-  ], 42, _hoisted_1$1l)) : createCommentVNode("v-if", true);
+  ], 42, _hoisted_1$1m)) : createCommentVNode("v-if", true);
 }
-const OnyxBasicDialog = /* @__PURE__ */ _export_sfc(_sfc_main$1O, [["render", _sfc_render$1O], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBasicDialog/OnyxBasicDialog.vue"]]);
+const OnyxBasicDialog = /* @__PURE__ */ _export_sfc(_sfc_main$1P, [["render", _sfc_render$1P], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBasicDialog/OnyxBasicDialog.vue"]]);
 const normalizedIncludes = (haystack, needle) => {
   const haystackNormalized = removeDiacritics(haystack.toLowerCase());
   const needleNormalized = removeDiacritics(needle.toLowerCase());
@@ -2076,7 +2081,7 @@ const normalizeHref = (href) => {
   return value.replace(/\/+$/, "");
 };
 const ROUTER_INJECTION_KEY = /* @__PURE__ */ Symbol();
-const _sfc_main$1N = /* @__PURE__ */ defineComponent({
+const _sfc_main$1O = /* @__PURE__ */ defineComponent({
   __name: "OnyxVisuallyHidden",
   props: {
     is: { type: String, required: false, default: "span" }
@@ -2089,7 +2094,7 @@ const _sfc_main$1N = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1N(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1O(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock(resolveDynamicComponent($setup.props.is), { class: "onyx-component onyx-visually-hidden" }, {
     default: withCtx(() => [
       renderSlot(_ctx.$slots, "default")
@@ -2098,8 +2103,8 @@ function _sfc_render$1N(_ctx, _cache, $props, $setup, $data, $options) {
     /* FORWARDED */
   });
 }
-const OnyxVisuallyHidden = /* @__PURE__ */ _export_sfc(_sfc_main$1N, [["render", _sfc_render$1N], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxVisuallyHidden/OnyxVisuallyHidden.vue"]]);
-const _sfc_main$1M = /* @__PURE__ */ defineComponent({
+const OnyxVisuallyHidden = /* @__PURE__ */ _export_sfc(_sfc_main$1O, [["render", _sfc_render$1O], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxVisuallyHidden/OnyxVisuallyHidden.vue"]]);
+const _sfc_main$1N = /* @__PURE__ */ defineComponent({
   __name: "OnyxRouterLink",
   props: {
     href: { type: String, required: true },
@@ -2115,8 +2120,8 @@ const _sfc_main$1M = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1k = ["href", "target", "rel"];
-function _sfc_render$1M(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$1l = ["href", "target", "rel"];
+function _sfc_render$1N(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("a", {
     class: normalizeClass([
       "onyx-component",
@@ -2140,10 +2145,10 @@ function _sfc_render$1M(_ctx, _cache, $props, $setup, $data, $options) {
       _: 1
       /* STABLE */
     })) : createCommentVNode("v-if", true)
-  ], 10, _hoisted_1$1k);
+  ], 10, _hoisted_1$1l);
 }
-const OnyxRouterLink = /* @__PURE__ */ _export_sfc(_sfc_main$1M, [["render", _sfc_render$1M], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxRouterLink/OnyxRouterLink.vue"]]);
-const _sfc_main$1L = /* @__PURE__ */ defineComponent({
+const OnyxRouterLink = /* @__PURE__ */ _export_sfc(_sfc_main$1N, [["render", _sfc_render$1N], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxRouterLink/OnyxRouterLink.vue"]]);
+const _sfc_main$1M = /* @__PURE__ */ defineComponent({
   __name: "OnyxHeadline",
   props: {
     is: { type: null, required: true },
@@ -2168,7 +2173,7 @@ const _sfc_main$1L = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1L(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1M(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createBlock($setup["OnyxSkeleton"], {
     key: 0,
     class: normalizeClass(["onyx-headline-skeleton", `onyx-headline-skeleton--${$setup.showAs}`])
@@ -2208,7 +2213,7 @@ function _sfc_render$1L(_ctx, _cache, $props, $setup, $data, $options) {
     /* FORWARDED */
   }, 8, ["id", "class"]));
 }
-const OnyxHeadline = /* @__PURE__ */ _export_sfc(_sfc_main$1L, [["render", _sfc_render$1L], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxHeadline/OnyxHeadline.vue"]]);
+const OnyxHeadline = /* @__PURE__ */ _export_sfc(_sfc_main$1M, [["render", _sfc_render$1M], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxHeadline/OnyxHeadline.vue"]]);
 const useAutofocus = (inputRef, props) => {
   if (!props.autofocus) {
     return;
@@ -2259,7 +2264,7 @@ const useFormContext = (props) => {
     DEFAULT_FORM_INJECTION_CONTEXT
   )(toRef(props));
 };
-const _sfc_main$1K = /* @__PURE__ */ defineComponent({
+const _sfc_main$1L = /* @__PURE__ */ defineComponent({
   __name: "ButtonOrLinkLayout",
   props: {
     disabled: { type: [Boolean, Symbol], required: false },
@@ -2282,8 +2287,8 @@ const _sfc_main$1K = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1j = ["disabled", "type", "autofocus"];
-function _sfc_render$1K(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$1k = ["disabled", "type", "autofocus"];
+function _sfc_render$1L(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.linkProps ? (openBlock(), createBlock(
     $setup["OnyxRouterLink"],
     normalizeProps(mergeProps({ key: 0 }, $setup.linkProps)),
@@ -2304,10 +2309,10 @@ function _sfc_render$1K(_ctx, _cache, $props, $setup, $data, $options) {
     autofocus: $setup.props.autofocus
   }, [
     renderSlot(_ctx.$slots, "default")
-  ], 8, _hoisted_1$1j));
+  ], 8, _hoisted_1$1k));
 }
-const ButtonOrLinkLayout = /* @__PURE__ */ _export_sfc(_sfc_main$1K, [["render", _sfc_render$1K], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxButton/ButtonOrLinkLayout.vue"]]);
-const _sfc_main$1J = /* @__PURE__ */ defineComponent({
+const ButtonOrLinkLayout = /* @__PURE__ */ _export_sfc(_sfc_main$1L, [["render", _sfc_render$1L], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxButton/ButtonOrLinkLayout.vue"]]);
+const _sfc_main$1K = /* @__PURE__ */ defineComponent({
   __name: "OnyxSystemButton",
   props: {
     disabled: { type: [Boolean, Symbol], required: false, default: FORM_INJECTED_SYMBOL },
@@ -2328,11 +2333,11 @@ const _sfc_main$1J = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1i = {
+const _hoisted_1$1j = {
   key: 1,
   class: "onyx-truncation-ellipsis"
 };
-function _sfc_render$1J(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1K(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createBlock($setup["OnyxSkeleton"], {
     key: 0,
     class: normalizeClass(["onyx-system-button-skeleton", $setup.props.icon ? "" : "onyx-system-button-skeleton--text"])
@@ -2348,7 +2353,7 @@ function _sfc_render$1J(_ctx, _cache, $props, $setup, $data, $options) {
         icon: $setup.props.icon
       }, null, 8, ["icon"])) : (openBlock(), createElementBlock(
         "span",
-        _hoisted_1$1i,
+        _hoisted_1$1j,
         toDisplayString($setup.props.label),
         1
         /* TEXT */
@@ -2358,8 +2363,8 @@ function _sfc_render$1J(_ctx, _cache, $props, $setup, $data, $options) {
     /* STABLE */
   }, 16, ["class", "aria-label", "title"]));
 }
-const OnyxSystemButton = /* @__PURE__ */ _export_sfc(_sfc_main$1J, [["render", _sfc_render$1J], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSystemButton/OnyxSystemButton.vue"]]);
-const _sfc_main$1I = /* @__PURE__ */ defineComponent({
+const OnyxSystemButton = /* @__PURE__ */ _export_sfc(_sfc_main$1K, [["render", _sfc_render$1K], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSystemButton/OnyxSystemButton.vue"]]);
+const _sfc_main$1J = /* @__PURE__ */ defineComponent({
   __name: "OnyxAlertModal",
   props: {
     density: { type: null, required: false },
@@ -2384,11 +2389,11 @@ const _sfc_main$1I = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1h = { class: "onyx-alert-modal__content" };
+const _hoisted_1$1i = { class: "onyx-alert-modal__content" };
 const _hoisted_2$W = { class: "onyx-alert-modal__headline" };
 const _hoisted_3$C = ["id"];
 const _hoisted_4$p = { class: "onyx-alert-modal__actions" };
-function _sfc_render$1I(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1J(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock($setup["OnyxBasicDialog"], mergeProps({
     class: ["onyx-alert-modal", $setup.densityClass]
   }, $setup.dialogProps, {
@@ -2398,7 +2403,7 @@ function _sfc_render$1I(_ctx, _cache, $props, $setup, $data, $options) {
     "onUpdate:open": _cache[1] || (_cache[1] = ($event) => $setup.emit("update:open", $event))
   }), {
     default: withCtx(() => [
-      createElementVNode("div", _hoisted_1$1h, [
+      createElementVNode("div", _hoisted_1$1i, [
         $setup.props.icon ? (openBlock(), createBlock(
           $setup["OnyxIcon"],
           mergeProps({
@@ -2449,7 +2454,7 @@ function _sfc_render$1I(_ctx, _cache, $props, $setup, $data, $options) {
     /* FORWARDED */
   }, 16, ["class", "aria-describedby"]);
 }
-const OnyxAlertModal = /* @__PURE__ */ _export_sfc(_sfc_main$1I, [["render", _sfc_render$1I], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAlertModal/OnyxAlertModal.vue"]]);
+const OnyxAlertModal = /* @__PURE__ */ _export_sfc(_sfc_main$1J, [["render", _sfc_render$1J], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAlertModal/OnyxAlertModal.vue"]]);
 const useRootAttrs = () => {
   const attrs = useAttrs();
   const rootAttrs = computed(
@@ -2531,7 +2536,7 @@ const mergeVueProps = (...args) => args.reduce((prev, curr) => {
   merged.ref = mergedRef;
   return merged;
 }, {});
-const _sfc_main$1H = /* @__PURE__ */ defineComponent({
+const _sfc_main$1I = /* @__PURE__ */ defineComponent({
   __name: "OnyxFABButton",
   props: {
     density: { type: null, required: false },
@@ -2551,11 +2556,11 @@ const _sfc_main$1H = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1g = {
+const _hoisted_1$1h = {
   key: 1,
   class: "onyx-fab-button__label"
 };
-function _sfc_render$1H(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1I(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createBlock($setup["OnyxSkeleton"], {
     key: 0,
     class: normalizeClass(["onyx-fab-button-skeleton", $setup.densityClass])
@@ -2573,7 +2578,7 @@ function _sfc_render$1H(_ctx, _cache, $props, $setup, $data, $options) {
       }, null, 8, ["icon"])) : createCommentVNode("v-if", true),
       !$setup.props.hideLabel ? (openBlock(), createElementBlock(
         "span",
-        _hoisted_1$1g,
+        _hoisted_1$1h,
         toDisplayString($setup.props.label),
         1
         /* TEXT */
@@ -2583,7 +2588,7 @@ function _sfc_render$1H(_ctx, _cache, $props, $setup, $data, $options) {
     /* STABLE */
   }, 8, ["class", "title", "aria-label", "link"]));
 }
-const OnyxFABButton = /* @__PURE__ */ _export_sfc(_sfc_main$1H, [["render", _sfc_render$1H], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxFABButton/OnyxFABButton.vue"]]);
+const OnyxFABButton = /* @__PURE__ */ _export_sfc(_sfc_main$1I, [["render", _sfc_render$1I], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxFABButton/OnyxFABButton.vue"]]);
 const useResizeObserver = (target, options) => {
   const box = options?.box ?? "content-box";
   const width = ref(0);
@@ -2895,7 +2900,7 @@ function useSticky(options) {
   });
   return { stickyStyles, scrolledOut, isSticky, checkVisibilityOnScroll };
 }
-const _sfc_main$1G = /* @__PURE__ */ defineComponent({
+const _sfc_main$1H = /* @__PURE__ */ defineComponent({
   __name: "OnyxBasicPopover",
   props: {
     label: { type: String, required: true },
@@ -3053,8 +3058,8 @@ const _sfc_main$1G = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1f = ["role", "aria-label"];
-function _sfc_render$1G(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$1g = ["role", "aria-label"];
+function _sfc_render$1H(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     {
@@ -3073,14 +3078,14 @@ function _sfc_render$1G(_ctx, _cache, $props, $setup, $data, $options) {
         style: normalizeStyle(!$setup.isSticky ? $setup.popoverStyles : $setup.stickyStyles)
       }, [
         renderSlot(_ctx.$slots, "content")
-      ], 14, _hoisted_1$1f)
+      ], 14, _hoisted_1$1g)
     ],
     4
     /* STYLE */
   );
 }
-const OnyxBasicPopover = /* @__PURE__ */ _export_sfc(_sfc_main$1G, [["render", _sfc_render$1G], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBasicPopover/OnyxBasicPopover.vue"]]);
-const _sfc_main$1F = /* @__PURE__ */ defineComponent({
+const OnyxBasicPopover = /* @__PURE__ */ _export_sfc(_sfc_main$1H, [["render", _sfc_render$1H], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBasicPopover/OnyxBasicPopover.vue"]]);
+const _sfc_main$1G = /* @__PURE__ */ defineComponent({
   __name: "OnyxFlyoutMenu",
   props: {
     alignment: { type: String, required: false, default: "auto" },
@@ -3122,9 +3127,9 @@ const _sfc_main$1F = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1e = { class: "onyx-flyout-menu__list-header" };
+const _hoisted_1$1f = { class: "onyx-flyout-menu__list-header" };
 const _hoisted_2$V = { class: "onyx-flyout-menu__list-footer" };
-function _sfc_render$1F(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1G(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock($setup["OnyxBasicPopover"], mergeProps($setup.mergeVueProps($setup.root, { ref: $setup.popover }), {
     class: "onyx-component onyx-flyout-menu",
     open: $setup.isExpanded,
@@ -3133,7 +3138,7 @@ function _sfc_render$1F(_ctx, _cache, $props, $setup, $data, $options) {
     disabled: $props.disabled
   }), createSlots({
     content: withCtx(() => [
-      createElementVNode("div", _hoisted_1$1e, [
+      createElementVNode("div", _hoisted_1$1f, [
         renderSlot(_ctx.$slots, "header")
       ]),
       $setup.slots.options ? (openBlock(), createElementBlock(
@@ -3166,8 +3171,8 @@ function _sfc_render$1F(_ctx, _cache, $props, $setup, $data, $options) {
     } : void 0
   ]), 1040, ["open", "label", "alignment", "disabled"]);
 }
-const OnyxFlyoutMenu = /* @__PURE__ */ _export_sfc(_sfc_main$1F, [["render", _sfc_render$1F], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxNavBar/modules/OnyxFlyoutMenu/OnyxFlyoutMenu.vue"]]);
-const _sfc_main$1E = /* @__PURE__ */ defineComponent({
+const OnyxFlyoutMenu = /* @__PURE__ */ _export_sfc(_sfc_main$1G, [["render", _sfc_render$1G], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxNavBar/modules/OnyxFlyoutMenu/OnyxFlyoutMenu.vue"]]);
+const _sfc_main$1F = /* @__PURE__ */ defineComponent({
   __name: "OnyxFAB",
   props: {
     density: { type: null, required: false },
@@ -3206,7 +3211,7 @@ const _sfc_main$1E = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1E(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1F(_ctx, _cache, $props, $setup, $data, $options) {
   return !$setup.hasOptions || $setup.skeleton ? (openBlock(), createBlock($setup["OnyxFABButton"], mergeProps({
     key: 0,
     class: ["onyx-fab", `onyx-fab--${$setup.props.alignment}`]
@@ -3236,8 +3241,8 @@ function _sfc_render$1E(_ctx, _cache, $props, $setup, $data, $options) {
     /* FORWARDED */
   }, 8, ["open", "label", "class", "alignment"]));
 }
-const OnyxFAB = /* @__PURE__ */ _export_sfc(_sfc_main$1E, [["render", _sfc_render$1E], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxFAB/OnyxFAB.vue"]]);
-const _sfc_main$1D = /* @__PURE__ */ defineComponent({
+const OnyxFAB = /* @__PURE__ */ _export_sfc(_sfc_main$1F, [["render", _sfc_render$1F], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxFAB/OnyxFAB.vue"]]);
+const _sfc_main$1E = /* @__PURE__ */ defineComponent({
   __name: "OnyxFABItem",
   props: {
     density: { type: null, required: false },
@@ -3260,7 +3265,7 @@ const _sfc_main$1D = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1D(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1E(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "li",
     mergeProps({
@@ -3275,7 +3280,7 @@ function _sfc_render$1D(_ctx, _cache, $props, $setup, $data, $options) {
     /* FULL_PROPS */
   );
 }
-const OnyxFABItem = /* @__PURE__ */ _export_sfc(_sfc_main$1D, [["render", _sfc_render$1D], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxFABItem/OnyxFABItem.vue"]]);
+const OnyxFABItem = /* @__PURE__ */ _export_sfc(_sfc_main$1E, [["render", _sfc_render$1E], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxFABItem/OnyxFABItem.vue"]]);
 const GLOBAL_FAB_PROVIDER_INJECTION_KEY = /* @__PURE__ */ Symbol();
 const createGlobalFABProvider = () => {
   const items = shallowRef([]);
@@ -3312,7 +3317,7 @@ const useGlobalFAB = () => {
   );
   return globalFABProvider;
 };
-const _sfc_main$1C = /* @__PURE__ */ defineComponent({
+const _sfc_main$1D = /* @__PURE__ */ defineComponent({
   __name: "OnyxGlobalFAB",
   setup(__props, { expose: __expose }) {
     __expose();
@@ -3326,7 +3331,7 @@ const _sfc_main$1C = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1C(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1D(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.globalFAB.items.value.length === 1 ? (openBlock(), createBlock(
     $setup["OnyxFAB"],
     normalizeProps(mergeProps({ key: 0 }, $setup.globalFAB.items.value[0].value)),
@@ -3361,14 +3366,14 @@ function _sfc_render$1C(_ctx, _cache, $props, $setup, $data, $options) {
     /* STABLE */
   }, 8, ["label", "alignment"])) : createCommentVNode("v-if", true);
 }
-const OnyxGlobalFAB = /* @__PURE__ */ _export_sfc(_sfc_main$1C, [["render", _sfc_render$1C], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxGlobalFAB/OnyxGlobalFAB.vue"]]);
-const _sfc_main$1B = {};
-const _hoisted_1$1d = {
+const OnyxGlobalFAB = /* @__PURE__ */ _export_sfc(_sfc_main$1D, [["render", _sfc_render$1D], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxGlobalFAB/OnyxGlobalFAB.vue"]]);
+const _sfc_main$1C = {};
+const _hoisted_1$1e = {
   class: "onyx-component onyx-circle-spinner",
   viewBox: "0 0 50 50"
 };
-function _sfc_render$1B(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$1d, [..._cache[0] || (_cache[0] = [
+function _sfc_render$1C(_ctx, _cache) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1e, [..._cache[0] || (_cache[0] = [
     createElementVNode(
       "circle",
       {
@@ -3383,11 +3388,11 @@ function _sfc_render$1B(_ctx, _cache) {
     )
   ])]);
 }
-const OnyxCircleSpinner = /* @__PURE__ */ _export_sfc(_sfc_main$1B, [["render", _sfc_render$1B], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxLoadingIndicator/OnyxCircleSpinner.vue"]]);
-const _sfc_main$1A = {};
-const _hoisted_1$1c = { class: "onyx-component onyx-loading-dots" };
-function _sfc_render$1A(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1$1c, [..._cache[0] || (_cache[0] = [
+const OnyxCircleSpinner = /* @__PURE__ */ _export_sfc(_sfc_main$1C, [["render", _sfc_render$1C], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxLoadingIndicator/OnyxCircleSpinner.vue"]]);
+const _sfc_main$1B = {};
+const _hoisted_1$1d = { class: "onyx-component onyx-loading-dots" };
+function _sfc_render$1B(_ctx, _cache) {
+  return openBlock(), createElementBlock("div", _hoisted_1$1d, [..._cache[0] || (_cache[0] = [
     createElementVNode(
       "span",
       { class: "onyx-loading-dots__center" },
@@ -3397,8 +3402,8 @@ function _sfc_render$1A(_ctx, _cache) {
     )
   ])]);
 }
-const OnyxLoadingDots = /* @__PURE__ */ _export_sfc(_sfc_main$1A, [["render", _sfc_render$1A], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxLoadingIndicator/OnyxLoadingDots.vue"]]);
-const _sfc_main$1z = /* @__PURE__ */ defineComponent({
+const OnyxLoadingDots = /* @__PURE__ */ _export_sfc(_sfc_main$1B, [["render", _sfc_render$1B], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxLoadingIndicator/OnyxLoadingDots.vue"]]);
+const _sfc_main$1A = /* @__PURE__ */ defineComponent({
   __name: "OnyxLoadingIndicator",
   props: {
     type: { type: String, required: false, default: "dots" }
@@ -3411,10 +3416,10 @@ const _sfc_main$1z = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1z(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1A(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.props.type === "circle" ? (openBlock(), createBlock($setup["OnyxCircleSpinner"], { key: 0 })) : $setup.props.type === "dots" ? (openBlock(), createBlock($setup["OnyxLoadingDots"], { key: 1 })) : createCommentVNode("v-if", true);
 }
-const OnyxLoadingIndicator = /* @__PURE__ */ _export_sfc(_sfc_main$1z, [["render", _sfc_render$1z], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxLoadingIndicator/OnyxLoadingIndicator.vue"]]);
+const OnyxLoadingIndicator = /* @__PURE__ */ _export_sfc(_sfc_main$1A, [["render", _sfc_render$1A], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxLoadingIndicator/OnyxLoadingIndicator.vue"]]);
 const useRipple = (container) => {
   const isPointerDown = ref(false);
   const ripples = reactive(/* @__PURE__ */ new Map());
@@ -3461,7 +3466,7 @@ const useRipple = (container) => {
   });
   return { isPointerDown, ripples, startRipple, hideRipples, hideRipple, events };
 };
-const _sfc_main$1y = /* @__PURE__ */ defineComponent({
+const _sfc_main$1z = /* @__PURE__ */ defineComponent({
   __name: "OnyxRipple",
   setup(__props, { expose: __expose }) {
     const rippleTrigger = useTemplateRef("rippleTriggerRef");
@@ -3474,16 +3479,16 @@ const _sfc_main$1y = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1b = {
+const _hoisted_1$1c = {
   ref: "rippleTriggerRef",
   class: "onyx-component onyx-ripple",
   "aria-hidden": "true"
 };
 const _hoisted_2$U = ["data-rippleid"];
-function _sfc_render$1y(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1z(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "span",
-    _hoisted_1$1b,
+    _hoisted_1$1c,
     [
       (openBlock(true), createElementBlock(
         Fragment,
@@ -3508,8 +3513,8 @@ function _sfc_render$1y(_ctx, _cache, $props, $setup, $data, $options) {
     /* NEED_PATCH */
   );
 }
-const OnyxRipple = /* @__PURE__ */ _export_sfc(_sfc_main$1y, [["render", _sfc_render$1y], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxRipple/OnyxRipple.vue"]]);
-const _sfc_main$1x = /* @__PURE__ */ defineComponent({
+const OnyxRipple = /* @__PURE__ */ _export_sfc(_sfc_main$1z, [["render", _sfc_render$1z], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxRipple/OnyxRipple.vue"]]);
+const _sfc_main$1y = /* @__PURE__ */ defineComponent({
   __name: "OnyxButton",
   props: {
     density: { type: null, required: false },
@@ -3539,8 +3544,8 @@ const _sfc_main$1x = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$1a = { class: "onyx-button__label onyx-truncation-ellipsis" };
-function _sfc_render$1x(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$1b = { class: "onyx-button__label onyx-truncation-ellipsis" };
+function _sfc_render$1y(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createBlock($setup["OnyxSkeleton"], {
     key: 0,
     class: normalizeClass(["onyx-button-skeleton", $setup.densityClass])
@@ -3577,7 +3582,7 @@ function _sfc_render$1x(_ctx, _cache, $props, $setup, $data, $options) {
       })) : createCommentVNode("v-if", true),
       createElementVNode(
         "span",
-        _hoisted_1$1a,
+        _hoisted_1$1b,
         toDisplayString($setup.props.label),
         1
         /* TEXT */
@@ -3592,8 +3597,8 @@ function _sfc_render$1x(_ctx, _cache, $props, $setup, $data, $options) {
     /* STABLE */
   }, 16, ["class", "aria-label"]));
 }
-const OnyxButton = /* @__PURE__ */ _export_sfc(_sfc_main$1x, [["render", _sfc_render$1x], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxButton/OnyxButton.vue"]]);
-const _sfc_main$1w = /* @__PURE__ */ defineComponent({
+const OnyxButton = /* @__PURE__ */ _export_sfc(_sfc_main$1y, [["render", _sfc_render$1y], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxButton/OnyxButton.vue"]]);
+const _sfc_main$1x = /* @__PURE__ */ defineComponent({
   __name: "OnyxInfoCard",
   props: {
     density: { type: null, required: false },
@@ -3620,7 +3625,7 @@ const _sfc_main$1w = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$19 = { class: "onyx-info-card__content" };
+const _hoisted_1$1a = { class: "onyx-info-card__content" };
 const _hoisted_2$T = {
   key: 3,
   class: "onyx-info-card__description onyx-text--small"
@@ -3629,7 +3634,7 @@ const _hoisted_3$B = {
   key: 4,
   class: "onyx-info-card__buttons onyx-density-compact"
 };
-function _sfc_render$1w(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1x(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     {
@@ -3641,7 +3646,7 @@ function _sfc_render$1w(_ctx, _cache, $props, $setup, $data, $options) {
         class: "onyx-info-card__icon",
         icon: $setup.props.icon
       }, null, 8, ["icon"])) : createCommentVNode("v-if", true),
-      createElementVNode("div", _hoisted_1$19, [
+      createElementVNode("div", _hoisted_1$1a, [
         $setup.props.headline ? (openBlock(), createBlock($setup["OnyxHeadline"], {
           key: 0,
           is: "h3",
@@ -3696,8 +3701,8 @@ function _sfc_render$1w(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   );
 }
-const OnyxInfoCard = /* @__PURE__ */ _export_sfc(_sfc_main$1w, [["render", _sfc_render$1w], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxInfoCard/OnyxInfoCard.vue"]]);
-const _sfc_main$1v = /* @__PURE__ */ defineComponent({
+const OnyxInfoCard = /* @__PURE__ */ _export_sfc(_sfc_main$1x, [["render", _sfc_render$1x], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxInfoCard/OnyxInfoCard.vue"]]);
+const _sfc_main$1w = /* @__PURE__ */ defineComponent({
   __name: "OnyxNotificationMessage",
   props: {
     headline: { type: String, required: true },
@@ -3715,7 +3720,7 @@ const _sfc_main$1v = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1v(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1w(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock($setup["OnyxInfoCard"], {
     class: normalizeClass(["onyx-component onyx-notification-message", [
       "onyx-component",
@@ -3748,7 +3753,7 @@ function _sfc_render$1v(_ctx, _cache, $props, $setup, $data, $options) {
     } : void 0
   ]), 1032, ["class", "headline", "icon", "style", "aria-label"]);
 }
-const OnyxNotificationMessage = /* @__PURE__ */ _export_sfc(_sfc_main$1v, [["render", _sfc_render$1v], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxNotificationMessage/OnyxNotificationMessage.vue"]]);
+const OnyxNotificationMessage = /* @__PURE__ */ _export_sfc(_sfc_main$1w, [["render", _sfc_render$1w], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxNotificationMessage/OnyxNotificationMessage.vue"]]);
 const NOTIFICATIONS_PROVIDER_INJECTION_KEY = /* @__PURE__ */ Symbol();
 const createNotificationsProvider = () => {
   let nextId = 1;
@@ -3793,7 +3798,7 @@ const useNotification = () => {
   );
   return notificationsProvider;
 };
-const _sfc_main$1u = /* @__PURE__ */ defineComponent({
+const _sfc_main$1v = /* @__PURE__ */ defineComponent({
   __name: "OnyxNotifications",
   setup(__props, { expose: __expose }) {
     __expose();
@@ -3803,15 +3808,15 @@ const _sfc_main$1u = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$18 = {
+const _hoisted_1$19 = {
   key: 0,
   class: "onyx-component onyx-notifications",
   role: "presentation",
   "aria-live": "polite",
   open: ""
 };
-function _sfc_render$1u(_ctx, _cache, $props, $setup, $data, $options) {
-  return $setup.notificationProvider.notifications.value.length ? (openBlock(), createElementBlock("dialog", _hoisted_1$18, [
+function _sfc_render$1v(_ctx, _cache, $props, $setup, $data, $options) {
+  return $setup.notificationProvider.notifications.value.length ? (openBlock(), createElementBlock("dialog", _hoisted_1$19, [
     (openBlock(true), createElementBlock(
       Fragment,
       null,
@@ -3863,8 +3868,8 @@ function _sfc_render$1u(_ctx, _cache, $props, $setup, $data, $options) {
     ))
   ])) : createCommentVNode("v-if", true);
 }
-const OnyxNotifications = /* @__PURE__ */ _export_sfc(_sfc_main$1u, [["render", _sfc_render$1u], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxNotifications/OnyxNotifications.vue"]]);
-const _sfc_main$1t = /* @__PURE__ */ defineComponent({
+const OnyxNotifications = /* @__PURE__ */ _export_sfc(_sfc_main$1v, [["render", _sfc_render$1v], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxNotifications/OnyxNotifications.vue"]]);
+const _sfc_main$1u = /* @__PURE__ */ defineComponent({
   __name: "OnyxToastMessage",
   props: {
     density: { type: null, required: false },
@@ -3900,24 +3905,24 @@ const _sfc_main$1t = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$17 = { class: "onyx-toast-message__wrapper" };
+const _hoisted_1$18 = { class: "onyx-toast-message__wrapper" };
 const _hoisted_2$S = { class: "onyx-toast-message__content onyx-truncation-ellipsis" };
 const _hoisted_3$A = { class: "onyx-toast-message__headline onyx-text" };
 const _hoisted_4$o = { class: "onyx-truncation-ellipsis" };
 const _hoisted_5$h = ["aria-label"];
-const _hoisted_6$c = {
+const _hoisted_6$d = {
   key: 0,
   class: "onyx-toast-message__description onyx-text--small onyx-truncation-multiline",
   tabindex: "0"
 };
-function _sfc_render$1t(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1u(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock(resolveDynamicComponent($setup.props.clickable ? "button" : "div"), {
     class: normalizeClass(["onyx-component onyx-toast-message", [`onyx-toast-message--${$setup.props.color}`, $setup.densityClass]]),
     role: $setup.props.color === "danger" || $setup.props.color === "warning" ? "alert" : "status",
     "aria-label": $setup.props.clickable ? $setup.props.headline : void 0
   }, {
     default: withCtx(() => [
-      createElementVNode("div", _hoisted_1$17, [
+      createElementVNode("div", _hoisted_1$18, [
         $setup.icon ? (openBlock(), createBlock($setup["OnyxIcon"], {
           key: 0,
           icon: $setup.icon
@@ -3943,7 +3948,7 @@ function _sfc_render$1t(_ctx, _cache, $props, $setup, $data, $options) {
           ]),
           $setup.props.description ? (openBlock(), createElementBlock(
             "p",
-            _hoisted_6$c,
+            _hoisted_6$d,
             toDisplayString($setup.props.description),
             1
             /* TEXT */
@@ -3968,7 +3973,7 @@ function _sfc_render$1t(_ctx, _cache, $props, $setup, $data, $options) {
     /* STABLE */
   }, 8, ["class", "role", "aria-label"]);
 }
-const OnyxToastMessage = /* @__PURE__ */ _export_sfc(_sfc_main$1t, [["render", _sfc_render$1t], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxToastMessage/OnyxToastMessage.vue"]]);
+const OnyxToastMessage = /* @__PURE__ */ _export_sfc(_sfc_main$1u, [["render", _sfc_render$1u], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxToastMessage/OnyxToastMessage.vue"]]);
 const TOAST_PROVIDER_INJECTION_KEY = /* @__PURE__ */ Symbol();
 const createToastProvider = () => {
   let nextId = 1;
@@ -4011,7 +4016,7 @@ const useToast = () => {
   );
   return toastProvider;
 };
-const _sfc_main$1s = /* @__PURE__ */ defineComponent({
+const _sfc_main$1t = /* @__PURE__ */ defineComponent({
   __name: "OnyxToast",
   setup(__props, { expose: __expose }) {
     __expose();
@@ -4021,15 +4026,15 @@ const _sfc_main$1s = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$16 = {
+const _hoisted_1$17 = {
   key: 0,
   class: "onyx-component onyx-toast",
   role: "presentation",
   "aria-live": "polite",
   open: ""
 };
-function _sfc_render$1s(_ctx, _cache, $props, $setup, $data, $options) {
-  return $setup.toastProvider.toasts.value.length ? (openBlock(), createElementBlock("dialog", _hoisted_1$16, [
+function _sfc_render$1t(_ctx, _cache, $props, $setup, $data, $options) {
+  return $setup.toastProvider.toasts.value.length ? (openBlock(), createElementBlock("dialog", _hoisted_1$17, [
     (openBlock(true), createElementBlock(
       Fragment,
       null,
@@ -4047,8 +4052,8 @@ function _sfc_render$1s(_ctx, _cache, $props, $setup, $data, $options) {
     ))
   ])) : createCommentVNode("v-if", true);
 }
-const OnyxToast = /* @__PURE__ */ _export_sfc(_sfc_main$1s, [["render", _sfc_render$1s], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxToast/OnyxToast.vue"]]);
-const _sfc_main$1r = /* @__PURE__ */ defineComponent({
+const OnyxToast = /* @__PURE__ */ _export_sfc(_sfc_main$1t, [["render", _sfc_render$1t], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxToast/OnyxToast.vue"]]);
+const _sfc_main$1s = /* @__PURE__ */ defineComponent({
   __name: "OnyxAppLayout",
   props: {
     navBarAlignment: { type: String, required: false, default: "top" }
@@ -4062,19 +4067,19 @@ const _sfc_main$1r = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$15 = {
+const _hoisted_1$16 = {
   key: 0,
   class: "onyx-app__nav"
 };
 const _hoisted_2$R = { class: "onyx-app__page" };
-function _sfc_render$1r(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1s(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     {
       class: normalizeClass(["onyx-component onyx-app", { "onyx-app--horizontal": $setup.props.navBarAlignment === "left" }])
     },
     [
-      $setup.slots.navBar ? (openBlock(), createElementBlock("div", _hoisted_1$15, [
+      $setup.slots.navBar ? (openBlock(), createElementBlock("div", _hoisted_1$16, [
         renderSlot(_ctx.$slots, "navBar")
       ])) : createCommentVNode("v-if", true),
       createElementVNode("div", _hoisted_2$R, [
@@ -4088,8 +4093,8 @@ function _sfc_render$1r(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   );
 }
-const OnyxAppLayout = /* @__PURE__ */ _export_sfc(_sfc_main$1r, [["render", _sfc_render$1r], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAppLayout/OnyxAppLayout.vue"]]);
-const _sfc_main$1q = /* @__PURE__ */ defineComponent({
+const OnyxAppLayout = /* @__PURE__ */ _export_sfc(_sfc_main$1s, [["render", _sfc_render$1s], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAppLayout/OnyxAppLayout.vue"]]);
+const _sfc_main$1r = /* @__PURE__ */ defineComponent({
   __name: "OnyxAvatar",
   props: {
     size: { type: null, required: false, default: "48px" },
@@ -4123,13 +4128,13 @@ const _sfc_main$1q = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$14 = ["title", "aria-label"];
+const _hoisted_1$15 = ["title", "aria-label"];
 const _hoisted_2$Q = ["src", "alt"];
 const _hoisted_3$z = {
   key: 0,
   class: "onyx-avatar__initials"
 };
-function _sfc_render$1q(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1r(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("figure", {
     class: normalizeClass([
       "onyx-component",
@@ -4165,10 +4170,10 @@ function _sfc_render$1q(_ctx, _cache, $props, $setup, $data, $options) {
       64
       /* STABLE_FRAGMENT */
     ))
-  ], 10, _hoisted_1$14);
+  ], 10, _hoisted_1$15);
 }
-const OnyxAvatar = /* @__PURE__ */ _export_sfc(_sfc_main$1q, [["render", _sfc_render$1q], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAvatar/OnyxAvatar.vue"]]);
-const _sfc_main$1p = /* @__PURE__ */ defineComponent({
+const OnyxAvatar = /* @__PURE__ */ _export_sfc(_sfc_main$1r, [["render", _sfc_render$1r], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAvatar/OnyxAvatar.vue"]]);
+const _sfc_main$1q = /* @__PURE__ */ defineComponent({
   __name: "OnyxAvatarStack",
   setup(__props, { expose: __expose }) {
     __expose();
@@ -4177,14 +4182,14 @@ const _sfc_main$1p = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$13 = { class: "onyx-component onyx-avatar-stack" };
-function _sfc_render$1p(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", _hoisted_1$13, [
+const _hoisted_1$14 = { class: "onyx-component onyx-avatar-stack" };
+function _sfc_render$1q(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", _hoisted_1$14, [
     renderSlot(_ctx.$slots, "default")
   ]);
 }
-const OnyxAvatarStack = /* @__PURE__ */ _export_sfc(_sfc_main$1p, [["render", _sfc_render$1p], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAvatarStack/OnyxAvatarStack.vue"]]);
-const _sfc_main$1o = /* @__PURE__ */ defineComponent({
+const OnyxAvatarStack = /* @__PURE__ */ _export_sfc(_sfc_main$1q, [["render", _sfc_render$1q], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxAvatarStack/OnyxAvatarStack.vue"]]);
+const _sfc_main$1p = /* @__PURE__ */ defineComponent({
   __name: "OnyxBadge",
   props: {
     density: { type: null, required: false },
@@ -4201,7 +4206,7 @@ const _sfc_main$1o = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1o(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1p(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     {
@@ -4232,8 +4237,8 @@ function _sfc_render$1o(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   );
 }
-const OnyxBadge = /* @__PURE__ */ _export_sfc(_sfc_main$1o, [["render", _sfc_render$1o], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBadge/OnyxBadge.vue"]]);
-const _sfc_main$1n = /* @__PURE__ */ defineComponent({
+const OnyxBadge = /* @__PURE__ */ _export_sfc(_sfc_main$1p, [["render", _sfc_render$1p], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBadge/OnyxBadge.vue"]]);
+const _sfc_main$1o = /* @__PURE__ */ defineComponent({
   __name: "OnyxBottomBar",
   props: {
     density: { type: null, required: false },
@@ -4248,10 +4253,10 @@ const _sfc_main$1n = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$12 = { class: "onyx-bottom-bar__content onyx-grid-container" };
+const _hoisted_1$13 = { class: "onyx-bottom-bar__content onyx-grid-container" };
 const _hoisted_2$P = { class: "onyx-bottom-bar__content--left" };
 const _hoisted_3$y = { class: "onyx-bottom-bar__content--right" };
-function _sfc_render$1n(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1o(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     {
@@ -4263,7 +4268,7 @@ function _sfc_render$1n(_ctx, _cache, $props, $setup, $data, $options) {
       ])
     },
     [
-      createElementVNode("div", _hoisted_1$12, [
+      createElementVNode("div", _hoisted_1$13, [
         createElementVNode("div", _hoisted_2$P, [
           renderSlot(_ctx.$slots, "left")
         ]),
@@ -4276,7 +4281,7 @@ function _sfc_render$1n(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   );
 }
-const OnyxBottomBar = /* @__PURE__ */ _export_sfc(_sfc_main$1n, [["render", _sfc_render$1n], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBottomBar/OnyxBottomBar.vue"]]);
+const OnyxBottomBar = /* @__PURE__ */ _export_sfc(_sfc_main$1o, [["render", _sfc_render$1o], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBottomBar/OnyxBottomBar.vue"]]);
 const useMoreList = (options) => {
   const visibleElements = ref();
   const hiddenElements = ref();
@@ -4371,7 +4376,7 @@ const useMoreListChild = (injectionKey) => {
 };
 const BREADCRUMB_MORE_LIST_INJECTION_KEY = /* @__PURE__ */ Symbol();
 const BREADCRUMB_MORE_LIST_TARGET_INJECTION_KEY = /* @__PURE__ */ Symbol();
-const _sfc_main$1m = /* @__PURE__ */ defineComponent({
+const _sfc_main$1n = /* @__PURE__ */ defineComponent({
   __name: "OnyxExternalLinkIcon",
   props: {
     href: { type: String, required: false },
@@ -4392,7 +4397,7 @@ const _sfc_main$1m = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1m(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1n(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.isVisible ? (openBlock(), createBlock($setup["OnyxIcon"], {
     key: 0,
     class: "onyx-component onyx-external-link-icon",
@@ -4400,8 +4405,8 @@ function _sfc_render$1m(_ctx, _cache, $props, $setup, $data, $options) {
     size: "16px"
   }, null, 8, ["icon"])) : createCommentVNode("v-if", true);
 }
-const OnyxExternalLinkIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1m, [["render", _sfc_render$1m], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxExternalLinkIcon/OnyxExternalLinkIcon.vue"]]);
-const _sfc_main$1l = /* @__PURE__ */ defineComponent({
+const OnyxExternalLinkIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1n, [["render", _sfc_render$1n], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxExternalLinkIcon/OnyxExternalLinkIcon.vue"]]);
+const _sfc_main$1m = /* @__PURE__ */ defineComponent({
   __name: "OnyxListItem",
   props: {
     density: { type: null, required: false },
@@ -4420,7 +4425,7 @@ const _sfc_main$1l = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1l(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1m(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "li",
     {
@@ -4442,8 +4447,8 @@ function _sfc_render$1l(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   );
 }
-const OnyxListItem = /* @__PURE__ */ _export_sfc(_sfc_main$1l, [["render", _sfc_render$1l], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxListItem/OnyxListItem.vue"]]);
-const _sfc_main$1k = /* @__PURE__ */ defineComponent({
+const OnyxListItem = /* @__PURE__ */ _export_sfc(_sfc_main$1m, [["render", _sfc_render$1m], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxListItem/OnyxListItem.vue"]]);
+const _sfc_main$1l = /* @__PURE__ */ defineComponent({
   ...{ inheritAttrs: false },
   __name: "OnyxMenuItem",
   props: {
@@ -4522,7 +4527,7 @@ const _sfc_main$1k = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$11 = { class: "onyx-truncation-ellipsis" };
+const _hoisted_1$12 = { class: "onyx-truncation-ellipsis" };
 const _hoisted_2$O = {
   key: 0,
   class: "onyx-menu-item__chevron"
@@ -4532,7 +4537,7 @@ const _hoisted_3$x = {
   role: "menu",
   class: "onyx-menu-item__children"
 };
-function _sfc_render$1k(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1l(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_OnyxMenuItem = resolveComponent("OnyxMenuItem", true);
   return openBlock(), createBlock($setup["OnyxListItem"], mergeProps({
     selected: $setup.isActive,
@@ -4553,7 +4558,7 @@ function _sfc_render$1k(_ctx, _cache, $props, $setup, $data, $options) {
             createElementVNode("span", null, [
               createElementVNode(
                 "span",
-                _hoisted_1$11,
+                _hoisted_1$12,
                 toDisplayString($setup.props.label),
                 1
                 /* TEXT */
@@ -4618,8 +4623,8 @@ function _sfc_render$1k(_ctx, _cache, $props, $setup, $data, $options) {
     /* FORWARDED */
   }, 16, ["selected", "active", "color", "disabled", "class"]);
 }
-const OnyxMenuItem = /* @__PURE__ */ _export_sfc(_sfc_main$1k, [["render", _sfc_render$1k], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxNavBar/modules/OnyxMenuItem/OnyxMenuItem.vue"]]);
-const _sfc_main$1j = /* @__PURE__ */ defineComponent({
+const OnyxMenuItem = /* @__PURE__ */ _export_sfc(_sfc_main$1l, [["render", _sfc_render$1l], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxNavBar/modules/OnyxMenuItem/OnyxMenuItem.vue"]]);
+const _sfc_main$1k = /* @__PURE__ */ defineComponent({
   ...{ inheritAttrs: false },
   __name: "OnyxBreadcrumbItem",
   props: {
@@ -4645,7 +4650,7 @@ const _sfc_main$1j = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1j(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1k(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     Fragment,
     null,
@@ -4705,8 +4710,8 @@ function _sfc_render$1j(_ctx, _cache, $props, $setup, $data, $options) {
     /* STABLE_FRAGMENT */
   );
 }
-const OnyxBreadcrumbItem = /* @__PURE__ */ _export_sfc(_sfc_main$1j, [["render", _sfc_render$1j], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBreadcrumbItem/OnyxBreadcrumbItem.vue"]]);
-const _sfc_main$1i = /* @__PURE__ */ defineComponent({
+const OnyxBreadcrumbItem = /* @__PURE__ */ _export_sfc(_sfc_main$1k, [["render", _sfc_render$1k], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBreadcrumbItem/OnyxBreadcrumbItem.vue"]]);
+const _sfc_main$1j = /* @__PURE__ */ defineComponent({
   __name: "OnyxMoreList",
   props: {
     injectionKey: { type: [Symbol, Object], required: true },
@@ -4739,7 +4744,7 @@ const _sfc_main$1i = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1i(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1j(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock(
     resolveDynamicComponent($setup.props.is),
     {
@@ -4779,8 +4784,8 @@ function _sfc_render$1i(_ctx, _cache, $props, $setup, $data, $options) {
     /* NEED_PATCH */
   );
 }
-const OnyxMoreList = /* @__PURE__ */ _export_sfc(_sfc_main$1i, [["render", _sfc_render$1i], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxMoreList/OnyxMoreList.vue"]]);
-const _sfc_main$1h = /* @__PURE__ */ defineComponent({
+const OnyxMoreList = /* @__PURE__ */ _export_sfc(_sfc_main$1j, [["render", _sfc_render$1j], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxMoreList/OnyxMoreList.vue"]]);
+const _sfc_main$1i = /* @__PURE__ */ defineComponent({
   __name: "OnyxBreadcrumb",
   props: {
     density: { type: null, required: false },
@@ -4806,13 +4811,13 @@ const _sfc_main$1h = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$10 = ["aria-label", "aria-hidden"];
+const _hoisted_1$11 = ["aria-label", "aria-hidden"];
 const _hoisted_2$N = {
   class: "onyx-breadcrumb__list onyx-grid-container",
   role: "menu"
 };
 const _hoisted_3$w = { ref: "moreListRef" };
-function _sfc_render$1h(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1i(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("nav", {
     class: normalizeClass([
       "onyx-component",
@@ -4905,13 +4910,13 @@ function _sfc_render$1h(_ctx, _cache, $props, $setup, $data, $options) {
         /* FORWARDED */
       }, 8, ["injection-key"])
     ])
-  ], 10, _hoisted_1$10);
+  ], 10, _hoisted_1$11);
 }
-const OnyxBreadcrumb = /* @__PURE__ */ _export_sfc(_sfc_main$1h, [["render", _sfc_render$1h], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBreadcrumb/OnyxBreadcrumb.vue"]]);
+const OnyxBreadcrumb = /* @__PURE__ */ _export_sfc(_sfc_main$1i, [["render", _sfc_render$1i], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxBreadcrumb/OnyxBreadcrumb.vue"]]);
 const BUTTON_TYPES = ["button", "submit", "reset"];
 const BUTTON_COLORS = ["primary", "neutral", "danger"];
 const BUTTON_MODES = ["default", "outline", "plain"];
-const _sfc_main$1g = /* @__PURE__ */ defineComponent({
+const _sfc_main$1h = /* @__PURE__ */ defineComponent({
   __name: "OnyxCard",
   props: {
     density: { type: null, required: false },
@@ -4930,7 +4935,7 @@ const _sfc_main$1g = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$1g(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1h(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock(resolveDynamicComponent($setup.linkProps ? $setup.OnyxRouterLink : $setup.props.clickable ? "button" : "div"), mergeProps($setup.linkProps, {
     class: ["onyx-component", "onyx-card", $setup.densityClass, "onyx-truncation-multiline", "onyx-text"]
   }), {
@@ -4941,8 +4946,8 @@ function _sfc_render$1g(_ctx, _cache, $props, $setup, $data, $options) {
     /* FORWARDED */
   }, 16, ["class"]);
 }
-const OnyxCard = /* @__PURE__ */ _export_sfc(_sfc_main$1g, [["render", _sfc_render$1g], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCard/OnyxCard.vue"]]);
-const _sfc_main$1f = /* @__PURE__ */ defineComponent({
+const OnyxCard = /* @__PURE__ */ _export_sfc(_sfc_main$1h, [["render", _sfc_render$1h], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCard/OnyxCard.vue"]]);
+const _sfc_main$1g = /* @__PURE__ */ defineComponent({
   __name: "OnyxTooltip",
   props: {
     density: { type: null, required: false },
@@ -5097,8 +5102,8 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$$ = { class: "onyx-tooltip--content" };
-function _sfc_render$1f(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_1$10 = { class: "onyx-tooltip--content" };
+function _sfc_render$1g(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     {
@@ -5114,7 +5119,7 @@ function _sfc_render$1f(_ctx, _cache, $props, $setup, $data, $options) {
           style: $setup.tooltipStyles
         }),
         [
-          createElementVNode("div", _hoisted_1$$, [
+          createElementVNode("div", _hoisted_1$10, [
             $setup.props.icon ? (openBlock(), createBlock($setup["OnyxIcon"], {
               key: 0,
               icon: $setup.props.icon,
@@ -5138,8 +5143,8 @@ function _sfc_render$1f(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS, STYLE */
   );
 }
-const OnyxTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$1f, [["render", _sfc_render$1f], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxTooltip/OnyxTooltip.vue"]]);
-const _sfc_main$1e = /* @__PURE__ */ defineComponent({
+const OnyxTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$1g, [["render", _sfc_render$1g], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxTooltip/OnyxTooltip.vue"]]);
+const _sfc_main$1f = /* @__PURE__ */ defineComponent({
   __name: "OnyxCalendarCell",
   props: {
     density: { type: null, required: false },
@@ -5169,7 +5174,7 @@ const _sfc_main$1e = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$_ = { class: "onyx-calendar-cell__header" };
+const _hoisted_1$$ = { class: "onyx-calendar-cell__header" };
 const _hoisted_2$M = { class: "onyx-calendar-cell__date-container" };
 const _hoisted_3$v = {
   key: 1,
@@ -5179,7 +5184,7 @@ const _hoisted_4$n = {
   key: 0,
   class: "onyx-calendar-cell__main"
 };
-function _sfc_render$1e(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1f(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "td",
     {
@@ -5205,7 +5210,7 @@ function _sfc_render$1e(_ctx, _cache, $props, $setup, $data, $options) {
         ]
       }), {
         default: withCtx(() => [
-          createElementVNode("div", _hoisted_1$_, [
+          createElementVNode("div", _hoisted_1$$, [
             createElementVNode("div", _hoisted_2$M, [
               $setup.props.tooltipText ? (openBlock(), createBlock($setup["OnyxTooltip"], {
                 key: 0,
@@ -5244,62 +5249,8 @@ function _sfc_render$1e(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   );
 }
-const OnyxCalendarCell = /* @__PURE__ */ _export_sfc(_sfc_main$1e, [["render", _sfc_render$1e], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCalendarCell/OnyxCalendarCell.vue"]]);
-const _sfc_main$1d = /* @__PURE__ */ defineComponent({
-  __name: "OnyxIconButton",
-  props: {
-    density: { type: null, required: false },
-    autofocus: { type: Boolean, required: false },
-    link: { type: null, required: false },
-    label: { type: String, required: true },
-    disabled: { type: [Boolean, Symbol], required: false, default: FORM_INJECTED_SYMBOL },
-    type: { type: null, required: false, default: "button" },
-    color: { type: null, required: false, default: "primary" },
-    loading: { type: Boolean, required: false },
-    icon: { type: String, required: false },
-    skeleton: { type: [Symbol, Boolean, Number], required: false, default: SKELETON_INJECTED_SYMBOL }
-  },
-  setup(__props, { expose: __expose }) {
-    __expose();
-    const props = __props;
-    const { densityClass } = useDensity(props);
-    const skeleton = useSkeletonContext(props);
-    const forwardProps = useForwardProps(props, ButtonOrLinkLayout);
-    const __returned__ = { props, densityClass, skeleton, forwardProps, ButtonOrLinkLayout, OnyxIcon, OnyxLoadingIndicator, OnyxSkeleton };
-    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
-    return __returned__;
-  }
-});
-function _sfc_render$1d(_ctx, _cache, $props, $setup, $data, $options) {
-  return $setup.skeleton ? (openBlock(), createBlock($setup["OnyxSkeleton"], {
-    key: 0,
-    class: normalizeClass(["onyx-icon-button-skeleton", $setup.densityClass])
-  }, null, 8, ["class"])) : (openBlock(), createBlock($setup["ButtonOrLinkLayout"], mergeProps({ key: 1 }, $setup.forwardProps, {
-    "aria-label": $setup.props.label,
-    title: $setup.props.label,
-    class: [
-      "onyx-component",
-      "onyx-icon-button",
-      `onyx-icon-button--${$setup.props.color}`,
-      { "onyx-icon-button--loading": $setup.props.loading },
-      $setup.densityClass
-    ]
-  }), {
-    default: withCtx(() => [
-      $setup.props.loading ? (openBlock(), createBlock($setup["OnyxLoadingIndicator"], {
-        key: 0,
-        type: "circle"
-      })) : $setup.props.icon ? (openBlock(), createBlock($setup["OnyxIcon"], {
-        key: 1,
-        icon: $setup.props.icon
-      }, null, 8, ["icon"])) : renderSlot(_ctx.$slots, "default", { key: 2 })
-    ]),
-    _: 3
-    /* FORWARDED */
-  }, 16, ["aria-label", "title", "class"]));
-}
-const OnyxIconButton = /* @__PURE__ */ _export_sfc(_sfc_main$1d, [["render", _sfc_render$1d], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxIconButton/OnyxIconButton.vue"]]);
-const _sfc_main$1c = /* @__PURE__ */ defineComponent({
+const OnyxCalendarCell = /* @__PURE__ */ _export_sfc(_sfc_main$1f, [["render", _sfc_render$1f], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCalendarCell/OnyxCalendarCell.vue"]]);
+const _sfc_main$1e = /* @__PURE__ */ defineComponent({
   __name: "OnyxTag",
   props: {
     density: { type: null, required: false },
@@ -5326,9 +5277,9 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-const _hoisted_1$Z = { class: "onyx-text--small onyx-truncation-ellipsis" };
+const _hoisted_1$_ = { class: "onyx-text--small onyx-truncation-ellipsis" };
 const _hoisted_2$L = { class: "onyx-text--small onyx-truncation-ellipsis" };
-function _sfc_render$1c(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1e(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createBlock($setup["OnyxSkeleton"], {
     key: 0,
     class: normalizeClass(["onyx-tag-skeleton", $setup.densityClass])
@@ -5351,7 +5302,7 @@ function _sfc_render$1c(_ctx, _cache, $props, $setup, $data, $options) {
           }, null, 8, ["icon"])) : createCommentVNode("v-if", true),
           createElementVNode(
             "span",
-            _hoisted_1$Z,
+            _hoisted_1$_,
             toDisplayString($setup.props.label),
             1
             /* TEXT */
@@ -5392,9 +5343,98 @@ function _sfc_render$1c(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   ));
 }
-const OnyxTag = /* @__PURE__ */ _export_sfc(_sfc_main$1c, [["render", _sfc_render$1c], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxTag/OnyxTag.vue"]]);
+const OnyxTag = /* @__PURE__ */ _export_sfc(_sfc_main$1e, [["render", _sfc_render$1e], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxTag/OnyxTag.vue"]]);
+const _sfc_main$1d = /* @__PURE__ */ defineComponent({
+  __name: "OnyxMonthYearPickerGrid",
+  props: {
+    mode: { type: String, required: true },
+    viewMonth: { type: Date, required: true },
+    open: { type: Boolean, required: true }
+  },
+  emits: ["selectYear", "selectMonth"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    __expose();
+    const props = __props;
+    const emit = __emit;
+    const { d } = injectI18n();
+    const currentViewYear = computed(() => props.viewMonth.getFullYear());
+    const currentViewMonthIndex = computed(() => props.viewMonth.getMonth());
+    const years = computed(() => {
+      const count = 100;
+      const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
+      const start = currentYear - count;
+      const end = currentYear + count;
+      return Array.from({ length: end - start + 1 }, (_, i) => start + i);
+    });
+    const monthNames = computed(() => {
+      return Array.from({ length: 12 }, (_, i) => ({
+        label: d.value(new Date(2e3, i, 1), { month: "short" }),
+        value: i
+      }));
+    });
+    const buttonRefs = useTemplateRef("buttons");
+    const scrollToActiveYear = async () => {
+      if (props.mode !== "year") return;
+      await nextTick();
+      const activeIndex = years.value.indexOf(currentViewYear.value);
+      const selectedYearButton = buttonRefs.value?.[activeIndex]?.$el;
+      if (!selectedYearButton) return;
+      selectedYearButton.scrollIntoView({ block: "center" });
+    };
+    watch(
+      () => props.open,
+      (open) => {
+        if (open) {
+          scrollToActiveYear();
+        }
+      }
+    );
+    const __returned__ = { props, emit, d, currentViewYear, currentViewMonthIndex, years, monthNames, buttonRefs, scrollToActiveYear, OnyxButton };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+const _hoisted_1$Z = { class: "onyx-component onyx-calendar__picker-grid" };
+function _sfc_render$1d(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", _hoisted_1$Z, [
+    $setup.props.mode === "year" ? (openBlock(true), createElementBlock(
+      Fragment,
+      { key: 0 },
+      renderList($setup.years, (year) => {
+        return openBlock(), createBlock($setup["OnyxButton"], {
+          ref_for: true,
+          ref: "buttons",
+          key: year,
+          label: year.toString(),
+          color: year === $setup.currentViewYear ? "primary" : "neutral",
+          mode: "plain",
+          size: "small",
+          onClick: ($event) => $setup.emit("selectYear", year)
+        }, null, 8, ["label", "color", "onClick"]);
+      }),
+      128
+      /* KEYED_FRAGMENT */
+    )) : (openBlock(true), createElementBlock(
+      Fragment,
+      { key: 1 },
+      renderList($setup.monthNames, (month) => {
+        return openBlock(), createBlock($setup["OnyxButton"], {
+          key: month.value,
+          label: month.label,
+          color: month.value === $setup.currentViewMonthIndex ? "primary" : "neutral",
+          mode: "plain",
+          size: "small",
+          onClick: ($event) => $setup.emit("selectMonth", month.value)
+        }, null, 8, ["label", "color", "onClick"]);
+      }),
+      128
+      /* KEYED_FRAGMENT */
+    ))
+  ]);
+}
+const OnyxMonthYearPickerGrid = /* @__PURE__ */ _export_sfc(_sfc_main$1d, [["render", _sfc_render$1d], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCalendar/OnyxMonthYearPickerGrid.vue"]]);
 const __default__$6 = {};
-const _sfc_main$1b = /* @__PURE__ */ defineComponent({
+const _sfc_main$1c = /* @__PURE__ */ defineComponent({
   ...__default__$6,
   __name: "OnyxCalendar",
   props: {
@@ -5439,7 +5479,15 @@ const _sfc_main$1b = /* @__PURE__ */ defineComponent({
     const {
       state: { weeksToRender, weekdayNames },
       elements: { table: tableProps, cell: cellProps, button: buttonProps },
-      internals: { goToMonthByOffset, goToToday, isSelected, isToday, getRangeType, isDisabled }
+      internals: {
+        goToMonthByOffset,
+        goToToday,
+        isSelected,
+        isToday,
+        getRangeType,
+        isDisabled,
+        goToDate
+      }
     } = _unstableCreateCalendar({
       disabled,
       min,
@@ -5454,6 +5502,23 @@ const _sfc_main$1b = /* @__PURE__ */ defineComponent({
       onUpdateViewMonth: (newDate) => viewMonth.value = newDate,
       onUpdateModelValue: (newValue) => modelValue.value = newValue
     });
+    const isPickerOpen = ref(false);
+    const pickerMode = ref("year");
+    const handlePickerUpdate = (isOpen) => {
+      if (isOpen) pickerMode.value = "year";
+    };
+    const handleYearSelect = (year) => {
+      const newDate = new Date(viewMonth.value);
+      newDate.setFullYear(year);
+      goToDate(newDate, true);
+      pickerMode.value = "month";
+    };
+    const handleMonthSelect = (month) => {
+      const newDate = new Date(viewMonth.value);
+      newDate.setMonth(month);
+      goToDate(newDate, true);
+      isPickerOpen.value = false;
+    };
     const hoveredDate = ref();
     const hoverHandlers = (day) => {
       if (selectionMode.value !== "range" || isDisabled.value(day.date)) return {};
@@ -5500,21 +5565,29 @@ const _sfc_main$1b = /* @__PURE__ */ defineComponent({
     const calendarWeeksDisplay = computed(
       () => `${t.value("calendar.calendarWeek")} ${weeksToRender.value[0]?.weekNumber} - ${weeksToRender.value[weeksToRender.value.length - 1]?.weekNumber} `
     );
-    const __returned__ = { props, emit, slots, modelValue, viewMonth, densityClass, skeleton, t, locale, d, calendarRef, width, calendarSize, disabled, min, max, weekStartDay, showCalendarWeeks, selectionMode, weeksToRender, weekdayNames, tableProps, cellProps, buttonProps, goToMonthByOffset, goToToday, isSelected, isToday, getRangeType, isDisabled, hoveredDate, hoverHandlers, tableHeaders, getDayRangeType, selectWeek, getWeekNumberProps, calendarWeeksDisplay, get iconChevronLeftSmall() {
+    const picker = useTemplateRef("pickerRef");
+    const pickerSmall = useTemplateRef("pickerSmallRef");
+    const pickerSmallButton = useTemplateRef("pickerSmallButtonRef");
+    useOutsideClick({
+      inside: () => [picker.value, pickerSmall.value, pickerSmallButton.value],
+      onOutsideClick: () => isPickerOpen.value = false
+    });
+    const __returned__ = { props, emit, slots, modelValue, viewMonth, densityClass, skeleton, t, locale, d, calendarRef, width, calendarSize, disabled, min, max, weekStartDay, showCalendarWeeks, selectionMode, weeksToRender, weekdayNames, tableProps, cellProps, buttonProps, goToMonthByOffset, goToToday, isSelected, isToday, getRangeType, isDisabled, goToDate, isPickerOpen, pickerMode, handlePickerUpdate, handleYearSelect, handleMonthSelect, hoveredDate, hoverHandlers, tableHeaders, getDayRangeType, selectWeek, getWeekNumberProps, calendarWeeksDisplay, picker, pickerSmall, pickerSmallButton, get iconChevronLeftSmall() {
       return iconChevronLeftSmall;
     }, get iconChevronRightSmall() {
       return iconChevronRightSmall;
-    }, OnyxCalendarCell, OnyxHeadline, OnyxIconButton, OnyxSkeleton, OnyxSystemButton, OnyxTag };
+    }, OnyxBasicPopover, OnyxButton, OnyxCalendarCell, OnyxSkeleton, OnyxSystemButton, OnyxTag, OnyxMonthYearPickerGrid };
     Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
     return __returned__;
   }
 });
 const _hoisted_1$Y = { class: "onyx-calendar__header" };
 const _hoisted_2$K = { class: "control-container time-control-container" };
-const _hoisted_3$u = { class: "control-container" };
-const _hoisted_4$m = { class: "onyx-calendar__body" };
-const _hoisted_5$g = ["abbr"];
-function _sfc_render$1b(_ctx, _cache, $props, $setup, $data, $options) {
+const _hoisted_3$u = { class: "control-container__month-buttons" };
+const _hoisted_4$m = { class: "control-container" };
+const _hoisted_5$g = { class: "onyx-calendar__body" };
+const _hoisted_6$c = ["abbr"];
+function _sfc_render$1c(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createElementBlock(
     "div",
     {
@@ -5540,53 +5613,84 @@ function _sfc_render$1b(_ctx, _cache, $props, $setup, $data, $options) {
           createVNode($setup["OnyxSystemButton"], {
             label: $setup.t("calendar.todayButton.label"),
             class: "control-container__today-btn",
-            disabled: $setup.disabled === true,
+            disabled: $setup.disabled === true || $setup.isPickerOpen && $setup.calendarSize === "small",
             onClick: $setup.goToToday
           }, null, 8, ["label", "disabled", "onClick"]),
-          createVNode($setup["OnyxHeadline"], {
-            is: "h2",
-            class: "control-container__date-display"
+          createElementVNode("div", _hoisted_3$u, [
+            createVNode($setup["OnyxSystemButton"], {
+              label: $setup.t("calendar.previousMonthButton"),
+              icon: $setup.iconChevronLeftSmall,
+              disabled: $setup.disabled === true || $setup.isPickerOpen && $setup.calendarSize === "small",
+              onClick: _cache[0] || (_cache[0] = ($event) => $setup.goToMonthByOffset(-1))
+            }, null, 8, ["label", "icon", "disabled"]),
+            createVNode($setup["OnyxSystemButton"], {
+              label: $setup.t("calendar.nextMonthButton"),
+              icon: $setup.iconChevronRightSmall,
+              disabled: $setup.disabled === true || $setup.isPickerOpen && $setup.calendarSize === "small",
+              onClick: _cache[1] || (_cache[1] = ($event) => $setup.goToMonthByOffset(1))
+            }, null, 8, ["label", "icon", "disabled"])
+          ]),
+          $setup.calendarSize === "small" ? (openBlock(), createBlock($setup["OnyxButton"], {
+            key: 0,
+            ref: "pickerSmallButtonRef",
+            color: "neutral",
+            label: $setup.d($setup.viewMonth, { month: "long", year: "numeric" }),
+            mode: "plain",
+            onClick: _cache[2] || (_cache[2] = () => {
+              $setup.isPickerOpen = !$setup.isPickerOpen;
+              $setup.handlePickerUpdate($setup.isPickerOpen);
+            })
+          }, null, 8, ["label"])) : (openBlock(), createBlock($setup["OnyxBasicPopover"], {
+            key: 1,
+            ref: "pickerRef",
+            open: $setup.isPickerOpen,
+            "onUpdate:open": [
+              _cache[3] || (_cache[3] = ($event) => $setup.isPickerOpen = $event),
+              $setup.handlePickerUpdate
+            ],
+            label: $setup.t("calendar.monthYearPicker")
           }, {
-            default: withCtx(() => [
-              createTextVNode(
-                toDisplayString($setup.d($setup.viewMonth, { month: "long", year: "numeric" })),
-                1
-                /* TEXT */
-              )
+            default: withCtx(({ trigger }) => [
+              createVNode($setup["OnyxButton"], mergeProps({
+                color: "neutral",
+                label: $setup.d($setup.viewMonth, { month: "long", year: "numeric" }),
+                mode: "plain"
+              }, trigger), null, 16, ["label"])
+            ]),
+            content: withCtx(() => [
+              createVNode($setup["OnyxMonthYearPickerGrid"], {
+                open: $setup.isPickerOpen,
+                mode: $setup.pickerMode,
+                "view-month": $setup.viewMonth,
+                onSelectYear: $setup.handleYearSelect,
+                onSelectMonth: $setup.handleMonthSelect
+              }, null, 8, ["open", "mode", "view-month"])
             ]),
             _: 1
             /* STABLE */
-          }),
+          }, 8, ["open", "label"])),
           $setup.showCalendarWeeks && $setup.calendarSize === "big" ? (openBlock(), createBlock($setup["OnyxTag"], {
-            key: 0,
+            key: 2,
             color: "primary",
             label: $setup.calendarWeeksDisplay
-          }, null, 8, ["label"])) : createCommentVNode("v-if", true),
-          createVNode($setup["OnyxIconButton"], {
-            class: "control-container__prev-month-button",
-            label: $setup.t("calendar.previousMonthButton"),
-            color: "neutral",
-            icon: $setup.iconChevronLeftSmall,
-            disabled: $setup.disabled === true,
-            onClick: _cache[0] || (_cache[0] = ($event) => $setup.goToMonthByOffset(-1))
-          }, null, 8, ["label", "icon", "disabled"]),
-          createVNode($setup["OnyxIconButton"], {
-            class: "control-container__next-month-button",
-            label: $setup.t("calendar.nextMonthButton"),
-            color: "neutral",
-            icon: $setup.iconChevronRightSmall,
-            disabled: $setup.disabled === true,
-            onClick: _cache[1] || (_cache[1] = ($event) => $setup.goToMonthByOffset(1))
-          }, null, 8, ["label", "icon", "disabled"])
+          }, null, 8, ["label"])) : createCommentVNode("v-if", true)
         ]),
-        createElementVNode("div", _hoisted_3$u, [
+        createElementVNode("div", _hoisted_4$m, [
           renderSlot(_ctx.$slots, "actions")
         ])
       ]),
-      createElementVNode("div", _hoisted_4$m, [
-        createElementVNode(
+      createElementVNode("div", _hoisted_5$g, [
+        $setup.calendarSize === "small" && $setup.isPickerOpen ? (openBlock(), createBlock($setup["OnyxMonthYearPickerGrid"], {
+          key: 0,
+          ref: "pickerSmallRef",
+          open: $setup.isPickerOpen,
+          mode: $setup.pickerMode,
+          "view-month": $setup.viewMonth,
+          onSelectYear: $setup.handleYearSelect,
+          onSelectMonth: $setup.handleMonthSelect
+        }, null, 8, ["open", "mode", "view-month"])) : (openBlock(), createElementBlock(
           "table",
-          normalizeProps(guardReactiveProps($setup.tableProps)),
+          normalizeProps(mergeProps({ key: 1 }, $setup.tableProps)),
           [
             createElementVNode("thead", null, [
               createElementVNode("tr", null, [
@@ -5598,7 +5702,7 @@ function _sfc_render$1b(_ctx, _cache, $props, $setup, $data, $options) {
                       key: header,
                       scope: "col",
                       abbr: header
-                    }, toDisplayString(header), 9, _hoisted_5$g);
+                    }, toDisplayString(header), 9, _hoisted_6$c);
                   }),
                   128
                   /* KEYED_FRAGMENT */
@@ -5668,14 +5772,14 @@ function _sfc_render$1b(_ctx, _cache, $props, $setup, $data, $options) {
           ],
           16
           /* FULL_PROPS */
-        )
+        ))
       ])
     ],
     2
     /* CLASS */
   ));
 }
-const OnyxCalendar = /* @__PURE__ */ _export_sfc(_sfc_main$1b, [["render", _sfc_render$1b], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCalendar/OnyxCalendar.vue"]]);
+const OnyxCalendar = /* @__PURE__ */ _export_sfc(_sfc_main$1c, [["render", _sfc_render$1c], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCalendar/OnyxCalendar.vue"]]);
 const useRequired = (props, requiredMarker) => ({
   /**
    * Class that configures which type of required marker is used.
@@ -5891,7 +5995,7 @@ const formatMinMax = (locale, type, value) => {
   };
   return date.toLocaleString(locale, format);
 };
-const _sfc_main$1a = /* @__PURE__ */ defineComponent({
+const _sfc_main$1b = /* @__PURE__ */ defineComponent({
   __name: "OnyxErrorTooltip",
   props: {
     errorMessages: { type: Object, required: false },
@@ -5912,7 +6016,7 @@ const _hoisted_2$J = {
   key: 0,
   ref: "targetRef"
 };
-function _sfc_render$1a(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1b(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", _hoisted_1$X, [
     !$setup.tooltipError || $setup.props.disabled ? (openBlock(), createElementBlock(
       "div",
@@ -5949,8 +6053,8 @@ function _sfc_render$1a(_ctx, _cache, $props, $setup, $data, $options) {
     ], 8, ["to"])) : createCommentVNode("v-if", true)
   ]);
 }
-const OnyxErrorTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$1a, [["render", _sfc_render$1a], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxErrorTooltip/OnyxErrorTooltip.vue"]]);
-const _sfc_main$19 = /* @__PURE__ */ defineComponent({
+const OnyxErrorTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$1b, [["render", _sfc_render$1b], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxErrorTooltip/OnyxErrorTooltip.vue"]]);
+const _sfc_main$1a = /* @__PURE__ */ defineComponent({
   ...{ inheritAttrs: false },
   __name: "OnyxCheckbox",
   props: {
@@ -6000,7 +6104,7 @@ const _sfc_main$19 = /* @__PURE__ */ defineComponent({
 const _hoisted_1$W = ["title"];
 const _hoisted_2$I = { class: "onyx-checkbox__container" };
 const _hoisted_3$t = ["aria-label", "indeterminate", "disabled", "required", "value", "autofocus"];
-function _sfc_render$19(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$1a(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createElementBlock(
     "div",
     mergeProps({
@@ -6085,7 +6189,7 @@ function _sfc_render$19(_ctx, _cache, $props, $setup, $data, $options) {
     /* STABLE */
   }, 16, ["disabled", "error-messages"]));
 }
-const OnyxCheckbox = /* @__PURE__ */ _export_sfc(_sfc_main$19, [["render", _sfc_render$19], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCheckbox/OnyxCheckbox.vue"]]);
+const OnyxCheckbox = /* @__PURE__ */ _export_sfc(_sfc_main$1a, [["render", _sfc_render$1a], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCheckbox/OnyxCheckbox.vue"]]);
 const useSelectAllCheckboxState = (enabledOptionValues, modelValue) => computed(() => {
   const currentValues = modelValue.value.filter(
     (value) => enabledOptionValues.value.includes(value)
@@ -6120,7 +6224,7 @@ const useCheckAll = (enabledOptionValues, modelValue, onChangeCallback) => {
     }
   };
 };
-const _sfc_main$18 = /* @__PURE__ */ defineComponent({
+const _sfc_main$19 = /* @__PURE__ */ defineComponent({
   __name: "OnyxInfoTooltip",
   props: {
     text: { type: String, required: true },
@@ -6157,7 +6261,7 @@ const _sfc_main$18 = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$V = { class: "onyx-component onyx-info-tooltip" };
-function _sfc_render$18(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$19(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("span", _hoisted_1$V, [
     $setup.triggerType === "click" ? (openBlock(), createBlock($setup["OnyxTooltip"], mergeProps({ key: 0 }, $setup.tooltipProps, {
       open: $setup.isVisible,
@@ -6216,8 +6320,8 @@ function _sfc_render$18(_ctx, _cache, $props, $setup, $data, $options) {
     ))
   ]);
 }
-const OnyxInfoTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$18, [["render", _sfc_render$18], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxInfoTooltip/OnyxInfoTooltip.vue"]]);
-const _sfc_main$17 = /* @__PURE__ */ defineComponent({
+const OnyxInfoTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$19, [["render", _sfc_render$19], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxInfoTooltip/OnyxInfoTooltip.vue"]]);
+const _sfc_main$18 = /* @__PURE__ */ defineComponent({
   __name: "OnyxCheckboxGroup",
   props: {
     truncation: { type: null, required: false, default: "ellipsis" },
@@ -6280,7 +6384,7 @@ const _hoisted_2$H = {
   key: 0,
   class: "onyx-checkbox-group__label"
 };
-function _sfc_render$17(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$18(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("fieldset", {
     class: normalizeClass(["onyx-component", "onyx-checkbox-group", $setup.densityClass]),
     disabled: $setup.disabled,
@@ -6368,10 +6472,10 @@ function _sfc_render$17(_ctx, _cache, $props, $setup, $data, $options) {
     )
   ], 10, _hoisted_1$U);
 }
-const OnyxCheckboxGroup = /* @__PURE__ */ _export_sfc(_sfc_main$17, [["render", _sfc_render$17], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCheckboxGroup/OnyxCheckboxGroup.vue"]]);
+const OnyxCheckboxGroup = /* @__PURE__ */ _export_sfc(_sfc_main$18, [["render", _sfc_render$18], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCheckboxGroup/OnyxCheckboxGroup.vue"]]);
 const CODE_TABS_INJECTION_KEY = /* @__PURE__ */ Symbol();
 const TABS_INJECTION_KEY = /* @__PURE__ */ Symbol();
-const _sfc_main$16 = /* @__PURE__ */ defineComponent({
+const _sfc_main$17 = /* @__PURE__ */ defineComponent({
   ...{ inheritAttrs: false },
   __name: "OnyxTab",
   props: {
@@ -6404,7 +6508,7 @@ const _sfc_main$16 = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$T = ["disabled"];
 const _hoisted_2$G = { class: "onyx-tab__label" };
-function _sfc_render$16(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$17(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     Fragment,
     null,
@@ -6459,9 +6563,9 @@ function _sfc_render$16(_ctx, _cache, $props, $setup, $data, $options) {
     /* STABLE_FRAGMENT */
   );
 }
-const OnyxTab = /* @__PURE__ */ _export_sfc(_sfc_main$16, [["render", _sfc_render$16], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxTab/OnyxTab.vue"]]);
+const OnyxTab = /* @__PURE__ */ _export_sfc(_sfc_main$17, [["render", _sfc_render$17], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxTab/OnyxTab.vue"]]);
 const __default__$5 = {};
-const _sfc_main$15 = /* @__PURE__ */ defineComponent({
+const _sfc_main$16 = /* @__PURE__ */ defineComponent({
   ...__default__$5,
   __name: "OnyxCodeTab",
   props: {
@@ -6511,7 +6615,7 @@ const _hoisted_2$F = {
   key: 0,
   class: "onyx-code-tab__language onyx-text--small"
 };
-function _sfc_render$15(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$16(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock($setup["OnyxTab"], mergeProps($setup.tabProps, {
     label: $setup.label,
     class: "onyx-code-tab",
@@ -6576,8 +6680,8 @@ function _sfc_render$15(_ctx, _cache, $props, $setup, $data, $options) {
     /* FORWARDED */
   }, 16, ["label", "disabled"]);
 }
-const OnyxCodeTab = /* @__PURE__ */ _export_sfc(_sfc_main$15, [["render", _sfc_render$15], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCodeTab/OnyxCodeTab.vue"]]);
-const _sfc_main$14 = /* @__PURE__ */ defineComponent({
+const OnyxCodeTab = /* @__PURE__ */ _export_sfc(_sfc_main$16, [["render", _sfc_render$16], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCodeTab/OnyxCodeTab.vue"]]);
+const _sfc_main$15 = /* @__PURE__ */ defineComponent({
   __name: "OnyxTabs",
   props: {
     density: { type: null, required: false },
@@ -6621,7 +6725,7 @@ const _hoisted_2$E = {
   key: 0,
   class: "onyx-tabs__actions"
 };
-function _sfc_render$14(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$15(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     {
@@ -6653,9 +6757,9 @@ function _sfc_render$14(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   );
 }
-const OnyxTabs = /* @__PURE__ */ _export_sfc(_sfc_main$14, [["render", _sfc_render$14], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxTabs/OnyxTabs.vue"]]);
+const OnyxTabs = /* @__PURE__ */ _export_sfc(_sfc_main$15, [["render", _sfc_render$15], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxTabs/OnyxTabs.vue"]]);
 const __default__$4 = {};
-const _sfc_main$13 = /* @__PURE__ */ defineComponent({
+const _sfc_main$14 = /* @__PURE__ */ defineComponent({
   ...__default__$4,
   __name: "OnyxCodeTabs",
   props: {
@@ -6697,7 +6801,7 @@ const _sfc_main$13 = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$13(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$14(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock($setup["OnyxTabs"], mergeProps($setup.tabsProps, {
     modelValue: $setup.modelValue,
     "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => $setup.modelValue = $event),
@@ -6730,13 +6834,13 @@ function _sfc_render$13(_ctx, _cache, $props, $setup, $data, $options) {
     /* FORWARDED */
   }, 16, ["modelValue", "label"]);
 }
-const OnyxCodeTabs = /* @__PURE__ */ _export_sfc(_sfc_main$13, [["render", _sfc_render$13], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCodeTabs/OnyxCodeTabs.vue"]]);
+const OnyxCodeTabs = /* @__PURE__ */ _export_sfc(_sfc_main$14, [["render", _sfc_render$14], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxCodeTabs/OnyxCodeTabs.vue"]]);
 const escapeCSS = (key) => {
   const name = typeof key === "symbol" && key.description ? key.description : String(key);
   if (globalThis.window && window.CSS) return CSS.escape(name);
   return name.replace(/\W/g, "-");
 };
-const _sfc_main$12 = {};
+const _sfc_main$13 = {};
 const _hoisted_1$Q = {
   xmlns: "http://www.w3.org/2000/svg",
   class: "onyx-component onyx-empty-svg",
@@ -6746,13 +6850,13 @@ const _hoisted_1$Q = {
   fill: "none",
   "aria-hidden": "true"
 };
-function _sfc_render$12(_ctx, _cache) {
+function _sfc_render$13(_ctx, _cache) {
   return openBlock(), createElementBlock("svg", _hoisted_1$Q, [..._cache[0] || (_cache[0] = [
     createStaticVNode('<g clip-path="url(#clip0_19774_64940)"><path d="M41.0399 39.4974L13.073 46.6992C12.1243 46.9423 11.118 46.7992 10.2747 46.3013C9.43136 45.8034 8.82 44.9913 8.5747 44.0432L0.11726 11.1984C-0.12588 10.2497 0.0172077 9.24332 0.515132 8.40001C1.01306 7.55671 1.82515 6.94535 2.77327 6.70005L28.7919 0L35.4509 2.98115L43.6959 34.999C43.9391 35.9477 43.796 36.9541 43.2981 37.7974C42.8002 38.6408 41.988 39.2522 41.0399 39.4974Z" fill="var(--onyx-empty-svg-color-border-light)"></path><path d="M3.03786 7.7294C2.36269 7.90408 1.78436 8.33943 1.42977 8.93996C1.07518 9.54049 0.973281 10.2571 1.14642 10.9327L9.60439 43.7776C9.77906 44.4528 10.2144 45.0311 10.8149 45.3857C11.4155 45.7403 12.1321 45.8422 12.8077 45.6691L40.7746 38.4675C41.4498 38.2928 42.0281 37.8574 42.3827 37.2569C42.7373 36.6564 42.8392 35.9397 42.666 35.2641L34.5488 3.74208L28.6963 1.12207L3.03786 7.7294Z" fill="var(--onyx-empty-svg-color-background)"></path><path d="M35.3801 3.15071L31.0518 4.2653C30.7358 4.34666 30.4005 4.29916 30.1195 4.13326C29.8386 3.96736 29.635 3.69665 29.5536 3.38068L28.7304 0.183878C28.7269 0.16989 28.7273 0.155176 28.7317 0.141419C28.7361 0.127663 28.7442 0.115419 28.7553 0.106091C28.7663 0.0967629 28.7797 0.0907273 28.794 0.0886731C28.8083 0.0866188 28.8229 0.0886288 28.8361 0.0944753L35.3921 3.00598C35.4067 3.01247 35.4189 3.02333 35.427 3.03707C35.4352 3.0508 35.4388 3.06673 35.4375 3.08263C35.4362 3.09854 35.4299 3.11363 35.4196 3.12583C35.4094 3.13803 35.3955 3.14673 35.3801 3.15071Z" fill="var(--onyx-empty-svg-color-border-light)"></path><path d="M33.1031 31.199L20.3701 34.4782C20.2125 34.5178 20.0456 34.4934 19.9059 34.4104C19.7661 34.3274 19.6649 34.1924 19.6244 34.035C19.5839 33.8776 19.6073 33.7105 19.6896 33.5703C19.7718 33.4301 19.9062 33.3282 20.0634 33.2868L32.7963 30.0076C32.8747 29.987 32.9564 29.982 33.0367 29.993C33.1171 30.0041 33.1944 30.0308 33.2643 30.0719C33.3343 30.1129 33.3954 30.1673 33.4442 30.2321C33.493 30.2968 33.5285 30.3705 33.5488 30.4491C33.569 30.5276 33.5735 30.6093 33.562 30.6896C33.5505 30.7698 33.5233 30.847 33.4819 30.9167C33.4404 30.9864 33.3857 31.0472 33.3206 31.0957C33.2556 31.1441 33.1817 31.1792 33.1031 31.199Z" fill="var(--onyx-empty-svg-color-border)"></path><path d="M36.0778 32.5772L20.8876 36.4889C20.8092 36.5095 20.7275 36.5145 20.6472 36.5034C20.5669 36.4924 20.4895 36.4656 20.4196 36.4246C20.3497 36.3836 20.2885 36.3291 20.2397 36.2644C20.1909 36.1997 20.1554 36.1259 20.1352 36.0474C20.1149 35.9689 20.1104 35.8872 20.1219 35.8069C20.1334 35.7267 20.1606 35.6495 20.2021 35.5798C20.2435 35.5101 20.2983 35.4493 20.3633 35.4008C20.4283 35.3524 20.5022 35.3172 20.5808 35.2975L35.771 31.3858C35.9286 31.3461 36.0956 31.3705 36.2353 31.4535C36.375 31.5366 36.4762 31.6715 36.5167 31.8289C36.5573 31.9863 36.5338 32.1534 36.4516 32.2936C36.3693 32.4338 36.2349 32.5357 36.0778 32.5772Z" fill="var(--onyx-empty-svg-color-border)"></path><path d="M15.1732 38.4265C16.374 38.4265 17.3474 37.4531 17.3474 36.2523C17.3474 35.0515 16.374 34.0781 15.1732 34.0781C13.9724 34.0781 12.999 35.0515 12.999 36.2523C12.999 37.4531 13.9724 38.4265 15.1732 38.4265Z" fill="var(--onyx-empty-svg-color-primary)"></path><path d="M31.7486 25.5099L14.8379 29.863C14.3492 29.9882 13.8308 29.9144 13.3963 29.6579C12.9619 29.4013 12.647 28.9829 12.5207 28.4945L8.977 14.7275C8.8519 14.2388 8.92572 13.7205 9.18226 13.2862C9.43881 12.8519 9.85713 12.537 10.3455 12.4107L27.2561 8.05767C27.7448 7.93244 28.2633 8.0062 28.6977 8.26275C29.1321 8.5193 29.447 8.93771 29.5733 9.42615L33.1171 23.1931C33.2422 23.6818 33.1684 24.2001 32.9119 24.6345C32.6553 25.0688 32.237 25.3836 31.7486 25.5099Z" fill="var(--onyx-empty-svg-color-background)"></path><path d="M31.7486 25.5099L14.8379 29.863C14.3492 29.9882 13.8308 29.9144 13.3963 29.6579C12.9619 29.4013 12.647 28.9829 12.5207 28.4945L8.977 14.7275C8.8519 14.2388 8.92572 13.7205 9.18226 13.2862C9.43881 12.8519 9.85713 12.537 10.3455 12.4107L27.2561 8.05767C27.7448 7.93244 28.2633 8.0062 28.6977 8.26275C29.1321 8.5193 29.447 8.93771 29.5733 9.42615L33.1171 23.1931C33.2422 23.6818 33.1684 24.2001 32.9119 24.6345C32.6553 25.0688 32.237 25.3836 31.7486 25.5099ZM10.4012 12.6271C9.97035 12.7387 9.60129 13.0166 9.37502 13.3999C9.14875 13.7832 9.08374 14.2406 9.19426 14.6717L12.7381 28.4387C12.8496 28.8696 13.1276 29.2387 13.5108 29.4649C13.8941 29.6912 14.3515 29.7562 14.7827 29.6457L31.693 25.2931C32.1239 25.1815 32.4929 24.9036 32.7192 24.5203C32.9455 24.137 33.0105 23.6796 32.9 23.2485L29.3565 9.48148C29.2449 9.05059 28.967 8.68153 28.5837 8.45526C28.2004 8.22899 27.743 8.16399 27.3118 8.2745L10.4012 12.6271Z" fill="var(--onyx-empty-svg-color-border)"></path><path d="M26.3983 12.6856L17.864 14.8825C17.7894 14.9034 17.7096 14.8951 17.6409 14.8594C17.5722 14.8237 17.5195 14.7633 17.4936 14.6903C17.4816 14.6521 17.4775 14.6119 17.4815 14.5721C17.4855 14.5323 17.4975 14.4937 17.517 14.4587C17.5364 14.4237 17.5627 14.3931 17.5944 14.3686C17.626 14.3442 17.6623 14.3264 17.7011 14.3164L26.3887 12.0801C26.7397 12.2579 26.6473 12.6216 26.3984 12.6857L26.3983 12.6856Z" fill="var(--onyx-empty-svg-color-border-light)"></path><path d="M26.7836 14.1817L18.2492 16.3786C18.1746 16.3994 18.0949 16.3912 18.0262 16.3555C17.9574 16.3198 17.9048 16.2594 17.8789 16.1864C17.8669 16.1482 17.8627 16.108 17.8667 16.0682C17.8707 16.0284 17.8828 15.9898 17.9022 15.9548C17.9216 15.9198 17.948 15.8892 17.9796 15.8647C18.0113 15.8402 18.0476 15.8225 18.0863 15.8125L26.7739 13.5762C27.1249 13.754 27.0325 14.1177 26.7837 14.1818L26.7836 14.1817Z" fill="var(--onyx-empty-svg-color-border-light)"></path><path d="M16.6237 17.7065L14.019 18.3768C13.9769 18.3876 13.9331 18.3901 13.89 18.384C13.8469 18.3779 13.8055 18.3634 13.768 18.3413C13.7306 18.3191 13.6978 18.2899 13.6717 18.2551C13.6456 18.2203 13.6265 18.1807 13.6157 18.1386L12.8244 15.0656C12.8136 15.0235 12.8111 14.9796 12.8172 14.9366C12.8233 14.8935 12.8379 14.852 12.86 14.8146C12.8821 14.7771 12.9114 14.7444 12.9462 14.7183C12.9809 14.6921 13.0205 14.6731 13.0626 14.6623L15.6673 13.9918C15.7523 13.97 15.8426 13.9829 15.9182 14.0275C15.9938 14.0722 16.0486 14.145 16.0706 14.23L16.8619 17.3038C16.8727 17.3459 16.8752 17.3897 16.8691 17.4328C16.863 17.4759 16.8484 17.5173 16.8263 17.5548C16.8042 17.5922 16.7749 17.6249 16.7401 17.6511C16.7054 17.6772 16.6658 17.6962 16.6237 17.7071V17.7065Z" fill="var(--onyx-empty-svg-color-primary)"></path><path d="M27.5479 17.2541L14.5227 20.6069C14.4481 20.6277 14.3683 20.6195 14.2996 20.5838C14.2309 20.5481 14.1782 20.4877 14.1523 20.4147C14.1403 20.3765 14.1361 20.3363 14.1402 20.2965C14.1442 20.2567 14.1562 20.2181 14.1757 20.1831C14.1951 20.1481 14.2214 20.1175 14.2531 20.093C14.2847 20.0685 14.321 20.0508 14.3598 20.0408L27.5383 16.6484C27.8893 16.8263 27.7968 17.19 27.5479 17.2541Z" fill="var(--onyx-empty-svg-color-border-light)"></path><path d="M27.9334 18.752L14.9079 22.105C14.8333 22.1258 14.7536 22.1175 14.6848 22.0818C14.6161 22.0462 14.5635 21.9857 14.5376 21.9127C14.5255 21.8745 14.5214 21.8343 14.5254 21.7945C14.5294 21.7547 14.5415 21.7162 14.5609 21.6812C14.5803 21.6462 14.6067 21.6155 14.6383 21.5911C14.67 21.5666 14.7063 21.5488 14.745 21.5389L27.9236 18.1465C28.2746 18.3243 28.1822 18.688 27.9333 18.7521L27.9334 18.752Z" fill="var(--onyx-empty-svg-color-border-light)"></path><path d="M28.3189 20.2482L15.2936 23.6011C15.2191 23.6219 15.1393 23.6136 15.0706 23.5779C15.0018 23.5422 14.9492 23.4818 14.9233 23.4088C14.9113 23.3706 14.9071 23.3304 14.9112 23.2906C14.9152 23.2508 14.9272 23.2123 14.9466 23.1773C14.9661 23.1423 14.9924 23.1116 15.0241 23.0872C15.0557 23.0627 15.092 23.0449 15.1308 23.035L28.3092 19.6426C28.6602 19.8204 28.5678 20.1841 28.3189 20.2482Z" fill="var(--onyx-empty-svg-color-border-light)"></path><path d="M28.7043 21.7453L15.6789 25.0981C15.6043 25.119 15.5246 25.1107 15.4558 25.075C15.3871 25.0393 15.3345 24.9789 15.3086 24.9059C15.2965 24.8677 15.2924 24.8275 15.2964 24.7877C15.3004 24.7479 15.3125 24.7093 15.3319 24.6743C15.3513 24.6394 15.3777 24.6087 15.4093 24.5842C15.441 24.5598 15.4773 24.542 15.516 24.532L28.6946 21.1396C29.0455 21.3175 28.9532 21.6812 28.7043 21.7453Z" fill="var(--onyx-empty-svg-color-border-light)"></path><path d="M29.0894 23.2423L16.0642 26.5952C15.9896 26.616 15.9098 26.6078 15.8411 26.5721C15.7724 26.5364 15.7197 26.4759 15.6938 26.4029C15.6818 26.3648 15.6776 26.3246 15.6817 26.2848C15.6857 26.245 15.6977 26.2064 15.7172 26.1714C15.7366 26.1364 15.7629 26.1058 15.7946 26.0813C15.8262 26.0568 15.8625 26.0391 15.9013 26.0291L29.0798 22.6367C29.4307 22.8146 29.3383 23.1783 29.0894 23.2423Z" fill="var(--onyx-empty-svg-color-border-light)"></path><path d="M15.3334 37.0148C15.2861 37.0271 15.236 37.0237 15.1908 37.005L15.188 37.0038L14.5957 36.7527C14.5683 36.741 14.5434 36.7241 14.5225 36.7028C14.5016 36.6815 14.4852 36.6563 14.474 36.6287C14.4628 36.601 14.4572 36.5714 14.4575 36.5416C14.4578 36.5118 14.464 36.4823 14.4756 36.4549C14.4873 36.4274 14.5043 36.4026 14.5255 36.3817C14.5468 36.3608 14.572 36.3443 14.5997 36.3331C14.6273 36.322 14.6569 36.3164 14.6867 36.3167C14.7166 36.3169 14.746 36.3231 14.7735 36.3348L15.1573 36.498L15.6601 35.3149C15.6837 35.2595 15.7283 35.2157 15.7841 35.1932C15.8399 35.1707 15.9024 35.1713 15.9578 35.1949L15.9548 35.2025L15.9579 35.1947C16.0133 35.2184 16.0571 35.263 16.0796 35.3188C16.1021 35.3746 16.1015 35.4371 16.078 35.4925L15.4863 36.8836C15.4726 36.9156 15.4517 36.9441 15.4252 36.9668C15.3987 36.9895 15.3673 37.0057 15.3335 37.0143L15.3334 37.0148Z" fill="var(--onyx-empty-svg-color-background)"></path><path d="M68.4929 48.1388L40.1442 42.6284C39.183 42.4404 38.3356 41.8788 37.788 41.0669C37.2403 40.2549 37.0372 39.2588 37.223 38.2972L43.6946 5.00397C43.8825 4.04283 44.4441 3.19548 45.256 2.64784C46.0679 2.1002 47.0639 1.89697 48.0255 2.08276L74.3993 7.20932L79.1324 12.7622L72.8238 45.2173C72.6359 46.1785 72.0744 47.0259 71.2625 47.5736C70.4505 48.1214 69.4545 48.3246 68.4929 48.1388Z" fill="var(--onyx-empty-svg-color-border)"></path><path d="M47.8229 3.12594C47.1381 2.99365 46.4289 3.13837 45.8507 3.52835C45.2725 3.91833 44.8727 4.52173 44.7388 5.20617L38.2673 38.4994C38.135 39.1841 38.2797 39.8934 38.6697 40.4716C39.0596 41.0497 39.663 41.4496 40.3475 41.5835L68.6962 47.0939C69.3809 47.2262 70.0902 47.0815 70.6684 46.6915C71.2465 46.3015 71.6464 45.6981 71.7803 45.0137L77.9911 13.0616L73.8316 8.18153L47.8229 3.12594Z" fill="var(--onyx-empty-svg-color-background)"></path><path d="M68.7754 17.246L55.8686 14.7371C55.7085 14.706 55.5672 14.6125 55.476 14.4773C55.3848 14.342 55.351 14.1761 55.3821 14.0159C55.4133 13.8558 55.5067 13.7146 55.642 13.6233C55.7772 13.5321 55.9432 13.4984 56.1033 13.5295L69.0104 16.0384C69.1706 16.0695 69.3118 16.163 69.403 16.2982C69.4942 16.4335 69.528 16.5994 69.4969 16.7596C69.4658 16.9197 69.3723 17.0609 69.237 17.1522C69.1018 17.2434 68.9358 17.2772 68.7757 17.246L68.7754 17.246Z" fill="var(--onyx-empty-svg-color-primary)"></path><path d="M70.8707 19.7682L55.4731 16.7752C55.3129 16.7441 55.1717 16.6506 55.0805 16.5154C54.9893 16.3801 54.9555 16.2142 54.9866 16.054C55.0178 15.8939 55.1112 15.7527 55.2465 15.6614C55.3817 15.5702 55.5477 15.5364 55.7078 15.5676L71.1054 18.5606C71.2656 18.5917 71.4068 18.6852 71.498 18.8204C71.5892 18.9557 71.623 19.1216 71.5919 19.2818C71.5608 19.4419 71.4673 19.5831 71.332 19.6744C71.1968 19.7656 71.0308 19.7994 70.8707 19.7682Z" fill="var(--onyx-empty-svg-color-primary)"></path><path d="M67.2353 25.1701L54.3289 22.6613C54.1687 22.6302 54.0028 22.6639 53.8676 22.7552C53.7323 22.8464 53.6389 22.9876 53.6077 23.1477C53.5766 23.3079 53.6104 23.4738 53.7016 23.609C53.7928 23.7443 53.934 23.8377 54.0942 23.8689L67.0006 26.3776C67.1598 26.4064 67.3238 26.3713 67.4573 26.28C67.5908 26.1887 67.683 26.0484 67.7138 25.8897C67.7447 25.7309 67.7118 25.5664 67.6222 25.4317C67.5327 25.297 67.3937 25.203 67.2353 25.1701Z" fill="var(--onyx-empty-svg-color-border)"></path><path d="M69.33 27.693L53.9326 24.7C53.8528 24.6834 53.7706 24.6828 53.6906 24.6983C53.6106 24.7137 53.5345 24.7449 53.4666 24.79C53.3988 24.8351 53.3406 24.8933 53.2954 24.9611C53.2502 25.0288 53.219 25.1049 53.2034 25.1849C53.1879 25.2649 53.1884 25.3471 53.2049 25.4269C53.2214 25.5067 53.2536 25.5824 53.2996 25.6496C53.3456 25.7168 53.4045 25.7743 53.4728 25.8185C53.5412 25.8628 53.6177 25.8931 53.6979 25.9076L69.0951 28.9005C69.1749 28.9171 69.2571 28.9177 69.3371 28.9022C69.4171 28.8868 69.4932 28.8556 69.5611 28.8105C69.6289 28.7654 69.6871 28.7073 69.7323 28.6395C69.7775 28.5717 69.8087 28.4956 69.8243 28.4157C69.8398 28.3357 69.8393 28.2534 69.8228 28.1737C69.8063 28.0939 69.7741 28.0182 69.7281 27.9509C69.6821 27.8837 69.6232 27.8263 69.5549 27.782C69.4865 27.7377 69.4101 27.7075 69.33 27.693Z" fill="var(--onyx-empty-svg-color-border)"></path><path d="M65.2251 35.5116L52.3183 33.0028C52.1582 32.9716 52.0169 32.8782 51.9257 32.7429C51.8345 32.6077 51.8007 32.4417 51.8318 32.2816C51.863 32.1214 51.9564 31.9802 52.0917 31.889C52.227 31.7977 52.3929 31.764 52.5531 31.7951L65.4601 34.304C65.6203 34.3351 65.7615 34.4286 65.8527 34.5638C65.944 34.6991 65.9777 34.865 65.9466 35.0252C65.9155 35.1853 65.822 35.3266 65.6867 35.4178C65.5515 35.509 65.3855 35.5428 65.2254 35.5117L65.2251 35.5116Z" fill="var(--onyx-empty-svg-color-border)"></path><path d="M67.3199 38.0338L51.9223 35.0409C51.7622 35.0097 51.6209 34.9163 51.5297 34.781C51.4385 34.6458 51.4047 34.4798 51.4358 34.3197C51.467 34.1595 51.5605 34.0183 51.6957 33.9271C51.831 33.8358 51.9969 33.8021 52.1571 33.8332L67.5546 36.8262C67.7148 36.8573 67.856 36.9508 67.9472 37.086C68.0385 37.2213 68.0722 37.3872 68.0411 37.5474C68.01 37.7075 67.9165 37.8488 67.7812 37.94C67.646 38.0312 67.48 38.065 67.3199 38.0338Z" fill="var(--onyx-empty-svg-color-border)"></path><path d="M49.9984 16.2409C51.1771 16.47 52.3183 15.7003 52.5475 14.5215C52.7766 13.3428 52.0068 12.2016 50.8281 11.9725C49.6494 11.7434 48.5081 12.5131 48.279 13.6918C48.0499 14.8705 48.8197 16.0118 49.9984 16.2409Z" fill="var(--onyx-empty-svg-color-primary)"></path><path d="M50.0439 14.8798C49.9958 14.8705 49.9521 14.8459 49.9193 14.8097L49.9172 14.8074L49.4902 14.3261C49.4512 14.2809 49.4316 14.2222 49.4356 14.1626C49.4396 14.103 49.4669 14.0474 49.5116 14.0078C49.5564 13.9682 49.6149 13.9479 49.6745 13.9511C49.7341 13.9543 49.7901 13.9809 49.8302 14.0251L50.1068 14.3374L51.069 13.4851C51.0913 13.4653 51.1173 13.4501 51.1455 13.4404C51.1737 13.4307 51.2035 13.4266 51.2333 13.4284C51.2631 13.4303 51.2922 13.4379 51.319 13.451C51.3458 13.4641 51.3697 13.4823 51.3895 13.5046L51.3835 13.5101L51.3897 13.5044C51.4296 13.5495 51.4499 13.6086 51.4463 13.6687C51.4426 13.7288 51.4153 13.785 51.3702 13.8249L50.2381 14.827C50.2119 14.8501 50.1808 14.8668 50.1471 14.8759C50.1135 14.885 50.0781 14.8862 50.0439 14.8795L50.0439 14.8798Z" fill="var(--onyx-empty-svg-color-background)"></path><path d="M50.9918 23.6976C50.9374 23.9779 50.8284 24.2448 50.6708 24.483C50.5133 24.7211 50.3104 24.9259 50.0737 25.0857C49.837 25.2454 49.5712 25.3569 49.2914 25.4139C49.0116 25.4709 48.7233 25.4722 48.443 25.4178C48.4246 25.4146 48.4064 25.4103 48.3885 25.4049C47.9709 25.3126 47.5899 25.0992 47.2931 24.7914C46.9962 24.4836 46.7967 24.0951 46.7196 23.6744C46.6424 23.2538 46.691 22.8198 46.8593 22.4267C47.0276 22.0336 47.3081 21.6988 47.6657 21.4643C48.0232 21.2298 48.442 21.106 48.8697 21.1083C49.2973 21.1106 49.7147 21.239 50.0697 21.4774C50.4247 21.7157 50.7016 22.0535 50.8656 22.4484C51.0296 22.8433 51.0735 23.2779 50.9918 23.6976Z" fill="var(--onyx-empty-svg-color-primary)"></path><path d="M46.4481 34.5075C47.6268 34.7366 48.768 33.9669 48.9972 32.7882C49.2263 31.6094 48.4565 30.4682 47.2778 30.2391C46.0991 30.01 44.9578 30.7797 44.7287 31.9584C44.4996 33.1371 45.2694 34.2784 46.4481 34.5075Z" fill="var(--onyx-empty-svg-color-primary)"></path><path d="M78.9955 12.8845L74.6082 12.0317C74.2879 11.9694 74.0054 11.7825 73.823 11.512C73.6405 11.2415 73.573 10.9096 73.6353 10.5893L74.2651 7.34888C74.2679 7.3347 74.2746 7.32158 74.2845 7.31104C74.2943 7.30049 74.307 7.29294 74.321 7.28925C74.3349 7.28556 74.3497 7.28588 74.3635 7.29017C74.3773 7.29447 74.3896 7.30256 74.399 7.31353L79.0686 12.7587C79.079 12.7708 79.0854 12.7859 79.0868 12.8017C79.0882 12.8176 79.0847 12.8336 79.0767 12.8474C79.0686 12.8612 79.0565 12.8721 79.042 12.8787C79.0275 12.8853 79.0113 12.8872 78.9956 12.8842L78.9955 12.8845Z" fill="var(--onyx-empty-svg-color-border)"></path><path d="M52.9892 45.2832C52.8542 45.5047 52.6366 45.6634 52.3845 45.7245C52.1323 45.7856 51.8663 45.744 51.6448 45.6089L40.2315 38.6473C40.01 38.5122 39.8513 38.2947 39.7902 38.0425C39.7291 37.7904 39.7707 37.5243 39.9058 37.3028C40.0409 37.0813 40.2584 36.9226 40.5106 36.8615C40.7627 36.8004 41.0288 36.842 41.2503 36.9771L52.6635 43.9387C52.8849 44.0738 53.0437 44.2914 53.1047 44.5435C53.1658 44.7956 53.1243 45.0617 52.9892 45.2832Z" fill="var( --onyx-empty-svg-color-accent)"></path><path d="M41.576 38.3225C40.77 39.6438 39.5903 40.6965 38.1861 41.3474C36.7819 41.9984 35.2162 42.2183 33.687 41.9794C32.1578 41.7404 30.7338 41.0534 29.595 40.0052C28.4562 38.957 27.6539 37.5946 27.2894 36.0904C26.9249 34.5861 27.0147 33.0076 27.5473 31.5544C28.08 30.1012 29.0316 28.8385 30.2818 27.9262C31.5321 27.0138 33.0248 26.4926 34.5712 26.4286C36.1176 26.3645 37.6483 26.7605 38.9697 27.5664C39.8471 28.1015 40.6105 28.8042 41.2163 29.6344C41.8222 30.4645 42.2585 31.4059 42.5005 32.4047C42.7425 33.4035 42.7855 34.4401 42.6268 35.4555C42.4682 36.4709 42.1111 37.4451 41.576 38.3225ZM29.8844 31.1906C29.28 32.1816 28.983 33.3296 29.031 34.4895C29.079 35.6493 29.4699 36.7689 30.1542 37.7066C30.8385 38.6443 31.7855 39.358 32.8754 39.7575C33.9653 40.157 35.1492 40.2243 36.2774 39.9509C37.4056 39.6775 38.4274 39.0758 39.2135 38.2217C39.9997 37.3676 40.515 36.2996 40.6942 35.1527C40.8733 34.0057 40.7084 32.8314 40.2202 31.7783C39.732 30.7251 38.9424 29.8403 37.9514 29.2359C36.6224 28.4254 35.0259 28.176 33.5131 28.5425C32.0002 28.9091 30.695 29.8616 29.8844 31.1906Z" fill="var( --onyx-empty-svg-color-accent)"></path><path d="M32.8257 39.9229C36.0054 41.0177 39.4706 39.3276 40.5655 36.1479C41.6603 32.9682 39.9702 29.503 36.7905 28.4082C33.6108 27.3133 30.1456 29.0034 29.0508 32.1831C27.9559 35.3628 29.646 38.828 32.8257 39.9229Z" fill="var(--onyx-empty-svg-color-primary)"></path></g><defs><clipPath id="clip0_19774_64940"><rect width="80" height="48.8428" fill="white"></rect></clipPath></defs>', 2)
   ])]);
 }
-const OnyxEmptySVG = /* @__PURE__ */ _export_sfc(_sfc_main$12, [["render", _sfc_render$12], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/illustrations/OnyxEmptySVG/OnyxEmptySVG.vue"]]);
-const _sfc_main$11 = /* @__PURE__ */ defineComponent({
+const OnyxEmptySVG = /* @__PURE__ */ _export_sfc(_sfc_main$13, [["render", _sfc_render$13], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/illustrations/OnyxEmptySVG/OnyxEmptySVG.vue"]]);
+const _sfc_main$12 = /* @__PURE__ */ defineComponent({
   __name: "OnyxEmpty",
   props: {
     density: { type: null, required: false }
@@ -6776,7 +6880,7 @@ const _hoisted_3$s = {
   key: 0,
   class: "onyx-empty__buttons"
 };
-function _sfc_render$11(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$12(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     {
@@ -6809,8 +6913,8 @@ function _sfc_render$11(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   );
 }
-const OnyxEmpty = /* @__PURE__ */ _export_sfc(_sfc_main$11, [["render", _sfc_render$11], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxEmpty/OnyxEmpty.vue"]]);
-const _sfc_main$10 = /* @__PURE__ */ defineComponent({
+const OnyxEmpty = /* @__PURE__ */ _export_sfc(_sfc_main$12, [["render", _sfc_render$12], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxEmpty/OnyxEmpty.vue"]]);
+const _sfc_main$11 = /* @__PURE__ */ defineComponent({
   __name: "OnyxTable",
   props: {
     density: { type: null, required: false },
@@ -6863,7 +6967,7 @@ const _hoisted_13 = {
   key: 1,
   class: "onyx-table-wrapper__bottom"
 };
-function _sfc_render$10(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$11(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     {
@@ -6968,8 +7072,8 @@ function _sfc_render$10(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS, STYLE */
   );
 }
-const OnyxTable = /* @__PURE__ */ _export_sfc(_sfc_main$10, [["render", _sfc_render$10], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxTable/OnyxTable.vue"]]);
-const _sfc_main$$ = /* @__PURE__ */ defineComponent({
+const OnyxTable = /* @__PURE__ */ _export_sfc(_sfc_main$11, [["render", _sfc_render$11], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxTable/OnyxTable.vue"]]);
+const _sfc_main$10 = /* @__PURE__ */ defineComponent({
   __name: "OnyxDataGridRenderer",
   props: {
     density: { type: null, required: false },
@@ -7006,7 +7110,7 @@ const _sfc_main$$ = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$$(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$10(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock($setup["OnyxTable"], mergeProps({ class: "onyx-data-grid" }, $setup.tableProps, {
     "scroll-container-attrs": $setup.mergeVueProps($setup.props.scrollContainerAttrs, { style: $setup.columnStyle })
   }), createSlots({
@@ -7113,8 +7217,8 @@ function _sfc_render$$(_ctx, _cache, $props, $setup, $data, $options) {
     })
   ]), 1040, ["scroll-container-attrs"]);
 }
-const OnyxDataGridRenderer = /* @__PURE__ */ _export_sfc(_sfc_main$$, [["render", _sfc_render$$], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDataGrid/OnyxDataGridRenderer/OnyxDataGridRenderer.vue"]]);
-const _sfc_main$_ = /* @__PURE__ */ defineComponent({
+const OnyxDataGridRenderer = /* @__PURE__ */ _export_sfc(_sfc_main$10, [["render", _sfc_render$10], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDataGrid/OnyxDataGridRenderer/OnyxDataGridRenderer.vue"]]);
+const _sfc_main$$ = /* @__PURE__ */ defineComponent({
   ...{ inheritAttrs: false },
   __name: "OnyxMiniSearch",
   props: {
@@ -7156,7 +7260,7 @@ const _sfc_main$_ = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$N = ["autofocus", "placeholder", "aria-label"];
 const _hoisted_2$B = ["aria-label"];
-function _sfc_render$_(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$$(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     mergeProps({
@@ -7198,11 +7302,11 @@ function _sfc_render$_(_ctx, _cache, $props, $setup, $data, $options) {
     /* FULL_PROPS */
   );
 }
-const OnyxMiniSearch = /* @__PURE__ */ _export_sfc(_sfc_main$_, [["render", _sfc_render$_], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxMiniSearch/OnyxMiniSearch.vue"]]);
+const OnyxMiniSearch = /* @__PURE__ */ _export_sfc(_sfc_main$$, [["render", _sfc_render$$], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxMiniSearch/OnyxMiniSearch.vue"]]);
 const prepareMapping = (features, key) => features.flatMap((f) => f[key]).filter((f) => f?.func).sort((a, b) => (a?.order ?? 0) - (b?.order ?? 0));
 const applyMapping = (mapping, input2) => mapping.reduce((output, m) => m.func(output), input2);
 const DataGridRowOptionsSymbol = /* @__PURE__ */ Symbol("RowOptions");
-const _sfc_main$Z = /* @__PURE__ */ defineComponent({
+const _sfc_main$_ = /* @__PURE__ */ defineComponent({
   __name: "HeaderCell",
   props: {
     label: { type: String, required: true }
@@ -7222,7 +7326,7 @@ const _hoisted_3$q = {
   key: 0,
   class: "onyx-data-grid-header-cell__actions"
 };
-function _sfc_render$Z(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$_(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", _hoisted_1$M, [
     createElementVNode(
       "span",
@@ -7236,7 +7340,7 @@ function _sfc_render$Z(_ctx, _cache, $props, $setup, $data, $options) {
     ])) : createCommentVNode("v-if", true)
   ]);
 }
-const HeaderCell = /* @__PURE__ */ _export_sfc(_sfc_main$Z, [["render", _sfc_render$Z], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDataGrid/features/HeaderCell.vue"]]);
+const HeaderCell = /* @__PURE__ */ _export_sfc(_sfc_main$_, [["render", _sfc_render$_], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDataGrid/features/HeaderCell.vue"]]);
 const FALLBACK_RENDER_VALUE = "-";
 const fallback = (opts) => opts?.fallback ?? FALLBACK_RENDER_VALUE;
 const createTypeRenderer = (typeRenderer) => Object.freeze(typeRenderer);
@@ -7738,7 +7842,7 @@ const useErrorClass = (showError) => computed(() => {
   }
   return "onyx-form-element--touched-invalid";
 });
-const _sfc_main$Y = /* @__PURE__ */ defineComponent({
+const _sfc_main$Z = /* @__PURE__ */ defineComponent({
   __name: "FormMessage",
   props: {
     messages: { type: Object, required: true },
@@ -7755,7 +7859,7 @@ const _sfc_main$Y = /* @__PURE__ */ defineComponent({
 const _hoisted_1$L = {
   class: /* @__PURE__ */ normalizeClass(["onyx-truncation-ellipsis"])
 };
-function _sfc_render$Y(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$Z(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock(resolveDynamicComponent($props.messages.hidden ? $setup.OnyxVisuallyHidden : "span"), {
     class: normalizeClass(["onyx-component", "onyx-form-message", `onyx-form-message__${$setup.props.type}`])
   }, {
@@ -7780,8 +7884,8 @@ function _sfc_render$Y(_ctx, _cache, $props, $setup, $data, $options) {
     /* STABLE */
   }, 8, ["class"]);
 }
-const FormMessage = /* @__PURE__ */ _export_sfc(_sfc_main$Y, [["render", _sfc_render$Y], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxFormElement/FormMessage.vue"]]);
-const _sfc_main$X = /* @__PURE__ */ defineComponent({
+const FormMessage = /* @__PURE__ */ _export_sfc(_sfc_main$Z, [["render", _sfc_render$Z], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxFormElement/FormMessage.vue"]]);
+const _sfc_main$Y = /* @__PURE__ */ defineComponent({
   __name: "OnyxFormElement",
   props: {
     disabled: { type: [Boolean, Symbol], required: false },
@@ -7864,7 +7968,7 @@ const _hoisted_3$p = {
   class: "onyx-form-element__footer onyx-text--small"
 };
 const _hoisted_4$k = { class: "onyx-form-element__footer-messages" };
-function _sfc_render$X(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$Y(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     {
@@ -7951,8 +8055,8 @@ function _sfc_render$X(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   );
 }
-const OnyxFormElement = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["render", _sfc_render$X], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxFormElement/OnyxFormElement.vue"]]);
-const _sfc_main$W = /* @__PURE__ */ defineComponent({
+const OnyxFormElement = /* @__PURE__ */ _export_sfc(_sfc_main$Y, [["render", _sfc_render$Y], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxFormElement/OnyxFormElement.vue"]]);
+const _sfc_main$X = /* @__PURE__ */ defineComponent({
   ...{ inheritAttrs: false },
   __name: "OnyxSelectInput",
   props: {
@@ -8037,7 +8141,7 @@ const _sfc_main$W = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$J = ["id", "readonly", "placeholder", "required", "disabled", "aria-label", "title", "value", "autofocus"];
 const _hoisted_2$y = ["aria-label", "title", "disabled"];
-function _sfc_render$W(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$X(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createElementBlock(
     "div",
     mergeProps({
@@ -8160,8 +8264,8 @@ function _sfc_render$W(_ctx, _cache, $props, $setup, $data, $options) {
     /* FULL_PROPS */
   ));
 }
-const OnyxSelectInput = /* @__PURE__ */ _export_sfc(_sfc_main$W, [["render", _sfc_render$W], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSelectInput/OnyxSelectInput.vue"]]);
-const _sfc_main$V = /* @__PURE__ */ defineComponent({
+const OnyxSelectInput = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["render", _sfc_render$X], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSelectInput/OnyxSelectInput.vue"]]);
+const _sfc_main$W = /* @__PURE__ */ defineComponent({
   __name: "OnyxSelectOption",
   props: {
     active: { type: Boolean, required: false, default: false },
@@ -8181,7 +8285,7 @@ const _sfc_main$V = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$I = ["checked", "aria-labelledby", "disabled", "indeterminate"];
-function _sfc_render$V(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$W(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock($setup["OnyxListItem"], mergeProps({ class: "onyx-component onyx-select-option" }, $setup.listItemProps, {
     checked: !!_ctx.$attrs["aria-checked"],
     selected: !!_ctx.$attrs["aria-selected"],
@@ -8219,8 +8323,8 @@ function _sfc_render$V(_ctx, _cache, $props, $setup, $data, $options) {
     /* FORWARDED */
   }, 16, ["checked", "selected", "disabled"]);
 }
-const OnyxSelectOption = /* @__PURE__ */ _export_sfc(_sfc_main$V, [["render", _sfc_render$V], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSelectOption/OnyxSelectOption.vue"]]);
-const _sfc_main$U = /* @__PURE__ */ defineComponent({
+const OnyxSelectOption = /* @__PURE__ */ _export_sfc(_sfc_main$W, [["render", _sfc_render$W], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSelectOption/OnyxSelectOption.vue"]]);
+const _sfc_main$V = /* @__PURE__ */ defineComponent({
   __name: "OnyxSelect",
   props: {
     density: { type: null, required: false },
@@ -8524,7 +8628,7 @@ const _hoisted_8$5 = {
   key: 0,
   class: "onyx-select__description onyx-text--small"
 };
-function _sfc_render$U(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$V(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "div",
     _hoisted_1$H,
@@ -8727,9 +8831,9 @@ function _sfc_render$U(_ctx, _cache, $props, $setup, $data, $options) {
     /* NEED_PATCH */
   );
 }
-const OnyxSelect = /* @__PURE__ */ _export_sfc(_sfc_main$U, [["render", _sfc_render$U], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSelect/OnyxSelect.vue"]]);
+const OnyxSelect = /* @__PURE__ */ _export_sfc(_sfc_main$V, [["render", _sfc_render$V], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSelect/OnyxSelect.vue"]]);
 const __default__$3 = {};
-const _sfc_main$T = /* @__PURE__ */ defineComponent({
+const _sfc_main$U = /* @__PURE__ */ defineComponent({
   ...__default__$3,
   __name: "OnyxItemsPerPage",
   props: {
@@ -8764,7 +8868,7 @@ const _sfc_main$T = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$G = ["for"];
-function _sfc_render$T(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$U(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createBlock($setup["OnyxSkeleton"], {
     key: 0,
     class: normalizeClass(["onyx-items-per-page-skeleton", "onyx-text", $setup.densityClass])
@@ -8803,8 +8907,8 @@ function _sfc_render$T(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS, STYLE */
   ));
 }
-const OnyxItemsPerPage = /* @__PURE__ */ _export_sfc(_sfc_main$T, [["render", _sfc_render$T], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxItemsPerPage/OnyxItemsPerPage.vue"]]);
-const _sfc_main$S = /* @__PURE__ */ defineComponent({
+const OnyxItemsPerPage = /* @__PURE__ */ _export_sfc(_sfc_main$U, [["render", _sfc_render$U], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxItemsPerPage/OnyxItemsPerPage.vue"]]);
+const _sfc_main$T = /* @__PURE__ */ defineComponent({
   __name: "OnyxInlinePagination",
   props: {
     density: { type: null, required: false },
@@ -8861,7 +8965,7 @@ const _hoisted_2$w = ["aria-label", "disabled"];
 const _hoisted_3$n = ["aria-label", "disabled", "onClick"];
 const _hoisted_4$i = ["aria-label"];
 const _hoisted_5$d = ["aria-label", "disabled"];
-function _sfc_render$S(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$T(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createBlock($setup["OnyxSkeleton"], {
     key: 0,
     class: normalizeClass([
@@ -8952,9 +9056,9 @@ function _sfc_render$S(_ctx, _cache, $props, $setup, $data, $options) {
     ], 8, _hoisted_5$d)
   ], 10, _hoisted_1$F));
 }
-const OnyxInlinePagination = /* @__PURE__ */ _export_sfc(_sfc_main$S, [["render", _sfc_render$S], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxPagination/OnyxInlinePagination.vue"]]);
+const OnyxInlinePagination = /* @__PURE__ */ _export_sfc(_sfc_main$T, [["render", _sfc_render$T], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxPagination/OnyxInlinePagination.vue"]]);
 const pageSize = 100;
-const _sfc_main$R = /* @__PURE__ */ defineComponent({
+const _sfc_main$S = /* @__PURE__ */ defineComponent({
   __name: "OnyxSelectPagination",
   props: {
     density: { type: null, required: false },
@@ -9010,7 +9114,7 @@ const _hoisted_1$E = ["aria-label"];
 const _hoisted_2$v = { class: "onyx-pagination__count" };
 const _hoisted_3$m = ["aria-label", "disabled"];
 const _hoisted_4$h = ["aria-label", "disabled"];
-function _sfc_render$R(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$S(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createBlock($setup["OnyxSkeleton"], {
     key: 0,
     class: normalizeClass(["onyx-pagination-skeleton", "onyx-text", $setup.densityClass])
@@ -9066,8 +9170,8 @@ function _sfc_render$R(_ctx, _cache, $props, $setup, $data, $options) {
     ], 8, _hoisted_4$h)
   ], 14, _hoisted_1$E));
 }
-const OnyxSelectPagination = /* @__PURE__ */ _export_sfc(_sfc_main$R, [["render", _sfc_render$R], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxPagination/OnyxSelectPagination.vue"]]);
-const _sfc_main$Q = /* @__PURE__ */ defineComponent({
+const OnyxSelectPagination = /* @__PURE__ */ _export_sfc(_sfc_main$S, [["render", _sfc_render$S], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxPagination/OnyxSelectPagination.vue"]]);
+const _sfc_main$R = /* @__PURE__ */ defineComponent({
   __name: "OnyxPagination",
   props: {
     density: { type: null, required: false },
@@ -9088,7 +9192,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$Q(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$R(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.props.type === "inline" ? (openBlock(), createBlock(
     $setup["OnyxInlinePagination"],
     mergeProps({ key: 0 }, $setup.paginationProps, {
@@ -9107,7 +9211,7 @@ function _sfc_render$Q(_ctx, _cache, $props, $setup, $data, $options) {
     /* FULL_PROPS */
   ));
 }
-const OnyxPagination = /* @__PURE__ */ _export_sfc(_sfc_main$Q, [["render", _sfc_render$Q], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxPagination/OnyxPagination.vue"]]);
+const OnyxPagination = /* @__PURE__ */ _export_sfc(_sfc_main$R, [["render", _sfc_render$R], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxPagination/OnyxPagination.vue"]]);
 const SELECTION_FEATURE = /* @__PURE__ */ Symbol("Selection");
 const SELECTION_MUTATION_ORDER = 1e3;
 const useSelection = (options) => createFeature((ctx) => {
@@ -9402,7 +9506,7 @@ const BASE_FEATURE = (options) => createFeature(({ skeleton }) => {
     }
   };
 });
-const _sfc_main$P = /* @__PURE__ */ defineComponent({
+const _sfc_main$Q = /* @__PURE__ */ defineComponent({
   ...{ inheritAttrs: false },
   __name: "OnyxDataGrid",
   props: {
@@ -9482,7 +9586,7 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$P(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$Q(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock($setup["OnyxDataGridRenderer"], mergeProps($setup.mergeVueProps(_ctx.$attrs, $setup.rendererProps), {
     "column-groups": $setup.rendererColumnGroups,
     columns: $setup.renderColumns,
@@ -9509,7 +9613,7 @@ function _sfc_render$P(_ctx, _cache, $props, $setup, $data, $options) {
     } : void 0
   ]), 1040, ["column-groups", "columns", "rows", "scroll-container-attrs"]);
 }
-const OnyxDataGrid = /* @__PURE__ */ _export_sfc(_sfc_main$P, [["render", _sfc_render$P], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDataGrid/OnyxDataGrid.vue"]]);
+const OnyxDataGrid = /* @__PURE__ */ _export_sfc(_sfc_main$Q, [["render", _sfc_render$Q], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDataGrid/OnyxDataGrid.vue"]]);
 const HIDE_COLUMNS_FEATURE = /* @__PURE__ */ Symbol("HideColumnsFeature");
 const HIDDEN_COLUMN = /* @__PURE__ */ Symbol("HiddenColumn");
 const useHideColumns = (options) => createFeature((ctx) => {
@@ -9615,7 +9719,7 @@ const useHideColumns = (options) => createFeature((ctx) => {
     }
   };
 });
-const _sfc_main$O = /* @__PURE__ */ defineComponent({
+const _sfc_main$P = /* @__PURE__ */ defineComponent({
   __name: "OnyxResizeHandle",
   props: {
     element: { type: null, required: true },
@@ -9690,7 +9794,7 @@ const _sfc_main$O = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$O(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$P(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "button",
     {
@@ -9724,7 +9828,7 @@ function _sfc_render$O(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS, NEED_HYDRATION */
   );
 }
-const OnyxResizeHandle = /* @__PURE__ */ _export_sfc(_sfc_main$O, [["render", _sfc_render$O], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxResizeHandle/OnyxResizeHandle.vue"]]);
+const OnyxResizeHandle = /* @__PURE__ */ _export_sfc(_sfc_main$P, [["render", _sfc_render$P], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxResizeHandle/OnyxResizeHandle.vue"]]);
 const RESIZING_FEATURE = /* @__PURE__ */ Symbol("Resizing");
 const FILLER_COLUMN = /* @__PURE__ */ Symbol("FILLER_COLUMN");
 const useResizing = (options) => createFeature((ctx) => {
@@ -9866,7 +9970,7 @@ const DEFAULT_COMPARES = Object.freeze({
   skeleton: () => 0,
   boolean: BOOLEAN_COMPARE
 });
-const _sfc_main$N = /* @__PURE__ */ defineComponent({
+const _sfc_main$O = /* @__PURE__ */ defineComponent({
   __name: "SortAction",
   props: {
     columnLabel: { type: String, required: true },
@@ -9890,14 +9994,14 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$N(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$O(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock($setup["OnyxSystemButton"], {
     label: $setup.buttonLabel,
     icon: $setup.icon,
     color: "medium"
   }, null, 8, ["label", "icon"]);
 }
-const SortAction = /* @__PURE__ */ _export_sfc(_sfc_main$N, [["render", _sfc_render$N], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDataGrid/features/sorting/SortAction.vue"]]);
+const SortAction = /* @__PURE__ */ _export_sfc(_sfc_main$O, [["render", _sfc_render$O], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDataGrid/features/sorting/SortAction.vue"]]);
 const nextSortDirection = (current, skipNone) => {
   switch (current) {
     case "asc":
@@ -10140,7 +10244,7 @@ const all = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty(
   useSorting,
   useStickyColumns
 }, Symbol.toStringTag, { value: "Module" }));
-const _sfc_main$M = /* @__PURE__ */ defineComponent({
+const _sfc_main$N = /* @__PURE__ */ defineComponent({
   ...{ inheritAttrs: false },
   __name: "OnyxDatePicker",
   props: {
@@ -10209,7 +10313,7 @@ const _sfc_main$M = /* @__PURE__ */ defineComponent({
 });
 const _hoisted_1$D = { class: "onyx-datepicker__wrapper" };
 const _hoisted_2$u = ["id", "type", "required", "autofocus", "name", "readonly", "disabled", "aria-label", "title", "min", "max"];
-function _sfc_render$M(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$N(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createElementBlock(
     "div",
     mergeProps({
@@ -10274,9 +10378,9 @@ function _sfc_render$M(_ctx, _cache, $props, $setup, $data, $options) {
     /* FULL_PROPS */
   ));
 }
-const OnyxDatePicker = /* @__PURE__ */ _export_sfc(_sfc_main$M, [["render", _sfc_render$M], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDatePicker/OnyxDatePicker.vue"]]);
+const OnyxDatePicker = /* @__PURE__ */ _export_sfc(_sfc_main$N, [["render", _sfc_render$N], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDatePicker/OnyxDatePicker.vue"]]);
 const DIALOG_ALIGNMENTS = ["left", "center", "right"];
-const _sfc_main$L = /* @__PURE__ */ defineComponent({
+const _sfc_main$M = /* @__PURE__ */ defineComponent({
   __name: "OnyxDialog",
   props: {
     density: { type: null, required: false },
@@ -10318,7 +10422,7 @@ const _hoisted_5$c = {
   key: 0,
   class: "onyx-dialog__footer"
 };
-function _sfc_render$L(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$M(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock($setup["OnyxBasicPopover"], mergeProps($setup.basicPopoverProps, {
     open: $setup.isExpanded,
     "onUpdate:open": _cache[1] || (_cache[1] = ($event) => $setup.isExpanded = $event),
@@ -10367,8 +10471,8 @@ function _sfc_render$L(_ctx, _cache, $props, $setup, $data, $options) {
     /* FORWARDED */
   }, 16, ["open", "class"]);
 }
-const OnyxDialog = /* @__PURE__ */ _export_sfc(_sfc_main$L, [["render", _sfc_render$L], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDialog/OnyxDialog.vue"]]);
-const _sfc_main$K = /* @__PURE__ */ defineComponent({
+const OnyxDialog = /* @__PURE__ */ _export_sfc(_sfc_main$M, [["render", _sfc_render$M], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxDialog/OnyxDialog.vue"]]);
+const _sfc_main$L = /* @__PURE__ */ defineComponent({
   __name: "OnyxForm",
   props: {
     disabled: { type: Boolean, required: false, default: false },
@@ -10388,7 +10492,7 @@ const _sfc_main$K = /* @__PURE__ */ defineComponent({
     return __returned__;
   }
 });
-function _sfc_render$K(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$L(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "form",
     {
@@ -10405,7 +10509,7 @@ function _sfc_render$K(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   );
 }
-const OnyxForm = /* @__PURE__ */ _export_sfc(_sfc_main$K, [["render", _sfc_render$K], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxForm/OnyxForm.vue"]]);
+const OnyxForm = /* @__PURE__ */ _export_sfc(_sfc_main$L, [["render", _sfc_render$L], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxForm/OnyxForm.vue"]]);
 const useLenientMaxLengthValidation = (options) => {
   const { t } = injectI18n();
   const normalized = computed(() => {
@@ -10445,7 +10549,7 @@ const MOBILE_NAV_BAR_INJECTION_KEY = /* @__PURE__ */ Symbol();
 const NAV_BAR_IS_TOP_LEVEL_INJECTION_KEY = /* @__PURE__ */ Symbol();
 const NAV_BAR_MORE_LIST_INJECTION_KEY = /* @__PURE__ */ Symbol();
 const NAV_BAR_MORE_LIST_TARGET_INJECTION_KEY = /* @__PURE__ */ Symbol();
-const _sfc_main$J = /* @__PURE__ */ defineComponent({
+const _sfc_main$K = /* @__PURE__ */ defineComponent({
   __name: "OnyxSeparator",
   props: {
     orientation: { type: null, required: false, default: "horizontal" }
@@ -10463,15 +10567,15 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$B = ["aria-orientation"];
-function _sfc_render$J(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$K(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", {
     class: normalizeClass(["onyx-component onyx-separator", { "onyx-separator--vertical": $setup.isVertical }]),
     role: "separator",
     "aria-orientation": $setup.props.orientation
   }, null, 10, _hoisted_1$B);
 }
-const OnyxSeparator = /* @__PURE__ */ _export_sfc(_sfc_main$J, [["render", _sfc_render$J], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSeparator/OnyxSeparator.vue"]]);
-const _sfc_main$I = /* @__PURE__ */ defineComponent({
+const OnyxSeparator = /* @__PURE__ */ _export_sfc(_sfc_main$K, [["render", _sfc_render$K], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxSeparator/OnyxSeparator.vue"]]);
+const _sfc_main$J = /* @__PURE__ */ defineComponent({
   ...{ inheritAttrs: false },
   __name: "OnyxInput",
   props: {
@@ -10563,7 +10667,7 @@ const _sfc_main$I = /* @__PURE__ */ defineComponent({
 const _hoisted_1$A = { class: "onyx-input__wrapper" };
 const _hoisted_2$s = ["id", "placeholder", "type", "required", "autocapitalize", "autocomplete", "autofocus", "name", "pattern", "readonly", "disabled", "maxlength", "minlength", "aria-label", "title"];
 const _hoisted_3$k = ["aria-label", "title"];
-function _sfc_render$I(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$J(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createElementBlock(
     "div",
     mergeProps({
@@ -10669,10 +10773,10 @@ function _sfc_render$I(_ctx, _cache, $props, $setup, $data, $options) {
     /* FULL_PROPS */
   ));
 }
-const OnyxInput = /* @__PURE__ */ _export_sfc(_sfc_main$I, [["render", _sfc_render$I], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxInput/OnyxInput.vue"]]);
+const OnyxInput = /* @__PURE__ */ _export_sfc(_sfc_main$J, [["render", _sfc_render$J], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxInput/OnyxInput.vue"]]);
 const GLOBAL_SEARCH_INJECTION_KEY = /* @__PURE__ */ Symbol();
 const __default__$2 = {};
-const _sfc_main$H = /* @__PURE__ */ defineComponent({
+const _sfc_main$I = /* @__PURE__ */ defineComponent({
   ...__default__$2,
   __name: "OnyxGlobalSearch",
   props: {
@@ -10766,7 +10870,7 @@ const _hoisted_5$b = { class: "onyx-global-search__shortcut" };
 const _hoisted_6$9 = { class: "onyx-global-search__shortcut-label" };
 const _hoisted_7$4 = { class: "onyx-global-search__shortcut" };
 const _hoisted_8$4 = { class: "onyx-global-search__shortcut-label" };
-function _sfc_render$H(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$I(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock($setup["OnyxBasicDialog"], mergeProps($setup.basicDialogProps, {
     ref: "dialogRef",
     label: $setup.t("globalSearch.label"),
@@ -10883,9 +10987,9 @@ function _sfc_render$H(_ctx, _cache, $props, $setup, $data, $options) {
     /* FORWARDED */
   }, 16, ["label"]);
 }
-const OnyxGlobalSearch = /* @__PURE__ */ _export_sfc(_sfc_main$H, [["render", _sfc_render$H], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxGlobalSearch/OnyxGlobalSearch.vue"]]);
+const OnyxGlobalSearch = /* @__PURE__ */ _export_sfc(_sfc_main$I, [["render", _sfc_render$I], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxGlobalSearch/OnyxGlobalSearch.vue"]]);
 const __default__$1 = {};
-const _sfc_main$G = /* @__PURE__ */ defineComponent({
+const _sfc_main$H = /* @__PURE__ */ defineComponent({
   ...__default__$1,
   __name: "OnyxGlobalSearchOption",
   props: {
@@ -10915,7 +11019,7 @@ const _hoisted_3$i = {
   key: 0,
   class: "onyx-global-search-option__trailing"
 };
-function _sfc_render$G(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$H(_ctx, _cache, $props, $setup, $data, $options) {
   return $setup.skeleton ? (openBlock(), createElementBlock(
     "li",
     {
@@ -10980,9 +11084,9 @@ function _sfc_render$G(_ctx, _cache, $props, $setup, $data, $options) {
     /* CLASS */
   ));
 }
-const OnyxGlobalSearchOption = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["render", _sfc_render$G], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxGlobalSearchOption/OnyxGlobalSearchOption.vue"]]);
+const OnyxGlobalSearchOption = /* @__PURE__ */ _export_sfc(_sfc_main$H, [["render", _sfc_render$H], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxGlobalSearchOption/OnyxGlobalSearchOption.vue"]]);
 const __default__ = {};
-const _sfc_main$F = /* @__PURE__ */ defineComponent({
+const _sfc_main$G = /* @__PURE__ */ defineComponent({
   ...__default__,
   __name: "OnyxGlobalSearchGroup",
   props: {
@@ -11005,7 +11109,7 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
   }
 });
 const _hoisted_1$x = { "aria-hidden": "true" };
-function _sfc_render$F(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$G(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock(
     "ul",
     mergeProps({
@@ -11047,9 +11151,63 @@ function _sfc_render$F(_ctx, _cache, $props, $setup, $data, $options) {
     /* FULL_PROPS */
   );
 }
-const OnyxGlobalSearchGroup = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["render", _sfc_render$F], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxGlobalSearchGroup/OnyxGlobalSearchGroup.vue"]]);
+const OnyxGlobalSearchGroup = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["render", _sfc_render$G], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxGlobalSearchGroup/OnyxGlobalSearchGroup.vue"]]);
 const HEADLINE_TYPES = ["h1", "h2", "h3", "h4", "h5", "h6"];
 const ICON_SIZES = ["12px", "16px", "24px", "32px", "48px", "64px", "96px"];
+const _sfc_main$F = /* @__PURE__ */ defineComponent({
+  __name: "OnyxIconButton",
+  props: {
+    density: { type: null, required: false },
+    autofocus: { type: Boolean, required: false },
+    link: { type: null, required: false },
+    label: { type: String, required: true },
+    disabled: { type: [Boolean, Symbol], required: false, default: FORM_INJECTED_SYMBOL },
+    type: { type: null, required: false, default: "button" },
+    color: { type: null, required: false, default: "primary" },
+    loading: { type: Boolean, required: false },
+    icon: { type: String, required: false },
+    skeleton: { type: [Symbol, Boolean, Number], required: false, default: SKELETON_INJECTED_SYMBOL }
+  },
+  setup(__props, { expose: __expose }) {
+    __expose();
+    const props = __props;
+    const { densityClass } = useDensity(props);
+    const skeleton = useSkeletonContext(props);
+    const forwardProps = useForwardProps(props, ButtonOrLinkLayout);
+    const __returned__ = { props, densityClass, skeleton, forwardProps, ButtonOrLinkLayout, OnyxIcon, OnyxLoadingIndicator, OnyxSkeleton };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+function _sfc_render$F(_ctx, _cache, $props, $setup, $data, $options) {
+  return $setup.skeleton ? (openBlock(), createBlock($setup["OnyxSkeleton"], {
+    key: 0,
+    class: normalizeClass(["onyx-icon-button-skeleton", $setup.densityClass])
+  }, null, 8, ["class"])) : (openBlock(), createBlock($setup["ButtonOrLinkLayout"], mergeProps({ key: 1 }, $setup.forwardProps, {
+    "aria-label": $setup.props.label,
+    title: $setup.props.label,
+    class: [
+      "onyx-component",
+      "onyx-icon-button",
+      `onyx-icon-button--${$setup.props.color}`,
+      { "onyx-icon-button--loading": $setup.props.loading },
+      $setup.densityClass
+    ]
+  }), {
+    default: withCtx(() => [
+      $setup.props.loading ? (openBlock(), createBlock($setup["OnyxLoadingIndicator"], {
+        key: 0,
+        type: "circle"
+      })) : $setup.props.icon ? (openBlock(), createBlock($setup["OnyxIcon"], {
+        key: 1,
+        icon: $setup.props.icon
+      }, null, 8, ["icon"])) : renderSlot(_ctx.$slots, "default", { key: 2 })
+    ]),
+    _: 3
+    /* FORWARDED */
+  }, 16, ["aria-label", "title", "class"]));
+}
+const OnyxIconButton = /* @__PURE__ */ _export_sfc(_sfc_main$F, [["render", _sfc_render$F], ["__file", "/home/runner/work/onyx/onyx/packages/sit-onyx/src/components/OnyxIconButton/OnyxIconButton.vue"]]);
 const _sfc_main$E = /* @__PURE__ */ defineComponent({
   ...{ inheritAttrs: false },
   __name: "OnyxImage",