@postenbring/hedwig-react 0.0.76 → 0.0.78

package/dist/warning-banner/index.js

@@ -60,11 +60,12 @@ var import_typed_classname2 = require("@postenbring/hedwig-css/typed-classname")
 // src/box/box.tsx
 var import_react = require("react");
 var import_typed_classname = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot = require("@radix-ui/react-slot");
 var import_jsx_runtime = require("react/jsx-runtime");
 var Box = (0, import_react.forwardRef)(
   (_a, ref) => {
     var _b = _a, {
-      as: Component = "div",
+      asChild,
       variant,
       closeable = false,
       onClose: onCloseProp,
@@ -73,7 +74,7 @@ var Box = (0, import_react.forwardRef)(
       children,
       className
     } = _b, rest = __objRest(_b, [
-      "as",
+      "asChild",
       "variant",
       "closeable",
       "onClose",
@@ -94,6 +95,7 @@ var Box = (0, import_react.forwardRef)(
       }
     }, []);
     const closed = closedProp != null ? closedProp : closedState;
+    const Component = asChild ? import_react_slot.Slot : "div";
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
       Component,
       __spreadProps(__spreadValues({
@@ -107,7 +109,7 @@ var Box = (0, import_react.forwardRef)(
       }, rest), {
         children: [
           closeable ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(BoxCloseButton, __spreadValues({ onClick: onClose }, closeButtonProps)) : null,
-          children
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_slot.Slottable, { children })
         ]
       })
     );
@@ -146,57 +148,43 @@ var WarningBanner = (0, import_react2.forwardRef)(
   }
 );
 WarningBanner.displayName = "WarningBanner";
-var WarningBannerTitle = (0, import_react2.forwardRef)(
-  (_a, ref) => {
-    var _b = _a, {
-      variant,
-      as: Component = variant === "expandable" ? "button" : "p",
-      children,
-      className
-    } = _b, rest = __objRest(_b, [
-      "variant",
-      "as",
-      "children",
-      "className"
-    ]);
-    const [open, setOpen] = (0, import_react2.useState)(false);
-    if (variant === "expandable") {
-      return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        Component,
-        __spreadProps(__spreadValues({
-          className: (0, import_typed_classname2.clsx)(
-            "hds-warning-banner__title",
-            "hds-warning-banner__title-trigger",
-            { "hds-warning-banner--closed": !open },
-            className
-          ),
-          onClick: () => {
-            setOpen(!open);
-          },
-          ref,
-          type: "button"
-        }, rest), {
-          children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children })
-        })
-      );
-    }
+var WarningBannerTitle = (0, import_react2.forwardRef)((_a, ref) => {
+  var _b = _a, { variant, children, className } = _b, rest = __objRest(_b, ["variant", "children", "className"]);
+  const [open, setOpen] = (0, import_react2.useState)(false);
+  if (variant === "expandable") {
     return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      Component,
-      __spreadProps(__spreadValues({
-        className: (0, import_typed_classname2.clsx)("hds-warning-banner__title", className),
-        ref
-      }, rest), {
-        children
+      "button",
+      __spreadProps(__spreadValues({}, rest), {
+        className: (0, import_typed_classname2.clsx)(
+          "hds-warning-banner__title",
+          "hds-warning-banner__title-trigger",
+          { "hds-warning-banner--closed": !open },
+          className
+        ),
+        onClick: () => {
+          setOpen((prev) => !prev);
+        },
+        ref,
+        type: "button",
+        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children })
       })
     );
   }
-);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "p",
+    __spreadProps(__spreadValues({}, rest), {
+      className: (0, import_typed_classname2.clsx)("hds-warning-banner__title", className),
+      ref,
+      children
+    })
+  );
+});
 WarningBannerTitle.displayName = "WarningBannerTitle";
 var WarningBannerDescription = (0, import_react2.forwardRef)(
   (_a, ref) => {
-    var _b = _a, { as: Component = "p", className } = _b, rest = __objRest(_b, ["as", "className"]);
+    var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
     return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      Component,
+      "p",
       __spreadValues({
         className: (0, import_typed_classname2.clsx)("hds-warning-banner__description", className),
         ref

package/dist/warning-banner/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/warning-banner/index.tsx","../../src/warning-banner/warning-banner.tsx","../../src/box/box.tsx","../../src/box/index.tsx"],"sourcesContent":["export { WarningBanner } from \"./warning-banner\";\nexport type * from \"./warning-banner\";\n","import type { ReactNode } from \"react\";\nimport { forwardRef, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport type { OverridableComponent } from \"../utils\";\nimport { Box } from \"../box\";\n\nexport interface WarningBannerProps {\n  title: ReactNode;\n  description?: ReactNode;\n}\n\nexport const WarningBanner: OverridableComponent<WarningBannerProps, HTMLDivElement> = forwardRef(\n  ({ title, description, className, ...rest }, ref) => {\n    const expandable = !!description;\n    return (\n      <Box {...rest} className={clsx(\"hds-warning-banner\", className as undefined)} ref={ref}>\n        <WarningBannerTitle variant={expandable ? \"expandable\" : \"default\"}>\n          {title}\n        </WarningBannerTitle>\n        {expandable ? <WarningBannerDescription>{description}</WarningBannerDescription> : null}\n      </Box>\n    );\n  },\n);\nWarningBanner.displayName = \"WarningBanner\";\n\ninterface WarningBannerTitleProps {\n  variant: \"expandable\" | \"default\";\n  children: ReactNode;\n}\n\nconst WarningBannerTitle: OverridableComponent<WarningBannerTitleProps, HTMLDivElement> =\n  forwardRef(\n    (\n      {\n        variant,\n        as: Component = variant === \"expandable\" ? \"button\" : \"p\",\n        children,\n        className,\n        ...rest\n      },\n      ref,\n    ) => {\n      const [open, setOpen] = useState<boolean>(false);\n      if (variant === \"expandable\") {\n        return (\n          <Component\n            className={clsx(\n              \"hds-warning-banner__title\",\n              \"hds-warning-banner__title-trigger\",\n              { \"hds-warning-banner--closed\": !open },\n              className as undefined,\n            )}\n            onClick={() => {\n              setOpen(!open);\n            }}\n            ref={ref}\n            type=\"button\"\n            {...rest}\n          >\n            <span>{children}</span>\n          </Component>\n        );\n      }\n      return (\n        <Component\n          className={clsx(\"hds-warning-banner__title\", className as undefined)}\n          ref={ref}\n          {...rest}\n        >\n          {children}\n        </Component>\n      );\n    },\n  );\nWarningBannerTitle.displayName = \"WarningBannerTitle\";\n\nconst WarningBannerDescription: OverridableComponent<object, HTMLParagraphElement> = forwardRef(\n  ({ as: Component = \"p\", className, ...rest }, ref) => {\n    return (\n      <Component\n        className={clsx(\"hds-warning-banner__description\", className as undefined)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\nWarningBannerDescription.displayName = \"WarningBannerDescription\";\n","import { forwardRef, useCallback, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport type { OverridableComponent } from \"../utils\";\n\nexport interface BoxProps extends React.HTMLAttributes<HTMLDivElement> {\n  variant?: \"light-grey\" | \"lighter\" | \"white\" | \"warning\";\n  children?: React.ReactNode;\n\n  /**\n   * If `true`, a close button will be shown.\n   * Use when you want to control the close button using the BoxCloseButton component.\n   */\n  closeable?: boolean;\n\n  /**\n   * Callback fired when the component requests to be closed.\n   * If not set, the component will be closed without any user interaction.\n   *\n   * If set, and the handler returns non-true value, the component will not be closed.\n   * Use this if you want to control the closing of the component, using the `closed` prop\n   *\n   * If set, and the handler returns the true, the component will be closed.\n   * Use this with `window.confirm()` to ask the user to confirm closing the component.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents -- It's fine, I want to have the boolean in the type\n  onClose?: () => boolean | unknown;\n\n  /**\n   * If `true`, the box will be closed and hidden from view\n   */\n  closed?: boolean;\n\n  /**\n   * Props applied to the close button element.\n   */\n  closeButtonProps?: BoxCloseButtonProps;\n}\n\nexport const Box: OverridableComponent<BoxProps, HTMLDivElement> = forwardRef(\n  (\n    {\n      as: Component = \"div\",\n      variant,\n      closeable = false,\n      onClose: onCloseProp,\n      closed: closedProp,\n      closeButtonProps,\n      children,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const [closedState, setClosedState] = useState(false);\n    const onClose = useCallback(() => {\n      if (onCloseProp) {\n        const result = onCloseProp();\n        if (result === true) {\n          setClosedState(true);\n        }\n      } else {\n        setClosedState(true);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps -- I know better\n    }, []);\n    const closed = closedProp ?? closedState;\n\n    return (\n      <Component\n        className={clsx(\n          \"hds-box\",\n          variant && `hds-box--${variant}`,\n          { \"hds-box--closed\": closed },\n          className as undefined,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        {closeable ? <BoxCloseButton onClick={onClose} {...closeButtonProps} /> : null}\n        {children}\n      </Component>\n    );\n  },\n);\nBox.displayName = \"Box\";\n\nexport type BoxCloseButtonProps = Omit<React.HTMLAttributes<HTMLButtonElement>, \"children\">;\nexport const BoxCloseButton = forwardRef<HTMLButtonElement, BoxCloseButtonProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <button\n        className={clsx(\"hds-box__close-button\", className as undefined)}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      />\n    );\n  },\n);\nBoxCloseButton.displayName = \"Box.CloseButton\";\n","import { Box, BoxCloseButton } from \"./box\";\n\nconst BoxComponent = Box as typeof Box & {\n  CloseButton: typeof BoxCloseButton;\n};\nBoxComponent.CloseButton = BoxCloseButton;\n\nexport { BoxComponent as Box, BoxCloseButton };\n\nexport type * from \"./box\";\n"],"mappings":"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","names":["import_react","import_typed_classname","import_jsx_runtime"]}
+{"version":3,"sources":["../../src/warning-banner/index.tsx","../../src/warning-banner/warning-banner.tsx","../../src/box/box.tsx","../../src/box/index.tsx"],"sourcesContent":["export { WarningBanner } from \"./warning-banner\";\nexport type * from \"./warning-banner\";\n","import type { ReactNode } from \"react\";\nimport React, { forwardRef, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Box } from \"../box\";\n\nexport interface WarningBannerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, \"title\"> {\n  title: ReactNode;\n  description?: ReactNode;\n}\n\nexport const WarningBanner = forwardRef<HTMLDivElement, WarningBannerProps>(\n  ({ title, description, className, ...rest }, ref) => {\n    const expandable = !!description;\n    return (\n      <Box {...rest} className={clsx(\"hds-warning-banner\", className as undefined)} ref={ref}>\n        <WarningBannerTitle variant={expandable ? \"expandable\" : \"default\"}>\n          {title}\n        </WarningBannerTitle>\n        {expandable ? <WarningBannerDescription>{description}</WarningBannerDescription> : null}\n      </Box>\n    );\n  },\n);\nWarningBanner.displayName = \"WarningBanner\";\n\ntype WarningBannerTitleProps =\n  | ({ variant: \"expandable\" } & React.ButtonHTMLAttributes<HTMLButtonElement>)\n  | ({ variant: \"default\" } & React.HTMLAttributes<HTMLParagraphElement>);\n\nconst WarningBannerTitle = forwardRef<\n  HTMLButtonElement | HTMLParagraphElement,\n  WarningBannerTitleProps\n>(({ variant, children, className, ...rest }, ref) => {\n  const [open, setOpen] = useState<boolean>(false);\n  if (variant === \"expandable\") {\n    return (\n      <button\n        {...(rest as React.ButtonHTMLAttributes<HTMLButtonElement>)}\n        className={clsx(\n          \"hds-warning-banner__title\",\n          \"hds-warning-banner__title-trigger\",\n          { \"hds-warning-banner--closed\": !open },\n          className as undefined,\n        )}\n        onClick={() => {\n          setOpen((prev) => !prev);\n        }}\n        ref={ref as React.Ref<HTMLButtonElement>}\n        type=\"button\"\n      >\n        <span>{children}</span>\n      </button>\n    );\n  }\n  return (\n    <p\n      {...(rest as React.HTMLAttributes<HTMLParagraphElement>)}\n      className={clsx(\"hds-warning-banner__title\", className as undefined)}\n      ref={ref as React.Ref<HTMLParagraphElement>}\n    >\n      {children}\n    </p>\n  );\n});\nWarningBannerTitle.displayName = \"WarningBannerTitle\";\n\ntype WarningBannerDescriptionProps = React.HTMLAttributes<HTMLParagraphElement>;\nconst WarningBannerDescription = forwardRef<HTMLParagraphElement, WarningBannerDescriptionProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <p\n        className={clsx(\"hds-warning-banner__description\", className as undefined)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\nWarningBannerDescription.displayName = \"WarningBannerDescription\";\n","import { forwardRef, useCallback, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot, Slottable } from \"@radix-ui/react-slot\";\n\nexport interface BoxProps extends React.HTMLAttributes<HTMLDivElement> {\n  children?: React.ReactNode;\n\n  /**\n   * Color variant of the box\n   *\n   * @default \"light-grey\"\n   */\n  variant?: \"light-grey\" | \"lighter\" | \"white\" | \"warning\";\n\n  /**\n   * If `true`, a close button will be shown.\n   * Use when you want to control the close button using the BoxCloseButton component.\n   *\n   * @default false\n   */\n  closeable?: boolean;\n\n  /**\n   * Callback fired when the component requests to be closed.\n   * If not set, the component will be closed without any user interaction.\n   *\n   * If set, and the handler returns non-true value, the component will not be closed.\n   * Use this if you want to control the closing of the component, using the `closed` prop\n   *\n   * If set, and the handler returns the true, the component will be closed.\n   * Use this with `window.confirm()` to ask the user to confirm closing the component.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents -- It's fine, I want to have the boolean in the type\n  onClose?: () => boolean | unknown;\n\n  /**\n   * If `true`, the box will be closed and hidden from view\n   */\n  closed?: boolean;\n\n  /**\n   * Props applied to the close button element.\n   */\n  closeButtonProps?: BoxCloseButtonProps;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\nexport const Box = forwardRef<HTMLDivElement, BoxProps>(\n  (\n    {\n      asChild,\n      variant,\n      closeable = false,\n      onClose: onCloseProp,\n      closed: closedProp,\n      closeButtonProps,\n      children,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const [closedState, setClosedState] = useState(false);\n    const onClose = useCallback(() => {\n      if (onCloseProp) {\n        const result = onCloseProp();\n        if (result === true) {\n          setClosedState(true);\n        }\n      } else {\n        setClosedState(true);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps -- I know better\n    }, []);\n    const closed = closedProp ?? closedState;\n    const Component = asChild ? Slot : \"div\";\n\n    return (\n      <Component\n        className={clsx(\n          \"hds-box\",\n          variant && `hds-box--${variant}`,\n          { \"hds-box--closed\": closed },\n          className as undefined,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        {closeable ? <BoxCloseButton onClick={onClose} {...closeButtonProps} /> : null}\n        <Slottable>{children}</Slottable>\n      </Component>\n    );\n  },\n);\nBox.displayName = \"Box\";\n\nexport type BoxCloseButtonProps = Omit<React.HTMLAttributes<HTMLButtonElement>, \"children\">;\nexport const BoxCloseButton = forwardRef<HTMLButtonElement, BoxCloseButtonProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <button\n        className={clsx(\"hds-box__close-button\", className as undefined)}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      />\n    );\n  },\n);\nBoxCloseButton.displayName = \"Box.CloseButton\";\n","import { Box, BoxCloseButton } from \"./box\";\n\nconst BoxComponent = Box as typeof Box & {\n  CloseButton: typeof BoxCloseButton;\n};\nBoxComponent.CloseButton = BoxCloseButton;\n\nexport { BoxComponent as Box, BoxCloseButton };\n\nexport type * from \"./box\";\n"],"mappings":"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","names":["import_react","import_typed_classname","import_jsx_runtime"]}

package/dist/warning-banner/index.mjs

@@ -1,9 +1,9 @@
 import "../chunk-3D2MWIEX.mjs";
 import {
   WarningBanner
-} from "../chunk-PUESATBQ.mjs";
-import "../chunk-NMMFIRLZ.mjs";
-import "../chunk-EGXM575K.mjs";
+} from "../chunk-XC3UHH2U.mjs";
+import "../chunk-3NL3TOZF.mjs";
+import "../chunk-ENKVTAJB.mjs";
 import "../chunk-R4SQKVDQ.mjs";
 export {
   WarningBanner

package/dist/warning-banner/warning-banner.js

@@ -58,11 +58,12 @@ var import_typed_classname2 = require("@postenbring/hedwig-css/typed-classname")
 // src/box/box.tsx
 var import_react = require("react");
 var import_typed_classname = require("@postenbring/hedwig-css/typed-classname");
+var import_react_slot = require("@radix-ui/react-slot");
 var import_jsx_runtime = require("react/jsx-runtime");
 var Box = (0, import_react.forwardRef)(
   (_a, ref) => {
     var _b = _a, {
-      as: Component = "div",
+      asChild,
       variant,
       closeable = false,
       onClose: onCloseProp,
@@ -71,7 +72,7 @@ var Box = (0, import_react.forwardRef)(
       children,
       className
     } = _b, rest = __objRest(_b, [
-      "as",
+      "asChild",
       "variant",
       "closeable",
       "onClose",
@@ -92,6 +93,7 @@ var Box = (0, import_react.forwardRef)(
       }
     }, []);
     const closed = closedProp != null ? closedProp : closedState;
+    const Component = asChild ? import_react_slot.Slot : "div";
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
       Component,
       __spreadProps(__spreadValues({
@@ -105,7 +107,7 @@ var Box = (0, import_react.forwardRef)(
       }, rest), {
         children: [
           closeable ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(BoxCloseButton, __spreadValues({ onClick: onClose }, closeButtonProps)) : null,
-          children
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_slot.Slottable, { children })
         ]
       })
     );
@@ -144,57 +146,43 @@ var WarningBanner = (0, import_react2.forwardRef)(
   }
 );
 WarningBanner.displayName = "WarningBanner";
-var WarningBannerTitle = (0, import_react2.forwardRef)(
-  (_a, ref) => {
-    var _b = _a, {
-      variant,
-      as: Component = variant === "expandable" ? "button" : "p",
-      children,
-      className
-    } = _b, rest = __objRest(_b, [
-      "variant",
-      "as",
-      "children",
-      "className"
-    ]);
-    const [open, setOpen] = (0, import_react2.useState)(false);
-    if (variant === "expandable") {
-      return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        Component,
-        __spreadProps(__spreadValues({
-          className: (0, import_typed_classname2.clsx)(
-            "hds-warning-banner__title",
-            "hds-warning-banner__title-trigger",
-            { "hds-warning-banner--closed": !open },
-            className
-          ),
-          onClick: () => {
-            setOpen(!open);
-          },
-          ref,
-          type: "button"
-        }, rest), {
-          children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children })
-        })
-      );
-    }
+var WarningBannerTitle = (0, import_react2.forwardRef)((_a, ref) => {
+  var _b = _a, { variant, children, className } = _b, rest = __objRest(_b, ["variant", "children", "className"]);
+  const [open, setOpen] = (0, import_react2.useState)(false);
+  if (variant === "expandable") {
     return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      Component,
-      __spreadProps(__spreadValues({
-        className: (0, import_typed_classname2.clsx)("hds-warning-banner__title", className),
-        ref
-      }, rest), {
-        children
+      "button",
+      __spreadProps(__spreadValues({}, rest), {
+        className: (0, import_typed_classname2.clsx)(
+          "hds-warning-banner__title",
+          "hds-warning-banner__title-trigger",
+          { "hds-warning-banner--closed": !open },
+          className
+        ),
+        onClick: () => {
+          setOpen((prev) => !prev);
+        },
+        ref,
+        type: "button",
+        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children })
       })
     );
   }
-);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "p",
+    __spreadProps(__spreadValues({}, rest), {
+      className: (0, import_typed_classname2.clsx)("hds-warning-banner__title", className),
+      ref,
+      children
+    })
+  );
+});
 WarningBannerTitle.displayName = "WarningBannerTitle";
 var WarningBannerDescription = (0, import_react2.forwardRef)(
   (_a, ref) => {
-    var _b = _a, { as: Component = "p", className } = _b, rest = __objRest(_b, ["as", "className"]);
+    var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
     return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      Component,
+      "p",
       __spreadValues({
         className: (0, import_typed_classname2.clsx)("hds-warning-banner__description", className),
         ref

package/dist/warning-banner/warning-banner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/warning-banner/warning-banner.tsx","../../src/box/box.tsx","../../src/box/index.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { forwardRef, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport type { OverridableComponent } from \"../utils\";\nimport { Box } from \"../box\";\n\nexport interface WarningBannerProps {\n  title: ReactNode;\n  description?: ReactNode;\n}\n\nexport const WarningBanner: OverridableComponent<WarningBannerProps, HTMLDivElement> = forwardRef(\n  ({ title, description, className, ...rest }, ref) => {\n    const expandable = !!description;\n    return (\n      <Box {...rest} className={clsx(\"hds-warning-banner\", className as undefined)} ref={ref}>\n        <WarningBannerTitle variant={expandable ? \"expandable\" : \"default\"}>\n          {title}\n        </WarningBannerTitle>\n        {expandable ? <WarningBannerDescription>{description}</WarningBannerDescription> : null}\n      </Box>\n    );\n  },\n);\nWarningBanner.displayName = \"WarningBanner\";\n\ninterface WarningBannerTitleProps {\n  variant: \"expandable\" | \"default\";\n  children: ReactNode;\n}\n\nconst WarningBannerTitle: OverridableComponent<WarningBannerTitleProps, HTMLDivElement> =\n  forwardRef(\n    (\n      {\n        variant,\n        as: Component = variant === \"expandable\" ? \"button\" : \"p\",\n        children,\n        className,\n        ...rest\n      },\n      ref,\n    ) => {\n      const [open, setOpen] = useState<boolean>(false);\n      if (variant === \"expandable\") {\n        return (\n          <Component\n            className={clsx(\n              \"hds-warning-banner__title\",\n              \"hds-warning-banner__title-trigger\",\n              { \"hds-warning-banner--closed\": !open },\n              className as undefined,\n            )}\n            onClick={() => {\n              setOpen(!open);\n            }}\n            ref={ref}\n            type=\"button\"\n            {...rest}\n          >\n            <span>{children}</span>\n          </Component>\n        );\n      }\n      return (\n        <Component\n          className={clsx(\"hds-warning-banner__title\", className as undefined)}\n          ref={ref}\n          {...rest}\n        >\n          {children}\n        </Component>\n      );\n    },\n  );\nWarningBannerTitle.displayName = \"WarningBannerTitle\";\n\nconst WarningBannerDescription: OverridableComponent<object, HTMLParagraphElement> = forwardRef(\n  ({ as: Component = \"p\", className, ...rest }, ref) => {\n    return (\n      <Component\n        className={clsx(\"hds-warning-banner__description\", className as undefined)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\nWarningBannerDescription.displayName = \"WarningBannerDescription\";\n","import { forwardRef, useCallback, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport type { OverridableComponent } from \"../utils\";\n\nexport interface BoxProps extends React.HTMLAttributes<HTMLDivElement> {\n  variant?: \"light-grey\" | \"lighter\" | \"white\" | \"warning\";\n  children?: React.ReactNode;\n\n  /**\n   * If `true`, a close button will be shown.\n   * Use when you want to control the close button using the BoxCloseButton component.\n   */\n  closeable?: boolean;\n\n  /**\n   * Callback fired when the component requests to be closed.\n   * If not set, the component will be closed without any user interaction.\n   *\n   * If set, and the handler returns non-true value, the component will not be closed.\n   * Use this if you want to control the closing of the component, using the `closed` prop\n   *\n   * If set, and the handler returns the true, the component will be closed.\n   * Use this with `window.confirm()` to ask the user to confirm closing the component.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents -- It's fine, I want to have the boolean in the type\n  onClose?: () => boolean | unknown;\n\n  /**\n   * If `true`, the box will be closed and hidden from view\n   */\n  closed?: boolean;\n\n  /**\n   * Props applied to the close button element.\n   */\n  closeButtonProps?: BoxCloseButtonProps;\n}\n\nexport const Box: OverridableComponent<BoxProps, HTMLDivElement> = forwardRef(\n  (\n    {\n      as: Component = \"div\",\n      variant,\n      closeable = false,\n      onClose: onCloseProp,\n      closed: closedProp,\n      closeButtonProps,\n      children,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const [closedState, setClosedState] = useState(false);\n    const onClose = useCallback(() => {\n      if (onCloseProp) {\n        const result = onCloseProp();\n        if (result === true) {\n          setClosedState(true);\n        }\n      } else {\n        setClosedState(true);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps -- I know better\n    }, []);\n    const closed = closedProp ?? closedState;\n\n    return (\n      <Component\n        className={clsx(\n          \"hds-box\",\n          variant && `hds-box--${variant}`,\n          { \"hds-box--closed\": closed },\n          className as undefined,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        {closeable ? <BoxCloseButton onClick={onClose} {...closeButtonProps} /> : null}\n        {children}\n      </Component>\n    );\n  },\n);\nBox.displayName = \"Box\";\n\nexport type BoxCloseButtonProps = Omit<React.HTMLAttributes<HTMLButtonElement>, \"children\">;\nexport const BoxCloseButton = forwardRef<HTMLButtonElement, BoxCloseButtonProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <button\n        className={clsx(\"hds-box__close-button\", className as undefined)}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      />\n    );\n  },\n);\nBoxCloseButton.displayName = \"Box.CloseButton\";\n","import { Box, BoxCloseButton } from \"./box\";\n\nconst BoxComponent = Box as typeof Box & {\n  CloseButton: typeof BoxCloseButton;\n};\nBoxComponent.CloseButton = BoxCloseButton;\n\nexport { BoxComponent as Box, BoxCloseButton };\n\nexport type * from \"./box\";\n"],"mappings":"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","names":["import_react","import_typed_classname","import_jsx_runtime"]}
+{"version":3,"sources":["../../src/warning-banner/warning-banner.tsx","../../src/box/box.tsx","../../src/box/index.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport React, { forwardRef, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Box } from \"../box\";\n\nexport interface WarningBannerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, \"title\"> {\n  title: ReactNode;\n  description?: ReactNode;\n}\n\nexport const WarningBanner = forwardRef<HTMLDivElement, WarningBannerProps>(\n  ({ title, description, className, ...rest }, ref) => {\n    const expandable = !!description;\n    return (\n      <Box {...rest} className={clsx(\"hds-warning-banner\", className as undefined)} ref={ref}>\n        <WarningBannerTitle variant={expandable ? \"expandable\" : \"default\"}>\n          {title}\n        </WarningBannerTitle>\n        {expandable ? <WarningBannerDescription>{description}</WarningBannerDescription> : null}\n      </Box>\n    );\n  },\n);\nWarningBanner.displayName = \"WarningBanner\";\n\ntype WarningBannerTitleProps =\n  | ({ variant: \"expandable\" } & React.ButtonHTMLAttributes<HTMLButtonElement>)\n  | ({ variant: \"default\" } & React.HTMLAttributes<HTMLParagraphElement>);\n\nconst WarningBannerTitle = forwardRef<\n  HTMLButtonElement | HTMLParagraphElement,\n  WarningBannerTitleProps\n>(({ variant, children, className, ...rest }, ref) => {\n  const [open, setOpen] = useState<boolean>(false);\n  if (variant === \"expandable\") {\n    return (\n      <button\n        {...(rest as React.ButtonHTMLAttributes<HTMLButtonElement>)}\n        className={clsx(\n          \"hds-warning-banner__title\",\n          \"hds-warning-banner__title-trigger\",\n          { \"hds-warning-banner--closed\": !open },\n          className as undefined,\n        )}\n        onClick={() => {\n          setOpen((prev) => !prev);\n        }}\n        ref={ref as React.Ref<HTMLButtonElement>}\n        type=\"button\"\n      >\n        <span>{children}</span>\n      </button>\n    );\n  }\n  return (\n    <p\n      {...(rest as React.HTMLAttributes<HTMLParagraphElement>)}\n      className={clsx(\"hds-warning-banner__title\", className as undefined)}\n      ref={ref as React.Ref<HTMLParagraphElement>}\n    >\n      {children}\n    </p>\n  );\n});\nWarningBannerTitle.displayName = \"WarningBannerTitle\";\n\ntype WarningBannerDescriptionProps = React.HTMLAttributes<HTMLParagraphElement>;\nconst WarningBannerDescription = forwardRef<HTMLParagraphElement, WarningBannerDescriptionProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <p\n        className={clsx(\"hds-warning-banner__description\", className as undefined)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\nWarningBannerDescription.displayName = \"WarningBannerDescription\";\n","import { forwardRef, useCallback, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot, Slottable } from \"@radix-ui/react-slot\";\n\nexport interface BoxProps extends React.HTMLAttributes<HTMLDivElement> {\n  children?: React.ReactNode;\n\n  /**\n   * Color variant of the box\n   *\n   * @default \"light-grey\"\n   */\n  variant?: \"light-grey\" | \"lighter\" | \"white\" | \"warning\";\n\n  /**\n   * If `true`, a close button will be shown.\n   * Use when you want to control the close button using the BoxCloseButton component.\n   *\n   * @default false\n   */\n  closeable?: boolean;\n\n  /**\n   * Callback fired when the component requests to be closed.\n   * If not set, the component will be closed without any user interaction.\n   *\n   * If set, and the handler returns non-true value, the component will not be closed.\n   * Use this if you want to control the closing of the component, using the `closed` prop\n   *\n   * If set, and the handler returns the true, the component will be closed.\n   * Use this with `window.confirm()` to ask the user to confirm closing the component.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents -- It's fine, I want to have the boolean in the type\n  onClose?: () => boolean | unknown;\n\n  /**\n   * If `true`, the box will be closed and hidden from view\n   */\n  closed?: boolean;\n\n  /**\n   * Props applied to the close button element.\n   */\n  closeButtonProps?: BoxCloseButtonProps;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\nexport const Box = forwardRef<HTMLDivElement, BoxProps>(\n  (\n    {\n      asChild,\n      variant,\n      closeable = false,\n      onClose: onCloseProp,\n      closed: closedProp,\n      closeButtonProps,\n      children,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const [closedState, setClosedState] = useState(false);\n    const onClose = useCallback(() => {\n      if (onCloseProp) {\n        const result = onCloseProp();\n        if (result === true) {\n          setClosedState(true);\n        }\n      } else {\n        setClosedState(true);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps -- I know better\n    }, []);\n    const closed = closedProp ?? closedState;\n    const Component = asChild ? Slot : \"div\";\n\n    return (\n      <Component\n        className={clsx(\n          \"hds-box\",\n          variant && `hds-box--${variant}`,\n          { \"hds-box--closed\": closed },\n          className as undefined,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        {closeable ? <BoxCloseButton onClick={onClose} {...closeButtonProps} /> : null}\n        <Slottable>{children}</Slottable>\n      </Component>\n    );\n  },\n);\nBox.displayName = \"Box\";\n\nexport type BoxCloseButtonProps = Omit<React.HTMLAttributes<HTMLButtonElement>, \"children\">;\nexport const BoxCloseButton = forwardRef<HTMLButtonElement, BoxCloseButtonProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <button\n        className={clsx(\"hds-box__close-button\", className as undefined)}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      />\n    );\n  },\n);\nBoxCloseButton.displayName = \"Box.CloseButton\";\n","import { Box, BoxCloseButton } from \"./box\";\n\nconst BoxComponent = Box as typeof Box & {\n  CloseButton: typeof BoxCloseButton;\n};\nBoxComponent.CloseButton = BoxCloseButton;\n\nexport { BoxComponent as Box, BoxCloseButton };\n\nexport type * from \"./box\";\n"],"mappings":"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","names":["import_react","import_typed_classname","import_jsx_runtime"]}

package/dist/warning-banner/warning-banner.mjs

@@ -1,8 +1,8 @@
 import {
   WarningBanner
-} from "../chunk-PUESATBQ.mjs";
-import "../chunk-NMMFIRLZ.mjs";
-import "../chunk-EGXM575K.mjs";
+} from "../chunk-XC3UHH2U.mjs";
+import "../chunk-3NL3TOZF.mjs";
+import "../chunk-ENKVTAJB.mjs";
 import "../chunk-R4SQKVDQ.mjs";
 export {
   WarningBanner

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@postenbring/hedwig-react",
-  "version": "0.0.76",
+  "version": "0.0.78",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
@@ -12,7 +12,7 @@
     "dist/**"
   ],
   "devDependencies": {
-    "@microsoft/api-extractor": "7.43.1",
+    "@microsoft/api-extractor": "7.43.2",
     "@types/react": "^18.3.1",
     "@types/react-dom": "^18.3.0",
     "react": "^18.3.1",
@@ -31,7 +31,7 @@
   "dependencies": {
     "@radix-ui/react-popover": "1.0.7",
     "@radix-ui/react-slot": "1.0.2",
-    "@postenbring/hedwig-css": "0.0.67"
+    "@postenbring/hedwig-css": "0.0.68"
   },
   "publishConfig": {
     "access": "public"

package/dist/chunk-25R7DBK6.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/layout/grid/grid.tsx"],"sourcesContent":["import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { forwardRef } from \"react\";\nimport { getResponsiveProps, type ResponsiveProp } from \"../responsive\";\nimport { type SpacingSizes, type ResponsiveSpacingSizes, getSpacingVariable } from \"../spacing\";\n\nexport interface GridProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n\n  /**\n   * Space between grid items. Both horizontal and vertical.\n   *\n   * Use the responsive shorthand `12-16` to jump a level at the `large` breakpoint.\n   *\n   * Or use the responsive object `{ initial: 40, large: 64 }` to set different values at different breakpoints.\n   *\n   * Use `gapX` and `gapY` to set different values for horizontal and vertical spacing.\n   */\n  gap?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Space between grid items horizontally\n   */\n  gapX?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Space between grid items vertically\n   */\n  gapY?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Column span for the grid items\n   *\n   * `default` is `12`\n   */\n  span?: ResponsiveProp<1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12>;\n\n  /**\n   * Center grid items horizontally\n   *\n   * Offsets the start position of the grid items relative to their span so that it appears centered.\n   *\n   * assumes a span of 2, 4, 6, 8, or 10\n   *\n   * a span of `12` is 100% width and centering has no effect\n   *\n   * `default` is `false`\n   */\n  center?: ResponsiveProp<boolean>;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean;\n}\n\n/**\n * 🚧 A simple opionated abstraction over CSS Grid.\n *\n * The grid is always a 12 column grid.\n *\n * example\n * ```tsx\n * <Grid gap=\"12-16\" span={{ small: 6 }}>\n *   <div>6/12</div>\n *   <div>6/12</div>\n *   <Grid.Item span={{ small: 12 }}>12/12</Grid.Item>\n *   <div>6/12</div>\n *   <div>6/12</div>\n * </Grid>\n * ```\n */\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  (\n    { children, asChild, className, span, center, style: _style, gap, gapX, gapY, ...rest },\n    ref,\n  ) => {\n    const Component = asChild ? Slot : \"div\";\n    const style: React.CSSProperties = {\n      ..._style,\n      ...getResponsiveProps(\"--hds-grid-gap\", gap, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-grid-gap-x\", gapX, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-grid-gap-y\", gapY, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-grid-span\", span),\n      ...getResponsiveProps(\"--hds-grid-center\", center, (value) => (value ? \"1\" : \"0\")),\n    };\n    return (\n      <Component\n        style={style}\n        className={clsx(\"hds-grid\", className as undefined)}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nGrid.displayName = \"Grid\";\n\nexport interface GridItemProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n\n  /**\n   * Column span for the grid item\n   *\n   * `default` is `12`\n   */\n  span?: ResponsiveProp<1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12>;\n\n  /**\n   * Center the grid item horizontally\n   *\n   * Offsets the start position of the grid item relative to it's span so that it appears centered.\n   *\n   * assumes a span of 2, 4, 6, 8, or 10\n   *\n   * a span of `12` is 100% width and centering has no effect\n   *\n   * `default` is `false`\n   */\n  center?: ResponsiveProp<boolean>;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean;\n}\n\n/**\n * 🚧 Grid.Item\n *\n * Use as the direct child of a `Grid` to override `span` and `center` for individual items.\n */\nexport const GridItem = forwardRef<HTMLDivElement, GridItemProps>(\n  ({ children, asChild, className, span, center, style: _style, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    const style: React.CSSProperties = {\n      ..._style,\n      ...getResponsiveProps(\"--hds-grid-item-span\", span),\n      ...getResponsiveProps(\"--hds-grid-item-center\", center, (value) => (value ? \"1\" : \"0\")),\n    };\n    return (\n      <Component\n        style={style}\n        className={clsx(\"hds-grid__item\", className as undefined)}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nGridItem.displayName = \"Grid.Item\";\n"],"mappings":";;;;;;;;;;;;;AAAA,SAAS,YAAY;AACrB,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAqFrB;AAfC,IAAM,OAAO;AAAA,EAClB,CACE,IACA,QACG;AAFH,iBAAE,YAAU,SAAS,WAAW,MAAM,QAAQ,OAAO,QAAQ,KAAK,MAAM,KA1E5E,IA0EI,IAAiF,iBAAjF,IAAiF,CAA/E,YAAU,WAAS,aAAW,QAAM,UAAQ,SAAe,OAAK,QAAM;AAGxE,UAAM,YAAY,UAAU,OAAO;AACnC,UAAM,QAA6B,8FAC9B,SACA,mBAAmB,kBAAkB,KAAK,kBAAkB,IAC5D,mBAAmB,oBAAoB,MAAM,kBAAkB,IAC/D,mBAAmB,oBAAoB,MAAM,kBAAkB,IAC/D,mBAAmB,mBAAmB,IAAI,IAC1C,mBAAmB,qBAAqB,QAAQ,CAAC,UAAW,QAAQ,MAAM,GAAI;AAEnF,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,KAAK,YAAY,SAAsB;AAAA,QAClD;AAAA,SACI,OAJL;AAAA,QAME;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,KAAK,cAAc;AAoCZ,IAAM,WAAW;AAAA,EACtB,CAAC,IAAwE,QAAQ;AAAhF,iBAAE,YAAU,SAAS,WAAW,MAAM,QAAQ,OAAO,OAvIxD,IAuIG,IAAgE,iBAAhE,IAAgE,CAA9D,YAAU,WAAS,aAAW,QAAM,UAAQ;AAC7C,UAAM,YAAY,UAAU,OAAO;AACnC,UAAM,QAA6B,iDAC9B,SACA,mBAAmB,wBAAwB,IAAI,IAC/C,mBAAmB,0BAA0B,QAAQ,CAAC,UAAW,QAAQ,MAAM,GAAI;AAExF,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,KAAK,kBAAkB,SAAsB;AAAA,QACxD;AAAA,SACI,OAJL;AAAA,QAME;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,SAAS,cAAc;","names":[]}

package/dist/chunk-57SSGJ4X.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/text/text.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport type { OverridableComponent } from \"../utils\";\n\ninterface HeadingProps {\n  variant: \"h1-display\" | \"h1\" | \"h2\" | \"h3\" | \"h3-title\";\n  as: React.ElementType;\n}\ninterface ParagraphProps {\n  variant?:\n    | \"body\"\n    | \"body-title\"\n    | \"body-small\"\n    | \"body-small-title\"\n    | \"technical\"\n    | \"technical-title\"\n    | \"caption\"\n    | \"caption-title\";\n}\n\nexport type TextProps = (HeadingProps | ParagraphProps) & {\n  children: React.ReactNode;\n\n  /**\n   * The font-size of the component. By default it's `fluid` which means it's smaller on mobile and larger on desktop.\n   *\n   * But you can lock it to either the min or the max size.\n   */\n  size?: \"min\" | \"max\" | \"fluid\";\n\n  /**\n   * 🚧 Experimental spacing\n   */\n  _unstableSpacing?: boolean;\n};\n\nconst defaultHTMLTag: Record<NonNullable<TextProps[\"variant\"]>, `h${1 | 2 | 3}` | \"p\"> = {\n  \"h1-display\": \"h1\",\n  h1: \"h1\",\n  h2: \"h2\",\n  h3: \"h3\",\n  \"h3-title\": \"h3\",\n  body: \"p\",\n  \"body-title\": \"p\",\n  \"body-small\": \"p\",\n  \"body-small-title\": \"p\",\n  technical: \"p\",\n  \"technical-title\": \"p\",\n  caption: \"p\",\n  \"caption-title\": \"p\",\n};\n\n/**\n * Text component\n *\n * If the variant is `h1-display`, `h1`, `h2`, `h3`, or `h3-title` the `as` prop is required.\n *\n * This to force the consumer to consider which semantic html element to use. E.g. `<h1>` or `<h2>`\n *\n * @example\n * ```tsx\n * <Text variant=\"h1-display\" as=\"h1\">Hello world</Text>\n * <Text variant=\"body\">\n *   This is a body text\n * </Text>\n * ```\n */\nexport const Text: OverridableComponent<TextProps, HTMLDivElement> = forwardRef(\n  (\n    {\n      as,\n      variant = \"body\",\n      size = \"fluid\",\n      _unstableSpacing: spacing,\n      children,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const Component = as ?? defaultHTMLTag[variant];\n    const sizeModifier =\n      size !== \"fluid\" && variant !== \"caption\" && variant !== \"caption-title\" && size;\n    return (\n      <Component\n        className={clsx(\n          `hds-text-${variant}`,\n          sizeModifier && `hds-text--${sizeModifier}`,\n          spacing && \"hds-text--spacing\",\n          className as undefined,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nText.displayName = \"Text\";\n"],"mappings":";;;;;;;AAAA,SAAgB,kBAAkB;AAClC,SAAS,YAAY;AAmFf;AAhDN,IAAM,iBAAmF;AAAA,EACvF,cAAc;AAAA,EACd,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,cAAc;AAAA,EACd,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,WAAW;AAAA,EACX,mBAAmB;AAAA,EACnB,SAAS;AAAA,EACT,iBAAiB;AACnB;AAiBO,IAAM,OAAwD;AAAA,EACnE,CACE,IASA,QACG;AAVH,iBACE;AAAA;AAAA,MACA,UAAU;AAAA,MACV,OAAO;AAAA,MACP,kBAAkB;AAAA,MAClB;AAAA,MACA;AAAA,IA3EN,IAqEI,IAOK,iBAPL,IAOK;AAAA,MANH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAKF,UAAM,YAAY,kBAAM,eAAe,OAAO;AAC9C,UAAM,eACJ,SAAS,WAAW,YAAY,aAAa,YAAY,mBAAmB;AAC9E,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT,YAAY,OAAO;AAAA,UACnB,gBAAgB,aAAa,YAAY;AAAA,UACzC,WAAW;AAAA,UACX;AAAA,QACF;AAAA,QACA;AAAA,SACI,OARL;AAAA,QAUE;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,KAAK,cAAc;","names":[]}

