@posthog/quill-tokens 0.1.2-alpha.0 → 0.3.0-beta.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.
- package/dist/color-system.css +18 -28
- package/dist/color-system.scoped.css +19 -34
- package/dist/index.cjs +31 -31
- package/dist/index.js +185 -157
- package/dist/src/border-radius.d.ts.map +1 -0
- package/dist/{colors.d.ts → src/colors.d.ts} +5 -16
- package/dist/src/colors.d.ts.map +1 -0
- package/dist/src/css.d.ts.map +1 -0
- package/dist/src/index.d.ts.map +1 -0
- package/dist/src/shadow.d.ts +13 -0
- package/dist/src/shadow.d.ts.map +1 -0
- package/dist/src/spacing.d.ts.map +1 -0
- package/dist/src/typography.d.ts.map +1 -0
- package/dist/tailwind-lib.css +25 -13
- package/dist/tailwind-lib.scoped.css +25 -13
- package/dist/tailwind.css +25 -13
- package/dist/tailwind.scoped.css +25 -13
- package/package.json +1 -1
- package/src/colors.ts +77 -43
- package/src/shadow.ts +4 -3
- package/dist/border-radius.d.ts.map +0 -1
- package/dist/colors.d.ts.map +0 -1
- package/dist/css.d.ts.map +0 -1
- package/dist/index.d.ts.map +0 -1
- package/dist/shadow.d.ts +0 -12
- package/dist/shadow.d.ts.map +0 -1
- package/dist/spacing.d.ts.map +0 -1
- package/dist/typography.d.ts.map +0 -1
- /package/dist/{border-radius.d.ts → src/border-radius.d.ts} +0 -0
- /package/dist/{css.d.ts → src/css.d.ts} +0 -0
- /package/dist/{index.d.ts → src/index.d.ts} +0 -0
- /package/dist/{spacing.d.ts → src/spacing.d.ts} +0 -0
- /package/dist/{typography.d.ts → src/typography.d.ts} +0 -0
package/dist/color-system.css
CHANGED
|
@@ -4,13 +4,13 @@
|
|
|
4
4
|
color-scheme: light;
|
|
5
5
|
}
|
|
6
6
|
|
|
7
|
-
:is(.dark, [theme="dark"]) {
|
|
7
|
+
:is(.dark, [theme="dark"], [data-theme="dark"]) {
|
|
8
8
|
color-scheme: dark;
|
|
9
9
|
}
|
|
10
10
|
|
|
11
11
|
/* Theme knobs — override these to shift the palette */
|
|
12
12
|
:root {
|
|
13
|
-
--radius: 0.
|
|
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:
|
|
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);
|
|
@@ -39,15 +35,11 @@
|
|
|
39
35
|
--ring: oklch(0.446 0.03 257);
|
|
40
36
|
}
|
|
41
37
|
|
|
42
|
-
:is(.dark, [theme="dark"]) {
|
|
38
|
+
:is(.dark, [theme="dark"], [data-theme="dark"]) {
|
|
43
39
|
--foreground: oklch(0.967 0.003 265);
|
|
44
|
-
--card-foreground:
|
|
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);
|
|
@@ -65,29 +57,27 @@
|
|
|
65
57
|
* This enables local overrides like [--theme-hue:200] on a container.
|
|
66
58
|
*/
|
|
67
59
|
* {
|
|
68
|
-
--background: oklch(0.
|
|
60
|
+
--background: oklch(0.966 calc(var(--theme-tint) * 0.79) var(--theme-hue));
|
|
69
61
|
--card: oklch(0.995 calc(var(--theme-tint) * 0.3) var(--theme-hue));
|
|
70
|
-
--
|
|
71
|
-
--
|
|
72
|
-
--accent: oklch(0.87 calc(var(--theme-tint) * 0.8) var(--theme-hue));
|
|
62
|
+
--muted: oklch(0.953 calc(var(--theme-tint) * 1.28) var(--theme-hue));
|
|
63
|
+
--chrome: oklch(0.923 calc(var(--theme-tint) * 1.67) var(--theme-hue));
|
|
73
64
|
--primary: var(--primary-light);
|
|
74
65
|
--border: oklch(0.9 calc(var(--theme-tint) * 0.8) var(--theme-hue));
|
|
75
66
|
--input: oklch(0.81 calc(var(--theme-tint) * 0.5) var(--theme-hue));
|
|
76
|
-
--fill-expanded:
|
|
77
|
-
--fill-selected:
|
|
78
|
-
--fill-hover:
|
|
67
|
+
--fill-expanded: color-mix(in oklab, var(--foreground) 6%, transparent);
|
|
68
|
+
--fill-selected: color-mix(in oklab, var(--foreground) 6%, transparent);
|
|
69
|
+
--fill-hover: color-mix(in oklab, var(--foreground) 4%, transparent);
|
|
79
70
|
}
|
|
80
71
|
|
|
81
|
-
:is(:is(.dark, [theme="dark"]), :is(.dark, [theme="dark"]) *) {
|
|
82
|
-
--background: oklch(0.
|
|
72
|
+
:is(:is(.dark, [theme="dark"], [data-theme="dark"]), :is(.dark, [theme="dark"], [data-theme="dark"]) *) {
|
|
73
|
+
--background: oklch(0.187 calc(var(--theme-tint) * 1.1) var(--theme-dark-hue));
|
|
83
74
|
--card: oklch(0.2 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
|
|
84
|
-
--
|
|
85
|
-
--
|
|
86
|
-
--accent: oklch(0.35 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
|
|
75
|
+
--muted: oklch(0.209 calc(var(--theme-tint) * 1.33) var(--theme-dark-hue));
|
|
76
|
+
--chrome: oklch(0.187 calc(var(--theme-tint) * 1.1) var(--theme-dark-hue));
|
|
87
77
|
--primary: var(--primary-dark);
|
|
88
78
|
--border: oklch(0.27 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
|
|
89
79
|
--input: oklch(0.3 calc(var(--theme-tint) * 1.5) var(--theme-dark-hue));
|
|
90
|
-
--fill-expanded:
|
|
91
|
-
--fill-selected:
|
|
92
|
-
--fill-hover:
|
|
80
|
+
--fill-expanded: color-mix(in oklab, var(--foreground) 14%, transparent);
|
|
81
|
+
--fill-selected: color-mix(in oklab, var(--foreground) 10%, transparent);
|
|
82
|
+
--fill-hover: color-mix(in oklab, var(--foreground) 7%, transparent);
|
|
93
83
|
}
|
|
@@ -14,25 +14,21 @@
|
|
|
14
14
|
color-scheme: light;
|
|
15
15
|
}
|
|
16
16
|
|
|
17
|
-
:is(:is(.dark, [theme="dark"]) [data-quill], [data-quill]:is(.dark, [theme="dark"])) {
|
|
17
|
+
:is(:is(.dark, [theme="dark"], [data-theme="dark"]) [data-quill], [data-quill]:is(.dark, [theme="dark"], [data-theme="dark"])) {
|
|
18
18
|
color-scheme: dark;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
:is([data-quill], [data-quill] *) {
|
|
22
|
-
--radius: 0.
|
|
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:
|
|
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);
|
|
@@ -42,35 +38,29 @@
|
|
|
42
38
|
--info: oklch(0.882 0.059 254.128);
|
|
43
39
|
--info-foreground: oklch(0.49 0.02 254);
|
|
44
40
|
--ring: oklch(0.446 0.03 257);
|
|
45
|
-
--background: oklch(0.
|
|
41
|
+
--background: oklch(0.966 calc(var(--theme-tint) * 0.79) var(--theme-hue));
|
|
46
42
|
--card: oklch(0.995 calc(var(--theme-tint) * 0.3) var(--theme-hue));
|
|
47
|
-
--
|
|
48
|
-
--
|
|
49
|
-
--accent: oklch(0.87 calc(var(--theme-tint) * 0.8) var(--theme-hue));
|
|
43
|
+
--muted: oklch(0.953 calc(var(--theme-tint) * 1.28) var(--theme-hue));
|
|
44
|
+
--chrome: oklch(0.923 calc(var(--theme-tint) * 1.67) var(--theme-hue));
|
|
50
45
|
--primary: var(--primary-light);
|
|
51
46
|
--border: oklch(0.9 calc(var(--theme-tint) * 0.8) var(--theme-hue));
|
|
52
47
|
--input: oklch(0.81 calc(var(--theme-tint) * 0.5) var(--theme-hue));
|
|
53
|
-
--fill-expanded:
|
|
54
|
-
--fill-selected:
|
|
55
|
-
--fill-hover:
|
|
48
|
+
--fill-expanded: color-mix(in oklab, var(--foreground) 6%, transparent);
|
|
49
|
+
--fill-selected: color-mix(in oklab, var(--foreground) 6%, transparent);
|
|
50
|
+
--fill-hover: color-mix(in oklab, var(--foreground) 4%, transparent);
|
|
56
51
|
|
|
57
52
|
/* Override Tailwind --color-* theme tokens within scope so utilities
|
|
58
|
-
* like bg-
|
|
53
|
+
* like bg-card, text-foreground, border-border resolve to quill's
|
|
59
54
|
* values instead of the consumer's global theme. */
|
|
60
55
|
--color-background: var(--background);
|
|
61
56
|
--color-foreground: var(--foreground);
|
|
62
57
|
--color-card: var(--card);
|
|
63
58
|
--color-card-foreground: var(--card-foreground);
|
|
64
|
-
--color-popover: var(--popover);
|
|
65
|
-
--color-popover-foreground: var(--popover-foreground);
|
|
66
59
|
--color-muted: var(--muted);
|
|
67
60
|
--color-muted-foreground: var(--muted-foreground);
|
|
68
|
-
--color-
|
|
69
|
-
--color-accent-foreground: var(--accent-foreground);
|
|
61
|
+
--color-chrome: var(--chrome);
|
|
70
62
|
--color-primary: var(--primary);
|
|
71
63
|
--color-primary-foreground: var(--primary-foreground);
|
|
72
|
-
--color-secondary: var(--secondary);
|
|
73
|
-
--color-secondary-foreground: var(--secondary-foreground);
|
|
74
64
|
--color-destructive: var(--destructive);
|
|
75
65
|
--color-destructive-foreground: var(--destructive-foreground);
|
|
76
66
|
--color-success: var(--success);
|
|
@@ -87,15 +77,11 @@
|
|
|
87
77
|
--color-fill-hover: var(--fill-hover);
|
|
88
78
|
}
|
|
89
79
|
|
|
90
|
-
: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"]) *) {
|
|
80
|
+
:is(:is(.dark, [theme="dark"], [data-theme="dark"]) [data-quill], [data-quill]:is(.dark, [theme="dark"], [data-theme="dark"]), :is(.dark, [theme="dark"], [data-theme="dark"]) [data-quill] *, [data-quill]:is(.dark, [theme="dark"], [data-theme="dark"]) *) {
|
|
91
81
|
--foreground: oklch(0.967 0.003 265);
|
|
92
|
-
--card-foreground:
|
|
93
|
-
--popover-foreground: oklch(0.967 0.003 265);
|
|
82
|
+
--card-foreground: var(--foreground);
|
|
94
83
|
--muted-foreground: oklch(0.709 0 0);
|
|
95
|
-
--accent-foreground: oklch(0.967 0.003 265);
|
|
96
84
|
--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
85
|
--destructive: oklch(0.24 0.03 2.79);
|
|
100
86
|
--destructive-foreground: oklch(0.6316 0.1927 24.53);
|
|
101
87
|
--success: oklch(0.27 0.04 157.6);
|
|
@@ -105,15 +91,14 @@
|
|
|
105
91
|
--info: oklch(0.4242 0.1982 265.5 / 40%);
|
|
106
92
|
--info-foreground: oklch(0.882 0.059 254.128);
|
|
107
93
|
--ring: oklch(0.709 0 0);
|
|
108
|
-
--background: oklch(0.
|
|
94
|
+
--background: oklch(0.187 calc(var(--theme-tint) * 1.1) var(--theme-dark-hue));
|
|
109
95
|
--card: oklch(0.2 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
|
|
110
|
-
--
|
|
111
|
-
--
|
|
112
|
-
--accent: oklch(0.35 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
|
|
96
|
+
--muted: oklch(0.209 calc(var(--theme-tint) * 1.33) var(--theme-dark-hue));
|
|
97
|
+
--chrome: oklch(0.187 calc(var(--theme-tint) * 1.1) var(--theme-dark-hue));
|
|
113
98
|
--primary: var(--primary-dark);
|
|
114
99
|
--border: oklch(0.27 calc(var(--theme-tint) * 1.2) var(--theme-dark-hue));
|
|
115
100
|
--input: oklch(0.3 calc(var(--theme-tint) * 1.5) var(--theme-dark-hue));
|
|
116
|
-
--fill-expanded:
|
|
117
|
-
--fill-selected:
|
|
118
|
-
--fill-hover:
|
|
101
|
+
--fill-expanded: color-mix(in oklab, var(--foreground) 14%, transparent);
|
|
102
|
+
--fill-selected: color-mix(in oklab, var(--foreground) 10%, transparent);
|
|
103
|
+
--fill-hover: color-mix(in oklab, var(--foreground) 7%, transparent);
|
|
119
104
|
}
|
package/dist/index.cjs
CHANGED
|
@@ -1,43 +1,43 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function
|
|
2
|
-
`)}function
|
|
3
|
-
`)}function
|
|
4
|
-
--text-${r}--line-height: ${
|
|
5
|
-
`)}function
|
|
6
|
-
`)}const
|
|
7
|
-
`),e=
|
|
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 h(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 u(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:[u(.966,.79,"light"),u(.187,1.1,"dark"),"bg-background"],foreground:[a(.13,.028,262),a(.967,.003,265),"text-foreground"],card:[u(.995,.3,"light"),u(.2,1.2,"dark"),"bg-card"],"card-foreground":["var(--foreground)","var(--foreground)","text-card-foreground"],muted:[u(.953,1.28,"light"),u(.209,1.33,"dark"),"bg-muted"],"muted-foreground":[a(.446,.03,257),a(.709,0,0),"text-muted-foreground"],chrome:[u(.923,1.67,"light"),u(.187,1.1,"dark"),"bg-chrome"],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:[u(.9,.8,"light"),u(.27,1.2,"dark"),"border-border"],input:[u(.81,.5,"light"),u(.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 p=V();function q(r){const s=r==="light"?0:1;return Object.fromEntries(Object.entries(p).map(([o,t])=>[o,t[s]]))}const O=new Set(["background","card","muted","chrome","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(l=>t.includes(l)||d.includes(l))&&!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(p);function _(r){const o=r===void 0?[".dark",'[theme="dark"]','[data-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(p))O.has(g)?k[g]=b[n]:m[g]=b[n];return{staticVars:m,dynamicVars:k}},l=e(0),c=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 \`${
|
|
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 \`${
|
|
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
|
-
${
|
|
19
|
+
${o} {
|
|
20
20
|
color-scheme: light;
|
|
21
21
|
}
|
|
22
22
|
|
|
23
|
-
:is(${
|
|
23
|
+
:is(${t} ${o}, ${o}${t}) {
|
|
24
24
|
color-scheme: dark;
|
|
25
25
|
}
|
|
26
26
|
|
|
27
|
-
${
|
|
28
|
-
${
|
|
29
|
-
${
|
|
30
|
-
${
|
|
27
|
+
${n} {
|
|
28
|
+
${d()}
|
|
29
|
+
${h(l.staticVars)}
|
|
30
|
+
${h(l.dynamicVars)}
|
|
31
31
|
|
|
32
32
|
/* Override Tailwind --color-* theme tokens within scope so utilities
|
|
33
|
-
* like bg-
|
|
33
|
+
* like bg-card, text-foreground, border-border resolve to quill's
|
|
34
34
|
* values instead of the consumer's global theme. */
|
|
35
|
-
${
|
|
35
|
+
${j()}
|
|
36
36
|
}
|
|
37
37
|
|
|
38
|
-
${
|
|
39
|
-
${c
|
|
40
|
-
${c
|
|
38
|
+
${m} {
|
|
39
|
+
${h(c.staticVars)}
|
|
40
|
+
${h(c.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
|
-
${
|
|
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
|
-
${
|
|
54
|
+
${d()}
|
|
55
55
|
}
|
|
56
56
|
|
|
57
57
|
/* Static colors (no theme-var references, safe on :root) */
|
|
58
58
|
:root {
|
|
59
|
-
${
|
|
59
|
+
${h(l.staticVars)}
|
|
60
60
|
}
|
|
61
61
|
|
|
62
|
-
${
|
|
63
|
-
${c
|
|
62
|
+
${t} {
|
|
63
|
+
${h(c.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
|
-
${
|
|
72
|
+
${h(l.dynamicVars)}
|
|
73
73
|
}
|
|
74
74
|
|
|
75
|
-
:is(${
|
|
76
|
-
${c
|
|
75
|
+
:is(${t}, ${t} *) {
|
|
76
|
+
${h(c.dynamicVars)}
|
|
77
77
|
}
|
|
78
|
-
`}function
|
|
79
|
-
`)}function
|
|
80
|
-
`)}const
|
|
78
|
+
`}function j(){return Object.keys(p).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[c,n]of x)e.push(` ${c}: ${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 l=o??":root";e.push(`${l} {`);for(const[c,n]of x)e.push(` ${c}: ${n};`);for(const[c,n]of Object.entries($))e.push(` --shadow-${c}: ${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=h;exports.fontFamily=T;exports.fontFamilyValue=y;exports.fontSize=w;exports.generateColorSystemCSS=P;exports.generateStylesCSS=z;exports.quoteFontName=S;exports.resolveTheme=q;exports.semanticColors=p;exports.shadow=$;exports.spacing=H;exports.spacingPx=R;
|