@jalvin/ui 2.0.43 → 2.0.44

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 (56) hide show
  1. package/dist/annotated-string.d.ts +2 -4
  2. package/dist/annotated-string.d.ts.map +1 -1
  3. package/dist/annotated-string.js +19 -17
  4. package/dist/annotated-string.js.map +1 -1
  5. package/dist/button.d.ts +2 -3
  6. package/dist/button.d.ts.map +1 -1
  7. package/dist/button.js +8 -12
  8. package/dist/button.js.map +1 -1
  9. package/dist/canvas.d.ts +3 -3
  10. package/dist/canvas.d.ts.map +1 -1
  11. package/dist/canvas.js +31 -40
  12. package/dist/canvas.js.map +1 -1
  13. package/dist/checkbox.d.ts +1 -2
  14. package/dist/checkbox.d.ts.map +1 -1
  15. package/dist/checkbox.js +18 -11
  16. package/dist/checkbox.js.map +1 -1
  17. package/dist/image.d.ts +4 -6
  18. package/dist/image.d.ts.map +1 -1
  19. package/dist/image.js +32 -21
  20. package/dist/image.js.map +1 -1
  21. package/dist/index.d.ts +15 -14
  22. package/dist/index.d.ts.map +1 -1
  23. package/dist/index.js +17 -19
  24. package/dist/index.js.map +1 -1
  25. package/dist/input.d.ts +1 -3
  26. package/dist/input.d.ts.map +1 -1
  27. package/dist/input.js +20 -13
  28. package/dist/input.js.map +1 -1
  29. package/dist/interaction.d.ts.map +1 -1
  30. package/dist/interaction.js +9 -27
  31. package/dist/interaction.js.map +1 -1
  32. package/dist/layout.d.ts +3 -7
  33. package/dist/layout.d.ts.map +1 -1
  34. package/dist/layout.js +10 -10
  35. package/dist/layout.js.map +1 -1
  36. package/dist/spacer.d.ts +2 -3
  37. package/dist/spacer.d.ts.map +1 -1
  38. package/dist/spacer.js +5 -5
  39. package/dist/spacer.js.map +1 -1
  40. package/dist/surface.d.ts +9 -10
  41. package/dist/surface.d.ts.map +1 -1
  42. package/dist/surface.js +30 -13
  43. package/dist/surface.js.map +1 -1
  44. package/dist/text.d.ts +3 -5
  45. package/dist/text.d.ts.map +1 -1
  46. package/dist/text.js +23 -12
  47. package/dist/text.js.map +1 -1
  48. package/dist/textarea.d.ts +1 -3
  49. package/dist/textarea.d.ts.map +1 -1
  50. package/dist/textarea.js +20 -13
  51. package/dist/textarea.js.map +1 -1
  52. package/dist/typography.d.ts +101 -129
  53. package/dist/typography.d.ts.map +1 -1
  54. package/dist/typography.js +29 -25
  55. package/dist/typography.js.map +1 -1
  56. package/package.json +2 -2