package/dist/chunk-5QL53TR2.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/link/link.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef } from \"react\";\nimport type { OverridableComponent } from \"../utils\";\n\nexport interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n  /**\n   * The visual style of the link\n   */\n  variant?: \"underline\" | \"solid\" | \"inverted\" | \"no-underline\";\n\n  /**\n   * Font size of the link\n   */\n  size?: \"small\" | \"medium\" | \"large\";\n\n  children: React.ReactNode;\n}\n\nexport const Link: OverridableComponent<LinkProps, HTMLAnchorElement> = forwardRef(\n  (\n    { as: Component = \"a\", children, variant = \"underline\", size = \"medium\", className, ...rest },\n    ref,\n  ) => {\n    return (\n      <Component\n        className={clsx(\n          \"hds-link\",\n          variant !== \"underline\" && `hds-link--${variant}`,\n          size !== \"medium\" && `hds-link--${size}`,\n          className as undefined,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nLink.displayName = \"Link\";\n"],"mappings":";;;;;;;AAAA,OAAuB;AACvB,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAuBrB;AANC,IAAM,OAA2D;AAAA,EACtE,CACE,IACA,QACG;AAFH,iBAAE,MAAI,YAAY,KAAK,UAAU,UAAU,aAAa,OAAO,UAAU,UArB7E,IAqBI,IAAuF,iBAAvF,IAAuF,CAArF,MAAqB,YAAU,WAAuB,QAAiB;AAGzE,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,YAAY,eAAe,aAAa,OAAO;AAAA,UAC/C,SAAS,YAAY,aAAa,IAAI;AAAA,UACtC;AAAA,QACF;AAAA,QACA;AAAA,SACI,OARL;AAAA,QAUE;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,KAAK,cAAc;","names":[]}

