shared-design-system 1.84.0 → 1.85.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 (5) hide show
  1. package/dist/tailwind.preset.d.ts +107 -2
  2. package/dist/tailwind.preset.js +11 -0
  3. package/dist/tailwind.preset.js.map +1 -1
  4. package/package.json +10 -3
  5. package/src/theme.css +108 -0
package/dist/tailwind.preset.d.ts CHANGED
@@ -1,3 +1,108 @@
1
- import type { Config } from "tailwindcss";
2
- declare const config: Config;
1
+ /**
2
+ * shared-design-system — Tailwind Preset (Legacy v3 / @config compatible)
3
+ *
4
+ * ⚠️ Tailwind v4 users: Use the CSS theme file instead:
5
+ * @import "tailwindcss";
6
+ * @import "shared-design-system/theme.css";
7
+ *
8
+ * Tailwind v3 / @config users: continue using this preset via tailwind.config.js:
9
+ * import preset from 'shared-design-system/tailwind.preset';
10
+ * export default { presets: [preset], ... };
11
+ */
12
+ declare const config: {
13
+ content: never[];
14
+ theme: {
15
+ extend: {
16
+ colors: {
17
+ primary: string;
18
+ secondary: string;
19
+ brandRed: string;
20
+ brandYellow: string;
21
+ brandGrey: string;
22
+ yellow5: string;
23
+ yellow4: string;
24
+ yellow3: string;
25
+ yellow2: string;
26
+ yellow1: string;
27
+ yellow0: string;
28
+ neutral5: string;
29
+ neutral4: string;
30
+ neutral3: string;
31
+ neutral2: string;
32
+ neutral1: string;
33
+ neutral0: string;
34
+ black: string;
35
+ white: string;
36
+ purple5: string;
37
+ purple4: string;
38
+ purple3: string;
39
+ purple2: string;
40
+ purple1: string;
41
+ orange5: string;
42
+ orange4: string;
43
+ orange3: string;
44
+ orange2: string;
45
+ orange1: string;
46
+ orange0: string;
47
+ green5: string;
48
+ green4: string;
49
+ green3: string;
50
+ green2: string;
51
+ green1: string;
52
+ green0: string;
53
+ blue5: string;
54
+ blue4: string;
55
+ blue3: string;
56
+ blue2: string;
57
+ blue1: string;
58
+ red5: string;
59
+ red4: string;
60
+ red3: string;
61
+ red2: string;
62
+ red1: string;
63
+ paper: string;
64
+ primaryMain: string;
65
+ primaryDark: string;
66
+ secondaryMain: string;
67
+ secondaryDark: string;
68
+ successMain: string;
69
+ successDark: string;
70
+ errorMain: string;
71
+ errorDark: string;
72
+ orangeMain: string;
73
+ orangeDark: string;
74
+ warningMain: string;
75
+ warningDark: string;
76
+ infoMain: string;
77
+ infoDark: string;
78
+ grey50: string;
79
+ grey100: string;
80
+ grey200: string;
81
+ grey300: string;
82
+ grey500: string;
83
+ grey600: string;
84
+ grey700: string;
85
+ grey900: string;
86
+ grey400: string;
87
+ grey800: string;
88
+ brand: {
89
+ 50: string;
90
+ 500: string;
91
+ };
92
+ };
93
+ fontFamily: {
94
+ sans: string[];
95
+ };
96
+ fontSize: {
97
+ normal: string;
98
+ title: string;
99
+ "header-title": string;
100
+ };
101
+ borderRadius: {
102
+ theme: string;
103
+ };
104
+ };
105
+ };
106
+ plugins: never[];
107
+ };
3
108
  export default config;