package/dist/surface.js CHANGED
@@ -1,4 +1,4 @@
1
- import React from "react";
1
+ import { jalvinCreateElement } from "@jalvin/runtime";
2
2
  const SHADOWS = [
3
3
  "none",
4
4
  "0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.08)",
@@ -8,7 +8,7 @@ const SHADOWS = [
8
8
  /** Card container. */
9
9
  export function Card({ modifier, onClick, elevation = 1, outlined = false, }, children) {
10
10
  const modProps = modifier?.toProps() ?? {};
11
- return React.createElement("div", {
11
+ return jalvinCreateElement("div", {
12
12
  ...modProps,
13
13
  onClick,
14
14
  role: onClick ? "button" : undefined,
@@ -22,14 +22,28 @@ export function Card({ modifier, onClick, elevation = 1, outlined = false, }, ch
22
22
  cursor: onClick ? "pointer" : "default",
23
23
  ...modProps.style,
24
24
  },
25
- }, ...(children ?? []));
25
+ }, children ?? []);
26
26
  }
27
27
  /**
28
28
  * Full-page layout scaffold. Stacks topBar, scrollable content, and bottomBar.
29
29
  */
30
30
  export function Scaffold({ topBar, bottomBar, floatingActionButton, modifier, }, children) {
31
31
  const modProps = modifier?.toProps() ?? {};
32
- return React.createElement("div", {
32
+ const main = jalvinCreateElement("main", {
33
+ style: { flex: 1, overflow: "auto", WebkitOverflowScrolling: "touch" },
34
+ }, children ?? []);
35
+ const scaffoldChildren = [];
36
+ if (topBar)
37
+ scaffoldChildren.push(topBar);
38
+ scaffoldChildren.push(main);
39
+ if (bottomBar)
40
+ scaffoldChildren.push(bottomBar);
41
+ if (floatingActionButton) {
42
+ scaffoldChildren.push(jalvinCreateElement("div", {
43
+ style: { position: "absolute", bottom: "16px", right: "16px" },
44
+ }, [floatingActionButton]));
45
+ }
46
+ return jalvinCreateElement("div", {
33
47
  ...modProps,
34
48
  style: {
35
49
  display: "flex",
@@ -39,16 +53,21 @@ export function Scaffold({ topBar, bottomBar, floatingActionButton, modifier, },
39
53
  position: "relative",
40
54
  ...modProps.style,
41
55
  },
42
- }, topBar, React.createElement("main", {
43
- style: { flex: 1, overflow: "auto", WebkitOverflowScrolling: "touch" },
44
- }, ...(children ?? [])), bottomBar, floatingActionButton && React.createElement("div", {
45
- style: { position: "absolute", bottom: "16px", right: "16px" },
46
- }, floatingActionButton));
56
+ }, scaffoldChildren);
47
57
  }
48
58
  /** App top bar. */
49
59
  export function TopBar({ title, navigationIcon, actions, modifier, }) {
50
60
  const modProps = modifier?.toProps() ?? {};
51
- return React.createElement("header", {
61
+ const titleNode = title;
62
+ const barChildren = [];
63
+ if (navigationIcon)
64
+ barChildren.push(navigationIcon);
65
+ barChildren.push(jalvinCreateElement("span", {
66
+ style: { flex: 1, fontSize: "1.375rem", fontWeight: 500 },
67
+ }, [titleNode]));
68
+ if (actions)
69
+ barChildren.push(actions);
70
+ return jalvinCreateElement("header", {
52
71
  ...modProps,
53
72
  style: {
54
73
  display: "flex",
@@ -61,8 +80,6 @@ export function TopBar({ title, navigationIcon, actions, modifier, }) {
61
80
  flexShrink: 0,
62
81
  ...modProps.style,
63
82
  },
64
- }, navigationIcon, React.createElement("span", {
65
- style: { flex: 1, fontSize: "1.375rem", fontWeight: 500 },
66
- }, title), actions);
83
+ }, barChildren);
67
84
  }
68
85
  //# sourceMappingURL=surface.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"surface.js","sourceRoot":"","sources":["../src/surface.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"surface.js","sourceRoot":"","sources":["../src/surface.ts"],"names":[],"mappings":"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"}
package/dist/text.d.ts CHANGED
@@ -1,18 +1,16 @@
1
- import React from "react";
2
1
  import { Modifier } from "./modifier.js";
3
2
  import { type TextStyleDef } from "./typography.js";
4
- import type { CSSProperties } from "react";
5
3
  import { type AnnotatedString } from "./annotated-string.js";
6
4
  export interface TextProps {
7
- children?: React.ReactNode;
5
+ children?: Node[];
8
6
  /** Plain string content or an AnnotatedString (for inline links / spans). */
9
7
  text?: string | AnnotatedString;
10
8
  modifier?: Modifier;
11
9
  /** Typography style — use TextStyle tokens (e.g. TextStyle.headlineLarge) */
12
- style?: TextStyleDef | CSSProperties;
10
+ style?: TextStyleDef | Record<string, any>;
13
11
  color?: string;
14
12
  maxLines?: number;
15
13
  }
16
14
  /** Text element. Accepts plain strings or AnnotatedStrings with inline links and spans. */
17
- export declare function Text({ children, text, modifier, style, color, maxLines, }: TextProps): React.ReactElement;
15
+ export declare function Text({ children, text, modifier, style, color, maxLines, }: TextProps): HTMLElement;
18
16
  //# sourceMappingURL=text.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../src/text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,KAAK,YAAY,EAAkB,MAAM,iBAAiB,CAAC;AACpE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,KAAK,eAAe,EAAyB,MAAM,uBAAuB,CAAC;AAEpF,MAAM,WAAW,SAAS;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,6EAA6E;IAC7E,IAAI,CAAC,EAAE,MAAM,GAAG,eAAe,CAAC;IAChC,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,6EAA6E;IAC7E,KAAK,CAAC,EAAE,YAAY,GAAG,aAAa,CAAC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,2FAA2F;AAC3F,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,SAAS,GAAG,KAAK,CAAC,YAAY,CAuBhC"}
1
+ {"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../src/text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAsB,MAAM,eAAe,CAAC;AAC7D,OAAO,EAAE,KAAK,YAAY,EAAkB,MAAM,iBAAiB,CAAC;AACpE,OAAO,EAAE,KAAK,eAAe,EAAyB,MAAM,uBAAuB,CAAC;AAGpF,MAAM,WAAW,SAAS;IACxB,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC;IAClB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,MAAM,GAAG,eAAe,CAAC;IAChC,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,6EAA6E;IAC7E,KAAK,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,2FAA2F;AAC3F,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,SAAS,GAAG,WAAW,CAiCzB"}
package/dist/text.js CHANGED
@@ -1,27 +1,38 @@
1
- import React from "react";
2
1
  import { textStyleToCSS } from "./typography.js";
3
2
  import { renderAnnotatedString } from "./annotated-string.js";
3
+ import { jalvinCreateElement } from "@jalvin/runtime";
4
4
  /** Text element. Accepts plain strings or AnnotatedStrings with inline links and spans. */
5
5
  export function Text({ children, text, modifier, style, color, maxLines, }) {
6
6
  const modProps = modifier?.toProps() ?? {};
7
- const textStyle = style ? textStyleToCSS(style) : {};
7
+ const textStyle = style && style.fontSize ? textStyleToCSS(style) : (style ?? {});
8
8
  const clampStyle = maxLines !== undefined ? {
9
9
  display: "-webkit-box",
10
10
  WebkitLineClamp: maxLines,
11
11
  WebkitBoxOrient: "vertical",
12
12
  overflow: "hidden",
13
13
  } : {};
14
- const content = typeof text === "object" && text !== null && "spanStyles" in text
15
- ? renderAnnotatedString(text)
16
- : (text ?? children);
17
- return React.createElement("span", {
14
+ let content;
15
+ if (typeof text === "object" && text !== null && "spanStyles" in text) {
16
+ content = renderAnnotatedString(text);
17
+ }
18
+ else if (text !== undefined) {
19
+ content = [String(text)];
20
+ }
21
+ else {
22
+ content = children ?? [];
23
+ }
24
+ const finalStyle = {
25
+ ...textStyle,
26
+ ...clampStyle,
27
+ ...modProps.style,
28
+ };
29
+ if (color)
30
+ finalStyle.color = color;
31
+ else if (textStyle.color)
32
+ finalStyle.color = textStyle.color;
33
+ return jalvinCreateElement("span", {
18
34
  ...modProps,
19
- style: {
20
- ...textStyle,
21
- color: color ?? textStyle.color,
22
- ...clampStyle,
23
- ...modProps.style,
24
- },
35
+ style: finalStyle,
25
36
  }, content);
26
37
  }
27
38
  //# sourceMappingURL=text.js.map
package/dist/text.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"text.js","sourceRoot":"","sources":["../src/text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAqB,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEpE,OAAO,EAAwB,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAapF,2FAA2F;AAC3F,MAAM,UAAU,IAAI,CAAC,EACnB,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,KAAK,EACL,QAAQ,GACE;IACV,MAAM,QAAQ,GAAG,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAC3C,MAAM,SAAS,GAAkB,KAAK,CAAC,CAAC,CAAC,cAAc,CAAC,KAAqB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IACpF,MAAM,UAAU,GAAkB,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC;QACzD,OAAO,EAAE,aAAa;QACtB,eAAe,EAAE,QAAQ;QACzB,eAAe,EAAE,UAAU;QAC3B,QAAQ,EAAE,QAAQ;KACnB,CAAC,CAAC,CAAC,EAAE,CAAC;IAEP,MAAM,OAAO,GAAG,OAAO,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,IAAI,IAAI,YAAY,IAAI,IAAI;QAC/E,CAAC,CAAC,qBAAqB,CAAC,IAAI,CAAC;QAC7B,CAAC,CAAC,CAAC,IAAI,IAAI,QAAQ,CAAC,CAAC;IAEvB,OAAO,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE;QACjC,GAAG,QAAQ;QACX,KAAK,EAAE;YACL,GAAG,SAAS;YACZ,KAAK,EAAE,KAAK,IAAI,SAAS,CAAC,KAAK;YAC/B,GAAG,UAAU;YACb,GAAG,QAAQ,CAAC,KAAK;SAClB;KACF,EAAE,OAAO,CAAC,CAAC;AACd,CAAC"}
1
+ {"version":3,"file":"text.js","sourceRoot":"","sources":["../src/text.ts"],"names":[],"mappings":"AACA,OAAO,EAAqB,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACpE,OAAO,EAAwB,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AACpF,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAatD,2FAA2F;AAC3F,MAAM,UAAU,IAAI,CAAC,EACnB,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,KAAK,EACL,QAAQ,GACE;IACV,MAAM,QAAQ,GAAG,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAC3C,MAAM,SAAS,GAAG,KAAK,IAAK,KAAa,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,KAAqB,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;IAE3G,MAAM,UAAU,GAAwB,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC;QAC/D,OAAO,EAAE,aAAa;QACtB,eAAe,EAAE,QAAQ;QACzB,eAAe,EAAE,UAAU;QAC3B,QAAQ,EAAE,QAAQ;KACnB,CAAC,CAAC,CAAC,EAAE,CAAC;IAEP,IAAI,OAA6B,CAAC;IAClC,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,IAAI,IAAI,YAAY,IAAI,IAAI,EAAE,CAAC;QACtE,OAAO,GAAG,qBAAqB,CAAC,IAAI,CAAC,CAAC;IACxC,CAAC;SAAM,IAAI,IAAI,KAAK,SAAS,EAAE,CAAC;QAC9B,OAAO,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;IAC3B,CAAC;SAAM,CAAC;QACN,OAAO,GAAG,QAAQ,IAAI,EAAE,CAAC;IAC3B,CAAC;IAED,MAAM,UAAU,GAAkB;QAChC,GAAG,SAAS;QACZ,GAAG,UAAU;QACb,GAAG,QAAQ,CAAC,KAAK;KAClB,CAAC;IAEF,IAAI,KAAK;QAAE,UAAU,CAAC,KAAK,GAAG,KAAK,CAAC;SAC/B,IAAI,SAAS,CAAC,KAAK;QAAE,UAAU,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK,CAAC;IAE7D,OAAO,mBAAmB,CAAC,MAAM,EAAE;QACjC,GAAG,QAAQ;QACX,KAAK,EAAE,UAAU;KAClB,EAAE,OAAO,CAAC,CAAC;AACd,CAAC"}
@@ -1,4 +1,3 @@
1
- import React from "react";
2
1
  import { Modifier } from "./modifier.js";
3
2
  export interface TextAreaProps {
4
3
  value?: string;
@@ -14,9 +13,8 @@ export interface TextAreaProps {
14
13
  rows?: number;
15
14
  onFocus?: () => void;
16
15
  onBlur?: () => void;
17
- onKeyDown?: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;
18
16
  autoFocus?: boolean;
19
17
  }
20
18
  /** Multiline text input. */
21
- export declare function TextArea({ value, onValueChange, placeholder, modifier, enabled, readOnly, label, supportingText, isError, maxLength, rows, onFocus, onBlur, onKeyDown, autoFocus, }: TextAreaProps): React.ReactElement;
19
+ export declare function TextArea({ value, onValueChange, placeholder, modifier, enabled, readOnly, label, supportingText, isError, maxLength, rows, onFocus, onBlur, autoFocus, }: TextAreaProps): HTMLElement;
22
20
  //# sourceMappingURL=textarea.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../src/textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,mBAAmB,CAAC,KAAK,IAAI,CAAC;IAClE,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,4BAA4B;AAC5B,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,aAAa,EACb,WAAW,EACX,QAAQ,EACR,OAAc,EACd,QAAgB,EAChB,KAAK,EACL,cAAc,EACd,OAAe,EACf,SAAS,EACT,IAAQ,EACR,OAAO,EACP,MAAM,EACN,SAAS,EACT,SAAS,GACV,EAAE,aAAa,GAAG,KAAK,CAAC,YAAY,CAgDpC"}
1
+ {"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../src/textarea.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAGzC,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,4BAA4B;AAC5B,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,aAAa,EACb,WAAW,EACX,QAAQ,EACR,OAAc,EACd,QAAgB,EAChB,KAAK,EACL,cAAc,EACd,OAAe,EACf,SAAS,EACT,IAAQ,EACR,OAAO,EACP,MAAM,EACN,SAAS,GACV,EAAE,aAAa,GAAG,WAAW,CAoD7B"}
package/dist/textarea.js CHANGED
@@ -1,11 +1,11 @@
1
- import React from "react";
1
+ import { jalvinCreateElement } from "@jalvin/runtime";
2
2
  /** Multiline text input. */
3
- export function TextArea({ value, onValueChange, placeholder, modifier, enabled = true, readOnly = false, label, supportingText, isError = false, maxLength, rows = 4, onFocus, onBlur, onKeyDown, autoFocus, }) {
3
+ export function TextArea({ value, onValueChange, placeholder, modifier, enabled = true, readOnly = false, label, supportingText, isError = false, maxLength, rows = 4, onFocus, onBlur, autoFocus, }) {
4
4
  const modProps = modifier?.toProps() ?? {};
5
5
  const borderColor = isError ? "#b00020" : "#c4c4c4";
6
- const textArea = React.createElement("textarea", {
6
+ const textArea = jalvinCreateElement("textarea", {
7
7
  value,
8
- onChange: (e) => onValueChange?.(e.target.value),
8
+ onInput: (e) => onValueChange?.(e.target.value),
9
9
  placeholder,
10
10
  disabled: !enabled,
11
11
  readOnly,
@@ -13,7 +13,6 @@ export function TextArea({ value, onValueChange, placeholder, modifier, enabled
13
13
  rows,
14
14
  onFocus,
15
15
  onBlur,
16
- onKeyDown,
17
16
  autoFocus,
18
17
  style: {
19
18
  width: "100%",
@@ -29,17 +28,25 @@ export function TextArea({ value, onValueChange, placeholder, modifier, enabled
29
28
  resize: "vertical",
30
29
  lineHeight: 1.4,
31
30
  },
32
- });
31
+ }, []);
33
32
  if (!label && !supportingText) {
34
- return React.createElement("div", { ...modProps }, textArea);
33
+ return jalvinCreateElement("div", { ...modProps }, [textArea]);
35
34
  }
36
- return React.createElement("div", {
35
+ const containerChildren = [];
36
+ if (label) {
37
+ containerChildren.push(jalvinCreateElement("label", {
38
+ style: { fontSize: "0.875rem", fontWeight: 500, color: isError ? "#b00020" : "#5c5c5c" },
39
+ }, [document.createTextNode(label)]));
40
+ }
41
+ containerChildren.push(textArea);
42
+ if (supportingText) {
43
+ containerChildren.push(jalvinCreateElement("span", {
44
+ style: { fontSize: "0.75rem", color: isError ? "#b00020" : "#5c5c5c" },
45
+ }, [document.createTextNode(supportingText)]));
46
+ }
47
+ return jalvinCreateElement("div", {
37
48
  ...modProps,
38
49
  style: { display: "flex", flexDirection: "column", gap: "4px", ...modProps.style },
39
- }, label && React.createElement("label", {
40
- style: { fontSize: "0.875rem", fontWeight: 500, color: isError ? "#b00020" : "#5c5c5c" },
41
- }, label), textArea, supportingText && React.createElement("span", {
42
- style: { fontSize: "0.75rem", color: isError ? "#b00020" : "#5c5c5c" },
43
- }, supportingText));
50
+ }, containerChildren);
44
51
  }
45
52
  //# sourceMappingURL=textarea.js.map
@@ -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"}