@postenbring/hedwig-react 0.0.64 → 0.0.65

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (156) hide show
  1. package/dist/_tsup-dts-rollup.d.mts +171 -19
  2. package/dist/_tsup-dts-rollup.d.ts +171 -19
  3. package/dist/accordion/accordion-content.js +5 -9
  4. package/dist/accordion/accordion-content.js.map +1 -1
  5. package/dist/accordion/accordion-content.mjs +1 -1
  6. package/dist/accordion/accordion-header.js +6 -9
  7. package/dist/accordion/accordion-header.js.map +1 -1
  8. package/dist/accordion/accordion-header.mjs +1 -1
  9. package/dist/accordion/accordion-item.js +2 -7
  10. package/dist/accordion/accordion-item.js.map +1 -1
  11. package/dist/accordion/accordion-item.mjs +1 -1
  12. package/dist/accordion/index.js +13 -25
  13. package/dist/accordion/index.js.map +1 -1
  14. package/dist/accordion/index.mjs +4 -4
  15. package/dist/{chunk-SAGJ5W7M.mjs → chunk-62F4I3MQ.mjs} +3 -8
  16. package/dist/{chunk-SAGJ5W7M.mjs.map → chunk-62F4I3MQ.mjs.map} +1 -1
  17. package/dist/{chunk-BYDSISQZ.mjs → chunk-A47QULAK.mjs} +2 -2
  18. package/dist/{chunk-BYDSISQZ.mjs.map → chunk-A47QULAK.mjs.map} +1 -1
  19. package/dist/{chunk-2E6XPNPX.mjs → chunk-DEVTAZKG.mjs} +8 -6
  20. package/dist/chunk-DEVTAZKG.mjs.map +1 -0
  21. package/dist/chunk-EHUVLDIZ.mjs +121 -0
  22. package/dist/chunk-EHUVLDIZ.mjs.map +1 -0
  23. package/dist/{chunk-KRGKVH5J.mjs → chunk-GUB3UCXO.mjs} +6 -10
  24. package/dist/chunk-GUB3UCXO.mjs.map +1 -0
  25. package/dist/{chunk-37WVYY6X.mjs → chunk-HXV2UMEV.mjs} +6 -3
  26. package/dist/chunk-HXV2UMEV.mjs.map +1 -0
  27. package/dist/chunk-KQITCS3U.mjs +18 -0
  28. package/dist/chunk-KQITCS3U.mjs.map +1 -0
  29. package/dist/{chunk-DJRMXOCP.mjs → chunk-LIQ3FB56.mjs} +8 -8
  30. package/dist/chunk-MUVJAMFN.mjs +104 -0
  31. package/dist/chunk-MUVJAMFN.mjs.map +1 -0
  32. package/dist/{chunk-WGVZWX5L.mjs → chunk-RLUXDZ6X.mjs} +14 -4
  33. package/dist/chunk-RLUXDZ6X.mjs.map +1 -0
  34. package/dist/{chunk-H3VGHTDC.mjs → chunk-TE5M6GJB.mjs} +2 -2
  35. package/dist/chunk-TE5M6GJB.mjs.map +1 -0
  36. package/dist/chunk-U2MRMUB2.mjs +19 -0
  37. package/dist/chunk-U2MRMUB2.mjs.map +1 -0
  38. package/dist/{chunk-EJADADIY.mjs → chunk-UWTGHSWT.mjs} +6 -9
  39. package/dist/chunk-UWTGHSWT.mjs.map +1 -0
  40. package/dist/{chunk-5MDJP43L.mjs → chunk-VFFIUNR6.mjs} +7 -7
  41. package/dist/chunk-X7EKQZNU.mjs +76 -0
  42. package/dist/chunk-X7EKQZNU.mjs.map +1 -0
  43. package/dist/{chunk-V4NGUB4I.mjs → chunk-XFSZBILE.mjs} +2 -2
  44. package/dist/chunk-XFSZBILE.mjs.map +1 -0
  45. package/dist/{chunk-MBBFU4IR.mjs → chunk-XVFQWVHO.mjs} +3 -9
  46. package/dist/{chunk-MBBFU4IR.mjs.map → chunk-XVFQWVHO.mjs.map} +1 -1
  47. package/dist/chunk-YWNVB7TY.mjs +1 -0
  48. package/dist/{chunk-FT5CX2W5.mjs → chunk-YXHXRUFX.mjs} +7 -10
  49. package/dist/chunk-YXHXRUFX.mjs.map +1 -0
  50. package/dist/footer/footer.d.mts +7 -0
  51. package/dist/footer/footer.d.ts +7 -0
  52. package/dist/footer/footer.js +404 -0
  53. package/dist/footer/footer.js.map +1 -0
  54. package/dist/footer/footer.mjs +26 -0
  55. package/dist/footer/footer.mjs.map +1 -0
  56. package/dist/footer/index.d.mts +7 -0
  57. package/dist/footer/index.d.ts +7 -0
  58. package/dist/footer/index.js +405 -0
  59. package/dist/footer/index.js.map +1 -0
  60. package/dist/footer/index.mjs +19 -0
  61. package/dist/footer/index.mjs.map +1 -0
  62. package/dist/form/checkbox/checkbox.js +122 -24
  63. package/dist/form/checkbox/checkbox.js.map +1 -1
  64. package/dist/form/checkbox/checkbox.mjs +5 -1
  65. package/dist/form/checkbox/index.js +122 -24
  66. package/dist/form/checkbox/index.js.map +1 -1
  67. package/dist/form/checkbox/index.mjs +5 -1
  68. package/dist/form/fieldset/fieldset.d.mts +1 -0
  69. package/dist/form/fieldset/fieldset.d.ts +1 -0
  70. package/dist/form/fieldset/fieldset.js +7 -3
  71. package/dist/form/fieldset/fieldset.js.map +1 -1
  72. package/dist/form/fieldset/fieldset.mjs +5 -3
  73. package/dist/form/fieldset/index.d.mts +1 -0
  74. package/dist/form/fieldset/index.d.ts +1 -0
  75. package/dist/form/fieldset/index.js +7 -3
  76. package/dist/form/fieldset/index.js.map +1 -1
  77. package/dist/form/fieldset/index.mjs +5 -3
  78. package/dist/form/index.d.mts +2 -1
  79. package/dist/form/index.d.ts +2 -1
  80. package/dist/form/index.js +68 -27
  81. package/dist/form/index.js.map +1 -1
  82. package/dist/form/index.mjs +17 -13
  83. package/dist/form/radiobutton/index.d.mts +1 -1
  84. package/dist/form/radiobutton/index.d.ts +1 -1
  85. package/dist/form/radiobutton/index.js +17 -8
  86. package/dist/form/radiobutton/index.js.map +1 -1
  87. package/dist/form/radiobutton/index.mjs +7 -5
  88. package/dist/form/radiobutton/radiobutton.js +13 -6
  89. package/dist/form/radiobutton/radiobutton.js.map +1 -1
  90. package/dist/form/radiobutton/radiobutton.mjs +3 -3
  91. package/dist/form/radiobutton/radiogroup.js +2 -1
  92. package/dist/form/radiobutton/radiogroup.js.map +1 -1
  93. package/dist/form/radiobutton/radiogroup.mjs +2 -2
  94. package/dist/index-no-css.d.mts +10 -1
  95. package/dist/index-no-css.d.ts +10 -1
  96. package/dist/index-no-css.js +468 -307
  97. package/dist/index-no-css.js.map +1 -1
  98. package/dist/index-no-css.mjs +58 -46
  99. package/dist/index.d.mts +10 -1
  100. package/dist/index.d.ts +10 -1
  101. package/dist/index.js +468 -307
  102. package/dist/index.js.map +1 -1
  103. package/dist/index.mjs +58 -46
  104. package/dist/index.mjs.map +1 -1
  105. package/dist/navbar/index.d.mts +1 -0
  106. package/dist/navbar/index.d.ts +1 -0
  107. package/dist/navbar/index.js +10 -7
  108. package/dist/navbar/index.js.map +1 -1
  109. package/dist/navbar/index.mjs +7 -4
  110. package/dist/navbar/navbar-expandable-menu.d.mts +1 -0
  111. package/dist/navbar/navbar-expandable-menu.d.ts +1 -0
  112. package/dist/navbar/navbar-expandable-menu.js +10 -7
  113. package/dist/navbar/navbar-expandable-menu.js.map +1 -1
  114. package/dist/navbar/navbar-expandable-menu.mjs +5 -3
  115. package/dist/skeleton/index.js +1 -1
  116. package/dist/skeleton/index.js.map +1 -1
  117. package/dist/skeleton/index.mjs +1 -1
  118. package/dist/skeleton/skeleton.js +1 -1
  119. package/dist/skeleton/skeleton.js.map +1 -1
  120. package/dist/skeleton/skeleton.mjs +1 -1
  121. package/dist/tabs/context.d.mts +1 -0
  122. package/dist/tabs/context.d.ts +1 -0
  123. package/dist/tabs/context.js +13 -8
  124. package/dist/tabs/context.js.map +1 -1
  125. package/dist/tabs/context.mjs +5 -3
  126. package/dist/tabs/index.js +46 -28
  127. package/dist/tabs/index.js.map +1 -1
  128. package/dist/tabs/index.mjs +5 -5
  129. package/dist/tabs/tabs-content.js +11 -11
  130. package/dist/tabs/tabs-content.js.map +1 -1
  131. package/dist/tabs/tabs-content.mjs +2 -2
  132. package/dist/tabs/tabs-list.js +43 -16
  133. package/dist/tabs/tabs-list.js.map +1 -1
  134. package/dist/tabs/tabs-list.mjs +2 -2
  135. package/dist/tabs/tabs.js +2 -14
  136. package/dist/tabs/tabs.js.map +1 -1
  137. package/dist/tabs/tabs.mjs +2 -2
  138. package/package.json +3 -3
  139. package/dist/chunk-2E6XPNPX.mjs.map +0 -1
  140. package/dist/chunk-33JD5XDW.mjs +0 -14
  141. package/dist/chunk-33JD5XDW.mjs.map +0 -1
  142. package/dist/chunk-37WVYY6X.mjs.map +0 -1
  143. package/dist/chunk-EJADADIY.mjs.map +0 -1
  144. package/dist/chunk-FT5CX2W5.mjs.map +0 -1
  145. package/dist/chunk-H3VGHTDC.mjs.map +0 -1
  146. package/dist/chunk-H4GIHEB2.mjs +0 -1
  147. package/dist/chunk-KRGKVH5J.mjs.map +0 -1
  148. package/dist/chunk-PXHYOQPB.mjs +0 -42
  149. package/dist/chunk-PXHYOQPB.mjs.map +0 -1
  150. package/dist/chunk-V4NGUB4I.mjs.map +0 -1
  151. package/dist/chunk-WGVZWX5L.mjs.map +0 -1
  152. package/dist/chunk-XVZ44NGD.mjs +0 -80
  153. package/dist/chunk-XVZ44NGD.mjs.map +0 -1
  154. /package/dist/{chunk-DJRMXOCP.mjs.map → chunk-LIQ3FB56.mjs.map} +0 -0
  155. /package/dist/{chunk-5MDJP43L.mjs.map → chunk-VFFIUNR6.mjs.map} +0 -0
  156. /package/dist/{chunk-H4GIHEB2.mjs.map → chunk-YWNVB7TY.mjs.map} +0 -0
