@postenbring/hedwig-react 2.1.3 → 2.2.0

package/dist/index.mjs

@@ -1,7 +1,15 @@
+import "./chunk-CSXSUQ2M.mjs";
+import {
+  Text
+} from "./chunk-DMOMTRIY.mjs";
 import "./chunk-3D2MWIEX.mjs";
 import {
   WarningBanner
 } from "./chunk-EMQB6JIS.mjs";
+import "./chunk-JKCVB5TR.mjs";
+import {
+  StyledHtml
+} from "./chunk-EGW3RCXD.mjs";
 import "./chunk-3LYJRAOC.mjs";
 import {
   Table
@@ -19,10 +27,10 @@ import {
   TabsTab
 } from "./chunk-J5SCUELT.mjs";
 import "./chunk-KQITCS3U.mjs";
-import "./chunk-CSXSUQ2M.mjs";
+import "./chunk-SRLM3K2X.mjs";
 import {
-  Text
-} from "./chunk-DMOMTRIY.mjs";
+  ShowMoreButton
+} from "./chunk-JUHJZLH2.mjs";
 import "./chunk-JTZPQHKD.mjs";
 import {
   Skeleton
@@ -35,10 +43,6 @@ import "./chunk-TJH5QJMS.mjs";
 import {
   StepIndicator
 } from "./chunk-XQBJ75VD.mjs";
-import "./chunk-JKCVB5TR.mjs";
-import {
-  StyledHtml
-} from "./chunk-EGW3RCXD.mjs";
 import "./chunk-FYFJ75NX.mjs";
 import {
   Modal,
@@ -64,11 +68,28 @@ import {
   useNavbarExpendableMenuContext
 } from "./chunk-DRSAVDIE.mjs";
 import "./chunk-XMDDGSCF.mjs";
-import "./chunk-SRLM3K2X.mjs";
+import "./chunk-BVG5VSZK.mjs";
+import "./chunk-G65EYZFQ.mjs";
+import "./chunk-ZQHLYAJU.mjs";
 import {
-  ShowMoreButton
-} from "./chunk-JUHJZLH2.mjs";
+  HStack,
+  Stack,
+  VStack
+} from "./chunk-FUIKSOJF.mjs";
+import {
+  Container
+} from "./chunk-4QZR2H72.mjs";
+import {
+  Grid,
+  GridItem
+} from "./chunk-TC5PD4TA.mjs";
+import "./chunk-7ROE6ADK.mjs";
+import "./chunk-NE6W2PCD.mjs";
+import "./chunk-2YL2MVWN.mjs";
 import "./chunk-K2CB2NLY.mjs";
+import {
+  Figure
+} from "./chunk-OE6RISJS.mjs";
 import "./chunk-HQVL3ZJ2.mjs";
 import {
   Footer,
@@ -76,7 +97,7 @@ import {
   FooterLinkSection,
   FooterLinkSections,
   FooterLogo
-} from "./chunk-444SCBJD.mjs";
+} from "./chunk-4C76JM3T.mjs";
 import "./chunk-IJSEJZ3W.mjs";
 import "./chunk-BYEJZSG5.mjs";
 import {
@@ -86,6 +107,7 @@ import "./chunk-AGZHQDCQ.mjs";
 import {
   Textarea
 } from "./chunk-JEAGKB4V.mjs";
+import "./chunk-KPPLVGZ3.mjs";
 import "./chunk-7LPYJC6S.mjs";
 import {
   Input
@@ -98,34 +120,39 @@ import {
   RadioGroup,
   useRadioGroupContext
 } from "./chunk-E6OOFTRQ.mjs";
+import "./chunk-YJOOSTJC.mjs";
+import {
+  Checkbox
+} from "./chunk-BO3EWZGA.mjs";
+import "./chunk-LMF3QGSF.mjs";
+import {
+  Fieldset,
+  useFieldsetContext
+} from "./chunk-Z2ZPTZ6F.mjs";
 import "./chunk-TDLSHJ4Z.mjs";
 import {
   DatePicker
 } from "./chunk-GVO57ZWU.mjs";
 import "./chunk-Y5SUMFYJ.mjs";
 import "./chunk-XZ43OSZ5.mjs";
-import "./chunk-KPPLVGZ3.mjs";
+import "./chunk-NSLSA7F7.mjs";
+import {
+  ErrorMessage
+} from "./chunk-LHIG6RW7.mjs";
 import {
   ErrorSummary
-} from "./chunk-CFAPQFEC.mjs";
+} from "./chunk-ZSYBCM2L.mjs";
 import "./chunk-CKAL5ZJZ.mjs";
 import "./chunk-CYDWEPFL.mjs";
 import {
   AutoAnimateHeight
 } from "./chunk-KCEWKQ4W.mjs";
-import "./chunk-YJOOSTJC.mjs";
-import {
-  Checkbox
-} from "./chunk-BO3EWZGA.mjs";
-import "./chunk-LMF3QGSF.mjs";
-import {
-  Fieldset,
-  useFieldsetContext
-} from "./chunk-Z2ZPTZ6F.mjs";
-import "./chunk-NSLSA7F7.mjs";
+import "./chunk-RC76SXBP.mjs";
 import {
-  ErrorMessage
-} from "./chunk-LHIG6RW7.mjs";
+  Message,
+  MessageDescription,
+  MessageTitle
+} from "./chunk-BYFBK3J7.mjs";
 import {
   focusTrap,
   useHydrated,
@@ -137,41 +164,22 @@ import {
   Link
 } from "./chunk-OHDHIRAW.mjs";
 import "./chunk-6QV3OV66.mjs";
-import "./chunk-RC76SXBP.mjs";
-import {
-  Message,
-  MessageDescription,
-  MessageTitle
-} from "./chunk-BYFBK3J7.mjs";
 import {
   LinkList
-} from "./chunk-Z2ZCM4BE.mjs";
+} from "./chunk-OS24UCTD.mjs";
 import {
   OrderedList,
   UnorderedList
-} from "./chunk-LGEGXOPU.mjs";
+} from "./chunk-3QHKPEXO.mjs";
 import "./chunk-CFAH2LID.mjs";
 import {
   HelpText
 } from "./chunk-YZDURLEY.mjs";
