@posthog/quill-tokens 0.1.2-alpha.0 → 0.3.0-beta.1

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 (15) hide show
  1. package/dist/color-system.css +9 -21
  2. package/dist/color-system.scoped.css +10 -28
  3. package/dist/colors.d.ts +0 -14
  4. package/dist/colors.d.ts.map +1 -1
  5. package/dist/index.cjs +31 -31
  6. package/dist/index.js +169 -153
  7. package/dist/shadow.d.ts +4 -3
  8. package/dist/shadow.d.ts.map +1 -1
  9. package/dist/tailwind-lib.css +23 -12
  10. package/dist/tailwind-lib.scoped.css +23 -12
  11. package/dist/tailwind.css +23 -12
  12. package/dist/tailwind.scoped.css +23 -12
  13. package/package.json +1 -1
  14. package/src/colors.ts +57 -39
  15. package/src/shadow.ts +4 -3
package/dist/color-system.css CHANGED
@@ -10,7 +10,7 @@
10
10
 
11
11
  /* Theme knobs — override these to shift the palette */
12
12
  :root {
13
- --radius: 0.625rem;
13
+ --radius: 0.58rem;
14
14
  --theme-hue: 90;
15
15
  --theme-dark-hue: 264;
16
16
  --theme-tint: 0.006;
@@ -21,13 +21,9 @@
21
21
  /* Static colors (no theme-var references, safe on :root) */
22
22
  :root {
23
23
  --foreground: oklch(0.13 0.028 262);
24
- --card-foreground: oklch(0.13 0.028 262);
25
- --popover-foreground: oklch(0.13 0.028 262);
24
+ --card-foreground: var(--foreground);
26
25
  --muted-foreground: oklch(0.446 0.03 257);
27
- --accent-foreground: oklch(0.13 0.028 262);
28
26
  --primary-foreground: oklch(1 0 0);
29
- --secondary: oklch(0.31 0 0);
30
- --secondary-foreground: oklch(1 0 0);
31
27
  --destructive: oklch(0.92 0.03 32.22);
32
28
  --destructive-foreground: oklch(0.59 0.2 23.61);
33
29
  --success: oklch(0.94 0.06 154.03);
@@ -41,13 +37,9 @@
41
37
 
42
38
  :is(.dark, [theme="dark"]) {
43
39
  --foreground: oklch(0.967 0.003 265);
44
- --card-foreground: oklch(0.967 0.003 265);
45
- --popover-foreground: oklch(0.967 0.003 265);
40
+ --card-foreground: var(--foreground);
46
41
  --muted-foreground: oklch(0.709 0 0);
47
- --accent-foreground: oklch(0.967 0.003 265);
48
42
  --primary-foreground: oklch(0.13 0.028 262);
49
- --secondary: oklch(0.86 0 0);
50
- --secondary-foreground: oklch(0.13 0.028 262);
51
43
  --destructive: oklch(0.24 0.03 2.79);
52
44
  --destructive-foreground: oklch(0.6316 0.1927 24.53);
53
45
  --success: oklch(0.27 0.04 157.6);
@@ -67,27 +59,23 @@
67
59
  * {
68
60
  --background: oklch(0.97 var(--theme-tint) var(--theme-hue));
69
61
  --card: oklch(0.995 calc(var(--theme-tint) * 0.3) var(--theme-hue));
70
- --popover: oklch(0.995 calc(var(--theme-tint) * 0.3) var(--theme-hue));
71
62
  --muted: oklch(0.94 calc(var(--theme-tint) * 1.5) var(--theme-hue));
72
- --accent: oklch(0.87 calc(var(--theme-tint) * 0.8) var(--theme-hue));
73
63
  --primary: var(--primary-light);
74
64
  --border: oklch(0.9 calc(var(--theme-tint) * 0.8) var(--theme-hue));
75
65
  --input: oklch(0.81 calc(var(--theme-tint) * 0.5) var(--theme-hue));
76
- --fill-expanded: oklch(0.87 0 0 / 60%);
77
- --fill-selected: oklch(0.87 0 0 / 40%);
78
- --fill-hover: oklch(0.87 0 0 / 20%);
66
+ --fill-expanded: color-mix(in oklab, var(--foreground) 6%, transparent);
67
+ --fill-selected: color-mix(in oklab, var(--foreground) 6%, transparent);
68
+ --fill-hover: color-mix(in oklab, var(--foreground) 4%, transparent);
79
69
  }
80
70
 
81
71
  :is(:is(.dark, [theme="dark"]), :is(.dark, [theme="dark"]) *) {
82
72
  --background: oklch(0.145 calc(var(--theme-tint) * 1.5) var(--theme-dark-hue));
83
73
  --card: oklch(0.2 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
84
- --popover: oklch(0.21 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
85
74
  --muted: oklch(0.27 calc(var(--theme-tint) * 1.5) var(--theme-dark-hue));
86
- --accent: oklch(0.35 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
87
75
  --primary: var(--primary-dark);
88
76
  --border: oklch(0.27 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
89
77
  --input: oklch(0.3 calc(var(--theme-tint) * 1.5) var(--theme-dark-hue));
90
- --fill-expanded: oklch(0.55 0 0 / 35%);
91
- --fill-selected: oklch(0.55 0 0 / 25%);
92
- --fill-hover: oklch(0.55 0 0 / 15%);
78
+ --fill-expanded: color-mix(in oklab, var(--foreground) 14%, transparent);
79
+ --fill-selected: color-mix(in oklab, var(--foreground) 10%, transparent);
80
+ --fill-hover: color-mix(in oklab, var(--foreground) 7%, transparent);
93
81
  }
package/dist/color-system.scoped.css CHANGED
@@ -19,20 +19,16 @@
19
19
  }
20
20
 
21
21
  :is([data-quill], [data-quill] *) {
22
- --radius: 0.625rem;
22
+ --radius: 0.58rem;
23
23
  --theme-hue: 90;
24
24
  --theme-dark-hue: 264;
25
25
  --theme-tint: 0.006;
26
26
  --primary-light: oklch(0.65 0.21 37.41);
27
27
  --primary-dark: oklch(0.83 0.16 84.71);
28
28
  --foreground: oklch(0.13 0.028 262);
29
- --card-foreground: oklch(0.13 0.028 262);
30
- --popover-foreground: oklch(0.13 0.028 262);
29
+ --card-foreground: var(--foreground);
31
30
  --muted-foreground: oklch(0.446 0.03 257);
32
- --accent-foreground: oklch(0.13 0.028 262);
33
31
  --primary-foreground: oklch(1 0 0);
34
- --secondary: oklch(0.31 0 0);
35
- --secondary-foreground: oklch(1 0 0);
36
32
  --destructive: oklch(0.92 0.03 32.22);
37
33
  --destructive-foreground: oklch(0.59 0.2 23.61);
38
34
  --success: oklch(0.94 0.06 154.03);
@@ -44,33 +40,25 @@
44
40
  --ring: oklch(0.446 0.03 257);
45
41
  --background: oklch(0.97 var(--theme-tint) var(--theme-hue));
46
42
  --card: oklch(0.995 calc(var(--theme-tint) * 0.3) var(--theme-hue));
47
- --popover: oklch(0.995 calc(var(--theme-tint) * 0.3) var(--theme-hue));
48
43
  --muted: oklch(0.94 calc(var(--theme-tint) * 1.5) var(--theme-hue));
49
- --accent: oklch(0.87 calc(var(--theme-tint) * 0.8) var(--theme-hue));
50
44
  --primary: var(--primary-light);
51
45
  --border: oklch(0.9 calc(var(--theme-tint) * 0.8) var(--theme-hue));
52
46
  --input: oklch(0.81 calc(var(--theme-tint) * 0.5) var(--theme-hue));
53
- --fill-expanded: oklch(0.87 0 0 / 60%);
54
- --fill-selected: oklch(0.87 0 0 / 40%);
55
- --fill-hover: oklch(0.87 0 0 / 20%);
47
+ --fill-expanded: color-mix(in oklab, var(--foreground) 6%, transparent);
48
+ --fill-selected: color-mix(in oklab, var(--foreground) 6%, transparent);
49
+ --fill-hover: color-mix(in oklab, var(--foreground) 4%, transparent);
56
50
 
57
51
  /* Override Tailwind --color-* theme tokens within scope so utilities
58
- * like bg-accent, text-foreground, border-border resolve to quill's
52
+ * like bg-card, text-foreground, border-border resolve to quill's
59
53
  * values instead of the consumer's global theme. */
60
54
  --color-background: var(--background);
61
55
  --color-foreground: var(--foreground);
62
56
  --color-card: var(--card);
63
57
  --color-card-foreground: var(--card-foreground);
64
- --color-popover: var(--popover);
65
- --color-popover-foreground: var(--popover-foreground);
66
58
  --color-muted: var(--muted);
67
59
  --color-muted-foreground: var(--muted-foreground);
68
- --color-accent: var(--accent);
69
- --color-accent-foreground: var(--accent-foreground);
70
60
  --color-primary: var(--primary);
71
61
  --color-primary-foreground: var(--primary-foreground);
72
- --color-secondary: var(--secondary);
73
- --color-secondary-foreground: var(--secondary-foreground);
74
62
  --color-destructive: var(--destructive);
75
63
  --color-destructive-foreground: var(--destructive-foreground);
76
64
  --color-success: var(--success);
@@ -89,13 +77,9 @@
89
77
 
90
78
  :is(:is(.dark, [theme="dark"]) [data-quill], [data-quill]:is(.dark, [theme="dark"]), :is(.dark, [theme="dark"]) [data-quill] *, [data-quill]:is(.dark, [theme="dark"]) *) {
91
79
  --foreground: oklch(0.967 0.003 265);
92
- --card-foreground: oklch(0.967 0.003 265);
93
- --popover-foreground: oklch(0.967 0.003 265);
80
+ --card-foreground: var(--foreground);
94
81
  --muted-foreground: oklch(0.709 0 0);
95
- --accent-foreground: oklch(0.967 0.003 265);
96
82
  --primary-foreground: oklch(0.13 0.028 262);
97
- --secondary: oklch(0.86 0 0);
98
- --secondary-foreground: oklch(0.13 0.028 262);
99
83
  --destructive: oklch(0.24 0.03 2.79);
100
84
  --destructive-foreground: oklch(0.6316 0.1927 24.53);
101
85
  --success: oklch(0.27 0.04 157.6);
@@ -107,13 +91,11 @@
107
91
  --ring: oklch(0.709 0 0);
108
92
  --background: oklch(0.145 calc(var(--theme-tint) * 1.5) var(--theme-dark-hue));
109
93
  --card: oklch(0.2 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
110
- --popover: oklch(0.21 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
111
94
  --muted: oklch(0.27 calc(var(--theme-tint) * 1.5) var(--theme-dark-hue));
112
- --accent: oklch(0.35 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
113
95
  --primary: var(--primary-dark);
114
96
  --border: oklch(0.27 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
115
97
  --input: oklch(0.3 calc(var(--theme-tint) * 1.5) var(--theme-dark-hue));
116
- --fill-expanded: oklch(0.55 0 0 / 35%);
117
- --fill-selected: oklch(0.55 0 0 / 25%);
118
- --fill-hover: oklch(0.55 0 0 / 15%);
98
+ --fill-expanded: color-mix(in oklab, var(--foreground) 14%, transparent);
99
+ --fill-selected: color-mix(in oklab, var(--foreground) 10%, transparent);
100
+ --fill-hover: color-mix(in oklab, var(--foreground) 7%, transparent);
119
101
  }
package/dist/colors.d.ts CHANGED
@@ -67,19 +67,5 @@ export interface StylesConfig {
67
67
  export declare function resolveTheme(mode: 'light' | 'dark'): Record<string, string>;
68
68
  /** Generate color-system.css (:root light + .dark overrides) */
69
69
  export declare function generateColorSystemCSS(theme?: ThemeConfig, opts?: Pick<StylesConfig, 'scope' | 'darkSelector'>): string;
70
- /**
71
- * Generate Tailwind v4 @theme + @custom-variant + optional @layer base.
72
- *
73
- * Does NOT include `@import "tailwindcss"` or `@import "color-system.css"` —
74
- * those are the consuming app's responsibility (they must resolve from the
75
- * app's node_modules, not from tokens/dist/).
76
- *
77
- * Two modes:
78
- * - **Library** (includeBaseLayer: false): Just the @theme inline block
79
- * so Tailwind can generate utility classes. Used by packages.
80
- *
81
- * - **App** (includeBaseLayer: true): @theme + base layer resets.
82
- * Used by apps/web, apps/storybook.
83
- */
84
70
  export declare function generateStylesCSS(config?: StylesConfig): string;
85
71
  //# sourceMappingURL=colors.d.ts.map
package/dist/colors.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../src/colors.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AASH,MAAM,WAAW,WAAW;IACxB,sDAAsD;IACtD,GAAG,EAAE,MAAM,CAAA;IACX,6CAA6C;IAC7C,OAAO,EAAE,MAAM,CAAA;IACf,oEAAoE;IACpE,IAAI,EAAE,MAAM,CAAA;IACZ;;;;;OAKG;IACH,YAAY,EAAE,MAAM,CAAA;IACpB,0DAA0D;IAC1D,WAAW,EAAE,MAAM,CAAA;CACtB;AAED,0EAA0E;AAC1E,eAAO,MAAM,aAAa,EAAE,WAM3B,CAAA;AAID,MAAM,MAAM,gBAAgB,GAAG,MAAM,CAAA;AACrC,MAAM,MAAM,UAAU,GAAG,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,CAAC,CAAA;AA8BtF;;;;;;GAMG;AACH,wBAAgB,mBAAmB,IAAI,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAuEhE;AAED,eAAO,MAAM,cAAc,4BAAwB,CAAA;AAInD,MAAM,WAAW,YAAY;IACzB,kDAAkD;IAClD,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;CACnC;AAID,gCAAgC;AAChC,wBAAgB,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAG3E;AAmED,gEAAgE;AAChE,wBAAgB,sBAAsB,CAClC,KAAK,GAAE,WAA2B,EAClC,IAAI,GAAE,IAAI,CAAC,YAAY,EAAE,OAAO,GAAG,cAAc,CAAM,GACxD,MAAM,CAqHR;AASD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,iBAAiB,CAAC,MAAM,GAAE,YAAiB,GAAG,MAAM,CAwFnE"}
1
+ {"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../src/colors.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AASH,MAAM,WAAW,WAAW;IACxB,sDAAsD;IACtD,GAAG,EAAE,MAAM,CAAA;IACX,6CAA6C;IAC7C,OAAO,EAAE,MAAM,CAAA;IACf,oEAAoE;IACpE,IAAI,EAAE,MAAM,CAAA;IACZ;;;;;OAKG;IACH,YAAY,EAAE,MAAM,CAAA;IACpB,0DAA0D;IAC1D,WAAW,EAAE,MAAM,CAAA;CACtB;AAED,0EAA0E;AAC1E,eAAO,MAAM,aAAa,EAAE,WAM3B,CAAA;AAID,MAAM,MAAM,gBAAgB,GAAG,MAAM,CAAA;AACrC,MAAM,MAAM,UAAU,GAAG,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,CAAC,CAAA;AA8BtF;;;;;;GAMG;AACH,wBAAgB,mBAAmB,IAAI,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAiEhE;AAED,eAAO,MAAM,cAAc,4BAAwB,CAAA;AAInD,MAAM,WAAW,YAAY;IACzB,kDAAkD;IAClD,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;CACnC;AAID,gCAAgC;AAChC,wBAAgB,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAG3E;AAiED,gEAAgE;AAChE,wBAAgB,sBAAsB,CAClC,KAAK,GAAE,WAA2B,EAClC,IAAI,GAAE,IAAI,CAAC,YAAY,EAAE,OAAO,GAAG,cAAc,CAAM,GACxD,MAAM,CAqHR;AAuCD,wBAAgB,iBAAiB,CAAC,MAAM,GAAE,YAAiB,GAAG,MAAM,CAkGnE"}
package/dist/index.cjs CHANGED
@@ -1,43 +1,43 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function b(r,n,t=" "){return Object.entries(r).map(([s,l])=>`${t}--${n}-${s}: ${l};`).join(`
2
- `)}function c(r,n=" "){return Object.entries(r).map(([t,s])=>`${n}--${t}: ${s};`).join(`
3
- `)}function x(r){return/\s/.test(r)?`"${r}"`:r}function y(r){return r.map(x).join(", ")}const S={sm:"0 1px 2px 0 rgba(0, 0, 0, 0.3)",md:"0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -2px rgba(0, 0, 0, 0.3)",lg:"0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -4px rgba(0, 0, 0, 0.3)"};function _(){return b(S,"shadow")}const m=.25,v=`${m}rem`,j=16;function A(r){return`${m*r}rem`}function H(r){return m*r*j}function D(){return` --spacing: ${v};`}const R=16;function a(r){return`${r/R}rem`}const E={xxs:[a(10),{lineHeight:a(12)}],xs:[a(12),{lineHeight:a(16)}],sm:[a(14),{lineHeight:a(20)}],base:[a(16),{lineHeight:a(24)}],lg:[a(18),{lineHeight:a(28)}],xl:[a(20),{lineHeight:a(28)}],"2xl":[a(24),{lineHeight:a(32)}]},T={sans:["-apple-system","BlinkMacSystemFont","Inter","Segoe UI","Roboto","Helvetica Neue","sans-serif"],mono:["JetBrains Mono","Fira Code","monospace"]};function I(){return Object.entries(E).map(([r,[n,{lineHeight:t}]])=>` --text-${r}: ${n};
4
- --text-${r}--line-height: ${t};`).join(`
5
- `)}function M(){return Object.entries(T).map(([r,n])=>` --font-${r}: ${y(n)};`).join(`
6
- `)}const w={hue:90,darkHue:264,tint:.006,primaryLight:"oklch(0.65 0.21 37.41)",primaryDark:"oklch(0.83 0.16 84.71)"};function i(r,n,t,s){const l=t==="light"?"var(--theme-hue)":"var(--theme-dark-hue)",e=n===1?"var(--theme-tint)":n===0?"0":`calc(var(--theme-tint) * ${n})`;return`oklch(${r} ${e} ${l})`}function o(r,n,t,s){return s!==void 0?`oklch(${r} ${n} ${t} / ${s*100}%)`:`oklch(${r} ${n} ${t})`}function C(){return{background:[i(.97,1,"light"),i(.145,1.5,"dark"),"bg-background"],foreground:[o(.13,.028,262),o(.967,.003,265),"text-foreground"],card:[i(.995,.3,"light"),i(.2,1.2,"dark"),"bg-card"],"card-foreground":[o(.13,.028,262),o(.967,.003,265),"text-card-foreground"],popover:[i(.995,.3,"light"),i(.21,1.2,"dark"),"bg-popover"],"popover-foreground":[o(.13,.028,262),o(.967,.003,265),"text-popover-foreground"],muted:[i(.94,1.5,"light"),i(.27,1.5,"dark"),"bg-muted"],"muted-foreground":[o(.446,.03,257),o(.709,0,0),"text-muted-foreground"],accent:[i(.87,.8,"light"),i(.35,1.2,"dark"),"bg-accent"],"accent-foreground":[o(.13,.028,262),o(.967,.003,265),"text-accent-foreground"],primary:["var(--primary-light)","var(--primary-dark)","bg-primary"],"primary-foreground":[o(1,0,0),o(.13,.028,262),"text-primary-foreground"],secondary:[o(.31,0,0),o(.86,0,0),"bg-secondary"],"secondary-foreground":[o(1,0,0),o(.13,.028,262),"text-secondary-foreground"],destructive:[o(.92,.03,32.22),o(.24,.03,2.79),"bg-destructive"],"destructive-foreground":[o(.59,.2,23.61),o(.6316,.1927,24.53),"text-destructive-foreground"],success:[o(.94,.06,154.03),o(.27,.04,157.6),"bg-success"],"success-foreground":[o(.448,.119,151.328),o(.925,.084,155.995),"text-success-foreground"],warning:[o(.93,.04,74.41),o(.29,.03,75),"bg-warning"],"warning-foreground":[o(.476,.114,61.907),o(.77,.14,99.29),"text-warning-foreground"],info:[o(.882,.059,254.128),o(.4242,.1982,265.5,.4),"bg-info"],"info-foreground":[o(.49,.02,254),o(.882,.059,254.128),"text-info-foreground"],border:[i(.9,.8,"light"),i(.27,1.2,"dark"),"border-border"],input:[i(.81,.5,"light"),i(.3,1.5,"dark"),"border-input"],ring:[o(.446,.03,257),o(.709,0,0),"border-ring"],"fill-expanded":["oklch(0.87 0 0 / 60%)","oklch(0.55 0 0 / 35%)","bg-fill-expanded"],"fill-selected":["oklch(0.87 0 0 / 40%)","oklch(0.55 0 0 / 25%)","bg-fill-selected"],"fill-hover":["oklch(0.87 0 0 / 20%)","oklch(0.55 0 0 / 15%)","bg-fill-hover"]}}const p=C();function N(r){const n=r==="light"?0:1;return Object.fromEntries(Object.entries(p).map(([t,s])=>[t,s[n]]))}const V=new Set(["background","card","popover","muted","accent","primary","border","input","fill-hover","fill-expanded","fill-selected"]);function q(r){const n=["var(--theme-hue)","var(--theme-dark-hue)","var(--theme-tint)","var(--primary-light)","var(--primary-dark)"];for(const[t,[s,l]]of Object.entries(r))if(n.some(h=>s.includes(h)||l.includes(h))&&!V.has(t))throw new Error(`[@posthog/quill-tokens] Token "${t}" references a theme variable but is missing from THEME_DERIVED_TOKENS. Add it to the set in colors.ts or local [--theme-hue:X] overrides will silently fail for this token.`)}q(p);function F(r){const t=r===void 0?[".dark",'[theme="dark"]']:typeof r=="string"?[r]:r;return t.length===1?t[0]:`:is(${t.join(", ")})`}function B(r=w,n={}){const{scope:t}=n,s=F(n.darkSelector),l=(u=" ")=>[`${u}--radius: 0.625rem;`,`${u}--theme-hue: ${r.hue};`,`${u}--theme-dark-hue: ${r.darkHue};`,`${u}--theme-tint: ${r.tint};`,`${u}--primary-light: ${r.primaryLight};`,`${u}--primary-dark: ${r.primaryDark};`].join(`
7
- `),e=u=>{const g={},$={};for(const[f,k]of Object.entries(p))V.has(f)?$[f]=k[u]:g[f]=k[u];return{staticVars:g,dynamicVars:$}},h=e(0),d=e(1);if(t){const u=`:is(${t}, ${t} *)`,g=`:is(${s} ${t}, ${t}${s}, ${s} ${t} *, ${t}${s} *)`;return`/* Auto-generated by @posthog/quill-tokens — do not edit manually */
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function v(r,s,o=" "){return Object.entries(r).map(([t,d])=>`${o}--${s}-${t}: ${d};`).join(`
2
+ `)}function p(r,s=" "){return Object.entries(r).map(([o,t])=>`${s}--${o}: ${t};`).join(`
3
+ `)}function S(r){return/\s/.test(r)?`"${r}"`:r}function y(r){return r.map(S).join(", ")}const $={sm:"0 2px 0 color-mix(in oklab, var(--border), transparent 10%)",md:"0 3px 0 color-mix(in oklab, var(--border), transparent 10%)",lg:"0 6px 0 color-mix(in oklab, var(--border), transparent 10%)",line:"0 -1px 0px 0px color-mix(in oklab, var(--border), transparent 10%)"};function F(){return v($,"shadow")}const f=.25,E=`${f}rem`,A=16;function H(r){return`${f*r}rem`}function R(r){return f*r*A}function D(){return` --spacing: ${E};`}const I=16;function i(r){return`${r/I}rem`}const w={xxs:[i(10),{lineHeight:i(12)}],xs:[i(12),{lineHeight:i(16)}],sm:[i(14),{lineHeight:i(20)}],base:[i(16),{lineHeight:i(24)}],lg:[i(18),{lineHeight:i(28)}],xl:[i(20),{lineHeight:i(28)}],"2xl":[i(24),{lineHeight:i(32)}]},T={sans:["-apple-system","BlinkMacSystemFont","Inter","Segoe UI","Roboto","Helvetica Neue","sans-serif"],mono:["JetBrains Mono","Fira Code","monospace"]};function M(){return Object.entries(w).map(([r,[s,{lineHeight:o}]])=>` --text-${r}: ${s};
4
+ --text-${r}--line-height: ${o};`).join(`
5
+ `)}function N(){return Object.entries(T).map(([r,s])=>` --font-${r}: ${y(s)};`).join(`
6
+ `)}const C={hue:90,darkHue:264,tint:.006,primaryLight:"oklch(0.65 0.21 37.41)",primaryDark:"oklch(0.83 0.16 84.71)"};function c(r,s,o,t){const d=o==="light"?"var(--theme-hue)":"var(--theme-dark-hue)",e=s===1?"var(--theme-tint)":s===0?"0":`calc(var(--theme-tint) * ${s})`;return`oklch(${r} ${e} ${d})`}function a(r,s,o,t){return t!==void 0?`oklch(${r} ${s} ${o} / ${t*100}%)`:`oklch(${r} ${s} ${o})`}function V(){return{background:[c(.97,1,"light"),c(.145,1.5,"dark"),"bg-background"],foreground:[a(.13,.028,262),a(.967,.003,265),"text-foreground"],card:[c(.995,.3,"light"),c(.2,1.2,"dark"),"bg-card"],"card-foreground":["var(--foreground)","var(--foreground)","text-card-foreground"],muted:[c(.94,1.5,"light"),c(.27,1.5,"dark"),"bg-muted"],"muted-foreground":[a(.446,.03,257),a(.709,0,0),"text-muted-foreground"],primary:["var(--primary-light)","var(--primary-dark)","bg-primary"],"primary-foreground":[a(1,0,0),a(.13,.028,262),"text-primary-foreground"],destructive:[a(.92,.03,32.22),a(.24,.03,2.79),"bg-destructive"],"destructive-foreground":[a(.59,.2,23.61),a(.6316,.1927,24.53),"text-destructive-foreground"],success:[a(.94,.06,154.03),a(.27,.04,157.6),"bg-success"],"success-foreground":[a(.448,.119,151.328),a(.925,.084,155.995),"text-success-foreground"],warning:[a(.93,.04,74.41),a(.29,.03,75),"bg-warning"],"warning-foreground":[a(.476,.114,61.907),a(.77,.14,99.29),"text-warning-foreground"],info:[a(.882,.059,254.128),a(.4242,.1982,265.5,.4),"bg-info"],"info-foreground":[a(.49,.02,254),a(.882,.059,254.128),"text-info-foreground"],border:[c(.9,.8,"light"),c(.27,1.2,"dark"),"border-border"],input:[c(.81,.5,"light"),c(.3,1.5,"dark"),"border-input"],ring:[a(.446,.03,257),a(.709,0,0),"border-ring"],"fill-expanded":["color-mix(in oklab, var(--foreground) 6%, transparent)","color-mix(in oklab, var(--foreground) 14%, transparent)","bg-fill-expanded"],"fill-selected":["color-mix(in oklab, var(--foreground) 6%, transparent)","color-mix(in oklab, var(--foreground) 10%, transparent)","bg-fill-selected"],"fill-hover":["color-mix(in oklab, var(--foreground) 4%, transparent)","color-mix(in oklab, var(--foreground) 7%, transparent)","bg-fill-hover"]}}const h=V();function q(r){const s=r==="light"?0:1;return Object.fromEntries(Object.entries(h).map(([o,t])=>[o,t[s]]))}const O=new Set(["background","card","muted","primary","border","input","fill-hover","fill-expanded","fill-selected"]);function B(r){const s=["var(--theme-hue)","var(--theme-dark-hue)","var(--theme-tint)","var(--primary-light)","var(--primary-dark)"];for(const[o,[t,d]]of Object.entries(r))if(s.some(u=>t.includes(u)||d.includes(u))&&!O.has(o))throw new Error(`[@posthog/quill-tokens] Token "${o}" references a theme variable but is missing from THEME_DERIVED_TOKENS. Add it to the set in colors.ts or local [--theme-hue:X] overrides will silently fail for this token.`)}B(h);function _(r){const o=r===void 0?[".dark",'[theme="dark"]']:typeof r=="string"?[r]:r;return o.length===1?o[0]:`:is(${o.join(", ")})`}function P(r=C,s={}){const{scope:o}=s,t=_(s.darkSelector),d=(n=" ")=>[`${n}--radius: 0.58rem;`,`${n}--theme-hue: ${r.hue};`,`${n}--theme-dark-hue: ${r.darkHue};`,`${n}--theme-tint: ${r.tint};`,`${n}--primary-light: ${r.primaryLight};`,`${n}--primary-dark: ${r.primaryDark};`].join(`
7
+ `),e=n=>{const m={},k={};for(const[g,b]of Object.entries(h))O.has(g)?k[g]=b[n]:m[g]=b[n];return{staticVars:m,dynamicVars:k}},u=e(0),l=e(1);if(o){const n=`:is(${o}, ${o} *)`,m=`:is(${t} ${o}, ${o}${t}, ${t} ${o} *, ${o}${t} *)`;return`/* Auto-generated by @posthog/quill-tokens — do not edit manually */
8
8
 
9
9
  /*
10
- * Scoped output — all token vars are gated behind \`${t}\` so they
10
+ * Scoped output — all token vars are gated behind \`${o}\` so they
11
11
  * do not clash with the consumer's existing CSS custom properties.
12
- * Add the \`${t.replace(/[[\]]/g,"")}\` attribute to wrapper elements
12
+ * Add the \`${o.replace(/[[\]]/g,"")}\` attribute to wrapper elements
13
13
  * where quill components are rendered.
14
14
  *
15
15
  * Dark mode: works when the dark selector is on an ancestor of the scope
16
16
  * element (.dark > [data-quill]) OR on the scope element itself
17
17
  * ([data-quill].dark).
18
18
  */
19
- ${t} {
19
+ ${o} {
20
20
  color-scheme: light;
21
21
  }
22
22
 
23
- :is(${s} ${t}, ${t}${s}) {
23
+ :is(${t} ${o}, ${o}${t}) {
24
24
  color-scheme: dark;
25
25
  }
26
26
 
27
- ${u} {
28
- ${l()}
29
- ${c(h.staticVars)}
30
- ${c(h.dynamicVars)}
27
+ ${n} {
28
+ ${d()}
29
+ ${p(u.staticVars)}
30
+ ${p(u.dynamicVars)}
31
31
 
32
32
  /* Override Tailwind --color-* theme tokens within scope so utilities
33
- * like bg-accent, text-foreground, border-border resolve to quill's
33
+ * like bg-card, text-foreground, border-border resolve to quill's
34
34
  * values instead of the consumer's global theme. */
35
- ${O()}
35
+ ${j()}
36
36
  }
37
37
 
38
- ${g} {
39
- ${c(d.staticVars)}
40
- ${c(d.dynamicVars)}
38
+ ${m} {
39
+ ${p(l.staticVars)}
40
+ ${p(l.dynamicVars)}
41
41
  }
42
42
  `}return`/* Auto-generated by @posthog/quill-tokens — do not edit manually */
43
43
 
@@ -45,22 +45,22 @@ ${c(d.dynamicVars)}
45
45
  color-scheme: light;
46
46
  }
47
47
 
48
- ${s} {
48
+ ${t} {
49
49
  color-scheme: dark;
50
50
  }
51
51
 
52
52
  /* Theme knobs — override these to shift the palette */
53
53
  :root {
54
- ${l()}
54
+ ${d()}
55
55
  }
56
56
 
57
57
  /* Static colors (no theme-var references, safe on :root) */
58
58
  :root {
59
- ${c(h.staticVars)}
59
+ ${p(u.staticVars)}
60
60
  }
61
61
 
62
- ${s} {
63
- ${c(d.staticVars)}
62
+ ${t} {
63
+ ${p(l.staticVars)}
64
64
  }
65
65
 
66
66
  /*
@@ -69,12 +69,12 @@ ${c(d.staticVars)}
69
69
  * This enables local overrides like [--theme-hue:200] on a container.
70
70
  */
71
71
  * {
72
- ${c(h.dynamicVars)}
72
+ ${p(u.dynamicVars)}
73
73
  }
74
74
 
75
- :is(${s}, ${s} *) {
76
- ${c(d.dynamicVars)}
75
+ :is(${t}, ${t} *) {
76
+ ${p(l.dynamicVars)}
77
77
  }
78
- `}function O(){return Object.keys(p).map(r=>` --color-${r}: var(--${r});`).join(`
79
- `)}function P(r={}){const{includeBaseLayer:n=!1,scope:t}=r,s=F(r.darkSelector),e=["/* Auto-generated by @posthog/quill-tokens — do not edit manually */","",`@custom-variant dark (${`&:is(${s}, ${s} *)`});`];return e.push(""),e.push("@theme inline {"),e.push(" --animate-skeleton: skeleton 2s -1s infinite linear;"),e.push(" --animate-pulse-glow: pulse-glow 2s -1s infinite linear;"),e.push(" --animate-horizontal-shake: horizontal-shake 0.3s ease-out;"),e.push(" --animate-radar: radar 2s ease-out infinite;"),e.push(""),e.push(" /* --- Colors --- */"),e.push(O()),e.push(""),e.push(" /* --- Spacing --- */"),e.push(D()),e.push(""),e.push(" /* --- Font sizes --- */"),e.push(I()),e.push(""),e.push(" /* --- Font families --- */"),e.push(M()),e.push(""),e.push(" /* --- Shadows --- */"),e.push(_()),e.push(""),e.push(" /* --- Radius (derived from --radius base) --- */"),e.push(" --radius-sm: calc(var(--radius) - 4px);"),e.push(" --radius-md: calc(var(--radius) - 2px);"),e.push(" --radius-lg: var(--radius);"),e.push(" --radius-xl: calc(var(--radius) + 4px);"),e.push(" --radius-2xl: calc(var(--radius) + 8px);"),e.push(" --radius-3xl: calc(var(--radius) + 12px);"),e.push(" --radius-4xl: calc(var(--radius) + 16px);"),e.push(""),e.push(" @keyframes skeleton {"),e.push(" to {"),e.push(" background-position: -200% 0;"),e.push(" }"),e.push(" }"),e.push(""),e.push(" @keyframes pulse-glow {"),e.push(" 0%, 100% { box-shadow: 0 0 2px 1px var(--pulse-glow-color, var(--color-accent)) }"),e.push(" 50% { box-shadow: 0 0 6px 2px var(--pulse-glow-color, var(--color-accent)) }"),e.push(" }"),e.push(""),e.push(" @keyframes horizontal-shake {"),e.push(" 0% { transform: translateX(0); }"),e.push(" 25% { transform: translateX(5px); }"),e.push(" 50% { transform: translateX(-5px); }"),e.push(" 75% { transform: translateX(2px); }"),e.push(" 100% { transform: translateX(0); }"),e.push(" }"),e.push(""),e.push(" @keyframes radar {"),e.push(" 0% { transform: scale(1); opacity: 0.5; }"),e.push(" 100% { transform: scale(1.5); opacity: 0; }"),e.push(" }"),e.push("}"),n&&(e.push(""),e.push("@layer base {"),t?(e.push(` ${t}, ${t} * {`),e.push(" @apply border-border outline-ring/50;"),e.push(" }")):(e.push(" * {"),e.push(" @apply border-border outline-ring/50;"),e.push(" }"),e.push(" body {"),e.push(" @apply bg-background text-foreground;"),e.push(" }")),e.push("}")),e.push(""),e.join(`
80
- `)}const z={none:"0px",sm:"4px",md:"6px",lg:"8px",xl:"12px",full:"9999px"};exports.DEFAULT_THEME=w;exports.SPACING_BASE=v;exports.SPACING_BASE_REM=m;exports.borderRadius=z;exports.buildSemanticColors=C;exports.cssVars=b;exports.cssVarsFlat=c;exports.fontFamily=T;exports.fontFamilyValue=y;exports.fontSize=E;exports.generateColorSystemCSS=B;exports.generateStylesCSS=P;exports.quoteFontName=x;exports.resolveTheme=N;exports.semanticColors=p;exports.shadow=S;exports.spacing=A;exports.spacingPx=H;
78
+ `}function j(){return Object.keys(h).map(r=>` --color-${r}: var(--${r});`).join(`
79
+ `)}const x=[["--radius-xs","calc(var(--radius) - 7px)"],["--radius-sm","calc(var(--radius) - 5px)"],["--radius-md","calc(var(--radius) - 2px)"],["--radius-lg","var(--radius)"],["--radius-xl","calc(var(--radius) + 4px)"],["--radius-2xl","calc(var(--radius) + 8px)"],["--radius-3xl","calc(var(--radius) + 12px)"],["--radius-4xl","calc(var(--radius) + 16px)"]];function z(r={}){const{includeBaseLayer:s=!1,scope:o}=r,t=_(r.darkSelector),e=["/* Auto-generated by @posthog/quill-tokens — do not edit manually */","",`@custom-variant dark (${`&:is(${t}, ${t} *)`});`];e.push(""),e.push("@theme inline {"),e.push(" --animate-skeleton: skeleton 2s -1s infinite linear;"),e.push(" --animate-pulse-glow: pulse-glow 2s -1s infinite linear;"),e.push(" --animate-horizontal-shake: horizontal-shake 0.3s ease-out;"),e.push(" --animate-radar: radar 2s ease-out infinite;"),e.push(""),e.push(" /* --- Colors --- */"),e.push(j()),e.push(""),e.push(" /* --- Spacing --- */"),e.push(D()),e.push(""),e.push(" /* --- Font sizes --- */"),e.push(M()),e.push(""),e.push(" /* --- Font families --- */"),e.push(N()),e.push(""),e.push(" /* --- Shadows --- */"),e.push(F()),e.push(""),e.push(" /* --- Radius (derived from --radius base) --- */");for(const[l,n]of x)e.push(` ${l}: ${n};`);e.push(""),e.push(" @keyframes skeleton {"),e.push(" to {"),e.push(" background-position: -200% 0;"),e.push(" }"),e.push(" }"),e.push(""),e.push(" @keyframes pulse-glow {"),e.push(" 0%, 100% { box-shadow: 0 0 2px 1px var(--pulse-glow-color, var(--color-primary)) }"),e.push(" 50% { box-shadow: 0 0 6px 2px var(--pulse-glow-color, var(--color-primary)) }"),e.push(" }"),e.push(""),e.push(" @keyframes horizontal-shake {"),e.push(" 0% { transform: translateX(0); }"),e.push(" 25% { transform: translateX(5px); }"),e.push(" 50% { transform: translateX(-5px); }"),e.push(" 75% { transform: translateX(2px); }"),e.push(" 100% { transform: translateX(0); }"),e.push(" }"),e.push(""),e.push(" @keyframes radar {"),e.push(" 0% { transform: scale(1); opacity: 0.5; }"),e.push(" 100% { transform: scale(1.5); opacity: 0; }"),e.push(" }"),e.push("}"),e.push("");const u=o??":root";e.push(`${u} {`);for(const[l,n]of x)e.push(` ${l}: ${n};`);for(const[l,n]of Object.entries($))e.push(` --shadow-${l}: ${n};`);return e.push("}"),s&&(e.push(""),e.push("@layer base {"),o?(e.push(` ${o}, ${o} * {`),e.push(" @apply border-border outline-ring/50;"),e.push(" }")):(e.push(" * {"),e.push(" @apply border-border outline-ring/50;"),e.push(" }"),e.push(" body {"),e.push(" @apply bg-background text-foreground;"),e.push(" }")),e.push("}")),e.push(""),e.join(`
80
+ `)}const X={none:"0px",sm:"4px",md:"6px",lg:"8px",xl:"12px",full:"9999px"};exports.DEFAULT_THEME=C;exports.SPACING_BASE=E;exports.SPACING_BASE_REM=f;exports.borderRadius=X;exports.buildSemanticColors=V;exports.cssVars=v;exports.cssVarsFlat=p;exports.fontFamily=T;exports.fontFamilyValue=y;exports.fontSize=w;exports.generateColorSystemCSS=P;exports.generateStylesCSS=z;exports.quoteFontName=S;exports.resolveTheme=q;exports.semanticColors=h;exports.shadow=$;exports.spacing=H;exports.spacingPx=R;