package/dist/tailwind.preset.js CHANGED
@@ -1,3 +1,14 @@
1
+ /**
2
+ * shared-design-system — Tailwind Preset (Legacy v3 / @config compatible)
3
+ *
4
+ * ⚠️ Tailwind v4 users: Use the CSS theme file instead:
5
+ * @import "tailwindcss";
6
+ * @import "shared-design-system/theme.css";
7
+ *
8
+ * Tailwind v3 / @config users: continue using this preset via tailwind.config.js:
9
+ * import preset from 'shared-design-system/tailwind.preset';
10
+ * export default { presets: [preset], ... };
11
+ */
1
12
  const config = {
2
13
  content: [],
3
14
  theme: {
package/dist/tailwind.preset.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tailwind.preset.js","sourceRoot":"","sources":["../tailwind.preset.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,GAAW;IACrB,OAAO,EAAE,EAAE;IACX,KAAK,EAAE;QACL,MAAM,EAAE;YACN,MAAM,EAAE;gBACN,sDAAsD;gBACtD,OAAO,EAAE,qCAAqC;gBAC9C,SAAS,EAAE,uCAAuC;gBAClD,QAAQ,EAAE,SAAS;gBACnB,WAAW,EAAE,SAAS;gBACtB,SAAS,EAAE,SAAS;gBACpB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,QAAQ,EAAE,SAAS;gBACnB,QAAQ,EAAE,SAAS;gBACnB,QAAQ,EAAE,SAAS;gBACnB,QAAQ,EAAE,SAAS;gBACnB,QAAQ,EAAE,SAAS;gBACnB,QAAQ,EAAE,SAAS;gBACnB,KAAK,EAAE,SAAS;gBAChB,KAAK,EAAE,SAAS;gBAChB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,MAAM,EAAE,SAAS;gBACjB,MAAM,EAAE,SAAS;gBACjB,MAAM,EAAE,SAAS;gBACjB,MAAM,EAAE,SAAS;gBACjB,MAAM,EAAE,SAAS;gBACjB,MAAM,EAAE,SAAS;gBACjB,KAAK,EAAE,SAAS;gBAChB,KAAK,EAAE,SAAS;gBAChB,KAAK,EAAE,SAAS;gBAChB,KAAK,EAAE,SAAS;gBAChB,KAAK,EAAE,SAAS;gBAChB,IAAI,EAAE,SAAS;gBACf,IAAI,EAAE,SAAS;gBACf,IAAI,EAAE,SAAS;gBACf,IAAI,EAAE,SAAS;gBACf,IAAI,EAAE,SAAS;gBACf,KAAK,EAAE,SAAS;gBAChB,WAAW,EAAE,SAAS;gBACtB,WAAW,EAAE,SAAS;gBACtB,aAAa,EAAE,SAAS;gBACxB,aAAa,EAAE,SAAS;gBACxB,WAAW,EAAE,SAAS;gBACtB,WAAW,EAAE,SAAS;gBACtB,SAAS,EAAE,SAAS;gBACpB,SAAS,EAAE,SAAS;gBACpB,UAAU,EAAE,SAAS;gBACrB,UAAU,EAAE,SAAS;gBACrB,WAAW,EAAE,SAAS;gBACtB,WAAW,EAAE,SAAS;gBACtB,QAAQ,EAAE,SAAS;gBACnB,QAAQ,EAAE,SAAS;gBACnB,MAAM,EAAE,SAAS;gBACjB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,OAAO,EAAE,SAAS;gBAClB,KAAK,EAAE;oBACL,EAAE,EAAE,SAAS;oBACb,GAAG,EAAE,SAAS;iBACf;aACF;YACD,UAAU,EAAE;gBACV,IAAI,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,YAAY,CAAC;aAC3C;YACD,QAAQ,EAAE;gBACR,MAAM,EAAE,UAAU;gBAClB,KAAK,EAAE,MAAM;gBACb,cAAc,EAAE,SAAS;aAC1B;YACD,YAAY,EAAE;gBACZ,KAAK,EAAE,oCAAoC;aAC5C;SACF;KACF;IACD,OAAO,EAAE,EAAE;CACZ,CAAC;AAEF,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"tailwind.preset.js","sourceRoot":"","sources":["../tailwind.preset.ts"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "shared-design-system",
3
- "version": "1.84.0",
3
+ "version": "1.85.0",
4
4
  "description": "Shared Tailwind Design System & UI Tokens for all Micro Frontends",
5
5
  "main": "dist/src/index.js",
6
6
  "module": "dist/src/index.js",
@@ -25,10 +25,12 @@
25
25
  "types": "./dist/tailwind.preset.d.ts",
26
26
  "import": "./dist/tailwind.preset.js",
27
27
  "require": "./dist/tailwind.preset.js"
28
- }
28
+ },
29
+ "./theme.css": "./src/theme.css"
29
30
  },
30
31
  "files": [
31
32
  "dist",
33
+ "src/theme.css",
32
34
  "README.md"
33
35
  ],