package/dist/chunk-625SVQEP.mjs

@@ -1,84 +0,0 @@
-import {
-  __objRest,
-  __spreadProps,
-  __spreadValues
-} from "./chunk-R4SQKVDQ.mjs";
-
-// src/navbar/navbar.tsx
-import { forwardRef } from "react";
-import { clsx } from "@postenbring/hedwig-css/typed-classname";
-import { Slot } from "@radix-ui/react-slot";
-import { jsx, jsxs } from "react/jsx-runtime";
-var Navbar = forwardRef(
-  (_a, ref) => {
-    var _b = _a, { children, className, variant } = _b, rest = __objRest(_b, ["children", "className", "variant"]);
-    return /* @__PURE__ */ jsx(
-      "header",
-      __spreadProps(__spreadValues({
-        className: clsx("hds-navbar", variant && `hds-navbar--${variant}`, className),
-        ref
-      }, rest), {
-        children
-      })
-    );
-  }
-);
-Navbar.displayName = "Navbar";
-var NavbarLogo = forwardRef(
-  (_a, ref) => {
-    var _b = _a, { as: Component = "div", className } = _b, rest = __objRest(_b, ["as", "className"]);
-    return /* @__PURE__ */ jsx(Component, __spreadValues({ className: clsx("hds-navbar__logo", className), ref }, rest));
-  }
-);
-NavbarLogo.displayName = "Navbar.Logo";
-var NavbarLogoAndServiceText = forwardRef(
-  (_a, ref) => {
-    var _b = _a, { children, asChild, variant, className } = _b, rest = __objRest(_b, ["children", "asChild", "variant", "className"]);
-    const Component = asChild ? Slot : "div";
-    return /* @__PURE__ */ jsx(
-      Component,
-      __spreadProps(__spreadValues({
-        ref,
-        className: clsx(
-          "hds-navbar__logo-and-service-text",
-          `hds-navbar__logo-and-service-text--${variant}`,
-          className
-        )
-      }, rest), {
-        children
-      })
-    );
-  }
-);
-NavbarLogoAndServiceText.displayName = "Navbar.NavbarLogoAndText";
-var NavbarButton = forwardRef(
-  (_a, ref) => {
-    var _b = _a, { as: Component = "button", children, icon, className } = _b, rest = __objRest(_b, ["as", "children", "icon", "className"]);
-    return /* @__PURE__ */ jsxs(Component, __spreadProps(__spreadValues({ className: clsx("hds-navbar__button", className), ref }, rest), { children: [
-      children,
-      " ",
-      icon
-    ] }));
-  }
-);
-NavbarButton.displayName = "Navbar.Button";
-var NavbarNavigation = forwardRef((_a, ref) => {
-  var _b = _a, { as: Component = "div", className } = _b, rest = __objRest(_b, ["as", "className"]);
-  return /* @__PURE__ */ jsx(
-    Component,
-    __spreadValues({
-      className: clsx("hds-navbar__navigation", className),
-      ref
-    }, rest)
-  );
-});
-NavbarNavigation.displayName = "Navbar.Navigation";
-
-export {
-  Navbar,
-  NavbarLogo,
-  NavbarLogoAndServiceText,
-  NavbarButton,
-  NavbarNavigation
-};
-//# sourceMappingURL=chunk-625SVQEP.mjs.map