-import "./chunk-BVG5VSZK.mjs";
-import {
-  Container
-} from "./chunk-4QZR2H72.mjs";
-import "./chunk-G65EYZFQ.mjs";
-import {
-  Grid,
-  GridItem
-} from "./chunk-YQMTDQSQ.mjs";
-import "./chunk-ZQHLYAJU.mjs";
-import {
-  HStack,
-  Stack,
-  VStack
-} from "./chunk-6SVLMQUW.mjs";
-import "./chunk-NE6W2PCD.mjs";
-import "./chunk-7ROE6ADK.mjs";
+import "./chunk-ISAHCU7C.mjs";
 import "./chunk-HT2EIJAD.mjs";
+import {
+  Button
+} from "./chunk-TYCGAA35.mjs";
 import "./chunk-Y6NOEN7R.mjs";
 import {
   ButtonList
@@ -189,30 +197,22 @@ import {
   CardMedia,
   CardMediaImg
 } from "./chunk-IC2K5VZJ.mjs";
-import "./chunk-2YL2MVWN.mjs";
 import {
   DescriptionList
 } from "./chunk-C7ZTOZP3.mjs";
-import {
-  Figure
-} from "./chunk-OE6RISJS.mjs";
+import "./chunk-OVKUPO5U.mjs";
 import "./chunk-K6PP3ACJ.mjs";
+import {
+  Badge
+} from "./chunk-OXZOGFNV.mjs";
 import "./chunk-KFDS3IPB.mjs";
 import {
   Blockquote
 } from "./chunk-JYN2QSN2.mjs";
 import "./chunk-BCFV6VOE.mjs";
-import {
-  Box,
-  BoxCloseButton
-} from "./chunk-3OGHJOJF.mjs";
-import "./chunk-ISAHCU7C.mjs";
 import {
   Breadcrumbs
 } from "./chunk-A42PXOVR.mjs";
-import {
-  Button
-} from "./chunk-TYCGAA35.mjs";
 import "./chunk-ZKMFJZSH.mjs";
 import {
   Accordion
@@ -228,14 +228,23 @@ import {
 } from "./chunk-EZVEYJOX.mjs";
 import "./chunk-YQFL5UN4.mjs";
 import {
-  Badge
-} from "./chunk-OXZOGFNV.mjs";
+  Alert,
+  AlertDescription,
+  AlertTitle
+} from "./chunk-4P4GPVKZ.mjs";
+import {
+  Box,
+  BoxCloseButton
+} from "./chunk-3OGHJOJF.mjs";
 import "./chunk-YOSPWY5K.mjs";
 export {
   Accordion,
   AccordionContent,
   AccordionHeader,
   AccordionItem,
+  Alert,
+  AlertDescription,
+  AlertTitle,
   AutoAnimateHeight,
   Badge,
   Blockquote,

package/dist/layout/grid/grid.mjs

@@ -1,9 +1,9 @@
 import {
   Grid,
   GridItem
-} from "../../chunk-YQMTDQSQ.mjs";
-import "../../chunk-NE6W2PCD.mjs";
+} from "../../chunk-TC5PD4TA.mjs";
 import "../../chunk-7ROE6ADK.mjs";
+import "../../chunk-NE6W2PCD.mjs";
 import "../../chunk-YOSPWY5K.mjs";
 export {
   Grid,

package/dist/layout/grid/index.mjs

@@ -2,9 +2,9 @@ import "../../chunk-G65EYZFQ.mjs";
 import {
   Grid,
   GridItem
-} from "../../chunk-YQMTDQSQ.mjs";
-import "../../chunk-NE6W2PCD.mjs";
+} from "../../chunk-TC5PD4TA.mjs";
 import "../../chunk-7ROE6ADK.mjs";
+import "../../chunk-NE6W2PCD.mjs";
 import "../../chunk-YOSPWY5K.mjs";
 export {
   Grid,

package/dist/layout/index.mjs

@@ -1,20 +1,20 @@
 import "../chunk-BVG5VSZK.mjs";
-import {
-  Container
-} from "../chunk-4QZR2H72.mjs";
 import "../chunk-G65EYZFQ.mjs";
-import {
-  Grid,
-  GridItem
-} from "../chunk-YQMTDQSQ.mjs";
 import "../chunk-ZQHLYAJU.mjs";
 import {
   HStack,
   Stack,
   VStack
-} from "../chunk-6SVLMQUW.mjs";
-import "../chunk-NE6W2PCD.mjs";
+} from "../chunk-FUIKSOJF.mjs";
+import {
+  Container
+} from "../chunk-4QZR2H72.mjs";
+import {
+  Grid,
+  GridItem
+} from "../chunk-TC5PD4TA.mjs";
 import "../chunk-7ROE6ADK.mjs";
+import "../chunk-NE6W2PCD.mjs";
 import "../chunk-YOSPWY5K.mjs";
 export {
   Container,

package/dist/layout/stack/index.mjs

@@ -3,9 +3,9 @@ import {
   HStack,
   Stack,
   VStack
-} from "../../chunk-6SVLMQUW.mjs";
-import "../../chunk-NE6W2PCD.mjs";
+} from "../../chunk-FUIKSOJF.mjs";
 import "../../chunk-7ROE6ADK.mjs";
+import "../../chunk-NE6W2PCD.mjs";
 import "../../chunk-YOSPWY5K.mjs";
 export {
   HStack,

package/dist/layout/stack/stack.mjs

@@ -2,9 +2,9 @@ import {
   HStack,
   Stack,
   VStack
-} from "../../chunk-6SVLMQUW.mjs";
-import "../../chunk-NE6W2PCD.mjs";
+} from "../../chunk-FUIKSOJF.mjs";
 import "../../chunk-7ROE6ADK.mjs";
+import "../../chunk-NE6W2PCD.mjs";
 import "../../chunk-YOSPWY5K.mjs";
 export {
   HStack,

package/dist/list/index.js

@@ -58,12 +58,16 @@ var import_typed_classname = require("@postenbring/hedwig-css/typed-classname");
 var import_jsx_runtime = require("react/jsx-runtime");
 var UnorderedList = (0, import_react.forwardRef)(
   (_a, ref) => {
-    var _b = _a, { size = "medium", className } = _b, rest = __objRest(_b, ["size", "className"]);
+    var _b = _a, { size = "default", className } = _b, rest = __objRest(_b, ["size", "className"]);
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "ul",
       __spreadValues({
         ref,
-        className: (0, import_typed_classname.clsx)("hds-list", `hds-list--${size}`, className)
+        className: (0, import_typed_classname.clsx)(
+          "hds-list",
+          size !== "default" && `hds-list--${size}`,
+          className
+        )
       }, rest)
     );
   }
@@ -76,7 +80,11 @@ var OrderedList = (0, import_react.forwardRef)(
       "ol",
       __spreadValues({
         ref,
-        className: (0, import_typed_classname.clsx)("hds-list", `hds-list--${size}`, className)
+        className: (0, import_typed_classname.clsx)(
+          "hds-list",
+          size !== "default" && `hds-list--${size}`,
+          className
+        )
       }, rest)
     );
   }

package/dist/list/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/list/index.tsx","../../src/list/list.tsx","../../src/list/link-list.tsx"],"sourcesContent":["export { UnorderedList, OrderedList } from \"./list\";\nexport type * from \"./list\";\n\nexport { LinkList } from \"./link-list\";\nexport type * from \"./link-list\";\n","import { forwardRef, type HTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\n\nexport interface ListProps extends HTMLAttributes<HTMLOListElement | HTMLUListElement> {\n  /**\n   * Sets the size of the items (font)\n   *\n   * @default \"medium\"\n   */\n  size?: \"small\" | \"medium\" | \"large\";\n}\n\n/**\n * An unordered list of simple items, often text. You can nest other lists inside this component.\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <UnorderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </UnorderedList>\n * ```\n */\nexport const UnorderedList = forwardRef<HTMLUListElement, ListProps>(\n  ({ size = \"medium\", className, ...rest }, ref) => {\n    return (\n      <ul\n        ref={ref}\n        className={clsx(\"hds-list\", `hds-list--${size}`, className as undefined)}\n        {...rest}\n      />\n    );\n  },\n);\nUnorderedList.displayName = \"UnorderedList\";\n\n/**\n * An ordered list of simple items\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <OrderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </OrderedList>\n * ```\n */\nexport const OrderedList = forwardRef<HTMLOListElement, ListProps>(\n  ({ size = \"medium\", className, ...rest }, ref) => {\n    return (\n      <ol\n        ref={ref}\n        className={clsx(\"hds-list\", `hds-list--${size}`, className as undefined)}\n        {...rest}\n      />\n    );\n  },\n);\nOrderedList.displayName = \"OrderedList\";\n","import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef } from \"react\";\nimport type { ListProps } from \"./list\";\nimport { UnorderedList } from \"./list\";\n\nexport interface LinkListProps extends Omit<ListProps, \"listStyle\"> {\n  children?: React.ReactElement<HTMLLIElement> | React.ReactElement<HTMLLIElement>[];\n}\n\n/**\n * Show a list of links\n *\n * For other list types use `UnorderedList` and `OrderedList`, or use your own list component using the semantic `ul` and `ol` tags.\n */\nexport const LinkList = forwardRef<HTMLUListElement, LinkListProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <UnorderedList\n        ref={ref}\n        className={clsx(\"hds-list--link-list\", className as undefined)}\n        {...rest}\n      />\n    );\n  },\n);\nLinkList.displayName = \"LinkList\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAgD;AAChD,6BAAqB;AA4Bf;AAHC,IAAM,oBAAgB;AAAA,EAC3B,CAAC,IAAyC,QAAQ;AAAjD,iBAAE,SAAO,UAAU,UA3BtB,IA2BG,IAAiC,iBAAjC,IAAiC,CAA/B,QAAiB;AAClB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,6BAAK,YAAY,aAAa,IAAI,IAAI,SAAsB;AAAA,SACnE;AAAA,IACN;AAAA,EAEJ;AACF;AACA,cAAc,cAAc;AAgBrB,IAAM,kBAAc;AAAA,EACzB,CAAC,IAAyC,QAAQ;AAAjD,iBAAE,SAAO,UAAU,UAtDtB,IAsDG,IAAiC,iBAAjC,IAAiC,CAA/B,QAAiB;AAClB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,6BAAK,YAAY,aAAa,IAAI,IAAI,SAAsB;AAAA,SACnE;AAAA,IACN;AAAA,EAEJ;AACF;AACA,YAAY,cAAc;;;AChE1B,IAAAA,0BAAqB;AACrB,IAAAC,gBAA2B;AAgBrB,IAAAC,sBAAA;AAHC,IAAM,eAAW;AAAA,EACtB,CAAC,IAAwB,QAAQ;AAAhC,iBAAE,YAfL,IAeG,IAAgB,iBAAhB,IAAgB,CAAd;AACD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,8BAAK,uBAAuB,SAAsB;AAAA,SACzD;AAAA,IACN;AAAA,EAEJ;AACF;AACA,SAAS,cAAc;","names":["import_typed_classname","import_react","import_jsx_runtime"]}
+{"version":3,"sources":["../../src/list/index.tsx","../../src/list/list.tsx","../../src/list/link-list.tsx"],"sourcesContent":["export { UnorderedList, OrderedList } from \"./list\";\nexport type * from \"./list\";\n\nexport { LinkList } from \"./link-list\";\nexport type * from \"./link-list\";\n","import { forwardRef, type HTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\n\nexport interface ListProps extends HTMLAttributes<HTMLOListElement | HTMLUListElement> {\n  /**\n   * Sets the size of the items (font)\n   *\n   * @default \"medium\"\n   */\n  size?: \"default\" | \"small\" | \"technical\" | \"medium\" | \"large\";\n}\n\n/**\n * An unordered list of simple items, often text. You can nest other lists inside this component.\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <UnorderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </UnorderedList>\n * ```\n */\nexport const UnorderedList = forwardRef<HTMLUListElement, ListProps>(\n  ({ size = \"default\", className, ...rest }, ref) => {\n    return (\n      <ul\n        ref={ref}\n        className={clsx(\n          \"hds-list\",\n          size !== \"default\" && `hds-list--${size}`,\n          className as undefined,\n        )}\n        {...rest}\n      />\n    );\n  },\n);\nUnorderedList.displayName = \"UnorderedList\";\n\n/**\n * An ordered list of simple items\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <OrderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </OrderedList>\n * ```\n */\nexport const OrderedList = forwardRef<HTMLOListElement, ListProps>(\n  ({ size = \"medium\", className, ...rest }, ref) => {\n    return (\n      <ol\n        ref={ref}\n        className={clsx(\n          \"hds-list\",\n          size !== \"default\" && `hds-list--${size}`,\n          className as undefined,\n        )}\n        {...rest}\n      />\n    );\n  },\n);\nOrderedList.displayName = \"OrderedList\";\n","import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef } from \"react\";\nimport type { ListProps } from \"./list\";\nimport { UnorderedList } from \"./list\";\n\nexport interface LinkListProps extends Omit<ListProps, \"listStyle\"> {\n  children?: React.ReactElement<HTMLLIElement> | React.ReactElement<HTMLLIElement>[];\n}\n\n/**\n * Show a list of links\n *\n * For other list types use `UnorderedList` and `OrderedList`, or use your own list component using the semantic `ul` and `ol` tags.\n */\nexport const LinkList = forwardRef<HTMLUListElement, LinkListProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <UnorderedList\n        ref={ref}\n        className={clsx(\"hds-list--link-list\", className as undefined)}\n        {...rest}\n      />\n    );\n  },\n);\nLinkList.displayName = \"LinkList\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAgD;AAChD,6BAAqB;AA4Bf;AAHC,IAAM,oBAAgB;AAAA,EAC3B,CAAC,IAA0C,QAAQ;AAAlD,iBAAE,SAAO,WAAW,UA3BvB,IA2BG,IAAkC,iBAAlC,IAAkC,CAAhC,QAAkB;AACnB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW;AAAA,UACT;AAAA,UACA,SAAS,aAAa,aAAa,IAAI;AAAA,UACvC;AAAA,QACF;AAAA,SACI;AAAA,IACN;AAAA,EAEJ;AACF;AACA,cAAc,cAAc;AAgBrB,IAAM,kBAAc;AAAA,EACzB,CAAC,IAAyC,QAAQ;AAAjD,iBAAE,SAAO,UAAU,UA1DtB,IA0DG,IAAiC,iBAAjC,IAAiC,CAA/B,QAAiB;AAClB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW;AAAA,UACT;AAAA,UACA,SAAS,aAAa,aAAa,IAAI;AAAA,UACvC;AAAA,QACF;AAAA,SACI;AAAA,IACN;AAAA,EAEJ;AACF;AACA,YAAY,cAAc;;;ACxE1B,IAAAA,0BAAqB;AACrB,IAAAC,gBAA2B;AAgBrB,IAAAC,sBAAA;AAHC,IAAM,eAAW;AAAA,EACtB,CAAC,IAAwB,QAAQ;AAAhC,iBAAE,YAfL,IAeG,IAAgB,iBAAhB,IAAgB,CAAd;AACD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,8BAAK,uBAAuB,SAAsB;AAAA,SACzD;AAAA,IACN;AAAA,EAEJ;AACF;AACA,SAAS,cAAc;","names":["import_typed_classname","import_react","import_jsx_runtime"]}

package/dist/list/index.mjs

@@ -1,11 +1,11 @@
 import "../chunk-6QV3OV66.mjs";
 import {
   LinkList
-} from "../chunk-Z2ZCM4BE.mjs";
+} from "../chunk-OS24UCTD.mjs";
 import {
   OrderedList,
   UnorderedList
-} from "../chunk-LGEGXOPU.mjs";
+} from "../chunk-3QHKPEXO.mjs";
 import "../chunk-YOSPWY5K.mjs";
 export {
   LinkList,

package/dist/list/link-list.js

@@ -58,12 +58,16 @@ var import_typed_classname = require("@postenbring/hedwig-css/typed-classname");
 var import_jsx_runtime = require("react/jsx-runtime");
 var UnorderedList = (0, import_react.forwardRef)(
   (_a, ref) => {
-    var _b = _a, { size = "medium", className } = _b, rest = __objRest(_b, ["size", "className"]);
+    var _b = _a, { size = "default", className } = _b, rest = __objRest(_b, ["size", "className"]);
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "ul",
       __spreadValues({
         ref,
-        className: (0, import_typed_classname.clsx)("hds-list", `hds-list--${size}`, className)
+        className: (0, import_typed_classname.clsx)(
+          "hds-list",
+          size !== "default" && `hds-list--${size}`,
+          className
+        )
       }, rest)
     );
   }
@@ -76,7 +80,11 @@ var OrderedList = (0, import_react.forwardRef)(
       "ol",
       __spreadValues({
         ref,
-        className: (0, import_typed_classname.clsx)("hds-list", `hds-list--${size}`, className)
+        className: (0, import_typed_classname.clsx)(
+          "hds-list",
+          size !== "default" && `hds-list--${size}`,
+          className
+        )
       }, rest)
     );
   }

