@salesmind-ai/design-system 0.3.7 → 0.3.9

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 (36) hide show
  1. package/dist/admin/index.cjs +18 -18
  2. package/dist/admin/index.d.cts +2 -2
  3. package/dist/admin/index.d.ts +2 -2
  4. package/dist/admin/index.js +1 -1
  5. package/dist/{chunk-OXNXEQY7.js → chunk-5SN66B2X.js} +11 -7
  6. package/dist/chunk-5SN66B2X.js.map +1 -0
  7. package/dist/{chunk-DOO25SX4.cjs → chunk-B23AGGYI.cjs} +2 -2
  8. package/dist/{chunk-ZVJ5RLVM.js.map → chunk-B23AGGYI.cjs.map} +1 -1
  9. package/dist/{chunk-KCKUSU2M.cjs → chunk-ELKEYKEI.cjs} +3 -3
  10. package/dist/chunk-ELKEYKEI.cjs.map +1 -0
  11. package/dist/{chunk-I75BFEYT.cjs → chunk-G2XGBO5V.cjs} +10 -6
  12. package/dist/chunk-G2XGBO5V.cjs.map +1 -0
  13. package/dist/{chunk-ZVJ5RLVM.js → chunk-UIPEIRGT.js} +2 -2
  14. package/dist/{chunk-DOO25SX4.cjs.map → chunk-UIPEIRGT.js.map} +1 -1
  15. package/dist/{chunk-EFRAP5ES.js → chunk-UQ4SHBMC.js} +3 -3
  16. package/dist/chunk-UQ4SHBMC.js.map +1 -0
  17. package/dist/index.cjs +38 -38
  18. package/dist/index.css +8 -6
  19. package/dist/index.css.map +1 -1
  20. package/dist/index.js +3 -3
  21. package/dist/nav/index.cjs +16 -16
  22. package/dist/nav/index.css +3 -1
  23. package/dist/nav/index.css.map +1 -1
  24. package/dist/nav/index.js +1 -1
  25. package/dist/styles/styles.css +5 -5
  26. package/dist/theme/index.cjs +4 -4
  27. package/dist/theme/index.css +5 -5
  28. package/dist/theme/index.css.map +1 -1
  29. package/dist/theme/index.d.cts +8 -0
  30. package/dist/theme/index.d.ts +8 -0
  31. package/dist/theme/index.js +1 -1
  32. package/package.json +1 -1
  33. package/dist/chunk-EFRAP5ES.js.map +0 -1
  34. package/dist/chunk-I75BFEYT.cjs.map +0 -1
  35. package/dist/chunk-KCKUSU2M.cjs.map +0 -1
  36. package/dist/chunk-OXNXEQY7.js.map +0 -1
package/dist/theme/index.css CHANGED
@@ -9,7 +9,7 @@
9
9
  }
10
10
  [data-theme=light] .ds-theme-selector,
11
11
  [data-theme=light-contrast] .ds-theme-selector {
12
- background-color: #ffffff;
12
+ background-color: var(--void-base);
13
13
  }
14
14
  [data-theme=dark] .ds-theme-selector,
15
15
  [data-theme=dark-contrast] .ds-theme-selector {
@@ -30,7 +30,7 @@
30
30
  font-weight: 500;
31
31
  border-radius: var(--radius-badge);
32
32
  cursor: pointer;
33
- transition: all 0.2s ease;
33
+ transition: color var(--transition-fast), background-color var(--transition-fast);
34
34
  line-height: 1;
35
35
  white-space: nowrap;
36
36
  }
@@ -49,13 +49,13 @@
49
49
  color: var(--text-secondary);
50
50
  }
51
51
  .ds-theme-selector__btn--active .ds-theme-selector__icon {
52
- color: #F97316;
52
+ color: rgb(var(--accent-rgb));
53
53
  }
54
54
  .ds-theme-selector__icon {
55
55
  width: 16px;
56
56
  height: 16px;
57
57
  color: inherit;
58
- transition: color 0.2s ease;
58
+ transition: color var(--transition-fast);
59
59
  }
60
60
 
61
61
  /* src/components/AppearancePanel/AppearancePanel.css */
@@ -318,7 +318,7 @@
318
318
  justify-content: center;
319
319
  padding: 4px;
320
320
  border: none;
321
- border-radius: var(--radius-sm);
321
+ border-radius: var(--radius-xs);
322
322
  background: transparent;
323
323
  cursor: pointer;
324
324
  transition: background var(--transition-fast);