package/dist/chunk-625SVQEP.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/navbar/navbar.tsx"],"sourcesContent":["import React, { forwardRef, type HTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport type { OverridableComponent } from \"../utils\";\n\nexport interface NavbarProps extends HTMLAttributes<HTMLElement> {\n  /**\n   * Navbar variant\n   *\n   * By default the `posten.no` variant is used which has a fixed logo and a fixed height of 112px\n   *\n   * For internal services or flagship services use the `service` should be used\n   */\n  variant?: \"default\" | \"service\";\n  children: React.ReactNode;\n}\n\n/**\n * 🚨 WORK IN PROGRESS 🚨\n */\nexport const Navbar = forwardRef<HTMLElement, NavbarProps>(\n  ({ children, className, variant, ...rest }, ref) => {\n    return (\n      <header\n        className={clsx(\"hds-navbar\", variant && `hds-navbar--${variant}`, className as undefined)}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </header>\n    );\n  },\n);\nNavbar.displayName = \"Navbar\";\n\ninterface NavbarLogoProps {\n  children?: never;\n}\n\n/**\n * A fixed Posten or Bring logo.\n *\n * The logo follows the brand theme, so if the class `hds-theme-bring` is set the Bring logo will be shown instead of the Posten logo\n */\nexport const NavbarLogo: OverridableComponent<NavbarLogoProps, HTMLDivElement> = forwardRef(\n  ({ as: Component = \"div\", className, ...rest }, ref) => {\n    return (\n      <Component className={clsx(\"hds-navbar__logo\", className as undefined)} ref={ref} {...rest} />\n    );\n  },\n);\nNavbarLogo.displayName = \"Navbar.Logo\";\n\ninterface NavbarLogoAndServiceText extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * The text display next to the logo\n   */\n  children: React.ReactNode;\n\n  /**\n   * The text variant\n   *\n   * Use `service` for internal applications\n   * Use `flagship` for public facing applications\n   */\n  variant: \"service\" | \"flagship\";\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean;\n}\n/**\n * Internal service or flagship text next to either the Posten or Bring logo\n *\n * The logo follows the brand theme, so if the class `hds-theme-bring` is set the Bring logo will be shown instead of the Posten logo\n */\nexport const NavbarLogoAndServiceText = forwardRef<HTMLDivElement, NavbarLogoAndServiceText>(\n  ({ children, asChild, variant, className, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        ref={ref}\n        className={clsx(\n          \"hds-navbar__logo-and-service-text\",\n          `hds-navbar__logo-and-service-text--${variant}`,\n          className as undefined,\n        )}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nNavbarLogoAndServiceText.displayName = \"Navbar.NavbarLogoAndText\";\n\n// Navbar button\ninterface NavbarButtonProps {\n  icon?: React.ReactNode;\n  children: React.ReactNode;\n}\nexport const NavbarButton: OverridableComponent<NavbarButtonProps, HTMLElement> = forwardRef(\n  ({ as: Component = \"button\", children, icon, className, ...rest }, ref) => {\n    return (\n      <Component className={clsx(\"hds-navbar__button\", className as undefined)} ref={ref} {...rest}>\n        {children} {icon}\n      </Component>\n    );\n  },\n);\nNavbarButton.displayName = \"Navbar.Button\";\n\ninterface NavbarNavigationProps {\n  children: React.ReactNode;\n}\nexport const NavbarNavigation: OverridableComponent<NavbarNavigationProps, HTMLElement> =\n  forwardRef(({ as: Component = \"div\", className, ...rest }, ref) => {\n    return (\n      <Component\n        className={clsx(\"hds-navbar__navigation\", className as undefined)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  });\nNavbarNavigation.displayName = \"Navbar.Navigation\";\n"],"mappings":";;;;;;;AAAA,SAAgB,kBAAuC;AACvD,SAAS,YAAY;AACrB,SAAS,YAAY;AAqBf,cAkFA,YAlFA;AAHC,IAAM,SAAS;AAAA,EACpB,CAAC,IAA2C,QAAQ;AAAnD,iBAAE,YAAU,WAAW,QArB1B,IAqBG,IAAmC,iBAAnC,IAAmC,CAAjC,YAAU,aAAW;AACtB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,KAAK,cAAc,WAAW,eAAe,OAAO,IAAI,SAAsB;AAAA,QACzF;AAAA,SACI,OAHL;AAAA,QAKE;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,OAAO,cAAc;AAWd,IAAM,aAAoE;AAAA,EAC/E,CAAC,IAA+C,QAAQ;AAAvD,iBAAE,MAAI,YAAY,OAAO,UA7C5B,IA6CG,IAAuC,iBAAvC,IAAuC,CAArC,MAAuB;AACxB,WACE,oBAAC,4BAAU,WAAW,KAAK,oBAAoB,SAAsB,GAAG,OAAc,KAAM;AAAA,EAEhG;AACF;AACA,WAAW,cAAc;AA0BlB,IAAM,2BAA2B;AAAA,EACtC,CAAC,IAAoD,QAAQ;AAA5D,iBAAE,YAAU,SAAS,SAAS,UA9EjC,IA8EG,IAA4C,iBAA5C,IAA4C,CAA1C,YAAU,WAAS,WAAS;AAC7B,UAAM,YAAY,UAAU,OAAO;AACnC,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA,sCAAsC,OAAO;AAAA,UAC7C;AAAA,QACF;AAAA,SACI,OAPL;AAAA,QASE;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,yBAAyB,cAAc;AAOhC,IAAM,eAAqE;AAAA,EAChF,CAAC,IAAkE,QAAQ;AAA1E,iBAAE,MAAI,YAAY,UAAU,UAAU,MAAM,UAvG/C,IAuGG,IAA0D,iBAA1D,IAA0D,CAAxD,MAA0B,YAAU,QAAM;AAC3C,WACE,qBAAC,0CAAU,WAAW,KAAK,sBAAsB,SAAsB,GAAG,OAAc,OAAvF,EACE;AAAA;AAAA,MAAS;AAAA,MAAE;AAAA,QACd;AAAA,EAEJ;AACF;AACA,aAAa,cAAc;AAKpB,IAAM,mBACX,WAAW,CAAC,IAA+C,QAAQ;AAAvD,eAAE,MAAI,YAAY,OAAO,UArHvC,IAqHc,IAAuC,iBAAvC,IAAuC,CAArC,MAAuB;AACnC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,KAAK,0BAA0B,SAAsB;AAAA,MAChE;AAAA,OACI;AAAA,EACN;AAEJ,CAAC;AACH,iBAAiB,cAAc;","names":[]}