34
36
  "scripts": {
@@ -42,7 +44,12 @@
42
44
  "peerDependencies": {
43
45
  "react": "^19.0.0",
44
46
  "react-dom": "^19.0.0",
45
- "tailwindcss": "^3.0.0"
47
+ "tailwindcss": "^4.0.0"
48
+ },
49
+ "peerDependenciesMeta": {
50
+ "tailwindcss": {
51
+ "optional": true
52
+ }
46
53
  },
47
54
  "devDependencies": {
48
55
  "typescript": "^5.6.3",
package/src/theme.css ADDED
@@ -0,0 +1,108 @@
1
+ /**
2
+ * shared-design-system — Tailwind v4 CSS Theme
3
+ *
4
+ * Usage in Tailwind v4 consumers:
5
+ * @import "tailwindcss";
6
+ * @import "shared-design-system/theme.css";
7
+ */
8
+
9
+ @theme {
10
+ /* ─── Brand Colors ──────────────────────────────────────── */
11
+ --color-brand-50: #FFF9E5;
12
+ --color-brand-500: #FFC20E;
13
+ --color-brandRed: #BE1128;
14
+ --color-brandYellow: #FFC20E;
15
+ --color-brandGrey: #464646;
16
+
17
+ /* ─── Primary / Secondary ───────────────────────────────── */
18
+ --color-primary: var(--theme-color-primary, #ffc20e);
19
+ --color-secondary: var(--theme-color-secondary, #eaeef2);
20
+
21
+ /* ─── Yellow Scale ──────────────────────────────────────── */
22
+ --color-yellow-5: #F7A30A;
23
+ --color-yellow-4: #F7B512;
24
+ --color-yellow-3: #FCC954;
25
+ --color-yellow-2: #FFDF80;
26
+ --color-yellow-1: #FFECB3;
27
+ --color-yellow-0: #FFF9E5;
28
+
29
+ /* ─── Neutral Scale ─────────────────────────────────────── */
30
+ --color-neutral-5: #212B36;
31
+ --color-neutral-4: #454F5B;
32
+ --color-neutral-3: #B6BEC8;
33
+ --color-neutral-2: #D3D8DE;
34
+ --color-neutral-1: #EAEEF2;
35
+ --color-neutral-0: #F8F9FA;
36
+
37
+ /* ─── Purple Scale ──────────────────────────────────────── */
38
+ --color-purple-5: #6B1C3A;
39
+ --color-purple-4: #A60066;
40
+ --color-purple-3: #D10373;
41
+ --color-purple-2: #FF99D8;
42
+ --color-purple-1: #FFE5F5;
43
+
44
+ /* ─── Orange Scale ──────────────────────────────────────── */
45
+ --color-orange-5: #D4470F;
46
+ --color-orange-4: #F56600;
47
+ --color-orange-3: #FF993B;
48
+ --color-orange-2: #FFB580;
49
+ --color-orange-1: #FFD2B3;
50
+ --color-orange-0: #FFF0E5;
51
+
52
+ /* ─── Green Scale ───────────────────────────────────────── */
53
+ --color-green-5: #337321;
54
+ --color-green-4: #4FA800;
55
+ --color-green-3: #7DBA00;
56
+ --color-green-2: #ABD653;
57
+ --color-green-1: #D5E5B4;
58
+ --color-green-0: #F2FAE2;
59
+
60
+ /* ─── Blue Scale ────────────────────────────────────────── */
61
+ --color-blue-5: #006FD6;
62
+ --color-blue-4: #1890FF;
63
+ --color-blue-3: #80C2FF;
64
+ --color-blue-2: #C2E1FF;
65
+ --color-blue-1: #E5F3FF;
66
+
67
+ /* ─── Red Scale ─────────────────────────────────────────── */
68
+ --color-red-5: #AD2624;
69
+ --color-red-4: #D12421;
70
+ --color-red-3: #EB2629;
71
+ --color-red-2: #FCA5A6;
72
+ --color-red-1: #FDE8E8;
73
+
74
+ /* ─── Semantic Colors ───────────────────────────────────── */
75
+ --color-primaryMain: #ffc20e;
76
+ --color-primaryDark: #f7a30a;
77
+ --color-secondaryMain: #eaeef2;
78
+ --color-secondaryDark: #d3d8de;
79
+ --color-successMain: #4fa800;
80
+ --color-successDark: #337321;
81
+ --color-errorMain: #d12421;
82
+ --color-errorDark: #ad2624;
83
+ --color-warningMain: #f56600;
84
+ --color-warningDark: #d4470f;
85
+ --color-infoMain: #1890ff;
86
+ --color-infoDark: #006fd6;
87
+
88
+ /* ─── Grey Scale ────────────────────────────────────────── */
89
+ --color-grey-50: #fafafa;
90
+ --color-grey-100: #f5f5f5;
91
+ --color-grey-200: #f8f9fa;
92
+ --color-grey-300: #eaeef2;
93
+ --color-grey-400: #bdbdbd;
94
+ --color-grey-500: #d3d8de;
95
+ --color-grey-600: #b6bec8;
96
+ --color-grey-700: #454f5b;
97
+ --color-grey-800: #7B7B7B;
98
+ --color-grey-900: #212b36;
99
+
100
+ /* ─── Typography ────────────────────────────────────────── */
101
+ --font-family-sans: Inter, system-ui, sans-serif;
102
+ --font-size-normal: 0.875rem;
103
+ --font-size-title: 1rem;
104
+ --font-size-header-title: 1.75rem;
105
+
106
+ /* ─── Border Radius ─────────────────────────────────────── */
107
+ --radius-theme: var(--theme-border-radius, 0.5rem);
108
+ }