@dukaandost/tokens 1.0.0 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/index.cjs +1 -0
  2. package/dist/index.d.ts +3 -0
  3. package/dist/index.d.ts.map +1 -0
  4. package/dist/index.js +210 -0
  5. package/dist/tokens.css +1 -0
  6. package/dist/tokens.d.ts +493 -0
  7. package/dist/tokens.d.ts.map +1 -0
  8. package/package.json +22 -6
  9. package/src/tokens.css +263 -247
  10. package/src/index.ts +0 -2
  11. package/src/tokens.ts +0 -219
package/dist/index.cjs ADDED
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t={brand:{primary:"#180C44",accent:"#8A38F5",accentSubtle:"#EBE9F3",accentMuted:"#A499C6",hover:"#3B2395"},semantic:{error:"#E9336C",errorStrong:"#C10000",errorLight:"#EE6691",success:"#099B30",successDark:"#04841B",successDeep:"#065B15",successMuted:"#82AE37",warning:"#FCC13E",warningText:"#E4AC32",info:"#1B4DFF",infoStrong:"#0065F7",infoDark:"#02409A",infoMuted:"#127498"},text:{primary:"#1A1A1A",secondary:"#2E2E2E",tertiary:"#545454",disabled:"#7F7F7F",inverse:"#FFFFFF"},border:{default:"#D3D3D3",subtle:"#E0E0E0",hover:"#A9A9A9"},surface:{default:"#FFFFFF",subtle:"#F5F5F5",subtleHover:"#F6F6F6",accent:"#F4F2FF"},focus:{glow:"#EE6691",border:"#E9336C"},badge:{green:{bg:"#E4FFEC",border:"#5FD87F",text:"#099B30"},darkGreen:{bg:"#B3D9BA",border:"#04841B",text:"#065B15"},blue:{bg:"#E6EFFC",border:"#0065F7",text:"#02409A"},purple:{bg:"#FFE2FF",border:"#DF00DF",text:"#9A009A"},violet:{bg:"#E8C1FF",border:"#B331FF",text:"#921EC3"},yellow:{bg:"#FFF6E2",border:"#FCC13E",text:"#E4AC32"},teal:{bg:"#E3FDFF",border:"#18CBDB",text:"#0DACBB"},pink:{bg:"#FFE7EE",border:"#EE6691",text:"#E30047"},red:{bg:"#FFE2E2",border:"#FF2929",text:"#C10000"},orange:{bg:"#FDE1D4",border:"#FF6924",text:"#F65F1A"},grey:{bg:"#E3E3E3",border:"#7F7F7F",text:"#545454"},brown:{bg:"#F4E8DC",border:"#B87333",text:"#8B5E34"}}},r={brandAlpha:"linear-gradient(90deg, #FF51E3 0%, #8048BE 50%, #02409A 100%)",brandBeta:"linear-gradient(90deg, #02409A 0%, #066E65 25%, #099B30 50%)",brandGamma:"linear-gradient(90deg, #099B30 0%, #82AE37 50%, #FCC13E 100%)",brandDelta:"linear-gradient(90deg, #099B30 0%, #127498 50%, #1B4DFF 100%)"},e={heading:"'Amsi Pro', 'Inter', system-ui, sans-serif",body:"'Nunito Sans', 'Inter', system-ui, sans-serif",code:"'SF Mono', 'Fira Code', 'Fira Mono', 'Roboto Mono', monospace"},i={display:{size:"40px",weight:400,lineHeight:1.37,letterSpacing:"0em",fontFamily:e.heading},headingXl:{size:"32px",weight:400,lineHeight:1.37,letterSpacing:"0em",fontFamily:e.heading},headingLg:{size:"24px",weight:400,lineHeight:1.37,letterSpacing:"0em",fontFamily:e.heading},headingMd:{size:"20px",weight:400,lineHeight:1.37,letterSpacing:"0em",fontFamily:e.heading},headingSm:{size:"18px",weight:400,lineHeight:1.36,letterSpacing:"0em",fontFamily:e.body},bodyLg:{size:"16px",weight:400,lineHeight:1.36,letterSpacing:"0em",fontFamily:e.body},bodyMd:{size:"14px",weight:400,lineHeight:1.36,letterSpacing:"0em",fontFamily:e.body},bodySm:{size:"12px",weight:400,lineHeight:1.36,letterSpacing:"0em",fontFamily:e.body},label:{size:"13px",weight:500,lineHeight:1.4,letterSpacing:"0.03em",fontFamily:e.body},labelSm:{size:"11px",weight:500,lineHeight:1.4,letterSpacing:"0.04em",fontFamily:e.body},code:{size:"13px",weight:400,lineHeight:1.5,letterSpacing:"0em",fontFamily:e.code}},n={px:"1px","0.5":"2px",1:"4px",2:"8px",3:"12px",4:"16px",5:"20px",6:"24px",8:"32px",10:"40px",12:"48px"},o={none:"0px",xs:"4px",sm:"8px",md:"12px",lg:"16px",xl:"24px",full:"9999px"},a={none:"none",xs:"0 1px 2px rgba(0, 0, 0, 0.06)",sm:"0 2px 6px rgba(0, 0, 0, 0.08)",md:"0 4px 12px rgba(0, 0, 0, 0.12)",lg:"0 8px 24px rgba(0, 0, 0, 0.16)",xl:"0 16px 40px rgba(0, 0, 0, 0.20)",glowAlpha:"0 0 20px rgba(190, 3, 164, 0.50)",glowBeta:"0 0 20px rgba(148, 170, 253, 0.50)",glowGamma:"0 0 20px rgba(130, 174, 55, 0.50)",glowDelta:"0 0 20px rgba(55, 130, 174, 0.50)",button:"0 1px 2px rgba(0, 0, 0, 0.2)",buttonHover:"0 1px 4px rgba(0, 0, 0, 0.2)",focusGlow:"0 0 4px #EE6691"},g={base:0,raised:10,dropdown:100,sticky:200,overlay:300,modal:400,popover:500,toast:600},F={colors:t,gradients:r,fontFamily:e,typography:i,spacing:n,radius:o,shadows:a,zIndex:g};exports.colors=t;exports.fontFamily=e;exports.gradients=r;exports.radius=o;exports.shadows=a;exports.spacing=n;exports.tokens=F;exports.typography=i;exports.zIndex=g;
package/dist/index.d.ts ADDED
@@ -0,0 +1,3 @@
1
+
2
+ export * from './tokens';
3
+ //# sourceMappingURL=index.d.ts.map
package/dist/index.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AACtB,cAAc,UAAU,CAAC"}
package/dist/index.js ADDED
@@ -0,0 +1,210 @@
1
+ const t = {
2
+ brand: {
3
+ primary: "#180C44",
4
+ accent: "#8A38F5",
5
+ accentSubtle: "#EBE9F3",
6
+ accentMuted: "#A499C6",
7
+ hover: "#3B2395"
8
+ },
9
+ semantic: {
10
+ error: "#E9336C",
11
+ errorStrong: "#C10000",
12
+ errorLight: "#EE6691",
13
+ success: "#099B30",
14
+ successDark: "#04841B",
15
+ successDeep: "#065B15",
16
+ successMuted: "#82AE37",
17
+ warning: "#FCC13E",
18
+ warningText: "#E4AC32",
19
+ info: "#1B4DFF",
20
+ infoStrong: "#0065F7",
21
+ infoDark: "#02409A",
22
+ infoMuted: "#127498"
23
+ },
24
+ text: {
25
+ primary: "#1A1A1A",
26
+ secondary: "#2E2E2E",
27
+ tertiary: "#545454",
28
+ disabled: "#7F7F7F",
29
+ inverse: "#FFFFFF"
30
+ },
31
+ border: {
32
+ default: "#D3D3D3",
33
+ subtle: "#E0E0E0",
34
+ hover: "#A9A9A9"
35
+ },
36
+ surface: {
37
+ default: "#FFFFFF",
38
+ subtle: "#F5F5F5",
39
+ subtleHover: "#F6F6F6",
40
+ accent: "#F4F2FF"
41
+ },
42
+ focus: {
43
+ glow: "#EE6691",
44
+ border: "#E9336C"
45
+ },
46
+ badge: {
47
+ green: { bg: "#E4FFEC", border: "#5FD87F", text: "#099B30" },
48
+ darkGreen: { bg: "#B3D9BA", border: "#04841B", text: "#065B15" },
49
+ blue: { bg: "#E6EFFC", border: "#0065F7", text: "#02409A" },
50
+ purple: { bg: "#FFE2FF", border: "#DF00DF", text: "#9A009A" },
51
+ violet: { bg: "#E8C1FF", border: "#B331FF", text: "#921EC3" },
52
+ yellow: { bg: "#FFF6E2", border: "#FCC13E", text: "#E4AC32" },
53
+ teal: { bg: "#E3FDFF", border: "#18CBDB", text: "#0DACBB" },
54
+ pink: { bg: "#FFE7EE", border: "#EE6691", text: "#E30047" },
55
+ red: { bg: "#FFE2E2", border: "#FF2929", text: "#C10000" },
56
+ orange: { bg: "#FDE1D4", border: "#FF6924", text: "#F65F1A" },
57
+ grey: { bg: "#E3E3E3", border: "#7F7F7F", text: "#545454" },
58
+ brown: { bg: "#F4E8DC", border: "#B87333", text: "#8B5E34" }
59
+ }
60
+ }, r = {
61
+ brandAlpha: "linear-gradient(90deg, #FF51E3 0%, #8048BE 50%, #02409A 100%)",
62
+ brandBeta: "linear-gradient(90deg, #02409A 0%, #066E65 25%, #099B30 50%)",
63
+ brandGamma: "linear-gradient(90deg, #099B30 0%, #82AE37 50%, #FCC13E 100%)",
64
+ brandDelta: "linear-gradient(90deg, #099B30 0%, #127498 50%, #1B4DFF 100%)"
65
+ }, e = {
66
+ heading: "'Amsi Pro', 'Inter', system-ui, sans-serif",
67
+ body: "'Nunito Sans', 'Inter', system-ui, sans-serif",
68
+ code: "'SF Mono', 'Fira Code', 'Fira Mono', 'Roboto Mono', monospace"
69
+ }, i = {
70
+ display: {
71
+ size: "40px",
72
+ weight: 400,
73
+ lineHeight: 1.37,
74
+ letterSpacing: "0em",
75
+ fontFamily: e.heading
76
+ },
77
+ headingXl: {
78
+ size: "32px",
79
+ weight: 400,
80
+ lineHeight: 1.37,
81
+ letterSpacing: "0em",
82
+ fontFamily: e.heading
83
+ },
84
+ headingLg: {
85
+ size: "24px",
86
+ weight: 400,
87
+ lineHeight: 1.37,
88
+ letterSpacing: "0em",
89
+ fontFamily: e.heading
90
+ },
91
+ headingMd: {
92
+ size: "20px",
93
+ weight: 400,
94
+ lineHeight: 1.37,
95
+ letterSpacing: "0em",
96
+ fontFamily: e.heading
97
+ },
98
+ headingSm: {
99
+ size: "18px",
100
+ weight: 400,
101
+ lineHeight: 1.36,
102
+ letterSpacing: "0em",
103
+ fontFamily: e.body
104
+ },
105
+ bodyLg: {
106
+ size: "16px",
107
+ weight: 400,
108
+ lineHeight: 1.36,
109
+ letterSpacing: "0em",
110
+ fontFamily: e.body
111
+ },
112
+ bodyMd: {
113
+ size: "14px",
114
+ weight: 400,
115
+ lineHeight: 1.36,
116
+ letterSpacing: "0em",
117
+ fontFamily: e.body
118
+ },
119
+ bodySm: {
120
+ size: "12px",
121
+ weight: 400,
122
+ lineHeight: 1.36,
123
+ letterSpacing: "0em",
124
+ fontFamily: e.body
125
+ },
126
+ label: {
127
+ size: "13px",
128
+ weight: 500,
129
+ lineHeight: 1.4,
130
+ letterSpacing: "0.03em",
131
+ fontFamily: e.body
132
+ },
133
+ labelSm: {
134
+ size: "11px",
135
+ weight: 500,
136
+ lineHeight: 1.4,
137
+ letterSpacing: "0.04em",
138
+ fontFamily: e.body
139
+ },
140
+ code: {
141
+ size: "13px",
142
+ weight: 400,
143
+ lineHeight: 1.5,
144
+ letterSpacing: "0em",
145
+ fontFamily: e.code
146
+ }
147
+ }, n = {
148
+ px: "1px",
149
+ "0.5": "2px",
150
+ 1: "4px",
151
+ 2: "8px",
152
+ 3: "12px",
153
+ 4: "16px",
154
+ 5: "20px",
155
+ 6: "24px",
156
+ 8: "32px",
157
+ 10: "40px",
158
+ 12: "48px"
159
+ }, a = {
160
+ none: "0px",
161
+ xs: "4px",
162
+ sm: "8px",
163
+ md: "12px",
164
+ lg: "16px",
165
+ xl: "24px",
166
+ full: "9999px"
167
+ }, o = {
168
+ none: "none",
169
+ xs: "0 1px 2px rgba(0, 0, 0, 0.06)",
170
+ sm: "0 2px 6px rgba(0, 0, 0, 0.08)",
171
+ md: "0 4px 12px rgba(0, 0, 0, 0.12)",
172
+ lg: "0 8px 24px rgba(0, 0, 0, 0.16)",
173
+ xl: "0 16px 40px rgba(0, 0, 0, 0.20)",
174
+ glowAlpha: "0 0 20px rgba(190, 3, 164, 0.50)",
175
+ glowBeta: "0 0 20px rgba(148, 170, 253, 0.50)",
176
+ glowGamma: "0 0 20px rgba(130, 174, 55, 0.50)",
177
+ glowDelta: "0 0 20px rgba(55, 130, 174, 0.50)",
178
+ button: "0 1px 2px rgba(0, 0, 0, 0.2)",
179
+ buttonHover: "0 1px 4px rgba(0, 0, 0, 0.2)",
180
+ focusGlow: "0 0 4px #EE6691"
181
+ }, g = {
182
+ base: 0,
183
+ raised: 10,
184
+ dropdown: 100,
185
+ sticky: 200,
186
+ overlay: 300,
187
+ modal: 400,
188
+ popover: 500,
189
+ toast: 600
190
+ }, F = {
191
+ colors: t,
192
+ gradients: r,
193
+ fontFamily: e,
194
+ typography: i,
195
+ spacing: n,
196
+ radius: a,
197
+ shadows: o,
198
+ zIndex: g
199
+ };
200
+ export {
201
+ t as colors,
202
+ e as fontFamily,
203
+ r as gradients,
204
+ a as radius,
205
+ o as shadows,
206
+ n as spacing,
207
+ F as tokens,
208
+ i as typography,
209
+ g as zIndex
210
+ };
package/dist/tokens.css ADDED
@@ -0,0 +1 @@
1
+ :root{--color-brand-primary: #180C44;--color-brand-accent: #8A38F5;--color-brand-accent-subtle: #EBE9F3;--color-brand-accent-muted: #A499C6;--color-brand-hover: #3B2395;--color-semantic-error: #E9336C;--color-semantic-error-strong: #C10000;--color-semantic-error-light: #EE6691;--color-semantic-success: #099B30;--color-semantic-success-dark: #04841B;--color-semantic-success-deep: #065B15;--color-semantic-success-muted: #82AE37;--color-semantic-warning: #FCC13E;--color-semantic-warning-text: #E4AC32;--color-semantic-info: #1B4DFF;--color-semantic-info-strong: #0065F7;--color-semantic-info-dark: #02409A;--color-semantic-info-muted: #127498;--color-badge-green-bg: #E4FFEC;--color-badge-green-border: #5FD87F;--color-badge-green-text: #099B30;--color-badge-dark-green-bg: #B3D9BA;--color-badge-dark-green-border: #04841B;--color-badge-dark-green-text: #065B15;--color-badge-blue-bg: #E6EFFC;--color-badge-blue-border: #0065F7;--color-badge-blue-text: #02409A;--color-badge-purple-bg: #FFE2FF;--color-badge-purple-border: #DF00DF;--color-badge-purple-text: #9A009A;--color-badge-violet-bg: #E8C1FF;--color-badge-violet-border: #B331FF;--color-badge-violet-text: #921EC3;--color-badge-yellow-bg: #FFF6E2;--color-badge-yellow-border: #FCC13E;--color-badge-yellow-text: #E4AC32;--color-badge-teal-bg: #E3FDFF;--color-badge-teal-border: #18CBDB;--color-badge-teal-text: #0DACBB;--color-badge-pink-bg: #FFE7EE;--color-badge-pink-border: #EE6691;--color-badge-pink-text: #E30047;--color-badge-red-bg: #FFE2E2;--color-badge-red-border: #FF2929;--color-badge-red-text: #C10000;--color-badge-orange-bg: #FDE1D4;--color-badge-orange-border: #FF6924;--color-badge-orange-text: #F65F1A;--color-badge-grey-bg: #E3E3E3;--color-badge-grey-border: #7F7F7F;--color-badge-grey-text: #545454;--color-badge-brown-bg: #F4E8DC;--color-badge-brown-border: #B87333;--color-badge-brown-text: #8B5E34;--color-text-primary: #1A1A1A;--color-text-secondary: #2E2E2E;--color-text-tertiary: #545454;--color-text-disabled: #7F7F7F;--color-text-inverse: #FFFFFF;--color-border-default: #D3D3D3;--color-border-subtle: #E0E0E0;--color-border-hover: #A9A9A9;--color-surface-default: #FFFFFF;--color-surface-subtle: #F5F5F5;--color-surface-subtle-hover: #F6F6F6;--color-surface-accent: #F4F2FF;--color-focus-glow: #EE6691;--color-focus-border: #E9336C;--gradient-brand-alpha: linear-gradient(90deg, #FF51E3 0%, #8048BE 50%, #02409A 100%);--gradient-brand-beta: linear-gradient(90deg, #02409A 0%, #066E65 25%, #099B30 50%);--gradient-brand-gamma: linear-gradient(90deg, #099B30 0%, #82AE37 50%, #FCC13E 100%);--gradient-brand-delta: linear-gradient(90deg, #099B30 0%, #127498 50%, #1B4DFF 100%);--font-heading: "Amsi Pro", "Inter", system-ui, sans-serif;--font-body: "Nunito Sans", "Inter", system-ui, sans-serif;--font-code: "SF Mono", "Fira Code", "Fira Mono", "Roboto Mono", monospace;--text-display-size: 40px;--text-display-weight: 400;--text-display-line-height: 1.37;--text-display-letter-spacing: 0em;--text-heading-xl-size: 32px;--text-heading-xl-weight: 400;--text-heading-xl-line-height: 1.37;--text-heading-xl-letter-spacing: 0em;--text-heading-lg-size: 24px;--text-heading-lg-weight: 400;--text-heading-lg-line-height: 1.37;--text-heading-lg-letter-spacing: 0em;--text-heading-md-size: 20px;--text-heading-md-weight: 400;--text-heading-md-line-height: 1.37;--text-heading-md-letter-spacing: 0em;--text-heading-sm-size: 18px;--text-heading-sm-weight: 400;--text-heading-sm-line-height: 1.36;--text-heading-sm-letter-spacing: 0em;--text-body-lg-size: 16px;--text-body-lg-weight: 400;--text-body-lg-line-height: 1.36;--text-body-lg-letter-spacing: 0em;--text-body-md-size: 14px;--text-body-md-weight: 400;--text-body-md-line-height: 1.36;--text-body-md-letter-spacing: 0em;--text-body-sm-size: 12px;--text-body-sm-weight: 400;--text-body-sm-line-height: 1.36;--text-body-sm-letter-spacing: 0em;--text-label-size: 13px;--text-label-weight: 500;--text-label-line-height: 1.4;--text-label-letter-spacing: .03em;--text-label-sm-size: 11px;--text-label-sm-weight: 500;--text-label-sm-line-height: 1.4;--text-label-sm-letter-spacing: .04em;--text-code-size: 13px;--text-code-weight: 400;--text-code-line-height: 1.5;--text-code-letter-spacing: 0em;--space-px: 1px;--space-0-5: 2px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--radius-none: 0px;--radius-xs: 4px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--shadow-none: none;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .06);--shadow-sm: 0 2px 6px rgba(0, 0, 0, .08);--shadow-md: 0 4px 12px rgba(0, 0, 0, .12);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .16);--shadow-xl: 0 16px 40px rgba(0, 0, 0, .2);--shadow-button: 0 1px 2px rgba(0, 0, 0, .2);--shadow-button-hover: 0 1px 4px rgba(0, 0, 0, .2);--shadow-button-filled-hover: 0 4px 10px var(--color-border-default);--shadow-button-glass-hover: 0 4px 10px var(--color-border-default);--shadow-focus-glow: 0 0 4px var(--color-focus-glow);--shadow-section-inset: 2px 2px 10px 1px rgba(239, 239, 239, .8) inset;--shadow-glow-alpha: 0 0 20px rgba(190, 3, 164, .5);--shadow-glow-beta: 0 0 20px rgba(148, 170, 253, .5);--shadow-glow-gamma: 0 0 20px rgba(130, 174, 55, .5);--shadow-glow-delta: 0 0 20px rgba(55, 130, 174, .5);--z-base: 0;--z-raised: 10;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-popover: 500;--z-toast: 600;--bp-xs: 320px;--bp-sm: 480px;--bp-md: 768px;--bp-lg: 1024px}html{font-family:var(--font-body);font-size:var(--text-body-lg-size);font-weight:400;line-height:var(--text-body-lg-line-height);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-family:inherit;font-size:inherit;line-height:inherit}*,*:before,*:after{box-sizing:border-box;font-family:inherit}button,input,select,textarea,optgroup{font-family:var(--font-body);font-size:inherit;line-height:inherit}