package/dist/chunk-62F4I3MQ.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/accordion/accordion-item.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactElement } from \"react\";\nimport { forwardRef, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport type { OverridableComponent } from \"../utils\";\nimport { AccordionItemContext } from \"./context\";\nimport type { AccordionHeaderProps } from \"./accordion-header\";\nimport type { AccordionContentProps } from \"./accordion-content\";\n\nexport type AccordionItemChildrenType =\n  | ReactElement<AccordionHeaderProps>\n  | ReactElement<AccordionContentProps>;\n\nexport interface AccordionItemProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Control the open state of the accordion manually\n   */\n  open?: boolean;\n\n  /**\n   * Use with open to control the open state of the accordion manually\n   */\n  onOpenChange?: (open: boolean) => void;\n\n  /**\n   * If the accordion should be open by default\n   */\n  defaultOpen?: boolean;\n\n  /**\n   * Accepts type of Accordion.Content and Accordion.Header\n   */\n  children: AccordionItemChildrenType[];\n}\n\nexport const AccordionItem: OverridableComponent<AccordionItemProps, HTMLDivElement> = forwardRef(\n  (\n    {\n      as: Component = \"div\",\n      children,\n      defaultOpen,\n      open: outerOpen,\n      onOpenChange,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const [innerOpen, setInnerOpen] = useState(defaultOpen ?? false);\n    const open = outerOpen ?? innerOpen;\n\n    const handleOpen = () => {\n      if (outerOpen !== undefined) {\n        onOpenChange && onOpenChange(!open);\n      } else {\n        setInnerOpen(!open);\n      }\n    };\n\n    return (\n      <Component\n        {...rest}\n        data-state={open ? \"open\" : \"closed\"}\n        className={clsx(\"hds-accordion-item\", className as undefined)}\n        ref={ref}\n      >\n        <AccordionItemContext.Provider value={{ open, setOpen: handleOpen }}>\n          {children}\n        </AccordionItemContext.Provider>\n      </Component>\n    );\n  },\n);\n\nAccordionItem.displayName = \"Accordion.Item\";\n"],"mappings":";;;;;;;;;;AACA,SAAS,YAAY,gBAAgB;AACrC,SAAS,YAAY;AA+Db;AA/BD,IAAM,gBAA0E;AAAA,EACrF,CACE,IASA,QACG;AAVH,iBACE;AAAA,UAAI,YAAY;AAAA,MAChB;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,IA1CN,IAoCI,IAOK,iBAPL,IAOK;AAAA,MANH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAKF,UAAM,CAAC,WAAW,YAAY,IAAI,SAAS,oCAAe,KAAK;AAC/D,UAAM,OAAO,gCAAa;AAE1B,UAAM,aAAa,MAAM;AACvB,UAAI,cAAc,QAAW;AAC3B,wBAAgB,aAAa,CAAC,IAAI;AAAA,MACpC,OAAO;AACL,qBAAa,CAAC,IAAI;AAAA,MACpB;AAAA,IACF;AAEA,WACE;AAAA,MAAC;AAAA,uCACK,OADL;AAAA,QAEC,cAAY,OAAO,SAAS;AAAA,QAC5B,WAAW,KAAK,sBAAsB,SAAsB;AAAA,QAC5D;AAAA,QAEA,8BAAC,qBAAqB,UAArB,EAA8B,OAAO,EAAE,MAAM,SAAS,WAAW,GAC/D,UACH;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,cAAc,cAAc;","names":[]}

