@jalvin/ui 2.0.38 → 2.0.40

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 (70) hide show
  1. package/dist/__tests__/annotated-string.test.d.ts +1 -1
  2. package/dist/__tests__/annotated-string.test.d.ts.map +1 -1
  3. package/dist/__tests__/annotated-string.test.js +26 -39
  4. package/dist/__tests__/annotated-string.test.js.map +1 -1
  5. package/dist/__tests__/children-signature.test.js +20 -20
  6. package/dist/__tests__/children-signature.test.js.map +1 -1
  7. package/dist/__tests__/interaction.test.js +52 -35
  8. package/dist/__tests__/interaction.test.js.map +1 -1
  9. package/dist/__tests__/text.test.d.ts +1 -1
  10. package/dist/__tests__/text.test.d.ts.map +1 -1
  11. package/dist/__tests__/text.test.js +22 -16
  12. package/dist/__tests__/text.test.js.map +1 -1
  13. package/dist/__tests__/windowsizeclass.test.js +57 -66
  14. package/dist/__tests__/windowsizeclass.test.js.map +1 -1
  15. package/dist/annotated-string.d.ts +2 -4
  16. package/dist/annotated-string.d.ts.map +1 -1
  17. package/dist/annotated-string.js +19 -17
  18. package/dist/annotated-string.js.map +1 -1
  19. package/dist/button.d.ts +2 -3
  20. package/dist/button.d.ts.map +1 -1
  21. package/dist/button.js +8 -12
  22. package/dist/button.js.map +1 -1
  23. package/dist/canvas.d.ts +3 -3
  24. package/dist/canvas.d.ts.map +1 -1
  25. package/dist/canvas.js +31 -40
  26. package/dist/canvas.js.map +1 -1
  27. package/dist/checkbox.d.ts +1 -2
  28. package/dist/checkbox.d.ts.map +1 -1
  29. package/dist/checkbox.js +18 -11
  30. package/dist/checkbox.js.map +1 -1
  31. package/dist/image.d.ts +4 -6
  32. package/dist/image.d.ts.map +1 -1
  33. package/dist/image.js +32 -21
  34. package/dist/image.js.map +1 -1
  35. package/dist/index.d.ts +15 -14
  36. package/dist/index.d.ts.map +1 -1
  37. package/dist/index.js +17 -19
  38. package/dist/index.js.map +1 -1
  39. package/dist/input.d.ts +1 -3
  40. package/dist/input.d.ts.map +1 -1
  41. package/dist/input.js +20 -13
  42. package/dist/input.js.map +1 -1
  43. package/dist/interaction.d.ts.map +1 -1
  44. package/dist/interaction.js +9 -27
  45. package/dist/interaction.js.map +1 -1
  46. package/dist/layout.d.ts +3 -4
  47. package/dist/layout.d.ts.map +1 -1
  48. package/dist/layout.js +7 -7
  49. package/dist/layout.js.map +1 -1
  50. package/dist/spacer.d.ts +2 -3
  51. package/dist/spacer.d.ts.map +1 -1
  52. package/dist/spacer.js +5 -5
  53. package/dist/spacer.js.map +1 -1
  54. package/dist/surface.d.ts +9 -10
  55. package/dist/surface.d.ts.map +1 -1
  56. package/dist/surface.js +30 -13
  57. package/dist/surface.js.map +1 -1
  58. package/dist/text.d.ts +3 -5
  59. package/dist/text.d.ts.map +1 -1
  60. package/dist/text.js +23 -12
  61. package/dist/text.js.map +1 -1
  62. package/dist/textarea.d.ts +1 -3
  63. package/dist/textarea.d.ts.map +1 -1
  64. package/dist/textarea.js +20 -13
  65. package/dist/textarea.js.map +1 -1
  66. package/dist/typography.d.ts +101 -129
  67. package/dist/typography.d.ts.map +1 -1
  68. package/dist/typography.js +29 -25
  69. package/dist/typography.js.map +1 -1
  70. package/package.json +3 -8
