@petnow/ui 1.6.17 → 1.6.19

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 (7) hide show
  1. package/dist/index.css +2 -3
  2. package/dist/index.es.js +6677 -6713
  3. package/dist/index.es.js.map +1 -1
  4. package/dist/index.umd.js +22 -21
  5. package/dist/index.umd.js.map +1 -1
  6. package/package.json +16 -15
  7. package/tailwind.config.ts +158 -0
package/package.json CHANGED
@@ -1,11 +1,11 @@
1
1
  {
2
2
  "name": "@petnow/ui",
3
- "version": "1.6.17",
3
+ "version": "1.6.19",
4
4
  "type": "module",
5
5
  "scripts": {
6
6
  "dev": "vite",
7
7
  "build": "tsc && vite build && npm run tailwind",
8
- "tailwind": "npx tailwindcss -i ./src/index.css -o ./dist/index.css --minify",
8
+ "tailwind": "npx @tailwindcss/cli -i ./src/index.css -o ./dist/index.css --minify",
9
9
  "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
10
10
  "lint:fix": "eslint . --ext ts,tsx --fix",
11
11
  "preview": "vite preview",
@@ -18,12 +18,12 @@
18
18
  "@headlessui/react": "^2.2.0",
19
19
  "clsx": "^2.1.1",
20
20
  "date-fns": "^4.1.0",
21
- "react": "^18.2.0",
22
- "react-datepicker": "^7.5.0",
21
+ "react": "^19.0.0",
22
+ "react-datepicker": "^8.0.0",
23
23
  "react-daum-postcode": "^3.2.0",
24
- "react-dom": "^18.2.0",
24
+ "react-dom": "^19.0.0",
25
25
  "react-icons": "^5.4.0",
26
- "tailwind-merge": "^2.6.0"
26
+ "tailwind-merge": "^3.0.1"
27
27
  },
28
28
  "devDependencies": {
29
29
  "@chromatic-com/storybook": "^3.2.2",
@@ -35,12 +35,13 @@
35
35
  "@storybook/react": "^8.4.6",
36
36
  "@storybook/react-vite": "^8.4.6",
37
37
  "@storybook/test": "^8.4.6",
38
+ "@tailwindcss/postcss": "^4.0.0",
38
39
  "@testing-library/jest-dom": "^6.6.3",
39
40
  "@testing-library/react": "^16.1.0",
40
- "@testing-library/user-event": "^14.5.2",
41
+ "@testing-library/user-event": "^14.6.1",
41
42
  "@types/jest": "^29.5.14",
42
- "@types/node": "^22.10.7",
43
- "@types/react": "^18.3.12",
43
+ "@types/node": "^22.13.0",
44
+ "@types/react": "^19.0.8",
44
45
  "@types/react-dom": "^18.3.1",
45
46
  "@typescript-eslint/eslint-plugin": "^7.18.0",
46
47
  "@typescript-eslint/parser": "^7.18.0",
@@ -55,15 +56,15 @@
55
56
  "jest": "^29.7.0",
56
57
  "jest-environment-jsdom": "^29.7.0",
57
58
  "jest-transformer-svg": "^2.0.2",
58
- "postcss": "^8.4.49",
59
+ "postcss": "^8.5.1",
59
60
  "prettier": "^3.4.2",
60
- "prettier-plugin-tailwindcss": "^0.6.9",
61
- "storybook": "^8.4.6",
62
- "tailwindcss": "^3.4.17",
61
+ "prettier-plugin-tailwindcss": "^0.6.11",
62
+ "storybook": "^8.5.3",
63
+ "tailwindcss": "^4.0.3",
63
64
  "ts-jest": "^29.2.5",
64
65
  "ts-node": "^10.9.2",
65
66
  "typescript": "^5.7.2",
66
- "vite": "^6.0.7",
67
+ "vite": "^6.0.11",
67
68
  "vite-plugin-dts": "^4.4.0"
68
69
  },
69
70
  "main": "dist/index.es.js",
@@ -80,7 +81,7 @@
80
81
  },
81
82
  "files": [
82
83
  "dist",
83
- "tailwind.config.js"
84
+ "tailwind.config.ts"
84
85
  ],
