@jalvin/ui 1.0.0 → 2.0.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.
- package/dist/button.js +13 -20
- package/dist/button.js.map +1 -1
- package/dist/colors.js +1 -4
- package/dist/colors.js.map +1 -1
- package/dist/image.js +7 -14
- package/dist/image.js.map +1 -1
- package/dist/index.js +10 -31
- package/dist/index.js.map +1 -1
- package/dist/input.js +7 -13
- package/dist/input.js.map +1 -1
- package/dist/layout.js +7 -15
- package/dist/layout.js.map +1 -1
- package/dist/modifier.js +1 -5
- package/dist/modifier.js.map +1 -1
- package/dist/spacer.js +5 -12
- package/dist/spacer.js.map +1 -1
- package/dist/surface.js +10 -18
- package/dist/surface.js.map +1 -1
- package/dist/text.js +5 -11
- package/dist/text.js.map +1 -1
- package/dist/typography.js +2 -6
- package/dist/typography.js.map +1 -1
- package/package.json +2 -3
package/dist/button.js
CHANGED
|
@@ -1,12 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Button = Button;
|
|
7
|
-
exports.IconButton = IconButton;
|
|
8
|
-
const react_1 = __importDefault(require("react"));
|
|
9
|
-
const colors_js_1 = require("./colors.js");
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Color } from "./colors.js";
|
|
10
3
|
const BASE = {
|
|
11
4
|
display: "inline-flex",
|
|
12
5
|
alignItems: "center",
|
|
@@ -25,28 +18,28 @@ const BASE = {
|
|
|
25
18
|
};
|
|
26
19
|
const VARIANT_STYLES = {
|
|
27
20
|
filled: {
|
|
28
|
-
backgroundColor:
|
|
29
|
-
color:
|
|
21
|
+
backgroundColor: Color.Primary,
|
|
22
|
+
color: Color.OnPrimary,
|
|
30
23
|
},
|
|
31
24
|
outlined: {
|
|
32
25
|
backgroundColor: "transparent",
|
|
33
|
-
color:
|
|
34
|
-
border: `1px solid ${
|
|
26
|
+
color: Color.Primary,
|
|
27
|
+
border: `1px solid ${Color.Primary}`,
|
|
35
28
|
},
|
|
36
29
|
text: {
|
|
37
30
|
backgroundColor: "transparent",
|
|
38
|
-
color:
|
|
31
|
+
color: Color.Primary,
|
|
39
32
|
padding: "8px 12px",
|
|
40
33
|
},
|
|
41
34
|
tonal: {
|
|
42
|
-
backgroundColor:
|
|
43
|
-
color:
|
|
35
|
+
backgroundColor: Color.PrimaryLight + "33",
|
|
36
|
+
color: Color.Primary,
|
|
44
37
|
},
|
|
45
38
|
};
|
|
46
39
|
/** Button — analogous to Compose's Button / OutlinedButton / TextButton. */
|
|
47
|
-
function Button({ text, children, onClick, modifier, variant = "filled", enabled = true, leadingIcon, trailingIcon, type = "button", }) {
|
|
40
|
+
export function Button({ text, children, onClick, modifier, variant = "filled", enabled = true, leadingIcon, trailingIcon, type = "button", }) {
|
|
48
41
|
const modProps = modifier?.toProps() ?? {};
|
|
49
|
-
return
|
|
42
|
+
return React.createElement("button", {
|
|
50
43
|
type,
|
|
51
44
|
onClick: enabled ? onClick : undefined,
|
|
52
45
|
disabled: !enabled,
|
|
@@ -60,9 +53,9 @@ function Button({ text, children, onClick, modifier, variant = "filled", enabled
|
|
|
60
53
|
}, leadingIcon, text ?? children, trailingIcon);
|
|
61
54
|
}
|
|
62
55
|
/** Icon-only circular button. */
|
|
63
|
-
function IconButton({ onClick, modifier, enabled = true, children, "aria-label": ariaLabel, }) {
|
|
56
|
+
export function IconButton({ onClick, modifier, enabled = true, children, "aria-label": ariaLabel, }) {
|
|
64
57
|
const modProps = modifier?.toProps() ?? {};
|
|
65
|
-
return
|
|
58
|
+
return React.createElement("button", {
|
|
66
59
|
type: "button",
|
|
67
60
|
onClick: enabled ? onClick : undefined,
|
|
68
61
|
disabled: !enabled,
|
package/dist/button.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","sourceRoot":"","sources":["../src/button.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"button.js","sourceRoot":"","sources":["../src/button.tsx"],"names":[],"mappings":"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"}
|
package/dist/colors.js
CHANGED
|
@@ -1,10 +1,7 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
// ─────────────────────────────────────────────────────────────────────────────
|
|
3
2
|
// Color — named color constants matching Material Design 3 + extras
|
|
4
3
|
// ─────────────────────────────────────────────────────────────────────────────
|
|
5
|
-
|
|
6
|
-
exports.Color = void 0;
|
|
7
|
-
exports.Color = {
|
|
4
|
+
export const Color = {
|
|
8
5
|
// Grays
|
|
9
6
|
White: "#ffffff",
|
|
10
7
|
Black: "#000000",
|
package/dist/colors.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"colors.js","sourceRoot":"","sources":["../src/colors.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"colors.js","sourceRoot":"","sources":["../src/colors.ts"],"names":[],"mappings":"AAAA,gFAAgF;AAChF,oEAAoE;AACpE,gFAAgF;AAEhF,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,QAAQ;IACR,KAAK,EAAS,SAAS;IACvB,KAAK,EAAS,SAAS;IACvB,WAAW,EAAG,aAAa;IAC3B,OAAO,EAAO,SAAS;IACvB,cAAc,EAAE,SAAS;IACzB,OAAO,EAAO,SAAS;IACvB,SAAS,EAAK,SAAS;IACvB,gBAAgB,EAAE,SAAS;IAE3B,UAAU;IACV,OAAO,EAAO,SAAS;IACvB,YAAY,EAAE,SAAS;IACvB,WAAW,EAAG,SAAS;IACvB,SAAS,EAAK,SAAS;IAEvB,YAAY;IACZ,SAAS,EAAK,SAAS;IACvB,cAAc,EAAE,SAAS;IACzB,WAAW,EAAG,SAAS;IAEvB,QAAQ;IACR,KAAK,EAAS,SAAS;IACvB,UAAU,EAAI,SAAS;IACvB,OAAO,EAAO,SAAS;IAEvB,UAAU;IACV,OAAO,EAAO,SAAS;IACvB,YAAY,EAAE,SAAS;IACvB,SAAS,EAAK,SAAS;IAEvB,UAAU;IACV,OAAO,EAAO,SAAS;IACvB,YAAY,EAAE,SAAS;IACvB,SAAS,EAAK,SAAS;CACf,CAAC"}
|
package/dist/image.js
CHANGED
|
@@ -1,11 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Image = Image;
|
|
7
|
-
exports.AsyncImage = AsyncImage;
|
|
8
|
-
const react_1 = __importDefault(require("react"));
|
|
1
|
+
import React from "react";
|
|
9
2
|
const CONTENT_SCALE = {
|
|
10
3
|
fill: "100% 100%",
|
|
11
4
|
fit: "contain",
|
|
@@ -13,9 +6,9 @@ const CONTENT_SCALE = {
|
|
|
13
6
|
none: "none",
|
|
14
7
|
};
|
|
15
8
|
/** Image element — analogous to Compose's Image. */
|
|
16
|
-
function Image({ src, alt = "", modifier, contentScale = "fit", onClick, }) {
|
|
9
|
+
export function Image({ src, alt = "", modifier, contentScale = "fit", onClick, }) {
|
|
17
10
|
const modProps = modifier?.toProps() ?? {};
|
|
18
|
-
return
|
|
11
|
+
return React.createElement("img", {
|
|
19
12
|
src,
|
|
20
13
|
alt,
|
|
21
14
|
onClick,
|
|
@@ -37,12 +30,12 @@ function Image({ src, alt = "", modifier, contentScale = "fit", onClick, }) {
|
|
|
37
30
|
* Image that handles loading/error states.
|
|
38
31
|
* Falls back to placeholder content on error.
|
|
39
32
|
*/
|
|
40
|
-
function AsyncImage({ src, alt, modifier, contentScale, onClick, loadingPlaceholder, errorPlaceholder, }) {
|
|
41
|
-
const [status, setStatus] =
|
|
33
|
+
export function AsyncImage({ src, alt, modifier, contentScale, onClick, loadingPlaceholder, errorPlaceholder, }) {
|
|
34
|
+
const [status, setStatus] = React.useState("loading");
|
|
42
35
|
if (status === "error" && errorPlaceholder) {
|
|
43
|
-
return
|
|
36
|
+
return React.createElement(React.Fragment, null, errorPlaceholder);
|
|
44
37
|
}
|
|
45
|
-
return
|
|
38
|
+
return React.createElement("span", { style: { position: "relative", display: "inline-block" } }, status === "loading" && loadingPlaceholder, React.createElement(Image, {
|
|
46
39
|
src,
|
|
47
40
|
alt: alt ?? "",
|
|
48
41
|
modifier,
|
package/dist/image.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"image.js","sourceRoot":"","sources":["../src/image.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"image.js","sourceRoot":"","sources":["../src/image.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,MAAM,aAAa,GAA4D;IAC7E,IAAI,EAAE,WAAW;IACjB,GAAG,EAAG,SAAS;IACf,IAAI,EAAE,OAAO;IACb,IAAI,EAAE,MAAM;CACb,CAAC;AAEF,oDAAoD;AACpD,MAAM,UAAU,KAAK,CAAC,EACpB,GAAG,EACH,GAAG,GAAG,EAAE,EACR,QAAQ,EACR,YAAY,GAAG,KAAK,EACpB,OAAO,GACI;IACX,MAAM,QAAQ,GAAG,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAC3C,OAAO,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;QAChC,GAAG;QACH,GAAG;QACH,OAAO;QACP,GAAG,QAAQ;QACX,KAAK,EAAE;YACL,SAAS,EAAE,CAAC,YAAY,KAAK,MAAM;gBACjC,CAAC,CAAC,MAAM;gBACR,CAAC,CAAC,YAAY,KAAK,KAAK;oBACtB,CAAC,CAAC,SAAS;oBACX,CAAC,CAAC,YAAY,KAAK,MAAM;wBACvB,CAAC,CAAC,OAAO;wBACT,CAAC,CAAC,MAAM,CAA+C;YAC7D,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;YACvC,GAAG,QAAQ,CAAC,KAAK;SAClB;KACF,CAAC,CAAC;AACL,CAAC;AAOD;;;GAGG;AACH,MAAM,UAAU,UAAU,CAAC,EACzB,GAAG,EACH,GAAG,EACH,QAAQ,EACR,YAAY,EACZ,OAAO,EACP,kBAAkB,EAClB,gBAAgB,GACA;IAChB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAA6B,SAAS,CAAC,CAAC;IAElF,IAAI,MAAM,KAAK,OAAO,IAAI,gBAAgB,EAAE,CAAC;QAC3C,OAAO,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,QAAQ,EAAE,IAAI,EAAE,gBAAgB,CAAC,CAAC;IACrE,CAAC;IAED,OAAO,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,cAAc,EAAE,EAAE,EAC7F,MAAM,KAAK,SAAS,IAAI,kBAAkB,EAC1C,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;QACzB,GAAG;QACH,GAAG,EAAE,GAAG,IAAI,EAAE;QACd,QAAQ;QACR,YAAY;QACZ,OAAO;KACR,CAAC,CAGH,CAAC;AACJ,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -1,43 +1,22 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
// @jalvin/ui — Compose-style React component library
|
|
3
2
|
//
|
|
4
3
|
// Usage example (in a .jalvin file):
|
|
5
4
|
// import { Column, Row, Text, Button, Modifier, Color } from "@jalvin/ui"
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
Object.defineProperty(exports, "Modifier", { enumerable: true, get: function () { return modifier_js_1.Modifier; } });
|
|
10
|
-
var colors_js_1 = require("./colors.js");
|
|
11
|
-
Object.defineProperty(exports, "Color", { enumerable: true, get: function () { return colors_js_1.Color; } });
|
|
12
|
-
var typography_js_1 = require("./typography.js");
|
|
13
|
-
Object.defineProperty(exports, "TextStyle", { enumerable: true, get: function () { return typography_js_1.TextStyle; } });
|
|
14
|
-
Object.defineProperty(exports, "textStyleToCSS", { enumerable: true, get: function () { return typography_js_1.textStyleToCSS; } });
|
|
5
|
+
export { Modifier } from "./modifier.js";
|
|
6
|
+
export { Color } from "./colors.js";
|
|
7
|
+
export { TextStyle, textStyleToCSS } from "./typography.js";
|
|
15
8
|
// Layout
|
|
16
|
-
|
|
17
|
-
Object.defineProperty(exports, "Column", { enumerable: true, get: function () { return layout_js_1.Column; } });
|
|
18
|
-
Object.defineProperty(exports, "Row", { enumerable: true, get: function () { return layout_js_1.Row; } });
|
|
19
|
-
Object.defineProperty(exports, "Box", { enumerable: true, get: function () { return layout_js_1.Box; } });
|
|
9
|
+
export { Column, Row, Box } from "./layout.js";
|
|
20
10
|
// Text
|
|
21
|
-
|
|
22
|
-
Object.defineProperty(exports, "Text", { enumerable: true, get: function () { return text_js_1.Text; } });
|
|
11
|
+
export { Text } from "./text.js";
|
|
23
12
|
// Buttons
|
|
24
|
-
|
|
25
|
-
Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return button_js_1.Button; } });
|
|
26
|
-
Object.defineProperty(exports, "IconButton", { enumerable: true, get: function () { return button_js_1.IconButton; } });
|
|
13
|
+
export { Button, IconButton } from "./button.js";
|
|
27
14
|
// Spacer & Divider
|
|
28
|
-
|
|
29
|
-
Object.defineProperty(exports, "Spacer", { enumerable: true, get: function () { return spacer_js_1.Spacer; } });
|
|
30
|
-
Object.defineProperty(exports, "Divider", { enumerable: true, get: function () { return spacer_js_1.Divider; } });
|
|
15
|
+
export { Spacer, Divider } from "./spacer.js";
|
|
31
16
|
// Input
|
|
32
|
-
|
|
33
|
-
Object.defineProperty(exports, "Input", { enumerable: true, get: function () { return input_js_1.Input; } });
|
|
17
|
+
export { Input } from "./input.js";
|
|
34
18
|
// Surfaces
|
|
35
|
-
|
|
36
|
-
Object.defineProperty(exports, "Card", { enumerable: true, get: function () { return surface_js_1.Card; } });
|
|
37
|
-
Object.defineProperty(exports, "Scaffold", { enumerable: true, get: function () { return surface_js_1.Scaffold; } });
|
|
38
|
-
Object.defineProperty(exports, "TopBar", { enumerable: true, get: function () { return surface_js_1.TopBar; } });
|
|
19
|
+
export { Card, Scaffold, TopBar } from "./surface.js";
|
|
39
20
|
// Image
|
|
40
|
-
|
|
41
|
-
Object.defineProperty(exports, "Image", { enumerable: true, get: function () { return image_js_1.Image; } });
|
|
42
|
-
Object.defineProperty(exports, "AsyncImage", { enumerable: true, get: function () { return image_js_1.AsyncImage; } });
|
|
21
|
+
export { Image, AsyncImage } from "./image.js";
|
|
43
22
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,qDAAqD;AACrD,EAAE;AACF,qCAAqC;AACrC,4EAA4E;AAE5E,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAGpC,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAG5D,SAAS;AACT,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAG/C,OAAO;AACP,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAGjC,UAAU;AACV,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAGjD,mBAAmB;AACnB,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAG9C,QAAQ;AACR,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAGnC,WAAW;AACX,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAGtD,QAAQ;AACR,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC"}
|
package/dist/input.js
CHANGED
|
@@ -1,15 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Input = Input;
|
|
7
|
-
const react_1 = __importDefault(require("react"));
|
|
1
|
+
import React from "react";
|
|
8
2
|
/** Text input — analogous to Compose's TextField / OutlinedTextField. */
|
|
9
|
-
function Input({ value, onValueChange, placeholder, modifier, enabled = true, readOnly = false, type = "text", label, supportingText, isError = false, maxLength, onFocus, onBlur, onKeyDown, autoFocus, }) {
|
|
3
|
+
export function Input({ value, onValueChange, placeholder, modifier, enabled = true, readOnly = false, type = "text", label, supportingText, isError = false, maxLength, onFocus, onBlur, onKeyDown, autoFocus, }) {
|
|
10
4
|
const modProps = modifier?.toProps() ?? {};
|
|
11
5
|
const borderColor = isError ? "#b00020" : "#c4c4c4";
|
|
12
|
-
const input =
|
|
6
|
+
const input = React.createElement("input", {
|
|
13
7
|
value,
|
|
14
8
|
onChange: (e) => onValueChange?.(e.target.value),
|
|
15
9
|
placeholder,
|
|
@@ -34,14 +28,14 @@ function Input({ value, onValueChange, placeholder, modifier, enabled = true, re
|
|
|
34
28
|
},
|
|
35
29
|
});
|
|
36
30
|
if (!label && !supportingText) {
|
|
37
|
-
return
|
|
31
|
+
return React.createElement("div", { ...modProps }, input);
|
|
38
32
|
}
|
|
39
|
-
return
|
|
33
|
+
return React.createElement("div", {
|
|
40
34
|
...modProps,
|
|
41
35
|
style: { display: "flex", flexDirection: "column", gap: "4px", ...modProps.style },
|
|
42
|
-
}, label &&
|
|
36
|
+
}, label && React.createElement("label", {
|
|
43
37
|
style: { fontSize: "0.875rem", fontWeight: 500, color: isError ? "#b00020" : "#5c5c5c" },
|
|
44
|
-
}, label), input, supportingText &&
|
|
38
|
+
}, label), input, supportingText && React.createElement("span", {
|
|
45
39
|
style: { fontSize: "0.75rem", color: isError ? "#b00020" : "#5c5c5c" },
|
|
46
40
|
}, supportingText));
|
|
47
41
|
}
|
package/dist/input.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input.js","sourceRoot":"","sources":["../src/input.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"input.js","sourceRoot":"","sources":["../src/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAqB1B,yEAAyE;AACzE,MAAM,UAAU,KAAK,CAAC,EACpB,KAAK,EACL,aAAa,EACb,WAAW,EACX,QAAQ,EACR,OAAO,GAAG,IAAI,EACd,QAAQ,GAAG,KAAK,EAChB,IAAI,GAAG,MAAM,EACb,KAAK,EACL,cAAc,EACd,OAAO,GAAG,KAAK,EACf,SAAS,EACT,OAAO,EACP,MAAM,EACN,SAAS,EACT,SAAS,GACE;IACX,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,KAAK,GAAG,KAAK,CAAC,aAAa,CAAC,OAAO,EAAE;QACzC,KAAK;QACL,QAAQ,EAAE,CAAC,CAAsC,EAAE,EAAE,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QACrF,WAAW;QACX,QAAQ,EAAE,CAAC,OAAO;QAClB,QAAQ;QACR,IAAI;QACJ,SAAS;QACT,OAAO;QACP,MAAM;QACN,SAAS;QACT,SAAS;QACT,KAAK,EAAE;YACL,KAAK,EAAE,MAAM;YACb,OAAO,EAAE,UAAU;YACnB,QAAQ,EAAE,MAAM;YAChB,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;SACjC;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,KAAK,CAAC,CAAC;IAC5D,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,KAAK,EACL,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"}
|
package/dist/layout.js
CHANGED
|
@@ -1,12 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Column = Column;
|
|
7
|
-
exports.Row = Row;
|
|
8
|
-
exports.Box = Box;
|
|
9
|
-
const react_1 = __importDefault(require("react"));
|
|
1
|
+
import React from "react";
|
|
10
2
|
function arrangementToJustify(a) {
|
|
11
3
|
switch (a) {
|
|
12
4
|
case "start": return "flex-start";
|
|
@@ -26,9 +18,9 @@ function alignmentToAlign(a) {
|
|
|
26
18
|
}
|
|
27
19
|
}
|
|
28
20
|
/** Vertical flex container — analogous to Compose's Column. */
|
|
29
|
-
function Column({ children, modifier, spacing, verticalArrangement = "start", horizontalAlignment = "start", }) {
|
|
21
|
+
export function Column({ children, modifier, spacing, verticalArrangement = "start", horizontalAlignment = "start", }) {
|
|
30
22
|
const modProps = modifier?.toProps() ?? {};
|
|
31
|
-
return
|
|
23
|
+
return React.createElement("div", {
|
|
32
24
|
...modProps,
|
|
33
25
|
style: {
|
|
34
26
|
display: "flex",
|
|
@@ -41,9 +33,9 @@ function Column({ children, modifier, spacing, verticalArrangement = "start", ho
|
|
|
41
33
|
}, children);
|
|
42
34
|
}
|
|
43
35
|
/** Horizontal flex container — analogous to Compose's Row. */
|
|
44
|
-
function Row({ children, modifier, spacing, horizontalArrangement = "start", verticalAlignment = "center", wrap = false, }) {
|
|
36
|
+
export function Row({ children, modifier, spacing, horizontalArrangement = "start", verticalAlignment = "center", wrap = false, }) {
|
|
45
37
|
const modProps = modifier?.toProps() ?? {};
|
|
46
|
-
return
|
|
38
|
+
return React.createElement("div", {
|
|
47
39
|
...modProps,
|
|
48
40
|
style: {
|
|
49
41
|
display: "flex",
|
|
@@ -57,7 +49,7 @@ function Row({ children, modifier, spacing, horizontalArrangement = "start", ver
|
|
|
57
49
|
}, children);
|
|
58
50
|
}
|
|
59
51
|
/** Positioned container — analogous to Compose's Box. */
|
|
60
|
-
function Box({ children, modifier, contentAlignment = "topStart", }) {
|
|
52
|
+
export function Box({ children, modifier, contentAlignment = "topStart", }) {
|
|
61
53
|
const modProps = modifier?.toProps() ?? {};
|
|
62
54
|
const [vertical, horizontal] = contentAlignment === "center"
|
|
63
55
|
? ["center", "center"]
|
|
@@ -66,7 +58,7 @@ function Box({ children, modifier, contentAlignment = "topStart", }) {
|
|
|
66
58
|
: contentAlignment.startsWith("bottom")
|
|
67
59
|
? ["flex-end", contentAlignment.includes("Center") ? "center" : contentAlignment.includes("End") ? "flex-end" : "flex-start"]
|
|
68
60
|
: ["center", contentAlignment.includes("Center") ? "center" : contentAlignment.includes("End") ? "flex-end" : "flex-start"];
|
|
69
|
-
return
|
|
61
|
+
return React.createElement("div", {
|
|
70
62
|
...modProps,
|
|
71
63
|
style: {
|
|
72
64
|
position: "relative",
|
package/dist/layout.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout.js","sourceRoot":"","sources":["../src/layout.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"layout.js","sourceRoot":"","sources":["../src/layout.tsx"],"names":[],"mappings":"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"}
|
package/dist/modifier.js
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
// ─────────────────────────────────────────────────────────────────────────────
|
|
3
2
|
// Modifier — fluent builder for layout, spacing, and styling
|
|
4
3
|
//
|
|
@@ -9,9 +8,7 @@
|
|
|
9
8
|
// Example:
|
|
10
9
|
// Modifier.fillMaxWidth().padding(16).background(Color.Surface)
|
|
11
10
|
// ─────────────────────────────────────────────────────────────────────────────
|
|
12
|
-
|
|
13
|
-
exports.Modifier = void 0;
|
|
14
|
-
class Modifier {
|
|
11
|
+
export class Modifier {
|
|
15
12
|
_styles;
|
|
16
13
|
_classNames;
|
|
17
14
|
constructor(styles = {}, classNames = []) {
|
|
@@ -156,5 +153,4 @@ class Modifier {
|
|
|
156
153
|
};
|
|
157
154
|
}
|
|
158
155
|
}
|
|
159
|
-
exports.Modifier = Modifier;
|
|
160
156
|
//# sourceMappingURL=modifier.js.map
|
package/dist/modifier.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modifier.js","sourceRoot":"","sources":["../src/modifier.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"modifier.js","sourceRoot":"","sources":["../src/modifier.ts"],"names":[],"mappings":"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"}
|
package/dist/spacer.js
CHANGED
|
@@ -1,15 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Spacer = Spacer;
|
|
7
|
-
exports.Divider = Divider;
|
|
8
|
-
const react_1 = __importDefault(require("react"));
|
|
1
|
+
import React from "react";
|
|
9
2
|
/** Flexible or fixed-size spacer — analogous to Compose's Spacer. */
|
|
10
|
-
function Spacer({ width, height, weight, modifier }) {
|
|
3
|
+
export function Spacer({ width, height, weight, modifier }) {
|
|
11
4
|
const modProps = modifier?.toProps() ?? {};
|
|
12
|
-
return
|
|
5
|
+
return React.createElement("div", {
|
|
13
6
|
...modProps,
|
|
14
7
|
style: {
|
|
15
8
|
flex: weight !== undefined ? weight : undefined,
|
|
@@ -21,10 +14,10 @@ function Spacer({ width, height, weight, modifier }) {
|
|
|
21
14
|
});
|
|
22
15
|
}
|
|
23
16
|
/** Thin line divider — analogous to Compose's Divider / VerticalDivider. */
|
|
24
|
-
function Divider({ modifier, color = "#c4c4c4", thickness = 1, orientation = "horizontal", }) {
|
|
17
|
+
export function Divider({ modifier, color = "#c4c4c4", thickness = 1, orientation = "horizontal", }) {
|
|
25
18
|
const modProps = modifier?.toProps() ?? {};
|
|
26
19
|
const isVertical = orientation === "vertical";
|
|
27
|
-
return
|
|
20
|
+
return React.createElement("div", {
|
|
28
21
|
...modProps,
|
|
29
22
|
role: "separator",
|
|
30
23
|
style: {
|
package/dist/spacer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spacer.js","sourceRoot":"","sources":["../src/spacer.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"spacer.js","sourceRoot":"","sources":["../src/spacer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,qEAAqE;AACrE,MAAM,UAAU,MAAM,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAe;IACrE,MAAM,QAAQ,GAAG,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAC3C,OAAO,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;QAChC,GAAG,QAAQ;QACX,KAAK,EAAE;YACL,IAAI,EAAE,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;YAC/C,KAAK,EAAE,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC;YACpF,MAAM,EAAE,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,GAAG,MAAM,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC;YACvF,UAAU,EAAE,CAAC;YACb,GAAG,QAAQ,CAAC,KAAK;SAClB;KACF,CAAC,CAAC;AACL,CAAC;AAUD,4EAA4E;AAC5E,MAAM,UAAU,OAAO,CAAC,EACtB,QAAQ,EACR,KAAK,GAAG,SAAS,EACjB,SAAS,GAAG,CAAC,EACb,WAAW,GAAG,YAAY,GACb;IACb,MAAM,QAAQ,GAAG,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAC3C,MAAM,UAAU,GAAG,WAAW,KAAK,UAAU,CAAC;IAC9C,OAAO,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;QAChC,GAAG,QAAQ;QACX,IAAI,EAAE,WAAW;QACjB,KAAK,EAAE;YACL,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,SAAS,IAAI,CAAC,CAAC,CAAC,MAAM;YAC7C,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,SAAS,IAAI;YAC9C,eAAe,EAAE,KAAK;YACtB,UAAU,EAAE,CAAC;YACb,GAAG,QAAQ,CAAC,KAAK;SAClB;KACF,CAAC,CAAC;AACL,CAAC"}
|
package/dist/surface.js
CHANGED
|
@@ -1,12 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Card = Card;
|
|
7
|
-
exports.Scaffold = Scaffold;
|
|
8
|
-
exports.TopBar = TopBar;
|
|
9
|
-
const react_1 = __importDefault(require("react"));
|
|
1
|
+
import React from "react";
|
|
10
2
|
const SHADOWS = [
|
|
11
3
|
"none",
|
|
12
4
|
"0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.08)",
|
|
@@ -14,9 +6,9 @@ const SHADOWS = [
|
|
|
14
6
|
"0 10px 20px rgba(0,0,0,0.12), 0 3px 6px rgba(0,0,0,0.09)",
|
|
15
7
|
];
|
|
16
8
|
/** Card container — analogous to Compose's Card / ElevatedCard. */
|
|
17
|
-
function Card({ children, modifier, onClick, elevation = 1, outlined = false, }) {
|
|
9
|
+
export function Card({ children, modifier, onClick, elevation = 1, outlined = false, }) {
|
|
18
10
|
const modProps = modifier?.toProps() ?? {};
|
|
19
|
-
return
|
|
11
|
+
return React.createElement("div", {
|
|
20
12
|
...modProps,
|
|
21
13
|
onClick,
|
|
22
14
|
role: onClick ? "button" : undefined,
|
|
@@ -36,9 +28,9 @@ function Card({ children, modifier, onClick, elevation = 1, outlined = false, })
|
|
|
36
28
|
* Full-page layout scaffold — analogous to Compose's Scaffold.
|
|
37
29
|
* Stacks topBar, scrollable content, and bottomBar.
|
|
38
30
|
*/
|
|
39
|
-
function Scaffold({ children, topBar, bottomBar, floatingActionButton, modifier, }) {
|
|
31
|
+
export function Scaffold({ children, topBar, bottomBar, floatingActionButton, modifier, }) {
|
|
40
32
|
const modProps = modifier?.toProps() ?? {};
|
|
41
|
-
return
|
|
33
|
+
return React.createElement("div", {
|
|
42
34
|
...modProps,
|
|
43
35
|
style: {
|
|
44
36
|
display: "flex",
|
|
@@ -48,16 +40,16 @@ function Scaffold({ children, topBar, bottomBar, floatingActionButton, modifier,
|
|
|
48
40
|
position: "relative",
|
|
49
41
|
...modProps.style,
|
|
50
42
|
},
|
|
51
|
-
}, topBar,
|
|
43
|
+
}, topBar, React.createElement("main", {
|
|
52
44
|
style: { flex: 1, overflow: "auto" },
|
|
53
|
-
}, children), bottomBar, floatingActionButton &&
|
|
45
|
+
}, children), bottomBar, floatingActionButton && React.createElement("div", {
|
|
54
46
|
style: { position: "absolute", bottom: "16px", right: "16px" },
|
|
55
47
|
}, floatingActionButton));
|
|
56
48
|
}
|
|
57
49
|
/** App top bar — analogous to Compose's TopAppBar. */
|
|
58
|
-
function TopBar({ title, navigationIcon, actions, modifier, }) {
|
|
50
|
+
export function TopBar({ title, navigationIcon, actions, modifier, }) {
|
|
59
51
|
const modProps = modifier?.toProps() ?? {};
|
|
60
|
-
return
|
|
52
|
+
return React.createElement("header", {
|
|
61
53
|
...modProps,
|
|
62
54
|
style: {
|
|
63
55
|
display: "flex",
|
|
@@ -70,7 +62,7 @@ function TopBar({ title, navigationIcon, actions, modifier, }) {
|
|
|
70
62
|
flexShrink: 0,
|
|
71
63
|
...modProps.style,
|
|
72
64
|
},
|
|
73
|
-
}, navigationIcon,
|
|
65
|
+
}, navigationIcon, React.createElement("span", {
|
|
74
66
|
style: { flex: 1, fontSize: "1.375rem", fontWeight: 500 },
|
|
75
67
|
}, title), actions);
|
|
76
68
|
}
|
package/dist/surface.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"surface.js","sourceRoot":"","sources":["../src/surface.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"surface.js","sourceRoot":"","sources":["../src/surface.tsx"],"names":[],"mappings":"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"}
|
package/dist/text.js
CHANGED
|
@@ -1,22 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Text = Text;
|
|
7
|
-
const react_1 = __importDefault(require("react"));
|
|
8
|
-
const typography_js_1 = require("./typography.js");
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { textStyleToCSS } from "./typography.js";
|
|
9
3
|
/** Text element — analogous to Compose's Text. */
|
|
10
|
-
function Text({ children, text, modifier, style, color, maxLines, as: Tag = "span", }) {
|
|
4
|
+
export function Text({ children, text, modifier, style, color, maxLines, as: Tag = "span", }) {
|
|
11
5
|
const modProps = modifier?.toProps() ?? {};
|
|
12
|
-
const textStyle = style ?
|
|
6
|
+
const textStyle = style ? textStyleToCSS(style) : {};
|
|
13
7
|
const clampStyle = maxLines !== undefined ? {
|
|
14
8
|
display: "-webkit-box",
|
|
15
9
|
WebkitLineClamp: maxLines,
|
|
16
10
|
WebkitBoxOrient: "vertical",
|
|
17
11
|
overflow: "hidden",
|
|
18
12
|
} : {};
|
|
19
|
-
return
|
|
13
|
+
return React.createElement(Tag, {
|
|
20
14
|
...modProps,
|
|
21
15
|
style: {
|
|
22
16
|
...textStyle,
|
package/dist/text.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text.js","sourceRoot":"","sources":["../src/text.tsx"],"names":[],"mappings":"
|
|
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,kDAAkD;AAClD,MAAM,UAAU,IAAI,CAAC,EACnB,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,KAAK,EACL,QAAQ,EACR,EAAE,EAAE,GAAG,GAAG,MAAM,GACN;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;IAEpF,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,OAAO,KAAK,CAAC,aAAa,CAAC,GAAG,EAAE;QAC9B,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,IAAI,IAAI,QAAQ,CAAC,CAAC;AACvB,CAAC"}
|
package/dist/typography.js
CHANGED
|
@@ -1,8 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.TextStyle = void 0;
|
|
4
|
-
exports.textStyleToCSS = textStyleToCSS;
|
|
5
|
-
exports.TextStyle = {
|
|
1
|
+
export const TextStyle = {
|
|
6
2
|
displayLarge: { fontSize: "3.5rem", fontWeight: 400, lineHeight: "4rem" },
|
|
7
3
|
displayMedium: { fontSize: "2.8rem", fontWeight: 400, lineHeight: "3.2rem" },
|
|
8
4
|
displaySmall: { fontSize: "2.25rem", fontWeight: 400, lineHeight: "2.75rem" },
|
|
@@ -28,7 +24,7 @@ exports.TextStyle = {
|
|
|
28
24
|
button: { fontSize: "0.875rem", fontWeight: 500, lineHeight: "1rem", letterSpacing: "0.031em" },
|
|
29
25
|
code: { fontSize: "0.875rem", fontWeight: "normal", lineHeight: "1.4rem", letterSpacing: "-0.01em" },
|
|
30
26
|
};
|
|
31
|
-
function textStyleToCSS(style) {
|
|
27
|
+
export function textStyleToCSS(style) {
|
|
32
28
|
return style;
|
|
33
29
|
}
|
|
34
30
|
//# sourceMappingURL=typography.js.map
|
package/dist/typography.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"typography.js","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"typography.js","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,14 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jalvin/ui",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"description": "Jalvin UI — Compose-style component library (Column, Row, Box, Button, Text, …)",
|
|
5
|
+
"type": "module",
|
|
5
6
|
"main": "dist/index.js",
|
|
6
|
-
"module": "dist/index.mjs",
|
|
7
7
|
"types": "dist/index.d.ts",
|
|
8
8
|
"exports": {
|
|
9
9
|
".": {
|
|
10
10
|
"import": "./dist/index.js",
|
|
11
|
-
"require": "./dist/index.js",
|
|
12
11
|
"types": "./dist/index.d.ts"
|
|
13
12
|
}
|
|
14
13
|
},
|