@moderneinc/neo-design 1.0.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.
- package/README.md +218 -0
- package/dist/colors.json +104 -0
- package/dist/index.esm.js +119 -0
- package/dist/index.esm.js.map +1 -0
- package/dist/index.js +124 -0
- package/dist/index.js.map +1 -0
- package/dist/tokens.css +88 -0
- package/dist/tokens.json +112 -0
- package/package.json +100 -0
package/README.md
ADDED
|
@@ -0,0 +1,218 @@
|
|
|
1
|
+
# @moderne/neo-design
|
|
2
|
+
|
|
3
|
+
**Internal Moderne package** - Design primitives and tokens for Moderne applications, providing a single source of truth for colors, typography, and spacing exported from Figma.
|
|
4
|
+
|
|
5
|
+
## 🚀 Quick Start
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @moderne/neo-design
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
```javascript
|
|
12
|
+
import { colors, typography, createModerneTheme } from '@moderne/neo-design'
|
|
13
|
+
|
|
14
|
+
// Use in MUI theme (drop-in replacement for moderneColors)
|
|
15
|
+
const theme = createModerneTheme({ mode: 'light' })
|
|
16
|
+
|
|
17
|
+
// Or use individual tokens
|
|
18
|
+
const primaryColor = colors.digitalBlue[500] // #2F42FF
|
|
19
|
+
const bodyFont = typography.fontFamily.body // Inter
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## 📦 What's Included
|
|
23
|
+
|
|
24
|
+
- **Colors**: Digital Blue, Grey, and semantic color tokens
|
|
25
|
+
- **Typography**: Font families, sizes, weights, and pre-built styles
|
|
26
|
+
- **Spacing**: Consistent spacing scale (4px to 80px)
|
|
27
|
+
- **MUI Integration**: Drop-in theme creator for Material-UI
|
|
28
|
+
- **Internal Plugin System**: CSS Variables, MUI Theme, and Token Validation (build-time only)
|
|
29
|
+
- **Pure JavaScript**: Simplified architecture, no TypeScript complexity
|
|
30
|
+
|
|
31
|
+
## 🎨 Color Tokens
|
|
32
|
+
|
|
33
|
+
```javascript
|
|
34
|
+
// Base color scales (neo prefixes removed)
|
|
35
|
+
colors.digitalBlue[500] // #2F42FF
|
|
36
|
+
colors.grey[500] // #6B7280
|
|
37
|
+
|
|
38
|
+
// Semantic colors
|
|
39
|
+
colors.surfaces.card // #FFFFFF
|
|
40
|
+
colors.surfaces.page // #F9FAFB
|
|
41
|
+
|
|
42
|
+
// Component colors
|
|
43
|
+
colors.buttons.primary.default // #2F42FF
|
|
44
|
+
colors.buttons.primary.hover // #1E2EC2
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
## 📝 Typography Tokens
|
|
48
|
+
|
|
49
|
+
```javascript
|
|
50
|
+
// Font families
|
|
51
|
+
typography.fontFamily.body // Inter
|
|
52
|
+
typography.fontFamily.code // JetBrains Mono
|
|
53
|
+
|
|
54
|
+
// Font sizes
|
|
55
|
+
typography.fontSize.h1 // 36
|
|
56
|
+
typography.fontSize.default // 16
|
|
57
|
+
|
|
58
|
+
// Pre-built styles
|
|
59
|
+
typography.styles.heading.h1 // Complete font style object
|
|
60
|
+
typography.styles.body.default // Body text style
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
## 🔧 Internal Build System
|
|
64
|
+
|
|
65
|
+
The package includes an internal plugin system used during the build process:
|
|
66
|
+
|
|
67
|
+
**Build-time Plugins:**
|
|
68
|
+
- **CSS Variables Plugin**: Generates CSS custom properties (`:root { --neo-color-primary: #2F42FF; }`)
|
|
69
|
+
- **MUI Theme Plugin**: Creates Material-UI theme configuration files
|
|
70
|
+
- **Token Validation Plugin**: Validates design token structure and consistency
|
|
71
|
+
|
|
72
|
+
These plugins are used internally during `npm run build` and are not exposed as public exports.
|
|
73
|
+
|
|
74
|
+
## 🏗️ Architecture & Build Process
|
|
75
|
+
|
|
76
|
+
```mermaid
|
|
77
|
+
graph TB
|
|
78
|
+
A[Figma Design File<br/>fQTkGSFbYyE7LiHuQJsENC] --> B{FIGMA_TOKEN<br/>Environment Variable}
|
|
79
|
+
B -->|Set| C[npm run sync<br/>scripts/sync-figma.js]
|
|
80
|
+
B -->|Missing| D[❌ Error: Token Required]
|
|
81
|
+
|
|
82
|
+
C --> E[Figma API Calls]
|
|
83
|
+
E --> F[Files API<br/>Get file metadata]
|
|
84
|
+
E --> G[Styles API<br/>Get style definitions]
|
|
85
|
+
E --> H[Nodes API<br/>Get detailed node data]
|
|
86
|
+
|
|
87
|
+
F --> I[Direct Token Processing<br/>Extract & organize colors, typography]
|
|
88
|
+
G --> I
|
|
89
|
+
H --> I
|
|
90
|
+
|
|
91
|
+
I --> J[Structured Token Files<br/>src/tokens/raw/]
|
|
92
|
+
J --> K[colors.json]
|
|
93
|
+
J --> L[typography.json]
|
|
94
|
+
J --> M[dimensions.json]
|
|
95
|
+
J --> N[metadata.json]
|
|
96
|
+
|
|
97
|
+
K --> O[npm run build<br/>scripts/build-production.js]
|
|
98
|
+
L --> O
|
|
99
|
+
M --> O
|
|
100
|
+
N --> O
|
|
101
|
+
|
|
102
|
+
O --> P[Plugin System Execution]
|
|
103
|
+
P --> Q[CSS Variables Plugin<br/>Generate tokens.css]
|
|
104
|
+
P --> R[MUI Theme Plugin<br/>Generate mui-theme.js]
|
|
105
|
+
P --> S[Token Validation<br/>Verify structure]
|
|
106
|
+
|
|
107
|
+
Q --> T[Rollup Bundle Build<br/>rollup -c]
|
|
108
|
+
R --> T
|
|
109
|
+
S --> T
|
|
110
|
+
|
|
111
|
+
T --> U[Generated Artifacts<br/>dist/]
|
|
112
|
+
U --> V[index.js<br/>CommonJS Bundle]
|
|
113
|
+
U --> W[index.esm.js<br/>ES Module Bundle]
|
|
114
|
+
U --> X[tokens.json<br/>Complete Design System]
|
|
115
|
+
U --> Y[colors.json<br/>Colors Only]
|
|
116
|
+
U --> Z[tokens.css<br/>CSS Custom Properties]
|
|
117
|
+
U --> AA[mui-theme.js<br/>MUI Theme Configuration]
|
|
118
|
+
|
|
119
|
+
O --> BB[Verify Essential Files<br/>Check all required outputs]
|
|
120
|
+
O --> CC[Calculate Bundle Size<br/>Performance metrics]
|
|
121
|
+
O --> DD[Test Package Imports<br/>Validate exports]
|
|
122
|
+
|
|
123
|
+
BB --> EE[✅ Ready for npm publish]
|
|
124
|
+
CC --> EE
|
|
125
|
+
DD --> EE
|
|
126
|
+
|
|
127
|
+
style A fill:#e1f5fe
|
|
128
|
+
style U fill:#f3e5f5
|
|
129
|
+
style EE fill:#e8f5e8
|
|
130
|
+
style D fill:#ffebee
|
|
131
|
+
```
|
|
132
|
+
|
|
133
|
+
## 🔧 Development
|
|
134
|
+
|
|
135
|
+
### Sync from Figma
|
|
136
|
+
|
|
137
|
+
```bash
|
|
138
|
+
# Set up Figma token
|
|
139
|
+
echo "FIGMA_TOKEN=your_figma_token_here" > .env
|
|
140
|
+
|
|
141
|
+
# Pull latest from Figma
|
|
142
|
+
npm run sync
|
|
143
|
+
|
|
144
|
+
# Build tokens
|
|
145
|
+
npm run build
|
|
146
|
+
```
|
|
147
|
+
|
|
148
|
+
### Scripts
|
|
149
|
+
|
|
150
|
+
- `npm run sync` - Pull and process tokens from Figma
|
|
151
|
+
- `npm run build` - Complete build pipeline
|
|
152
|
+
- `npm run dev` - Watch mode development build
|
|
153
|
+
- `npm run storybook` - Preview tokens in Storybook
|
|
154
|
+
- `npm test` - Run test suite
|
|
155
|
+
|
|
156
|
+
## 📁 Exports
|
|
157
|
+
|
|
158
|
+
The package provides multiple export formats:
|
|
159
|
+
|
|
160
|
+
```javascript
|
|
161
|
+
// Main exports
|
|
162
|
+
import { colors, typography, createModerneTheme } from '@moderne/neo-design'
|
|
163
|
+
|
|
164
|
+
// JSON files (if needed)
|
|
165
|
+
import tokens from '@moderne/neo-design/tokens.json'
|
|
166
|
+
import colorsOnly from '@moderne/neo-design/colors.json'
|
|
167
|
+
|
|
168
|
+
// CSS variables (generated at build time)
|
|
169
|
+
import '@moderne/neo-design/tokens.css'
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
## 🔄 Migration from moderneColors
|
|
173
|
+
|
|
174
|
+
Replace your existing color imports:
|
|
175
|
+
|
|
176
|
+
```javascript
|
|
177
|
+
// Before
|
|
178
|
+
import { moderneColors } from '../theme/colors'
|
|
179
|
+
backgroundColor: moderneColors.neoDigitalBlue[500]
|
|
180
|
+
|
|
181
|
+
// After
|
|
182
|
+
import { colors } from '@moderne/neo-design'
|
|
183
|
+
backgroundColor: colors.digitalBlue[500]
|
|
184
|
+
```
|
|
185
|
+
|
|
186
|
+
## ✅ Current Status
|
|
187
|
+
|
|
188
|
+
- ✅ **SIMPLIFIED ARCHITECTURE**: Pure JavaScript ES6 modules, removed TypeScript complexity
|
|
189
|
+
- ✅ Core package structure and build pipeline
|
|
190
|
+
- ✅ Color tokens with proper validation
|
|
191
|
+
- ✅ Typography tokens with font families and styles
|
|
192
|
+
- ✅ Spacing and dimension tokens
|
|
193
|
+
- ✅ MUI theme integration
|
|
194
|
+
- ✅ **Internal Plugin System**: CSS Variables, MUI Theme, and Token Validation (build-time)
|
|
195
|
+
- ✅ **Pure JavaScript**: Simplified, no TypeScript runtime dependency
|
|
196
|
+
- ✅ Multiple export formats (JSON, CSS, JavaScript)
|
|
197
|
+
- ✅ Storybook documentation setup
|
|
198
|
+
- ✅ **Private Package**: Internal Moderne use only
|
|
199
|
+
|
|
200
|
+
## 🚧 Next Steps
|
|
201
|
+
|
|
202
|
+
1. **Enhanced Figma Sync**: Implement full API integration with your Figma file
|
|
203
|
+
2. **Dark Mode**: Add complete light/dark theme variants
|
|
204
|
+
3. **Icon Integration**: Process SVG icons from Figma
|
|
205
|
+
4. **Additional Plugins**: SCSS generation, Tailwind CSS config, design token documentation
|
|
206
|
+
5. **Advanced Validation**: Color contrast checking, token consistency, accessibility compliance
|
|
207
|
+
|
|
208
|
+
## 📖 Documentation
|
|
209
|
+
|
|
210
|
+
- View token documentation in Storybook: `npm run dev-storybook`
|
|
211
|
+
- See `stories/` for color and typography showcases
|
|
212
|
+
- Check `dist/` for built artifacts and type definitions
|
|
213
|
+
|
|
214
|
+
---
|
|
215
|
+
|
|
216
|
+
**Package**: `@moderne/neo-design` (Private - Internal Moderne use only)
|
|
217
|
+
**Source**: Figma file `fQTkGSFbYyE7LiHuQJsENC`
|
|
218
|
+
**Architecture**: Pure JavaScript ES6 modules
|
package/dist/colors.json
ADDED
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
{
|
|
2
|
+
"digitalBlue": {
|
|
3
|
+
"50": "#F2F3FF",
|
|
4
|
+
"100": "#DCE0FF",
|
|
5
|
+
"200": "#B6BFFF",
|
|
6
|
+
"300": "#8D99FF",
|
|
7
|
+
"400": "#626EFF",
|
|
8
|
+
"500": "#2F42FF",
|
|
9
|
+
"600": "#2637E6",
|
|
10
|
+
"700": "#1E2EC2",
|
|
11
|
+
"800": "#131E7A",
|
|
12
|
+
"900": "#000855",
|
|
13
|
+
"main": "#2F42FF"
|
|
14
|
+
},
|
|
15
|
+
"digitalGreen": {
|
|
16
|
+
"50": "#F3FFF5",
|
|
17
|
+
"100": "#CFFFD7",
|
|
18
|
+
"200": "#ACFFB9",
|
|
19
|
+
"300": "#88FE9B",
|
|
20
|
+
"400": "#72E184",
|
|
21
|
+
"500": "#5EC46F",
|
|
22
|
+
"600": "#4CA75A",
|
|
23
|
+
"700": "#3B8948",
|
|
24
|
+
"800": "#2C6C36",
|
|
25
|
+
"900": "#1E4F26",
|
|
26
|
+
"main": "#5EC46F"
|
|
27
|
+
},
|
|
28
|
+
"gold": {
|
|
29
|
+
"100": "#FBF1D2",
|
|
30
|
+
"200": "#F7E3A5",
|
|
31
|
+
"300": "#F4D479",
|
|
32
|
+
"400": "#F0C64C",
|
|
33
|
+
"500": "#ECB81F",
|
|
34
|
+
"600": "#BD9319",
|
|
35
|
+
"700": "#8E6E13",
|
|
36
|
+
"800": "#5E4A0C",
|
|
37
|
+
"900": "#2F2506",
|
|
38
|
+
"main": "#ECB81F"
|
|
39
|
+
},
|
|
40
|
+
"grey": {
|
|
41
|
+
"50": "#F9FAFB",
|
|
42
|
+
"100": "#F3F4F6",
|
|
43
|
+
"200": "#E5E7EB",
|
|
44
|
+
"300": "#D1D5DB",
|
|
45
|
+
"400": "#9CA3AF",
|
|
46
|
+
"500": "#6B7280",
|
|
47
|
+
"600": "#4B5563",
|
|
48
|
+
"700": "#374151",
|
|
49
|
+
"800": "#1F2937",
|
|
50
|
+
"900": "#111827",
|
|
51
|
+
"main": "#6B7280"
|
|
52
|
+
},
|
|
53
|
+
"orange": {
|
|
54
|
+
"50": "#FFF8E5",
|
|
55
|
+
"100": "#FFEBB7",
|
|
56
|
+
"200": "#FFDE8A",
|
|
57
|
+
"300": "#FFD15C",
|
|
58
|
+
"400": "#FFC52E",
|
|
59
|
+
"500": "#FFB800",
|
|
60
|
+
"600": "#D69B00",
|
|
61
|
+
"700": "#856000",
|
|
62
|
+
"800": "#856000",
|
|
63
|
+
"900": "#5C4200",
|
|
64
|
+
"main": "#FFB800"
|
|
65
|
+
},
|
|
66
|
+
"red": {
|
|
67
|
+
"50": "#FFEDEF",
|
|
68
|
+
"100": "#FFC6CD",
|
|
69
|
+
"200": "#FF9EAA",
|
|
70
|
+
"300": "#FD7686",
|
|
71
|
+
"400": "#ED4A5D",
|
|
72
|
+
"500": "#CB3446",
|
|
73
|
+
"600": "#A92232",
|
|
74
|
+
"700": "#871421",
|
|
75
|
+
"800": "#650914",
|
|
76
|
+
"900": "#43020A",
|
|
77
|
+
"main": "#CB3446"
|
|
78
|
+
},
|
|
79
|
+
"tealGreen": {
|
|
80
|
+
"50": "#EEFFFA",
|
|
81
|
+
"100": "#C9FFF1",
|
|
82
|
+
"200": "#A4FFE7",
|
|
83
|
+
"300": "#7FFFDE",
|
|
84
|
+
"400": "#54EEC6",
|
|
85
|
+
"500": "#3BCCA6",
|
|
86
|
+
"600": "#27AA88",
|
|
87
|
+
"700": "#17886B",
|
|
88
|
+
"800": "#0B664E",
|
|
89
|
+
"900": "#034433",
|
|
90
|
+
"main": "#3BCCA6"
|
|
91
|
+
},
|
|
92
|
+
"violet": {
|
|
93
|
+
"100": "#EBD5F1",
|
|
94
|
+
"200": "#D6ACE3",
|
|
95
|
+
"300": "#C282D5",
|
|
96
|
+
"400": "#AD59C7",
|
|
97
|
+
"500": "#992FB9",
|
|
98
|
+
"600": "#7A2694",
|
|
99
|
+
"700": "#5C1C6F",
|
|
100
|
+
"800": "#3D134A",
|
|
101
|
+
"900": "#1F0925",
|
|
102
|
+
"main": "#992FB9"
|
|
103
|
+
}
|
|
104
|
+
}
|
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
// Generated colors from raw primitives
|
|
2
|
+
const colors = {
|
|
3
|
+
"digitalBlue": {
|
|
4
|
+
"50": "#F2F3FF",
|
|
5
|
+
"100": "#DCE0FF",
|
|
6
|
+
"200": "#B6BFFF",
|
|
7
|
+
"300": "#8D99FF",
|
|
8
|
+
"400": "#626EFF",
|
|
9
|
+
"500": "#2F42FF",
|
|
10
|
+
"600": "#2637E6",
|
|
11
|
+
"700": "#1E2EC2",
|
|
12
|
+
"800": "#131E7A",
|
|
13
|
+
"900": "#000855",
|
|
14
|
+
"main": "#2F42FF"
|
|
15
|
+
},
|
|
16
|
+
"digitalGreen": {
|
|
17
|
+
"50": "#F3FFF5",
|
|
18
|
+
"100": "#CFFFD7",
|
|
19
|
+
"200": "#ACFFB9",
|
|
20
|
+
"300": "#88FE9B",
|
|
21
|
+
"400": "#72E184",
|
|
22
|
+
"500": "#5EC46F",
|
|
23
|
+
"600": "#4CA75A",
|
|
24
|
+
"700": "#3B8948",
|
|
25
|
+
"800": "#2C6C36",
|
|
26
|
+
"900": "#1E4F26",
|
|
27
|
+
"main": "#5EC46F"
|
|
28
|
+
},
|
|
29
|
+
"gold": {
|
|
30
|
+
"100": "#FBF1D2",
|
|
31
|
+
"200": "#F7E3A5",
|
|
32
|
+
"300": "#F4D479",
|
|
33
|
+
"400": "#F0C64C",
|
|
34
|
+
"500": "#ECB81F",
|
|
35
|
+
"600": "#BD9319",
|
|
36
|
+
"700": "#8E6E13",
|
|
37
|
+
"800": "#5E4A0C",
|
|
38
|
+
"900": "#2F2506",
|
|
39
|
+
"main": "#ECB81F"
|
|
40
|
+
},
|
|
41
|
+
"grey": {
|
|
42
|
+
"50": "#F9FAFB",
|
|
43
|
+
"100": "#F3F4F6",
|
|
44
|
+
"200": "#E5E7EB",
|
|
45
|
+
"300": "#D1D5DB",
|
|
46
|
+
"400": "#9CA3AF",
|
|
47
|
+
"500": "#6B7280",
|
|
48
|
+
"600": "#4B5563",
|
|
49
|
+
"700": "#374151",
|
|
50
|
+
"800": "#1F2937",
|
|
51
|
+
"900": "#111827",
|
|
52
|
+
"main": "#6B7280"
|
|
53
|
+
},
|
|
54
|
+
"orange": {
|
|
55
|
+
"50": "#FFF8E5",
|
|
56
|
+
"100": "#FFEBB7",
|
|
57
|
+
"200": "#FFDE8A",
|
|
58
|
+
"300": "#FFD15C",
|
|
59
|
+
"400": "#FFC52E",
|
|
60
|
+
"500": "#FFB800",
|
|
61
|
+
"600": "#D69B00",
|
|
62
|
+
"700": "#856000",
|
|
63
|
+
"800": "#856000",
|
|
64
|
+
"900": "#5C4200",
|
|
65
|
+
"main": "#FFB800"
|
|
66
|
+
},
|
|
67
|
+
"red": {
|
|
68
|
+
"50": "#FFEDEF",
|
|
69
|
+
"100": "#FFC6CD",
|
|
70
|
+
"200": "#FF9EAA",
|
|
71
|
+
"300": "#FD7686",
|
|
72
|
+
"400": "#ED4A5D",
|
|
73
|
+
"500": "#CB3446",
|
|
74
|
+
"600": "#A92232",
|
|
75
|
+
"700": "#871421",
|
|
76
|
+
"800": "#650914",
|
|
77
|
+
"900": "#43020A",
|
|
78
|
+
"main": "#CB3446"
|
|
79
|
+
},
|
|
80
|
+
"tealGreen": {
|
|
81
|
+
"50": "#EEFFFA",
|
|
82
|
+
"100": "#C9FFF1",
|
|
83
|
+
"200": "#A4FFE7",
|
|
84
|
+
"300": "#7FFFDE",
|
|
85
|
+
"400": "#54EEC6",
|
|
86
|
+
"500": "#3BCCA6",
|
|
87
|
+
"600": "#27AA88",
|
|
88
|
+
"700": "#17886B",
|
|
89
|
+
"800": "#0B664E",
|
|
90
|
+
"900": "#034433",
|
|
91
|
+
"main": "#3BCCA6"
|
|
92
|
+
},
|
|
93
|
+
"violet": {
|
|
94
|
+
"100": "#EBD5F1",
|
|
95
|
+
"200": "#D6ACE3",
|
|
96
|
+
"300": "#C282D5",
|
|
97
|
+
"400": "#AD59C7",
|
|
98
|
+
"500": "#992FB9",
|
|
99
|
+
"600": "#7A2694",
|
|
100
|
+
"700": "#5C1C6F",
|
|
101
|
+
"800": "#3D134A",
|
|
102
|
+
"900": "#1F0925",
|
|
103
|
+
"main": "#992FB9"
|
|
104
|
+
}
|
|
105
|
+
};
|
|
106
|
+
|
|
107
|
+
/**
|
|
108
|
+
* Neo Design System - Main Entry Point
|
|
109
|
+
* Pure barrel file for design tokens
|
|
110
|
+
*/
|
|
111
|
+
|
|
112
|
+
|
|
113
|
+
// Default export
|
|
114
|
+
var index = {
|
|
115
|
+
colors,
|
|
116
|
+
};
|
|
117
|
+
|
|
118
|
+
export { colors, index as default };
|
|
119
|
+
//# sourceMappingURL=index.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":["../src/generated/colors.js","../src/index.js"],"sourcesContent":["// Generated colors from raw primitives\nexport const colors = {\n \"digitalBlue\": {\n \"50\": \"#F2F3FF\",\n \"100\": \"#DCE0FF\",\n \"200\": \"#B6BFFF\",\n \"300\": \"#8D99FF\",\n \"400\": \"#626EFF\",\n \"500\": \"#2F42FF\",\n \"600\": \"#2637E6\",\n \"700\": \"#1E2EC2\",\n \"800\": \"#131E7A\",\n \"900\": \"#000855\",\n \"main\": \"#2F42FF\"\n },\n \"digitalGreen\": {\n \"50\": \"#F3FFF5\",\n \"100\": \"#CFFFD7\",\n \"200\": \"#ACFFB9\",\n \"300\": \"#88FE9B\",\n \"400\": \"#72E184\",\n \"500\": \"#5EC46F\",\n \"600\": \"#4CA75A\",\n \"700\": \"#3B8948\",\n \"800\": \"#2C6C36\",\n \"900\": \"#1E4F26\",\n \"main\": \"#5EC46F\"\n },\n \"gold\": {\n \"100\": \"#FBF1D2\",\n \"200\": \"#F7E3A5\",\n \"300\": \"#F4D479\",\n \"400\": \"#F0C64C\",\n \"500\": \"#ECB81F\",\n \"600\": \"#BD9319\",\n \"700\": \"#8E6E13\",\n \"800\": \"#5E4A0C\",\n \"900\": \"#2F2506\",\n \"main\": \"#ECB81F\"\n },\n \"grey\": {\n \"50\": \"#F9FAFB\",\n \"100\": \"#F3F4F6\",\n \"200\": \"#E5E7EB\",\n \"300\": \"#D1D5DB\",\n \"400\": \"#9CA3AF\",\n \"500\": \"#6B7280\",\n \"600\": \"#4B5563\",\n \"700\": \"#374151\",\n \"800\": \"#1F2937\",\n \"900\": \"#111827\",\n \"main\": \"#6B7280\"\n },\n \"orange\": {\n \"50\": \"#FFF8E5\",\n \"100\": \"#FFEBB7\",\n \"200\": \"#FFDE8A\",\n \"300\": \"#FFD15C\",\n \"400\": \"#FFC52E\",\n \"500\": \"#FFB800\",\n \"600\": \"#D69B00\",\n \"700\": \"#856000\",\n \"800\": \"#856000\",\n \"900\": \"#5C4200\",\n \"main\": \"#FFB800\"\n },\n \"red\": {\n \"50\": \"#FFEDEF\",\n \"100\": \"#FFC6CD\",\n \"200\": \"#FF9EAA\",\n \"300\": \"#FD7686\",\n \"400\": \"#ED4A5D\",\n \"500\": \"#CB3446\",\n \"600\": \"#A92232\",\n \"700\": \"#871421\",\n \"800\": \"#650914\",\n \"900\": \"#43020A\",\n \"main\": \"#CB3446\"\n },\n \"tealGreen\": {\n \"50\": \"#EEFFFA\",\n \"100\": \"#C9FFF1\",\n \"200\": \"#A4FFE7\",\n \"300\": \"#7FFFDE\",\n \"400\": \"#54EEC6\",\n \"500\": \"#3BCCA6\",\n \"600\": \"#27AA88\",\n \"700\": \"#17886B\",\n \"800\": \"#0B664E\",\n \"900\": \"#034433\",\n \"main\": \"#3BCCA6\"\n },\n \"violet\": {\n \"100\": \"#EBD5F1\",\n \"200\": \"#D6ACE3\",\n \"300\": \"#C282D5\",\n \"400\": \"#AD59C7\",\n \"500\": \"#992FB9\",\n \"600\": \"#7A2694\",\n \"700\": \"#5C1C6F\",\n \"800\": \"#3D134A\",\n \"900\": \"#1F0925\",\n \"main\": \"#992FB9\"\n }\n};","/**\n * Neo Design System - Main Entry Point\n * Pure barrel file for design tokens\n */\n\n// Import generated tokens\nimport { colors } from './generated/colors.js'\n\n// Re-export tokens\nexport { colors }\n\n// Default export\nexport default {\n colors,\n}\n"],"names":[],"mappings":"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"}
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
// Generated colors from raw primitives
|
|
6
|
+
const colors = {
|
|
7
|
+
"digitalBlue": {
|
|
8
|
+
"50": "#F2F3FF",
|
|
9
|
+
"100": "#DCE0FF",
|
|
10
|
+
"200": "#B6BFFF",
|
|
11
|
+
"300": "#8D99FF",
|
|
12
|
+
"400": "#626EFF",
|
|
13
|
+
"500": "#2F42FF",
|
|
14
|
+
"600": "#2637E6",
|
|
15
|
+
"700": "#1E2EC2",
|
|
16
|
+
"800": "#131E7A",
|
|
17
|
+
"900": "#000855",
|
|
18
|
+
"main": "#2F42FF"
|
|
19
|
+
},
|
|
20
|
+
"digitalGreen": {
|
|
21
|
+
"50": "#F3FFF5",
|
|
22
|
+
"100": "#CFFFD7",
|
|
23
|
+
"200": "#ACFFB9",
|
|
24
|
+
"300": "#88FE9B",
|
|
25
|
+
"400": "#72E184",
|
|
26
|
+
"500": "#5EC46F",
|
|
27
|
+
"600": "#4CA75A",
|
|
28
|
+
"700": "#3B8948",
|
|
29
|
+
"800": "#2C6C36",
|
|
30
|
+
"900": "#1E4F26",
|
|
31
|
+
"main": "#5EC46F"
|
|
32
|
+
},
|
|
33
|
+
"gold": {
|
|
34
|
+
"100": "#FBF1D2",
|
|
35
|
+
"200": "#F7E3A5",
|
|
36
|
+
"300": "#F4D479",
|
|
37
|
+
"400": "#F0C64C",
|
|
38
|
+
"500": "#ECB81F",
|
|
39
|
+
"600": "#BD9319",
|
|
40
|
+
"700": "#8E6E13",
|
|
41
|
+
"800": "#5E4A0C",
|
|
42
|
+
"900": "#2F2506",
|
|
43
|
+
"main": "#ECB81F"
|
|
44
|
+
},
|
|
45
|
+
"grey": {
|
|
46
|
+
"50": "#F9FAFB",
|
|
47
|
+
"100": "#F3F4F6",
|
|
48
|
+
"200": "#E5E7EB",
|
|
49
|
+
"300": "#D1D5DB",
|
|
50
|
+
"400": "#9CA3AF",
|
|
51
|
+
"500": "#6B7280",
|
|
52
|
+
"600": "#4B5563",
|
|
53
|
+
"700": "#374151",
|
|
54
|
+
"800": "#1F2937",
|
|
55
|
+
"900": "#111827",
|
|
56
|
+
"main": "#6B7280"
|
|
57
|
+
},
|
|
58
|
+
"orange": {
|
|
59
|
+
"50": "#FFF8E5",
|
|
60
|
+
"100": "#FFEBB7",
|
|
61
|
+
"200": "#FFDE8A",
|
|
62
|
+
"300": "#FFD15C",
|
|
63
|
+
"400": "#FFC52E",
|
|
64
|
+
"500": "#FFB800",
|
|
65
|
+
"600": "#D69B00",
|
|
66
|
+
"700": "#856000",
|
|
67
|
+
"800": "#856000",
|
|
68
|
+
"900": "#5C4200",
|
|
69
|
+
"main": "#FFB800"
|
|
70
|
+
},
|
|
71
|
+
"red": {
|
|
72
|
+
"50": "#FFEDEF",
|
|
73
|
+
"100": "#FFC6CD",
|
|
74
|
+
"200": "#FF9EAA",
|
|
75
|
+
"300": "#FD7686",
|
|
76
|
+
"400": "#ED4A5D",
|
|
77
|
+
"500": "#CB3446",
|
|
78
|
+
"600": "#A92232",
|
|
79
|
+
"700": "#871421",
|
|
80
|
+
"800": "#650914",
|
|
81
|
+
"900": "#43020A",
|
|
82
|
+
"main": "#CB3446"
|
|
83
|
+
},
|
|
84
|
+
"tealGreen": {
|
|
85
|
+
"50": "#EEFFFA",
|
|
86
|
+
"100": "#C9FFF1",
|
|
87
|
+
"200": "#A4FFE7",
|
|
88
|
+
"300": "#7FFFDE",
|
|
89
|
+
"400": "#54EEC6",
|
|
90
|
+
"500": "#3BCCA6",
|
|
91
|
+
"600": "#27AA88",
|
|
92
|
+
"700": "#17886B",
|
|
93
|
+
"800": "#0B664E",
|
|
94
|
+
"900": "#034433",
|
|
95
|
+
"main": "#3BCCA6"
|
|
96
|
+
},
|
|
97
|
+
"violet": {
|
|
98
|
+
"100": "#EBD5F1",
|
|
99
|
+
"200": "#D6ACE3",
|
|
100
|
+
"300": "#C282D5",
|
|
101
|
+
"400": "#AD59C7",
|
|
102
|
+
"500": "#992FB9",
|
|
103
|
+
"600": "#7A2694",
|
|
104
|
+
"700": "#5C1C6F",
|
|
105
|
+
"800": "#3D134A",
|
|
106
|
+
"900": "#1F0925",
|
|
107
|
+
"main": "#992FB9"
|
|
108
|
+
}
|
|
109
|
+
};
|
|
110
|
+
|
|
111
|
+
/**
|
|
112
|
+
* Neo Design System - Main Entry Point
|
|
113
|
+
* Pure barrel file for design tokens
|
|
114
|
+
*/
|
|
115
|
+
|
|
116
|
+
|
|
117
|
+
// Default export
|
|
118
|
+
var index = {
|
|
119
|
+
colors,
|
|
120
|
+
};
|
|
121
|
+
|
|
122
|
+
exports.colors = colors;
|
|
123
|
+
exports.default = index;
|
|
124
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/generated/colors.js","../src/index.js"],"sourcesContent":["// Generated colors from raw primitives\nexport const colors = {\n \"digitalBlue\": {\n \"50\": \"#F2F3FF\",\n \"100\": \"#DCE0FF\",\n \"200\": \"#B6BFFF\",\n \"300\": \"#8D99FF\",\n \"400\": \"#626EFF\",\n \"500\": \"#2F42FF\",\n \"600\": \"#2637E6\",\n \"700\": \"#1E2EC2\",\n \"800\": \"#131E7A\",\n \"900\": \"#000855\",\n \"main\": \"#2F42FF\"\n },\n \"digitalGreen\": {\n \"50\": \"#F3FFF5\",\n \"100\": \"#CFFFD7\",\n \"200\": \"#ACFFB9\",\n \"300\": \"#88FE9B\",\n \"400\": \"#72E184\",\n \"500\": \"#5EC46F\",\n \"600\": \"#4CA75A\",\n \"700\": \"#3B8948\",\n \"800\": \"#2C6C36\",\n \"900\": \"#1E4F26\",\n \"main\": \"#5EC46F\"\n },\n \"gold\": {\n \"100\": \"#FBF1D2\",\n \"200\": \"#F7E3A5\",\n \"300\": \"#F4D479\",\n \"400\": \"#F0C64C\",\n \"500\": \"#ECB81F\",\n \"600\": \"#BD9319\",\n \"700\": \"#8E6E13\",\n \"800\": \"#5E4A0C\",\n \"900\": \"#2F2506\",\n \"main\": \"#ECB81F\"\n },\n \"grey\": {\n \"50\": \"#F9FAFB\",\n \"100\": \"#F3F4F6\",\n \"200\": \"#E5E7EB\",\n \"300\": \"#D1D5DB\",\n \"400\": \"#9CA3AF\",\n \"500\": \"#6B7280\",\n \"600\": \"#4B5563\",\n \"700\": \"#374151\",\n \"800\": \"#1F2937\",\n \"900\": \"#111827\",\n \"main\": \"#6B7280\"\n },\n \"orange\": {\n \"50\": \"#FFF8E5\",\n \"100\": \"#FFEBB7\",\n \"200\": \"#FFDE8A\",\n \"300\": \"#FFD15C\",\n \"400\": \"#FFC52E\",\n \"500\": \"#FFB800\",\n \"600\": \"#D69B00\",\n \"700\": \"#856000\",\n \"800\": \"#856000\",\n \"900\": \"#5C4200\",\n \"main\": \"#FFB800\"\n },\n \"red\": {\n \"50\": \"#FFEDEF\",\n \"100\": \"#FFC6CD\",\n \"200\": \"#FF9EAA\",\n \"300\": \"#FD7686\",\n \"400\": \"#ED4A5D\",\n \"500\": \"#CB3446\",\n \"600\": \"#A92232\",\n \"700\": \"#871421\",\n \"800\": \"#650914\",\n \"900\": \"#43020A\",\n \"main\": \"#CB3446\"\n },\n \"tealGreen\": {\n \"50\": \"#EEFFFA\",\n \"100\": \"#C9FFF1\",\n \"200\": \"#A4FFE7\",\n \"300\": \"#7FFFDE\",\n \"400\": \"#54EEC6\",\n \"500\": \"#3BCCA6\",\n \"600\": \"#27AA88\",\n \"700\": \"#17886B\",\n \"800\": \"#0B664E\",\n \"900\": \"#034433\",\n \"main\": \"#3BCCA6\"\n },\n \"violet\": {\n \"100\": \"#EBD5F1\",\n \"200\": \"#D6ACE3\",\n \"300\": \"#C282D5\",\n \"400\": \"#AD59C7\",\n \"500\": \"#992FB9\",\n \"600\": \"#7A2694\",\n \"700\": \"#5C1C6F\",\n \"800\": \"#3D134A\",\n \"900\": \"#1F0925\",\n \"main\": \"#992FB9\"\n }\n};","/**\n * Neo Design System - Main Entry Point\n * Pure barrel file for design tokens\n */\n\n// Import generated tokens\nimport { colors } from './generated/colors.js'\n\n// Re-export tokens\nexport { colors }\n\n// Default export\nexport default {\n colors,\n}\n"],"names":[],"mappings":"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"}
|
package/dist/tokens.css
ADDED
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--neo-digital-blue-50: #F2F3FF;
|
|
3
|
+
--neo-digital-blue-100: #DCE0FF;
|
|
4
|
+
--neo-digital-blue-200: #B6BFFF;
|
|
5
|
+
--neo-digital-blue-300: #8D99FF;
|
|
6
|
+
--neo-digital-blue-400: #626EFF;
|
|
7
|
+
--neo-digital-blue-500: #2F42FF;
|
|
8
|
+
--neo-digital-blue-600: #2637E6;
|
|
9
|
+
--neo-digital-blue-700: #1E2EC2;
|
|
10
|
+
--neo-digital-blue-800: #131E7A;
|
|
11
|
+
--neo-digital-blue-900: #000855;
|
|
12
|
+
--neo-digital-blue-main: #2F42FF;
|
|
13
|
+
--neo-digital-green-50: #F3FFF5;
|
|
14
|
+
--neo-digital-green-100: #CFFFD7;
|
|
15
|
+
--neo-digital-green-200: #ACFFB9;
|
|
16
|
+
--neo-digital-green-300: #88FE9B;
|
|
17
|
+
--neo-digital-green-400: #72E184;
|
|
18
|
+
--neo-digital-green-500: #5EC46F;
|
|
19
|
+
--neo-digital-green-600: #4CA75A;
|
|
20
|
+
--neo-digital-green-700: #3B8948;
|
|
21
|
+
--neo-digital-green-800: #2C6C36;
|
|
22
|
+
--neo-digital-green-900: #1E4F26;
|
|
23
|
+
--neo-digital-green-main: #5EC46F;
|
|
24
|
+
--neo-gold-100: #FBF1D2;
|
|
25
|
+
--neo-gold-200: #F7E3A5;
|
|
26
|
+
--neo-gold-300: #F4D479;
|
|
27
|
+
--neo-gold-400: #F0C64C;
|
|
28
|
+
--neo-gold-500: #ECB81F;
|
|
29
|
+
--neo-gold-600: #BD9319;
|
|
30
|
+
--neo-gold-700: #8E6E13;
|
|
31
|
+
--neo-gold-800: #5E4A0C;
|
|
32
|
+
--neo-gold-900: #2F2506;
|
|
33
|
+
--neo-gold-main: #ECB81F;
|
|
34
|
+
--neo-grey-50: #F9FAFB;
|
|
35
|
+
--neo-grey-100: #F3F4F6;
|
|
36
|
+
--neo-grey-200: #E5E7EB;
|
|
37
|
+
--neo-grey-300: #D1D5DB;
|
|
38
|
+
--neo-grey-400: #9CA3AF;
|
|
39
|
+
--neo-grey-500: #6B7280;
|
|
40
|
+
--neo-grey-600: #4B5563;
|
|
41
|
+
--neo-grey-700: #374151;
|
|
42
|
+
--neo-grey-800: #1F2937;
|
|
43
|
+
--neo-grey-900: #111827;
|
|
44
|
+
--neo-grey-main: #6B7280;
|
|
45
|
+
--neo-orange-50: #FFF8E5;
|
|
46
|
+
--neo-orange-100: #FFEBB7;
|
|
47
|
+
--neo-orange-200: #FFDE8A;
|
|
48
|
+
--neo-orange-300: #FFD15C;
|
|
49
|
+
--neo-orange-400: #FFC52E;
|
|
50
|
+
--neo-orange-500: #FFB800;
|
|
51
|
+
--neo-orange-600: #D69B00;
|
|
52
|
+
--neo-orange-700: #856000;
|
|
53
|
+
--neo-orange-800: #856000;
|
|
54
|
+
--neo-orange-900: #5C4200;
|
|
55
|
+
--neo-orange-main: #FFB800;
|
|
56
|
+
--neo-red-50: #FFEDEF;
|
|
57
|
+
--neo-red-100: #FFC6CD;
|
|
58
|
+
--neo-red-200: #FF9EAA;
|
|
59
|
+
--neo-red-300: #FD7686;
|
|
60
|
+
--neo-red-400: #ED4A5D;
|
|
61
|
+
--neo-red-500: #CB3446;
|
|
62
|
+
--neo-red-600: #A92232;
|
|
63
|
+
--neo-red-700: #871421;
|
|
64
|
+
--neo-red-800: #650914;
|
|
65
|
+
--neo-red-900: #43020A;
|
|
66
|
+
--neo-red-main: #CB3446;
|
|
67
|
+
--neo-teal-green-50: #EEFFFA;
|
|
68
|
+
--neo-teal-green-100: #C9FFF1;
|
|
69
|
+
--neo-teal-green-200: #A4FFE7;
|
|
70
|
+
--neo-teal-green-300: #7FFFDE;
|
|
71
|
+
--neo-teal-green-400: #54EEC6;
|
|
72
|
+
--neo-teal-green-500: #3BCCA6;
|
|
73
|
+
--neo-teal-green-600: #27AA88;
|
|
74
|
+
--neo-teal-green-700: #17886B;
|
|
75
|
+
--neo-teal-green-800: #0B664E;
|
|
76
|
+
--neo-teal-green-900: #034433;
|
|
77
|
+
--neo-teal-green-main: #3BCCA6;
|
|
78
|
+
--neo-violet-100: #EBD5F1;
|
|
79
|
+
--neo-violet-200: #D6ACE3;
|
|
80
|
+
--neo-violet-300: #C282D5;
|
|
81
|
+
--neo-violet-400: #AD59C7;
|
|
82
|
+
--neo-violet-500: #992FB9;
|
|
83
|
+
--neo-violet-600: #7A2694;
|
|
84
|
+
--neo-violet-700: #5C1C6F;
|
|
85
|
+
--neo-violet-800: #3D134A;
|
|
86
|
+
--neo-violet-900: #1F0925;
|
|
87
|
+
--neo-violet-main: #992FB9;
|
|
88
|
+
}
|
package/dist/tokens.json
ADDED
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "Moderne Design System",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"colors": {
|
|
5
|
+
"digitalBlue": {
|
|
6
|
+
"50": "#F2F3FF",
|
|
7
|
+
"100": "#DCE0FF",
|
|
8
|
+
"200": "#B6BFFF",
|
|
9
|
+
"300": "#8D99FF",
|
|
10
|
+
"400": "#626EFF",
|
|
11
|
+
"500": "#2F42FF",
|
|
12
|
+
"600": "#2637E6",
|
|
13
|
+
"700": "#1E2EC2",
|
|
14
|
+
"800": "#131E7A",
|
|
15
|
+
"900": "#000855",
|
|
16
|
+
"main": "#2F42FF"
|
|
17
|
+
},
|
|
18
|
+
"digitalGreen": {
|
|
19
|
+
"50": "#F3FFF5",
|
|
20
|
+
"100": "#CFFFD7",
|
|
21
|
+
"200": "#ACFFB9",
|
|
22
|
+
"300": "#88FE9B",
|
|
23
|
+
"400": "#72E184",
|
|
24
|
+
"500": "#5EC46F",
|
|
25
|
+
"600": "#4CA75A",
|
|
26
|
+
"700": "#3B8948",
|
|
27
|
+
"800": "#2C6C36",
|
|
28
|
+
"900": "#1E4F26",
|
|
29
|
+
"main": "#5EC46F"
|
|
30
|
+
},
|
|
31
|
+
"gold": {
|
|
32
|
+
"100": "#FBF1D2",
|
|
33
|
+
"200": "#F7E3A5",
|
|
34
|
+
"300": "#F4D479",
|
|
35
|
+
"400": "#F0C64C",
|
|
36
|
+
"500": "#ECB81F",
|
|
37
|
+
"600": "#BD9319",
|
|
38
|
+
"700": "#8E6E13",
|
|
39
|
+
"800": "#5E4A0C",
|
|
40
|
+
"900": "#2F2506",
|
|
41
|
+
"main": "#ECB81F"
|
|
42
|
+
},
|
|
43
|
+
"grey": {
|
|
44
|
+
"50": "#F9FAFB",
|
|
45
|
+
"100": "#F3F4F6",
|
|
46
|
+
"200": "#E5E7EB",
|
|
47
|
+
"300": "#D1D5DB",
|
|
48
|
+
"400": "#9CA3AF",
|
|
49
|
+
"500": "#6B7280",
|
|
50
|
+
"600": "#4B5563",
|
|
51
|
+
"700": "#374151",
|
|
52
|
+
"800": "#1F2937",
|
|
53
|
+
"900": "#111827",
|
|
54
|
+
"main": "#6B7280"
|
|
55
|
+
},
|
|
56
|
+
"orange": {
|
|
57
|
+
"50": "#FFF8E5",
|
|
58
|
+
"100": "#FFEBB7",
|
|
59
|
+
"200": "#FFDE8A",
|
|
60
|
+
"300": "#FFD15C",
|
|
61
|
+
"400": "#FFC52E",
|
|
62
|
+
"500": "#FFB800",
|
|
63
|
+
"600": "#D69B00",
|
|
64
|
+
"700": "#856000",
|
|
65
|
+
"800": "#856000",
|
|
66
|
+
"900": "#5C4200",
|
|
67
|
+
"main": "#FFB800"
|
|
68
|
+
},
|
|
69
|
+
"red": {
|
|
70
|
+
"50": "#FFEDEF",
|
|
71
|
+
"100": "#FFC6CD",
|
|
72
|
+
"200": "#FF9EAA",
|
|
73
|
+
"300": "#FD7686",
|
|
74
|
+
"400": "#ED4A5D",
|
|
75
|
+
"500": "#CB3446",
|
|
76
|
+
"600": "#A92232",
|
|
77
|
+
"700": "#871421",
|
|
78
|
+
"800": "#650914",
|
|
79
|
+
"900": "#43020A",
|
|
80
|
+
"main": "#CB3446"
|
|
81
|
+
},
|
|
82
|
+
"tealGreen": {
|
|
83
|
+
"50": "#EEFFFA",
|
|
84
|
+
"100": "#C9FFF1",
|
|
85
|
+
"200": "#A4FFE7",
|
|
86
|
+
"300": "#7FFFDE",
|
|
87
|
+
"400": "#54EEC6",
|
|
88
|
+
"500": "#3BCCA6",
|
|
89
|
+
"600": "#27AA88",
|
|
90
|
+
"700": "#17886B",
|
|
91
|
+
"800": "#0B664E",
|
|
92
|
+
"900": "#034433",
|
|
93
|
+
"main": "#3BCCA6"
|
|
94
|
+
},
|
|
95
|
+
"violet": {
|
|
96
|
+
"100": "#EBD5F1",
|
|
97
|
+
"200": "#D6ACE3",
|
|
98
|
+
"300": "#C282D5",
|
|
99
|
+
"400": "#AD59C7",
|
|
100
|
+
"500": "#992FB9",
|
|
101
|
+
"600": "#7A2694",
|
|
102
|
+
"700": "#5C1C6F",
|
|
103
|
+
"800": "#3D134A",
|
|
104
|
+
"900": "#1F0925",
|
|
105
|
+
"main": "#992FB9"
|
|
106
|
+
}
|
|
107
|
+
},
|
|
108
|
+
"metadata": {
|
|
109
|
+
"source": "static",
|
|
110
|
+
"lastUpdated": "2025-09-22T23:51:44.473Z"
|
|
111
|
+
}
|
|
112
|
+
}
|
package/package.json
ADDED
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@moderneinc/neo-design",
|
|
3
|
+
"version": "1.0.1",
|
|
4
|
+
"type": "module",
|
|
5
|
+
"description": "Design primitives and tokens for Moderne applications",
|
|
6
|
+
"main": "dist/index.js",
|
|
7
|
+
"module": "dist/index.esm.js",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"import": "./dist/index.esm.js",
|
|
11
|
+
"require": "./dist/index.js"
|
|
12
|
+
},
|
|
13
|
+
"./tokens.json": {
|
|
14
|
+
"default": "./dist/tokens.json"
|
|
15
|
+
},
|
|
16
|
+
"./colors.json": {
|
|
17
|
+
"default": "./dist/colors.json"
|
|
18
|
+
},
|
|
19
|
+
"./tokens.css": {
|
|
20
|
+
"default": "./dist/tokens.css"
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
"files": [
|
|
24
|
+
"dist"
|
|
25
|
+
],
|
|
26
|
+
"scripts": {
|
|
27
|
+
"clean": "rm -rf dist/*",
|
|
28
|
+
"prebuild": "npm run clean",
|
|
29
|
+
"build": "node scripts/build-production.js",
|
|
30
|
+
"dev": "rollup -c --watch",
|
|
31
|
+
"test": "vitest",
|
|
32
|
+
"test:run": "vitest run",
|
|
33
|
+
"lint": "biome check src",
|
|
34
|
+
"lint:fix": "biome check --write src",
|
|
35
|
+
"format": "biome format --write src",
|
|
36
|
+
"knip": "knip",
|
|
37
|
+
"knip:production": "knip --production",
|
|
38
|
+
"check:all": "npm run format && npm run lint:fix && npm run test:run && npm run knip",
|
|
39
|
+
"build-storybook": "storybook build",
|
|
40
|
+
"dev-storybook": "storybook dev -p 6006",
|
|
41
|
+
"storybook": "npm run dev-storybook",
|
|
42
|
+
"analyze-bundle": "node scripts/analyze-bundle.js",
|
|
43
|
+
"build-enhanced": "node scripts/build-with-builders.js",
|
|
44
|
+
"prepublishOnly": "npm run build"
|
|
45
|
+
},
|
|
46
|
+
"keywords": [
|
|
47
|
+
"design-tokens",
|
|
48
|
+
"design-system",
|
|
49
|
+
"figma",
|
|
50
|
+
"mui",
|
|
51
|
+
"javascript",
|
|
52
|
+
"plugins",
|
|
53
|
+
"css",
|
|
54
|
+
"scss"
|
|
55
|
+
],
|
|
56
|
+
"author": "Moderne",
|
|
57
|
+
"license": "UNLICENSED",
|
|
58
|
+
"devDependencies": {
|
|
59
|
+
"@biomejs/biome": "2.2.4",
|
|
60
|
+
"@rollup/plugin-json": "6.1.0",
|
|
61
|
+
"@rollup/plugin-node-resolve": "16.0.1",
|
|
62
|
+
"@semantic-release/changelog": "6.0.3",
|
|
63
|
+
"@semantic-release/commit-analyzer": "13.0.1",
|
|
64
|
+
"@semantic-release/git": "10.0.1",
|
|
65
|
+
"@semantic-release/github": "11.0.6",
|
|
66
|
+
"@semantic-release/npm": "12.0.2",
|
|
67
|
+
"@semantic-release/release-notes-generator": "14.1.0",
|
|
68
|
+
"semantic-release": "24.2.9",
|
|
69
|
+
"@rollup/plugin-typescript": "12.1.4",
|
|
70
|
+
"@storybook/addon-docs": "9.1.6",
|
|
71
|
+
"@storybook/react": "9.1.6",
|
|
72
|
+
"@storybook/react-vite": "9.1.6",
|
|
73
|
+
"@types/node": "24.5.2",
|
|
74
|
+
"@vitest/coverage-v8": "3.2.4",
|
|
75
|
+
"dotenv": "17.2.2",
|
|
76
|
+
"knip": "5.63.1",
|
|
77
|
+
"rollup": "4.52.0",
|
|
78
|
+
"rollup-plugin-dts": "6.2.3",
|
|
79
|
+
"storybook": "9.1.6",
|
|
80
|
+
"typescript": "5.9.2",
|
|
81
|
+
"vitest": "3.2.4"
|
|
82
|
+
},
|
|
83
|
+
"peerDependencies": {
|
|
84
|
+
"@mui/material": "7.x",
|
|
85
|
+
"react": "18.3.1 || 19.1.1"
|
|
86
|
+
},
|
|
87
|
+
"peerDependenciesMeta": {
|
|
88
|
+
"@mui/material": {
|
|
89
|
+
"optional": true
|
|
90
|
+
},
|
|
91
|
+
"react": {
|
|
92
|
+
"optional": true
|
|
93
|
+
}
|
|
94
|
+
},
|
|
95
|
+
"optionalDependencies": {
|
|
96
|
+
"@rollup/rollup-darwin-arm64": "4.52.0",
|
|
97
|
+
"@rollup/rollup-linux-x64-gnu": "4.52.0",
|
|
98
|
+
"@rollup/rollup-win32-x64-msvc": "4.52.0"
|
|
99
|
+
}
|
|
100
|
+
}
|