@yeverlibs/ds 1.0.1 → 1.0.3
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/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -0
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -2
- package/tailwind.package.config.js +200 -0
- package/dist/styles.css +0 -2715
- package/dist/styles.css.map +0 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yeverlibs/ds",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.3",
|
|
4
4
|
"description": "Yever Design System - Component library",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"module": "./dist/index.mjs",
|
|
@@ -20,7 +20,8 @@
|
|
|
20
20
|
"README.md"
|
|
21
21
|
],
|
|
22
22
|
"scripts": {
|
|
23
|
-
"build": "
|
|
23
|
+
"build:css": "tailwindcss -i ./src/styles.css -o ./dist/styles.css --config ./tailwind.package.config.ts",
|
|
24
|
+
"build": "npm run build:css && tsup",
|
|
24
25
|
"dev": "tsup --watch",
|
|
25
26
|
"lint": "eslint src --ext .ts,.tsx",
|
|
26
27
|
"lint:fix": "eslint src --ext .ts,.tsx --fix",
|
|
@@ -0,0 +1,200 @@
|
|
|
1
|
+
// Este arquivo é gerado automaticamente durante o build
|
|
2
|
+
// Não edite manualmente - edite tailwind.package.config.ts
|
|
3
|
+
|
|
4
|
+
const colors = require('./src/_design-system/theme/colors').default
|
|
5
|
+
const fontFamily = require('./src/_design-system/theme/font-family').default
|
|
6
|
+
const shadow = require('./src/_design-system/theme/shadow').default
|
|
7
|
+
const plugin = require('tailwindcss/plugin')
|
|
8
|
+
|
|
9
|
+
/** @type {import('tailwindcss').Config} */
|
|
10
|
+
const config = {
|
|
11
|
+
darkMode: ['class'],
|
|
12
|
+
content: ['./src/_design-system/**/*.{ts,tsx}'],
|
|
13
|
+
safelist: [
|
|
14
|
+
// Classes do Button - Variants
|
|
15
|
+
'bg-brand-yellow-500',
|
|
16
|
+
'hover:bg-brand-yellow-600',
|
|
17
|
+
'disabled:bg-brand-yellow-300',
|
|
18
|
+
'disabled:text-gray-yellow-400',
|
|
19
|
+
'bg-brand-blue-400',
|
|
20
|
+
'hover:bg-brand-blue-500',
|
|
21
|
+
'disabled:bg-brand-blue-300',
|
|
22
|
+
'text-brand-blue-400',
|
|
23
|
+
'text-brand-blue-0',
|
|
24
|
+
'border-brand-blue-400',
|
|
25
|
+
'bg-transparent',
|
|
26
|
+
'border-transparent',
|
|
27
|
+
'text-black',
|
|
28
|
+
'text-white',
|
|
29
|
+
'border',
|
|
30
|
+
'border-gray-300',
|
|
31
|
+
'hover:bg-gray-0',
|
|
32
|
+
'disabled:text-gray-300',
|
|
33
|
+
'bg-red-600',
|
|
34
|
+
'hover:bg-red-800',
|
|
35
|
+
'disabled:bg-red-300',
|
|
36
|
+
'text-red-0',
|
|
37
|
+
'bg-white',
|
|
38
|
+
'text-gray-500',
|
|
39
|
+
'hover:text-brand-blue-400',
|
|
40
|
+
'hover:border-brand-blue-400',
|
|
41
|
+
'bg-green-800',
|
|
42
|
+
'hover:bg-green-900',
|
|
43
|
+
'text-green-0',
|
|
44
|
+
'border-red-600',
|
|
45
|
+
'hover:bg-red-600',
|
|
46
|
+
'hover:text-white',
|
|
47
|
+
// Classes do Button - Sizes
|
|
48
|
+
'px-12',
|
|
49
|
+
'py-4',
|
|
50
|
+
'py-3.5',
|
|
51
|
+
'py-3',
|
|
52
|
+
'px-6',
|
|
53
|
+
'py-2.5',
|
|
54
|
+
'text-sm',
|
|
55
|
+
'text-xs',
|
|
56
|
+
// Classes do Button - Base
|
|
57
|
+
'w-full',
|
|
58
|
+
'flex',
|
|
59
|
+
'items-center',
|
|
60
|
+
'justify-center',
|
|
61
|
+
'gap-2',
|
|
62
|
+
'rounded',
|
|
63
|
+
'transition',
|
|
64
|
+
'duration-300',
|
|
65
|
+
'ease-in-out',
|
|
66
|
+
'text-base',
|
|
67
|
+
'font-medium',
|
|
68
|
+
'focus:ring-0',
|
|
69
|
+
'outline-none',
|
|
70
|
+
'!m-0',
|
|
71
|
+
'!max-h-[42px]',
|
|
72
|
+
'flex-row',
|
|
73
|
+
'flex-row-reverse',
|
|
74
|
+
'pointer-events-none',
|
|
75
|
+
'opacity-70',
|
|
76
|
+
'cursor-not-allowed',
|
|
77
|
+
// Classes do Input e outros componentes
|
|
78
|
+
'text-gray-blue-3',
|
|
79
|
+
'rounded-none',
|
|
80
|
+
'text-left',
|
|
81
|
+
'transition-all',
|
|
82
|
+
'justify-start',
|
|
83
|
+
'border-[2px]',
|
|
84
|
+
'!border',
|
|
85
|
+
'!pl-10',
|
|
86
|
+
// Classes comuns que podem ser usadas dinamicamente
|
|
87
|
+
{
|
|
88
|
+
pattern:
|
|
89
|
+
/^(bg|text|border|hover:bg|hover:text|disabled:bg|disabled:text|focus:bg|focus:border|before:|after:)-(brand-(yellow|blue)|gray|red|green|yellow)-(0|100|200|300|400|500|600|700|800|900)$/,
|
|
90
|
+
},
|
|
91
|
+
],
|
|
92
|
+
prefix: '',
|
|
93
|
+
theme: {
|
|
94
|
+
colors: {
|
|
95
|
+
...colors,
|
|
96
|
+
},
|
|
97
|
+
fontFamily: {
|
|
98
|
+
...fontFamily,
|
|
99
|
+
},
|
|
100
|
+
boxShadow: {
|
|
101
|
+
...shadow,
|
|
102
|
+
},
|
|
103
|
+
container: {
|
|
104
|
+
center: true,
|
|
105
|
+
padding: '2rem',
|
|
106
|
+
screens: {
|
|
107
|
+
'2xl': '1440px',
|
|
108
|
+
},
|
|
109
|
+
},
|
|
110
|
+
extend: {
|
|
111
|
+
keyframes: {
|
|
112
|
+
'pulse-red': {
|
|
113
|
+
'0%': {
|
|
114
|
+
transform: 'scale(0.8)',
|
|
115
|
+
boxShadow: '0 0 0 0 rgba(229, 62, 62, 1)',
|
|
116
|
+
},
|
|
117
|
+
'70%': {
|
|
118
|
+
transform: 'scale(1)',
|
|
119
|
+
boxShadow: '0 0 0 10px rgba(229, 62, 62, 0)',
|
|
120
|
+
},
|
|
121
|
+
'100%': {
|
|
122
|
+
transform: 'scale(0.8)',
|
|
123
|
+
},
|
|
124
|
+
},
|
|
125
|
+
'slide-up-fade-in': {
|
|
126
|
+
'0%': {
|
|
127
|
+
opacity: '0',
|
|
128
|
+
transform: 'translateY(10px)',
|
|
129
|
+
},
|
|
130
|
+
'100%': {
|
|
131
|
+
opacity: '1',
|
|
132
|
+
transform: 'translateY(0)',
|
|
133
|
+
},
|
|
134
|
+
},
|
|
135
|
+
'slide-down-fade-in': {
|
|
136
|
+
'0%': {
|
|
137
|
+
opacity: '0',
|
|
138
|
+
transform: 'translateY(-10px)',
|
|
139
|
+
},
|
|
140
|
+
'100%': {
|
|
141
|
+
opacity: '1',
|
|
142
|
+
transform: 'translateY(0)',
|
|
143
|
+
},
|
|
144
|
+
},
|
|
145
|
+
'slide-down-fade-out': {
|
|
146
|
+
'0%': {
|
|
147
|
+
opacity: '1',
|
|
148
|
+
transform: 'translateY(0)',
|
|
149
|
+
},
|
|
150
|
+
'100%': {
|
|
151
|
+
opacity: '0',
|
|
152
|
+
transform: 'translateY(10px)',
|
|
153
|
+
},
|
|
154
|
+
},
|
|
155
|
+
'slide-left-fade-in': {
|
|
156
|
+
'0%': {
|
|
157
|
+
opacity: '0',
|
|
158
|
+
transform: 'translateX(10px)',
|
|
159
|
+
},
|
|
160
|
+
'100%': {
|
|
161
|
+
opacity: '1',
|
|
162
|
+
transform: 'translateX(0)',
|
|
163
|
+
},
|
|
164
|
+
},
|
|
165
|
+
'slide-right-fade-out': {
|
|
166
|
+
'0%': {
|
|
167
|
+
opacity: '1',
|
|
168
|
+
transform: 'translateX(0)',
|
|
169
|
+
},
|
|
170
|
+
'100%': {
|
|
171
|
+
opacity: '0',
|
|
172
|
+
transform: 'translateX(10px)',
|
|
173
|
+
},
|
|
174
|
+
},
|
|
175
|
+
},
|
|
176
|
+
animation: {
|
|
177
|
+
'slide-up-fade-in': 'slide-up-fade-in 0.5s ease-out forwards',
|
|
178
|
+
'slide-down-fade-out': 'slide-down-fade-out 0.5s ease-out forwards',
|
|
179
|
+
'slide-left-fade-in': 'slide-left-fade-in 0.5s ease-out forwards',
|
|
180
|
+
'slide-right-fade-out': 'slide-right-fade-out 0.5s ease-out forwards',
|
|
181
|
+
'pulse-red': 'pulse-red 2s infinite',
|
|
182
|
+
},
|
|
183
|
+
},
|
|
184
|
+
},
|
|
185
|
+
plugins: [
|
|
186
|
+
require('tailwindcss-animate'),
|
|
187
|
+
require('@tailwindcss/typography'),
|
|
188
|
+
plugin(function ({ addVariant, e }) {
|
|
189
|
+
addVariant('sidebar-expanded', ({ modifySelectors, separator }) => {
|
|
190
|
+
modifySelectors(
|
|
191
|
+
({ className }) =>
|
|
192
|
+
`.sidebar-expanded .${e(`sidebar-expanded${separator}${className}`)}`
|
|
193
|
+
)
|
|
194
|
+
})
|
|
195
|
+
}),
|
|
196
|
+
],
|
|
197
|
+
}
|
|
198
|
+
|
|
199
|
+
module.exports = config
|
|
200
|
+
|