@salesmind-ai/design-system 0.3.1 → 0.3.3

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 (197) hide show
  1. package/dist/admin/index.cjs +68 -2928
  2. package/dist/admin/index.cjs.map +1 -1
  3. package/dist/admin/index.js +5 -2915
  4. package/dist/admin/index.js.map +1 -1
  5. package/dist/blog/index.cjs +53 -1064
  6. package/dist/blog/index.cjs.map +1 -1
  7. package/dist/blog/index.js +8 -1054
  8. package/dist/blog/index.js.map +1 -1
  9. package/dist/charts/index.cjs +46 -2694
  10. package/dist/charts/index.cjs.map +1 -1
  11. package/dist/charts/index.js +3 -2680
  12. package/dist/charts/index.js.map +1 -1
  13. package/dist/chunk-2GARWEJK.js +17 -0
  14. package/dist/chunk-2GARWEJK.js.map +1 -0
  15. package/dist/chunk-3NKRFUAR.js +37 -0
  16. package/dist/chunk-3NKRFUAR.js.map +1 -0
  17. package/dist/chunk-3TGSIILM.cjs +201 -0
  18. package/dist/chunk-3TGSIILM.cjs.map +1 -0
  19. package/dist/chunk-4GM5BGBN.cjs +801 -0
  20. package/dist/chunk-4GM5BGBN.cjs.map +1 -0
  21. package/dist/chunk-5LGDEZWY.cjs +2434 -0
  22. package/dist/chunk-5LGDEZWY.cjs.map +1 -0
  23. package/dist/chunk-6H4DSTXR.js +786 -0
  24. package/dist/chunk-6H4DSTXR.js.map +1 -0
  25. package/dist/chunk-6UNG76Y2.js +153 -0
  26. package/dist/chunk-6UNG76Y2.js.map +1 -0
  27. package/dist/chunk-7PX2AZ6Y.js +39 -0
  28. package/dist/chunk-7PX2AZ6Y.js.map +1 -0
  29. package/dist/chunk-B6AVAX4F.js +1415 -0
  30. package/dist/chunk-B6AVAX4F.js.map +1 -0
  31. package/dist/chunk-BILT5KD3.js +264 -0
  32. package/dist/chunk-BILT5KD3.js.map +1 -0
  33. package/dist/chunk-C2BCDNAV.js +24 -0
  34. package/dist/chunk-C2BCDNAV.js.map +1 -0
  35. package/dist/chunk-CH42VPWE.cjs +421 -0
  36. package/dist/chunk-CH42VPWE.cjs.map +1 -0
  37. package/dist/chunk-CJ2MKVAF.cjs +46 -0
  38. package/dist/chunk-CJ2MKVAF.cjs.map +1 -0
  39. package/dist/chunk-DP74LUXG.cjs +98 -0
  40. package/dist/chunk-DP74LUXG.cjs.map +1 -0
  41. package/dist/chunk-E7D6EKJ4.cjs +44 -0
  42. package/dist/chunk-E7D6EKJ4.cjs.map +1 -0
  43. package/dist/chunk-ECXBTUH6.cjs +584 -0
  44. package/dist/chunk-ECXBTUH6.cjs.map +1 -0
  45. package/dist/chunk-EFRAP5ES.js +157 -0
  46. package/dist/chunk-EFRAP5ES.js.map +1 -0
  47. package/dist/chunk-F6YYWMME.js +485 -0
  48. package/dist/chunk-F6YYWMME.js.map +1 -0
  49. package/dist/chunk-FAFAP4L5.js +183 -0
  50. package/dist/chunk-FAFAP4L5.js.map +1 -0
  51. package/dist/chunk-GUZIMHWS.js +1608 -0
  52. package/dist/chunk-GUZIMHWS.js.map +1 -0
  53. package/dist/chunk-H2Y6BSTL.cjs +69 -0
  54. package/dist/chunk-H2Y6BSTL.cjs.map +1 -0
  55. package/dist/chunk-HN4PHABT.js +126 -0
  56. package/dist/chunk-HN4PHABT.js.map +1 -0
  57. package/dist/chunk-HRENHNDJ.js +211 -0
  58. package/dist/chunk-HRENHNDJ.js.map +1 -0
  59. package/dist/chunk-I75BFEYT.cjs +2561 -0
  60. package/dist/chunk-I75BFEYT.cjs.map +1 -0
  61. package/dist/chunk-IFRATNLU.js +562 -0
  62. package/dist/chunk-IFRATNLU.js.map +1 -0
  63. package/dist/chunk-IYPXJ6YC.cjs +69 -0
  64. package/dist/chunk-IYPXJ6YC.cjs.map +1 -0
  65. package/dist/chunk-JPJN4YBC.js +409 -0
  66. package/dist/chunk-JPJN4YBC.js.map +1 -0
  67. package/dist/chunk-KBA2LFBG.js +62 -0
  68. package/dist/chunk-KBA2LFBG.js.map +1 -0
  69. package/dist/chunk-KCKUSU2M.cjs +166 -0
  70. package/dist/chunk-KCKUSU2M.cjs.map +1 -0
  71. package/dist/chunk-KJ2OXQF4.js +287 -0
  72. package/dist/chunk-KJ2OXQF4.js.map +1 -0
  73. package/dist/chunk-KNQEIU7O.cjs +1202 -0
  74. package/dist/chunk-KNQEIU7O.cjs.map +1 -0
  75. package/dist/chunk-KVGSVGRK.cjs +569 -0
  76. package/dist/chunk-KVGSVGRK.cjs.map +1 -0
  77. package/dist/chunk-L352JRV6.cjs +105 -0
  78. package/dist/chunk-L352JRV6.cjs.map +1 -0
  79. package/dist/chunk-LJADZITX.cjs +298 -0
  80. package/dist/chunk-LJADZITX.cjs.map +1 -0
  81. package/dist/chunk-LMJPWXTZ.cjs +194 -0
  82. package/dist/chunk-LMJPWXTZ.cjs.map +1 -0
  83. package/dist/chunk-LOWEAQST.js +701 -0
  84. package/dist/chunk-LOWEAQST.js.map +1 -0
  85. package/dist/chunk-MDB2WCRQ.cjs +137 -0
  86. package/dist/chunk-MDB2WCRQ.cjs.map +1 -0
  87. package/dist/chunk-MQDEE7HC.cjs +283 -0
  88. package/dist/chunk-MQDEE7HC.cjs.map +1 -0
  89. package/dist/chunk-MQRB634A.cjs +34 -0
  90. package/dist/chunk-MQRB634A.cjs.map +1 -0
  91. package/dist/chunk-MTI27RDV.js +185 -0
  92. package/dist/chunk-MTI27RDV.js.map +1 -0
  93. package/dist/chunk-MU6GW5ZV.js +2317 -0
  94. package/dist/chunk-MU6GW5ZV.js.map +1 -0
  95. package/dist/chunk-NN3TUHIH.js +28 -0
  96. package/dist/chunk-NN3TUHIH.js.map +1 -0
  97. package/dist/chunk-NT4LBP7D.cjs +111 -0
  98. package/dist/chunk-NT4LBP7D.cjs.map +1 -0
  99. package/dist/chunk-OLV7OD3X.cjs +502 -0
  100. package/dist/chunk-OLV7OD3X.cjs.map +1 -0
  101. package/dist/chunk-OXNXEQY7.js +2538 -0
  102. package/dist/chunk-OXNXEQY7.js.map +1 -0
  103. package/dist/chunk-P5BOFE5A.js +546 -0
  104. package/dist/chunk-P5BOFE5A.js.map +1 -0
  105. package/dist/chunk-Q2MFGYTE.cjs +1449 -0
  106. package/dist/chunk-Q2MFGYTE.cjs.map +1 -0
  107. package/dist/chunk-Q75DBVDY.cjs +68 -0
  108. package/dist/chunk-Q75DBVDY.cjs.map +1 -0
  109. package/dist/chunk-REQ5Q6ZI.js +1022 -0
  110. package/dist/chunk-REQ5Q6ZI.js.map +1 -0
  111. package/dist/chunk-SICKWUWB.js +62 -0
  112. package/dist/chunk-SICKWUWB.js.map +1 -0
  113. package/dist/chunk-T343CCH5.js +1190 -0
  114. package/dist/chunk-T343CCH5.js.map +1 -0
  115. package/dist/chunk-TEC62D4A.cjs +1624 -0
  116. package/dist/chunk-TEC62D4A.cjs.map +1 -0
  117. package/dist/chunk-TW5JB35D.js +2122 -0
  118. package/dist/chunk-TW5JB35D.js.map +1 -0
  119. package/dist/chunk-VC5LMUVQ.cjs +20 -0
  120. package/dist/chunk-VC5LMUVQ.cjs.map +1 -0
  121. package/dist/chunk-VM7WFMKI.cjs +76 -0
  122. package/dist/chunk-VM7WFMKI.cjs.map +1 -0
  123. package/dist/chunk-W2WTP6HS.cjs +233 -0
  124. package/dist/chunk-W2WTP6HS.cjs.map +1 -0
  125. package/dist/chunk-WH7PYHZY.cjs +35 -0
  126. package/dist/chunk-WH7PYHZY.cjs.map +1 -0
  127. package/dist/chunk-XQZVY7JJ.cjs +717 -0
  128. package/dist/chunk-XQZVY7JJ.cjs.map +1 -0
  129. package/dist/chunk-XU3OMQ7V.js +98 -0
  130. package/dist/chunk-XU3OMQ7V.js.map +1 -0
  131. package/dist/chunk-XWPDRMZG.js +62 -0
  132. package/dist/chunk-XWPDRMZG.js.map +1 -0
  133. package/dist/chunk-Y3CPKNB7.js +67 -0
  134. package/dist/chunk-Y3CPKNB7.js.map +1 -0
  135. package/dist/chunk-YNVRDD2P.js +98 -0
  136. package/dist/chunk-YNVRDD2P.js.map +1 -0
  137. package/dist/chunk-YSYR54XR.js +92 -0
  138. package/dist/chunk-YSYR54XR.js.map +1 -0
  139. package/dist/chunk-YTYDQBVY.cjs +162 -0
  140. package/dist/chunk-YTYDQBVY.cjs.map +1 -0
  141. package/dist/chunk-ZDLOA2UT.cjs +1042 -0
  142. package/dist/chunk-ZDLOA2UT.cjs.map +1 -0
  143. package/dist/chunk-ZWUKRCOJ.cjs +2162 -0
  144. package/dist/chunk-ZWUKRCOJ.cjs.map +1 -0
  145. package/dist/core/index.cjs +807 -4333
  146. package/dist/core/index.cjs.map +1 -1
  147. package/dist/core/index.js +14 -4130
  148. package/dist/core/index.js.map +1 -1
  149. package/dist/i18n/index.cjs +86 -558
  150. package/dist/i18n/index.cjs.map +1 -1
  151. package/dist/i18n/index.js +1 -544
  152. package/dist/i18n/index.js.map +1 -1
  153. package/dist/index.cjs +1432 -17140
  154. package/dist/index.cjs.map +1 -1
  155. package/dist/index.js +31 -16785
  156. package/dist/index.js.map +1 -1
  157. package/dist/marketing/index.cjs +142 -3072
  158. package/dist/marketing/index.cjs.map +1 -1
  159. package/dist/marketing/index.js +11 -3042
  160. package/dist/marketing/index.js.map +1 -1
  161. package/dist/motion/index.cjs +26 -1222
  162. package/dist/motion/index.cjs.map +1 -1
  163. package/dist/motion/index.js +2 -1215
  164. package/dist/motion/index.js.map +1 -1
  165. package/dist/nav/index.cjs +101 -1518
  166. package/dist/nav/index.cjs.map +1 -1
  167. package/dist/nav/index.js +4 -1498
  168. package/dist/nav/index.js.map +1 -1
  169. package/dist/report/index.cjs +171 -2403
  170. package/dist/report/index.cjs.map +1 -1
  171. package/dist/report/index.js +3 -2363
  172. package/dist/report/index.js.map +1 -1
  173. package/dist/sections/index.cjs +28 -378
  174. package/dist/sections/index.cjs.map +1 -1
  175. package/dist/sections/index.js +4 -372
  176. package/dist/sections/index.js.map +1 -1
  177. package/dist/social-proof/index.cjs +53 -1250
  178. package/dist/social-proof/index.cjs.map +1 -1
  179. package/dist/social-proof/index.js +6 -1235
  180. package/dist/social-proof/index.js.map +1 -1
  181. package/dist/theme/index.cjs +38 -565
  182. package/dist/theme/index.cjs.map +1 -1
  183. package/dist/theme/index.js +2 -555
  184. package/dist/theme/index.js.map +1 -1
  185. package/dist/web/client/index.cjs +38 -491
  186. package/dist/web/client/index.cjs.map +1 -1
  187. package/dist/web/client/index.js +4 -483
  188. package/dist/web/client/index.js.map +1 -1
  189. package/dist/web/index.cjs +158 -1346
  190. package/dist/web/index.cjs.map +1 -1
  191. package/dist/web/index.js +9 -1305
  192. package/dist/web/index.js.map +1 -1
  193. package/dist/web/server/index.cjs +26 -563
  194. package/dist/web/server/index.cjs.map +1 -1
  195. package/dist/web/server/index.js +1 -560
  196. package/dist/web/server/index.js.map +1 -1
  197. package/package.json +11 -1
@@ -1,2918 +1,8 @@
1
1
  "use client";