package/dist/theme/index.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/components/ThemeSelector/ThemeSelector.css","../../src/components/AppearancePanel/AppearancePanel.css","../../src/components/ColorPicker/ColorPicker.css","../../src/components/VoidBackground/VoidBackground.css"],"sourcesContent":[".ds-theme-selector {\n display: inline-flex;\n align-items: center;\n border: 1px solid var(--rim-light-top);\n border-radius: var(--radius-badge);\n padding: 4px;\n gap: 4px;\n}\n\n[data-theme='light'] .ds-theme-selector,\n[data-theme='light-contrast'] .ds-theme-selector {\n background-color: #ffffff;\n}\n\n[data-theme='dark'] .ds-theme-selector,\n[data-theme='dark-contrast'] .ds-theme-selector {\n background: var(--glass-base);\n backdrop-filter: var(--glass-backdrop);\n -webkit-backdrop-filter: var(--glass-backdrop);\n}\n\n.ds-theme-selector__btn {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px 12px;\n border: none;\n background: transparent;\n color: var(--text-secondary);\n font-family: inherit;\n font-size: var(--font-size-sm, 14px);\n font-weight: 500;\n border-radius: var(--radius-badge);\n cursor: pointer;\n transition: all 0.2s ease;\n line-height: 1;\n white-space: nowrap;\n}\n\n.ds-theme-selector__btn:hover {\n color: var(--text-primary);\n background-color: var(--interactive-hover-bg);\n}\n\n.ds-theme-selector__btn--active {\n background-color: rgba(var(--accent-rgb),.2);\n box-shadow: none;\n}\n\n[data-theme='light'] .ds-theme-selector__btn--active .ds-theme-selector__label,\n[data-theme='light-contrast'] .ds-theme-selector__btn--active .ds-theme-selector__label,\n[data-theme='dark'] .ds-theme-selector__btn--active .ds-theme-selector__label,\n[data-theme='dark-contrast'] .ds-theme-selector__btn--active .ds-theme-selector__label {\n color: var(--text-secondary);\n}\n\n.ds-theme-selector__btn--active .ds-theme-selector__icon {\n color: #F97316;\n}\n\n.ds-theme-selector__icon {\n width: 16px;\n height: 16px;\n color: inherit;\n transition: color 0.2s ease;\n}\n","/* ============================================================================\n RESPONSIVE MORPHING — Bottom Sheet on Mobile\n ============================================================================ */\n\n@media (max-width: 768px) {\n .ds-appearance-panel {\n position: fixed;\n bottom: 0;\n left: 0;\n right: 0;\n max-width: 100%;\n border-radius: var(--radius-panel) var(--radius-panel) 0 0;\n\n /* Ensure it sits above everything */\n z-index: var(--z-modal);\n\n /* Animation: Slide Up */\n animation: ds-panel-slide-up 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n\n /* Ensure scrollability but keep context visible (60% height) */\n max-height: 60vh;\n overflow-y: auto;\n\n /* Add safe area for iPhone home indicator */\n padding-bottom: env(safe-area-inset-bottom, 24px);\n }\n\n /* Reset border radius for internal items if needed */\n .ds-appearance-panel::before {\n border-radius: var(--radius-panel) var(--radius-panel) 0 0;\n }\n}\n\n@keyframes ds-panel-slide-up {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n}\n\n/* ============================================================================\n APPEARANCE PANEL — Glass Treatment\n ============================================================================ */\n\n.ds-appearance-panel {\n position: relative;\n padding: var(--space-6);\n border-radius: var(--radius-card);\n max-width: 400px;\n\n /* Fix for desktop height overflow */\n max-height: 85vh;\n overflow-y: auto;\n\n /* Glass treatment */\n background: var(--glass-base);\n backdrop-filter: var(--glass-backdrop);\n -webkit-backdrop-filter: var(--glass-backdrop);\n box-shadow: var(--glass-shadow-combined);\n}\n\n/* Rim light */\n.ds-appearance-panel::before {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n padding: var(--space-px);\n background: linear-gradient(180deg, var(--rim-light-top) 0%, var(--rim-light-bottom) 100%);\n mask:\n linear-gradient(#fff 0 0) content-box,\n linear-gradient(#fff 0 0);\n mask-composite: exclude;\n -webkit-mask:\n linear-gradient(#fff 0 0) content-box,\n linear-gradient(#fff 0 0);\n -webkit-mask-composite: xor;\n pointer-events: none;\n}\n\n.ds-appearance-panel__title {\n font-family: var(--font-family);\n font-size: var(--font-size-lg);\n font-weight: var(--font-weight-semibold);\n color: var(--text-primary);\n margin: 0 0 var(--space-6);\n}\n\n.ds-appearance-panel__section {\n border: none;\n padding: 0;\n margin: 0 0 var(--space-6);\n}\n\n.ds-appearance-panel__section:last-of-type {\n margin-bottom: var(--space-4);\n}\n\n.ds-appearance-panel__legend {\n font-family: var(--font-family);\n font-size: var(--font-size-xs);\n font-weight: var(--font-weight-semibold);\n color: var(--text-tertiary);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing-wide);\n margin-bottom: var(--space-3);\n}\n\n.ds-appearance-panel__options {\n display: flex;\n flex-direction: column;\n gap: var(--space-2);\n}\n\n/* Row layout for toggles (Density, Geometry) */\n.ds-appearance-panel__options--row {\n flex-direction: row;\n gap: var(--space-3);\n}\n\n.ds-appearance-panel__options--row .ds-appearance-panel__option {\n flex: 1;\n}\n\n.ds-appearance-panel__option {\n display: flex;\n align-items: center;\n gap: var(--space-3);\n padding: var(--space-3) var(--space-4);\n border-radius: var(--radius-button);\n cursor: pointer;\n transition: background var(--transition-glass);\n\n /* Glass base */\n background: transparent;\n}\n\n.ds-appearance-panel__option:hover {\n background: var(--glass-base-hover);\n}\n\n.ds-appearance-panel__option--active {\n background: rgba(var(--accent-rgb), 0.15);\n}\n\n.ds-appearance-panel__option--active:hover {\n background: rgba(var(--accent-rgb), 0.2);\n}\n\n/* Toggle variant styling */\n.ds-appearance-panel__option--toggle {\n flex-direction: column;\n align-items: flex-start;\n gap: var(--space-1);\n padding: var(--space-3);\n text-align: center;\n}\n\n.ds-appearance-panel__option--toggle .ds-appearance-panel__option-content {\n width: 100%;\n text-align: center;\n}\n\n.ds-appearance-panel__radio {\n appearance: none;\n width: 16px;\n height: 16px;\n border-radius: 50%;\n border: 2px solid var(--text-tertiary);\n transition: all var(--transition-glass);\n flex-shrink: 0;\n}\n\n/* Hide radio in toggle variant */\n.ds-appearance-panel__option--toggle .ds-appearance-panel__radio {\n position: absolute;\n opacity: 0;\n pointer-events: none;\n}\n\n.ds-appearance-panel__option--active .ds-appearance-panel__radio {\n border-color: rgba(var(--accent-rgb), 1);\n background: rgba(var(--accent-rgb), 1);\n box-shadow: 0 0 8px rgba(var(--accent-rgb), 0.4);\n}\n\n.ds-appearance-panel__option-content {\n display: flex;\n flex-direction: column;\n gap: var(--space-0-5);\n}\n\n.ds-appearance-panel__option-label {\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n color: var(--text-primary);\n}\n\n.ds-appearance-panel__option-description {\n font-family: var(--font-family);\n font-size: var(--font-size-xs);\n color: var(--text-tertiary);\n}\n\n/* ============================================================================\n COLOR PICKER — Custom Brand\n ============================================================================ */\n\n.ds-appearance-panel__color-picker {\n margin-top: var(--space-4);\n padding: var(--space-4);\n border-radius: var(--radius-button);\n background: var(--glass-base);\n border: 1px solid rgba(var(--accent-rgb), 0.2);\n}\n\n.ds-appearance-panel__color-label {\n display: block;\n font-family: var(--font-family);\n font-size: var(--font-size-xs);\n font-weight: var(--font-weight-medium);\n color: var(--text-secondary);\n margin-bottom: var(--space-2);\n}\n\n.ds-appearance-panel__color-input-wrapper {\n display: flex;\n align-items: center;\n gap: var(--space-3);\n}\n\n.ds-appearance-panel__color-input {\n width: 48px;\n height: 48px;\n padding: 0;\n border: none;\n border-radius: var(--radius-badge);\n cursor: pointer;\n background: transparent;\n overflow: hidden;\n}\n\n/* Style the color input swatch */\n.ds-appearance-panel__color-input::-webkit-color-swatch-wrapper {\n padding: 0;\n}\n\n.ds-appearance-panel__color-input::-webkit-color-swatch {\n border: 2px solid var(--rim-light-top);\n border-radius: var(--radius-badge);\n box-shadow: var(--shadow-md);\n}\n\n.ds-appearance-panel__color-input::-moz-color-swatch {\n border: 2px solid var(--rim-light-top);\n border-radius: var(--radius-badge);\n box-shadow: var(--shadow-md);\n}\n\n.ds-appearance-panel__color-input:focus-visible {\n outline: none;\n box-shadow: var(--focus-ring);\n border-radius: var(--radius-badge);\n}\n\n.ds-appearance-panel__color-value {\n font-family: var(--font-family-mono);\n font-size: var(--font-size-sm);\n color: var(--text-secondary);\n padding: var(--space-2) var(--space-3);\n background: var(--glass-base);\n border-radius: var(--radius-badge);\n border: 1px solid var(--rim-light-bottom);\n}\n\n/* ============================================================================\n RESET BUTTON\n ============================================================================ */\n\n.ds-appearance-panel__reset {\n display: block;\n width: 100%;\n padding: var(--space-3) var(--space-4);\n border: none;\n border-radius: var(--radius-button);\n background: var(--btn-secondary-bg);\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: var(--font-size-sm);\n font-weight: var(--font-weight-medium);\n cursor: pointer;\n transition: all var(--transition-glass);\n}\n\n.ds-appearance-panel__reset:hover {\n background: var(--btn-secondary-bg-hover);\n color: var(--text-primary);\n}\n\n.ds-appearance-panel__reset:focus-visible {\n box-shadow: var(--focus-ring);\n outline: none;\n}\n\n/* ============================================================================\n HIGH CONTRAST MODE\n ============================================================================ */\n\n@media (prefers-contrast: more) {\n .ds-appearance-panel {\n border: 1px solid var(--hc-border);\n }\n\n .ds-appearance-panel__color-picker {\n border: 1px solid var(--hc-border);\n }\n}\n",".ds-color-picker {\n display: flex;\n align-items: center;\n gap: 2px;\n padding: 2px;\n border-radius: var(--radius-badge);\n background: var(--interactive-hover-bg);\n border: 1px solid var(--rim-light-bottom);\n}\n\n.ds-color-picker__swatch {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 4px;\n border: none;\n border-radius: var(--radius-sm);\n background: transparent;\n cursor: pointer;\n transition: background var(--transition-fast);\n}\n\n.ds-color-picker__swatch:hover {\n background: var(--interactive-hover-bg);\n}\n\n.ds-color-picker__swatch--active {\n background: var(--interactive-active-bg);\n}\n\n.ds-color-picker__dot {\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: var(--swatch-color);\n border: 1.5px solid var(--rim-light-bottom);\n transition: box-shadow var(--transition-fast);\n}\n\n.ds-color-picker__swatch--active .ds-color-picker__dot {\n box-shadow: 0 0 0 2px var(--swatch-color);\n}\n\n/* Native <input type=\"color\"> hidden behind the custom swatch */\n.ds-color-picker__swatch--custom {\n position: relative;\n}\n\n.ds-color-picker__native-input {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n border: none;\n padding: 0;\n}\n","/* ============================================================================\n VOID BACKGROUND — LEVEL 0 ATMOSPHERIC SYSTEM\n ============================================================================ */\n\n.void {\n position: relative;\n display: flex;\n flex-direction: column;\n width: 100%;\n min-height: 100vh;\n overflow: hidden;\n isolation: isolate;\n}\n\n/* ==========================================================================\n Layer 1: Base Color — Deep purple-black\n ========================================================================== */\n\n.void__base {\n position: absolute;\n inset: 0;\n background-color: var(--void-base);\n z-index: -4;\n}\n\n/* ==========================================================================\n Layer 2: Light Orbs — Brand colors as light sources\n ========================================================================== */\n\n.void__orbs {\n position: absolute;\n inset: 0;\n z-index: -3;\n pointer-events: none;\n}\n\n.void__orb {\n position: absolute;\n border-radius: 50%;\n mix-blend-mode: screen;\n filter: blur(140px);\n opacity: 0.6;\n}\n\n/* Warm Orb: Yellow → Pink gradient, positioned near primary content */\n.void__orb--warm {\n width: 800px;\n height: 800px;\n top: 10%;\n right: 10%;\n background: radial-gradient(\n circle at center,\n rgba(var(--void-orb-yellow-rgb), 0.4) 0%,\n rgba(var(--void-orb-pink-rgb), 0.3) 40%,\n transparent 70%\n );\n}\n\n/* Purple Orb: Deep purple for depth balance */\n.void__orb--purple {\n width: 600px;\n height: 600px;\n bottom: 10%;\n left: 10%;\n background: radial-gradient(\n circle at center,\n rgba(var(--void-orb-purple-rgb), 0.5) 0%,\n rgba(var(--void-orb-purple-rgb), 0.2) 50%,\n transparent 70%\n );\n}\n\n/* ==========================================================================\n Layer 3: Engineered Grid — 80×80px with radial fade\n ========================================================================== */\n\n.void__grid {\n position: absolute;\n inset: 0;\n z-index: -2;\n pointer-events: none;\n background-image:\n linear-gradient(to right, var(--void-grid-color) 1px, transparent 1px),\n linear-gradient(to bottom, var(--void-grid-color) 1px, transparent 1px);\n background-size: var(--void-grid-size) var(--void-grid-size);\n /* Grid fades toward edges — CRITICAL */\n mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black 0%, transparent 100%);\n -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black 0%, transparent 100%);\n}\n\n/* ==========================================================================\n Layer 4: Film Grain — Static noise texture\n ========================================================================== */\n\n.void__grain {\n position: absolute;\n inset: 0;\n z-index: -1;\n pointer-events: none;\n opacity: var(--void-grid-grain-opacity, 0.04);\n background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E\");\n background-repeat: repeat;\n background-size: 200px 200px;\n}\n\n/* ==========================================================================\n Content Layer\n ========================================================================== */\n\n.void__content {\n position: relative;\n z-index: 1;\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n\n/* ==========================================================================\n Utility: Inline Void (for smaller containers)\n ========================================================================== */\n\n.void--inline {\n min-height: auto;\n}\n\n.void--inline .void__content {\n min-height: auto;\n}\n\n/* ==========================================================================\n Reduced Motion: Disable any future animations\n ========================================================================== */\n\n@media (prefers-reduced-motion: reduce) {\n .void__orb {\n animation: none;\n }\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../src/components/ThemeSelector/ThemeSelector.css","../../src/components/AppearancePanel/AppearancePanel.css","../../src/components/ColorPicker/ColorPicker.css","../../src/components/VoidBackground/VoidBackground.css"],"sourcesContent":[".ds-theme-selector {\n display: inline-flex;\n align-items: center;\n border: 1px solid var(--rim-light-top);\n border-radius: var(--radius-badge);\n padding: 4px;\n gap: 4px;\n}\n\n[data-theme='light'] .ds-theme-selector,\n[data-theme='light-contrast'] .ds-theme-selector {\n background-color: var(--void-base);\n}\n\n[data-theme='dark'] .ds-theme-selector,\n[data-theme='dark-contrast'] .ds-theme-selector {\n background: var(--glass-base);\n backdrop-filter: var(--glass-backdrop);\n -webkit-backdrop-filter: var(--glass-backdrop);\n}\n\n.ds-theme-selector__btn {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px 12px;\n border: none;\n background: transparent;\n color: var(--text-secondary);\n font-family: inherit;\n font-size: var(--font-size-sm, 14px);\n font-weight: 500;\n border-radius: var(--radius-badge);\n cursor: pointer;\n transition: color var(--transition-fast), background-color var(--transition-fast);\n line-height: 1;\n white-space: nowrap;\n}\n\n.ds-theme-selector__btn:hover {\n color: var(--text-primary);\n background-color: var(--interactive-hover-bg);\n}\n\n.ds-theme-selector__btn--active {\n background-color: rgba(var(--accent-rgb),.2);\n box-shadow: none;\n}\n\n[data-theme='light'] .ds-theme-selector__btn--active .ds-theme-selector__label,\n[data-theme='light-contrast'] .ds-theme-selector__btn--active .ds-theme-selector__label,\n[data-theme='dark'] .ds-theme-selector__btn--active .ds-theme-selector__label,\n[data-theme='dark-contrast'] .ds-theme-selector__btn--active .ds-theme-selector__label {\n color: var(--text-secondary);\n}\n\n.ds-theme-selector__btn--active .ds-theme-selector__icon {\n color: rgb(var(--accent-rgb));\n}\n\n.ds-theme-selector__icon {\n width: 16px;\n height: 16px;\n color: inherit;\n transition: color var(--transition-fast);\n}\n","/* ============================================================================\n RESPONSIVE MORPHING — Bottom Sheet on Mobile\n ============================================================================ */\n\n@media (max-width: 768px) {\n .ds-appearance-panel {\n position: fixed;\n bottom: 0;\n left: 0;\n right: 0;\n max-width: 100%;\n border-radius: var(--radius-panel) var(--radius-panel) 0 0;\n\n /* Ensure it sits above everything */\n z-index: var(--z-modal);\n\n /* Animation: Slide Up */\n animation: ds-panel-slide-up 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n\n /* Ensure scrollability but keep context visible (60% height) */\n max-height: 60vh;\n overflow-y: auto;\n\n /* Add safe area for iPhone home indicator */\n padding-bottom: env(safe-area-inset-bottom, 24px);\n }\n\n /* Reset border radius for internal items if needed */\n .ds-appearance-panel::before {\n border-radius: var(--radius-panel) var(--radius-panel) 0 0;\n }\n}\n\n@keyframes ds-panel-slide-up {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n}\n\n/* ============================================================================\n APPEARANCE PANEL — Glass Treatment\n ============================================================================ */\n\n.ds-appearance-panel {\n position: relative;\n padding: var(--space-6);\n border-radius: var(--radius-card);\n max-width: 400px;\n\n /* Fix for desktop height overflow */\n max-height: 85vh;\n overflow-y: auto;\n\n /* Glass treatment */\n background: var(--glass-base);\n backdrop-filter: var(--glass-backdrop);\n -webkit-backdrop-filter: var(--glass-backdrop);\n box-shadow: var(--glass-shadow-combined);\n}\n\n/* Rim light */\n.ds-appearance-panel::before {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: inherit;\n padding: var(--space-px);\n background: linear-gradient(180deg, var(--rim-light-top) 0%, var(--rim-light-bottom) 100%);\n mask:\n linear-gradient(#fff 0 0) content-box,\n linear-gradient(#fff 0 0);\n mask-composite: exclude;\n -webkit-mask:\n linear-gradient(#fff 0 0) content-box,\n linear-gradient(#fff 0 0);\n -webkit-mask-composite: xor;\n pointer-events: none;\n}\n\n.ds-appearance-panel__title {\n font-family: var(--font-family);\n font-size: var(--font-size-lg);\n font-weight: var(--font-weight-semibold);\n color: var(--text-primary);\n margin: 0 0 var(--space-6);\n}\n\n.ds-appearance-panel__section {\n border: none;\n padding: 0;\n margin: 0 0 var(--space-6);\n}\n\n.ds-appearance-panel__section:last-of-type {\n margin-bottom: var(--space-4);\n}\n\n.ds-appearance-panel__legend {\n font-family: var(--font-family);\n font-size: var(--font-size-xs);\n font-weight: var(--font-weight-semibold);\n color: var(--text-tertiary);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing-wide);\n margin-bottom: var(--space-3);\n}\n\n.ds-appearance-panel__options {\n display: flex;\n flex-direction: column;\n gap: var(--space-2);\n}\n\n/* Row layout for toggles (Density, Geometry) */\n.ds-appearance-panel__options--row {\n flex-direction: row;\n gap: var(--space-3);\n}\n\n.ds-appearance-panel__options--row .ds-appearance-panel__option {\n flex: 1;\n}\n\n.ds-appearance-panel__option {\n display: flex;\n align-items: center;\n gap: var(--space-3);\n padding: var(--space-3) var(--space-4);\n border-radius: var(--radius-button);\n cursor: pointer;\n transition: background var(--transition-glass);\n\n /* Glass base */\n background: transparent;\n}\n\n.ds-appearance-panel__option:hover {\n background: var(--glass-base-hover);\n}\n\n.ds-appearance-panel__option--active {\n background: rgba(var(--accent-rgb), 0.15);\n}\n\n.ds-appearance-panel__option--active:hover {\n background: rgba(var(--accent-rgb), 0.2);\n}\n\n/* Toggle variant styling */\n.ds-appearance-panel__option--toggle {\n flex-direction: column;\n align-items: flex-start;\n gap: var(--space-1);\n padding: var(--space-3);\n text-align: center;\n}\n\n.ds-appearance-panel__option--toggle .ds-appearance-panel__option-content {\n width: 100%;\n text-align: center;\n}\n\n.ds-appearance-panel__radio {\n appearance: none;\n width: 16px;\n height: 16px;\n border-radius: 50%;\n border: 2px solid var(--text-tertiary);\n transition: all var(--transition-glass);\n flex-shrink: 0;\n}\n\n/* Hide radio in toggle variant */\n.ds-appearance-panel__option--toggle .ds-appearance-panel__radio {\n position: absolute;\n opacity: 0;\n pointer-events: none;\n}\n\n.ds-appearance-panel__option--active .ds-appearance-panel__radio {\n border-color: rgba(var(--accent-rgb), 1);\n background: rgba(var(--accent-rgb), 1);\n box-shadow: 0 0 8px rgba(var(--accent-rgb), 0.4);\n}\n\n.ds-appearance-panel__option-content {\n display: flex;\n flex-direction: column;\n gap: var(--space-0-5);\n}\n\n.ds-appearance-panel__option-label {\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n color: var(--text-primary);\n}\n\n.ds-appearance-panel__option-description {\n font-family: var(--font-family);\n font-size: var(--font-size-xs);\n color: var(--text-tertiary);\n}\n\n/* ============================================================================\n COLOR PICKER — Custom Brand\n ============================================================================ */\n\n.ds-appearance-panel__color-picker {\n margin-top: var(--space-4);\n padding: var(--space-4);\n border-radius: var(--radius-button);\n background: var(--glass-base);\n border: 1px solid rgba(var(--accent-rgb), 0.2);\n}\n\n.ds-appearance-panel__color-label {\n display: block;\n font-family: var(--font-family);\n font-size: var(--font-size-xs);\n font-weight: var(--font-weight-medium);\n color: var(--text-secondary);\n margin-bottom: var(--space-2);\n}\n\n.ds-appearance-panel__color-input-wrapper {\n display: flex;\n align-items: center;\n gap: var(--space-3);\n}\n\n.ds-appearance-panel__color-input {\n width: 48px;\n height: 48px;\n padding: 0;\n border: none;\n border-radius: var(--radius-badge);\n cursor: pointer;\n background: transparent;\n overflow: hidden;\n}\n\n/* Style the color input swatch */\n.ds-appearance-panel__color-input::-webkit-color-swatch-wrapper {\n padding: 0;\n}\n\n.ds-appearance-panel__color-input::-webkit-color-swatch {\n border: 2px solid var(--rim-light-top);\n border-radius: var(--radius-badge);\n box-shadow: var(--shadow-md);\n}\n\n.ds-appearance-panel__color-input::-moz-color-swatch {\n border: 2px solid var(--rim-light-top);\n border-radius: var(--radius-badge);\n box-shadow: var(--shadow-md);\n}\n\n.ds-appearance-panel__color-input:focus-visible {\n outline: none;\n box-shadow: var(--focus-ring);\n border-radius: var(--radius-badge);\n}\n\n.ds-appearance-panel__color-value {\n font-family: var(--font-family-mono);\n font-size: var(--font-size-sm);\n color: var(--text-secondary);\n padding: var(--space-2) var(--space-3);\n background: var(--glass-base);\n border-radius: var(--radius-badge);\n border: 1px solid var(--rim-light-bottom);\n}\n\n/* ============================================================================\n RESET BUTTON\n ============================================================================ */\n\n.ds-appearance-panel__reset {\n display: block;\n width: 100%;\n padding: var(--space-3) var(--space-4);\n border: none;\n border-radius: var(--radius-button);\n background: var(--btn-secondary-bg);\n color: var(--text-secondary);\n font-family: var(--font-family);\n font-size: var(--font-size-sm);\n font-weight: var(--font-weight-medium);\n cursor: pointer;\n transition: all var(--transition-glass);\n}\n\n.ds-appearance-panel__reset:hover {\n background: var(--btn-secondary-bg-hover);\n color: var(--text-primary);\n}\n\n.ds-appearance-panel__reset:focus-visible {\n box-shadow: var(--focus-ring);\n outline: none;\n}\n\n/* ============================================================================\n HIGH CONTRAST MODE\n ============================================================================ */\n\n@media (prefers-contrast: more) {\n .ds-appearance-panel {\n border: 1px solid var(--hc-border);\n }\n\n .ds-appearance-panel__color-picker {\n border: 1px solid var(--hc-border);\n }\n}\n",".ds-color-picker {\n display: flex;\n align-items: center;\n gap: 2px;\n padding: 2px;\n border-radius: var(--radius-badge);\n background: var(--interactive-hover-bg);\n border: 1px solid var(--rim-light-bottom);\n}\n\n.ds-color-picker__swatch {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 4px;\n border: none;\n border-radius: var(--radius-xs);\n background: transparent;\n cursor: pointer;\n transition: background var(--transition-fast);\n}\n\n.ds-color-picker__swatch:hover {\n background: var(--interactive-hover-bg);\n}\n\n.ds-color-picker__swatch--active {\n background: var(--interactive-active-bg);\n}\n\n.ds-color-picker__dot {\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: var(--swatch-color);\n border: 1.5px solid var(--rim-light-bottom);\n transition: box-shadow var(--transition-fast);\n}\n\n.ds-color-picker__swatch--active .ds-color-picker__dot {\n box-shadow: 0 0 0 2px var(--swatch-color);\n}\n\n/* Native <input type=\"color\"> hidden behind the custom swatch */\n.ds-color-picker__swatch--custom {\n position: relative;\n}\n\n.ds-color-picker__native-input {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n border: none;\n padding: 0;\n}\n","/* ============================================================================\n VOID BACKGROUND — LEVEL 0 ATMOSPHERIC SYSTEM\n ============================================================================ */\n\n.void {\n position: relative;\n display: flex;\n flex-direction: column;\n width: 100%;\n min-height: 100vh;\n overflow: hidden;\n isolation: isolate;\n}\n\n/* ==========================================================================\n Layer 1: Base Color — Deep purple-black\n ========================================================================== */\n\n.void__base {\n position: absolute;\n inset: 0;\n background-color: var(--void-base);\n z-index: -4;\n}\n\n/* ==========================================================================\n Layer 2: Light Orbs — Brand colors as light sources\n ========================================================================== */\n\n.void__orbs {\n position: absolute;\n inset: 0;\n z-index: -3;\n pointer-events: none;\n}\n\n.void__orb {\n position: absolute;\n border-radius: 50%;\n mix-blend-mode: screen;\n filter: blur(140px);\n opacity: 0.6;\n}\n\n/* Warm Orb: Yellow → Pink gradient, positioned near primary content */\n.void__orb--warm {\n width: 800px;\n height: 800px;\n top: 10%;\n right: 10%;\n background: radial-gradient(\n circle at center,\n rgba(var(--void-orb-yellow-rgb), 0.4) 0%,\n rgba(var(--void-orb-pink-rgb), 0.3) 40%,\n transparent 70%\n );\n}\n\n/* Purple Orb: Deep purple for depth balance */\n.void__orb--purple {\n width: 600px;\n height: 600px;\n bottom: 10%;\n left: 10%;\n background: radial-gradient(\n circle at center,\n rgba(var(--void-orb-purple-rgb), 0.5) 0%,\n rgba(var(--void-orb-purple-rgb), 0.2) 50%,\n transparent 70%\n );\n}\n\n/* ==========================================================================\n Layer 3: Engineered Grid — 80×80px with radial fade\n ========================================================================== */\n\n.void__grid {\n position: absolute;\n inset: 0;\n z-index: -2;\n pointer-events: none;\n background-image:\n linear-gradient(to right, var(--void-grid-color) 1px, transparent 1px),\n linear-gradient(to bottom, var(--void-grid-color) 1px, transparent 1px);\n background-size: var(--void-grid-size) var(--void-grid-size);\n /* Grid fades toward edges — CRITICAL */\n mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black 0%, transparent 100%);\n -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, black 0%, transparent 100%);\n}\n\n/* ==========================================================================\n Layer 4: Film Grain — Static noise texture\n ========================================================================== */\n\n.void__grain {\n position: absolute;\n inset: 0;\n z-index: -1;\n pointer-events: none;\n opacity: var(--void-grid-grain-opacity, 0.04);\n background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E\");\n background-repeat: repeat;\n background-size: 200px 200px;\n}\n\n/* ==========================================================================\n Content Layer\n ========================================================================== */\n\n.void__content {\n position: relative;\n z-index: 1;\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n\n/* ==========================================================================\n Utility: Inline Void (for smaller containers)\n ========================================================================== */\n\n.void--inline {\n min-height: auto;\n}\n\n.void--inline .void__content {\n min-height: auto;\n}\n\n/* ==========================================================================\n Reduced Motion: Disable any future animations\n ========================================================================== */\n\n@media (prefers-reduced-motion: reduce) {\n .void__orb {\n animation: none;\n }\n}\n"],"mappings":"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","names":[]}
package/dist/theme/index.d.cts CHANGED
@@ -37,6 +37,14 @@ interface ColorPickerProps {
37
37
  className?: string;
38
38
  /** Inline styles. */
39
39
  style?: React__default.CSSProperties;
40
+ /**
41
+ * Hide the custom color swatch and native color input.
42
+ * When `true`, only the curated brand presets are shown.
43
+ * Use this on production surfaces (e.g., marketing website footer)
44
+ * where arbitrary custom colors would undermine brand consistency.
45
+ * @default false
46
+ */
47
+ hideCustom?: boolean;
40
48
  }
41
49
  /**
42
50
  * Compact brand/accent color picker.
package/dist/theme/index.d.ts CHANGED
@@ -37,6 +37,14 @@ interface ColorPickerProps {
37
37
  className?: string;
38
38
  /** Inline styles. */
39
39
  style?: React__default.CSSProperties;
40
+ /**
41
+ * Hide the custom color swatch and native color input.
42
+ * When `true`, only the curated brand presets are shown.
43
+ * Use this on production surfaces (e.g., marketing website footer)
44
+ * where arbitrary custom colors would undermine brand consistency.
45
+ * @default false
46
+ */
47
+ hideCustom?: boolean;
40
48
  }
