react-miui 0.2.0 → 0.4.2

package/CHANGELOG.md

@@ -6,6 +6,32 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 ## [UNRELEASED]
 (nothing yet)
 
+## [0.4.2] - 2021-11-27
+### Fixed
+- A lot of components crashing on unknown imports due to missing extensions
+
+## [0.4.1] - 2021-11-27
+### Fixed
+- Missing exports
+### Changed
+- Label and Value are subcomponents of Item
+- Header is subcomponent of List
+
+## [0.4.0] - 2021-11-27
+### Added
+- Support for splitting list item row into pieces
+- Label, Value and Header components for list item
+### Changed
+- List item has no default padding
+### Dev
+- demo files from npm package
+- some files added to gitignore
+
+## [0.3.0] - 2021-11-21
+### Added
+- Toggle component
+- Missing demo of `toolbar` variant of Header
+
 ## [0.2.0] - 2021-11-21
 ### Added
 - `back` icon

package/assets/forward.svg

@@ -0,0 +1 @@
+<svg baseProfile="basic" width="9" height="16" xmlns="http://www.w3.org/2000/svg"><path fill="#0FF" d="M.95.15Q.8 0 .55 0t-.4.15Q0 .3 0 .55t.15.4L7.35 8l-7.2 7.05Q0 15.2 0 15.4q0 .25.2.4.15.2.4.2.2 0 .35-.15L9 8 1 .2Q1 .15.95.15"/></svg>

package/dist/components/form/Checkbox.js

@@ -6,14 +6,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Checkbox = void 0;
 const react_1 = __importDefault(require("react"));
 const Checkbox_module_scss_1 = __importDefault(require("./Checkbox.module.scss"));
-const Checkmark_1 = require("../icons/Checkmark");
+const Checkmark_js_1 = require("../icons/Checkmark.js");
 const Checkbox = (props) => {
     const style = {};
     props.color && (style.color = props.color);
     return (react_1.default.createElement("label", { className: Checkbox_module_scss_1.default.checkbox },
         react_1.default.createElement("input", { type: "checkbox", name: props.name, onChange: props.onChange, checked: props.checked }),
         react_1.default.createElement("span", { style: style },
-            react_1.default.createElement(Checkmark_1.Checkmark, null)),
+            react_1.default.createElement(Checkmark_js_1.Checkmark, null)),
         react_1.default.createElement("span", null, props.children)));
 };
 exports.Checkbox = Checkbox;

package/dist/components/form/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/components/form/Checkbox.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,kFAA4C;AAC5C,kDAA+C;AAS/C,MAAM,QAAQ,GAAoB,CAAC,KAAK,EAAE,EAAE;IACxC,MAAM,KAAK,GAAwB,EAAE,CAAC;IACtC,KAAK,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC;IAE3C,OAAO,CACH,yCAAO,SAAS,EAAE,8BAAM,CAAC,QAAQ;QAC7B,yCAAO,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,GAAI;QAC/F,wCAAM,KAAK,EAAE,KAAK;YAAE,8BAAC,qBAAS,OAAG,CAAO;QACxC,4CAAO,KAAK,CAAC,QAAQ,CAAQ,CACzB,CACX,CAAC;AACN,CAAC,CAAC;AAEO,4BAAQ"}
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/components/form/Checkbox.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,kFAA4C;AAC5C,wDAAkD;AASlD,MAAM,QAAQ,GAAoB,CAAC,KAAK,EAAE,EAAE;IACxC,MAAM,KAAK,GAAwB,EAAE,CAAC;IACtC,KAAK,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC;IAE3C,OAAO,CACH,yCAAO,SAAS,EAAE,8BAAM,CAAC,QAAQ;QAC7B,yCAAO,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,GAAI;QAC/F,wCAAM,KAAK,EAAE,KAAK;YAAE,8BAAC,wBAAS,OAAG,CAAO;QACxC,4CAAO,KAAK,CAAC,QAAQ,CAAQ,CACzB,CACX,CAAC;AACN,CAAC,CAAC;AAEO,4BAAQ"}

package/dist/components/form/Toggle.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+interface Props {
+    onChange: (newState: boolean) => void;
+    state: boolean | null;
+}
+declare const Toggle: React.VFC<Props>;
+export { Toggle };
+//# sourceMappingURL=Toggle.d.ts.map

package/dist/components/form/Toggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.d.ts","sourceRoot":"","sources":["../../../src/components/form/Toggle.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAI3C,UAAU,KAAK;IACX,QAAQ,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,KAAK,EAAE,OAAO,GAAG,IAAI,CAAC;CACzB;AAED,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAoB5B,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/dist/{demo/components/form/Checkbox.js → components/form/Toggle.js}

@@ -18,14 +18,23 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CheckboxDemo = void 0;
+exports.Toggle = void 0;
 const react_1 = __importStar(require("react"));
