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