@salesmind-ai/design-system 0.6.0 → 1.0.0

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 (257) hide show
  1. package/README.md +2 -0
  2. package/dist/Anton-Regular-MLEXVTB2.woff2 +0 -0
  3. package/dist/admin/index.cjs +5 -61
  4. package/dist/admin/index.css +0 -3918
  5. package/dist/admin/index.css.map +1 -1
  6. package/dist/admin/index.d.cts +1 -422
  7. package/dist/admin/index.d.ts +1 -422
  8. package/dist/admin/index.js +1 -5
  9. package/dist/blog/index.cjs +13 -34
  10. package/dist/blog/index.css +0 -579
  11. package/dist/blog/index.css.map +1 -1
  12. package/dist/blog/index.d.cts +1 -54
  13. package/dist/blog/index.d.ts +1 -54
  14. package/dist/blog/index.js +5 -6
  15. package/dist/charts/index.cjs +0 -46
  16. package/dist/charts/index.d.cts +1 -452
  17. package/dist/charts/index.d.ts +1 -452
  18. package/dist/charts/index.js +1 -3
  19. package/dist/{chunk-YTYDQBVY.cjs → chunk-2VVRZBUR.cjs} +4 -4
  20. package/dist/{chunk-GQELL2MF.cjs → chunk-3NS6X2R4.cjs} +20 -203
  21. package/dist/chunk-3NS6X2R4.cjs.map +1 -0
  22. package/dist/{chunk-XEX2AEZK.cjs → chunk-65DTHLVX.cjs} +66 -186
  23. package/dist/chunk-65DTHLVX.cjs.map +1 -0
  24. package/dist/{chunk-QALDZ7WQ.js → chunk-6BUS7RMS.js} +21 -198
  25. package/dist/chunk-6BUS7RMS.js.map +1 -0
  26. package/dist/{chunk-LTPTW2US.cjs → chunk-6BXKRDK5.cjs} +587 -977
  27. package/dist/chunk-6BXKRDK5.cjs.map +1 -0
  28. package/dist/{chunk-BJZ2DKS5.cjs → chunk-6QIQCUYC.cjs} +11 -10
  29. package/dist/chunk-6QIQCUYC.cjs.map +1 -0
  30. package/dist/{chunk-H2Y6BSTL.cjs → chunk-7EUR3AKV.cjs} +1 -1
  31. package/dist/chunk-7EUR3AKV.cjs.map +1 -0
  32. package/dist/{chunk-VFJZQQZU.js → chunk-AMNY5TS3.js} +11 -10
  33. package/dist/chunk-AMNY5TS3.js.map +1 -0
  34. package/dist/{chunk-YJ6C3EKW.js → chunk-CLXLQCNQ.js} +52 -168
  35. package/dist/chunk-CLXLQCNQ.js.map +1 -0
  36. package/dist/{chunk-H2KQ3WSH.cjs → chunk-CVLD5RQK.cjs} +12 -14
  37. package/dist/chunk-CVLD5RQK.cjs.map +1 -0
  38. package/dist/chunk-EPD4ZEPY.cjs +344 -0
  39. package/dist/chunk-EPD4ZEPY.cjs.map +1 -0
  40. package/dist/{chunk-6D22TFLA.cjs → chunk-FVSL5YMB.cjs} +16 -32
  41. package/dist/chunk-FVSL5YMB.cjs.map +1 -0
  42. package/dist/chunk-FXYOSA4E.cjs +118 -0
  43. package/dist/chunk-FXYOSA4E.cjs.map +1 -0
  44. package/dist/{chunk-ECXBTUH6.cjs → chunk-GPHQGLR5.cjs} +27 -204
  45. package/dist/chunk-GPHQGLR5.cjs.map +1 -0
  46. package/dist/chunk-JPUJWI7F.cjs +73 -0
  47. package/dist/chunk-JPUJWI7F.cjs.map +1 -0
  48. package/dist/{chunk-6UNG76Y2.js → chunk-K526GN7P.js} +2 -2
  49. package/dist/{chunk-SICKWUWB.js → chunk-KJHPOB3J.js} +1 -1
  50. package/dist/chunk-KJHPOB3J.js.map +1 -0
  51. package/dist/{chunk-Y26OHHMX.js → chunk-KSEETC4E.js} +508 -891
  52. package/dist/chunk-KSEETC4E.js.map +1 -0
  53. package/dist/chunk-KXVFFEGD.js +60 -0
  54. package/dist/chunk-KXVFFEGD.js.map +1 -0
  55. package/dist/chunk-LQB7QLD3.js +288 -0
  56. package/dist/chunk-LQB7QLD3.js.map +1 -0
  57. package/dist/chunk-LUD52ZJF.cjs +726 -0
  58. package/dist/chunk-LUD52ZJF.cjs.map +1 -0
  59. package/dist/{chunk-7UZ5DETZ.js → chunk-MBAG654R.js} +4 -216
  60. package/dist/chunk-MBAG654R.js.map +1 -0
  61. package/dist/chunk-OMP6FAZ6.cjs +183 -0
  62. package/dist/chunk-OMP6FAZ6.cjs.map +1 -0
  63. package/dist/{chunk-WYH4TKS5.js → chunk-PBYRTNQ5.js} +6 -8
  64. package/dist/chunk-PBYRTNQ5.js.map +1 -0
  65. package/dist/chunk-PYREXCZK.js +679 -0
  66. package/dist/chunk-PYREXCZK.js.map +1 -0
  67. package/dist/{chunk-P5BOFE5A.js → chunk-RSLA2FJN.js} +28 -183
  68. package/dist/chunk-RSLA2FJN.js.map +1 -0
  69. package/dist/chunk-S46SKHMD.js +173 -0
  70. package/dist/chunk-S46SKHMD.js.map +1 -0
  71. package/dist/chunk-SFXTB7JL.js +190 -0
  72. package/dist/chunk-SFXTB7JL.js.map +1 -0
  73. package/dist/chunk-SGYXYMKZ.cjs +214 -0
  74. package/dist/chunk-SGYXYMKZ.cjs.map +1 -0
  75. package/dist/chunk-UGKYP6F3.cjs +296 -0
  76. package/dist/chunk-UGKYP6F3.cjs.map +1 -0
  77. package/dist/{chunk-HDVAMYSG.js → chunk-VFO2MUPI.js} +14 -29
  78. package/dist/chunk-VFO2MUPI.js.map +1 -0
  79. package/dist/chunk-WB6XDNU7.js +115 -0
  80. package/dist/chunk-WB6XDNU7.js.map +1 -0
  81. package/dist/core/index.cjs +144 -626
  82. package/dist/core/index.css +178 -3567
  83. package/dist/core/index.css.map +1 -1
  84. package/dist/core/index.d.cts +940 -902
  85. package/dist/core/index.d.ts +940 -902
  86. package/dist/core/index.js +6 -12
  87. package/dist/i18n/index.cjs +54 -49
  88. package/dist/i18n/index.d.cts +46 -11
  89. package/dist/i18n/index.d.ts +46 -11
  90. package/dist/i18n/index.js +2 -1
  91. package/dist/index-C8A3X92-.d.cts +1100 -0
  92. package/dist/index-wZPBPkOV.d.ts +1100 -0
  93. package/dist/index.cjs +506 -1004
  94. package/dist/index.cjs.map +1 -1
  95. package/dist/index.css +6026 -16790
  96. package/dist/index.css.map +1 -1
  97. package/dist/index.d.cts +307 -22
  98. package/dist/index.d.ts +307 -22
  99. package/dist/index.js +274 -39
  100. package/dist/index.js.map +1 -1
  101. package/dist/marketing/index.cjs +33 -76
  102. package/dist/marketing/index.css +1896 -3234
  103. package/dist/marketing/index.css.map +1 -1
  104. package/dist/marketing/index.d.cts +3 -1351
  105. package/dist/marketing/index.d.ts +3 -1351
  106. package/dist/marketing/index.js +5 -8
  107. package/dist/motion/index.cjs +3 -20
  108. package/dist/motion/index.css +0 -580
  109. package/dist/motion/index.css.map +1 -1
  110. package/dist/motion/index.d.cts +1 -37
  111. package/dist/motion/index.d.ts +1 -37
  112. package/dist/motion/index.js +1 -2
  113. package/dist/nav/index.cjs +10 -35
  114. package/dist/nav/index.css +28 -580
  115. package/dist/nav/index.css.map +1 -1
  116. package/dist/nav/index.d.cts +2 -60
  117. package/dist/nav/index.d.ts +2 -60
  118. package/dist/nav/index.js +1 -2
  119. package/dist/report/index.cjs +1166 -175
  120. package/dist/report/index.cjs.map +1 -1
  121. package/dist/report/index.d.cts +208 -5
  122. package/dist/report/index.d.ts +208 -5
  123. package/dist/report/index.js +1141 -3
  124. package/dist/report/index.js.map +1 -1
  125. package/dist/sections/index.cjs +8 -10
  126. package/dist/sections/index.cjs.map +1 -1
  127. package/dist/sections/index.css +0 -206
  128. package/dist/sections/index.css.map +1 -1
  129. package/dist/sections/index.js +2 -4
  130. package/dist/sections/index.js.map +1 -1
  131. package/dist/social-media/index.cjs +4 -0
  132. package/dist/social-media/index.cjs.map +1 -0
  133. package/dist/social-media/index.d.cts +2 -0
  134. package/dist/social-media/index.d.ts +2 -0
  135. package/dist/social-media/index.js +3 -0
  136. package/dist/social-media/index.js.map +1 -0
  137. package/dist/social-proof/index.cjs +4 -36
  138. package/dist/social-proof/index.css +3 -1106
  139. package/dist/social-proof/index.css.map +1 -1
  140. package/dist/social-proof/index.d.cts +26 -171
  141. package/dist/social-proof/index.d.ts +26 -171
  142. package/dist/social-proof/index.js +1 -5
  143. package/dist/styles/styles.css +602 -3044
  144. package/dist/theme/index.cjs +11 -19
  145. package/dist/theme/index.css +0 -352
  146. package/dist/theme/index.css.map +1 -1
  147. package/dist/theme/index.d.cts +1 -25
  148. package/dist/theme/index.d.ts +1 -25
  149. package/dist/theme/index.js +2 -2
  150. package/dist/web/client/index.cjs +10 -10
  151. package/dist/web/client/index.css +118 -0
  152. package/dist/web/client/index.css.map +1 -1
  153. package/dist/web/client/index.js +2 -2
  154. package/dist/web/index.cjs +10 -10
  155. package/dist/web/index.css +118 -0
  156. package/dist/web/index.css.map +1 -1
  157. package/dist/web/index.js +2 -2
  158. package/package.json +10 -4
  159. package/dist/AppearancePanel-UT57J69V.d.cts +0 -51
  160. package/dist/AppearancePanel-UT57J69V.d.ts +0 -51
  161. package/dist/ExportMenu-A2TLFiVv.d.cts +0 -311
  162. package/dist/ExportMenu-C8qck5AT.d.ts +0 -311
  163. package/dist/Select-BdZmK0Lt.d.cts +0 -66
  164. package/dist/Select-BdZmK0Lt.d.ts +0 -66
  165. package/dist/chart-types-BGVVO-zl.d.cts +0 -208
  166. package/dist/chart-types-BGVVO-zl.d.ts +0 -208
  167. package/dist/charts/index.css +0 -1167
  168. package/dist/charts/index.css.map +0 -1
  169. package/dist/chunk-3BAQDW3V.cjs +0 -1207
  170. package/dist/chunk-3BAQDW3V.cjs.map +0 -1
  171. package/dist/chunk-3NKRFUAR.js +0 -37
  172. package/dist/chunk-3NKRFUAR.js.map +0 -1
  173. package/dist/chunk-3TGSIILM.cjs +0 -201
  174. package/dist/chunk-3TGSIILM.cjs.map +0 -1
  175. package/dist/chunk-4GM5BGBN.cjs +0 -801
  176. package/dist/chunk-4GM5BGBN.cjs.map +0 -1
  177. package/dist/chunk-5LA3T22E.cjs +0 -562
  178. package/dist/chunk-5LA3T22E.cjs.map +0 -1
  179. package/dist/chunk-5SN66B2X.js +0 -2542
  180. package/dist/chunk-5SN66B2X.js.map +0 -1
  181. package/dist/chunk-6D22TFLA.cjs.map +0 -1
  182. package/dist/chunk-6H4DSTXR.js +0 -786
  183. package/dist/chunk-6H4DSTXR.js.map +0 -1
  184. package/dist/chunk-6HKQ5ILL.cjs +0 -1624
  185. package/dist/chunk-6HKQ5ILL.cjs.map +0 -1
  186. package/dist/chunk-7PX2AZ6Y.js +0 -39
  187. package/dist/chunk-7PX2AZ6Y.js.map +0 -1
  188. package/dist/chunk-7UZ5DETZ.js.map +0 -1
  189. package/dist/chunk-B6AVAX4F.js +0 -1415
  190. package/dist/chunk-B6AVAX4F.js.map +0 -1
  191. package/dist/chunk-BJZ2DKS5.cjs.map +0 -1
  192. package/dist/chunk-BUTQSDQH.js +0 -200
  193. package/dist/chunk-BUTQSDQH.js.map +0 -1
  194. package/dist/chunk-C2BCDNAV.js +0 -24
  195. package/dist/chunk-C2BCDNAV.js.map +0 -1
  196. package/dist/chunk-CJ2MKVAF.cjs +0 -46
  197. package/dist/chunk-CJ2MKVAF.cjs.map +0 -1
  198. package/dist/chunk-E7D6EKJ4.cjs +0 -44
  199. package/dist/chunk-E7D6EKJ4.cjs.map +0 -1
  200. package/dist/chunk-ECXBTUH6.cjs.map +0 -1
  201. package/dist/chunk-FAFAP4L5.js +0 -183
  202. package/dist/chunk-FAFAP4L5.js.map +0 -1
  203. package/dist/chunk-G2XGBO5V.cjs +0 -2565
  204. package/dist/chunk-G2XGBO5V.cjs.map +0 -1
  205. package/dist/chunk-GQELL2MF.cjs.map +0 -1
  206. package/dist/chunk-H2KQ3WSH.cjs.map +0 -1
  207. package/dist/chunk-H2Y6BSTL.cjs.map +0 -1
  208. package/dist/chunk-HCZW5AJN.cjs +0 -234
  209. package/dist/chunk-HCZW5AJN.cjs.map +0 -1
  210. package/dist/chunk-HDVAMYSG.js.map +0 -1
  211. package/dist/chunk-HN4PHABT.js +0 -126
  212. package/dist/chunk-HN4PHABT.js.map +0 -1
  213. package/dist/chunk-LTPTW2US.cjs.map +0 -1
  214. package/dist/chunk-MDB2WCRQ.cjs +0 -137
  215. package/dist/chunk-MDB2WCRQ.cjs.map +0 -1
  216. package/dist/chunk-MQRB634A.cjs +0 -34
  217. package/dist/chunk-MQRB634A.cjs.map +0 -1
  218. package/dist/chunk-NN3TUHIH.js +0 -28
  219. package/dist/chunk-NN3TUHIH.js.map +0 -1
  220. package/dist/chunk-OWS2KAXZ.js +0 -701
  221. package/dist/chunk-OWS2KAXZ.js.map +0 -1
  222. package/dist/chunk-P5BOFE5A.js.map +0 -1
  223. package/dist/chunk-PUPSK3DI.cjs +0 -216
  224. package/dist/chunk-PUPSK3DI.cjs.map +0 -1
  225. package/dist/chunk-Q2MFGYTE.cjs +0 -1449
  226. package/dist/chunk-Q2MFGYTE.cjs.map +0 -1
  227. package/dist/chunk-Q75DBVDY.cjs +0 -68
  228. package/dist/chunk-Q75DBVDY.cjs.map +0 -1
  229. package/dist/chunk-QALDZ7WQ.js.map +0 -1
  230. package/dist/chunk-QWE2RNCS.js +0 -1195
  231. package/dist/chunk-QWE2RNCS.js.map +0 -1
  232. package/dist/chunk-RQUFZAZ7.js +0 -1608
  233. package/dist/chunk-RQUFZAZ7.js.map +0 -1
  234. package/dist/chunk-SICKWUWB.js.map +0 -1
  235. package/dist/chunk-TCFC7XTB.js +0 -212
  236. package/dist/chunk-TCFC7XTB.js.map +0 -1
  237. package/dist/chunk-UTVXGAQP.cjs +0 -2437
  238. package/dist/chunk-UTVXGAQP.cjs.map +0 -1
  239. package/dist/chunk-UVEMY3FQ.cjs +0 -717
  240. package/dist/chunk-UVEMY3FQ.cjs.map +0 -1
  241. package/dist/chunk-VFJZQQZU.js.map +0 -1
  242. package/dist/chunk-WH7PYHZY.cjs +0 -35
  243. package/dist/chunk-WH7PYHZY.cjs.map +0 -1
  244. package/dist/chunk-WYH4TKS5.js.map +0 -1
  245. package/dist/chunk-XEX2AEZK.cjs.map +0 -1
  246. package/dist/chunk-XPTVHPCN.js +0 -2320
  247. package/dist/chunk-XPTVHPCN.js.map +0 -1
  248. package/dist/chunk-XWPDRMZG.js +0 -62
  249. package/dist/chunk-XWPDRMZG.js.map +0 -1
  250. package/dist/chunk-Y26OHHMX.js.map +0 -1
  251. package/dist/chunk-YJ6C3EKW.js.map +0 -1
  252. package/dist/motion-C651Ry6d.d.cts +0 -832
  253. package/dist/motion-C651Ry6d.d.ts +0 -832
  254. package/dist/report/index.css +0 -1239
  255. package/dist/report/index.css.map +0 -1
  256. /package/dist/{chunk-6UNG76Y2.js.map → chunk-2VVRZBUR.cjs.map} +0 -0
  257. /package/dist/{chunk-YTYDQBVY.cjs.map → chunk-K526GN7P.js.map} +0 -0