-const index_js_1 = require("../../../index.js");
-const CheckboxDemo = (props) => {
-    const [v, setV] = react_1.useState(false);
-    const handleToggle = react_1.useCallback(() => { setV((prevV) => !prevV); }, []);
-    return (react_1.default.createElement(index_js_1.Checkbox, { name: "a", onChange: handleToggle, checked: v }, "I want something something"));
+const Toggle_module_scss_1 = __importDefault(require("./Toggle.module.scss"));
+const Toggle = (props) => {
+    const handleChange = react_1.useCallback((e) => {
+        if (props.state == null) {
+            return;
+        }
+        props.onChange(e.target.checked);
+    }, [props.onChange, props.state]);
+    return (react_1.default.createElement("label", { className: Toggle_module_scss_1.default.container },
+        react_1.default.createElement("input", { type: "checkbox", checked: Boolean(props.state), "data-undetermined": props.state == null, readOnly: props.state == null, onChange: handleChange }),
+        react_1.default.createElement("div", { className: Toggle_module_scss_1.default.toggle })));
 };
-exports.CheckboxDemo = CheckboxDemo;
-//# sourceMappingURL=Checkbox.js.map
+exports.Toggle = Toggle;
+//# sourceMappingURL=Toggle.js.map

package/dist/components/form/Toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.js","sourceRoot":"","sources":["../../../src/components/form/Toggle.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AACA,+CAA2C;AAE3C,8EAA0C;AAO1C,MAAM,MAAM,GAAqB,CAAC,KAAK,EAAE,EAAE;IACvC,MAAM,YAAY,GAAG,mBAAW,CAAC,CAAC,CAAgC,EAAE,EAAE;QAClE,IAAI,KAAK,CAAC,KAAK,IAAI,IAAI,EAAE;YACrB,OAAO;SACV;QACD,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IAElC,OAAO,CACH,yCAAO,SAAS,EAAE,4BAAM,CAAC,SAAS;QAC9B,yCACI,IAAI,EAAE,UAAU,EAChB,OAAO,EAAE,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,uBACV,KAAK,CAAC,KAAK,IAAI,IAAI,EACtC,QAAQ,EAAE,KAAK,CAAC,KAAK,IAAI,IAAI,EAC7B,QAAQ,EAAE,YAAY,GACxB;QACF,uCAAK,SAAS,EAAE,4BAAM,CAAC,MAAM,GAAI,CAC7B,CACX,CAAC;AACN,CAAC,CAAC;AAEO,wBAAM"}

package/dist/components/form/Toggle.module.scss

@@ -0,0 +1,46 @@
+.container {
+    --ratio-dimensions: 2.5;
+
+    display: inline-flex;
+    align-items: center;
+    border: 1px solid #ccc;
+    border-radius: 100px;
+    position: relative;
+    line-height: 0;
+    width: calc(110px / var(--ratio-dimensions));
+    height: calc(62px / var(--ratio-dimensions));
+    padding-left: calc(8px / var(--ratio-dimensions));
+    box-sizing: border-box;
+
+    input {
+        position: absolute;
+        width: 0;
+        height: 0;
+        overflow: hidden;
+        visibility: hidden;
+
+        &:not(:checked) + .toggle {
+            transform: translateX(0);
+            background: var(--toggle-handle-bg);
+            border-color: var(--toggle-handle-border);
+        }
+
+        &[data-undetermined=true] + .toggle {
+            transform: translateX(calc(24px / var(--ratio-dimensions)));
+            background: var(--toggle-handle-border);
+            border-color: var(--toggle-handle-border);
+        }
+    }
+}
+
+.toggle {
+    box-sizing: border-box;
+    border-radius: 100px;
+    display: inline-block;
+    width: calc(44px / var(--ratio-dimensions));
+    height: calc(44px / var(--ratio-dimensions));
+    border: calc(1px / var(--ratio-border)) solid var(--orange1-darker);
+    background: var(--orange1);
+    transition: transform 200ms, background-color 200ms, border-color 200ms;
+    transform: translateX(calc(48px / var(--ratio-dimensions)));
+}

package/dist/components/icons/Back.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Back.d.ts","sourceRoot":"","sources":["../../../src/components/icons/Back.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,UAAU,KAAK;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAM1B,CAAC;AAEF,OAAO,EAAE,IAAI,EAAE,CAAC"}
+{"version":3,"file":"Back.d.ts","sourceRoot":"","sources":["../../../src/components/icons/Back.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,UAAU,KAAK;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAY1B,CAAC;AAEF,OAAO,EAAE,IAAI,EAAE,CAAC"}

package/dist/components/icons/Back.js.map

@@ -1 +1 @@
-{"version":3,"file":"Back.js","sourceRoot":"","sources":["../../../src/components/icons/Back.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAM1B,MAAM,IAAI,GAAqB,CAAC,KAAK,EAAE,EAAE;IACrC,OAAO,CACH,uCAAK,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,4BAA4B,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS;QAC/G,wCAAM,IAAI,EAAE,cAAc,EAAE,CAAC,EAAE,mJAAmJ,GAAI,CACpL,CACT,CAAC;AACN,CAAC,CAAC;AAEO,oBAAI"}
+{"version":3,"file":"Back.js","sourceRoot":"","sources":["../../../src/components/icons/Back.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAM1B,MAAM,IAAI,GAAqB,CAAC,KAAK,EAAE,EAAE;IACrC,OAAO,CACH,uCACI,KAAK,EAAE,GAAG,EACV,MAAM,EAAE,IAAI,EACZ,OAAO,EAAE,UAAU,EACnB,KAAK,EAAE,4BAA4B,EACnC,SAAS,EAAE,KAAK,CAAC,SAAS;QAE1B,wCAAM,IAAI,EAAE,cAAc,EAAE,CAAC,EAAE,mJAAmJ,GAAI,CACpL,CACT,CAAC;AACN,CAAC,CAAC;AAEO,oBAAI"}

package/dist/components/icons/Forward.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+interface Props {
+    className?: string;
+}
+declare const Forward: React.VFC<Props>;
+export { Forward };
+//# sourceMappingURL=Forward.d.ts.map

package/dist/components/icons/Forward.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Forward.d.ts","sourceRoot":"","sources":["../../../src/components/icons/Forward.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,UAAU,KAAK;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,KAAK,CAY7B,CAAC;AAEF,OAAO,EAAE,OAAO,EAAE,CAAC"}

package/dist/components/icons/Forward.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Forward = void 0;
+const react_1 = __importDefault(require("react"));
+const Forward = (props) => {
+    return (react_1.default.createElement("svg", { width: "9", height: "16", viewBox: "0 0 9 16", xmlns: "http://www.w3.org/2000/svg", className: props.className },
+        react_1.default.createElement("path", { fill: "currentColor", d: "M.95.15Q.8 0 .55 0t-.4.15Q0 .3 0 .55t.15.4L7.35 8l-7.2 7.05Q0 15.2 0 15.4q0 .25.2.4.15.2.4.2.2 0 .35-.15L9 8 1 .2Q1 .15.95.15" })));
+};
+exports.Forward = Forward;
+//# sourceMappingURL=Forward.js.map

package/dist/components/icons/Forward.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Forward.js","sourceRoot":"","sources":["../../../src/components/icons/Forward.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAM1B,MAAM,OAAO,GAAqB,CAAC,KAAK,EAAE,EAAE;IACxC,OAAO,CACH,uCACI,KAAK,EAAE,GAAG,EACV,MAAM,EAAE,IAAI,EACZ,OAAO,EAAE,UAAU,EACnB,KAAK,EAAE,4BAA4B,EACnC,SAAS,EAAE,KAAK,CAAC,SAAS;QAE1B,wCAAM,IAAI,EAAE,cAAc,EAAE,CAAC,EAAE,+HAA+H,GAAI,CAChK,CACT,CAAC;AACN,CAAC,CAAC;AAEO,0BAAO"}

package/dist/components/icons/Icon.d.ts

@@ -1,7 +1,8 @@
 import React from "react";
 declare enum ICON {
     checkmark = "checkmark",
-    back = "back"
+    back = "back",
+    forward = "forward"
 }
 interface Props {
     name: ICON;

package/dist/components/icons/Icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/Icon.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,aAAK,IAAI;IACL,SAAS,cAAc;IACvB,IAAI,SAAS;CAChB;AAED,UAAU,KAAK;IACX,IAAI,EAAE,IAAI,CAAC;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAOD,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAMzB,CAAC;AAEF,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC"}
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../src/components/icons/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,aAAK,IAAI;IACL,SAAS,cAAc;IACvB,IAAI,SAAS;IACb,OAAO,YAAY;CACtB;AAED,UAAU,KAAK;IACX,IAAI,EAAE,IAAI,CAAC;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAQD,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAMzB,CAAC;AAEF,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC"}

package/dist/components/icons/Icon.js

@@ -16,17 +16,20 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ICON = exports.Icon = void 0;
 const react_1 = __importDefault(require("react"));
-const Checkmark_1 = require("./Checkmark");
-const Back_1 = require("./Back");
+const Checkmark_js_1 = require("./Checkmark.js");
+const Back_js_1 = require("./Back.js");
+const Forward_js_1 = require("./Forward.js");
 var ICON;
 (function (ICON) {
     ICON["checkmark"] = "checkmark";
     ICON["back"] = "back";
+    ICON["forward"] = "forward";
 })(ICON || (ICON = {}));
 exports.ICON = ICON;
 const iconsMap = new Map([
-    [ICON.checkmark, Checkmark_1.Checkmark],
-    [ICON.back, Back_1.Back],
+    [ICON.checkmark, Checkmark_js_1.Checkmark],
+    [ICON.back, Back_js_1.Back],
+    [ICON.forward, Forward_js_1.Forward],
 ]);
 const Icon = (_a) => {
     var { name: iconName } = _a, props = __rest(_a, ["name"]);

package/dist/components/icons/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../src/components/icons/Icon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAEA,kDAA0B;AAC1B,2CAAwC;AACxC,iCAA8B;AAE9B,IAAK,IAGJ;AAHD,WAAK,IAAI;IACL,+BAAuB,CAAA;IACvB,qBAAa,CAAA;AACjB,CAAC,EAHI,IAAI,KAAJ,IAAI,QAGR;AAoBc,oBAAI;AAbnB,MAAM,QAAQ,GAAG,IAAI,GAAG,CAAqB;IACzC,CAAC,IAAI,CAAC,SAAS,EAAE,qBAAS,CAAC;IAC3B,CAAC,IAAI,CAAC,IAAI,EAAE,WAAI,CAAC;CACpB,CAAC,CAAC;AAEH,MAAM,IAAI,GAAoB,CAAC,EAA4B,EAAE,EAAE;QAAhC,EAAE,IAAI,EAAE,QAAQ,OAAY,EAAP,KAAK,cAA1B,QAA4B,CAAF;IACrD,MAAM,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IACjC,IAAI,CAAC,CAAC,EAAE;QACJ,MAAM,IAAI,SAAS,CAAC,gBAAgB,GAAG,QAAQ,CAAC,CAAC;KACpD;IACD,OAAO,8BAAC,CAAC,oBAAK,KAAK,EAAI,CAAC;AAC5B,CAAC,CAAC;AAEO,oBAAI"}
+{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../src/components/icons/Icon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAG1B,iDAA2C;AAC3C,uCAAiC;AACjC,6CAAuC;AAEvC,IAAK,IAIJ;AAJD,WAAK,IAAI;IACL,+BAAuB,CAAA;IACvB,qBAAa,CAAA;IACb,2BAAmB,CAAA;AACvB,CAAC,EAJI,IAAI,KAAJ,IAAI,QAIR;AAqBc,oBAAI;AAdnB,MAAM,QAAQ,GAAG,IAAI,GAAG,CAAqB;IACzC,CAAC,IAAI,CAAC,SAAS,EAAE,wBAAS,CAAC;IAC3B,CAAC,IAAI,CAAC,IAAI,EAAE,cAAI,CAAC;IACjB,CAAC,IAAI,CAAC,OAAO,EAAE,oBAAO,CAAC;CAC1B,CAAC,CAAC;AAEH,MAAM,IAAI,GAAoB,CAAC,EAA4B,EAAE,EAAE;QAAhC,EAAE,IAAI,EAAE,QAAQ,OAAY,EAAP,KAAK,cAA1B,QAA4B,CAAF;IACrD,MAAM,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IACjC,IAAI,CAAC,CAAC,EAAE;QACJ,MAAM,IAAI,SAAS,CAAC,gBAAgB,GAAG,QAAQ,CAAC,CAAC;KACpD;IACD,OAAO,8BAAC,CAAC,oBAAK,KAAK,EAAI,CAAC;AAC5B,CAAC,CAAC;AAEO,oBAAI"}

package/dist/components/layout/header/Header.js

@@ -7,15 +7,15 @@ exports.Header = void 0;
 const react_1 = __importDefault(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const Header_module_scss_1 = __importDefault(require("./Header.module.scss"));
-const Action_1 = require("../../ui/action/Action");
-const EqualActions_1 = require("../../ui/action/EqualActions");
+const Action_js_1 = require("../../ui/action/Action.js");
+const EqualActions_js_1 = require("../../ui/action/EqualActions.js");
 const Header = (props) => {
     const { center, children, variant, position = "top" } = props;
     let justActions = false;
     if (position === "top" || position === "bottom") {
         const chld = react_1.default.Children.toArray(props.children);
         justActions = chld.every(c => {
-            return c && typeof c === "object" && "type" in c && c.type === Action_1.Action;
+            return c && typeof c === "object" && "type" in c && c.type === Action_js_1.Action;
         });
     }
     const cls = classnames_1.default(Header_module_scss_1.default.header, {
@@ -24,7 +24,7 @@ const Header = (props) => {
     }, Header_module_scss_1.default[`header--${position}`], props.className);
     let contents = children;
     if (justActions) {
-        contents = react_1.default.createElement(EqualActions_1.EqualActions, { className: Header_module_scss_1.default.actions }, contents);
+        contents = react_1.default.createElement(EqualActions_js_1.EqualActions, { className: Header_module_scss_1.default.actions }, contents);
     }
     let before;
     if (props.before != null) {

package/dist/components/layout/header/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../../src/components/layout/header/Header.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,4DAAoC;AAGpC,8EAA0C;AAC1C,mDAAgD;AAChD,+DAA4D;AAgB5D,MAAM,MAAM,GAAoB,CAAC,KAAK,EAAE,EAAE;IACtC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,GAAG,KAAK,EAAE,GAAG,KAAK,CAAC;IAE9D,IAAI,WAAW,GAAG,KAAK,CAAC;IACxB,IAAI,QAAQ,KAAK,KAAK,IAAI,QAAQ,KAAK,QAAQ,EAAE;QAC7C,MAAM,IAAI,GAAG,eAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QACpD,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE;YACzB,OAAO,CAAC,IAAI,OAAO,CAAC,KAAK,QAAQ,IAAI,MAAM,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,eAAM,CAAC;QAC1E,CAAC,CAAC,CAAC;KACN;IAED,MAAM,GAAG,GAAG,oBAAU,CAAC,4BAAM,CAAC,MAAM,EAAE;QAClC,CAAC,4BAAM,CAAC,gBAAgB,CAAC,CAAC,EAAE,MAAM;QAClC,CAAC,4BAAM,CAAC,iBAAiB,CAAC,CAAC,EAAE,OAAO,KAAK,SAAS;KACrD,EAAE,4BAAM,CAAC,WAAW,QAAQ,EAAE,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAEnD,IAAI,QAAQ,GAAG,QAAQ,CAAC;IACxB,IAAI,WAAW,EAAE;QACb,QAAQ,GAAG,8BAAC,2BAAY,IAAC,SAAS,EAAE,4BAAM,CAAC,OAAO,IAAG,QAAQ,CAAgB,CAAC;KACjF;IAED,IAAI,MAAiB,CAAC;IACtB,IAAI,KAAK,CAAC,MAAM,IAAI,IAAI,EAAE;QACtB,MAAM,GAAG,uCAAK,SAAS,EAAE,4BAAM,CAAC,MAAM,IAAG,KAAK,CAAC,MAAM,CAAO,CAAC;KAChE;IAED,IAAI,KAAgB,CAAC;IACrB,IAAI,KAAK,CAAC,KAAK,IAAI,IAAI,EAAE;QACrB,KAAK,GAAG,uCAAK,SAAS,EAAE,4BAAM,CAAC,KAAK,IAAG,KAAK,CAAC,KAAK,CAAO,CAAC;KAC7D;IAED,OAAO,CACH,uCAAK,SAAS,EAAE,GAAG;QACd,MAAM;QACP,uCAAK,SAAS,EAAE,4BAAM,CAAC,QAAQ,IAC1B,QAAQ,CACP;QACL,KAAK,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAEO,wBAAM"}
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../../src/components/layout/header/Header.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,4DAAoC;AAGpC,8EAA0C;AAC1C,yDAAmD;AACnD,qEAA+D;AAgB/D,MAAM,MAAM,GAAoB,CAAC,KAAK,EAAE,EAAE;IACtC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,GAAG,KAAK,EAAE,GAAG,KAAK,CAAC;IAE9D,IAAI,WAAW,GAAG,KAAK,CAAC;IACxB,IAAI,QAAQ,KAAK,KAAK,IAAI,QAAQ,KAAK,QAAQ,EAAE;QAC7C,MAAM,IAAI,GAAG,eAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QACpD,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE;YACzB,OAAO,CAAC,IAAI,OAAO,CAAC,KAAK,QAAQ,IAAI,MAAM,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,kBAAM,CAAC;QAC1E,CAAC,CAAC,CAAC;KACN;IAED,MAAM,GAAG,GAAG,oBAAU,CAAC,4BAAM,CAAC,MAAM,EAAE;QAClC,CAAC,4BAAM,CAAC,gBAAgB,CAAC,CAAC,EAAE,MAAM;QAClC,CAAC,4BAAM,CAAC,iBAAiB,CAAC,CAAC,EAAE,OAAO,KAAK,SAAS;KACrD,EAAE,4BAAM,CAAC,WAAW,QAAQ,EAAE,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAEnD,IAAI,QAAQ,GAAG,QAAQ,CAAC;IACxB,IAAI,WAAW,EAAE;QACb,QAAQ,GAAG,8BAAC,8BAAY,IAAC,SAAS,EAAE,4BAAM,CAAC,OAAO,IAAG,QAAQ,CAAgB,CAAC;KACjF;IAED,IAAI,MAAiB,CAAC;IACtB,IAAI,KAAK,CAAC,MAAM,IAAI,IAAI,EAAE;QACtB,MAAM,GAAG,uCAAK,SAAS,EAAE,4BAAM,CAAC,MAAM,IAAG,KAAK,CAAC,MAAM,CAAO,CAAC;KAChE;IAED,IAAI,KAAgB,CAAC;IACrB,IAAI,KAAK,CAAC,KAAK,IAAI,IAAI,EAAE;QACrB,KAAK,GAAG,uCAAK,SAAS,EAAE,4BAAM,CAAC,KAAK,IAAG,KAAK,CAAC,KAAK,CAAO,CAAC;KAC7D;IAED,OAAO,CACH,uCAAK,SAAS,EAAE,GAAG;QACd,MAAM;QACP,uCAAK,SAAS,EAAE,4BAAM,CAAC,QAAQ,IAC1B,QAAQ,CACP;QACL,KAAK,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAEO,wBAAM"}

package/dist/components/layout/list/Header.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+declare const Header: React.FC;
+export { Header };
+//# sourceMappingURL=Header.d.ts.map

package/dist/components/layout/list/Header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/list/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAOnB,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/dist/components/layout/list/Header.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Header = void 0;
+const react_1 = __importDefault(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const Item_module_scss_1 = __importDefault(require("./Item.module.scss"));
+const Header_module_scss_1 = __importDefault(require("./Header.module.scss"));
+const Header = (props) => {
+    return (react_1.default.createElement("li", { className: classnames_1.default(Item_module_scss_1.default.item, Header_module_scss_1.default.header) },
+        react_1.default.createElement("div", null, props.children)));
+};
+exports.Header = Header;
+//# sourceMappingURL=Header.js.map

package/dist/components/layout/list/Header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../../src/components/layout/list/Header.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,4DAAoC;AAEpC,0EAAwC;AACxC,8EAAgD;AAEhD,MAAM,MAAM,GAAa,CAAC,KAAK,EAAE,EAAE;IAE/B,OAAO,CACH,sCAAI,SAAS,EAAE,oBAAU,CAAC,0BAAM,CAAC,IAAI,EAAE,4BAAY,CAAC,MAAM,CAAC;QACvD,2CAAM,KAAK,CAAC,QAAQ,CAAO,CAC1B,CACR,CAAC;AACN,CAAC,CAAC;AAEO,wBAAM"}

package/dist/components/layout/list/Header.module.scss

@@ -0,0 +1,8 @@
+.header > * {
+    padding-top: calc(80px / var(--ratio-dimensions));
+    padding-bottom: calc(40px / var(--ratio-dimensions));
+
+    font-size: calc(26px / var(--ratio-font));
+    color: var(--sub);
+    text-transform: uppercase;
+}

package/dist/components/layout/list/Item.d.ts

@@ -1,4 +1,6 @@
 import React from "react";
+import { Value } from "./Value.js";
+import { Label } from "./Label.js";
 interface LinkProps {
     href: string;
 }
@@ -8,7 +10,12 @@ interface Props {
     onClick?: () => void;
     className?: string;
     Link?: React.ComponentClass<LinkProps> | React.FC<LinkProps>;
+    ratio?: string;
 }
-declare const Item: React.FC<Props>;
+interface SubComponents {
+    Label: typeof Label;
+    Value: typeof Value;
+}
+declare const Item: React.FC<Props> & SubComponents;
 export { Item };
 //# sourceMappingURL=Item.d.ts.map

package/dist/components/layout/list/Item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Item.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/list/Item.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,SAAS;IACf,IAAI,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,KAAK;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;CAChE;AAED,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA8BzB,CAAC;AAEF,OAAO,EAAE,IAAI,EAAE,CAAC"}
+{"version":3,"file":"Item.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/list/Item.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,UAAU,SAAS;IACf,IAAI,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,KAAK;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;IAC7D,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,aAAa;IACnB,KAAK,EAAE,OAAO,KAAK,CAAC;IACpB,KAAK,EAAE,OAAO,KAAK,CAAC;CACvB;AAGD,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,aA6C7B,CAAC;AAKF,OAAO,EAAE,IAAI,EAAE,CAAC"}

package/dist/components/layout/list/Item.js

@@ -18,18 +18,32 @@ exports.Item = void 0;
 const react_1 = __importDefault(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const Item_module_scss_1 = __importDefault(require("./Item.module.scss"));
+const Value_js_1 = require("./Value.js");
+const Label_js_1 = require("./Label.js");
 const Item = (props) => {
-    const { className, children, href, to, onClick, Link } = props, restProps = __rest(props, ["className", "children", "href", "to", "onClick", "Link"]);
+    const { className, children, href, to, onClick, Link, ratio } = props, restProps = __rest(props, ["className", "children", "href", "to", "onClick", "Link", "ratio"]);
     const cls = classnames_1.default(Item_module_scss_1.default.item, className);
     const liProps = {
         className: cls,
     };
+    const r = ratio ? ratio.split("/") : [];
+    const ren = react_1.default.Children.map(props.children, (child, index) => {
+        let flex = undefined;
+        if (!r.length && child && typeof child === "object" && "type" in child && child.type === Value_js_1.Value) {
+            return child;
+        }
+        if (index in r) {
+            flex = r[index];
+        }
+        return react_1.default.createElement("div", { style: { flex } }, child);
+    });
     if (to) {
         if (!Link) {
             throw new TypeError("`to` prop given without `Link` component");
         }
         return react_1.default.createElement("li", Object.assign({}, liProps),
-            react_1.default.createElement(Link, Object.assign({ href: to }, restProps), children));
+            react_1.default.createElement(Link, Object.assign({ href: to }, restProps),
+                react_1.default.createElement("a", { className: Item_module_scss_1.default.content }, ren)));
     }
     if (href) {
         const aProps = Object.assign({}, restProps);
@@ -37,14 +51,16 @@ const Item = (props) => {
             aProps.onClick = onClick;
         }
         return react_1.default.createElement("li", Object.assign({}, liProps),
-            react_1.default.createElement("a", Object.assign({ href: href }, aProps), children));
+            react_1.default.createElement("a", Object.assign({ href: href }, aProps, { className: Item_module_scss_1.default.content }), ren));
     }
     if (onClick) {
         return (react_1.default.createElement("li", Object.assign({}, liProps),
-            react_1.default.createElement("button", Object.assign({ className: Item_module_scss_1.default.button, onClick: props.onClick }, restProps), children)));
+            react_1.default.createElement("button", Object.assign({ className: classnames_1.default(Item_module_scss_1.default.button, Item_module_scss_1.default.content), onClick: props.onClick }, restProps), ren)));
     }
     return react_1.default.createElement("li", Object.assign({}, liProps),
-        react_1.default.createElement("div", Object.assign({}, restProps), children));
+        react_1.default.createElement("div", Object.assign({}, restProps, { className: Item_module_scss_1.default.content }), ren));
 };
 exports.Item = Item;
+Item.Label = Label_js_1.Label;
+Item.Value = Value_js_1.Value;
 //# sourceMappingURL=Item.js.map

package/dist/components/layout/list/Item.js.map

@@ -1 +1 @@
-{"version":3,"file":"Item.js","sourceRoot":"","sources":["../../../../src/components/layout/list/Item.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,4DAAoC;AAEpC,0EAAwC;AAcxC,MAAM,IAAI,GAAoB,CAAC,KAAK,EAAE,EAAE;IACpC,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,KAAmB,KAAK,EAAnB,SAAS,UAAK,KAAK,EAAtE,0DAA8D,CAAQ,CAAC;IAC7E,MAAM,GAAG,GAAG,oBAAU,CAAC,0BAAM,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;IAE/C,MAAM,OAAO,GAAG;QACZ,SAAS,EAAE,GAAG;KACjB,CAAC;IAEF,IAAI,EAAE,EAAE;QACJ,IAAI,CAAC,IAAI,EAAE;YACP,MAAM,IAAI,SAAS,CAAC,0CAA0C,CAAC,CAAC;SACnE;QAED,OAAO,sDAAQ,OAAO;YAAE,8BAAC,IAAI,kBAAC,IAAI,EAAE,EAAE,IAAM,SAAS,GAAG,QAAQ,CAAQ,CAAK,CAAC;KACjF;IACD,IAAI,IAAI,EAAE;QACN,MAAM,MAAM,qBAA0D,SAAS,CAAE,CAAC;QAClF,IAAI,OAAO,EAAE;YACT,MAAM,CAAC,OAAO,GAAG,OAAO,CAAC;SAC5B;QACD,OAAO,sDAAQ,OAAO;YAAE,mDAAG,IAAI,EAAE,IAAI,IAAM,MAAM,GAAG,QAAQ,CAAK,CAAK,CAAC;KAC1E;IACD,IAAI,OAAO,EAAE;QACT,OAAO,CACH,sDAAQ,OAAO;YACX,wDAAQ,SAAS,EAAE,0BAAM,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,IAAM,SAAS,GAAG,QAAQ,CAAU,CAC3F,CACR,CAAC;KACL;IACD,OAAO,sDAAQ,OAAO;QAAE,uDAAS,SAAS,GAAG,QAAQ,CAAO,CAAK,CAAC;AACtE,CAAC,CAAC;AAEO,oBAAI"}
+{"version":3,"file":"Item.js","sourceRoot":"","sources":["../../../../src/components/layout/list/Item.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,4DAAoC;AAEpC,0EAAwC;AACxC,yCAAmC;AACnC,yCAAmC;AAqBnC,MAAM,IAAI,GAAoC,CAAC,KAAK,EAAE,EAAE;IACpD,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,KAAmB,KAAK,EAAnB,SAAS,UAAK,KAAK,EAA7E,mEAAqE,CAAQ,CAAC;IACpF,MAAM,GAAG,GAAG,oBAAU,CAAC,0BAAM,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;IAE/C,MAAM,OAAO,GAAG;QACZ,SAAS,EAAE,GAAG;KACjB,CAAC;IAEF,MAAM,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAExC,MAAM,GAAG,GAAG,eAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;QAC5D,IAAI,IAAI,GAAG,SAAS,CAAC;QACrB,IAAI,CAAC,CAAC,CAAC,MAAM,IAAI,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,MAAM,IAAI,KAAK,IAAI,KAAK,CAAC,IAAI,KAAK,gBAAK,EAAE;YAC5F,OAAO,KAAK,CAAC;SAChB;QACD,IAAI,KAAK,IAAI,CAAC,EAAE;YACZ,IAAI,GAAG,CAAC,CAAC,KAAK,CAAC,CAAC;SACnB;QACD,OAAO,uCAAK,KAAK,EAAE,EAAE,IAAI,EAAE,IAAG,KAAK,CAAO,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEH,IAAI,EAAE,EAAE;QACJ,IAAI,CAAC,IAAI,EAAE;YACP,MAAM,IAAI,SAAS,CAAC,0CAA0C,CAAC,CAAC;SACnE;QAED,OAAO,sDAAQ,OAAO;YAAE,8BAAC,IAAI,kBAAC,IAAI,EAAE,EAAE,IAAM,SAAS;gBAAE,qCAAG,SAAS,EAAE,0BAAM,CAAC,OAAO,IAAG,GAAG,CAAK,CAAO,CAAK,CAAC;KAC9G;IACD,IAAI,IAAI,EAAE;QACN,MAAM,MAAM,qBAA0D,SAAS,CAAE,CAAC;QAClF,IAAI,OAAO,EAAE;YACT,MAAM,CAAC,OAAO,GAAG,OAAO,CAAC;SAC5B;QACD,OAAO,sDAAQ,OAAO;YAAE,mDAAG,IAAI,EAAE,IAAI,IAAM,MAAM,IAAE,SAAS,EAAE,0BAAM,CAAC,OAAO,KAAG,GAAG,CAAK,CAAK,CAAC;KAChG;IACD,IAAI,OAAO,EAAE;QACT,OAAO,CACH,sDAAQ,OAAO;YACX,wDAAQ,SAAS,EAAE,oBAAU,CAAC,0BAAM,CAAC,MAAM,EAAE,0BAAM,CAAC,OAAO,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,IAAK,SAAS,GAC7F,GAAG,CACC,CACR,CACR,CAAC;KACL;IACD,OAAO,sDAAQ,OAAO;QAAE,uDAAS,SAAS,IAAE,SAAS,EAAE,0BAAM,CAAC,OAAO,KAAG,GAAG,CAAO,CAAK,CAAC;AAC5F,CAAC,CAAC;AAKO,oBAAI;AAHb,IAAI,CAAC,KAAK,GAAG,gBAAK,CAAC;AACnB,IAAI,CAAC,KAAK,GAAG,gBAAK,CAAC"}

package/dist/components/layout/list/Item.module.scss

@@ -2,7 +2,7 @@
     list-style-type: none;
     margin: 0;
     padding: 0;
-    font-size: 15px;
+    font-size: calc(34px / var(--ratio-font));
 
     &:not(:first-child) > * {
         border-top: 0.37px solid var(--header-border);
@@ -10,7 +10,7 @@
 
     > * {
         display: block;
-        padding: 20px 0;
+        padding: 0;
         text-decoration: none;
     }
 }
@@ -20,4 +20,12 @@
     background: none;
     width: 100%;
     text-align: left;
+    font-family: inherit;
+    font-size: inherit;
+}
+
+.content {
+    display: flex;
+    min-height: calc(174px / var(--ratio-dimensions));
+    align-items: center;
 }

package/dist/components/layout/list/Label.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { ReactNode } from "react";
+interface Props {
+    sub?: ReactNode;
+}
+declare const Label: React.FC<Props>;
+export { Label };
+//# sourceMappingURL=Label.d.ts.map

package/dist/components/layout/list/Label.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Label.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/list/Label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,UAAU,KAAK;IACX,GAAG,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAS1B,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,CAAC"}

package/dist/components/layout/list/Label.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Label = void 0;
+const react_1 = __importDefault(require("react"));
+const Label_module_scss_1 = __importDefault(require("./Label.module.scss"));
+const Label = (props) => {
+    const sub = props.sub ? react_1.default.createElement("div", { className: Label_module_scss_1.default.sub }, props.sub) : null;
+    return (react_1.default.createElement("div", { className: Label_module_scss_1.default.root },
+        react_1.default.createElement("div", null, props.children),
+        sub));
+};
+exports.Label = Label;
+//# sourceMappingURL=Label.js.map

package/dist/components/layout/list/Label.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Label.js","sourceRoot":"","sources":["../../../../src/components/layout/list/Label.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAG1B,4EAAyC;AAMzC,MAAM,KAAK,GAAoB,CAAC,KAAK,EAAE,EAAE;IACrC,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,uCAAK,SAAS,EAAE,2BAAM,CAAC,GAAG,IAAG,KAAK,CAAC,GAAG,CAAO,CAAC,CAAC,CAAC,IAAI,CAAC;IAE7E,OAAO,CACH,uCAAK,SAAS,EAAE,2BAAM,CAAC,IAAI;QACvB,2CAAM,KAAK,CAAC,QAAQ,CAAO;QAC1B,GAAG,CACF,CACT,CAAC;AACN,CAAC,CAAC;AAEO,sBAAK"}

package/dist/components/layout/list/Label.module.scss

@@ -0,0 +1,9 @@
+.sub {
+    font-size: calc(27px / var(--ratio-font));
+    color: var(--sub);
+    margin-top: calc(27px / var(--ratio-font) / 3);
+}
+
+.root {
+    padding: calc(54px / var(--ratio-dimensions)) 0;
+}

package/dist/components/layout/list/List.d.ts

@@ -1,4 +1,8 @@
 import React from "react";
-declare const List: React.FC;
+import { Header } from "./Header.js";
+interface SubComponents {
+    Header: typeof Header;
+}
+declare const List: React.FC & SubComponents;
 export { List };
 //# sourceMappingURL=List.d.ts.map

package/dist/components/layout/list/List.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/list/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAIjB,CAAC;AAEF,OAAO,EAAE,IAAI,EAAE,CAAC"}
+{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/list/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAGrC,UAAU,aAAa;IACnB,MAAM,EAAE,OAAO,MAAM,CAAC;CACzB;AAED,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,GAAG,aAItB,CAAC;AAIF,OAAO,EAAE,IAAI,EAAE,CAAC"}

package/dist/components/layout/list/List.js

@@ -5,9 +5,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.List = void 0;
 const react_1 = __importDefault(require("react"));
+const Header_js_1 = require("./Header.js");
 const List_module_scss_1 = __importDefault(require("./List.module.scss"));
 const List = (props) => {
     return (react_1.default.createElement("ul", { className: List_module_scss_1.default.list }, props.children));
 };
 exports.List = List;
+List.Header = Header_js_1.Header;
 //# sourceMappingURL=List.js.map

package/dist/components/layout/list/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sourceRoot":"","sources":["../../../../src/components/layout/list/List.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,0EAAwC;AAExC,MAAM,IAAI,GAAa,CAAC,KAAK,EAAE,EAAE;IAC7B,OAAO,CACH,sCAAI,SAAS,EAAE,0BAAM,CAAC,IAAI,IAAG,KAAK,CAAC,QAAQ,CAAM,CACpD,CAAC;AACN,CAAC,CAAC;AAEO,oBAAI"}
+{"version":3,"file":"List.js","sourceRoot":"","sources":["../../../../src/components/layout/list/List.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,2CAAqC;AACrC,0EAAwC;AAMxC,MAAM,IAAI,GAA6B,CAAC,KAAK,EAAE,EAAE;IAC7C,OAAO,CACH,sCAAI,SAAS,EAAE,0BAAM,CAAC,IAAI,IAAG,KAAK,CAAC,QAAQ,CAAM,CACpD,CAAC;AACN,CAAC,CAAC;AAIO,oBAAI;AAFb,IAAI,CAAC,MAAM,GAAG,kBAAM,CAAC"}

package/dist/components/layout/list/Value.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+declare const Value: React.FC;
+export { Value };
+//# sourceMappingURL=Value.d.ts.map

package/dist/components/layout/list/Value.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Value.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/list/Value.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAIlB,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,CAAC"}

package/dist/components/layout/list/Value.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Value = void 0;
+const react_1 = __importDefault(require("react"));
+const Value_module_scss_1 = __importDefault(require("./Value.module.scss"));
+const Value = (props) => {
+    return (react_1.default.createElement("div", { className: Value_module_scss_1.default.value }, props.children));
+};
+exports.Value = Value;
+//# sourceMappingURL=Value.js.map

package/dist/components/layout/list/Value.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Value.js","sourceRoot":"","sources":["../../../../src/components/layout/list/Value.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,4EAAyC;AAEzC,MAAM,KAAK,GAAa,CAAC,KAAK,EAAE,EAAE;IAC9B,OAAO,CACH,uCAAK,SAAS,EAAE,2BAAM,CAAC,KAAK,IAAG,KAAK,CAAC,QAAQ,CAAO,CACvD,CAAC;AACN,CAAC,CAAC;AAEO,sBAAK"}

package/dist/components/layout/list/Value.module.scss

@@ -0,0 +1,7 @@
+.value {
+    color: var(--icon);
+    font-size: calc(26px / var(--ratio-font));
+    display: flex;
+    justify-content: flex-end;
+    flex: 1;
+}

package/dist/components/ui/action/Action.js

@@ -16,13 +16,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Action = void 0;
 const react_1 = __importDefault(require("react"));
-const Icon_1 = require("../../icons/Icon");
+const Icon_js_1 = require("../../icons/Icon.js");
 const Action_module_scss_1 = __importDefault(require("./Action.module.scss"));
 const Action = (props) => {
     const { icon, label, href, to, Link } = props, restProps = __rest(props, ["icon", "label", "href", "to", "Link"]);
     let iconElem = icon;
     if (typeof icon === "string") {
-        iconElem = react_1.default.createElement(Icon_1.Icon, { name: icon });
+        iconElem = react_1.default.createElement(Icon_js_1.Icon, { name: icon });
     }
     const labelElem = label ? react_1.default.createElement("div", { className: Action_module_scss_1.default.label }, label) : null;
     const content = (react_1.default.createElement(react_1.default.Fragment, null,

package/dist/components/ui/action/Action.js.map

@@ -1 +1 @@
-{"version":3,"file":"Action.js","sourceRoot":"","sources":["../../../../src/components/ui/action/Action.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAI1B,2CAAwC;AACxC,8EAA0C;AAgB1C,MAAM,MAAM,GAAqB,CAAC,KAAK,EAAE,EAAE;IACvC,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,KAAmB,KAAK,EAAnB,SAAS,UAAK,KAAK,EAArD,uCAA6C,CAAQ,CAAC;IAE5D,IAAI,QAAQ,GAAc,IAAI,CAAC;IAC/B,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;QAC1B,QAAQ,GAAG,8BAAC,WAAI,IAAC,IAAI,EAAE,IAAY,GAAI,CAAC;KAC3C;IAED,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,uCAAK,SAAS,EAAE,4BAAM,CAAC,KAAK,IAAG,KAAK,CAAO,CAAC,CAAC,CAAC,IAAI,CAAC;IAE7E,MAAM,OAAO,GAAG,CACZ;QACI,uCAAK,SAAS,EAAE,4BAAM,CAAC,MAAM,IAAG,QAAQ,CAAO;QAC9C,SAAS,CACX,CACN,CAAC;IAEF,IAAI,EAAE,EAAE;QACJ,IAAI,CAAC,IAAI,EAAE;YACP,MAAM,IAAI,SAAS,CAAC,0CAA0C,CAAC,CAAC;SACnE;QAED,OAAO,8BAAC,IAAI,kBAAC,IAAI,EAAE,EAAE,IAAM,SAAS;YAAE,qCAAG,SAAS,EAAE,4BAAM,CAAC,CAAC,IAAG,OAAO,CAAK,CAAO,CAAC;KACtF;IAED,IAAI,IAAI,EAAE;QACN,OAAO,mDAAG,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,4BAAM,CAAC,CAAC,IAAM,SAAS,GAAG,OAAO,CAAK,CAAC;KAC3E;IAED,OAAO,CACH,0CAAQ,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,SAAS,EAAE,4BAAM,CAAC,MAAM,IACnD,OAAO,CACH,CACZ,CAAC;AACN,CAAC,CAAC;AAEO,wBAAM"}
+{"version":3,"file":"Action.js","sourceRoot":"","sources":["../../../../src/components/ui/action/Action.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAI1B,iDAA2C;AAC3C,8EAA0C;AAgB1C,MAAM,MAAM,GAAqB,CAAC,KAAK,EAAE,EAAE;IACvC,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,KAAmB,KAAK,EAAnB,SAAS,UAAK,KAAK,EAArD,uCAA6C,CAAQ,CAAC;IAE5D,IAAI,QAAQ,GAAc,IAAI,CAAC;IAC/B,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;QAC1B,QAAQ,GAAG,8BAAC,cAAI,IAAC,IAAI,EAAE,IAAY,GAAI,CAAC;KAC3C;IAED,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,uCAAK,SAAS,EAAE,4BAAM,CAAC,KAAK,IAAG,KAAK,CAAO,CAAC,CAAC,CAAC,IAAI,CAAC;IAE7E,MAAM,OAAO,GAAG,CACZ;QACI,uCAAK,SAAS,EAAE,4BAAM,CAAC,MAAM,IAAG,QAAQ,CAAO;QAC9C,SAAS,CACX,CACN,CAAC;IAEF,IAAI,EAAE,EAAE;QACJ,IAAI,CAAC,IAAI,EAAE;YACP,MAAM,IAAI,SAAS,CAAC,0CAA0C,CAAC,CAAC;SACnE;QAED,OAAO,8BAAC,IAAI,kBAAC,IAAI,EAAE,EAAE,IAAM,SAAS;YAAE,qCAAG,SAAS,EAAE,4BAAM,CAAC,CAAC,IAAG,OAAO,CAAK,CAAO,CAAC;KACtF;IAED,IAAI,IAAI,EAAE;QACN,OAAO,mDAAG,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,4BAAM,CAAC,CAAC,IAAM,SAAS,GAAG,OAAO,CAAK,CAAC;KAC3E;IAED,OAAO,CACH,0CAAQ,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,SAAS,EAAE,4BAAM,CAAC,MAAM,IACnD,OAAO,CACH,CACZ,CAAC;AACN,CAAC,CAAC;AAEO,wBAAM"}