2
- import React4, { useState, useEffect, createContext, forwardRef, useContext, useMemo } from 'react';
3
- import clsx4 from 'clsx';
4
- import { jsx, jsxs } from 'react/jsx-runtime';
5
- import { Slot } from '@radix-ui/react-slot';
6
- import { Input } from '@base-ui/react/input';
7
- import { Checkbox as Checkbox$1 } from '@base-ui/react/checkbox';
8
-
9
- // src/components/Sidebar/Sidebar.tsx
10
- var Sidebar = React4.forwardRef(
11
- ({ position = "left", width = 280, collapsed = false, className, children }, ref) => {
12
- const style = {
13
- "--sidebar-width": typeof width === "number" ? `${width}px` : width
14
- };
15
- return /* @__PURE__ */ jsx(
16
- "aside",
17
- {
18
- ref,
19
- className: clsx4(
20
- "ds-sidebar",
21
- `ds-sidebar--${position}`,
22
- collapsed && "ds-sidebar--collapsed",
23
- className
24
- ),
25
- style,
26
- children: /* @__PURE__ */ jsx("div", { className: "ds-sidebar__content", children })
27
- }
28
- );
29
- }
30
- );
31
- Sidebar.displayName = "Sidebar";
32
- var SidebarSection = React4.forwardRef(
33
- ({ title, className, children }, ref) => {
34
- return /* @__PURE__ */ jsxs("div", { ref, className: clsx4("ds-sidebar__section", className), children: [
35
- title && /* @__PURE__ */ jsx("h3", { className: "ds-sidebar__section-title", children: title }),
36
- children
37
- ] });
38
- }
39
- );
40
- SidebarSection.displayName = "SidebarSection";
41
- var SidebarItem = React4.forwardRef(
42
- ({ active = false, icon, onClick, className, children }, ref) => {
43
- return /* @__PURE__ */ jsxs(
44
- "button",
45
- {
46
- ref,
47
- className: clsx4("ds-sidebar__item", active && "ds-sidebar__item--active", className),
48
- onClick,
49
- type: "button",
50
- children: [
51
- icon && /* @__PURE__ */ jsx("span", { className: "ds-sidebar__item-icon", children: icon }),
52
- /* @__PURE__ */ jsx("span", { className: "ds-sidebar__item-label", children })
53
- ]
54
- }
55
- );
56
- }
57
- );
58
- SidebarItem.displayName = "SidebarItem";
59
- var FloatingTabBar = React4.forwardRef(
60
- ({ position = "bottom", className, children }, ref) => {
61
- return /* @__PURE__ */ jsx(
62
- "nav",
63
- {
64
- ref,
65
- className: clsx4("ds-floating-tab-bar", `ds-floating-tab-bar--${position}`, className),
66
- role: "tablist",
67
- children
68
- }
69
- );
70
- }
71
- );
72
- FloatingTabBar.displayName = "FloatingTabBar";
73
- var TabItem = React4.forwardRef(
74
- ({ active = false, icon, label, onClick, className }, ref) => {
75
- return /* @__PURE__ */ jsxs(
76
- "button",
77
- {
78
- ref,
79
- className: clsx4("ds-tab-item", active && "ds-tab-item--active", className),
80
- onClick,
81
- role: "tab",
82
- "aria-selected": active,
83
- type: "button",
84
- children: [
85
- icon && /* @__PURE__ */ jsx("span", { className: "ds-tab-item__icon", children: icon }),
86
- label && /* @__PURE__ */ jsx("span", { className: "ds-tab-item__label", children: label })
87
- ]
88
- }
89
- );
90
- }
91
- );
92
- TabItem.displayName = "TabItem";
93
- var HomeIcon = () => /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
94
- /* @__PURE__ */ jsx("path", { d: "M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" }),
95
- /* @__PURE__ */ jsx("polyline", { points: "9,22 9,12 15,12 15,22" })
96
- ] });
97
- var ChartIcon = () => /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
98
- /* @__PURE__ */ jsx("line", { x1: "18", y1: "20", x2: "18", y2: "10" }),
99
- /* @__PURE__ */ jsx("line", { x1: "12", y1: "20", x2: "12", y2: "4" }),
100
- /* @__PURE__ */ jsx("line", { x1: "6", y1: "20", x2: "6", y2: "14" })
101
- ] });
102
- var UsersIcon = () => /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
103
- /* @__PURE__ */ jsx("path", { d: "M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" }),
104
- /* @__PURE__ */ jsx("circle", { cx: "9", cy: "7", r: "4" }),
105
- /* @__PURE__ */ jsx("path", { d: "M23 21v-2a4 4 0 0 0-3-3.87" }),
106
- /* @__PURE__ */ jsx("path", { d: "M16 3.13a4 4 0 0 1 0 7.75" })
107
- ] });
108
- var SettingsIcon = () => /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
109
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3" }),
110
- /* @__PURE__ */ jsx("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" })
111
- ] });
112
- var DEFAULT_NAV_ITEMS = [
113
- { key: "dashboard", label: "Dashboard", icon: /* @__PURE__ */ jsx(HomeIcon, {}) },
114
- { key: "analytics", label: "Analytics", icon: /* @__PURE__ */ jsx(ChartIcon, {}) },
115
- { key: "contacts", label: "Contacts", icon: /* @__PURE__ */ jsx(UsersIcon, {}) },
116
- { key: "settings", label: "Settings", icon: /* @__PURE__ */ jsx(SettingsIcon, {}) }
117
- ];
118
- function getNavFromDocument() {
119
- if (typeof document === "undefined") return "left";
120
- const nav = document.documentElement.getAttribute("data-nav");
121
- if (nav === "left" || nav === "right" || nav === "bottom") {
122
- return nav;
123
- }
124
- return "left";
125
- }
126
- var Shell = React4.forwardRef(
127
- ({
128
- layout,
129
- className,
130
- children,
131
- navItems = DEFAULT_NAV_ITEMS,
132
- activeNav = "dashboard",
133
- onNavChange,
134
- systemSectionTitle = "System"
135
- }, ref) => {
136
- const [computedLayout, setComputedLayout] = useState(
137
- layout || getNavFromDocument()
138
- );
139
- useEffect(() => {
140
- if (layout) {
141
- setComputedLayout(layout);
142
- return;
143
- }
144
- if (typeof document === "undefined") return;
145
- const observer = new MutationObserver((mutations) => {
146
- mutations.forEach((mutation) => {
147
- if (mutation.type === "attributes" && mutation.attributeName === "data-nav") {
148
- setComputedLayout(getNavFromDocument());
149
- }
150
- });
151
- });
152
- observer.observe(document.documentElement, {
153
- attributes: true,
154
- attributeFilter: ["data-nav"]
155
- });
156
- setComputedLayout(getNavFromDocument());
157
- return () => observer.disconnect();
158
- }, [layout]);
159
- const handleNavClick = (key) => {
160
- onNavChange?.(key);
161
- };
162
- return /* @__PURE__ */ jsxs(
163
- "div",
164
- {
165
- ref,
166
- className: clsx4("ds-shell", `ds-shell--${computedLayout}`, className),
167
- "data-shell-layout": computedLayout,
168
- children: [
169
- (computedLayout === "left" || computedLayout === "right") && /* @__PURE__ */ jsxs(Sidebar, { position: computedLayout, children: [
170
- /* @__PURE__ */ jsx(SidebarSection, { children: navItems.slice(0, 3).map((item) => /* @__PURE__ */ jsx(
171
- SidebarItem,
172
- {
173
- icon: item.icon,
174
- active: activeNav === item.key,
175
- onClick: () => handleNavClick(item.key),
176
- children: item.label
177
- },
178
- item.key
179
- )) }),
180
- navItems.length > 3 && /* @__PURE__ */ jsx(SidebarSection, { title: systemSectionTitle, children: navItems.slice(3).map((item) => /* @__PURE__ */ jsx(
181
- SidebarItem,
182
- {
183
- icon: item.icon,
184
- active: activeNav === item.key,
185
- onClick: () => handleNavClick(item.key),
186
- children: item.label
187
- },
188
- item.key
189
- )) })
190
- ] }),
191
- computedLayout === "bottom" && /* @__PURE__ */ jsx(FloatingTabBar, { position: "bottom", children: navItems.map((item) => /* @__PURE__ */ jsx(
192
- TabItem,
193
- {
194
- icon: item.icon,
195
- label: item.label,
196
- active: activeNav === item.key,
197
- onClick: () => handleNavClick(item.key)
198
- },
199
- item.key
200
- )) }),
201
- /* @__PURE__ */ jsx("main", { className: "ds-shell__content", children })
202
- ]
203
- }
204
- );
205
- }
206
- );
207
- Shell.displayName = "Shell";
208
- var DataTable = React4.forwardRef(
209
- ({ className, children, ...props }, ref) => {
210
- return /* @__PURE__ */ jsx("div", { className: "ds-data-table-container", children: /* @__PURE__ */ jsx("table", { ref, className: clsx4("ds-data-table", className), ...props, children }) });
211
- }
212
- );
213
- DataTable.displayName = "DataTable";
214
- var DataTableHeader = React4.forwardRef(({ className, ...props }, ref) => {
215
- return /* @__PURE__ */ jsx("thead", { ref, className: clsx4("ds-data-table__header", className), ...props });
216
- });
217
- DataTableHeader.displayName = "DataTableHeader";
218
- var DataTableBody = React4.forwardRef(({ className, ...props }, ref) => {
219
- return /* @__PURE__ */ jsx("tbody", { ref, className: clsx4("ds-data-table__body", className), ...props });
220
- });
221
- DataTableBody.displayName = "DataTableBody";
222
- var DataTableRow = React4.forwardRef(({ className, ...props }, ref) => {
223
- return /* @__PURE__ */ jsx("tr", { ref, className: clsx4("ds-data-table__row", className), ...props });
224
- });
225
- DataTableRow.displayName = "DataTableRow";
226
- var DataTableHead = React4.forwardRef(({ className, ...props }, ref) => {
227
- return /* @__PURE__ */ jsx("th", { ref, className: clsx4("ds-data-table__head", className), ...props });
228
- });
229
- DataTableHead.displayName = "DataTableHead";
230
- var DataTableCell = React4.forwardRef(({ className, ...props }, ref) => {
231
- return /* @__PURE__ */ jsx("td", { ref, className: clsx4("ds-data-table__cell", className), ...props });
232
- });
233
- DataTableCell.displayName = "DataTableCell";
234
- var Button = React4.forwardRef(
235
- ({ className, variant = "primary", size = "md", asChild = false, isLoading = false, children, disabled, ...props }, ref) => {
236
- const buttonClass = clsx4(
237
- "ds-button",
238
- `ds-button--${variant}`,
239
- size === "icon" ? "ds-button--icon ds-button--md" : `ds-button--${size}`,
240
- isLoading && "ds-button--loading",
241
- className
242
- );
243
- if (asChild) {
244
- return /* @__PURE__ */ jsx(
245
- Slot,
246
- {
247
- ref,
248
- "aria-disabled": isLoading || disabled || void 0,
249
- className: buttonClass,
250
- ...props,
251
- children
252
- }
253
- );
254
- }
255
- return /* @__PURE__ */ jsxs(
256
- "button",
257
- {
258
- ref,
259
- disabled: isLoading || disabled,
260
- className: buttonClass,
261
- ...props,
262
- children: [
263
- isLoading && /* @__PURE__ */ jsx(
264
- "svg",
265
- {
266
- className: "ds-button__spinner",
267
- xmlns: "http://www.w3.org/2000/svg",
268
- width: "1em",
269
- height: "1em",
270
- viewBox: "0 0 24 24",
271
- fill: "none",
272
- stroke: "currentColor",
273
- strokeWidth: "2",
274
- strokeLinecap: "round",
275
- strokeLinejoin: "round",
276
- children: /* @__PURE__ */ jsx("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
277
- }
278
- ),
279
- /* @__PURE__ */ jsx("span", { className: clsx4("ds-button__content", isLoading && "ds-button__content--hidden"), children })
280
- ]
281
- }
282
- );
283
- }
284
- );
285
- Button.displayName = "Button";
286
- var TextField = React4.forwardRef(
287
- ({ className, label, error, helperText, endAdornment, id, ...props }, ref) => {
288
- const generatedId = React4.useId();
289
- const inputId = id || generatedId;
290
- return /* @__PURE__ */ jsxs("div", { className: clsx4("ds-textfield", className), children: [
291
- label && /* @__PURE__ */ jsx("label", { htmlFor: inputId, className: "ds-textfield__label", children: label }),
292
- /* @__PURE__ */ jsxs("div", { className: "ds-textfield__input-wrapper", children: [
293
- /* @__PURE__ */ jsx(
294
- Input,
295
- {
296
- id: inputId,
297
- ref,
298
- className: clsx4(
299
- "ds-textfield__input",
300
- error && "ds-textfield__input--error",
301
- endAdornment && "ds-textfield__input--adorned"
302
- ),
303
- ...props
304
- }
305
- ),
306
- endAdornment && /* @__PURE__ */ jsx("div", { className: "ds-textfield__adornment", children: endAdornment })
307
- ] }),
308
- helperText && /* @__PURE__ */ jsx("span", { className: clsx4("ds-textfield__helper", error && "ds-textfield__helper--error"), children: helperText })
309
- ] });
310
- }
311
- );
312
- TextField.displayName = "TextField";
313
- var Checkbox = React4.forwardRef(
314
- ({ className, label, id, ...props }, ref) => {
315
- const generatedId = React4.useId();
316
- const checkboxId = id || generatedId;
317
- return /* @__PURE__ */ jsxs("div", { className: clsx4("ds-checkbox-wrapper", className), children: [
318
- /* @__PURE__ */ jsx(Checkbox$1.Root, { id: checkboxId, ref, className: "ds-checkbox", ...props, children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, { className: "ds-checkbox__indicator", children: /* @__PURE__ */ jsx(
319
- "svg",
320
- {
321
- viewBox: "0 0 14 14",
322
- fill: "none",
323
- xmlns: "http://www.w3.org/2000/svg",
324
- className: "ds-checkbox__icon",
325
- children: /* @__PURE__ */ jsx(
326
- "path",
327
- {
328
- d: "M11.6666 3.5L5.24992 9.91667L2.33325 7",
329
- stroke: "currentColor",
330
- strokeWidth: "2",
331
- strokeLinecap: "round",
332
- strokeLinejoin: "round"
333
- }
334
- )
335
- }
336
- ) }) }),
337
- label && /* @__PURE__ */ jsx("label", { htmlFor: checkboxId, className: "ds-checkbox__label", children: label })
338
- ] });
339
- }
340
- );
341
- Checkbox.displayName = "Checkbox";
342
- var defaultLoginLabels = {
343
- continueWithGoogleLabel: "Continue with Google",
344
- orContinueWithEmailLabel: "or continue with email",
345
- emailPlaceholder: "you@company.com",
346
- passwordPlaceholder: "Enter your password",
347
- signInLabel: "Sign in",
348
- doNotHaveAnAccountLabel: "Don't have an account?",
349
- emailLabel: "Email",
350
- passwordLabel: "Password",
351
- rememberMeLabel: "Remember me",
352
- forgotPasswordLabel: "Forgot password?",
353
- signUpLabel: "Sign up",
354
- trustedByLabel: "Trusted by 500+ sales teams worldwide"
355
- };
356
- var Login = ({
357
- brandName,
358
- tagline = "AI Sales Agents that automate your pipeline",
359
- labels: customLabels,
360
- showSocialLogin = true,
361
- showRememberMe = true,
362
- showForgotPassword = true,
363
- showSignUp = true,
364
- logo,
365
- onSubmit,
366
- onGoogleLogin,
367
- onForgotPassword,
368
- onSignUp,
369
- isLoading = false,
370
- error,
371
- className,
372
- style
373
- }) => {
374
- const l = { ...defaultLoginLabels, ...customLabels };
375
- const [email, setEmail] = useState("");
376
- const [password, setPassword] = useState("");
377
- const [showPassword, setShowPassword] = useState(false);
378
- const [rememberMe, setRememberMe] = useState(false);
379
- const handleSubmit = (e) => {
380
- e.preventDefault();
381
- onSubmit?.({ email, password, rememberMe });
382
- };
383
- return /* @__PURE__ */ jsxs("div", { className: clsx4("ds-login", className), style, children: [
384
- /* @__PURE__ */ jsxs("div", { className: "ds-login__background", children: [
385
- /* @__PURE__ */ jsx("div", { className: "ds-login__accent ds-login__accent--1", "aria-hidden": "true" }),
386
- /* @__PURE__ */ jsx("div", { className: "ds-login__accent ds-login__accent--2", "aria-hidden": "true" })
387
- ] }),
388
- /* @__PURE__ */ jsxs("div", { className: "ds-login__card", children: [
389
- /* @__PURE__ */ jsxs("div", { className: "ds-login__header", children: [
390
- logo ? /* @__PURE__ */ jsx("div", { className: "ds-login__logo", children: logo }) : /* @__PURE__ */ jsx("div", { className: "ds-login__logo ds-login__logo--default", children: /* @__PURE__ */ jsx("div", { className: "ds-login__logo-icon", children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
391
- /* @__PURE__ */ jsx("rect", { width: "32", height: "32", rx: "8", fill: "url(#logo-gradient)" }),
392
- /* @__PURE__ */ jsx(
393
- "path",
394
- {
395
- d: "M10 16L14 20L22 12",
396
- stroke: "white",
397
- strokeWidth: "2.5",
398
- strokeLinecap: "round",
399
- strokeLinejoin: "round"
400
- }
401
- ),
402
- /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: "logo-gradient", x1: "0", y1: "0", x2: "32", y2: "32", children: [
403
- /* @__PURE__ */ jsx("stop", { stopColor: "rgb(var(--accent-rgb))" }),
404
- /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "rgb(var(--accent2-rgb))" })
405
- ] }) })
406
- ] }) }) }),
407
- /* @__PURE__ */ jsx("h1", { className: "ds-login__title", children: brandName }),
408
- /* @__PURE__ */ jsx("p", { className: "ds-login__tagline", children: tagline })
409
- ] }),
410
- error && /* @__PURE__ */ jsxs("div", { className: "ds-login__error", children: [
411
- /* @__PURE__ */ jsxs(
412
- "svg",
413
- {
414
- width: "16",
415
- height: "16",
416
- viewBox: "0 0 16 16",
417
- fill: "none",
418
- xmlns: "http://www.w3.org/2000/svg",
419
- children: [
420
- /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", r: "7", stroke: "currentColor", strokeWidth: "1.5" }),
421
- /* @__PURE__ */ jsx("path", { d: "M8 4.5V8.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
422
- /* @__PURE__ */ jsx("circle", { cx: "8", cy: "11", r: "0.75", fill: "currentColor" })
423
- ]
424
- }
425
- ),
426
- /* @__PURE__ */ jsx("span", { children: error })
427
- ] }),
428
- showSocialLogin && /* @__PURE__ */ jsxs("div", { className: "ds-login__social", children: [
429
- /* @__PURE__ */ jsxs(
430
- "button",
431
- {
432
- type: "button",
433
- className: "ds-login__social-btn",
434
- onClick: onGoogleLogin,
435
- disabled: isLoading,
436
- children: [
437
- /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", width: "20", height: "20", children: [
438
- /* @__PURE__ */ jsx(
439
- "path",
440
- {
441
- fill: "#4285F4",
442
- d: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
443
- }
444
- ),
445
- /* @__PURE__ */ jsx(
446
- "path",
447
- {
448
- fill: "#34A853",
449
- d: "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
450
- }
451
- ),
452
- /* @__PURE__ */ jsx(
453
- "path",
454
- {
455
- fill: "#FBBC05",
456
- d: "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"
457
- }
458
- ),
459
- /* @__PURE__ */ jsx(
460
- "path",
461
- {
462
- fill: "#EA4335",
463
- d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
464
- }
465
- )
466
- ] }),
467
- /* @__PURE__ */ jsx("span", { children: l.continueWithGoogleLabel })
468
- ]
469
- }
470
- ),
471
- /* @__PURE__ */ jsx("div", { className: "ds-login__divider", children: /* @__PURE__ */ jsx("span", { children: l.orContinueWithEmailLabel }) })
472
- ] }),
473
- /* @__PURE__ */ jsxs("form", { className: "ds-login__form", onSubmit: handleSubmit, children: [
474
- /* @__PURE__ */ jsx("div", { className: "ds-login__field", children: /* @__PURE__ */ jsx(
475
- TextField,
476
- {
477
- label: l.emailLabel,
478
- type: "email",
479
- placeholder: l.emailPlaceholder,
480
- value: email,
481
- onChange: (e) => setEmail(e.target.value),
482
- disabled: isLoading,
483
- autoComplete: "email"
484
- }
485
- ) }),
486
- /* @__PURE__ */ jsx("div", { className: "ds-login__field", children: /* @__PURE__ */ jsx(
487
- TextField,
488
- {
489
- label: l.passwordLabel,
490
- type: showPassword ? "text" : "password",
491
- placeholder: l.passwordPlaceholder,
492
- value: password,
493
- onChange: (e) => setPassword(e.target.value),
494
- disabled: isLoading,
495
- autoComplete: "current-password",
496
- endAdornment: /* @__PURE__ */ jsx(
497
- "button",
498
- {
499
- type: "button",
500
- className: "ds-login__password-toggle",
501
- onClick: () => setShowPassword(!showPassword),
502
- "aria-label": showPassword ? "Hide password" : "Show password",
503
- children: showPassword ? /* @__PURE__ */ jsxs(
504
- "svg",
505
- {
506
- width: "20",
507
- height: "20",
508
- viewBox: "0 0 24 24",
509
- fill: "none",
510
- stroke: "currentColor",
511
- strokeWidth: "2",
512
- strokeLinecap: "round",
513
- strokeLinejoin: "round",
514
- children: [
515
- /* @__PURE__ */ jsx("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }),
516
- /* @__PURE__ */ jsx("line", { x1: "1", y1: "1", x2: "23", y2: "23" })
517
- ]
518
- }
519
- ) : /* @__PURE__ */ jsxs(
520
- "svg",
521
- {
522
- width: "20",
523
- height: "20",
524
- viewBox: "0 0 24 24",
525
- fill: "none",
526
- stroke: "currentColor",
527
- strokeWidth: "2",
528
- strokeLinecap: "round",
529
- strokeLinejoin: "round",
530
- children: [
531
- /* @__PURE__ */ jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }),
532
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3" })
533
- ]
534
- }
535
- )
536
- }
537
- )
538
- }
539
- ) }),
540
- /* @__PURE__ */ jsxs("div", { className: "ds-login__options", children: [
541
- showRememberMe && /* @__PURE__ */ jsx(
542
- Checkbox,
543
- {
544
- label: l.rememberMeLabel,
545
- checked: rememberMe,
546
- onCheckedChange: (checked) => setRememberMe(checked === true),
547
- disabled: isLoading
548
- }
549
- ),
550
- showForgotPassword && /* @__PURE__ */ jsx(
551
- "button",
552
- {
553
- type: "button",
554
- className: "ds-login__link",
555
- onClick: onForgotPassword,
556
- disabled: isLoading,
557
- children: l.forgotPasswordLabel
558
- }
559
- )
560
- ] }),
561
- /* @__PURE__ */ jsx(
562
- Button,
563
- {
564
- type: "submit",
565
- variant: "primary",
566
- size: "lg",
567
- disabled: isLoading || !email || !password,
568
- className: "ds-login__submit",
569
- children: isLoading ? /* @__PURE__ */ jsx("span", { className: "ds-login__spinner" }) : l.signInLabel
570
- }
571
- )
572
- ] }),
573
- showSignUp && /* @__PURE__ */ jsxs("div", { className: "ds-login__footer", children: [
574
- /* @__PURE__ */ jsx("span", { children: l.doNotHaveAnAccountLabel }),
575
- /* @__PURE__ */ jsx(
576
- "button",
577
- {
578
- type: "button",
579
- className: "ds-login__link ds-login__link--accent",
580
- onClick: onSignUp,
581
- disabled: isLoading,
582
- children: l.signUpLabel
583
- }
584
- )
585
- ] })
586
- ] })
587
- ] });
588
- };
589
- Login.displayName = "Login";
590
- var defaultSignupLabels = {
591
- formTitle: "Create your account",
592
- googleButtonLabel: "Sign up with Google",
593
- dividerText: "or sign up with email",
594
- nameLabel: "Full name",
595
- namePlaceholder: "John Doe",
596
- emailLabel: "Work email",
597
- emailPlaceholder: "you@company.com",
598
- passwordLabel: "Password",
599
- passwordPlaceholder: "Create a strong password",
600
- phoneLabel: "Phone",
601
- phonePlaceholder: "Phone number",
602
- hidePasswordLabel: "Hide password",
603
- showPasswordLabel: "Show password",
604
- passwordStrengthLabels: ["Very Weak", "Weak", "Fair", "Strong", "Very Strong"],
605
- termsAgreementPrefix: "I agree to the ",
606
- termsLabel: "Terms of Service ",
607
- termsConjunction: "and ",
608
- privacyLabel: "Privacy Policy",
609
- submitLabel: "Create account",
610
- loginPrompt: "Already have an account?",
611
- loginLabel: "Sign in",
612
- successTitle: "Welcome!",
613
- continueToLoginLabel: "Continue to Login"
614
- };
615
- function calculatePasswordStrength(password, strengthLabels) {
616
- let score = 0;
617
- if (password.length >= 8) score++;
618
- if (password.length >= 12) score++;
619
- if (/[a-z]/.test(password) && /[A-Z]/.test(password)) score++;
620
- if (/\d/.test(password)) score++;
621
- if (/[!@#$%^&*(),.?":{}|<>]/.test(password)) score++;
622
- score = Math.min(4, score);
623
- const labels = strengthLabels ?? defaultSignupLabels.passwordStrengthLabels;
624
- const colors = [
625
- "var(--status-error)",
626
- "var(--status-warning)",
627
- "#ffd000",
628
- "var(--status-success)",
629
- "var(--status-success)"
630
- ];
631
- return {
632
- score,
633
- label: labels[score],
634
- color: colors[score]
635
- };
636
- }
637
- var Signup = ({
638
- brandName,
639
- showSocialSignup = true,
640
- logo,
641
- onSubmit,
642
- onGoogleSignup,
643
- onLogin,
644
- onTermsClick,
645
- onPrivacyClick,
646
- isLoading = false,
647
- error,
648
- isSuccess = false,
649
- successMessage = "You're all set! Check your email to verify your account.",
650
- className,
651
- style,
652
- labels: customLabels,
653
- defaultCountry = "TH",
654
- countries = [],
655
- renderPhoneInput
656
- }) => {
657
- const l = { ...defaultSignupLabels, ...customLabels };
658
- const [name, setName] = useState("");
659
- const [email, setEmail] = useState("");
660
- const defaultCountryData = countries.find((c) => c.code === defaultCountry) || countries[0] || { dial: "+66"};
661
- const [countryDial, setCountryDial] = useState(defaultCountryData.dial);
662
- const [phone, setPhone] = useState("");
663
- const [password, setPassword] = useState("");
664
- const [showPassword, setShowPassword] = useState(false);
665
- const [acceptedTerms, setAcceptedTerms] = useState(false);
666
- const passwordStrength = useMemo(
667
- () => calculatePasswordStrength(password, l.passwordStrengthLabels),
668
- [password, l.passwordStrengthLabels]
669
- );
670
- const handleSubmit = (e) => {
671
- e.preventDefault();
672
- const fullPhone = phone ? phone.trim().startsWith("+") ? phone.trim() : `${countryDial} ${phone}`.trim() : "";
673
- onSubmit?.({ name, email, phone: fullPhone, password, acceptedTerms });
674
- };
675
- const isFormValid = name && email && password.length >= 8 && acceptedTerms;
676
- if (isSuccess) {
677
- return /* @__PURE__ */ jsxs("div", { className: clsx4("ds-signup", className), style, children: [
678
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__background", children: [
679
- /* @__PURE__ */ jsx("div", { className: "ds-signup__accent ds-signup__accent--1", "aria-hidden": "true" }),
680
- /* @__PURE__ */ jsx("div", { className: "ds-signup__accent ds-signup__accent--2", "aria-hidden": "true" })
681
- ] }),
682
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__card ds-signup__card--success", children: [
683
- /* @__PURE__ */ jsx("div", { className: "ds-signup__success-icon", children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 64 64", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
684
- /* @__PURE__ */ jsx("circle", { cx: "32", cy: "32", r: "30", stroke: "var(--status-success)", strokeWidth: "2" }),
685
- /* @__PURE__ */ jsx(
686
- "path",
687
- {
688
- d: "M20 32L28 40L44 24",
689
- stroke: "var(--status-success)",
690
- strokeWidth: "3",
691
- strokeLinecap: "round",
692
- strokeLinejoin: "round"
693
- }
694
- )
695
- ] }) }),
696
- /* @__PURE__ */ jsx("h1", { className: "ds-signup__success-title", children: l.successTitle === "Welcome!" ? `Welcome to ${brandName}!` : l.successTitle }),
697
- /* @__PURE__ */ jsx("p", { className: "ds-signup__success-message", children: successMessage }),
698
- /* @__PURE__ */ jsx(Button, { variant: "primary", size: "lg", onClick: onLogin, className: "ds-signup__success-btn", children: l.continueToLoginLabel })
699
- ] })
700
- ] });
701
- }
702
- return /* @__PURE__ */ jsxs("div", { className: clsx4("ds-signup", className), style, children: [
703
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__background", children: [
704
- /* @__PURE__ */ jsx("div", { className: "ds-signup__accent ds-signup__accent--1", "aria-hidden": "true" }),
705
- /* @__PURE__ */ jsx("div", { className: "ds-signup__accent ds-signup__accent--2", "aria-hidden": "true" })
706
- ] }),
707
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__card", children: [
708
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__header", children: [
709
- logo ? /* @__PURE__ */ jsx("div", { className: "ds-signup__logo", children: logo }) : /* @__PURE__ */ jsx("div", { className: "ds-signup__logo ds-signup__logo--default", children: /* @__PURE__ */ jsx("div", { className: "ds-signup__logo-icon", children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
710
- /* @__PURE__ */ jsx("rect", { width: "32", height: "32", rx: "8", fill: "url(#signup-logo-gradient)" }),
711
- /* @__PURE__ */ jsx(
712
- "path",
713
- {
714
- d: "M16 8V24M8 16H24",
715
- stroke: "white",
716
- strokeWidth: "2.5",
717
- strokeLinecap: "round"
718
- }
719
- ),
720
- /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: "signup-logo-gradient", x1: "0", y1: "0", x2: "32", y2: "32", children: [
721
- /* @__PURE__ */ jsx("stop", { stopColor: "rgb(var(--accent-rgb))" }),
722
- /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "rgb(var(--accent2-rgb))" })
723
- ] }) })
724
- ] }) }) }),
725
- /* @__PURE__ */ jsx("h1", { className: "ds-signup__title", children: l.formTitle })
726
- ] }),
727
- error && /* @__PURE__ */ jsxs("div", { className: "ds-signup__error", children: [
728
- /* @__PURE__ */ jsxs(
729
- "svg",
730
- {
731
- width: "16",
732
- height: "16",
733
- viewBox: "0 0 16 16",
734
- fill: "none",
735
- xmlns: "http://www.w3.org/2000/svg",
736
- children: [
737
- /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", r: "7", stroke: "currentColor", strokeWidth: "1.5" }),
738
- /* @__PURE__ */ jsx("path", { d: "M8 4.5V8.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
739
- /* @__PURE__ */ jsx("circle", { cx: "8", cy: "11", r: "0.75", fill: "currentColor" })
740
- ]
741
- }
742
- ),
743
- /* @__PURE__ */ jsx("span", { children: error })
744
- ] }),
745
- showSocialSignup && /* @__PURE__ */ jsxs("div", { className: "ds-signup__social", children: [
746
- /* @__PURE__ */ jsxs(
747
- "button",
748
- {
749
- type: "button",
750
- className: "ds-signup__social-btn",
751
- onClick: onGoogleSignup,
752
- disabled: isLoading,
753
- children: [
754
- /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", width: "20", height: "20", children: [
755
- /* @__PURE__ */ jsx(
756
- "path",
757
- {
758
- fill: "#4285F4",
759
- d: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
760
- }
761
- ),
762
- /* @__PURE__ */ jsx(
763
- "path",
764
- {
765
- fill: "#34A853",
766
- d: "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
767
- }
768
- ),
769
- /* @__PURE__ */ jsx(
770
- "path",
771
- {
772
- fill: "#FBBC05",
773
- d: "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"
774
- }
775
- ),
776
- /* @__PURE__ */ jsx(
777
- "path",
778
- {
779
- fill: "#EA4335",
780
- d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
781
- }
782
- )
783
- ] }),
784
- /* @__PURE__ */ jsx("span", { children: l.googleButtonLabel })
785
- ]
786
- }
787
- ),
788
- /* @__PURE__ */ jsx("div", { className: "ds-signup__divider", children: /* @__PURE__ */ jsx("span", { children: l.dividerText }) })
789
- ] }),
790
- /* @__PURE__ */ jsxs("form", { className: "ds-signup__form", onSubmit: handleSubmit, children: [
791
- /* @__PURE__ */ jsx("div", { className: "ds-signup__field", children: /* @__PURE__ */ jsx(
792
- TextField,
793
- {
794
- label: l.nameLabel,
795
- type: "text",
796
- placeholder: l.namePlaceholder,
797
- value: name,
798
- onChange: (e) => setName(e.target.value),
799
- disabled: isLoading,
800
- autoComplete: "name"
801
- }
802
- ) }),
803
- /* @__PURE__ */ jsx("div", { className: "ds-signup__field", children: /* @__PURE__ */ jsx(
804
- TextField,
805
- {
806
- label: l.emailLabel,
807
- type: "email",
808
- placeholder: l.emailPlaceholder,
809
- value: email,
810
- onChange: (e) => setEmail(e.target.value),
811
- disabled: isLoading,
812
- autoComplete: "email"
813
- }
814
- ) }),
815
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__field ds-signup__phone-field", children: [
816
- /* @__PURE__ */ jsx("label", { className: "ds-textfield__label", htmlFor: "phone-input", children: l.phoneLabel }),
817
- /* @__PURE__ */ jsx("div", { className: "ds-textfield__input-wrapper", children: renderPhoneInput ? renderPhoneInput({
818
- value: phone,
819
- onChange: setPhone,
820
- placeholder: l.phonePlaceholder,
821
- disabled: isLoading,
822
- className: "ds-signup__phone-container ds-textfield__input",
823
- id: "phone-input"
824
- }) : /* @__PURE__ */ jsxs("div", { className: clsx4("ds-signup__phone-container", "ds-textfield__input"), children: [
825
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__flag-select-wrapper", children: [
826
- /* @__PURE__ */ jsx(
827
- "select",
828
- {
829
- className: "ds-signup__flag-select-native",
830
- value: countryDial,
831
- onChange: (e) => {
832
- const newDial = e.target.value;
833
- setCountryDial(newDial);
834
- setPhone(newDial + " ");
835
- },
836
- disabled: isLoading,
837
- "aria-label": "Select country code",
838
- children: countries.map((c) => /* @__PURE__ */ jsx("option", { value: c.dial, children: c.name }, c.code))
839
- }
840
- ),
841
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__flag-display", "aria-hidden": "true", children: [
842
- /* @__PURE__ */ jsx("span", { className: "ds-signup__flag-icon", children: countries.find((c) => c.dial === countryDial)?.flag || "\u{1F310}" }),
843
- /* @__PURE__ */ jsx("svg", { width: "10", height: "6", viewBox: "0 0 10 6", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M1 1L5 5L9 1", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })
844
- ] })
845
- ] }),
846
- /* @__PURE__ */ jsx(
847
- "input",
848
- {
849
- id: "phone-input",
850
- type: "tel",
851
- placeholder: l.phonePlaceholder,
852
- value: phone,
853
- onChange: (e) => setPhone(e.target.value),
854
- disabled: isLoading,
855
- className: "ds-signup__phone-input ds-signup__phone-input-native",
856
- autoComplete: "tel"
857
- }
858
- )
859
- ] }) })
860
- ] }),
861
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__field", children: [
862
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__password-wrapper", children: [
863
- /* @__PURE__ */ jsx(
864
- TextField,
865
- {
866
- label: l.passwordLabel,
867
- type: showPassword ? "text" : "password",
868
- placeholder: l.passwordPlaceholder,
869
- value: password,
870
- onChange: (e) => setPassword(e.target.value),
871
- disabled: isLoading,
872
- autoComplete: "new-password"
873
- }
874
- ),
875
- /* @__PURE__ */ jsx(
876
- "button",
877
- {
878
- type: "button",
879
- className: "ds-signup__password-toggle",
880
- onClick: () => setShowPassword(!showPassword),
881
- "aria-label": showPassword ? l.hidePasswordLabel : l.showPasswordLabel,
882
- children: showPassword ? /* @__PURE__ */ jsxs(
883
- "svg",
884
- {
885
- width: "20",
886
- height: "20",
887
- viewBox: "0 0 24 24",
888
- fill: "none",
889
- stroke: "currentColor",
890
- strokeWidth: "2",
891
- strokeLinecap: "round",
892
- strokeLinejoin: "round",
893
- children: [
894
- /* @__PURE__ */ jsx("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }),
895
- /* @__PURE__ */ jsx("line", { x1: "1", y1: "1", x2: "23", y2: "23" })
896
- ]
897
- }
898
- ) : /* @__PURE__ */ jsxs(
899
- "svg",
900
- {
901
- width: "20",
902
- height: "20",
903
- viewBox: "0 0 24 24",
904
- fill: "none",
905
- stroke: "currentColor",
906
- strokeWidth: "2",
907
- strokeLinecap: "round",
908
- strokeLinejoin: "round",
909
- children: [
910
- /* @__PURE__ */ jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }),
911
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3" })
912
- ]
913
- }
914
- )
915
- }
916
- )
917
- ] }),
918
- password && /* @__PURE__ */ jsxs("div", { className: "ds-signup__strength", children: [
919
- /* @__PURE__ */ jsx("div", { className: "ds-signup__strength-bar", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx(
920
- "div",
921
- {
922
- className: clsx4(
923
- "ds-signup__strength-segment",
924
- i < passwordStrength.score && "ds-signup__strength-segment--active"
925
- ),
926
- style: i < passwordStrength.score ? { backgroundColor: passwordStrength.color } : {}
927
- },
928
- i
929
- )) }),
930
- /* @__PURE__ */ jsx(
931
- "span",
932
- {
933
- className: "ds-signup__strength-label",
934
- style: { color: passwordStrength.color },
935
- children: passwordStrength.label
936
- }
937
- )
938
- ] })
939
- ] }),
940
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__terms", children: [
941
- /* @__PURE__ */ jsx(
942
- Checkbox,
943
- {
944
- label: "",
945
- checked: acceptedTerms,
946
- onCheckedChange: (checked) => setAcceptedTerms(checked === true),
947
- disabled: isLoading
948
- }
949
- ),
950
- /* @__PURE__ */ jsxs("span", { className: "ds-signup__terms-text", children: [
951
- (l.termsAgreementPrefix || "").endsWith(" ") ? l.termsAgreementPrefix || "" : `${l.termsAgreementPrefix || ""} `,
952
- /* @__PURE__ */ jsx(
953
- "button",
954
- {
955
- type: "button",
956
- className: "ds-signup__link",
957
- onClick: onTermsClick,
958
- disabled: isLoading,
959
- children: l.termsLabel
960
- }
961
- ),
962
- (l.termsConjunction || " ").startsWith(" ") && (l.termsConjunction || " ").endsWith(" ") ? l.termsConjunction || " " : ` ${(l.termsConjunction || "").trim()} `,
963
- /* @__PURE__ */ jsx(
964
- "button",
965
- {
966
- type: "button",
967
- className: "ds-signup__link",
968
- onClick: onPrivacyClick,
969
- disabled: isLoading,
970
- children: l.privacyLabel
971
- }
972
- )
973
- ] })
974
- ] }),
975
- /* @__PURE__ */ jsx(
976
- Button,
977
- {
978
- type: "submit",
979
- variant: "primary",
980
- size: "lg",
981
- disabled: isLoading || !isFormValid,
982
- className: "ds-signup__submit",
983
- children: isLoading ? /* @__PURE__ */ jsx("span", { className: "ds-signup__spinner" }) : l.submitLabel
984
- }
985
- )
986
- ] }),
987
- /* @__PURE__ */ jsxs("div", { className: "ds-signup__footer", children: [
988
- /* @__PURE__ */ jsx("span", { children: l.loginPrompt }),
989
- /* @__PURE__ */ jsx(
990
- "button",
991
- {
992
- type: "button",
993
- className: "ds-signup__link ds-signup__link--accent",
994
- onClick: onLogin,
995
- disabled: isLoading,
996
- children: l.loginLabel
997
- }
998
- )
999
- ] })
1000
- ] })
1001
- ] });
1002
- };
1003
- Signup.displayName = "Signup";
1004
- var defaultForgotPasswordLabels = {
1005
- forgotPasswordTitle: "Forgot password?",
1006
- resetInstructionsTagline: "No worries, we'll send you reset instructions.",
1007
- emailLabel: "Email",
1008
- emailPlaceholder: "Enter your email",
1009
- resetPasswordButton: "Reset password",
1010
- backToLoginButton: "Back to login",
1011
- checkYourEmailTitle: "Check your email",
1012
- passwordResetLinkTagline: "We sent a password reset link to",
1013
- didNotReceiveEmailHint: "Didn't receive the email? ",
1014
- clickToResendButton: "Click to resend",
1015
- setNewPasswordTitle: "Set new password",
1016
- mustBeCharactersTagline: "Must be at least 8 characters.",
1017
- passwordLabel: "Password",
1018
- enterNewPasswordPlaceholder: "Enter new password",
1019
- confirmPasswordLabel: "Confirm password",
1020
- confirmNewPasswordPlaceholder: "Confirm new password",
1021
- passwordsDontMatchError: "Passwords don't match",
1022
- passwordResetTitle: "Password reset",
1023
- passwordSuccessfullyResetTagline: "Your password has been successfully reset.",
1024
- clickBelowLogInHint: "Click below to log in.",
1025
- continueToLoginButton: "Continue to login",
1026
- showPasswordLabel: "Show password",
1027
- hidePasswordLabel: "Hide password"
1028
- };
1029
- var ForgotPassword = ({
1030
- logo,
1031
- labels: customLabels,
1032
- onSubmit,
1033
- onResetPassword,
1034
- onBackToLogin,
1035
- isLoading = false,
1036
- error,
1037
- step = "email",
1038
- email: initialEmail = "",
1039
- className
1040
- }) => {
1041
- const l = { ...defaultForgotPasswordLabels, ...customLabels };
1042
- const [email, setEmail] = useState(initialEmail);
1043
- const [password, setPassword] = useState("");
1044
- const [confirmPassword, setConfirmPassword] = useState("");
1045
- const [showPassword, setShowPassword] = useState(false);
1046
- const [resendTimer, setResendTimer] = useState(0);
1047
- const hasStartedTimer = React4.useRef(false);
1048
- useEffect(() => {
1049
- if (step === "sent" && !hasStartedTimer.current) {
1050
- hasStartedTimer.current = true;
1051
- setResendTimer(60);
1052
- } else if (step !== "sent") {
1053
- hasStartedTimer.current = false;
1054
- }
1055
- }, [step]);
1056
- useEffect(() => {
1057
- let timerId;
1058
- if (resendTimer > 0) {
1059
- timerId = setInterval(() => {
1060
- setResendTimer((prev) => prev - 1);
1061
- }, 1e3);
1062
- }
1063
- return () => {
1064
- if (timerId) clearInterval(timerId);
1065
- };
1066
- }, [resendTimer]);
1067
- const handleResendClick = () => {
1068
- if (resendTimer === 0) {
1069
- onSubmit?.(email || initialEmail);
1070
- setResendTimer(60);
1071
- }
1072
- };
1073
- const handleEmailSubmit = (e) => {
1074
- e.preventDefault();
1075
- onSubmit?.(email);
1076
- };
1077
- const handleResetSubmit = (e) => {
1078
- e.preventDefault();
1079
- onResetPassword?.({ password, confirmPassword });
1080
- };
1081
- const renderLogo = () => logo ? /* @__PURE__ */ jsx("div", { className: "ds-forgot__logo", children: logo }) : /* @__PURE__ */ jsx("div", { className: "ds-forgot__logo ds-forgot__logo--default", children: /* @__PURE__ */ jsx("div", { className: "ds-forgot__logo-icon", children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
1082
- /* @__PURE__ */ jsx("rect", { width: "32", height: "32", rx: "8", fill: "url(#forgot-logo-gradient)" }),
1083
- /* @__PURE__ */ jsx(
1084
- "path",
1085
- {
1086
- d: "M16 10V14M16 22V22.01M16 26C21.5228 26 26 21.5228 26 16C26 10.4772 21.5228 6 16 6C10.4772 6 6 10.4772 6 16C6 21.5228 10.4772 26 16 26Z",
1087
- stroke: "white",
1088
- strokeWidth: "2",
1089
- strokeLinecap: "round"
1090
- }
1091
- ),
1092
- /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: "forgot-logo-gradient", x1: "0", y1: "0", x2: "32", y2: "32", children: [
1093
- /* @__PURE__ */ jsx("stop", { stopColor: "rgb(var(--accent-rgb))" }),
1094
- /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "rgb(var(--accent2-rgb))" })
1095
- ] }) })
1096
- ] }) }) });
1097
- if (step === "email") {
1098
- return /* @__PURE__ */ jsxs("div", { className: clsx4("ds-forgot", className), children: [
1099
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--1", "aria-hidden": "true" }),
1100
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--2", "aria-hidden": "true" }),
1101
- /* @__PURE__ */ jsxs("div", { className: "ds-forgot__card", children: [
1102
- /* @__PURE__ */ jsxs("div", { className: "ds-forgot__header", children: [
1103
- renderLogo(),
1104
- /* @__PURE__ */ jsx("h1", { className: "ds-forgot__title", children: l.forgotPasswordTitle }),
1105
- /* @__PURE__ */ jsx("p", { className: "ds-forgot__tagline", children: l.resetInstructionsTagline })
1106
- ] }),
1107
- error && /* @__PURE__ */ jsxs("div", { className: "ds-forgot__error", children: [
1108
- /* @__PURE__ */ jsxs(
1109
- "svg",
1110
- {
1111
- width: "16",
1112
- height: "16",
1113
- viewBox: "0 0 16 16",
1114
- fill: "none",
1115
- xmlns: "http://www.w3.org/2000/svg",
1116
- children: [
1117
- /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", r: "7", stroke: "currentColor", strokeWidth: "1.5" }),
1118
- /* @__PURE__ */ jsx(
1119
- "path",
1120
- {
1121
- d: "M8 4.5V8.5",
1122
- stroke: "currentColor",
1123
- strokeWidth: "1.5",
1124
- strokeLinecap: "round"
1125
- }
1126
- ),
1127
- /* @__PURE__ */ jsx("circle", { cx: "8", cy: "11", r: "0.75", fill: "currentColor" })
1128
- ]
1129
- }
1130
- ),
1131
- /* @__PURE__ */ jsx("span", { children: error })
1132
- ] }),
1133
- /* @__PURE__ */ jsxs("form", { className: "ds-forgot__form", onSubmit: handleEmailSubmit, children: [
1134
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__field", children: /* @__PURE__ */ jsx(
1135
- TextField,
1136
- {
1137
- label: l.emailLabel,
1138
- type: "email",
1139
- placeholder: l.emailPlaceholder,
1140
- value: email,
1141
- onChange: (e) => setEmail(e.target.value),
1142
- disabled: isLoading,
1143
- autoComplete: "email"
1144
- }
1145
- ) }),
1146
- /* @__PURE__ */ jsx(
1147
- Button,
1148
- {
1149
- type: "submit",
1150
- variant: "primary",
1151
- size: "lg",
1152
- disabled: isLoading || !email,
1153
- className: "ds-forgot__submit",
1154
- children: isLoading ? /* @__PURE__ */ jsx("span", { className: "ds-forgot__spinner" }) : l.resetPasswordButton
1155
- }
1156
- )
1157
- ] }),
1158
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__footer", children: /* @__PURE__ */ jsxs(
1159
- "button",
1160
- {
1161
- type: "button",
1162
- className: "ds-forgot__back",
1163
- onClick: onBackToLogin,
1164
- disabled: isLoading,
1165
- children: [
1166
- /* @__PURE__ */ jsx(
1167
- "svg",
1168
- {
1169
- width: "16",
1170
- height: "16",
1171
- viewBox: "0 0 16 16",
1172
- fill: "none",
1173
- stroke: "currentColor",
1174
- strokeWidth: "1.5",
1175
- strokeLinecap: "round",
1176
- strokeLinejoin: "round",
1177
- children: /* @__PURE__ */ jsx("path", { d: "M10 12L6 8L10 4" })
1178
- }
1179
- ),
1180
- l.backToLoginButton
1181
- ]
1182
- }
1183
- ) })
1184
- ] })
1185
- ] });
1186
- }
1187
- if (step === "sent") {
1188
- return /* @__PURE__ */ jsxs("div", { className: clsx4("ds-forgot", className), children: [
1189
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--1", "aria-hidden": "true" }),
1190
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--2", "aria-hidden": "true" }),
1191
- /* @__PURE__ */ jsxs("div", { className: "ds-forgot__card ds-forgot__card--centered", children: [
1192
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__success-icon", children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 64 64", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
1193
- /* @__PURE__ */ jsx("circle", { cx: "32", cy: "32", r: "30", stroke: "rgb(var(--accent-rgb))", strokeWidth: "2" }),
1194
- /* @__PURE__ */ jsx(
1195
- "path",
1196
- {
1197
- d: "M20 32L44 32M44 32L36 24M44 32L36 40",
1198
- stroke: "rgb(var(--accent-rgb))",
1199
- strokeWidth: "3",
1200
- strokeLinecap: "round",
1201
- strokeLinejoin: "round"
1202
- }
1203
- )
1204
- ] }) }),
1205
- /* @__PURE__ */ jsx("h1", { className: "ds-forgot__title", children: l.checkYourEmailTitle }),
1206
- /* @__PURE__ */ jsxs("p", { className: "ds-forgot__tagline", children: [
1207
- l.passwordResetLinkTagline,
1208
- /* @__PURE__ */ jsx("br", {}),
1209
- /* @__PURE__ */ jsx("strong", { children: email || initialEmail })
1210
- ] }),
1211
- /* @__PURE__ */ jsxs("div", { className: "ds-forgot__hint", children: [
1212
- /* @__PURE__ */ jsx("span", { children: l.didNotReceiveEmailHint }),
1213
- /* @__PURE__ */ jsx(
1214
- "button",
1215
- {
1216
- type: "button",
1217
- className: "ds-forgot__link",
1218
- onClick: handleResendClick,
1219
- disabled: isLoading || resendTimer > 0,
1220
- children: resendTimer > 0 ? `${l.clickToResendButton} ${resendTimer}s` : l.clickToResendButton
1221
- }
1222
- )
1223
- ] }),
1224
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__footer", children: /* @__PURE__ */ jsxs(
1225
- "button",
1226
- {
1227
- type: "button",
1228
- className: "ds-forgot__back",
1229
- onClick: onBackToLogin,
1230
- disabled: isLoading,
1231
- children: [
1232
- /* @__PURE__ */ jsx(
1233
- "svg",
1234
- {
1235
- width: "16",
1236
- height: "16",
1237
- viewBox: "0 0 16 16",
1238
- fill: "none",
1239
- stroke: "currentColor",
1240
- strokeWidth: "1.5",
1241
- strokeLinecap: "round",
1242
- strokeLinejoin: "round",
1243
- children: /* @__PURE__ */ jsx("path", { d: "M10 12L6 8L10 4" })
1244
- }
1245
- ),
1246
- l.backToLoginButton
1247
- ]
1248
- }
1249
- ) })
1250
- ] })
1251
- ] });
1252
- }
1253
- if (step === "reset") {
1254
- const passwordsMatch = password === confirmPassword;
1255
- const isValid = password.length >= 8 && passwordsMatch;
1256
- return /* @__PURE__ */ jsxs("div", { className: clsx4("ds-forgot", className), children: [
1257
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--1", "aria-hidden": "true" }),
1258
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--2", "aria-hidden": "true" }),
1259
- /* @__PURE__ */ jsxs("div", { className: "ds-forgot__card", children: [
1260
- /* @__PURE__ */ jsxs("div", { className: "ds-forgot__header", children: [
1261
- renderLogo(),
1262
- /* @__PURE__ */ jsx("h1", { className: "ds-forgot__title", children: l.setNewPasswordTitle }),
1263
- /* @__PURE__ */ jsx("p", { className: "ds-forgot__tagline", children: l.mustBeCharactersTagline })
1264
- ] }),
1265
- error && /* @__PURE__ */ jsxs("div", { className: "ds-forgot__error", children: [
1266
- /* @__PURE__ */ jsxs(
1267
- "svg",
1268
- {
1269
- width: "16",
1270
- height: "16",
1271
- viewBox: "0 0 16 16",
1272
- fill: "none",
1273
- xmlns: "http://www.w3.org/2000/svg",
1274
- children: [
1275
- /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", r: "7", stroke: "currentColor", strokeWidth: "1.5" }),
1276
- /* @__PURE__ */ jsx(
1277
- "path",
1278
- {
1279
- d: "M8 4.5V8.5",
1280
- stroke: "currentColor",
1281
- strokeWidth: "1.5",
1282
- strokeLinecap: "round"
1283
- }
1284
- ),
1285
- /* @__PURE__ */ jsx("circle", { cx: "8", cy: "11", r: "0.75", fill: "currentColor" })
1286
- ]
1287
- }
1288
- ),
1289
- /* @__PURE__ */ jsx("span", { children: error })
1290
- ] }),
1291
- /* @__PURE__ */ jsxs("form", { className: "ds-forgot__form", onSubmit: handleResetSubmit, children: [
1292
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__field", children: /* @__PURE__ */ jsxs("div", { className: "ds-forgot__password-wrapper", children: [
1293
- /* @__PURE__ */ jsx(
1294
- TextField,
1295
- {
1296
- label: l.passwordLabel,
1297
- type: showPassword ? "text" : "password",
1298
- placeholder: l.enterNewPasswordPlaceholder,
1299
- value: password,
1300
- onChange: (e) => setPassword(e.target.value),
1301
- disabled: isLoading,
1302
- autoComplete: "new-password"
1303
- }
1304
- ),
1305
- /* @__PURE__ */ jsx(
1306
- "button",
1307
- {
1308
- type: "button",
1309
- className: "ds-forgot__password-toggle",
1310
- onClick: () => setShowPassword(!showPassword),
1311
- "aria-label": showPassword ? l.hidePasswordLabel : l.showPasswordLabel,
1312
- children: showPassword ? /* @__PURE__ */ jsxs(
1313
- "svg",
1314
- {
1315
- width: "20",
1316
- height: "20",
1317
- viewBox: "0 0 24 24",
1318
- fill: "none",
1319
- stroke: "currentColor",
1320
- strokeWidth: "2",
1321
- strokeLinecap: "round",
1322
- strokeLinejoin: "round",
1323
- children: [
1324
- /* @__PURE__ */ jsx("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }),
1325
- /* @__PURE__ */ jsx("line", { x1: "1", y1: "1", x2: "23", y2: "23" })
1326
- ]
1327
- }
1328
- ) : /* @__PURE__ */ jsxs(
1329
- "svg",
1330
- {
1331
- width: "20",
1332
- height: "20",
1333
- viewBox: "0 0 24 24",
1334
- fill: "none",
1335
- stroke: "currentColor",
1336
- strokeWidth: "2",
1337
- strokeLinecap: "round",
1338
- strokeLinejoin: "round",
1339
- children: [
1340
- /* @__PURE__ */ jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }),
1341
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3" })
1342
- ]
1343
- }
1344
- )
1345
- }
1346
- )
1347
- ] }) }),
1348
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__field", children: /* @__PURE__ */ jsx(
1349
- TextField,
1350
- {
1351
- label: l.confirmPasswordLabel,
1352
- type: showPassword ? "text" : "password",
1353
- placeholder: l.confirmNewPasswordPlaceholder,
1354
- value: confirmPassword,
1355
- onChange: (e) => setConfirmPassword(e.target.value),
1356
- disabled: isLoading,
1357
- autoComplete: "new-password",
1358
- error: confirmPassword.length > 0 && !passwordsMatch,
1359
- helperText: confirmPassword.length > 0 && !passwordsMatch ? l.passwordsDontMatchError : void 0
1360
- }
1361
- ) }),
1362
- /* @__PURE__ */ jsx(
1363
- Button,
1364
- {
1365
- type: "submit",
1366
- variant: "primary",
1367
- size: "lg",
1368
- disabled: isLoading || !isValid,
1369
- className: "ds-forgot__submit",
1370
- children: isLoading ? /* @__PURE__ */ jsx("span", { className: "ds-forgot__spinner" }) : l.resetPasswordButton
1371
- }
1372
- )
1373
- ] }),
1374
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__footer", children: /* @__PURE__ */ jsxs(
1375
- "button",
1376
- {
1377
- type: "button",
1378
- className: "ds-forgot__back",
1379
- onClick: onBackToLogin,
1380
- disabled: isLoading,
1381
- children: [
1382
- /* @__PURE__ */ jsx(
1383
- "svg",
1384
- {
1385
- width: "16",
1386
- height: "16",
1387
- viewBox: "0 0 16 16",
1388
- fill: "none",
1389
- stroke: "currentColor",
1390
- strokeWidth: "1.5",
1391
- strokeLinecap: "round",
1392
- strokeLinejoin: "round",
1393
- children: /* @__PURE__ */ jsx("path", { d: "M10 12L6 8L10 4" })
1394
- }
1395
- ),
1396
- l.backToLoginButton
1397
- ]
1398
- }
1399
- ) })
1400
- ] })
1401
- ] });
1402
- }
1403
- return /* @__PURE__ */ jsxs("div", { className: clsx4("ds-forgot", className), children: [
1404
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--1", "aria-hidden": "true" }),
1405
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--2", "aria-hidden": "true" }),
1406
- /* @__PURE__ */ jsxs("div", { className: "ds-forgot__card ds-forgot__card--centered", children: [
1407
- /* @__PURE__ */ jsx("div", { className: "ds-forgot__success-icon ds-forgot__success-icon--check", children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 64 64", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
1408
- /* @__PURE__ */ jsx("circle", { cx: "32", cy: "32", r: "30", stroke: "var(--status-success)", strokeWidth: "2" }),
1409
- /* @__PURE__ */ jsx(
1410
- "path",
1411
- {
1412
- d: "M20 32L28 40L44 24",
1413
- stroke: "var(--status-success)",
1414
- strokeWidth: "3",
1415
- strokeLinecap: "round",
1416
- strokeLinejoin: "round"
1417
- }
1418
- )
1419
- ] }) }),
1420
- /* @__PURE__ */ jsx("h1", { className: "ds-forgot__title", children: l.passwordResetTitle }),
1421
- /* @__PURE__ */ jsxs("p", { className: "ds-forgot__tagline", children: [
1422
- l.passwordSuccessfullyResetTagline,
1423
- /* @__PURE__ */ jsx("br", {}),
1424
- l.clickBelowLogInHint
1425
- ] }),
1426
- /* @__PURE__ */ jsx(Button, { variant: "primary", size: "lg", onClick: onBackToLogin, className: "ds-forgot__submit", children: l.continueToLoginButton })
1427
- ] })
1428
- ] });
1429
- };
1430
- ForgotPassword.displayName = "ForgotPassword";
1431
- var defaultChangeEmailLabels = {
1432
- changeEmailTitle: "Change Email",
1433
- enterNewEmailAndCurrentPasswordTagline: "Enter you new email and the current password.",
1434
- newEmailLabel: "New Email *",
1435
- currentPasswordLabel: "Current Password *",
1436
- forgotPasswordButton: "Forgot password?",
1437
- continueButton: "Continue"
1438
- };
1439
- var ChangeEmail = ({
1440
- labels: customLabels,
1441
- logo,
1442
- onSubmit,
1443
- isLoading = false,
1444
- error,
1445
- className,
1446
- style
1447
- }) => {
1448
- const l = { ...defaultChangeEmailLabels, ...customLabels };
1449
- const [newEmail, setNewEmail] = useState("");
1450
- const [currentPassword, setCurrentPassword] = useState("");
1451
- const [showPassword, setShowPassword] = useState(false);
1452
- const handleSubmit = (e) => {
1453
- e.preventDefault();
1454
- onSubmit?.({ newEmail, currentPassword });
1455
- };
1456
- return /* @__PURE__ */ jsx("div", { className: clsx4("ds-change-email", className), style, children: /* @__PURE__ */ jsxs("div", { className: "ds-change-email__container", children: [
1457
- /* @__PURE__ */ jsx("div", { className: "ds-change-email__accent ds-change-email__accent--1", "aria-hidden": "true" }),
1458
- /* @__PURE__ */ jsx("div", { className: "ds-change-email__accent ds-change-email__accent--2", "aria-hidden": "true" }),
1459
- /* @__PURE__ */ jsxs("div", { className: "ds-change-email__card", children: [
1460
- /* @__PURE__ */ jsxs("div", { className: "ds-change-email__header", children: [
1461
- logo ? /* @__PURE__ */ jsx("div", { className: "ds-change-email__logo", children: logo }) : /* @__PURE__ */ jsx("div", { className: "ds-change-email__logo ds-change-email__logo--default", children: /* @__PURE__ */ jsx("div", { className: "ds-change-email__logo-icon", children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
1462
- /* @__PURE__ */ jsx("rect", { width: "32", height: "32", rx: "8", fill: "url(#logo-gradient)" }),
1463
- /* @__PURE__ */ jsx(
1464
- "path",
1465
- {
1466
- d: "M10 16L14 20L22 12",
1467
- stroke: "white",
1468
- strokeWidth: "2.5",
1469
- strokeLinecap: "round",
1470
- strokeLinejoin: "round"
1471
- }
1472
- ),
1473
- /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: "logo-gradient", x1: "0", y1: "0", x2: "32", y2: "32", children: [
1474
- /* @__PURE__ */ jsx("stop", { stopColor: "rgb(var(--accent-rgb))" }),
1475
- /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "rgb(var(--accent2-rgb))" })
1476
- ] }) })
1477
- ] }) }) }),
1478
- /* @__PURE__ */ jsx("h1", { className: "ds-change-email__title", children: l.changeEmailTitle }),
1479
- /* @__PURE__ */ jsx("p", { className: "ds-change-email__tagline", children: l.enterNewEmailAndCurrentPasswordTagline })
1480
- ] }),
1481
- error && /* @__PURE__ */ jsxs("div", { className: "ds-change-email__error", children: [
1482
- /* @__PURE__ */ jsxs(
1483
- "svg",
1484
- {
1485
- width: "16",
1486
- height: "16",
1487
- viewBox: "0 0 16 16",
1488
- fill: "none",
1489
- xmlns: "http://www.w3.org/2000/svg",
1490
- children: [
1491
- /* @__PURE__ */ jsx("circle", { cx: "8", cy: "8", r: "7", stroke: "currentColor", strokeWidth: "1.5" }),
1492
- /* @__PURE__ */ jsx("path", { d: "M8 4.5V8.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
1493
- /* @__PURE__ */ jsx("circle", { cx: "8", cy: "11", r: "0.75", fill: "currentColor" })
1494
- ]
1495
- }
1496
- ),
1497
- /* @__PURE__ */ jsx("span", { children: error })
1498
- ] }),
1499
- /* @__PURE__ */ jsxs("form", { className: "ds-change-email__form", onSubmit: handleSubmit, children: [
1500
- /* @__PURE__ */ jsx("div", { className: "ds-change-email__field", children: /* @__PURE__ */ jsx(
1501
- TextField,
1502
- {
1503
- label: l.newEmailLabel,
1504
- type: "email",
1505
- placeholder: "",
1506
- value: newEmail,
1507
- onChange: (e) => setNewEmail(e.target.value),
1508
- disabled: isLoading,
1509
- autoComplete: "email"
1510
- }
1511
- ) }),
1512
- /* @__PURE__ */ jsx("div", { className: "ds-change-email__field", children: /* @__PURE__ */ jsx(
1513
- TextField,
1514
- {
1515
- label: l.currentPasswordLabel,
1516
- type: showPassword ? "text" : "password",
1517
- placeholder: "",
1518
- value: currentPassword,
1519
- onChange: (e) => setCurrentPassword(e.target.value),
1520
- disabled: isLoading,
1521
- autoComplete: "current-password",
1522
- endAdornment: /* @__PURE__ */ jsx(
1523
- "button",
1524
- {
1525
- type: "button",
1526
- className: "ds-change-email__password-toggle",
1527
- onClick: () => setShowPassword(!showPassword),
1528
- "aria-label": showPassword ? "Hide password" : "Show password",
1529
- children: showPassword ? /* @__PURE__ */ jsxs(
1530
- "svg",
1531
- {
1532
- width: "20",
1533
- height: "20",
1534
- viewBox: "0 0 24 24",
1535
- fill: "none",
1536
- stroke: "currentColor",
1537
- strokeWidth: "2",
1538
- strokeLinecap: "round",
1539
- strokeLinejoin: "round",
1540
- children: [
1541
- /* @__PURE__ */ jsx("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }),
1542
- /* @__PURE__ */ jsx("line", { x1: "1", y1: "1", x2: "23", y2: "23" })
1543
- ]
1544
- }
1545
- ) : /* @__PURE__ */ jsxs(
1546
- "svg",
1547
- {
1548
- width: "20",
1549
- height: "20",
1550
- viewBox: "0 0 24 24",
1551
- fill: "none",
1552
- stroke: "currentColor",
1553
- strokeWidth: "2",
1554
- strokeLinecap: "round",
1555
- strokeLinejoin: "round",
1556
- children: [
1557
- /* @__PURE__ */ jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }),
1558
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3" })
1559
- ]
1560
- }
1561
- )
1562
- }
1563
- )
1564
- }
1565
- ) }),
1566
- /* @__PURE__ */ jsx("div", { className: "ds-change-email__options", style: { display: "flex", justifyContent: "flex-end", marginTop: "-8px" }, children: /* @__PURE__ */ jsx(
1567
- "button",
1568
- {
1569
- type: "button",
1570
- className: "ds-change-email__link",
1571
- onClick: () => console.log("Forgot password clicked"),
1572
- disabled: isLoading,
1573
- style: {
1574
- background: "none",
1575
- border: "none",
1576
- color: "var(--text-secondary)",
1577
- cursor: "pointer",
1578
- fontSize: "0.875rem"
1579
- },
1580
- children: l.forgotPasswordButton
1581
- }
1582
- ) }),
1583
- /* @__PURE__ */ jsx("div", { style: { marginTop: "24px" }, children: /* @__PURE__ */ jsx(
1584
- Button,
1585
- {
1586
- type: "submit",
1587
- variant: "primary",
1588
- size: "lg",
1589
- disabled: isLoading || !newEmail || !currentPassword,
1590
- className: "ds-change-email__submit",
1591
- children: isLoading ? /* @__PURE__ */ jsx("span", { className: "ds-change-email__spinner" }) : l.continueButton
1592
- }
1593
- ) })
1594
- ] })
1595
- ] })
1596
- ] }) });
1597
- };
1598
- ChangeEmail.displayName = "Change Email";
1599
- var IconLinkedIn = ({ className, size = 16 }) => /* @__PURE__ */ jsx(
1600
- "svg",
1601
- {
1602
- width: size,
1603
- height: size,
1604
- viewBox: "0 0 24 24",
1605
- fill: "currentColor",
1606
- className,
1607
- xmlns: "http://www.w3.org/2000/svg",
1608
- children: /* @__PURE__ */ jsx("path", { d: "M20.447 20.452H16.892V14.881C16.892 13.553 16.865 11.848 15.043 11.848C13.194 11.848 12.911 13.291 12.911 14.786V20.452H9.356V9.006H12.768V10.57H12.816C13.291 9.67 14.453 8.721 16.184 8.721C19.788 8.721 20.447 11.093 20.447 14.179V20.452ZM5.337 7.433C4.197 7.433 3.274 6.509 3.274 5.37C3.274 4.23 4.197 3.307 5.337 3.307C6.477 3.307 7.4 4.23 7.4 5.37C7.4 6.509 6.477 7.433 5.337 7.433ZM3.563 20.452H7.123V9.006H3.563V20.452Z" })
1609
- }
1610
- );
1611
- var IconMail = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1612
- "svg",
1613
- {
1614
- width: size,
1615
- height: size,
1616
- viewBox: "0 0 24 24",
1617
- fill: "none",
1618
- stroke: "currentColor",
1619
- strokeWidth: "2",
1620
- strokeLinecap: "round",
1621
- strokeLinejoin: "round",
1622
- className,
1623
- children: [
1624
- /* @__PURE__ */ jsx("path", { d: "M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z" }),
1625
- /* @__PURE__ */ jsx("polyline", { points: "22,6 12,13 2,6" })
1626
- ]
1627
- }
1628
- );
1629
- var IconMapPin = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1630
- "svg",
1631
- {
1632
- width: size,
1633
- height: size,
1634
- viewBox: "0 0 24 24",
1635
- fill: "none",
1636
- stroke: "currentColor",
1637
- strokeWidth: "2",
1638
- strokeLinecap: "round",
1639
- strokeLinejoin: "round",
1640
- className,
1641
- children: [
1642
- /* @__PURE__ */ jsx("path", { d: "M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z" }),
1643
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "10", r: "3" })
1644
- ]
1645
- }
1646
- );
1647
- var IconBriefcase = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1648
- "svg",
1649
- {
1650
- width: size,
1651
- height: size,
1652
- viewBox: "0 0 24 24",
1653
- fill: "none",
1654
- stroke: "currentColor",
1655
- strokeWidth: "2",
1656
- strokeLinecap: "round",
1657
- strokeLinejoin: "round",
1658
- className,
1659
- children: [
1660
- /* @__PURE__ */ jsx("rect", { x: "2", y: "7", width: "20", height: "14", rx: "2", ry: "2" }),
1661
- /* @__PURE__ */ jsx("path", { d: "M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16" })
1662
- ]
1663
- }
1664
- );
1665
- var IconSchool = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1666
- "svg",
1667
- {
1668
- width: size,
1669
- height: size,
1670
- viewBox: "0 0 24 24",
1671
- fill: "none",
1672
- stroke: "currentColor",
1673
- strokeWidth: "2",
1674
- strokeLinecap: "round",
1675
- strokeLinejoin: "round",
1676
- className,
1677
- children: [
1678
- /* @__PURE__ */ jsx("path", { d: "M22 10v6M2 10l10-5 10 5-10 5z" }),
1679
- /* @__PURE__ */ jsx("path", { d: "M6 12v5c3 3 9 3 12 0v-5" })
1680
- ]
1681
- }
1682
- );
1683
- var IconChevronDown = ({ className, size = 16 }) => /* @__PURE__ */ jsx(
1684
- "svg",
1685
- {
1686
- width: size,
1687
- height: size,
1688
- viewBox: "0 0 24 24",
1689
- fill: "none",
1690
- stroke: "currentColor",
1691
- strokeWidth: "2",
1692
- strokeLinecap: "round",
1693
- strokeLinejoin: "round",
1694
- className,
1695
- children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
1696
- }
1697
- );
1698
- var IconChevronUp = ({ className, size = 16 }) => /* @__PURE__ */ jsx(
1699
- "svg",
1700
- {
1701
- width: size,
1702
- height: size,
1703
- viewBox: "0 0 24 24",
1704
- fill: "none",
1705
- stroke: "currentColor",
1706
- strokeWidth: "2",
1707
- strokeLinecap: "round",
1708
- strokeLinejoin: "round",
1709
- className,
1710
- children: /* @__PURE__ */ jsx("polyline", { points: "18 15 12 9 6 15" })
1711
- }
1712
- );
1713
- var IconRefresh = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1714
- "svg",
1715
- {
1716
- width: size,
1717
- height: size,
1718
- viewBox: "0 0 24 24",
1719
- fill: "none",
1720
- stroke: "currentColor",
1721
- strokeWidth: "2",
1722
- strokeLinecap: "round",
1723
- strokeLinejoin: "round",
1724
- className,
1725
- children: [
1726
- /* @__PURE__ */ jsx("path", { d: "M23 4v6h-6" }),
1727
- /* @__PURE__ */ jsx("path", { d: "M1 20v-6h6" }),
1728
- /* @__PURE__ */ jsx("path", { d: "M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15" })
1729
- ]
1730
- }
1731
- );
1732
- var IconCheck = ({ className, size = 16 }) => /* @__PURE__ */ jsx(
1733
- "svg",
1734
- {
1735
- width: size,
1736
- height: size,
1737
- viewBox: "0 0 24 24",
1738
- fill: "none",
1739
- stroke: "currentColor",
1740
- strokeWidth: "2",
1741
- strokeLinecap: "round",
1742
- strokeLinejoin: "round",
1743
- className,
1744
- children: /* @__PURE__ */ jsx("polyline", { points: "20 6 9 17 4 12" })
1745
- }
1746
- );
1747
- var IconLock = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1748
- "svg",
1749
- {
1750
- width: size,
1751
- height: size,
1752
- viewBox: "0 0 24 24",
1753
- fill: "none",
1754
- stroke: "currentColor",
1755
- strokeWidth: "2",
1756
- strokeLinecap: "round",
1757
- strokeLinejoin: "round",
1758
- className,
1759
- children: [
1760
- /* @__PURE__ */ jsx("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2", ry: "2" }),
1761
- /* @__PURE__ */ jsx("path", { d: "M7 11V7a5 5 0 0 1 10 0v4" })
1762
- ]
1763
- }
1764
- );
1765
- var IconInfo = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1766
- "svg",
1767
- {
1768
- width: size,
1769
- height: size,
1770
- viewBox: "0 0 24 24",
1771
- fill: "none",
1772
- stroke: "currentColor",
1773
- strokeWidth: "2",
1774
- strokeLinecap: "round",
1775
- strokeLinejoin: "round",
1776
- className,
1777
- children: [
1778
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
1779
- /* @__PURE__ */ jsx("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
1780
- /* @__PURE__ */ jsx("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
1781
- ]
1782
- }
1783
- );
1784
- var IconShieldCheck = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1785
- "svg",
1786
- {
1787
- width: size,
1788
- height: size,
1789
- viewBox: "0 0 24 24",
1790
- fill: "none",
1791
- stroke: "currentColor",
1792
- strokeWidth: "2",
1793
- strokeLinecap: "round",
1794
- strokeLinejoin: "round",
1795
- className,
1796
- children: [
1797
- /* @__PURE__ */ jsx("path", { d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" }),
1798
- /* @__PURE__ */ jsx("path", { d: "M9 12l2 2 4-4" })
1799
- ]
1800
- }
1801
- );
1802
- var IconBrain = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1803
- "svg",
1804
- {
1805
- width: size,
1806
- height: size,
1807
- viewBox: "0 0 24 24",
1808
- fill: "none",
1809
- stroke: "currentColor",
1810
- strokeWidth: "2",
1811
- strokeLinecap: "round",
1812
- strokeLinejoin: "round",
1813
- className,
1814
- children: [
1815
- /* @__PURE__ */ jsx("path", { d: "M12 4.5a2.5 2.5 0 0 0-4.96-.46 2.5 2.5 0 0 0-1.98 3 2.5 2.5 0 0 0-1.32 4.24 3 3 0 0 0 .34 5.58 2.5 2.5 0 0 0 2.96 3.08A2.5 2.5 0 0 0 12 19.5a2.5 2.5 0 0 0 4.96.44 2.5 2.5 0 0 0 2.96-3.08 3 3 0 0 0 .34-5.58 2.5 2.5 0 0 0-1.32-4.24 2.5 2.5 0 0 0-1.98-3A2.5 2.5 0 0 0 12 4.5" }),
1816
- /* @__PURE__ */ jsx("path", { d: "M12 4.5v15" })
1817
- ]
1818
- }
1819
- );
1820
- var IconSparkles = ({ className, size = 16 }) => /* @__PURE__ */ jsx(
1821
- "svg",
1822
- {
1823
- width: size,
1824
- height: size,
1825
- viewBox: "0 0 24 24",
1826
- fill: "none",
1827
- stroke: "currentColor",
1828
- strokeWidth: "2",
1829
- strokeLinecap: "round",
1830
- strokeLinejoin: "round",
1831
- className,
1832
- children: /* @__PURE__ */ jsx("path", { d: "M12 3l1.912 5.813a2 2 0 0 0 1.275 1.275L21 12l-5.813 1.912a2 2 0 0 0-1.275 1.275L12 21l-1.912-5.813a2 2 0 0 0-1.275-1.275L3 12l5.813-1.912a2 2 0 0 0 1.275-1.275L12 3z" })
1833
- }
1834
- );
1835
- var IconTarget = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1836
- "svg",
1837
- {
1838
- width: size,
1839
- height: size,
1840
- viewBox: "0 0 24 24",
1841
- fill: "none",
1842
- stroke: "currentColor",
1843
- strokeWidth: "2",
1844
- strokeLinecap: "round",
1845
- strokeLinejoin: "round",
1846
- className,
1847
- children: [
1848
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
1849
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "6" }),
1850
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "2" })
1851
- ]
1852
- }
1853
- );
1854
- var IconMessageCircle = ({ className, size = 16 }) => /* @__PURE__ */ jsx(
1855
- "svg",
1856
- {
1857
- width: size,
1858
- height: size,
1859
- viewBox: "0 0 24 24",
1860
- fill: "none",
1861
- stroke: "currentColor",
1862
- strokeWidth: "2",
1863
- strokeLinecap: "round",
1864
- strokeLinejoin: "round",
1865
- className,
1866
- children: /* @__PURE__ */ jsx("path", { d: "M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z" })
1867
- }
1868
- );
1869
- var IconZap = ({ className, size = 16 }) => /* @__PURE__ */ jsx(
1870
- "svg",
1871
- {
1872
- width: size,
1873
- height: size,
1874
- viewBox: "0 0 24 24",
1875
- fill: "none",
1876
- stroke: "currentColor",
1877
- strokeWidth: "2",
1878
- strokeLinecap: "round",
1879
- strokeLinejoin: "round",
1880
- className,
1881
- children: /* @__PURE__ */ jsx("polygon", { points: "13 2 3 14 12 14 11 22 21 10 12 10 13 2" })
1882
- }
1883
- );
1884
- var IconTrendingUp = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1885
- "svg",
1886
- {
1887
- width: size,
1888
- height: size,
1889
- viewBox: "0 0 24 24",
1890
- fill: "none",
1891
- stroke: "currentColor",
1892
- strokeWidth: "2",
1893
- strokeLinecap: "round",
1894
- strokeLinejoin: "round",
1895
- className,
1896
- children: [
1897
- /* @__PURE__ */ jsx("polyline", { points: "23 6 13.5 15.5 8.5 10.5 1 18" }),
1898
- /* @__PURE__ */ jsx("polyline", { points: "17 6 23 6 23 12" })
1899
- ]
1900
- }
1901
- );
1902
- var IconAlertTriangle = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1903
- "svg",
1904
- {
1905
- width: size,
1906
- height: size,
1907
- viewBox: "0 0 24 24",
1908
- fill: "none",
1909
- stroke: "currentColor",
1910
- strokeWidth: "2",
1911
- strokeLinecap: "round",
1912
- strokeLinejoin: "round",
1913
- className,
1914
- children: [
1915
- /* @__PURE__ */ jsx("path", { d: "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" }),
1916
- /* @__PURE__ */ jsx("line", { x1: "12", y1: "9", x2: "12", y2: "13" }),
1917
- /* @__PURE__ */ jsx("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
1918
- ]
1919
- }
1920
- );
1921
- var IconUser = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1922
- "svg",
1923
- {
1924
- width: size,
1925
- height: size,
1926
- viewBox: "0 0 24 24",
1927
- fill: "none",
1928
- stroke: "currentColor",
1929
- strokeWidth: "2",
1930
- strokeLinecap: "round",
1931
- strokeLinejoin: "round",
1932
- className,
1933
- children: [
1934
- /* @__PURE__ */ jsx("path", { d: "M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" }),
1935
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "7", r: "4" })
1936
- ]
1937
- }
1938
- );
1939
- var IconClock = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1940
- "svg",
1941
- {
1942
- width: size,
1943
- height: size,
1944
- viewBox: "0 0 24 24",
1945
- fill: "none",
1946
- stroke: "currentColor",
1947
- strokeWidth: "2",
1948
- strokeLinecap: "round",
1949
- strokeLinejoin: "round",
1950
- className,
1951
- children: [
1952
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
1953
- /* @__PURE__ */ jsx("polyline", { points: "12 6 12 12 16 14" })
1954
- ]
1955
- }
1956
- );
1957
- var IconThumbsUp = ({ className, size = 16 }) => /* @__PURE__ */ jsx(
1958
- "svg",
1959
- {
1960
- width: size,
1961
- height: size,
1962
- viewBox: "0 0 24 24",
1963
- fill: "none",
1964
- stroke: "currentColor",
1965
- strokeWidth: "2",
1966
- strokeLinecap: "round",
1967
- strokeLinejoin: "round",
1968
- className,
1969
- children: /* @__PURE__ */ jsx("path", { d: "M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3" })
1970
- }
1971
- );
1972
- var IconThumbsDown = ({ className, size = 16 }) => /* @__PURE__ */ jsx(
1973
- "svg",
1974
- {
1975
- width: size,
1976
- height: size,
1977
- viewBox: "0 0 24 24",
1978
- fill: "none",
1979
- stroke: "currentColor",
1980
- strokeWidth: "2",
1981
- strokeLinecap: "round",
1982
- strokeLinejoin: "round",
1983
- className,
1984
- children: /* @__PURE__ */ jsx("path", { d: "M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17" })
1985
- }
1986
- );
1987
- var IconLightbulb = ({ className, size = 16 }) => /* @__PURE__ */ jsxs(
1988
- "svg",
1989
- {
1990
- width: size,
1991
- height: size,
1992
- viewBox: "0 0 24 24",
1993
- fill: "none",
1994
- stroke: "currentColor",
1995
- strokeWidth: "2",
1996
- strokeLinecap: "round",
1997
- strokeLinejoin: "round",
1998
- className,
1999
- children: [
2000
- /* @__PURE__ */ jsx("path", { d: "M9 18h6" }),
2001
- /* @__PURE__ */ jsx("path", { d: "M10 22h4" }),
2002
- /* @__PURE__ */ jsx("path", { d: "M15.09 14c.18-.98.65-1.74 1.41-2.5A4.65 4.65 0 0 0 18 8 6 6 0 0 0 6 8c0 1 .23 2.23 1.5 3.5A4.61 4.61 0 0 1 8.91 14" })
2003
- ]
2004
- }
2005
- );
2006
- var EmptyStateDisplay = ({ onRefresh }) => {
2007
- return /* @__PURE__ */ jsxs("div", { className: "ds-lead-empty", children: [
2008
- /* @__PURE__ */ jsx("div", { className: "ds-lead-empty__avatar-container", children: /* @__PURE__ */ jsxs("div", { className: "ds-lead-empty__avatar", children: [
2009
- /* @__PURE__ */ jsx("div", { className: "ds-lead-empty__avatar-pulse" }),
2010
- /* @__PURE__ */ jsx("div", { className: "ds-lead-empty__avatar-icon", children: /* @__PURE__ */ jsx(IconSparkles, { size: 32 }) })
2011
- ] }) }),
2012
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-empty__content", children: [
2013
- /* @__PURE__ */ jsx("h2", { className: "ds-lead-empty__title", children: "Discover Who They Really Are" }),
2014
- /* @__PURE__ */ jsx("p", { className: "ds-lead-empty__description", children: "Our AI analyzes behavioral patterns, communication style, and personality signals to help you connect more effectively." })
2015
- ] }),
2016
- onRefresh && /* @__PURE__ */ jsx("div", { className: "ds-lead-empty__action", children: /* @__PURE__ */ jsxs(Button, { onClick: onRefresh, variant: "primary", size: "lg", children: [
2017
- /* @__PURE__ */ jsx(IconRefresh, {}),
2018
- " Begin Analysis"
2019
- ] }) }),
2020
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-empty__trust", children: [
2021
- /* @__PURE__ */ jsxs("span", { className: "ds-lead-empty__trust-item", children: [
2022
- /* @__PURE__ */ jsx("span", { className: "ds-lead-empty__trust-dot" }),
2023
- "Privacy-first approach"
2024
- ] }),
2025
- /* @__PURE__ */ jsxs("span", { className: "ds-lead-empty__trust-item", children: [
2026
- /* @__PURE__ */ jsx("span", { className: "ds-lead-empty__trust-dot" }),
2027
- "Public data only"
2028
- ] }),
2029
- /* @__PURE__ */ jsxs("span", { className: "ds-lead-empty__trust-item", children: [
2030
- /* @__PURE__ */ jsx("span", { className: "ds-lead-empty__trust-dot" }),
2031
- "~2 min analysis"
2032
- ] })
2033
- ] })
2034
- ] });
2035
- };
2036
- var ANALYSIS_STAGES = [
2037
- { id: "identity", label: "Verifying Identity", icon: IconUser },
2038
- { id: "behavior", label: "Analyzing Behavior", icon: IconBrain },
2039
- { id: "communication", label: "Mapping Communication Style", icon: IconMessageCircle },
2040
- { id: "personality", label: "Building Personality Profile", icon: IconSparkles }
2041
- ];
2042
- var LoadingStateDisplay = ({ progress }) => {
2043
- const currentStage = progress?.currentStage || "identity";
2044
- const completedStages = progress?.completedStages || [];
2045
- const estimatedTime = progress?.estimatedTimeRemaining;
2046
- const getStageStatus = (stageId) => {
2047
- if (completedStages.includes(stageId)) {
2048
- return "completed";
2049
- }
2050
- if (stageId === currentStage) {
2051
- return "active";
2052
- }
2053
- return "pending";
2054
- };
2055
- const completionPercentage = Math.round(
2056
- (completedStages.length + 0.5) / ANALYSIS_STAGES.length * 100
2057
- );
2058
- return /* @__PURE__ */ jsxs("div", { className: "ds-lead-loading", children: [
2059
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-loading__progress", children: [
2060
- /* @__PURE__ */ jsx("div", { className: "ds-lead-loading__progress-bar", children: /* @__PURE__ */ jsx(
2061
- "div",
2062
- {
2063
- className: "ds-lead-loading__progress-fill",
2064
- style: { width: `${completionPercentage}%` }
2065
- }
2066
- ) }),
2067
- /* @__PURE__ */ jsxs("span", { className: "ds-lead-loading__progress-text", children: [
2068
- completionPercentage,
2069
- "% complete"
2070
- ] })
2071
- ] }),
2072
- /* @__PURE__ */ jsx("div", { className: "ds-lead-loading__stages", children: ANALYSIS_STAGES.map((stage, index) => {
2073
- const status = getStageStatus(stage.id);
2074
- const Icon = stage.icon;
2075
- return /* @__PURE__ */ jsxs(
2076
- "div",
2077
- {
2078
- className: clsx4("ds-lead-loading__stage", `ds-lead-loading__stage--${status}`),
2079
- style: { "--stage-index": index },
2080
- children: [
2081
- /* @__PURE__ */ jsx("div", { className: "ds-lead-loading__stage-icon", children: status === "completed" ? /* @__PURE__ */ jsx(IconCheck, { size: 16 }) : /* @__PURE__ */ jsx(Icon, { size: 16 }) }),
2082
- /* @__PURE__ */ jsx("span", { className: "ds-lead-loading__stage-label", children: stage.label }),
2083
- status === "active" && /* @__PURE__ */ jsx("div", { className: "ds-lead-loading__stage-pulse" })
2084
- ]
2085
- },
2086
- stage.id
2087
- );
2088
- }) }),
2089
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-loading__footer", children: [
2090
- estimatedTime && estimatedTime > 0 ? /* @__PURE__ */ jsxs("p", { className: "ds-lead-loading__time", children: [
2091
- "About ",
2092
- Math.ceil(estimatedTime / 60),
2093
- " minute",
2094
- estimatedTime > 60 ? "s" : "",
2095
- " remaining"
2096
- ] }) : /* @__PURE__ */ jsx("p", { className: "ds-lead-loading__time", children: "This typically takes 1\u20132 minutes" }),
2097
- /* @__PURE__ */ jsx("p", { className: "ds-lead-loading__message", children: progress?.message || "Analyzing publicly available information..." })
2098
- ] })
2099
- ] });
2100
- };
2101
- var UtmContext = createContext(null);
2102
-
2103
- // src/web/utm/useUtmDefaults.ts
2104
- function useUtmDefaults() {
2105
- return useContext(UtmContext);
2106
- }
2107
-
2108
- // src/web/utm/builders.ts
2109
- var PLACEHOLDER_ORIGIN = "https://__placeholder__.internal";
2110
- function buildUtmUrl(baseUrl, params) {
2111
- const isRelative = baseUrl.startsWith("/");
2112
- let url;
2113
- try {
2114
- url = isRelative ? new URL(baseUrl, PLACEHOLDER_ORIGIN) : new URL(baseUrl);
2115
- } catch {
2116
- return baseUrl;
2117
- }
2118
- const existingParams = [];
2119
- url.searchParams.forEach((value, key) => {
2120
- existingParams.push([key, value]);
2121
- });
2122
- for (const [key] of existingParams) {
2123
- url.searchParams.delete(key);
2124
- }
2125
- for (const [key, value] of existingParams) {
2126
- if (!key.startsWith("utm_")) {
2127
- url.searchParams.set(key, value);
2128
- }
2129
- }
2130
- url.searchParams.set("utm_source", params.source);
2131
- url.searchParams.set("utm_medium", params.medium);
2132
- url.searchParams.set("utm_campaign", params.campaign);
2133
- if (params.term !== void 0) {
2134
- url.searchParams.set("utm_term", params.term);
2135
- }
2136
- if (params.content !== void 0) {
2137
- url.searchParams.set("utm_content", params.content);
2138
- }
2139
- if (isRelative) {
2140
- return url.href.replace(PLACEHOLDER_ORIGIN, "");
2141
- }
2142
- return url.href;
2143
- }
2144
-
2145
- // src/web/utm/classifiers.ts
2146
- var INTERNAL_PATTERNS = [
2147
- /^\/(?!\/)/,
2148
- // Relative paths
2149
- /^https?:\/\/(www\.)?sales-mind\.ai/i,
2150
- // Marketing site
2151
- /^https?:\/\/app\.sales-mind\.ai/i,
2152
- // Web app
2153
- /^https?:\/\/apps\.sales-mind\.ai/i,
2154
- // Web app (legacy)
2155
- /^https?:\/\/meet\.sales-mind\.ai/i,
2156
- // Booking
2157
- /^https?:\/\/docs\.sales-mind\.ai/i
2158
- // Docs
2159
- ];
2160
- var SYSTEM_PATTERNS = [
2161
- /^https?:\/\/.*\/api\//i,
2162
- // API endpoints
2163
- /^https?:\/\/.*\/webhook/i,
2164
- // Webhooks
2165
- /^https?:\/\/.*\/oauth/i,
2166
- // OAuth callbacks
2167
- /^https?:\/\/.*\/callback/i,
2168
- // Callbacks
2169
- /^https?:\/\/.*\.supabase\.(co|com)/i,
2170
- // Supabase
2171
- /^https?:\/\/.*\.firebaseapp\.com/i,
2172
- // Firebase
2173
- /^https?:\/\/.*\.cloudfunctions\.net/i
2174
- // Cloud Functions
2175
- ];
2176
- var ASSET_PATTERNS = [
2177
- /\.(css|js|mjs|map|woff2?|ttf|eot|svg|png|jpe?g|gif|webp|avif|ico|pdf)(\?.*)?$/i
2178
- ];
2179
- var CONVERSION_PATTERNS = [
2180
- /^https?:\/\/(www\.)?calendly\.com/i,
2181
- /^https?:\/\/(checkout\.)?stripe\.com/i,
2182
- /^https?:\/\/buy\.stripe\.com/i,
2183
- /^https?:\/\/chromewebstore\.google\.com/i,
2184
- /^https?:\/\/meet\.sales-mind\.ai/i
2185
- ];
2186
- var PROTOCOL_EXEMPT = [
2187
- /^mailto:/i,
2188
- /^tel:/i,
2189
- /^#/,
2190
- /^javascript:/i
2191
- ];
2192
- function classifyUrl(url) {
2193
- if (PROTOCOL_EXEMPT.some((p) => p.test(url))) return "protocol";
2194
- if (ASSET_PATTERNS.some((p) => p.test(url))) return "asset";
2195
- if (SYSTEM_PATTERNS.some((p) => p.test(url))) return "system";
2196
- if (CONVERSION_PATTERNS.some((p) => p.test(url))) return "conversion";
2197
- if (INTERNAL_PATTERNS.some((p) => p.test(url))) return "internal";
2198
- return "external";
2199
- }
2200
-
2201
- // src/components/OutboundLink/outbound-link-utils.ts
2202
- var LEGACY_UTM_SOURCE = "salesmind";
2203
- var EXEMPT_PATTERNS = [
2204
- /^https?:\/\/(www\.)?(stripe\.com|checkout\.stripe\.com|paypal\.com)/i,
2205
- /^https?:\/\/(www\.)?github\.com\/login\/oauth/i
2206
- ];
2207
- var isExemptUrl = (urlStr) => {
2208
- if (urlStr.startsWith("mailto:") || urlStr.startsWith("tel:")) return true;
2209
- const classification = classifyUrl(urlStr);
2210
- if (classification === "system" || classification === "protocol" || classification === "asset") {
2211
- return true;
2212
- }
2213
- return EXEMPT_PATTERNS.some((pattern) => pattern.test(urlStr));
2214
- };
2215
- var appendGovernedUTMs = (href, params, preserveExisting = true) => {
2216
- try {
2217
- const url = new URL(href);
2218
- if (preserveExisting) {
2219
- const hasAll = url.searchParams.has("utm_source") && url.searchParams.has("utm_medium") && url.searchParams.has("utm_campaign");
2220
- if (hasAll) return href;
2221
- }
2222
- return buildUtmUrl(href, params);
2223
- } catch {
2224
- return href;
2225
- }
2226
- };
2227
- var appendUTMs = (href, context, pageSlug, options) => {
2228
- try {
2229
- const url = new URL(href);
2230
- const { mediumOverride = "outbound_link", campaignOverride, preserveExisting = true } = options;
2231
- const utms = {
2232
- utm_source: LEGACY_UTM_SOURCE,
2233
- utm_medium: mediumOverride,
2234
- utm_campaign: campaignOverride || pageSlug,
2235
- utm_content: context
2236
- };
2237
- Object.entries(utms).forEach(([key, value]) => {
2238
- if (value) {
2239
- if (preserveExisting && url.searchParams.has(key)) {
2240
- return;
2241
- }
2242
- url.searchParams.set(key, value);
2243
- }
2244
- });
2245
- return url.toString();
2246
- } catch {
2247
- return href;
2248
- }
2249
- };
2250
- var OutboundLink = forwardRef(
2251
- ({
2252
- href,
2253
- context,
2254
- campaignOverride,
2255
- mediumOverride = "outbound_link",
2256
- preserveExistingUTM = true,
2257
- openInNewTab = true,
2258
- disableTracking = false,
2259
- utmParams,
2260
- onClick,
2261
- children,
2262
- ...props
2263
- }, ref) => {
2264
- const contextParams = useUtmDefaults();
2265
- const resolvedUtmParams = utmParams ?? contextParams;
2266
- let hostname = "";
2267
- try {
2268
- const url = new URL(href);
2269
- hostname = url.hostname;
2270
- } catch {
2271
- }
2272
- const [finalHref, setFinalHref] = useState(href);
2273
- useEffect(() => {
2274
- let isExternal = false;
2275
- let currentMedium = mediumOverride;
2276
- try {
2277
- const url = new URL(href);
2278
- const currentHost = window.location.hostname;
2279
- isExternal = url.hostname !== currentHost;
2280
- if (isExternal && currentHost.includes("sales-mind.ai") && url.hostname.includes("sales-mind.ai")) {
2281
- if (currentMedium === "outbound_link") {
2282
- currentMedium = "cross_subdomain";
2283
- }
2284
- }
2285
- } catch {
2286
- isExternal = false;
2287
- }
2288
- const isExempt = isExemptUrl(href) || disableTracking;
2289
- if (isExternal && !isExempt) {
2290
- if (resolvedUtmParams) {
2291
- setFinalHref(appendGovernedUTMs(href, resolvedUtmParams, preserveExistingUTM));
2292
- } else {
2293
- const pageSlug = window.location.pathname.replace(/^\/|\/$/g, "") || "home";
2294
- setFinalHref(appendUTMs(href, context, pageSlug, {
2295
- mediumOverride: currentMedium,
2296
- campaignOverride,
2297
- preserveExisting: preserveExistingUTM
2298
- }));
2299
- }
2300
- } else {
2301
- setFinalHref(href);
2302
- }
2303
- }, [href, context, mediumOverride, campaignOverride, preserveExistingUTM, disableTracking, resolvedUtmParams]);
2304
- const handleClick = (e) => {
2305
- if (typeof window === "undefined" || disableTracking) {
2306
- onClick?.(e);
2307
- return;
2308
- }
2309
- let clickExternal = false;
2310
- let clickCrossSubdomain = false;
2311
- let clickMedium = mediumOverride;
2312
- try {
2313
- const url = new URL(href);
2314
- const currentHost = window.location.hostname;
2315
- clickExternal = url.hostname !== currentHost;
2316
- if (clickExternal && currentHost.includes("sales-mind.ai") && url.hostname.includes("sales-mind.ai")) {
2317
- clickCrossSubdomain = true;
2318
- if (clickMedium === "outbound_link") {
2319
- clickMedium = "cross_subdomain";
2320
- }
2321
- }
2322
- } catch {
2323
- }
2324
- if (clickExternal) {
2325
- const detail = {
2326
- destination_domain: hostname,
2327
- destination_url: finalHref,
2328
- utm_medium_type: clickMedium,
2329
- page_slug: window.location.pathname,
2330
- component_location: context,
2331
- timestamp: (/* @__PURE__ */ new Date()).toISOString(),
2332
- is_cross_subdomain: clickCrossSubdomain
2333
- };
2334
- const event = new CustomEvent("outbound_click", { detail });
2335
- window.dispatchEvent(event);
2336
- }
2337
- onClick?.(e);
2338
- };
2339
- const relParts = [];
2340
- let shouldOpenNewTab = openInNewTab;
2341
- try {
2342
- const url = new URL(href);
2343
- if (typeof window !== "undefined") {
2344
- const currentHost = window.location.hostname;
2345
- if (url.hostname !== currentHost && currentHost.includes("sales-mind.ai") && url.hostname.includes("sales-mind.ai")) {
2346
- shouldOpenNewTab = false;
2347
- }
2348
- }
2349
- } catch {
2350
- }
2351
- if (shouldOpenNewTab) relParts.push("noopener", "noreferrer");
2352
- if (mediumOverride === "citation") relParts.push("nofollow");
2353
- const rel = relParts.length > 0 ? relParts.join(" ") : void 0;
2354
- return (
2355
- // eslint-disable-next-line no-restricted-syntax
2356
- /* @__PURE__ */ jsx(
2357
- "a",
2358
- {
2359
- ref,
2360
- href: finalHref,
2361
- target: shouldOpenNewTab ? "_blank" : void 0,
2362
- rel,
2363
- onClick: handleClick,
2364
- ...props,
2365
- children
2366
- }
2367
- )
2368
- );
2369
- }
2370
- );
2371
- OutboundLink.displayName = "OutboundLink";
2372
- var IdentityHeader = ({ data, compact }) => {
2373
- const avatarUrl = data.avatarUrl || `https://ui-avatars.com/api/?name=${encodeURIComponent(data.name)}&background=1a1a2e&color=fff&size=240`;
2374
- const emailStatus = data.contact?.emailStatus;
2375
- const linkedinVerified = data.contact?.linkedinVerified;
2376
- const confidenceScore = data.dataConfidence?.score;
2377
- return /* @__PURE__ */ jsxs("div", { className: clsx4("ds-lead-identity", compact && "ds-lead-identity--compact"), children: [
2378
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-identity__avatar-wrapper", children: [
2379
- /* @__PURE__ */ jsx("img", { src: avatarUrl, alt: data.name, className: "ds-lead-identity__avatar" }),
2380
- confidenceScore && confidenceScore >= 80 && /* @__PURE__ */ jsx("div", { className: "ds-lead-identity__verified-badge", title: "High confidence data", children: /* @__PURE__ */ jsx(IconShieldCheck, { size: 14 }) })
2381
- ] }),
2382
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-identity__content", children: [
2383
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-identity__name-row", children: [
2384
- /* @__PURE__ */ jsx("h1", { className: "ds-lead-identity__name", children: data.name }),
2385
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-identity__badges", children: [
2386
- linkedinVerified && data.contact?.linkedinUrl && /* @__PURE__ */ jsx(
2387
- OutboundLink,
2388
- {
2389
- href: data.contact.linkedinUrl,
2390
- context: "identity-linkedin-badge",
2391
- className: "ds-lead-identity__badge ds-lead-identity__badge--linkedin",
2392
- title: "Verified LinkedIn Profile",
2393
- children: /* @__PURE__ */ jsx(IconLinkedIn, { size: 14 })
2394
- }
2395
- ),
2396
- emailStatus === "verified" && /* @__PURE__ */ jsx(
2397
- "span",
2398
- {
2399
- className: "ds-lead-identity__badge ds-lead-identity__badge--verified",
2400
- title: "Email Verified",
2401
- children: /* @__PURE__ */ jsx(IconMail, { size: 14 })
2402
- }
2403
- )
2404
- ] })
2405
- ] }),
2406
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-identity__role", children: [
2407
- /* @__PURE__ */ jsx("span", { className: "ds-lead-identity__role-title", children: data.role }),
2408
- /* @__PURE__ */ jsx("span", { className: "ds-lead-identity__role-separator", children: "at" }),
2409
- /* @__PURE__ */ jsxs("span", { className: "ds-lead-identity__company", children: [
2410
- data.companyLogo && /* @__PURE__ */ jsx(
2411
- "img",
2412
- {
2413
- src: data.companyLogo,
2414
- alt: data.company,
2415
- className: "ds-lead-identity__company-logo"
2416
- }
2417
- ),
2418
- data.company
2419
- ] })
2420
- ] }),
2421
- /* @__PURE__ */ jsx("div", { className: "ds-lead-identity__meta", children: /* @__PURE__ */ jsxs("span", { className: "ds-lead-identity__meta-item", children: [
2422
- /* @__PURE__ */ jsx(IconMapPin, { size: 14 }),
2423
- data.location
2424
- ] }) }),
2425
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-identity__actions", children: [
2426
- data.contact?.email && /* @__PURE__ */ jsxs(
2427
- OutboundLink,
2428
- {
2429
- href: `mailto:${data.contact.email}`,
2430
- context: "identity-email-contact",
2431
- openInNewTab: false,
2432
- className: clsx4(
2433
- "ds-lead-identity__contact",
2434
- emailStatus && `ds-lead-identity__contact--${emailStatus}`
2435
- ),
2436
- children: [
2437
- /* @__PURE__ */ jsx(IconMail, { size: 14 }),
2438
- /* @__PURE__ */ jsx("span", { className: "ds-lead-identity__contact-email", children: data.contact.email }),
2439
- emailStatus && /* @__PURE__ */ jsxs("span", { className: "ds-lead-identity__contact-status", children: [
2440
- emailStatus === "verified" && "Verified",
2441
- emailStatus === "valid" && "Valid",
2442
- emailStatus === "risky" && "Risky",
2443
- emailStatus === "invalid" && "Invalid"
2444
- ] })
2445
- ]
2446
- }
2447
- ),
2448
- data.lastUpdated && /* @__PURE__ */ jsxs("span", { className: "ds-lead-identity__freshness", children: [
2449
- /* @__PURE__ */ jsx(IconClock, { size: 12 }),
2450
- "Updated ",
2451
- data.lastUpdated
2452
- ] })
2453
- ] }),
2454
- confidenceScore !== void 0 && /* @__PURE__ */ jsxs("div", { className: "ds-lead-identity__confidence", children: [
2455
- /* @__PURE__ */ jsx("div", { className: "ds-lead-identity__confidence-bar", children: /* @__PURE__ */ jsx(
2456
- "div",
2457
- {
2458
- className: "ds-lead-identity__confidence-fill",
2459
- style: { width: `${confidenceScore}%` }
2460
- }
2461
- ) }),
2462
- /* @__PURE__ */ jsxs("span", { className: "ds-lead-identity__confidence-label", children: [
2463
- confidenceScore,
2464
- "% data confidence"
2465
- ] })
2466
- ] })
2467
- ] })
2468
- ] });
2469
- };
2470
- var IntelligenceSummary = ({
2471
- data,
2472
- isLocked = false
2473
- }) => {
2474
- if (isLocked) {
2475
- return /* @__PURE__ */ jsx("div", { className: "ds-lead-intelligence", children: /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__grid", children: [
2476
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__card ds-lead-intelligence__card--locked", children: [
2477
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__card-header", children: [
2478
- /* @__PURE__ */ jsx(IconBrain, { size: 20 }),
2479
- /* @__PURE__ */ jsx("span", { className: "ds-lead-intelligence__card-title", children: "Personality Analysis" })
2480
- ] }),
2481
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__locked-content", children: [
2482
- /* @__PURE__ */ jsx("div", { className: "ds-lead-intelligence__locked-icon", children: /* @__PURE__ */ jsx(IconLock, { size: 24 }) }),
2483
- /* @__PURE__ */ jsx("p", { className: "ds-lead-intelligence__locked-text", children: "Personality analysis in progress..." }),
2484
- /* @__PURE__ */ jsx("div", { className: "ds-lead-intelligence__locked-shimmer" })
2485
- ] })
2486
- ] }),
2487
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__card ds-lead-intelligence__card--locked", children: [
2488
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__card-header", children: [
2489
- /* @__PURE__ */ jsx(IconTarget, { size: 20 }),
2490
- /* @__PURE__ */ jsx("span", { className: "ds-lead-intelligence__card-title", children: "Engagement Strategy" })
2491
- ] }),
2492
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__locked-content", children: [
2493
- /* @__PURE__ */ jsx("div", { className: "ds-lead-intelligence__locked-icon", children: /* @__PURE__ */ jsx(IconLock, { size: 24 }) }),
2494
- /* @__PURE__ */ jsx("p", { className: "ds-lead-intelligence__locked-text", children: "Building engagement recommendations..." }),
2495
- /* @__PURE__ */ jsx("div", { className: "ds-lead-intelligence__locked-shimmer" })
2496
- ] })
2497
- ] })
2498
- ] }) });
2499
- }
2500
- if (!data.personalitySummary && !data.engagementTips?.length) {
2501
- return null;
2502
- }
2503
- return /* @__PURE__ */ jsx("div", { className: "ds-lead-intelligence", children: /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__grid", children: [
2504
- data.personalitySummary && /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__card ds-lead-intelligence__card--personality", children: [
2505
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__card-header", children: [
2506
- /* @__PURE__ */ jsx(IconBrain, { size: 20 }),
2507
- /* @__PURE__ */ jsx("span", { className: "ds-lead-intelligence__card-title", children: "Personality Analysis" })
2508
- ] }),
2509
- /* @__PURE__ */ jsx("p", { className: "ds-lead-intelligence__narrative", children: data.personalitySummary }),
2510
- data.mbtiType && /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__mbti-badge", children: [
2511
- /* @__PURE__ */ jsx("span", { className: "ds-lead-intelligence__mbti-type", children: data.mbtiType }),
2512
- /* @__PURE__ */ jsx("span", { className: "ds-lead-intelligence__mbti-label", children: "Personality Type" })
2513
- ] })
2514
- ] }),
2515
- data.engagementTips && data.engagementTips.length > 0 && /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__card ds-lead-intelligence__card--engagement", children: [
2516
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__card-header", children: [
2517
- /* @__PURE__ */ jsx(IconTarget, { size: 20 }),
2518
- /* @__PURE__ */ jsx("span", { className: "ds-lead-intelligence__card-title", children: "How to Engage" })
2519
- ] }),
2520
- /* @__PURE__ */ jsx("div", { className: "ds-lead-intelligence__tips", children: data.engagementTips.map((tip, index) => /* @__PURE__ */ jsxs(
2521
- "div",
2522
- {
2523
- className: clsx4(
2524
- "ds-lead-intelligence__tip",
2525
- `ds-lead-intelligence__tip--${tip.type}`
2526
- ),
2527
- children: [
2528
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__tip-icon", children: [
2529
- tip.type === "do" && /* @__PURE__ */ jsx(IconThumbsUp, { size: 14 }),
2530
- tip.type === "dont" && /* @__PURE__ */ jsx(IconThumbsDown, { size: 14 }),
2531
- tip.type === "insight" && /* @__PURE__ */ jsx(IconLightbulb, { size: 14 })
2532
- ] }),
2533
- /* @__PURE__ */ jsxs("div", { className: "ds-lead-intelligence__tip-content", children: [
2534
- /* @__PURE__ */ jsx("span", { className: "ds-lead-intelligence__tip-text", children: tip.text }),
2535
- tip.detail && /* @__PURE__ */ jsx("span", { className: "ds-lead-intelligence__tip-detail", children: tip.detail })
2536
- ] })
2537
- ]
2538
- },
2539
- index
2540
- )) })
2541
- ] })
2542
- ] }) });
2543
- };
2544
- var DIMENSION_TOOLTIPS = {
2545
- energy: {
2546
- left: "Gains energy from social interaction and external activities",
2547
- right: "Recharges through solitude and internal reflection",
2548
- description: "Where you direct and receive energy"
2549
- },
2550
- mind: {
2551
- left: "Focuses on patterns, possibilities, and abstract thinking",
2552
- right: "Prefers concrete facts, details, and practical approaches",
2553
- description: "How you process information"
2554
- },
2555
- nature: {
2556
- left: "Prioritizes logic, consistency, and objective analysis",
2557
- right: "Values harmony, empathy, and personal considerations",
2558
- description: "How you make decisions"
2559
- },
2560
- tactics: {
2561
- left: "Prefers structure, planning, and decisive action",
2562
- right: "Favors flexibility, spontaneity, and keeping options open",
2563
- description: "How you organize your life"
2564
- }
2565
- };
2566
- var MBTISpectrum = ({
2567
- scores,
2568
- mbtiType,
2569
- isLocked = false
2570
- }) => {
2571
- const [hoveredDimension, setHoveredDimension] = useState(null);
2572
- if (isLocked) {
2573
- return /* @__PURE__ */ jsxs("div", { className: "ds-mbti ds-mbti--locked", children: [
2574
- /* @__PURE__ */ jsxs("div", { className: "ds-mbti__header", children: [
2575
- /* @__PURE__ */ jsx("h3", { className: "ds-mbti__title", children: "MBTI Personality Dimensions" }),
2576
- /* @__PURE__ */ jsxs("div", { className: "ds-mbti__locked-badge", children: [
2577
- /* @__PURE__ */ jsx(IconLock, { size: 14 }),
2578
- /* @__PURE__ */ jsx("span", { children: "Analysis in progress" })
2579
- ] })
2580
- ] }),
2581
- /* @__PURE__ */ jsx("div", { className: "ds-mbti__locked-content", children: [1, 2, 3, 4].map((i) => /* @__PURE__ */ jsxs("div", { className: "ds-mbti__row ds-mbti__row--locked", children: [
2582
- /* @__PURE__ */ jsx("span", { className: "ds-mbti__label ds-mbti__label--skeleton" }),
2583
- /* @__PURE__ */ jsx("div", { className: "ds-mbti__track ds-mbti__track--skeleton", children: /* @__PURE__ */ jsx("div", { className: "ds-mbti__skeleton-shimmer" }) }),
2584
- /* @__PURE__ */ jsx("span", { className: "ds-mbti__label ds-mbti__label--skeleton" })
2585
- ] }, i)) })
2586
- ] });
2587
- }
2588
- return /* @__PURE__ */ jsxs("div", { className: "ds-mbti", children: [
2589
- /* @__PURE__ */ jsxs("div", { className: "ds-mbti__header", children: [
2590
- /* @__PURE__ */ jsx("h3", { className: "ds-mbti__title", children: "Personality Dimensions" }),
2591
- mbtiType && /* @__PURE__ */ jsx("span", { className: "ds-mbti__type-badge", children: mbtiType })
2592
- ] }),
2593
- /* @__PURE__ */ jsx("div", { className: "ds-mbti__dimensions", children: scores.map((score) => {
2594
- const tooltip = DIMENSION_TOOLTIPS[score.dimension];
2595
- const isHovered = hoveredDimension === score.dimension;
2596
- const dominantSide = score.value < 50 ? "left" : "right";
2597
- const intensity = Math.abs(score.value - 50);
2598
- return /* @__PURE__ */ jsxs(
2599
- "div",
2600
- {
2601
- className: clsx4(
2602
- "ds-mbti__row",
2603
- `ds-mbti__row--${score.color}`,
2604
- isHovered && "ds-mbti__row--hovered"
2605
- ),
2606
- onMouseEnter: () => setHoveredDimension(score.dimension),
2607
- onMouseLeave: () => setHoveredDimension(null),
2608
- children: [
2609
- /* @__PURE__ */ jsxs(
2610
- "div",
2611
- {
2612
- className: clsx4(
2613
- "ds-mbti__label",
2614
- "ds-mbti__label--left",
2615
- dominantSide === "left" && "ds-mbti__label--active"
2616
- ),
2617
- children: [
2618
- /* @__PURE__ */ jsx("span", { className: "ds-mbti__label-text", children: score.leftLabel }),
2619
- dominantSide === "left" && /* @__PURE__ */ jsx("span", { className: "ds-mbti__label-strength", children: intensity > 30 ? "Strong" : intensity > 15 ? "Moderate" : "Slight" })
2620
- ]
2621
- }
2622
- ),
2623
- /* @__PURE__ */ jsxs("div", { className: "ds-mbti__track-container", children: [
2624
- /* @__PURE__ */ jsxs("div", { className: clsx4("ds-mbti__track", `ds-mbti__track--${score.color}`), children: [
2625
- /* @__PURE__ */ jsx("div", { className: "ds-mbti__track-center" }),
2626
- /* @__PURE__ */ jsx(
2627
- "div",
2628
- {
2629
- className: "ds-mbti__track-fill",
2630
- style: {
2631
- left: score.value < 50 ? `${score.value}%` : "50%",
2632
- width: `${Math.abs(score.value - 50)}%`
2633
- }
2634
- }
2635
- ),
2636
- /* @__PURE__ */ jsx("div", { className: "ds-mbti__thumb", style: { left: `${score.value}%` }, children: /* @__PURE__ */ jsx("div", { className: "ds-mbti__thumb-glow" }) })
2637
- ] }),
2638
- /* @__PURE__ */ jsx("span", { className: "ds-mbti__dimension-label", children: score.label })
2639
- ] }),
2640
- /* @__PURE__ */ jsxs(
2641
- "div",
2642
- {
2643
- className: clsx4(
2644
- "ds-mbti__label",
2645
- "ds-mbti__label--right",
2646
- dominantSide === "right" && "ds-mbti__label--active"
2647
- ),
2648
- children: [
2649
- /* @__PURE__ */ jsx("span", { className: "ds-mbti__label-text", children: score.rightLabel }),
2650
- dominantSide === "right" && /* @__PURE__ */ jsx("span", { className: "ds-mbti__label-strength", children: intensity > 30 ? "Strong" : intensity > 15 ? "Moderate" : "Slight" })
2651
- ]
2652
- }
2653
- ),
2654
- /* @__PURE__ */ jsx(
2655
- "button",
2656
- {
2657
- className: "ds-mbti__info-button",
2658
- "aria-label": `Learn more about ${score.label}`,
2659
- children: /* @__PURE__ */ jsx(IconInfo, { size: 14 })
2660
- }
2661
- ),
2662
- isHovered && tooltip && /* @__PURE__ */ jsxs("div", { className: "ds-mbti__tooltip", children: [
2663
- /* @__PURE__ */ jsx("p", { className: "ds-mbti__tooltip-description", children: tooltip.description }),
2664
- /* @__PURE__ */ jsxs("div", { className: "ds-mbti__tooltip-traits", children: [
2665
- /* @__PURE__ */ jsxs("div", { className: "ds-mbti__tooltip-trait", children: [
2666
- /* @__PURE__ */ jsxs("strong", { children: [
2667
- score.leftLabel,
2668
- ":"
2669
- ] }),
2670
- " ",
2671
- tooltip.left
2672
- ] }),
2673
- /* @__PURE__ */ jsxs("div", { className: "ds-mbti__tooltip-trait", children: [
2674
- /* @__PURE__ */ jsxs("strong", { children: [
2675
- score.rightLabel,
2676
- ":"
2677
- ] }),
2678
- " ",
2679
- tooltip.right
2680
- ] })
2681
- ] })
2682
- ] })
2683
- ]
2684
- },
2685
- score.dimension
2686
- );
2687
- }) })
2688
- ] });
2689
- };
2690
- var COMMUNICATION_LABELS = {
2691
- visual: { label: "Visual", description: "Prefers diagrams, charts, and visual presentations" },
2692
- verbal: { label: "Verbal", description: "Responds best to conversations and discussions" },
2693
- analytical: { label: "Analytical", description: "Values data, logic, and detailed analysis" },
2694
- written: { label: "Written", description: "Prefers documented, well-structured communication" }
2695
- };
2696
- var DECISION_LABELS = {
2697
- fast: { label: "Fast Decider", description: "Makes quick decisions with available information" },
2698
- deliberate: { label: "Deliberate", description: "Takes time to weigh all options carefully" },
2699
- consensus: { label: "Consensus Builder", description: "Seeks input from others before deciding" },
2700
- "data-driven": {
2701
- label: "Data-Driven",
2702
- description: "Requires strong evidence to make decisions"
2703
- }
2704
- };
2705
- var BehavioralHighlights = ({
2706
- signals,
2707
- isLocked = false
2708
- }) => {
2709
- if (isLocked) {
2710
- return /* @__PURE__ */ jsxs("div", { className: "ds-behavioral ds-behavioral--locked", children: [
2711
- /* @__PURE__ */ jsxs("div", { className: "ds-behavioral__header", children: [
2712
- /* @__PURE__ */ jsx("h3", { className: "ds-behavioral__title", children: "Behavioral Signals" }),
2713
- /* @__PURE__ */ jsxs("div", { className: "ds-behavioral__locked-badge", children: [
2714
- /* @__PURE__ */ jsx(IconLock, { size: 14 }),
2715
- /* @__PURE__ */ jsx("span", { children: "Analyzing patterns..." })
2716
- ] })
2717
- ] }),
2718
- /* @__PURE__ */ jsx("div", { className: "ds-behavioral__grid", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsx("div", { className: "ds-behavioral__item ds-behavioral__item--skeleton", children: /* @__PURE__ */ jsx("div", { className: "ds-behavioral__item-shimmer" }) }, i)) })
2719
- ] });
2720
- }
2721
- const hasAnySignal = signals.communicationStyle || signals.decisionStyle || signals.riskTolerance !== void 0;
2722
- if (!hasAnySignal) {
2723
- return null;
2724
- }
2725
- return /* @__PURE__ */ jsxs("div", { className: "ds-behavioral", children: [
2726
- /* @__PURE__ */ jsx("div", { className: "ds-behavioral__header", children: /* @__PURE__ */ jsx("h3", { className: "ds-behavioral__title", children: "Behavioral Signals" }) }),
2727
- /* @__PURE__ */ jsxs("div", { className: "ds-behavioral__grid", children: [
2728
- signals.communicationStyle && /* @__PURE__ */ jsxs("div", { className: "ds-behavioral__item", children: [
2729
- /* @__PURE__ */ jsx("div", { className: "ds-behavioral__item-icon", children: /* @__PURE__ */ jsx(IconMessageCircle, { size: 18 }) }),
2730
- /* @__PURE__ */ jsxs("div", { className: "ds-behavioral__item-content", children: [
2731
- /* @__PURE__ */ jsx("span", { className: "ds-behavioral__item-label", children: "Communication Style" }),
2732
- /* @__PURE__ */ jsx("span", { className: "ds-behavioral__item-value", children: COMMUNICATION_LABELS[signals.communicationStyle].label }),
2733
- /* @__PURE__ */ jsx("span", { className: "ds-behavioral__item-description", children: COMMUNICATION_LABELS[signals.communicationStyle].description })
2734
- ] })
2735
- ] }),
2736
- signals.decisionStyle && /* @__PURE__ */ jsxs("div", { className: "ds-behavioral__item", children: [
2737
- /* @__PURE__ */ jsx("div", { className: "ds-behavioral__item-icon", children: /* @__PURE__ */ jsx(IconZap, { size: 18 }) }),
2738
- /* @__PURE__ */ jsxs("div", { className: "ds-behavioral__item-content", children: [
2739
- /* @__PURE__ */ jsx("span", { className: "ds-behavioral__item-label", children: "Decision Making" }),
2740
- /* @__PURE__ */ jsx("span", { className: "ds-behavioral__item-value", children: DECISION_LABELS[signals.decisionStyle].label }),
2741
- /* @__PURE__ */ jsx("span", { className: "ds-behavioral__item-description", children: DECISION_LABELS[signals.decisionStyle].description })
2742
- ] })
2743
- ] }),
2744
- signals.riskTolerance !== void 0 && /* @__PURE__ */ jsxs("div", { className: "ds-behavioral__item", children: [
2745
- /* @__PURE__ */ jsx("div", { className: "ds-behavioral__item-icon", children: /* @__PURE__ */ jsx(IconTrendingUp, { size: 18 }) }),
2746
- /* @__PURE__ */ jsxs("div", { className: "ds-behavioral__item-content", children: [
2747
- /* @__PURE__ */ jsx("span", { className: "ds-behavioral__item-label", children: "Risk Tolerance" }),
2748
- /* @__PURE__ */ jsxs("div", { className: "ds-behavioral__risk-meter", children: [
2749
- /* @__PURE__ */ jsx("div", { className: "ds-behavioral__risk-track", children: /* @__PURE__ */ jsx(
2750
- "div",
2751
- {
2752
- className: clsx4(
2753
- "ds-behavioral__risk-fill",
2754
- signals.riskTolerance < 33 && "ds-behavioral__risk-fill--low",
2755
- signals.riskTolerance >= 33 && signals.riskTolerance < 66 && "ds-behavioral__risk-fill--medium",
2756
- signals.riskTolerance >= 66 && "ds-behavioral__risk-fill--high"
2757
- ),
2758
- style: { width: `${signals.riskTolerance}%` }
2759
- }
2760
- ) }),
2761
- /* @__PURE__ */ jsxs("span", { className: "ds-behavioral__risk-label", children: [
2762
- signals.riskTolerance < 33 && "Conservative",
2763
- signals.riskTolerance >= 33 && signals.riskTolerance < 66 && "Balanced",
2764
- signals.riskTolerance >= 66 && "Risk-Tolerant"
2765
- ] })
2766
- ] })
2767
- ] })
2768
- ] })
2769
- ] })
2770
- ] });
2771
- };
2772
- var DeepDiveSection = ({
2773
- data,
2774
- defaultExpanded = false
2775
- }) => {
2776
- const [isExpanded, setIsExpanded] = useState(defaultExpanded);
2777
- const hasContent = data.education?.length || data.experience?.length || data.strengths?.length || data.risks?.length || data.careerInsights;
2778
- if (!hasContent) {
2779
- return null;
2780
- }
2781
- return /* @__PURE__ */ jsxs("div", { className: clsx4("ds-deep-dive", isExpanded && "ds-deep-dive--expanded"), children: [
2782
- /* @__PURE__ */ jsxs(
2783
- "button",
2784
- {
2785
- className: "ds-deep-dive__trigger",
2786
- onClick: () => setIsExpanded(!isExpanded),
2787
- "aria-expanded": isExpanded,
2788
- "aria-controls": "deep-dive-content",
2789
- children: [
2790
- /* @__PURE__ */ jsx("span", { className: "ds-deep-dive__trigger-text", children: "Deep Dive & Background" }),
2791
- /* @__PURE__ */ jsx("span", { className: "ds-deep-dive__trigger-icon", children: isExpanded ? /* @__PURE__ */ jsx(IconChevronUp, { size: 16 }) : /* @__PURE__ */ jsx(IconChevronDown, { size: 16 }) })
2792
- ]
2793
- }
2794
- ),
2795
- isExpanded && /* @__PURE__ */ jsx("div", { id: "deep-dive-content", className: "ds-deep-dive__content", children: /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__grid", children: [
2796
- (data.strengths?.length || data.risks?.length) && /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__card ds-deep-dive__card--insights", children: [
2797
- data.strengths && data.strengths.length > 0 && /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__section", children: [
2798
- /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__section-header ds-deep-dive__section-header--success", children: [
2799
- /* @__PURE__ */ jsx(IconTrendingUp, { size: 16 }),
2800
- /* @__PURE__ */ jsx("h4", { className: "ds-deep-dive__section-title", children: "Key Strengths" })
2801
- ] }),
2802
- /* @__PURE__ */ jsx("ul", { className: "ds-deep-dive__list", children: data.strengths.map((strength, idx) => /* @__PURE__ */ jsx("li", { className: "ds-deep-dive__list-item", children: strength }, idx)) })
2803
- ] }),
2804
- data.risks && data.risks.length > 0 && /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__section", children: [
2805
- /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__section-header ds-deep-dive__section-header--warning", children: [
2806
- /* @__PURE__ */ jsx(IconAlertTriangle, { size: 16 }),
2807
- /* @__PURE__ */ jsx("h4", { className: "ds-deep-dive__section-title", children: "Watch Out For" })
2808
- ] }),
2809
- /* @__PURE__ */ jsx("ul", { className: "ds-deep-dive__list", children: data.risks.map((risk, idx) => /* @__PURE__ */ jsx("li", { className: "ds-deep-dive__list-item", children: risk }, idx)) })
2810
- ] })
2811
- ] }),
2812
- data.education && data.education.length > 0 && /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__card", children: [
2813
- /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__section-header", children: [
2814
- /* @__PURE__ */ jsx(IconSchool, { size: 16 }),
2815
- /* @__PURE__ */ jsx("h4", { className: "ds-deep-dive__section-title", children: "Education" })
2816
- ] }),
2817
- /* @__PURE__ */ jsx("div", { className: "ds-deep-dive__timeline", children: data.education.map((edu, idx) => /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__timeline-item", children: [
2818
- edu.logo ? /* @__PURE__ */ jsx(
2819
- "img",
2820
- {
2821
- src: edu.logo,
2822
- alt: edu.school,
2823
- className: "ds-deep-dive__timeline-logo"
2824
- }
2825
- ) : /* @__PURE__ */ jsx("div", { className: "ds-deep-dive__timeline-icon", children: /* @__PURE__ */ jsx(IconSchool, { size: 16 }) }),
2826
- /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__timeline-content", children: [
2827
- /* @__PURE__ */ jsx("h5", { className: "ds-deep-dive__timeline-title", children: edu.school }),
2828
- /* @__PURE__ */ jsxs("p", { className: "ds-deep-dive__timeline-subtitle", children: [
2829
- edu.degree,
2830
- edu.field && ` in ${edu.field}`
2831
- ] }),
2832
- /* @__PURE__ */ jsx("span", { className: "ds-deep-dive__timeline-date", children: edu.year })
2833
- ] })
2834
- ] }, idx)) })
2835
- ] }),
2836
- data.experience && data.experience.length > 0 && /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__card", children: [
2837
- /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__section-header", children: [
2838
- /* @__PURE__ */ jsx(IconBriefcase, { size: 16 }),
2839
- /* @__PURE__ */ jsx("h4", { className: "ds-deep-dive__section-title", children: "Experience" })
2840
- ] }),
2841
- /* @__PURE__ */ jsx("div", { className: "ds-deep-dive__timeline", children: data.experience.map((exp, idx) => /* @__PURE__ */ jsxs(
2842
- "div",
2843
- {
2844
- className: clsx4(
2845
- "ds-deep-dive__timeline-item",
2846
- exp.current && "ds-deep-dive__timeline-item--current"
2847
- ),
2848
- children: [
2849
- exp.logo ? /* @__PURE__ */ jsx(
2850
- "img",
2851
- {
2852
- src: exp.logo,
2853
- alt: exp.company,
2854
- className: "ds-deep-dive__timeline-logo"
2855
- }
2856
- ) : /* @__PURE__ */ jsx("div", { className: "ds-deep-dive__timeline-icon", children: /* @__PURE__ */ jsx(IconBriefcase, { size: 16 }) }),
2857
- /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__timeline-content", children: [
2858
- /* @__PURE__ */ jsx("h5", { className: "ds-deep-dive__timeline-title", children: exp.role }),
2859
- /* @__PURE__ */ jsx("p", { className: "ds-deep-dive__timeline-subtitle", children: exp.company }),
2860
- /* @__PURE__ */ jsxs("span", { className: "ds-deep-dive__timeline-date", children: [
2861
- exp.duration,
2862
- exp.current && /* @__PURE__ */ jsx("span", { className: "ds-deep-dive__current-badge", children: "Current" })
2863
- ] })
2864
- ] })
2865
- ]
2866
- },
2867
- idx
2868
- )) })
2869
- ] }),
2870
- data.careerInsights && /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__card ds-deep-dive__card--wide", children: [
2871
- /* @__PURE__ */ jsxs("div", { className: "ds-deep-dive__section-header", children: [
2872
- /* @__PURE__ */ jsx(IconTrendingUp, { size: 16 }),
2873
- /* @__PURE__ */ jsx("h4", { className: "ds-deep-dive__section-title", children: "Career Trajectory" })
2874
- ] }),
2875
- /* @__PURE__ */ jsx("p", { className: "ds-deep-dive__narrative", children: data.careerInsights })
2876
- ] })
2877
- ] }) })
2878
- ] });
2879
- };
2880
- var LeadProfileView = React4.forwardRef(
2881
- ({ state, data, analysisProgress, onRefresh, className }, ref) => {
2882
- if (state === "empty") {
2883
- return /* @__PURE__ */ jsx("div", { ref, className: clsx4("ds-lead-profile", "ds-lead-profile--empty", className), children: /* @__PURE__ */ jsx(EmptyStateDisplay, { onRefresh }) });
2884
- }
2885
- if (state === "loading") {
2886
- return /* @__PURE__ */ jsx("div", { ref, className: clsx4("ds-lead-profile", "ds-lead-profile--loading", className), children: /* @__PURE__ */ jsx(LoadingStateDisplay, { progress: analysisProgress }) });
2887
- }
2888
- if (!data) return null;
2889
- const isPartial = state === "partial";
2890
- const hasMBTI = !isPartial && data.mbtiScores?.length;
2891
- const hasBehavioral = !isPartial && data.behavioralSignals;
2892
- return /* @__PURE__ */ jsxs("div", { ref, className: clsx4("ds-lead-profile", `ds-lead-profile--${state}`, className), children: [
2893
- /* @__PURE__ */ jsx("section", { className: "ds-lead-profile__zone ds-lead-profile__zone--identity", children: /* @__PURE__ */ jsx(IdentityHeader, { data, compact: isPartial }) }),
2894
- /* @__PURE__ */ jsxs("section", { className: "ds-lead-profile__zone ds-lead-profile__zone--intelligence", children: [
2895
- /* @__PURE__ */ jsx(IntelligenceSummary, { data, isLocked: isPartial }),
2896
- (hasMBTI || isPartial) && /* @__PURE__ */ jsx("div", { className: "ds-lead-profile__mbti-wrapper", children: /* @__PURE__ */ jsx(
2897
- MBTISpectrum,
2898
- {
2899
- scores: data.mbtiScores || [],
2900
- mbtiType: data.mbtiType,
2901
- isLocked: isPartial
2902
- }
2903
- ) }),
2904
- (hasBehavioral || isPartial) && data.behavioralSignals && /* @__PURE__ */ jsx(BehavioralHighlights, { signals: data.behavioralSignals, isLocked: isPartial }),
2905
- isPartial && /* @__PURE__ */ jsx("div", { className: "ds-lead-profile__partial-notice", children: /* @__PURE__ */ jsxs("div", { className: "ds-lead-profile__partial-notice-content", children: [
2906
- /* @__PURE__ */ jsx("span", { className: "ds-lead-profile__partial-notice-text", children: "Full intelligence analysis will be available shortly" }),
2907
- /* @__PURE__ */ jsx("div", { className: "ds-lead-profile__partial-notice-progress", children: /* @__PURE__ */ jsx("div", { className: "ds-lead-profile__partial-notice-bar" }) })
2908
- ] }) })
2909
- ] }),
2910
- !isPartial && /* @__PURE__ */ jsx("section", { className: "ds-lead-profile__zone ds-lead-profile__zone--deep-dive", children: /* @__PURE__ */ jsx(DeepDiveSection, { data }) })
2911
- ] });
2912
- }
2913
- );
2914
- LeadProfileView.displayName = "LeadProfileView";
2915
-
2916
- export { ChangeEmail, DataTable, DataTableBody, DataTableCell, DataTableHead, DataTableHeader, DataTableRow, FloatingTabBar, ForgotPassword, LeadProfileView, Login, Shell, Sidebar, SidebarItem, SidebarSection, Signup, TabItem };
2
+ export { ChangeEmail, DataTable, DataTableBody, DataTableCell, DataTableHead, DataTableHeader, DataTableRow, FloatingTabBar, ForgotPassword, LeadProfileView, Login, Shell, Sidebar, SidebarItem, SidebarSection, Signup, TabItem } from '../chunk-OXNXEQY7.js';
3
+ import '../chunk-7PX2AZ6Y.js';
4
+ import '../chunk-3NKRFUAR.js';
5
+ import '../chunk-SICKWUWB.js';
6
+ import '../chunk-KJ2OXQF4.js';
2917
7
  //# sourceMappingURL=out.js.map
2918
8
  //# sourceMappingURL=index.js.map