@@ -1,562 +0,0 @@
1
- 'use strict';
2
-
3
- var React2 = require('react');
4
- var jsxRuntime = require('react/jsx-runtime');
5
- var clsx = require('clsx');
6
-
7
- function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
8
-
9
- var React2__default = /*#__PURE__*/_interopDefault(React2);
10
- var clsx__default = /*#__PURE__*/_interopDefault(clsx);
11
-
12
- // src/theme/AppearanceProvider.tsx
13
-
14
- // src/theme/ensure-readable-contrast.ts
15
- function parseHex(hex) {
16
- const clean = hex.replace(/^#/, "");
17
- let r, g, b;
18
- if (clean.length === 3) {
19
- r = parseInt(clean[0] + clean[0], 16);
20
- g = parseInt(clean[1] + clean[1], 16);
21
- b = parseInt(clean[2] + clean[2], 16);
22
- } else if (clean.length === 6) {
23
- r = parseInt(clean.substring(0, 2), 16);
24
- g = parseInt(clean.substring(2, 4), 16);
25
- b = parseInt(clean.substring(4, 6), 16);
26
- } else {
27
- return null;
28
- }
29
- if (isNaN(r) || isNaN(g) || isNaN(b)) return null;
30
- return [r, g, b];
31
- }
32
- function toHex(r, g, b) {
33
- const clamp = (n) => Math.max(0, Math.min(255, Math.round(n)));
34
- return "#" + [clamp(r), clamp(g), clamp(b)].map((c) => c.toString(16).padStart(2, "0")).join("");
35
- }
36
- function rgbToHsl(r, g, b) {
37
- const rn = r / 255;
38
- const gn = g / 255;
39
- const bn = b / 255;
40
- const max = Math.max(rn, gn, bn);
41
- const min = Math.min(rn, gn, bn);
42
- const l = (max + min) / 2;
43
- if (max === min) return [0, 0, l];
44
- const d = max - min;
45
- const s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
46
- let h;
47
- if (max === rn) h = ((gn - bn) / d + (gn < bn ? 6 : 0)) / 6;
48
- else if (max === gn) h = ((bn - rn) / d + 2) / 6;
49
- else h = ((rn - gn) / d + 4) / 6;
50
- return [h * 360, s, l];
51
- }
52
- function hslToRgb(h, s, l) {
53
- const hNorm = (h % 360 + 360) % 360;
54
- if (s === 0) {
55
- const v = Math.round(l * 255);
56
- return [v, v, v];
57
- }
58
- const hue2rgb = (p2, q2, t) => {
59
- if (t < 0) t += 1;
60
- if (t > 1) t -= 1;
61
- if (t < 1 / 6) return p2 + (q2 - p2) * 6 * t;
62
- if (t < 1 / 2) return q2;
63
- if (t < 2 / 3) return p2 + (q2 - p2) * (2 / 3 - t) * 6;
64
- return p2;
65
- };
66
- const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
67
- const p = 2 * l - q;
68
- const hFrac = hNorm / 360;
69
- return [
70
- Math.round(hue2rgb(p, q, hFrac + 1 / 3) * 255),
71
- Math.round(hue2rgb(p, q, hFrac) * 255),
72
- Math.round(hue2rgb(p, q, hFrac - 1 / 3) * 255)
73
- ];
74
- }
75
- function relativeLuminance(r, g, b) {
76
- const [rs, gs, bs] = [r / 255, g / 255, b / 255].map(
77
- (c) => c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4)
78
- );
79
- return 0.2126 * rs + 0.7152 * gs + 0.0722 * bs;
80
- }
81
- function contrastRatio(fg, bg) {
82
- const l1 = relativeLuminance(...fg);
83
- const l2 = relativeLuminance(...bg);
84
- const lighter = Math.max(l1, l2);
85
- const darker = Math.min(l1, l2);
86
- return (lighter + 0.05) / (darker + 0.05);
87
- }
88
- var DEFAULT_MIN_RATIO = 4.5;
89
- var MAX_ITERATIONS = 25;
90
- function ensureReadableContrast(accentHex, surfaceHex, minRatio = DEFAULT_MIN_RATIO) {
91
- const fg = parseHex(accentHex);
92
- const bg = parseHex(surfaceHex);
93
- if (!fg || !bg) return accentHex;
94
- if (contrastRatio(fg, bg) >= minRatio) return accentHex;
95
- const [h, s] = rgbToHsl(...fg);
96
- const bgLuminance = relativeLuminance(...bg);
97
- const shouldLighten = bgLuminance < 0.5;
98
- const currentLightness = rgbToHsl(...fg)[2];
99
- let lo, hi;
100
- if (shouldLighten) {
101
- lo = currentLightness;
102
- hi = 1;
103
- } else {
104
- lo = 0;
105
- hi = currentLightness;
106
- }
107
- let bestHex = accentHex;
108
- for (let i = 0; i < MAX_ITERATIONS; i++) {
109
- const mid = (lo + hi) / 2;
110
- const [rr, gg, bb] = hslToRgb(h, s, mid);
111
- const ratio = contrastRatio([rr, gg, bb], bg);
112
- if (ratio >= minRatio) {
113
- bestHex = toHex(rr, gg, bb);
114
- if (shouldLighten) hi = mid;
115
- else lo = mid;
116
- } else {
117
- if (shouldLighten) lo = mid;
118
- else hi = mid;
119
- }
120
- }
121
- return bestHex;
122
- }
123
- var STORAGE_KEY = "void-appearance-settings";
124
- var BRAND_PINK_HEX = {
125
- default: "#f97316",
126
- salesmind: "#ff005a"
127
- };
128
- var DARK_SURFACE_HEX = "#08040a";
129
- var DEFAULT_SETTINGS = {
130
- theme: "dark",
131
- brand: "default",
132
- navPlacement: "left",
133
- density: "comfortable",
134
- radius: "playful",
135
- customColor: "#f97316"
136
- // Default orange as fallback
137
- };
138
- function hexToRgb(hex) {
139
- const cleanHex = hex.replace(/^#/, "");
140
- const r = parseInt(cleanHex.substring(0, 2), 16);
141
- const g = parseInt(cleanHex.substring(2, 4), 16);
142
- const b = parseInt(cleanHex.substring(4, 6), 16);
143
- if (isNaN(r) || isNaN(g) || isNaN(b)) {
144
- return "249, 115, 22";
145
- }
146
- return `${r}, ${g}, ${b}`;
147
- }
148
- function relativeLuminance2(r, g, b) {
149
- const [rs, gs, bs] = [r / 255, g / 255, b / 255].map(
150
- (c) => c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4)
151
- );
152
- return 0.2126 * rs + 0.7152 * gs + 0.0722 * bs;
153
- }
154
- function accentForegroundRgb(hex) {
155
- const cleanHex = hex.replace(/^#/, "");
156
- const r = parseInt(cleanHex.substring(0, 2), 16);
157
- const g = parseInt(cleanHex.substring(2, 4), 16);
158
- const b = parseInt(cleanHex.substring(4, 6), 16);
159
- if (isNaN(r) || isNaN(g) || isNaN(b)) {
160
- return "255, 255, 255";
161
- }
162
- return relativeLuminance2(r, g, b) > 0.179 ? "0, 0, 0" : "255, 255, 255";
163
- }
164
- function generateSecondaryColor(hex) {
165
- const cleanHex = hex.replace(/^#/, "");
166
- const r = parseInt(cleanHex.substring(0, 2), 16);
167
- const g = parseInt(cleanHex.substring(2, 4), 16);
168
- const b = parseInt(cleanHex.substring(4, 6), 16);
169
- if (isNaN(r) || isNaN(g) || isNaN(b)) {
170
- return "255, 208, 0";
171
- }
172
- const secondary = {
173
- r: Math.min(255, g + 50),
174
- g: Math.min(255, b + 100),
175
- b: Math.min(255, r)
176
- };
177
- return `${secondary.r}, ${secondary.g}, ${secondary.b}`;
178
- }
179
- function loadSettings() {
180
- if (typeof window === "undefined") return DEFAULT_SETTINGS;
181
- try {
182
- const stored = localStorage.getItem(STORAGE_KEY);
183
- if (stored) {
184
- const parsed = JSON.parse(stored);
185
- return {
186
- theme: parsed.theme || DEFAULT_SETTINGS.theme,
187
- brand: parsed.brand || DEFAULT_SETTINGS.brand,
188
- navPlacement: parsed.navPlacement || DEFAULT_SETTINGS.navPlacement,
189
- density: parsed.density || DEFAULT_SETTINGS.density,
190
- radius: parsed.radius || DEFAULT_SETTINGS.radius,
191
- customColor: parsed.customColor || DEFAULT_SETTINGS.customColor
192
- };
193
- }
194
- } catch {
195
- }
196
- return {
197
- ...DEFAULT_SETTINGS,
198
- theme: "dark"
199
- };
200
- }
201
- function saveSettings(settings) {
202
- if (typeof window === "undefined") return;
203
- try {
204
- localStorage.setItem(STORAGE_KEY, JSON.stringify(settings));
205
- } catch {
206
- }
207
- }
208
- function applySettings(settings) {
209
- if (typeof document === "undefined") return;
210
- const root = document.documentElement;
211
- root.setAttribute("data-theme", settings.theme);
212
- root.setAttribute("data-brand", settings.brand);
213
- root.setAttribute("data-nav", settings.navPlacement);
214
- root.setAttribute("data-density", settings.density);
215
- root.setAttribute("data-radius", settings.radius);
216
- if (settings.brand === "custom") {
217
- const primaryRgb = hexToRgb(settings.customColor);
218
- const secondaryRgb = generateSecondaryColor(settings.customColor);
219
- const foregroundRgb = accentForegroundRgb(settings.customColor);
220
- root.style.setProperty("--custom-accent-rgb", primaryRgb);
221
- root.style.setProperty("--custom-accent2-rgb", secondaryRgb);
222
- root.style.setProperty("--custom-accent-fg-rgb", foregroundRgb);
223
- } else {
224
- root.style.removeProperty("--custom-accent-rgb");
225
- root.style.removeProperty("--custom-accent2-rgb");
226
- root.style.removeProperty("--custom-accent-fg-rgb");
227
- }
228
- const brandPinkHex = settings.brand === "custom" ? settings.customColor : BRAND_PINK_HEX[settings.brand] ?? BRAND_PINK_HEX.default;
229
- root.style.setProperty(
230
- "--brand-pink-readable",
231
- ensureReadableContrast(brandPinkHex, DARK_SURFACE_HEX)
232
- );
233
- }
234
- function prefersReducedMotion() {
235
- if (typeof window === "undefined") return false;
236
- return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
237
- }
238
- var AppearanceContext = React2.createContext(null);
239
- function AppearanceProvider({
240
- initialSettings,
241
- disablePersistence = false,
242
- children
243
- }) {
244
- const [settings, setSettings] = React2.useState(() => ({
245
- ...DEFAULT_SETTINGS,
246
- ...initialSettings
247
- }));
248
- const [hydrated, setHydrated] = React2.useState(false);
249
- React2.useEffect(() => {
250
- if (!disablePersistence) {
251
- const loaded = loadSettings();
252
- setSettings({
253
- ...loaded,
254
- // initialSettings still take priority over localStorage
255
- ...initialSettings
256
- });
257
- }
258
- setHydrated(true);
259
- }, []);
260
- React2.useEffect(() => {
261
- applySettings(settings);
262
- if (!disablePersistence && hydrated) {
263
- saveSettings(settings);
264
- }
265
- }, [settings, disablePersistence, hydrated]);
266
- React2.useEffect(() => {
267
- if (typeof window === "undefined") return;
268
- const mediaQuery = window.matchMedia("(prefers-color-scheme: light)");
269
- const handleChange = (e) => {
270
- setSettings((prev) => {
271
- if (prev.theme === "light-contrast" || prev.theme === "dark-contrast") {
272
- return prev;
273
- }
274
- return {
275
- ...prev,
276
- theme: e.matches ? "light" : "dark"
277
- };
278
- });
279
- };
280
- mediaQuery.addEventListener("change", handleChange);
281
- return () => mediaQuery.removeEventListener("change", handleChange);
282
- }, []);
283
- React2.useEffect(() => {
284
- if (typeof window === "undefined") return;
285
- const mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)");
286
- const handleChange = () => {
287
- applySettings(settings);
288
- };
289
- mediaQuery.addEventListener("change", handleChange);
290
- return () => mediaQuery.removeEventListener("change", handleChange);
291
- }, [settings]);
292
- const setTheme = React2.useCallback((theme) => {
293
- setSettings((prev) => ({ ...prev, theme }));
294
- }, []);
295
- const setBrand = React2.useCallback((brand) => {
296
- setSettings((prev) => ({ ...prev, brand }));
297
- }, []);
298
- const setNavPlacement = React2.useCallback((navPlacement) => {
299
- setSettings((prev) => ({ ...prev, navPlacement }));
300
- }, []);
301
- const setDensity = React2.useCallback((density) => {
302
- setSettings((prev) => ({ ...prev, density }));
303
- }, []);
304
- const setRadius = React2.useCallback((radius) => {
305
- setSettings((prev) => ({ ...prev, radius }));
306
- }, []);
307
- const setCustomColor = React2.useCallback((customColor) => {
308
- setSettings((prev) => ({ ...prev, customColor, brand: "custom" }));
309
- }, []);
310
- const setAppearance = React2.useCallback((partial) => {
311
- setSettings((prev) => ({ ...prev, ...partial }));
312
- }, []);
313
- const resetToDefaults = React2.useCallback(() => {
314
- setSettings(DEFAULT_SETTINGS);
315
- }, []);
316
- const contextValue = {
317
- ...settings,
318
- setTheme,
319
- setBrand,
320
- setNavPlacement,
321
- setDensity,
322
- setRadius,
323
- setCustomColor,
324
- setAppearance,
325
- resetToDefaults
326
- };
327
- return /* @__PURE__ */ jsxRuntime.jsx(AppearanceContext.Provider, { value: contextValue, children });
328
- }
329
- function useAppearance() {
330
- const context = React2.useContext(AppearanceContext);
331
- if (!context) {
332
- throw new Error("useAppearance must be used within an AppearanceProvider");
333
- }
334
- return context;
335
- }
336
- function initializeAppearance(settings) {
337
- const loaded = loadSettings();
338
- const merged = { ...loaded, ...settings };
339
- applySettings(merged);
340
- }
341
- var AppearancePanel = React2__default.default.forwardRef(
342
- ({ className, labels: l }, ref) => {
343
- const {
344
- theme,
345
- brand,
346
- navPlacement,
347
- density,
348
- radius,
349
- customColor,
350
- setTheme,
351
- setBrand,
352
- setNavPlacement,
353
- setDensity,
354
- setRadius,
355
- setCustomColor,
356
- resetToDefaults
357
- } = useAppearance();
358
- const colorPickerId = React2.useId();
359
- const themeOptions = [
360
- { value: "light", label: l?.themeLight ?? "Light" },
361
- { value: "light-contrast", label: l?.themeLightContrast ?? "Light (High Contrast)" },
362
- { value: "dark", label: l?.themeDark ?? "Dark" },
363
- { value: "dark-contrast", label: l?.themeDarkContrast ?? "Dark (High Contrast)" }
364
- ];
365
- const brandOptions = [
366
- { value: "default", label: l?.brandDefault ?? "Default", description: l?.brandDefaultDescription ?? "Warm Intelligence" },
367
- { value: "salesmind", label: l?.brandSalesmind ?? "SalesMind", description: l?.brandSalesmindDescription ?? "Pink-red + Gold" },
368
- { value: "custom", label: l?.brandCustom ?? "Custom", description: l?.brandCustomDescription ?? "Your color" }
369
- ];
370
- const navOptions = [
371
- { value: "left", label: l?.navLeft ?? "Left Sidebar" },
372
- { value: "right", label: l?.navRight ?? "Right Sidebar" },
373
- { value: "bottom", label: l?.navBottom ?? "Bottom Tabs" }
374
- ];
375
- const densityOptions = [
376
- { value: "comfortable", label: l?.densityComfortable ?? "Comfortable", description: l?.densityComfortableDescription ?? "Generous spacing" },
377
- { value: "compact", label: l?.densityCompact ?? "Compact", description: l?.densityCompactDescription ?? "Higher density" }
378
- ];
379
- const radiusOptions = [
380
- { value: "playful", label: l?.radiusPlayful ?? "Playful", description: l?.radiusPlayfulDescription ?? "Rounded corners" },
381
- { value: "sharp", label: l?.radiusSharp ?? "Sharp", description: l?.radiusSharpDescription ?? "Technical feel" }
382
- ];
383
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: clsx__default.default("ds-appearance-panel", className), children: [
384
- /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "ds-appearance-panel__title", children: l?.title ?? "Appearance Settings" }),
385
- /* @__PURE__ */ jsxRuntime.jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
386
- /* @__PURE__ */ jsxRuntime.jsx("legend", { className: "ds-appearance-panel__legend", children: l?.themeHeading ?? "Theme" }),
387
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-appearance-panel__options", children: themeOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
388
- "label",
389
- {
390
- className: clsx__default.default(
391
- "ds-appearance-panel__option",
392
- theme === option.value && "ds-appearance-panel__option--active"
393
- ),
394
- children: [
395
- /* @__PURE__ */ jsxRuntime.jsx(
396
- "input",
397
- {
398
- type: "radio",
399
- name: "theme",
400
- value: option.value,
401
- checked: theme === option.value,
402
- onChange: () => setTheme(option.value),
403
- className: "ds-appearance-panel__radio"
404
- }
405
- ),
406
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ds-appearance-panel__option-label", children: option.label })
407
- ]
408
- },
409
- option.value
410
- )) })
411
- ] }),
412
- /* @__PURE__ */ jsxRuntime.jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
413
- /* @__PURE__ */ jsxRuntime.jsx("legend", { className: "ds-appearance-panel__legend", children: l?.brandHeading ?? "Brand" }),
414
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-appearance-panel__options", children: brandOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
415
- "label",
416
- {
417
- className: clsx__default.default(
418
- "ds-appearance-panel__option",
419
- brand === option.value && "ds-appearance-panel__option--active"
420
- ),
421
- children: [
422
- /* @__PURE__ */ jsxRuntime.jsx(
423
- "input",
424
- {
425
- type: "radio",
426
- name: "brand",
427
- value: option.value,
428
- checked: brand === option.value,
429
- onChange: () => setBrand(option.value),
430
- className: "ds-appearance-panel__radio"
431
- }
432
- ),
433
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ds-appearance-panel__option-content", children: [
434
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ds-appearance-panel__option-label", children: option.label }),
435
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ds-appearance-panel__option-description", children: option.description })
436
- ] })
437
- ]
438
- },
439
- option.value
440
- )) }),
441
- brand === "custom" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ds-appearance-panel__color-picker", children: [
442
- /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: colorPickerId, className: "ds-appearance-panel__color-label", children: l?.accentColorLabel ?? "Accent Color" }),
443
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ds-appearance-panel__color-input-wrapper", children: [
444
- /* @__PURE__ */ jsxRuntime.jsx(
445
- "input",
446
- {
447
- type: "color",
448
- id: colorPickerId,
449
- value: customColor,
450
- onChange: (e) => setCustomColor(e.target.value),
451
- className: "ds-appearance-panel__color-input"
452
- }
453
- ),
454
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ds-appearance-panel__color-value", children: customColor.toUpperCase() })
455
- ] })
456
- ] })
457
- ] }),
458
- /* @__PURE__ */ jsxRuntime.jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
459
- /* @__PURE__ */ jsxRuntime.jsx("legend", { className: "ds-appearance-panel__legend", children: l?.densityHeading ?? "Density" }),
460
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-appearance-panel__options ds-appearance-panel__options--row", children: densityOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
461
- "label",
462
- {
463
- className: clsx__default.default(
464
- "ds-appearance-panel__option",
465
- "ds-appearance-panel__option--toggle",
466
- density === option.value && "ds-appearance-panel__option--active"
467
- ),
468
- children: [
469
- /* @__PURE__ */ jsxRuntime.jsx(
470
- "input",
471
- {
472
- type: "radio",
473
- name: "density",
474
- value: option.value,
475
- checked: density === option.value,
476
- onChange: () => setDensity(option.value),
477
- className: "ds-appearance-panel__radio"
478
- }
479
- ),
480
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ds-appearance-panel__option-content", children: [
481
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ds-appearance-panel__option-label", children: option.label }),
482
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ds-appearance-panel__option-description", children: option.description })
483
- ] })
484
- ]
485
- },
486
- option.value
487
- )) })
488
- ] }),
489
- /* @__PURE__ */ jsxRuntime.jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
490
- /* @__PURE__ */ jsxRuntime.jsx("legend", { className: "ds-appearance-panel__legend", children: l?.geometryHeading ?? "Geometry" }),
491
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-appearance-panel__options ds-appearance-panel__options--row", children: radiusOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
492
- "label",
493
- {
494
- className: clsx__default.default(
495
- "ds-appearance-panel__option",
496
- "ds-appearance-panel__option--toggle",
497
- radius === option.value && "ds-appearance-panel__option--active"
498
- ),
499
- children: [
500
- /* @__PURE__ */ jsxRuntime.jsx(
501
- "input",
502
- {
503
- type: "radio",
504
- name: "radius",
505
- value: option.value,
506
- checked: radius === option.value,
507
- onChange: () => setRadius(option.value),
508
- className: "ds-appearance-panel__radio"
509
- }
510
- ),
511
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ds-appearance-panel__option-content", children: [
512
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ds-appearance-panel__option-label", children: option.label }),
513
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ds-appearance-panel__option-description", children: option.description })
514
- ] })
515
- ]
516
- },
517
- option.value
518
- )) })
519
- ] }),
520
- /* @__PURE__ */ jsxRuntime.jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
521
- /* @__PURE__ */ jsxRuntime.jsx("legend", { className: "ds-appearance-panel__legend", children: l?.navHeading ?? "Navigation Layout" }),
522
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-appearance-panel__options", children: navOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
523
- "label",
524
- {
525
- className: clsx__default.default(
526
- "ds-appearance-panel__option",
527
- navPlacement === option.value && "ds-appearance-panel__option--active"
528
- ),
529
- children: [
530
- /* @__PURE__ */ jsxRuntime.jsx(
531
- "input",
532
- {
533
- type: "radio",
534
- name: "nav",
535
- value: option.value,
536
- checked: navPlacement === option.value,
537
- onChange: () => setNavPlacement(option.value),
538
- className: "ds-appearance-panel__radio"
539
- }
540
- ),
541
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ds-appearance-panel__option-label", children: option.label })
542
- ]
543
- },
544
- option.value
545
- )) })
546
- ] }),
547
- /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: resetToDefaults, className: "ds-appearance-panel__reset", children: l?.resetLabel ?? "Reset to Defaults" })
548
- ] });
549
- }
550
- );
551
- AppearancePanel.displayName = "AppearancePanel";
552
-
553
- exports.AppearancePanel = AppearancePanel;
554
- exports.AppearanceProvider = AppearanceProvider;
555
- exports.accentForegroundRgb = accentForegroundRgb;
556
- exports.hexToRgb = hexToRgb;
557
- exports.initializeAppearance = initializeAppearance;
558
- exports.prefersReducedMotion = prefersReducedMotion;
559
- exports.relativeLuminance = relativeLuminance2;
560
- exports.useAppearance = useAppearance;
561
- //# sourceMappingURL=out.js.map
562
- //# sourceMappingURL=chunk-5LA3T22E.cjs.map