@@ -1 +1 @@
1
- {"version":3,"file":"textarea.js","sourceRoot":"","sources":["../src/textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAqB1B,4BAA4B;AAC5B,MAAM,UAAU,QAAQ,CAAC,EACvB,KAAK,EACL,aAAa,EACb,WAAW,EACX,QAAQ,EACR,OAAO,GAAG,IAAI,EACd,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,cAAc,EACd,OAAO,GAAG,KAAK,EACf,SAAS,EACT,IAAI,GAAG,CAAC,EACR,OAAO,EACP,MAAM,EACN,SAAS,EACT,SAAS,GACK;IACd,MAAM,QAAQ,GAAG,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAC3C,MAAM,WAAW,GAAG,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;IAEpD,MAAM,QAAQ,GAAG,KAAK,CAAC,aAAa,CAAC,UAAU,EAAE;QAC/C,KAAK;QACL,QAAQ,EAAE,CAAC,CAAyC,EAAE,EAAE,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QACxF,WAAW;QACX,QAAQ,EAAE,CAAC,OAAO;QAClB,QAAQ;QACR,SAAS;QACT,IAAI;QACJ,OAAO;QACP,MAAM;QACN,SAAS;QACT,SAAS;QACT,KAAK,EAAE;YACL,KAAK,EAAE,MAAM;YACb,OAAO,EAAE,UAAU;YACnB,QAAQ,EAAE,MAAM;YAChB,UAAU,EAAE,SAAS;YACrB,MAAM,EAAE,aAAa,WAAW,EAAE;YAClC,YAAY,EAAE,KAAK;YACnB,OAAO,EAAE,MAAM;YACf,eAAe,EAAE,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;YAC7C,KAAK,EAAE,SAAS;YAChB,SAAS,EAAE,YAAqB;YAChC,MAAM,EAAE,UAAmB;YAC3B,UAAU,EAAE,GAAG;SAChB;KACF,CAAC,CAAC;IAEH,IAAI,CAAC,KAAK,IAAI,CAAC,cAAc,EAAE,CAAC;QAC9B,OAAO,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,GAAG,QAAQ,EAAE,EAAE,QAAQ,CAAC,CAAC;IAC/D,CAAC;IAED,OAAO,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;QAChC,GAAG,QAAQ;QACX,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,KAAK,EAAE;KACnF,EACC,KAAK,IAAI,KAAK,CAAC,aAAa,CAAC,OAAO,EAAE;QACpC,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAAE;KACzF,EAAE,KAAK,CAAC,EACT,QAAQ,EACR,cAAc,IAAI,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE;QAC5C,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAAE;KACvE,EAAE,cAAc,CAAC,CACnB,CAAC;AACJ,CAAC"}
1
+ {"version":3,"file":"textarea.js","sourceRoot":"","sources":["../src/textarea.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAmBtD,4BAA4B;AAC5B,MAAM,UAAU,QAAQ,CAAC,EACvB,KAAK,EACL,aAAa,EACb,WAAW,EACX,QAAQ,EACR,OAAO,GAAG,IAAI,EACd,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,cAAc,EACd,OAAO,GAAG,KAAK,EACf,SAAS,EACT,IAAI,GAAG,CAAC,EACR,OAAO,EACP,MAAM,EACN,SAAS,GACK;IACd,MAAM,QAAQ,GAAG,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAC3C,MAAM,WAAW,GAAG,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;IAEpD,MAAM,QAAQ,GAAG,mBAAmB,CAAC,UAAU,EAAE;QAC/C,KAAK;QACL,OAAO,EAAE,CAAC,CAAM,EAAE,EAAE,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QACpD,WAAW;QACX,QAAQ,EAAE,CAAC,OAAO;QAClB,QAAQ;QACR,SAAS;QACT,IAAI;QACJ,OAAO;QACP,MAAM;QACN,SAAS;QACT,KAAK,EAAE;YACL,KAAK,EAAE,MAAM;YACb,OAAO,EAAE,UAAU;YACnB,QAAQ,EAAE,MAAM;YAChB,UAAU,EAAE,SAAS;YACrB,MAAM,EAAE,aAAa,WAAW,EAAE;YAClC,YAAY,EAAE,KAAK;YACnB,OAAO,EAAE,MAAM;YACf,eAAe,EAAE,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;YAC7C,KAAK,EAAE,SAAS;YAChB,SAAS,EAAE,YAAY;YACvB,MAAM,EAAE,UAAU;YAClB,UAAU,EAAE,GAAG;SAChB;KACF,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,CAAC,KAAK,IAAI,CAAC,cAAc,EAAE,CAAC;QAC9B,OAAO,mBAAmB,CAAC,KAAK,EAAE,EAAE,GAAG,QAAQ,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IACjE,CAAC;IAED,MAAM,iBAAiB,GAAW,EAAE,CAAC;IACrC,IAAI,KAAK,EAAE,CAAC;QACV,iBAAiB,CAAC,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE;YAClD,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAAE;SACzF,EAAE,CAAC,QAAQ,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IACxC,CAAC;IACD,iBAAiB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACjC,IAAI,cAAc,EAAE,CAAC;QACnB,iBAAiB,CAAC,IAAI,CAAC,mBAAmB,CAAC,MAAM,EAAE;YACjD,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAAE;SACvE,EAAE,CAAC,QAAQ,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;IACjD,CAAC;IAED,OAAO,mBAAmB,CAAC,KAAK,EAAE;QAChC,GAAG,QAAQ;QACX,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,KAAK,EAAE;KACnF,EAAE,iBAAiB,CAAC,CAAC;AACxB,CAAC"}
@@ -1,137 +1,109 @@
1
- import type { CSSProperties } from "react";
1
+ /** Local definition for standard CSS properties. */
2
+ export type CSSProperties = {
3
+ [key: string]: string | number | undefined;
4
+ };
2
5
  export interface TextStyleDef {
3
- fontSize: string;
6
+ fontSize: number;
7
+ lineHeight: number;
4
8
  fontWeight: number | "bold" | "normal";
5
- lineHeight: string;
6
- letterSpacing?: string;
9
+ letterSpacing: number;
10
+ fontFamily?: string;
11
+ color?: string;
7
12
  }
8
13
  export declare const TextStyle: {
9
- displayLarge: {
10
- fontSize: string;
11
- fontWeight: number;
12
- lineHeight: string;
13
- };
14
- displayMedium: {
15
- fontSize: string;
16
- fontWeight: number;
17
- lineHeight: string;
18
- };
19
- displaySmall: {
20
- fontSize: string;
21
- fontWeight: number;
22
- lineHeight: string;
23
- };
24
- headlineLarge: {
25
- fontSize: string;
26
- fontWeight: number;
27
- lineHeight: string;
28
- };
29
- headlineMedium: {
30
- fontSize: string;
31
- fontWeight: number;
32
- lineHeight: string;
33
- };
34
- headlineSmall: {
35
- fontSize: string;
36
- fontWeight: number;
37
- lineHeight: string;
38
- };
39
- titleLarge: {
40
- fontSize: string;
41
- fontWeight: number;
42
- lineHeight: string;
43
- };
44
- titleMedium: {
45
- fontSize: string;
46
- fontWeight: number;
47
- lineHeight: string;
48
- letterSpacing: string;
49
- };
50
- titleSmall: {
51
- fontSize: string;
52
- fontWeight: number;
53
- lineHeight: string;
54
- letterSpacing: string;
55
- };
56
- bodyLarge: {
57
- fontSize: string;
58
- fontWeight: number;
59
- lineHeight: string;
60
- letterSpacing: string;
61
- };
62
- bodyMedium: {
63
- fontSize: string;
64
- fontWeight: number;
65
- lineHeight: string;
66
- letterSpacing: string;
67
- };
68
- bodySmall: {
69
- fontSize: string;
70
- fontWeight: number;
71
- lineHeight: string;
72
- letterSpacing: string;
73
- };
74
- labelLarge: {
75
- fontSize: string;
76
- fontWeight: number;
77
- lineHeight: string;
78
- letterSpacing: string;
79
- };
80
- labelMedium: {
81
- fontSize: string;
82
- fontWeight: number;
83
- lineHeight: string;
84
- letterSpacing: string;
85
- };
86
- labelSmall: {
87
- fontSize: string;
88
- fontWeight: number;
89
- lineHeight: string;
90
- letterSpacing: string;
91
- };
92
- h1: {
93
- fontSize: string;
94
- fontWeight: "bold";
95
- lineHeight: string;
96
- };
97
- h2: {
98
- fontSize: string;
99
- fontWeight: "bold";
100
- lineHeight: string;
101
- };
102
- h3: {
103
- fontSize: string;
104
- fontWeight: "bold";
105
- lineHeight: string;
106
- };
107
- h4: {
108
- fontSize: string;
109
- fontWeight: "bold";
110
- lineHeight: string;
111
- };
112
- body: {
113
- fontSize: string;
114
- fontWeight: "normal";
115
- lineHeight: string;
116
- };
117
- caption: {
118
- fontSize: string;
119
- fontWeight: "normal";
120
- lineHeight: string;
121
- };
122
- button: {
123
- fontSize: string;
124
- fontWeight: number;
125
- lineHeight: string;
126
- letterSpacing: string;
127
- };
128
- code: {
129
- fontSize: string;
130
- fontWeight: "normal";
131
- lineHeight: string;
132
- letterSpacing: string;
14
+ readonly displayLarge: {
15
+ readonly fontSize: 57;
16
+ readonly lineHeight: 64;
17
+ readonly fontWeight: 400;
18
+ readonly letterSpacing: -0.25;
19
+ };
20
+ readonly displayMedium: {
21
+ readonly fontSize: 45;
22
+ readonly lineHeight: 52;
23
+ readonly fontWeight: 400;
24
+ readonly letterSpacing: 0;
25
+ };
26
+ readonly displaySmall: {
27
+ readonly fontSize: 36;
28
+ readonly lineHeight: 44;
29
+ readonly fontWeight: 400;
30
+ readonly letterSpacing: 0;
31
+ };
32
+ readonly headlineLarge: {
33
+ readonly fontSize: 32;
34
+ readonly lineHeight: 40;
35
+ readonly fontWeight: 400;
36
+ readonly letterSpacing: 0;
37
+ };
38
+ readonly headlineMedium: {
39
+ readonly fontSize: 28;
40
+ readonly lineHeight: 36;
41
+ readonly fontWeight: 400;
42
+ readonly letterSpacing: 0;
43
+ };
44
+ readonly headlineSmall: {
45
+ readonly fontSize: 24;
46
+ readonly lineHeight: 32;
47
+ readonly fontWeight: 400;
48
+ readonly letterSpacing: 0;
49
+ };
50
+ readonly titleLarge: {
51
+ readonly fontSize: 22;
52
+ readonly lineHeight: 28;
53
+ readonly fontWeight: 400;
54
+ readonly letterSpacing: 0;
55
+ };
56
+ readonly titleMedium: {
57
+ readonly fontSize: 16;
58
+ readonly lineHeight: 24;
59
+ readonly fontWeight: 500;
60
+ readonly letterSpacing: 0.15;
61
+ };
62
+ readonly titleSmall: {
63
+ readonly fontSize: 14;
64
+ readonly lineHeight: 20;
65
+ readonly fontWeight: 500;
66
+ readonly letterSpacing: 0.1;
67
+ };
68
+ readonly labelLarge: {
69
+ readonly fontSize: 14;
70
+ readonly lineHeight: 20;
71
+ readonly fontWeight: 500;
72
+ readonly letterSpacing: 0.1;
73
+ };
74
+ readonly labelMedium: {
75
+ readonly fontSize: 12;
76
+ readonly lineHeight: 16;
77
+ readonly fontWeight: 500;
78
+ readonly letterSpacing: 0.5;
79
+ };
80
+ readonly labelSmall: {
81
+ readonly fontSize: 11;
82
+ readonly lineHeight: 16;
83
+ readonly fontWeight: 500;
84
+ readonly letterSpacing: 0.5;
85
+ };
86
+ readonly bodyLarge: {
87
+ readonly fontSize: 16;
88
+ readonly lineHeight: 24;
89
+ readonly fontWeight: 400;
90
+ readonly letterSpacing: 0.5;
91
+ };
92
+ readonly bodyMedium: {
93
+ readonly fontSize: 14;
94
+ readonly lineHeight: 20;
95
+ readonly fontWeight: 400;
96
+ readonly letterSpacing: 0.25;
97
+ };
98
+ readonly bodySmall: {
99
+ readonly fontSize: 12;
100
+ readonly lineHeight: 16;
101
+ readonly fontWeight: 400;
102
+ readonly letterSpacing: 0.4;
133
103
  };
134
104
  };
135
- export type TextStyleKey = keyof typeof TextStyle;
105
+ /**
106
+ * Converts a TextStyle token to standard CSS properties.
107
+ */
136
108
  export declare function textStyleToCSS(style: TextStyleDef): CSSProperties;
137
109
  //# sourceMappingURL=typography.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,MAAM,WAAW,YAAY;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC;IACvC,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BkB,CAAC;AAEzC,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,SAAS,CAAC;AAElD,wBAAgB,cAAc,CAAC,KAAK,EAAE,YAAY,GAAG,aAAa,CAEjE"}
1
+ {"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"AAAA,oDAAoD;AACpD,MAAM,MAAM,aAAa,GAAG;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAA;CAAE,CAAC;AAE3E,MAAM,WAAW,YAAY;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC;IACvC,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgBZ,CAAC;AAEX;;GAEG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,YAAY,GAAG,aAAa,CAUjE"}
@@ -1,30 +1,34 @@
1
1
  export const TextStyle = {
2
- displayLarge: { fontSize: "3.5rem", fontWeight: 400, lineHeight: "4rem" },
3
- displayMedium: { fontSize: "2.8rem", fontWeight: 400, lineHeight: "3.2rem" },
4
- displaySmall: { fontSize: "2.25rem", fontWeight: 400, lineHeight: "2.75rem" },
5
- headlineLarge: { fontSize: "2rem", fontWeight: 400, lineHeight: "2.5rem" },
6
- headlineMedium: { fontSize: "1.75rem", fontWeight: 400, lineHeight: "2.25rem" },
7
- headlineSmall: { fontSize: "1.5rem", fontWeight: 400, lineHeight: "2rem" },
8
- titleLarge: { fontSize: "1.375rem", fontWeight: 500, lineHeight: "1.75rem" },
9
- titleMedium: { fontSize: "1rem", fontWeight: 500, lineHeight: "1.5rem", letterSpacing: "0.009em" },
10
- titleSmall: { fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", letterSpacing: "0.007em" },
11
- bodyLarge: { fontSize: "1rem", fontWeight: 400, lineHeight: "1.5rem", letterSpacing: "0.009em" },
12
- bodyMedium: { fontSize: "0.875rem", fontWeight: 400, lineHeight: "1.25rem", letterSpacing: "0.018em" },
13
- bodySmall: { fontSize: "0.75rem", fontWeight: 400, lineHeight: "1rem", letterSpacing: "0.025em" },
14
- labelLarge: { fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", letterSpacing: "0.007em" },
15
- labelMedium: { fontSize: "0.75rem", fontWeight: 500, lineHeight: "1rem", letterSpacing: "0.031em" },
16
- labelSmall: { fontSize: "0.6875rem", fontWeight: 500, lineHeight: "1rem", letterSpacing: "0.045em" },
17
- // Shortcuts
18
- h1: { fontSize: "2rem", fontWeight: "bold", lineHeight: "2.5rem" },
19
- h2: { fontSize: "1.5rem", fontWeight: "bold", lineHeight: "2rem" },
20
- h3: { fontSize: "1.25rem", fontWeight: "bold", lineHeight: "1.75rem" },
21
- h4: { fontSize: "1.125rem", fontWeight: "bold", lineHeight: "1.5rem" },
22
- body: { fontSize: "1rem", fontWeight: "normal", lineHeight: "1.5rem" },
23
- caption: { fontSize: "0.75rem", fontWeight: "normal", lineHeight: "1rem" },
24
- button: { fontSize: "0.875rem", fontWeight: 500, lineHeight: "1rem", letterSpacing: "0.031em" },
25
- code: { fontSize: "0.875rem", fontWeight: "normal", lineHeight: "1.4rem", letterSpacing: "-0.01em" },
2
+ displayLarge: { fontSize: 57, lineHeight: 64, fontWeight: 400, letterSpacing: -0.25 },
3
+ displayMedium: { fontSize: 45, lineHeight: 52, fontWeight: 400, letterSpacing: 0 },
4
+ displaySmall: { fontSize: 36, lineHeight: 44, fontWeight: 400, letterSpacing: 0 },
5
+ headlineLarge: { fontSize: 32, lineHeight: 40, fontWeight: 400, letterSpacing: 0 },
6
+ headlineMedium: { fontSize: 28, lineHeight: 36, fontWeight: 400, letterSpacing: 0 },
7
+ headlineSmall: { fontSize: 24, lineHeight: 32, fontWeight: 400, letterSpacing: 0 },
8
+ titleLarge: { fontSize: 22, lineHeight: 28, fontWeight: 400, letterSpacing: 0 },
9
+ titleMedium: { fontSize: 16, lineHeight: 24, fontWeight: 500, letterSpacing: 0.15 },
10
+ titleSmall: { fontSize: 14, lineHeight: 20, fontWeight: 500, letterSpacing: 0.1 },
11
+ labelLarge: { fontSize: 14, lineHeight: 20, fontWeight: 500, letterSpacing: 0.1 },
12
+ labelMedium: { fontSize: 12, lineHeight: 16, fontWeight: 500, letterSpacing: 0.5 },
13
+ labelSmall: { fontSize: 11, lineHeight: 16, fontWeight: 500, letterSpacing: 0.5 },
14
+ bodyLarge: { fontSize: 16, lineHeight: 24, fontWeight: 400, letterSpacing: 0.5 },
15
+ bodyMedium: { fontSize: 14, lineHeight: 20, fontWeight: 400, letterSpacing: 0.25 },
16
+ bodySmall: { fontSize: 12, lineHeight: 16, fontWeight: 400, letterSpacing: 0.4 },
26
17
  };
18
+ /**
19
+ * Converts a TextStyle token to standard CSS properties.
20
+ */
27
21
  export function textStyleToCSS(style) {
28
- return style;
22
+ const css = {
23
+ fontSize: `${style.fontSize}px`,
24
+ lineHeight: `${style.lineHeight}px`,
25
+ fontWeight: style.fontWeight,
26
+ letterSpacing: `${style.letterSpacing}px`,
27
+ };
28
+ if (style.fontFamily)
29
+ css.fontFamily = style.fontFamily;
30
+ if (style.color)
31
+ css.color = style.color;
32
+ return css;
29
33
  }
30
34
  //# sourceMappingURL=typography.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"typography.js","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"typography.js","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"AAYA,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,YAAY,EAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,CAAC,IAAI,EAAE;IACxF,aAAa,EAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,CAAC,EAAE;IACpF,YAAY,EAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,CAAC,EAAE;IACpF,aAAa,EAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,CAAC,EAAE;IACpF,cAAc,EAAG,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,CAAC,EAAE;IACpF,aAAa,EAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,CAAC,EAAE;IACpF,UAAU,EAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,CAAC,EAAE;IACpF,WAAW,EAAM,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,IAAI,EAAE;IACvF,UAAU,EAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,GAAG,EAAE;IACtF,UAAU,EAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,GAAG,EAAE;IACtF,WAAW,EAAM,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,GAAG,EAAE;IACtF,UAAU,EAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,GAAG,EAAE;IACtF,SAAS,EAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,GAAG,EAAE;IACtF,UAAU,EAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,IAAI,EAAE;IACvF,SAAS,EAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,EAAE,GAAG,EAAE;CAC9E,CAAC;AAEX;;GAEG;AACH,MAAM,UAAU,cAAc,CAAC,KAAmB;IAChD,MAAM,GAAG,GAAQ;QACf,QAAQ,EAAE,GAAG,KAAK,CAAC,QAAQ,IAAI;QAC/B,UAAU,EAAE,GAAG,KAAK,CAAC,UAAU,IAAI;QACnC,UAAU,EAAE,KAAK,CAAC,UAAU;QAC5B,aAAa,EAAE,GAAG,KAAK,CAAC,aAAa,IAAI;KAC1C,CAAC;IACF,IAAI,KAAK,CAAC,UAAU;QAAE,GAAG,CAAC,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC;IACxD,IAAI,KAAK,CAAC,KAAK;QAAE,GAAG,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;IACzC,OAAO,GAAG,CAAC;AACb,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jalvin/ui",
3
- "version": "2.0.38",
3
+ "version": "2.0.40",
4
4
  "description": "Jalvin UI — Compose-style component library (Column, Row, Box, Button, Text, …)",
5
5
  "type": "module",
6
6
  "main": "dist/index.js",
@@ -17,17 +17,12 @@
17
17
  "files": [
18
18
  "dist"
19
19
  ],
20
- "peerDependencies": {
21
- "react": ">=18.0.0"
22
- },
23
20
  "devDependencies": {
24
- "@jalvin/runtime": "^2.0.38",
21
+ "@jalvin/runtime": "2.0.40",
22
+ "@testing-library/dom": "^10.4.1",
25
23
  "@testing-library/jest-dom": "^6.9.1",
26
- "@testing-library/react": "^16.3.2",
27
24
  "@types/node": "^20.0.0",
28
- "@types/react": "^18.0.0",
29
25
  "jsdom": "^29.1.1",
30
- "react": "^19.2.5",
31
26
  "typescript": "^5.4.0",
32
27
  "vitest": "^2.1.9"
33
28
  },