@react-native-rethemed/material-design-tokens 0.1.0 → 0.1.2

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 CHANGED
@@ -1,5 +1,7 @@
1
1
  # @react-native-rethemed/material-design-tokens
2
2
 
3
+ [![npm](https://img.shields.io/npm/v/@react-native-rethemed/material-design-tokens.svg)](https://www.npmjs.com/package/@react-native-rethemed/material-design-tokens)
4
+
3
5
  Material Design 3 type scale and tokens for React Native, ready for [react-native-rethemed](https://github.com/manakuro/react-native-rethemed).
4
6
 
5
7
  Material Design 3's baseline type scale — 5 roles (display / headline / title / body / label) × 3 sizes (lg / md / sm) — and spacing.
package/dist/index.cjs ADDED
@@ -0,0 +1,154 @@
1
+ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
2
+ let _react_native_rethemed_core_config = require("@react-native-rethemed/core/config");
3
+ //#region src/index.ts
4
+ /**
5
+ * Material Design 3's baseline type scale — 5 roles (display/headline/title/
6
+ * body/label) × 3 sizes (lg/md/sm).
7
+ * https://m3.material.io/styles/typography/type-scale-tokens
8
+ *
9
+ * MD3 Expressive's additional 15 "Emphasized" styles are intentionally left
10
+ * out — their values are less stable/well-documented across sources than
11
+ * this baseline scale.
12
+ */
13
+ const typescale = {
14
+ display: {
15
+ lg: {
16
+ fontSize: 57,
17
+ lineHeight: 64,
18
+ letterSpacing: -.25,
19
+ fontWeight: "400"
20
+ },
21
+ md: {
22
+ fontSize: 45,
23
+ lineHeight: 52,
24
+ letterSpacing: 0,
25
+ fontWeight: "400"
26
+ },
27
+ sm: {
28
+ fontSize: 36,
29
+ lineHeight: 44,
30
+ letterSpacing: 0,
31
+ fontWeight: "400"
32
+ }
33
+ },
34
+ headline: {
35
+ lg: {
36
+ fontSize: 32,
37
+ lineHeight: 40,
38
+ letterSpacing: 0,
39
+ fontWeight: "400"
40
+ },
41
+ md: {
42
+ fontSize: 28,
43
+ lineHeight: 36,
44
+ letterSpacing: 0,
45
+ fontWeight: "400"
46
+ },
47
+ sm: {
48
+ fontSize: 24,
49
+ lineHeight: 32,
50
+ letterSpacing: 0,
51
+ fontWeight: "400"
52
+ }
53
+ },
54
+ title: {
55
+ lg: {
56
+ fontSize: 22,
57
+ lineHeight: 28,
58
+ letterSpacing: 0,
59
+ fontWeight: "400"
60
+ },
61
+ md: {
62
+ fontSize: 16,
63
+ lineHeight: 24,
64
+ letterSpacing: .15,
65
+ fontWeight: "500"
66
+ },
67
+ sm: {
68
+ fontSize: 14,
69
+ lineHeight: 20,
70
+ letterSpacing: .1,
71
+ fontWeight: "500"
72
+ }
73
+ },
74
+ body: {
75
+ lg: {
76
+ fontSize: 16,
77
+ lineHeight: 24,
78
+ letterSpacing: .5,
79
+ fontWeight: "400"
80
+ },
81
+ md: {
82
+ fontSize: 14,
83
+ lineHeight: 20,
84
+ letterSpacing: .25,
85
+ fontWeight: "400"
86
+ },
87
+ sm: {
88
+ fontSize: 12,
89
+ lineHeight: 16,
90
+ letterSpacing: .4,
91
+ fontWeight: "400"
92
+ }
93
+ },
94
+ label: {
95
+ lg: {
96
+ fontSize: 14,
97
+ lineHeight: 20,
98
+ letterSpacing: .1,
99
+ fontWeight: "500"
100
+ },
101
+ md: {
102
+ fontSize: 12,
103
+ lineHeight: 16,
104
+ letterSpacing: .5,
105
+ fontWeight: "500"
106
+ },
107
+ sm: {
108
+ fontSize: 11,
109
+ lineHeight: 16,
110
+ letterSpacing: .5,
111
+ fontWeight: "500"
112
+ }
113
+ }
114
+ };
115
+ /**
116
+ * Material Design 3's system spacing tokens (`md.sys.measurement.space*`),
117
+ * keyed by their dp value: `space100` (8dp) → `8`, so
118
+ * `themed.view({ padding: 8 })` is 8. React Native style numbers are already
119
+ * density-independent (1dp = 1), so values are used as-is.
120
+ *
121
+ * | M3 token | key / value (dp) |
122
+ * |:--|--:|
123
+ * | `space0` | 0 |
124
+ * | `space25` / `space50` / `space75` | 2 / 4 / 6 |
125
+ * | `space100` / `space125` | 8 / 10 |
126
+ * | `space200` … `space900` | 16 … 72 (8dp steps) |
127
+ *
128
+ * https://m3.material.io/styles/spacing/tokens (checked 2026-10-02; M3 notes
129
+ * these tokens are so far only used by Jetpack Compose).
130
+ */
131
+ const spacing = {
132
+ 0: 0,
133
+ 2: 2,
134
+ 4: 4,
135
+ 6: 6,
136
+ 8: 8,
137
+ 10: 10,
138
+ 16: 16,
139
+ 24: 24,
140
+ 32: 32,
141
+ 40: 40,
142
+ 48: 48,
143
+ 56: 56,
144
+ 64: 64,
145
+ 72: 72
146
+ };
147
+ const materialDesignTheme = (0, _react_native_rethemed_core_config.defineTheme)({
148
+ tokens: { spacing },
149
+ semanticTokens: { text: typescale }
150
+ });
151
+ //#endregion
152
+ exports.materialDesignTheme = materialDesignTheme;
153
+ exports.spacing = spacing;
154
+ exports.typescale = typescale;
@@ -0,0 +1,146 @@
1
+ //#region src/index.d.ts
2
+ /**
3
+ * Material Design 3's baseline type scale — 5 roles (display/headline/title/
4
+ * body/label) × 3 sizes (lg/md/sm).
5
+ * https://m3.material.io/styles/typography/type-scale-tokens
6
+ *
7
+ * MD3 Expressive's additional 15 "Emphasized" styles are intentionally left
8
+ * out — their values are less stable/well-documented across sources than
9
+ * this baseline scale.
10
+ */
11
+ export declare const typescale: {
12
+ readonly display: {
13
+ readonly lg: {
14
+ readonly fontSize: 57;
15
+ readonly lineHeight: 64;
16
+ readonly letterSpacing: -0.25;
17
+ readonly fontWeight: "400";
18
+ };
19
+ readonly md: {
20
+ readonly fontSize: 45;
21
+ readonly lineHeight: 52;
22
+ readonly letterSpacing: 0;
23
+ readonly fontWeight: "400";
24
+ };
25
+ readonly sm: {
26
+ readonly fontSize: 36;
27
+ readonly lineHeight: 44;
28
+ readonly letterSpacing: 0;
29
+ readonly fontWeight: "400";
30
+ };
31
+ };
32
+ readonly headline: {
33
+ readonly lg: {
34
+ readonly fontSize: 32;
35
+ readonly lineHeight: 40;
36
+ readonly letterSpacing: 0;
37
+ readonly fontWeight: "400";
38
+ };
39
+ readonly md: {
40
+ readonly fontSize: 28;
41
+ readonly lineHeight: 36;
42
+ readonly letterSpacing: 0;
43
+ readonly fontWeight: "400";
44
+ };
45
+ readonly sm: {
46
+ readonly fontSize: 24;
47
+ readonly lineHeight: 32;
48
+ readonly letterSpacing: 0;
49
+ readonly fontWeight: "400";
50
+ };
51
+ };
52
+ readonly title: {
53
+ readonly lg: {
54
+ readonly fontSize: 22;
55
+ readonly lineHeight: 28;
56
+ readonly letterSpacing: 0;
57
+ readonly fontWeight: "400";
58
+ };
59
+ readonly md: {
60
+ readonly fontSize: 16;
61
+ readonly lineHeight: 24;
62
+ readonly letterSpacing: 0.15;
63
+ readonly fontWeight: "500";
64
+ };
65
+ readonly sm: {
66
+ readonly fontSize: 14;
67
+ readonly lineHeight: 20;
68
+ readonly letterSpacing: 0.1;
69
+ readonly fontWeight: "500";
70
+ };
71
+ };
72
+ readonly body: {
73
+ readonly lg: {
74
+ readonly fontSize: 16;
75
+ readonly lineHeight: 24;
76
+ readonly letterSpacing: 0.5;
77
+ readonly fontWeight: "400";
78
+ };
79
+ readonly md: {
80
+ readonly fontSize: 14;
81
+ readonly lineHeight: 20;
82
+ readonly letterSpacing: 0.25;
83
+ readonly fontWeight: "400";
84
+ };
85
+ readonly sm: {
86
+ readonly fontSize: 12;
87
+ readonly lineHeight: 16;
88
+ readonly letterSpacing: 0.4;
89
+ readonly fontWeight: "400";
90
+ };
91
+ };
92
+ readonly label: {
93
+ readonly lg: {
94
+ readonly fontSize: 14;
95
+ readonly lineHeight: 20;
96
+ readonly letterSpacing: 0.1;
97
+ readonly fontWeight: "500";
98
+ };
99
+ readonly md: {
100
+ readonly fontSize: 12;
101
+ readonly lineHeight: 16;
102
+ readonly letterSpacing: 0.5;
103
+ readonly fontWeight: "500";
104
+ };
105
+ readonly sm: {
106
+ readonly fontSize: 11;
107
+ readonly lineHeight: 16;
108
+ readonly letterSpacing: 0.5;
109
+ readonly fontWeight: "500";
110
+ };
111
+ };
112
+ };
113
+ /**
114
+ * Material Design 3's system spacing tokens (`md.sys.measurement.space*`),
115
+ * keyed by their dp value: `space100` (8dp) → `8`, so
116
+ * `themed.view({ padding: 8 })` is 8. React Native style numbers are already
117
+ * density-independent (1dp = 1), so values are used as-is.
118
+ *
119
+ * | M3 token | key / value (dp) |
120
+ * |:--|--:|
121
+ * | `space0` | 0 |
122
+ * | `space25` / `space50` / `space75` | 2 / 4 / 6 |
123
+ * | `space100` / `space125` | 8 / 10 |
124
+ * | `space200` … `space900` | 16 … 72 (8dp steps) |
125
+ *
126
+ * https://m3.material.io/styles/spacing/tokens (checked 2026-10-02; M3 notes
127
+ * these tokens are so far only used by Jetpack Compose).
128
+ */
129
+ export declare const spacing: {
130
+ readonly 0: 0;
131
+ readonly 2: 2;
132
+ readonly 4: 4;
133
+ readonly 6: 6;
134
+ readonly 8: 8;
135
+ readonly 10: 10;
136
+ readonly 16: 16;
137
+ readonly 24: 24;
138
+ readonly 32: 32;
139
+ readonly 40: 40;
140
+ readonly 48: 48;
141
+ readonly 56: 56;
142
+ readonly 64: 64;
143
+ readonly 72: 72;
144
+ };
145
+ export declare const materialDesignTheme: import("@react-native-rethemed/core/config").ThemeConfig;
146
+ //#endregion
@@ -0,0 +1,146 @@
1
+ //#region src/index.d.ts
2
+ /**
3
+ * Material Design 3's baseline type scale — 5 roles (display/headline/title/
4
+ * body/label) × 3 sizes (lg/md/sm).
5
+ * https://m3.material.io/styles/typography/type-scale-tokens
6
+ *
7
+ * MD3 Expressive's additional 15 "Emphasized" styles are intentionally left
8
+ * out — their values are less stable/well-documented across sources than
9
+ * this baseline scale.
10
+ */
11
+ export declare const typescale: {
12
+ readonly display: {
13
+ readonly lg: {
14
+ readonly fontSize: 57;
15
+ readonly lineHeight: 64;
16
+ readonly letterSpacing: -0.25;
17
+ readonly fontWeight: "400";
18
+ };
19
+ readonly md: {
20
+ readonly fontSize: 45;
21
+ readonly lineHeight: 52;
22
+ readonly letterSpacing: 0;
23
+ readonly fontWeight: "400";
24
+ };
25
+ readonly sm: {
26
+ readonly fontSize: 36;
27
+ readonly lineHeight: 44;
28
+ readonly letterSpacing: 0;
29
+ readonly fontWeight: "400";
30
+ };
31
+ };
32
+ readonly headline: {
33
+ readonly lg: {
34
+ readonly fontSize: 32;
35
+ readonly lineHeight: 40;
36
+ readonly letterSpacing: 0;
37
+ readonly fontWeight: "400";
38
+ };
39
+ readonly md: {
40
+ readonly fontSize: 28;
41
+ readonly lineHeight: 36;
42
+ readonly letterSpacing: 0;
43
+ readonly fontWeight: "400";
44
+ };
45
+ readonly sm: {
46
+ readonly fontSize: 24;
47
+ readonly lineHeight: 32;
48
+ readonly letterSpacing: 0;
49
+ readonly fontWeight: "400";
50
+ };
51
+ };
52
+ readonly title: {
53
+ readonly lg: {
54
+ readonly fontSize: 22;
55
+ readonly lineHeight: 28;
56
+ readonly letterSpacing: 0;
57
+ readonly fontWeight: "400";
58
+ };
59
+ readonly md: {
60
+ readonly fontSize: 16;
61
+ readonly lineHeight: 24;
62
+ readonly letterSpacing: 0.15;
63
+ readonly fontWeight: "500";
64
+ };
65
+ readonly sm: {
66
+ readonly fontSize: 14;
67
+ readonly lineHeight: 20;
68
+ readonly letterSpacing: 0.1;
69
+ readonly fontWeight: "500";
70
+ };
71
+ };
72
+ readonly body: {
73
+ readonly lg: {
74
+ readonly fontSize: 16;
75
+ readonly lineHeight: 24;
76
+ readonly letterSpacing: 0.5;
77
+ readonly fontWeight: "400";
78
+ };
79
+ readonly md: {
80
+ readonly fontSize: 14;
81
+ readonly lineHeight: 20;
82
+ readonly letterSpacing: 0.25;
83
+ readonly fontWeight: "400";
84
+ };
85
+ readonly sm: {
86
+ readonly fontSize: 12;
87
+ readonly lineHeight: 16;
88
+ readonly letterSpacing: 0.4;
89
+ readonly fontWeight: "400";
90
+ };
91
+ };
92
+ readonly label: {
93
+ readonly lg: {
94
+ readonly fontSize: 14;
95
+ readonly lineHeight: 20;
96
+ readonly letterSpacing: 0.1;
97
+ readonly fontWeight: "500";
98
+ };
99
+ readonly md: {
100
+ readonly fontSize: 12;
101
+ readonly lineHeight: 16;
102
+ readonly letterSpacing: 0.5;
103
+ readonly fontWeight: "500";
104
+ };
105
+ readonly sm: {
106
+ readonly fontSize: 11;
107
+ readonly lineHeight: 16;
108
+ readonly letterSpacing: 0.5;
109
+ readonly fontWeight: "500";
110
+ };
111
+ };
112
+ };
113
+ /**
114
+ * Material Design 3's system spacing tokens (`md.sys.measurement.space*`),
115
+ * keyed by their dp value: `space100` (8dp) → `8`, so
116
+ * `themed.view({ padding: 8 })` is 8. React Native style numbers are already
117
+ * density-independent (1dp = 1), so values are used as-is.
118
+ *
119
+ * | M3 token | key / value (dp) |
120
+ * |:--|--:|
121
+ * | `space0` | 0 |
122
+ * | `space25` / `space50` / `space75` | 2 / 4 / 6 |
123
+ * | `space100` / `space125` | 8 / 10 |
124
+ * | `space200` … `space900` | 16 … 72 (8dp steps) |
125
+ *
126
+ * https://m3.material.io/styles/spacing/tokens (checked 2026-10-02; M3 notes
127
+ * these tokens are so far only used by Jetpack Compose).
128
+ */
129
+ export declare const spacing: {
130
+ readonly 0: 0;
131
+ readonly 2: 2;
132
+ readonly 4: 4;
133
+ readonly 6: 6;
134
+ readonly 8: 8;
135
+ readonly 10: 10;
136
+ readonly 16: 16;
137
+ readonly 24: 24;
138
+ readonly 32: 32;
139
+ readonly 40: 40;
140
+ readonly 48: 48;
141
+ readonly 56: 56;
142
+ readonly 64: 64;
143
+ readonly 72: 72;
144
+ };
145
+ export declare const materialDesignTheme: import("@react-native-rethemed/core/config").ThemeConfig;
146
+ //#endregion
package/dist/index.mjs ADDED
@@ -0,0 +1,151 @@
1
+ import { defineTheme } from "@react-native-rethemed/core/config";
2
+ //#region src/index.ts
3
+ /**
4
+ * Material Design 3's baseline type scale — 5 roles (display/headline/title/
5
+ * body/label) × 3 sizes (lg/md/sm).
6
+ * https://m3.material.io/styles/typography/type-scale-tokens
7
+ *
8
+ * MD3 Expressive's additional 15 "Emphasized" styles are intentionally left
9
+ * out — their values are less stable/well-documented across sources than
10
+ * this baseline scale.
11
+ */
12
+ const typescale = {
13
+ display: {
14
+ lg: {
15
+ fontSize: 57,
16
+ lineHeight: 64,
17
+ letterSpacing: -.25,
18
+ fontWeight: "400"
19
+ },
20
+ md: {
21
+ fontSize: 45,
22
+ lineHeight: 52,
23
+ letterSpacing: 0,
24
+ fontWeight: "400"
25
+ },
26
+ sm: {
27
+ fontSize: 36,
28
+ lineHeight: 44,
29
+ letterSpacing: 0,
30
+ fontWeight: "400"
31
+ }
32
+ },
33
+ headline: {
34
+ lg: {
35
+ fontSize: 32,
36
+ lineHeight: 40,
37
+ letterSpacing: 0,
38
+ fontWeight: "400"
39
+ },
40
+ md: {
41
+ fontSize: 28,
42
+ lineHeight: 36,
43
+ letterSpacing: 0,
44
+ fontWeight: "400"
45
+ },
46
+ sm: {
47
+ fontSize: 24,
48
+ lineHeight: 32,
49
+ letterSpacing: 0,
50
+ fontWeight: "400"
51
+ }
52
+ },
53
+ title: {
54
+ lg: {
55
+ fontSize: 22,
56
+ lineHeight: 28,
57
+ letterSpacing: 0,
58
+ fontWeight: "400"
59
+ },
60
+ md: {
61
+ fontSize: 16,
62
+ lineHeight: 24,
63
+ letterSpacing: .15,
64
+ fontWeight: "500"
65
+ },
66
+ sm: {
67
+ fontSize: 14,
68
+ lineHeight: 20,
69
+ letterSpacing: .1,
70
+ fontWeight: "500"
71
+ }
72
+ },
73
+ body: {
74
+ lg: {
75
+ fontSize: 16,
76
+ lineHeight: 24,
77
+ letterSpacing: .5,
78
+ fontWeight: "400"
79
+ },
80
+ md: {
81
+ fontSize: 14,
82
+ lineHeight: 20,
83
+ letterSpacing: .25,
84
+ fontWeight: "400"
85
+ },
86
+ sm: {
87
+ fontSize: 12,
88
+ lineHeight: 16,
89
+ letterSpacing: .4,
90
+ fontWeight: "400"
91
+ }
92
+ },
93
+ label: {
94
+ lg: {
95
+ fontSize: 14,
96
+ lineHeight: 20,
97
+ letterSpacing: .1,
98
+ fontWeight: "500"
99
+ },
100
+ md: {
101
+ fontSize: 12,
102
+ lineHeight: 16,
103
+ letterSpacing: .5,
104
+ fontWeight: "500"
105
+ },
106
+ sm: {
107
+ fontSize: 11,
108
+ lineHeight: 16,
109
+ letterSpacing: .5,
110
+ fontWeight: "500"
111
+ }
112
+ }
113
+ };
114
+ /**
115
+ * Material Design 3's system spacing tokens (`md.sys.measurement.space*`),
116
+ * keyed by their dp value: `space100` (8dp) → `8`, so
117
+ * `themed.view({ padding: 8 })` is 8. React Native style numbers are already
118
+ * density-independent (1dp = 1), so values are used as-is.
119
+ *
120
+ * | M3 token | key / value (dp) |
121
+ * |:--|--:|
122
+ * | `space0` | 0 |
123
+ * | `space25` / `space50` / `space75` | 2 / 4 / 6 |
124
+ * | `space100` / `space125` | 8 / 10 |
125
+ * | `space200` … `space900` | 16 … 72 (8dp steps) |
126
+ *
127
+ * https://m3.material.io/styles/spacing/tokens (checked 2026-10-02; M3 notes
128
+ * these tokens are so far only used by Jetpack Compose).
129
+ */
130
+ const spacing = {
131
+ 0: 0,
132
+ 2: 2,
133
+ 4: 4,
134
+ 6: 6,
135
+ 8: 8,
136
+ 10: 10,
137
+ 16: 16,
138
+ 24: 24,
139
+ 32: 32,
140
+ 40: 40,
141
+ 48: 48,
142
+ 56: 56,
143
+ 64: 64,
144
+ 72: 72
145
+ };
146
+ const materialDesignTheme = defineTheme({
147
+ tokens: { spacing },
148
+ semanticTokens: { text: typescale }
149
+ });
150
+ //#endregion
151
+ export { materialDesignTheme, spacing, typescale };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-native-rethemed/material-design-tokens",
3
- "version": "0.1.0",
3
+ "version": "0.1.2",
4
4
  "description": "Material Design 3 type scale and tokens for React Native, ready for react-native-rethemed.",
5
5
  "keywords": [
6
6
  "react-native",
@@ -21,18 +21,11 @@
21
21
  "directory": "packages/react-native-rethemed/material-design"
22
22
  },
23
23
  "sideEffects": false,
24
- "main": "./dist/cjs/index.js",
25
- "types": "./dist/cjs/index.d.ts",
24
+ "types": "./dist/index.d.cts",
26
25
  "exports": {
27
26
  ".": {
28
- "import": {
29
- "types": "./dist/esm/index.d.ts",
30
- "default": "./dist/esm/index.js"
31
- },
32
- "require": {
33
- "types": "./dist/cjs/index.d.ts",
34
- "default": "./dist/cjs/index.js"
35
- }
27
+ "import": "./dist/index.mjs",
28
+ "require": "./dist/index.cjs"
36
29
  },
37
30
  "./package.json": "./package.json"
38
31
  },
@@ -43,26 +36,31 @@
43
36
  "access": "public"
44
37
  },
45
38
  "dependencies": {
46
- "@react-native-rethemed/core": "^0.1.0"
39
+ "@react-native-rethemed/core": "^0.1.2"
47
40
  },
48
41
  "devDependencies": {
42
+ "@arethetypeswrong/core": "0.18.5",
49
43
  "@biomejs/biome": "2.5.4",
50
- "@react-native-rethemed/cli": "0.1.0",
44
+ "@react-native-rethemed/cli": "0.1.2",
51
45
  "@types/node": "24.10.4",
52
46
  "@types/react": "19.2.17",
53
47
  "biome-config": "0.0.0",
48
+ "publint": "0.3.25",
54
49
  "react": "19.2.3",
55
50
  "react-native": "0.86.2",
51
+ "tsdown": "0.23.0",
52
+ "tsdown-config": "0.0.0",
56
53
  "typescript": "6.0.3",
57
54
  "vitest": "4.1.10"
58
55
  },
59
56
  "scripts": {
60
- "build": "node ../../../scripts/build-package.mjs",
57
+ "build": "tsdown",
61
58
  "example:codegen": "react-native-rethemed codegen example/theme.ts --docs example/themed.md",
62
59
  "lint": "biome check src example",
63
60
  "lint:fix": "biome check --write --unsafe src example",
64
61
  "tsc": "tsc --noEmit",
65
62
  "test": "vitest",
66
63
  "test:ci": "vitest run"
67
- }
64
+ },
65
+ "main": "./dist/index.cjs"
68
66
  }
