react-miui 0.11.0 → 0.12.0

package/CHANGELOG.md

@@ -3,8 +3,18 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-## [UNRELEASED]
-(nothing yet)
+## [0.12.0] - 2022-02-19
+### Added
+- support for colored header
+- custom scrollbars (opt-in)
+- `Drawer` component
+- `Stats` component
+- dots icon
+### Changed
+- added a prop for controlling closing `Pop` on `Escape` key
+- added className for sticky header content component
+### Fixed
+- header icons not reacting to text color change
 
 ## [0.11.0] - 2022-02-18
 ### Added

package/assets/dots.svg

@@ -0,0 +1 @@
+<svg baseProfile="basic" width="16" height="72" xmlns="http://www.w3.org/2000/svg"><path d="M13.65 13.65Q16 11.3 16 8q0-3.3-2.35-5.65Q11.3 0 8 0 4.7 0 2.35 2.35 0 4.7 0 8q0 3.3 2.35 5.65Q4.7 16 8 16q3.3 0 5.65-2.35M8 44q3.3 0 5.65-2.35Q16 39.3 16 36q0-3.3-2.35-5.65Q11.3 28 8 28q-3.3 0-5.65 2.35Q0 32.7 0 36q0 3.3 2.35 5.65Q4.7 44 8 44M8 72q3.3 0 5.65-2.35Q16 67.3 16 64q0-3.3-2.35-5.65Q11.3 56 8 56q-3.3 0-5.65 2.35Q0 60.7 0 64q0 3.3 2.35 5.65Q4.7 72 8 72"/></svg>

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"Dots.d.ts","sourceRoot":"","sources":["../../../src/components/icons/Dots.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,EAAE,CAAC,KAAK,CAYzB,CAAC;AAEF,OAAO,EAAE,IAAI,EAAE,CAAC"}

package/dist/components/icons/Dots.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.Dots = void 0;
+const react_1 = __importDefault(require("react"));
+const Dots = (props) => {
+    return (react_1.default.createElement("svg", { width: "16", height: "16", viewBox: "0 0 16 72", xmlns: "http://www.w3.org/2000/svg", className: props.className },
+        react_1.default.createElement("path", { d: "M13.65 13.65Q16 11.3 16 8q0-3.3-2.35-5.65Q11.3 0 8 0 4.7 0 2.35 2.35 0 4.7 0 8q0 3.3 2.35 5.65Q4.7 16 8 16q3.3 0 5.65-2.35M8 44q3.3 0 5.65-2.35Q16 39.3 16 36q0-3.3-2.35-5.65Q11.3 28 8 28q-3.3 0-5.65 2.35Q0 32.7 0 36q0 3.3 2.35 5.65Q4.7 44 8 44M8 72q3.3 0 5.65-2.35Q16 67.3 16 64q0-3.3-2.35-5.65Q11.3 56 8 56q-3.3 0-5.65 2.35Q0 60.7 0 64q0 3.3 2.35 5.65Q4.7 72 8 72" })));
+};
+exports.Dots = Dots;
+//# sourceMappingURL=Dots.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Dots.js","sourceRoot":"","sources":["../../../src/components/icons/Dots.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAM1B,MAAM,IAAI,GAAoB,CAAC,KAAK,EAAE,EAAE;IACpC,OAAO,CACH,uCACI,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,EACZ,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,4BAA4B,EACnC,SAAS,EAAE,KAAK,CAAC,SAAS;QAE1B,wCAAM,CAAC,EAAE,8WAA8W,GAAI,CACzX,CACT,CAAC;AACN,CAAC,CAAC;AAEO,oBAAI"}

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

@@ -7,7 +7,8 @@ declare enum ICON {
     battery = "battery",
     heart = "heart",
     trash = "trash",
-    config = "config"
+    config = "config",
+    dots = "dots"
 }
 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":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,aAAK,IAAI;IACL,SAAS,cAAc;IACvB,IAAI,SAAS;IACb,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,OAAO,YAAY;IACnB,KAAK,UAAU;IACf,KAAK,UAAU;IACf,MAAM,WAAW;CACpB;AAED,UAAU,KAAK;IACX,IAAI,EAAE,IAAI,CAAC;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAaD,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;AAa1B,aAAK,IAAI;IACL,SAAS,cAAc;IACvB,IAAI,SAAS;IACb,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,OAAO,YAAY;IACnB,KAAK,UAAU;IACf,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,IAAI,SAAS;CAChB;AAED,UAAU,KAAK;IACX,IAAI,EAAE,IAAI,CAAC;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAcD,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

@@ -24,6 +24,7 @@ const Battery_js_1 = require("./Battery.js");
 const Heart_js_1 = require("./Heart.js");
 const Trash_js_1 = require("./Trash.js");
 const Config_js_1 = require("./Config.js");