package/dist/chunk-A47QULAK.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/skeleton/skeleton.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef } from \"react\";\nimport type { OverridableComponent } from \"../utils\";\n\ninterface DimensionsFromWidthAndHeight {\n  height?: number | string;\n  width?: number | string;\n}\n\ninterface SkeletonPropsInner extends React.AnchorHTMLAttributes<HTMLDivElement> {\n  /**\n   * The visual style of the Skeleton\n   */\n  variant?: \"text\" | \"circle\" | \"rectangle\" | \"rounded\";\n\n  /**\n   * Whether to show animation or not\n   * In the future the animation effect might become configurable\n   *\n   * default true\n   */\n  animation?: boolean;\n\n  children?: React.ReactNode;\n}\n\nexport type SkeletonProps = SkeletonPropsInner & DimensionsFromWidthAndHeight;\n\n/**\n * Make skeleton loading states as placeholders for your content while waiting for data to load.\n *\n * **Note**\n *\n * Consider if this is really needed. The best experience is to avoid loading states altogether.\n * If your loading takes under 1 second, it better to not show anything at all.\n *\n * - Make your backend faster\n * - Preload/prefetch data\n * - Avoid data loading waterfalls\n * - Use optimistic ui when doing mutations\n *\n * **Usage**\n *\n * ```tsx\n * <Skeleton variant=\"circle\" width=\"2rem\" height=\"2rem\" />\n * <Skeleton variant=\"text\" />\n * <Skeleton variant=\"text\" width=\"80%\" />\n * <Skeleton variant=\"text\">Uses content to determine width</Skeleton>\n * <Skeleton variant=\"rectangle\" width=\"300px\" height=\"400px\" />\n * ```\n *\n * Remember to set `aria-hidden` on top level components you use that are not the `Skeleton` component.\n *\n * The `Skeleton` component does this for it self, but if you are using other components higher up in the tree, it might cause problems with screen readers\n *\n * **References**\n * - https://aksel.nav.no/komponenter/core/skeleton\n * - https://chakra-ui.com/docs/components/skeleton\n * - https://mui.com/material-ui/react-skeleton/\n */\nexport const Skeleton: OverridableComponent<SkeletonProps, HTMLDivElement> = forwardRef(\n  (\n    {\n      as: Component = \"div\",\n      children,\n      animation = true,\n      variant = \"text\",\n      width,\n      height,\n      className,\n      style,\n      ...rest\n    },\n    ref,\n  ) => {\n    return (\n      <Component\n        className={clsx(\n          \"hds-skeleton\",\n          `hds-skeleton--${variant}`,\n          !animation && `hds-skeleton--no-animation`,\n          className as undefined,\n        )}\n        style={{ ...style, width, height }}\n        ref={ref}\n        aria-hidden\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nSkeleton.displayName = \"Skeleton\";\n"],"mappings":";;;;;;;AAAA,OAAuB;AACvB,SAAS,YAAY;AACrB,SAAS,kBAAkB;AA2ErB;AAhBC,IAAM,WAAgE;AAAA,EAC3E,CACE,IAWA,QACG;AAZH,iBACE;AAAA,UAAI,YAAY;AAAA,MAChB;AAAA,MACA,YAAY;AAAA,MACZ,UAAU;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAvEN,IA+DI,IASK,iBATL,IASK;AAAA,MARH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAKF,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,iBAAiB,OAAO;AAAA,UACxB,CAAC,aAAa;AAAA,UACd;AAAA,QACF;AAAA,QACA,OAAO,iCAAK,QAAL,EAAY,OAAO,OAAO;AAAA,QACjC;AAAA,QACA,eAAW;AAAA,SACP,OAVL;AAAA,QAYE;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,SAAS,cAAc;","names":[]}

