@postenbring/hedwig-react 0.0.87 → 0.0.88
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.
- package/dist/badge/badge.d.ts +7 -3
- package/dist/badge/badge.d.ts.map +1 -1
- package/dist/badge/badge.js.map +1 -1
- package/dist/badge/badge.mjs +1 -1
- package/dist/badge/index.js.map +1 -1
- package/dist/badge/index.mjs +1 -1
- package/dist/blockquote/blockquote.d.ts +29 -0
- package/dist/blockquote/blockquote.d.ts.map +1 -0
- package/dist/blockquote/blockquote.js +83 -0
- package/dist/blockquote/blockquote.js.map +1 -0
- package/dist/blockquote/blockquote.mjs +8 -0
- package/dist/blockquote/index.d.ts +3 -0
- package/dist/blockquote/index.d.ts.map +1 -0
- package/dist/blockquote/index.js +85 -0
- package/dist/blockquote/index.js.map +1 -0
- package/dist/blockquote/index.mjs +9 -0
- package/dist/chunk-3H7S7C3S.mjs +37 -0
- package/dist/chunk-3H7S7C3S.mjs.map +1 -0
- package/dist/{chunk-YIERXOCG.mjs → chunk-6ZO2TMOX.mjs} +2 -2
- package/dist/{chunk-F4EAUOJX.mjs → chunk-EAFQ3XQU.mjs} +2 -2
- package/dist/{chunk-OFY2FVXB.mjs → chunk-EGW3RCXD.mjs} +2 -2
- package/dist/chunk-EGW3RCXD.mjs.map +1 -0
- package/dist/{chunk-WEQIEPMT.mjs → chunk-JQGB77SS.mjs} +1 -1
- package/dist/chunk-JQGB77SS.mjs.map +1 -0
- package/dist/chunk-JYN2QSN2.mjs +36 -0
- package/dist/chunk-JYN2QSN2.mjs.map +1 -0
- package/dist/chunk-KFDS3IPB.mjs +1 -0
- package/dist/{chunk-YLBJMVIX.mjs → chunk-M7MG7ZQT.mjs} +2 -2
- package/dist/{chunk-TCO3ZAZW.mjs → chunk-OXZOGFNV.mjs} +1 -1
- package/dist/chunk-OXZOGFNV.mjs.map +1 -0
- package/dist/{chunk-GUNPGSAS.mjs → chunk-UL2V2Z5B.mjs} +12 -12
- package/dist/chunk-UL2V2Z5B.mjs.map +1 -0
- package/dist/chunk-XAFNJELJ.mjs +1 -0
- package/dist/{chunk-ZYTUK4B4.mjs → chunk-YS7HBWOI.mjs} +4 -3
- package/dist/chunk-YS7HBWOI.mjs.map +1 -0
- package/dist/form/checkbox/checkbox.js.map +1 -1
- package/dist/form/checkbox/checkbox.mjs +2 -2
- package/dist/form/checkbox/index.js.map +1 -1
- package/dist/form/checkbox/index.mjs +2 -2
- package/dist/form/fieldset/fieldset.d.ts +2 -2
- package/dist/form/fieldset/fieldset.js.map +1 -1
- package/dist/form/fieldset/fieldset.mjs +1 -1
- package/dist/form/fieldset/index.js.map +1 -1
- package/dist/form/fieldset/index.mjs +1 -1
- package/dist/form/index.d.ts +1 -1
- package/dist/form/index.d.ts.map +1 -1
- package/dist/form/index.js +13 -12
- package/dist/form/index.js.map +1 -1
- package/dist/form/index.mjs +17 -17
- package/dist/form/radio-button/index.d.ts +5 -0
- package/dist/form/radio-button/index.d.ts.map +1 -0
- package/dist/form/{radiobutton → radio-button}/index.js +17 -16
- package/dist/form/radio-button/index.js.map +1 -0
- package/dist/form/{radiobutton → radio-button}/index.mjs +6 -6
- package/dist/form/radio-button/index.mjs.map +1 -0
- package/dist/form/{radiobutton/radiobutton.d.ts → radio-button/radio-button.d.ts} +6 -6
- package/dist/form/radio-button/radio-button.d.ts.map +1 -0
- package/dist/form/{radiobutton/radiobutton.js → radio-button/radio-button.js} +17 -16
- package/dist/form/radio-button/radio-button.js.map +1 -0
- package/dist/form/radio-button/radio-button.mjs +13 -0
- package/dist/form/radio-button/radio-button.mjs.map +1 -0
- package/dist/form/{radiobutton/radiogroup.d.ts → radio-button/radio-group.d.ts} +7 -7
- package/dist/form/radio-button/radio-group.d.ts.map +1 -0
- package/dist/form/{radiobutton/radiogroup.js → radio-button/radio-group.js} +7 -6
- package/dist/form/radio-button/radio-group.js.map +1 -0
- package/dist/form/{radiobutton/radiogroup.mjs → radio-button/radio-group.mjs} +3 -3
- package/dist/form/radio-button/radio-group.mjs.map +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +538 -498
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +58 -53
- package/dist/navbar/icons.d.ts.map +1 -1
- package/dist/navbar/icons.js +16 -5
- package/dist/navbar/icons.js.map +1 -1
- package/dist/navbar/icons.mjs +1 -1
- package/dist/navbar/index.js +16 -5
- package/dist/navbar/index.js.map +1 -1
- package/dist/navbar/index.mjs +3 -3
- package/dist/navbar/navbar-expandable-menu.js +16 -5
- package/dist/navbar/navbar-expandable-menu.js.map +1 -1
- package/dist/navbar/navbar-expandable-menu.mjs +2 -2
- package/dist/navbar/navbar.js +16 -5
- package/dist/navbar/navbar.js.map +1 -1
- package/dist/navbar/navbar.mjs +3 -3
- package/dist/styled-html/index.js +1 -1
- package/dist/styled-html/index.js.map +1 -1
- package/dist/styled-html/index.mjs +1 -1
- package/dist/styled-html/styled-html.d.ts +9 -1
- package/dist/styled-html/styled-html.d.ts.map +1 -1
- package/dist/styled-html/styled-html.js +1 -1
- package/dist/styled-html/styled-html.js.map +1 -1
- package/dist/styled-html/styled-html.mjs +1 -1
- package/package.json +2 -2
- package/src/accordion/accordion.stories.tsx +7 -113
- package/src/badge/badge.stories.tsx +1 -30
- package/src/badge/badge.tsx +7 -3
- package/src/blockquote/blockquote.stories.tsx +21 -0
- package/src/blockquote/blockquote.tsx +52 -0
- package/src/blockquote/index.tsx +3 -0
- package/src/box/box.stories.tsx +13 -84
- package/src/breadcrumbs/breadcrumbs.stories.tsx +7 -22
- package/src/button/button.stories.tsx +1 -85
- package/src/card/card.stories.tsx +1 -42
- package/src/description-list/description-list.stories.tsx +5 -71
- package/src/form/checkbox/checkbox.stories.tsx +4 -80
- package/src/form/date-picker/date-picker.stories.tsx +7 -7
- package/src/form/error-message/error-message.stories.tsx +2 -2
- package/src/form/fieldset/fieldset.stories.tsx +1 -58
- package/src/form/fieldset/fieldset.tsx +2 -2
- package/src/form/index.tsx +1 -1
- package/src/form/input/input.stories.tsx +1 -142
- package/src/form/radio-button/index.tsx +4 -0
- package/src/form/radio-button/radio-button.stories.tsx +25 -0
- package/src/form/{radiobutton/radiobutton.tsx → radio-button/radio-button.tsx} +13 -13
- package/src/form/{radiobutton/radiogroup.stories.tsx → radio-button/radio-group.stories.tsx} +8 -9
- package/src/form/{radiobutton/radiogroup.tsx → radio-button/radio-group.tsx} +7 -6
- package/src/form/select/select.stories.tsx +1 -61
- package/src/form/textarea/textarea.stories.tsx +4 -85
- package/src/help-text/help-text.stories.tsx +19 -0
- package/src/index.ts +1 -0
- package/src/layout/container/container.stories.tsx +17 -14
- package/src/layout/grid/grid.stories.tsx +27 -0
- package/src/layout/stack/stack.stories.tsx +27 -0
- package/src/link/link.stories.tsx +7 -38
- package/src/list/link-list.stories.tsx +24 -27
- package/src/list/list.stories.tsx +10 -48
- package/src/message/message.stories.tsx +7 -65
- package/src/modal/modal.stories.tsx +1 -103
- package/src/navbar/icons.tsx +10 -3
- package/src/navbar/navbar.stories.tsx +22 -62
- package/src/show-more/show-more.stories.tsx +2 -98
- package/src/skeleton/skeleton.stories.tsx +2 -126
- package/src/step-indicator/step-indicator.stories.tsx +1 -31
- package/src/styled-html/styled-html.stories.tsx +21 -155
- package/src/styled-html/styled-html.tsx +12 -2
- package/src/table/table.stories.tsx +42 -0
- package/src/tabs/tabs.stories.tsx +7 -114
- package/src/text/text.stories.tsx +17 -83
- package/src/warning-banner/warning-banner.stories.tsx +1 -23
- package/dist/chunk-2KX7VFN2.mjs +0 -1
- package/dist/chunk-GUNPGSAS.mjs.map +0 -1
- package/dist/chunk-MOU6WBT2.mjs +0 -26
- package/dist/chunk-MOU6WBT2.mjs.map +0 -1
- package/dist/chunk-OFY2FVXB.mjs.map +0 -1
- package/dist/chunk-TCO3ZAZW.mjs.map +0 -1
- package/dist/chunk-WEQIEPMT.mjs.map +0 -1
- package/dist/chunk-ZYTUK4B4.mjs.map +0 -1
- package/dist/form/radiobutton/index.d.ts +0 -5
- package/dist/form/radiobutton/index.d.ts.map +0 -1
- package/dist/form/radiobutton/index.js.map +0 -1
- package/dist/form/radiobutton/radiobutton.d.ts.map +0 -1
- package/dist/form/radiobutton/radiobutton.js.map +0 -1
- package/dist/form/radiobutton/radiobutton.mjs +0 -13
- package/dist/form/radiobutton/radiogroup.d.ts.map +0 -1
- package/dist/form/radiobutton/radiogroup.js.map +0 -1
- package/src/form/radiobutton/index.tsx +0 -4
- package/src/form/radiobutton/radiobutton.stories.tsx +0 -93
- /package/dist/{chunk-2KX7VFN2.mjs.map → blockquote/blockquote.mjs.map} +0 -0
- /package/dist/{form/radiobutton → blockquote}/index.mjs.map +0 -0
- /package/dist/{chunk-YIERXOCG.mjs.map → chunk-6ZO2TMOX.mjs.map} +0 -0
- /package/dist/{chunk-F4EAUOJX.mjs.map → chunk-EAFQ3XQU.mjs.map} +0 -0
- /package/dist/{form/radiobutton/radiobutton.mjs.map → chunk-KFDS3IPB.mjs.map} +0 -0
- /package/dist/{chunk-YLBJMVIX.mjs.map → chunk-M7MG7ZQT.mjs.map} +0 -0
- /package/dist/{form/radiobutton/radiogroup.mjs.map → chunk-XAFNJELJ.mjs.map} +0 -0
package/dist/index.js
CHANGED
|
@@ -65,6 +65,7 @@ __export(src_exports, {
|
|
|
65
65
|
AccordionItem: () => AccordionItem,
|
|
66
66
|
AutoAnimateHeight: () => AutoAnimateHeight,
|
|
67
67
|
Badge: () => Badge,
|
|
68
|
+
Blockquote: () => Blockquote,
|
|
68
69
|
Box: () => Box,
|
|
69
70
|
BoxCloseButton: () => BoxCloseButton,
|
|
70
71
|
Breadcrumbs: () => Breadcrumbs,
|
|
@@ -116,8 +117,8 @@ __export(src_exports, {
|
|
|
116
117
|
NavbarLogoAndServiceText: () => NavbarLogoAndServiceText,
|
|
117
118
|
NavbarNavigation: () => NavbarNavigation,
|
|
118
119
|
OrderedList: () => OrderedList,
|
|
120
|
+
RadioButton: () => RadioButton,
|
|
119
121
|
RadioGroup: () => RadioGroup,
|
|
120
|
-
Radiobutton: () => Radiobutton,
|
|
121
122
|
Select: () => Select,
|
|
122
123
|
ShowMoreButton: () => ShowMoreButton,
|
|
123
124
|
Skeleton: () => Skeleton,
|
|
@@ -296,18 +297,44 @@ var Badge = (0, import_react6.forwardRef)(
|
|
|
296
297
|
);
|
|
297
298
|
Badge.displayName = "Badge";
|
|
298
299
|
|
|
299
|
-
// src/
|
|
300
|
-
var import_react7 = require("react");
|
|
300
|
+
// src/blockquote/blockquote.tsx
|
|
301
301
|
var import_typed_classname6 = require("@postenbring/hedwig-css/typed-classname");
|
|
302
302
|
var import_react_slot2 = require("@radix-ui/react-slot");
|
|
303
|
+
var import_react7 = require("react");
|
|
303
304
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
304
|
-
var
|
|
305
|
+
var Blockquote = (0, import_react7.forwardRef)(
|
|
305
306
|
(_a, ref) => {
|
|
306
|
-
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
|
307
|
+
var _b = _a, { children, asChild, className, variant } = _b, rest = __objRest(_b, ["children", "asChild", "className", "variant"]);
|
|
308
|
+
const Component = asChild ? import_react_slot2.Slot : "blockquote";
|
|
307
309
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
310
|
+
Component,
|
|
311
|
+
__spreadProps(__spreadValues({
|
|
312
|
+
ref,
|
|
313
|
+
className: (0, import_typed_classname6.clsx)(
|
|
314
|
+
"hds-blockquote",
|
|
315
|
+
variant === "norwegian" && `hds-blockquote--norwegian`,
|
|
316
|
+
className
|
|
317
|
+
)
|
|
318
|
+
}, rest), {
|
|
319
|
+
children
|
|
320
|
+
})
|
|
321
|
+
);
|
|
322
|
+
}
|
|
323
|
+
);
|
|
324
|
+
Blockquote.displayName = "Blockquote";
|
|
325
|
+
|
|
326
|
+
// src/box/box.tsx
|
|
327
|
+
var import_react8 = require("react");
|
|
328
|
+
var import_typed_classname7 = require("@postenbring/hedwig-css/typed-classname");
|
|
329
|
+
var import_react_slot3 = require("@radix-ui/react-slot");
|
|
330
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
331
|
+
var BoxCloseButton = (0, import_react8.forwardRef)(
|
|
332
|
+
(_a, ref) => {
|
|
333
|
+
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
|
334
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
308
335
|
"button",
|
|
309
336
|
__spreadValues({
|
|
310
|
-
className: (0,
|
|
337
|
+
className: (0, import_typed_classname7.clsx)("hds-box__close-button", className),
|
|
311
338
|
ref,
|
|
312
339
|
type: "button"
|
|
313
340
|
}, rest)
|
|
@@ -315,7 +342,7 @@ var BoxCloseButton = (0, import_react7.forwardRef)(
|
|
|
315
342
|
}
|
|
316
343
|
);
|
|
317
344
|
BoxCloseButton.displayName = "Box.CloseButton";
|
|
318
|
-
var Box = (0,
|
|
345
|
+
var Box = (0, import_react8.forwardRef)(
|
|
319
346
|
(_a, ref) => {
|
|
320
347
|
var _b = _a, {
|
|
321
348
|
asChild,
|
|
@@ -336,8 +363,8 @@ var Box = (0, import_react7.forwardRef)(
|
|
|
336
363
|
"children",
|
|
337
364
|
"className"
|
|
338
365
|
]);
|
|
339
|
-
const [closedState, setClosedState] = (0,
|
|
340
|
-
const onClose = (0,
|
|
366
|
+
const [closedState, setClosedState] = (0, import_react8.useState)(false);
|
|
367
|
+
const onClose = (0, import_react8.useCallback)(() => {
|
|
341
368
|
if (onCloseProp) {
|
|
342
369
|
const result = onCloseProp();
|
|
343
370
|
if (result === true) {
|
|
@@ -348,11 +375,11 @@ var Box = (0, import_react7.forwardRef)(
|
|
|
348
375
|
}
|
|
349
376
|
}, []);
|
|
350
377
|
const closed = closedProp != null ? closedProp : closedState;
|
|
351
|
-
const Component = asChild ?
|
|
352
|
-
return /* @__PURE__ */ (0,
|
|
378
|
+
const Component = asChild ? import_react_slot3.Slot : "div";
|
|
379
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
|
|
353
380
|
Component,
|
|
354
381
|
__spreadProps(__spreadValues({
|
|
355
|
-
className: (0,
|
|
382
|
+
className: (0, import_typed_classname7.clsx)(
|
|
356
383
|
"hds-box",
|
|
357
384
|
variant && `hds-box--${variant}`,
|
|
358
385
|
{ "hds-box--closed": closed },
|
|
@@ -361,8 +388,8 @@ var Box = (0, import_react7.forwardRef)(
|
|
|
361
388
|
ref
|
|
362
389
|
}, rest), {
|
|
363
390
|
children: [
|
|
364
|
-
closeable ? /* @__PURE__ */ (0,
|
|
365
|
-
/* @__PURE__ */ (0,
|
|
391
|
+
closeable ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BoxCloseButton, __spreadValues({ onClick: onClose }, closeButtonProps)) : null,
|
|
392
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react_slot3.Slottable, { children })
|
|
366
393
|
]
|
|
367
394
|
})
|
|
368
395
|
);
|
|
@@ -372,23 +399,23 @@ Box.displayName = "Box";
|
|
|
372
399
|
Box.CloseButton = BoxCloseButton;
|
|
373
400
|
|
|
374
401
|
// src/breadcrumbs/breadcrumbs.tsx
|
|
375
|
-
var
|
|
376
|
-
var
|
|
377
|
-
var
|
|
378
|
-
var Breadcrumbs = (0,
|
|
402
|
+
var import_react9 = require("react");
|
|
403
|
+
var import_typed_classname8 = require("@postenbring/hedwig-css/typed-classname");
|
|
404
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
405
|
+
var Breadcrumbs = (0, import_react9.forwardRef)(
|
|
379
406
|
(_a, ref) => {
|
|
380
407
|
var _b = _a, { olProps, children } = _b, rest = __objRest(_b, ["olProps", "children"]);
|
|
381
|
-
return /* @__PURE__ */ (0,
|
|
408
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("nav", __spreadProps(__spreadValues({ ref }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("ol", __spreadProps(__spreadValues({}, olProps), { className: (0, import_typed_classname8.clsx)("hds-breadcrumbs", olProps == null ? void 0 : olProps.className), children })) }));
|
|
382
409
|
}
|
|
383
410
|
);
|
|
384
411
|
Breadcrumbs.displayName = "Breadcrumbs";
|
|
385
412
|
|
|
386
413
|
// src/button/button.tsx
|
|
387
|
-
var
|
|
388
|
-
var
|
|
389
|
-
var
|
|
390
|
-
var
|
|
391
|
-
var Button = (0,
|
|
414
|
+
var import_react10 = require("react");
|
|
415
|
+
var import_typed_classname9 = require("@postenbring/hedwig-css/typed-classname");
|
|
416
|
+
var import_react_slot4 = require("@radix-ui/react-slot");
|
|
417
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
418
|
+
var Button = (0, import_react10.forwardRef)(
|
|
392
419
|
(_a, ref) => {
|
|
393
420
|
var _b = _a, {
|
|
394
421
|
asChild,
|
|
@@ -407,11 +434,11 @@ var Button = (0, import_react9.forwardRef)(
|
|
|
407
434
|
"icon",
|
|
408
435
|
"className"
|
|
409
436
|
]);
|
|
410
|
-
const Component = asChild ?
|
|
411
|
-
return /* @__PURE__ */ (0,
|
|
437
|
+
const Component = asChild ? import_react_slot4.Slot : "button";
|
|
438
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
412
439
|
Component,
|
|
413
440
|
__spreadProps(__spreadValues({
|
|
414
|
-
className: (0,
|
|
441
|
+
className: (0, import_typed_classname9.clsx)(
|
|
415
442
|
"hds-button",
|
|
416
443
|
`hds-button--${size}`,
|
|
417
444
|
`hds-button--${variant}`,
|
|
@@ -432,61 +459,61 @@ var Button = (0, import_react9.forwardRef)(
|
|
|
432
459
|
Button.displayName = "Button";
|
|
433
460
|
|
|
434
461
|
// src/card/card.tsx
|
|
435
|
-
var
|
|
436
|
-
var
|
|
437
|
-
var
|
|
438
|
-
var
|
|
439
|
-
var CardMedia = (0,
|
|
462
|
+
var import_react11 = require("react");
|
|
463
|
+
var import_typed_classname10 = require("@postenbring/hedwig-css/typed-classname");
|
|
464
|
+
var import_react_slot5 = require("@radix-ui/react-slot");
|
|
465
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
466
|
+
var CardMedia = (0, import_react11.forwardRef)(
|
|
440
467
|
(_a, ref) => {
|
|
441
468
|
var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
|
|
442
|
-
const Component = asChild ?
|
|
443
|
-
return /* @__PURE__ */ (0,
|
|
469
|
+
const Component = asChild ? import_react_slot5.Slot : "div";
|
|
470
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Component, __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname10.clsx)("hds-card__media", className), ref, children }));
|
|
444
471
|
}
|
|
445
472
|
);
|
|
446
473
|
CardMedia.displayName = "Card.Media";
|
|
447
|
-
var CardMediaImg = (0,
|
|
474
|
+
var CardMediaImg = (0, import_react11.forwardRef)(
|
|
448
475
|
(_a, ref) => {
|
|
449
476
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
450
|
-
const Component = asChild ?
|
|
451
|
-
return /* @__PURE__ */ (0,
|
|
477
|
+
const Component = asChild ? import_react_slot5.Slot : "img";
|
|
478
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
452
479
|
Component,
|
|
453
480
|
__spreadProps(__spreadValues({}, rest), {
|
|
454
|
-
className: (0,
|
|
481
|
+
className: (0, import_typed_classname10.clsx)("hds-card__media__img", className),
|
|
455
482
|
ref
|
|
456
483
|
})
|
|
457
484
|
);
|
|
458
485
|
}
|
|
459
486
|
);
|
|
460
487
|
CardMediaImg.displayName = "Card.MediaImg";
|
|
461
|
-
var CardBody = (0,
|
|
488
|
+
var CardBody = (0, import_react11.forwardRef)(
|
|
462
489
|
(_a, ref) => {
|
|
463
490
|
var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
|
|
464
|
-
const Component = asChild ?
|
|
465
|
-
return /* @__PURE__ */ (0,
|
|
491
|
+
const Component = asChild ? import_react_slot5.Slot : "div";
|
|
492
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Component, __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname10.clsx)("hds-card__body", className), ref, children }));
|
|
466
493
|
}
|
|
467
494
|
);
|
|
468
495
|
CardBody.displayName = "Card.Body";
|
|
469
|
-
var CardBodyHeader = (0,
|
|
496
|
+
var CardBodyHeader = (0, import_react11.forwardRef)((_a, ref) => {
|
|
470
497
|
var _b = _a, { as: Tag, asChild, className, children } = _b, rest = __objRest(_b, ["as", "asChild", "className", "children"]);
|
|
471
|
-
const Component = asChild ?
|
|
472
|
-
return /* @__PURE__ */ (0,
|
|
498
|
+
const Component = asChild ? import_react_slot5.Slot : Tag;
|
|
499
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
473
500
|
Component,
|
|
474
501
|
__spreadProps(__spreadValues({}, rest), {
|
|
475
|
-
className: (0,
|
|
502
|
+
className: (0, import_typed_classname10.clsx)("hds-card__body-header", className),
|
|
476
503
|
ref,
|
|
477
504
|
children
|
|
478
505
|
})
|
|
479
506
|
);
|
|
480
507
|
});
|
|
481
508
|
CardBodyHeader.displayName = "Card.BodyHeader";
|
|
482
|
-
var CardBodyHeaderOverline = (0,
|
|
509
|
+
var CardBodyHeaderOverline = (0, import_react11.forwardRef)(
|
|
483
510
|
(_a, ref) => {
|
|
484
511
|
var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
|
|
485
|
-
const Component = asChild ?
|
|
486
|
-
return /* @__PURE__ */ (0,
|
|
512
|
+
const Component = asChild ? import_react_slot5.Slot : "span";
|
|
513
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
487
514
|
Component,
|
|
488
515
|
__spreadProps(__spreadValues({}, rest), {
|
|
489
|
-
className: (0,
|
|
516
|
+
className: (0, import_typed_classname10.clsx)("hds-card__body-header-overline", className),
|
|
490
517
|
ref,
|
|
491
518
|
children
|
|
492
519
|
})
|
|
@@ -494,14 +521,14 @@ var CardBodyHeaderOverline = (0, import_react10.forwardRef)(
|
|
|
494
521
|
}
|
|
495
522
|
);
|
|
496
523
|
CardBodyHeaderOverline.displayName = "Card.BodyHeaderOverline";
|
|
497
|
-
var CardBodyHeaderTitle = (0,
|
|
524
|
+
var CardBodyHeaderTitle = (0, import_react11.forwardRef)(
|
|
498
525
|
(_a, ref) => {
|
|
499
526
|
var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
|
|
500
|
-
const Component = asChild ?
|
|
501
|
-
return /* @__PURE__ */ (0,
|
|
527
|
+
const Component = asChild ? import_react_slot5.Slot : "div";
|
|
528
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
502
529
|
Component,
|
|
503
530
|
__spreadProps(__spreadValues({}, rest), {
|
|
504
|
-
className: (0,
|
|
531
|
+
className: (0, import_typed_classname10.clsx)("hds-card__body-header-title", className),
|
|
505
532
|
ref,
|
|
506
533
|
children
|
|
507
534
|
})
|
|
@@ -509,14 +536,14 @@ var CardBodyHeaderTitle = (0, import_react10.forwardRef)(
|
|
|
509
536
|
}
|
|
510
537
|
);
|
|
511
538
|
CardBodyHeaderTitle.displayName = "Card.BodyHeaderTitle";
|
|
512
|
-
var CardBodyDescription = (0,
|
|
539
|
+
var CardBodyDescription = (0, import_react11.forwardRef)(
|
|
513
540
|
(_a, ref) => {
|
|
514
541
|
var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
|
|
515
|
-
const Component = asChild ?
|
|
516
|
-
return /* @__PURE__ */ (0,
|
|
542
|
+
const Component = asChild ? import_react_slot5.Slot : "p";
|
|
543
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
517
544
|
Component,
|
|
518
545
|
__spreadProps(__spreadValues({}, rest), {
|
|
519
|
-
className: (0,
|
|
546
|
+
className: (0, import_typed_classname10.clsx)("hds-card__body-description", className),
|
|
520
547
|
ref,
|
|
521
548
|
children
|
|
522
549
|
})
|
|
@@ -524,14 +551,14 @@ var CardBodyDescription = (0, import_react10.forwardRef)(
|
|
|
524
551
|
}
|
|
525
552
|
);
|
|
526
553
|
CardBodyDescription.displayName = "Card.BodyDescription";
|
|
527
|
-
var CardBodyAction = (0,
|
|
554
|
+
var CardBodyAction = (0, import_react11.forwardRef)(
|
|
528
555
|
(_a, ref) => {
|
|
529
556
|
var _b = _a, { asChild, className, children } = _b, rest = __objRest(_b, ["asChild", "className", "children"]);
|
|
530
|
-
const Component = asChild ?
|
|
531
|
-
return /* @__PURE__ */ (0,
|
|
557
|
+
const Component = asChild ? import_react_slot5.Slot : "div";
|
|
558
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
532
559
|
Component,
|
|
533
560
|
__spreadProps(__spreadValues({}, rest), {
|
|
534
|
-
className: (0,
|
|
561
|
+
className: (0, import_typed_classname10.clsx)("hds-card__body-action", className),
|
|
535
562
|
ref,
|
|
536
563
|
children
|
|
537
564
|
})
|
|
@@ -539,25 +566,25 @@ var CardBodyAction = (0, import_react10.forwardRef)(
|
|
|
539
566
|
}
|
|
540
567
|
);
|
|
541
568
|
CardBodyAction.displayName = "Card.BodyAction";
|
|
542
|
-
var CardBodyActionArrow = (0,
|
|
569
|
+
var CardBodyActionArrow = (0, import_react11.forwardRef)(
|
|
543
570
|
(_a, ref) => {
|
|
544
571
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
545
|
-
const Component = asChild ?
|
|
546
|
-
return /* @__PURE__ */ (0,
|
|
572
|
+
const Component = asChild ? import_react_slot5.Slot : "span";
|
|
573
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
547
574
|
Component,
|
|
548
575
|
__spreadProps(__spreadValues({}, rest), {
|
|
549
|
-
className: (0,
|
|
576
|
+
className: (0, import_typed_classname10.clsx)("hds-card__body-action-arrow", className),
|
|
550
577
|
ref
|
|
551
578
|
})
|
|
552
579
|
);
|
|
553
580
|
}
|
|
554
581
|
);
|
|
555
582
|
CardBodyActionArrow.displayName = "Card.BodyActionArrow";
|
|
556
|
-
var Card = (0,
|
|
583
|
+
var Card = (0, import_react11.forwardRef)(
|
|
557
584
|
(_a, ref) => {
|
|
558
585
|
var _b = _a, { as: Tag = "section", asChild, className, children } = _b, rest = __objRest(_b, ["as", "asChild", "className", "children"]);
|
|
559
|
-
const Component = asChild ?
|
|
560
|
-
return /* @__PURE__ */ (0,
|
|
586
|
+
const Component = asChild ? import_react_slot5.Slot : Tag;
|
|
587
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Component, __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname10.clsx)("hds-card", className), ref, children }));
|
|
561
588
|
}
|
|
562
589
|
);
|
|
563
590
|
Card.displayName = "Card";
|
|
@@ -572,17 +599,17 @@ Card.BodyAction = CardBodyAction;
|
|
|
572
599
|
Card.BodyActionArrow = CardBodyActionArrow;
|
|
573
600
|
|
|
574
601
|
// src/description-list/description-list.tsx
|
|
575
|
-
var
|
|
576
|
-
var
|
|
577
|
-
var
|
|
578
|
-
var DescriptionList = (0,
|
|
602
|
+
var import_react12 = require("react");
|
|
603
|
+
var import_typed_classname11 = require("@postenbring/hedwig-css/typed-classname");
|
|
604
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
605
|
+
var DescriptionList = (0, import_react12.forwardRef)(
|
|
579
606
|
(_a, ref) => {
|
|
580
607
|
var _b = _a, { variant = "vertical", className } = _b, rest = __objRest(_b, ["variant", "className"]);
|
|
581
|
-
return /* @__PURE__ */ (0,
|
|
608
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
582
609
|
"dl",
|
|
583
610
|
__spreadValues({
|
|
584
611
|
ref,
|
|
585
|
-
className: (0,
|
|
612
|
+
className: (0, import_typed_classname11.clsx)(
|
|
586
613
|
"hds-description-list",
|
|
587
614
|
{
|
|
588
615
|
"hds-description-list--horizontal": variant === "horizontal"
|
|
@@ -596,21 +623,21 @@ var DescriptionList = (0, import_react11.forwardRef)(
|
|
|
596
623
|
DescriptionList.displayName = "DescriptionList";
|
|
597
624
|
|
|
598
625
|
// src/form/checkbox/checkbox.tsx
|
|
599
|
-
var
|
|
600
|
-
var
|
|
626
|
+
var import_react15 = require("react");
|
|
627
|
+
var import_typed_classname14 = require("@postenbring/hedwig-css/typed-classname");
|
|
601
628
|
|
|
602
629
|
// src/form/error-message/error-message.tsx
|
|
603
|
-
var
|
|
604
|
-
var
|
|
605
|
-
var
|
|
606
|
-
var ErrorMessage = (0,
|
|
630
|
+
var import_typed_classname12 = require("@postenbring/hedwig-css/typed-classname");
|
|
631
|
+
var import_react13 = require("react");
|
|
632
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
633
|
+
var ErrorMessage = (0, import_react13.forwardRef)(
|
|
607
634
|
(_a, ref) => {
|
|
608
635
|
var _b = _a, { children, id, className } = _b, rest = __objRest(_b, ["children", "id", "className"]);
|
|
609
|
-
return /* @__PURE__ */ (0,
|
|
636
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
610
637
|
"div",
|
|
611
638
|
__spreadProps(__spreadValues({
|
|
612
639
|
"aria-live": "assertive",
|
|
613
|
-
className: (0,
|
|
640
|
+
className: (0, import_typed_classname12.clsx)("hds-error-message", className),
|
|
614
641
|
id,
|
|
615
642
|
ref
|
|
616
643
|
}, rest), {
|
|
@@ -622,12 +649,12 @@ var ErrorMessage = (0, import_react12.forwardRef)(
|
|
|
622
649
|
ErrorMessage.displayName = "ErrorMessage";
|
|
623
650
|
|
|
624
651
|
// src/form/fieldset/fieldset.tsx
|
|
625
|
-
var
|
|
626
|
-
var
|
|
627
|
-
var
|
|
628
|
-
var FieldsetContext = (0,
|
|
629
|
-
var useFieldsetContext = () => (0,
|
|
630
|
-
var Fieldset = (0,
|
|
652
|
+
var import_react14 = require("react");
|
|
653
|
+
var import_typed_classname13 = require("@postenbring/hedwig-css/typed-classname");
|
|
654
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
655
|
+
var FieldsetContext = (0, import_react14.createContext)({ hasError: false });
|
|
656
|
+
var useFieldsetContext = () => (0, import_react14.useContext)(FieldsetContext);
|
|
657
|
+
var Fieldset = (0, import_react14.forwardRef)(function Fieldset2(_a, ref) {
|
|
631
658
|
var _b = _a, {
|
|
632
659
|
className,
|
|
633
660
|
style,
|
|
@@ -644,21 +671,21 @@ var Fieldset = (0, import_react13.forwardRef)(function Fieldset2(_a, ref) {
|
|
|
644
671
|
"legend",
|
|
645
672
|
"children"
|
|
646
673
|
]);
|
|
647
|
-
const errorMessageId = (0,
|
|
648
|
-
return /* @__PURE__ */ (0,
|
|
674
|
+
const errorMessageId = (0, import_react14.useId)();
|
|
675
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
|
|
649
676
|
"fieldset",
|
|
650
677
|
__spreadProps(__spreadValues({
|
|
651
678
|
"aria-describedby": errorMessage ? errorMessageId : void 0,
|
|
652
679
|
"aria-invalid": errorMessage ? true : void 0,
|
|
653
|
-
className: (0,
|
|
680
|
+
className: (0, import_typed_classname13.clsx)("hds-fieldset", className),
|
|
654
681
|
ref,
|
|
655
682
|
style
|
|
656
683
|
}, rest), {
|
|
657
684
|
children: [
|
|
658
|
-
/* @__PURE__ */ (0,
|
|
685
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
659
686
|
"legend",
|
|
660
687
|
__spreadProps(__spreadValues({
|
|
661
|
-
className: (0,
|
|
688
|
+
className: (0, import_typed_classname13.clsx)(
|
|
662
689
|
"hds-fieldset__legend",
|
|
663
690
|
{ [`hds-fieldset__legend--${legendSize}`]: legendSize },
|
|
664
691
|
legendClassName
|
|
@@ -667,16 +694,16 @@ var Fieldset = (0, import_react13.forwardRef)(function Fieldset2(_a, ref) {
|
|
|
667
694
|
children: legend
|
|
668
695
|
})
|
|
669
696
|
),
|
|
670
|
-
/* @__PURE__ */ (0,
|
|
671
|
-
/* @__PURE__ */ (0,
|
|
697
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(FieldsetContext.Provider, { value: { hasError: Boolean(errorMessage) }, children }),
|
|
698
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ErrorMessage, { id: errorMessageId, children: errorMessage })
|
|
672
699
|
]
|
|
673
700
|
})
|
|
674
701
|
);
|
|
675
702
|
});
|
|
676
703
|
|
|
677
704
|
// src/form/checkbox/checkbox.tsx
|
|
678
|
-
var
|
|
679
|
-
var Checkbox = (0,
|
|
705
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
706
|
+
var Checkbox = (0, import_react15.forwardRef)(
|
|
680
707
|
(_a, ref) => {
|
|
681
708
|
var _b = _a, {
|
|
682
709
|
variant = "plain",
|
|
@@ -693,14 +720,14 @@ var Checkbox = (0, import_react14.forwardRef)(
|
|
|
693
720
|
"children",
|
|
694
721
|
"className"
|
|
695
722
|
]);
|
|
696
|
-
const errorMessageId = (0,
|
|
723
|
+
const errorMessageId = (0, import_react15.useId)();
|
|
697
724
|
const { hasError: hasFieldsetError } = useFieldsetContext();
|
|
698
725
|
const hasError = !!errorMessage || hasFieldsetError || hasErrorProp;
|
|
699
|
-
return /* @__PURE__ */ (0,
|
|
700
|
-
/* @__PURE__ */ (0,
|
|
726
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: (0, import_typed_classname14.clsx)("hds-checkbox-wrapper"), children: [
|
|
727
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
|
|
701
728
|
"div",
|
|
702
729
|
{
|
|
703
|
-
className: (0,
|
|
730
|
+
className: (0, import_typed_classname14.clsx)(
|
|
704
731
|
"hds-checkbox",
|
|
705
732
|
{
|
|
706
733
|
[`hds-checkbox--${variant}`]: variant === "bounding-box",
|
|
@@ -709,8 +736,8 @@ var Checkbox = (0, import_react14.forwardRef)(
|
|
|
709
736
|
className
|
|
710
737
|
),
|
|
711
738
|
children: [
|
|
712
|
-
/* @__PURE__ */ (0,
|
|
713
|
-
/* @__PURE__ */ (0,
|
|
739
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("label", { children: [
|
|
740
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
714
741
|
"input",
|
|
715
742
|
__spreadProps(__spreadValues({}, rest), {
|
|
716
743
|
"aria-invalid": hasError ? true : void 0,
|
|
@@ -719,28 +746,28 @@ var Checkbox = (0, import_react14.forwardRef)(
|
|
|
719
746
|
type: "checkbox"
|
|
720
747
|
})
|
|
721
748
|
),
|
|
722
|
-
/* @__PURE__ */ (0,
|
|
723
|
-
title ? /* @__PURE__ */ (0,
|
|
749
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { "aria-hidden": true, className: "hds-checkbox__checkmark" }),
|
|
750
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "hds-checkbox__title", children: title }) : children
|
|
724
751
|
] }),
|
|
725
752
|
title ? children : null
|
|
726
753
|
]
|
|
727
754
|
}
|
|
728
755
|
),
|
|
729
|
-
errorMessage ? /* @__PURE__ */ (0,
|
|
756
|
+
errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ErrorMessage, { id: errorMessageId, children: errorMessage }) : null
|
|
730
757
|
] });
|
|
731
758
|
}
|
|
732
759
|
);
|
|
733
760
|
Checkbox.displayName = "Checkbox";
|
|
734
761
|
|
|
735
762
|
// src/form/date-picker/date-picker.tsx
|
|
736
|
-
var
|
|
737
|
-
var
|
|
763
|
+
var import_react18 = require("react");
|
|
764
|
+
var import_typed_classname16 = require("@postenbring/hedwig-css/typed-classname");
|
|
738
765
|
|
|
739
766
|
// src/form/input-group/input-group.tsx
|
|
740
|
-
var
|
|
741
|
-
var
|
|
742
|
-
var
|
|
743
|
-
var InputGroup = (0,
|
|
767
|
+
var import_react16 = require("react");
|
|
768
|
+
var import_typed_classname15 = require("@postenbring/hedwig-css/typed-classname");
|
|
769
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
770
|
+
var InputGroup = (0, import_react16.forwardRef)(function InputGroup2(_a, ref) {
|
|
744
771
|
var _b = _a, {
|
|
745
772
|
id,
|
|
746
773
|
className,
|
|
@@ -765,31 +792,31 @@ var InputGroup = (0, import_react15.forwardRef)(function InputGroup2(_a, ref) {
|
|
|
765
792
|
"readOnly",
|
|
766
793
|
"children"
|
|
767
794
|
]);
|
|
768
|
-
const errorMessageId = (0,
|
|
769
|
-
const inputId = (0,
|
|
795
|
+
const errorMessageId = (0, import_react16.useId)();
|
|
796
|
+
const inputId = (0, import_react16.useId)();
|
|
770
797
|
const renderInput = () => {
|
|
771
798
|
var _a2;
|
|
772
799
|
const inputProps = {
|
|
773
800
|
"aria-describedby": errorMessage ? errorMessageId : void 0,
|
|
774
801
|
"aria-invalid": errorMessage ? true : void 0,
|
|
775
802
|
id: id != null ? id : inputId,
|
|
776
|
-
className: (0,
|
|
803
|
+
className: (0, import_typed_classname15.clsx)("hds-input-group__input")
|
|
777
804
|
};
|
|
778
805
|
if (typeof children === "function") {
|
|
779
806
|
return children(inputProps);
|
|
780
807
|
}
|
|
781
|
-
const input =
|
|
782
|
-
if (!(0,
|
|
808
|
+
const input = import_react16.Children.toArray(children)[0];
|
|
809
|
+
if (!(0, import_react16.isValidElement)(input)) {
|
|
783
810
|
return;
|
|
784
811
|
}
|
|
785
|
-
return (0,
|
|
812
|
+
return (0, import_react16.cloneElement)(input, __spreadProps(__spreadValues(__spreadValues({}, inputProps), input.props), {
|
|
786
813
|
className: `${inputProps.className} ${(_a2 = input.props.className) != null ? _a2 : ""}`
|
|
787
814
|
}));
|
|
788
815
|
};
|
|
789
|
-
return /* @__PURE__ */ (0,
|
|
816
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
790
817
|
"div",
|
|
791
818
|
__spreadProps(__spreadValues({
|
|
792
|
-
className: (0,
|
|
819
|
+
className: (0, import_typed_classname15.clsx)(
|
|
793
820
|
"hds-input-group",
|
|
794
821
|
{
|
|
795
822
|
[`hds-input-group--${variant}`]: variant,
|
|
@@ -801,25 +828,25 @@ var InputGroup = (0, import_react15.forwardRef)(function InputGroup2(_a, ref) {
|
|
|
801
828
|
style
|
|
802
829
|
}, rest), {
|
|
803
830
|
children: [
|
|
804
|
-
/* @__PURE__ */ (0,
|
|
831
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
805
832
|
"label",
|
|
806
833
|
__spreadProps(__spreadValues({
|
|
807
|
-
className: (0,
|
|
834
|
+
className: (0, import_typed_classname15.clsx)("hds-input-group__label", labelClassName)
|
|
808
835
|
}, labelProps), {
|
|
809
836
|
htmlFor: id != null ? id : inputId,
|
|
810
837
|
children: label
|
|
811
838
|
})
|
|
812
839
|
),
|
|
813
|
-
/* @__PURE__ */ (0,
|
|
840
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
814
841
|
"div",
|
|
815
842
|
{
|
|
816
|
-
className: (0,
|
|
843
|
+
className: (0, import_typed_classname15.clsx)("hds-input-group__input-wrapper"),
|
|
817
844
|
"data-disabled": disabled,
|
|
818
845
|
"data-readonly": readOnly,
|
|
819
846
|
children: renderInput()
|
|
820
847
|
}
|
|
821
848
|
),
|
|
822
|
-
/* @__PURE__ */ (0,
|
|
849
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ErrorMessage, { id: errorMessageId, children: errorMessage })
|
|
823
850
|
]
|
|
824
851
|
})
|
|
825
852
|
);
|
|
@@ -827,7 +854,7 @@ var InputGroup = (0, import_react15.forwardRef)(function InputGroup2(_a, ref) {
|
|
|
827
854
|
|
|
828
855
|
// src/utils/utils.ts
|
|
829
856
|
var React = __toESM(require("react"));
|
|
830
|
-
var
|
|
857
|
+
var import_react17 = require("react");
|
|
831
858
|
function useMergeRefs(refs) {
|
|
832
859
|
return React.useMemo(() => {
|
|
833
860
|
if (refs.every((ref) => ref === null)) {
|
|
@@ -845,16 +872,16 @@ function useMergeRefs(refs) {
|
|
|
845
872
|
}, refs);
|
|
846
873
|
}
|
|
847
874
|
function useResize(ref) {
|
|
848
|
-
const [width, setWidth] = (0,
|
|
849
|
-
const [height, setHeight] = (0,
|
|
850
|
-
const handleResize = (0,
|
|
875
|
+
const [width, setWidth] = (0, import_react17.useState)(0);
|
|
876
|
+
const [height, setHeight] = (0, import_react17.useState)(0);
|
|
877
|
+
const handleResize = (0, import_react17.useCallback)(() => {
|
|
851
878
|
var _a, _b, _c, _d;
|
|
852
879
|
if ((ref == null ? void 0 : ref.current) !== null) {
|
|
853
880
|
setWidth((_b = (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.offsetWidth) != null ? _b : 0);
|
|
854
881
|
setHeight((_d = (_c = ref == null ? void 0 : ref.current) == null ? void 0 : _c.offsetHeight) != null ? _d : 0);
|
|
855
882
|
}
|
|
856
883
|
}, [ref]);
|
|
857
|
-
(0,
|
|
884
|
+
(0, import_react17.useEffect)(() => {
|
|
858
885
|
window.addEventListener("load", handleResize);
|
|
859
886
|
window.addEventListener("resize", handleResize);
|
|
860
887
|
return () => {
|
|
@@ -862,7 +889,7 @@ function useResize(ref) {
|
|
|
862
889
|
window.removeEventListener("resize", handleResize);
|
|
863
890
|
};
|
|
864
891
|
}, [ref, handleResize]);
|
|
865
|
-
(0,
|
|
892
|
+
(0, import_react17.useEffect)(() => {
|
|
866
893
|
handleResize();
|
|
867
894
|
}, []);
|
|
868
895
|
return { width, height };
|
|
@@ -905,8 +932,8 @@ function releaseFocusTrap(inertElements) {
|
|
|
905
932
|
}
|
|
906
933
|
|
|
907
934
|
// src/form/date-picker/date-picker.tsx
|
|
908
|
-
var
|
|
909
|
-
var DatePicker = (0,
|
|
935
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
936
|
+
var DatePicker = (0, import_react18.forwardRef)(function DatePicker2(_a, ref) {
|
|
910
937
|
var _b = _a, {
|
|
911
938
|
className,
|
|
912
939
|
variant,
|
|
@@ -930,12 +957,12 @@ var DatePicker = (0, import_react17.forwardRef)(function DatePicker2(_a, ref) {
|
|
|
930
957
|
"readOnly",
|
|
931
958
|
"calendarButtonTitle"
|
|
932
959
|
]);
|
|
933
|
-
const inputRef = (0,
|
|
960
|
+
const inputRef = (0, import_react18.useRef)(null);
|
|
934
961
|
const mergedRef = useMergeRefs([inputRef, ref]);
|
|
935
|
-
return /* @__PURE__ */ (0,
|
|
962
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
936
963
|
InputGroup,
|
|
937
964
|
{
|
|
938
|
-
className: (0,
|
|
965
|
+
className: (0, import_typed_classname16.clsx)("hds-date-picker", className),
|
|
939
966
|
disabled,
|
|
940
967
|
errorMessage,
|
|
941
968
|
id,
|
|
@@ -944,8 +971,8 @@ var DatePicker = (0, import_react17.forwardRef)(function DatePicker2(_a, ref) {
|
|
|
944
971
|
readOnly,
|
|
945
972
|
style,
|
|
946
973
|
variant,
|
|
947
|
-
children: (inputProps) => /* @__PURE__ */ (0,
|
|
948
|
-
/* @__PURE__ */ (0,
|
|
974
|
+
children: (inputProps) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
|
|
975
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
949
976
|
"input",
|
|
950
977
|
__spreadProps(__spreadValues(__spreadValues({}, rest), inputProps), {
|
|
951
978
|
disabled,
|
|
@@ -954,10 +981,10 @@ var DatePicker = (0, import_react17.forwardRef)(function DatePicker2(_a, ref) {
|
|
|
954
981
|
type: "date"
|
|
955
982
|
})
|
|
956
983
|
),
|
|
957
|
-
/* @__PURE__ */ (0,
|
|
984
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
958
985
|
"button",
|
|
959
986
|
{
|
|
960
|
-
className: (0,
|
|
987
|
+
className: (0, import_typed_classname16.clsx)("hds-date-picker__calendar-button"),
|
|
961
988
|
type: "button",
|
|
962
989
|
title: calendarButtonTitle,
|
|
963
990
|
onClick: () => {
|
|
@@ -973,15 +1000,15 @@ var DatePicker = (0, import_react17.forwardRef)(function DatePicker2(_a, ref) {
|
|
|
973
1000
|
DatePicker.displayName = "DatePicker";
|
|
974
1001
|
|
|
975
1002
|
// src/form/input/input.tsx
|
|
976
|
-
var
|
|
977
|
-
var
|
|
978
|
-
var
|
|
979
|
-
var Input = (0,
|
|
1003
|
+
var import_react19 = require("react");
|
|
1004
|
+
var import_typed_classname17 = require("@postenbring/hedwig-css/typed-classname");
|
|
1005
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
1006
|
+
var Input = (0, import_react19.forwardRef)(function Input2(_a, ref) {
|
|
980
1007
|
var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
|
|
981
|
-
return /* @__PURE__ */ (0,
|
|
1008
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
982
1009
|
InputGroup,
|
|
983
1010
|
{
|
|
984
|
-
className: (0,
|
|
1011
|
+
className: (0, import_typed_classname17.clsx)("hds-input", className),
|
|
985
1012
|
disabled,
|
|
986
1013
|
errorMessage,
|
|
987
1014
|
id,
|
|
@@ -990,34 +1017,35 @@ var Input = (0, import_react18.forwardRef)(function Input2(_a, ref) {
|
|
|
990
1017
|
readOnly,
|
|
991
1018
|
style,
|
|
992
1019
|
variant,
|
|
993
|
-
children: /* @__PURE__ */ (0,
|
|
1020
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("input", __spreadProps(__spreadValues({}, rest), { disabled, readOnly, ref }))
|
|
994
1021
|
}
|
|
995
1022
|
);
|
|
996
1023
|
});
|
|
997
1024
|
Input.displayName = "Input";
|
|
998
1025
|
|
|
999
|
-
// src/form/
|
|
1000
|
-
var
|
|
1001
|
-
var
|
|
1026
|
+
// src/form/radio-button/radio-button.tsx
|
|
1027
|
+
var import_react21 = require("react");
|
|
1028
|
+
var import_typed_classname18 = require("@postenbring/hedwig-css/typed-classname");
|
|
1002
1029
|
|
|
1003
|
-
// src/form/
|
|
1004
|
-
var
|
|
1005
|
-
var
|
|
1006
|
-
var RadioGroupContext = (0,
|
|
1030
|
+
// src/form/radio-button/radio-group.tsx
|
|
1031
|
+
var import_react20 = require("react");
|
|
1032
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
1033
|
+
var RadioGroupContext = (0, import_react20.createContext)({
|
|
1034
|
+
name: void 0,
|
|
1007
1035
|
hasError: false,
|
|
1008
1036
|
onChange: () => {
|
|
1009
1037
|
return void 0;
|
|
1010
1038
|
}
|
|
1011
1039
|
});
|
|
1012
|
-
var useRadioGroupContext = () => (0,
|
|
1013
|
-
var RadioGroup = (0,
|
|
1040
|
+
var useRadioGroupContext = () => (0, import_react20.useContext)(RadioGroupContext);
|
|
1041
|
+
var RadioGroup = (0, import_react20.forwardRef)(function RadioGroup2(_a, ref) {
|
|
1014
1042
|
var _b = _a, { name, value, errorMessage, onChange, children } = _b, rest = __objRest(_b, ["name", "value", "errorMessage", "onChange", "children"]);
|
|
1015
|
-
return /* @__PURE__ */ (0,
|
|
1043
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(RadioGroupContext.Provider, { value: { name, value, hasError: Boolean(errorMessage), onChange }, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Fieldset, __spreadProps(__spreadValues({ errorMessage }, rest), { ref, children })) });
|
|
1016
1044
|
});
|
|
1017
1045
|
RadioGroup.displayName = "RadioGroup";
|
|
1018
1046
|
|
|
1019
|
-
// src/form/
|
|
1020
|
-
var
|
|
1047
|
+
// src/form/radio-button/radio-button.tsx
|
|
1048
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
1021
1049
|
var isChecked = ({
|
|
1022
1050
|
checked,
|
|
1023
1051
|
selectedValue,
|
|
@@ -1027,7 +1055,7 @@ var isChecked = ({
|
|
|
1027
1055
|
if (typeof selectedValue !== "undefined") return value === selectedValue;
|
|
1028
1056
|
return void 0;
|
|
1029
1057
|
};
|
|
1030
|
-
var
|
|
1058
|
+
var RadioButton = (0, import_react21.forwardRef)(
|
|
1031
1059
|
(_a, ref) => {
|
|
1032
1060
|
var _b = _a, {
|
|
1033
1061
|
checked,
|
|
@@ -1055,20 +1083,20 @@ var Radiobutton = (0, import_react20.forwardRef)(
|
|
|
1055
1083
|
]);
|
|
1056
1084
|
const { hasError: hasFieldsetError } = useFieldsetContext();
|
|
1057
1085
|
const hasError = hasFieldsetError || hasRadioGroupError || hasErrorProp;
|
|
1058
|
-
return /* @__PURE__ */ (0,
|
|
1086
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
|
|
1059
1087
|
"div",
|
|
1060
1088
|
{
|
|
1061
|
-
className: (0,
|
|
1062
|
-
"hds-
|
|
1089
|
+
className: (0, import_typed_classname18.clsx)(
|
|
1090
|
+
"hds-radio-button",
|
|
1063
1091
|
{
|
|
1064
|
-
[`hds-
|
|
1065
|
-
"hds-
|
|
1092
|
+
[`hds-radio-button--${variant}`]: variant === "bounding-box",
|
|
1093
|
+
"hds-radio-button--error": hasError
|
|
1066
1094
|
},
|
|
1067
1095
|
className
|
|
1068
1096
|
),
|
|
1069
1097
|
children: [
|
|
1070
|
-
/* @__PURE__ */ (0,
|
|
1071
|
-
/* @__PURE__ */ (0,
|
|
1098
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("label", { children: [
|
|
1099
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
1072
1100
|
"input",
|
|
1073
1101
|
__spreadProps(__spreadValues(__spreadValues({}, context), rest), {
|
|
1074
1102
|
checked: isChecked({ checked, selectedValue, value }),
|
|
@@ -1077,8 +1105,8 @@ var Radiobutton = (0, import_react20.forwardRef)(
|
|
|
1077
1105
|
type: "radio"
|
|
1078
1106
|
})
|
|
1079
1107
|
),
|
|
1080
|
-
/* @__PURE__ */ (0,
|
|
1081
|
-
title ? /* @__PURE__ */ (0,
|
|
1108
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { "aria-hidden": true, className: "hds-radio-button__checkmark" }),
|
|
1109
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "hds-radio-button__title", children: title }) : children
|
|
1082
1110
|
] }),
|
|
1083
1111
|
title ? children : null
|
|
1084
1112
|
]
|
|
@@ -1086,18 +1114,18 @@ var Radiobutton = (0, import_react20.forwardRef)(
|
|
|
1086
1114
|
);
|
|
1087
1115
|
}
|
|
1088
1116
|
);
|
|
1089
|
-
|
|
1117
|
+
RadioButton.displayName = "RadioButton";
|
|
1090
1118
|
|
|
1091
1119
|
// src/form/select/select.tsx
|
|
1092
|
-
var
|
|
1093
|
-
var
|
|
1094
|
-
var
|
|
1095
|
-
var Select = (0,
|
|
1120
|
+
var import_react22 = require("react");
|
|
1121
|
+
var import_typed_classname19 = require("@postenbring/hedwig-css/typed-classname");
|
|
1122
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
1123
|
+
var Select = (0, import_react22.forwardRef)(function Select2(_a, ref) {
|
|
1096
1124
|
var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, children } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "children"]);
|
|
1097
|
-
return /* @__PURE__ */ (0,
|
|
1125
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
1098
1126
|
InputGroup,
|
|
1099
1127
|
{
|
|
1100
|
-
className: (0,
|
|
1128
|
+
className: (0, import_typed_classname19.clsx)("hds-select", className),
|
|
1101
1129
|
disabled,
|
|
1102
1130
|
errorMessage,
|
|
1103
1131
|
id,
|
|
@@ -1105,22 +1133,22 @@ var Select = (0, import_react21.forwardRef)(function Select2(_a, ref) {
|
|
|
1105
1133
|
labelProps,
|
|
1106
1134
|
style,
|
|
1107
1135
|
variant,
|
|
1108
|
-
children: /* @__PURE__ */ (0,
|
|
1136
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("select", __spreadProps(__spreadValues({}, rest), { disabled, ref, children }))
|
|
1109
1137
|
}
|
|
1110
1138
|
);
|
|
1111
1139
|
});
|
|
1112
1140
|
Select.displayName = "Select";
|
|
1113
1141
|
|
|
1114
1142
|
// src/form/textarea/textarea.tsx
|
|
1115
|
-
var
|
|
1116
|
-
var
|
|
1117
|
-
var
|
|
1118
|
-
var Textarea = (0,
|
|
1143
|
+
var import_react23 = require("react");
|
|
1144
|
+
var import_typed_classname20 = require("@postenbring/hedwig-css/typed-classname");
|
|
1145
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
1146
|
+
var Textarea = (0, import_react23.forwardRef)(function Textarea2(_a, ref) {
|
|
1119
1147
|
var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
|
|
1120
|
-
return /* @__PURE__ */ (0,
|
|
1148
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
1121
1149
|
InputGroup,
|
|
1122
1150
|
{
|
|
1123
|
-
className: (0,
|
|
1151
|
+
className: (0, import_typed_classname20.clsx)("hds-textarea", className),
|
|
1124
1152
|
disabled,
|
|
1125
1153
|
errorMessage,
|
|
1126
1154
|
id,
|
|
@@ -1129,46 +1157,46 @@ var Textarea = (0, import_react22.forwardRef)(function Textarea2(_a, ref) {
|
|
|
1129
1157
|
readOnly,
|
|
1130
1158
|
style,
|
|
1131
1159
|
variant,
|
|
1132
|
-
children: /* @__PURE__ */ (0,
|
|
1160
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("textarea", __spreadProps(__spreadValues({}, rest), { disabled, readOnly, ref }))
|
|
1133
1161
|
}
|
|
1134
1162
|
);
|
|
1135
1163
|
});
|
|
1136
1164
|
Textarea.displayName = "Textarea";
|
|
1137
1165
|
|
|
1138
1166
|
// src/footer/footer.tsx
|
|
1139
|
-
var
|
|
1140
|
-
var
|
|
1141
|
-
var
|
|
1167
|
+
var import_react26 = require("react");
|
|
1168
|
+
var import_typed_classname23 = require("@postenbring/hedwig-css/typed-classname");
|
|
1169
|
+
var import_react_slot6 = require("@radix-ui/react-slot");
|
|
1142
1170
|
|
|
1143
1171
|
// src/list/link-list.tsx
|
|
1144
|
-
var
|
|
1145
|
-
var
|
|
1172
|
+
var import_typed_classname22 = require("@postenbring/hedwig-css/typed-classname");
|
|
1173
|
+
var import_react25 = require("react");
|
|
1146
1174
|
|
|
1147
1175
|
// src/list/list.tsx
|
|
1148
|
-
var
|
|
1149
|
-
var
|
|
1150
|
-
var
|
|
1151
|
-
var UnorderedList = (0,
|
|
1176
|
+
var import_react24 = require("react");
|
|
1177
|
+
var import_typed_classname21 = require("@postenbring/hedwig-css/typed-classname");
|
|
1178
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
1179
|
+
var UnorderedList = (0, import_react24.forwardRef)(
|
|
1152
1180
|
(_a, ref) => {
|
|
1153
1181
|
var _b = _a, { size = "medium", className } = _b, rest = __objRest(_b, ["size", "className"]);
|
|
1154
|
-
return /* @__PURE__ */ (0,
|
|
1182
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
1155
1183
|
"ul",
|
|
1156
1184
|
__spreadValues({
|
|
1157
1185
|
ref,
|
|
1158
|
-
className: (0,
|
|
1186
|
+
className: (0, import_typed_classname21.clsx)("hds-list", `hds-list--${size}`, className)
|
|
1159
1187
|
}, rest)
|
|
1160
1188
|
);
|
|
1161
1189
|
}
|
|
1162
1190
|
);
|
|
1163
1191
|
UnorderedList.displayName = "UnorderedList";
|
|
1164
|
-
var OrderedList = (0,
|
|
1192
|
+
var OrderedList = (0, import_react24.forwardRef)(
|
|
1165
1193
|
(_a, ref) => {
|
|
1166
1194
|
var _b = _a, { size = "medium", className } = _b, rest = __objRest(_b, ["size", "className"]);
|
|
1167
|
-
return /* @__PURE__ */ (0,
|
|
1195
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
1168
1196
|
"ol",
|
|
1169
1197
|
__spreadValues({
|
|
1170
1198
|
ref,
|
|
1171
|
-
className: (0,
|
|
1199
|
+
className: (0, import_typed_classname21.clsx)("hds-list", `hds-list--${size}`, className)
|
|
1172
1200
|
}, rest)
|
|
1173
1201
|
);
|
|
1174
1202
|
}
|
|
@@ -1176,15 +1204,15 @@ var OrderedList = (0, import_react23.forwardRef)(
|
|
|
1176
1204
|
OrderedList.displayName = "OrderedList";
|
|
1177
1205
|
|
|
1178
1206
|
// src/list/link-list.tsx
|
|
1179
|
-
var
|
|
1180
|
-
var LinkList = (0,
|
|
1207
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
1208
|
+
var LinkList = (0, import_react25.forwardRef)(
|
|
1181
1209
|
(_a, ref) => {
|
|
1182
1210
|
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
|
1183
|
-
return /* @__PURE__ */ (0,
|
|
1211
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
1184
1212
|
UnorderedList,
|
|
1185
1213
|
__spreadValues({
|
|
1186
1214
|
ref,
|
|
1187
|
-
className: (0,
|
|
1215
|
+
className: (0, import_typed_classname22.clsx)("hds-list--link-list", className)
|
|
1188
1216
|
}, rest)
|
|
1189
1217
|
);
|
|
1190
1218
|
}
|
|
@@ -1192,30 +1220,30 @@ var LinkList = (0, import_react24.forwardRef)(
|
|
|
1192
1220
|
LinkList.displayName = "LinkList";
|
|
1193
1221
|
|
|
1194
1222
|
// src/footer/footer.tsx
|
|
1195
|
-
var
|
|
1196
|
-
var FooterLogo = (0,
|
|
1223
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
1224
|
+
var FooterLogo = (0, import_react26.forwardRef)(
|
|
1197
1225
|
(_a, ref) => {
|
|
1198
1226
|
var _b = _a, { children, className, asChild } = _b, rest = __objRest(_b, ["children", "className", "asChild"]);
|
|
1199
|
-
const Component = asChild ?
|
|
1200
|
-
return /* @__PURE__ */ (0,
|
|
1227
|
+
const Component = asChild ? import_react_slot6.Slot : "div";
|
|
1228
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname23.clsx)(`hds-footer__logo`, className), ref }, rest), { children }));
|
|
1201
1229
|
}
|
|
1202
1230
|
);
|
|
1203
1231
|
FooterLogo.displayName = "Footer.Logo";
|
|
1204
|
-
var FooterButtonLink = (0,
|
|
1232
|
+
var FooterButtonLink = (0, import_react26.forwardRef)(
|
|
1205
1233
|
(_a, ref) => {
|
|
1206
1234
|
var _b = _a, { children, className, asChild } = _b, rest = __objRest(_b, ["children", "className", "asChild"]);
|
|
1207
|
-
const Component = asChild ?
|
|
1208
|
-
return /* @__PURE__ */ (0,
|
|
1235
|
+
const Component = asChild ? import_react_slot6.Slot : "a";
|
|
1236
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Button, { asChild: true, variant: "primary-outline", className: (0, import_typed_classname23.clsx)(className), children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Component, __spreadProps(__spreadValues({ ref }, rest), { children })) });
|
|
1209
1237
|
}
|
|
1210
1238
|
);
|
|
1211
1239
|
FooterButtonLink.displayName = "FooterButton";
|
|
1212
|
-
var FooterLinkSections = (0,
|
|
1240
|
+
var FooterLinkSections = (0, import_react26.forwardRef)(
|
|
1213
1241
|
(_a, ref) => {
|
|
1214
1242
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
1215
|
-
return /* @__PURE__ */ (0,
|
|
1243
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_jsx_runtime24.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1216
1244
|
Accordion,
|
|
1217
1245
|
__spreadProps(__spreadValues({
|
|
1218
|
-
className: (0,
|
|
1246
|
+
className: (0, import_typed_classname23.clsx)("hds-footer__link-sections", className),
|
|
1219
1247
|
ref
|
|
1220
1248
|
}, rest), {
|
|
1221
1249
|
children
|
|
@@ -1224,39 +1252,39 @@ var FooterLinkSections = (0, import_react25.forwardRef)(
|
|
|
1224
1252
|
}
|
|
1225
1253
|
);
|
|
1226
1254
|
FooterLinkSections.displayName = "Footer.LinkSections";
|
|
1227
|
-
var FooterLinkSection = (0,
|
|
1255
|
+
var FooterLinkSection = (0, import_react26.forwardRef)(
|
|
1228
1256
|
(_a, ref) => {
|
|
1229
1257
|
var _b = _a, { heading, children, className } = _b, rest = __objRest(_b, ["heading", "children", "className"]);
|
|
1230
|
-
const linkListChildren = /* @__PURE__ */ (0,
|
|
1231
|
-
return /* @__PURE__ */ (0,
|
|
1232
|
-
/* @__PURE__ */ (0,
|
|
1258
|
+
const linkListChildren = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(LinkList, { children });
|
|
1259
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
|
|
1260
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
1233
1261
|
Accordion.Item,
|
|
1234
1262
|
__spreadProps(__spreadValues({
|
|
1235
|
-
className: (0,
|
|
1263
|
+
className: (0, import_typed_classname23.clsx)(`hds-footer__link-section`, className),
|
|
1236
1264
|
ref
|
|
1237
1265
|
}, rest), {
|
|
1238
1266
|
children: [
|
|
1239
|
-
/* @__PURE__ */ (0,
|
|
1240
|
-
/* @__PURE__ */ (0,
|
|
1267
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Accordion.Header, { children: heading }),
|
|
1268
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Accordion.Content, { children: linkListChildren })
|
|
1241
1269
|
]
|
|
1242
1270
|
})
|
|
1243
1271
|
),
|
|
1244
|
-
/* @__PURE__ */ (0,
|
|
1245
|
-
/* @__PURE__ */ (0,
|
|
1272
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: (0, import_typed_classname23.clsx)(`hds-footer__link-section`, className), children: [
|
|
1273
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("h2", { children: heading }),
|
|
1246
1274
|
linkListChildren
|
|
1247
1275
|
] })
|
|
1248
1276
|
] });
|
|
1249
1277
|
}
|
|
1250
1278
|
);
|
|
1251
1279
|
FooterLinkSection.displayName = "Footer.LinkSection";
|
|
1252
|
-
var Footer = (0,
|
|
1280
|
+
var Footer = (0, import_react26.forwardRef)(
|
|
1253
1281
|
(_a, ref) => {
|
|
1254
1282
|
var _b = _a, { children, className, variant, asChild } = _b, rest = __objRest(_b, ["children", "className", "variant", "asChild"]);
|
|
1255
|
-
const Component = asChild ?
|
|
1256
|
-
return /* @__PURE__ */ (0,
|
|
1283
|
+
const Component = asChild ? import_react_slot6.Slot : "footer";
|
|
1284
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1257
1285
|
Component,
|
|
1258
1286
|
__spreadProps(__spreadValues({
|
|
1259
|
-
className: (0,
|
|
1287
|
+
className: (0, import_typed_classname23.clsx)(
|
|
1260
1288
|
`hds-footer`,
|
|
1261
1289
|
variant === "slim" && "hds-footer--slim",
|
|
1262
1290
|
className
|
|
@@ -1276,10 +1304,10 @@ Footer.LinkSection = FooterLinkSection;
|
|
|
1276
1304
|
|
|
1277
1305
|
// src/help-text/help-text.tsx
|
|
1278
1306
|
var Popover = __toESM(require("@radix-ui/react-popover"));
|
|
1279
|
-
var
|
|
1280
|
-
var
|
|
1281
|
-
var
|
|
1282
|
-
var HelpText = (0,
|
|
1307
|
+
var import_typed_classname24 = require("@postenbring/hedwig-css/typed-classname");
|
|
1308
|
+
var import_react27 = require("react");
|
|
1309
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
1310
|
+
var HelpText = (0, import_react27.forwardRef)(
|
|
1283
1311
|
(_a, ref) => {
|
|
1284
1312
|
var _b = _a, { children, className, helpText, title, side = "top", align = "start", boxProps } = _b, rest = __objRest(_b, ["children", "className", "helpText", "title", "side", "align", "boxProps"]);
|
|
1285
1313
|
return (
|
|
@@ -1287,24 +1315,24 @@ var HelpText = (0, import_react26.forwardRef)(
|
|
|
1287
1315
|
// In the future we can use the native popover api, but as of writing, though all browsers support it
|
|
1288
1316
|
// it's not far enough back to be used in production
|
|
1289
1317
|
// https://caniuse.com/mdn-html_elements_input_popovertarget
|
|
1290
|
-
/* @__PURE__ */ (0,
|
|
1291
|
-
/* @__PURE__ */ (0,
|
|
1318
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Popover.Root, { children: [
|
|
1319
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Popover.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
1292
1320
|
"button",
|
|
1293
1321
|
__spreadProps(__spreadValues({
|
|
1294
1322
|
ref,
|
|
1295
|
-
className: (0,
|
|
1323
|
+
className: (0, import_typed_classname24.clsx)("hds-help-text-button", className),
|
|
1296
1324
|
title,
|
|
1297
1325
|
type: "button"
|
|
1298
1326
|
}, rest), {
|
|
1299
1327
|
children
|
|
1300
1328
|
})
|
|
1301
1329
|
) }),
|
|
1302
|
-
/* @__PURE__ */ (0,
|
|
1330
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Popover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Popover.Content, { asChild: true, side, align, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
1303
1331
|
Box,
|
|
1304
1332
|
__spreadProps(__spreadValues({}, boxProps), {
|
|
1305
|
-
className: (0,
|
|
1333
|
+
className: (0, import_typed_classname24.clsx)("hds-help-text-box", boxProps == null ? void 0 : boxProps.className),
|
|
1306
1334
|
children: [
|
|
1307
|
-
/* @__PURE__ */ (0,
|
|
1335
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Popover.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Box.CloseButton, {}) }),
|
|
1308
1336
|
helpText
|
|
1309
1337
|
]
|
|
1310
1338
|
})
|
|
@@ -1316,18 +1344,18 @@ var HelpText = (0, import_react26.forwardRef)(
|
|
|
1316
1344
|
HelpText.displayName = "HelpText";
|
|
1317
1345
|
|
|
1318
1346
|
// src/layout/container/container.tsx
|
|
1319
|
-
var
|
|
1320
|
-
var
|
|
1321
|
-
var
|
|
1322
|
-
var
|
|
1323
|
-
var Container = (0,
|
|
1347
|
+
var import_typed_classname25 = require("@postenbring/hedwig-css/typed-classname");
|
|
1348
|
+
var import_react_slot7 = require("@radix-ui/react-slot");
|
|
1349
|
+
var import_react28 = require("react");
|
|
1350
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
1351
|
+
var Container = (0, import_react28.forwardRef)(
|
|
1324
1352
|
(_a, ref) => {
|
|
1325
1353
|
var _b = _a, { as: Tag = "div", asChild, className, children, variant } = _b, rest = __objRest(_b, ["as", "asChild", "className", "children", "variant"]);
|
|
1326
|
-
const Component = asChild ?
|
|
1327
|
-
return /* @__PURE__ */ (0,
|
|
1354
|
+
const Component = asChild ? import_react_slot7.Slot : Tag;
|
|
1355
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
1328
1356
|
Component,
|
|
1329
1357
|
__spreadProps(__spreadValues({}, rest), {
|
|
1330
|
-
className: (0,
|
|
1358
|
+
className: (0, import_typed_classname25.clsx)(
|
|
1331
1359
|
"hds-container",
|
|
1332
1360
|
{ "hds-container--slim": variant === "slim" },
|
|
1333
1361
|
className
|
|
@@ -1341,9 +1369,9 @@ var Container = (0, import_react27.forwardRef)(
|
|
|
1341
1369
|
Container.displayName = "Container";
|
|
1342
1370
|
|
|
1343
1371
|
// src/layout/grid/grid.tsx
|
|
1344
|
-
var
|
|
1345
|
-
var
|
|
1346
|
-
var
|
|
1372
|
+
var import_typed_classname26 = require("@postenbring/hedwig-css/typed-classname");
|
|
1373
|
+
var import_react_slot8 = require("@radix-ui/react-slot");
|
|
1374
|
+
var import_react29 = require("react");
|
|
1347
1375
|
|
|
1348
1376
|
// src/layout/responsive.ts
|
|
1349
1377
|
function getResponsiveProps(variable, inputValues, valueTransformer = (value) => String(value)) {
|
|
@@ -1364,17 +1392,17 @@ function getSpacingVariable(size) {
|
|
|
1364
1392
|
}
|
|
1365
1393
|
|
|
1366
1394
|
// src/layout/grid/grid.tsx
|
|
1367
|
-
var
|
|
1368
|
-
var GridItem = (0,
|
|
1395
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
1396
|
+
var GridItem = (0, import_react29.forwardRef)(
|
|
1369
1397
|
(_a, ref) => {
|
|
1370
1398
|
var _b = _a, { children, asChild, className, span, center, style: _style } = _b, rest = __objRest(_b, ["children", "asChild", "className", "span", "center", "style"]);
|
|
1371
|
-
const Component = asChild ?
|
|
1399
|
+
const Component = asChild ? import_react_slot8.Slot : "div";
|
|
1372
1400
|
const style = __spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-grid-item-span", span)), getResponsiveProps("--hds-grid-item-center", center, (value) => value ? "1" : "0"));
|
|
1373
|
-
return /* @__PURE__ */ (0,
|
|
1401
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1374
1402
|
Component,
|
|
1375
1403
|
__spreadProps(__spreadValues({
|
|
1376
1404
|
style,
|
|
1377
|
-
className: (0,
|
|
1405
|
+
className: (0, import_typed_classname26.clsx)("hds-grid__item", className),
|
|
1378
1406
|
ref
|
|
1379
1407
|
}, rest), {
|
|
1380
1408
|
children
|
|
@@ -1383,16 +1411,16 @@ var GridItem = (0, import_react28.forwardRef)(
|
|
|
1383
1411
|
}
|
|
1384
1412
|
);
|
|
1385
1413
|
GridItem.displayName = "Grid.Item";
|
|
1386
|
-
var Grid = (0,
|
|
1414
|
+
var Grid = (0, import_react29.forwardRef)(
|
|
1387
1415
|
(_a, ref) => {
|
|
1388
1416
|
var _b = _a, { children, asChild, className, span, center, style: _style, gap, gapX, gapY } = _b, rest = __objRest(_b, ["children", "asChild", "className", "span", "center", "style", "gap", "gapX", "gapY"]);
|
|
1389
|
-
const Component = asChild ?
|
|
1417
|
+
const Component = asChild ? import_react_slot8.Slot : "div";
|
|
1390
1418
|
const style = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-grid-gap", gap, getSpacingVariable)), getResponsiveProps("--hds-grid-gap-x", gapX, getSpacingVariable)), getResponsiveProps("--hds-grid-gap-y", gapY, getSpacingVariable)), getResponsiveProps("--hds-grid-span", span)), getResponsiveProps("--hds-grid-center", center, (value) => value ? "1" : "0"));
|
|
1391
|
-
return /* @__PURE__ */ (0,
|
|
1419
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1392
1420
|
Component,
|
|
1393
1421
|
__spreadProps(__spreadValues({
|
|
1394
1422
|
style,
|
|
1395
|
-
className: (0,
|
|
1423
|
+
className: (0, import_typed_classname26.clsx)("hds-grid", className),
|
|
1396
1424
|
ref
|
|
1397
1425
|
}, rest), {
|
|
1398
1426
|
children
|
|
@@ -1405,11 +1433,11 @@ Grid.Item = GridItem;
|
|
|
1405
1433
|
|
|
1406
1434
|
// src/layout/stack/stack.tsx
|
|
1407
1435
|
var React2 = require("react");
|
|
1408
|
-
var
|
|
1409
|
-
var
|
|
1410
|
-
var
|
|
1411
|
-
var
|
|
1412
|
-
var Stack = (0,
|
|
1436
|
+
var import_typed_classname27 = require("@postenbring/hedwig-css/typed-classname");
|
|
1437
|
+
var import_react30 = require("react");
|
|
1438
|
+
var import_react_slot9 = require("@radix-ui/react-slot");
|
|
1439
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
1440
|
+
var Stack = (0, import_react30.forwardRef)(
|
|
1413
1441
|
(_a, ref) => {
|
|
1414
1442
|
var _b = _a, {
|
|
1415
1443
|
children,
|
|
@@ -1436,13 +1464,13 @@ var Stack = (0, import_react29.forwardRef)(
|
|
|
1436
1464
|
"align",
|
|
1437
1465
|
"justify"
|
|
1438
1466
|
]);
|
|
1439
|
-
const Component = asChild ?
|
|
1467
|
+
const Component = asChild ? import_react_slot9.Slot : "div";
|
|
1440
1468
|
const style = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-stack-gap", gap, getSpacingVariable)), getResponsiveProps("--hds-stack-gap-x", gapX, getSpacingVariable)), getResponsiveProps("--hds-stack-gap-y", gapY, getSpacingVariable)), getResponsiveProps("--hds-stack-direction", direction)), getResponsiveProps("--hds-stack-wrap", wrap, (value) => value ? "wrap" : "nowrap")), getResponsiveProps("--hds-stack-align", align)), getResponsiveProps("--hds-stack-justify", justify));
|
|
1441
|
-
return /* @__PURE__ */ (0,
|
|
1469
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
1442
1470
|
Component,
|
|
1443
1471
|
__spreadProps(__spreadValues({
|
|
1444
1472
|
style,
|
|
1445
|
-
className: (0,
|
|
1473
|
+
className: (0, import_typed_classname27.clsx)("hds-stack", className),
|
|
1446
1474
|
ref
|
|
1447
1475
|
}, rest), {
|
|
1448
1476
|
children
|
|
@@ -1451,29 +1479,29 @@ var Stack = (0, import_react29.forwardRef)(
|
|
|
1451
1479
|
}
|
|
1452
1480
|
);
|
|
1453
1481
|
Stack.displayName = "Stack";
|
|
1454
|
-
var HStack = (0,
|
|
1455
|
-
return /* @__PURE__ */ (0,
|
|
1482
|
+
var HStack = (0, import_react30.forwardRef)((props, ref) => {
|
|
1483
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Stack, __spreadProps(__spreadValues({ ref }, props), { direction: "row" }));
|
|
1456
1484
|
});
|
|
1457
1485
|
HStack.displayName = "HStack";
|
|
1458
|
-
var VStack = (0,
|
|
1459
|
-
return /* @__PURE__ */ (0,
|
|
1486
|
+
var VStack = (0, import_react30.forwardRef)((props, ref) => {
|
|
1487
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Stack, __spreadProps(__spreadValues({ ref }, props), { direction: "column" }));
|
|
1460
1488
|
});
|
|
1461
1489
|
VStack.displayName = "VStack";
|
|
1462
1490
|
|
|
1463
1491
|
// src/link/link.tsx
|
|
1464
1492
|
var React3 = require("react");
|
|
1465
|
-
var
|
|
1466
|
-
var
|
|
1467
|
-
var
|
|
1468
|
-
var
|
|
1469
|
-
var Link = (0,
|
|
1493
|
+
var import_typed_classname28 = require("@postenbring/hedwig-css/typed-classname");
|
|
1494
|
+
var import_react31 = require("react");
|
|
1495
|
+
var import_react_slot10 = require("@radix-ui/react-slot");
|
|
1496
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
1497
|
+
var Link = (0, import_react31.forwardRef)(
|
|
1470
1498
|
(_a, ref) => {
|
|
1471
1499
|
var _b = _a, { asChild, children, variant = "underline", size = "medium", className } = _b, rest = __objRest(_b, ["asChild", "children", "variant", "size", "className"]);
|
|
1472
|
-
const Component = asChild ?
|
|
1473
|
-
return /* @__PURE__ */ (0,
|
|
1500
|
+
const Component = asChild ? import_react_slot10.Slot : "a";
|
|
1501
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1474
1502
|
Component,
|
|
1475
1503
|
__spreadProps(__spreadValues({
|
|
1476
|
-
className: (0,
|
|
1504
|
+
className: (0, import_typed_classname28.clsx)(
|
|
1477
1505
|
"hds-link",
|
|
1478
1506
|
variant !== "underline" && `hds-link--${variant}`,
|
|
1479
1507
|
size !== "medium" && `hds-link--${size}`,
|
|
@@ -1489,49 +1517,49 @@ var Link = (0, import_react30.forwardRef)(
|
|
|
1489
1517
|
Link.displayName = "Link";
|
|
1490
1518
|
|
|
1491
1519
|
// src/message/message.tsx
|
|
1492
|
-
var
|
|
1493
|
-
var
|
|
1494
|
-
var
|
|
1495
|
-
var
|
|
1496
|
-
var MessageTitle = (0,
|
|
1520
|
+
var import_react32 = require("react");
|
|
1521
|
+
var import_typed_classname29 = require("@postenbring/hedwig-css/typed-classname");
|
|
1522
|
+
var import_react_slot11 = require("@radix-ui/react-slot");
|
|
1523
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
1524
|
+
var MessageTitle = (0, import_react32.forwardRef)(
|
|
1497
1525
|
(_a, ref) => {
|
|
1498
1526
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1499
|
-
const Component = asChild ?
|
|
1500
|
-
return /* @__PURE__ */ (0,
|
|
1527
|
+
const Component = asChild ? import_react_slot11.Slot : "div";
|
|
1528
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1501
1529
|
Component,
|
|
1502
1530
|
__spreadValues({
|
|
1503
|
-
className: (0,
|
|
1531
|
+
className: (0, import_typed_classname29.clsx)("hds-message__title", className),
|
|
1504
1532
|
ref
|
|
1505
1533
|
}, rest)
|
|
1506
1534
|
);
|
|
1507
1535
|
}
|
|
1508
1536
|
);
|
|
1509
1537
|
MessageTitle.displayName = "Message.Title";
|
|
1510
|
-
var MessageDescription = (0,
|
|
1538
|
+
var MessageDescription = (0, import_react32.forwardRef)(
|
|
1511
1539
|
(_a, ref) => {
|
|
1512
1540
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1513
|
-
const Component = asChild ?
|
|
1514
|
-
return /* @__PURE__ */ (0,
|
|
1541
|
+
const Component = asChild ? import_react_slot11.Slot : "div";
|
|
1542
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1515
1543
|
Component,
|
|
1516
1544
|
__spreadValues({
|
|
1517
|
-
className: (0,
|
|
1545
|
+
className: (0, import_typed_classname29.clsx)("hds-message__description", className),
|
|
1518
1546
|
ref
|
|
1519
1547
|
}, rest)
|
|
1520
1548
|
);
|
|
1521
1549
|
}
|
|
1522
1550
|
);
|
|
1523
1551
|
MessageDescription.displayName = "Message.Description";
|
|
1524
|
-
var Message = (0,
|
|
1552
|
+
var Message = (0, import_react32.forwardRef)(
|
|
1525
1553
|
(_a, ref) => {
|
|
1526
1554
|
var _b = _a, { children, className, variant = "success", icon, iconClassName } = _b, rest = __objRest(_b, ["children", "className", "variant", "icon", "iconClassName"]);
|
|
1527
|
-
return /* @__PURE__ */ (0,
|
|
1555
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
1528
1556
|
Box,
|
|
1529
1557
|
__spreadProps(__spreadValues({
|
|
1530
|
-
className: (0,
|
|
1558
|
+
className: (0, import_typed_classname29.clsx)(`hds-message`, `hds-message--${variant}`, className),
|
|
1531
1559
|
ref
|
|
1532
1560
|
}, rest), {
|
|
1533
1561
|
children: [
|
|
1534
|
-
variant === "neutral" && /* @__PURE__ */ (0,
|
|
1562
|
+
variant === "neutral" && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: (0, import_typed_classname29.clsx)("hds-message--neutral__icon", iconClassName), children: icon }),
|
|
1535
1563
|
children
|
|
1536
1564
|
]
|
|
1537
1565
|
})
|
|
@@ -1543,56 +1571,56 @@ Message.Title = MessageTitle;
|
|
|
1543
1571
|
Message.Description = MessageDescription;
|
|
1544
1572
|
|
|
1545
1573
|
// src/modal/modal.tsx
|
|
1546
|
-
var
|
|
1547
|
-
var
|
|
1548
|
-
var
|
|
1549
|
-
var
|
|
1550
|
-
var ModalHeader = (0,
|
|
1574
|
+
var import_react33 = require("react");
|
|
1575
|
+
var import_typed_classname30 = require("@postenbring/hedwig-css/typed-classname");
|
|
1576
|
+
var import_react_slot12 = require("@radix-ui/react-slot");
|
|
1577
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
1578
|
+
var ModalHeader = (0, import_react33.forwardRef)(
|
|
1551
1579
|
(_a, ref) => {
|
|
1552
1580
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1553
|
-
const Component = asChild ?
|
|
1554
|
-
return /* @__PURE__ */ (0,
|
|
1581
|
+
const Component = asChild ? import_react_slot12.Slot : "h1";
|
|
1582
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1555
1583
|
Component,
|
|
1556
1584
|
__spreadValues({
|
|
1557
|
-
className: (0,
|
|
1585
|
+
className: (0, import_typed_classname30.clsx)("hds-modal__header", className),
|
|
1558
1586
|
ref
|
|
1559
1587
|
}, rest)
|
|
1560
1588
|
);
|
|
1561
1589
|
}
|
|
1562
1590
|
);
|
|
1563
1591
|
ModalHeader.displayName = "Modal.Header";
|
|
1564
|
-
var ModalContent = (0,
|
|
1592
|
+
var ModalContent = (0, import_react33.forwardRef)(
|
|
1565
1593
|
(_a, ref) => {
|
|
1566
1594
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1567
|
-
const Component = asChild ?
|
|
1568
|
-
return /* @__PURE__ */ (0,
|
|
1595
|
+
const Component = asChild ? import_react_slot12.Slot : "div";
|
|
1596
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1569
1597
|
Component,
|
|
1570
1598
|
__spreadValues({
|
|
1571
|
-
className: (0,
|
|
1599
|
+
className: (0, import_typed_classname30.clsx)("hds-modal__content", className),
|
|
1572
1600
|
ref
|
|
1573
1601
|
}, rest)
|
|
1574
1602
|
);
|
|
1575
1603
|
}
|
|
1576
1604
|
);
|
|
1577
1605
|
ModalContent.displayName = "Modal.Content";
|
|
1578
|
-
var ModalFooter = (0,
|
|
1606
|
+
var ModalFooter = (0, import_react33.forwardRef)(
|
|
1579
1607
|
(_a, ref) => {
|
|
1580
1608
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1581
|
-
const Component = asChild ?
|
|
1582
|
-
return /* @__PURE__ */ (0,
|
|
1609
|
+
const Component = asChild ? import_react_slot12.Slot : "footer";
|
|
1610
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1583
1611
|
Component,
|
|
1584
1612
|
__spreadValues({
|
|
1585
|
-
className: (0,
|
|
1613
|
+
className: (0, import_typed_classname30.clsx)("hds-modal__footer", className),
|
|
1586
1614
|
ref
|
|
1587
1615
|
}, rest)
|
|
1588
1616
|
);
|
|
1589
1617
|
}
|
|
1590
1618
|
);
|
|
1591
1619
|
ModalFooter.displayName = "Modal.Footer";
|
|
1592
|
-
var Modal = (0,
|
|
1620
|
+
var Modal = (0, import_react33.forwardRef)(
|
|
1593
1621
|
(_a, ref) => {
|
|
1594
1622
|
var _b = _a, { children, className, open, closeOnBackdropClick, onClick } = _b, rest = __objRest(_b, ["children", "className", "open", "closeOnBackdropClick", "onClick"]);
|
|
1595
|
-
const modalRef = (0,
|
|
1623
|
+
const modalRef = (0, import_react33.useRef)(null);
|
|
1596
1624
|
const mergedRef = useMergeRefs([modalRef, ref]);
|
|
1597
1625
|
function onCloseButtonClick() {
|
|
1598
1626
|
var _a2;
|
|
@@ -1600,7 +1628,7 @@ var Modal = (0, import_react32.forwardRef)(
|
|
|
1600
1628
|
return false;
|
|
1601
1629
|
}
|
|
1602
1630
|
useScrollLock(modalRef, "hds-modal-scroll-lock");
|
|
1603
|
-
(0,
|
|
1631
|
+
(0, import_react33.useEffect)(() => {
|
|
1604
1632
|
if (modalRef.current && open !== void 0) {
|
|
1605
1633
|
if (open && !modalRef.current.open) {
|
|
1606
1634
|
modalRef.current.showModal();
|
|
@@ -1615,16 +1643,16 @@ var Modal = (0, import_react32.forwardRef)(
|
|
|
1615
1643
|
}
|
|
1616
1644
|
onClick == null ? void 0 : onClick(e);
|
|
1617
1645
|
}
|
|
1618
|
-
return /* @__PURE__ */ (0,
|
|
1646
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1619
1647
|
Box,
|
|
1620
1648
|
{
|
|
1621
1649
|
asChild: true,
|
|
1622
|
-
className: (0,
|
|
1650
|
+
className: (0, import_typed_classname30.clsx)("hds-modal", className),
|
|
1623
1651
|
closeable: true,
|
|
1624
1652
|
onClick: onDialogClick,
|
|
1625
1653
|
onClose: onCloseButtonClick,
|
|
1626
1654
|
variant: "white",
|
|
1627
|
-
children: /* @__PURE__ */ (0,
|
|
1655
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("dialog", __spreadProps(__spreadValues({ ref: mergedRef }, rest), { children }))
|
|
1628
1656
|
}
|
|
1629
1657
|
);
|
|
1630
1658
|
}
|
|
@@ -1634,7 +1662,7 @@ Modal.Header = ModalHeader;
|
|
|
1634
1662
|
Modal.Content = ModalContent;
|
|
1635
1663
|
Modal.Footer = ModalFooter;
|
|
1636
1664
|
function useScrollLock(modalRef, bodyClass) {
|
|
1637
|
-
(0,
|
|
1665
|
+
(0, import_react33.useEffect)(() => {
|
|
1638
1666
|
if (!modalRef.current) return;
|
|
1639
1667
|
if (modalRef.current.open) document.body.classList.add(bodyClass);
|
|
1640
1668
|
const observer = new MutationObserver(() => {
|
|
@@ -1654,27 +1682,38 @@ function useScrollLock(modalRef, bodyClass) {
|
|
|
1654
1682
|
}
|
|
1655
1683
|
|
|
1656
1684
|
// src/navbar/navbar.tsx
|
|
1657
|
-
var
|
|
1658
|
-
var
|
|
1659
|
-
var
|
|
1685
|
+
var import_react35 = require("react");
|
|
1686
|
+
var import_typed_classname32 = require("@postenbring/hedwig-css/typed-classname");
|
|
1687
|
+
var import_react_slot13 = require("@radix-ui/react-slot");
|
|
1660
1688
|
|
|
1661
1689
|
// src/navbar/navbar-expandable-menu.tsx
|
|
1662
|
-
var
|
|
1663
|
-
var
|
|
1690
|
+
var import_react34 = require("react");
|
|
1691
|
+
var import_typed_classname31 = require("@postenbring/hedwig-css/typed-classname");
|
|
1664
1692
|
|
|
1665
1693
|
// src/navbar/icons.tsx
|
|
1666
|
-
var
|
|
1694
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
1667
1695
|
function CloseIcon() {
|
|
1668
|
-
return /* @__PURE__ */ (0,
|
|
1669
|
-
"
|
|
1696
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1697
|
+
"svg",
|
|
1670
1698
|
{
|
|
1671
|
-
|
|
1672
|
-
|
|
1699
|
+
"aria-hidden": true,
|
|
1700
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1701
|
+
width: 32,
|
|
1702
|
+
height: 32,
|
|
1703
|
+
viewBox: "0 0 32 32",
|
|
1704
|
+
fill: "none",
|
|
1705
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1706
|
+
"path",
|
|
1707
|
+
{
|
|
1708
|
+
d: "M17.5469 16.3333L22.375 11.5521L23.3594 10.5677C23.5 10.4271 23.5 10.1927 23.3594 10.0052L22.3281 8.97394C22.1406 8.83331 21.9062 8.83331 21.7656 8.97394L16 14.7864L10.1875 8.97394C10.0469 8.83331 9.8125 8.83331 9.625 8.97394L8.59375 10.0052C8.45312 10.1927 8.45312 10.4271 8.59375 10.5677L14.4062 16.3333L8.59375 22.1458C8.45312 22.2864 8.45312 22.5208 8.59375 22.7083L9.625 23.7396C9.8125 23.8802 10.0469 23.8802 10.1875 23.7396L16 17.9271L20.7812 22.7552L21.7656 23.7396C21.9062 23.8802 22.1406 23.8802 22.3281 23.7396L23.3594 22.7083C23.5 22.5208 23.5 22.2864 23.3594 22.1458L17.5469 16.3333Z",
|
|
1709
|
+
fill: "black"
|
|
1710
|
+
}
|
|
1711
|
+
)
|
|
1673
1712
|
}
|
|
1674
|
-
)
|
|
1713
|
+
);
|
|
1675
1714
|
}
|
|
1676
1715
|
function MenuIcon() {
|
|
1677
|
-
return /* @__PURE__ */ (0,
|
|
1716
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("svg", { "aria-hidden": true, xmlns: "http://www.w3.org/2000/svg", width: 32, height: 32, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1678
1717
|
"path",
|
|
1679
1718
|
{
|
|
1680
1719
|
fill: "currentColor",
|
|
@@ -1684,35 +1723,35 @@ function MenuIcon() {
|
|
|
1684
1723
|
}
|
|
1685
1724
|
|
|
1686
1725
|
// src/navbar/navbar-expandable-menu.tsx
|
|
1687
|
-
var
|
|
1688
|
-
var ExpandableMenuContext = (0,
|
|
1726
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
1727
|
+
var ExpandableMenuContext = (0, import_react34.createContext)(null);
|
|
1689
1728
|
var useNavbarExpendableMenuContext = () => {
|
|
1690
|
-
const value = (0,
|
|
1729
|
+
const value = (0, import_react34.useContext)(ExpandableMenuContext);
|
|
1691
1730
|
if (value === null) {
|
|
1692
1731
|
throw new Error("useNavbarExpendableMenuContext must be used within a Navbar.ExpandableMenu");
|
|
1693
1732
|
}
|
|
1694
1733
|
return value;
|
|
1695
1734
|
};
|
|
1696
1735
|
function NavbarExpandableMenu({ children }) {
|
|
1697
|
-
const contentId = (0,
|
|
1698
|
-
const [open, setOpen] = (0,
|
|
1699
|
-
(0,
|
|
1736
|
+
const contentId = (0, import_react34.useId)();
|
|
1737
|
+
const [open, setOpen] = (0, import_react34.useState)(false);
|
|
1738
|
+
(0, import_react34.useEffect)(() => {
|
|
1700
1739
|
if (open) {
|
|
1701
1740
|
window.scrollTo(0, 0);
|
|
1702
|
-
document.body.classList.add((0,
|
|
1741
|
+
document.body.classList.add((0, import_typed_classname31.clsx)("hds-navbar-scroll-lock"));
|
|
1703
1742
|
const releaseFocusTrap2 = focusTrap(
|
|
1704
|
-
document.getElementsByClassName((0,
|
|
1743
|
+
document.getElementsByClassName((0, import_typed_classname31.clsx)("hds-navbar"))[0]
|
|
1705
1744
|
);
|
|
1706
1745
|
return () => {
|
|
1707
|
-
document.body.classList.remove((0,
|
|
1746
|
+
document.body.classList.remove((0, import_typed_classname31.clsx)("hds-navbar-scroll-lock"));
|
|
1708
1747
|
releaseFocusTrap2();
|
|
1709
1748
|
};
|
|
1710
1749
|
}
|
|
1711
1750
|
}, [open]);
|
|
1712
|
-
return /* @__PURE__ */ (0,
|
|
1751
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ExpandableMenuContext.Provider, { value: { contentId, open, setOpen }, children });
|
|
1713
1752
|
}
|
|
1714
1753
|
NavbarExpandableMenu.displayName = "NavbarExpandableMenu";
|
|
1715
|
-
var NavbarExpandableMenuTrigger = (0,
|
|
1754
|
+
var NavbarExpandableMenuTrigger = (0, import_react34.forwardRef)(
|
|
1716
1755
|
(_a, ref) => {
|
|
1717
1756
|
var _b = _a, {
|
|
1718
1757
|
whenClosedText,
|
|
@@ -1730,9 +1769,9 @@ var NavbarExpandableMenuTrigger = (0, import_react33.forwardRef)(
|
|
|
1730
1769
|
"className"
|
|
1731
1770
|
]);
|
|
1732
1771
|
const { contentId, open, setOpen } = useNavbarExpendableMenuContext();
|
|
1733
|
-
const [textWidth, setTextWidth] = (0,
|
|
1734
|
-
const measurementId = (0,
|
|
1735
|
-
(0,
|
|
1772
|
+
const [textWidth, setTextWidth] = (0, import_react34.useState)(void 0);
|
|
1773
|
+
const measurementId = (0, import_react34.useId)();
|
|
1774
|
+
(0, import_react34.useEffect)(() => {
|
|
1736
1775
|
var _a2, _b2, _c, _d;
|
|
1737
1776
|
const widthWhenOpen = (_b2 = (_a2 = document.getElementById(`${measurementId}-when-open`)) == null ? void 0 : _a2.getBoundingClientRect().width) != null ? _b2 : 0;
|
|
1738
1777
|
const widthWhenClosed = (_d = (_c = document.getElementById(`${measurementId}-when-closed`)) == null ? void 0 : _c.getBoundingClientRect().width) != null ? _d : 0;
|
|
@@ -1740,16 +1779,16 @@ var NavbarExpandableMenuTrigger = (0, import_react33.forwardRef)(
|
|
|
1740
1779
|
}, [measurementId]);
|
|
1741
1780
|
const text = open ? whenOpenText : whenClosedText;
|
|
1742
1781
|
const title = open ? whenOpenHelperTitle : whenClosedHelperTitle;
|
|
1743
|
-
const icon = open ? /* @__PURE__ */ (0,
|
|
1782
|
+
const icon = open ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(CloseIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(MenuIcon, {});
|
|
1744
1783
|
function toggleOpen() {
|
|
1745
1784
|
setOpen(!open);
|
|
1746
1785
|
}
|
|
1747
|
-
return /* @__PURE__ */ (0,
|
|
1786
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
|
1748
1787
|
"button",
|
|
1749
1788
|
__spreadProps(__spreadValues({
|
|
1750
1789
|
"aria-expanded": open,
|
|
1751
1790
|
"aria-controls": contentId,
|
|
1752
|
-
className: (0,
|
|
1791
|
+
className: (0, import_typed_classname31.clsx)("hds-navbar__item", className),
|
|
1753
1792
|
onClick: toggleOpen,
|
|
1754
1793
|
ref,
|
|
1755
1794
|
title,
|
|
@@ -1757,7 +1796,7 @@ var NavbarExpandableMenuTrigger = (0, import_react33.forwardRef)(
|
|
|
1757
1796
|
style: __spreadValues({ position: "relative" }, style)
|
|
1758
1797
|
}, rest), {
|
|
1759
1798
|
children: [
|
|
1760
|
-
/* @__PURE__ */ (0,
|
|
1799
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1761
1800
|
"span",
|
|
1762
1801
|
{
|
|
1763
1802
|
id: `${measurementId}-when-closed`,
|
|
@@ -1771,7 +1810,7 @@ var NavbarExpandableMenuTrigger = (0, import_react33.forwardRef)(
|
|
|
1771
1810
|
children: whenOpenText
|
|
1772
1811
|
}
|
|
1773
1812
|
),
|
|
1774
|
-
/* @__PURE__ */ (0,
|
|
1813
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1775
1814
|
"span",
|
|
1776
1815
|
{
|
|
1777
1816
|
id: `${measurementId}-when-open`,
|
|
@@ -1785,57 +1824,57 @@ var NavbarExpandableMenuTrigger = (0, import_react33.forwardRef)(
|
|
|
1785
1824
|
children: whenClosedText
|
|
1786
1825
|
}
|
|
1787
1826
|
),
|
|
1788
|
-
/* @__PURE__ */ (0,
|
|
1827
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1789
1828
|
"span",
|
|
1790
1829
|
{
|
|
1791
1830
|
style: { width: textWidth, whiteSpace: "nowrap" },
|
|
1792
|
-
className: (0,
|
|
1831
|
+
className: (0, import_typed_classname31.clsx)("hds-navbar__item-responsive-text"),
|
|
1793
1832
|
children: text
|
|
1794
1833
|
}
|
|
1795
1834
|
),
|
|
1796
|
-
/* @__PURE__ */ (0,
|
|
1835
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { style: { width: 32, height: 32 }, children: icon })
|
|
1797
1836
|
]
|
|
1798
1837
|
})
|
|
1799
1838
|
);
|
|
1800
1839
|
}
|
|
1801
1840
|
);
|
|
1802
1841
|
NavbarExpandableMenuTrigger.displayName = "Navbar.ExpandableMenuTrigger";
|
|
1803
|
-
var NavbarExpandableMenuContent = (0,
|
|
1842
|
+
var NavbarExpandableMenuContent = (0, import_react34.forwardRef)((_a, ref) => {
|
|
1804
1843
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
1805
1844
|
const { contentId, open } = useNavbarExpendableMenuContext();
|
|
1806
|
-
return /* @__PURE__ */ (0,
|
|
1845
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1807
1846
|
"section",
|
|
1808
1847
|
__spreadProps(__spreadValues(__spreadProps(__spreadValues({}, rest), {
|
|
1809
1848
|
id: contentId,
|
|
1810
|
-
className: (0,
|
|
1849
|
+
className: (0, import_typed_classname31.clsx)("hds-navbar__expandable-menu-content", className),
|
|
1811
1850
|
"data-state": open ? "open" : "closed"
|
|
1812
1851
|
}), { inert: open ? void 0 : "true" }), {
|
|
1813
1852
|
ref,
|
|
1814
|
-
children: /* @__PURE__ */ (0,
|
|
1853
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: (0, import_typed_classname31.clsx)("hds-navbar__expandable-menu-content-inner"), children })
|
|
1815
1854
|
})
|
|
1816
1855
|
);
|
|
1817
1856
|
});
|
|
1818
1857
|
NavbarExpandableMenuContent.displayName = "Navbar.ExpandableMenuContent";
|
|
1819
1858
|
|
|
1820
1859
|
// src/navbar/navbar.tsx
|
|
1821
|
-
var
|
|
1822
|
-
var NavbarLogo = (0,
|
|
1860
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
1861
|
+
var NavbarLogo = (0, import_react35.forwardRef)(
|
|
1823
1862
|
(_a, ref) => {
|
|
1824
1863
|
var _b = _a, { children, className, asChild } = _b, rest = __objRest(_b, ["children", "className", "asChild"]);
|
|
1825
|
-
const Component = asChild ?
|
|
1826
|
-
return /* @__PURE__ */ (0,
|
|
1864
|
+
const Component = asChild ? import_react_slot13.Slot : "div";
|
|
1865
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname32.clsx)(`hds-navbar__logo`, className), ref }, rest), { children }));
|
|
1827
1866
|
}
|
|
1828
1867
|
);
|
|
1829
1868
|
NavbarLogo.displayName = "Navbar.Logo";
|
|
1830
|
-
var NavbarLogoAndServiceText = (0,
|
|
1869
|
+
var NavbarLogoAndServiceText = (0, import_react35.forwardRef)(
|
|
1831
1870
|
(_a, ref) => {
|
|
1832
1871
|
var _b = _a, { children, asChild, variant, className } = _b, rest = __objRest(_b, ["children", "asChild", "variant", "className"]);
|
|
1833
|
-
const Component = asChild ?
|
|
1834
|
-
return /* @__PURE__ */ (0,
|
|
1872
|
+
const Component = asChild ? import_react_slot13.Slot : "div";
|
|
1873
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
1835
1874
|
Component,
|
|
1836
1875
|
__spreadProps(__spreadValues({
|
|
1837
1876
|
ref,
|
|
1838
|
-
className: (0,
|
|
1877
|
+
className: (0, import_typed_classname32.clsx)(
|
|
1839
1878
|
"hds-navbar__logo-and-service-text",
|
|
1840
1879
|
`hds-navbar__logo-and-service-text--${variant}`,
|
|
1841
1880
|
className
|
|
@@ -1847,29 +1886,29 @@ var NavbarLogoAndServiceText = (0, import_react34.forwardRef)(
|
|
|
1847
1886
|
}
|
|
1848
1887
|
);
|
|
1849
1888
|
NavbarLogoAndServiceText.displayName = "Navbar.NavbarLogoAndText";
|
|
1850
|
-
var NavbarItemIcon = (0,
|
|
1889
|
+
var NavbarItemIcon = (0, import_react35.forwardRef)(
|
|
1851
1890
|
(_a, ref) => {
|
|
1852
1891
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
1853
|
-
return /* @__PURE__ */ (0,
|
|
1892
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react_slot13.Slot, __spreadProps(__spreadValues({ className: (0, import_typed_classname32.clsx)("hds-navbar__item-icon", className), ref }, rest), { children }));
|
|
1854
1893
|
}
|
|
1855
1894
|
);
|
|
1856
1895
|
NavbarItemIcon.displayName = "Navbar.ItemIcon";
|
|
1857
|
-
var NavbarItem = (0,
|
|
1896
|
+
var NavbarItem = (0, import_react35.forwardRef)(
|
|
1858
1897
|
(_a, ref) => {
|
|
1859
1898
|
var _b = _a, { asChild, children, className } = _b, rest = __objRest(_b, ["asChild", "children", "className"]);
|
|
1860
|
-
const Component = asChild ?
|
|
1861
|
-
return /* @__PURE__ */ (0,
|
|
1899
|
+
const Component = asChild ? import_react_slot13.Slot : "div";
|
|
1900
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname32.clsx)("hds-navbar__item", className), ref }, rest), { children }));
|
|
1862
1901
|
}
|
|
1863
1902
|
);
|
|
1864
1903
|
NavbarItem.displayName = "Navbar.Item";
|
|
1865
|
-
var NavbarButtonItem = (0,
|
|
1904
|
+
var NavbarButtonItem = (0, import_react35.forwardRef)(
|
|
1866
1905
|
(_a, ref) => {
|
|
1867
1906
|
var _b = _a, { asChild, children, className } = _b, rest = __objRest(_b, ["asChild", "children", "className"]);
|
|
1868
|
-
const Component = asChild ?
|
|
1869
|
-
return /* @__PURE__ */ (0,
|
|
1907
|
+
const Component = asChild ? import_react_slot13.Slot : "button";
|
|
1908
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
1870
1909
|
Component,
|
|
1871
1910
|
__spreadProps(__spreadValues({
|
|
1872
|
-
className: (0,
|
|
1911
|
+
className: (0, import_typed_classname32.clsx)("hds-navbar__item", className),
|
|
1873
1912
|
ref,
|
|
1874
1913
|
type: "button"
|
|
1875
1914
|
}, rest), {
|
|
@@ -1879,36 +1918,36 @@ var NavbarButtonItem = (0, import_react34.forwardRef)(
|
|
|
1879
1918
|
}
|
|
1880
1919
|
);
|
|
1881
1920
|
NavbarButtonItem.displayName = "Navbar.ButtonItem";
|
|
1882
|
-
var NavbarLinkItem = (0,
|
|
1921
|
+
var NavbarLinkItem = (0, import_react35.forwardRef)(
|
|
1883
1922
|
(_a, ref) => {
|
|
1884
1923
|
var _b = _a, { asChild, children, className } = _b, rest = __objRest(_b, ["asChild", "children", "className"]);
|
|
1885
|
-
const Component = asChild ?
|
|
1886
|
-
return /* @__PURE__ */ (0,
|
|
1924
|
+
const Component = asChild ? import_react_slot13.Slot : "a";
|
|
1925
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname32.clsx)("hds-navbar__item", className), ref }, rest), { children }));
|
|
1887
1926
|
}
|
|
1888
1927
|
);
|
|
1889
1928
|
NavbarLinkItem.displayName = "Navbar.LinkItem";
|
|
1890
|
-
var NavbarNavigation = (0,
|
|
1929
|
+
var NavbarNavigation = (0, import_react35.forwardRef)(
|
|
1891
1930
|
(_a, ref) => {
|
|
1892
1931
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1893
|
-
const Component = asChild ?
|
|
1894
|
-
return /* @__PURE__ */ (0,
|
|
1932
|
+
const Component = asChild ? import_react_slot13.Slot : "div";
|
|
1933
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
1895
1934
|
Component,
|
|
1896
1935
|
__spreadValues({
|
|
1897
|
-
className: (0,
|
|
1936
|
+
className: (0, import_typed_classname32.clsx)("hds-navbar__navigation", className),
|
|
1898
1937
|
ref
|
|
1899
1938
|
}, rest)
|
|
1900
1939
|
);
|
|
1901
1940
|
}
|
|
1902
1941
|
);
|
|
1903
1942
|
NavbarNavigation.displayName = "Navbar.Navigation";
|
|
1904
|
-
var Navbar = (0,
|
|
1943
|
+
var Navbar = (0, import_react35.forwardRef)(
|
|
1905
1944
|
(_a, ref) => {
|
|
1906
1945
|
var _b = _a, { asChild, children, className, variant } = _b, rest = __objRest(_b, ["asChild", "children", "className", "variant"]);
|
|
1907
|
-
const Component = asChild ?
|
|
1908
|
-
return /* @__PURE__ */ (0,
|
|
1946
|
+
const Component = asChild ? import_react_slot13.Slot : "header";
|
|
1947
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
1909
1948
|
Component,
|
|
1910
1949
|
__spreadProps(__spreadValues({
|
|
1911
|
-
className: (0,
|
|
1950
|
+
className: (0, import_typed_classname32.clsx)("hds-navbar", variant && `hds-navbar--${variant}`, className),
|
|
1912
1951
|
ref
|
|
1913
1952
|
}, rest), {
|
|
1914
1953
|
children
|
|
@@ -1929,17 +1968,17 @@ Navbar.ItemIcon = NavbarItemIcon;
|
|
|
1929
1968
|
Navbar.Navigation = NavbarNavigation;
|
|
1930
1969
|
|
|
1931
1970
|
// src/show-more/show-more.tsx
|
|
1932
|
-
var
|
|
1933
|
-
var
|
|
1934
|
-
var
|
|
1935
|
-
var ShowMoreButton = (0,
|
|
1971
|
+
var import_typed_classname33 = require("@postenbring/hedwig-css/typed-classname");
|
|
1972
|
+
var import_react36 = require("react");
|
|
1973
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
1974
|
+
var ShowMoreButton = (0, import_react36.forwardRef)(
|
|
1936
1975
|
(_a, ref) => {
|
|
1937
1976
|
var _b = _a, { text, variant, expanded, className } = _b, rest = __objRest(_b, ["text", "variant", "expanded", "className"]);
|
|
1938
|
-
return /* @__PURE__ */ (0,
|
|
1977
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
1939
1978
|
"button",
|
|
1940
1979
|
__spreadProps(__spreadValues({
|
|
1941
1980
|
ref,
|
|
1942
|
-
className: (0,
|
|
1981
|
+
className: (0, import_typed_classname33.clsx)(
|
|
1943
1982
|
"hds-show-more",
|
|
1944
1983
|
variant === "show-more-show-less" && "hds-show-more--show-less",
|
|
1945
1984
|
className
|
|
@@ -1949,7 +1988,7 @@ var ShowMoreButton = (0, import_react35.forwardRef)(
|
|
|
1949
1988
|
}, rest), {
|
|
1950
1989
|
children: [
|
|
1951
1990
|
text,
|
|
1952
|
-
/* @__PURE__ */ (0,
|
|
1991
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: (0, import_typed_classname33.clsx)("hds-show-more__icon") })
|
|
1953
1992
|
]
|
|
1954
1993
|
})
|
|
1955
1994
|
);
|
|
@@ -1958,11 +1997,11 @@ var ShowMoreButton = (0, import_react35.forwardRef)(
|
|
|
1958
1997
|
ShowMoreButton.displayName = "ShowMoreButton";
|
|
1959
1998
|
|
|
1960
1999
|
// src/skeleton/skeleton.tsx
|
|
1961
|
-
var
|
|
1962
|
-
var
|
|
1963
|
-
var
|
|
1964
|
-
var
|
|
1965
|
-
var Skeleton = (0,
|
|
2000
|
+
var import_typed_classname34 = require("@postenbring/hedwig-css/typed-classname");
|
|
2001
|
+
var import_react_slot14 = require("@radix-ui/react-slot");
|
|
2002
|
+
var import_react37 = require("react");
|
|
2003
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
2004
|
+
var Skeleton = (0, import_react37.forwardRef)(
|
|
1966
2005
|
(_a, ref) => {
|
|
1967
2006
|
var _b = _a, {
|
|
1968
2007
|
as: Tag = "div",
|
|
@@ -1985,11 +2024,11 @@ var Skeleton = (0, import_react36.forwardRef)(
|
|
|
1985
2024
|
"className",
|
|
1986
2025
|
"style"
|
|
1987
2026
|
]);
|
|
1988
|
-
const Component = asChild ?
|
|
1989
|
-
return /* @__PURE__ */ (0,
|
|
2027
|
+
const Component = asChild ? import_react_slot14.Slot : Tag;
|
|
2028
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
1990
2029
|
Component,
|
|
1991
2030
|
__spreadProps(__spreadValues(__spreadProps(__spreadValues({
|
|
1992
|
-
className: (0,
|
|
2031
|
+
className: (0, import_typed_classname34.clsx)(
|
|
1993
2032
|
"hds-skeleton",
|
|
1994
2033
|
`hds-skeleton--${variant}`,
|
|
1995
2034
|
!animation && `hds-skeleton--no-animation`,
|
|
@@ -2008,10 +2047,10 @@ var Skeleton = (0, import_react36.forwardRef)(
|
|
|
2008
2047
|
Skeleton.displayName = "Skeleton";
|
|
2009
2048
|
|
|
2010
2049
|
// src/step-indicator/step-indicator.tsx
|
|
2011
|
-
var
|
|
2012
|
-
var
|
|
2013
|
-
var
|
|
2014
|
-
var StepIndicator = (0,
|
|
2050
|
+
var import_typed_classname35 = require("@postenbring/hedwig-css/typed-classname");
|
|
2051
|
+
var import_react38 = require("react");
|
|
2052
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
2053
|
+
var StepIndicator = (0, import_react38.forwardRef)(
|
|
2015
2054
|
(_a, ref) => {
|
|
2016
2055
|
var _b = _a, {
|
|
2017
2056
|
activeStep,
|
|
@@ -2030,27 +2069,27 @@ var StepIndicator = (0, import_react37.forwardRef)(
|
|
|
2030
2069
|
"title",
|
|
2031
2070
|
"titleAs"
|
|
2032
2071
|
]);
|
|
2033
|
-
return /* @__PURE__ */ (0,
|
|
2072
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
2034
2073
|
"div",
|
|
2035
2074
|
__spreadProps(__spreadValues({
|
|
2036
2075
|
ref,
|
|
2037
|
-
className: (0,
|
|
2076
|
+
className: (0, import_typed_classname35.clsx)("hds-step-indicator", className),
|
|
2038
2077
|
lang
|
|
2039
2078
|
}, rest), {
|
|
2040
2079
|
children: [
|
|
2041
|
-
/* @__PURE__ */ (0,
|
|
2042
|
-
/* @__PURE__ */ (0,
|
|
2043
|
-
/* @__PURE__ */ (0,
|
|
2080
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: (0, import_typed_classname35.clsx)("hds-step-indicator__header"), children: [
|
|
2081
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: (0, import_typed_classname35.clsx)("hds-step-indicator__left-label"), children: label }),
|
|
2082
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { children: stepLabelTranslations[lang](activeStep, totalSteps) })
|
|
2044
2083
|
] }),
|
|
2045
|
-
/* @__PURE__ */ (0,
|
|
2084
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: (0, import_typed_classname35.clsx)("hds-step-indicator__steps"), children: Array.from({ length: totalSteps }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
2046
2085
|
"div",
|
|
2047
2086
|
{
|
|
2048
|
-
className: (0,
|
|
2087
|
+
className: (0, import_typed_classname35.clsx)("hds-step-indicator__step"),
|
|
2049
2088
|
"data-state": getStepState(i + 1, activeStep)
|
|
2050
2089
|
},
|
|
2051
2090
|
i
|
|
2052
2091
|
)) }),
|
|
2053
|
-
title ? /* @__PURE__ */ (0,
|
|
2092
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(TitleComponent, { className: (0, import_typed_classname35.clsx)("hds-step-indicator__title"), children: title }) : null
|
|
2054
2093
|
]
|
|
2055
2094
|
})
|
|
2056
2095
|
);
|
|
@@ -2074,18 +2113,18 @@ function getStepState(renderedStep, activeStep) {
|
|
|
2074
2113
|
}
|
|
2075
2114
|
|
|
2076
2115
|
// src/styled-html/styled-html.tsx
|
|
2077
|
-
var
|
|
2078
|
-
var
|
|
2079
|
-
var
|
|
2080
|
-
var
|
|
2081
|
-
var StyledHtml = (0,
|
|
2116
|
+
var import_react39 = require("react");
|
|
2117
|
+
var import_typed_classname36 = require("@postenbring/hedwig-css/typed-classname");
|
|
2118
|
+
var import_react_slot15 = require("@radix-ui/react-slot");
|
|
2119
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
2120
|
+
var StyledHtml = (0, import_react39.forwardRef)(
|
|
2082
2121
|
(_a, ref) => {
|
|
2083
|
-
var _b = _a, { asChild, children, size, darkmode = false, className } = _b, rest = __objRest(_b, ["asChild", "children", "size", "
|
|
2084
|
-
const Component = asChild ?
|
|
2085
|
-
return /* @__PURE__ */ (0,
|
|
2122
|
+
var _b = _a, { asChild, children, size, unstable_darkmode: darkmode = false, className } = _b, rest = __objRest(_b, ["asChild", "children", "size", "unstable_darkmode", "className"]);
|
|
2123
|
+
const Component = asChild ? import_react_slot15.Slot : "div";
|
|
2124
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
2086
2125
|
Component,
|
|
2087
2126
|
__spreadProps(__spreadValues({
|
|
2088
|
-
className: (0,
|
|
2127
|
+
className: (0, import_typed_classname36.clsx)(
|
|
2089
2128
|
`hds-styled-html`,
|
|
2090
2129
|
size === "small" && "hds-styled-html--small",
|
|
2091
2130
|
darkmode && "hds-styled-html--darkmode",
|
|
@@ -2101,20 +2140,20 @@ var StyledHtml = (0, import_react38.forwardRef)(
|
|
|
2101
2140
|
StyledHtml.displayName = "StyledHtml";
|
|
2102
2141
|
|
|
2103
2142
|
// src/table/table.tsx
|
|
2104
|
-
var
|
|
2105
|
-
var
|
|
2106
|
-
var
|
|
2107
|
-
var Table = (0,
|
|
2143
|
+
var import_typed_classname37 = require("@postenbring/hedwig-css/typed-classname");
|
|
2144
|
+
var import_react40 = require("react");
|
|
2145
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
2146
|
+
var Table = (0, import_react40.forwardRef)(
|
|
2108
2147
|
(_a, ref) => {
|
|
2109
2148
|
var _b = _a, { children, className, size, caption, description } = _b, rest = __objRest(_b, ["children", "className", "size", "caption", "description"]);
|
|
2110
|
-
const descriptionId = (0,
|
|
2111
|
-
return /* @__PURE__ */ (0,
|
|
2112
|
-
/* @__PURE__ */ (0,
|
|
2149
|
+
const descriptionId = (0, import_react40.useId)();
|
|
2150
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_jsx_runtime39.Fragment, { children: [
|
|
2151
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
|
|
2113
2152
|
"table",
|
|
2114
2153
|
__spreadProps(__spreadValues({
|
|
2115
2154
|
"aria-describedby": description ? descriptionId : void 0,
|
|
2116
2155
|
ref,
|
|
2117
|
-
className: (0,
|
|
2156
|
+
className: (0, import_typed_classname37.clsx)(
|
|
2118
2157
|
"hds-table",
|
|
2119
2158
|
{
|
|
2120
2159
|
"hds-table--compressed": size === "compressed",
|
|
@@ -2124,27 +2163,27 @@ var Table = (0, import_react39.forwardRef)(
|
|
|
2124
2163
|
)
|
|
2125
2164
|
}, rest), {
|
|
2126
2165
|
children: [
|
|
2127
|
-
caption ? /* @__PURE__ */ (0,
|
|
2166
|
+
caption ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("caption", { children: caption }) : null,
|
|
2128
2167
|
children
|
|
2129
2168
|
]
|
|
2130
2169
|
})
|
|
2131
2170
|
),
|
|
2132
|
-
description ? /* @__PURE__ */ (0,
|
|
2171
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("p", { className: (0, import_typed_classname37.clsx)("hds-table-description"), id: descriptionId, children: description }) : null
|
|
2133
2172
|
] });
|
|
2134
2173
|
}
|
|
2135
2174
|
);
|
|
2136
2175
|
Table.displayName = "Table";
|
|
2137
2176
|
|
|
2138
2177
|
// src/tabs/tabs.tsx
|
|
2139
|
-
var
|
|
2140
|
-
var
|
|
2141
|
-
var
|
|
2178
|
+
var import_react44 = require("react");
|
|
2179
|
+
var import_typed_classname40 = require("@postenbring/hedwig-css/typed-classname");
|
|
2180
|
+
var import_react_slot17 = require("@radix-ui/react-slot");
|
|
2142
2181
|
|
|
2143
2182
|
// src/tabs/context.ts
|
|
2144
|
-
var
|
|
2145
|
-
var TabsContext = (0,
|
|
2183
|
+
var import_react41 = require("react");
|
|
2184
|
+
var TabsContext = (0, import_react41.createContext)(null);
|
|
2146
2185
|
function useTabsContext() {
|
|
2147
|
-
const context = (0,
|
|
2186
|
+
const context = (0, import_react41.useContext)(TabsContext);
|
|
2148
2187
|
if (!context) {
|
|
2149
2188
|
throw new Error(
|
|
2150
2189
|
"Tabs context required. Did you use `<Tabs.List />`, `<Tabs.Tab />`, or `<Tabs.Content />` outside of <Tabs/>?"
|
|
@@ -2154,25 +2193,25 @@ function useTabsContext() {
|
|
|
2154
2193
|
}
|
|
2155
2194
|
|
|
2156
2195
|
// src/tabs/tabs-content.tsx
|
|
2157
|
-
var
|
|
2158
|
-
var
|
|
2159
|
-
var
|
|
2160
|
-
var
|
|
2161
|
-
var TabsContents = (0,
|
|
2196
|
+
var import_react42 = require("react");
|
|
2197
|
+
var import_typed_classname38 = require("@postenbring/hedwig-css/typed-classname");
|
|
2198
|
+
var import_react_slot16 = require("@radix-ui/react-slot");
|
|
2199
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
2200
|
+
var TabsContents = (0, import_react42.forwardRef)(
|
|
2162
2201
|
(_a, ref) => {
|
|
2163
2202
|
var _b = _a, { asChild, children } = _b, rest = __objRest(_b, ["asChild", "children"]);
|
|
2164
|
-
const Component = asChild ?
|
|
2165
|
-
return /* @__PURE__ */ (0,
|
|
2203
|
+
const Component = asChild ? import_react_slot16.Slot : "div";
|
|
2204
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Component, __spreadProps(__spreadValues({ ref, className: (0, import_typed_classname38.clsx)("hds-tabs__contents") }, rest), { children }));
|
|
2166
2205
|
}
|
|
2167
2206
|
);
|
|
2168
2207
|
TabsContents.displayName = "Tabs.Contents";
|
|
2169
|
-
var TabsContent = (0,
|
|
2208
|
+
var TabsContent = (0, import_react42.forwardRef)(
|
|
2170
2209
|
(_a, ref) => {
|
|
2171
2210
|
var _b = _a, { asChild, forTabId, children } = _b, rest = __objRest(_b, ["asChild", "forTabId", "children"]);
|
|
2172
2211
|
const context = useTabsContext();
|
|
2173
|
-
const Component = asChild ?
|
|
2212
|
+
const Component = asChild ? import_react_slot16.Slot : "div";
|
|
2174
2213
|
if (context.activeTabId === forTabId) {
|
|
2175
|
-
return /* @__PURE__ */ (0,
|
|
2214
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Component, __spreadProps(__spreadValues({}, rest), { ref, children }));
|
|
2176
2215
|
}
|
|
2177
2216
|
return null;
|
|
2178
2217
|
}
|
|
@@ -2180,21 +2219,21 @@ var TabsContent = (0, import_react41.forwardRef)(
|
|
|
2180
2219
|
TabsContent.displayName = "Tabs.Content";
|
|
2181
2220
|
|
|
2182
2221
|
// src/tabs/tabs-list.tsx
|
|
2183
|
-
var
|
|
2184
|
-
var
|
|
2185
|
-
var
|
|
2186
|
-
var TabsList = (0,
|
|
2222
|
+
var import_react43 = require("react");
|
|
2223
|
+
var import_typed_classname39 = require("@postenbring/hedwig-css/typed-classname");
|
|
2224
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
2225
|
+
var TabsList = (0, import_react43.forwardRef)(
|
|
2187
2226
|
(_a, ref) => {
|
|
2188
2227
|
var _b = _a, { children, direction = "horizontal", className } = _b, rest = __objRest(_b, ["children", "direction", "className"]);
|
|
2189
2228
|
const { activeTabId } = useTabsContext();
|
|
2190
|
-
const tabsListRef = (0,
|
|
2229
|
+
const tabsListRef = (0, import_react43.useRef)(null);
|
|
2191
2230
|
const mergedRef = useMergeRefs([tabsListRef, ref]);
|
|
2192
2231
|
const { width: tabsWidth } = useResize(tabsListRef);
|
|
2193
2232
|
const isClientSide = useHydrated();
|
|
2194
2233
|
const { innerWidth } = isClientSide ? window : { innerWidth: 1e3 };
|
|
2195
2234
|
const wideEnough = innerWidth >= tabsWidth;
|
|
2196
|
-
const previousTabId = (0,
|
|
2197
|
-
(0,
|
|
2235
|
+
const previousTabId = (0, import_react43.useRef)(activeTabId);
|
|
2236
|
+
(0, import_react43.useEffect)(() => {
|
|
2198
2237
|
const tabList = tabsListRef.current;
|
|
2199
2238
|
const activeTab = tabList == null ? void 0 : tabList.querySelector(`[data-tabid="${activeTabId}"]`);
|
|
2200
2239
|
if (!activeTab || !tabList) return;
|
|
@@ -2218,10 +2257,10 @@ var TabsList = (0, import_react42.forwardRef)(
|
|
|
2218
2257
|
}
|
|
2219
2258
|
previousTabId.current = activeTabId;
|
|
2220
2259
|
}, [activeTabId, innerWidth]);
|
|
2221
|
-
return /* @__PURE__ */ (0,
|
|
2260
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
2222
2261
|
"div",
|
|
2223
2262
|
__spreadProps(__spreadValues({
|
|
2224
|
-
className: (0,
|
|
2263
|
+
className: (0, import_typed_classname39.clsx)(
|
|
2225
2264
|
"hds-tabs__list",
|
|
2226
2265
|
direction === "horizontal" ? {
|
|
2227
2266
|
"hds-tabs__list--horizontal": wideEnough,
|
|
@@ -2240,7 +2279,7 @@ var TabsList = (0, import_react42.forwardRef)(
|
|
|
2240
2279
|
}
|
|
2241
2280
|
);
|
|
2242
2281
|
TabsList.displayName = "Tabs.List";
|
|
2243
|
-
var TabsTab = (0,
|
|
2282
|
+
var TabsTab = (0, import_react43.forwardRef)(
|
|
2244
2283
|
(_a, ref) => {
|
|
2245
2284
|
var _b = _a, { children, tabId, className, onClick } = _b, rest = __objRest(_b, ["children", "tabId", "className", "onClick"]);
|
|
2246
2285
|
const context = useTabsContext();
|
|
@@ -2249,10 +2288,10 @@ var TabsTab = (0, import_react42.forwardRef)(
|
|
|
2249
2288
|
context.toggleActiveTabId(tabId);
|
|
2250
2289
|
onClick == null ? void 0 : onClick(e);
|
|
2251
2290
|
};
|
|
2252
|
-
return /* @__PURE__ */ (0,
|
|
2291
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
2253
2292
|
"button",
|
|
2254
2293
|
__spreadProps(__spreadValues({
|
|
2255
|
-
className: (0,
|
|
2294
|
+
className: (0, import_typed_classname39.clsx)(
|
|
2256
2295
|
"hds-tabs__tab",
|
|
2257
2296
|
{ "hds-tabs__tab--active": context.activeTabId === tabId },
|
|
2258
2297
|
className
|
|
@@ -2271,13 +2310,13 @@ var TabsTab = (0, import_react42.forwardRef)(
|
|
|
2271
2310
|
TabsTab.displayName = "Tabs.Tab";
|
|
2272
2311
|
|
|
2273
2312
|
// src/tabs/tabs.tsx
|
|
2274
|
-
var
|
|
2275
|
-
var Tabs = (0,
|
|
2313
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
2314
|
+
var Tabs = (0, import_react44.forwardRef)(
|
|
2276
2315
|
(_a, ref) => {
|
|
2277
2316
|
var _b = _a, { asChild, defaultTab, children } = _b, rest = __objRest(_b, ["asChild", "defaultTab", "children"]);
|
|
2278
|
-
const [activeTabId, setActiveTabId] = (0,
|
|
2279
|
-
const Component = asChild ?
|
|
2280
|
-
return /* @__PURE__ */ (0,
|
|
2317
|
+
const [activeTabId, setActiveTabId] = (0, import_react44.useState)(defaultTab);
|
|
2318
|
+
const Component = asChild ? import_react_slot17.Slot : "div";
|
|
2319
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname40.clsx)("hds-tabs"), ref }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(TabsContext.Provider, { value: { activeTabId, toggleActiveTabId: setActiveTabId }, children }) }));
|
|
2281
2320
|
}
|
|
2282
2321
|
);
|
|
2283
2322
|
Tabs.displayName = "Tabs";
|
|
@@ -2287,10 +2326,10 @@ Tabs.Contents = TabsContents;
|
|
|
2287
2326
|
Tabs.Content = TabsContent;
|
|
2288
2327
|
|
|
2289
2328
|
// src/text/text.tsx
|
|
2290
|
-
var
|
|
2291
|
-
var
|
|
2292
|
-
var
|
|
2293
|
-
var
|
|
2329
|
+
var import_react45 = require("react");
|
|
2330
|
+
var import_typed_classname41 = require("@postenbring/hedwig-css/typed-classname");
|
|
2331
|
+
var import_react_slot18 = require("@radix-ui/react-slot");
|
|
2332
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
2294
2333
|
var defaultHTMLTag = {
|
|
2295
2334
|
"h1-display": "h1",
|
|
2296
2335
|
h1: "h1",
|
|
@@ -2306,7 +2345,7 @@ var defaultHTMLTag = {
|
|
|
2306
2345
|
caption: "p",
|
|
2307
2346
|
"caption-title": "p"
|
|
2308
2347
|
};
|
|
2309
|
-
var Text = (0,
|
|
2348
|
+
var Text = (0, import_react45.forwardRef)(
|
|
2310
2349
|
(_a, ref) => {
|
|
2311
2350
|
var _b = _a, {
|
|
2312
2351
|
as: Tag,
|
|
@@ -2325,12 +2364,12 @@ var Text = (0, import_react44.forwardRef)(
|
|
|
2325
2364
|
"children",
|
|
2326
2365
|
"className"
|
|
2327
2366
|
]);
|
|
2328
|
-
const Component = asChild ?
|
|
2367
|
+
const Component = asChild ? import_react_slot18.Slot : Tag != null ? Tag : defaultHTMLTag[variant];
|
|
2329
2368
|
const sizeModifier = size !== "fluid" && variant !== "caption" && variant !== "caption-title" && size;
|
|
2330
|
-
return /* @__PURE__ */ (0,
|
|
2369
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
2331
2370
|
Component,
|
|
2332
2371
|
__spreadProps(__spreadValues({
|
|
2333
|
-
className: (0,
|
|
2372
|
+
className: (0, import_typed_classname41.clsx)(
|
|
2334
2373
|
`hds-text-${variant}`,
|
|
2335
2374
|
sizeModifier && `hds-text--${sizeModifier}`,
|
|
2336
2375
|
spacing && "hds-text--spacing",
|
|
@@ -2346,9 +2385,9 @@ var Text = (0, import_react44.forwardRef)(
|
|
|
2346
2385
|
Text.displayName = "Text";
|
|
2347
2386
|
|
|
2348
2387
|
// src/utils/auto-animate-height.tsx
|
|
2349
|
-
var
|
|
2350
|
-
var
|
|
2351
|
-
var AutoAnimateHeight = (0,
|
|
2388
|
+
var import_react46 = require("react");
|
|
2389
|
+
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
2390
|
+
var AutoAnimateHeight = (0, import_react46.forwardRef)(
|
|
2352
2391
|
(_a, ref) => {
|
|
2353
2392
|
var _b = _a, {
|
|
2354
2393
|
children,
|
|
@@ -2364,16 +2403,16 @@ var AutoAnimateHeight = (0, import_react45.forwardRef)(
|
|
|
2364
2403
|
"onTransitionEnd"
|
|
2365
2404
|
]);
|
|
2366
2405
|
var _a2, _b2;
|
|
2367
|
-
const rootRef = (0,
|
|
2406
|
+
const rootRef = (0, import_react46.useRef)(null);
|
|
2368
2407
|
const mergedRef = useMergeRefs([rootRef, ref]);
|
|
2369
|
-
const measurementRef = (0,
|
|
2370
|
-
const [height, setHeight] = (0,
|
|
2408
|
+
const measurementRef = (0, import_react46.useRef)(null);
|
|
2409
|
+
const [height, setHeight] = (0, import_react46.useState)(
|
|
2371
2410
|
void 0
|
|
2372
2411
|
);
|
|
2373
|
-
const [clonedChildren, setClonedChildren] = (0,
|
|
2374
|
-
() => (0,
|
|
2412
|
+
const [clonedChildren, setClonedChildren] = (0, import_react46.useState)(
|
|
2413
|
+
() => (0, import_react46.cloneElement)(/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_jsx_runtime44.Fragment, { children }), {})
|
|
2375
2414
|
);
|
|
2376
|
-
(0,
|
|
2415
|
+
(0, import_react46.useEffect)(() => {
|
|
2377
2416
|
var _a3;
|
|
2378
2417
|
if (!rootRef.current) return;
|
|
2379
2418
|
if (!measurementRef.current) return;
|
|
@@ -2389,7 +2428,7 @@ var AutoAnimateHeight = (0, import_react45.forwardRef)(
|
|
|
2389
2428
|
});
|
|
2390
2429
|
resizeObserver.observe(currentMeasurement);
|
|
2391
2430
|
setHeight({ height: newHeight, shouldAnimate: true });
|
|
2392
|
-
const nextClonedChildren = (0,
|
|
2431
|
+
const nextClonedChildren = (0, import_react46.cloneElement)(/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_jsx_runtime44.Fragment, { children }), {});
|
|
2393
2432
|
if (newHeight >= ((_a3 = height == null ? void 0 : height.height) != null ? _a3 : 0)) {
|
|
2394
2433
|
setClonedChildren(nextClonedChildren);
|
|
2395
2434
|
return () => {
|
|
@@ -2407,7 +2446,7 @@ var AutoAnimateHeight = (0, import_react45.forwardRef)(
|
|
|
2407
2446
|
currentRoot.removeEventListener("transitionend", onTransitionEndHandler);
|
|
2408
2447
|
};
|
|
2409
2448
|
}, [children]);
|
|
2410
|
-
return /* @__PURE__ */ (0,
|
|
2449
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
|
|
2411
2450
|
"div",
|
|
2412
2451
|
__spreadProps(__spreadValues({
|
|
2413
2452
|
ref: mergedRef,
|
|
@@ -2423,7 +2462,7 @@ var AutoAnimateHeight = (0, import_react45.forwardRef)(
|
|
|
2423
2462
|
}, style)
|
|
2424
2463
|
}, rest), {
|
|
2425
2464
|
children: [
|
|
2426
|
-
/* @__PURE__ */ (0,
|
|
2465
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
2427
2466
|
"div",
|
|
2428
2467
|
{
|
|
2429
2468
|
"aria-hidden": true,
|
|
@@ -2445,16 +2484,16 @@ var AutoAnimateHeight = (0, import_react45.forwardRef)(
|
|
|
2445
2484
|
AutoAnimateHeight.displayName = "AutoAnimateHeight";
|
|
2446
2485
|
|
|
2447
2486
|
// src/warning-banner/warning-banner.tsx
|
|
2448
|
-
var
|
|
2449
|
-
var
|
|
2450
|
-
var
|
|
2451
|
-
var WarningBanner = (0,
|
|
2487
|
+
var import_react47 = require("react");
|
|
2488
|
+
var import_typed_classname42 = require("@postenbring/hedwig-css/typed-classname");
|
|
2489
|
+
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
2490
|
+
var WarningBanner = (0, import_react47.forwardRef)(
|
|
2452
2491
|
(_a, ref) => {
|
|
2453
2492
|
var _b = _a, { title, description, className } = _b, rest = __objRest(_b, ["title", "description", "className"]);
|
|
2454
|
-
const descriptionId = (0,
|
|
2493
|
+
const descriptionId = (0, import_react47.useId)();
|
|
2455
2494
|
const expandable = !!description;
|
|
2456
|
-
return /* @__PURE__ */ (0,
|
|
2457
|
-
/* @__PURE__ */ (0,
|
|
2495
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname42.clsx)("hds-warning-banner", className), ref, children: [
|
|
2496
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
2458
2497
|
WarningBannerTitle,
|
|
2459
2498
|
{
|
|
2460
2499
|
variant: expandable ? "expandable" : "default",
|
|
@@ -2462,22 +2501,22 @@ var WarningBanner = (0, import_react46.forwardRef)(
|
|
|
2462
2501
|
children: title
|
|
2463
2502
|
}
|
|
2464
2503
|
),
|
|
2465
|
-
expandable ? /* @__PURE__ */ (0,
|
|
2504
|
+
expandable ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(WarningBannerDescription, { id: descriptionId, children: description }) : null
|
|
2466
2505
|
] }));
|
|
2467
2506
|
}
|
|
2468
2507
|
);
|
|
2469
2508
|
WarningBanner.displayName = "WarningBanner";
|
|
2470
|
-
var WarningBannerTitle = (0,
|
|
2509
|
+
var WarningBannerTitle = (0, import_react47.forwardRef)((_a, ref) => {
|
|
2471
2510
|
var _b = _a, { variant, descriptionId, children, className } = _b, rest = __objRest(_b, ["variant", "descriptionId", "children", "className"]);
|
|
2472
|
-
const [open, setOpen] = (0,
|
|
2511
|
+
const [open, setOpen] = (0, import_react47.useState)(false);
|
|
2473
2512
|
if (variant === "expandable") {
|
|
2474
|
-
return /* @__PURE__ */ (0,
|
|
2513
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
2475
2514
|
"button",
|
|
2476
2515
|
__spreadProps(__spreadValues({}, rest), {
|
|
2477
2516
|
"aria-expanded": open,
|
|
2478
2517
|
"aria-controls": descriptionId,
|
|
2479
2518
|
"data-state": open ? "open" : "closed",
|
|
2480
|
-
className: (0,
|
|
2519
|
+
className: (0, import_typed_classname42.clsx)(
|
|
2481
2520
|
"hds-warning-banner__title",
|
|
2482
2521
|
"hds-warning-banner__title-trigger",
|
|
2483
2522
|
className
|
|
@@ -2487,28 +2526,28 @@ var WarningBannerTitle = (0, import_react46.forwardRef)((_a, ref) => {
|
|
|
2487
2526
|
},
|
|
2488
2527
|
ref,
|
|
2489
2528
|
type: "button",
|
|
2490
|
-
children: /* @__PURE__ */ (0,
|
|
2529
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { children })
|
|
2491
2530
|
})
|
|
2492
2531
|
);
|
|
2493
2532
|
}
|
|
2494
|
-
return /* @__PURE__ */ (0,
|
|
2533
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
2495
2534
|
"p",
|
|
2496
2535
|
__spreadProps(__spreadValues({}, rest), {
|
|
2497
|
-
className: (0,
|
|
2536
|
+
className: (0, import_typed_classname42.clsx)("hds-warning-banner__title", className),
|
|
2498
2537
|
ref,
|
|
2499
2538
|
children
|
|
2500
2539
|
})
|
|
2501
2540
|
);
|
|
2502
2541
|
});
|
|
2503
2542
|
WarningBannerTitle.displayName = "WarningBannerTitle";
|
|
2504
|
-
var WarningBannerDescription = (0,
|
|
2543
|
+
var WarningBannerDescription = (0, import_react47.forwardRef)(
|
|
2505
2544
|
(_a, ref) => {
|
|
2506
2545
|
var _b = _a, { className, id } = _b, rest = __objRest(_b, ["className", "id"]);
|
|
2507
|
-
return /* @__PURE__ */ (0,
|
|
2546
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
2508
2547
|
"p",
|
|
2509
2548
|
__spreadValues({
|
|
2510
2549
|
id,
|
|
2511
|
-
className: (0,
|
|
2550
|
+
className: (0, import_typed_classname42.clsx)("hds-warning-banner__description", className),
|
|
2512
2551
|
ref
|
|
2513
2552
|
}, rest)
|
|
2514
2553
|
);
|
|
@@ -2523,6 +2562,7 @@ WarningBannerDescription.displayName = "WarningBannerDescription";
|
|
|
2523
2562
|
AccordionItem,
|
|
2524
2563
|
AutoAnimateHeight,
|
|
2525
2564
|
Badge,
|
|
2565
|
+
Blockquote,
|
|
2526
2566
|
Box,
|
|
2527
2567
|
BoxCloseButton,
|
|
2528
2568
|
Breadcrumbs,
|
|
@@ -2574,8 +2614,8 @@ WarningBannerDescription.displayName = "WarningBannerDescription";
|
|
|
2574
2614
|
NavbarLogoAndServiceText,
|
|
2575
2615
|
NavbarNavigation,
|
|
2576
2616
|
OrderedList,
|
|
2617
|
+
RadioButton,
|
|
2577
2618
|
RadioGroup,
|
|
2578
|
-
Radiobutton,
|
|
2579
2619
|
Select,
|
|
2580
2620
|
ShowMoreButton,
|
|
2581
2621
|
Skeleton,
|