@@ -40,13 +40,8 @@ var AccordionItem = forwardRef(
40
40
  return /* @__PURE__ */ jsx(
41
41
  Component,
42
42
  __spreadProps(__spreadValues({}, rest), {
43
- className: clsx(
44
- "hds-accordion-item",
45
- {
46
- "hds-accordion-item__expanded": open
47
- },
48
- className
49
- ),
43
+ "data-state": open ? "open" : "closed",
44
+ className: clsx("hds-accordion-item", className),
50
45
  ref,
51
46
  children: /* @__PURE__ */ jsx(AccordionItemContext.Provider, { value: { open, setOpen: handleOpen }, children })
52
47
  })
@@ -58,4 +53,4 @@ AccordionItem.displayName = "Accordion.Item";
58
53
  export {
59
54
  AccordionItem
60
55
  };
61
- //# sourceMappingURL=chunk-SAGJ5W7M.mjs.map
56
+ //# sourceMappingURL=chunk-62F4I3MQ.mjs.map
@@ -1 +1 @@
1
- {"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 className={clsx(\n \"hds-accordion-item\",\n {\n \"hds-accordion-item__expanded\": open,\n },\n className as undefined,\n )}\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;AAoEb;AApCD,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,WAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE,gCAAgC;AAAA,UAClC;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,QAEA,8BAAC,qBAAqB,UAArB,EAA8B,OAAO,EAAE,MAAM,SAAS,WAAW,GAC/D,UACH;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,cAAc,cAAc;","names":[]}
1
+ {"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":[]}
@@ -14,7 +14,7 @@ var Skeleton = forwardRef(
14
14
  var _b = _a, {
15
15
  as: Component = "div",
16
16
  children,
17
- animation,
17
+ animation = true,
18
18
  variant = "text",
19
19
  width,
20
20
  height,
@@ -53,4 +53,4 @@ Skeleton.displayName = "Skeleton";
53
53
  export {
54
54
  Skeleton
55
55
  };
56
- //# sourceMappingURL=chunk-BYDSISQZ.mjs.map
56
+ //# sourceMappingURL=chunk-A47QULAK.mjs.map
@@ -1 +1 @@
1
- {"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,\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;AAAA,MACA,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":[]}
1
+ {"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":[]}
@@ -14,11 +14,12 @@ import { createRoot } from "react-dom/client";
14
14
  import { clsx } from "@postenbring/hedwig-css/typed-classname";
15
15
  import FocusTrap from "focus-trap-react";
16
16
  import { jsx, jsxs } from "react/jsx-runtime";
17
- var navbarContext = createContext([
17
+ var expandableMenuContext = createContext([
18
18
  false,
19
19
  () => {
20
20
  }
21
21
  ]);
22
+ var useNavbarExpendableMenuContext = () => useContext(expandableMenuContext);
22
23
  function NavbarExpandableMenu({ children }) {
23
24
  const [open, setOpen] = useState(false);
24
25
  const toggleOpen = () => {
@@ -32,7 +33,7 @@ function NavbarExpandableMenu({ children }) {
32
33
  }
33
34
  };
34
35
  const navbarElement = document.getElementsByClassName(clsx("hds-navbar"))[0];
35
- return /* @__PURE__ */ jsxs(navbarContext.Provider, { value: [open, toggleOpen], children: [
36
+ return /* @__PURE__ */ jsxs(expandableMenuContext.Provider, { value: [open, toggleOpen], children: [
36
37
  open ? /* @__PURE__ */ jsx(FocusTrap, { containerElements: [navbarElement] }) : null,
37
38
  children
38
39
  ] });
@@ -71,7 +72,7 @@ function RenderButton(_a) {
71
72
  type: "button"
72
73
  }, rest), {
73
74
  children: [
74
- text,
75
+ /* @__PURE__ */ jsx("span", { className: clsx("hds-navbar__button-responsive-text"), children: text }),
75
76
  " ",
76
77
  icon
77
78
  ]
@@ -93,7 +94,7 @@ var NavbarExpandableMenuTrigger = forwardRef(
93
94
  "whenOpenHelperTitle",
94
95
  "className"
95
96
  ]);
96
- const [open, toggleOpen] = useContext(navbarContext);
97
+ const [open, toggleOpen] = useNavbarExpendableMenuContext();
97
98
  const [width, setWidth] = useState(0);
98
99
  const measureButtonRef = useRef(null);
99
100
  const text = open ? whenOpenText : whenClosedText;
@@ -160,7 +161,7 @@ var NavbarExpandableMenuTrigger = forwardRef(
160
161
  NavbarExpandableMenuTrigger.displayName = "Navbar.ExpandableMenu.Trigger";
161
162
  var NavbarExpandableMenuContent = forwardRef((_a, ref) => {
162
163
  var _b = _a, { as: Component = "section", children, className } = _b, rest = __objRest(_b, ["as", "children", "className"]);
163
- const [open] = useContext(navbarContext);
164
+ const [open] = useNavbarExpendableMenuContext();
164
165
  return /* @__PURE__ */ jsx(
165
166
  Component,
166
167
  __spreadProps(__spreadValues({}, rest), {
@@ -174,8 +175,9 @@ var NavbarExpandableMenuContent = forwardRef((_a, ref) => {
174
175
  NavbarExpandableMenuContent.displayName = "Navbar.ExpandableMenu.Content";
175
176
 
176
177
  export {
178
+ useNavbarExpendableMenuContext,
177
179
  NavbarExpandableMenu,
178
180
  NavbarExpandableMenuTrigger,
179
181
  NavbarExpandableMenuContent
180
182
  };
181
- //# sourceMappingURL=chunk-2E6XPNPX.mjs.map
183
+ //# sourceMappingURL=chunk-DEVTAZKG.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/navbar/navbar-expandable-menu.tsx"],"sourcesContent":["import React, { createContext, useContext, forwardRef, useState, useRef, useEffect } from \"react\";\nimport { createRoot } from \"react-dom/client\";\nimport type { ClassValue } from \"@postenbring/hedwig-css/typed-classname/index.mjs\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport FocusTrap from \"focus-trap-react\";\nimport type { OverridableComponent } from \"../utils\";\nimport { CloseIcon, MenuIcon } from \"./icons\";\n\nconst expandableMenuContext = createContext([\n false as boolean,\n () => {\n // Empty\n },\n] as const);\nexport const useNavbarExpendableMenuContext = () => useContext(expandableMenuContext);\n\n/**\n * Root\n */\nexport interface NavbarExpandableMenuProps {\n children: React.ReactNode;\n}\nexport function NavbarExpandableMenu({ children }: NavbarExpandableMenuProps) {\n const [open, setOpen] = useState(false);\n const toggleOpen = () => {\n const nextOpenState = !open;\n setOpen(nextOpenState);\n if (nextOpenState) {\n window.scrollTo(0, 0);\n document.body.classList.add(clsx(\"hds-navbar-scroll-lock\"));\n } else {\n document.body.classList.remove(clsx(\"hds-navbar-scroll-lock\"));\n }\n };\n const navbarElement = document.getElementsByClassName(clsx(\"hds-navbar\"))[0];\n return (\n <expandableMenuContext.Provider value={[open, toggleOpen]}>\n {open ? <FocusTrap containerElements={[navbarElement as HTMLElement]} /> : null}\n {children}\n </expandableMenuContext.Provider>\n );\n}\nNavbarExpandableMenu.displayName = \"NavbarExpandableMenu\";\n\ninterface ButtonInterface {\n className?: ClassValue;\n open?: boolean;\n innerRef?: React.RefObject<HTMLButtonElement>;\n ref?: React.ForwardedRef<HTMLButtonElement>;\n text: React.ReactNode;\n title?: string;\n toggleOpen?: () => void;\n width?: number;\n}\n\nfunction RenderButton({\n className,\n innerRef,\n open = false,\n ref,\n text,\n title,\n toggleOpen,\n width,\n ...rest\n}: ButtonInterface) {\n const icon = open ? <CloseIcon /> : <MenuIcon />;\n const style = width ? { width } : {};\n return (\n <button\n className={clsx(\"hds-navbar__button\", className)}\n onClick={toggleOpen}\n ref={ref ?? innerRef}\n style={style}\n title={title}\n type=\"button\"\n {...rest}\n >\n <span className={clsx(\"hds-navbar__button-responsive-text\")}>{text}</span> {icon}\n </button>\n );\n}\n\n/**\n * Trigger\n *\n * ## TODO\n * - [x] Hide text when on mobile\n * - [X] Open / Close icon\n * - [X] Make button have consistant width\n */\n\nexport interface NavbarExpandableMenuTriggerProps\n extends Omit<React.HTMLAttributes<HTMLButtonElement>, \"children\"> {\n whenClosedText: React.ReactNode;\n whenClosedHelperTitle?: string;\n\n whenOpenText: React.ReactNode;\n whenOpenHelperTitle?: string;\n}\nexport const NavbarExpandableMenuTrigger = forwardRef<\n HTMLButtonElement,\n NavbarExpandableMenuTriggerProps\n>(\n (\n {\n whenClosedText,\n whenClosedHelperTitle,\n\n whenOpenText,\n whenOpenHelperTitle,\n\n className,\n ...rest\n },\n ref,\n ) => {\n const [open, toggleOpen] = useNavbarExpendableMenuContext();\n const [width, setWidth] = useState(0);\n const measureButtonRef = useRef<HTMLButtonElement>(null);\n\n const text: React.ReactNode = open ? whenOpenText : whenClosedText;\n const title = open ? whenOpenHelperTitle : whenClosedHelperTitle;\n\n /**\n *\n * @param element - Button to measure\n * @param callback - report the width back\n */\n const measureButton = (element: React.ReactNode, callback: (width: number) => void) => {\n // Create an empty div to render the Button in\n const container = document.createElement(\"div\");\n container.style.cssText = \"display: inline-block; position: absolute; visibility: hidden\";\n\n // Attach the empty div inside the navigation section\n const c = document.getElementsByClassName(\"hds-navbar__navigation\")[0];\n c.appendChild(container);\n\n // Render the Button here\n const root = createRoot(container as HTMLElement);\n root.render(element);\n\n /**\n * Get the offsetWidth now that it is rendered\n * Also clean up after us\n */\n const getWidth = () => {\n callback(measureButtonRef.current?.offsetWidth ?? 0);\n root.unmount();\n c.removeChild(container);\n };\n // This is instead of the callback that used to be on ReactDOM.render()\n setTimeout(getWidth, 0);\n };\n\n useEffect(() => {\n measureButton(\n <RenderButton\n className={(className ? className : \"\") as ClassValue}\n innerRef={measureButtonRef}\n text={whenClosedText}\n title={title}\n {...rest}\n />,\n (closedWidth: number) => {\n measureButton(\n <RenderButton\n className={(className ? className : \"\") as ClassValue}\n innerRef={measureButtonRef}\n open\n text={whenOpenText}\n title={title}\n {...rest}\n />,\n (openWidth: number) => {\n setWidth(Math.max(openWidth, closedWidth));\n },\n );\n },\n );\n }, [className, rest, title, whenClosedText, whenOpenText]);\n\n return (\n <RenderButton\n className={(className ? className : \"\") as ClassValue}\n open={open}\n ref={ref}\n text={text as string}\n title={title}\n toggleOpen={toggleOpen}\n width={width}\n {...rest}\n />\n );\n },\n);\nNavbarExpandableMenuTrigger.displayName = \"Navbar.ExpandableMenu.Trigger\";\n\n/**\n * Content\n */\nexport interface NavbarExpandableMenuContentProps {\n children: React.ReactNode;\n className?: string;\n}\nexport const NavbarExpandableMenuContent: OverridableComponent<\n NavbarExpandableMenuContentProps,\n HTMLDivElement\n> = forwardRef(({ as: Component = \"section\", children, className, ...rest }, ref) => {\n const [open] = useNavbarExpendableMenuContext();\n return (\n <Component\n {...rest}\n className={clsx(\"hds-navbar__expandable-menu-content\", className as undefined)}\n data-state={open ? \"open\" : \"closed\"}\n ref={ref}\n >\n <div className={clsx(\"hds-navbar__expandable-menu-content-inner\")}>{children}</div>\n </Component>\n );\n});\nNavbarExpandableMenuContent.displayName = \"Navbar.ExpandableMenu.Content\";\n"],"mappings":"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","names":["_a","_b"]}
@@ -0,0 +1,121 @@
1
+ import {
2
+ LinkList
3
+ } from "./chunk-GJDRW6PA.mjs";
4
+ import {
5
+ AccordionComponent
6
+ } from "./chunk-LIQ3FB56.mjs";
7
+ import {
8
+ PrimaryButton
9
+ } from "./chunk-OUHO4LGN.mjs";
10
+ import {
11
+ __objRest,
12
+ __spreadProps,
13
+ __spreadValues
14
+ } from "./chunk-R4SQKVDQ.mjs";
15
+
16
+ // src/footer/footer.tsx
17
+ import { forwardRef } from "react";
18
+ import { clsx } from "@postenbring/hedwig-css/typed-classname";
19
+ import { Slot } from "@radix-ui/react-slot";
20
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
21
+ var Footer = forwardRef(
22
+ (_a, ref) => {
23
+ var _b = _a, { children, className, variant, asChild } = _b, rest = __objRest(_b, ["children", "className", "variant", "asChild"]);
24
+ const Component = asChild ? Slot : "footer";
25
+ return /* @__PURE__ */ jsx(
26
+ Component,
27
+ __spreadProps(__spreadValues({
28
+ className: clsx(
29
+ `hds-footer`,
30
+ variant === "slim" && "hds-footer--slim",
31
+ className
32
+ ),
33
+ ref
34
+ }, rest), {
35
+ children
36
+ })
37
+ );
38
+ }
39
+ );
40
+ Footer.displayName = "Footer";
41
+ var FooterButtonLink = forwardRef(
42
+ (_a, ref) => {
43
+ var _b = _a, { children, className, asChild } = _b, rest = __objRest(_b, ["children", "className", "asChild"]);
44
+ const Component = asChild ? Slot : "a";
45
+ return (
46
+ // @ts-expect-error -- It's ok, types are a bit off
47
+ /* @__PURE__ */ jsx(
48
+ PrimaryButton,
49
+ __spreadProps(__spreadValues({
50
+ as: Component,
51
+ fill: "outline",
52
+ className: clsx(className),
53
+ ref
54
+ }, rest), {
55
+ children
56
+ })
57
+ )
58
+ );
59
+ }
60
+ );
61
+ FooterButtonLink.displayName = "FooterButton";
62
+ var FooterLogo = forwardRef(
63
+ (_a, ref) => {
64
+ var _b = _a, { children, className, asChild } = _b, rest = __objRest(_b, ["children", "className", "asChild"]);
65
+ const Component = asChild ? Slot : "div";
66
+ return /* @__PURE__ */ jsx(Component, __spreadProps(__spreadValues({ className: clsx(`hds-footer__logo`, className), ref }, rest), { children }));
67
+ }
68
+ );
69
+ FooterLogo.displayName = "Footer.Logo";
70
+ var FooterLinkSections = forwardRef(
71
+ (_a, ref) => {
72
+ var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
73
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
74
+ /* @__PURE__ */ jsx(
75
+ AccordionComponent,
76
+ __spreadProps(__spreadValues({
77
+ className: clsx("hds-footer__link-sections", className),
78
+ ref
79
+ }, rest), {
80
+ children
81
+ })
82
+ ),
83
+ /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({ className: clsx("hds-footer__link-sections", className) }, rest), { children }))
84
+ ] });
85
+ }
86
+ );
87
+ FooterLinkSections.displayName = "Footer.LinkSections";
88
+ var FooterLinkSection = forwardRef(
89
+ (_a, ref) => {
90
+ var _b = _a, { heading, children, className } = _b, rest = __objRest(_b, ["heading", "children", "className"]);
91
+ const linkListChildren = /* @__PURE__ */ jsx(LinkList, { children });
92
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
93
+ /* @__PURE__ */ jsxs(
94
+ AccordionComponent.Item,
95
+ __spreadProps(__spreadValues({
96
+ className: clsx(`hds-footer__link-section`, className),
97
+ ref
98
+ }, rest), {
99
+ children: [
100
+ /* @__PURE__ */ jsx(AccordionComponent.Header, { children: heading }),
101
+ /* @__PURE__ */ jsx(AccordionComponent.Content, { children: linkListChildren })
102
+ ]
103
+ })
104
+ ),
105
+ /* @__PURE__ */ jsxs("div", { className: clsx(`hds-footer__link-section`, className), children: [
106
+ /* @__PURE__ */ jsx("h2", { children: heading }),
107
+ linkListChildren
108
+ ] })
109
+ ] });
110
+ }
111
+ );
112
+ FooterLinkSection.displayName = "Footer.LinkSection";
113
+
114
+ export {
115
+ Footer,
116
+ FooterButtonLink,
117
+ FooterLogo,
118
+ FooterLinkSections,
119
+ FooterLinkSection
120
+ };
121
+ //# sourceMappingURL=chunk-EHUVLDIZ.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/footer/footer.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type ReactElement } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { Accordion } from \"../accordion\";\nimport { LinkList } from \"../list/link-list\";\nimport { PrimaryButton } from \"../button\";\n\nexport interface FooterProps extends HTMLAttributes<HTMLDivElement> {\n variant?: \"default\" | \"slim\";\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 * 🚨 WORK IN PROGRESS 🚨\n */\nexport const Footer = forwardRef<HTMLDivElement, FooterProps>(\n ({ children, className, variant, asChild, ...rest }, ref) => {\n const Component = asChild ? Slot : \"footer\";\n return (\n <Component\n className={clsx(\n `hds-footer`,\n variant === \"slim\" && \"hds-footer--slim\",\n className as undefined,\n )}\n ref={ref}\n {...rest}\n >\n {children}\n </Component>\n );\n },\n);\nFooter.displayName = \"Footer\";\n\nexport interface FooterButtonLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\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 * 🚨 WORK IN PROGRESS 🚨\n */\nexport const FooterButtonLink = forwardRef<HTMLAnchorElement, FooterButtonLinkProps>(\n ({ children, className, asChild, ...rest }, ref) => {\n const Component = asChild ? Slot : \"a\";\n return (\n // @ts-expect-error -- It's ok, types are a bit off\n <PrimaryButton\n as={Component}\n fill=\"outline\"\n className={clsx(className as undefined)}\n ref={ref}\n {...rest}\n >\n {children}\n </PrimaryButton>\n );\n },\n);\nFooterButtonLink.displayName = \"FooterButton\";\n\ninterface FooterLogoProps extends HTMLAttributes<HTMLDivElement> {\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 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 FooterLogo = forwardRef<HTMLDivElement, FooterLogoProps>(\n ({ children, className, asChild, ...rest }, ref) => {\n const Component = asChild ? Slot : \"div\";\n return (\n <Component className={clsx(`hds-footer__logo`, className as undefined)} ref={ref} {...rest}>\n {children}\n </Component>\n );\n },\n);\nFooterLogo.displayName = \"Footer.Logo\";\n\ninterface FooterLinkSectionsProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactElement<FooterLinkSectionProps> | ReactElement<FooterLinkSectionProps>[];\n}\n\n/**\n * Responsive sections of links. Will become an accordion on mobile.\n *\n * Use with `Footer.LinkSection` for each section.\n *\n * TODO:\n * - [ ] Decrease number of DOM elements rendered. We should not rely on conditional rendering as that will make server-side rendering harder.\n */\nexport const FooterLinkSections = forwardRef<HTMLDivElement, FooterLinkSectionsProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <>\n {/* Mobile */}\n <Accordion\n className={clsx(\"hds-footer__link-sections\", className as undefined)}\n ref={ref}\n {...rest}\n >\n {/* @ts-expect-error -- It's ok */}\n {children}\n </Accordion>\n\n {/* Desktop */}\n <div className={clsx(\"hds-footer__link-sections\", className as undefined)} {...rest}>\n {children}\n </div>\n </>\n );\n },\n);\nFooterLinkSections.displayName = \"Footer.LinkSections\";\n\ninterface FooterLinkSectionProps extends HTMLAttributes<HTMLDivElement> {\n heading: React.ReactNode;\n children: React.ReactNode;\n}\n\nexport const FooterLinkSection = forwardRef<HTMLDivElement, FooterLinkSectionProps>(\n ({ heading, children, className, ...rest }, ref) => {\n // @ts-expect-error -- It's ok\n const linkListChildren = <LinkList>{children}</LinkList>;\n return (\n <>\n {/* Mobile */}\n <Accordion.Item\n className={clsx(`hds-footer__link-section`, className as undefined)}\n ref={ref}\n {...rest}\n >\n <Accordion.Header>{heading}</Accordion.Header>\n <Accordion.Content>{linkListChildren}</Accordion.Content>\n </Accordion.Item>\n\n {/* Desktop */}\n <div className={clsx(`hds-footer__link-section`, className as undefined)}>\n <h2>{heading}</h2>\n {linkListChildren}\n </div>\n </>\n );\n },\n);\nFooterLinkSection.displayName = \"Footer.LinkSection\";\n"],"mappings":";;;;;;;;;;;;;;;;AAAA,SAAS,kBAA0D;AACnE,SAAS,YAAY;AACrB,SAAS,YAAY;AAqBf,SAoFA,UApFA,KAoFA,YApFA;AAJC,IAAM,SAAS;AAAA,EACpB,CAAC,IAAoD,QAAQ;AAA5D,iBAAE,YAAU,WAAW,SAAS,QApBnC,IAoBG,IAA4C,iBAA5C,IAA4C,CAA1C,YAAU,aAAW,WAAS;AAC/B,UAAM,YAAY,UAAU,OAAO;AACnC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,YAAY,UAAU;AAAA,UACtB;AAAA,QACF;AAAA,QACA;AAAA,SACI,OAPL;AAAA,QASE;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,OAAO,cAAc;AAYd,IAAM,mBAAmB;AAAA,EAC9B,CAAC,IAA2C,QAAQ;AAAnD,iBAAE,YAAU,WAAW,QAlD1B,IAkDG,IAAmC,iBAAnC,IAAmC,CAAjC,YAAU,aAAW;AACtB,UAAM,YAAY,UAAU,OAAO;AACnC;AAAA;AAAA,MAEE;AAAA,QAAC;AAAA;AAAA,UACC,IAAI;AAAA,UACJ,MAAK;AAAA,UACL,WAAW,KAAK,SAAsB;AAAA,UACtC;AAAA,WACI,OALL;AAAA,UAOE;AAAA;AAAA,MACH;AAAA;AAAA,EAEJ;AACF;AACA,iBAAiB,cAAc;AAcxB,IAAM,aAAa;AAAA,EACxB,CAAC,IAA2C,QAAQ;AAAnD,iBAAE,YAAU,WAAW,QAjF1B,IAiFG,IAAmC,iBAAnC,IAAmC,CAAjC,YAAU,aAAW;AACtB,UAAM,YAAY,UAAU,OAAO;AACnC,WACE,oBAAC,0CAAU,WAAW,KAAK,oBAAoB,SAAsB,GAAG,OAAc,OAArF,EACE,WACH;AAAA,EAEJ;AACF;AACA,WAAW,cAAc;AAclB,IAAM,qBAAqB;AAAA,EAChC,CAAC,IAAkC,QAAQ;AAA1C,iBAAE,YAAU,UAzGf,IAyGG,IAA0B,iBAA1B,IAA0B,CAAxB,YAAU;AACX,WACE,iCAEE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,WAAW,KAAK,6BAA6B,SAAsB;AAAA,UACnE;AAAA,WACI,OAHL;AAAA,UAME;AAAA;AAAA,MACH;AAAA,MAGA,oBAAC,sCAAI,WAAW,KAAK,6BAA6B,SAAsB,KAAO,OAA9E,EACE,WACH;AAAA,OACF;AAAA,EAEJ;AACF;AACA,mBAAmB,cAAc;AAO1B,IAAM,oBAAoB;AAAA,EAC/B,CAAC,IAA2C,QAAQ;AAAnD,iBAAE,WAAS,UAAU,UAtIxB,IAsIG,IAAmC,iBAAnC,IAAmC,CAAjC,WAAS,YAAU;AAEpB,UAAM,mBAAmB,oBAAC,YAAU,UAAS;AAC7C,WACE,iCAEE;AAAA;AAAA,QAAC,mBAAU;AAAA,QAAV;AAAA,UACC,WAAW,KAAK,4BAA4B,SAAsB;AAAA,UAClE;AAAA,WACI,OAHL;AAAA,UAKC;AAAA,gCAAC,mBAAU,QAAV,EAAkB,mBAAQ;AAAA,YAC3B,oBAAC,mBAAU,SAAV,EAAmB,4BAAiB;AAAA;AAAA;AAAA,MACvC;AAAA,MAGA,qBAAC,SAAI,WAAW,KAAK,4BAA4B,SAAsB,GACrE;AAAA,4BAAC,QAAI,mBAAQ;AAAA,QACZ;AAAA,SACH;AAAA,OACF;AAAA,EAEJ;AACF;AACA,kBAAkB,cAAc;","names":[]}
@@ -20,16 +20,12 @@ var AccordionContent = forwardRef((_a, ref) => {
20
20
  return /* @__PURE__ */ jsx(
21
21
  Component,
22
22
  __spreadProps(__spreadValues({
23
- "aria-hidden": !context.open
23
+ "aria-hidden": !context.open,
24
+ "data-state": context.open ? "open" : "closed",
25
+ inert: context.open ? void 0 : "true",
26
+ className: clsx("hds-accordion-item-content", className),
27
+ ref
24
28
  }, rest), {
25
- className: clsx(
26
- "hds-accordion-item-content",
27
- {
28
- "hds-accordion-item-content--closed": !context.open
29
- },
30
- className
31
- ),
32
- ref,
33
29
  children: /* @__PURE__ */ jsx("div", { className: clsx("hds-accordion-item-content-inner"), children })
34
30
  })
35
31
  );
@@ -39,4 +35,4 @@ AccordionContent.displayName = "Accordion.Content";
39
35
  export {
40
36
  AccordionContent
41
37
  };
42
- //# sourceMappingURL=chunk-KRGKVH5J.mjs.map
38
+ //# sourceMappingURL=chunk-GUB3UCXO.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/accordion/accordion-content.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { forwardRef, useContext } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport type { OverridableComponent } from \"../utils\";\nimport { AccordionItemContext } from \"./context\";\n\nexport interface AccordionContentProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n}\n\nexport const AccordionContent: OverridableComponent<AccordionContentProps, HTMLDivElement> =\n forwardRef(({ as: Component = \"div\", children, className, ...rest }, ref) => {\n const context = useContext(AccordionItemContext);\n if (context === null) {\n return null;\n }\n return (\n <Component\n aria-hidden={!context.open}\n data-state={context.open ? \"open\" : \"closed\"}\n inert={context.open ? undefined : \"true\"}\n className={clsx(\"hds-accordion-item-content\", className as undefined)}\n ref={ref}\n {...rest}\n >\n <div className={clsx(\"hds-accordion-item-content-inner\")}>{children}</div>\n </Component>\n );\n });\n\nAccordionContent.displayName = \"Accordion.Content\";\n"],"mappings":";;;;;;;;;;AACA,SAAS,YAAY,kBAAkB;AACvC,SAAS,YAAY;AAuBb;AAfD,IAAM,mBACX,WAAW,CAAC,IAAyD,QAAQ;AAAjE,eAAE,MAAI,YAAY,OAAO,UAAU,UAXjD,IAWc,IAAiD,iBAAjD,IAAiD,CAA/C,MAAuB,YAAU;AAC7C,QAAM,UAAU,WAAW,oBAAoB;AAC/C,MAAI,YAAY,MAAM;AACpB,WAAO;AAAA,EACT;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,CAAC,QAAQ;AAAA,MACtB,cAAY,QAAQ,OAAO,SAAS;AAAA,MACpC,OAAO,QAAQ,OAAO,SAAY;AAAA,MAClC,WAAW,KAAK,8BAA8B,SAAsB;AAAA,MACpE;AAAA,OACI,OANL;AAAA,MAQC,8BAAC,SAAI,WAAW,KAAK,kCAAkC,GAAI,UAAS;AAAA;AAAA,EACtE;AAEJ,CAAC;AAEH,iBAAiB,cAAc;","names":[]}
@@ -8,9 +8,11 @@ import {
8
8
  } from "./chunk-R4SQKVDQ.mjs";
9
9
 
10
10
  // src/form/fieldset/fieldset.tsx
11
- import { useId, forwardRef } from "react";
11
+ import { useId, forwardRef, createContext, useContext } from "react";
12
12
  import { clsx } from "@postenbring/hedwig-css/typed-classname";
13
13
  import { jsx, jsxs } from "react/jsx-runtime";
14
+ var FieldsetContext = createContext({ hasError: false });
15
+ var useFieldsetContext = () => useContext(FieldsetContext);
14
16
  var Fieldset = forwardRef(function Fieldset2(_a, ref) {
15
17
  var _b = _a, {
16
18
  className,
@@ -51,7 +53,7 @@ var Fieldset = forwardRef(function Fieldset2(_a, ref) {
51
53
  children: legend
52
54
  })
53
55
  ),
54
- /* @__PURE__ */ jsx("div", { className: clsx("hds-fieldset__input-wrapper"), children }),
56
+ /* @__PURE__ */ jsx("div", { className: clsx("hds-fieldset__input-wrapper"), children: /* @__PURE__ */ jsx(FieldsetContext.Provider, { value: { hasError: Boolean(errorMessage) }, children }) }),
55
57
  /* @__PURE__ */ jsx(ErrorMessage, { id: errorMessageId, children: errorMessage })
56
58
  ]
57
59
  })
@@ -59,6 +61,7 @@ var Fieldset = forwardRef(function Fieldset2(_a, ref) {
59
61
  });
60
62
 
61
63
  export {
64
+ useFieldsetContext,
62
65
  Fieldset
63
66
  };
64
- //# sourceMappingURL=chunk-37WVYY6X.mjs.map
67
+ //# sourceMappingURL=chunk-HXV2UMEV.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/form/fieldset/fieldset.tsx"],"sourcesContent":["import { useId, forwardRef, createContext, useContext } from \"react\";\nimport type { FieldsetHTMLAttributes, HTMLAttributes, ReactNode, CSSProperties } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { ErrorMessage } from \"../error-message\";\n\nexport interface FieldsetProps extends FieldsetHTMLAttributes<HTMLFieldSetElement> {\n className?: string;\n style?: CSSProperties;\n /**\n * Providing an errorMessage will also give contained Checkboxes or Radiobuttons\n * error styling and aria to indicate invalid state.\n *\n * For Radiobuttons you are even better off using RadioGroup.\n */\n errorMessage?: ReactNode;\n legendProps?: HTMLAttributes<HTMLElement> & { size: \"default\" | \"large\" };\n legend: ReactNode;\n children: ReactNode;\n}\n\nconst FieldsetContext = createContext<{ hasError: boolean }>({ hasError: false });\n\nexport const useFieldsetContext = () => useContext(FieldsetContext);\n\nexport const Fieldset = forwardRef<HTMLFieldSetElement, FieldsetProps>(function Fieldset(\n {\n className,\n style,\n errorMessage,\n legendProps: { size: legendSize = \"default\", className: legendClassName, ...legendProps } = {},\n legend,\n children,\n ...rest\n },\n ref,\n) {\n const errorMessageId = useId();\n\n return (\n <fieldset\n aria-describedby={errorMessage ? errorMessageId : undefined}\n aria-invalid={errorMessage ? true : undefined}\n className={clsx(\"hds-fieldset\", className as undefined)}\n ref={ref}\n style={style}\n {...rest}\n >\n <legend\n className={clsx(\n \"hds-fieldset__legend\",\n { [`hds-fieldset__legend--${legendSize}`]: legendSize },\n legendClassName as undefined,\n )}\n {...legendProps}\n >\n {legend}\n </legend>\n <div className={clsx(\"hds-fieldset__input-wrapper\")}>\n <FieldsetContext.Provider value={{ hasError: Boolean(errorMessage) }}>\n {children}\n </FieldsetContext.Provider>\n </div>\n <ErrorMessage id={errorMessageId}>{errorMessage}</ErrorMessage>\n </fieldset>\n );\n});\n"],"mappings":";;;;;;;;;;AAAA,SAAS,OAAO,YAAY,eAAe,kBAAkB;AAE7D,SAAS,YAAY;AAqCjB,SAQE,KARF;AAnBJ,IAAM,kBAAkB,cAAqC,EAAE,UAAU,MAAM,CAAC;AAEzE,IAAM,qBAAqB,MAAM,WAAW,eAAe;AAE3D,IAAM,WAAW,WAA+C,SAASA,UAC9E,IASA,KACA;AAVA,eAIe;AAAA,IAHb;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa,KAA+E,CAAC;AAAA,EA7BjG,IAyBE,IAIe,SAAE,QAAM,aAAa,WAAW,WAAW,gBA7B5D,IA6BiB,IAA+D,wBAA/D,IAA+D,CAA7D,QAA8B,eAJ/C,SAKE;AAAA;AAAA,IACA;AAAA,EA/BJ,IAyBE,IAOK,iBAPL,IAOK;AAAA,IANH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAKF,QAAM,iBAAiB,MAAM;AAE7B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,oBAAkB,eAAe,iBAAiB;AAAA,MAClD,gBAAc,eAAe,OAAO;AAAA,MACpC,WAAW,KAAK,gBAAgB,SAAsB;AAAA,MACtD;AAAA,MACA;AAAA,OACI,OANL;AAAA,MAQC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACA,EAAE,CAAC,yBAAyB,UAAU,EAAE,GAAG,WAAW;AAAA,cACtD;AAAA,YACF;AAAA,aACI,cANL;AAAA,YAQE;AAAA;AAAA,QACH;AAAA,QACA,oBAAC,SAAI,WAAW,KAAK,6BAA6B,GAChD,8BAAC,gBAAgB,UAAhB,EAAyB,OAAO,EAAE,UAAU,QAAQ,YAAY,EAAE,GAChE,UACH,GACF;AAAA,QACA,oBAAC,gBAAa,IAAI,gBAAiB,wBAAa;AAAA;AAAA;AAAA,EAClD;AAEJ,CAAC;","names":["Fieldset"]}
@@ -0,0 +1,18 @@
1
+ // src/tabs/context.ts
2
+ import { createContext, useContext } from "react";
3
+ var TabsContext = createContext(null);
4
+ function useTabsContext() {
5
+ const context = useContext(TabsContext);
6
+ if (!context) {
7
+ throw new Error(
8
+ "Tabs context required. Did you use `<Tabs.List />`, `<Tabs.Tab />`, or `<Tabs.Content />` outside of <Tabs/>?"
9
+ );
10
+ }
11
+ return context;
12
+ }
13
+
14
+ export {
15
+ TabsContext,
16
+ useTabsContext
17
+ };
18
+ //# sourceMappingURL=chunk-KQITCS3U.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/tabs/context.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\n\nexport interface TabsContextProps {\n activeTabId: string;\n toggleActiveTabId: (tabId: string) => void;\n}\n\nexport const TabsContext = createContext<TabsContextProps | null>(null);\n\nexport function useTabsContext() {\n const context = useContext(TabsContext);\n if (!context) {\n throw new Error(\n \"Tabs context required. Did you use `<Tabs.List />`, `<Tabs.Tab />`, or `<Tabs.Content />` outside of <Tabs/>?\",\n );\n }\n return context;\n}\n"],"mappings":";AAAA,SAAS,eAAe,kBAAkB;AAOnC,IAAM,cAAc,cAAuC,IAAI;AAE/D,SAAS,iBAAiB;AAC/B,QAAM,UAAU,WAAW,WAAW;AACtC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;","names":[]}
@@ -1,15 +1,15 @@
1
- import {
2
- AccordionContent
3
- } from "./chunk-KRGKVH5J.mjs";
4
- import {
5
- AccordionHeader
6
- } from "./chunk-FT5CX2W5.mjs";
7
1
  import {
8
2
  AccordionItem
9
- } from "./chunk-SAGJ5W7M.mjs";
3
+ } from "./chunk-62F4I3MQ.mjs";
10
4
  import {
11
5
  Accordion
12
6
  } from "./chunk-VRIY65P5.mjs";
7
+ import {
8
+ AccordionContent
9
+ } from "./chunk-GUB3UCXO.mjs";
10
+ import {
11
+ AccordionHeader
12
+ } from "./chunk-YXHXRUFX.mjs";
13
13
 
14
14
  // src/accordion/index.tsx
15
15
  var AccordionComponent = Accordion;
@@ -20,4 +20,4 @@ AccordionComponent.Content = AccordionContent;
20
20
  export {
21
21
  AccordionComponent
22
22
  };
23
- //# sourceMappingURL=chunk-DJRMXOCP.mjs.map
23
+ //# sourceMappingURL=chunk-LIQ3FB56.mjs.map
@@ -0,0 +1,104 @@
1
+ import {
2
+ useResize
3
+ } from "./chunk-WCA2WPFS.mjs";
4
+ import {
5
+ useTabsContext
6
+ } from "./chunk-KQITCS3U.mjs";
7
+ import {
8
+ __objRest,
9
+ __spreadProps,
10
+ __spreadValues
11
+ } from "./chunk-R4SQKVDQ.mjs";
12
+
13
+ // src/tabs/tabs-list.tsx
14
+ import { forwardRef, useEffect, useRef } from "react";
15
+ import { clsx } from "@postenbring/hedwig-css/typed-classname";
16
+ import { jsx } from "react/jsx-runtime";
17
+ function TabsList(_a) {
18
+ var _b = _a, { children, direction = "horizontal", className } = _b, rest = __objRest(_b, ["children", "direction", "className"]);
19
+ const { activeTabId } = useTabsContext();
20
+ const tabsListRef = useRef(null);
21
+ const { width: tabsWidth } = useResize(tabsListRef);
22
+ const { innerWidth } = window;
23
+ const wideEnough = innerWidth >= tabsWidth;
24
+ const previousTabId = useRef(activeTabId);
25
+ useEffect(() => {
26
+ const tabList = tabsListRef.current;
27
+ const activeTab = tabList == null ? void 0 : tabList.querySelector(`[data-tabid="${activeTabId}"]`);
28
+ if (!activeTab || !tabList)
29
+ return;
30
+ const { offsetHeight: containerHeight, offsetWidth: containerWidth } = tabList;
31
+ const { offsetHeight, offsetWidth, offsetTop, offsetLeft } = activeTab;
32
+ const height = offsetHeight / containerHeight;
33
+ const width = offsetWidth / containerWidth;
34
+ tabsListRef.current.style.setProperty("--_hds-tabs-marker-height", String(height));
35
+ tabsListRef.current.style.setProperty("--_hds-tabs-marker-width", String(width));
36
+ tabsListRef.current.style.setProperty("--_hds-tabs-marker-top", `${offsetTop}px`);
37
+ tabsListRef.current.style.setProperty("--_hds-tabs-marker-left", `${offsetLeft}px`);
38
+ if (previousTabId.current !== activeTabId) {
39
+ tabsListRef.current.style.setProperty(
40
+ "--_hds-tabs-marker-animated-color",
41
+ "var(--_hds-tabs-marker-color)"
42
+ );
43
+ tabsListRef.current.style.setProperty(
44
+ "--_hds-tabs-marker-border-fallback-color",
45
+ "transparent"
46
+ );
47
+ }
48
+ previousTabId.current = activeTabId;
49
+ }, [activeTabId, innerWidth]);
50
+ return /* @__PURE__ */ jsx(
51
+ "div",
52
+ __spreadProps(__spreadValues({
53
+ className: clsx(
54
+ "hds-tabs__list",
55
+ direction === "horizontal" ? {
56
+ "hds-tabs__list--horizontal": wideEnough,
57
+ "hds-tabs__list--vertical": !wideEnough
58
+ } : {
59
+ "hds-tabs__list--vertical": true
60
+ },
61
+ className
62
+ ),
63
+ ref: tabsListRef,
64
+ role: "tablist"
65
+ }, rest), {
66
+ children
67
+ })
68
+ );
69
+ }
70
+ TabsList.displayName = "Tabs.List";
71
+ var Tab = forwardRef(
72
+ (_a, ref) => {
73
+ var _b = _a, { as: Component = "button", children, tabId, className, onClick } = _b, rest = __objRest(_b, ["as", "children", "tabId", "className", "onClick"]);
74
+ const context = useTabsContext();
75
+ const toggleTab = (e) => {
76
+ e.preventDefault();
77
+ context.toggleActiveTabId(tabId);
78
+ onClick && onClick(e);
79
+ };
80
+ return /* @__PURE__ */ jsx(
81
+ Component,
82
+ __spreadProps(__spreadValues({
83
+ className: clsx(
84
+ "hds-tabs__tab",
85
+ { "hds-tabs__tab--active": context.activeTabId === tabId },
86
+ className
87
+ ),
88
+ "data-tabid": tabId,
89
+ onClick: toggleTab,
90
+ ref,
91
+ role: "tab"
92
+ }, rest), {
93
+ children
94
+ })
95
+ );
96
+ }
97
+ );
98
+ Tab.displayName = "Tabs.Tab";
99
+
100
+ export {
101
+ TabsList,
102
+ Tab
103
+ };
104
+ //# sourceMappingURL=chunk-MUVJAMFN.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/tabs/tabs-list.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactElement, MouseEvent } from \"react\";\nimport { forwardRef, useEffect, useRef } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { type OverridableComponent, useResize } from \"../utils\";\nimport { useTabsContext } from \"./context\";\n\nexport interface TabListProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactElement<TabProps> | ReactElement<TabProps>[];\n\n /**\n * Direction of the tabs. Can either be vertical or horizontal.\n * Horizontal breaks on window width with fallback back to vertical\n */\n direction?: \"vertical\" | \"horizontal\";\n}\n\nexport function TabsList({ children, direction = \"horizontal\", className, ...rest }: TabListProps) {\n const { activeTabId } = useTabsContext();\n const tabsListRef = useRef<HTMLDivElement>(null);\n const { width: tabsWidth } = useResize(tabsListRef);\n const { innerWidth } = window;\n const wideEnough = innerWidth >= tabsWidth;\n\n const previousTabId = useRef(activeTabId);\n\n // Marker animation\n useEffect(() => {\n const tabList = tabsListRef.current;\n const activeTab = tabList?.querySelector(`[data-tabid=\"${activeTabId}\"]`);\n if (!activeTab || !tabList) return;\n\n const { offsetHeight: containerHeight, offsetWidth: containerWidth } = tabList;\n const { offsetHeight, offsetWidth, offsetTop, offsetLeft } = activeTab as HTMLElement;\n\n // Calculate the height and width of the marker relative to the container\n const height = offsetHeight / containerHeight;\n const width = offsetWidth / containerWidth;\n\n // NOTE: Doing a DOM manipulation here to set the CSS variables for the marker\n // Not really the react idomatic way, but as long as it works we are able to skip some intermidiate `useState`\n tabsListRef.current.style.setProperty(\"--_hds-tabs-marker-height\", String(height));\n tabsListRef.current.style.setProperty(\"--_hds-tabs-marker-width\", String(width));\n tabsListRef.current.style.setProperty(\"--_hds-tabs-marker-top\", `${offsetTop}px`);\n tabsListRef.current.style.setProperty(\"--_hds-tabs-marker-left\", `${offsetLeft}px`);\n\n // Start with border fallback, then switch to the animated marker when the user changes tabs\n // This way the marker is placed immediately to the default tab, then animates smoothly to the next when selected\n if (previousTabId.current !== activeTabId) {\n tabsListRef.current.style.setProperty(\n \"--_hds-tabs-marker-animated-color\",\n \"var(--_hds-tabs-marker-color)\",\n );\n tabsListRef.current.style.setProperty(\n \"--_hds-tabs-marker-border-fallback-color\",\n \"transparent\",\n );\n }\n previousTabId.current = activeTabId;\n }, [activeTabId, innerWidth]);\n\n return (\n <div\n className={clsx(\n \"hds-tabs__list\",\n direction === \"horizontal\"\n ? {\n \"hds-tabs__list--horizontal\": wideEnough,\n \"hds-tabs__list--vertical\": !wideEnough,\n }\n : {\n \"hds-tabs__list--vertical\": true,\n },\n className as undefined,\n )}\n ref={tabsListRef}\n role=\"tablist\"\n {...rest}\n >\n {children}\n </div>\n );\n}\n\nTabsList.displayName = \"Tabs.List\";\n\nexport interface TabProps extends HTMLAttributes<HTMLButtonElement> {\n children: ReactElement<HTMLElement> | string;\n\n /**\n * Identifier for the tab\n */\n tabId: string;\n}\n\nexport const Tab: OverridableComponent<TabProps, HTMLButtonElement> = forwardRef(\n ({ as: Component = \"button\", children, tabId, className, onClick, ...rest }, ref) => {\n const context = useTabsContext();\n\n const toggleTab = (e: MouseEvent<HTMLButtonElement>) => {\n e.preventDefault();\n context.toggleActiveTabId(tabId);\n onClick && onClick(e);\n };\n return (\n <Component\n className={clsx(\n \"hds-tabs__tab\",\n { \"hds-tabs__tab--active\": context.activeTabId === tabId },\n className as undefined,\n )}\n data-tabid={tabId}\n onClick={toggleTab}\n ref={ref}\n role=\"tab\"\n {...rest}\n >\n {children}\n </Component>\n );\n },\n);\n\nTab.displayName = \"Tabs.Tab\";\n"],"mappings":";;;;;;;;;;;;;AACA,SAAS,YAAY,WAAW,cAAc;AAC9C,SAAS,YAAY;AA2DjB;AA7CG,SAAS,SAAS,IAA0E;AAA1E,eAAE,YAAU,YAAY,cAAc,UAhB/D,IAgByB,IAAoD,iBAApD,IAAoD,CAAlD,YAAU,aAA0B;AAC7D,QAAM,EAAE,YAAY,IAAI,eAAe;AACvC,QAAM,cAAc,OAAuB,IAAI;AAC/C,QAAM,EAAE,OAAO,UAAU,IAAI,UAAU,WAAW;AAClD,QAAM,EAAE,WAAW,IAAI;AACvB,QAAM,aAAa,cAAc;AAEjC,QAAM,gBAAgB,OAAO,WAAW;AAGxC,YAAU,MAAM;AACd,UAAM,UAAU,YAAY;AAC5B,UAAM,YAAY,mCAAS,cAAc,gBAAgB,WAAW;AACpE,QAAI,CAAC,aAAa,CAAC;AAAS;AAE5B,UAAM,EAAE,cAAc,iBAAiB,aAAa,eAAe,IAAI;AACvE,UAAM,EAAE,cAAc,aAAa,WAAW,WAAW,IAAI;AAG7D,UAAM,SAAS,eAAe;AAC9B,UAAM,QAAQ,cAAc;AAI5B,gBAAY,QAAQ,MAAM,YAAY,6BAA6B,OAAO,MAAM,CAAC;AACjF,gBAAY,QAAQ,MAAM,YAAY,4BAA4B,OAAO,KAAK,CAAC;AAC/E,gBAAY,QAAQ,MAAM,YAAY,0BAA0B,GAAG,SAAS,IAAI;AAChF,gBAAY,QAAQ,MAAM,YAAY,2BAA2B,GAAG,UAAU,IAAI;AAIlF,QAAI,cAAc,YAAY,aAAa;AACzC,kBAAY,QAAQ,MAAM;AAAA,QACxB;AAAA,QACA;AAAA,MACF;AACA,kBAAY,QAAQ,MAAM;AAAA,QACxB;AAAA,QACA;AAAA,MACF;AAAA,IACF;AACA,kBAAc,UAAU;AAAA,EAC1B,GAAG,CAAC,aAAa,UAAU,CAAC;AAE5B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,cAAc,eACV;AAAA,UACE,8BAA8B;AAAA,UAC9B,4BAA4B,CAAC;AAAA,QAC/B,IACA;AAAA,UACE,4BAA4B;AAAA,QAC9B;AAAA,QACJ;AAAA,MACF;AAAA,MACA,KAAK;AAAA,MACL,MAAK;AAAA,OACD,OAfL;AAAA,MAiBE;AAAA;AAAA,EACH;AAEJ;AAEA,SAAS,cAAc;AAWhB,IAAM,MAAyD;AAAA,EACpE,CAAC,IAA4E,QAAQ;AAApF,iBAAE,MAAI,YAAY,UAAU,UAAU,OAAO,WAAW,QA/F3D,IA+FG,IAAoE,iBAApE,IAAoE,CAAlE,MAA0B,YAAU,SAAO,aAAW;AACvD,UAAM,UAAU,eAAe;AAE/B,UAAM,YAAY,CAAC,MAAqC;AACtD,QAAE,eAAe;AACjB,cAAQ,kBAAkB,KAAK;AAC/B,iBAAW,QAAQ,CAAC;AAAA,IACtB;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,EAAE,yBAAyB,QAAQ,gBAAgB,MAAM;AAAA,UACzD;AAAA,QACF;AAAA,QACA,cAAY;AAAA,QACZ,SAAS;AAAA,QACT;AAAA,QACA,MAAK;AAAA,SACD,OAVL;AAAA,QAYE;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAI,cAAc;","names":[]}
@@ -1,6 +1,9 @@
1
1
  import {
2
2
  useRadioGroupContext
3
- } from "./chunk-V4NGUB4I.mjs";
3
+ } from "./chunk-XFSZBILE.mjs";
4
+ import {
5
+ useFieldsetContext
6
+ } from "./chunk-HXV2UMEV.mjs";
4
7
  import {
5
8
  __objRest,
6
9
  __spreadProps,
@@ -41,8 +44,15 @@ var Radiobutton = forwardRef(
41
44
  "children",
42
45
  "className"
43
46
  ]);
44
- const _a2 = useRadioGroupContext(), { value: selectedValue, hasError: hasErrorContext } = _a2, context = __objRest(_a2, ["value", "hasError"]);
45
- const hasError = hasErrorContext || hasErrorProp;
47
+ const _a2 = useRadioGroupContext(), {
48
+ value: selectedValue,
49
+ hasError: hasRadioGroupError
50
+ } = _a2, context = __objRest(_a2, [
51
+ "value",
52
+ "hasError"
53
+ ]);
54
+ const { hasError: hasFieldsetError } = useFieldsetContext();
55
+ const hasError = hasFieldsetError || hasRadioGroupError || hasErrorProp;
46
56
  return /* @__PURE__ */ jsxs(
47
57
  "div",
48
58
  {
@@ -79,4 +89,4 @@ Radiobutton.displayName = "Radiobutton";
79
89
  export {
80
90
  Radiobutton
81
91
  };
82
- //# sourceMappingURL=chunk-WGVZWX5L.mjs.map
92
+ //# sourceMappingURL=chunk-RLUXDZ6X.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/form/radiobutton/radiobutton.tsx"],"sourcesContent":["import { forwardRef, type InputHTMLAttributes, type ReactNode } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { useFieldsetContext } from \"../fieldset\";\nimport { type RadioGroupProps, useRadioGroupContext } from \"./radiogroup\";\n\nexport interface RadiobuttonProps\n extends Omit<InputHTMLAttributes<HTMLInputElement>, \"defaultValue\"> {\n children: ReactNode;\n variant?: \"plain\" | \"bounding-box\";\n /**\n * Set to `true` to add error styling. The component will take care of aria to indicate invalid state.\n *\n * Normally you don't need this, as you should wrap your Radiobuttons in the RadioGroup component.\n * When providing an errorMessage to RadioGroup, all contained Radiobuttons will get correct hasError state.\n *\n * You can use this when your Radiobutton is part of a non-HDS fieldset which shows an error message.\n */\n hasError?: boolean;\n title?: string;\n}\n\nconst isChecked = ({\n checked,\n selectedValue,\n value,\n}: Pick<RadiobuttonProps, \"checked\" | \"value\"> & {\n selectedValue: RadioGroupProps[\"value\"];\n}) => {\n if (typeof checked !== \"undefined\") return checked;\n if (typeof selectedValue !== \"undefined\") return value === selectedValue;\n return undefined;\n};\n\nexport const Radiobutton = forwardRef<HTMLInputElement, RadiobuttonProps>(\n (\n {\n checked,\n value,\n variant = \"plain\",\n hasError: hasErrorProp,\n title,\n children,\n className,\n ...rest\n },\n ref,\n ) => {\n const {\n value: selectedValue,\n hasError: hasRadioGroupError,\n ...context\n } = useRadioGroupContext();\n const { hasError: hasFieldsetError } = useFieldsetContext();\n const hasError = hasFieldsetError || hasRadioGroupError || hasErrorProp;\n\n return (\n <div\n className={clsx(\n \"hds-radiobutton\",\n {\n [`hds-radiobutton--${variant}`]: variant === \"bounding-box\",\n \"hds-radiobutton--error\": hasError,\n },\n className as undefined,\n )}\n >\n <label>\n <input\n {...context}\n {...rest}\n checked={isChecked({ checked, selectedValue, value })}\n value={value}\n ref={ref}\n type=\"radio\"\n />\n <span aria-hidden className=\"hds-radiobutton__checkmark\" />\n {title ? <p className=\"hds-radiobutton__title\">{title}</p> : children}\n </label>\n {title ? children : null}\n </div>\n );\n },\n);\n\nRadiobutton.displayName = \"Radiobutton\";\n"],"mappings":";;;;;;;;;;;;;AAAA,SAAS,kBAA4D;AACrE,SAAS,YAAY;AAiEb,SACE,KADF;AA7CR,IAAM,YAAY,CAAC;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AACF,MAEM;AACJ,MAAI,OAAO,YAAY;AAAa,WAAO;AAC3C,MAAI,OAAO,kBAAkB;AAAa,WAAO,UAAU;AAC3D,SAAO;AACT;AAEO,IAAM,cAAc;AAAA,EACzB,CACE,IAUA,QACG;AAXH,iBACE;AAAA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,UAAU;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,IA1CN,IAmCI,IAQK,iBARL,IAQK;AAAA,MAPH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAKF,UAIIA,MAAA,qBAAqB,GAHvB;AAAA,aAAO;AAAA,MACP,UAAU;AAAA,IAjDhB,IAmDQA,KADC,oBACDA,KADC;AAAA,MAFH;AAAA,MACA;AAAA;AAGF,UAAM,EAAE,UAAU,iBAAiB,IAAI,mBAAmB;AAC1D,UAAM,WAAW,oBAAoB,sBAAsB;AAE3D,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE,CAAC,oBAAoB,OAAO,EAAE,GAAG,YAAY;AAAA,YAC7C,0BAA0B;AAAA,UAC5B;AAAA,UACA;AAAA,QACF;AAAA,QAEA;AAAA,+BAAC,WACC;AAAA;AAAA,cAAC;AAAA,8DACK,UACA,OAFL;AAAA,gBAGC,SAAS,UAAU,EAAE,SAAS,eAAe,MAAM,CAAC;AAAA,gBACpD;AAAA,gBACA;AAAA,gBACA,MAAK;AAAA;AAAA,YACP;AAAA,YACA,oBAAC,UAAK,eAAW,MAAC,WAAU,8BAA6B;AAAA,YACxD,QAAQ,oBAAC,OAAE,WAAU,0BAA0B,iBAAM,IAAO;AAAA,aAC/D;AAAA,UACC,QAAQ,WAAW;AAAA;AAAA;AAAA,IACtB;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;","names":["_a"]}
@@ -2,7 +2,7 @@ import {
2
2
  NavbarExpandableMenu,
3
3
  NavbarExpandableMenuContent,
4
4
  NavbarExpandableMenuTrigger
5
- } from "./chunk-2E6XPNPX.mjs";
5
+ } from "./chunk-DEVTAZKG.mjs";
6
6
  import {
7
7
  Navbar,
8
8
  NavbarButton,
@@ -25,4 +25,4 @@ NavbarComponent.Navigation = NavbarNavigation;
25
25
  export {
26
26
  NavbarComponent
27
27
  };
28
- //# sourceMappingURL=chunk-H3VGHTDC.mjs.map
28
+ //# sourceMappingURL=chunk-TE5M6GJB.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/navbar/index.tsx"],"sourcesContent":["import {\n Navbar,\n NavbarLogo,\n NavbarButton,\n NavbarNavigation,\n NavbarLogoAndServiceText,\n} from \"./navbar\";\nimport {\n useNavbarExpendableMenuContext,\n NavbarExpandableMenu,\n NavbarExpandableMenuTrigger,\n NavbarExpandableMenuContent,\n} from \"./navbar-expandable-menu\";\n\nconst NavbarExpandableMenuComponent = NavbarExpandableMenu as typeof NavbarExpandableMenu & {\n Trigger: typeof NavbarExpandableMenuTrigger;\n Content: typeof NavbarExpandableMenuContent;\n};\nNavbarExpandableMenuComponent.Trigger = NavbarExpandableMenuTrigger;\nNavbarExpandableMenuComponent.Content = NavbarExpandableMenuContent;\n\nconst NavbarComponent = Navbar as typeof Navbar & {\n Logo: typeof NavbarLogo;\n LogoAndServiceText: typeof NavbarLogoAndServiceText;\n ExpandableMenu: typeof NavbarExpandableMenuComponent;\n Button: typeof NavbarButton;\n Navigation: typeof NavbarNavigation;\n};\nNavbarComponent.Logo = NavbarLogo;\nNavbarComponent.LogoAndServiceText = NavbarLogoAndServiceText;\nNavbarComponent.ExpandableMenu = NavbarExpandableMenuComponent;\nNavbarComponent.Button = NavbarButton;\nNavbarComponent.Navigation = NavbarNavigation;\n\nexport { NavbarComponent as Navbar, useNavbarExpendableMenuContext };\nexport type * from \"./navbar\";\n"],"mappings":";;;;;;;;;;;;;;AAcA,IAAM,gCAAgC;AAItC,8BAA8B,UAAU;AACxC,8BAA8B,UAAU;AAExC,IAAM,kBAAkB;AAOxB,gBAAgB,OAAO;AACvB,gBAAgB,qBAAqB;AACrC,gBAAgB,iBAAiB;AACjC,gBAAgB,SAAS;AACzB,gBAAgB,aAAa;","names":[]}
@@ -0,0 +1,19 @@
1
+ import {
2
+ Footer,
3
+ FooterButtonLink,
4
+ FooterLinkSection,
5
+ FooterLinkSections,
6
+ FooterLogo
7
+ } from "./chunk-EHUVLDIZ.mjs";
8
+
9
+ // src/footer/index.tsx
10
+ var FooterComponent = Footer;
11
+ FooterComponent.Logo = FooterLogo;
12
+ FooterComponent.ButtonLink = FooterButtonLink;
13
+ FooterComponent.LinkSections = FooterLinkSections;
14
+ FooterComponent.LinkSection = FooterLinkSection;
15
+
16
+ export {
17
+ FooterComponent
18
+ };
19
+ //# sourceMappingURL=chunk-U2MRMUB2.mjs.map