+const Dots_js_1 = require("./Dots.js");
 var ICON;
 (function (ICON) {
     ICON["checkmark"] = "checkmark";
@@ -34,6 +35,7 @@ var ICON;
     ICON["heart"] = "heart";
     ICON["trash"] = "trash";
     ICON["config"] = "config";
+    ICON["dots"] = "dots";
 })(ICON || (ICON = {}));
 exports.ICON = ICON;
 const iconsMap = new Map([
@@ -45,6 +47,7 @@ const iconsMap = new Map([
     [ICON.heart, Heart_js_1.Heart],
     [ICON.trash, Trash_js_1.Trash],
     [ICON.config, Config_js_1.Config],
+    [ICON.dots, Dots_js_1.Dots],
 ]);
 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":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAG1B,iDAA2C;AAC3C,uCAAiC;AACjC,6CAAuC;AACvC,2CAAqC;AACrC,6CAAuC;AACvC,yCAAmC;AACnC,yCAAmC;AACnC,2CAAqC;AAErC,IAAK,IASJ;AATD,WAAK,IAAI;IACL,+BAAuB,CAAA;IACvB,qBAAa,CAAA;IACb,2BAAmB,CAAA;IACnB,yBAAiB,CAAA;IACjB,2BAAmB,CAAA;IACnB,uBAAe,CAAA;IACf,uBAAe,CAAA;IACf,yBAAiB,CAAA;AACrB,CAAC,EATI,IAAI,KAAJ,IAAI,QASR;AA0Bc,oBAAI;AAnBnB,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;IACvB,CAAC,IAAI,CAAC,MAAM,EAAE,kBAAM,CAAC;IACrB,CAAC,IAAI,CAAC,OAAO,EAAE,oBAAO,CAAC;IACvB,CAAC,IAAI,CAAC,KAAK,EAAE,gBAAK,CAAC;IACnB,CAAC,IAAI,CAAC,KAAK,EAAE,gBAAK,CAAC;IACnB,CAAC,IAAI,CAAC,MAAM,EAAE,kBAAM,CAAC;CACxB,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;AACvC,2CAAqC;AACrC,6CAAuC;AACvC,yCAAmC;AACnC,yCAAmC;AACnC,2CAAqC;AACrC,uCAAiC;AAEjC,IAAK,IAUJ;AAVD,WAAK,IAAI;IACL,+BAAuB,CAAA;IACvB,qBAAa,CAAA;IACb,2BAAmB,CAAA;IACnB,yBAAiB,CAAA;IACjB,2BAAmB,CAAA;IACnB,uBAAe,CAAA;IACf,uBAAe,CAAA;IACf,yBAAiB,CAAA;IACjB,qBAAa,CAAA;AACjB,CAAC,EAVI,IAAI,KAAJ,IAAI,QAUR;AA2Bc,oBAAI;AApBnB,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;IACvB,CAAC,IAAI,CAAC,MAAM,EAAE,kBAAM,CAAC;IACrB,CAAC,IAAI,CAAC,OAAO,EAAE,oBAAO,CAAC;IACvB,CAAC,IAAI,CAAC,KAAK,EAAE,gBAAK,CAAC;IACnB,CAAC,IAAI,CAAC,KAAK,EAAE,gBAAK,CAAC;IACnB,CAAC,IAAI,CAAC,MAAM,EAAE,kBAAM,CAAC;IACrB,CAAC,IAAI,CAAC,IAAI,EAAE,cAAI,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"}

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

@@ -2,7 +2,7 @@ import React from "react";
 import type { ReactNode } from "react";
 interface Props {
     center?: boolean;
-    variant?: "toolbar";
+    variant?: "toolbar" | "colored";
     position?: "top" | "left" | "right" | "bottom";
     className?: string;
     before?: ReactNode;

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

@@ -1 +1 @@
-{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/header/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,UAAU,KAAK;IACX,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,SAAS,CAAC;IAKpB,QAAQ,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAGD,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAwC3B,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}
+{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/header/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,UAAU,KAAK;IACX,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAKhC,QAAQ,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAGD,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAyC3B,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}

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

@@ -21,6 +21,7 @@ const Header = (props) => {
     const cls = classnames_1.default(Header_module_scss_1.default.header, {
         [Header_module_scss_1.default["header--center"]]: center,
         [Header_module_scss_1.default["header--toolbar"]]: variant === "toolbar",
+        [Header_module_scss_1.default["header--colored"]]: variant === "colored",
     }, Header_module_scss_1.default[`header--${position}`], props.className);
     let contents = children;
     if (justActions) {

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,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"}
+{"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;QAClD,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/header/Header.module.scss

@@ -15,6 +15,12 @@
     --background-color: var(--toolbar-bg);
 }
 
+.header--colored {
+    --border-color: var(--custom-header-color);
+    --background-color: var(--custom-header-color);
+    color: var(--custom-text-color);
+}
+
 .header--top, .header--bottom {
     padding: 0 16.666px;
     min-height: 44px;

package/dist/components/layout/header/HeaderIconAction.module.scss

@@ -4,7 +4,7 @@
     border-radius: 666px;
     display: inline-block;
     border: calc(2px / var(--ratio-border)) solid transparent;
-    color: var(--header-text);
+    color: currentColor;
 
     &:hover {
         background: #00000022;
@@ -19,4 +19,5 @@
     width: 16px;
     height: 16px;
     display: block;
+    fill: currentColor;
 }

package/dist/components/layout/header/StickyHeader.d.ts

@@ -1,6 +1,9 @@
 import React from "react";
 interface Content {
-    Content: React.FC;
+    Content: React.FC<ContentProps>;
+}
+interface ContentProps {
+    className?: string;
 }
 interface Props {
     position?: "top" | "left" | "right" | "bottom";

package/dist/components/layout/header/StickyHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StickyHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/header/StickyHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,UAAU,OAAO;IACb,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC;CACrB;AAED,UAAU,KAAK;IACX,QAAQ,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;CAClD;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,OA+BrC,CAAC;AAMF,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"StickyHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/header/StickyHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,UAAU,OAAO;IAEb,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC;CACnC;AAED,UAAU,YAAY;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,UAAU,KAAK;IACX,QAAQ,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;CAClD;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,OAoCrC,CAAC;AAMF,OAAO,EAAE,YAAY,EAAE,CAAC"}

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

@@ -22,7 +22,7 @@ const StickyHeader = (props) => {
     header = header;
     content = content;
     const cls = classnames_1.default(StickyHeader_module_scss_1.default.stickyHeader, StickyHeader_module_scss_1.default[`stickyHeader--${position}`]);
-    const contentCls = classnames_1.default(StickyHeader_module_scss_1.default.stickyHeader__content, StickyHeader_module_scss_1.default[`stickyHeader__content--${position}`]);
+    const contentCls = classnames_1.default(StickyHeader_module_scss_1.default.stickyHeader__content, StickyHeader_module_scss_1.default[`stickyHeader__content--${position}`], content.props.className);
     return (react_1.default.createElement("div", { className: cls },
         react_1.default.cloneElement(header, { position }),
         react_1.default.createElement("div", { className: contentCls }, content)));

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

@@ -1 +1 @@
-{"version":3,"file":"StickyHeader.js","sourceRoot":"","sources":["../../../../src/components/layout/header/StickyHeader.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,4DAAoC;AAEpC,2CAAqC;AACrC,0FAAgD;AAEhD,MAAM,GAAG,GAAG,IAAI,SAAS,CAAC,mEAAmE,CAAC,CAAC;AAU/F,MAAM,YAAY,GAA8B,CAAC,KAAK,EAAE,EAAE;IACtD,MAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC;IAEzC,MAAM,QAAQ,GAAG,eAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAGxD,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE;QACvB,MAAM,GAAG,CAAC;KACb;IAED,IAAI,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,KAAK,QAAQ,IAAI,MAAM,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,kBAAM,CAAC,EACtF,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,KAAK,QAAQ,IAAI,MAAM,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,YAAY,CAAC,OAAO,CAAC,CAAC;IAE1G,IAAI,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE;QACrB,MAAM,GAAG,CAAC;KACb;IAED,MAAM,GAAG,MAAe,CAAC;IACzB,OAAO,GAAG,OAAgB,CAAC;IAE3B,MAAM,GAAG,GAAG,oBAAU,CAAC,kCAAM,CAAC,YAAY,EAAE,kCAAM,CAAC,iBAAiB,QAAQ,EAAE,CAAC,CAAC,CAAC;IACjF,MAAM,UAAU,GAAG,oBAAU,CAAC,kCAAM,CAAC,qBAAqB,EAAE,kCAAM,CAAC,0BAA0B,QAAQ,EAAE,CAAC,CAAC,CAAC;IAE1G,OAAO,CACH,uCAAK,SAAS,EAAE,GAAG;QACd,eAAK,CAAC,YAAY,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAE,CAAC;QACzC,uCAAK,SAAS,EAAE,UAAU,IACrB,OAAO,CACN,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAMO,oCAAY;AAJrB,YAAY,CAAC,OAAO,GAAG,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IACpC,OAAO,8DAAG,QAAQ,CAAI,CAAC;AAC3B,CAAC,CAAC"}
+{"version":3,"file":"StickyHeader.js","sourceRoot":"","sources":["../../../../src/components/layout/header/StickyHeader.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,4DAAoC;AAEpC,2CAAqC;AACrC,0FAAgD;AAEhD,MAAM,GAAG,GAAG,IAAI,SAAS,CAAC,mEAAmE,CAAC,CAAC;AAe/F,MAAM,YAAY,GAA8B,CAAC,KAAK,EAAE,EAAE;IACtD,MAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC;IAEzC,MAAM,QAAQ,GAAG,eAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAGxD,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE;QACvB,MAAM,GAAG,CAAC;KACb;IAED,IAAI,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,KAAK,QAAQ,IAAI,MAAM,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,kBAAM,CAAC,EACtF,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,KAAK,QAAQ,IAAI,MAAM,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,YAAY,CAAC,OAAO,CAAC,CAAC;IAE1G,IAAI,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE;QACrB,MAAM,GAAG,CAAC;KACb;IAED,MAAM,GAAG,MAAe,CAAC;IACzB,OAAO,GAAG,OAAgB,CAAC;IAE3B,MAAM,GAAG,GAAG,oBAAU,CAAC,kCAAM,CAAC,YAAY,EAAE,kCAAM,CAAC,iBAAiB,QAAQ,EAAE,CAAC,CAAC,CAAC;IAEjF,MAAM,UAAU,GAAG,oBAAU,CACzB,kCAAM,CAAC,qBAAqB,EAC5B,kCAAM,CAAC,0BAA0B,QAAQ,EAAE,CAAC,EAC3C,OAAmC,CAAC,KAAK,CAAC,SAAS,CACvD,CAAC;IAEF,OAAO,CACH,uCAAK,SAAS,EAAE,GAAG;QACd,eAAK,CAAC,YAAY,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAE,CAAC;QACzC,uCAAK,SAAS,EAAE,UAAU,IACrB,OAAO,CACN,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAMO,oCAAY;AAJrB,YAAY,CAAC,OAAO,GAAG,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IACpC,OAAO,8DAAG,QAAQ,CAAI,CAAC;AAC3B,CAAC,CAAC"}

package/dist/components/ui/drawer/Drawer.d.ts

@@ -0,0 +1,22 @@
+import { Component } from "react";
+interface Props {
+    isOpen: boolean;
+    closeOnEsc?: boolean;
+    onClose: () => void;
+}
+interface State {
+    shouldRenderWhenClosed: boolean;
+}
+declare class Drawer extends Component<Props, State> {
+    constructor(props: Props);
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: Props): void;
+    componentWillUnmount(): void;
+    private timeout;
+    private onOpen;
+    private onClose;
+    private readonly handleEsc;
+    render(): JSX.Element;
+}
+export { Drawer };
+//# sourceMappingURL=Drawer.d.ts.map

package/dist/components/ui/drawer/Drawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/drawer/Drawer.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQzC,UAAU,KAAK;IACX,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,UAAU,KAAK;IACX,sBAAsB,EAAE,OAAO,CAAC;CACnC;AAED,cAAM,MAAO,SAAQ,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC;gBACrB,KAAK,EAAE,KAAK;IAQxB,iBAAiB;IAOjB,kBAAkB,CAAC,SAAS,EAAE,KAAK;IAUnC,oBAAoB;IAK3B,OAAO,CAAC,OAAO,CAAwB;IAEvC,OAAO,CAAC,MAAM;IAKd,OAAO,CAAC,OAAO;IAIf,OAAO,CAAC,QAAQ,CAAC,SAAS,CAExB;IAEK,MAAM;CAqBhB;AAED,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/dist/components/ui/drawer/Drawer.js

@@ -0,0 +1,84 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __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.Drawer = void 0;
+const react_1 = __importStar(require("react"));
+const oop_timers_1 = require("oop-timers");
+const Drawer_module_scss_1 = __importDefault(require("./Drawer.module.scss"));
+const HandleEsc_1 = require("../../utils/HandleEsc");
+const RENDER_TIMEOUT = 500;
+class Drawer extends react_1.Component {
+    constructor(props) {
+        super(props);
+        this.timeout = null;
+        this.handleEsc = () => {
+            this.props.onClose();
+        };
+        this.state = {
+            shouldRenderWhenClosed: false,
+        };
+    }
+    componentDidMount() {
+        this.timeout = new oop_timers_1.Timeout(() => {
+            this.setState({ shouldRenderWhenClosed: false });
+        }, RENDER_TIMEOUT);
+    }
+    componentDidUpdate(prevProps) {
+        if (!prevProps.isOpen && this.props.isOpen) {
+            this.onOpen();
+        }
+        if (prevProps.isOpen && !this.props.isOpen) {
+            this.onClose();
+        }
+    }
+    componentWillUnmount() {
+        var _a;
+        (_a = this.timeout) === null || _a === void 0 ? void 0 : _a.stop();
+        this.timeout = null;
+    }
+    onOpen() {
+        var _a;
+        (_a = this.timeout) === null || _a === void 0 ? void 0 : _a.stop();
+        this.setState({ shouldRenderWhenClosed: true });
+    }
+    onClose() {
+        var _a;
+        (_a = this.timeout) === null || _a === void 0 ? void 0 : _a.start();
+    }
+    render() {
+        var _a;
+        const y = this.props.isOpen ? 0 : 100;
+        const style = {
+            transform: `translateY(${y}%)`,
+        };
+        const shouldRender = this.props.isOpen || this.state.shouldRenderWhenClosed;
+        const closeOnEsc = (_a = this.props.closeOnEsc) !== null && _a !== void 0 ? _a : true;
+        const esc = closeOnEsc && react_1.default.createElement(HandleEsc_1.HandleEsc, { onPress: this.handleEsc });
+        return (react_1.default.createElement("div", { className: Drawer_module_scss_1.default.drawer, style: style },
+            esc,
+            react_1.default.createElement("div", { className: Drawer_module_scss_1.default.content }, shouldRender && this.props.children)));
+    }
+}
+exports.Drawer = Drawer;
+//# sourceMappingURL=Drawer.js.map

package/dist/components/ui/drawer/Drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../../src/components/ui/drawer/Drawer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAyC;AACzC,2CAAqC;AAErC,8EAA0C;AAC1C,qDAAkD;AAElD,MAAM,cAAc,GAAG,GAAG,CAAC;AAY3B,MAAM,MAAO,SAAQ,iBAAuB;IACxC,YAAmB,KAAY;QAC3B,KAAK,CAAC,KAAK,CAAC,CAAC;QA6BT,YAAO,GAAmB,IAAI,CAAC;QAWtB,cAAS,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;QACzB,CAAC,CAAC;QAxCE,IAAI,CAAC,KAAK,GAAG;YACT,sBAAsB,EAAE,KAAK;SAChC,CAAC;IACN,CAAC;IAEM,iBAAiB;QACpB,IAAI,CAAC,OAAO,GAAG,IAAI,oBAAO,CAAC,GAAG,EAAE;YAE5B,IAAI,CAAC,QAAQ,CAAC,EAAE,sBAAsB,EAAE,KAAK,EAAE,CAAC,CAAC;QACrD,CAAC,EAAE,cAAc,CAAC,CAAC;IACvB,CAAC;IAEM,kBAAkB,CAAC,SAAgB;QACtC,IAAI,CAAC,SAAS,CAAC,MAAM,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACxC,IAAI,CAAC,MAAM,EAAE,CAAC;SACjB;QAED,IAAI,SAAS,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACxC,IAAI,CAAC,OAAO,EAAE,CAAC;SAClB;IACL,CAAC;IAEM,oBAAoB;;QACvB,MAAA,IAAI,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAC;QACrB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IACxB,CAAC;IAIO,MAAM;;QACV,MAAA,IAAI,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAC;QACrB,IAAI,CAAC,QAAQ,CAAC,EAAE,sBAAsB,EAAE,IAAI,EAAE,CAAC,CAAC;IACpD,CAAC;IAEO,OAAO;;QACX,MAAA,IAAI,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;IAC1B,CAAC;IAMM,MAAM;;QAET,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;QACtC,MAAM,KAAK,GAAG;YACV,SAAS,EAAE,cAAc,CAAC,IAAI;SACjC,CAAC;QAEF,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,IAAI,CAAC,KAAK,CAAC,sBAAsB,CAAC;QAE5E,MAAM,UAAU,GAAG,MAAA,IAAI,CAAC,KAAK,CAAC,UAAU,mCAAI,IAAI,CAAC;QACjD,MAAM,GAAG,GAAG,UAAU,IAAI,8BAAC,qBAAS,IAAC,OAAO,EAAE,IAAI,CAAC,SAAS,GAAI,CAAC;QAEjE,OAAO,CACH,uCAAK,SAAS,EAAE,4BAAM,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK;YACtC,GAAG;YACJ,uCAAK,SAAS,EAAE,4BAAM,CAAC,OAAO,IACzB,YAAY,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAClC,CACJ,CACT,CAAC;IACN,CAAC;CACJ;AAEQ,wBAAM"}

package/dist/components/ui/drawer/Drawer.module.scss

@@ -0,0 +1,15 @@
+.drawer {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: white;
+    z-index: 1;
+
+    transition: transform 300ms;
+}
+
+.content {
+    height: 100%;
+}

package/dist/components/ui/pop/Pop.d.ts

@@ -4,6 +4,7 @@ interface Props {
     open: boolean;
     onClose: () => void;
     anchor?: HTMLElement | "prev" | "next";
+    closeOnEsc?: boolean;
 }
 interface State {
     x: number;

package/dist/components/ui/pop/Pop.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pop.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/pop/Pop.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAIpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,UAAU,KAAK;IACX,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;CAC1C;AAED,UAAU,KAAK;IACX,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,QAAQ,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC3B,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC;CAChC;AA4BD,cAAM,GAAI,SAAQ,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC;gBAClB,KAAK,EAAE,KAAK;IAYxB,kBAAkB,CAAC,SAAS,EAAE,KAAK;IAM1C,OAAc,MAAM,EAAE,OAAO,SAAS,CAAa;IAEnD,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAkC;IAE1D,OAAO,CAAC,gBAAgB;IAgBxB,OAAO,CAAC,QAAQ,CAAC,MAAM,CAqBrB;IAEF,OAAO,CAAC,QAAQ,CAAC,kBAAkB,CAIjC;IAEF,OAAO,CAAC,QAAQ,CAAC,SAAS,CAExB;IAEK,MAAM;CAgChB;AAED,OAAO,EAAE,GAAG,EAAE,CAAC"}
+{"version":3,"file":"Pop.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/pop/Pop.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAGpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAIxC,UAAU,KAAK;IACX,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;IACvC,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,UAAU,KAAK;IACX,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,QAAQ,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC3B,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC;CAChC;AA4BD,cAAM,GAAI,SAAQ,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC;gBAClB,KAAK,EAAE,KAAK;IAYxB,kBAAkB,CAAC,SAAS,EAAE,KAAK;IAM1C,OAAc,MAAM,EAAE,OAAO,SAAS,CAAa;IAEnD,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAkC;IAE1D,OAAO,CAAC,gBAAgB;IAgBxB,OAAO,CAAC,QAAQ,CAAC,MAAM,CAqBrB;IAEF,OAAO,CAAC,QAAQ,CAAC,kBAAkB,CAIjC;IAEF,OAAO,CAAC,QAAQ,CAAC,SAAS,CAExB;IAEK,MAAM;CAmChB;AAED,OAAO,EAAE,GAAG,EAAE,CAAC"}

package/dist/components/ui/pop/Pop.js

@@ -24,10 +24,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Pop = void 0;
 const react_1 = __importStar(require("react"));
-const HandleEsc_1 = require("./HandleEsc");
 const OnButtonClick_1 = require("./OnButtonClick");
 const PopOption_1 = require("./PopOption");
 const Pop_module_scss_1 = __importDefault(require("./Pop.module.scss"));
+const HandleEsc_1 = require("../../utils/HandleEsc");
 const html = typeof document === "object" ? document.getElementsByTagName("html")[0] : null;
 const getElementDimensions = (elem) => {
     return {
@@ -103,6 +103,7 @@ class Pop extends react_1.Component {
         }
     }
     render() {
+        var _a;
         const style = {};
         if (this.state.vertical === "top") {
             style.top = this.state.y;
@@ -119,8 +120,10 @@ class Pop extends react_1.Component {
         if (!this.props.open) {
             return null;
         }
+        const closeOnEsc = (_a = this.props.closeOnEsc) !== null && _a !== void 0 ? _a : true;
+        const esc = closeOnEsc && react_1.default.createElement(HandleEsc_1.HandleEsc, { onPress: this.handleEsc });
         return (react_1.default.createElement("div", { className: Pop_module_scss_1.default.overlay, ref: this.rootRef, onClick: this.handleOverlayClick },
-            react_1.default.createElement(HandleEsc_1.HandleEsc, { onPress: this.handleEsc }),
+            esc,
             react_1.default.createElement(OnButtonClick_1.OnButtonClick, { onClick: this.handleEsc },
                 react_1.default.createElement("ul", { className: Pop_module_scss_1.default.pop, style: style }, this.props.children))));
     }

package/dist/components/ui/pop/Pop.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pop.js","sourceRoot":"","sources":["../../../../src/components/ui/pop/Pop.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Pop.js","sourceRoot":"","sources":["../../../../src/components/ui/pop/Pop.tsx"],"names":[],"mappings":"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"}

package/dist/components/ui/stats/Stats.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+interface Stat {
+    label: string;
+    value: string;
+}
+interface Props {
+    stats: Stat[];
+    variant?: "dark";
+}
+declare const Stats: React.FC<Props>;
+export { Stats };
+//# sourceMappingURL=Stats.d.ts.map

package/dist/components/ui/stats/Stats.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stats.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/stats/Stats.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,IAAI;IACV,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACjB;AAED,UAAU,KAAK;IACX,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAwB1B,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,CAAC"}

package/dist/components/ui/stats/Stats.js

@@ -0,0 +1,24 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Stats = void 0;
+const react_1 = __importDefault(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const Stats_module_scss_1 = __importDefault(require("./Stats.module.scss"));
+const Stats = (props) => {
+    const list = props.stats.map((s, k) => (react_1.default.createElement("li", { key: String(k), className: Stats_module_scss_1.default.item },
+        react_1.default.createElement("span", { className: Stats_module_scss_1.default.value }, s.value),
+        react_1.default.createElement("span", { className: Stats_module_scss_1.default.label }, s.label))));
+    const len = list.length;
+    for (let i = 0; i < len - 1; i++) {
+        list.splice((i * 2) + 1, 0, react_1.default.createElement("li", { key: "separator" + String(i), className: Stats_module_scss_1.default.separator }));
+    }
+    const cls = classnames_1.default(Stats_module_scss_1.default.stats, {
+        [Stats_module_scss_1.default["stats-dark"]]: props.variant === "dark",
+    });
+    return (react_1.default.createElement("ul", { className: cls }, list));
+};
+exports.Stats = Stats;
+//# sourceMappingURL=Stats.js.map

package/dist/components/ui/stats/Stats.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stats.js","sourceRoot":"","sources":["../../../../src/components/ui/stats/Stats.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,4DAAoC;AAEpC,4EAAyC;AAYzC,MAAM,KAAK,GAAoB,CAAC,KAAK,EAAE,EAAE;IACrC,MAAM,IAAI,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACnC,sCAAI,GAAG,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,2BAAM,CAAC,IAAI;QACtC,wCAAM,SAAS,EAAE,2BAAM,CAAC,KAAK,IAAG,CAAC,CAAC,KAAK,CAAQ;QAC/C,wCAAM,SAAS,EAAE,2BAAM,CAAC,KAAK,IAAG,CAAC,CAAC,KAAK,CAAQ,CAC9C,CACR,CAAC,CAAC;IAEH,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,CAAC;IAExB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE;QAE9B,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,sCAAI,GAAG,EAAE,WAAW,GAAG,MAAM,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,2BAAM,CAAC,SAAS,GAAI,CAAC,CAAC;KAClG;IAED,MAAM,GAAG,GAAG,oBAAU,CAAC,2BAAM,CAAC,KAAK,EAAE;QACjC,CAAC,2BAAM,CAAC,YAAY,CAAC,CAAC,EAAE,KAAK,CAAC,OAAO,KAAK,MAAM;KACnD,CAAC,CAAC;IAEH,OAAO,CACH,sCAAI,SAAS,EAAE,GAAG,IACb,IAAI,CACJ,CACR,CAAC;AACN,CAAC,CAAC;AAEO,sBAAK"}

package/dist/components/ui/stats/Stats.module.scss

@@ -0,0 +1,48 @@
+.stats {
+    --stats-border: 1px solid rgba(255, 255, 255, .15);
+    --stats-bg: rgba(255, 255, 255, .05);
+    --stats-value-color: rgba(255, 255, 255, .9);
+    --stats-label-color: rgba(255, 255, 255, .61);
+
+    display: flex;
+    width: 100%;
+    padding: calc(60px / var(--ratio-dimensions)) 0;
+    margin: 0;
+    border-top: var(--stats-border);
+    background: var(--stats-bg);
+    background-clip: padding-box;
+    list-style-type: none;
+}
+
+.stats-dark {
+    --stats-border: 1px solid rgba(0, 0, 0, .15);
+    --stats-bg: rgba(0, 0, 0, .05);
+    --stats-value-color: rgba(0, 0, 0, .9);
+    --stats-label-color: rgba(0, 0, 0, .61);
+}
+
+.item {
+    flex: 1;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    text-align: center;
+    gap: calc(20px / var(--ratio-dimensions));
+}
+
+.separator {
+    border-left: var(--stats-border);
+}
+
+.label {
+    display: block;
+    color: var(--stats-label-color);
+    font-size: calc(22px / var(--ratio-font));
+}
+
+.value {
+    display: block;
+    color: var(--stats-value-color);
+    font-size: calc(30px / var(--ratio-font));
+}

package/dist/components/utils/HandleEsc.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HandleEsc.d.ts","sourceRoot":"","sources":["../../../src/components/utils/HandleEsc.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,UAAU,KAAK;IACX,OAAO,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAU9B,CAAC;AAEF,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/dist/components/utils/HandleEsc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HandleEsc.js","sourceRoot":"","sources":["../../../src/components/utils/HandleEsc.tsx"],"names":[],"mappings":";;;AACA,yCAAwC;AACxC,iCAAkC;AAMlC,MAAM,SAAS,GAAoB,CAAC,KAAK,EAAE,EAAE;IACzC,MAAM,CAAC,OAAO,CAAC,GAAG,uBAAW,CAAC,QAAQ,CAAC,CAAC;IAExC,iBAAS,CAAC,GAAG,EAAE;QACX,IAAI,OAAO,EAAE;YACT,KAAK,CAAC,OAAO,EAAE,CAAC;SACnB;IACL,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,IAAI,CAAC;AAChB,CAAC,CAAC;AAEO,8BAAS"}

package/dist/global.scss

@@ -68,6 +68,9 @@
     --grey1: #737373;
 
     --focus-color: #dcaf00;
+
+    --scrollbars-thumb: var(--grey1);
+    --scrollbars-bg: transparent;
 }
 
 *:focus {

package/dist/index.d.ts

@@ -17,6 +17,7 @@ export * from "./components/ui/action/Action.js";
 export * from "./components/ui/action/EqualActions.js";
 export * from "./components/ui/button/Button.js";
 export * from "./components/ui/directionPad/Pad.js";
+export * from "./components/ui/drawer/Drawer.js";
 export * from "./components/ui/message/Message.js";
 export * from "./components/ui/modal/Modal.js";
 export * from "./components/ui/modal/ModalButtons.js";

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,oCAAoC,CAAC;AACnD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAE5C,cAAc,4BAA4B,CAAC;AAE3C,cAAc,kCAAkC,CAAC;AACjD,cAAc,sCAAsC,CAAC;AACrD,cAAc,gDAAgD,CAAC;AAC/D,cAAc,4CAA4C,CAAC;AAC3D,cAAc,kCAAkC,CAAC;AACjD,cAAc,kCAAkC,CAAC;AACjD,cAAc,gDAAgD,CAAC;AAC/D,cAAc,wCAAwC,CAAC;AAEvD,cAAc,kCAAkC,CAAC;AACjD,cAAc,wCAAwC,CAAC;AACvD,cAAc,kCAAkC,CAAC;AACjD,cAAc,qCAAqC,CAAC;AACpD,cAAc,oCAAoC,CAAC;AACnD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,uCAAuC,CAAC;AACtD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,kCAAkC,CAAC;AACjD,cAAc,oCAAoC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,oCAAoC,CAAC;AACnD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAE5C,cAAc,4BAA4B,CAAC;AAE3C,cAAc,kCAAkC,CAAC;AACjD,cAAc,sCAAsC,CAAC;AACrD,cAAc,gDAAgD,CAAC;AAC/D,cAAc,4CAA4C,CAAC;AAC3D,cAAc,kCAAkC,CAAC;AACjD,cAAc,kCAAkC,CAAC;AACjD,cAAc,gDAAgD,CAAC;AAC/D,cAAc,wCAAwC,CAAC;AAEvD,cAAc,kCAAkC,CAAC;AACjD,cAAc,wCAAwC,CAAC;AACvD,cAAc,kCAAkC,CAAC;AACjD,cAAc,qCAAqC,CAAC;AACpD,cAAc,kCAAkC,CAAC;AACjD,cAAc,oCAAoC,CAAC;AACnD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,uCAAuC,CAAC;AACtD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,kCAAkC,CAAC;AACjD,cAAc,oCAAoC,CAAC"}

package/dist/index.js

@@ -29,6 +29,7 @@ __exportStar(require("./components/ui/action/Action.js"), exports);
 __exportStar(require("./components/ui/action/EqualActions.js"), exports);
 __exportStar(require("./components/ui/button/Button.js"), exports);
 __exportStar(require("./components/ui/directionPad/Pad.js"), exports);
+__exportStar(require("./components/ui/drawer/Drawer.js"), exports);
 __exportStar(require("./components/ui/message/Message.js"), exports);
 __exportStar(require("./components/ui/modal/Modal.js"), exports);
 __exportStar(require("./components/ui/modal/ModalButtons.js"), exports);

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,qEAAmD;AACnD,gEAA8C;AAC9C,6DAA2C;AAC3C,6DAA2C;AAC3C,gEAA8C;AAC9C,8DAA4C;AAE5C,6DAA2C;AAE3C,mEAAiD;AACjD,uEAAqD;AACrD,iFAA+D;AAC/D,6EAA2D;AAC3D,mEAAiD;AACjD,mEAAiD;AACjD,iFAA+D;AAC/D,yEAAuD;AAEvD,mEAAiD;AACjD,yEAAuD;AACvD,mEAAiD;AACjD,sEAAoD;AACpD,qEAAmD;AACnD,iEAA+C;AAC/C,wEAAsD;AACtD,6DAA2C;AAC3C,mEAAiD;AACjD,qEAAmD"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,qEAAmD;AACnD,gEAA8C;AAC9C,6DAA2C;AAC3C,6DAA2C;AAC3C,gEAA8C;AAC9C,8DAA4C;AAE5C,6DAA2C;AAE3C,mEAAiD;AACjD,uEAAqD;AACrD,iFAA+D;AAC/D,6EAA2D;AAC3D,mEAAiD;AACjD,mEAAiD;AACjD,iFAA+D;AAC/D,yEAAuD;AAEvD,mEAAiD;AACjD,yEAAuD;AACvD,mEAAiD;AACjD,sEAAoD;AACpD,mEAAiD;AACjD,qEAAmD;AACnD,iEAA+C;AAC/C,wEAAsD;AACtD,6DAA2C;AAC3C,mEAAiD;AACjD,qEAAmD"}

package/dist/scrollbars.scss

@@ -0,0 +1,22 @@
+.miui-scrollbars {
+    overflow-y: auto;
+    scrollbar-color: var(--scrollbars-thumb) var(--scrollbars-bg);
+    scrollbar-width: thin !important;
+
+    &::-webkit-scrollbar {
+        width: 6px;
+        background-color: transparent;
+    }
+
+    &::-webkit-scrollbar-thumb:vertical {
+        background: var(--scrollbars-thumb);
+        background-clip: padding-box;
+        border: 2px solid var(--scrollbars-bg);
+        min-height: 10px;
+    }
+
+    &::-webkit-scrollbar-thumb:vertical:active {
+        background: var(--scrollbars-thumb);
+        border: 2px solid var(--scrollbars-bg);
+    }
+}