package/dist/chunk-BWFFP6BB.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/button/button.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport type { OverridableComponent } from \"../utils\";\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /**\n   * The height, font size and padding of the button\n   */\n  size?: \"small\" | \"medium\" | \"large\";\n\n  /**\n   * The background fill of the button\n   */\n  fill?: \"contained\" | \"outline\";\n\n  /**\n   * Make the button use 100% width available.\n   * Using the \"mobile\" it only stretch to full width on smaller screens\n   */\n  fullWidth?: boolean | \"mobile\";\n\n  /**\n   * Use an icon inside the button\n   */\n  icon?: React.ReactNode;\n\n  children?: React.ReactNode;\n}\n\nexport const BaseButton: OverridableComponent<\n  ButtonProps & { variant: \"primary\" | \"secondary\" },\n  HTMLButtonElement\n> = forwardRef(\n  (\n    {\n      as: Component = \"button\",\n      children,\n      variant,\n      size = \"medium\",\n      fullWidth = false,\n      fill = \"contained\",\n      icon,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    return (\n      <Component\n        className={clsx(\n          \"hds-button\",\n          `hds-button--${size}`,\n          {\n            [`hds-button--${variant}`]: fill === \"contained\",\n            [`hds-button--outline-${variant}`]: fill === \"outline\",\n            \"hds-button--full\": fullWidth === true,\n            \"hds-button--mobile-full\": fullWidth === \"mobile\",\n            \"hds-button--icon-only\": icon && !children,\n          },\n          className as undefined,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        {icon && !children ? icon : null}\n        {children}\n      </Component>\n    );\n  },\n);\nBaseButton.displayName = \"BaseButton\";\n\n/**\n * ## TODO\n *\n * - [x] Handle links that looks like buttons\n * - [ ] Revisit how to handle outline\n * - [ ] Figure out outline-white\n */\n\nexport const PrimaryButton: OverridableComponent<ButtonProps, HTMLButtonElement> = forwardRef(\n  (props, ref) => {\n    return <BaseButton {...props} ref={ref} variant=\"primary\" />;\n  },\n);\n\nPrimaryButton.displayName = \"PrimaryButton\";\n\nexport const SecondaryButton: OverridableComponent<ButtonProps, HTMLButtonElement> = forwardRef(\n  (props, ref) => {\n    return <BaseButton {...props} ref={ref} variant=\"secondary\" />;\n  },\n);\n\nSecondaryButton.displayName = \"SecondaryButton\";\n"],"mappings":";;;;;;;AAAA,SAAS,kBAAkB;AAC3B,SAAS,YAAY;AA+Cf,SAkCK,KAlCL;AAnBC,IAAM,aAGT;AAAA,EACF,CACE,IAWA,QACG;AAZH,iBACE;AAAA,UAAI,YAAY;AAAA,MAChB;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP,YAAY;AAAA,MACZ,OAAO;AAAA,MACP;AAAA,MACA;AAAA,IA1CN,IAkCI,IASK,iBATL,IASK;AAAA,MARH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAKF,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,eAAe,IAAI;AAAA,UACnB;AAAA,YACE,CAAC,eAAe,OAAO,EAAE,GAAG,SAAS;AAAA,YACrC,CAAC,uBAAuB,OAAO,EAAE,GAAG,SAAS;AAAA,YAC7C,oBAAoB,cAAc;AAAA,YAClC,2BAA2B,cAAc;AAAA,YACzC,yBAAyB,QAAQ,CAAC;AAAA,UACpC;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,SACI,OAdL;AAAA,QAgBE;AAAA,kBAAQ,CAAC,WAAW,OAAO;AAAA,UAC3B;AAAA;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,WAAW,cAAc;AAUlB,IAAM,gBAAsE;AAAA,EACjF,CAAC,OAAO,QAAQ;AACd,WAAO,oBAAC,6CAAe,QAAf,EAAsB,KAAU,SAAQ,YAAU;AAAA,EAC5D;AACF;AAEA,cAAc,cAAc;AAErB,IAAM,kBAAwE;AAAA,EACnF,CAAC,OAAO,QAAQ;AACd,WAAO,oBAAC,6CAAe,QAAf,EAAsB,KAAU,SAAQ,cAAY;AAAA,EAC9D;AACF;AAEA,gBAAgB,cAAc;","names":[]}

