@postenbring/hedwig-react 2.1.4 → 2.2.1

package/dist/index.js

@@ -63,6 +63,9 @@ __export(index_exports, {
   AccordionContent: () => AccordionContent,
   AccordionHeader: () => AccordionHeader,
   AccordionItem: () => AccordionItem,
+  Alert: () => Alert,
+  AlertDescription: () => AlertDescription,
+  AlertTitle: () => AlertTitle,
   AutoAnimateHeight: () => AutoAnimateHeight,
   Badge: () => Badge,
   Blockquote: () => Blockquote,
@@ -141,6 +144,7 @@ __export(index_exports, {
   VStack: () => VStack,
   WarningBanner: () => WarningBanner,
   focusTrap: () => focusTrap,
+  inertPropValue: () => inertPropValue,
   useFieldsetContext: () => useFieldsetContext,
   useHydrated: () => useHydrated,
   useMergeRefs: () => useMergeRefs,
@@ -151,7 +155,7 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/accordion/accordion.tsx
-var import_react5 = require("react");
+var import_react7 = require("react");
 var import_typed_classname4 = require("@postenbring/hedwig-css/typed-classname");
 
 // src/accordion/accordion-item.tsx
@@ -223,26 +227,208 @@ var AccordionHeader = (0, import_react3.forwardRef)(
 AccordionHeader.displayName = "Accordion.Header";
 
 // src/accordion/accordion-content.tsx
-var import_react4 = require("react");
+var import_react6 = require("react");
 var import_typed_classname3 = require("@postenbring/hedwig-css/typed-classname");
+
+// src/utils/utils.ts
+var React = __toESM(require("react"));
+var import_react4 = require("react");
+function useMergeRefs(refs) {
+  return React.useMemo(() => {
+    if (refs.every((ref) => ref === null)) {
+      return null;
+    }
+    return (value) => {
+      refs.forEach((ref) => {
+        if (typeof ref === "function") {
+          ref(value);
+        } else if (ref !== null) {
+          ref.current = value;
+        }
+      });
+    };
+  }, refs);
+}
+function useResize(ref) {
+  const [width, setWidth] = (0, import_react4.useState)(0);
+  const [height, setHeight] = (0, import_react4.useState)(0);
+  const handleResize = (0, import_react4.useCallback)(() => {
+    var _a, _b, _c, _d;
+    if ((ref == null ? void 0 : ref.current) !== null) {
+      setWidth((_b = (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.offsetWidth) != null ? _b : 0);
+      setHeight((_d = (_c = ref == null ? void 0 : ref.current) == null ? void 0 : _c.offsetHeight) != null ? _d : 0);
+    }
+  }, [ref]);
+  (0, import_react4.useEffect)(() => {
+    window.addEventListener("load", handleResize);
+    window.addEventListener("resize", handleResize);
+    return () => {
+      window.removeEventListener("load", handleResize);
+      window.removeEventListener("resize", handleResize);
+    };
+  }, [ref, handleResize]);
+  (0, import_react4.useEffect)(() => {
+    handleResize();
+  }, []);
+  return { width, height };
+}
+function subscribe() {
+  return () => {
+  };
+}
+function useHydrated() {
+  return React.useSyncExternalStore(
+    subscribe,
+    () => true,
+    () => false
+  );
+}
+function focusTrap(element) {
+  var _a, _b;
+  if (element === document.body) return () => {
+  };
+  let inertElements = [];
+  for (let el = element; el; el = el.parentElement) {
+    if (el === document.body) break;
+    for (const sibling of (_b = (_a = el.parentElement) == null ? void 0 : _a.children) != null ? _b : []) {
+      if (sibling === el) continue;
+      if (!(sibling instanceof HTMLElement)) continue;
+      if (sibling.hasAttribute("inert")) continue;
+      sibling.setAttribute("inert", "true");
+      inertElements.push(sibling);
+    }
+  }
+  return () => {
+    releaseFocusTrap(inertElements);
+    inertElements = [];
+  };
+}
+function releaseFocusTrap(inertElements) {
+  for (const el of inertElements) {
+    el.removeAttribute("inert");
+  }
+}
+var inertBooleanSupported = Number(import_react4.version.split(".")[0]) >= 19;
+var inertPropValue = inertBooleanSupported ? (x) => x : (x) => x ? "" : void 0;
+
+// src/utils/auto-animate-height.tsx
+var import_react5 = require("react");
 var import_jsx_runtime3 = require("react/jsx-runtime");
-var AccordionContent = (0, import_react4.forwardRef)(
+var AutoAnimateHeight = (0, import_react5.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, {
+      children,
+      style,
+      animationDuration = "quick",
+      animationEasing = "normal",
+      onTransitionEnd
+    } = _b, rest = __objRest(_b, [
+      "children",
+      "style",
+      "animationDuration",
+      "animationEasing",
+      "onTransitionEnd"
+    ]);
+    var _a2, _b2;
+    const rootRef = (0, import_react5.useRef)(null);
+    const mergedRef = useMergeRefs([rootRef, ref]);
+    const measurementRef = (0, import_react5.useRef)(null);
+    const [height, setHeight] = (0, import_react5.useState)(
+      void 0
+    );
+    const [clonedChildren, setClonedChildren] = (0, import_react5.useState)(
+      () => (0, import_react5.cloneElement)(/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children }), {})
+    );
+    (0, import_react5.useEffect)(() => {
+      var _a3;
+      if (!rootRef.current) return;
+      if (!measurementRef.current) return;
+      if (document.body.scrollHeight === 0) return;
+      const currentMeasurement = measurementRef.current;
+      const { height: newHeight } = currentMeasurement.getBoundingClientRect();
+      let previouslyObservedHeight = newHeight;
+      const resizeObserver = new ResizeObserver(() => {
+        const { height: resizedHeight } = currentMeasurement.getBoundingClientRect();
+        if (resizedHeight === previouslyObservedHeight) return;
+        previouslyObservedHeight = resizedHeight;
+        setHeight({ height: resizedHeight, shouldAnimate: false });
+      });
+      resizeObserver.observe(currentMeasurement);
+      setHeight({ height: newHeight, shouldAnimate: true });
+      const nextClonedChildren = (0, import_react5.cloneElement)(/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children }), {});
+      if (newHeight >= ((_a3 = height == null ? void 0 : height.height) != null ? _a3 : 0)) {
+        setClonedChildren(nextClonedChildren);
+        return () => {
+          resizeObserver.disconnect();
+        };
+      }
+      const currentRoot = rootRef.current;
+      function onTransitionEndHandler(e) {
+        if (e.propertyName !== "height") return;
+        setClonedChildren(nextClonedChildren);
+      }
+      currentRoot.addEventListener("transitionend", onTransitionEndHandler);
+      return () => {
+        resizeObserver.disconnect();
+        currentRoot.removeEventListener("transitionend", onTransitionEndHandler);
+      };
+    }, [children]);
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      "div",
+      __spreadProps(__spreadValues({
+        ref: mergedRef,
+        onTransitionEnd,
+        style: __spreadValues({
+          position: "relative",
+          overflow: "hidden",
+          height: (_b2 = height == null ? void 0 : height.height) != null ? _b2 : (_a2 = measurementRef.current) == null ? void 0 : _a2.getBoundingClientRect().height,
+          transitionProperty: (height == null ? void 0 : height.shouldAnimate) ? "height" : "none",
+          transitionDuration: `var(--hds-micro-animation-duration-${animationDuration})`,
+          transitionTimingFunction: `var(--hds-micro-animation-easing-${animationEasing})`,
+          willChange: "height"
+        }, style)
+      }, rest), {
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            "div",
+            {
+              "aria-hidden": true,
+              ref: measurementRef,
+              style: {
+                position: "absolute",
+                visibility: "hidden",
+                pointerEvents: "none"
+              },
+              children
+            }
+          ),
+          clonedChildren
+        ]
+      })
+    );
+  }
+);
+AutoAnimateHeight.displayName = "AutoAnimateHeight";
+
+// src/accordion/accordion-content.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var AccordionContent = (0, import_react6.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
-    const context = (0, import_react4.useContext)(AccordionItemContext);
+    const context = (0, import_react6.useContext)(AccordionItemContext);
     if (context === null) {
       return null;
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       "div",
       __spreadProps(__spreadValues(__spreadProps(__spreadValues({
         id: context.contentId,
         "data-state": context.open ? "open" : "closed"
-      }, { inert: context.open ? void 0 : "true" }), {
+      }, { inert: inertPropValue(!context.open) }), {
         className: (0, import_typed_classname3.clsx)("hds-accordion-item-content", className),
         ref
       }), rest), {
-        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: (0, import_typed_classname3.clsx)("hds-accordion-item-content-inner"), children })
+        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: (0, import_typed_classname3.clsx)("hds-accordion-item-content-inner"), children })
       })
     );
   }
@@ -250,11 +436,11 @@ var AccordionContent = (0, import_react4.forwardRef)(
 AccordionContent.displayName = "Accordion.Content";
 
 // src/accordion/accordion.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var Accordion = (0, import_react5.forwardRef)(
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var Accordion = (0, import_react7.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, className, indent = true } = _b, rest = __objRest(_b, ["children", "className", "indent"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       "div",
       __spreadProps(__spreadValues({}, rest), {
         className: (0, import_typed_classname4.clsx)(
@@ -273,71 +459,23 @@ Accordion.Item = AccordionItem;
 Accordion.Header = AccordionHeader;
 Accordion.Content = AccordionContent;
 
-// src/badge/badge.tsx
-var import_typed_classname5 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot = require("@radix-ui/react-slot");
-var import_react6 = require("react");
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var Badge = (0, import_react6.forwardRef)(
-  (_a, ref) => {
-    var _b = _a, { children, asChild, variant = "lighter", size = "small", className } = _b, rest = __objRest(_b, ["children", "asChild", "variant", "size", "className"]);
-    const Component = asChild ? import_react_slot.Slot : "span";
-    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-      Component,
-      __spreadProps(__spreadValues({
-        ref,
-        className: (0, import_typed_classname5.clsx)(
-          "hds-badge",
-          `hds-badge--${size}`,
-          `hds-badge--${variant}`,
-          className
-        )
-      }, rest), {
-        children
-      })
-    );
-  }
-);
-Badge.displayName = "Badge";
-
-// src/blockquote/blockquote.tsx
+// src/alert/alert.tsx
+var import_react9 = require("react");
 var import_typed_classname6 = require("@postenbring/hedwig-css/typed-classname");
 var import_react_slot2 = require("@radix-ui/react-slot");
-var import_react7 = require("react");
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var Blockquote = (0, import_react7.forwardRef)(
-  (_a, ref) => {
-    var _b = _a, { children, asChild, className, variant } = _b, rest = __objRest(_b, ["children", "asChild", "className", "variant"]);
-    const Component = asChild ? import_react_slot2.Slot : "blockquote";
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      Component,
-      __spreadProps(__spreadValues({
-        ref,
-        className: (0, import_typed_classname6.clsx)(
-          "hds-blockquote",
-          variant === "norwegian" && `hds-blockquote--norwegian`,
-          className
-        )
-      }, rest), {
-        children
-      })
-    );
-  }
-);
-Blockquote.displayName = "Blockquote";
 
 // src/box/box.tsx
 var import_react8 = require("react");
-var import_typed_classname7 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot3 = require("@radix-ui/react-slot");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_typed_classname5 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot = require("@radix-ui/react-slot");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 var BoxCloseButton = (0, import_react8.forwardRef)(
   (_a, ref) => {
     var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
       "button",
       __spreadValues({
-        className: (0, import_typed_classname7.clsx)("hds-box__close-button", className),
+        className: (0, import_typed_classname5.clsx)("hds-box__close-button", className),
         ref,
         type: "button"
       }, rest)
@@ -378,11 +516,11 @@ var Box = (0, import_react8.forwardRef)(
       }
     }, []);
     const closed = closedProp != null ? closedProp : closedState;
-    const Component = asChild ? import_react_slot3.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+    const Component = asChild ? import_react_slot.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
       Component,
       __spreadProps(__spreadValues({
-        className: (0, import_typed_classname7.clsx)(
+        className: (0, import_typed_classname5.clsx)(
           "hds-box",
           variant && `hds-box--${variant}`,
           { "hds-box--closed": closed },
@@ -391,8 +529,8 @@ var Box = (0, import_react8.forwardRef)(
         ref
       }, rest), {
         children: [
-          closeable ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BoxCloseButton, __spreadValues({ onClick: onClose }, closeButtonProps)) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react_slot3.Slottable, { children })
+          closeable ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(BoxCloseButton, __spreadValues({ onClick: onClose }, closeButtonProps)) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_slot.Slottable, { children })
         ]
       })
     );
@@ -401,24 +539,122 @@ var Box = (0, import_react8.forwardRef)(
 Box.displayName = "Box";
 Box.CloseButton = BoxCloseButton;
 
-// src/breadcrumbs/breadcrumbs.tsx
-var import_react9 = require("react");
-var import_typed_classname8 = require("@postenbring/hedwig-css/typed-classname");
+// src/alert/alert.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var AlertTitle = (0, import_react9.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
+    const Component = asChild ? import_react_slot2.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Component, __spreadValues({ className: (0, import_typed_classname6.clsx)("hds-alert__title", className), ref }, rest));
+  }
+);
+AlertTitle.displayName = "Alert.Title";
+var AlertDescription = (0, import_react9.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
+    const Component = asChild ? import_react_slot2.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      Component,
+      __spreadValues({
+        className: (0, import_typed_classname6.clsx)("hds-alert__description", className),
+        ref
+      }, rest)
+    );
+  }
+);
+AlertDescription.displayName = "Alert.Description";
+var Alert = (0, import_react9.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { children, className, variant = "success", icon, iconClassName } = _b, rest = __objRest(_b, ["children", "className", "variant", "icon", "iconClassName"]);
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+      Box,
+      __spreadProps(__spreadValues({
+        className: (0, import_typed_classname6.clsx)(`hds-alert`, `hds-alert--${variant}`, className),
+        ref
+      }, rest), {
+        children: [
+          variant === "neutral" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: (0, import_typed_classname6.clsx)("hds-alert--neutral__icon", iconClassName), children: icon }),
+          children
+        ]
+      })
+    );
+  }
+);
+Alert.displayName = "Alert";
+Alert.Title = AlertTitle;
+Alert.Description = AlertDescription;
+
+// src/badge/badge.tsx
+var import_typed_classname7 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot3 = require("@radix-ui/react-slot");
+var import_react10 = require("react");
 var import_jsx_runtime8 = require("react/jsx-runtime");
