@qasa/qds-ui 0.23.1 → 0.25.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.
- package/README.md +3 -2
- package/dist/index.d.mts +686 -3973
- package/dist/index.d.ts +686 -3973
- package/dist/index.js +197 -180
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +105 -89
- package/dist/index.mjs.map +1 -1
- package/dist/preset.css +136 -8
- package/package.json +25 -49
package/dist/preset.css
CHANGED
|
@@ -1,28 +1,152 @@
|
|
|
1
1
|
@theme inline {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
*/
|
|
5
|
-
--*: initial;
|
|
6
|
-
--leading-*: initial;
|
|
7
|
-
|
|
2
|
+
/* Remove all default font families */
|
|
3
|
+
--font-*: initial;
|
|
8
4
|
--font-sans: var(--font-family-sans), Helvetica, -apple-system, Arial, sans-serif;
|
|
9
5
|
--font-display: var(--font-family-display), Helvetica, -apple-system, Arial, sans-serif;
|
|
10
6
|
--font-display--font-feature-settings: 'ss05';
|
|
7
|
+
|
|
8
|
+
/* Remove all default font weights */
|
|
9
|
+
--font-weight-*: initial;
|
|
10
|
+
--font-weight-normal: 400;
|
|
11
|
+
--font-weight-medium: 500;
|
|
12
|
+
--font-weight-bold: 700;
|
|
13
|
+
|
|
14
|
+
--color-*: initial;
|
|
15
|
+
/* Brand colors */
|
|
16
|
+
--color-pink: #ff84b6;
|
|
17
|
+
--color-brown: #342620;
|
|
18
|
+
--color-brown-dark: #2a1e1a;
|
|
19
|
+
--color-brown-light: #3c2f29;
|
|
20
|
+
--color-offWhite: #f0f0eb;
|
|
21
|
+
--color-offWhite-dark: #e0e0d6;
|
|
22
|
+
--color-offWhite-light: #f6f6f3;
|
|
23
|
+
--color-softPink: #ffe8f0;
|
|
24
|
+
--color-warmYellow: #ffd66c;
|
|
25
|
+
--color-softYellow: #fff8cc;
|
|
26
|
+
|
|
27
|
+
/* Functional colors */
|
|
28
|
+
--color-black: #000000;
|
|
29
|
+
--color-white: #ffffff;
|
|
30
|
+
--color-uiPink: #ff99c2;
|
|
31
|
+
--color-uiPink-dark: #ff84b6;
|
|
32
|
+
--color-uiPink-light: #ffa3c8;
|
|
33
|
+
--color-gray-10: #f9f9f6;
|
|
34
|
+
--color-gray-20: #f0f0eb;
|
|
35
|
+
--color-gray-30: #e5e5df;
|
|
36
|
+
--color-gray-40: #d6d6cd;
|
|
37
|
+
--color-gray-50: #a3a396;
|
|
38
|
+
--color-gray-60: #78786c;
|
|
39
|
+
--color-gray-70: #545448;
|
|
40
|
+
--color-gray-80: #424236;
|
|
41
|
+
--color-gray-90: #26261d;
|
|
42
|
+
--color-red-10: #fef3f1;
|
|
43
|
+
--color-red-20: #fad8d4;
|
|
44
|
+
--color-red-30: #f8b2a8;
|
|
45
|
+
--color-red-40: #f47e6e;
|
|
46
|
+
--color-red-50: #ef452e;
|
|
47
|
+
--color-red-60: #de1b00;
|
|
48
|
+
--color-red-70: #c21700;
|
|
49
|
+
--color-red-80: #a81400;
|
|
50
|
+
--color-red-90: #8a1100;
|
|
51
|
+
--color-green-10: #f5fbf7;
|
|
52
|
+
--color-green-20: #d1efda;
|
|
53
|
+
--color-green-30: #a1deb2;
|
|
54
|
+
--color-green-40: #66ca82;
|
|
55
|
+
--color-green-50: #30b757;
|
|
56
|
+
--color-green-60: #00a62f;
|
|
57
|
+
--color-green-70: #009029;
|
|
58
|
+
--color-green-80: #007d23;
|
|
59
|
+
--color-green-90: #00661d;
|
|
60
|
+
--color-blue-10: #f0f7ff;
|
|
61
|
+
--color-blue-20: #dbebff;
|
|
62
|
+
--color-blue-30: #bdd7ff;
|
|
63
|
+
--color-blue-40: #80aeff;
|
|
64
|
+
--color-blue-50: #578fff;
|
|
65
|
+
--color-blue-60: #3370ff;
|
|
66
|
+
--color-blue-70: #0045f6;
|
|
67
|
+
--color-blue-80: #0039cc;
|
|
68
|
+
--color-blue-90: #00288e;
|
|
69
|
+
--color-yellow-10: #fef7e5;
|
|
70
|
+
--color-yellow-20: #fbe6b2;
|
|
71
|
+
--color-yellow-30: #f9d682;
|
|
72
|
+
--color-yellow-40: #f7c652;
|
|
73
|
+
--color-yellow-50: #f5b92b;
|
|
74
|
+
--color-yellow-60: #f3ab00;
|
|
75
|
+
--color-yellow-70: #e29f00;
|
|
76
|
+
--color-yellow-80: #c58b00;
|
|
77
|
+
--color-yellow-90: #9b6d00;
|
|
78
|
+
|
|
79
|
+
/*
|
|
80
|
+
Based on Tailwind V3's default spacing scale,
|
|
81
|
+
but with some unnecessary values removed (e.g. 10px)
|
|
82
|
+
*/
|
|
83
|
+
--spacing: initial;
|
|
84
|
+
--spacing-0: 0;
|
|
85
|
+
--spacing-1: 0.25rem;
|
|
86
|
+
--spacing-2: 0.5rem;
|
|
87
|
+
--spacing-3: 0.75rem;
|
|
88
|
+
--spacing-4: 1rem;
|
|
89
|
+
--spacing-5: 1.25rem;
|
|
90
|
+
--spacing-6: 1.5rem;
|
|
91
|
+
--spacing-7: 1.75rem;
|
|
92
|
+
--spacing-8: 2rem;
|
|
93
|
+
--spacing-10: 2.5rem;
|
|
94
|
+
--spacing-12: 3rem;
|
|
95
|
+
--spacing-14: 3.5rem;
|
|
96
|
+
--spacing-16: 4rem;
|
|
97
|
+
--spacing-20: 5rem;
|
|
98
|
+
--spacing-24: 6rem;
|
|
99
|
+
--spacing-28: 7rem;
|
|
100
|
+
--spacing-32: 8rem;
|
|
101
|
+
--spacing-36: 9rem;
|
|
102
|
+
--spacing-40: 10rem;
|
|
103
|
+
--spacing-44: 11rem;
|
|
104
|
+
--spacing-48: 12rem;
|
|
105
|
+
--spacing-52: 13rem;
|
|
106
|
+
--spacing-56: 14rem;
|
|
107
|
+
--spacing-60: 15rem;
|
|
108
|
+
--spacing-64: 16rem;
|
|
109
|
+
--spacing-72: 18rem;
|
|
110
|
+
--spacing-80: 20rem;
|
|
111
|
+
--spacing-96: 24rem;
|
|
112
|
+
|
|
113
|
+
--radius-*: initial;
|
|
114
|
+
--radius-2xs: 6px;
|
|
115
|
+
--radius-xs: 8px;
|
|
116
|
+
--radius-sm: 12px;
|
|
117
|
+
--radius-md: 16px;
|
|
118
|
+
--radius-lg: 24px;
|
|
119
|
+
--radius-xl: 32px;
|
|
120
|
+
--radius-2xl: 48px;
|
|
121
|
+
/* Full rounding is included by default */
|
|
122
|
+
|
|
123
|
+
--shadow-*: initial;
|
|
124
|
+
--shadow-sm: 0px 0.9px 2.1px 0px rgba(0, 0, 0, 0.0197), 0px 2.1px 5px 0px rgba(0, 0, 0, 0.0283),
|
|
125
|
+
0px 3.9px 9.4px 0px rgba(0, 0, 0, 0.035);
|
|
126
|
+
--shadow-md: 0px 0.9px 2.1px 0px rgba(0, 0, 0, 0.0197), 0px 2.1px 5px 0px rgba(0, 0, 0, 0.0283),
|
|
127
|
+
0px 3.9px 9.4px 0px rgba(0, 0, 0, 0.035), 0px 7px 16.8px 0px rgba(0, 0, 0, 0.0417);
|
|
128
|
+
--shadow-lg: 0px 0.9px 2.1px 0px rgba(0, 0, 0, 0.0197), 0px 2.1px 5px 0px rgba(0, 0, 0, 0.0283),
|
|
129
|
+
0px 3.9px 9.4px 0px rgba(0, 0, 0, 0.035), 0px 7px 16.8px 0px rgba(0, 0, 0, 0.0417),
|
|
130
|
+
0px 13px 31.3px 0px rgba(0, 0, 0, 0.0503);
|
|
131
|
+
--shadow-xl: 0px 0.9px 2.1px 0px rgba(0, 0, 0, 0.0197), 0px 2.1px 5px 0px rgba(0, 0, 0, 0.0283),
|
|
132
|
+
0px 3.9px 9.4px 0px rgba(0, 0, 0, 0.035), 0px 7px 16.8px 0px rgba(0, 0, 0, 0.0417),
|
|
133
|
+
0px 13px 31.3px 0px rgba(0, 0, 0, 0.0503), 0px 31px 75px 0px rgba(0, 0, 0, 0.07);
|
|
11
134
|
}
|
|
12
135
|
|
|
13
136
|
@layer base {
|
|
14
137
|
html {
|
|
15
138
|
@apply antialiased;
|
|
139
|
+
font-synthesis: none;
|
|
16
140
|
}
|
|
17
141
|
body {
|
|
18
|
-
@apply font-sans text-[16px]
|
|
142
|
+
@apply font-sans text-[16px] text-brown;
|
|
19
143
|
}
|
|
20
144
|
|
|
21
145
|
button,
|
|
22
146
|
a,
|
|
23
147
|
[role='button'] {
|
|
24
148
|
&:focus-visible {
|
|
25
|
-
@apply outline-2 outline-
|
|
149
|
+
@apply outline-2 outline-brown outline-offset-2;
|
|
26
150
|
}
|
|
27
151
|
}
|
|
28
152
|
|
|
@@ -30,4 +154,8 @@
|
|
|
30
154
|
[role='button'] {
|
|
31
155
|
@apply cursor-pointer;
|
|
32
156
|
}
|
|
157
|
+
|
|
158
|
+
:disabled {
|
|
159
|
+
cursor: not-allowed;
|
|
160
|
+
}
|
|
33
161
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@qasa/qds-ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.25.0",
|
|
4
4
|
"license": "UNLICENSED",
|
|
5
5
|
"sideEffects": [
|
|
6
6
|
"*.css"
|
|
@@ -26,34 +26,19 @@
|
|
|
26
26
|
"dist"
|
|
27
27
|
],
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@
|
|
30
|
-
"@changesets/cli": "^2.26.0",
|
|
31
|
-
"@emotion/cache": "^11.10.4",
|
|
29
|
+
"@emotion/cache": "^11.14.0",
|
|
32
30
|
"@emotion/is-prop-valid": "^1.3.1",
|
|
33
|
-
"@emotion/react": "^11.
|
|
34
|
-
"@emotion/styled": "^11.
|
|
35
|
-
"@storybook/addon-a11y": "^8.4.5",
|
|
36
|
-
"@storybook/addon-actions": "^8.4.5",
|
|
37
|
-
"@storybook/addon-essentials": "^8.4.5",
|
|
38
|
-
"@storybook/addon-interactions": "^8.4.5",
|
|
39
|
-
"@storybook/addon-links": "^8.4.5",
|
|
40
|
-
"@storybook/addon-styling-webpack": "^1.0.1",
|
|
41
|
-
"@storybook/addon-webpack5-compiler-swc": "^1.0.5",
|
|
42
|
-
"@storybook/react": "^8.4.5",
|
|
43
|
-
"@storybook/react-webpack5": "^8.4.5",
|
|
44
|
-
"@storybook/test": "^8.4.5",
|
|
45
|
-
"@tailwindcss/postcss": "^4.0.0",
|
|
31
|
+
"@emotion/react": "^11.14.0",
|
|
32
|
+
"@emotion/styled": "^11.14.0",
|
|
46
33
|
"@testing-library/jest-dom": "^6.6.3",
|
|
47
34
|
"@testing-library/react": "^16.2.0",
|
|
48
35
|
"@testing-library/user-event": "^14.6.0",
|
|
49
|
-
"@types/node": "^
|
|
50
|
-
"@types/react": "^
|
|
51
|
-
"@types/react-dom": "^
|
|
36
|
+
"@types/node": "^22.13.5",
|
|
37
|
+
"@types/react": "^19.0.10",
|
|
38
|
+
"@types/react-dom": "^19.0.4",
|
|
52
39
|
"@typescript-eslint/eslint-plugin": "^7.4.0",
|
|
53
40
|
"@typescript-eslint/parser": "^7.4.0",
|
|
54
41
|
"@vitejs/plugin-react": "^4.3.4",
|
|
55
|
-
"babel-jest": "^29.1.0",
|
|
56
|
-
"css-loader": "^7.1.2",
|
|
57
42
|
"eslint": "^8.57.0",
|
|
58
43
|
"eslint-config-prettier": "^9.1.0",
|
|
59
44
|
"eslint-import-resolver-typescript": "^3.6.1",
|
|
@@ -65,22 +50,15 @@
|
|
|
65
50
|
"eslint-plugin-react-hooks": "^4.6.0",
|
|
66
51
|
"globby": "^14.0.2",
|
|
67
52
|
"jsdom": "^26.0.0",
|
|
68
|
-
"lucide-react": "^0.
|
|
69
|
-
"motion": "^
|
|
70
|
-
"
|
|
71
|
-
"
|
|
72
|
-
"prettier": "^3.2.5",
|
|
73
|
-
"react": "^18.2.0",
|
|
74
|
-
"react-dom": "^18.2.0",
|
|
75
|
-
"react-hook-form": "^7.41.0",
|
|
53
|
+
"lucide-react": "^0.475.0",
|
|
54
|
+
"motion": "^12.4.7",
|
|
55
|
+
"react": "^19.0.0",
|
|
56
|
+
"react-dom": "^19.0.0",
|
|
76
57
|
"rimraf": "^3.0.2",
|
|
77
|
-
"storybook": "^8.4.5",
|
|
78
|
-
"storybook-dark-mode": "^4.0.2",
|
|
79
|
-
"style-loader": "^4.0.0",
|
|
80
58
|
"tailwindcss": "^4.0.0",
|
|
81
59
|
"tsup": "^8.0.2",
|
|
82
60
|
"tsx": "^4.19.2",
|
|
83
|
-
"typescript": "^5.
|
|
61
|
+
"typescript": "^5.7.3",
|
|
84
62
|
"vitest": "<3",
|
|
85
63
|
"vitest-axe": "1.0.0-pre.3",
|
|
86
64
|
"vitest-matchmedia-mock": "^2.0.0"
|
|
@@ -96,25 +74,23 @@
|
|
|
96
74
|
"tailwindcss": ">=4.0.0"
|
|
97
75
|
},
|
|
98
76
|
"dependencies": {
|
|
99
|
-
"@radix-ui/react-avatar": "^1.1.
|
|
100
|
-
"@radix-ui/react-checkbox": "^1.1.
|
|
101
|
-
"@radix-ui/react-dropdown-menu": "^2.1.
|
|
102
|
-
"@radix-ui/react-radio-group": "^1.2.
|
|
103
|
-
"@radix-ui/react-switch": "^1.1.
|
|
104
|
-
"@radix-ui/react-toast": "^1.2.
|
|
77
|
+
"@radix-ui/react-avatar": "^1.1.3",
|
|
78
|
+
"@radix-ui/react-checkbox": "^1.1.4",
|
|
79
|
+
"@radix-ui/react-dropdown-menu": "^2.1.6",
|
|
80
|
+
"@radix-ui/react-radio-group": "^1.2.3",
|
|
81
|
+
"@radix-ui/react-switch": "^1.1.3",
|
|
82
|
+
"@radix-ui/react-toast": "^1.2.6",
|
|
105
83
|
"class-variance-authority": "^0.7.1"
|
|
106
84
|
},
|
|
107
85
|
"scripts": {
|
|
108
|
-
"dev": "
|
|
109
|
-
"build": "pnpm build
|
|
110
|
-
"build
|
|
111
|
-
"build:storybook": "storybook build",
|
|
86
|
+
"dev": "tsup --watch",
|
|
87
|
+
"build": "pnpm build-safelist && tsup",
|
|
88
|
+
"build-safelist": "tsx scripts/build-safelist/run.ts",
|
|
112
89
|
"clean": "rimraf dist",
|
|
113
|
-
"test": "vitest",
|
|
90
|
+
"test": "vitest run",
|
|
91
|
+
"test:watch": "vitest --watch",
|
|
114
92
|
"lint": "eslint .",
|
|
115
|
-
"
|
|
116
|
-
"lint:ci": "NODE_ENV=production eslint ."
|
|
117
|
-
"lint:prettier": "prettier --check ./src",
|
|
118
|
-
"release": "changeset publish"
|
|
93
|
+
"typecheck": "tsc --noEmit",
|
|
94
|
+
"lint:ci": "NODE_ENV=production eslint ."
|
|
119
95
|
}
|
|
120
96
|
}
|