bonkers-ui 2.0.11 → 2.0.13
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/UiNavigationSteps-Daqd0O2G.js +139 -0
- package/UiNavigationSteps-Daqd0O2G.js.map +1 -0
- package/_types/align.js.map +1 -1
- package/_types/colors.d.ts +8 -1
- package/_types/colors.js +1 -1
- package/_types/colors.js.map +1 -1
- package/_types/sizing.js.map +1 -1
- package/assets/UiNavigationSteps.css +1 -1
- package/bonkers.css +20 -0
- package/components/UiAccordion/UiAccordion.InfoDropdown.js.map +1 -1
- package/components/UiAccordion/UiAccordion.base.js.map +1 -1
- package/components/UiAccordion/UiAccordion.context.js.map +1 -1
- package/components/UiAccordion/UiAccordionItem.base.js.map +1 -1
- package/components/UiAccordion/_types.js.map +1 -1
- package/components/UiAlert/UiAlert.js.map +1 -1
- package/components/UiAlert/_types.js.map +1 -1
- package/components/UiBerRank/UiBerRank.js.map +1 -1
- package/components/UiBerRank/_types.d.ts +15 -15
- package/components/UiBerRank/_types.js +22 -22
- package/components/UiBerRank/_types.js.map +1 -1
- package/components/UiButton/UiButton.js.map +1 -1
- package/components/UiButton/_types.js.map +1 -1
- package/components/UiCheckbox/UiCheckbox.js.map +1 -1
- package/components/UiCheckbox/_types.js.map +1 -1
- package/components/UiIcon/UiIcon.js.map +1 -1
- package/components/UiIconBadge/UiIconBadge.js.map +1 -1
- package/components/UiIconBadge/_types.js.map +1 -1
- package/components/UiInput/UiInput.base.js +12 -11
- package/components/UiInput/UiInput.base.js.map +1 -1
- package/components/UiInput/UiInputStatusMessage.d.ts +10 -0
- package/components/UiInput/UiInputStatusMessage.js +36 -0
- package/components/UiInput/UiInputStatusMessage.js.map +1 -0
- package/components/UiInput/UiInputText.js +15 -27
- package/components/UiInput/UiInputText.js.map +1 -1
- package/components/UiInput/UiInputTextArea.d.ts +12 -0
- package/components/UiInput/UiInputTextArea.js +74 -0
- package/components/UiInput/UiInputTextArea.js.map +1 -0
- package/components/UiInput/UiInputTitled.js.map +1 -1
- package/components/UiInput/_types.js.map +1 -1
- package/components/UiInput/index.d.ts +6 -4
- package/components/UiInput/index.js +12 -8
- package/components/UiInput/index.js.map +1 -1
- package/components/UiInputRange/UiInputRange.js.map +1 -1
- package/components/UiList/UiList.js.map +1 -1
- package/components/UiList/UiListItem.js.map +1 -1
- package/components/UiList/_types.js.map +1 -1
- package/components/UiNavigationSteps/UiNavigationStep.js +41 -48
- package/components/UiNavigationSteps/UiNavigationStep.js.map +1 -1
- package/components/UiNavigationSteps/UiNavigationSteps.js +1 -1
- package/components/UiNavigationSteps/_types.js.map +1 -1
- package/components/UiNavigationSteps/index.js +1 -1
- package/components/UiNotificationBadge/UiNotificationBadge.js.map +1 -1
- package/components/UiNotificationBadge/_types.js.map +1 -1
- package/components/UiPills/UiPills.js.map +1 -1
- package/components/UiPills/_types.js.map +1 -1
- package/components/UiPlainRadio/UiPlainRadio.js.map +1 -1
- package/components/UiProductCard/UiProductCard.js.map +1 -1
- package/components/UiProgress/UiProgress.js.map +1 -1
- package/components/UiRadio/UiRadio.js.map +1 -1
- package/components/UiRadioFancy/UiRadioFancy.js.map +1 -1
- package/components/UiRadioFancy/_types.js.map +1 -1
- package/components/UiSelect/UiSelect.js +67 -69
- package/components/UiSelect/UiSelect.js.map +1 -1
- package/components/UiSkeleton/UiSkeleton.js.map +1 -1
- package/components/UiSkeleton/_types.js.map +1 -1
- package/components/UiSnackbar/UiSnackbar.d.ts +10 -2
- package/components/UiSnackbar/UiSnackbar.js +117 -49
- package/components/UiSnackbar/UiSnackbar.js.map +1 -1
- package/components/UiSnackbar/_types.d.ts +5 -0
- package/components/UiSnackbar/_types.js +3 -2
- package/components/UiSnackbar/_types.js.map +1 -1
- package/components/UiStars/UiStars.js.map +1 -1
- package/components/UiStars/_types.js.map +1 -1
- package/components/UiTable/UiTable.js.map +1 -1
- package/components/UiTable/UiTableRow.js.map +1 -1
- package/components/UiTable/_types.js.map +1 -1
- package/components/UiTabs/UiTabs.js.map +1 -1
- package/components/UiToggle/UiToggle.js.map +1 -1
- package/components/UiTypography/UiTypography.js +38 -31
- package/components/UiTypography/UiTypography.js.map +1 -1
- package/components/UiTypography/_types.js.map +1 -1
- package/helper.d.ts +1 -0
- package/package.json +19 -19
- package/UiNavigationSteps-N3juxg3H.js +0 -103
- package/UiNavigationSteps-N3juxg3H.js.map +0 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import i from "react";
|
|
2
|
-
import { ETypographySizes as e, ETextTransform as r, ETextAlign as
|
|
2
|
+
import { ETypographySizes as e, ETextTransform as r, ETextAlign as a, ETextWeight as R } from "./_types.js";
|
|
3
3
|
import { EColors as t } from "../../_types/colors.js";
|
|
4
4
|
import y from "classnames";
|
|
5
5
|
const m = {
|
|
@@ -13,21 +13,21 @@ const m = {
|
|
|
13
13
|
[e.XXXL]: "text-3xl",
|
|
14
14
|
[e.XXXXL]: "text-4xl",
|
|
15
15
|
[e.XXXXXL]: "text-5xl"
|
|
16
|
-
},
|
|
16
|
+
}, L = {
|
|
17
17
|
[r.UPPERCASE]: "uppercase",
|
|
18
18
|
[r.LOWERCASE]: "lowercase",
|
|
19
19
|
[r.NONE]: "normal-case",
|
|
20
20
|
[r.CAPITALIZE]: "capitalize"
|
|
21
|
-
},
|
|
22
|
-
[
|
|
23
|
-
[
|
|
24
|
-
[
|
|
25
|
-
}, Y = {
|
|
26
|
-
[a.LIGHT]: "font-light",
|
|
27
|
-
[a.REGULAR]: "font-medium",
|
|
28
|
-
[a.SEMI_BOLD]: "font-bold",
|
|
29
|
-
[a.BOLD]: "font-black"
|
|
21
|
+
}, p = {
|
|
22
|
+
[a.LEFT]: "text-left",
|
|
23
|
+
[a.RIGHT]: "text-right",
|
|
24
|
+
[a.CENTER]: "text-center"
|
|
30
25
|
}, I = {
|
|
26
|
+
[R.LIGHT]: "font-light",
|
|
27
|
+
[R.REGULAR]: "font-medium",
|
|
28
|
+
[R.SEMI_BOLD]: "font-bold",
|
|
29
|
+
[R.BOLD]: "font-black"
|
|
30
|
+
}, Y = {
|
|
31
31
|
[t.WHITE]: "text-white",
|
|
32
32
|
[t.BLACK]: "text-black",
|
|
33
33
|
[t.TRANSPARENT]: "text-transparent",
|
|
@@ -86,39 +86,46 @@ const m = {
|
|
|
86
86
|
[t.ACCENT_ALT_400]: "text-accent-alt-400",
|
|
87
87
|
[t.ACCENT_ALT_500]: "text-accent-alt-500",
|
|
88
88
|
[t.ACCENT_ALT_600]: "text-accent-alt-600",
|
|
89
|
-
[t.ACCENT_ALT_700]: "text-accent-alt-700"
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
89
|
+
[t.ACCENT_ALT_700]: "text-accent-alt-700",
|
|
90
|
+
[t.BER_DARK_GREEN]: "text-ber-dark-green",
|
|
91
|
+
[t.BER_MID_GREEN]: "text-ber-mid-green",
|
|
92
|
+
[t.BER_BRIGHT_GREEN]: "text-ber-bright-green",
|
|
93
|
+
[t.BER_YELLOW]: "text-ber-yellow",
|
|
94
|
+
[t.BER_MID_ORANGE]: "text-ber-mid-orange",
|
|
95
|
+
[t.BER_DARK_ORANGE]: "text-ber-dark-orange",
|
|
96
|
+
[t.BER_RED]: "text-ber-red"
|
|
97
|
+
}, D = ({
|
|
98
|
+
children: c,
|
|
99
|
+
tag: o,
|
|
100
|
+
underline: s = !1,
|
|
94
101
|
lineHeight: l = !1,
|
|
95
102
|
size: x,
|
|
96
103
|
textTransform: A,
|
|
97
104
|
align: _,
|
|
98
|
-
weight:
|
|
99
|
-
color:
|
|
100
|
-
className:
|
|
101
|
-
...
|
|
105
|
+
weight: E,
|
|
106
|
+
color: n,
|
|
107
|
+
className: N,
|
|
108
|
+
...C
|
|
102
109
|
}) => {
|
|
103
|
-
const
|
|
110
|
+
const T = y(
|
|
104
111
|
"ui-typography",
|
|
105
112
|
{
|
|
106
|
-
underline:
|
|
113
|
+
underline: s
|
|
107
114
|
},
|
|
108
115
|
l ? "leading-normal" : "leading-none",
|
|
109
116
|
x && m[x],
|
|
110
|
-
A &&
|
|
111
|
-
_ &&
|
|
117
|
+
A && L[A],
|
|
118
|
+
_ && p[_],
|
|
119
|
+
E && I[E],
|
|
112
120
|
n && Y[n],
|
|
113
|
-
|
|
114
|
-
C
|
|
121
|
+
N
|
|
115
122
|
);
|
|
116
|
-
return i.createElement(
|
|
117
|
-
className:
|
|
118
|
-
...
|
|
119
|
-
},
|
|
123
|
+
return i.createElement(o || "p", {
|
|
124
|
+
className: T,
|
|
125
|
+
...C
|
|
126
|
+
}, c);
|
|
120
127
|
};
|
|
121
128
|
export {
|
|
122
|
-
|
|
129
|
+
D as UiTypography
|
|
123
130
|
};
|
|
124
131
|
//# sourceMappingURL=UiTypography.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UiTypography.js","sources":["../../../src/components/UiTypography/UiTypography.tsx"],"sourcesContent":["import React from \"react\";\nimport { ETextAlign, ETextTransform, ETextWeight, ETypographySizes } from \"./_types.ts\";\nimport { EColors } from \"../../_types/colors.ts\";\nimport cx from \"classnames\";\n\ntype TUiTypographyProps<T extends keyof React.JSX.IntrinsicElements> = {\n\ttag?: T;\n\tchildren?: React.ReactNode;\n\tunderline?: boolean;\n\tlineHeight?: boolean;\n\tsize?: ETypographySizes;\n\ttextTransform?: ETextTransform;\n\talign?: ETextAlign;\n\tweight?: ETextWeight;\n\tcolor?: EColors;\n} & Omit<React.JSX.IntrinsicElements[T], \"children\" | \"ref\">;\n\nconst sizeClasses = {\n\t[ETypographySizes.MD]: \"text-md\",\n\t[ETypographySizes.XXS]: \"text-xxs\",\n\t[ETypographySizes.XS]: \"text-xs\",\n\t[ETypographySizes.SM]: \"text-sm\",\n\t[ETypographySizes.LG]: \"text-lg\",\n\t[ETypographySizes.XL]: \"text-xl\",\n\t[ETypographySizes.XXL]: \"text-2xl\",\n\t[ETypographySizes.XXXL]: \"text-3xl\",\n\t[ETypographySizes.XXXXL]: \"text-4xl\",\n\t[ETypographySizes.XXXXXL]: \"text-5xl\",\n};\n\nconst textTransformClasses = {\n\t[ETextTransform.UPPERCASE]: \"uppercase\",\n\t[ETextTransform.LOWERCASE]: \"lowercase\",\n\t[ETextTransform.NONE]: \"normal-case\",\n\t[ETextTransform.CAPITALIZE]: \"capitalize\",\n};\n\nconst alignClasses = {\n\t[ETextAlign.LEFT]: \"text-left\",\n\t[ETextAlign.RIGHT]: \"text-right\",\n\t[ETextAlign.CENTER]: \"text-center\",\n};\n\nconst weightClasses = {\n\t[ETextWeight.LIGHT]: \"font-light\",\n\t[ETextWeight.REGULAR]: \"font-medium\",\n\t[ETextWeight.SEMI_BOLD]: \"font-bold\",\n\t[ETextWeight.BOLD]: \"font-black\",\n};\n\nconst colorClasses = {\n\t[EColors.WHITE]: \"text-white\",\n\t[EColors.BLACK]: \"text-black\",\n\t[EColors.TRANSPARENT]: \"text-transparent\",\n\t[EColors.CURRENT]: \"text-current\",\n\n\t[EColors.PRIMARY]: \"text-primary\",\n\t[EColors.PRIMARY_50]: \"text-primary-50\",\n\t[EColors.PRIMARY_100]: \"text-primary-100\",\n\t[EColors.PRIMARY_200]: \"text-primary-200\",\n\t[EColors.PRIMARY_300]: \"text-primary-300\",\n\t[EColors.PRIMARY_400]: \"text-primary-400\",\n\t[EColors.PRIMARY_500]: \"text-primary-500\",\n\t[EColors.PRIMARY_600]: \"text-primary-600\",\n\t[EColors.PRIMARY_700]: \"text-primary-700\",\n\t[EColors.PRIMARY_800]: \"text-primary-800\",\n\t[EColors.PRIMARY_900]: \"text-primary-900\",\n\n\t[EColors.PRIMARY_ALT]: \"text-primary-alt\",\n\t[EColors.PRIMARY_ALT_300]: \"text-primary-alt-300\",\n\t[EColors.PRIMARY_ALT_400]: \"text-primary-alt-400\",\n\t[EColors.PRIMARY_ALT_500]: \"text-primary-alt-500\",\n\t[EColors.PRIMARY_ALT_600]: \"text-primary-alt-600\",\n\t[EColors.PRIMARY_ALT_700]: \"text-primary-alt-700\",\n\n\t[EColors.WARNING]: \"text-warning\",\n\t[EColors.WARNING_300]: \"text-warning-300\",\n\t[EColors.WARNING_400]: \"text-warning-400\",\n\t[EColors.WARNING_500]: \"text-warning-500\",\n\t[EColors.WARNING_600]: \"text-warning-600\",\n\t[EColors.WARNING_700]: \"text-warning-700\",\n\n\t[EColors.SECONDARY]: \"text-secondary\",\n\t[EColors.SECONDARY_300]: \"text-secondary-300\",\n\t[EColors.SECONDARY_400]: \"text-secondary-400\",\n\t[EColors.SECONDARY_500]: \"text-secondary-500\",\n\t[EColors.SECONDARY_600]: \"text-secondary-600\",\n\t[EColors.SECONDARY_700]: \"text-secondary-700\",\n\n\t[EColors.SECONDARY_ALT]: \"text-secondary-alt\",\n\t[EColors.SECONDARY_ALT_200]: \"text-secondary-alt-200\",\n\t[EColors.SECONDARY_ALT_300]: \"text-secondary-alt-300\",\n\t[EColors.SECONDARY_ALT_400]: \"text-secondary-alt-400\",\n\t[EColors.SECONDARY_ALT_500]: \"text-secondary-alt-500\",\n\t[EColors.SECONDARY_ALT_600]: \"text-secondary-alt-600\",\n\t[EColors.SECONDARY_ALT_700]: \"text-secondary-alt-700\",\n\n\t[EColors.ERROR]: \"text-error\",\n\t[EColors.ERROR_100]: \"text-error-100\",\n\t[EColors.ERROR_200]: \"text-error-200\",\n\t[EColors.ERROR_300]: \"text-error-300\",\n\t[EColors.ERROR_400]: \"text-error-400\",\n\t[EColors.ERROR_500]: \"text-error-500\",\n\t[EColors.ERROR_600]: \"text-error-600\",\n\t[EColors.ERROR_700]: \"text-error-700\",\n\n\t[EColors.ACCENT]: \"text-accent\",\n\t[EColors.ACCENT_300]: \"text-accent-300\",\n\t[EColors.ACCENT_500]: \"text-accent-500\",\n\t[EColors.ACCENT_600]: \"text-accent-600\",\n\t[EColors.ACCENT_700]: \"text-accent-700\",\n\n\t[EColors.ACCENT_ALT]: \"text-accent-alt\",\n\t[EColors.ACCENT_ALT_300]: \"text-accent-alt-300\",\n\t[EColors.ACCENT_ALT_400]: \"text-accent-alt-400\",\n\t[EColors.ACCENT_ALT_500]: \"text-accent-alt-500\",\n\t[EColors.ACCENT_ALT_600]: \"text-accent-alt-600\",\n\t[EColors.ACCENT_ALT_700]: \"text-accent-alt-700\",\n};\n\nexport const UiTypography = <T extends keyof React.JSX.IntrinsicElements> (\n\t{\n\t\tchildren,\n\t\ttag,\n\t\tunderline = false,\n\t\tlineHeight = false,\n\t\tsize,\n\t\ttextTransform,\n\t\talign,\n\t\tweight,\n\t\tcolor,\n\t\tclassName,\n\t\t...rest\n\t}: TUiTypographyProps<T> ): React.JSX.Element => {\n\n\tconst classes = cx(\n\t\t\"ui-typography\",\n\t\t{\n\t\t\tunderline\n\t\t},\n\t\tlineHeight\n\t\t\t? \"leading-normal\"\n\t\t\t: \"leading-none\",\n\t\tsize && sizeClasses[size],\n\t\ttextTransform && textTransformClasses[textTransform],\n\t\talign && alignClasses[align],\n\t\tweight && weightClasses[weight],\n\t\tcolor && colorClasses[color],\n\t\tclassName\n\t);\n\n\treturn React.createElement(tag || \"p\", {\n\t\tclassName: classes,\n\t\t...rest\n\t}, children);\n};\n"],"names":["sizeClasses","ETypographySizes","textTransformClasses","ETextTransform","alignClasses","ETextAlign","weightClasses","ETextWeight","colorClasses","EColors","UiTypography","children","tag","underline","lineHeight","size","textTransform","align","weight","color","className","rest","classes","cx","React"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"UiTypography.js","sources":["../../../src/components/UiTypography/UiTypography.tsx"],"sourcesContent":["import React from \"react\";\nimport { ETextAlign, ETextTransform, ETextWeight, ETypographySizes } from \"./_types.ts\";\nimport { EColors } from \"../../_types/colors.ts\";\nimport cx from \"classnames\";\n\ntype TUiTypographyProps<T extends keyof React.JSX.IntrinsicElements> = {\n\ttag?: T;\n\tchildren?: React.ReactNode;\n\tunderline?: boolean;\n\tlineHeight?: boolean;\n\tsize?: ETypographySizes;\n\ttextTransform?: ETextTransform;\n\talign?: ETextAlign;\n\tweight?: ETextWeight;\n\tcolor?: EColors;\n} & Omit<React.JSX.IntrinsicElements[T], \"children\" | \"ref\">;\n\nconst sizeClasses = {\n\t[ETypographySizes.MD]: \"text-md\",\n\t[ETypographySizes.XXS]: \"text-xxs\",\n\t[ETypographySizes.XS]: \"text-xs\",\n\t[ETypographySizes.SM]: \"text-sm\",\n\t[ETypographySizes.LG]: \"text-lg\",\n\t[ETypographySizes.XL]: \"text-xl\",\n\t[ETypographySizes.XXL]: \"text-2xl\",\n\t[ETypographySizes.XXXL]: \"text-3xl\",\n\t[ETypographySizes.XXXXL]: \"text-4xl\",\n\t[ETypographySizes.XXXXXL]: \"text-5xl\",\n};\n\nconst textTransformClasses = {\n\t[ETextTransform.UPPERCASE]: \"uppercase\",\n\t[ETextTransform.LOWERCASE]: \"lowercase\",\n\t[ETextTransform.NONE]: \"normal-case\",\n\t[ETextTransform.CAPITALIZE]: \"capitalize\",\n};\n\nconst alignClasses = {\n\t[ETextAlign.LEFT]: \"text-left\",\n\t[ETextAlign.RIGHT]: \"text-right\",\n\t[ETextAlign.CENTER]: \"text-center\",\n};\n\nconst weightClasses = {\n\t[ETextWeight.LIGHT]: \"font-light\",\n\t[ETextWeight.REGULAR]: \"font-medium\",\n\t[ETextWeight.SEMI_BOLD]: \"font-bold\",\n\t[ETextWeight.BOLD]: \"font-black\",\n};\n\nconst colorClasses = {\n\t[EColors.WHITE]: \"text-white\",\n\t[EColors.BLACK]: \"text-black\",\n\t[EColors.TRANSPARENT]: \"text-transparent\",\n\t[EColors.CURRENT]: \"text-current\",\n\n\t[EColors.PRIMARY]: \"text-primary\",\n\t[EColors.PRIMARY_50]: \"text-primary-50\",\n\t[EColors.PRIMARY_100]: \"text-primary-100\",\n\t[EColors.PRIMARY_200]: \"text-primary-200\",\n\t[EColors.PRIMARY_300]: \"text-primary-300\",\n\t[EColors.PRIMARY_400]: \"text-primary-400\",\n\t[EColors.PRIMARY_500]: \"text-primary-500\",\n\t[EColors.PRIMARY_600]: \"text-primary-600\",\n\t[EColors.PRIMARY_700]: \"text-primary-700\",\n\t[EColors.PRIMARY_800]: \"text-primary-800\",\n\t[EColors.PRIMARY_900]: \"text-primary-900\",\n\n\t[EColors.PRIMARY_ALT]: \"text-primary-alt\",\n\t[EColors.PRIMARY_ALT_300]: \"text-primary-alt-300\",\n\t[EColors.PRIMARY_ALT_400]: \"text-primary-alt-400\",\n\t[EColors.PRIMARY_ALT_500]: \"text-primary-alt-500\",\n\t[EColors.PRIMARY_ALT_600]: \"text-primary-alt-600\",\n\t[EColors.PRIMARY_ALT_700]: \"text-primary-alt-700\",\n\n\t[EColors.WARNING]: \"text-warning\",\n\t[EColors.WARNING_300]: \"text-warning-300\",\n\t[EColors.WARNING_400]: \"text-warning-400\",\n\t[EColors.WARNING_500]: \"text-warning-500\",\n\t[EColors.WARNING_600]: \"text-warning-600\",\n\t[EColors.WARNING_700]: \"text-warning-700\",\n\n\t[EColors.SECONDARY]: \"text-secondary\",\n\t[EColors.SECONDARY_300]: \"text-secondary-300\",\n\t[EColors.SECONDARY_400]: \"text-secondary-400\",\n\t[EColors.SECONDARY_500]: \"text-secondary-500\",\n\t[EColors.SECONDARY_600]: \"text-secondary-600\",\n\t[EColors.SECONDARY_700]: \"text-secondary-700\",\n\n\t[EColors.SECONDARY_ALT]: \"text-secondary-alt\",\n\t[EColors.SECONDARY_ALT_200]: \"text-secondary-alt-200\",\n\t[EColors.SECONDARY_ALT_300]: \"text-secondary-alt-300\",\n\t[EColors.SECONDARY_ALT_400]: \"text-secondary-alt-400\",\n\t[EColors.SECONDARY_ALT_500]: \"text-secondary-alt-500\",\n\t[EColors.SECONDARY_ALT_600]: \"text-secondary-alt-600\",\n\t[EColors.SECONDARY_ALT_700]: \"text-secondary-alt-700\",\n\n\t[EColors.ERROR]: \"text-error\",\n\t[EColors.ERROR_100]: \"text-error-100\",\n\t[EColors.ERROR_200]: \"text-error-200\",\n\t[EColors.ERROR_300]: \"text-error-300\",\n\t[EColors.ERROR_400]: \"text-error-400\",\n\t[EColors.ERROR_500]: \"text-error-500\",\n\t[EColors.ERROR_600]: \"text-error-600\",\n\t[EColors.ERROR_700]: \"text-error-700\",\n\n\t[EColors.ACCENT]: \"text-accent\",\n\t[EColors.ACCENT_300]: \"text-accent-300\",\n\t[EColors.ACCENT_500]: \"text-accent-500\",\n\t[EColors.ACCENT_600]: \"text-accent-600\",\n\t[EColors.ACCENT_700]: \"text-accent-700\",\n\n\t[EColors.ACCENT_ALT]: \"text-accent-alt\",\n\t[EColors.ACCENT_ALT_300]: \"text-accent-alt-300\",\n\t[EColors.ACCENT_ALT_400]: \"text-accent-alt-400\",\n\t[EColors.ACCENT_ALT_500]: \"text-accent-alt-500\",\n\t[EColors.ACCENT_ALT_600]: \"text-accent-alt-600\",\n\t[EColors.ACCENT_ALT_700]: \"text-accent-alt-700\",\n\n\t[EColors.BER_DARK_GREEN]: \"text-ber-dark-green\",\n\t[EColors.BER_MID_GREEN]: \"text-ber-mid-green\",\n\t[EColors.BER_BRIGHT_GREEN]: \"text-ber-bright-green\",\n\t[EColors.BER_YELLOW]: \"text-ber-yellow\",\n\t[EColors.BER_MID_ORANGE]: \"text-ber-mid-orange\",\n\t[EColors.BER_DARK_ORANGE]: \"text-ber-dark-orange\",\n\t[EColors.BER_RED]: \"text-ber-red\",\n\n};\n\nexport const UiTypography = <T extends keyof React.JSX.IntrinsicElements> (\n\t{\n\t\tchildren,\n\t\ttag,\n\t\tunderline = false,\n\t\tlineHeight = false,\n\t\tsize,\n\t\ttextTransform,\n\t\talign,\n\t\tweight,\n\t\tcolor,\n\t\tclassName,\n\t\t...rest\n\t}: TUiTypographyProps<T> ): React.JSX.Element => {\n\n\tconst classes = cx(\n\t\t\"ui-typography\",\n\t\t{\n\t\t\tunderline\n\t\t},\n\t\tlineHeight\n\t\t\t? \"leading-normal\"\n\t\t\t: \"leading-none\",\n\t\tsize && sizeClasses[size],\n\t\ttextTransform && textTransformClasses[textTransform],\n\t\talign && alignClasses[align],\n\t\tweight && weightClasses[weight],\n\t\tcolor && colorClasses[color],\n\t\tclassName\n\t);\n\n\treturn React.createElement(tag || \"p\", {\n\t\tclassName: classes,\n\t\t...rest\n\t}, children);\n};\n"],"names":["sizeClasses","ETypographySizes","textTransformClasses","ETextTransform","alignClasses","ETextAlign","weightClasses","ETextWeight","colorClasses","EColors","UiTypography","children","tag","underline","lineHeight","size","textTransform","align","weight","color","className","rest","classes","cx","React"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"_types.js","sources":["../../../src/components/UiTypography/_types.ts"],"sourcesContent":["export enum ETypographySizes {\n\t/**\n\t * 10px\n\t */\n\tXXS = \"xxs\",\n\t/**\n\t * 12px\n\t */\n\tXS = \"xs\",\n\t/**\n\t * 14px\n\t */\n\tSM = \"sm\",\n\t/**\n\t * 16px\n\t */\n\tMD = \"md\",\n\t/**\n\t * 18px\n\t */\n\tLG = \"lg\",\n\t/**\n\t * 20px\n\t */\n\tXL = \"xl\",\n\t/**\n\t * 24px\n\t */\n\tXXL = \"2xl\",\n\t/**\n\t * 28px\n\t */\n\tXXXL = \"3xl\",\n\t/**\n\t * 42px\n\t */\n\tXXXXL = \"4xl\",\n\t/**\n\t * 40px\n\t */\n\tXXXXXL = \"5xl\",\n}\n\nexport enum ETextWeight {\n\t/**\n\t * 300\n\t */\n\tLIGHT = \"light\",\n\t/**\n\t * 500\n\t */\n\tREGULAR = \"regular\",\n\t/**\n\t * 700\n\t */\n\tSEMI_BOLD = \"semi_bold\",\n\t/**\n\t * 900\n\t */\n\tBOLD = \"bold\",\n}\n\nexport enum ETextAlign {\n\tLEFT = \"left\",\n\tCENTER = \"center\",\n\tRIGHT = \"right\",\n}\n\nexport enum ETextTransform {\n\tLOWERCASE = \"lowercase\",\n\tUPPERCASE = \"uppercase\",\n\tCAPITALIZE = \"capitalize\",\n\tNONE = \"none\",\n}\n"],"names":["ETypographySizes","ETextWeight","ETextAlign","ETextTransform"],"mappings":"
|
|
1
|
+
{"version":3,"file":"_types.js","sources":["../../../src/components/UiTypography/_types.ts"],"sourcesContent":["export enum ETypographySizes {\n\t/**\n\t * 10px\n\t */\n\tXXS = \"xxs\",\n\t/**\n\t * 12px\n\t */\n\tXS = \"xs\",\n\t/**\n\t * 14px\n\t */\n\tSM = \"sm\",\n\t/**\n\t * 16px\n\t */\n\tMD = \"md\",\n\t/**\n\t * 18px\n\t */\n\tLG = \"lg\",\n\t/**\n\t * 20px\n\t */\n\tXL = \"xl\",\n\t/**\n\t * 24px\n\t */\n\tXXL = \"2xl\",\n\t/**\n\t * 28px\n\t */\n\tXXXL = \"3xl\",\n\t/**\n\t * 42px\n\t */\n\tXXXXL = \"4xl\",\n\t/**\n\t * 40px\n\t */\n\tXXXXXL = \"5xl\",\n}\n\nexport enum ETextWeight {\n\t/**\n\t * 300\n\t */\n\tLIGHT = \"light\",\n\t/**\n\t * 500\n\t */\n\tREGULAR = \"regular\",\n\t/**\n\t * 700\n\t */\n\tSEMI_BOLD = \"semi_bold\",\n\t/**\n\t * 900\n\t */\n\tBOLD = \"bold\",\n}\n\nexport enum ETextAlign {\n\tLEFT = \"left\",\n\tCENTER = \"center\",\n\tRIGHT = \"right\",\n}\n\nexport enum ETextTransform {\n\tLOWERCASE = \"lowercase\",\n\tUPPERCASE = \"uppercase\",\n\tCAPITALIZE = \"capitalize\",\n\tNONE = \"none\",\n}\n"],"names":["ETypographySizes","ETextWeight","ETextAlign","ETextTransform"],"mappings":"AAAO,IAAKA,sBAAAA,OAIXA,EAAA,MAAM,OAINA,EAAA,KAAK,MAILA,EAAA,KAAK,MAILA,EAAA,KAAK,MAILA,EAAA,KAAK,MAILA,EAAA,KAAK,MAILA,EAAA,MAAM,OAINA,EAAA,OAAO,OAIPA,EAAA,QAAQ,OAIRA,EAAA,SAAS,OAxCEA,IAAAA,KAAA,CAAA,CAAA,GA2CAC,sBAAAA,OAIXA,EAAA,QAAQ,SAIRA,EAAA,UAAU,WAIVA,EAAA,YAAY,aAIZA,EAAA,OAAO,QAhBIA,IAAAA,KAAA,CAAA,CAAA,GAmBAC,sBAAAA,OACXA,EAAA,OAAO,QACPA,EAAA,SAAS,UACTA,EAAA,QAAQ,SAHGA,IAAAA,KAAA,CAAA,CAAA,GAMAC,sBAAAA,OACXA,EAAA,YAAY,aACZA,EAAA,YAAY,aACZA,EAAA,aAAa,cACbA,EAAA,OAAO,QAJIA,IAAAA,KAAA,CAAA,CAAA;"}
|
package/helper.d.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "bonkers-ui",
|
|
3
|
-
"version": "v2.0.
|
|
3
|
+
"version": "v2.0.13",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Bonkers ui library",
|
|
6
6
|
"author": "cc6.magister@gmail.com",
|
|
@@ -18,38 +18,38 @@
|
|
|
18
18
|
"prepare": "husky"
|
|
19
19
|
},
|
|
20
20
|
"dependencies": {
|
|
21
|
-
"@tailwindcss/vite": "^4.1.
|
|
21
|
+
"@tailwindcss/vite": "^4.1.13",
|
|
22
22
|
"ajv": "^8.17.1",
|
|
23
23
|
"classnames": "^2.5.1",
|
|
24
24
|
"postcss": "^8.5.6",
|
|
25
25
|
"prettier": "^3.6.2",
|
|
26
26
|
"react": "^19.1.1",
|
|
27
27
|
"react-dom": "^19.1.1",
|
|
28
|
-
"tailwindcss": "^4.1.
|
|
28
|
+
"tailwindcss": "^4.1.13",
|
|
29
29
|
"vite-tsconfig-paths": "^5.1.4"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
|
-
"@chromatic-com/storybook": "^4.
|
|
33
|
-
"@storybook/addon-docs": "^9.
|
|
34
|
-
"@storybook/addon-onboarding": "^9.
|
|
35
|
-
"@storybook/react-vite": "^9.
|
|
36
|
-
"@stylistic/eslint-plugin": "^5.
|
|
32
|
+
"@chromatic-com/storybook": "^4.1.1",
|
|
33
|
+
"@storybook/addon-docs": "^9.1.8",
|
|
34
|
+
"@storybook/addon-onboarding": "^9.1.8",
|
|
35
|
+
"@storybook/react-vite": "^9.1.8",
|
|
36
|
+
"@stylistic/eslint-plugin": "^5.4.0",
|
|
37
37
|
"@types/bun": "latest",
|
|
38
|
-
"@types/react": "^19.1.
|
|
39
|
-
"@types/react-dom": "^19.1.
|
|
40
|
-
"@vitejs/plugin-react": "^
|
|
41
|
-
"eslint": "^9.
|
|
42
|
-
"eslint-plugin-better-tailwindcss": "^3.7.
|
|
38
|
+
"@types/react": "^19.1.13",
|
|
39
|
+
"@types/react-dom": "^19.1.9",
|
|
40
|
+
"@vitejs/plugin-react": "^5.0.3",
|
|
41
|
+
"eslint": "^9.36.0",
|
|
42
|
+
"eslint-plugin-better-tailwindcss": "^3.7.9",
|
|
43
43
|
"eslint-plugin-react": "^7.37.5",
|
|
44
|
-
"eslint-plugin-storybook": "^9.
|
|
44
|
+
"eslint-plugin-storybook": "^9.1.8",
|
|
45
45
|
"eslint-plugin-tailwindcss": "^3.18.2",
|
|
46
46
|
"gh-pages": "^6.3.0",
|
|
47
47
|
"husky": "^9.1.7",
|
|
48
|
-
"lint-staged": "^16.
|
|
49
|
-
"storybook": "^9.
|
|
50
|
-
"typescript": "^5.
|
|
51
|
-
"typescript-eslint": "^8.
|
|
52
|
-
"vite": "^7.
|
|
48
|
+
"lint-staged": "^16.2.0",
|
|
49
|
+
"storybook": "^9.1.8",
|
|
50
|
+
"typescript": "^5.9.2",
|
|
51
|
+
"typescript-eslint": "^8.44.1",
|
|
52
|
+
"vite": "^7.1.7",
|
|
53
53
|
"vite-plugin-dts": "^4.5.4",
|
|
54
54
|
"vite-plugin-lib-inject-css": "^2.2.2"
|
|
55
55
|
},
|
|
@@ -1,103 +0,0 @@
|
|
|
1
|
-
import { jsx as u } from "react/jsx-runtime";
|
|
2
|
-
import f, { createContext as z, useRef as g, useState as m, useEffect as U, useContext as j } from "react";
|
|
3
|
-
import A from "classnames";
|
|
4
|
-
import './assets/UiNavigationSteps.css';const D = "_navbar_3w204_1", O = "_active_3w204_18", R = {
|
|
5
|
-
navbar: D,
|
|
6
|
-
active: O
|
|
7
|
-
}, S = z(null), W = ({ initialStepId: o, children: w, className: h, complete: i = !1 }) => {
|
|
8
|
-
const l = g(0), [x, C] = m(0), [v, p] = m(/* @__PURE__ */ new Set()), n = g({
|
|
9
|
-
steps: /* @__PURE__ */ new Map(),
|
|
10
|
-
parentMap: /* @__PURE__ */ new Map()
|
|
11
|
-
}), E = (e, s) => {
|
|
12
|
-
n.current.steps.has(e) || (l.current += 1, n.current.steps.set(e, {
|
|
13
|
-
order: l.current,
|
|
14
|
-
hasSubsteps: s,
|
|
15
|
-
progress: s ? {
|
|
16
|
-
current: 0,
|
|
17
|
-
total: 0
|
|
18
|
-
} : void 0
|
|
19
|
-
}));
|
|
20
|
-
}, d = (e) => {
|
|
21
|
-
const { steps: s, parentMap: r } = n.current;
|
|
22
|
-
let t = null;
|
|
23
|
-
if (s.has(e))
|
|
24
|
-
t = s.get(e).order;
|
|
25
|
-
else if (r.has(e)) {
|
|
26
|
-
const a = r.get(e);
|
|
27
|
-
s.has(a) && (t = s.get(a).order);
|
|
28
|
-
}
|
|
29
|
-
t !== null && (t < x && N(t), P(t), C(t));
|
|
30
|
-
}, M = (e, s, r = []) => {
|
|
31
|
-
if (r.length > 0) {
|
|
32
|
-
r.forEach((c) => {
|
|
33
|
-
n.current.parentMap.set(c.id, e);
|
|
34
|
-
});
|
|
35
|
-
const t = r.findIndex((c) => c.id === s) + 1, a = r.length;
|
|
36
|
-
if (t > 0) {
|
|
37
|
-
const c = n.current.steps.get(e);
|
|
38
|
-
c && n.current.steps.set(e, {
|
|
39
|
-
...c,
|
|
40
|
-
progress: {
|
|
41
|
-
current: t,
|
|
42
|
-
total: a
|
|
43
|
-
}
|
|
44
|
-
});
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
}, N = (e) => {
|
|
48
|
-
p((s) => {
|
|
49
|
-
const r = new Set(s);
|
|
50
|
-
return n.current.steps.forEach((t, a) => {
|
|
51
|
-
t.order > e && r.delete(a);
|
|
52
|
-
}), r;
|
|
53
|
-
});
|
|
54
|
-
}, P = (e) => {
|
|
55
|
-
p(i ? new Set(n.current.steps.keys()) : (s) => {
|
|
56
|
-
const r = new Set(s);
|
|
57
|
-
return n.current.steps.forEach((t, a) => {
|
|
58
|
-
t.order < e ? r.add(a) : t.order === e && r.delete(a);
|
|
59
|
-
}), r;
|
|
60
|
-
});
|
|
61
|
-
};
|
|
62
|
-
U(() => {
|
|
63
|
-
const { steps: e, parentMap: s } = n.current;
|
|
64
|
-
if (e.size > 0) {
|
|
65
|
-
let r = o;
|
|
66
|
-
if (s.has(o)) {
|
|
67
|
-
const t = s.get(o);
|
|
68
|
-
t && e.has(t) && (r = t);
|
|
69
|
-
}
|
|
70
|
-
p(i ? new Set(e.keys()) : /* @__PURE__ */ new Set()), e.has(r) && d(r);
|
|
71
|
-
}
|
|
72
|
-
}, [o, i]);
|
|
73
|
-
const _ = {
|
|
74
|
-
currentStepId: o,
|
|
75
|
-
registerStep: E,
|
|
76
|
-
navigateToStep: d,
|
|
77
|
-
updateSubstepProgress: M,
|
|
78
|
-
completedSteps: v
|
|
79
|
-
}, b = (e) => e === o || n.current.parentMap.get(o) === e, k = (e) => v.has(e), y = f.Children.map(w, (e, s) => {
|
|
80
|
-
if (f.isValidElement(e)) {
|
|
81
|
-
const r = n.current.steps.get(e.props.id), t = n.current.steps.size;
|
|
82
|
-
return f.cloneElement(e, {
|
|
83
|
-
order: r?.order || s + 1,
|
|
84
|
-
totalSteps: t,
|
|
85
|
-
isActive: b(e.props.id),
|
|
86
|
-
isComplete: k(e.props.id)
|
|
87
|
-
});
|
|
88
|
-
}
|
|
89
|
-
return e;
|
|
90
|
-
});
|
|
91
|
-
return /* @__PURE__ */ u(S.Provider, { value: _, children: /* @__PURE__ */ u("nav", { "aria-label": "Progress", className: A("relative grid grid-cols-1 grid-rows-1 items-center", R.navbar, h), children: /* @__PURE__ */ u("div", { className: "z-10 flex items-center justify-between", children: y }) }) });
|
|
92
|
-
}, B = () => {
|
|
93
|
-
const o = j(S);
|
|
94
|
-
if (!o)
|
|
95
|
-
throw new Error("useStepNav must be used within a UiNavigationStepsProvider");
|
|
96
|
-
return o;
|
|
97
|
-
};
|
|
98
|
-
export {
|
|
99
|
-
W as U,
|
|
100
|
-
R as s,
|
|
101
|
-
B as u
|
|
102
|
-
};
|
|
103
|
-
//# sourceMappingURL=UiNavigationSteps-N3juxg3H.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"UiNavigationSteps-N3juxg3H.js","sources":["../src/components/UiNavigationSteps/UiNavigationSteps.tsx"],"sourcesContent":["import React, {\n\tcreateContext,\n\tuseContext,\n\tuseState,\n\tuseRef,\n\tuseEffect,\n} from \"react\";\nimport { type INavStepProps, type INavigationStepContext, type INavSubStep } from \"./_types\";\nimport cx from \"classnames\";\nimport styles from \"./UiNavigationSteps.module.css\";\n\nconst NavigationStepContext = createContext<INavigationStepContext | null>(null);\n\ninterface INavigationStepData {\n\torder: number;\n\thasSubsteps: boolean;\n\tprogress?: {\n\t\tcurrent: number;\n\t\ttotal: number;\n\t};\n}\n\ninterface INavigationProviderState {\n\tsteps: Map<string, INavigationStepData>;\n\tparentMap: Map<string, string>;\n}\n\nexport const UiNavigationSteps: React.FC<{\n\tinitialStepId: string;\n\tchildren: React.ReactNode;\n\tclassName?: string;\n\tcomplete?: boolean\n}> = ({ initialStepId, children, className, complete = false }) => {\n\tconst orderCounter = useRef(0);\n\tconst [currentStepOrder, setCurrentStepOrder] = useState<number>(0);\n\tconst [completedSteps, setCompletedSteps] = useState<Set<string>>(new Set());\n\n\tconst navigationState = useRef<INavigationProviderState>({\n\t\tsteps: new Map(),\n\t\tparentMap: new Map(),\n\t});\n\n\tconst registerStep = (id: string, hasSubsteps: boolean) => {\n\t\tif (!navigationState.current.steps.has(id)) {\n\t\t\torderCounter.current += 1;\n\t\t\tnavigationState.current.steps.set(id, {\n\t\t\t\torder: orderCounter.current,\n\t\t\t\thasSubsteps,\n\t\t\t\tprogress: hasSubsteps\n\t\t\t\t\t? {\n\t\t\t\t\t\tcurrent: 0,\n\t\t\t\t\t\ttotal: 0\n\t\t\t\t\t}\n\t\t\t\t\t: undefined\n\t\t\t});\n\t\t}\n\t};\n\n\tconst navigateToStep = (id: string) => {\n\t\tconst { steps, parentMap } = navigationState.current;\n\t\tlet targetOrder: number | null = null;\n\n\t\tif (steps.has(id)) {\n\t\t\ttargetOrder = steps.get(id)!.order;\n\t\t} else if (parentMap.has(id)) {\n\t\t\tconst parentId = parentMap.get(id)!;\n\t\t\tif (steps.has(parentId)) {\n\t\t\t\ttargetOrder = steps.get(parentId)!.order;\n\t\t\t}\n\t\t}\n\n\t\tif (targetOrder !== null) {\n\t\t\tif (targetOrder < currentStepOrder) {\n\t\t\t\tmarkSubsequentStepsIncomplete(targetOrder);\n\t\t\t}\n\t\t\tmarkPreviousStepsComplete(targetOrder);\n\t\t\tsetCurrentStepOrder(targetOrder);\n\t\t}\n\t};\n\n\tconst updateSubstepProgress = (stepId: string, substepId: string, subSteps: INavSubStep[] = []) => {\n\t\tif (subSteps.length > 0) {\n\t\t\tsubSteps.forEach(sub => {\n\t\t\t\tnavigationState.current.parentMap.set(sub.id, stepId);\n\t\t\t});\n\n\t\t\tconst current = subSteps.findIndex(sub => sub.id === substepId) + 1;\n\t\t\tconst total = subSteps.length;\n\n\t\t\tif (current > 0) {\n\t\t\t\tconst stepData = navigationState.current.steps.get(stepId);\n\t\t\t\tif (stepData) {\n\t\t\t\t\tnavigationState.current.steps.set(stepId, {\n\t\t\t\t\t\t...stepData,\n\t\t\t\t\t\tprogress: {\n\t\t\t\t\t\t\tcurrent,\n\t\t\t\t\t\t\ttotal\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n\n\tconst markSubsequentStepsIncomplete = (targetOrder: number) => {\n\t\tsetCompletedSteps(prev => {\n\t\t\tconst newSet = new Set(prev);\n\t\t\tnavigationState.current.steps.forEach((data, id) => {\n\t\t\t\tif (data.order > targetOrder) {\n\t\t\t\t\tnewSet.delete(id);\n\t\t\t\t}\n\t\t\t});\n\t\t\treturn newSet;\n\t\t});\n\t};\n\n\tconst markPreviousStepsComplete = (targetOrder: number) => {\n\t\tif (!complete) {\n\t\t\tsetCompletedSteps(prev => {\n\t\t\t\tconst newSet = new Set(prev);\n\t\t\t\tnavigationState.current.steps.forEach((data, id) => {\n\t\t\t\t\tif (data.order < targetOrder) {\n\t\t\t\t\t\tnewSet.add(id);\n\t\t\t\t\t} else if (data.order === targetOrder) {\n\t\t\t\t\t\tnewSet.delete(id);\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t\treturn newSet;\n\t\t\t});\n\t\t} else {\n\t\t\tsetCompletedSteps(new Set(navigationState.current.steps.keys()));\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tconst { steps, parentMap } = navigationState.current;\n\n\t\tif (steps.size > 0) {\n\t\t\tlet targetStepId = initialStepId;\n\n\t\t\tif (parentMap.has(initialStepId)) {\n\t\t\t\tconst parentId = parentMap.get(initialStepId);\n\t\t\t\tif (parentId && steps.has(parentId)) {\n\t\t\t\t\ttargetStepId = parentId;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif (complete) {\n\t\t\t\tsetCompletedSteps(new Set(steps.keys()));\n\t\t\t} else {\n\t\t\t\tsetCompletedSteps(new Set());\n\t\t\t}\n\n\t\t\tif (steps.has(targetStepId)) {\n\t\t\t\tnavigateToStep(targetStepId);\n\t\t\t}\n\t\t}\n\t}, [initialStepId, complete]);\n\n\tconst contextValue: INavigationStepContext = {\n\t\tcurrentStepId: initialStepId,\n\t\tregisterStep,\n\t\tnavigateToStep,\n\t\tupdateSubstepProgress,\n\t\tcompletedSteps,\n\t};\n\n\tconst isStepActive = (id: string) => {\n\t\treturn id === initialStepId\n\t\t\t|| navigationState.current.parentMap.get(initialStepId) === id;\n\t};\n\n\tconst isStepComplete = (id: string) => {\n\t\treturn completedSteps.has(id);\n\t};\n\n\tconst childWithProps = React.Children.map(children, (child, index) => {\n\t\tif (React.isValidElement<INavStepProps>(child)) {\n\t\t\tconst stepData = navigationState.current.steps.get(child.props.id);\n\t\t\tconst totalSteps = navigationState.current.steps.size;\n\n\t\t\treturn React.cloneElement(child, {\n\t\t\t\torder: stepData?.order || index + 1,\n\t\t\t\ttotalSteps,\n\t\t\t\tisActive: isStepActive(child.props.id),\n\t\t\t\tisComplete: isStepComplete(child.props.id),\n\t\t\t});\n\t\t}\n\t\treturn child;\n\t});\n\n\treturn (\n\t\t<NavigationStepContext.Provider value={ contextValue }>\n\t\t\t<nav aria-label=\"Progress\" className={ cx(\"relative grid grid-cols-1 grid-rows-1 items-center\", styles.navbar, className) }>\n\t\t\t\t<div className=\"z-10 flex items-center justify-between\">\n\t\t\t\t\t{ childWithProps }\n\t\t\t\t</div>\n\t\t\t</nav>\n\t\t</NavigationStepContext.Provider>\n\t);\n};\n\nexport const useStepNav = () => {\n\tconst context = useContext(NavigationStepContext);\n\tif (!context) {\n\t\tthrow new Error(\"useStepNav must be used within a UiNavigationStepsProvider\");\n\t}\n\treturn context;\n};\n"],"names":["NavigationStepContext","createContext","UiNavigationSteps","initialStepId","children","className","complete","orderCounter","useRef","currentStepOrder","setCurrentStepOrder","useState","completedSteps","setCompletedSteps","navigationState","registerStep","id","hasSubsteps","navigateToStep","steps","parentMap","targetOrder","parentId","markSubsequentStepsIncomplete","markPreviousStepsComplete","updateSubstepProgress","stepId","substepId","subSteps","sub","current","total","stepData","prev","newSet","data","useEffect","targetStepId","contextValue","isStepActive","isStepComplete","childWithProps","React","child","index","totalSteps","jsx","cx","styles","useStepNav","context","useContext"],"mappings":"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"}
|