@@ -1,144 +0,0 @@
1
- /**
2
- * Material Design 3's baseline type scale — 5 roles (display/headline/title/
3
- * body/label) × 3 sizes (lg/md/sm).
4
- * https://m3.material.io/styles/typography/type-scale-tokens
5
- *
6
- * MD3 Expressive's additional 15 "Emphasized" styles are intentionally left
7
- * out — their values are less stable/well-documented across sources than
8
- * this baseline scale.
9
- */
10
- export declare const typescale: {
11
- readonly display: {
12
- readonly lg: {
13
- readonly fontSize: 57;
14
- readonly lineHeight: 64;
15
- readonly letterSpacing: -0.25;
16
- readonly fontWeight: "400";
17
- };
18
- readonly md: {
19
- readonly fontSize: 45;
20
- readonly lineHeight: 52;
21
- readonly letterSpacing: 0;
22
- readonly fontWeight: "400";
23
- };
24
- readonly sm: {
25
- readonly fontSize: 36;
26
- readonly lineHeight: 44;
27
- readonly letterSpacing: 0;
28
- readonly fontWeight: "400";
29
- };
30
- };
31
- readonly headline: {
32
- readonly lg: {
33
- readonly fontSize: 32;
34
- readonly lineHeight: 40;
35
- readonly letterSpacing: 0;
36
- readonly fontWeight: "400";
37
- };
38
- readonly md: {
39
- readonly fontSize: 28;
40
- readonly lineHeight: 36;
41
- readonly letterSpacing: 0;
42
- readonly fontWeight: "400";
43
- };
44
- readonly sm: {
45
- readonly fontSize: 24;
46
- readonly lineHeight: 32;
47
- readonly letterSpacing: 0;
48
- readonly fontWeight: "400";
49
- };
50
- };
51
- readonly title: {
52
- readonly lg: {
53
- readonly fontSize: 22;
54
- readonly lineHeight: 28;
55
- readonly letterSpacing: 0;
56
- readonly fontWeight: "400";
57
- };
58
- readonly md: {
59
- readonly fontSize: 16;
60
- readonly lineHeight: 24;
61
- readonly letterSpacing: 0.15;
62
- readonly fontWeight: "500";
63
- };
64
- readonly sm: {
65
- readonly fontSize: 14;
66
- readonly lineHeight: 20;
67
- readonly letterSpacing: 0.1;
68
- readonly fontWeight: "500";
69
- };
70
- };
71
- readonly body: {
72
- readonly lg: {
73
- readonly fontSize: 16;
74
- readonly lineHeight: 24;
75
- readonly letterSpacing: 0.5;
76
- readonly fontWeight: "400";
77
- };
78
- readonly md: {
79
- readonly fontSize: 14;
80
- readonly lineHeight: 20;
81
- readonly letterSpacing: 0.25;
82
- readonly fontWeight: "400";
83
- };
84
- readonly sm: {
85
- readonly fontSize: 12;
86
- readonly lineHeight: 16;
87
- readonly letterSpacing: 0.4;
88
- readonly fontWeight: "400";
89
- };
90
- };
91
- readonly label: {
92
- readonly lg: {
93
- readonly fontSize: 14;
94
- readonly lineHeight: 20;
95
- readonly letterSpacing: 0.1;
96
- readonly fontWeight: "500";
97
- };
98
- readonly md: {
99
- readonly fontSize: 12;
100
- readonly lineHeight: 16;
101
- readonly letterSpacing: 0.5;
102
- readonly fontWeight: "500";
103
- };
104
- readonly sm: {
105
- readonly fontSize: 11;
106
- readonly lineHeight: 16;
107
- readonly letterSpacing: 0.5;
108
- readonly fontWeight: "500";
109
- };
110
- };
111
- };
112
- /**
113
- * Material Design 3's system spacing tokens (`md.sys.measurement.space*`),
114
- * keyed by their dp value: `space100` (8dp) → `8`, so
115
- * `themed.view({ padding: 8 })` is 8. React Native style numbers are already
116
- * density-independent (1dp = 1), so values are used as-is.
117
- *
118
- * | M3 token | key / value (dp) |
119
- * |:--|--:|
120
- * | `space0` | 0 |
121
- * | `space25` / `space50` / `space75` | 2 / 4 / 6 |
122
- * | `space100` / `space125` | 8 / 10 |
123
- * | `space200` … `space900` | 16 … 72 (8dp steps) |
124
- *
125
- * https://m3.material.io/styles/spacing/tokens (checked 2026-10-02; M3 notes
126
- * these tokens are so far only used by Jetpack Compose).
127
- */
128
- export declare const spacing: {
129
- readonly 0: 0;
130
- readonly 2: 2;
131
- readonly 4: 4;
132
- readonly 6: 6;
133
- readonly 8: 8;
134
- readonly 10: 10;
135
- readonly 16: 16;
136
- readonly 24: 24;
137
- readonly 32: 32;
138
- readonly 40: 40;
139
- readonly 48: 48;
140
- readonly 56: 56;
141
- readonly 64: 64;
142
- readonly 72: 72;
143
- };
144
- export declare const materialDesignTheme: import("@react-native-rethemed/core/config").ThemeConfig;
package/dist/cjs/index.js DELETED
@@ -1,156 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.materialDesignTheme = exports.spacing = exports.typescale = void 0;
4
- const config_1 = require("@react-native-rethemed/core/config");
5
- /**
6
- * Material Design 3's baseline type scale — 5 roles (display/headline/title/
7
- * body/label) × 3 sizes (lg/md/sm).
8
- * https://m3.material.io/styles/typography/type-scale-tokens
9
- *
10
- * MD3 Expressive's additional 15 "Emphasized" styles are intentionally left
11
- * out — their values are less stable/well-documented across sources than
12
- * this baseline scale.
13
- */
14
- exports.typescale = {
15
- display: {
16
- lg: {
17
- fontSize: 57,
18
- lineHeight: 64,
19
- letterSpacing: -0.25,
20
- fontWeight: '400',
21
- },
22
- md: {
23
- fontSize: 45,
24
- lineHeight: 52,
25
- letterSpacing: 0,
26
- fontWeight: '400',
27
- },
28
- sm: {
29
- fontSize: 36,
30
- lineHeight: 44,
31
- letterSpacing: 0,
32
- fontWeight: '400',
33
- },
34
- },
35
- headline: {
36
- lg: {
37
- fontSize: 32,
38
- lineHeight: 40,
39
- letterSpacing: 0,
40
- fontWeight: '400',
41
- },
42
- md: {
43
- fontSize: 28,
44
- lineHeight: 36,
45
- letterSpacing: 0,
46
- fontWeight: '400',
47
- },
48
- sm: {
49
- fontSize: 24,
50
- lineHeight: 32,
51
- letterSpacing: 0,
52
- fontWeight: '400',
53
- },
54
- },
55
- title: {
56
- lg: {
57
- fontSize: 22,
58
- lineHeight: 28,
59
- letterSpacing: 0,
60
- fontWeight: '400',
61
- },
62
- md: {
63
- fontSize: 16,
64
- lineHeight: 24,
65
- letterSpacing: 0.15,
66
- fontWeight: '500',
67
- },
68
- sm: {
69
- fontSize: 14,
70
- lineHeight: 20,
71
- letterSpacing: 0.1,
72
- fontWeight: '500',
73
- },
74
- },
75
- body: {
76
- lg: {
77
- fontSize: 16,
78
- lineHeight: 24,
79
- letterSpacing: 0.5,
80
- fontWeight: '400',
81
- },
82
- md: {
83
- fontSize: 14,
84
- lineHeight: 20,
85
- letterSpacing: 0.25,
86
- fontWeight: '400',
87
- },
88
- sm: {
89
- fontSize: 12,
90
- lineHeight: 16,
91
- letterSpacing: 0.4,
92
- fontWeight: '400',
93
- },
94
- },
95
- label: {
96
- lg: {
97
- fontSize: 14,
98
- lineHeight: 20,
99
- letterSpacing: 0.1,
100
- fontWeight: '500',
101
- },
102
- md: {
103
- fontSize: 12,
104
- lineHeight: 16,
105
- letterSpacing: 0.5,
106
- fontWeight: '500',
107
- },
108
- sm: {
109
- fontSize: 11,
110
- lineHeight: 16,
111
- letterSpacing: 0.5,
112
- fontWeight: '500',
113
- },
114
- },
115
- };
116
- /**
117
- * Material Design 3's system spacing tokens (`md.sys.measurement.space*`),
118
- * keyed by their dp value: `space100` (8dp) → `8`, so
119
- * `themed.view({ padding: 8 })` is 8. React Native style numbers are already
120
- * density-independent (1dp = 1), so values are used as-is.
121
- *
122
- * | M3 token | key / value (dp) |
123
- * |:--|--:|
124
- * | `space0` | 0 |
125
- * | `space25` / `space50` / `space75` | 2 / 4 / 6 |
126
- * | `space100` / `space125` | 8 / 10 |
127
- * | `space200` … `space900` | 16 … 72 (8dp steps) |
128
- *
129
- * https://m3.material.io/styles/spacing/tokens (checked 2026-10-02; M3 notes
130
- * these tokens are so far only used by Jetpack Compose).
131
- */
132
- exports.spacing = {
133
- 0: 0,
134
- 2: 2,
135
- 4: 4,
136
- 6: 6,
137
- 8: 8,
138
- 10: 10,
139
- 16: 16,
140
- 24: 24,
141
- 32: 32,
142
- 40: 40,
143
- 48: 48,
144
- 56: 56,
145
- 64: 64,
146
- 72: 72,
147
- };
148
- exports.materialDesignTheme = (0, config_1.defineTheme)({
149
- // Spacing is a scale, not a role, so it is a primitive `tokens` entry.
150
- tokens: { spacing: exports.spacing },
151
- // Type-scale styles are role-named (MD3 also places them under
152
- // `md.sys.typescale.*`, not the reference layer), so they live in
153
- // `semanticTokens`. Values stay raw: MD3 has its own scale and does not
154
- // reference another theme's primitives.
155
- semanticTokens: { text: exports.typescale },
156
- });
@@ -1 +0,0 @@
1
- {"type":"commonjs"}
@@ -1,144 +0,0 @@
1
- /**
2
- * Material Design 3's baseline type scale — 5 roles (display/headline/title/
3
- * body/label) × 3 sizes (lg/md/sm).
4
- * https://m3.material.io/styles/typography/type-scale-tokens
5
- *
6
- * MD3 Expressive's additional 15 "Emphasized" styles are intentionally left
7
- * out — their values are less stable/well-documented across sources than
8
- * this baseline scale.
9
- */
10
- export declare const typescale: {
11
- readonly display: {
12
- readonly lg: {
13
- readonly fontSize: 57;
14
- readonly lineHeight: 64;
15
- readonly letterSpacing: -0.25;
16
- readonly fontWeight: "400";
17
- };
18
- readonly md: {
19
- readonly fontSize: 45;
20
- readonly lineHeight: 52;
21
- readonly letterSpacing: 0;
22
- readonly fontWeight: "400";
23
- };
24
- readonly sm: {
25
- readonly fontSize: 36;
26
- readonly lineHeight: 44;
27
- readonly letterSpacing: 0;
28
- readonly fontWeight: "400";
29
- };
30
- };
31
- readonly headline: {
32
- readonly lg: {
33
- readonly fontSize: 32;
34
- readonly lineHeight: 40;
35
- readonly letterSpacing: 0;
36
- readonly fontWeight: "400";
37
- };
38
- readonly md: {
39
- readonly fontSize: 28;
40
- readonly lineHeight: 36;
41
- readonly letterSpacing: 0;
42
- readonly fontWeight: "400";
43
- };
44
- readonly sm: {
45
- readonly fontSize: 24;
46
- readonly lineHeight: 32;
47
- readonly letterSpacing: 0;
48
- readonly fontWeight: "400";
49
- };
50
- };
51
- readonly title: {
52
- readonly lg: {
53
- readonly fontSize: 22;
54
- readonly lineHeight: 28;
55
- readonly letterSpacing: 0;
56
- readonly fontWeight: "400";
57
- };
58
- readonly md: {
59
- readonly fontSize: 16;
60
- readonly lineHeight: 24;
61
- readonly letterSpacing: 0.15;
62
- readonly fontWeight: "500";
63
- };
64
- readonly sm: {
65
- readonly fontSize: 14;
66
- readonly lineHeight: 20;
67
- readonly letterSpacing: 0.1;
68
- readonly fontWeight: "500";
69
- };
70
- };
71
- readonly body: {
72
- readonly lg: {
73
- readonly fontSize: 16;
74
- readonly lineHeight: 24;
75
- readonly letterSpacing: 0.5;
76
- readonly fontWeight: "400";
77
- };
78
- readonly md: {
79
- readonly fontSize: 14;
80
- readonly lineHeight: 20;
81
- readonly letterSpacing: 0.25;
82
- readonly fontWeight: "400";
83
- };
84
- readonly sm: {
85
- readonly fontSize: 12;
86
- readonly lineHeight: 16;
87
- readonly letterSpacing: 0.4;
88
- readonly fontWeight: "400";
89
- };
90
- };
91
- readonly label: {
92
- readonly lg: {
93
- readonly fontSize: 14;
94
- readonly lineHeight: 20;
95
- readonly letterSpacing: 0.1;
96
- readonly fontWeight: "500";
97
- };
98
- readonly md: {
99
- readonly fontSize: 12;
100
- readonly lineHeight: 16;
101
- readonly letterSpacing: 0.5;
102
- readonly fontWeight: "500";
103
- };
104
- readonly sm: {
105
- readonly fontSize: 11;
106
- readonly lineHeight: 16;
107
- readonly letterSpacing: 0.5;
108
- readonly fontWeight: "500";
109
- };
110
- };
111
- };
112
- /**
113
- * Material Design 3's system spacing tokens (`md.sys.measurement.space*`),
114
- * keyed by their dp value: `space100` (8dp) → `8`, so
115
- * `themed.view({ padding: 8 })` is 8. React Native style numbers are already
116
- * density-independent (1dp = 1), so values are used as-is.
117
- *
118
- * | M3 token | key / value (dp) |
119
- * |:--|--:|
120
- * | `space0` | 0 |
121
- * | `space25` / `space50` / `space75` | 2 / 4 / 6 |
122
- * | `space100` / `space125` | 8 / 10 |
123
- * | `space200` … `space900` | 16 … 72 (8dp steps) |
124
- *
125
- * https://m3.material.io/styles/spacing/tokens (checked 2026-10-02; M3 notes
126
- * these tokens are so far only used by Jetpack Compose).
127
- */
128
- export declare const spacing: {
129
- readonly 0: 0;
130
- readonly 2: 2;
131
- readonly 4: 4;
132
- readonly 6: 6;
133
- readonly 8: 8;
134
- readonly 10: 10;
135
- readonly 16: 16;
136
- readonly 24: 24;
137
- readonly 32: 32;
138
- readonly 40: 40;
139
- readonly 48: 48;
140
- readonly 56: 56;
141
- readonly 64: 64;
142
- readonly 72: 72;
143
- };
144
- export declare const materialDesignTheme: import("@react-native-rethemed/core/config").ThemeConfig;
package/dist/esm/index.js DELETED
@@ -1,153 +0,0 @@
1
- import { defineTheme, } from '@react-native-rethemed/core/config';
2
- /**
3
- * Material Design 3's baseline type scale — 5 roles (display/headline/title/
4
- * body/label) × 3 sizes (lg/md/sm).
5
- * https://m3.material.io/styles/typography/type-scale-tokens
6
- *
7
- * MD3 Expressive's additional 15 "Emphasized" styles are intentionally left
8
- * out — their values are less stable/well-documented across sources than
9
- * this baseline scale.
10
- */
11
- export const typescale = {
12
- display: {
13
- lg: {
14
- fontSize: 57,
15
- lineHeight: 64,
16
- letterSpacing: -0.25,
17
- fontWeight: '400',
18
- },
19
- md: {
20
- fontSize: 45,
21
- lineHeight: 52,
22
- letterSpacing: 0,
23
- fontWeight: '400',
24
- },
25
- sm: {
26
- fontSize: 36,
27
- lineHeight: 44,
28
- letterSpacing: 0,
29
- fontWeight: '400',
30
- },
31
- },
32
- headline: {
33
- lg: {
34
- fontSize: 32,
35
- lineHeight: 40,
36
- letterSpacing: 0,
37
- fontWeight: '400',
38
- },
39
- md: {
40
- fontSize: 28,
41
- lineHeight: 36,
42
- letterSpacing: 0,
43
- fontWeight: '400',
44
- },
45
- sm: {
46
- fontSize: 24,
47
- lineHeight: 32,
48
- letterSpacing: 0,
49
- fontWeight: '400',
50
- },
51
- },
52
- title: {
53
- lg: {
54
- fontSize: 22,
55
- lineHeight: 28,
56
- letterSpacing: 0,
57
- fontWeight: '400',
58
- },
59
- md: {
60
- fontSize: 16,
61
- lineHeight: 24,
62
- letterSpacing: 0.15,
63
- fontWeight: '500',
64
- },
65
- sm: {
66
- fontSize: 14,
67
- lineHeight: 20,
68
- letterSpacing: 0.1,
69
- fontWeight: '500',
70
- },
71
- },
72
- body: {
73
- lg: {
74
- fontSize: 16,
75
- lineHeight: 24,
76
- letterSpacing: 0.5,
77
- fontWeight: '400',
78
- },
79
- md: {
80
- fontSize: 14,
81
- lineHeight: 20,
82
- letterSpacing: 0.25,
83
- fontWeight: '400',
84
- },
85
- sm: {
86
- fontSize: 12,
87
- lineHeight: 16,
88
- letterSpacing: 0.4,
89
- fontWeight: '400',
90
- },
91
- },
92
- label: {
93
- lg: {
94
- fontSize: 14,
95
- lineHeight: 20,
96
- letterSpacing: 0.1,
97
- fontWeight: '500',
98
- },
99
- md: {
100
- fontSize: 12,
101
- lineHeight: 16,
102
- letterSpacing: 0.5,
103
- fontWeight: '500',
104
- },
105
- sm: {
106
- fontSize: 11,
107
- lineHeight: 16,
108
- letterSpacing: 0.5,
109
- fontWeight: '500',
110
- },
111
- },
112
- };
113
- /**
114
- * Material Design 3's system spacing tokens (`md.sys.measurement.space*`),
115
- * keyed by their dp value: `space100` (8dp) → `8`, so
116
- * `themed.view({ padding: 8 })` is 8. React Native style numbers are already
117
- * density-independent (1dp = 1), so values are used as-is.
118
- *
119
- * | M3 token | key / value (dp) |
120
- * |:--|--:|
121
- * | `space0` | 0 |
122
- * | `space25` / `space50` / `space75` | 2 / 4 / 6 |
123
- * | `space100` / `space125` | 8 / 10 |
124
- * | `space200` … `space900` | 16 … 72 (8dp steps) |
125
- *
126
- * https://m3.material.io/styles/spacing/tokens (checked 2026-10-02; M3 notes
127
- * these tokens are so far only used by Jetpack Compose).
128
- */
129
- export const spacing = {
130
- 0: 0,
131
- 2: 2,
132
- 4: 4,
133
- 6: 6,
134
- 8: 8,
135
- 10: 10,
136
- 16: 16,
137
- 24: 24,
138
- 32: 32,
139
- 40: 40,
140
- 48: 48,
141
- 56: 56,
142
- 64: 64,
143
- 72: 72,
144
- };
145
- export const materialDesignTheme = defineTheme({
146
- // Spacing is a scale, not a role, so it is a primitive `tokens` entry.
147
- tokens: { spacing },
148
- // Type-scale styles are role-named (MD3 also places them under
149
- // `md.sys.typescale.*`, not the reference layer), so they live in
150
- // `semanticTokens`. Values stay raw: MD3 has its own scale and does not
151
- // reference another theme's primitives.
152
- semanticTokens: { text: typescale },
153
- });
@@ -1 +0,0 @@
1
- {"type":"module"}