41
49
  /**
42
50
  * Compact brand/accent color picker.
package/dist/theme/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  "use client";
2
- export { ColorPicker, ThemeSelector, VoidBackground } from '../chunk-EFRAP5ES.js';
2
+ export { ColorPicker, ThemeSelector, VoidBackground } from '../chunk-UQ4SHBMC.js';
3
3
  export { AppearancePanel, AppearanceProvider, hexToRgb, initializeAppearance, prefersReducedMotion, useAppearance } from '../chunk-JPJN4YBC.js';
4
4
  //# sourceMappingURL=out.js.map
5
5
  //# sourceMappingURL=index.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salesmind-ai/design-system",
3
- "version": "0.3.7",
3
+ "version": "0.3.9",
4
4
  "packageManager": "pnpm@9.15.9",
5
5
  "description": "Salesmind AI Design System",
6
6
  "license": "MIT",
package/dist/chunk-EFRAP5ES.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/VoidBackground/VoidBackground.tsx","../src/components/ThemeSelector/ThemeSelector.tsx","../src/components/ColorPicker/ColorPicker.tsx"],"names":["clsx","jsx","jsxs","React"],"mappings":"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","sourcesContent":["import React from 'react';\nimport clsx from 'clsx';\nimport './VoidBackground.css';\n\nexport interface VoidBackgroundProps {\n /** Show the engineered grid overlay */\n showGrid?: boolean;\n /** Show the film grain texture */\n showGrain?: boolean;\n /** Custom class name */\n className?: string;\n /** Child content rendered above the void */\n children?: React.ReactNode;\n}\n\n/**\n * VoidBackground — The Void Signature Design System Level 0 Environment\n *\n * A four-layer atmospheric background system:\n * 1. Base Color — Deep purple-black (#08040a)\n * 2. Light Orbs — Radial gradients with mix-blend-mode: screen\n * 3. Engineered Grid — 80×80px with radial fade mask\n * 4. Film Grain — Static SVG noise for texture\n *\n * The Void is not decoration — it is the lighting engine for the UI.\n */\nexport const VoidBackground = React.forwardRef<HTMLDivElement, VoidBackgroundProps>(\n ({ showGrid = true, showGrain = true, className, children }, ref) => {\n return (\n <div ref={ref} className={clsx('void', className)}>\n {/* Layer 1: Base Color */}\n <div className=\"void__base\" aria-hidden=\"true\" />\n\n {/* Layer 2: Light Orbs (Infusion Engine) */}\n <div className=\"void__orbs\" aria-hidden=\"true\">\n <div className=\"void__orb void__orb--warm\" />\n <div className=\"void__orb void__orb--purple\" />\n </div>\n\n {/* Layer 3: Engineered Grid */}\n {showGrid && <div className=\"void__grid\" aria-hidden=\"true\" />}\n\n {/* Layer 4: Film Grain */}\n {showGrain && <div className=\"void__grain\" aria-hidden=\"true\" />}\n\n {/* Content Layer */}\n {children && <div className=\"void__content\">{children}</div>}\n </div>\n );\n },\n);\n\nVoidBackground.displayName = 'VoidBackground';\n","import React from 'react';\nimport { Sun, Moon } from 'lucide-react';\nimport clsx from 'clsx';\nimport { useAppearance, Theme } from '../../theme/AppearanceProvider';\nimport './ThemeSelector.css';\n\nexport interface ThemeSelectorProps {\n className?: string;\n style?: React.CSSProperties;\n}\n\nexport const ThemeSelector: React.FC<ThemeSelectorProps> = ({ className, style }) => {\n const { theme, setTheme } = useAppearance();\n\n const handleThemeChange = (newTheme: Theme) => {\n setTheme(newTheme);\n };\n\n return (\n <div className={clsx('ds-theme-selector', className)} style={style} role=\"group\" aria-label=\"Theme Selector\">\n <button\n type=\"button\"\n className={clsx('ds-theme-selector__btn', { 'ds-theme-selector__btn--active': theme === 'light' })}\n onClick={() => handleThemeChange('light')}\n aria-pressed={theme === 'light'}\n >\n <Sun className=\"ds-theme-selector__icon\" />\n <span className=\"ds-theme-selector__label\">Light</span>\n </button>\n\n <button\n type=\"button\"\n className={clsx('ds-theme-selector__btn', { 'ds-theme-selector__btn--active': theme === 'light-contrast' })}\n onClick={() => handleThemeChange('light-contrast')}\n aria-pressed={theme === 'light-contrast'}\n >\n <Sun className=\"ds-theme-selector__icon\" />\n <span className=\"ds-theme-selector__label\">Light HC</span>\n </button>\n\n <button\n type=\"button\"\n className={clsx('ds-theme-selector__btn', { 'ds-theme-selector__btn--active': theme === 'dark' })}\n onClick={() => handleThemeChange('dark')}\n aria-pressed={theme === 'dark'}\n >\n <Moon className=\"ds-theme-selector__icon\" />\n <span className=\"ds-theme-selector__label\">Dark</span>\n </button>\n\n <button\n type=\"button\"\n className={clsx('ds-theme-selector__btn', { 'ds-theme-selector__btn--active': theme === 'dark-contrast' })}\n onClick={() => handleThemeChange('dark-contrast')}\n aria-pressed={theme === 'dark-contrast'}\n >\n <Moon className=\"ds-theme-selector__icon\" />\n <span className=\"ds-theme-selector__label\">Dark HC</span>\n </button>\n </div>\n );\n};\n\nThemeSelector.displayName = 'ThemeSelector';\n","import React from 'react';\nimport clsx from 'clsx';\nimport { useAppearance, Brand } from '../../theme/AppearanceProvider';\nimport './ColorPicker.css';\n\n/** Pre-configured brand presets shown as swatches. */\nconst BRAND_PRESETS: { value: Brand; label: string; color: string }[] = [\n { value: 'default', label: 'Warm Intelligence', color: '#f97316' },\n { value: 'salesmind', label: 'SalesMind', color: '#ff005a' },\n];\n\nexport interface ColorPickerProps {\n /** Additional CSS class name. */\n className?: string;\n /** Inline styles. */\n style?: React.CSSProperties;\n}\n\n/**\n * Compact brand/accent color picker.\n * Renders preset brand swatches and an optional custom color input.\n * Consumes the `useAppearance()` context for state.\n */\nexport const ColorPicker = React.forwardRef<HTMLDivElement, ColorPickerProps>(\n ({ className, style }, ref) => {\n const { brand, setBrand, customColor, setCustomColor } = useAppearance();\n\n return (\n <div\n ref={ref}\n className={clsx('ds-color-picker', className)}\n style={style}\n role=\"group\"\n aria-label=\"Brand Color\"\n >\n {BRAND_PRESETS.map(({ value, label, color }) => (\n <button\n key={value}\n type=\"button\"\n className={clsx('ds-color-picker__swatch', {\n 'ds-color-picker__swatch--active': brand === value,\n })}\n onClick={() => setBrand(value)}\n aria-label={`Switch to ${label} color scheme`}\n aria-pressed={brand === value}\n title={label}\n >\n <span\n className=\"ds-color-picker__dot\"\n style={{ '--swatch-color': color } as React.CSSProperties}\n />\n </button>\n ))}\n\n {/* Custom color — clicking the dot opens the native color picker */}\n <label\n className={clsx('ds-color-picker__swatch', 'ds-color-picker__swatch--custom', {\n 'ds-color-picker__swatch--active': brand === 'custom',\n })}\n title={`Custom: ${customColor}`}\n >\n <span\n className=\"ds-color-picker__dot\"\n style={{ '--swatch-color': customColor } as React.CSSProperties}\n />\n <input\n type=\"color\"\n value={customColor}\n onChange={(e) => setCustomColor(e.target.value)}\n className=\"ds-color-picker__native-input\"\n aria-label=\"Pick a custom accent color\"\n />\n </label>\n </div>\n );\n },\n);\n\nColorPicker.displayName = 'ColorPicker';\n"]}