@admin-layout/tailwind-design-pro 12.2.4-alpha.39 → 12.2.4-alpha.40

package/lib/components/SettingDrawer/utils/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../src/components/SettingDrawer/utils/constants.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,aAAa;;;GAMzB,CAAC;AAGF,eAAO,MAAM,YAAY;;;GAmBxB,CAAC;AAGF,eAAO,MAAM,eAAe,OAAO,CAAC;AAGpC,eAAO,MAAM,0BAA0B,sIACgG,CAAC"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../src/components/SettingDrawer/utils/constants.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,aAAa;;;GAOzB,CAAC;AAGF,eAAO,MAAM,YAAY;;;GAmBxB,CAAC;AAGF,eAAO,MAAM,eAAe,OAAO,CAAC;AAGpC,eAAO,MAAM,0BAA0B,sIACgG,CAAC"}

package/lib/components/SettingDrawer/utils/constants.js

@@ -14,6 +14,9 @@ const THEME_OPTIONS = [{
 }, {
   key: 'spotify',
   title: 'Spotify Theme'
+}, {
+  key: 'yantra',
+  title: 'Yantra Theme'
 }];
 // Font options for the settings drawer
 const FONT_OPTIONS = [{

package/lib/components/SettingDrawer/utils/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../../../src/components/SettingDrawer/utils/constants.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACO,MAAM,aAAa,GAAG,CAAA;AACzB,EAAA,GAAA,WAAO;AACP,EAAA,OAAK;AACL,CAAA,EAAA;AACA,EAAA,GAAA,UAAO;AACP,EAAA,OAAK;CACR,EAAC;AAEF,EAAA,GAAA,EAAA,OAAA;AACA,EAAA,KAAO,EAAA;AACH,CAAA,EAAA;AACA,EAAA,GAAA,UAAO;AACP,EAAA,OAAK;AACL,CAAA,EAAA;AACA,EAAA,GAAA,WAAO;AACP,EAAA,OAAK;AACL,CAAA;AACA;AACO,MAAA,YAAA,GAAA,CAAA;AACP,EAAA,GAAA,uBAAO;AACP,EAAA,OAAK;AACL,CAAA,EAAA;AACA,EAAA,GAAA,sBAAuB;AACvB,EAAA,OAAK;AACL,CAAA,EAAA;AACA,EAAA,GAAA,yBAAO;AACP,EAAA,OAAK;AACL,CAAA,EAAA;EACF,GAAA,EAAA,wBAAA;AAEF,EAAA,KAAA,EAAA;AACA,CAAA,EAAA;AAEA,EAAA,GAAA,EAAA,kBAAwB;AACxB,EAAA,KAAO,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"constants.js","sources":["../../../../src/components/SettingDrawer/utils/constants.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACO,MAAM,aAAa,GAAG,CAAA;AACzB,EAAA,GAAA,WAAO;AACP,EAAA,OAAK;AACL,CAAA,EAAA;AACA,EAAA,GAAA,UAAO;AACP,EAAA,OAAK;AACL,CAAA,EAAA;EACF,GAAA,EAAA,OAAA;AAEF,EAAA,KAAA,EAAA;AACA,CAAA,EAAA;AACI,EAAA,GAAA,UAAO;AACP,EAAA,OAAK;AACL,CAAA,EAAA;AACA,EAAA,GAAA,WAAO;AACP,EAAA,OAAK;AACL,CAAA,EAAA;AACA,EAAA,GAAA,UAAO;AACP,EAAA,OAAK;AACL,CAAA;AACA;AACO,MAAA,YAAA,GAAA,CAAA;AACP,EAAA,GAAA,uBAAO;AACP,EAAA,OAAK;AACL,CAAA,EAAA;AACA,EAAA,GAAA,sBAAO;AACP,EAAA,OAAK;AACL,CAAA,EAAA;AACA,EAAA,GAAA,yBAAO;EACT,KAAA,EAAA;AAEF,CAAA,EAAA;AACA,EAAA,GAAA,EAAO,wBAAwB;AAE/B,EAAA,KAAA,EAAA;AACA,CAAA,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/styles/index.css

@@ -492,8 +492,290 @@
     --table-header: 141 10% 96%;
     --code-background: 141 10% 96%;
   }
+
+  /* Yantra Theme - Default (Dark)
+     Scene: AI engineer iterating on agentic workflows late evening on a 32"
+     monitor in a warm-lit home office. Warm blue-charcoal surface, amber-gold
+     signal color. Committed color strategy; neutrals tinted toward brand hue. */
+  [data-theme="yantra"] {
+    --background: 222 18% 9%;
+    --foreground: 38 30% 94%;
+    --card: 222 16% 12%;
+    --card-foreground: 38 30% 94%;
+    --popover: 222 16% 12%;
+    --popover-foreground: 38 30% 94%;
+    --primary: 38 92% 58%;
+    --primary-foreground: 222 30% 8%;
+    --secondary: 222 14% 17%;
+    --secondary-foreground: 38 30% 94%;
+    --muted: 222 14% 17%;
+    --muted-foreground: 222 10% 65%;
+    --accent: 222 14% 20%;
+    --accent-foreground: 38 92% 64%;
+    --destructive: 0 72% 55%;
+    --destructive-foreground: 38 30% 96%;
+    --border: 222 14% 20%;
+    --input: 222 14% 20%;
+    --ring: 38 92% 58%;
+    --radius: 0.625rem;
+
+    --brand-primary: 38 92% 58%;
+    --brand-secondary: 222 14% 17%;
+    --brand-accent: 38 80% 70%;
+
+    --success: 152 60% 45%;
+    --warning: 38 92% 58%;
+    --error: 0 72% 55%;
+    --info: 200 80% 55%;
+
+    --gradient-primary: linear-gradient(135deg, hsl(38 92% 58%), hsl(28 92% 52%));
+    --gradient-secondary: linear-gradient(135deg, hsl(222 14% 17%), hsl(222 14% 22%));
+    --gradient-brand: linear-gradient(135deg, hsl(38 92% 58%), hsl(14 80% 56%));
+
+    --shadow-sm: 0 1px 2px 0 hsl(222 30% 4% / 0.4);
+    --shadow-md: 0 4px 12px -2px hsl(222 30% 4% / 0.45);
+    --shadow-lg: 0 12px 32px -8px hsl(222 30% 4% / 0.55);
+    --shadow-xl: 0 24px 48px -12px hsl(222 30% 4% / 0.65);
+
+    --sidebar-background: 222 18% 7%;
+    --sidebar-foreground: 38 30% 94%;
+    --sidebar-border: 222 14% 14%;
+    --modal-backdrop: 222 30% 4% / 0.85;
+    --dropdown-background: 222 16% 12%;
+    --table-header: 222 14% 14%;
+    --code-background: 222 18% 7%;
+  }
+
+  /* Yantra Theme - Light Mode */
+  [data-theme="yantra"].light {
+    --background: 38 30% 98%;
+    --foreground: 222 30% 12%;
+    --card: 0 0% 100%;
+    --card-foreground: 222 30% 12%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 222 30% 12%;
+    --primary: 28 88% 48%;
+    --primary-foreground: 38 30% 98%;
+    --secondary: 38 30% 95%;
+    --secondary-foreground: 222 30% 12%;
+    --muted: 38 22% 94%;
+    --muted-foreground: 222 14% 42%;
+    --accent: 38 60% 92%;
+    --accent-foreground: 28 88% 38%;
+    --destructive: 0 72% 50%;
+    --destructive-foreground: 38 30% 98%;
+    --border: 38 18% 88%;
+    --input: 38 18% 88%;
+    --ring: 28 88% 48%;
+
+    --brand-primary: 28 88% 48%;
+    --brand-secondary: 38 30% 95%;
+    --brand-accent: 38 92% 58%;
+
+    --gradient-primary: linear-gradient(135deg, hsl(28 88% 48%), hsl(14 80% 50%));
+    --gradient-secondary: linear-gradient(135deg, hsl(38 30% 95%), hsl(38 30% 92%));
+    --gradient-brand: linear-gradient(135deg, hsl(38 92% 58%), hsl(14 80% 56%));
+
+    --shadow-sm: 0 1px 2px 0 hsl(28 60% 30% / 0.06);
+    --shadow-md: 0 4px 12px -2px hsl(28 60% 30% / 0.1);
+    --shadow-lg: 0 12px 32px -8px hsl(28 60% 30% / 0.12);
+    --shadow-xl: 0 24px 48px -12px hsl(28 60% 30% / 0.16);
+
+    --sidebar-background: 38 30% 96%;
+    --sidebar-foreground: 222 30% 12%;
+    --sidebar-border: 38 18% 88%;
+    --modal-backdrop: 222 30% 12% / 0.7;
+    --dropdown-background: 0 0% 100%;
+    --table-header: 38 22% 94%;
+    --code-background: 38 22% 94%;
+  }
+
+  /* ─────────────────────────────────────────────────────────────
+     Yantra Editorial Layer — shared design system for marketing
+     and impeccable product surfaces (pricing, operator, landing,
+     gallery, etc.). Tokens use OKLCH; classes are unscoped so any
+     page can opt-in by writing `<div className="y-display">`.
+
+     Brand register: warm cream + persimmon accent, Josefin Sans
+     for display, ui-monospace for captions. Tinted neutrals (no
+     pure black/white). Animation easing committed to one curve.
+     ───────────────────────────────────────────────────────────── */
+  :root {
+    --y-cream:        oklch(0.97 0.012 60);
+    --y-cream-2:      oklch(0.94 0.014 60);
+    --y-cream-3:      oklch(0.91 0.014 60);
+    --y-ink:          oklch(0.18 0.012 60);
+    --y-ink-2:        oklch(0.32 0.013 60);
+    --y-mute:         oklch(0.55 0.012 60);
+    --y-rule:         oklch(0.86 0.012 60);
+    --y-rule-2:       oklch(0.78 0.012 60);
+    --y-accent:       oklch(0.66 0.19 38);
+    --y-accent-ink:   oklch(0.32 0.13 38);
+    --y-ease:         cubic-bezier(0.16, 1, 0.3, 1);
+    --y-font-display: 'Josefin Sans', ui-sans-serif, system-ui, sans-serif;
+    --y-font-mono:    ui-monospace, SFMono-Regular, 'SF Mono', Menlo, monospace;
+  }
+
+  [data-theme="yantra"].dark,
+  [data-theme="yantra"]:not(.light) {
+    /* Inverted editorial palette for dark surfaces — same accent. */
+    --y-cream:        oklch(0.20 0.013 60);
+    --y-cream-2:      oklch(0.24 0.013 60);
+    --y-cream-3:      oklch(0.28 0.013 60);
+    --y-ink:          oklch(0.96 0.010 60);
+    --y-ink-2:        oklch(0.82 0.010 60);
+    --y-mute:         oklch(0.62 0.010 60);
+    --y-rule:         oklch(0.32 0.010 60);
+    --y-rule-2:       oklch(0.40 0.010 60);
+    --y-accent:       oklch(0.74 0.18 38);
+    --y-accent-ink:   oklch(0.86 0.16 38);
+  }
+}
+
+/* Yantra editorial — surface + typography utilities (unscoped) */
+@layer components {
+  .y-surface {
+    background: var(--y-cream);
+    color: var(--y-ink);
+    font-feature-settings: 'ss01', 'cv01', 'cv11';
+  }
+
+  .y-display {
+    font-family: var(--y-font-display);
+    font-weight: 200;
+    font-size: clamp(2.5rem, 6.5vw, 6rem);
+    line-height: 0.95;
+    letter-spacing: -0.035em;
+    color: var(--y-ink);
+  }
+  .y-display em {
+    font-style: italic;
+    font-weight: 300;
+    color: var(--y-accent);
+  }
+  .y-display .y-period { color: var(--y-accent); }
+
+  .y-prose {
+    font-family: var(--y-font-display);
+    font-weight: 300;
+    font-size: clamp(1.4rem, 2.4vw, 2rem);
+    line-height: 1.4;
+    letter-spacing: -0.005em;
+    color: var(--y-ink);
+  }
+  .y-prose em { font-style: italic; color: var(--y-accent-ink); }
+
+  .y-lede {
+    font-family: var(--y-font-display);
+    font-weight: 300;
+    font-size: clamp(1.0625rem, 1.5vw, 1.25rem);
+    line-height: 1.55;
+    color: var(--y-ink-2);
+    max-width: 56ch;
+  }
+  .y-lede em { font-style: italic; color: var(--y-accent); }
+
+  .y-mono {
+    font-family: var(--y-font-mono);
+    font-size: 0.72rem;
+    letter-spacing: 0.14em;
+    text-transform: uppercase;
+    color: var(--y-mute);
+  }
+
+  .y-num {
+    font-family: var(--y-font-display);
+    font-weight: 200;
+    font-size: clamp(2.5rem, 4vw, 3.75rem);
+    line-height: 0.9;
+    letter-spacing: -0.02em;
+    color: var(--y-ink);
+  }
+
+  .y-rule { height: 1px; background: var(--y-rule); border: 0; }
+  .y-dot {
+    width: 0.4rem;
+    height: 0.4rem;
+    border-radius: 50%;
+    background: var(--y-accent);
+    display: inline-block;
+  }
+
+  /* Section grid — paired meta column + content column */
+  .y-section { border-top: 1px solid var(--y-rule); }
+  .y-section-head {
+    display: grid;
+    grid-template-columns: 1fr;
+    gap: 0.5rem;
+    padding-top: clamp(2rem, 5vw, 3.5rem);
+    padding-bottom: clamp(1.5rem, 4vw, 2.5rem);
+  }
+  @media (min-width: 768px) {
+    .y-section-head { grid-template-columns: 5fr 7fr; gap: 2rem; }
+  }
+  .y-section-num {
+    font-family: var(--y-font-mono);
+    font-size: 0.72rem;
+    letter-spacing: 0.16em;
+    text-transform: uppercase;
+    color: var(--y-mute);
+  }
+  .y-section-title {
+    font-family: var(--y-font-display);
+    font-weight: 300;
+    font-size: clamp(1.75rem, 3vw, 2.5rem);
+    line-height: 1.05;
+    letter-spacing: -0.02em;
+    color: var(--y-ink);
+  }
+  .y-section-title em { font-style: italic; color: var(--y-accent); }
+  .y-section-desc {
+    font-size: 1rem;
+    line-height: 1.6;
+    color: var(--y-ink-2);
+    max-width: 60ch;
+    margin-top: 0.75rem;
+  }
+
+  /* Reveal animation — committed to one easing curve */
+  .y-reveal {
+    opacity: 0;
+    transform: translateY(0.6rem);
+    animation: y-reveal 1100ms var(--y-ease) forwards;
+  }
+  .y-reveal[data-d="1"] { animation-delay: 80ms; }
+  .y-reveal[data-d="2"] { animation-delay: 160ms; }
+  .y-reveal[data-d="3"] { animation-delay: 240ms; }
+  .y-reveal[data-d="4"] { animation-delay: 320ms; }
+  .y-reveal[data-d="5"] { animation-delay: 440ms; }
+  @keyframes y-reveal {
+    to { opacity: 1; transform: translateY(0); }
+  }
+  @media (prefers-reduced-motion: reduce) {
+    .y-reveal { opacity: 1; transform: none; animation: none; }
+  }
+
+  /* Capability ticker — for spec lists */
+  .y-ticker {
+    font-family: var(--y-font-mono);
+    font-size: 0.72rem;
+    letter-spacing: 0.06em;
+    text-transform: uppercase;
+    color: var(--y-ink-2);
+  }
+  .y-ticker-row {
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    gap: 1rem;
+    padding: 0.7rem 0;
+    border-top: 1px solid var(--y-rule);
+  }
+  .y-ticker-row:last-child { border-bottom: 1px solid var(--y-rule); }
+  .y-ticker-row .y-ticker-id { color: var(--y-mute); }
 }
 
+
 @layer base {
   * {
     @apply border-border;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@admin-layout/tailwind-design-pro",
-    "version": "12.2.4-alpha.39",
+    "version": "12.2.4-alpha.40",
     "description": "Sample core for higher packages to depend on",
     "license": "ISC",
     "author": "CDMBase LLC",
@@ -55,5 +55,5 @@
     "typescript": {
         "definition": "lib/index.d.ts"
     },
-    "gitHead": "c6059313e412eae73ba479dd483456eafd730b90"
+    "gitHead": "7b980dc331b185c046086a3eb333093337159a40"
 }