@postenbring/hedwig-react 0.0.88 → 0.0.90
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/chunk-K2CB2NLY.mjs +1 -0
- package/dist/chunk-K2CB2NLY.mjs.map +1 -0
- package/dist/chunk-OE6RISJS.mjs +24 -0
- package/dist/chunk-OE6RISJS.mjs.map +1 -0
- package/dist/figure/figure.d.ts +22 -0
- package/dist/figure/figure.d.ts.map +1 -0
- package/dist/figure/figure.js +71 -0
- package/dist/figure/figure.js.map +1 -0
- package/dist/figure/figure.mjs +8 -0
- package/dist/figure/figure.mjs.map +1 -0
- package/dist/figure/index.d.ts +3 -0
- package/dist/figure/index.d.ts.map +1 -0
- package/dist/figure/index.js +73 -0
- package/dist/figure/index.js.map +1 -0
- package/dist/figure/index.mjs +9 -0
- package/dist/figure/index.mjs.map +1 -0
- package/dist/form/index.mjs +9 -9
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +428 -412
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +44 -39
- package/dist/layout/index.mjs +6 -6
- package/package.json +2 -2
- package/src/accordion/accordion.stories.tsx +1 -0
- package/src/badge/badge.stories.tsx +1 -0
- package/src/blockquote/blockquote.stories.tsx +1 -0
- package/src/box/box.stories.tsx +1 -0
- package/src/breadcrumbs/breadcrumbs.stories.tsx +1 -0
- package/src/button/button.stories.tsx +1 -0
- package/src/card/card.stories.tsx +1 -0
- package/src/description-list/description-list.stories.tsx +1 -0
- package/src/figure/figure.stories.tsx +22 -0
- package/src/figure/figure.tsx +36 -0
- package/src/figure/index.tsx +3 -0
- package/src/form/checkbox/checkbox.stories.tsx +1 -0
- package/src/form/date-picker/date-picker.stories.tsx +1 -0
- package/src/form/error-message/error-message.stories.tsx +1 -0
- package/src/form/fieldset/fieldset.stories.tsx +1 -0
- package/src/form/input/input.stories.tsx +1 -0
- package/src/form/radio-button/radio-button.stories.tsx +2 -1
- package/src/form/radio-button/radio-group.stories.tsx +2 -1
- package/src/form/select/select.stories.tsx +1 -0
- package/src/form/textarea/textarea.stories.tsx +1 -0
- package/src/help-text/help-text.stories.tsx +1 -0
- package/src/index.ts +1 -0
- package/src/layout/container/container.stories.tsx +1 -0
- package/src/layout/grid/grid.stories.tsx +1 -0
- package/src/layout/stack/stack.stories.tsx +1 -0
- package/src/link/link.stories.tsx +1 -0
- package/src/list/link-list.stories.tsx +1 -0
- package/src/list/list.stories.tsx +1 -0
- package/src/message/message.stories.tsx +1 -0
- package/src/modal/modal.stories.tsx +2 -1
- package/src/navbar/navbar.stories.tsx +2 -1
- package/src/show-more/show-more.stories.tsx +1 -0
- package/src/skeleton/skeleton.stories.tsx +1 -0
- package/src/step-indicator/step-indicator.stories.tsx +1 -0
- package/src/styled-html/styled-html.stories.tsx +1 -0
- package/src/table/table.stories.tsx +1 -0
- package/src/tabs/tabs.stories.tsx +1 -0
- package/src/text/text.stories.tsx +1 -0
- package/src/warning-banner/warning-banner.stories.tsx +1 -0
package/dist/index.js
CHANGED
|
@@ -86,6 +86,7 @@ __export(src_exports, {
|
|
|
86
86
|
DescriptionList: () => DescriptionList,
|
|
87
87
|
ErrorMessage: () => ErrorMessage,
|
|
88
88
|
Fieldset: () => Fieldset,
|
|
89
|
+
Figure: () => Figure,
|
|
89
90
|
Footer: () => Footer,
|
|
90
91
|
FooterButtonLink: () => FooterButtonLink,
|
|
91
92
|
FooterLinkSection: () => FooterLinkSection,
|
|
@@ -622,22 +623,36 @@ var DescriptionList = (0, import_react12.forwardRef)(
|
|
|
622
623
|
);
|
|
623
624
|
DescriptionList.displayName = "DescriptionList";
|
|
624
625
|
|
|
625
|
-
// src/
|
|
626
|
-
var import_react15 = require("react");
|
|
627
|
-
var import_typed_classname14 = require("@postenbring/hedwig-css/typed-classname");
|
|
628
|
-
|
|
629
|
-
// src/form/error-message/error-message.tsx
|
|
626
|
+
// src/figure/figure.tsx
|
|
630
627
|
var import_typed_classname12 = require("@postenbring/hedwig-css/typed-classname");
|
|
628
|
+
var import_react_slot6 = require("@radix-ui/react-slot");
|
|
631
629
|
var import_react13 = require("react");
|
|
632
630
|
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
633
|
-
var
|
|
631
|
+
var Figure = (0, import_react13.forwardRef)(
|
|
632
|
+
(_a, ref) => {
|
|
633
|
+
var _b = _a, { children, asChild, className } = _b, rest = __objRest(_b, ["children", "asChild", "className"]);
|
|
634
|
+
const Component = asChild ? import_react_slot6.Slot : "figure";
|
|
635
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Component, __spreadProps(__spreadValues({ ref, className: (0, import_typed_classname12.clsx)("hds-figure", className) }, rest), { children }));
|
|
636
|
+
}
|
|
637
|
+
);
|
|
638
|
+
Figure.displayName = "Figure";
|
|
639
|
+
|
|
640
|
+
// src/form/checkbox/checkbox.tsx
|
|
641
|
+
var import_react16 = require("react");
|
|
642
|
+
var import_typed_classname15 = require("@postenbring/hedwig-css/typed-classname");
|
|
643
|
+
|
|
644
|
+
// src/form/error-message/error-message.tsx
|
|
645
|
+
var import_typed_classname13 = require("@postenbring/hedwig-css/typed-classname");
|
|
646
|
+
var import_react14 = require("react");
|
|
647
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
648
|
+
var ErrorMessage = (0, import_react14.forwardRef)(
|
|
634
649
|
(_a, ref) => {
|
|
635
650
|
var _b = _a, { children, id, className } = _b, rest = __objRest(_b, ["children", "id", "className"]);
|
|
636
|
-
return /* @__PURE__ */ (0,
|
|
651
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
637
652
|
"div",
|
|
638
653
|
__spreadProps(__spreadValues({
|
|
639
654
|
"aria-live": "assertive",
|
|
640
|
-
className: (0,
|
|
655
|
+
className: (0, import_typed_classname13.clsx)("hds-error-message", className),
|
|
641
656
|
id,
|
|
642
657
|
ref
|
|
643
658
|
}, rest), {
|
|
@@ -649,12 +664,12 @@ var ErrorMessage = (0, import_react13.forwardRef)(
|
|
|
649
664
|
ErrorMessage.displayName = "ErrorMessage";
|
|
650
665
|
|
|
651
666
|
// src/form/fieldset/fieldset.tsx
|
|
652
|
-
var
|
|
653
|
-
var
|
|
654
|
-
var
|
|
655
|
-
var FieldsetContext = (0,
|
|
656
|
-
var useFieldsetContext = () => (0,
|
|
657
|
-
var Fieldset = (0,
|
|
667
|
+
var import_react15 = require("react");
|
|
668
|
+
var import_typed_classname14 = require("@postenbring/hedwig-css/typed-classname");
|
|
669
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
670
|
+
var FieldsetContext = (0, import_react15.createContext)({ hasError: false });
|
|
671
|
+
var useFieldsetContext = () => (0, import_react15.useContext)(FieldsetContext);
|
|
672
|
+
var Fieldset = (0, import_react15.forwardRef)(function Fieldset2(_a, ref) {
|
|
658
673
|
var _b = _a, {
|
|
659
674
|
className,
|
|
660
675
|
style,
|
|
@@ -671,21 +686,21 @@ var Fieldset = (0, import_react14.forwardRef)(function Fieldset2(_a, ref) {
|
|
|
671
686
|
"legend",
|
|
672
687
|
"children"
|
|
673
688
|
]);
|
|
674
|
-
const errorMessageId = (0,
|
|
675
|
-
return /* @__PURE__ */ (0,
|
|
689
|
+
const errorMessageId = (0, import_react15.useId)();
|
|
690
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
|
|
676
691
|
"fieldset",
|
|
677
692
|
__spreadProps(__spreadValues({
|
|
678
693
|
"aria-describedby": errorMessage ? errorMessageId : void 0,
|
|
679
694
|
"aria-invalid": errorMessage ? true : void 0,
|
|
680
|
-
className: (0,
|
|
695
|
+
className: (0, import_typed_classname14.clsx)("hds-fieldset", className),
|
|
681
696
|
ref,
|
|
682
697
|
style
|
|
683
698
|
}, rest), {
|
|
684
699
|
children: [
|
|
685
|
-
/* @__PURE__ */ (0,
|
|
700
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
686
701
|
"legend",
|
|
687
702
|
__spreadProps(__spreadValues({
|
|
688
|
-
className: (0,
|
|
703
|
+
className: (0, import_typed_classname14.clsx)(
|
|
689
704
|
"hds-fieldset__legend",
|
|
690
705
|
{ [`hds-fieldset__legend--${legendSize}`]: legendSize },
|
|
691
706
|
legendClassName
|
|
@@ -694,16 +709,16 @@ var Fieldset = (0, import_react14.forwardRef)(function Fieldset2(_a, ref) {
|
|
|
694
709
|
children: legend
|
|
695
710
|
})
|
|
696
711
|
),
|
|
697
|
-
/* @__PURE__ */ (0,
|
|
698
|
-
/* @__PURE__ */ (0,
|
|
712
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(FieldsetContext.Provider, { value: { hasError: Boolean(errorMessage) }, children }),
|
|
713
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ErrorMessage, { id: errorMessageId, children: errorMessage })
|
|
699
714
|
]
|
|
700
715
|
})
|
|
701
716
|
);
|
|
702
717
|
});
|
|
703
718
|
|
|
704
719
|
// src/form/checkbox/checkbox.tsx
|
|
705
|
-
var
|
|
706
|
-
var Checkbox = (0,
|
|
720
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
721
|
+
var Checkbox = (0, import_react16.forwardRef)(
|
|
707
722
|
(_a, ref) => {
|
|
708
723
|
var _b = _a, {
|
|
709
724
|
variant = "plain",
|
|
@@ -720,14 +735,14 @@ var Checkbox = (0, import_react15.forwardRef)(
|
|
|
720
735
|
"children",
|
|
721
736
|
"className"
|
|
722
737
|
]);
|
|
723
|
-
const errorMessageId = (0,
|
|
738
|
+
const errorMessageId = (0, import_react16.useId)();
|
|
724
739
|
const { hasError: hasFieldsetError } = useFieldsetContext();
|
|
725
740
|
const hasError = !!errorMessage || hasFieldsetError || hasErrorProp;
|
|
726
|
-
return /* @__PURE__ */ (0,
|
|
727
|
-
/* @__PURE__ */ (0,
|
|
741
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: (0, import_typed_classname15.clsx)("hds-checkbox-wrapper"), children: [
|
|
742
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
728
743
|
"div",
|
|
729
744
|
{
|
|
730
|
-
className: (0,
|
|
745
|
+
className: (0, import_typed_classname15.clsx)(
|
|
731
746
|
"hds-checkbox",
|
|
732
747
|
{
|
|
733
748
|
[`hds-checkbox--${variant}`]: variant === "bounding-box",
|
|
@@ -736,8 +751,8 @@ var Checkbox = (0, import_react15.forwardRef)(
|
|
|
736
751
|
className
|
|
737
752
|
),
|
|
738
753
|
children: [
|
|
739
|
-
/* @__PURE__ */ (0,
|
|
740
|
-
/* @__PURE__ */ (0,
|
|
754
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("label", { children: [
|
|
755
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
741
756
|
"input",
|
|
742
757
|
__spreadProps(__spreadValues({}, rest), {
|
|
743
758
|
"aria-invalid": hasError ? true : void 0,
|
|
@@ -746,28 +761,28 @@ var Checkbox = (0, import_react15.forwardRef)(
|
|
|
746
761
|
type: "checkbox"
|
|
747
762
|
})
|
|
748
763
|
),
|
|
749
|
-
/* @__PURE__ */ (0,
|
|
750
|
-
title ? /* @__PURE__ */ (0,
|
|
764
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { "aria-hidden": true, className: "hds-checkbox__checkmark" }),
|
|
765
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "hds-checkbox__title", children: title }) : children
|
|
751
766
|
] }),
|
|
752
767
|
title ? children : null
|
|
753
768
|
]
|
|
754
769
|
}
|
|
755
770
|
),
|
|
756
|
-
errorMessage ? /* @__PURE__ */ (0,
|
|
771
|
+
errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ErrorMessage, { id: errorMessageId, children: errorMessage }) : null
|
|
757
772
|
] });
|
|
758
773
|
}
|
|
759
774
|
);
|
|
760
775
|
Checkbox.displayName = "Checkbox";
|
|
761
776
|
|
|
762
777
|
// src/form/date-picker/date-picker.tsx
|
|
763
|
-
var
|
|
764
|
-
var
|
|
778
|
+
var import_react19 = require("react");
|
|
779
|
+
var import_typed_classname17 = require("@postenbring/hedwig-css/typed-classname");
|
|
765
780
|
|
|
766
781
|
// src/form/input-group/input-group.tsx
|
|
767
|
-
var
|
|
768
|
-
var
|
|
769
|
-
var
|
|
770
|
-
var InputGroup = (0,
|
|
782
|
+
var import_react17 = require("react");
|
|
783
|
+
var import_typed_classname16 = require("@postenbring/hedwig-css/typed-classname");
|
|
784
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
785
|
+
var InputGroup = (0, import_react17.forwardRef)(function InputGroup2(_a, ref) {
|
|
771
786
|
var _b = _a, {
|
|
772
787
|
id,
|
|
773
788
|
className,
|
|
@@ -792,31 +807,31 @@ var InputGroup = (0, import_react16.forwardRef)(function InputGroup2(_a, ref) {
|
|
|
792
807
|
"readOnly",
|
|
793
808
|
"children"
|
|
794
809
|
]);
|
|
795
|
-
const errorMessageId = (0,
|
|
796
|
-
const inputId = (0,
|
|
810
|
+
const errorMessageId = (0, import_react17.useId)();
|
|
811
|
+
const inputId = (0, import_react17.useId)();
|
|
797
812
|
const renderInput = () => {
|
|
798
813
|
var _a2;
|
|
799
814
|
const inputProps = {
|
|
800
815
|
"aria-describedby": errorMessage ? errorMessageId : void 0,
|
|
801
816
|
"aria-invalid": errorMessage ? true : void 0,
|
|
802
817
|
id: id != null ? id : inputId,
|
|
803
|
-
className: (0,
|
|
818
|
+
className: (0, import_typed_classname16.clsx)("hds-input-group__input")
|
|
804
819
|
};
|
|
805
820
|
if (typeof children === "function") {
|
|
806
821
|
return children(inputProps);
|
|
807
822
|
}
|
|
808
|
-
const input =
|
|
809
|
-
if (!(0,
|
|
823
|
+
const input = import_react17.Children.toArray(children)[0];
|
|
824
|
+
if (!(0, import_react17.isValidElement)(input)) {
|
|
810
825
|
return;
|
|
811
826
|
}
|
|
812
|
-
return (0,
|
|
827
|
+
return (0, import_react17.cloneElement)(input, __spreadProps(__spreadValues(__spreadValues({}, inputProps), input.props), {
|
|
813
828
|
className: `${inputProps.className} ${(_a2 = input.props.className) != null ? _a2 : ""}`
|
|
814
829
|
}));
|
|
815
830
|
};
|
|
816
|
-
return /* @__PURE__ */ (0,
|
|
831
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
817
832
|
"div",
|
|
818
833
|
__spreadProps(__spreadValues({
|
|
819
|
-
className: (0,
|
|
834
|
+
className: (0, import_typed_classname16.clsx)(
|
|
820
835
|
"hds-input-group",
|
|
821
836
|
{
|
|
822
837
|
[`hds-input-group--${variant}`]: variant,
|
|
@@ -828,25 +843,25 @@ var InputGroup = (0, import_react16.forwardRef)(function InputGroup2(_a, ref) {
|
|
|
828
843
|
style
|
|
829
844
|
}, rest), {
|
|
830
845
|
children: [
|
|
831
|
-
/* @__PURE__ */ (0,
|
|
846
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
832
847
|
"label",
|
|
833
848
|
__spreadProps(__spreadValues({
|
|
834
|
-
className: (0,
|
|
849
|
+
className: (0, import_typed_classname16.clsx)("hds-input-group__label", labelClassName)
|
|
835
850
|
}, labelProps), {
|
|
836
851
|
htmlFor: id != null ? id : inputId,
|
|
837
852
|
children: label
|
|
838
853
|
})
|
|
839
854
|
),
|
|
840
|
-
/* @__PURE__ */ (0,
|
|
855
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
841
856
|
"div",
|
|
842
857
|
{
|
|
843
|
-
className: (0,
|
|
858
|
+
className: (0, import_typed_classname16.clsx)("hds-input-group__input-wrapper"),
|
|
844
859
|
"data-disabled": disabled,
|
|
845
860
|
"data-readonly": readOnly,
|
|
846
861
|
children: renderInput()
|
|
847
862
|
}
|
|
848
863
|
),
|
|
849
|
-
/* @__PURE__ */ (0,
|
|
864
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ErrorMessage, { id: errorMessageId, children: errorMessage })
|
|
850
865
|
]
|
|
851
866
|
})
|
|
852
867
|
);
|
|
@@ -854,7 +869,7 @@ var InputGroup = (0, import_react16.forwardRef)(function InputGroup2(_a, ref) {
|
|
|
854
869
|
|
|
855
870
|
// src/utils/utils.ts
|
|
856
871
|
var React = __toESM(require("react"));
|
|
857
|
-
var
|
|
872
|
+
var import_react18 = require("react");
|
|
858
873
|
function useMergeRefs(refs) {
|
|
859
874
|
return React.useMemo(() => {
|
|
860
875
|
if (refs.every((ref) => ref === null)) {
|
|
@@ -872,16 +887,16 @@ function useMergeRefs(refs) {
|
|
|
872
887
|
}, refs);
|
|
873
888
|
}
|
|
874
889
|
function useResize(ref) {
|
|
875
|
-
const [width, setWidth] = (0,
|
|
876
|
-
const [height, setHeight] = (0,
|
|
877
|
-
const handleResize = (0,
|
|
890
|
+
const [width, setWidth] = (0, import_react18.useState)(0);
|
|
891
|
+
const [height, setHeight] = (0, import_react18.useState)(0);
|
|
892
|
+
const handleResize = (0, import_react18.useCallback)(() => {
|
|
878
893
|
var _a, _b, _c, _d;
|
|
879
894
|
if ((ref == null ? void 0 : ref.current) !== null) {
|
|
880
895
|
setWidth((_b = (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.offsetWidth) != null ? _b : 0);
|
|
881
896
|
setHeight((_d = (_c = ref == null ? void 0 : ref.current) == null ? void 0 : _c.offsetHeight) != null ? _d : 0);
|
|
882
897
|
}
|
|
883
898
|
}, [ref]);
|
|
884
|
-
(0,
|
|
899
|
+
(0, import_react18.useEffect)(() => {
|
|
885
900
|
window.addEventListener("load", handleResize);
|
|
886
901
|
window.addEventListener("resize", handleResize);
|
|
887
902
|
return () => {
|
|
@@ -889,7 +904,7 @@ function useResize(ref) {
|
|
|
889
904
|
window.removeEventListener("resize", handleResize);
|
|
890
905
|
};
|
|
891
906
|
}, [ref, handleResize]);
|
|
892
|
-
(0,
|
|
907
|
+
(0, import_react18.useEffect)(() => {
|
|
893
908
|
handleResize();
|
|
894
909
|
}, []);
|
|
895
910
|
return { width, height };
|
|
@@ -932,8 +947,8 @@ function releaseFocusTrap(inertElements) {
|
|
|
932
947
|
}
|
|
933
948
|
|
|
934
949
|
// src/form/date-picker/date-picker.tsx
|
|
935
|
-
var
|
|
936
|
-
var DatePicker = (0,
|
|
950
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
951
|
+
var DatePicker = (0, import_react19.forwardRef)(function DatePicker2(_a, ref) {
|
|
937
952
|
var _b = _a, {
|
|
938
953
|
className,
|
|
939
954
|
variant,
|
|
@@ -957,12 +972,12 @@ var DatePicker = (0, import_react18.forwardRef)(function DatePicker2(_a, ref) {
|
|
|
957
972
|
"readOnly",
|
|
958
973
|
"calendarButtonTitle"
|
|
959
974
|
]);
|
|
960
|
-
const inputRef = (0,
|
|
975
|
+
const inputRef = (0, import_react19.useRef)(null);
|
|
961
976
|
const mergedRef = useMergeRefs([inputRef, ref]);
|
|
962
|
-
return /* @__PURE__ */ (0,
|
|
977
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
963
978
|
InputGroup,
|
|
964
979
|
{
|
|
965
|
-
className: (0,
|
|
980
|
+
className: (0, import_typed_classname17.clsx)("hds-date-picker", className),
|
|
966
981
|
disabled,
|
|
967
982
|
errorMessage,
|
|
968
983
|
id,
|
|
@@ -971,8 +986,8 @@ var DatePicker = (0, import_react18.forwardRef)(function DatePicker2(_a, ref) {
|
|
|
971
986
|
readOnly,
|
|
972
987
|
style,
|
|
973
988
|
variant,
|
|
974
|
-
children: (inputProps) => /* @__PURE__ */ (0,
|
|
975
|
-
/* @__PURE__ */ (0,
|
|
989
|
+
children: (inputProps) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
|
|
990
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
976
991
|
"input",
|
|
977
992
|
__spreadProps(__spreadValues(__spreadValues({}, rest), inputProps), {
|
|
978
993
|
disabled,
|
|
@@ -981,10 +996,10 @@ var DatePicker = (0, import_react18.forwardRef)(function DatePicker2(_a, ref) {
|
|
|
981
996
|
type: "date"
|
|
982
997
|
})
|
|
983
998
|
),
|
|
984
|
-
/* @__PURE__ */ (0,
|
|
999
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
985
1000
|
"button",
|
|
986
1001
|
{
|
|
987
|
-
className: (0,
|
|
1002
|
+
className: (0, import_typed_classname17.clsx)("hds-date-picker__calendar-button"),
|
|
988
1003
|
type: "button",
|
|
989
1004
|
title: calendarButtonTitle,
|
|
990
1005
|
onClick: () => {
|
|
@@ -1000,15 +1015,15 @@ var DatePicker = (0, import_react18.forwardRef)(function DatePicker2(_a, ref) {
|
|
|
1000
1015
|
DatePicker.displayName = "DatePicker";
|
|
1001
1016
|
|
|
1002
1017
|
// src/form/input/input.tsx
|
|
1003
|
-
var
|
|
1004
|
-
var
|
|
1005
|
-
var
|
|
1006
|
-
var Input = (0,
|
|
1018
|
+
var import_react20 = require("react");
|
|
1019
|
+
var import_typed_classname18 = require("@postenbring/hedwig-css/typed-classname");
|
|
1020
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
1021
|
+
var Input = (0, import_react20.forwardRef)(function Input2(_a, ref) {
|
|
1007
1022
|
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"]);
|
|
1008
|
-
return /* @__PURE__ */ (0,
|
|
1023
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
1009
1024
|
InputGroup,
|
|
1010
1025
|
{
|
|
1011
|
-
className: (0,
|
|
1026
|
+
className: (0, import_typed_classname18.clsx)("hds-input", className),
|
|
1012
1027
|
disabled,
|
|
1013
1028
|
errorMessage,
|
|
1014
1029
|
id,
|
|
@@ -1017,35 +1032,35 @@ var Input = (0, import_react19.forwardRef)(function Input2(_a, ref) {
|
|
|
1017
1032
|
readOnly,
|
|
1018
1033
|
style,
|
|
1019
1034
|
variant,
|
|
1020
|
-
children: /* @__PURE__ */ (0,
|
|
1035
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("input", __spreadProps(__spreadValues({}, rest), { disabled, readOnly, ref }))
|
|
1021
1036
|
}
|
|
1022
1037
|
);
|
|
1023
1038
|
});
|
|
1024
1039
|
Input.displayName = "Input";
|
|
1025
1040
|
|
|
1026
1041
|
// src/form/radio-button/radio-button.tsx
|
|
1027
|
-
var
|
|
1028
|
-
var
|
|
1042
|
+
var import_react22 = require("react");
|
|
1043
|
+
var import_typed_classname19 = require("@postenbring/hedwig-css/typed-classname");
|
|
1029
1044
|
|
|
1030
1045
|
// src/form/radio-button/radio-group.tsx
|
|
1031
|
-
var
|
|
1032
|
-
var
|
|
1033
|
-
var RadioGroupContext = (0,
|
|
1046
|
+
var import_react21 = require("react");
|
|
1047
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
1048
|
+
var RadioGroupContext = (0, import_react21.createContext)({
|
|
1034
1049
|
name: void 0,
|
|
1035
1050
|
hasError: false,
|
|
1036
1051
|
onChange: () => {
|
|
1037
1052
|
return void 0;
|
|
1038
1053
|
}
|
|
1039
1054
|
});
|
|
1040
|
-
var useRadioGroupContext = () => (0,
|
|
1041
|
-
var RadioGroup = (0,
|
|
1055
|
+
var useRadioGroupContext = () => (0, import_react21.useContext)(RadioGroupContext);
|
|
1056
|
+
var RadioGroup = (0, import_react21.forwardRef)(function RadioGroup2(_a, ref) {
|
|
1042
1057
|
var _b = _a, { name, value, errorMessage, onChange, children } = _b, rest = __objRest(_b, ["name", "value", "errorMessage", "onChange", "children"]);
|
|
1043
|
-
return /* @__PURE__ */ (0,
|
|
1058
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(RadioGroupContext.Provider, { value: { name, value, hasError: Boolean(errorMessage), onChange }, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Fieldset, __spreadProps(__spreadValues({ errorMessage }, rest), { ref, children })) });
|
|
1044
1059
|
});
|
|
1045
1060
|
RadioGroup.displayName = "RadioGroup";
|
|
1046
1061
|
|
|
1047
1062
|
// src/form/radio-button/radio-button.tsx
|
|
1048
|
-
var
|
|
1063
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
1049
1064
|
var isChecked = ({
|
|
1050
1065
|
checked,
|
|
1051
1066
|
selectedValue,
|
|
@@ -1055,7 +1070,7 @@ var isChecked = ({
|
|
|
1055
1070
|
if (typeof selectedValue !== "undefined") return value === selectedValue;
|
|
1056
1071
|
return void 0;
|
|
1057
1072
|
};
|
|
1058
|
-
var RadioButton = (0,
|
|
1073
|
+
var RadioButton = (0, import_react22.forwardRef)(
|
|
1059
1074
|
(_a, ref) => {
|
|
1060
1075
|
var _b = _a, {
|
|
1061
1076
|
checked,
|
|
@@ -1083,10 +1098,10 @@ var RadioButton = (0, import_react21.forwardRef)(
|
|
|
1083
1098
|
]);
|
|
1084
1099
|
const { hasError: hasFieldsetError } = useFieldsetContext();
|
|
1085
1100
|
const hasError = hasFieldsetError || hasRadioGroupError || hasErrorProp;
|
|
1086
|
-
return /* @__PURE__ */ (0,
|
|
1101
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
1087
1102
|
"div",
|
|
1088
1103
|
{
|
|
1089
|
-
className: (0,
|
|
1104
|
+
className: (0, import_typed_classname19.clsx)(
|
|
1090
1105
|
"hds-radio-button",
|
|
1091
1106
|
{
|
|
1092
1107
|
[`hds-radio-button--${variant}`]: variant === "bounding-box",
|
|
@@ -1095,8 +1110,8 @@ var RadioButton = (0, import_react21.forwardRef)(
|
|
|
1095
1110
|
className
|
|
1096
1111
|
),
|
|
1097
1112
|
children: [
|
|
1098
|
-
/* @__PURE__ */ (0,
|
|
1099
|
-
/* @__PURE__ */ (0,
|
|
1113
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("label", { children: [
|
|
1114
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
1100
1115
|
"input",
|
|
1101
1116
|
__spreadProps(__spreadValues(__spreadValues({}, context), rest), {
|
|
1102
1117
|
checked: isChecked({ checked, selectedValue, value }),
|
|
@@ -1105,8 +1120,8 @@ var RadioButton = (0, import_react21.forwardRef)(
|
|
|
1105
1120
|
type: "radio"
|
|
1106
1121
|
})
|
|
1107
1122
|
),
|
|
1108
|
-
/* @__PURE__ */ (0,
|
|
1109
|
-
title ? /* @__PURE__ */ (0,
|
|
1123
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { "aria-hidden": true, className: "hds-radio-button__checkmark" }),
|
|
1124
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "hds-radio-button__title", children: title }) : children
|
|
1110
1125
|
] }),
|
|
1111
1126
|
title ? children : null
|
|
1112
1127
|
]
|
|
@@ -1117,15 +1132,15 @@ var RadioButton = (0, import_react21.forwardRef)(
|
|
|
1117
1132
|
RadioButton.displayName = "RadioButton";
|
|
1118
1133
|
|
|
1119
1134
|
// src/form/select/select.tsx
|
|
1120
|
-
var
|
|
1121
|
-
var
|
|
1122
|
-
var
|
|
1123
|
-
var Select = (0,
|
|
1135
|
+
var import_react23 = require("react");
|
|
1136
|
+
var import_typed_classname20 = require("@postenbring/hedwig-css/typed-classname");
|
|
1137
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
1138
|
+
var Select = (0, import_react23.forwardRef)(function Select2(_a, ref) {
|
|
1124
1139
|
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"]);
|
|
1125
|
-
return /* @__PURE__ */ (0,
|
|
1140
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
1126
1141
|
InputGroup,
|
|
1127
1142
|
{
|
|
1128
|
-
className: (0,
|
|
1143
|
+
className: (0, import_typed_classname20.clsx)("hds-select", className),
|
|
1129
1144
|
disabled,
|
|
1130
1145
|
errorMessage,
|
|
1131
1146
|
id,
|
|
@@ -1133,22 +1148,22 @@ var Select = (0, import_react22.forwardRef)(function Select2(_a, ref) {
|
|
|
1133
1148
|
labelProps,
|
|
1134
1149
|
style,
|
|
1135
1150
|
variant,
|
|
1136
|
-
children: /* @__PURE__ */ (0,
|
|
1151
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("select", __spreadProps(__spreadValues({}, rest), { disabled, ref, children }))
|
|
1137
1152
|
}
|
|
1138
1153
|
);
|
|
1139
1154
|
});
|
|
1140
1155
|
Select.displayName = "Select";
|
|
1141
1156
|
|
|
1142
1157
|
// src/form/textarea/textarea.tsx
|
|
1143
|
-
var
|
|
1144
|
-
var
|
|
1145
|
-
var
|
|
1146
|
-
var Textarea = (0,
|
|
1158
|
+
var import_react24 = require("react");
|
|
1159
|
+
var import_typed_classname21 = require("@postenbring/hedwig-css/typed-classname");
|
|
1160
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
1161
|
+
var Textarea = (0, import_react24.forwardRef)(function Textarea2(_a, ref) {
|
|
1147
1162
|
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"]);
|
|
1148
|
-
return /* @__PURE__ */ (0,
|
|
1163
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
1149
1164
|
InputGroup,
|
|
1150
1165
|
{
|
|
1151
|
-
className: (0,
|
|
1166
|
+
className: (0, import_typed_classname21.clsx)("hds-textarea", className),
|
|
1152
1167
|
disabled,
|
|
1153
1168
|
errorMessage,
|
|
1154
1169
|
id,
|
|
@@ -1157,46 +1172,46 @@ var Textarea = (0, import_react23.forwardRef)(function Textarea2(_a, ref) {
|
|
|
1157
1172
|
readOnly,
|
|
1158
1173
|
style,
|
|
1159
1174
|
variant,
|
|
1160
|
-
children: /* @__PURE__ */ (0,
|
|
1175
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("textarea", __spreadProps(__spreadValues({}, rest), { disabled, readOnly, ref }))
|
|
1161
1176
|
}
|
|
1162
1177
|
);
|
|
1163
1178
|
});
|
|
1164
1179
|
Textarea.displayName = "Textarea";
|
|
1165
1180
|
|
|
1166
1181
|
// src/footer/footer.tsx
|
|
1167
|
-
var
|
|
1168
|
-
var
|
|
1169
|
-
var
|
|
1182
|
+
var import_react27 = require("react");
|
|
1183
|
+
var import_typed_classname24 = require("@postenbring/hedwig-css/typed-classname");
|
|
1184
|
+
var import_react_slot7 = require("@radix-ui/react-slot");
|
|
1170
1185
|
|
|
1171
1186
|
// src/list/link-list.tsx
|
|
1172
|
-
var
|
|
1173
|
-
var
|
|
1187
|
+
var import_typed_classname23 = require("@postenbring/hedwig-css/typed-classname");
|
|
1188
|
+
var import_react26 = require("react");
|
|
1174
1189
|
|
|
1175
1190
|
// src/list/list.tsx
|
|
1176
|
-
var
|
|
1177
|
-
var
|
|
1178
|
-
var
|
|
1179
|
-
var UnorderedList = (0,
|
|
1191
|
+
var import_react25 = require("react");
|
|
1192
|
+
var import_typed_classname22 = require("@postenbring/hedwig-css/typed-classname");
|
|
1193
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
1194
|
+
var UnorderedList = (0, import_react25.forwardRef)(
|
|
1180
1195
|
(_a, ref) => {
|
|
1181
1196
|
var _b = _a, { size = "medium", className } = _b, rest = __objRest(_b, ["size", "className"]);
|
|
1182
|
-
return /* @__PURE__ */ (0,
|
|
1197
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
1183
1198
|
"ul",
|
|
1184
1199
|
__spreadValues({
|
|
1185
1200
|
ref,
|
|
1186
|
-
className: (0,
|
|
1201
|
+
className: (0, import_typed_classname22.clsx)("hds-list", `hds-list--${size}`, className)
|
|
1187
1202
|
}, rest)
|
|
1188
1203
|
);
|
|
1189
1204
|
}
|
|
1190
1205
|
);
|
|
1191
1206
|
UnorderedList.displayName = "UnorderedList";
|
|
1192
|
-
var OrderedList = (0,
|
|
1207
|
+
var OrderedList = (0, import_react25.forwardRef)(
|
|
1193
1208
|
(_a, ref) => {
|
|
1194
1209
|
var _b = _a, { size = "medium", className } = _b, rest = __objRest(_b, ["size", "className"]);
|
|
1195
|
-
return /* @__PURE__ */ (0,
|
|
1210
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
1196
1211
|
"ol",
|
|
1197
1212
|
__spreadValues({
|
|
1198
1213
|
ref,
|
|
1199
|
-
className: (0,
|
|
1214
|
+
className: (0, import_typed_classname22.clsx)("hds-list", `hds-list--${size}`, className)
|
|
1200
1215
|
}, rest)
|
|
1201
1216
|
);
|
|
1202
1217
|
}
|
|
@@ -1204,15 +1219,15 @@ var OrderedList = (0, import_react24.forwardRef)(
|
|
|
1204
1219
|
OrderedList.displayName = "OrderedList";
|
|
1205
1220
|
|
|
1206
1221
|
// src/list/link-list.tsx
|
|
1207
|
-
var
|
|
1208
|
-
var LinkList = (0,
|
|
1222
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
1223
|
+
var LinkList = (0, import_react26.forwardRef)(
|
|
1209
1224
|
(_a, ref) => {
|
|
1210
1225
|
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
|
1211
|
-
return /* @__PURE__ */ (0,
|
|
1226
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
1212
1227
|
UnorderedList,
|
|
1213
1228
|
__spreadValues({
|
|
1214
1229
|
ref,
|
|
1215
|
-
className: (0,
|
|
1230
|
+
className: (0, import_typed_classname23.clsx)("hds-list--link-list", className)
|
|
1216
1231
|
}, rest)
|
|
1217
1232
|
);
|
|
1218
1233
|
}
|
|
@@ -1220,30 +1235,30 @@ var LinkList = (0, import_react25.forwardRef)(
|
|
|
1220
1235
|
LinkList.displayName = "LinkList";
|
|
1221
1236
|
|
|
1222
1237
|
// src/footer/footer.tsx
|
|
1223
|
-
var
|
|
1224
|
-
var FooterLogo = (0,
|
|
1238
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
1239
|
+
var FooterLogo = (0, import_react27.forwardRef)(
|
|
1225
1240
|
(_a, ref) => {
|
|
1226
1241
|
var _b = _a, { children, className, asChild } = _b, rest = __objRest(_b, ["children", "className", "asChild"]);
|
|
1227
|
-
const Component = asChild ?
|
|
1228
|
-
return /* @__PURE__ */ (0,
|
|
1242
|
+
const Component = asChild ? import_react_slot7.Slot : "div";
|
|
1243
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname24.clsx)(`hds-footer__logo`, className), ref }, rest), { children }));
|
|
1229
1244
|
}
|
|
1230
1245
|
);
|
|
1231
1246
|
FooterLogo.displayName = "Footer.Logo";
|
|
1232
|
-
var FooterButtonLink = (0,
|
|
1247
|
+
var FooterButtonLink = (0, import_react27.forwardRef)(
|
|
1233
1248
|
(_a, ref) => {
|
|
1234
1249
|
var _b = _a, { children, className, asChild } = _b, rest = __objRest(_b, ["children", "className", "asChild"]);
|
|
1235
|
-
const Component = asChild ?
|
|
1236
|
-
return /* @__PURE__ */ (0,
|
|
1250
|
+
const Component = asChild ? import_react_slot7.Slot : "a";
|
|
1251
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Button, { asChild: true, variant: "primary-outline", className: (0, import_typed_classname24.clsx)(className), children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Component, __spreadProps(__spreadValues({ ref }, rest), { children })) });
|
|
1237
1252
|
}
|
|
1238
1253
|
);
|
|
1239
1254
|
FooterButtonLink.displayName = "FooterButton";
|
|
1240
|
-
var FooterLinkSections = (0,
|
|
1255
|
+
var FooterLinkSections = (0, import_react27.forwardRef)(
|
|
1241
1256
|
(_a, ref) => {
|
|
1242
1257
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
1243
|
-
return /* @__PURE__ */ (0,
|
|
1258
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
1244
1259
|
Accordion,
|
|
1245
1260
|
__spreadProps(__spreadValues({
|
|
1246
|
-
className: (0,
|
|
1261
|
+
className: (0, import_typed_classname24.clsx)("hds-footer__link-sections", className),
|
|
1247
1262
|
ref
|
|
1248
1263
|
}, rest), {
|
|
1249
1264
|
children
|
|
@@ -1252,39 +1267,39 @@ var FooterLinkSections = (0, import_react26.forwardRef)(
|
|
|
1252
1267
|
}
|
|
1253
1268
|
);
|
|
1254
1269
|
FooterLinkSections.displayName = "Footer.LinkSections";
|
|
1255
|
-
var FooterLinkSection = (0,
|
|
1270
|
+
var FooterLinkSection = (0, import_react27.forwardRef)(
|
|
1256
1271
|
(_a, ref) => {
|
|
1257
1272
|
var _b = _a, { heading, children, className } = _b, rest = __objRest(_b, ["heading", "children", "className"]);
|
|
1258
|
-
const linkListChildren = /* @__PURE__ */ (0,
|
|
1259
|
-
return /* @__PURE__ */ (0,
|
|
1260
|
-
/* @__PURE__ */ (0,
|
|
1273
|
+
const linkListChildren = /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(LinkList, { children });
|
|
1274
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
|
|
1275
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
1261
1276
|
Accordion.Item,
|
|
1262
1277
|
__spreadProps(__spreadValues({
|
|
1263
|
-
className: (0,
|
|
1278
|
+
className: (0, import_typed_classname24.clsx)(`hds-footer__link-section`, className),
|
|
1264
1279
|
ref
|
|
1265
1280
|
}, rest), {
|
|
1266
1281
|
children: [
|
|
1267
|
-
/* @__PURE__ */ (0,
|
|
1268
|
-
/* @__PURE__ */ (0,
|
|
1282
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Accordion.Header, { children: heading }),
|
|
1283
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Accordion.Content, { children: linkListChildren })
|
|
1269
1284
|
]
|
|
1270
1285
|
})
|
|
1271
1286
|
),
|
|
1272
|
-
/* @__PURE__ */ (0,
|
|
1273
|
-
/* @__PURE__ */ (0,
|
|
1287
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: (0, import_typed_classname24.clsx)(`hds-footer__link-section`, className), children: [
|
|
1288
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("h2", { children: heading }),
|
|
1274
1289
|
linkListChildren
|
|
1275
1290
|
] })
|
|
1276
1291
|
] });
|
|
1277
1292
|
}
|
|
1278
1293
|
);
|
|
1279
1294
|
FooterLinkSection.displayName = "Footer.LinkSection";
|
|
1280
|
-
var Footer = (0,
|
|
1295
|
+
var Footer = (0, import_react27.forwardRef)(
|
|
1281
1296
|
(_a, ref) => {
|
|
1282
1297
|
var _b = _a, { children, className, variant, asChild } = _b, rest = __objRest(_b, ["children", "className", "variant", "asChild"]);
|
|
1283
|
-
const Component = asChild ?
|
|
1284
|
-
return /* @__PURE__ */ (0,
|
|
1298
|
+
const Component = asChild ? import_react_slot7.Slot : "footer";
|
|
1299
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
1285
1300
|
Component,
|
|
1286
1301
|
__spreadProps(__spreadValues({
|
|
1287
|
-
className: (0,
|
|
1302
|
+
className: (0, import_typed_classname24.clsx)(
|
|
1288
1303
|
`hds-footer`,
|
|
1289
1304
|
variant === "slim" && "hds-footer--slim",
|
|
1290
1305
|
className
|
|
@@ -1304,10 +1319,10 @@ Footer.LinkSection = FooterLinkSection;
|
|
|
1304
1319
|
|
|
1305
1320
|
// src/help-text/help-text.tsx
|
|
1306
1321
|
var Popover = __toESM(require("@radix-ui/react-popover"));
|
|
1307
|
-
var
|
|
1308
|
-
var
|
|
1309
|
-
var
|
|
1310
|
-
var HelpText = (0,
|
|
1322
|
+
var import_typed_classname25 = require("@postenbring/hedwig-css/typed-classname");
|
|
1323
|
+
var import_react28 = require("react");
|
|
1324
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
1325
|
+
var HelpText = (0, import_react28.forwardRef)(
|
|
1311
1326
|
(_a, ref) => {
|
|
1312
1327
|
var _b = _a, { children, className, helpText, title, side = "top", align = "start", boxProps } = _b, rest = __objRest(_b, ["children", "className", "helpText", "title", "side", "align", "boxProps"]);
|
|
1313
1328
|
return (
|
|
@@ -1315,24 +1330,24 @@ var HelpText = (0, import_react27.forwardRef)(
|
|
|
1315
1330
|
// In the future we can use the native popover api, but as of writing, though all browsers support it
|
|
1316
1331
|
// it's not far enough back to be used in production
|
|
1317
1332
|
// https://caniuse.com/mdn-html_elements_input_popovertarget
|
|
1318
|
-
/* @__PURE__ */ (0,
|
|
1319
|
-
/* @__PURE__ */ (0,
|
|
1333
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(Popover.Root, { children: [
|
|
1334
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Popover.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
1320
1335
|
"button",
|
|
1321
1336
|
__spreadProps(__spreadValues({
|
|
1322
1337
|
ref,
|
|
1323
|
-
className: (0,
|
|
1338
|
+
className: (0, import_typed_classname25.clsx)("hds-help-text-button", className),
|
|
1324
1339
|
title,
|
|
1325
1340
|
type: "button"
|
|
1326
1341
|
}, rest), {
|
|
1327
1342
|
children
|
|
1328
1343
|
})
|
|
1329
1344
|
) }),
|
|
1330
|
-
/* @__PURE__ */ (0,
|
|
1345
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Popover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Popover.Content, { asChild: true, side, align, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
1331
1346
|
Box,
|
|
1332
1347
|
__spreadProps(__spreadValues({}, boxProps), {
|
|
1333
|
-
className: (0,
|
|
1348
|
+
className: (0, import_typed_classname25.clsx)("hds-help-text-box", boxProps == null ? void 0 : boxProps.className),
|
|
1334
1349
|
children: [
|
|
1335
|
-
/* @__PURE__ */ (0,
|
|
1350
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Popover.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Box.CloseButton, {}) }),
|
|
1336
1351
|
helpText
|
|
1337
1352
|
]
|
|
1338
1353
|
})
|
|
@@ -1344,18 +1359,18 @@ var HelpText = (0, import_react27.forwardRef)(
|
|
|
1344
1359
|
HelpText.displayName = "HelpText";
|
|
1345
1360
|
|
|
1346
1361
|
// src/layout/container/container.tsx
|
|
1347
|
-
var
|
|
1348
|
-
var
|
|
1349
|
-
var
|
|
1350
|
-
var
|
|
1351
|
-
var Container = (0,
|
|
1362
|
+
var import_typed_classname26 = require("@postenbring/hedwig-css/typed-classname");
|
|
1363
|
+
var import_react_slot8 = require("@radix-ui/react-slot");
|
|
1364
|
+
var import_react29 = require("react");
|
|
1365
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
1366
|
+
var Container = (0, import_react29.forwardRef)(
|
|
1352
1367
|
(_a, ref) => {
|
|
1353
1368
|
var _b = _a, { as: Tag = "div", asChild, className, children, variant } = _b, rest = __objRest(_b, ["as", "asChild", "className", "children", "variant"]);
|
|
1354
|
-
const Component = asChild ?
|
|
1355
|
-
return /* @__PURE__ */ (0,
|
|
1369
|
+
const Component = asChild ? import_react_slot8.Slot : Tag;
|
|
1370
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
1356
1371
|
Component,
|
|
1357
1372
|
__spreadProps(__spreadValues({}, rest), {
|
|
1358
|
-
className: (0,
|
|
1373
|
+
className: (0, import_typed_classname26.clsx)(
|
|
1359
1374
|
"hds-container",
|
|
1360
1375
|
{ "hds-container--slim": variant === "slim" },
|
|
1361
1376
|
className
|
|
@@ -1369,9 +1384,9 @@ var Container = (0, import_react28.forwardRef)(
|
|
|
1369
1384
|
Container.displayName = "Container";
|
|
1370
1385
|
|
|
1371
1386
|
// src/layout/grid/grid.tsx
|
|
1372
|
-
var
|
|
1373
|
-
var
|
|
1374
|
-
var
|
|
1387
|
+
var import_typed_classname27 = require("@postenbring/hedwig-css/typed-classname");
|
|
1388
|
+
var import_react_slot9 = require("@radix-ui/react-slot");
|
|
1389
|
+
var import_react30 = require("react");
|
|
1375
1390
|
|
|
1376
1391
|
// src/layout/responsive.ts
|
|
1377
1392
|
function getResponsiveProps(variable, inputValues, valueTransformer = (value) => String(value)) {
|
|
@@ -1392,17 +1407,17 @@ function getSpacingVariable(size) {
|
|
|
1392
1407
|
}
|
|
1393
1408
|
|
|
1394
1409
|
// src/layout/grid/grid.tsx
|
|
1395
|
-
var
|
|
1396
|
-
var GridItem = (0,
|
|
1410
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
1411
|
+
var GridItem = (0, import_react30.forwardRef)(
|
|
1397
1412
|
(_a, ref) => {
|
|
1398
1413
|
var _b = _a, { children, asChild, className, span, center, style: _style } = _b, rest = __objRest(_b, ["children", "asChild", "className", "span", "center", "style"]);
|
|
1399
|
-
const Component = asChild ?
|
|
1414
|
+
const Component = asChild ? import_react_slot9.Slot : "div";
|
|
1400
1415
|
const style = __spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-grid-item-span", span)), getResponsiveProps("--hds-grid-item-center", center, (value) => value ? "1" : "0"));
|
|
1401
|
-
return /* @__PURE__ */ (0,
|
|
1416
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
1402
1417
|
Component,
|
|
1403
1418
|
__spreadProps(__spreadValues({
|
|
1404
1419
|
style,
|
|
1405
|
-
className: (0,
|
|
1420
|
+
className: (0, import_typed_classname27.clsx)("hds-grid__item", className),
|
|
1406
1421
|
ref
|
|
1407
1422
|
}, rest), {
|
|
1408
1423
|
children
|
|
@@ -1411,16 +1426,16 @@ var GridItem = (0, import_react29.forwardRef)(
|
|
|
1411
1426
|
}
|
|
1412
1427
|
);
|
|
1413
1428
|
GridItem.displayName = "Grid.Item";
|
|
1414
|
-
var Grid = (0,
|
|
1429
|
+
var Grid = (0, import_react30.forwardRef)(
|
|
1415
1430
|
(_a, ref) => {
|
|
1416
1431
|
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"]);
|
|
1417
|
-
const Component = asChild ?
|
|
1432
|
+
const Component = asChild ? import_react_slot9.Slot : "div";
|
|
1418
1433
|
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"));
|
|
1419
|
-
return /* @__PURE__ */ (0,
|
|
1434
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
1420
1435
|
Component,
|
|
1421
1436
|
__spreadProps(__spreadValues({
|
|
1422
1437
|
style,
|
|
1423
|
-
className: (0,
|
|
1438
|
+
className: (0, import_typed_classname27.clsx)("hds-grid", className),
|
|
1424
1439
|
ref
|
|
1425
1440
|
}, rest), {
|
|
1426
1441
|
children
|
|
@@ -1433,11 +1448,11 @@ Grid.Item = GridItem;
|
|
|
1433
1448
|
|
|
1434
1449
|
// src/layout/stack/stack.tsx
|
|
1435
1450
|
var React2 = require("react");
|
|
1436
|
-
var
|
|
1437
|
-
var
|
|
1438
|
-
var
|
|
1439
|
-
var
|
|
1440
|
-
var Stack = (0,
|
|
1451
|
+
var import_typed_classname28 = require("@postenbring/hedwig-css/typed-classname");
|
|
1452
|
+
var import_react31 = require("react");
|
|
1453
|
+
var import_react_slot10 = require("@radix-ui/react-slot");
|
|
1454
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
1455
|
+
var Stack = (0, import_react31.forwardRef)(
|
|
1441
1456
|
(_a, ref) => {
|
|
1442
1457
|
var _b = _a, {
|
|
1443
1458
|
children,
|
|
@@ -1464,13 +1479,13 @@ var Stack = (0, import_react30.forwardRef)(
|
|
|
1464
1479
|
"align",
|
|
1465
1480
|
"justify"
|
|
1466
1481
|
]);
|
|
1467
|
-
const Component = asChild ?
|
|
1482
|
+
const Component = asChild ? import_react_slot10.Slot : "div";
|
|
1468
1483
|
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));
|
|
1469
|
-
return /* @__PURE__ */ (0,
|
|
1484
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
1470
1485
|
Component,
|
|
1471
1486
|
__spreadProps(__spreadValues({
|
|
1472
1487
|
style,
|
|
1473
|
-
className: (0,
|
|
1488
|
+
className: (0, import_typed_classname28.clsx)("hds-stack", className),
|
|
1474
1489
|
ref
|
|
1475
1490
|
}, rest), {
|
|
1476
1491
|
children
|
|
@@ -1479,29 +1494,29 @@ var Stack = (0, import_react30.forwardRef)(
|
|
|
1479
1494
|
}
|
|
1480
1495
|
);
|
|
1481
1496
|
Stack.displayName = "Stack";
|
|
1482
|
-
var HStack = (0,
|
|
1483
|
-
return /* @__PURE__ */ (0,
|
|
1497
|
+
var HStack = (0, import_react31.forwardRef)((props, ref) => {
|
|
1498
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Stack, __spreadProps(__spreadValues({ ref }, props), { direction: "row" }));
|
|
1484
1499
|
});
|
|
1485
1500
|
HStack.displayName = "HStack";
|
|
1486
|
-
var VStack = (0,
|
|
1487
|
-
return /* @__PURE__ */ (0,
|
|
1501
|
+
var VStack = (0, import_react31.forwardRef)((props, ref) => {
|
|
1502
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Stack, __spreadProps(__spreadValues({ ref }, props), { direction: "column" }));
|
|
1488
1503
|
});
|
|
1489
1504
|
VStack.displayName = "VStack";
|
|
1490
1505
|
|
|
1491
1506
|
// src/link/link.tsx
|
|
1492
1507
|
var React3 = require("react");
|
|
1493
|
-
var
|
|
1494
|
-
var
|
|
1495
|
-
var
|
|
1496
|
-
var
|
|
1497
|
-
var Link = (0,
|
|
1508
|
+
var import_typed_classname29 = require("@postenbring/hedwig-css/typed-classname");
|
|
1509
|
+
var import_react32 = require("react");
|
|
1510
|
+
var import_react_slot11 = require("@radix-ui/react-slot");
|
|
1511
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
1512
|
+
var Link = (0, import_react32.forwardRef)(
|
|
1498
1513
|
(_a, ref) => {
|
|
1499
1514
|
var _b = _a, { asChild, children, variant = "underline", size = "medium", className } = _b, rest = __objRest(_b, ["asChild", "children", "variant", "size", "className"]);
|
|
1500
|
-
const Component = asChild ?
|
|
1501
|
-
return /* @__PURE__ */ (0,
|
|
1515
|
+
const Component = asChild ? import_react_slot11.Slot : "a";
|
|
1516
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
1502
1517
|
Component,
|
|
1503
1518
|
__spreadProps(__spreadValues({
|
|
1504
|
-
className: (0,
|
|
1519
|
+
className: (0, import_typed_classname29.clsx)(
|
|
1505
1520
|
"hds-link",
|
|
1506
1521
|
variant !== "underline" && `hds-link--${variant}`,
|
|
1507
1522
|
size !== "medium" && `hds-link--${size}`,
|
|
@@ -1517,49 +1532,49 @@ var Link = (0, import_react31.forwardRef)(
|
|
|
1517
1532
|
Link.displayName = "Link";
|
|
1518
1533
|
|
|
1519
1534
|
// src/message/message.tsx
|
|
1520
|
-
var
|
|
1521
|
-
var
|
|
1522
|
-
var
|
|
1523
|
-
var
|
|
1524
|
-
var MessageTitle = (0,
|
|
1535
|
+
var import_react33 = require("react");
|
|
1536
|
+
var import_typed_classname30 = require("@postenbring/hedwig-css/typed-classname");
|
|
1537
|
+
var import_react_slot12 = require("@radix-ui/react-slot");
|
|
1538
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
1539
|
+
var MessageTitle = (0, import_react33.forwardRef)(
|
|
1525
1540
|
(_a, ref) => {
|
|
1526
1541
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1527
|
-
const Component = asChild ?
|
|
1528
|
-
return /* @__PURE__ */ (0,
|
|
1542
|
+
const Component = asChild ? import_react_slot12.Slot : "div";
|
|
1543
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1529
1544
|
Component,
|
|
1530
1545
|
__spreadValues({
|
|
1531
|
-
className: (0,
|
|
1546
|
+
className: (0, import_typed_classname30.clsx)("hds-message__title", className),
|
|
1532
1547
|
ref
|
|
1533
1548
|
}, rest)
|
|
1534
1549
|
);
|
|
1535
1550
|
}
|
|
1536
1551
|
);
|
|
1537
1552
|
MessageTitle.displayName = "Message.Title";
|
|
1538
|
-
var MessageDescription = (0,
|
|
1553
|
+
var MessageDescription = (0, import_react33.forwardRef)(
|
|
1539
1554
|
(_a, ref) => {
|
|
1540
1555
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1541
|
-
const Component = asChild ?
|
|
1542
|
-
return /* @__PURE__ */ (0,
|
|
1556
|
+
const Component = asChild ? import_react_slot12.Slot : "div";
|
|
1557
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
1543
1558
|
Component,
|
|
1544
1559
|
__spreadValues({
|
|
1545
|
-
className: (0,
|
|
1560
|
+
className: (0, import_typed_classname30.clsx)("hds-message__description", className),
|
|
1546
1561
|
ref
|
|
1547
1562
|
}, rest)
|
|
1548
1563
|
);
|
|
1549
1564
|
}
|
|
1550
1565
|
);
|
|
1551
1566
|
MessageDescription.displayName = "Message.Description";
|
|
1552
|
-
var Message = (0,
|
|
1567
|
+
var Message = (0, import_react33.forwardRef)(
|
|
1553
1568
|
(_a, ref) => {
|
|
1554
1569
|
var _b = _a, { children, className, variant = "success", icon, iconClassName } = _b, rest = __objRest(_b, ["children", "className", "variant", "icon", "iconClassName"]);
|
|
1555
|
-
return /* @__PURE__ */ (0,
|
|
1570
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
1556
1571
|
Box,
|
|
1557
1572
|
__spreadProps(__spreadValues({
|
|
1558
|
-
className: (0,
|
|
1573
|
+
className: (0, import_typed_classname30.clsx)(`hds-message`, `hds-message--${variant}`, className),
|
|
1559
1574
|
ref
|
|
1560
1575
|
}, rest), {
|
|
1561
1576
|
children: [
|
|
1562
|
-
variant === "neutral" && /* @__PURE__ */ (0,
|
|
1577
|
+
variant === "neutral" && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: (0, import_typed_classname30.clsx)("hds-message--neutral__icon", iconClassName), children: icon }),
|
|
1563
1578
|
children
|
|
1564
1579
|
]
|
|
1565
1580
|
})
|
|
@@ -1571,56 +1586,56 @@ Message.Title = MessageTitle;
|
|
|
1571
1586
|
Message.Description = MessageDescription;
|
|
1572
1587
|
|
|
1573
1588
|
// src/modal/modal.tsx
|
|
1574
|
-
var
|
|
1575
|
-
var
|
|
1576
|
-
var
|
|
1577
|
-
var
|
|
1578
|
-
var ModalHeader = (0,
|
|
1589
|
+
var import_react34 = require("react");
|
|
1590
|
+
var import_typed_classname31 = require("@postenbring/hedwig-css/typed-classname");
|
|
1591
|
+
var import_react_slot13 = require("@radix-ui/react-slot");
|
|
1592
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
1593
|
+
var ModalHeader = (0, import_react34.forwardRef)(
|
|
1579
1594
|
(_a, ref) => {
|
|
1580
1595
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1581
|
-
const Component = asChild ?
|
|
1582
|
-
return /* @__PURE__ */ (0,
|
|
1596
|
+
const Component = asChild ? import_react_slot13.Slot : "h1";
|
|
1597
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1583
1598
|
Component,
|
|
1584
1599
|
__spreadValues({
|
|
1585
|
-
className: (0,
|
|
1600
|
+
className: (0, import_typed_classname31.clsx)("hds-modal__header", className),
|
|
1586
1601
|
ref
|
|
1587
1602
|
}, rest)
|
|
1588
1603
|
);
|
|
1589
1604
|
}
|
|
1590
1605
|
);
|
|
1591
1606
|
ModalHeader.displayName = "Modal.Header";
|
|
1592
|
-
var ModalContent = (0,
|
|
1607
|
+
var ModalContent = (0, import_react34.forwardRef)(
|
|
1593
1608
|
(_a, ref) => {
|
|
1594
1609
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1595
|
-
const Component = asChild ?
|
|
1596
|
-
return /* @__PURE__ */ (0,
|
|
1610
|
+
const Component = asChild ? import_react_slot13.Slot : "div";
|
|
1611
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1597
1612
|
Component,
|
|
1598
1613
|
__spreadValues({
|
|
1599
|
-
className: (0,
|
|
1614
|
+
className: (0, import_typed_classname31.clsx)("hds-modal__content", className),
|
|
1600
1615
|
ref
|
|
1601
1616
|
}, rest)
|
|
1602
1617
|
);
|
|
1603
1618
|
}
|
|
1604
1619
|
);
|
|
1605
1620
|
ModalContent.displayName = "Modal.Content";
|
|
1606
|
-
var ModalFooter = (0,
|
|
1621
|
+
var ModalFooter = (0, import_react34.forwardRef)(
|
|
1607
1622
|
(_a, ref) => {
|
|
1608
1623
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1609
|
-
const Component = asChild ?
|
|
1610
|
-
return /* @__PURE__ */ (0,
|
|
1624
|
+
const Component = asChild ? import_react_slot13.Slot : "footer";
|
|
1625
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1611
1626
|
Component,
|
|
1612
1627
|
__spreadValues({
|
|
1613
|
-
className: (0,
|
|
1628
|
+
className: (0, import_typed_classname31.clsx)("hds-modal__footer", className),
|
|
1614
1629
|
ref
|
|
1615
1630
|
}, rest)
|
|
1616
1631
|
);
|
|
1617
1632
|
}
|
|
1618
1633
|
);
|
|
1619
1634
|
ModalFooter.displayName = "Modal.Footer";
|
|
1620
|
-
var Modal = (0,
|
|
1635
|
+
var Modal = (0, import_react34.forwardRef)(
|
|
1621
1636
|
(_a, ref) => {
|
|
1622
1637
|
var _b = _a, { children, className, open, closeOnBackdropClick, onClick } = _b, rest = __objRest(_b, ["children", "className", "open", "closeOnBackdropClick", "onClick"]);
|
|
1623
|
-
const modalRef = (0,
|
|
1638
|
+
const modalRef = (0, import_react34.useRef)(null);
|
|
1624
1639
|
const mergedRef = useMergeRefs([modalRef, ref]);
|
|
1625
1640
|
function onCloseButtonClick() {
|
|
1626
1641
|
var _a2;
|
|
@@ -1628,7 +1643,7 @@ var Modal = (0, import_react33.forwardRef)(
|
|
|
1628
1643
|
return false;
|
|
1629
1644
|
}
|
|
1630
1645
|
useScrollLock(modalRef, "hds-modal-scroll-lock");
|
|
1631
|
-
(0,
|
|
1646
|
+
(0, import_react34.useEffect)(() => {
|
|
1632
1647
|
if (modalRef.current && open !== void 0) {
|
|
1633
1648
|
if (open && !modalRef.current.open) {
|
|
1634
1649
|
modalRef.current.showModal();
|
|
@@ -1643,16 +1658,16 @@ var Modal = (0, import_react33.forwardRef)(
|
|
|
1643
1658
|
}
|
|
1644
1659
|
onClick == null ? void 0 : onClick(e);
|
|
1645
1660
|
}
|
|
1646
|
-
return /* @__PURE__ */ (0,
|
|
1661
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
1647
1662
|
Box,
|
|
1648
1663
|
{
|
|
1649
1664
|
asChild: true,
|
|
1650
|
-
className: (0,
|
|
1665
|
+
className: (0, import_typed_classname31.clsx)("hds-modal", className),
|
|
1651
1666
|
closeable: true,
|
|
1652
1667
|
onClick: onDialogClick,
|
|
1653
1668
|
onClose: onCloseButtonClick,
|
|
1654
1669
|
variant: "white",
|
|
1655
|
-
children: /* @__PURE__ */ (0,
|
|
1670
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("dialog", __spreadProps(__spreadValues({ ref: mergedRef }, rest), { children }))
|
|
1656
1671
|
}
|
|
1657
1672
|
);
|
|
1658
1673
|
}
|
|
@@ -1662,7 +1677,7 @@ Modal.Header = ModalHeader;
|
|
|
1662
1677
|
Modal.Content = ModalContent;
|
|
1663
1678
|
Modal.Footer = ModalFooter;
|
|
1664
1679
|
function useScrollLock(modalRef, bodyClass) {
|
|
1665
|
-
(0,
|
|
1680
|
+
(0, import_react34.useEffect)(() => {
|
|
1666
1681
|
if (!modalRef.current) return;
|
|
1667
1682
|
if (modalRef.current.open) document.body.classList.add(bodyClass);
|
|
1668
1683
|
const observer = new MutationObserver(() => {
|
|
@@ -1682,18 +1697,18 @@ function useScrollLock(modalRef, bodyClass) {
|
|
|
1682
1697
|
}
|
|
1683
1698
|
|
|
1684
1699
|
// src/navbar/navbar.tsx
|
|
1685
|
-
var
|
|
1686
|
-
var
|
|
1687
|
-
var
|
|
1700
|
+
var import_react36 = require("react");
|
|
1701
|
+
var import_typed_classname33 = require("@postenbring/hedwig-css/typed-classname");
|
|
1702
|
+
var import_react_slot14 = require("@radix-ui/react-slot");
|
|
1688
1703
|
|
|
1689
1704
|
// src/navbar/navbar-expandable-menu.tsx
|
|
1690
|
-
var
|
|
1691
|
-
var
|
|
1705
|
+
var import_react35 = require("react");
|
|
1706
|
+
var import_typed_classname32 = require("@postenbring/hedwig-css/typed-classname");
|
|
1692
1707
|
|
|
1693
1708
|
// src/navbar/icons.tsx
|
|
1694
|
-
var
|
|
1709
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
1695
1710
|
function CloseIcon() {
|
|
1696
|
-
return /* @__PURE__ */ (0,
|
|
1711
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1697
1712
|
"svg",
|
|
1698
1713
|
{
|
|
1699
1714
|
"aria-hidden": true,
|
|
@@ -1702,7 +1717,7 @@ function CloseIcon() {
|
|
|
1702
1717
|
height: 32,
|
|
1703
1718
|
viewBox: "0 0 32 32",
|
|
1704
1719
|
fill: "none",
|
|
1705
|
-
children: /* @__PURE__ */ (0,
|
|
1720
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1706
1721
|
"path",
|
|
1707
1722
|
{
|
|
1708
1723
|
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",
|
|
@@ -1713,7 +1728,7 @@ function CloseIcon() {
|
|
|
1713
1728
|
);
|
|
1714
1729
|
}
|
|
1715
1730
|
function MenuIcon() {
|
|
1716
|
-
return /* @__PURE__ */ (0,
|
|
1731
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("svg", { "aria-hidden": true, xmlns: "http://www.w3.org/2000/svg", width: 32, height: 32, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
1717
1732
|
"path",
|
|
1718
1733
|
{
|
|
1719
1734
|
fill: "currentColor",
|
|
@@ -1723,35 +1738,35 @@ function MenuIcon() {
|
|
|
1723
1738
|
}
|
|
1724
1739
|
|
|
1725
1740
|
// src/navbar/navbar-expandable-menu.tsx
|
|
1726
|
-
var
|
|
1727
|
-
var ExpandableMenuContext = (0,
|
|
1741
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
1742
|
+
var ExpandableMenuContext = (0, import_react35.createContext)(null);
|
|
1728
1743
|
var useNavbarExpendableMenuContext = () => {
|
|
1729
|
-
const value = (0,
|
|
1744
|
+
const value = (0, import_react35.useContext)(ExpandableMenuContext);
|
|
1730
1745
|
if (value === null) {
|
|
1731
1746
|
throw new Error("useNavbarExpendableMenuContext must be used within a Navbar.ExpandableMenu");
|
|
1732
1747
|
}
|
|
1733
1748
|
return value;
|
|
1734
1749
|
};
|
|
1735
1750
|
function NavbarExpandableMenu({ children }) {
|
|
1736
|
-
const contentId = (0,
|
|
1737
|
-
const [open, setOpen] = (0,
|
|
1738
|
-
(0,
|
|
1751
|
+
const contentId = (0, import_react35.useId)();
|
|
1752
|
+
const [open, setOpen] = (0, import_react35.useState)(false);
|
|
1753
|
+
(0, import_react35.useEffect)(() => {
|
|
1739
1754
|
if (open) {
|
|
1740
1755
|
window.scrollTo(0, 0);
|
|
1741
|
-
document.body.classList.add((0,
|
|
1756
|
+
document.body.classList.add((0, import_typed_classname32.clsx)("hds-navbar-scroll-lock"));
|
|
1742
1757
|
const releaseFocusTrap2 = focusTrap(
|
|
1743
|
-
document.getElementsByClassName((0,
|
|
1758
|
+
document.getElementsByClassName((0, import_typed_classname32.clsx)("hds-navbar"))[0]
|
|
1744
1759
|
);
|
|
1745
1760
|
return () => {
|
|
1746
|
-
document.body.classList.remove((0,
|
|
1761
|
+
document.body.classList.remove((0, import_typed_classname32.clsx)("hds-navbar-scroll-lock"));
|
|
1747
1762
|
releaseFocusTrap2();
|
|
1748
1763
|
};
|
|
1749
1764
|
}
|
|
1750
1765
|
}, [open]);
|
|
1751
|
-
return /* @__PURE__ */ (0,
|
|
1766
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ExpandableMenuContext.Provider, { value: { contentId, open, setOpen }, children });
|
|
1752
1767
|
}
|
|
1753
1768
|
NavbarExpandableMenu.displayName = "NavbarExpandableMenu";
|
|
1754
|
-
var NavbarExpandableMenuTrigger = (0,
|
|
1769
|
+
var NavbarExpandableMenuTrigger = (0, import_react35.forwardRef)(
|
|
1755
1770
|
(_a, ref) => {
|
|
1756
1771
|
var _b = _a, {
|
|
1757
1772
|
whenClosedText,
|
|
@@ -1769,9 +1784,9 @@ var NavbarExpandableMenuTrigger = (0, import_react34.forwardRef)(
|
|
|
1769
1784
|
"className"
|
|
1770
1785
|
]);
|
|
1771
1786
|
const { contentId, open, setOpen } = useNavbarExpendableMenuContext();
|
|
1772
|
-
const [textWidth, setTextWidth] = (0,
|
|
1773
|
-
const measurementId = (0,
|
|
1774
|
-
(0,
|
|
1787
|
+
const [textWidth, setTextWidth] = (0, import_react35.useState)(void 0);
|
|
1788
|
+
const measurementId = (0, import_react35.useId)();
|
|
1789
|
+
(0, import_react35.useEffect)(() => {
|
|
1775
1790
|
var _a2, _b2, _c, _d;
|
|
1776
1791
|
const widthWhenOpen = (_b2 = (_a2 = document.getElementById(`${measurementId}-when-open`)) == null ? void 0 : _a2.getBoundingClientRect().width) != null ? _b2 : 0;
|
|
1777
1792
|
const widthWhenClosed = (_d = (_c = document.getElementById(`${measurementId}-when-closed`)) == null ? void 0 : _c.getBoundingClientRect().width) != null ? _d : 0;
|
|
@@ -1779,16 +1794,16 @@ var NavbarExpandableMenuTrigger = (0, import_react34.forwardRef)(
|
|
|
1779
1794
|
}, [measurementId]);
|
|
1780
1795
|
const text = open ? whenOpenText : whenClosedText;
|
|
1781
1796
|
const title = open ? whenOpenHelperTitle : whenClosedHelperTitle;
|
|
1782
|
-
const icon = open ? /* @__PURE__ */ (0,
|
|
1797
|
+
const icon = open ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(CloseIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(MenuIcon, {});
|
|
1783
1798
|
function toggleOpen() {
|
|
1784
1799
|
setOpen(!open);
|
|
1785
1800
|
}
|
|
1786
|
-
return /* @__PURE__ */ (0,
|
|
1801
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
1787
1802
|
"button",
|
|
1788
1803
|
__spreadProps(__spreadValues({
|
|
1789
1804
|
"aria-expanded": open,
|
|
1790
1805
|
"aria-controls": contentId,
|
|
1791
|
-
className: (0,
|
|
1806
|
+
className: (0, import_typed_classname32.clsx)("hds-navbar__item", className),
|
|
1792
1807
|
onClick: toggleOpen,
|
|
1793
1808
|
ref,
|
|
1794
1809
|
title,
|
|
@@ -1796,7 +1811,7 @@ var NavbarExpandableMenuTrigger = (0, import_react34.forwardRef)(
|
|
|
1796
1811
|
style: __spreadValues({ position: "relative" }, style)
|
|
1797
1812
|
}, rest), {
|
|
1798
1813
|
children: [
|
|
1799
|
-
/* @__PURE__ */ (0,
|
|
1814
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
1800
1815
|
"span",
|
|
1801
1816
|
{
|
|
1802
1817
|
id: `${measurementId}-when-closed`,
|
|
@@ -1810,7 +1825,7 @@ var NavbarExpandableMenuTrigger = (0, import_react34.forwardRef)(
|
|
|
1810
1825
|
children: whenOpenText
|
|
1811
1826
|
}
|
|
1812
1827
|
),
|
|
1813
|
-
/* @__PURE__ */ (0,
|
|
1828
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
1814
1829
|
"span",
|
|
1815
1830
|
{
|
|
1816
1831
|
id: `${measurementId}-when-open`,
|
|
@@ -1824,57 +1839,57 @@ var NavbarExpandableMenuTrigger = (0, import_react34.forwardRef)(
|
|
|
1824
1839
|
children: whenClosedText
|
|
1825
1840
|
}
|
|
1826
1841
|
),
|
|
1827
|
-
/* @__PURE__ */ (0,
|
|
1842
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
1828
1843
|
"span",
|
|
1829
1844
|
{
|
|
1830
1845
|
style: { width: textWidth, whiteSpace: "nowrap" },
|
|
1831
|
-
className: (0,
|
|
1846
|
+
className: (0, import_typed_classname32.clsx)("hds-navbar__item-responsive-text"),
|
|
1832
1847
|
children: text
|
|
1833
1848
|
}
|
|
1834
1849
|
),
|
|
1835
|
-
/* @__PURE__ */ (0,
|
|
1850
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { style: { width: 32, height: 32 }, children: icon })
|
|
1836
1851
|
]
|
|
1837
1852
|
})
|
|
1838
1853
|
);
|
|
1839
1854
|
}
|
|
1840
1855
|
);
|
|
1841
1856
|
NavbarExpandableMenuTrigger.displayName = "Navbar.ExpandableMenuTrigger";
|
|
1842
|
-
var NavbarExpandableMenuContent = (0,
|
|
1857
|
+
var NavbarExpandableMenuContent = (0, import_react35.forwardRef)((_a, ref) => {
|
|
1843
1858
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
1844
1859
|
const { contentId, open } = useNavbarExpendableMenuContext();
|
|
1845
|
-
return /* @__PURE__ */ (0,
|
|
1860
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
1846
1861
|
"section",
|
|
1847
1862
|
__spreadProps(__spreadValues(__spreadProps(__spreadValues({}, rest), {
|
|
1848
1863
|
id: contentId,
|
|
1849
|
-
className: (0,
|
|
1864
|
+
className: (0, import_typed_classname32.clsx)("hds-navbar__expandable-menu-content", className),
|
|
1850
1865
|
"data-state": open ? "open" : "closed"
|
|
1851
1866
|
}), { inert: open ? void 0 : "true" }), {
|
|
1852
1867
|
ref,
|
|
1853
|
-
children: /* @__PURE__ */ (0,
|
|
1868
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: (0, import_typed_classname32.clsx)("hds-navbar__expandable-menu-content-inner"), children })
|
|
1854
1869
|
})
|
|
1855
1870
|
);
|
|
1856
1871
|
});
|
|
1857
1872
|
NavbarExpandableMenuContent.displayName = "Navbar.ExpandableMenuContent";
|
|
1858
1873
|
|
|
1859
1874
|
// src/navbar/navbar.tsx
|
|
1860
|
-
var
|
|
1861
|
-
var NavbarLogo = (0,
|
|
1875
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
1876
|
+
var NavbarLogo = (0, import_react36.forwardRef)(
|
|
1862
1877
|
(_a, ref) => {
|
|
1863
1878
|
var _b = _a, { children, className, asChild } = _b, rest = __objRest(_b, ["children", "className", "asChild"]);
|
|
1864
|
-
const Component = asChild ?
|
|
1865
|
-
return /* @__PURE__ */ (0,
|
|
1879
|
+
const Component = asChild ? import_react_slot14.Slot : "div";
|
|
1880
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname33.clsx)(`hds-navbar__logo`, className), ref }, rest), { children }));
|
|
1866
1881
|
}
|
|
1867
1882
|
);
|
|
1868
1883
|
NavbarLogo.displayName = "Navbar.Logo";
|
|
1869
|
-
var NavbarLogoAndServiceText = (0,
|
|
1884
|
+
var NavbarLogoAndServiceText = (0, import_react36.forwardRef)(
|
|
1870
1885
|
(_a, ref) => {
|
|
1871
1886
|
var _b = _a, { children, asChild, variant, className } = _b, rest = __objRest(_b, ["children", "asChild", "variant", "className"]);
|
|
1872
|
-
const Component = asChild ?
|
|
1873
|
-
return /* @__PURE__ */ (0,
|
|
1887
|
+
const Component = asChild ? import_react_slot14.Slot : "div";
|
|
1888
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
1874
1889
|
Component,
|
|
1875
1890
|
__spreadProps(__spreadValues({
|
|
1876
1891
|
ref,
|
|
1877
|
-
className: (0,
|
|
1892
|
+
className: (0, import_typed_classname33.clsx)(
|
|
1878
1893
|
"hds-navbar__logo-and-service-text",
|
|
1879
1894
|
`hds-navbar__logo-and-service-text--${variant}`,
|
|
1880
1895
|
className
|
|
@@ -1886,29 +1901,29 @@ var NavbarLogoAndServiceText = (0, import_react35.forwardRef)(
|
|
|
1886
1901
|
}
|
|
1887
1902
|
);
|
|
1888
1903
|
NavbarLogoAndServiceText.displayName = "Navbar.NavbarLogoAndText";
|
|
1889
|
-
var NavbarItemIcon = (0,
|
|
1904
|
+
var NavbarItemIcon = (0, import_react36.forwardRef)(
|
|
1890
1905
|
(_a, ref) => {
|
|
1891
1906
|
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
1892
|
-
return /* @__PURE__ */ (0,
|
|
1907
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react_slot14.Slot, __spreadProps(__spreadValues({ className: (0, import_typed_classname33.clsx)("hds-navbar__item-icon", className), ref }, rest), { children }));
|
|
1893
1908
|
}
|
|
1894
1909
|
);
|
|
1895
1910
|
NavbarItemIcon.displayName = "Navbar.ItemIcon";
|
|
1896
|
-
var NavbarItem = (0,
|
|
1911
|
+
var NavbarItem = (0, import_react36.forwardRef)(
|
|
1897
1912
|
(_a, ref) => {
|
|
1898
1913
|
var _b = _a, { asChild, children, className } = _b, rest = __objRest(_b, ["asChild", "children", "className"]);
|
|
1899
|
-
const Component = asChild ?
|
|
1900
|
-
return /* @__PURE__ */ (0,
|
|
1914
|
+
const Component = asChild ? import_react_slot14.Slot : "div";
|
|
1915
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname33.clsx)("hds-navbar__item", className), ref }, rest), { children }));
|
|
1901
1916
|
}
|
|
1902
1917
|
);
|
|
1903
1918
|
NavbarItem.displayName = "Navbar.Item";
|
|
1904
|
-
var NavbarButtonItem = (0,
|
|
1919
|
+
var NavbarButtonItem = (0, import_react36.forwardRef)(
|
|
1905
1920
|
(_a, ref) => {
|
|
1906
1921
|
var _b = _a, { asChild, children, className } = _b, rest = __objRest(_b, ["asChild", "children", "className"]);
|
|
1907
|
-
const Component = asChild ?
|
|
1908
|
-
return /* @__PURE__ */ (0,
|
|
1922
|
+
const Component = asChild ? import_react_slot14.Slot : "button";
|
|
1923
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
1909
1924
|
Component,
|
|
1910
1925
|
__spreadProps(__spreadValues({
|
|
1911
|
-
className: (0,
|
|
1926
|
+
className: (0, import_typed_classname33.clsx)("hds-navbar__item", className),
|
|
1912
1927
|
ref,
|
|
1913
1928
|
type: "button"
|
|
1914
1929
|
}, rest), {
|
|
@@ -1918,36 +1933,36 @@ var NavbarButtonItem = (0, import_react35.forwardRef)(
|
|
|
1918
1933
|
}
|
|
1919
1934
|
);
|
|
1920
1935
|
NavbarButtonItem.displayName = "Navbar.ButtonItem";
|
|
1921
|
-
var NavbarLinkItem = (0,
|
|
1936
|
+
var NavbarLinkItem = (0, import_react36.forwardRef)(
|
|
1922
1937
|
(_a, ref) => {
|
|
1923
1938
|
var _b = _a, { asChild, children, className } = _b, rest = __objRest(_b, ["asChild", "children", "className"]);
|
|
1924
|
-
const Component = asChild ?
|
|
1925
|
-
return /* @__PURE__ */ (0,
|
|
1939
|
+
const Component = asChild ? import_react_slot14.Slot : "a";
|
|
1940
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname33.clsx)("hds-navbar__item", className), ref }, rest), { children }));
|
|
1926
1941
|
}
|
|
1927
1942
|
);
|
|
1928
1943
|
NavbarLinkItem.displayName = "Navbar.LinkItem";
|
|
1929
|
-
var NavbarNavigation = (0,
|
|
1944
|
+
var NavbarNavigation = (0, import_react36.forwardRef)(
|
|
1930
1945
|
(_a, ref) => {
|
|
1931
1946
|
var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
|
|
1932
|
-
const Component = asChild ?
|
|
1933
|
-
return /* @__PURE__ */ (0,
|
|
1947
|
+
const Component = asChild ? import_react_slot14.Slot : "div";
|
|
1948
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
1934
1949
|
Component,
|
|
1935
1950
|
__spreadValues({
|
|
1936
|
-
className: (0,
|
|
1951
|
+
className: (0, import_typed_classname33.clsx)("hds-navbar__navigation", className),
|
|
1937
1952
|
ref
|
|
1938
1953
|
}, rest)
|
|
1939
1954
|
);
|
|
1940
1955
|
}
|
|
1941
1956
|
);
|
|
1942
1957
|
NavbarNavigation.displayName = "Navbar.Navigation";
|
|
1943
|
-
var Navbar = (0,
|
|
1958
|
+
var Navbar = (0, import_react36.forwardRef)(
|
|
1944
1959
|
(_a, ref) => {
|
|
1945
1960
|
var _b = _a, { asChild, children, className, variant } = _b, rest = __objRest(_b, ["asChild", "children", "className", "variant"]);
|
|
1946
|
-
const Component = asChild ?
|
|
1947
|
-
return /* @__PURE__ */ (0,
|
|
1961
|
+
const Component = asChild ? import_react_slot14.Slot : "header";
|
|
1962
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
1948
1963
|
Component,
|
|
1949
1964
|
__spreadProps(__spreadValues({
|
|
1950
|
-
className: (0,
|
|
1965
|
+
className: (0, import_typed_classname33.clsx)("hds-navbar", variant && `hds-navbar--${variant}`, className),
|
|
1951
1966
|
ref
|
|
1952
1967
|
}, rest), {
|
|
1953
1968
|
children
|
|
@@ -1968,17 +1983,17 @@ Navbar.ItemIcon = NavbarItemIcon;
|
|
|
1968
1983
|
Navbar.Navigation = NavbarNavigation;
|
|
1969
1984
|
|
|
1970
1985
|
// src/show-more/show-more.tsx
|
|
1971
|
-
var
|
|
1972
|
-
var
|
|
1973
|
-
var
|
|
1974
|
-
var ShowMoreButton = (0,
|
|
1986
|
+
var import_typed_classname34 = require("@postenbring/hedwig-css/typed-classname");
|
|
1987
|
+
var import_react37 = require("react");
|
|
1988
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
1989
|
+
var ShowMoreButton = (0, import_react37.forwardRef)(
|
|
1975
1990
|
(_a, ref) => {
|
|
1976
1991
|
var _b = _a, { text, variant, expanded, className } = _b, rest = __objRest(_b, ["text", "variant", "expanded", "className"]);
|
|
1977
|
-
return /* @__PURE__ */ (0,
|
|
1992
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
1978
1993
|
"button",
|
|
1979
1994
|
__spreadProps(__spreadValues({
|
|
1980
1995
|
ref,
|
|
1981
|
-
className: (0,
|
|
1996
|
+
className: (0, import_typed_classname34.clsx)(
|
|
1982
1997
|
"hds-show-more",
|
|
1983
1998
|
variant === "show-more-show-less" && "hds-show-more--show-less",
|
|
1984
1999
|
className
|
|
@@ -1988,7 +2003,7 @@ var ShowMoreButton = (0, import_react36.forwardRef)(
|
|
|
1988
2003
|
}, rest), {
|
|
1989
2004
|
children: [
|
|
1990
2005
|
text,
|
|
1991
|
-
/* @__PURE__ */ (0,
|
|
2006
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: (0, import_typed_classname34.clsx)("hds-show-more__icon") })
|
|
1992
2007
|
]
|
|
1993
2008
|
})
|
|
1994
2009
|
);
|
|
@@ -1997,11 +2012,11 @@ var ShowMoreButton = (0, import_react36.forwardRef)(
|
|
|
1997
2012
|
ShowMoreButton.displayName = "ShowMoreButton";
|
|
1998
2013
|
|
|
1999
2014
|
// src/skeleton/skeleton.tsx
|
|
2000
|
-
var
|
|
2001
|
-
var
|
|
2002
|
-
var
|
|
2003
|
-
var
|
|
2004
|
-
var Skeleton = (0,
|
|
2015
|
+
var import_typed_classname35 = require("@postenbring/hedwig-css/typed-classname");
|
|
2016
|
+
var import_react_slot15 = require("@radix-ui/react-slot");
|
|
2017
|
+
var import_react38 = require("react");
|
|
2018
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
2019
|
+
var Skeleton = (0, import_react38.forwardRef)(
|
|
2005
2020
|
(_a, ref) => {
|
|
2006
2021
|
var _b = _a, {
|
|
2007
2022
|
as: Tag = "div",
|
|
@@ -2024,11 +2039,11 @@ var Skeleton = (0, import_react37.forwardRef)(
|
|
|
2024
2039
|
"className",
|
|
2025
2040
|
"style"
|
|
2026
2041
|
]);
|
|
2027
|
-
const Component = asChild ?
|
|
2028
|
-
return /* @__PURE__ */ (0,
|
|
2042
|
+
const Component = asChild ? import_react_slot15.Slot : Tag;
|
|
2043
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
2029
2044
|
Component,
|
|
2030
2045
|
__spreadProps(__spreadValues(__spreadProps(__spreadValues({
|
|
2031
|
-
className: (0,
|
|
2046
|
+
className: (0, import_typed_classname35.clsx)(
|
|
2032
2047
|
"hds-skeleton",
|
|
2033
2048
|
`hds-skeleton--${variant}`,
|
|
2034
2049
|
!animation && `hds-skeleton--no-animation`,
|
|
@@ -2047,10 +2062,10 @@ var Skeleton = (0, import_react37.forwardRef)(
|
|
|
2047
2062
|
Skeleton.displayName = "Skeleton";
|
|
2048
2063
|
|
|
2049
2064
|
// src/step-indicator/step-indicator.tsx
|
|
2050
|
-
var
|
|
2051
|
-
var
|
|
2052
|
-
var
|
|
2053
|
-
var StepIndicator = (0,
|
|
2065
|
+
var import_typed_classname36 = require("@postenbring/hedwig-css/typed-classname");
|
|
2066
|
+
var import_react39 = require("react");
|
|
2067
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
2068
|
+
var StepIndicator = (0, import_react39.forwardRef)(
|
|
2054
2069
|
(_a, ref) => {
|
|
2055
2070
|
var _b = _a, {
|
|
2056
2071
|
activeStep,
|
|
@@ -2069,27 +2084,27 @@ var StepIndicator = (0, import_react38.forwardRef)(
|
|
|
2069
2084
|
"title",
|
|
2070
2085
|
"titleAs"
|
|
2071
2086
|
]);
|
|
2072
|
-
return /* @__PURE__ */ (0,
|
|
2087
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
2073
2088
|
"div",
|
|
2074
2089
|
__spreadProps(__spreadValues({
|
|
2075
2090
|
ref,
|
|
2076
|
-
className: (0,
|
|
2091
|
+
className: (0, import_typed_classname36.clsx)("hds-step-indicator", className),
|
|
2077
2092
|
lang
|
|
2078
2093
|
}, rest), {
|
|
2079
2094
|
children: [
|
|
2080
|
-
/* @__PURE__ */ (0,
|
|
2081
|
-
/* @__PURE__ */ (0,
|
|
2082
|
-
/* @__PURE__ */ (0,
|
|
2095
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: (0, import_typed_classname36.clsx)("hds-step-indicator__header"), children: [
|
|
2096
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: (0, import_typed_classname36.clsx)("hds-step-indicator__left-label"), children: label }),
|
|
2097
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { children: stepLabelTranslations[lang](activeStep, totalSteps) })
|
|
2083
2098
|
] }),
|
|
2084
|
-
/* @__PURE__ */ (0,
|
|
2099
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: (0, import_typed_classname36.clsx)("hds-step-indicator__steps"), children: Array.from({ length: totalSteps }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
2085
2100
|
"div",
|
|
2086
2101
|
{
|
|
2087
|
-
className: (0,
|
|
2102
|
+
className: (0, import_typed_classname36.clsx)("hds-step-indicator__step"),
|
|
2088
2103
|
"data-state": getStepState(i + 1, activeStep)
|
|
2089
2104
|
},
|
|
2090
2105
|
i
|
|
2091
2106
|
)) }),
|
|
2092
|
-
title ? /* @__PURE__ */ (0,
|
|
2107
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TitleComponent, { className: (0, import_typed_classname36.clsx)("hds-step-indicator__title"), children: title }) : null
|
|
2093
2108
|
]
|
|
2094
2109
|
})
|
|
2095
2110
|
);
|
|
@@ -2113,18 +2128,18 @@ function getStepState(renderedStep, activeStep) {
|
|
|
2113
2128
|
}
|
|
2114
2129
|
|
|
2115
2130
|
// src/styled-html/styled-html.tsx
|
|
2116
|
-
var
|
|
2117
|
-
var
|
|
2118
|
-
var
|
|
2119
|
-
var
|
|
2120
|
-
var StyledHtml = (0,
|
|
2131
|
+
var import_react40 = require("react");
|
|
2132
|
+
var import_typed_classname37 = require("@postenbring/hedwig-css/typed-classname");
|
|
2133
|
+
var import_react_slot16 = require("@radix-ui/react-slot");
|
|
2134
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
2135
|
+
var StyledHtml = (0, import_react40.forwardRef)(
|
|
2121
2136
|
(_a, ref) => {
|
|
2122
2137
|
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 ?
|
|
2124
|
-
return /* @__PURE__ */ (0,
|
|
2138
|
+
const Component = asChild ? import_react_slot16.Slot : "div";
|
|
2139
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
2125
2140
|
Component,
|
|
2126
2141
|
__spreadProps(__spreadValues({
|
|
2127
|
-
className: (0,
|
|
2142
|
+
className: (0, import_typed_classname37.clsx)(
|
|
2128
2143
|
`hds-styled-html`,
|
|
2129
2144
|
size === "small" && "hds-styled-html--small",
|
|
2130
2145
|
darkmode && "hds-styled-html--darkmode",
|
|
@@ -2140,20 +2155,20 @@ var StyledHtml = (0, import_react39.forwardRef)(
|
|
|
2140
2155
|
StyledHtml.displayName = "StyledHtml";
|
|
2141
2156
|
|
|
2142
2157
|
// src/table/table.tsx
|
|
2143
|
-
var
|
|
2144
|
-
var
|
|
2145
|
-
var
|
|
2146
|
-
var Table = (0,
|
|
2158
|
+
var import_typed_classname38 = require("@postenbring/hedwig-css/typed-classname");
|
|
2159
|
+
var import_react41 = require("react");
|
|
2160
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
2161
|
+
var Table = (0, import_react41.forwardRef)(
|
|
2147
2162
|
(_a, ref) => {
|
|
2148
2163
|
var _b = _a, { children, className, size, caption, description } = _b, rest = __objRest(_b, ["children", "className", "size", "caption", "description"]);
|
|
2149
|
-
const descriptionId = (0,
|
|
2150
|
-
return /* @__PURE__ */ (0,
|
|
2151
|
-
/* @__PURE__ */ (0,
|
|
2164
|
+
const descriptionId = (0, import_react41.useId)();
|
|
2165
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
2166
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
2152
2167
|
"table",
|
|
2153
2168
|
__spreadProps(__spreadValues({
|
|
2154
2169
|
"aria-describedby": description ? descriptionId : void 0,
|
|
2155
2170
|
ref,
|
|
2156
|
-
className: (0,
|
|
2171
|
+
className: (0, import_typed_classname38.clsx)(
|
|
2157
2172
|
"hds-table",
|
|
2158
2173
|
{
|
|
2159
2174
|
"hds-table--compressed": size === "compressed",
|
|
@@ -2163,27 +2178,27 @@ var Table = (0, import_react40.forwardRef)(
|
|
|
2163
2178
|
)
|
|
2164
2179
|
}, rest), {
|
|
2165
2180
|
children: [
|
|
2166
|
-
caption ? /* @__PURE__ */ (0,
|
|
2181
|
+
caption ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("caption", { children: caption }) : null,
|
|
2167
2182
|
children
|
|
2168
2183
|
]
|
|
2169
2184
|
})
|
|
2170
2185
|
),
|
|
2171
|
-
description ? /* @__PURE__ */ (0,
|
|
2186
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: (0, import_typed_classname38.clsx)("hds-table-description"), id: descriptionId, children: description }) : null
|
|
2172
2187
|
] });
|
|
2173
2188
|
}
|
|
2174
2189
|
);
|
|
2175
2190
|
Table.displayName = "Table";
|
|
2176
2191
|
|
|
2177
2192
|
// src/tabs/tabs.tsx
|
|
2178
|
-
var
|
|
2179
|
-
var
|
|
2180
|
-
var
|
|
2193
|
+
var import_react45 = require("react");
|
|
2194
|
+
var import_typed_classname41 = require("@postenbring/hedwig-css/typed-classname");
|
|
2195
|
+
var import_react_slot18 = require("@radix-ui/react-slot");
|
|
2181
2196
|
|
|
2182
2197
|
// src/tabs/context.ts
|
|
2183
|
-
var
|
|
2184
|
-
var TabsContext = (0,
|
|
2198
|
+
var import_react42 = require("react");
|
|
2199
|
+
var TabsContext = (0, import_react42.createContext)(null);
|
|
2185
2200
|
function useTabsContext() {
|
|
2186
|
-
const context = (0,
|
|
2201
|
+
const context = (0, import_react42.useContext)(TabsContext);
|
|
2187
2202
|
if (!context) {
|
|
2188
2203
|
throw new Error(
|
|
2189
2204
|
"Tabs context required. Did you use `<Tabs.List />`, `<Tabs.Tab />`, or `<Tabs.Content />` outside of <Tabs/>?"
|
|
@@ -2193,25 +2208,25 @@ function useTabsContext() {
|
|
|
2193
2208
|
}
|
|
2194
2209
|
|
|
2195
2210
|
// src/tabs/tabs-content.tsx
|
|
2196
|
-
var
|
|
2197
|
-
var
|
|
2198
|
-
var
|
|
2199
|
-
var
|
|
2200
|
-
var TabsContents = (0,
|
|
2211
|
+
var import_react43 = require("react");
|
|
2212
|
+
var import_typed_classname39 = require("@postenbring/hedwig-css/typed-classname");
|
|
2213
|
+
var import_react_slot17 = require("@radix-ui/react-slot");
|
|
2214
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
2215
|
+
var TabsContents = (0, import_react43.forwardRef)(
|
|
2201
2216
|
(_a, ref) => {
|
|
2202
2217
|
var _b = _a, { asChild, children } = _b, rest = __objRest(_b, ["asChild", "children"]);
|
|
2203
|
-
const Component = asChild ?
|
|
2204
|
-
return /* @__PURE__ */ (0,
|
|
2218
|
+
const Component = asChild ? import_react_slot17.Slot : "div";
|
|
2219
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Component, __spreadProps(__spreadValues({ ref, className: (0, import_typed_classname39.clsx)("hds-tabs__contents") }, rest), { children }));
|
|
2205
2220
|
}
|
|
2206
2221
|
);
|
|
2207
2222
|
TabsContents.displayName = "Tabs.Contents";
|
|
2208
|
-
var TabsContent = (0,
|
|
2223
|
+
var TabsContent = (0, import_react43.forwardRef)(
|
|
2209
2224
|
(_a, ref) => {
|
|
2210
2225
|
var _b = _a, { asChild, forTabId, children } = _b, rest = __objRest(_b, ["asChild", "forTabId", "children"]);
|
|
2211
2226
|
const context = useTabsContext();
|
|
2212
|
-
const Component = asChild ?
|
|
2227
|
+
const Component = asChild ? import_react_slot17.Slot : "div";
|
|
2213
2228
|
if (context.activeTabId === forTabId) {
|
|
2214
|
-
return /* @__PURE__ */ (0,
|
|
2229
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Component, __spreadProps(__spreadValues({}, rest), { ref, children }));
|
|
2215
2230
|
}
|
|
2216
2231
|
return null;
|
|
2217
2232
|
}
|
|
@@ -2219,21 +2234,21 @@ var TabsContent = (0, import_react42.forwardRef)(
|
|
|
2219
2234
|
TabsContent.displayName = "Tabs.Content";
|
|
2220
2235
|
|
|
2221
2236
|
// src/tabs/tabs-list.tsx
|
|
2222
|
-
var
|
|
2223
|
-
var
|
|
2224
|
-
var
|
|
2225
|
-
var TabsList = (0,
|
|
2237
|
+
var import_react44 = require("react");
|
|
2238
|
+
var import_typed_classname40 = require("@postenbring/hedwig-css/typed-classname");
|
|
2239
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
2240
|
+
var TabsList = (0, import_react44.forwardRef)(
|
|
2226
2241
|
(_a, ref) => {
|
|
2227
2242
|
var _b = _a, { children, direction = "horizontal", className } = _b, rest = __objRest(_b, ["children", "direction", "className"]);
|
|
2228
2243
|
const { activeTabId } = useTabsContext();
|
|
2229
|
-
const tabsListRef = (0,
|
|
2244
|
+
const tabsListRef = (0, import_react44.useRef)(null);
|
|
2230
2245
|
const mergedRef = useMergeRefs([tabsListRef, ref]);
|
|
2231
2246
|
const { width: tabsWidth } = useResize(tabsListRef);
|
|
2232
2247
|
const isClientSide = useHydrated();
|
|
2233
2248
|
const { innerWidth } = isClientSide ? window : { innerWidth: 1e3 };
|
|
2234
2249
|
const wideEnough = innerWidth >= tabsWidth;
|
|
2235
|
-
const previousTabId = (0,
|
|
2236
|
-
(0,
|
|
2250
|
+
const previousTabId = (0, import_react44.useRef)(activeTabId);
|
|
2251
|
+
(0, import_react44.useEffect)(() => {
|
|
2237
2252
|
const tabList = tabsListRef.current;
|
|
2238
2253
|
const activeTab = tabList == null ? void 0 : tabList.querySelector(`[data-tabid="${activeTabId}"]`);
|
|
2239
2254
|
if (!activeTab || !tabList) return;
|
|
@@ -2257,10 +2272,10 @@ var TabsList = (0, import_react43.forwardRef)(
|
|
|
2257
2272
|
}
|
|
2258
2273
|
previousTabId.current = activeTabId;
|
|
2259
2274
|
}, [activeTabId, innerWidth]);
|
|
2260
|
-
return /* @__PURE__ */ (0,
|
|
2275
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
2261
2276
|
"div",
|
|
2262
2277
|
__spreadProps(__spreadValues({
|
|
2263
|
-
className: (0,
|
|
2278
|
+
className: (0, import_typed_classname40.clsx)(
|
|
2264
2279
|
"hds-tabs__list",
|
|
2265
2280
|
direction === "horizontal" ? {
|
|
2266
2281
|
"hds-tabs__list--horizontal": wideEnough,
|
|
@@ -2279,7 +2294,7 @@ var TabsList = (0, import_react43.forwardRef)(
|
|
|
2279
2294
|
}
|
|
2280
2295
|
);
|
|
2281
2296
|
TabsList.displayName = "Tabs.List";
|
|
2282
|
-
var TabsTab = (0,
|
|
2297
|
+
var TabsTab = (0, import_react44.forwardRef)(
|
|
2283
2298
|
(_a, ref) => {
|
|
2284
2299
|
var _b = _a, { children, tabId, className, onClick } = _b, rest = __objRest(_b, ["children", "tabId", "className", "onClick"]);
|
|
2285
2300
|
const context = useTabsContext();
|
|
@@ -2288,10 +2303,10 @@ var TabsTab = (0, import_react43.forwardRef)(
|
|
|
2288
2303
|
context.toggleActiveTabId(tabId);
|
|
2289
2304
|
onClick == null ? void 0 : onClick(e);
|
|
2290
2305
|
};
|
|
2291
|
-
return /* @__PURE__ */ (0,
|
|
2306
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
2292
2307
|
"button",
|
|
2293
2308
|
__spreadProps(__spreadValues({
|
|
2294
|
-
className: (0,
|
|
2309
|
+
className: (0, import_typed_classname40.clsx)(
|
|
2295
2310
|
"hds-tabs__tab",
|
|
2296
2311
|
{ "hds-tabs__tab--active": context.activeTabId === tabId },
|
|
2297
2312
|
className
|
|
@@ -2310,13 +2325,13 @@ var TabsTab = (0, import_react43.forwardRef)(
|
|
|
2310
2325
|
TabsTab.displayName = "Tabs.Tab";
|
|
2311
2326
|
|
|
2312
2327
|
// src/tabs/tabs.tsx
|
|
2313
|
-
var
|
|
2314
|
-
var Tabs = (0,
|
|
2328
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
2329
|
+
var Tabs = (0, import_react45.forwardRef)(
|
|
2315
2330
|
(_a, ref) => {
|
|
2316
2331
|
var _b = _a, { asChild, defaultTab, children } = _b, rest = __objRest(_b, ["asChild", "defaultTab", "children"]);
|
|
2317
|
-
const [activeTabId, setActiveTabId] = (0,
|
|
2318
|
-
const Component = asChild ?
|
|
2319
|
-
return /* @__PURE__ */ (0,
|
|
2332
|
+
const [activeTabId, setActiveTabId] = (0, import_react45.useState)(defaultTab);
|
|
2333
|
+
const Component = asChild ? import_react_slot18.Slot : "div";
|
|
2334
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname41.clsx)("hds-tabs"), ref }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(TabsContext.Provider, { value: { activeTabId, toggleActiveTabId: setActiveTabId }, children }) }));
|
|
2320
2335
|
}
|
|
2321
2336
|
);
|
|
2322
2337
|
Tabs.displayName = "Tabs";
|
|
@@ -2326,10 +2341,10 @@ Tabs.Contents = TabsContents;
|
|
|
2326
2341
|
Tabs.Content = TabsContent;
|
|
2327
2342
|
|
|
2328
2343
|
// src/text/text.tsx
|
|
2329
|
-
var
|
|
2330
|
-
var
|
|
2331
|
-
var
|
|
2332
|
-
var
|
|
2344
|
+
var import_react46 = require("react");
|
|
2345
|
+
var import_typed_classname42 = require("@postenbring/hedwig-css/typed-classname");
|
|
2346
|
+
var import_react_slot19 = require("@radix-ui/react-slot");
|
|
2347
|
+
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
2333
2348
|
var defaultHTMLTag = {
|
|
2334
2349
|
"h1-display": "h1",
|
|
2335
2350
|
h1: "h1",
|
|
@@ -2345,7 +2360,7 @@ var defaultHTMLTag = {
|
|
|
2345
2360
|
caption: "p",
|
|
2346
2361
|
"caption-title": "p"
|
|
2347
2362
|
};
|
|
2348
|
-
var Text = (0,
|
|
2363
|
+
var Text = (0, import_react46.forwardRef)(
|
|
2349
2364
|
(_a, ref) => {
|
|
2350
2365
|
var _b = _a, {
|
|
2351
2366
|
as: Tag,
|
|
@@ -2364,12 +2379,12 @@ var Text = (0, import_react45.forwardRef)(
|
|
|
2364
2379
|
"children",
|
|
2365
2380
|
"className"
|
|
2366
2381
|
]);
|
|
2367
|
-
const Component = asChild ?
|
|
2382
|
+
const Component = asChild ? import_react_slot19.Slot : Tag != null ? Tag : defaultHTMLTag[variant];
|
|
2368
2383
|
const sizeModifier = size !== "fluid" && variant !== "caption" && variant !== "caption-title" && size;
|
|
2369
|
-
return /* @__PURE__ */ (0,
|
|
2384
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
2370
2385
|
Component,
|
|
2371
2386
|
__spreadProps(__spreadValues({
|
|
2372
|
-
className: (0,
|
|
2387
|
+
className: (0, import_typed_classname42.clsx)(
|
|
2373
2388
|
`hds-text-${variant}`,
|
|
2374
2389
|
sizeModifier && `hds-text--${sizeModifier}`,
|
|
2375
2390
|
spacing && "hds-text--spacing",
|
|
@@ -2385,9 +2400,9 @@ var Text = (0, import_react45.forwardRef)(
|
|
|
2385
2400
|
Text.displayName = "Text";
|
|
2386
2401
|
|
|
2387
2402
|
// src/utils/auto-animate-height.tsx
|
|
2388
|
-
var
|
|
2389
|
-
var
|
|
2390
|
-
var AutoAnimateHeight = (0,
|
|
2403
|
+
var import_react47 = require("react");
|
|
2404
|
+
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
2405
|
+
var AutoAnimateHeight = (0, import_react47.forwardRef)(
|
|
2391
2406
|
(_a, ref) => {
|
|
2392
2407
|
var _b = _a, {
|
|
2393
2408
|
children,
|
|
@@ -2403,16 +2418,16 @@ var AutoAnimateHeight = (0, import_react46.forwardRef)(
|
|
|
2403
2418
|
"onTransitionEnd"
|
|
2404
2419
|
]);
|
|
2405
2420
|
var _a2, _b2;
|
|
2406
|
-
const rootRef = (0,
|
|
2421
|
+
const rootRef = (0, import_react47.useRef)(null);
|
|
2407
2422
|
const mergedRef = useMergeRefs([rootRef, ref]);
|
|
2408
|
-
const measurementRef = (0,
|
|
2409
|
-
const [height, setHeight] = (0,
|
|
2423
|
+
const measurementRef = (0, import_react47.useRef)(null);
|
|
2424
|
+
const [height, setHeight] = (0, import_react47.useState)(
|
|
2410
2425
|
void 0
|
|
2411
2426
|
);
|
|
2412
|
-
const [clonedChildren, setClonedChildren] = (0,
|
|
2413
|
-
() => (0,
|
|
2427
|
+
const [clonedChildren, setClonedChildren] = (0, import_react47.useState)(
|
|
2428
|
+
() => (0, import_react47.cloneElement)(/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_jsx_runtime45.Fragment, { children }), {})
|
|
2414
2429
|
);
|
|
2415
|
-
(0,
|
|
2430
|
+
(0, import_react47.useEffect)(() => {
|
|
2416
2431
|
var _a3;
|
|
2417
2432
|
if (!rootRef.current) return;
|
|
2418
2433
|
if (!measurementRef.current) return;
|
|
@@ -2428,7 +2443,7 @@ var AutoAnimateHeight = (0, import_react46.forwardRef)(
|
|
|
2428
2443
|
});
|
|
2429
2444
|
resizeObserver.observe(currentMeasurement);
|
|
2430
2445
|
setHeight({ height: newHeight, shouldAnimate: true });
|
|
2431
|
-
const nextClonedChildren = (0,
|
|
2446
|
+
const nextClonedChildren = (0, import_react47.cloneElement)(/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_jsx_runtime45.Fragment, { children }), {});
|
|
2432
2447
|
if (newHeight >= ((_a3 = height == null ? void 0 : height.height) != null ? _a3 : 0)) {
|
|
2433
2448
|
setClonedChildren(nextClonedChildren);
|
|
2434
2449
|
return () => {
|
|
@@ -2446,7 +2461,7 @@ var AutoAnimateHeight = (0, import_react46.forwardRef)(
|
|
|
2446
2461
|
currentRoot.removeEventListener("transitionend", onTransitionEndHandler);
|
|
2447
2462
|
};
|
|
2448
2463
|
}, [children]);
|
|
2449
|
-
return /* @__PURE__ */ (0,
|
|
2464
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
|
|
2450
2465
|
"div",
|
|
2451
2466
|
__spreadProps(__spreadValues({
|
|
2452
2467
|
ref: mergedRef,
|
|
@@ -2462,7 +2477,7 @@ var AutoAnimateHeight = (0, import_react46.forwardRef)(
|
|
|
2462
2477
|
}, style)
|
|
2463
2478
|
}, rest), {
|
|
2464
2479
|
children: [
|
|
2465
|
-
/* @__PURE__ */ (0,
|
|
2480
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
|
|
2466
2481
|
"div",
|
|
2467
2482
|
{
|
|
2468
2483
|
"aria-hidden": true,
|
|
@@ -2484,16 +2499,16 @@ var AutoAnimateHeight = (0, import_react46.forwardRef)(
|
|
|
2484
2499
|
AutoAnimateHeight.displayName = "AutoAnimateHeight";
|
|
2485
2500
|
|
|
2486
2501
|
// src/warning-banner/warning-banner.tsx
|
|
2487
|
-
var
|
|
2488
|
-
var
|
|
2489
|
-
var
|
|
2490
|
-
var WarningBanner = (0,
|
|
2502
|
+
var import_react48 = require("react");
|
|
2503
|
+
var import_typed_classname43 = require("@postenbring/hedwig-css/typed-classname");
|
|
2504
|
+
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
2505
|
+
var WarningBanner = (0, import_react48.forwardRef)(
|
|
2491
2506
|
(_a, ref) => {
|
|
2492
2507
|
var _b = _a, { title, description, className } = _b, rest = __objRest(_b, ["title", "description", "className"]);
|
|
2493
|
-
const descriptionId = (0,
|
|
2508
|
+
const descriptionId = (0, import_react48.useId)();
|
|
2494
2509
|
const expandable = !!description;
|
|
2495
|
-
return /* @__PURE__ */ (0,
|
|
2496
|
-
/* @__PURE__ */ (0,
|
|
2510
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", __spreadProps(__spreadValues({}, rest), { className: (0, import_typed_classname43.clsx)("hds-warning-banner", className), ref, children: [
|
|
2511
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
2497
2512
|
WarningBannerTitle,
|
|
2498
2513
|
{
|
|
2499
2514
|
variant: expandable ? "expandable" : "default",
|
|
@@ -2501,22 +2516,22 @@ var WarningBanner = (0, import_react47.forwardRef)(
|
|
|
2501
2516
|
children: title
|
|
2502
2517
|
}
|
|
2503
2518
|
),
|
|
2504
|
-
expandable ? /* @__PURE__ */ (0,
|
|
2519
|
+
expandable ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(WarningBannerDescription, { id: descriptionId, children: description }) : null
|
|
2505
2520
|
] }));
|
|
2506
2521
|
}
|
|
2507
2522
|
);
|
|
2508
2523
|
WarningBanner.displayName = "WarningBanner";
|
|
2509
|
-
var WarningBannerTitle = (0,
|
|
2524
|
+
var WarningBannerTitle = (0, import_react48.forwardRef)((_a, ref) => {
|
|
2510
2525
|
var _b = _a, { variant, descriptionId, children, className } = _b, rest = __objRest(_b, ["variant", "descriptionId", "children", "className"]);
|
|
2511
|
-
const [open, setOpen] = (0,
|
|
2526
|
+
const [open, setOpen] = (0, import_react48.useState)(false);
|
|
2512
2527
|
if (variant === "expandable") {
|
|
2513
|
-
return /* @__PURE__ */ (0,
|
|
2528
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
2514
2529
|
"button",
|
|
2515
2530
|
__spreadProps(__spreadValues({}, rest), {
|
|
2516
2531
|
"aria-expanded": open,
|
|
2517
2532
|
"aria-controls": descriptionId,
|
|
2518
2533
|
"data-state": open ? "open" : "closed",
|
|
2519
|
-
className: (0,
|
|
2534
|
+
className: (0, import_typed_classname43.clsx)(
|
|
2520
2535
|
"hds-warning-banner__title",
|
|
2521
2536
|
"hds-warning-banner__title-trigger",
|
|
2522
2537
|
className
|
|
@@ -2526,28 +2541,28 @@ var WarningBannerTitle = (0, import_react47.forwardRef)((_a, ref) => {
|
|
|
2526
2541
|
},
|
|
2527
2542
|
ref,
|
|
2528
2543
|
type: "button",
|
|
2529
|
-
children: /* @__PURE__ */ (0,
|
|
2544
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { children })
|
|
2530
2545
|
})
|
|
2531
2546
|
);
|
|
2532
2547
|
}
|
|
2533
|
-
return /* @__PURE__ */ (0,
|
|
2548
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
2534
2549
|
"p",
|
|
2535
2550
|
__spreadProps(__spreadValues({}, rest), {
|
|
2536
|
-
className: (0,
|
|
2551
|
+
className: (0, import_typed_classname43.clsx)("hds-warning-banner__title", className),
|
|
2537
2552
|
ref,
|
|
2538
2553
|
children
|
|
2539
2554
|
})
|
|
2540
2555
|
);
|
|
2541
2556
|
});
|
|
2542
2557
|
WarningBannerTitle.displayName = "WarningBannerTitle";
|
|
2543
|
-
var WarningBannerDescription = (0,
|
|
2558
|
+
var WarningBannerDescription = (0, import_react48.forwardRef)(
|
|
2544
2559
|
(_a, ref) => {
|
|
2545
2560
|
var _b = _a, { className, id } = _b, rest = __objRest(_b, ["className", "id"]);
|
|
2546
|
-
return /* @__PURE__ */ (0,
|
|
2561
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
2547
2562
|
"p",
|
|
2548
2563
|
__spreadValues({
|
|
2549
2564
|
id,
|
|
2550
|
-
className: (0,
|
|
2565
|
+
className: (0, import_typed_classname43.clsx)("hds-warning-banner__description", className),
|
|
2551
2566
|
ref
|
|
2552
2567
|
}, rest)
|
|
2553
2568
|
);
|
|
@@ -2583,6 +2598,7 @@ WarningBannerDescription.displayName = "WarningBannerDescription";
|
|
|
2583
2598
|
DescriptionList,
|
|
2584
2599
|
ErrorMessage,
|
|
2585
2600
|
Fieldset,
|
|
2601
|
+
Figure,
|
|
2586
2602
|
Footer,
|
|
2587
2603
|
FooterButtonLink,
|
|
2588
2604
|
FooterLinkSection,
|