@youngonesworks/ui 0.1.78 → 0.1.81

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.cjs +243 -150
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +143 -49
  4. package/dist/index.js.map +1 -1
  5. package/package.json +2 -1
package/dist/index.cjs CHANGED
@@ -26,33 +26,39 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
26
26
  //#endregion
27
27
  const react = __toESM(require("react"));
28
28
  const __tabler_icons_react = __toESM(require("@tabler/icons-react"));
29
- const __utils_cn = __toESM(require("@utils/cn"));
29
+ const clsx = __toESM(require("clsx"));
30
+ const tailwind_merge = __toESM(require("tailwind-merge"));
30
31
  const react_jsx_runtime = __toESM(require("react/jsx-runtime"));
31
32
  const react_tooltip = __toESM(require("react-tooltip"));
32
- const __utils_enums = __toESM(require("@utils/enums"));
33
- const __utils_formatIcon = __toESM(require("@utils/formatIcon"));
34
- const clsx = __toESM(require("clsx"));
35
33
  const react_day_picker = __toESM(require("react-day-picker"));
36
34
  const date_fns = __toESM(require("date-fns"));
37
35
  const date_fns_locale = __toESM(require("date-fns/locale"));
38
36
  const __floating_ui_react = __toESM(require("@floating-ui/react"));
39
37
  const react_dom = __toESM(require("react-dom"));
40
38
  const react_phone_input_2 = __toESM(require("react-phone-input-2"));
41
- const __components_label = __toESM(require("@components/label"));
42
39
  const react_select = __toESM(require("react-select"));
43
- const __components_button_buttonVariants = __toESM(require("@components/button/buttonVariants"));
44
- const __components_unstyledButton = __toESM(require("@components/unstyledButton"));
45
40
  const __tiptap_extension_placeholder = __toESM(require("@tiptap/extension-placeholder"));
46
41
  const __tiptap_extension_underline = __toESM(require("@tiptap/extension-underline"));
47
42
  const __tiptap_react = __toESM(require("@tiptap/react"));
48
43
  const __tiptap_starter_kit = __toESM(require("@tiptap/starter-kit"));
49
- const __utils_ssr = __toESM(require("@utils/ssr"));
50
44
 
45
+ //#region src/jsx-runtime-shim.ts
46
+ const jsx = react.createElement;
47
+ const jsxs = react.createElement;
48
+ const Fragment$1 = react.Fragment;
49
+
50
+ //#endregion
51
+ //#region src/utils/cn.ts
52
+ function cn(...inputs) {
53
+ return (0, tailwind_merge.twMerge)((0, clsx.default)(inputs));
54
+ }
55
+
56
+ //#endregion
51
57
  //#region src/components/unstyledButton/index.tsx
52
58
  const UnstyledButton = (0, react.forwardRef)(({ className,...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
53
59
  type: "button",
54
60
  "data-component": "unstyledButton",
55
- className: (0, __utils_cn.cn)("appearance-none", className),
61
+ className: cn("appearance-none", className),
56
62
  ref,
57
63
  ...props
58
64
  }));
@@ -67,7 +73,7 @@ const AccordionItem = ({ controlContent, panelContent, style = "light", border =
67
73
  }, [active]);
68
74
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
69
75
  "data-testid": "accordion-item",