-var Breadcrumbs = (0, import_react9.forwardRef)(
+var Badge = (0, import_react10.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { children, asChild, variant = "lighter", size = "small", className } = _b, rest = __objRest(_b, ["children", "asChild", "variant", "size", "className"]);
+    const Component = asChild ? import_react_slot3.Slot : "span";
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      Component,
+      __spreadProps(__spreadValues({
+        ref,
+        className: (0, import_typed_classname7.clsx)(
+          "hds-badge",
+          `hds-badge--${size}`,
+          `hds-badge--${variant}`,
+          className
+        )
+      }, rest), {
+        children
+      })
+    );
+  }
+);
+Badge.displayName = "Badge";
+
+// src/blockquote/blockquote.tsx
+var import_typed_classname8 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot4 = require("@radix-ui/react-slot");
+var import_react11 = require("react");
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var Blockquote = (0, import_react11.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { children, asChild, className, variant } = _b, rest = __objRest(_b, ["children", "asChild", "className", "variant"]);
+    const Component = asChild ? import_react_slot4.Slot : "blockquote";
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      Component,
+      __spreadProps(__spreadValues({
+        ref,
+        className: (0, import_typed_classname8.clsx)(
+          "hds-blockquote",
+          variant === "norwegian" && `hds-blockquote--norwegian`,
+          className
+        )
+      }, rest), {
+        children
+      })
+    );
+  }
+);
+Blockquote.displayName = "Blockquote";
+
+// src/breadcrumbs/breadcrumbs.tsx
+var import_react12 = require("react");
+var import_typed_classname9 = require("@postenbring/hedwig-css/typed-classname");
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var Breadcrumbs = (0, import_react12.forwardRef)(
   (_a, ref) => {
     var _b = _a, { olProps, children } = _b, rest = __objRest(_b, ["olProps", "children"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("nav", __spreadProps(__spreadValues({ ref }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("ol", __spreadProps(__spreadValues({}, olProps), { className: (0, import_typed_classname8.clsx)("hds-breadcrumbs", olProps == null ? void 0 : olProps.className), children })) }));
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("nav", __spreadProps(__spreadValues({ ref }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("ol", __spreadProps(__spreadValues({}, olProps), { className: (0, import_typed_classname9.clsx)("hds-breadcrumbs", olProps == null ? void 0 : olProps.className), children })) }));
   }
 );
 Breadcrumbs.displayName = "Breadcrumbs";
 
 // src/button/button.tsx
-var import_react10 = require("react");
-var import_typed_classname9 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot4 = require("@radix-ui/react-slot");
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var Button = (0, import_react10.forwardRef)(
+var import_react13 = require("react");
+var import_typed_classname10 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot5 = require("@radix-ui/react-slot");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var Button = (0, import_react13.forwardRef)(
   (_a, ref) => {
     var _b = _a, {
       asChild,
@@ -437,11 +673,11 @@ var Button = (0, import_react10.forwardRef)(
       "icon",
       "className"
     ]);
-    const Component = asChild ? import_react_slot4.Slot : "button";
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    const Component = asChild ? import_react_slot5.Slot : "button";
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
       Component,
       __spreadProps(__spreadValues({
-        className: (0, import_typed_classname9.clsx)(
+        className: (0, import_typed_classname10.clsx)(
           "hds-button",
           `hds-button--${size}`,
           `hds-button--${variant}`,
@@ -464,17 +700,17 @@ var Button = (0, import_react10.forwardRef)(
 Button.displayName = "Button";
 
 // src/button-list/button-list.tsx
-var import_react11 = require("react");
-var import_typed_classname10 = require("@postenbring/hedwig-css/typed-classname");
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var ButtonList = (0, import_react11.forwardRef)(
+var import_react14 = require("react");
+var import_typed_classname11 = require("@postenbring/hedwig-css/typed-classname");
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var ButtonList = (0, import_react14.forwardRef)(
   (_a, ref) => {
     var _b = _a, { variant = "default", className, children } = _b, rest = __objRest(_b, ["variant", "className", "children"]);
     const Component = "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       Component,
       __spreadProps(__spreadValues({
-        className: (0, import_typed_classname10.clsx)("hds-button-list", `hds-button-list--${variant}`, className),
+        className: (0, import_typed_classname11.clsx)("hds-button-list", `hds-button-list--${variant}`, className),
         ref
       }, rest), {
         children
@@ -485,26 +721,26 @@ var ButtonList = (0, import_react11.forwardRef)(
 ButtonList.displayName = "ButtonList";
 
 // src/card/card.tsx
-var import_react12 = require("react");
-var import_typed_classname11 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot5 = require("@radix-ui/react-slot");
-var import_jsx_runtime11 = require("react/jsx-runtime");
-var CardMedia = (0, import_react12.forwardRef)(
+var import_react15 = require("react");
+var import_typed_classname12 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot6 = require("@radix-ui/react-slot");
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var CardMedia = (0, import_react15.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
-    const Component = asChild ? import_react_slot5.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Component, __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname11.clsx)("hds-card__media", className), ref, children }));
+    const Component = asChild ? import_react_slot6.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Component, __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname12.clsx)("hds-card__media", className), ref, children }));
   }
 );
 CardMedia.displayName = "Card.Media";
-var CardMediaImg = (0, import_react12.forwardRef)(
+var CardMediaImg = (0, import_react15.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, variant, className } = _b, rest = __objRest(_b, ["asChild", "variant", "className"]);
-    const Component = asChild ? import_react_slot5.Slot : "img";
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    const Component = asChild ? import_react_slot6.Slot : "img";
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Component,
       __spreadProps(__spreadValues({}, rest), {
-        className: (0, import_typed_classname11.clsx)(
+        className: (0, import_typed_classname12.clsx)(
           "hds-card__media__img",
           { "hds-card__img__scale": variant === "scale" },
           className
@@ -515,35 +751,35 @@ var CardMediaImg = (0, import_react12.forwardRef)(
   }
 );
 CardMediaImg.displayName = "Card.MediaImg";
-var CardBody = (0, import_react12.forwardRef)(
+var CardBody = (0, import_react15.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
-    const Component = asChild ? import_react_slot5.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Component, __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname11.clsx)("hds-card__body", className), ref, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: (0, import_typed_classname11.clsx)("hds-card__centerbody", className), children }) }));
+    const Component = asChild ? import_react_slot6.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Component, __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname12.clsx)("hds-card__body", className), ref, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: (0, import_typed_classname12.clsx)("hds-card__centerbody", className), children }) }));
   }
 );
 CardBody.displayName = "Card.Body";
-var CardBodyHeader = (0, import_react12.forwardRef)((_a, ref) => {
+var CardBodyHeader = (0, import_react15.forwardRef)((_a, ref) => {
   var _b = _a, { as: Tag, asChild, className, children } = _b, rest = __objRest(_b, ["as", "asChild", "className", "children"]);
-  const Component = asChild ? import_react_slot5.Slot : Tag;
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  const Component = asChild ? import_react_slot6.Slot : Tag;
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
     Component,
     __spreadProps(__spreadValues({}, rest), {
-      className: (0, import_typed_classname11.clsx)("hds-card__body-header", className),
+      className: (0, import_typed_classname12.clsx)("hds-card__body-header", className),
       ref,
       children
     })
   );
 });
 CardBodyHeader.displayName = "Card.BodyHeader";
-var CardBodyHeaderOverline = (0, import_react12.forwardRef)(
+var CardBodyHeaderOverline = (0, import_react15.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
-    const Component = asChild ? import_react_slot5.Slot : "span";
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    const Component = asChild ? import_react_slot6.Slot : "span";
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Component,
       __spreadProps(__spreadValues({}, rest), {
-        className: (0, import_typed_classname11.clsx)("hds-card__body-header-overline", className),
+        className: (0, import_typed_classname12.clsx)("hds-card__body-header-overline", className),
         ref,
         children
       })
@@ -551,14 +787,14 @@ var CardBodyHeaderOverline = (0, import_react12.forwardRef)(
   }
 );
 CardBodyHeaderOverline.displayName = "Card.BodyHeaderOverline";
-var CardBodyHeaderTitle = (0, import_react12.forwardRef)(
+var CardBodyHeaderTitle = (0, import_react15.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
-    const Component = asChild ? import_react_slot5.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    const Component = asChild ? import_react_slot6.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Component,
       __spreadProps(__spreadValues({}, rest), {
-        className: (0, import_typed_classname11.clsx)("hds-card__body-header-title", className),
+        className: (0, import_typed_classname12.clsx)("hds-card__body-header-title", className),
         ref,
         children
       })
@@ -566,14 +802,14 @@ var CardBodyHeaderTitle = (0, import_react12.forwardRef)(
   }
 );
 CardBodyHeaderTitle.displayName = "Card.BodyHeaderTitle";
-var CardBodyDescription = (0, import_react12.forwardRef)(
+var CardBodyDescription = (0, import_react15.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
-    const Component = asChild ? import_react_slot5.Slot : "p";
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    const Component = asChild ? import_react_slot6.Slot : "p";
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Component,
       __spreadProps(__spreadValues({}, rest), {
-        className: (0, import_typed_classname11.clsx)("hds-card__body-description", className),
+        className: (0, import_typed_classname12.clsx)("hds-card__body-description", className),
         ref,
         children
       })
@@ -581,14 +817,14 @@ var CardBodyDescription = (0, import_react12.forwardRef)(
   }
 );
 CardBodyDescription.displayName = "Card.BodyDescription";
-var CardBodyAction = (0, import_react12.forwardRef)(
+var CardBodyAction = (0, import_react15.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
-    const Component = asChild ? import_react_slot5.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    const Component = asChild ? import_react_slot6.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Component,
       __spreadProps(__spreadValues({}, rest), {
-        className: (0, import_typed_classname11.clsx)("hds-card__body-action", className),
+        className: (0, import_typed_classname12.clsx)("hds-card__body-action", className),
         ref,
         children
       })
@@ -596,14 +832,14 @@ var CardBodyAction = (0, import_react12.forwardRef)(
   }
 );
 CardBodyAction.displayName = "Card.BodyAction";
-var CardBodyActionRow = (0, import_react12.forwardRef)(
+var CardBodyActionRow = (0, import_react15.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
-    const Component = asChild ? import_react_slot5.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    const Component = asChild ? import_react_slot6.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Component,
       __spreadProps(__spreadValues({}, rest), {
-        className: (0, import_typed_classname11.clsx)("hds-card__body-action-row", className),
+        className: (0, import_typed_classname12.clsx)("hds-card__body-action-row", className),
         ref,
         children
       })
@@ -611,14 +847,14 @@ var CardBodyActionRow = (0, import_react12.forwardRef)(
   }
 );
 CardBodyActionRow.displayName = "Card.BodyActionRow";
-var CardBodyActionArrow = (0, import_react12.forwardRef)(
+var CardBodyActionArrow = (0, import_react15.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className, direction } = _b, rest = __objRest(_b, ["asChild", "className", "direction"]);
-    const Component = asChild ? import_react_slot5.Slot : "span";
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    const Component = asChild ? import_react_slot6.Slot : "span";
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Component,
       __spreadProps(__spreadValues({}, rest), {
-        className: (0, import_typed_classname11.clsx)(
+        className: (0, import_typed_classname12.clsx)(
           "hds-card__body-action-arrow",
           { "hds-card__body-action-arrow-up-right": direction === "up-right" },
           className
@@ -629,7 +865,7 @@ var CardBodyActionArrow = (0, import_react12.forwardRef)(
   }
 );
 CardBodyActionArrow.displayName = "Card.BodyActionArrow";
-var Card = (0, import_react12.forwardRef)(
+var Card = (0, import_react15.forwardRef)(
   (_a, ref) => {
     var _b = _a, {
       as: Tag = "section",
@@ -648,12 +884,12 @@ var Card = (0, import_react12.forwardRef)(
       "color",
       "imagePosition"
     ]);
-    const Component = asChild ? import_react_slot5.Slot : Tag;
+    const Component = asChild ? import_react_slot6.Slot : Tag;
     const effectiveColor = variant === "focus" && !color ? "darker" : color;
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Component,
       __spreadProps(__spreadValues({}, rest), {
-        className: (0, import_typed_classname11.clsx)(
+        className: (0, import_typed_classname12.clsx)(
           "hds-card",
           { "hds-card--full-width": variant === "full-width" },
           { "hds-card--miniature": variant === "miniature" },
@@ -666,7 +902,7 @@ var Card = (0, import_react12.forwardRef)(
           className
         ),
         ref,
-        children: variant === "full-width" ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: (0, import_typed_classname11.clsx)("hds-card__layoutwrapper", className), children }) : children
+        children: variant === "full-width" ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: (0, import_typed_classname12.clsx)("hds-card__layoutwrapper", className), children }) : children
       })
     );
   }
@@ -684,17 +920,17 @@ Card.BodyActionRow = CardBodyActionRow;
 Card.BodyActionArrow = CardBodyActionArrow;
 
 // src/description-list/description-list.tsx
-var import_react13 = require("react");
-var import_typed_classname12 = require("@postenbring/hedwig-css/typed-classname");
-var import_jsx_runtime12 = require("react/jsx-runtime");
-var DescriptionList = (0, import_react13.forwardRef)(
+var import_react16 = require("react");
+var import_typed_classname13 = require("@postenbring/hedwig-css/typed-classname");
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var DescriptionList = (0, import_react16.forwardRef)(
   (_a, ref) => {
     var _b = _a, { variant = "vertical", className } = _b, rest = __objRest(_b, ["variant", "className"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       "dl",
       __spreadValues({
         ref,
-        className: (0, import_typed_classname12.clsx)(
+        className: (0, import_typed_classname13.clsx)(
           "hds-description-list",
           {
             "hds-description-list--horizontal": variant === "horizontal"
@@ -708,35 +944,35 @@ var DescriptionList = (0, import_react13.forwardRef)(
 DescriptionList.displayName = "DescriptionList";
 
 // src/figure/figure.tsx
-var import_typed_classname13 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot6 = require("@radix-ui/react-slot");
-var import_react14 = require("react");
-var import_jsx_runtime13 = require("react/jsx-runtime");
-var Figure = (0, import_react14.forwardRef)(
+var import_typed_classname14 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot7 = require("@radix-ui/react-slot");
+var import_react17 = require("react");
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var Figure = (0, import_react17.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, asChild, className } = _b, rest = __objRest(_b, ["children", "asChild", "className"]);
-    const Component = asChild ? import_react_slot6.Slot : "figure";
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Component, __spreadProps(__spreadValues({ ref, className: (0, import_typed_classname13.clsx)("hds-figure", className) }, rest), { children }));
+    const Component = asChild ? import_react_slot7.Slot : "figure";
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Component, __spreadProps(__spreadValues({ ref, className: (0, import_typed_classname14.clsx)("hds-figure", className) }, rest), { children }));
   }
 );
 Figure.displayName = "Figure";
 
 // src/form/checkbox/checkbox.tsx
-var import_react17 = require("react");
-var import_typed_classname16 = require("@postenbring/hedwig-css/typed-classname");
+var import_react20 = require("react");
+var import_typed_classname17 = require("@postenbring/hedwig-css/typed-classname");
 
 // src/form/error-message/error-message.tsx
-var import_typed_classname14 = require("@postenbring/hedwig-css/typed-classname");
-var import_react15 = require("react");
-var import_jsx_runtime14 = require("react/jsx-runtime");
-var ErrorMessage = (0, import_react15.forwardRef)(
+var import_typed_classname15 = require("@postenbring/hedwig-css/typed-classname");
+var import_react18 = require("react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var ErrorMessage = (0, import_react18.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, id, className } = _b, rest = __objRest(_b, ["children", "id", "className"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       "div",
       __spreadProps(__spreadValues({
         "aria-live": "polite",
-        className: (0, import_typed_classname14.clsx)("hds-error-message", className),
+        className: (0, import_typed_classname15.clsx)("hds-error-message", className),
         id,
         ref
       }, rest), {
@@ -748,12 +984,12 @@ var ErrorMessage = (0, import_react15.forwardRef)(
 ErrorMessage.displayName = "ErrorMessage";
 
 // src/form/fieldset/fieldset.tsx
-var import_react16 = require("react");
-var import_typed_classname15 = require("@postenbring/hedwig-css/typed-classname");
-var import_jsx_runtime15 = require("react/jsx-runtime");
-var FieldsetContext = (0, import_react16.createContext)({ hasError: false });
-var useFieldsetContext = () => (0, import_react16.useContext)(FieldsetContext);
-var Fieldset = (0, import_react16.forwardRef)(function Fieldset2(_a, ref) {
+var import_react19 = require("react");
+var import_typed_classname16 = require("@postenbring/hedwig-css/typed-classname");
+var import_jsx_runtime17 = require("react/jsx-runtime");
+var FieldsetContext = (0, import_react19.createContext)({ hasError: false });
+var useFieldsetContext = () => (0, import_react19.useContext)(FieldsetContext);
+var Fieldset = (0, import_react19.forwardRef)(function Fieldset2(_a, ref) {
   var _b = _a, {
     className,
     style,
@@ -772,21 +1008,21 @@ var Fieldset = (0, import_react16.forwardRef)(function Fieldset2(_a, ref) {
     "legend",
     "children"
   ]);
-  const errorMessageId = (0, import_react16.useId)();
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+  const errorMessageId = (0, import_react19.useId)();
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
     "fieldset",
     __spreadProps(__spreadValues({
       "aria-describedby": errorMessage ? errorMessageId : void 0,
       "aria-invalid": errorMessage ? true : void 0,
-      className: (0, import_typed_classname15.clsx)("hds-fieldset", className),
+      className: (0, import_typed_classname16.clsx)("hds-fieldset", className),
       ref,
       style
     }, rest), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
           "legend",
           __spreadProps(__spreadValues({
-            className: (0, import_typed_classname15.clsx)(
+            className: (0, import_typed_classname16.clsx)(
               "hds-fieldset__legend",
               { [`hds-fieldset__legend--${legendSize}`]: legendSize },
               legendClassName
@@ -795,16 +1031,16 @@ var Fieldset = (0, import_react16.forwardRef)(function Fieldset2(_a, ref) {
             children: legend
           })
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(FieldsetContext.Provider, { value: { hasError: Boolean(errorMessage) }, children }),
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ErrorMessage, __spreadProps(__spreadValues({ id: errorMessageId }, errorMessageProps), { children: errorMessage }))
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(FieldsetContext.Provider, { value: { hasError: Boolean(errorMessage) }, children }),
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ErrorMessage, __spreadProps(__spreadValues({ id: errorMessageId }, errorMessageProps), { children: errorMessage }))
       ]
     })
   );
 });
 
 // src/form/checkbox/checkbox.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
-var Checkbox = (0, import_react17.forwardRef)(
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var Checkbox = (0, import_react20.forwardRef)(
   (_a, ref) => {
     var _b = _a, {
       variant = "plain",
@@ -823,14 +1059,14 @@ var Checkbox = (0, import_react17.forwardRef)(
       "children",
       "className"
     ]);
-    const errorMessageId = (0, import_react17.useId)();
+    const errorMessageId = (0, import_react20.useId)();
     const { hasError: hasFieldsetError } = useFieldsetContext();
     const hasError = !!errorMessage || hasFieldsetError || hasErrorProp;
-    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: (0, import_typed_classname16.clsx)("hds-checkbox-wrapper"), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: (0, import_typed_classname17.clsx)("hds-checkbox-wrapper"), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
         "div",
         {
-          className: (0, import_typed_classname16.clsx)(
+          className: (0, import_typed_classname17.clsx)(
             "hds-checkbox",
             {
               [`hds-checkbox--${variant}`]: variant === "bounding-box",
@@ -839,8 +1075,8 @@ var Checkbox = (0, import_react17.forwardRef)(
             className
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("label", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("label", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
                 "input",
                 __spreadProps(__spreadValues({}, rest), {
                   "aria-invalid": hasError ? true : void 0,
@@ -849,28 +1085,28 @@ var Checkbox = (0, import_react17.forwardRef)(
                   type: "checkbox"
                 })
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { "aria-hidden": true, className: "hds-checkbox__checkmark" }),
-              title ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "hds-checkbox__title", children: title }) : children
+              /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { "aria-hidden": true, className: "hds-checkbox__checkmark" }),
+              title ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "hds-checkbox__title", children: title }) : children
             ] }),
             title ? children : null
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ErrorMessage, __spreadProps(__spreadValues({ id: errorMessageId }, errorMessageProps), { children: errorMessage }))
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ErrorMessage, __spreadProps(__spreadValues({ id: errorMessageId }, errorMessageProps), { children: errorMessage }))
     ] });
   }
 );
 Checkbox.displayName = "Checkbox";
 
 // src/form/date-picker/date-picker.tsx
-var import_react20 = require("react");
-var import_typed_classname18 = require("@postenbring/hedwig-css/typed-classname");
+var import_react22 = require("react");
+var import_typed_classname19 = require("@postenbring/hedwig-css/typed-classname");
 
 // src/form/input-group/input-group.tsx
-var import_react18 = require("react");
-var import_typed_classname17 = require("@postenbring/hedwig-css/typed-classname");
-var import_jsx_runtime17 = require("react/jsx-runtime");
-var InputGroup = (0, import_react18.forwardRef)(function InputGroup2(_a, ref) {
+var import_react21 = require("react");
+var import_typed_classname18 = require("@postenbring/hedwig-css/typed-classname");
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var InputGroup = (0, import_react21.forwardRef)(function InputGroup2(_a, ref) {
   var _b = _a, {
     id,
     className,
@@ -897,31 +1133,31 @@ var InputGroup = (0, import_react18.forwardRef)(function InputGroup2(_a, ref) {
     "readOnly",
     "children"
   ]);
-  const errorMessageId = (0, import_react18.useId)();
-  const inputId = (0, import_react18.useId)();
+  const errorMessageId = (0, import_react21.useId)();
+  const inputId = (0, import_react21.useId)();
   const renderInput = () => {
     var _a2;
     const inputProps = {
       "aria-describedby": errorMessage ? errorMessageId : void 0,
       "aria-invalid": errorMessage ? true : void 0,
       id: id != null ? id : inputId,
-      className: (0, import_typed_classname17.clsx)("hds-input-group__input")
+      className: (0, import_typed_classname18.clsx)("hds-input-group__input")
     };
     if (typeof children === "function") {
       return children(inputProps);
     }
-    const input = import_react18.Children.toArray(children)[0];
-    if (!(0, import_react18.isValidElement)(input)) {
+    const input = import_react21.Children.toArray(children)[0];
+    if (!(0, import_react21.isValidElement)(input)) {
       return;
     }
-    return (0, import_react18.cloneElement)(input, __spreadProps(__spreadValues(__spreadValues({}, inputProps), input.props), {
+    return (0, import_react21.cloneElement)(input, __spreadProps(__spreadValues(__spreadValues({}, inputProps), input.props), {
       className: `${inputProps.className} ${(_a2 = input.props.className) != null ? _a2 : ""}`
     }));
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     "div",
     __spreadProps(__spreadValues({
-      className: (0, import_typed_classname17.clsx)(
+      className: (0, import_typed_classname18.clsx)(
         "hds-input-group",
         {
           [`hds-input-group--${variant}`]: variant,
@@ -933,112 +1169,33 @@ var InputGroup = (0, import_react18.forwardRef)(function InputGroup2(_a, ref) {
       style
     }, rest), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
           "label",
           __spreadProps(__spreadValues({
-            className: (0, import_typed_classname17.clsx)("hds-input-group__label", labelClassName)
+            className: (0, import_typed_classname18.clsx)("hds-input-group__label", labelClassName)
           }, labelProps), {
             htmlFor: id != null ? id : inputId,
             children: label
           })
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
           "div",
           {
-            className: (0, import_typed_classname17.clsx)("hds-input-group__input-wrapper"),
+            className: (0, import_typed_classname18.clsx)("hds-input-group__input-wrapper"),
             "data-disabled": disabled,
             "data-readonly": readOnly,
             children: renderInput()
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ErrorMessage, __spreadProps(__spreadValues({ id: errorMessageId }, errorMessageProps), { children: errorMessage }))
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ErrorMessage, __spreadProps(__spreadValues({ id: errorMessageId }, errorMessageProps), { children: errorMessage }))
       ]
     })
   );
 });
 
-// src/utils/utils.ts
-var React = __toESM(require("react"));
-var import_react19 = require("react");
-function useMergeRefs(refs) {
-  return React.useMemo(() => {
-    if (refs.every((ref) => ref === null)) {
-      return null;
-    }
-    return (value) => {
-      refs.forEach((ref) => {
-        if (typeof ref === "function") {
-          ref(value);
-        } else if (ref !== null) {
-          ref.current = value;
-        }
-      });
-    };
-  }, refs);
-}
-function useResize(ref) {
-  const [width, setWidth] = (0, import_react19.useState)(0);
-  const [height, setHeight] = (0, import_react19.useState)(0);
-  const handleResize = (0, import_react19.useCallback)(() => {
-    var _a, _b, _c, _d;
-    if ((ref == null ? void 0 : ref.current) !== null) {
-      setWidth((_b = (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.offsetWidth) != null ? _b : 0);
-      setHeight((_d = (_c = ref == null ? void 0 : ref.current) == null ? void 0 : _c.offsetHeight) != null ? _d : 0);
-    }
-  }, [ref]);
-  (0, import_react19.useEffect)(() => {
-    window.addEventListener("load", handleResize);
-    window.addEventListener("resize", handleResize);
-    return () => {
-      window.removeEventListener("load", handleResize);
-      window.removeEventListener("resize", handleResize);
-    };
-  }, [ref, handleResize]);
-  (0, import_react19.useEffect)(() => {
-    handleResize();
-  }, []);
-  return { width, height };
-}
-function subscribe() {
-  return () => {
-  };
-}
-function useHydrated() {
-  return React.useSyncExternalStore(
-    subscribe,
-    () => true,
-    () => false
-  );
-}
-function focusTrap(element) {
-  var _a, _b;
-  if (element === document.body) return () => {
-  };
-  let inertElements = [];
-  for (let el = element; el; el = el.parentElement) {
-    if (el === document.body) break;
-    for (const sibling of (_b = (_a = el.parentElement) == null ? void 0 : _a.children) != null ? _b : []) {
-      if (sibling === el) continue;
-      if (!(sibling instanceof HTMLElement)) continue;
-      if (sibling.hasAttribute("inert")) continue;
-      sibling.setAttribute("inert", "true");
-      inertElements.push(sibling);
-    }
-  }
-  return () => {
-    releaseFocusTrap(inertElements);
-    inertElements = [];
-  };
-}
-function releaseFocusTrap(inertElements) {
-  for (const el of inertElements) {
-    el.removeAttribute("inert");
-  }
-}
-
 // src/form/date-picker/date-picker.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
-var DatePicker = (0, import_react20.forwardRef)(function DatePicker2(_a, ref) {
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var DatePicker = (0, import_react22.forwardRef)(function DatePicker2(_a, ref) {
   var _b = _a, {
     className,
     variant,
@@ -1062,12 +1219,12 @@ var DatePicker = (0, import_react20.forwardRef)(function DatePicker2(_a, ref) {
     "readOnly",
     "calendarButtonTitle"
   ]);
-  const inputRef = (0, import_react20.useRef)(null);
+  const inputRef = (0, import_react22.useRef)(null);
   const mergedRef = useMergeRefs([inputRef, ref]);
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     InputGroup,
     {
-      className: (0, import_typed_classname18.clsx)("hds-date-picker", className),
+      className: (0, import_typed_classname19.clsx)("hds-date-picker", className),
       disabled,
       errorMessage,
       id,
@@ -1076,8 +1233,8 @@ var DatePicker = (0, import_react20.forwardRef)(function DatePicker2(_a, ref) {
       readOnly,
       style,
       variant,
-      children: (inputProps) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      children: (inputProps) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "input",
           __spreadProps(__spreadValues(__spreadValues({}, rest), inputProps), {
             disabled,
@@ -1086,10 +1243,10 @@ var DatePicker = (0, import_react20.forwardRef)(function DatePicker2(_a, ref) {
             type: "date"
           })
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "button",
           {
-            className: (0, import_typed_classname18.clsx)("hds-date-picker__calendar-button"),
+            className: (0, import_typed_classname19.clsx)("hds-date-picker__calendar-button"),
             type: "button",
             title: calendarButtonTitle,
             onClick: () => {
@@ -1106,69 +1263,17 @@ DatePicker.displayName = "DatePicker";
 
 // src/form/error-summary/error-summary.tsx
 var import_react26 = require("react");
-
-// src/message/message.tsx
-var import_react21 = require("react");
-var import_typed_classname19 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot7 = require("@radix-ui/react-slot");
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var MessageTitle = (0, import_react21.forwardRef)(
-  (_a, ref) => {
-    var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
-    const Component = asChild ? import_react_slot7.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-      Component,
-      __spreadValues({
-        className: (0, import_typed_classname19.clsx)("hds-message__title", className),
-        ref
-      }, rest)
-    );
-  }
-);
-MessageTitle.displayName = "Message.Title";
-var MessageDescription = (0, import_react21.forwardRef)(
-  (_a, ref) => {
-    var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
-    const Component = asChild ? import_react_slot7.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-      Component,
-      __spreadValues({
-        className: (0, import_typed_classname19.clsx)("hds-message__description", className),
-        ref
-      }, rest)
-    );
-  }
-);
-MessageDescription.displayName = "Message.Description";
-var Message = (0, import_react21.forwardRef)(
-  (_a, ref) => {
-    var _b = _a, { children, className, variant = "success", icon, iconClassName } = _b, rest = __objRest(_b, ["children", "className", "variant", "icon", "iconClassName"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
-      Box,
-      __spreadProps(__spreadValues({
-        className: (0, import_typed_classname19.clsx)(`hds-message`, `hds-message--${variant}`, className),
-        ref
-      }, rest), {
-        children: [
-          variant === "neutral" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: (0, import_typed_classname19.clsx)("hds-message--neutral__icon", iconClassName), children: icon }),
-          children
-        ]
-      })
-    );
-  }
-);
-Message.displayName = "Message";
-Message.Title = MessageTitle;
-Message.Description = MessageDescription;
+var import_typed_classname23 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot9 = require("@radix-ui/react-slot");
 
 // src/list/list.tsx
-var import_react22 = require("react");
+var import_react23 = require("react");
 var import_typed_classname20 = require("@postenbring/hedwig-css/typed-classname");
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var UnorderedList = (0, import_react22.forwardRef)(
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var UnorderedList = (0, import_react23.forwardRef)(
   (_a, ref) => {
     var _b = _a, { size = "default", className } = _b, rest = __objRest(_b, ["size", "className"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       "ul",
       __spreadValues({
         ref,
@@ -1182,10 +1287,10 @@ var UnorderedList = (0, import_react22.forwardRef)(
   }
 );
 UnorderedList.displayName = "UnorderedList";
-var OrderedList = (0, import_react22.forwardRef)(
+var OrderedList = (0, import_react23.forwardRef)(
   (_a, ref) => {
     var _b = _a, { size = "medium", className } = _b, rest = __objRest(_b, ["size", "className"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       "ol",
       __spreadValues({
         ref,
@@ -1202,12 +1307,12 @@ OrderedList.displayName = "OrderedList";
 
 // src/list/link-list.tsx
 var import_typed_classname21 = require("@postenbring/hedwig-css/typed-classname");
-var import_react23 = require("react");
-var import_jsx_runtime21 = require("react/jsx-runtime");
-var LinkList = (0, import_react23.forwardRef)(
+var import_react24 = require("react");
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var LinkList = (0, import_react24.forwardRef)(
   (_a, ref) => {
     var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
       UnorderedList,
       __spreadValues({
         ref,
@@ -1217,135 +1322,36 @@ var LinkList = (0, import_react23.forwardRef)(
   }
 );
 LinkList.displayName = "LinkList";
-
-// src/link/link.tsx
-var React2 = require("react");
-var import_typed_classname22 = require("@postenbring/hedwig-css/typed-classname");
-var import_react24 = require("react");
-var import_react_slot8 = require("@radix-ui/react-slot");
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var Link = (0, import_react24.forwardRef)(
-  (_a, ref) => {
-    var _b = _a, { asChild, children, variant = "underline", size = "default", icon, className } = _b, rest = __objRest(_b, ["asChild", "children", "variant", "size", "icon", "className"]);
-    const Component = asChild ? import_react_slot8.Slot : "a";
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-      Component,
-      __spreadProps(__spreadValues({
-        className: (0, import_typed_classname22.clsx)(
-          "hds-link",
-          variant !== "underline" && `hds-link--${variant}`,
-          size !== "default" && `hds-link--${size}`,
-          { "hds-link--trailing-icon": icon === "trailing" },
-          { "hds-link--leading-icon": icon === "leading" },
-          className
-        ),
-        ref
-      }, rest), {
-        children
-      })
-    );
-  }
-);
-Link.displayName = "Link";
-
-// src/utils/auto-animate-height.tsx
-var import_react25 = require("react");
-var import_jsx_runtime23 = require("react/jsx-runtime");
-var AutoAnimateHeight = (0, import_react25.forwardRef)(
-  (_a, ref) => {
-    var _b = _a, {
-      children,
-      style,
-      animationDuration = "quick",
-      animationEasing = "normal",
-      onTransitionEnd
-    } = _b, rest = __objRest(_b, [
-      "children",
-      "style",
-      "animationDuration",
-      "animationEasing",
-      "onTransitionEnd"
-    ]);
-    var _a2, _b2;
-    const rootRef = (0, import_react25.useRef)(null);
-    const mergedRef = useMergeRefs([rootRef, ref]);
-    const measurementRef = (0, import_react25.useRef)(null);
-    const [height, setHeight] = (0, import_react25.useState)(
-      void 0
-    );
-    const [clonedChildren, setClonedChildren] = (0, import_react25.useState)(
-      () => (0, import_react25.cloneElement)(/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_jsx_runtime23.Fragment, { children }), {})
-    );
-    (0, import_react25.useEffect)(() => {
-      var _a3;
-      if (!rootRef.current) return;
-      if (!measurementRef.current) return;
-      if (document.body.scrollHeight === 0) return;
-      const currentMeasurement = measurementRef.current;
-      const { height: newHeight } = currentMeasurement.getBoundingClientRect();
-      let previouslyObservedHeight = newHeight;
-      const resizeObserver = new ResizeObserver(() => {
-        const { height: resizedHeight } = currentMeasurement.getBoundingClientRect();
-        if (resizedHeight === previouslyObservedHeight) return;
-        previouslyObservedHeight = resizedHeight;
-        setHeight({ height: resizedHeight, shouldAnimate: false });
-      });
-      resizeObserver.observe(currentMeasurement);
-      setHeight({ height: newHeight, shouldAnimate: true });
-      const nextClonedChildren = (0, import_react25.cloneElement)(/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_jsx_runtime23.Fragment, { children }), {});
-      if (newHeight >= ((_a3 = height == null ? void 0 : height.height) != null ? _a3 : 0)) {
-        setClonedChildren(nextClonedChildren);
-        return () => {
-          resizeObserver.disconnect();
-        };
-      }
-      const currentRoot = rootRef.current;
-      function onTransitionEndHandler(e) {
-        if (e.propertyName !== "height") return;
-        setClonedChildren(nextClonedChildren);
-      }
-      currentRoot.addEventListener("transitionend", onTransitionEndHandler);
-      return () => {
-        resizeObserver.disconnect();
-        currentRoot.removeEventListener("transitionend", onTransitionEndHandler);
-      };
-    }, [children]);
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
-      "div",
+
+// src/link/link.tsx
+var React3 = require("react");
+var import_typed_classname22 = require("@postenbring/hedwig-css/typed-classname");
+var import_react25 = require("react");
+var import_react_slot8 = require("@radix-ui/react-slot");
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var Link = (0, import_react25.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { asChild, children, variant = "underline", size = "default", icon, className } = _b, rest = __objRest(_b, ["asChild", "children", "variant", "size", "icon", "className"]);
+    const Component = asChild ? import_react_slot8.Slot : "a";
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      Component,
       __spreadProps(__spreadValues({
-        ref: mergedRef,
-        onTransitionEnd,
-        style: __spreadValues({
-          position: "relative",
-          overflow: "hidden",
-          height: (_b2 = height == null ? void 0 : height.height) != null ? _b2 : (_a2 = measurementRef.current) == null ? void 0 : _a2.getBoundingClientRect().height,
-          transitionProperty: (height == null ? void 0 : height.shouldAnimate) ? "height" : "none",
-          transitionDuration: `var(--hds-micro-animation-duration-${animationDuration})`,
-          transitionTimingFunction: `var(--hds-micro-animation-easing-${animationEasing})`,
-          willChange: "height"
-        }, style)
+        className: (0, import_typed_classname22.clsx)(
+          "hds-link",
+          variant !== "underline" && `hds-link--${variant}`,
+          size !== "default" && `hds-link--${size}`,
+          { "hds-link--trailing-icon": icon === "trailing" },
+          { "hds-link--leading-icon": icon === "leading" },
+          className
+        ),
+        ref
       }, rest), {
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-            "div",
-            {
-              "aria-hidden": true,
-              ref: measurementRef,
-              style: {
-                position: "absolute",
-                visibility: "hidden",
-                pointerEvents: "none"
-              },
-              children
-            }
-          ),
-          clonedChildren
-        ]
+        children
       })
     );
   }
 );
-AutoAnimateHeight.displayName = "AutoAnimateHeight";
+Link.displayName = "Link";
 
 // src/form/error-summary/focus.ts
 function focusWithLegendOrLabelInViewport(id) {
@@ -1391,9 +1397,10 @@ function labelForInput(input) {
 // src/form/error-summary/error-summary.tsx
 var import_jsx_runtime24 = require("react/jsx-runtime");
 var ErrorSummaryHeading = (0, import_react26.forwardRef)((_a, ref) => {
-  var _b = _a, { children, as: Tag, autoFocus = true } = _b, rest = __objRest(_b, ["children", "as", "autoFocus"]);
+  var _b = _a, { asChild, children, as: Tag, autoFocus = true } = _b, rest = __objRest(_b, ["asChild", "children", "as", "autoFocus"]);
   const focusRef = (0, import_react26.useRef)(null);
   const mergedRef = useMergeRefs([focusRef, ref]);
+  const Component = asChild ? import_react_slot9.Slot : Tag;
   (0, import_react26.useEffect)(() => {
     setTimeout(() => {
       if (focusRef.current && autoFocus) {
@@ -1401,17 +1408,13 @@ var ErrorSummaryHeading = (0, import_react26.forwardRef)((_a, ref) => {
       }
     });
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Message.Title, __spreadProps(__spreadValues({ ref: mergedRef, tabIndex: -1, asChild: true }, rest), { children: Tag ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Tag, { children }) : children }));
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname23.clsx)(`hds-error-summary__title`), ref: mergedRef, tabIndex: -1 }, rest), { children }));
 });
 ErrorSummaryHeading.displayName = "ErrorSummary.Heading";
 var ErrorSummaryList = (0, import_react26.forwardRef)(
   (_a, ref) => {
-    var _b = _a, { children, style: _style, size = "small" } = _b, rest = __objRest(_b, ["children", "style", "size"]);
-    const style = __spreadValues({
-      // Match the link `solid` style, which black underline
-      "--_hds-list-marker-color": "var(--hds-ui-colors-black)"
-    }, _style);
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Message.Description, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(UnorderedList, __spreadProps(__spreadValues({ size, ref, style }, rest), { children })) });
+    var _b = _a, { children, size = "small" } = _b, rest = __objRest(_b, ["children", "size"]);
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(UnorderedList, __spreadProps(__spreadValues({ size, ref }, rest), { children }));
   }
 );
 ErrorSummaryList.displayName = "ErrorSummary.List";
@@ -1425,14 +1428,24 @@ var ErrorSummaryItem = (0, import_react26.forwardRef)(
         e.preventDefault();
       }
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("li", __spreadProps(__spreadValues({ ref }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Link, __spreadProps(__spreadValues({ size: "small", href, variant: "solid" }, linkProps), { onClick, children })) }));
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("li", __spreadProps(__spreadValues({ className: (0, import_typed_classname23.clsx)(`hds-error-summary__list-item`), ref }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      Link,
+      __spreadProps(__spreadValues({
+        size: "small",
+        href,
+        variant: "inverted-no-underline"
+      }, linkProps), {
+        onClick,
+        children
+      })
+    ) }));
   }
 );
 ErrorSummaryItem.displayName = "ErrorSummary.Item";
 var ErrorSummary = (0, import_react26.forwardRef)(
   (_a, ref) => {
-    var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Message, __spreadProps(__spreadValues({ variant: "warning", ref }, rest), { children }));
+    var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Box, __spreadProps(__spreadValues({ ref }, rest), { className: (0, import_typed_classname23.clsx)(`hds-error-summary`, className), children }));
   }
 );
 ErrorSummary.displayName = "ErrorSummary";
@@ -1442,14 +1455,14 @@ ErrorSummary.Item = ErrorSummaryItem;
 
 // src/form/input/input.tsx
 var import_react27 = require("react");
-var import_typed_classname23 = require("@postenbring/hedwig-css/typed-classname");
+var import_typed_classname24 = require("@postenbring/hedwig-css/typed-classname");
 var import_jsx_runtime25 = require("react/jsx-runtime");
 var Input = (0, import_react27.forwardRef)(function Input2(_a, ref) {
   var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     InputGroup,
     {
-      className: (0, import_typed_classname23.clsx)("hds-input", className),
+      className: (0, import_typed_classname24.clsx)("hds-input", className),
       disabled,
       errorMessage,
       id,
@@ -1466,7 +1479,7 @@ Input.displayName = "Input";
 
 // src/form/radio-button/radio-button.tsx
 var import_react29 = require("react");
-var import_typed_classname24 = require("@postenbring/hedwig-css/typed-classname");
+var import_typed_classname25 = require("@postenbring/hedwig-css/typed-classname");
 
 // src/form/radio-button/radio-group.tsx
 var import_react28 = require("react");
@@ -1527,7 +1540,7 @@ var RadioButton = (0, import_react29.forwardRef)(
     return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
       "div",
       {
-        className: (0, import_typed_classname24.clsx)(
+        className: (0, import_typed_classname25.clsx)(
           "hds-radio-button",
           {
             [`hds-radio-button--${variant}`]: variant === "bounding-box",
@@ -1559,14 +1572,14 @@ RadioButton.displayName = "RadioButton";
 
 // src/form/select/select.tsx
 var import_react30 = require("react");
-var import_typed_classname25 = require("@postenbring/hedwig-css/typed-classname");
+var import_typed_classname26 = require("@postenbring/hedwig-css/typed-classname");
 var import_jsx_runtime28 = require("react/jsx-runtime");
 var Select = (0, import_react30.forwardRef)(function Select2(_a, ref) {
   var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, children } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "children"]);
   return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     InputGroup,
     {
-      className: (0, import_typed_classname25.clsx)("hds-select", className),
+      className: (0, import_typed_classname26.clsx)("hds-select", className),
       disabled,
       errorMessage,
       id,
@@ -1582,14 +1595,14 @@ Select.displayName = "Select";
 
 // src/form/textarea/textarea.tsx
 var import_react31 = require("react");
-var import_typed_classname26 = require("@postenbring/hedwig-css/typed-classname");
+var import_typed_classname27 = require("@postenbring/hedwig-css/typed-classname");
 var import_jsx_runtime29 = require("react/jsx-runtime");
 var Textarea = (0, import_react31.forwardRef)(function Textarea2(_a, ref) {
   var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
   return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
     InputGroup,
     {
-      className: (0, import_typed_classname26.clsx)("hds-textarea", className),
+      className: (0, import_typed_classname27.clsx)("hds-textarea", className),
       disabled,
       errorMessage,
       id,
@@ -1606,22 +1619,22 @@ Textarea.displayName = "Textarea";
 
 // src/footer/footer.tsx
 var import_react32 = require("react");
-var import_typed_classname27 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot9 = require("@radix-ui/react-slot");
+var import_typed_classname28 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot10 = require("@radix-ui/react-slot");
 var import_jsx_runtime30 = require("react/jsx-runtime");
 var FooterLogo = (0, import_react32.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, className, asChild } = _b, rest = __objRest(_b, ["children", "className", "asChild"]);
-    const Component = asChild ? import_react_slot9.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname27.clsx)(`hds-footer__logo`, className), ref }, rest), { children }));
+    const Component = asChild ? import_react_slot10.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname28.clsx)(`hds-footer__logo`, className), ref }, rest), { children }));
   }
 );
 FooterLogo.displayName = "Footer.Logo";
 var FooterButtonLink = (0, import_react32.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, className, asChild } = _b, rest = __objRest(_b, ["children", "className", "asChild"]);
-    const Component = asChild ? import_react_slot9.Slot : "a";
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Button, { asChild: true, variant: "inverted", className: (0, import_typed_classname27.clsx)(className), children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Component, __spreadProps(__spreadValues({ ref }, rest), { children })) });
+    const Component = asChild ? import_react_slot10.Slot : "a";
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Button, { asChild: true, variant: "inverted", className: (0, import_typed_classname28.clsx)(className), children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Component, __spreadProps(__spreadValues({ ref }, rest), { children })) });
   }
 );
 FooterButtonLink.displayName = "FooterButton";
@@ -1631,7 +1644,7 @@ var FooterLinkSections = (0, import_react32.forwardRef)(
     return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_jsx_runtime30.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       Accordion,
       __spreadProps(__spreadValues({
-        className: (0, import_typed_classname27.clsx)("hds-footer__link-sections", className),
+        className: (0, import_typed_classname28.clsx)("hds-footer__link-sections", className),
         ref
       }, rest), {
         children
@@ -1648,7 +1661,7 @@ var FooterLinkSection = (0, import_react32.forwardRef)(
       /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
         Accordion.Item,
         __spreadProps(__spreadValues({
-          className: (0, import_typed_classname27.clsx)(`hds-footer__link-section`, className),
+          className: (0, import_typed_classname28.clsx)(`hds-footer__link-section`, className),
           ref
         }, rest), {
           children: [
@@ -1657,7 +1670,7 @@ var FooterLinkSection = (0, import_react32.forwardRef)(
           ]
         })
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: (0, import_typed_classname27.clsx)(`hds-footer__link-section`, className), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: (0, import_typed_classname28.clsx)(`hds-footer__link-section`, className), children: [
         /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("h2", { children: heading }),
         linkListChildren
       ] })
@@ -1668,11 +1681,11 @@ FooterLinkSection.displayName = "Footer.LinkSection";
 var Footer = (0, import_react32.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, className, variant, asChild } = _b, rest = __objRest(_b, ["children", "className", "variant", "asChild"]);
-    const Component = asChild ? import_react_slot9.Slot : "footer";
+    const Component = asChild ? import_react_slot10.Slot : "footer";
     return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       Component,
       __spreadProps(__spreadValues({
-        className: (0, import_typed_classname27.clsx)(
+        className: (0, import_typed_classname28.clsx)(
           `hds-footer`,
           variant === "slim" && "hds-footer--slim",
           className
@@ -1692,7 +1705,7 @@ Footer.LinkSection = FooterLinkSection;
 
 // src/help-text/help-text.tsx
 var Popover = __toESM(require("@radix-ui/react-popover"));
-var import_typed_classname28 = require("@postenbring/hedwig-css/typed-classname");
+var import_typed_classname29 = require("@postenbring/hedwig-css/typed-classname");
 var import_react33 = require("react");
 var import_jsx_runtime31 = require("react/jsx-runtime");
 var HelpText = (0, import_react33.forwardRef)(
@@ -1708,7 +1721,7 @@ var HelpText = (0, import_react33.forwardRef)(
           "button",
           __spreadProps(__spreadValues({
             ref,
-            className: (0, import_typed_classname28.clsx)("hds-help-text-button", className),
+            className: (0, import_typed_classname29.clsx)("hds-help-text-button", className),
             title,
             type: "button"
           }, rest), {
@@ -1718,7 +1731,7 @@ var HelpText = (0, import_react33.forwardRef)(
         /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Popover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Popover.Content, { asChild: true, side, align, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
           Box,
           __spreadProps(__spreadValues({}, boxProps), {
-            className: (0, import_typed_classname28.clsx)("hds-help-text-box", boxProps == null ? void 0 : boxProps.className),
+            className: (0, import_typed_classname29.clsx)("hds-help-text-box", boxProps == null ? void 0 : boxProps.className),
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Popover.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Box.CloseButton, {}) }),
               helpText
@@ -1732,18 +1745,18 @@ var HelpText = (0, import_react33.forwardRef)(
 HelpText.displayName = "HelpText";
 
 // src/layout/container/container.tsx
-var import_typed_classname29 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot10 = require("@radix-ui/react-slot");
+var import_typed_classname30 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot11 = require("@radix-ui/react-slot");
 var import_react34 = require("react");
 var import_jsx_runtime32 = require("react/jsx-runtime");
 var Container = (0, import_react34.forwardRef)(
   (_a, ref) => {
     var _b = _a, { as: Tag = "div", asChild, className, children, variant } = _b, rest = __objRest(_b, ["as", "asChild", "className", "children", "variant"]);
-    const Component = asChild ? import_react_slot10.Slot : Tag;
+    const Component = asChild ? import_react_slot11.Slot : Tag;
     return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
       Component,
       __spreadProps(__spreadValues({}, rest), {
-        className: (0, import_typed_classname29.clsx)(
+        className: (0, import_typed_classname30.clsx)(
           "hds-container",
           { "hds-container--slim": variant === "slim" },
           className
@@ -1757,8 +1770,8 @@ var Container = (0, import_react34.forwardRef)(
 Container.displayName = "Container";
 
 // src/layout/grid/grid.tsx
-var import_typed_classname30 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot11 = require("@radix-ui/react-slot");
+var import_typed_classname31 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot12 = require("@radix-ui/react-slot");
 var import_react35 = require("react");
 
 // src/layout/responsive.ts
@@ -1784,13 +1797,13 @@ var import_jsx_runtime33 = require("react/jsx-runtime");
 var GridItem = (0, import_react35.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, asChild, className, span, center, style: _style } = _b, rest = __objRest(_b, ["children", "asChild", "className", "span", "center", "style"]);
-    const Component = asChild ? import_react_slot11.Slot : "div";
+    const Component = asChild ? import_react_slot12.Slot : "div";
     const style = __spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-grid-item-span", span)), getResponsiveProps("--hds-grid-item-center", center, (value) => value ? "1" : "0"));
     return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
       Component,
       __spreadProps(__spreadValues({
         style,
-        className: (0, import_typed_classname30.clsx)("hds-grid__item", className),
+        className: (0, import_typed_classname31.clsx)("hds-grid__item", className),
         ref
       }, rest), {
         children
@@ -1802,13 +1815,13 @@ GridItem.displayName = "Grid.Item";
 var Grid = (0, import_react35.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, asChild, className, span, center, style: _style, gap, gapX, gapY } = _b, rest = __objRest(_b, ["children", "asChild", "className", "span", "center", "style", "gap", "gapX", "gapY"]);
-    const Component = asChild ? import_react_slot11.Slot : "div";
+    const Component = asChild ? import_react_slot12.Slot : "div";
     const style = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-grid-gap", gap, getSpacingVariable)), getResponsiveProps("--hds-grid-gap-x", gapX, getSpacingVariable)), getResponsiveProps("--hds-grid-gap-y", gapY, getSpacingVariable)), getResponsiveProps("--hds-grid-span", span)), getResponsiveProps("--hds-grid-center", center, (value) => value ? "1" : "0"));
     return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
       Component,
       __spreadProps(__spreadValues({
         style,
-        className: (0, import_typed_classname30.clsx)("hds-grid", className),
+        className: (0, import_typed_classname31.clsx)("hds-grid", className),
         ref
       }, rest), {
         children
@@ -1820,10 +1833,10 @@ Grid.displayName = "Grid";
 Grid.Item = GridItem;
 
 // src/layout/stack/stack.tsx
-var React3 = require("react");
-var import_typed_classname31 = require("@postenbring/hedwig-css/typed-classname");
+var React4 = require("react");
+var import_typed_classname32 = require("@postenbring/hedwig-css/typed-classname");
 var import_react36 = require("react");
-var import_react_slot12 = require("@radix-ui/react-slot");
+var import_react_slot13 = require("@radix-ui/react-slot");
 var import_jsx_runtime34 = require("react/jsx-runtime");
 var Stack = (0, import_react36.forwardRef)(
   (_a, ref) => {
@@ -1852,13 +1865,13 @@ var Stack = (0, import_react36.forwardRef)(
       "align",
       "justify"
     ]);
-    const Component = asChild ? import_react_slot12.Slot : "div";
+    const Component = asChild ? import_react_slot13.Slot : "div";
     const style = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-stack-gap", gap, getSpacingVariable)), getResponsiveProps("--hds-stack-gap-x", gapX, getSpacingVariable)), getResponsiveProps("--hds-stack-gap-y", gapY, getSpacingVariable)), getResponsiveProps("--hds-stack-direction", direction)), getResponsiveProps("--hds-stack-wrap", wrap, (value) => value ? "wrap" : "nowrap")), getResponsiveProps("--hds-stack-align", align)), getResponsiveProps("--hds-stack-justify", justify));
     return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
       Component,
       __spreadProps(__spreadValues({
         style,
-        className: (0, import_typed_classname31.clsx)("hds-stack", className),
+        className: (0, import_typed_classname32.clsx)("hds-stack", className),
         ref
       }, rest), {
         children
@@ -1876,57 +1889,111 @@ var VStack = (0, import_react36.forwardRef)((props, ref) => {
 });
 VStack.displayName = "VStack";
 
-// src/modal/modal.tsx
+// src/message/message.tsx
 var import_react37 = require("react");
-var import_typed_classname32 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot13 = require("@radix-ui/react-slot");
+var import_typed_classname33 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot14 = require("@radix-ui/react-slot");
 var import_jsx_runtime35 = require("react/jsx-runtime");
-var ModalHeader = (0, import_react37.forwardRef)(
+var MessageTitle = (0, import_react37.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
-    const Component = asChild ? import_react_slot13.Slot : "h1";
+    const Component = asChild ? import_react_slot14.Slot : "div";
     return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
       Component,
       __spreadValues({
-        className: (0, import_typed_classname32.clsx)("hds-modal__header", className),
+        className: (0, import_typed_classname33.clsx)("hds-message__title", className),
         ref
       }, rest)
     );
   }
 );
-ModalHeader.displayName = "Modal.Header";
-var ModalContent = (0, import_react37.forwardRef)(
+MessageTitle.displayName = "Message.Title";
+var MessageDescription = (0, import_react37.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
-    const Component = asChild ? import_react_slot13.Slot : "div";
+    const Component = asChild ? import_react_slot14.Slot : "div";
     return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
       Component,
       __spreadValues({
-        className: (0, import_typed_classname32.clsx)("hds-modal__content", className),
+        className: (0, import_typed_classname33.clsx)("hds-message__description", className),
+        ref
+      }, rest)
+    );
+  }
+);
+MessageDescription.displayName = "Message.Description";
+var Message = (0, import_react37.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { children, className, variant = "success", icon, iconClassName } = _b, rest = __objRest(_b, ["children", "className", "variant", "icon", "iconClassName"]);
+    return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
+      Box,
+      __spreadProps(__spreadValues({
+        className: (0, import_typed_classname33.clsx)(`hds-message`, `hds-message--${variant}`, className),
+        ref
+      }, rest), {
+        children: [
+          variant === "neutral" && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: (0, import_typed_classname33.clsx)("hds-message--neutral__icon", iconClassName), children: icon }),
+          children
+        ]
+      })
+    );
+  }
+);
+Message.displayName = "Message";
+Message.Title = MessageTitle;
+Message.Description = MessageDescription;
+
+// src/modal/modal.tsx
+var import_react38 = require("react");
+var import_typed_classname34 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot15 = require("@radix-ui/react-slot");
+var import_jsx_runtime36 = require("react/jsx-runtime");
+var ModalHeader = (0, import_react38.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
+    const Component = asChild ? import_react_slot15.Slot : "h1";
+    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+      Component,
+      __spreadValues({
+        className: (0, import_typed_classname34.clsx)("hds-modal__header", className),
+        ref
+      }, rest)
+    );
+  }
+);
+ModalHeader.displayName = "Modal.Header";
+var ModalContent = (0, import_react38.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
+    const Component = asChild ? import_react_slot15.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+      Component,
+      __spreadValues({
+        className: (0, import_typed_classname34.clsx)("hds-modal__content", className),
         ref
       }, rest)
     );
   }
 );
 ModalContent.displayName = "Modal.Content";
-var ModalFooter = (0, import_react37.forwardRef)(
+var ModalFooter = (0, import_react38.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
-    const Component = asChild ? import_react_slot13.Slot : "footer";
-    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+    const Component = asChild ? import_react_slot15.Slot : "footer";
+    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
       Component,
       __spreadValues({
-        className: (0, import_typed_classname32.clsx)("hds-modal__footer", className),
+        className: (0, import_typed_classname34.clsx)("hds-modal__footer", className),
         ref
       }, rest)
     );
   }
 );
 ModalFooter.displayName = "Modal.Footer";
-var Modal = (0, import_react37.forwardRef)(
+var Modal = (0, import_react38.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, className, open, closeOnBackdropClick, onClick } = _b, rest = __objRest(_b, ["children", "className", "open", "closeOnBackdropClick", "onClick"]);
-    const modalRef = (0, import_react37.useRef)(null);
+    const modalRef = (0, import_react38.useRef)(null);
     const mergedRef = useMergeRefs([modalRef, ref]);
     function onCloseButtonClick() {
       var _a2;
@@ -1934,7 +2001,7 @@ var Modal = (0, import_react37.forwardRef)(
       return false;
     }
     useScrollLock(modalRef, "hds-modal-scroll-lock");
-    (0, import_react37.useEffect)(() => {
+    (0, import_react38.useEffect)(() => {
       if (modalRef.current && open !== void 0) {
         if (open && !modalRef.current.open) {
           modalRef.current.showModal();
@@ -1949,16 +2016,16 @@ var Modal = (0, import_react37.forwardRef)(
       }
       onClick == null ? void 0 : onClick(e);
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
       Box,
       {
         asChild: true,
-        className: (0, import_typed_classname32.clsx)("hds-modal", className),
+        className: (0, import_typed_classname34.clsx)("hds-modal", className),
         closeable: true,
         onClick: onDialogClick,
         onClose: onCloseButtonClick,
         variant: "white",
-        children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("dialog", __spreadProps(__spreadValues({ ref: mergedRef }, rest), { children }))
+        children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("dialog", __spreadProps(__spreadValues({ ref: mergedRef }, rest), { children }))
       }
     );
   }
@@ -1968,7 +2035,7 @@ Modal.Header = ModalHeader;
 Modal.Content = ModalContent;
 Modal.Footer = ModalFooter;
 function useScrollLock(modalRef, bodyClass) {
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     if (!modalRef.current) return;
     if (modalRef.current.open) document.body.classList.add(bodyClass);
     const observer = new MutationObserver(() => {
@@ -1988,18 +2055,18 @@ function useScrollLock(modalRef, bodyClass) {
 }
 
 // src/navbar/navbar.tsx
-var import_react39 = require("react");
-var import_typed_classname34 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot14 = require("@radix-ui/react-slot");
+var import_react40 = require("react");
+var import_typed_classname36 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot16 = require("@radix-ui/react-slot");
 
 // src/navbar/navbar-expandable-menu.tsx
-var import_react38 = require("react");
-var import_typed_classname33 = require("@postenbring/hedwig-css/typed-classname");
+var import_react39 = require("react");
+var import_typed_classname35 = require("@postenbring/hedwig-css/typed-classname");
 
 // src/navbar/icons.tsx
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 function CloseIcon() {
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("svg", { "aria-hidden": true, xmlns: "http://www.w3.org/2000/svg", width: 32, height: 32, viewBox: "0 0 32 32", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("svg", { "aria-hidden": true, xmlns: "http://www.w3.org/2000/svg", width: 32, height: 32, viewBox: "0 0 32 32", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     "path",
     {
       d: "M17.5469 16.3333L22.375 11.5521L23.3594 10.5677C23.5 10.4271 23.5 10.1927 23.3594 10.0052L22.3281 8.97394C22.1406 8.83331 21.9062 8.83331 21.7656 8.97394L16 14.7864L10.1875 8.97394C10.0469 8.83331 9.8125 8.83331 9.625 8.97394L8.59375 10.0052C8.45312 10.1927 8.45312 10.4271 8.59375 10.5677L14.4062 16.3333L8.59375 22.1458C8.45312 22.2864 8.45312 22.5208 8.59375 22.7083L9.625 23.7396C9.8125 23.8802 10.0469 23.8802 10.1875 23.7396L16 17.9271L20.7812 22.7552L21.7656 23.7396C21.9062 23.8802 22.1406 23.8802 22.3281 23.7396L23.3594 22.7083C23.5 22.5208 23.5 22.2864 23.3594 22.1458L17.5469 16.3333Z",
@@ -2008,7 +2075,7 @@ function CloseIcon() {
   ) });
 }
 function MenuIcon() {
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("svg", { "aria-hidden": true, xmlns: "http://www.w3.org/2000/svg", width: 32, height: 32, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("svg", { "aria-hidden": true, xmlns: "http://www.w3.org/2000/svg", width: 32, height: 32, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     "path",
     {
       fill: "currentColor",
@@ -2018,35 +2085,35 @@ function MenuIcon() {
 }
 
 // src/navbar/navbar-expandable-menu.tsx
-var import_jsx_runtime37 = require("react/jsx-runtime");
-var ExpandableMenuContext = (0, import_react38.createContext)(null);
+var import_jsx_runtime38 = require("react/jsx-runtime");
+var ExpandableMenuContext = (0, import_react39.createContext)(null);
 var useNavbarExpendableMenuContext = () => {
-  const value = (0, import_react38.useContext)(ExpandableMenuContext);
+  const value = (0, import_react39.useContext)(ExpandableMenuContext);
   if (value === null) {
     throw new Error("useNavbarExpendableMenuContext must be used within a Navbar.ExpandableMenu");
   }
   return value;
 };
 function NavbarExpandableMenu({ children }) {
-  const contentId = (0, import_react38.useId)();
-  const [open, setOpen] = (0, import_react38.useState)(false);
-  (0, import_react38.useEffect)(() => {
+  const contentId = (0, import_react39.useId)();
+  const [open, setOpen] = (0, import_react39.useState)(false);
+  (0, import_react39.useEffect)(() => {
     if (open) {
       window.scrollTo(0, 0);
-      document.body.classList.add((0, import_typed_classname33.clsx)("hds-navbar-scroll-lock"));
+      document.body.classList.add((0, import_typed_classname35.clsx)("hds-navbar-scroll-lock"));
       const releaseFocusTrap2 = focusTrap(
-        document.getElementsByClassName((0, import_typed_classname33.clsx)("hds-navbar"))[0]
+        document.getElementsByClassName((0, import_typed_classname35.clsx)("hds-navbar"))[0]
       );
       return () => {
-        document.body.classList.remove((0, import_typed_classname33.clsx)("hds-navbar-scroll-lock"));
+        document.body.classList.remove((0, import_typed_classname35.clsx)("hds-navbar-scroll-lock"));
         releaseFocusTrap2();
       };
     }
   }, [open]);
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ExpandableMenuContext.Provider, { value: { contentId, open, setOpen }, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ExpandableMenuContext.Provider, { value: { contentId, open, setOpen }, children });
 }
 NavbarExpandableMenu.displayName = "NavbarExpandableMenu";
-var NavbarExpandableMenuTrigger = (0, import_react38.forwardRef)(
+var NavbarExpandableMenuTrigger = (0, import_react39.forwardRef)(
   (_a, ref) => {
     var _b = _a, {
       whenClosedText,
@@ -2067,12 +2134,12 @@ var NavbarExpandableMenuTrigger = (0, import_react38.forwardRef)(
     function toggleOpen() {
       setOpen(!open);
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
       "button",
       __spreadProps(__spreadValues({
         "aria-expanded": open,
         "aria-controls": contentId,
-        className: (0, import_typed_classname33.clsx)(
+        className: (0, import_typed_classname35.clsx)(
           "hds-navbar__item",
           className,
           open ? "hds-navbar__item--open" : "hds-navbar__item--closed"
@@ -2084,53 +2151,53 @@ var NavbarExpandableMenuTrigger = (0, import_react38.forwardRef)(
         style: __spreadValues({ position: "relative" }, style)
       }, rest), {
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("span", { className: "hds-navbar__item-responsive-text", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { "aria-hidden": !open, className: (0, import_typed_classname33.clsx)("hds-navbar__item-whenopentext"), children: whenOpenText }),
-            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { "aria-hidden": open, className: (0, import_typed_classname33.clsx)("hds-navbar__item-whenclosedtext"), children: whenClosedText })
+          /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("span", { className: "hds-navbar__item-responsive-text", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { "aria-hidden": !open, className: (0, import_typed_classname35.clsx)("hds-navbar__item-whenopentext"), children: whenOpenText }),
+            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { "aria-hidden": open, className: (0, import_typed_classname35.clsx)("hds-navbar__item-whenclosedtext"), children: whenClosedText })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { style: { width: 32, height: 32 }, children: open ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(CloseIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(MenuIcon, {}) })
+          /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { style: { width: 32, height: 32 }, children: open ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(CloseIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(MenuIcon, {}) })
         ]
       })
     );
   }
 );
 NavbarExpandableMenuTrigger.displayName = "Navbar.ExpandableMenuTrigger";
-var NavbarExpandableMenuContent = (0, import_react38.forwardRef)((_a, ref) => {
+var NavbarExpandableMenuContent = (0, import_react39.forwardRef)((_a, ref) => {
   var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
   const { contentId, open } = useNavbarExpendableMenuContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     "section",
     __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, rest), {
       id: contentId,
-      className: (0, import_typed_classname33.clsx)("hds-navbar__expandable-menu-content", className),
+      className: (0, import_typed_classname35.clsx)("hds-navbar__expandable-menu-content", className),
       "data-state": open ? "open" : "closed"
-    }), { inert: open ? void 0 : "true" }), {
+    }), { inert: inertPropValue(!open) }), {
       ref,
-      children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: (0, import_typed_classname33.clsx)("hds-navbar__expandable-menu-content-inner"), children })
+      children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: (0, import_typed_classname35.clsx)("hds-navbar__expandable-menu-content-inner"), children })
     })
   );
 });
 NavbarExpandableMenuContent.displayName = "Navbar.ExpandableMenuContent";
 
 // src/navbar/navbar.tsx
-var import_jsx_runtime38 = require("react/jsx-runtime");
-var NavbarLogo = (0, import_react39.forwardRef)(
+var import_jsx_runtime39 = require("react/jsx-runtime");
+var NavbarLogo = (0, import_react40.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, className, asChild } = _b, rest = __objRest(_b, ["children", "className", "asChild"]);
-    const Component = asChild ? import_react_slot14.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname34.clsx)(`hds-navbar__logo`, className), ref }, rest), { children }));
+    const Component = asChild ? import_react_slot16.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname36.clsx)(`hds-navbar__logo`, className), ref }, rest), { children }));
   }
 );
 NavbarLogo.displayName = "Navbar.Logo";
-var NavbarLogoAndServiceText = (0, import_react39.forwardRef)(
+var NavbarLogoAndServiceText = (0, import_react40.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, asChild, variant, className } = _b, rest = __objRest(_b, ["children", "asChild", "variant", "className"]);
-    const Component = asChild ? import_react_slot14.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+    const Component = asChild ? import_react_slot16.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
       Component,
       __spreadProps(__spreadValues({
         ref,
-        className: (0, import_typed_classname34.clsx)(
+        className: (0, import_typed_classname36.clsx)(
           "hds-navbar__logo-and-service-text",
           `hds-navbar__logo-and-service-text--${variant}`,
           className
@@ -2142,29 +2209,29 @@ var NavbarLogoAndServiceText = (0, import_react39.forwardRef)(
   }
 );
 NavbarLogoAndServiceText.displayName = "Navbar.NavbarLogoAndText";
-var NavbarItemIcon = (0, import_react39.forwardRef)(
+var NavbarItemIcon = (0, import_react40.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_react_slot14.Slot, __spreadProps(__spreadValues({ className: (0, import_typed_classname34.clsx)("hds-navbar__item-icon", className), ref }, rest), { children }));
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_slot16.Slot, __spreadProps(__spreadValues({ className: (0, import_typed_classname36.clsx)("hds-navbar__item-icon", className), ref }, rest), { children }));
   }
 );
 NavbarItemIcon.displayName = "Navbar.ItemIcon";
-var NavbarItem = (0, import_react39.forwardRef)(
+var NavbarItem = (0, import_react40.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, children, className } = _b, rest = __objRest(_b, ["asChild", "children", "className"]);
-    const Component = asChild ? import_react_slot14.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname34.clsx)("hds-navbar__item", className), ref }, rest), { children }));
+    const Component = asChild ? import_react_slot16.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname36.clsx)("hds-navbar__item", className), ref }, rest), { children }));
   }
 );
 NavbarItem.displayName = "Navbar.Item";
-var NavbarButtonItem = (0, import_react39.forwardRef)(
+var NavbarButtonItem = (0, import_react40.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, children, className } = _b, rest = __objRest(_b, ["asChild", "children", "className"]);
-    const Component = asChild ? import_react_slot14.Slot : "button";
-    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+    const Component = asChild ? import_react_slot16.Slot : "button";
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
       Component,
       __spreadProps(__spreadValues({
-        className: (0, import_typed_classname34.clsx)("hds-navbar__item", className),
+        className: (0, import_typed_classname36.clsx)("hds-navbar__item", className),
         ref,
         type: "button"
       }, rest), {
@@ -2174,36 +2241,36 @@ var NavbarButtonItem = (0, import_react39.forwardRef)(
   }
 );
 NavbarButtonItem.displayName = "Navbar.ButtonItem";
-var NavbarLinkItem = (0, import_react39.forwardRef)(
+var NavbarLinkItem = (0, import_react40.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, children, className } = _b, rest = __objRest(_b, ["asChild", "children", "className"]);
-    const Component = asChild ? import_react_slot14.Slot : "a";
-    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname34.clsx)("hds-navbar__item", className), ref }, rest), { children }));
+    const Component = asChild ? import_react_slot16.Slot : "a";
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname36.clsx)("hds-navbar__item", className), ref }, rest), { children }));
   }
 );
 NavbarLinkItem.displayName = "Navbar.LinkItem";
-var NavbarNavigation = (0, import_react39.forwardRef)(
+var NavbarNavigation = (0, import_react40.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
-    const Component = asChild ? import_react_slot14.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+    const Component = asChild ? import_react_slot16.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
       Component,
       __spreadValues({
-        className: (0, import_typed_classname34.clsx)("hds-navbar__navigation", className),
+        className: (0, import_typed_classname36.clsx)("hds-navbar__navigation", className),
         ref
       }, rest)
     );
   }
 );
 NavbarNavigation.displayName = "Navbar.Navigation";
-var Navbar = (0, import_react39.forwardRef)(
+var Navbar = (0, import_react40.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, children, className, variant } = _b, rest = __objRest(_b, ["asChild", "children", "className", "variant"]);
-    const Component = asChild ? import_react_slot14.Slot : "header";
-    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+    const Component = asChild ? import_react_slot16.Slot : "header";
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
       Component,
       __spreadProps(__spreadValues({
-        className: (0, import_typed_classname34.clsx)("hds-navbar", variant && `hds-navbar--${variant}`, className),
+        className: (0, import_typed_classname36.clsx)("hds-navbar", variant && `hds-navbar--${variant}`, className),
         ref
       }, rest), {
         children
@@ -2224,17 +2291,17 @@ Navbar.ItemIcon = NavbarItemIcon;
 Navbar.Navigation = NavbarNavigation;
 
 // src/show-more/show-more.tsx
-var import_typed_classname35 = require("@postenbring/hedwig-css/typed-classname");
-var import_react40 = require("react");
-var import_jsx_runtime39 = require("react/jsx-runtime");
-var ShowMoreButton = (0, import_react40.forwardRef)(
+var import_typed_classname37 = require("@postenbring/hedwig-css/typed-classname");
+var import_react41 = require("react");
+var import_jsx_runtime40 = require("react/jsx-runtime");
+var ShowMoreButton = (0, import_react41.forwardRef)(
   (_a, ref) => {
     var _b = _a, { text, variant, expanded, className } = _b, rest = __objRest(_b, ["text", "variant", "expanded", "className"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
       "button",
       __spreadProps(__spreadValues({
         ref,
-        className: (0, import_typed_classname35.clsx)(
+        className: (0, import_typed_classname37.clsx)(
           "hds-show-more",
           variant === "show-more-show-less" && "hds-show-more--show-less",
           className
@@ -2244,7 +2311,7 @@ var ShowMoreButton = (0, import_react40.forwardRef)(
       }, rest), {
         children: [
           text,
-          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: (0, import_typed_classname35.clsx)("hds-show-more__icon") })
+          /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: (0, import_typed_classname37.clsx)("hds-show-more__icon") })
         ]
       })
     );
@@ -2253,11 +2320,11 @@ var ShowMoreButton = (0, import_react40.forwardRef)(
 ShowMoreButton.displayName = "ShowMoreButton";
 
 // src/skeleton/skeleton.tsx
-var import_typed_classname36 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot15 = require("@radix-ui/react-slot");
-var import_react41 = require("react");
-var import_jsx_runtime40 = require("react/jsx-runtime");
-var Skeleton = (0, import_react41.forwardRef)(
+var import_typed_classname38 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot17 = require("@radix-ui/react-slot");
+var import_react42 = require("react");
+var import_jsx_runtime41 = require("react/jsx-runtime");
+var Skeleton = (0, import_react42.forwardRef)(
   (_a, ref) => {
     var _b = _a, {
       as: Tag = "div",
@@ -2280,11 +2347,11 @@ var Skeleton = (0, import_react41.forwardRef)(
       "className",
       "style"
     ]);
-    const Component = asChild ? import_react_slot15.Slot : Tag;
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+    const Component = asChild ? import_react_slot17.Slot : Tag;
+    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
       Component,
       __spreadProps(__spreadValues(__spreadProps(__spreadValues({
-        className: (0, import_typed_classname36.clsx)(
+        className: (0, import_typed_classname38.clsx)(
           "hds-skeleton",
           `hds-skeleton--${variant}`,
           !animation && `hds-skeleton--no-animation`,
@@ -2292,7 +2359,7 @@ var Skeleton = (0, import_react41.forwardRef)(
         ),
         style: __spreadProps(__spreadValues({}, style), { width, height }),
         "aria-hidden": true
-      }, { inert: "true" }), {
+      }, { inert: inertPropValue(true) }), {
         ref
       }), rest), {
         children
@@ -2303,19 +2370,19 @@ var Skeleton = (0, import_react41.forwardRef)(
 Skeleton.displayName = "Skeleton";
 
 // src/spinner/spinner.tsx
-var import_react42 = require("react");
-var import_typed_classname37 = require("@postenbring/hedwig-css/typed-classname");
-var import_jsx_runtime41 = require("react/jsx-runtime");
-var Spinner = (0, import_react42.forwardRef)(
+var import_react43 = require("react");
+var import_typed_classname39 = require("@postenbring/hedwig-css/typed-classname");
+var import_jsx_runtime42 = require("react/jsx-runtime");
+var Spinner = (0, import_react43.forwardRef)(
   (_a, ref) => {
     var _b = _a, { size = "medium", title = "", delay = false, className, style: _style } = _b, rest = __objRest(_b, ["size", "title", "delay", "className", "style"]);
     const style = __spreadValues(__spreadValues({}, _style), typeof delay === "string" && { "--hds-spinner-delay": delay });
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
       "div",
       __spreadValues({
         title,
         style,
-        className: (0, import_typed_classname37.clsx)(
+        className: (0, import_typed_classname39.clsx)(
           "hds-spinner",
           `hds-spinner--${size}`,
           delay && "hds-spinner--delay",
@@ -2329,10 +2396,10 @@ var Spinner = (0, import_react42.forwardRef)(
 Spinner.displayName = "Spinner";
 
 // src/step-indicator/step-indicator.tsx
-var import_typed_classname38 = require("@postenbring/hedwig-css/typed-classname");
-var import_react43 = require("react");
-var import_jsx_runtime42 = require("react/jsx-runtime");
-var StepIndicator = (0, import_react43.forwardRef)(
+var import_typed_classname40 = require("@postenbring/hedwig-css/typed-classname");
+var import_react44 = require("react");
+var import_jsx_runtime43 = require("react/jsx-runtime");
+var StepIndicator = (0, import_react44.forwardRef)(
   (_a, ref) => {
     var _b = _a, {
       activeStep,
@@ -2351,27 +2418,27 @@ var StepIndicator = (0, import_react43.forwardRef)(
       "title",
       "titleAs"
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
       "div",
       __spreadProps(__spreadValues({
         ref,
-        className: (0, import_typed_classname38.clsx)("hds-step-indicator", className),
+        className: (0, import_typed_classname40.clsx)("hds-step-indicator", className),
         lang
       }, rest), {
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: (0, import_typed_classname38.clsx)("hds-step-indicator__header"), children: [
-            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: (0, import_typed_classname38.clsx)("hds-step-indicator__left-label"), children: label }),
-            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { children: stepLabelTranslations[lang](activeStep, totalSteps) })
+          /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: (0, import_typed_classname40.clsx)("hds-step-indicator__header"), children: [
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: (0, import_typed_classname40.clsx)("hds-step-indicator__left-label"), children: label }),
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { children: stepLabelTranslations[lang](activeStep, totalSteps) })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: (0, import_typed_classname38.clsx)("hds-step-indicator__steps"), children: Array.from({ length: totalSteps }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: (0, import_typed_classname40.clsx)("hds-step-indicator__steps"), children: Array.from({ length: totalSteps }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
             "div",
             {
-              className: (0, import_typed_classname38.clsx)("hds-step-indicator__step"),
+              className: (0, import_typed_classname40.clsx)("hds-step-indicator__step"),
               "data-state": getStepState(i + 1, activeStep)
             },
             i
           )) }),
-          title ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(TitleComponent, { className: (0, import_typed_classname38.clsx)("hds-step-indicator__title"), children: title }) : null
+          title ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(TitleComponent, { className: (0, import_typed_classname40.clsx)("hds-step-indicator__title"), children: title }) : null
         ]
       })
     );
@@ -2395,18 +2462,18 @@ function getStepState(renderedStep, activeStep) {
 }
 
 // src/styled-html/styled-html.tsx
-var import_react44 = require("react");
-var import_typed_classname39 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot16 = require("@radix-ui/react-slot");
-var import_jsx_runtime43 = require("react/jsx-runtime");
-var StyledHtml = (0, import_react44.forwardRef)(
+var import_react45 = require("react");
+var import_typed_classname41 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot18 = require("@radix-ui/react-slot");
+var import_jsx_runtime44 = require("react/jsx-runtime");
+var StyledHtml = (0, import_react45.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, children, size, unstable_darkmode: darkmode = false, className } = _b, rest = __objRest(_b, ["asChild", "children", "size", "unstable_darkmode", "className"]);
-    const Component = asChild ? import_react_slot16.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+    const Component = asChild ? import_react_slot18.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
       Component,
       __spreadProps(__spreadValues({
-        className: (0, import_typed_classname39.clsx)(
+        className: (0, import_typed_classname41.clsx)(
           `hds-styled-html`,
           size === "small" && "hds-styled-html--small",
           darkmode && "hds-styled-html--darkmode",
@@ -2422,20 +2489,20 @@ var StyledHtml = (0, import_react44.forwardRef)(
 StyledHtml.displayName = "StyledHtml";
 
 // src/table/table.tsx
-var import_typed_classname40 = require("@postenbring/hedwig-css/typed-classname");
-var import_react45 = require("react");
-var import_jsx_runtime44 = require("react/jsx-runtime");
-var Table = (0, import_react45.forwardRef)(
+var import_typed_classname42 = require("@postenbring/hedwig-css/typed-classname");
+var import_react46 = require("react");
+var import_jsx_runtime45 = require("react/jsx-runtime");
+var Table = (0, import_react46.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, className, size, caption, description } = _b, rest = __objRest(_b, ["children", "className", "size", "caption", "description"]);
-    const descriptionId = (0, import_react45.useId)();
-    return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_jsx_runtime44.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+    const descriptionId = (0, import_react46.useId)();
+    return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_jsx_runtime45.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
         "table",
         __spreadProps(__spreadValues({
           "aria-describedby": description ? descriptionId : void 0,
           ref,
-          className: (0, import_typed_classname40.clsx)(
+          className: (0, import_typed_classname42.clsx)(
             "hds-table",
             {
               "hds-table--compressed": size === "compressed",
@@ -2445,27 +2512,27 @@ var Table = (0, import_react45.forwardRef)(
           )
         }, rest), {
           children: [
-            caption ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("caption", { children: caption }) : null,
+            caption ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("caption", { children: caption }) : null,
             children
           ]
         })
       ),
-      description ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("p", { className: (0, import_typed_classname40.clsx)("hds-table-description"), id: descriptionId, children: description }) : null
+      description ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: (0, import_typed_classname42.clsx)("hds-table-description"), id: descriptionId, children: description }) : null
     ] });
   }
 );
 Table.displayName = "Table";
 
 // src/tabs/tabs.tsx
-var import_react49 = require("react");
-var import_typed_classname43 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot18 = require("@radix-ui/react-slot");
+var import_react50 = require("react");
+var import_typed_classname45 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot20 = require("@radix-ui/react-slot");
 
 // src/tabs/context.ts
-var import_react46 = require("react");
-var TabsContext = (0, import_react46.createContext)(null);
+var import_react47 = require("react");
+var TabsContext = (0, import_react47.createContext)(null);
 function useTabsContext() {
-  const context = (0, import_react46.useContext)(TabsContext);
+  const context = (0, import_react47.useContext)(TabsContext);
   if (!context) {
     throw new Error(
       "Tabs context required. Did you use `<Tabs.List />`, `<Tabs.Tab />`, or `<Tabs.Content />` outside of <Tabs/>?"
@@ -2475,25 +2542,25 @@ function useTabsContext() {
 }
 
 // src/tabs/tabs-content.tsx
-var import_react47 = require("react");
-var import_typed_classname41 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot17 = require("@radix-ui/react-slot");
-var import_jsx_runtime45 = require("react/jsx-runtime");
-var TabsContents = (0, import_react47.forwardRef)(
+var import_react48 = require("react");
+var import_typed_classname43 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot19 = require("@radix-ui/react-slot");
+var import_jsx_runtime46 = require("react/jsx-runtime");
+var TabsContents = (0, import_react48.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, children } = _b, rest = __objRest(_b, ["asChild", "children"]);
-    const Component = asChild ? import_react_slot17.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Component, __spreadProps(__spreadValues({ ref, className: (0, import_typed_classname41.clsx)("hds-tabs__contents") }, rest), { children }));
+    const Component = asChild ? import_react_slot19.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Component, __spreadProps(__spreadValues({ ref, className: (0, import_typed_classname43.clsx)("hds-tabs__contents") }, rest), { children }));
   }
 );
 TabsContents.displayName = "Tabs.Contents";
-var TabsContent = (0, import_react47.forwardRef)(
+var TabsContent = (0, import_react48.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, forTabId, children } = _b, rest = __objRest(_b, ["asChild", "forTabId", "children"]);
     const context = useTabsContext();
-    const Component = asChild ? import_react_slot17.Slot : "div";
+    const Component = asChild ? import_react_slot19.Slot : "div";
     if (context.activeTabId === forTabId) {
-      return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Component, __spreadProps(__spreadValues({}, rest), { ref, children }));
+      return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Component, __spreadProps(__spreadValues({}, rest), { ref, children }));
     }
     return null;
   }
@@ -2501,21 +2568,21 @@ var TabsContent = (0, import_react47.forwardRef)(
 TabsContent.displayName = "Tabs.Content";
 
 // src/tabs/tabs-list.tsx
-var import_react48 = require("react");
-var import_typed_classname42 = require("@postenbring/hedwig-css/typed-classname");
-var import_jsx_runtime46 = require("react/jsx-runtime");
-var TabsList = (0, import_react48.forwardRef)(
+var import_react49 = require("react");
+var import_typed_classname44 = require("@postenbring/hedwig-css/typed-classname");
+var import_jsx_runtime47 = require("react/jsx-runtime");
+var TabsList = (0, import_react49.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, direction = "horizontal", className } = _b, rest = __objRest(_b, ["children", "direction", "className"]);
     const { activeTabId } = useTabsContext();
-    const tabsListRef = (0, import_react48.useRef)(null);
+    const tabsListRef = (0, import_react49.useRef)(null);
     const mergedRef = useMergeRefs([tabsListRef, ref]);
     const { width: tabsWidth } = useResize(tabsListRef);
     const isClientSide = useHydrated();
     const { innerWidth } = isClientSide ? window : { innerWidth: 1e3 };
     const wideEnough = innerWidth >= tabsWidth;
-    const previousTabId = (0, import_react48.useRef)(activeTabId);
-    (0, import_react48.useEffect)(() => {
+    const previousTabId = (0, import_react49.useRef)(activeTabId);
+    (0, import_react49.useEffect)(() => {
       const tabList = tabsListRef.current;
       const activeTab = tabList == null ? void 0 : tabList.querySelector(`[data-tabid="${activeTabId}"]`);
       if (!activeTab || !tabList) return;
@@ -2539,10 +2606,10 @@ var TabsList = (0, import_react48.forwardRef)(
       }
       previousTabId.current = activeTabId;
     }, [activeTabId, innerWidth]);
-    return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
       "div",
       __spreadProps(__spreadValues({
-        className: (0, import_typed_classname42.clsx)(
+        className: (0, import_typed_classname44.clsx)(
           "hds-tabs__list",
           direction === "horizontal" ? {
             "hds-tabs__list--horizontal": wideEnough,
@@ -2561,7 +2628,7 @@ var TabsList = (0, import_react48.forwardRef)(
   }
 );
 TabsList.displayName = "Tabs.List";
-var TabsTab = (0, import_react48.forwardRef)(
+var TabsTab = (0, import_react49.forwardRef)(
   (_a, ref) => {
     var _b = _a, { children, tabId, className, onClick } = _b, rest = __objRest(_b, ["children", "tabId", "className", "onClick"]);
     const context = useTabsContext();
@@ -2570,10 +2637,10 @@ var TabsTab = (0, import_react48.forwardRef)(
       context.toggleActiveTabId(tabId);
       onClick == null ? void 0 : onClick(e);
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
       "button",
       __spreadProps(__spreadValues({
-        className: (0, import_typed_classname42.clsx)(
+        className: (0, import_typed_classname44.clsx)(
           "hds-tabs__tab",
           { "hds-tabs__tab--active": context.activeTabId === tabId },
           className
@@ -2592,13 +2659,13 @@ var TabsTab = (0, import_react48.forwardRef)(
 TabsTab.displayName = "Tabs.Tab";
 
 // src/tabs/tabs.tsx
-var import_jsx_runtime47 = require("react/jsx-runtime");
-var Tabs = (0, import_react49.forwardRef)(
+var import_jsx_runtime48 = require("react/jsx-runtime");
+var Tabs = (0, import_react50.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, defaultTab, children } = _b, rest = __objRest(_b, ["asChild", "defaultTab", "children"]);
-    const [activeTabId, setActiveTabId] = (0, import_react49.useState)(defaultTab);
-    const Component = asChild ? import_react_slot18.Slot : "div";
-    return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname43.clsx)("hds-tabs"), ref }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(TabsContext.Provider, { value: { activeTabId, toggleActiveTabId: setActiveTabId }, children }) }));
+    const [activeTabId, setActiveTabId] = (0, import_react50.useState)(defaultTab);
+    const Component = asChild ? import_react_slot20.Slot : "div";
+    return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname45.clsx)("hds-tabs"), ref }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(TabsContext.Provider, { value: { activeTabId, toggleActiveTabId: setActiveTabId }, children }) }));
   }
 );
 Tabs.displayName = "Tabs";
@@ -2608,10 +2675,10 @@ Tabs.Contents = TabsContents;
 Tabs.Content = TabsContent;
 
 // src/text/text.tsx
-var import_react50 = require("react");
-var import_typed_classname44 = require("@postenbring/hedwig-css/typed-classname");
-var import_react_slot19 = require("@radix-ui/react-slot");
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_react51 = require("react");
+var import_typed_classname46 = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot21 = require("@radix-ui/react-slot");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 var defaultHTMLTag = {
   "h1-display": "h1",
   h1: "h1",
@@ -2627,7 +2694,7 @@ var defaultHTMLTag = {
   caption: "p",
   "caption-title": "p"
 };
-var Text = (0, import_react50.forwardRef)(
+var Text = (0, import_react51.forwardRef)(
   (_a, ref) => {
     var _b = _a, {
       as: Tag,
@@ -2646,12 +2713,12 @@ var Text = (0, import_react50.forwardRef)(
       "children",
       "className"
     ]);
-    const Component = asChild ? import_react_slot19.Slot : Tag != null ? Tag : defaultHTMLTag[variant];
+    const Component = asChild ? import_react_slot21.Slot : Tag != null ? Tag : defaultHTMLTag[variant];
     const sizeModifier = size !== "fluid" && variant !== "caption" && variant !== "caption-title" && size;
-    return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
       Component,
       __spreadProps(__spreadValues({
-        className: (0, import_typed_classname44.clsx)(
+        className: (0, import_typed_classname46.clsx)(
           `hds-text-${variant}`,
           sizeModifier && `hds-text--${sizeModifier}`,
           spacing && "hds-text--spacing",
@@ -2667,16 +2734,16 @@ var Text = (0, import_react50.forwardRef)(
 Text.displayName = "Text";
 
 // src/warning-banner/warning-banner.tsx
-var import_react51 = require("react");
-var import_typed_classname45 = require("@postenbring/hedwig-css/typed-classname");
-var import_jsx_runtime49 = require("react/jsx-runtime");
-var WarningBanner = (0, import_react51.forwardRef)(
+var import_react52 = require("react");
+var import_typed_classname47 = require("@postenbring/hedwig-css/typed-classname");
+var import_jsx_runtime50 = require("react/jsx-runtime");
+var WarningBanner = (0, import_react52.forwardRef)(
   (_a, ref) => {
     var _b = _a, { title, description, className } = _b, rest = __objRest(_b, ["title", "description", "className"]);
-    const descriptionId = (0, import_react51.useId)();
+    const descriptionId = (0, import_react52.useId)();
     const expandable = !!description;
-    return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname45.clsx)("hds-warning-banner", className), ref, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname47.clsx)("hds-warning-banner", className), ref, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
         WarningBannerTitle,
         {
           variant: expandable ? "expandable" : "default",
@@ -2684,22 +2751,22 @@ var WarningBanner = (0, import_react51.forwardRef)(
           children: title
         }
       ),
-      expandable ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(WarningBannerDescription, { id: descriptionId, children: description }) : null
+      expandable ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(WarningBannerDescription, { id: descriptionId, children: description }) : null
     ] }));
   }
 );
 WarningBanner.displayName = "WarningBanner";
-var WarningBannerTitle = (0, import_react51.forwardRef)((_a, ref) => {
+var WarningBannerTitle = (0, import_react52.forwardRef)((_a, ref) => {
   var _b = _a, { variant, descriptionId, children, className } = _b, rest = __objRest(_b, ["variant", "descriptionId", "children", "className"]);
-  const [open, setOpen] = (0, import_react51.useState)(false);
+  const [open, setOpen] = (0, import_react52.useState)(false);
   if (variant === "expandable") {
-    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
       "button",
       __spreadProps(__spreadValues({}, rest), {
         "aria-expanded": open,
         "aria-controls": descriptionId,
         "data-state": open ? "open" : "closed",
-        className: (0, import_typed_classname45.clsx)(
+        className: (0, import_typed_classname47.clsx)(
           "hds-warning-banner__title",
           "hds-warning-banner__title-trigger",
           className
@@ -2709,28 +2776,28 @@ var WarningBannerTitle = (0, import_react51.forwardRef)((_a, ref) => {
         },
         ref,
         type: "button",
-        children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { children })
+        children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { children })
       })
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
     "p",
     __spreadProps(__spreadValues({}, rest), {
-      className: (0, import_typed_classname45.clsx)("hds-warning-banner__title", className),
+      className: (0, import_typed_classname47.clsx)("hds-warning-banner__title", className),
       ref,
       children
     })
   );
 });
 WarningBannerTitle.displayName = "WarningBannerTitle";
-var WarningBannerDescription = (0, import_react51.forwardRef)(
+var WarningBannerDescription = (0, import_react52.forwardRef)(
   (_a, ref) => {
     var _b = _a, { className, id } = _b, rest = __objRest(_b, ["className", "id"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
       "p",
       __spreadValues({
         id,
-        className: (0, import_typed_classname45.clsx)("hds-warning-banner__description", className),
+        className: (0, import_typed_classname47.clsx)("hds-warning-banner__description", className),
         ref
       }, rest)
     );
@@ -2743,6 +2810,9 @@ WarningBannerDescription.displayName = "WarningBannerDescription";
   AccordionContent,
   AccordionHeader,
   AccordionItem,
+  Alert,
+  AlertDescription,
+  AlertTitle,
   AutoAnimateHeight,
   Badge,
   Blockquote,
@@ -2821,6 +2891,7 @@ WarningBannerDescription.displayName = "WarningBannerDescription";
   VStack,
   WarningBanner,
   focusTrap,
+  inertPropValue,
   useFieldsetContext,
   useHydrated,
   useMergeRefs,