85
86
  "publishConfig": {
86
87
  "access": "public"
package/tailwind.config.ts ADDED
@@ -0,0 +1,158 @@
1
+ /** @type {import('tailwindcss').Config} */
2
+
3
+ export default {
4
+ content: ["./src/**/*.{js,ts,jsx,tsx,mdx}"],
5
+ theme: {
6
+ extend: {
7
+ backgroundImage: {
8
+ "gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
9
+ "gradient-conic": "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
10
+ },
11
+ keyframes: {
12
+ shimmer: {
13
+ "100%": {
14
+ transform: "translateX(350%) rotate(25deg)",
15
+ },
16
+ },
17
+ },
18
+ colors: {
19
+ "petnow-orange": {
20
+ primary: "#FF592C",
21
+ secondary: "#FFEEEA",
22
+ tertiary: "#FFF7F4",
23
+ 0: "#0A0B0C",
24
+ 10: "#3B1B12",
25
+ 20: "#6C2A19",
26
+ 30: "#9D3A1F",
27
+ 40: "#CE4926",
28
+ 50: "#FF592C",
29
+ 60: "#FF7A56",
30
+ 70: "#FF9B80",
31
+ 80: "#FFBDAB",
32
+ 90: "#FFDED5",
33
+ 95: "#FFEEEA",
34
+ 99: "#FFF7F4",
35
+ 100: "#FFFFFF",
36
+ },
37
+ "petnow-blue": {
38
+ primary: "#4389E5",
39
+ secondary: "#ECF3FC",
40
+ tertiary: "#F6F9FE",
41
+ 0: "#0A0B0C",
42
+ 10: "#152437",
43
+ 20: "#213D63",
44
+ 30: "#2C578E",
45
+ 40: "#3870BA",
46
+ 50: "#4389E5",
47
+ 60: "#69A1EA",
48
+ 70: "#8EB8EF",
49
+ 80: "#B4D0F5",
50
+ 90: "#D9E7FA",
51
+ 95: "#ECF3FC",
52
+ 99: "#F6F9FE",
53
+ 100: "#FFFFFF",
54
+ },
55
+ "petnow-red": {
56
+ primary: "#FF4055",
57
+ 50: "#FF4055",
58
+ 95: "#FFECF1",
59
+ 99: "#FFF5F8",
60
+ },
61
+ "petnow-green": {
62
+ primary: "#42D48E",
63
+ 50: "#42D48E",
64
+ 95: "#ECFBF4",
65
+ 99: "#F6FDF9",
66
+ },
67
+ "petnow-purple": {
68
+ primary: "#AF50DC",
69
+ 50: "#AF50DC",
70
+ 95: "#F7EDFB",
71
+ 99: "#FBF6FD",
72
+ },
73
+ "petnow-yellow": {
74
+ primary: "#FFD22D",
75
+ 50: "#FFD22D",
76
+ 95: "#FFF8E0",
77
+ 99: "#FFFBEB",
78
+ },
79
+ "petnow-grey": {
80
+ primary: "#C5C8CD",
81
+ secondary: "#8B919A",
82
+ tertiary: "#585E67",
83
+ 0: "#0A0B0C",
84
+ 10: "#16181A",
85
+ 20: "#2C2F34",
86
+ 30: "#42474D",
87
+ 40: "#585E67",
88
+ 50: "#6E7681",
89
+ 60: "#8B919A",
90
+ 70: "#A8ADB3",
91
+ 80: "#C5C8CD",
92
+ 90: "#E2E4E6",
93
+ 95: "#F0F1F2",
94
+ 99: "#F8F8F9",
95
+ 100: "#FFFFFF",
96
+ },
97
+ background: {
98
+ primary: "#FFFFFF",
99
+ secondary: "#F8F8F9",
100
+ tertiary: "#F0F1F2",
101
+ },
102
+ black: "#2C2F34",
103
+ error: "#FF323E",
104
+ },
105
+ },
106
+ },
107
+ plugins: [
108
+ ({ addUtilities }: { addUtilities: any }) => {
109
+ addUtilities({
110
+ ".text-display-large": {
111
+ "@apply font-bold text-[34px] leading-[46px] tracking-normal": "",
112
+ },
113
+ ".text-display-medium": {
114
+ "@apply font-bold text-[28px] leading-[38px] tracking-normal": "",
115
+ },
116
+ ".text-title-large": {
117
+ "@apply font-bold text-[24px] leading-[34px] tracking-normal": "",
118
+ },
119
+ ".text-title-medium": {
120
+ "@apply font-bold text-[20px] leading-[30px] tracking-normal": "",
121
+ },
122
+ ".text-title-small": {
123
+ "@apply font-bold text-[18px] leading-[26px] tracking-normal": "",
124
+ },
125
+ ".text-label-large": {
126
+ "@apply font-bold text-[16px] leading-[24px] tracking-normal": "",
127
+ },
128
+ ".text-label-medium": {
129
+ "@apply font-bold text-[14px] leading-[22px] tracking-normal": "",
130
+ },
131
+ ".text-label-small": {
132
+ "@apply font-bold text-[12px] leading-[18px] tracking-normal": "",
133
+ },
134
+ ".text-body-large": {
135
+ "@apply font-medium text-[16px] leading-[24px] tracking-normal": "",
136
+ },
137
+ ".text-body-medium": {
138
+ "@apply font-medium text-[14px] leading-[22px] tracking-normal": "",
139
+ },
140
+ ".text-body-small": {
141
+ "@apply font-medium text-[12px] leading-[18px] tracking-normal": "",
142
+ },
143
+ ".text-caption-large": {
144
+ "@apply font-normal text-[16px] leading-[24px] tracking-normal": "",
145
+ },
146
+ ".text-caption-medium": {
147
+ "@apply font-normal text-[14px] leading-[22px] tracking-normal": "",
148
+ },
149
+ ".text-caption-small": {
150
+ "@apply font-normal text-[12px] leading-[18px] tracking-normal": "",
151
+ },
152
+ ".text-badge": {
153
+ "@apply font-medium text-[11px] leading-[16px] tracking-normal": "",
154
+ },
155
+ });
156
+ },
157
+ ],
158
+ };