package/dist/list/link-list.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/list/link-list.tsx","../../src/list/list.tsx"],"sourcesContent":["import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef } from \"react\";\nimport type { ListProps } from \"./list\";\nimport { UnorderedList } from \"./list\";\n\nexport interface LinkListProps extends Omit<ListProps, \"listStyle\"> {\n  children?: React.ReactElement<HTMLLIElement> | React.ReactElement<HTMLLIElement>[];\n}\n\n/**\n * Show a list of links\n *\n * For other list types use `UnorderedList` and `OrderedList`, or use your own list component using the semantic `ul` and `ol` tags.\n */\nexport const LinkList = forwardRef<HTMLUListElement, LinkListProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <UnorderedList\n        ref={ref}\n        className={clsx(\"hds-list--link-list\", className as undefined)}\n        {...rest}\n      />\n    );\n  },\n);\nLinkList.displayName = \"LinkList\";\n","import { forwardRef, type HTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\n\nexport interface ListProps extends HTMLAttributes<HTMLOListElement | HTMLUListElement> {\n  /**\n   * Sets the size of the items (font)\n   *\n   * @default \"medium\"\n   */\n  size?: \"small\" | \"medium\" | \"large\";\n}\n\n/**\n * An unordered list of simple items, often text. You can nest other lists inside this component.\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <UnorderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </UnorderedList>\n * ```\n */\nexport const UnorderedList = forwardRef<HTMLUListElement, ListProps>(\n  ({ size = \"medium\", className, ...rest }, ref) => {\n    return (\n      <ul\n        ref={ref}\n        className={clsx(\"hds-list\", `hds-list--${size}`, className as undefined)}\n        {...rest}\n      />\n    );\n  },\n);\nUnorderedList.displayName = \"UnorderedList\";\n\n/**\n * An ordered list of simple items\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <OrderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </OrderedList>\n * ```\n */\nexport const OrderedList = forwardRef<HTMLOListElement, ListProps>(\n  ({ size = \"medium\", className, ...rest }, ref) => {\n    return (\n      <ol\n        ref={ref}\n        className={clsx(\"hds-list\", `hds-list--${size}`, className as undefined)}\n        {...rest}\n      />\n    );\n  },\n);\nOrderedList.displayName = \"OrderedList\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAAA,0BAAqB;AACrB,IAAAC,gBAA2B;;;ACD3B,mBAAgD;AAChD,6BAAqB;AA4Bf;AAHC,IAAM,oBAAgB;AAAA,EAC3B,CAAC,IAAyC,QAAQ;AAAjD,iBAAE,SAAO,UAAU,UA3BtB,IA2BG,IAAiC,iBAAjC,IAAiC,CAA/B,QAAiB;AAClB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,6BAAK,YAAY,aAAa,IAAI,IAAI,SAAsB;AAAA,SACnE;AAAA,IACN;AAAA,EAEJ;AACF;AACA,cAAc,cAAc;AAgBrB,IAAM,kBAAc;AAAA,EACzB,CAAC,IAAyC,QAAQ;AAAjD,iBAAE,SAAO,UAAU,UAtDtB,IAsDG,IAAiC,iBAAjC,IAAiC,CAA/B,QAAiB;AAClB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,6BAAK,YAAY,aAAa,IAAI,IAAI,SAAsB;AAAA,SACnE;AAAA,IACN;AAAA,EAEJ;AACF;AACA,YAAY,cAAc;;;AD/CpB,IAAAC,sBAAA;AAHC,IAAM,eAAW;AAAA,EACtB,CAAC,IAAwB,QAAQ;AAAhC,iBAAE,YAfL,IAeG,IAAgB,iBAAhB,IAAgB,CAAd;AACD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,8BAAK,uBAAuB,SAAsB;AAAA,SACzD;AAAA,IACN;AAAA,EAEJ;AACF;AACA,SAAS,cAAc;","names":["import_typed_classname","import_react","import_jsx_runtime"]}
+{"version":3,"sources":["../../src/list/link-list.tsx","../../src/list/list.tsx"],"sourcesContent":["import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef } from \"react\";\nimport type { ListProps } from \"./list\";\nimport { UnorderedList } from \"./list\";\n\nexport interface LinkListProps extends Omit<ListProps, \"listStyle\"> {\n  children?: React.ReactElement<HTMLLIElement> | React.ReactElement<HTMLLIElement>[];\n}\n\n/**\n * Show a list of links\n *\n * For other list types use `UnorderedList` and `OrderedList`, or use your own list component using the semantic `ul` and `ol` tags.\n */\nexport const LinkList = forwardRef<HTMLUListElement, LinkListProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <UnorderedList\n        ref={ref}\n        className={clsx(\"hds-list--link-list\", className as undefined)}\n        {...rest}\n      />\n    );\n  },\n);\nLinkList.displayName = \"LinkList\";\n","import { forwardRef, type HTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\n\nexport interface ListProps extends HTMLAttributes<HTMLOListElement | HTMLUListElement> {\n  /**\n   * Sets the size of the items (font)\n   *\n   * @default \"medium\"\n   */\n  size?: \"default\" | \"small\" | \"technical\" | \"medium\" | \"large\";\n}\n\n/**\n * An unordered list of simple items, often text. You can nest other lists inside this component.\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <UnorderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </UnorderedList>\n * ```\n */\nexport const UnorderedList = forwardRef<HTMLUListElement, ListProps>(\n  ({ size = \"default\", className, ...rest }, ref) => {\n    return (\n      <ul\n        ref={ref}\n        className={clsx(\n          \"hds-list\",\n          size !== \"default\" && `hds-list--${size}`,\n          className as undefined,\n        )}\n        {...rest}\n      />\n    );\n  },\n);\nUnorderedList.displayName = \"UnorderedList\";\n\n/**\n * An ordered list of simple items\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <OrderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </OrderedList>\n * ```\n */\nexport const OrderedList = forwardRef<HTMLOListElement, ListProps>(\n  ({ size = \"medium\", className, ...rest }, ref) => {\n    return (\n      <ol\n        ref={ref}\n        className={clsx(\n          \"hds-list\",\n          size !== \"default\" && `hds-list--${size}`,\n          className as undefined,\n        )}\n        {...rest}\n      />\n    );\n  },\n);\nOrderedList.displayName = \"OrderedList\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAAA,0BAAqB;AACrB,IAAAC,gBAA2B;;;ACD3B,mBAAgD;AAChD,6BAAqB;AA4Bf;AAHC,IAAM,oBAAgB;AAAA,EAC3B,CAAC,IAA0C,QAAQ;AAAlD,iBAAE,SAAO,WAAW,UA3BvB,IA2BG,IAAkC,iBAAlC,IAAkC,CAAhC,QAAkB;AACnB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW;AAAA,UACT;AAAA,UACA,SAAS,aAAa,aAAa,IAAI;AAAA,UACvC;AAAA,QACF;AAAA,SACI;AAAA,IACN;AAAA,EAEJ;AACF;AACA,cAAc,cAAc;AAgBrB,IAAM,kBAAc;AAAA,EACzB,CAAC,IAAyC,QAAQ;AAAjD,iBAAE,SAAO,UAAU,UA1DtB,IA0DG,IAAiC,iBAAjC,IAAiC,CAA/B,QAAiB;AAClB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW;AAAA,UACT;AAAA,UACA,SAAS,aAAa,aAAa,IAAI;AAAA,UACvC;AAAA,QACF;AAAA,SACI;AAAA,IACN;AAAA,EAEJ;AACF;AACA,YAAY,cAAc;;;ADvDpB,IAAAC,sBAAA;AAHC,IAAM,eAAW;AAAA,EACtB,CAAC,IAAwB,QAAQ;AAAhC,iBAAE,YAfL,IAeG,IAAgB,iBAAhB,IAAgB,CAAd;AACD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,8BAAK,uBAAuB,SAAsB;AAAA,SACzD;AAAA,IACN;AAAA,EAEJ;AACF;AACA,SAAS,cAAc;","names":["import_typed_classname","import_react","import_jsx_runtime"]}

package/dist/list/link-list.mjs

@@ -1,7 +1,7 @@
 import {
   LinkList
-} from "../chunk-Z2ZCM4BE.mjs";
-import "../chunk-LGEGXOPU.mjs";
+} from "../chunk-OS24UCTD.mjs";
+import "../chunk-3QHKPEXO.mjs";
 import "../chunk-YOSPWY5K.mjs";
 export {
   LinkList

package/dist/list/list.d.ts

@@ -5,7 +5,7 @@ export interface ListProps extends HTMLAttributes<HTMLOListElement | HTMLUListEl
      *
      * @default "medium"
      */
-    size?: "small" | "medium" | "large";
+    size?: "default" | "small" | "technical" | "medium" | "large";
 }
 /**
  * An unordered list of simple items, often text. You can nest other lists inside this component.

package/dist/list/list.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../src/list/list.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAGxD,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,gBAAgB,GAAG,gBAAgB,CAAC;IACpF;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrC;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,aAAa,wGAUzB,CAAC;AAGF;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,WAAW,wGAUvB,CAAC"}
+{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../src/list/list.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAGxD,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,gBAAgB,GAAG,gBAAgB,CAAC;IACpF;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,QAAQ,GAAG,OAAO,CAAC;CAC/D;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,aAAa,wGAczB,CAAC;AAGF;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,WAAW,wGAcvB,CAAC"}

package/dist/list/list.js

@@ -55,12 +55,16 @@ var import_typed_classname = require("@postenbring/hedwig-css/typed-classname");
 var import_jsx_runtime = require("react/jsx-runtime");
 var UnorderedList = (0, import_react.forwardRef)(
   (_a, ref) => {
-    var _b = _a, { size = "medium", className } = _b, rest = __objRest(_b, ["size", "className"]);
+    var _b = _a, { size = "default", className } = _b, rest = __objRest(_b, ["size", "className"]);
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "ul",
       __spreadValues({
         ref,
-        className: (0, import_typed_classname.clsx)("hds-list", `hds-list--${size}`, className)
+        className: (0, import_typed_classname.clsx)(
+          "hds-list",
+          size !== "default" && `hds-list--${size}`,
+          className
+        )
       }, rest)
     );
   }
@@ -73,7 +77,11 @@ var OrderedList = (0, import_react.forwardRef)(
       "ol",
       __spreadValues({
         ref,
-        className: (0, import_typed_classname.clsx)("hds-list", `hds-list--${size}`, className)
+        className: (0, import_typed_classname.clsx)(
+          "hds-list",
+          size !== "default" && `hds-list--${size}`,
+          className
+        )
       }, rest)
     );
   }

package/dist/list/list.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/list/list.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\n\nexport interface ListProps extends HTMLAttributes<HTMLOListElement | HTMLUListElement> {\n  /**\n   * Sets the size of the items (font)\n   *\n   * @default \"medium\"\n   */\n  size?: \"small\" | \"medium\" | \"large\";\n}\n\n/**\n * An unordered list of simple items, often text. You can nest other lists inside this component.\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <UnorderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </UnorderedList>\n * ```\n */\nexport const UnorderedList = forwardRef<HTMLUListElement, ListProps>(\n  ({ size = \"medium\", className, ...rest }, ref) => {\n    return (\n      <ul\n        ref={ref}\n        className={clsx(\"hds-list\", `hds-list--${size}`, className as undefined)}\n        {...rest}\n      />\n    );\n  },\n);\nUnorderedList.displayName = \"UnorderedList\";\n\n/**\n * An ordered list of simple items\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <OrderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </OrderedList>\n * ```\n */\nexport const OrderedList = forwardRef<HTMLOListElement, ListProps>(\n  ({ size = \"medium\", className, ...rest }, ref) => {\n    return (\n      <ol\n        ref={ref}\n        className={clsx(\"hds-list\", `hds-list--${size}`, className as undefined)}\n        {...rest}\n      />\n    );\n  },\n);\nOrderedList.displayName = \"OrderedList\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgD;AAChD,6BAAqB;AA4Bf;AAHC,IAAM,oBAAgB;AAAA,EAC3B,CAAC,IAAyC,QAAQ;AAAjD,iBAAE,SAAO,UAAU,UA3BtB,IA2BG,IAAiC,iBAAjC,IAAiC,CAA/B,QAAiB;AAClB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,6BAAK,YAAY,aAAa,IAAI,IAAI,SAAsB;AAAA,SACnE;AAAA,IACN;AAAA,EAEJ;AACF;AACA,cAAc,cAAc;AAgBrB,IAAM,kBAAc;AAAA,EACzB,CAAC,IAAyC,QAAQ;AAAjD,iBAAE,SAAO,UAAU,UAtDtB,IAsDG,IAAiC,iBAAjC,IAAiC,CAA/B,QAAiB;AAClB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,6BAAK,YAAY,aAAa,IAAI,IAAI,SAAsB;AAAA,SACnE;AAAA,IACN;AAAA,EAEJ;AACF;AACA,YAAY,cAAc;","names":[]}
+{"version":3,"sources":["../../src/list/list.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\n\nexport interface ListProps extends HTMLAttributes<HTMLOListElement | HTMLUListElement> {\n  /**\n   * Sets the size of the items (font)\n   *\n   * @default \"medium\"\n   */\n  size?: \"default\" | \"small\" | \"technical\" | \"medium\" | \"large\";\n}\n\n/**\n * An unordered list of simple items, often text. You can nest other lists inside this component.\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <UnorderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </UnorderedList>\n * ```\n */\nexport const UnorderedList = forwardRef<HTMLUListElement, ListProps>(\n  ({ size = \"default\", className, ...rest }, ref) => {\n    return (\n      <ul\n        ref={ref}\n        className={clsx(\n          \"hds-list\",\n          size !== \"default\" && `hds-list--${size}`,\n          className as undefined,\n        )}\n        {...rest}\n      />\n    );\n  },\n);\nUnorderedList.displayName = \"UnorderedList\";\n\n/**\n * An ordered list of simple items\n *\n * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.\n *\n * @example\n * ```tsx\n * <OrderedList>\n *  <li>Item 1</li>\n *  <li>Item 2</li>\n *  <li>Item 3</li>\n * </OrderedList>\n * ```\n */\nexport const OrderedList = forwardRef<HTMLOListElement, ListProps>(\n  ({ size = \"medium\", className, ...rest }, ref) => {\n    return (\n      <ol\n        ref={ref}\n        className={clsx(\n          \"hds-list\",\n          size !== \"default\" && `hds-list--${size}`,\n          className as undefined,\n        )}\n        {...rest}\n      />\n    );\n  },\n);\nOrderedList.displayName = \"OrderedList\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgD;AAChD,6BAAqB;AA4Bf;AAHC,IAAM,oBAAgB;AAAA,EAC3B,CAAC,IAA0C,QAAQ;AAAlD,iBAAE,SAAO,WAAW,UA3BvB,IA2BG,IAAkC,iBAAlC,IAAkC,CAAhC,QAAkB;AACnB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW;AAAA,UACT;AAAA,UACA,SAAS,aAAa,aAAa,IAAI;AAAA,UACvC;AAAA,QACF;AAAA,SACI;AAAA,IACN;AAAA,EAEJ;AACF;AACA,cAAc,cAAc;AAgBrB,IAAM,kBAAc;AAAA,EACzB,CAAC,IAAyC,QAAQ;AAAjD,iBAAE,SAAO,UAAU,UA1DtB,IA0DG,IAAiC,iBAAjC,IAAiC,CAA/B,QAAiB;AAClB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW;AAAA,UACT;AAAA,UACA,SAAS,aAAa,aAAa,IAAI;AAAA,UACvC;AAAA,QACF;AAAA,SACI;AAAA,IACN;AAAA,EAEJ;AACF;AACA,YAAY,cAAc;","names":[]}

package/dist/list/list.mjs

@@ -1,7 +1,7 @@
 import {
   OrderedList,
   UnorderedList
-} from "../chunk-LGEGXOPU.mjs";
+} from "../chunk-3QHKPEXO.mjs";
 import "../chunk-YOSPWY5K.mjs";
 export {
   OrderedList,

package/dist/text/text.d.ts

@@ -53,6 +53,6 @@ export type TextProps = {
  * </Text>
  * ```
  */
-export declare const Text: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<HTMLHeadingElement | HTMLParagraphElement>>;
+export declare const Text: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<HTMLParagraphElement | HTMLHeadingElement>>;
 export {};
 //# sourceMappingURL=text.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@postenbring/hedwig-react",
-  "version": "2.1.3",
+  "version": "2.2.0",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
@@ -17,7 +17,7 @@
     "@types/react-dom": "^18.3.1",
     "react": "^18.3.1",
     "react-dom": "18.3.1",
-    "tsup": "^8.4.0",
+    "tsup": "^8.5.0",
     "typescript": "^5.8.3",
     "eslint-config-custom": "0.0.1",
     "hedwig-tsconfig": "0.0.0"
@@ -29,9 +29,9 @@
     "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
   },
   "dependencies": {
-    "@radix-ui/react-popover": "1.1.13",
-    "@radix-ui/react-slot": "1.2.2",
-    "@postenbring/hedwig-css": "2.1.3"
+    "@radix-ui/react-popover": "1.1.14",
+    "@radix-ui/react-slot": "1.2.3",
+    "@postenbring/hedwig-css": "2.2.0"
   },
   "publishConfig": {
     "access": "public"

package/src/alert/alert.stories.tsx

@@ -0,0 +1,36 @@
+/* eslint-disable import/no-extraneous-dependencies -- storybook story */
+import type { Meta, StoryObj } from "@storybook/react";
+import { Alert } from ".";
+
+const meta: Meta<typeof Alert> = {
+  title: "Alert",
+  component: Alert,
+
+  argTypes: {
+    variant: {
+      options: ["info", "success", "warning", "error", "neutral"],
+      control: {
+        type: "radio",
+      },
+    },
+  },
+};
+
+export default meta;
+
+type Story = StoryObj<typeof Alert>;
+export const Preview: Story = {
+  tags: ["!dev"],
+  args: {
+    variant: "success",
+    children: (
+      <>
+        <Alert.Title>Alert header</Alert.Title>
+        <Alert.Description>
+          Alert header Alert description. A more detailed explanation of whats happening, but not
+          too long.
+        </Alert.Description>
+      </>
+    ),
+  },
+};