@salesmind-ai/design-system 0.3.2 → 0.3.4

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