@framed-dev/react 0.2.0 → 0.3.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 (12) hide show
  1. package/README.md +62 -233
  2. package/dist/index.cjs +17247 -73617
  3. package/dist/index.cjs.map +1 -0
  4. package/dist/index.js +17269 -73202
  5. package/dist/index.js.map +1 -0
  6. package/package.json +19 -65
  7. package/dist/index.d.cts +0 -761
  8. package/dist/index.d.ts +0 -761
  9. package/dist/styles/framed.css +0 -6474
  10. package/styles.css +0 -525
  11. package/tailwind.config.js +0 -207
  12. package/tailwind.preset.js +0 -86
package/tailwind.config.js DELETED
@@ -1,207 +0,0 @@
1
- /** @type {import('tailwindcss').Config} */
2
- export default {
3
- darkMode: ["class"],
4
- content: [
5
- "./index.html",
6
- "./src/**/*.{js,ts,jsx,tsx}",
7
- ],
8
- theme: {
9
- extend: {
10
- colors: {
11
- mirage: {
12
- '50': '#3a5564',
13
- '100': '#314954',
14
- '200': '#273944',
15
- '300': '#1e2e35',
16
- '400': '#16232A',
17
- '500': '#16232A',
18
- '600': '#0d1419',
19
- '700': '#080c0f',
20
- '800': '#030405',
21
- '900': '#000000',
22
- DEFAULT: '#16232A'
23
- },
24
- 'blaze-orange': {
25
- '50': '#FFF4ED',
26
- '100': '#FFE5D1',
27
- '200': '#FFC89D',
28
- '300': '#FFA36A',
29
- '400': '#FF7E36',
30
- '500': '#FF5B04',
31
- '600': '#D14800',
32
- '700': '#9E3600',
33
- '800': '#6B2400',
34
- '900': '#381300',
35
- DEFAULT: '#FF5B04'
36
- },
37
- 'deep-sea-green': {
38
- '50': '#17C8D4',
39
- '100': '#14B5C0',
40
- '200': '#118F98',
41
- '300': '#0D6970',
42
- '400': '#0A5C61',
43
- '500': '#075056',
44
- '600': '#053A3E',
45
- '700': '#032426',
46
- '800': '#010E0F',
47
- '900': '#000000',
48
- DEFAULT: '#075056'
49
- },
50
- 'wild-sand': {
51
- '50': '#FFFFFF',
52
- '100': '#FFFFFF',
53
- '200': '#FFFFFF',
54
- '300': '#FFFFFF',
55
- '400': '#F6FBFC',
56
- '500': '#E4EEF0',
57
- '600': '#BDD5DB',
58
- '700': '#96BCC5',
59
- '800': '#6FA3AF',
60
- '900': '#4E8894',
61
- DEFAULT: '#E4EEF0'
62
- },
63
- primary: {
64
- DEFAULT: 'hsl(var(--primary))',
65
- hover: '#1e2e35',
66
- light: '#3a5564',
67
- foreground: 'hsl(var(--primary-foreground))'
68
- },
69
- secondary: {
70
- DEFAULT: 'hsl(var(--secondary))',
71
- dark: '#053A3E',
72
- foreground: 'hsl(var(--secondary-foreground))'
73
- },
74
- accent: {
75
- DEFAULT: 'hsl(var(--accent))',
76
- success: '#10B981',
77
- warning: '#F59E0B',
78
- error: '#EF4444',
79
- foreground: 'hsl(var(--accent-foreground))'
80
- },
81
- 'powder-blue': {
82
- '50': '#f5f7fe',
83
- '100': '#e8ecfc',
84
- '200': '#d4ddf9',
85
- '300': '#b9c7f4',
86
- '400': '#a7bbec',
87
- '500': '#8fa3e3',
88
- '600': '#7688d7',
89
- '700': '#6574c3',
90
- '800': '#535f9f',
91
- '900': '#46517e',
92
- DEFAULT: '#a7bbec'
93
- },
94
- wenge: {
95
- '50': '#f7f6f6',
96
- '100': '#e3e1e0',
97
- '200': '#c8c4c2',
98
- '300': '#a8a09d',
99
- '400': '#8d827e',
100
- '500': '#705d56',
101
- '600': '#64534d',
102
- '700': '#544541',
103
- '800': '#463b38',
104
- '900': '#3c3330',
105
- DEFAULT: '#705d56'
106
- },
107
- 'van-dyke': {
108
- '50': '#f6f5f4',
109
- '100': '#e7e3e0',
110
- '200': '#d0c7c1',
111
- '300': '#b5a79d',
112
- '400': '#9c8a7d',
113
- '500': '#8b7465',
114
- '600': '#7f6659',
115
- '700': '#6a544a',
116
- '800': '#503b31',
117
- '900': '#4a3a32',
118
- DEFAULT: '#503b31'
119
- },
120
- 'cool-gray': {
121
- '50': '#f5f6f9',
122
- '100': '#e8eaf2',
123
- '200': '#d4d8e8',
124
- '300': '#b3bad7',
125
- '400': '#9097c0',
126
- '500': '#7a81ab',
127
- '600': '#676e97',
128
- '700': '#5a607a',
129
- '800': '#4c5166',
130
- '900': '#414556',
131
- DEFAULT: '#9097c0'
132
- },
133
- black: {
134
- '50': '#f6f6f6',
135
- '100': '#e7e7e7',
136
- '200': '#d1d1d1',
137
- '300': '#b0b0b0',
138
- '400': '#888888',
139
- '500': '#6d6d6d',
140
- '600': '#5d5d5d',
141
- '700': '#4f4f4f',
142
- '800': '#454545',
143
- '900': '#020202',
144
- DEFAULT: '#020202'
145
- },
146
- background: 'hsl(var(--background))',
147
- foreground: 'hsl(var(--foreground))',
148
- card: {
149
- DEFAULT: 'hsl(var(--card))',
150
- foreground: 'hsl(var(--card-foreground))'
151
- },
152
- popover: {
153
- DEFAULT: 'hsl(var(--popover))',
154
- foreground: 'hsl(var(--popover-foreground))'
155
- },
156
- muted: {
157
- DEFAULT: 'hsl(var(--muted))',
158
- foreground: 'hsl(var(--muted-foreground))'
159
- },
160
- destructive: {
161
- DEFAULT: 'hsl(var(--destructive))',
162
- foreground: 'hsl(var(--destructive-foreground))'
163
- },
164
- border: 'hsl(var(--border))',
165
- input: 'hsl(var(--input))',
166
- ring: 'hsl(var(--ring))',
167
- chart: {
168
- '1': 'hsl(var(--chart-1))',
169
- '2': 'hsl(var(--chart-2))',
170
- '3': 'hsl(var(--chart-3))',
171
- '4': 'hsl(var(--chart-4))',
172
- '5': 'hsl(var(--chart-5))'
173
- },
174
- sidebar: {
175
- DEFAULT: 'hsl(var(--sidebar-background))',
176
- foreground: 'hsl(var(--sidebar-foreground))',
177
- primary: 'hsl(var(--sidebar-primary))',
178
- 'primary-foreground': 'hsl(var(--sidebar-primary-foreground))',
179
- accent: 'hsl(var(--sidebar-accent))',
180
- 'accent-foreground': 'hsl(var(--sidebar-accent-foreground))',
181
- border: 'hsl(var(--sidebar-border))',
182
- ring: 'hsl(var(--sidebar-ring))'
183
- }
184
- },
185
- fontFamily: {
186
- sans: [
187
- 'Open Sans',
188
- 'sans-serif'
189
- ]
190
- },
191
- maxWidth: {
192
- '6xl': '72rem',
193
- '7xl': '80rem',
194
- '8xl': '88rem'
195
- },
196
- screens: {
197
- '3xl': '1920px'
198
- },
199
- borderRadius: {
200
- lg: 'var(--radius)',
201
- md: 'calc(var(--radius) - 2px)',
202
- sm: 'calc(var(--radius) - 4px)'
203
- }
204
- }
205
- },
206
- plugins: [require("tailwindcss-animate")],
207
- }
package/tailwind.preset.js DELETED
@@ -1,86 +0,0 @@
1
- /** @type {import('tailwindcss').Config} */
2
- module.exports = {
3
- theme: {
4
- extend: {
5
- colors: {
6
- // Framed brand colors
7
- 'framed-black': '#020202',
8
- 'framed-van-dyke': '#503b31',
9
- 'framed-wenge': '#705d56',
10
- 'framed-cool-gray': '#9097c0',
11
- 'framed-powder-blue': '#a7bbec',
12
-
13
- // Semantic colors
14
- border: 'hsl(var(--border))',
15
- input: 'hsl(var(--input))',
16
- ring: 'hsl(var(--ring))',
17
- background: 'hsl(var(--background))',
18
- foreground: 'hsl(var(--foreground))',
19
- primary: {
20
- DEFAULT: 'hsl(var(--primary))',
21
- foreground: 'hsl(var(--primary-foreground))',
22
- },
23
- secondary: {
24
- DEFAULT: 'hsl(var(--secondary))',
25
- foreground: 'hsl(var(--secondary-foreground))',
26
- },
27
- destructive: {
28
- DEFAULT: 'hsl(var(--destructive))',
29
- foreground: 'hsl(var(--destructive-foreground))',
30
- },
31
- muted: {
32
- DEFAULT: 'hsl(var(--muted))',
33
- foreground: 'hsl(var(--muted-foreground))',
34
- },
35
- accent: {
36
- DEFAULT: 'hsl(var(--accent))',
37
- foreground: 'hsl(var(--accent-foreground))',
38
- },
39
- popover: {
40
- DEFAULT: 'hsl(var(--popover))',
41
- foreground: 'hsl(var(--popover-foreground))',
42
- },
43
- card: {
44
- DEFAULT: 'hsl(var(--card))',
45
- foreground: 'hsl(var(--card-foreground))',
46
- },
47
- },
48
- fontFamily: {
49
- 'framed': ['Inter Tight', 'Inter', 'sans-serif'],
50
- 'sans': ['Inter', 'sans-serif'],
51
- },
52
- borderRadius: {
53
- lg: 'var(--radius)',
54
- md: 'calc(var(--radius) - 2px)',
55
- sm: 'calc(var(--radius) - 4px)',
56
- },
57
- keyframes: {
58
- 'accordion-down': {
59
- from: { height: '0' },
60
- to: { height: 'var(--radix-accordion-content-height)' },
61
- },
62
- 'accordion-up': {
63
- from: { height: 'var(--radix-accordion-content-height)' },
64
- to: { height: '0' },
65
- },
66
- 'slide-in-from-right': {
67
- from: { transform: 'translateX(100%)' },
68
- to: { transform: 'translateX(0)' },
69
- },
70
- 'slide-out-to-right': {
71
- from: { transform: 'translateX(0)' },
72
- to: { transform: 'translateX(100%)' },
73
- },
74
- },
75
- animation: {
76
- 'accordion-down': 'accordion-down 0.2s ease-out',
77
- 'accordion-up': 'accordion-up 0.2s ease-out',
78
- 'slide-in-from-right': 'slide-in-from-right 0.3s ease-out',
79
- 'slide-out-to-right': 'slide-out-to-right 0.3s ease-out',
80
- },
81
- },
82
- },
83
- plugins: [
84
- require('tailwindcss-animate'),
85
- ],
86
- };