package/dist/chunk-E2RTLHMZ.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/help-text/help-text.tsx"],"sourcesContent":["import * as Popover from \"@radix-ui/react-popover\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef } from \"react\";\nimport { Box } from \"../box\";\n\ninterface HelpTextProps extends React.HTMLAttributes<HTMLButtonElement> {\n  className?: string;\n\n  /**\n   * The content of the help text, often a word or phrase that could use some explanation\n   */\n  children: React.ReactNode;\n\n  /**\n   * The help text that will be shown when the user clicks the trigger\n   */\n  helpText: React.ReactNode;\n\n  /**\n   * The title of the help text. Used by screen readers and if the user hover over the help text\n   */\n  title?: string;\n\n  /**\n   * Props for the `Box` that contains the help text\n   */\n  boxProps?: React.ComponentProps<typeof Box>;\n\n  /**\n   * The side of the trigger the popover should be attached to\n   *\n   * default is `top`\n   */\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n\n  /**\n   * The alignment of the popover content\n   *\n   * default is `start`\n   */\n  align?: \"center\" | \"end\" | \"start\";\n}\n\n/**\n * Show a help text for a word or phrase when clicked\n *\n * Useful for providing explanations for domain-specific terms, acronyms or phrases that could do with further elaboration\n *\n * **Usage**\n * ```tsx\n * <p>\n *   En annen avgjørende faktor for avgifter er om nettbutikken er registrert i{\" \"}\n *   <HelpText helpText={`VOEC er en forkortelse for \"VAT on E-commerce\" (mva. på e-handel).`}>\n *    VOEC\n *   </HelpText>\n * </p>\n * ```\n */\nexport const HelpText = forwardRef<HTMLButtonElement, HelpTextProps>(\n  (\n    { children, className, helpText, title, side = \"top\", align = \"start\", boxProps, ...rest },\n    ref,\n  ) => {\n    return (\n      // NOTE: Using radix's [Popover component](https://www.radix-ui.com/primitives/docs/components/popover)\n      // In the future we can use the native popover api, but as of writing, though all browsers support it\n      // it's not far enough back to be used in production\n      // https://caniuse.com/mdn-html_elements_input_popovertarget\n      <Popover.Root>\n        <Popover.Trigger asChild>\n          <button\n            ref={ref}\n            className={clsx(\"hds-help-text-button\", className as undefined)}\n            title={title}\n            type=\"button\"\n            {...rest}\n          >\n            {children}\n          </button>\n        </Popover.Trigger>\n        <Popover.Portal>\n          <Popover.Content asChild side={side} align={align}>\n            <Box\n              {...boxProps}\n              className={clsx(\"hds-help-text-box\", boxProps?.className as undefined)}\n            >\n              <Popover.Close asChild>\n                <Box.CloseButton />\n              </Popover.Close>\n              {helpText}\n            </Box>\n          </Popover.Content>\n        </Popover.Portal>\n      </Popover.Root>\n    );\n  },\n);\nHelpText.displayName = \"HelpText\";\n"],"mappings":";;;;;;;;;;AAAA,YAAY,aAAa;AACzB,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAoEjB,cAYE,YAZF;AAZH,IAAM,WAAW;AAAA,EACtB,CACE,IACA,QACG;AAFH,iBAAE,YAAU,WAAW,UAAU,OAAO,OAAO,OAAO,QAAQ,SAAS,SA5D3E,IA4DI,IAAoF,iBAApF,IAAoF,CAAlF,YAAU,aAAW,YAAU,SAAO,QAAc,SAAiB;AAGvE;AAAA;AAAA;AAAA;AAAA;AAAA,MAKE,qBAAS,cAAR,EACC;AAAA,4BAAS,iBAAR,EAAgB,SAAO,MACtB;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,WAAW,KAAK,wBAAwB,SAAsB;AAAA,YAC9D;AAAA,YACA,MAAK;AAAA,aACD,OALL;AAAA,YAOE;AAAA;AAAA,QACH,GACF;AAAA,QACA,oBAAS,gBAAR,EACC,8BAAS,iBAAR,EAAgB,SAAO,MAAC,MAAY,OACnC;AAAA,UAAC;AAAA,2CACK,WADL;AAAA,YAEC,WAAW,KAAK,qBAAqB,qCAAU,SAAsB;AAAA,YAErE;AAAA,kCAAS,eAAR,EAAc,SAAO,MACpB,8BAAC,aAAI,aAAJ,EAAgB,GACnB;AAAA,cACC;AAAA;AAAA;AAAA,QACH,GACF,GACF;AAAA,SACF;AAAA;AAAA,EAEJ;AACF;AACA,SAAS,cAAc;","names":[]}

package/dist/chunk-EGXM575K.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/box/box.tsx"],"sourcesContent":["import { forwardRef, useCallback, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport type { OverridableComponent } from \"../utils\";\n\nexport interface BoxProps extends React.HTMLAttributes<HTMLDivElement> {\n  variant?: \"light-grey\" | \"lighter\" | \"white\" | \"warning\";\n  children?: React.ReactNode;\n\n  /**\n   * If `true`, a close button will be shown.\n   * Use when you want to control the close button using the BoxCloseButton component.\n   */\n  closeable?: boolean;\n\n  /**\n   * Callback fired when the component requests to be closed.\n   * If not set, the component will be closed without any user interaction.\n   *\n   * If set, and the handler returns non-true value, the component will not be closed.\n   * Use this if you want to control the closing of the component, using the `closed` prop\n   *\n   * If set, and the handler returns the true, the component will be closed.\n   * Use this with `window.confirm()` to ask the user to confirm closing the component.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents -- It's fine, I want to have the boolean in the type\n  onClose?: () => boolean | unknown;\n\n  /**\n   * If `true`, the box will be closed and hidden from view\n   */\n  closed?: boolean;\n\n  /**\n   * Props applied to the close button element.\n   */\n  closeButtonProps?: BoxCloseButtonProps;\n}\n\nexport const Box: OverridableComponent<BoxProps, HTMLDivElement> = forwardRef(\n  (\n    {\n      as: Component = \"div\",\n      variant,\n      closeable = false,\n      onClose: onCloseProp,\n      closed: closedProp,\n      closeButtonProps,\n      children,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const [closedState, setClosedState] = useState(false);\n    const onClose = useCallback(() => {\n      if (onCloseProp) {\n        const result = onCloseProp();\n        if (result === true) {\n          setClosedState(true);\n        }\n      } else {\n        setClosedState(true);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps -- I know better\n    }, []);\n    const closed = closedProp ?? closedState;\n\n    return (\n      <Component\n        className={clsx(\n          \"hds-box\",\n          variant && `hds-box--${variant}`,\n          { \"hds-box--closed\": closed },\n          className as undefined,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        {closeable ? <BoxCloseButton onClick={onClose} {...closeButtonProps} /> : null}\n        {children}\n      </Component>\n    );\n  },\n);\nBox.displayName = \"Box\";\n\nexport type BoxCloseButtonProps = Omit<React.HTMLAttributes<HTMLButtonElement>, \"children\">;\nexport const BoxCloseButton = forwardRef<HTMLButtonElement, BoxCloseButtonProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <button\n        className={clsx(\"hds-box__close-button\", className as undefined)}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      />\n    );\n  },\n);\nBoxCloseButton.displayName = \"Box.CloseButton\";\n"],"mappings":";;;;;;;AAAA,SAAS,YAAY,aAAa,gBAAgB;AAClD,SAAS,YAAY;AAmEf,SAUe,KAVf;AA9BC,IAAM,MAAsD;AAAA,EACjE,CACE,IAWA,QACG;AAZH,iBACE;AAAA,UAAI,YAAY;AAAA,MAChB;AAAA,MACA,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,QAAQ;AAAA,MACR;AAAA,MACA;AAAA,MACA;AAAA,IAhDN,IAwCI,IASK,iBATL,IASK;AAAA,MARH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAKF,UAAM,CAAC,aAAa,cAAc,IAAI,SAAS,KAAK;AACpD,UAAM,UAAU,YAAY,MAAM;AAChC,UAAI,aAAa;AACf,cAAM,SAAS,YAAY;AAC3B,YAAI,WAAW,MAAM;AACnB,yBAAe,IAAI;AAAA,QACrB;AAAA,MACF,OAAO;AACL,uBAAe,IAAI;AAAA,MACrB;AAAA,IAEF,GAAG,CAAC,CAAC;AACL,UAAM,SAAS,kCAAc;AAE7B,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,WAAW,YAAY,OAAO;AAAA,UAC9B,EAAE,mBAAmB,OAAO;AAAA,UAC5B;AAAA,QACF;AAAA,QACA;AAAA,SACI,OARL;AAAA,QAUE;AAAA,sBAAY,oBAAC,iCAAe,SAAS,WAAa,iBAAkB,IAAK;AAAA,UACzE;AAAA;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,IAAI,cAAc;AAGX,IAAM,iBAAiB;AAAA,EAC5B,CAAC,IAAwB,QAAQ;AAAhC,iBAAE,YAxFL,IAwFG,IAAgB,iBAAhB,IAAgB,CAAd;AACD,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,KAAK,yBAAyB,SAAsB;AAAA,QAC/D;AAAA,QACA,MAAK;AAAA,SACD;AAAA,IACN;AAAA,EAEJ;AACF;AACA,eAAe,cAAc;","names":[]}