70
- className: (0, __utils_cn.cn)("rounded-md hover:bg-gray-50", {
76
+ className: cn("rounded-md hover:bg-gray-50", {
71
77
  "bg-light-blue hover:bg-light-blue/50": style === "dark",
72
78
  "rounded-none border-b border-gray-200": border,
73
79
  "bg-ultra-light-blue border border-gray-200 hover:bg-transparent": style === "onboarding",
@@ -75,7 +81,7 @@ const AccordionItem = ({ controlContent, panelContent, style = "light", border =
75
81
  "hover:bg-ultra-light-blue cursor-not-allowed opacity-50": disabled
76
82
  }, className),
77
83
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(UnstyledButton, {
78
- className: (0, __utils_cn.cn)("relative flex w-full flex-row items-center justify-between gap-2 px-4 py-3", { "flex-row-reverse": chevronPosition === "right" }),
84
+ className: cn("relative flex w-full flex-row items-center justify-between gap-2 px-4 py-3", { "flex-row-reverse": chevronPosition === "right" }),
79
85
  onClick: () => setIsActive(!isActive),
80
86
  disabled,
81
87
  children: [
@@ -106,18 +112,92 @@ const AccordionItem = ({ controlContent, panelContent, style = "light", border =
106
112
  const AccordionWrapper = ({ children, className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
107
113
  "data-testid": "accordion-wrapper",
108
114
  "data-component": "accordionWrapper",
109
- className: (0, __utils_cn.cn)(className, "flex flex-col gap-2"),
115
+ className: cn(className, "flex flex-col gap-2"),
110
116
  children
111
117
  });
112
118
 
119
+ //#endregion
120
+ //#region src/utils/enums.ts
121
+ let ACTION_ICON_STYLE_VARIANT = /* @__PURE__ */ function(ACTION_ICON_STYLE_VARIANT$1) {
122
+ ACTION_ICON_STYLE_VARIANT$1["DEFAULT"] = "default";
123
+ ACTION_ICON_STYLE_VARIANT$1["TRANSPARENT"] = "transparent";
124
+ ACTION_ICON_STYLE_VARIANT$1["SMALL"] = "small";
125
+ ACTION_ICON_STYLE_VARIANT$1["ROUND"] = "round";
126
+ return ACTION_ICON_STYLE_VARIANT$1;
127
+ }({});
128
+ let THEME_ICON_STYLE_VARIANT = /* @__PURE__ */ function(THEME_ICON_STYLE_VARIANT$1) {
129
+ THEME_ICON_STYLE_VARIANT$1["PINK_WITH_BACKGROUND"] = "pink-with-background";
130
+ return THEME_ICON_STYLE_VARIANT$1;
131
+ }({});
132
+ let COLOR = /* @__PURE__ */ function(COLOR$1) {
133
+ COLOR$1["PRIMARY"] = "primary";
134
+ COLOR$1["BLACK"] = "black";
135
+ COLOR$1["NAVY_BLUE"] = "navy-blue";
136
+ COLOR$1["LIGHT_BLUE"] = "light-blue";
137
+ COLOR$1["LIGHT_BLUE_DISABLED"] = "light-blue-disabled";
138
+ COLOR$1["GREEN"] = "green";
139
+ COLOR$1["GREEN_LIGHT"] = "green-light";
140
+ COLOR$1["PINK"] = "pink";
141
+ COLOR$1["PINK_LIGHT"] = "pink-light";
142
+ COLOR$1["ORANGE"] = "orange";
143
+ COLOR$1["ORANGE_LIGHT"] = "orange-light";
144
+ COLOR$1["ACCENT_BLUE"] = "accent-blue";
145
+ COLOR$1["ACCENT_BLUE_LIGHT"] = "accent-blue-light";
146
+ COLOR$1["YELLOW"] = "yellow";
147
+ COLOR$1["CHECK"] = "check";
148
+ COLOR$1["WARNING"] = "warning";
149
+ COLOR$1["ERROR"] = "error";
150
+ COLOR$1["SUCCESS"] = "success";
151
+ COLOR$1["WARNING_LIGHT"] = "warning-light";
152
+ COLOR$1["ULTRA_LIGHT_BLUE"] = "ultra-light-blue";
153
+ COLOR$1["ULTRA_LIGHT_GRAY"] = "ultra-light-gray";
154
+ COLOR$1["TURQUOISE"] = "turquoise";
155
+ COLOR$1["RED"] = "red";
156
+ COLOR$1["GRAY"] = "gray";
157
+ COLOR$1["WHITE"] = "white";
158
+ COLOR$1["PURPLE"] = "purple";
159
+ COLOR$1["PURPLE_LIGHT"] = "purple-light";
160
+ COLOR$1["NAVY_BLUE_SHADES"] = "navy-blue-shades";
161
+ return COLOR$1;
162
+ }({});
163
+ let REGION = /* @__PURE__ */ function(REGION$1) {
164
+ REGION$1["NETHERLANDS"] = "nl";
165
+ REGION$1["BELGIUM"] = "nl-BE";
166
+ REGION$1["UNITED_KINGDOM"] = "gb";
167
+ return REGION$1;
168
+ }({});
169
+ let TOOLTIP_COLOR = /* @__PURE__ */ function(TOOLTIP_COLOR$1) {
170
+ TOOLTIP_COLOR$1["DEFAULT"] = "default";
171
+ TOOLTIP_COLOR$1["WHITE"] = "white";
172
+ return TOOLTIP_COLOR$1;
173
+ }({});
174
+
175
+ //#endregion
176
+ //#region src/utils/formatIcon.ts
177
+ const globalDefaultFormatAttributes = {};
178
+ /**
179
+ * Format icon with default attributes. Icon attributes will
180
+ * always supersede default attributes which in term will supersede
181
+ * global default attributes.
182
+ */
183
+ function formatIcon(icon, defaultFormatAttributes) {
184
+ if (!react.default.isValidElement(icon)) return icon;
185
+ return (0, react.cloneElement)(icon, {
186
+ ...globalDefaultFormatAttributes,
187
+ ...defaultFormatAttributes,
188
+ ...icon.props,
189
+ ...{ className: (0, clsx.default)(globalDefaultFormatAttributes.className, defaultFormatAttributes.className, icon.props.className) }
190
+ });
191
+ }
192
+
113
193
  //#endregion
114
194
  //#region src/components/actionIcon/index.tsx
115
195
  const ActionIcon = (0, react.forwardRef)(({ title, disabled = false, styleVariant = "default", icon, type = "button", "data-testid": testId, iconSize = 20, strokeWidth = 1, onClick, className,...props }, ref) => {
116
196
  const variantClassNames = (0, clsx.default)({
117
- "active:translate-y-[1px] content-center flex items-center justify-center rounded-[4px] border border-gray-200 hover:border-black text-black child:p-10 w-[36px] h-[36px] disabled:text-gray-500": styleVariant === __utils_enums.ACTION_ICON_STYLE_VARIANT.DEFAULT,
118
- "active:translate-y-[1px] border-none content-center flex items-center justify-center rounded-[4px] border text-black child:p-10 w-[36px] h-[36px] disabled:text-gray-500": styleVariant === __utils_enums.ACTION_ICON_STYLE_VARIANT.TRANSPARENT,
119
- "active:translate-y-[1px] content-center flex items-center justify-center rounded-[4px] child:p-10 w-[37px] h-[37px] text-black rounded-full bg-primary hover:bg-turquoise-700 disabled:turquoise-50 disabled:text-gray-800": styleVariant === __utils_enums.ACTION_ICON_STYLE_VARIANT.ROUND,
120
- "w-7 h-7 active:translate-y-[1px] content-center flex items-center justify-center rounded-[4px] border border-gray-200 hover:border-black text-black hover:bg-gray-50 disabled:text-gray-500": styleVariant === __utils_enums.ACTION_ICON_STYLE_VARIANT.SMALL
197
+ "active:translate-y-[1px] content-center flex items-center justify-center rounded-[4px] border border-gray-200 hover:border-black text-black child:p-10 w-[36px] h-[36px] disabled:text-gray-500": styleVariant === ACTION_ICON_STYLE_VARIANT.DEFAULT,
198
+ "active:translate-y-[1px] border-none content-center flex items-center justify-center rounded-[4px] border text-black child:p-10 w-[36px] h-[36px] disabled:text-gray-500": styleVariant === ACTION_ICON_STYLE_VARIANT.TRANSPARENT,
199
+ "active:translate-y-[1px] content-center flex items-center justify-center rounded-[4px] child:p-10 w-[37px] h-[37px] text-black rounded-full bg-primary hover:bg-turquoise-700 disabled:turquoise-50 disabled:text-gray-800": styleVariant === ACTION_ICON_STYLE_VARIANT.ROUND,
200
+ "w-7 h-7 active:translate-y-[1px] content-center flex items-center justify-center rounded-[4px] border border-gray-200 hover:border-black text-black hover:bg-gray-50 disabled:text-gray-500": styleVariant === ACTION_ICON_STYLE_VARIANT.SMALL
121
201
  });
122
202
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
123
203
  title,
@@ -125,13 +205,13 @@ const ActionIcon = (0, react.forwardRef)(({ title, disabled = false, styleVarian
125
205
  disabled,
126
206
  "data-testid": testId,
127
207
  "data-component": "ActionIcon",
128
- className: (0, __utils_cn.cn)(variantClassNames, { "hover:bg-transparant cursor-not-allowed hover:border-gray-200": disabled }, className),
208
+ className: cn(variantClassNames, { "hover:bg-transparant cursor-not-allowed hover:border-gray-200": disabled }, className),
129
209
  onClick,
130
210
  ref,
131
211
  "data-tooltip-id": title,
132
212
  "data-tooltip-content": title,
133
213
  ...props,
134
- children: icon ? (0, __utils_formatIcon.default)(icon, {
214
+ children: icon ? formatIcon(icon, {
135
215
  stroke: strokeWidth,
136
216
  size: iconSize
137
217
  }) : props.children
@@ -172,10 +252,10 @@ const Alert = ({ show, message, type, plain = false, className }) => {
172
252
  }, [show]);
173
253
  if (!showAlert) return null;
174
254
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
175
- className: (0, __utils_cn.cn)(`flex w-full justify-between gap-3 rounded border border-solid p-5 md:items-center md:gap-12 ${plain ? "border-none py-4 text-sm font-medium" : ""}`, {
176
- "border-warning bg-warning-light text-warning": type === __utils_enums.COLOR.WARNING,
177
- "border-red-500 bg-red-50 text-red-500": type === __utils_enums.COLOR.ERROR,
178
- "border-green bg-green-light text-green": type === __utils_enums.COLOR.SUCCESS
255
+ className: cn(`flex w-full justify-between gap-3 rounded border border-solid p-5 md:items-center md:gap-12 ${plain ? "border-none py-4 text-sm font-medium" : ""}`, {
256
+ "border-warning bg-warning-light text-warning": type === COLOR.WARNING,
257
+ "border-red-500 bg-red-50 text-red-500": type === COLOR.ERROR,
258
+ "border-green bg-green-light text-green": type === COLOR.SUCCESS
179
259
  }, className),
180
260
  "data-component": "Alert",
181
261
  "data-testid": "alert",
@@ -453,9 +533,9 @@ const TextInput = react.default.forwardRef(({ rightSection, leftSection, classNa
453
533
  step,
454
534
  maxLength,
455
535
  className: (0, clsx.default)(`${loadingState ? "cursor-not-allowed" : ""}`, `${disabled ? "text-gray-500" : "text-gray-900"} selection:bg-turquoise-200 focus:border-turquoise-500 focus:ring-turquoise-500 active:border-turquoise-500 active:ring-turquoise-500 h-10 w-full rounded-[4px] border border-gray-200 bg-gray-50 px-3 text-sm font-normal outline-hidden ${rightSection && "pr-12"} ${leftSection && "pl-12"} ${error && "border-red-500 text-red-500 selection:bg-red-200 focus:border-red-500 focus:ring-red-500 focus:placeholder:text-red-500 active:border-red-500 active:ring-red-500"}`, className),
456
- "aria-busy": loadingState || void 0,
457
- "data-lpignore": enablePasswordManagerAutofill ? void 0 : "true",
458
- "data-1p-ignore": enablePasswordManagerAutofill ? void 0 : "true",
536
+ "aria-busy": loadingState || undefined,
537
+ "data-lpignore": enablePasswordManagerAutofill ? undefined : "true",
538
+ "data-1p-ignore": enablePasswordManagerAutofill ? undefined : "true",
459
539
  ref,
460
540
  ...props,
461
541
  type: password ? showPassword ? "text" : "password" : "text"
@@ -532,7 +612,7 @@ const Avatar = ({ src, alt = "", size = 50, radius = 100, "data-testid": dataTes
532
612
  "data-testid": dataTestId,
533
613
  children: src && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
534
614
  src,
535
- className: (0, __utils_cn.cn)("aspect-square appearance-none object-cover", radiusFormatter[radius]),
615
+ className: cn("aspect-square appearance-none object-cover", radiusFormatter[radius]),
536
616
  alt,
537
617
  width: size,
538
618
  height: size,
@@ -544,7 +624,7 @@ Avatar.displayName = "Avatar";
544
624
  //#endregion
545
625
  //#region src/components/avatarIndicator/index.tsx
546
626
  const AvatarIndicator = ({ indicatorCount, className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
547
- className: (0, __utils_cn.cn)("inline-flex h-5 min-w-5 flex-col items-center justify-center gap-2.5 rounded border-2 border-solid border-white bg-blue-950 px-1.5", className),
627
+ className: cn("inline-flex h-5 min-w-5 flex-col items-center justify-center gap-2.5 rounded border-2 border-solid border-white bg-blue-950 px-1.5", className),
548
628
  "data-component": "AvatarIndicator",
549
629
  "data-testid": "AvatarIndicator",
550
630
  children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -555,30 +635,30 @@ const AvatarIndicator = ({ indicatorCount, className }) => /* @__PURE__ */ (0, r
555
635
 
556
636
  //#endregion
557
637
  //#region src/components/badge/index.tsx
558
- const Badge = ({ styleVariant = __utils_enums.COLOR.ACCENT_BLUE, className, favorite, mobile = false, badgeBorder = false, fullWidth = false, leftSection, rightSection, children,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
638
+ const Badge = ({ styleVariant = COLOR.ACCENT_BLUE, className, favorite, mobile = false, badgeBorder = false, fullWidth = false, leftSection, rightSection, children,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
559
639
  "data-testid": "badge",
560
640
  "data-component": "Badge",
561
641
  className: (0, clsx.default)("inline-flex h-[1.375rem] max-w-full place-content-center items-center p-[10px] align-middle text-xs leading-[20px] font-medium tracking-wide text-wrap whitespace-normal normal-case", mobile ? "rounded-s" : "rounded-[2rem]", fullWidth && "w-full", badgeBorder && {
562
- "border-accent-blue": styleVariant === __utils_enums.COLOR.ACCENT_BLUE,
563
- "border-green-light": styleVariant === __utils_enums.COLOR.GREEN_LIGHT,
564
- "border-red-500": styleVariant === __utils_enums.COLOR.RED,
565
- "border-purple": styleVariant === __utils_enums.COLOR.PURPLE,
566
- "border-warning": styleVariant === __utils_enums.COLOR.WARNING,
567
- "border-black": styleVariant === __utils_enums.COLOR.BLACK,
568
- "border-gray-800": styleVariant === __utils_enums.COLOR.GRAY,
569
- "border-pink": styleVariant === __utils_enums.COLOR.PINK_LIGHT || styleVariant === __utils_enums.COLOR.PINK,
570
- "border-gray-200 bg-white text-black": styleVariant === __utils_enums.COLOR.WHITE
642
+ "border-accent-blue": styleVariant === COLOR.ACCENT_BLUE,
643
+ "border-green-light": styleVariant === COLOR.GREEN_LIGHT,
644
+ "border-red-500": styleVariant === COLOR.RED,
645
+ "border-purple": styleVariant === COLOR.PURPLE,
646
+ "border-warning": styleVariant === COLOR.WARNING,
647
+ "border-black": styleVariant === COLOR.BLACK,
648
+ "border-gray-800": styleVariant === COLOR.GRAY,
649
+ "border-pink": styleVariant === COLOR.PINK_LIGHT || styleVariant === COLOR.PINK,
650
+ "border-gray-200 bg-white text-black": styleVariant === COLOR.WHITE
571
651
  }, {
572
- "bg-accent-blue-light text-accent-blue": styleVariant === __utils_enums.COLOR.ACCENT_BLUE,
573
- "bg-green-light text-green": styleVariant === __utils_enums.COLOR.GREEN_LIGHT,
574
- "bg-red-50 text-red-500": styleVariant === __utils_enums.COLOR.RED,
575
- "bg-purple-light text-purple": styleVariant === __utils_enums.COLOR.PURPLE,
576
- "bg-warning-light text-warning": styleVariant === __utils_enums.COLOR.WARNING,
577
- "bg-gray-50 text-black": styleVariant === __utils_enums.COLOR.BLACK,
578
- "bg-gray-50 text-gray-800": styleVariant === __utils_enums.COLOR.GRAY,
579
- "bg-pink-light text-pink": styleVariant === __utils_enums.COLOR.PINK_LIGHT,
580
- "bg-pink text-white": styleVariant === __utils_enums.COLOR.PINK,
581
- "bg-white text-black": styleVariant === __utils_enums.COLOR.WHITE
652
+ "bg-accent-blue-light text-accent-blue": styleVariant === COLOR.ACCENT_BLUE,
653
+ "bg-green-light text-green": styleVariant === COLOR.GREEN_LIGHT,
654
+ "bg-red-50 text-red-500": styleVariant === COLOR.RED,
655
+ "bg-purple-light text-purple": styleVariant === COLOR.PURPLE,
656
+ "bg-warning-light text-warning": styleVariant === COLOR.WARNING,
657
+ "bg-gray-50 text-black": styleVariant === COLOR.BLACK,
658
+ "bg-gray-50 text-gray-800": styleVariant === COLOR.GRAY,
659
+ "bg-pink-light text-pink": styleVariant === COLOR.PINK_LIGHT,
660
+ "bg-pink text-white": styleVariant === COLOR.PINK,
661
+ "bg-white text-black": styleVariant === COLOR.WHITE
582
662
  }, className),
583
663
  ...props,
584
664
  children: [
@@ -588,7 +668,7 @@ const Badge = ({ styleVariant = __utils_enums.COLOR.ACCENT_BLUE, className, favo
588
668
  }),
589
669
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
590
670
  "data-testid": "badge-content",
591
- className: (0, __utils_cn.cn)("block h-5 overflow-hidden text-ellipsis whitespace-nowrap", { "flex items-center": favorite }),
671
+ className: cn("block h-5 overflow-hidden text-ellipsis whitespace-nowrap", { "flex items-center": favorite }),
592
672
  children
593
673
  }),
594
674
  rightSection && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
@@ -601,18 +681,18 @@ Badge.displayName = "Badge";
601
681
 
602
682
  //#endregion
603
683
  //#region src/components/bigBadge/index.tsx
604
- const BigBadge = ({ styleVariant = __utils_enums.COLOR.GREEN, className, children,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
684
+ const BigBadge = ({ styleVariant = COLOR.GREEN, className, children,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
605
685
  "data-component": "BigBadge",
606
686
  "data-testid": "big-badge",
607
- className: (0, __utils_cn.cn)("grid h-9 max-w-full min-w-[140px] place-content-center rounded-full border border-solid px-6 py-1 text-sm font-medium whitespace-nowrap lowercase", {
608
- "border-green text-green bg-white": styleVariant === __utils_enums.COLOR.GREEN,
609
- "border-accent-blue text-accent-blue bg-white": styleVariant === __utils_enums.COLOR.ACCENT_BLUE,
610
- "border-orange text-orange bg-white": styleVariant === __utils_enums.COLOR.ORANGE,
611
- "group-hover:bg-green-light": styleVariant === __utils_enums.COLOR.GREEN,
612
- "border-red-500 bg-white text-red-500": styleVariant === __utils_enums.COLOR.RED,
613
- "group-hover:bg-red-50": styleVariant === __utils_enums.COLOR.RED,
614
- "border-gray-200 bg-white text-black": styleVariant === __utils_enums.COLOR.WHITE,
615
- "": styleVariant === __utils_enums.COLOR.WHITE
687
+ className: cn("grid h-9 max-w-full min-w-[140px] place-content-center rounded-full border border-solid px-6 py-1 text-sm font-medium whitespace-nowrap lowercase", {
688
+ "border-green text-green bg-white": styleVariant === COLOR.GREEN,
689
+ "border-accent-blue text-accent-blue bg-white": styleVariant === COLOR.ACCENT_BLUE,
690
+ "border-orange text-orange bg-white": styleVariant === COLOR.ORANGE,
691
+ "group-hover:bg-green-light": styleVariant === COLOR.GREEN,
692
+ "border-red-500 bg-white text-red-500": styleVariant === COLOR.RED,
693
+ "group-hover:bg-red-50": styleVariant === COLOR.RED,
694
+ "border-gray-200 bg-white text-black": styleVariant === COLOR.WHITE,
695
+ "": styleVariant === COLOR.WHITE
616
696
  }, className),
617
697
  ...props,
618
698
  children
@@ -649,7 +729,7 @@ const buttonVariants = {
649
729
  function Button({ type = "button", variant = "primary", ariaLabel, block = false, isLoading = false, icon: iconFromProps = null, iconRight = false, onClick, className, children, dataTestId,...props }) {
650
730
  const loadingIcon = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconLoading, { className: "animate-spin-slow mr-2 stroke-current" });
651
731
  const icon = isLoading ? loadingIcon : iconFromProps;
652
- const formattedIcon = icon ? (0, __utils_formatIcon.default)(icon, { className: (0, clsx.default)({
732
+ const formattedIcon = icon ? formatIcon(icon, { className: (0, clsx.default)({
653
733
  "-mr-2": iconRight,
654
734
  "-ml-2": !iconRight
655
735
  }, icon === loadingIcon ? "text-current" : "size-[1.125rem]") }) : null;
@@ -660,7 +740,7 @@ function Button({ type = "button", variant = "primary", ariaLabel, block = false
660
740
  type,
661
741
  "aria-label": ariaLabel,
662
742
  "data-testid": dataTestId,
663
- className: (0, __utils_cn.cn)(buttonVariants[variant], className, block && "w-full text-sm"),
743
+ className: cn(buttonVariants[variant], className, block && "w-full text-sm"),
664
744
  onClick: handleOnClick,
665
745
  ...props,
666
746
  children: [
@@ -676,12 +756,12 @@ Button.displayName = "Button";
676
756
  //#region src/components/checkbox/index.tsx
677
757
  const CheckboxComponent = ({ size = "md", className, error, mediumBoldText, label, labelClassName, indeterminate = false, disabled = false,...props }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
678
758
  "data-testid": "checkbox-wrapper",
679
- className: (0, __utils_cn.cn)("relative grid gap-2", className),
759
+ className: cn("relative grid gap-2", className),
680
760
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
681
- className: (0, __utils_cn.cn)("flex cursor-pointer items-center gap-3", labelClassName),
761
+ className: cn("flex cursor-pointer items-center gap-3", labelClassName),
682
762
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
683
763
  "data-testid": `checkbox-container-${size}`,
684
- className: (0, __utils_cn.cn)("relative grid shrink-0 place-content-center", size === "sm" ? "size-4" : "size-5"),
764
+ className: cn("relative grid shrink-0 place-content-center", size === "sm" ? "size-4" : "size-5"),
685
765
  children: [
686
766
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
687
767
  className: "checked:border-light-blue checked:bg-light-blue [&:not([disabled])]:checked:border-light-blue [&:not([disabled])]:checked:bg-light-blue peer absolute inset-0 shrink-0 appearance-none rounded-xs border border-gray-800 bg-white focus:outline-hidden disabled:border-gray-300 disabled:bg-gray-100 disabled:[&[checked]]:border-gray-100",
@@ -693,7 +773,7 @@ const CheckboxComponent = ({ size = "md", className, error, mediumBoldText, labe
693
773
  }),
694
774
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
695
775
  "data-testid": "checkbox-checkmark",
696
- className: (0, __utils_cn.cn)("pointer-events-none absolute top-1/2 left-1/2 hidden -translate-x-1/2 -translate-y-1/2 stroke-white outline-hidden peer-checked:block", { "stroke-gray-300": disabled }, size === "sm" ? "size-3" : "size-4"),
776
+ className: cn("pointer-events-none absolute top-1/2 left-1/2 hidden -translate-x-1/2 -translate-y-1/2 stroke-white outline-hidden peer-checked:block", { "stroke-gray-300": disabled }, size === "sm" ? "size-3" : "size-4"),
697
777
  xmlns: "http://www.w3.org/2000/svg",
698
778
  viewBox: "0 0 24 24",
699
779
  fill: "none",
@@ -705,7 +785,7 @@ const CheckboxComponent = ({ size = "md", className, error, mediumBoldText, labe
705
785
  }),
706
786
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
707
787
  "data-testid": "checkbox-indeterminate",
708
- className: (0, __utils_cn.cn)("pointer-events-none absolute left-1/2 hidden -translate-x-1/2 -translate-y-1/2 stroke-black outline-hidden", { "stroke-gray-300": disabled }, size === "sm" ? "top-[60%] size-3" : "top-1/2 size-4", { block: indeterminate }),
788
+ className: cn("pointer-events-none absolute left-1/2 hidden -translate-x-1/2 -translate-y-1/2 stroke-black outline-hidden", { "stroke-gray-300": disabled }, size === "sm" ? "top-[60%] size-3" : "top-1/2 size-4", { block: indeterminate }),
709
789
  xmlns: "http://www.w3.org/2000/svg",
710
790
  viewBox: "0 0 24 24",
711
791
  fill: "none",
@@ -723,7 +803,7 @@ const CheckboxComponent = ({ size = "md", className, error, mediumBoldText, labe
723
803
  ]
724
804
  }), label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
725
805
  "data-testid": "checkbox-label",
726
- className: (0, __utils_cn.cn)("grow text-sm font-normal", labelClassName, { "font-medium": mediumBoldText }),
806
+ className: cn("grow text-sm font-normal", labelClassName, { "font-medium": mediumBoldText }),
727
807
  children: label
728
808
  })]
729
809
  }), error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("small", {
@@ -774,7 +854,7 @@ const Popover = (0, react.forwardRef)(({ content, children, hoverEnabled = false
774
854
  togglePopover: () => setIsOpen((prev) => !prev)
775
855
  }));
776
856
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
777
- className: (0, __utils_cn.cn)("", { "[&>div]:border-navyBlue": isOpen }, className),
857
+ className: cn("", { "[&>div]:border-navyBlue": isOpen }, className),
778
858
  children: [(0, react.isValidElement)(children) && (0, react.cloneElement)(children, getReferenceProps({
779
859
  ref: refs.setReference,
780
860
  ...children.props,
@@ -813,7 +893,7 @@ const Popover = (0, react.forwardRef)(({ content, children, hoverEnabled = false
813
893
  //#region src/components/datePickerInput/index.tsx
814
894
  const DatePickerInput = ({ lang, todayText, value, disabledFrom, disabledUntil, className, error, onChange, placeholder, label, disabled, minimalDropdownYears = 4 }) => {
815
895
  const [selected, setSelected] = (0, react.useState)(value);
816
- const today = /* @__PURE__ */ new Date();
896
+ const today = new Date();
817
897
  const [newMonth, setNewMonth] = (0, react.useState)(selected || today);
818
898
  const [dropdownOpened, setDropdownOpened] = (0, react.useState)({
819
899
  month: false,
@@ -894,7 +974,7 @@ const DatePickerInput = ({ lang, todayText, value, disabledFrom, disabledUntil,
894
974
  captionLayout: "dropdown",
895
975
  onMonthChange: (newMonth$1) => setNewMonth(newMonth$1),
896
976
  showOutsideDays: true,
897
- disabled: disabledFrom ? { before: disabledFrom } : disabledUntil ? { after: disabledUntil } : void 0,
977
+ disabled: disabledFrom ? { before: disabledFrom } : disabledUntil ? { after: disabledUntil } : undefined,
898
978
  className,
899
979
  classNames: {
900
980
  month_grid: "mt-3 max-w-[400px] border-t border-gray-100",
@@ -932,7 +1012,7 @@ const DatePickerInput = ({ lang, todayText, value, disabledFrom, disabledUntil,
932
1012
  Dropdown: (props) => {
933
1013
  const { goToMonth, months } = (0, react_day_picker.useDayPicker)();
934
1014
  const { className: dropdownClassName } = props;
935
- const today$1 = /* @__PURE__ */ new Date();
1015
+ const today$1 = new Date();
936
1016
  /* istanbul ignore next - react-day-picker may not pass this className in our test env */
937
1017
  if (dropdownClassName === "rdp-months_dropdown") {
938
1018
  const selectedYear = newMonth.getFullYear();
@@ -980,8 +1060,8 @@ const DatePickerInput = ({ lang, todayText, value, disabledFrom, disabledUntil,
980
1060
  children: todayText
981
1061
  })] });
982
1062
  } else if (dropdownClassName === "rdp-years_dropdown") {
983
- const earliestYear = (/* @__PURE__ */ new Date()).getFullYear() - minimalDropdownYears;
984
- const latestYear = (/* @__PURE__ */ new Date()).getFullYear() + 1;
1063
+ const earliestYear = new Date().getFullYear() - minimalDropdownYears;
1064
+ const latestYear = new Date().getFullYear() + 1;
985
1065
  /* istanbul ignore else - defensive guard will always be truthy */
986
1066
  if (earliestYear && latestYear) {
987
1067
  const years = Array.from({ length: latestYear - earliestYear + 1 }, (_, i) => earliestYear + i).reverse();
@@ -1000,7 +1080,7 @@ const DatePickerInput = ({ lang, todayText, value, disabledFrom, disabledUntil,
1000
1080
  className: "shadow-dropdown absolute z-70 rounded-md border border-gray-50 bg-white max-h-64 overflow-y-auto",
1001
1081
  children: years.map((year) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
1002
1082
  onClick: () => {
1003
- const newDate = months?.[0].date || /* @__PURE__ */ new Date();
1083
+ const newDate = months?.[0].date || new Date();
1004
1084
  newDate.setFullYear(year);
1005
1085
  goToMonth(newDate);
1006
1086
  setDropdownOpened({
@@ -1023,7 +1103,7 @@ const DatePickerInput = ({ lang, todayText, value, disabledFrom, disabledUntil,
1023
1103
  placement: "bottom-start",
1024
1104
  children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
1025
1105
  "data-component": "datePickerInput",
1026
- className: (0, __utils_cn.cn)("relative", className),
1106
+ className: cn("relative", className),
1027
1107
  children: [
1028
1108
  label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
1029
1109
  className: "mb-2 flex items-center gap-1 text-xs font-medium",
@@ -1033,7 +1113,7 @@ const DatePickerInput = ({ lang, todayText, value, disabledFrom, disabledUntil,
1033
1113
  variant: "outline",
1034
1114
  type: "button",
1035
1115
  disabled,
1036
- className: (0, __utils_cn.cn)(
1116
+ className: cn(
1037
1117
  "flex h-10 w-full items-center justify-start bg-gray-50 px-3 text-black",
1038
1118
  /* istanbul ignore next - cosmetic class toggle */
1039
1119
  { "border-red-500 text-red-500": error }
@@ -1045,11 +1125,11 @@ const DatePickerInput = ({ lang, todayText, value, disabledFrom, disabledUntil,
1045
1125
  className: "text-sm font-normal text-nowrap text-black",
1046
1126
  children: selected ? selected.toLocaleDateString() : placeholder
1047
1127
  }),
1048
- selected !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
1128
+ selected !== undefined && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
1049
1129
  className: "cursor-pointer text-sm font-normal text-gray-800",
1050
1130
  onClick: () => {
1051
- setSelected(void 0);
1052
- onChange?.(void 0);
1131
+ setSelected(undefined);
1132
+ onChange?.(undefined);
1053
1133
  },
1054
1134
  children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__tabler_icons_react.IconX, { size: 15 })
1055
1135
  }) })
@@ -1112,7 +1192,7 @@ const FilterButton = ({ onClick, hasFilters, reset, filtersText, resetText }) =>
1112
1192
  //#endregion
1113
1193
  //#region src/components/filters/FilterItem.tsx
1114
1194
  const FilterItem = ({ title, isActive = false, onClick }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
1115
- className: (0, __utils_cn.cn)("has-checked:border-primary has-checked:bg-turquoise-100 flex cursor-pointer items-center gap-3 rounded-full border border-gray-200 px-7 py-1.5 text-sm leading-6 font-normal transition-all duration-300 ease-in-out hover:bg-gray-50"),
1195
+ className: cn("has-checked:border-primary has-checked:bg-turquoise-100 flex cursor-pointer items-center gap-3 rounded-full border border-gray-200 px-7 py-1.5 text-sm leading-6 font-normal transition-all duration-300 ease-in-out hover:bg-gray-50"),
1116
1196
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
1117
1197
  type: "checkbox",
1118
1198
  className: "hidden",
@@ -1156,7 +1236,7 @@ const Filters = ({ filters, setFilters, selectedFilters, selectedFiltersText, fi
1156
1236
  ref: content,
1157
1237
  "data-testid": "filters-items-container",
1158
1238
  "data-visible": showFilters,
1159
- className: (0, __utils_cn.cn)("flex flex-wrap justify-end gap-2 overflow-hidden opacity-0 ease-in-out [transition:max-height_0.4s,opacity_0.3s]", showFilters && "opacity-100"),
1239
+ className: cn("flex flex-wrap justify-end gap-2 overflow-hidden opacity-0 ease-in-out [transition:max-height_0.4s,opacity_0.3s]", showFilters && "opacity-100"),
1160
1240
  style: { maxHeight: showFilters ? `${content?.current?.scrollHeight}px` : "0px" },
1161
1241
  children: filters.map((filter) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FilterItem, {
1162
1242
  title: filter,
@@ -1362,7 +1442,7 @@ const GoogleAppButtonIcon = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsx
1362
1442
  //#endregion
1363
1443
  //#region src/components/hamburgerMenuButton/index.tsx
1364
1444
  const HamburgerMenuButton = (0, react.forwardRef)(({ menuState, setMenuState }, ref) => {
1365
- const defaultClasses = (0, __utils_cn.cn)("absolute h-[2px] bg-white duration-150");
1445
+ const defaultClasses = cn("absolute h-[2px] bg-white duration-150");
1366
1446
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(UnstyledButton, {
1367
1447
  onClick: setMenuState,
1368
1448
  className: "relative h-4 w-6",
@@ -1373,15 +1453,15 @@ const HamburgerMenuButton = (0, react.forwardRef)(({ menuState, setMenuState },
1373
1453
  children: [
1374
1454
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
1375
1455
  "data-testid": "hamburger-line-top",
1376
- className: (0, __utils_cn.cn)(defaultClasses, "top-0 left-0 w-6", { "translation top-1/2 translate-y-[-50%] rotate-45 transform duration-150 ease-in": menuState })
1456
+ className: cn(defaultClasses, "top-0 left-0 w-6", { "translation top-1/2 translate-y-[-50%] rotate-45 transform duration-150 ease-in": menuState })
1377
1457
  }),
1378
1458
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
1379
1459
  "data-testid": "hamburger-line-middle",
1380
- className: (0, __utils_cn.cn)(defaultClasses, "top-1/2 right-0 w-4 translate-y-[-50%]", { "translation opacity-0 ease-in": menuState })
1460
+ className: cn(defaultClasses, "top-1/2 right-0 w-4 translate-y-[-50%]", { "translation opacity-0 ease-in": menuState })
1381
1461
  }),
1382
1462
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
1383
1463
  "data-testid": "hamburger-line-bottom",
1384
- className: (0, __utils_cn.cn)(defaultClasses, "bottom-0 left-0 w-6", { "translation top-1/2 translate-y-[-50%] -rotate-45 transform duration-150 ease-in": menuState })
1464
+ className: cn(defaultClasses, "bottom-0 left-0 w-6", { "translation top-1/2 translate-y-[-50%] -rotate-45 transform duration-150 ease-in": menuState })
1385
1465
  })
1386
1466
  ]
1387
1467
  });
@@ -1401,7 +1481,7 @@ HR.displayName = "HR";
1401
1481
  const Island = ({ children, className, noShadow = false, noPadding = false,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
1402
1482
  "data-testid": "island",
1403
1483
  "data-component": "island",
1404
- className: (0, __utils_cn.cn)("relative bg-white px-5 py-5 md:px-10 md:py-9", {
1484
+ className: cn("relative bg-white px-5 py-5 md:px-10 md:py-9", {
1405
1485
  "shadow-[0_-0.5rem_2rem_rgba(38,41,92,0.04)]": !noShadow,
1406
1486
  "drop-shadow-none": noShadow,
1407
1487
  "md:px-0 md:py-0": noPadding
@@ -1416,7 +1496,7 @@ Island.displayName = "Island";
1416
1496
  const Label = ({ children, className,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
1417
1497
  "data-component": "label",
1418
1498
  "data-testid": "label",
1419
- className: (0, __utils_cn.cn)("flex items-center gap-1 text-xs font-medium text-black", className),
1499
+ className: cn("flex items-center gap-1 text-xs font-medium text-black", className),
1420
1500
  ...props,
1421
1501
  children
1422
1502
  });
@@ -1556,7 +1636,7 @@ const Modal = ({ title, children, withCloseButton = true, opened, additionalClas
1556
1636
  ]);
1557
1637
  if (!isOpen) return null;
1558
1638
  return (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
1559
- className: (0, __utils_cn.cn)("fixed top-0 left-0 z-999 grid h-full w-full items-center overflow-y-scroll overscroll-contain px-4 py-10 md:py-20"),
1639
+ className: cn("fixed top-0 left-0 z-999 grid h-full w-full items-center overflow-y-scroll overscroll-contain px-4 py-10 md:py-20"),
1560
1640
  "data-testid": dataTestId,
1561
1641
  "data-component": "modal",
1562
1642
  ref: refContainer,
@@ -1566,7 +1646,7 @@ const Modal = ({ title, children, withCloseButton = true, opened, additionalClas
1566
1646
  }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
1567
1647
  className: "relative flex w-full justify-center",
1568
1648
  children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
1569
- className: (0, __utils_cn.cn)("relative h-full w-full max-w-[1000px] bg-white px-5 py-8 shadow-xl md:px-10 md:py-10", additionalClassNames, size),
1649
+ className: cn("relative h-full w-full max-w-[1000px] bg-white px-5 py-8 shadow-xl md:px-10 md:py-10", additionalClassNames, size),
1570
1650
  ref,
1571
1651
  role: "dialog",
1572
1652
  tabIndex: -1,
@@ -1716,6 +1796,10 @@ const PasswordInput = react.default.forwardRef((props, ref) => /* @__PURE__ */ (
1716
1796
  }));
1717
1797
  PasswordInput.displayName = "PasswordInput";
1718
1798
 
1799
+ //#endregion
1800
+ //#region node_modules/react-phone-input-2/lib/style.css
1801
+ var style_default = {};
1802
+
1719
1803
  //#endregion
1720
1804
  //#region src/components/phoneNumberInput/index.tsx
1721
1805
  const PhoneNumberInput = ({ setValue, setPhoneNumberExt, phoneNumberExt, isValid = true, phoneNumberError, phoneNumberExtensionError, phoneNumberField, phoneNumberExtField, className, label, disabled }) => {
@@ -1731,11 +1815,13 @@ const PhoneNumberInput = ({ setValue, setPhoneNumberExt, phoneNumberExt, isValid
1731
1815
  shouldDirty: true,
1732
1816
  shouldValidate: true
1733
1817
  });
1734
- if (setPhoneNumberExt) setPhoneNumberExt({
1735
- number: numberWithoutDialCode,
1736
- ext: dialCode,
1737
- countryCode: country.countryCode || ""
1738
- });
1818
+ if (setPhoneNumberExt) {
1819
+ setPhoneNumberExt({
1820
+ number: numberWithoutDialCode,
1821
+ ext: dialCode,
1822
+ countryCode: country.countryCode || ""
1823
+ });
1824
+ }
1739
1825
  }, [
1740
1826
  setValue,
1741
1827
  phoneNumberField,
@@ -1745,7 +1831,7 @@ const PhoneNumberInput = ({ setValue, setPhoneNumberExt, phoneNumberExt, isValid
1745
1831
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
1746
1832
  className: `${className}`,
1747
1833
  children: [
1748
- typeof label === "string" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__components_label.Label, {
1834
+ typeof label === "string" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Label, {
1749
1835
  htmlFor: "phoneNumber",
1750
1836
  className: "mb-2",
1751
1837
  children: label
@@ -1791,7 +1877,7 @@ const ProgressBar = ({ value, maxValue = 100, className }) => {
1791
1877
  else setWidth(value / maxValue * 100);
1792
1878
  }, [value, maxValue]);
1793
1879
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
1794
- className: (0, __utils_cn.cn)("h-2 rounded-lg bg-gray-100", className),
1880
+ className: cn("h-2 rounded-lg bg-gray-100", className),
1795
1881
  role: "progressbar",
1796
1882
  "aria-valuenow": value,
1797
1883
  "aria-valuemin": 0,
@@ -1816,7 +1902,7 @@ const RadioButton = ({ id, name, value, label, onChange, checked, dataTestId, cl
1816
1902
  id,
1817
1903
  name,
1818
1904
  value,
1819
- onChange: props.disabled ? void 0 : onChange,
1905
+ onChange: props.disabled ? undefined : onChange,
1820
1906
  checked,
1821
1907
  "data-testid": dataTestId,
1822
1908
  className: `${(0, clsx.default)(className, "ease checked:border-navyBlue checked:bg-navy-blue relative m-0 flex size-5 cursor-pointer appearance-none items-center justify-center rounded-full border border-gray-400 bg-white transition-colors duration-100 focus:ring-0 focus:outline-hidden focus-visible:ring-0", { "cursor-not-allowed opacity-50": props.disabled })}`,
@@ -1936,12 +2022,12 @@ const Rating = ({ rating, ratings, size = "normal", setReview, className, setRev
1936
2022
  const StarSmallIcon = ({ index, className: className$1 }) => {
1937
2023
  const displayRating = currentSmallRating;
1938
2024
  const roundedRating = Math.round(displayRating * 2) / 2;
1939
- if (index === roundedRating) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconStarFilled, { className: (0, __utils_cn.cn)(className$1, "text-yellow") });
1940
- if (index - roundedRating === .5) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconStarHalfFilled, { className: (0, __utils_cn.cn)(className$1, "text-yellow") });
1941
- return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconStarEmpty, { className: (0, __utils_cn.cn)(className$1, "text-yellow") });
2025
+ if (index === roundedRating) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconStarFilled, { className: cn(className$1, "text-yellow") });
2026
+ if (index - roundedRating === .5) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconStarHalfFilled, { className: cn(className$1, "text-yellow") });
2027
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconStarEmpty, { className: cn(className$1, "text-yellow") });
1942
2028
  };
1943
2029
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
1944
- className: (0, __utils_cn.cn)("flex flex-col", className),
2030
+ className: cn("flex flex-col", className),
1945
2031
  children: [
1946
2032
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
1947
2033
  "data-testid": "rating-container",
@@ -1949,7 +2035,7 @@ const Rating = ({ rating, ratings, size = "normal", setReview, className, setRev
1949
2035
  className: "flex flex-row gap-[2px]",
1950
2036
  children: [...ratings.map(({ value }) => value).sort((a, b) => a - b)].map((value) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
1951
2037
  "data-testid": `star-item-${value}`,
1952
- className: (0, __utils_cn.cn)("relative", setReview && "cursor-pointer"),
2038
+ className: cn("relative", setReview && "cursor-pointer"),
1953
2039
  onClick: () => handleStarClick(value),
1954
2040
  onMouseEnter: () => handleHover(value),
1955
2041
  onMouseLeave: () => handleHover(Number(reviewIsSet)),
@@ -2244,7 +2330,7 @@ const Select = (0, react.forwardRef)(({ options, placeholder, defaultValue, labe
2244
2330
  className: (0, clsx.default)("m-0 grid gap-2 p-0", width ? width : fullWidth && "w-full", className),
2245
2331
  children: [
2246
2332
  label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Label, {
2247
- className: (0, __utils_cn.cn)("leading-4", labelClassNames),
2333
+ className: cn("leading-4", labelClassNames),
2248
2334
  children: label
2249
2335
  }),
2250
2336
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_select.default, {
@@ -2318,7 +2404,7 @@ const SettingsCard = ({ icon, title, link, ManageText, LinkComponent }) => /* @_
2318
2404
  const Skeleton = ({ className, "data-testid": dataTestId }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
2319
2405
  "data-component": "genericSkeleton",
2320
2406
  "data-testid": dataTestId || "skeleton",
2321
- className: (0, __utils_cn.cn)("inline-block rounded-md", "animate-pulse bg-gray-100/50", className)
2407
+ className: cn("inline-block rounded-md", "animate-pulse bg-gray-100/50", className)
2322
2408
  });
2323
2409
 
2324
2410
  //#endregion
@@ -2396,7 +2482,7 @@ const Stepper = ({ steps, setStep = () => {}, variant = "default", clickableStep
2396
2482
  /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
2397
2483
  "data-testid": `stepper-step-circle-${index}`,
2398
2484
  onClick: () => isClickable && setStep(index),
2399
- className: (0, __utils_cn.cn)("relative z-10 flex size-8 items-center justify-center rounded-full border border-gray-500 bg-white text-gray-500", {
2485
+ className: cn("relative z-10 flex size-8 items-center justify-center rounded-full border border-gray-500 bg-white text-gray-500", {
2400
2486
  "size-5": variant === "small" || isMobile,
2401
2487
  "cursor-pointer": isClickable,
2402
2488
  "cursor-not-allowed": clickableSteps && !clickableSteps.includes(index),
@@ -2444,7 +2530,7 @@ const StickyMobileButtonWrapper = ({ children }) => /* @__PURE__ */ (0, react_js
2444
2530
  const Table = ({ children, className,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
2445
2531
  "data-testid": "table",
2446
2532
  "data-component": "table",
2447
- className: (0, __utils_cn.cn)("table w-full table-fixed border-collapse overflow-auto", className),
2533
+ className: cn("table w-full table-fixed border-collapse overflow-auto", className),
2448
2534
  ...props,
2449
2535
  children
2450
2536
  });
@@ -2454,7 +2540,7 @@ const Table = ({ children, className,...props }) => /* @__PURE__ */ (0, react_js
2454
2540
  const TableCell = ({ children, smallPadding, className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
2455
2541
  "data-testid": "tableCell",
2456
2542
  "data-component": "tableCell",
2457
- className: `${(0, __utils_cn.cn)("table-cell py-2 align-middle text-sm font-normal first:pl-2 last:pr-2 md:py-0 md:xl:first:pl-10 md:xl:last:pr-10", { "md:xl:first:pl-5 md:xl:last:pr-5": smallPadding }, className)}`,
2543
+ className: `${cn("table-cell py-2 align-middle text-sm font-normal first:pl-2 last:pr-2 md:py-0 md:xl:first:pl-10 md:xl:last:pr-10", { "md:xl:first:pl-5 md:xl:last:pr-5": smallPadding }, className)}`,
2458
2544
  children
2459
2545
  });
2460
2546
 
@@ -2472,7 +2558,7 @@ const TableHeader = ({ children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)
2472
2558
  const TableHeaderItem = ({ children, smallPadding, className,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
2473
2559
  "data-testid": "tableHeaderItem",
2474
2560
  "data-component": "tableHeaderItem",
2475
- className: (0, __utils_cn.cn)("hidden h-10 align-middle text-xs font-medium first:pl-10 last:pr-10 xl:table-cell", { "xl:first:pl-5 xl:last:pr-5": smallPadding }, className),
2561
+ className: cn("hidden h-10 align-middle text-xs font-medium first:pl-10 last:pr-10 xl:table-cell", { "xl:first:pl-5 xl:last:pr-5": smallPadding }, className),
2476
2562
  ...props,
2477
2563
  children
2478
2564
  });
@@ -2493,7 +2579,7 @@ function TableRow({ children, className, header,...props }) {
2493
2579
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
2494
2580
  "data-testid": "tableRow",
2495
2581
  "data-component": "tableRow",
2496
- className: `${(0, __utils_cn.cn)("table-row border-x-0 border-y-0 border-t border-solid border-gray-200 xl:border-t xl:border-solid xl:border-gray-200", "hover:bg-ultra-light-blue", header && "font-medium", className)}`,
2582
+ className: `${cn("table-row border-x-0 border-y-0 border-t border-solid border-gray-200 xl:border-t xl:border-solid xl:border-gray-200", "hover:bg-ultra-light-blue", header && "font-medium", className)}`,
2497
2583
  ...props,
2498
2584
  children
2499
2585
  });
@@ -2584,7 +2670,7 @@ const TabContent = (0, react.forwardRef)(({ tab, setActiveTab, activeTab }, ref)
2584
2670
  setActiveTab,
2585
2671
  activeTab: activeTab === tab.value,
2586
2672
  tabContent: tab.name,
2587
- rightSection: tab?.rightSection || void 0,
2673
+ rightSection: tab?.rightSection || undefined,
2588
2674
  clickFnc: () => {
2589
2675
  tab.clickFnc(tab.value);
2590
2676
  setActiveTab(tab.value);
@@ -2605,7 +2691,7 @@ const Textarea = (0, react.forwardRef)(({ className, label, error, rows = 8,...p
2605
2691
  "data-component": "TextArea",
2606
2692
  rows,
2607
2693
  ref,
2608
- className: (0, __utils_cn.cn)("disabled:bg-grey-100 bg-ultra-light-gray w-full rounded border border-gray-200 p-3 text-sm font-normal text-black placeholder:text-gray-800 focus:ring-0 focus:outline-hidden disabled:cursor-not-allowed disabled:border-gray-300", { "border-red-500 text-red-500 selection:bg-red-200 focus:border-red-500 focus:ring-red-500 focus:placeholder:text-red-500 active:border-red-500 active:ring-red-500": !!error }, className),
2694
+ className: cn("disabled:bg-grey-100 bg-ultra-light-gray w-full rounded border border-gray-200 p-3 text-sm font-normal text-black placeholder:text-gray-800 focus:ring-0 focus:outline-hidden disabled:cursor-not-allowed disabled:border-gray-300", { "border-red-500 text-red-500 selection:bg-red-200 focus:border-red-500 focus:ring-red-500 focus:placeholder:text-red-500 active:border-red-500 active:ring-red-500": !!error }, className),
2609
2695
  ...props
2610
2696
  }),
2611
2697
  error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("small", {
@@ -2618,16 +2704,16 @@ const Textarea = (0, react.forwardRef)(({ className, label, error, rows = 8,...p
2618
2704
  //#endregion
2619
2705
  //#region src/components/themeIcon/index.tsx
2620
2706
  function ThemeIcon({ styleVariant = "black", className, icon, adjustedSize, title,...props }) {
2621
- const classNames = (0, __utils_cn.cn)("bg-transparent h-9 w-9 rounded-[5px] grid place-content-center", {
2622
- "text-black": styleVariant === __utils_enums.COLOR.BLACK,
2623
- "text-gray-500": styleVariant === __utils_enums.COLOR.GRAY,
2624
- "text-pink": styleVariant === __utils_enums.COLOR.PINK,
2625
- "bg-gray-50 text-pink": styleVariant === __utils_enums.THEME_ICON_STYLE_VARIANT.PINK_WITH_BACKGROUND,
2626
- "text-primary": styleVariant === __utils_enums.COLOR.TURQUOISE,
2627
- "text-accent-blue": styleVariant === __utils_enums.COLOR.ACCENT_BLUE,
2628
- "text-check": styleVariant === __utils_enums.COLOR.CHECK,
2629
- "text-warning": styleVariant === __utils_enums.COLOR.WARNING,
2630
- "text-red-500": styleVariant === __utils_enums.COLOR.ERROR
2707
+ const classNames = cn("bg-transparent h-9 w-9 rounded-[5px] grid place-content-center", {
2708
+ "text-black": styleVariant === COLOR.BLACK,
2709
+ "text-gray-500": styleVariant === COLOR.GRAY,
2710
+ "text-pink": styleVariant === COLOR.PINK,
2711
+ "bg-gray-50 text-pink": styleVariant === THEME_ICON_STYLE_VARIANT.PINK_WITH_BACKGROUND,
2712
+ "text-primary": styleVariant === COLOR.TURQUOISE,
2713
+ "text-accent-blue": styleVariant === COLOR.ACCENT_BLUE,
2714
+ "text-check": styleVariant === COLOR.CHECK,
2715
+ "text-warning": styleVariant === COLOR.WARNING,
2716
+ "text-red-500": styleVariant === COLOR.ERROR
2631
2717
  }, className);
2632
2718
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
2633
2719
  "data-testid": "theme-icon",
@@ -2636,7 +2722,7 @@ function ThemeIcon({ styleVariant = "black", className, icon, adjustedSize, titl
2636
2722
  "data-component": "ThemeIcon",
2637
2723
  className: classNames,
2638
2724
  ...props,
2639
- children: (0, __utils_formatIcon.default)(icon, {
2725
+ children: formatIcon(icon, {
2640
2726
  strokeWidth: "1",
2641
2727
  size: adjustedSize ? adjustedSize : 20
2642
2728
  })
@@ -2814,7 +2900,7 @@ const TruncatedText = ({ text, limit = 20 }) => {
2814
2900
  //#endregion
2815
2901
  //#region src/components/unorderedList/index.tsx
2816
2902
  const UnorderedList = ({ children, className, actionItem,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("ul", {
2817
- className: (0, __utils_cn.cn)("m-0 last:border-none", className),
2903
+ className: cn("m-0 last:border-none", className),
2818
2904
  "data-component": "unorderedList",
2819
2905
  "data-testid": "unorderedList",
2820
2906
  ...props,
@@ -2829,7 +2915,7 @@ const UnorderedList = ({ children, className, actionItem,...props }) => /* @__PU
2829
2915
  const UnorderedListItem = ({ children, actionItem, className, header = false,...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
2830
2916
  ...props,
2831
2917
  "data-component": "unorderedListItem",
2832
- className: (0, __utils_cn.cn)("grid min-h-[74px] list-none items-center border-b border-solid border-b-gray-200 py-5 text-sm font-normal last:border-none md:flex md:py-4 md:pr-10 md:pl-10", header ? "md:items-end" : "hover:bg-ultra-light-blue", { "grid-cols-2": actionItem }, className),
2918
+ className: cn("grid min-h-[74px] list-none items-center border-b border-solid border-b-gray-200 py-5 text-sm font-normal last:border-none md:flex md:py-4 md:pr-10 md:pl-10", header ? "md:items-end" : "hover:bg-ultra-light-blue", { "grid-cols-2": actionItem }, className),
2833
2919
  children: [children, actionItem && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
2834
2920
  className: "flex justify-end gap-2 md:absolute md:right-8 md:items-center",
2835
2921
  children: actionItem
@@ -2850,23 +2936,26 @@ const ProfileMenu = ({ title, metaTitle, icon, content, disabled = false, classN
2850
2936
  const buttonId = `${menuId}-button`;
2851
2937
  const defaultStyling = "text-black flex items-center gap-1 bg-transparent py-1 px-2.5 h-9 min-w-9 cursor-pointer border-gray-200 focus:bg-gray-50 focus:ring focus:ring-primary focus:outline-none focus:border-0 focus:ring-inset";
2852
2938
  const handleToggle = () => {
2853
- if (!disabled) setIsOpen((prev) => {
2854
- const newIsOpen = !prev;
2855
- /* istanbul ignore next - branch depends on async DOM focus */
2856
- if (newIsOpen) setTimeout(() => {
2857
- /* istanbul ignore next - async focus behavior depends on DOM/timing */
2858
- setFocusedIndex(0);
2859
- /* istanbul ignore next - async focus behavior depends on DOM/timing */
2860
- menuItemRefs.current[0]?.focus();
2861
- }, 0);
2862
- else {
2863
- /* istanbul ignore next - focus reset depends on DOM/timing */
2864
- setFocusedIndex(-1);
2865
- /* istanbul ignore next - focus reset depends on DOM/timing */
2866
- buttonRef.current?.focus();
2867
- }
2868
- return newIsOpen;
2869
- });
2939
+ if (!disabled) {
2940
+ setIsOpen((prev) => {
2941
+ const newIsOpen = !prev;
2942
+ /* istanbul ignore next - branch depends on async DOM focus */
2943
+ if (newIsOpen) {
2944
+ setTimeout(() => {
2945
+ /* istanbul ignore next - async focus behavior depends on DOM/timing */
2946
+ setFocusedIndex(0);
2947
+ /* istanbul ignore next - async focus behavior depends on DOM/timing */
2948
+ menuItemRefs.current[0]?.focus();
2949
+ }, 0);
2950
+ } else {
2951
+ /* istanbul ignore next - focus reset depends on DOM/timing */
2952
+ setFocusedIndex(-1);
2953
+ /* istanbul ignore next - focus reset depends on DOM/timing */
2954
+ buttonRef.current?.focus();
2955
+ }
2956
+ return newIsOpen;
2957
+ });
2958
+ }
2870
2959
  };
2871
2960
  /* istanbul ignore next - click handler behavior covered via integration; unit env flaky */
2872
2961
  const handleItemClick = (onClick) => {
@@ -2936,20 +3025,20 @@ const ProfileMenu = ({ title, metaTitle, icon, content, disabled = false, classN
2936
3025
  };
2937
3026
  }, [handleKeyDown]);
2938
3027
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
2939
- className: (0, __utils_cn.cn)("relative", classNames?.root),
3028
+ className: cn("relative", classNames?.root),
2940
3029
  "data-component": "ProfileMenu",
2941
3030
  "data-testid": "profile-menu",
2942
3031
  ref: menuRef,
2943
3032
  "data-context-menu-id": metaTitle,
2944
3033
  "data-context-menu-content": metaTitle,
2945
- children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__components_unstyledButton.UnstyledButton, {
3034
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(UnstyledButton, {
2946
3035
  ref: buttonRef,
2947
3036
  id: buttonId,
2948
3037
  "aria-label": "Toggle profile menu",
2949
3038
  "aria-expanded": isOpen,
2950
3039
  "aria-haspopup": "menu",
2951
- "aria-controls": isOpen ? menuId : void 0,
2952
- className: (0, __utils_cn.cn)(__components_button_buttonVariants.buttonVariants["secondary"], defaultStyling, classNames?.button),
3040
+ "aria-controls": isOpen ? menuId : undefined,
3041
+ className: cn(buttonVariants["secondary"], defaultStyling, classNames?.button),
2953
3042
  disabled,
2954
3043
  onClick: handleToggle,
2955
3044
  children: [title && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
@@ -2960,17 +3049,17 @@ const ProfileMenu = ({ title, metaTitle, icon, content, disabled = false, classN
2960
3049
  id: menuId,
2961
3050
  role: "menu",
2962
3051
  "aria-labelledby": buttonId,
2963
- className: (0, __utils_cn.cn)("absolute right-0 z-10 mt-2 w-auto min-w-[200px] rounded-md border-[0.0625rem] border-gray-200 bg-white p-1 shadow-md", classNames?.menu),
3052
+ className: cn("absolute right-0 z-10 mt-2 w-auto min-w-[200px] rounded-md border-[0.0625rem] border-gray-200 bg-white p-1 shadow-md", classNames?.menu),
2964
3053
  children: content.map(
2965
3054
  /* istanbul ignore next - render callback not meaningful for unit coverage */
2966
- (c, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__components_unstyledButton.UnstyledButton, {
3055
+ (c, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UnstyledButton, {
2967
3056
  ref: (el) => {
2968
3057
  menuItemRefs.current[index] = el;
2969
3058
  },
2970
3059
  role: "menuitem",
2971
3060
  tabIndex: -1,
2972
3061
  onClick: () => handleItemClick(c.onClick),
2973
- className: (0, __utils_cn.cn)("w-full rounded-md px-4 py-2 text-left text-sm font-normal whitespace-nowrap transition-colors", "focus:ring-primary hover:bg-gray-50 focus:bg-gray-50 focus:ring focus:outline-none focus:ring-inset", c.disabled && "cursor-not-allowed opacity-50", focusedIndex === index && "bg-gray-50"),
3062
+ className: cn("w-full rounded-md px-4 py-2 text-left text-sm font-normal whitespace-nowrap transition-colors", "focus:ring-primary hover:bg-gray-50 focus:bg-gray-50 focus:ring focus:outline-none focus:ring-inset", c.disabled && "cursor-not-allowed opacity-50", focusedIndex === index && "bg-gray-50"),
2974
3063
  "aria-label": c.title,
2975
3064
  disabled: c.disabled,
2976
3065
  children: c.title
@@ -2980,6 +3069,10 @@ const ProfileMenu = ({ title, metaTitle, icon, content, disabled = false, classN
2980
3069
  }) });
2981
3070
  };
2982
3071
 
3072
+ //#endregion
3073
+ //#region src/utils/ssr.ts
3074
+ const isSSR = () => typeof window === "undefined" || typeof document === "undefined";
3075
+
2983
3076
  //#endregion
2984
3077
  //#region src/components/wysiwygEditor/index.tsx
2985
3078
  const BoldIcon = () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__tabler_icons_react.IconBold, {
@@ -3032,10 +3125,10 @@ const WysiwygEditor = (0, react.forwardRef)(({ id, content, className, placehold
3032
3125
  (0, react.useImperativeHandle)(ref, () => ({ resetContent(newContent) {
3033
3126
  editor?.commands?.setContent(newContent);
3034
3127
  } }), [editor]);
3035
- if ((0, __utils_ssr.isSSR)()) return null;
3128
+ if (isSSR()) return null;
3036
3129
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
3037
3130
  "data-testid": `${id}-container`,
3038
- className: (0, __utils_cn.cn)("rounded-md border border-gray-200", className, error && "border-red-600"),
3131
+ className: cn("rounded-md border border-gray-200", className, error && "border-red-600"),
3039
3132
  children: [editor && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
3040
3133
  className: "flex flex-wrap gap-2 border-b border-gray-200 p-2",
3041
3134
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -3091,7 +3184,7 @@ const WysiwygEditor = (0, react.forwardRef)(({ id, content, className, placehold
3091
3184
  "data-component": "wysiwygEditor",
3092
3185
  "data-testid": id,
3093
3186
  id,
3094
- className: (0, __utils_cn.cn)("overflow-hidden rounded-[inherit]")
3187
+ className: cn("overflow-hidden rounded-[inherit]")
3095
3188
  })]
3096
3189
  }), error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
3097
3190
  className: "mt-1 text-xs font-normal text-red-600",