react-miui 0.28.2 → 0.29.0

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

@@ -32,69 +32,51 @@ var __importStar = (this && this.__importStar) || (function () {
         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;
+exports.DrawerContentSelector = exports.Drawer = void 0;
 const react_1 = __importStar(require("react"));
 const oop_timers_1 = require("oop-timers");
-const classnames_1 = __importDefault(require("classnames"));
 const HandleEsc_1 = require("../../utils/HandleEsc");
-const Drawer_module_scss_1 = __importDefault(require("./Drawer.module.scss"));
+const Drawer_styled_1 = require("./Drawer.styled");
 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 });
+const Drawer = (0, react_1.forwardRef)((props, ref) => {
+    var _a;
+    const [shouldRenderWhenClosed, setShouldRenderWhenClosed] = (0, react_1.useState)(false);
+    const timeoutRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        timeoutRef.current = new oop_timers_1.Timeout(() => {
+            setShouldRenderWhenClosed(false);
         }, RENDER_TIMEOUT);
-    }
-    componentDidUpdate(prevProps) {
-        if (!prevProps.isOpen && this.props.isOpen) {
-            this.onOpen();
+        return () => {
+            var _a;
+            (_a = timeoutRef.current) === null || _a === void 0 ? void 0 : _a.stop();
+            timeoutRef.current = null;
+        };
+    }, []);
+    (0, react_1.useEffect)(() => {
+        var _a, _b;
+        if (props.isOpen) {
+            (_a = timeoutRef.current) === null || _a === void 0 ? void 0 : _a.stop();
+            setShouldRenderWhenClosed(true);
         }
-        if (prevProps.isOpen && !this.props.isOpen) {
-            this.onClose();
+        else {
+            (_b = timeoutRef.current) === null || _b === void 0 ? void 0 : _b.start();
         }
-    }
-    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 });
-        const cls = (0, classnames_1.default)(this.props.className, Drawer_module_scss_1.default.drawer);
-        return (react_1.default.createElement("div", { className: cls, style: style },
-            esc,
-            react_1.default.createElement("div", { className: Drawer_module_scss_1.default.content }, shouldRender && this.props.children)));
-    }
-}
+    }, [props.isOpen]);
+    const y = props.isOpen ? 0 : 100;
+    const style = {
+        transform: `translateY(${y}%)`,
+    };
+    const shouldRender = props.isOpen || shouldRenderWhenClosed;
+    const closeOnEsc = (_a = props.closeOnEsc) !== null && _a !== void 0 ? _a : true;
+    const esc = closeOnEsc && react_1.default.createElement(HandleEsc_1.HandleEsc, { onPress: props.onClose });
+    return (react_1.default.createElement(Drawer_styled_1.StyledDrawer, { className: props.className, style: style, ref: ref },
+        esc,
+        react_1.default.createElement(Drawer_styled_1.Content, null, shouldRender && props.children)));
+});
 exports.Drawer = Drawer;
+Drawer.displayName = "Drawer";
+Drawer.toString = () => Drawer_styled_1.StyledDrawer.toString();
+const DrawerContentSelector = Drawer_styled_1.Content.toString();
+exports.DrawerContentSelector = DrawerContentSelector;
 //# sourceMappingURL=Drawer.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../../src/components/ui/drawer/Drawer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAyC;AAEzC,2CAAqC;AACrC,4DAAoC;AAEpC,qDAAkD;AAElD,8EAA0C;AAE1C,MAAM,cAAc,GAAG,GAAG,CAAC;AAc3B,MAAM,MAAO,SAAQ,iBAAuB;IACxC,YAAmB,KAAY;QAC3B,KAAK,CAAC,KAAK,CAAC,CAAC;QA4BT,YAAO,GAAmB,IAAI,CAAC;QAWtB,cAAS,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;QACzB,CAAC,CAAC;QAvCE,IAAI,CAAC,KAAK,GAAG;YACT,sBAAsB,EAAE,KAAK;SAChC,CAAC;IACN,CAAC;IAEe,iBAAiB;QAC7B,IAAI,CAAC,OAAO,GAAG,IAAI,oBAAO,CAAC,GAAG,EAAE;YAC5B,IAAI,CAAC,QAAQ,CAAC,EAAE,sBAAsB,EAAE,KAAK,EAAE,CAAC,CAAC;QACrD,CAAC,EAAE,cAAc,CAAC,CAAC;IACvB,CAAC;IAEe,kBAAkB,CAAC,SAAgB;QAC/C,IAAI,CAAC,SAAS,CAAC,MAAM,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC;YACzC,IAAI,CAAC,MAAM,EAAE,CAAC;QAClB,CAAC;QAED,IAAI,SAAS,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC;YACzC,IAAI,CAAC,OAAO,EAAE,CAAC;QACnB,CAAC;IACL,CAAC;IAEe,oBAAoB;;QAChC,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;IAMe,MAAM;;QAElB,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,MAAM,GAAG,GAAG,IAAA,oBAAU,EAAC,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,4BAAM,CAAC,MAAM,CAAC,CAAC;QAE5D,OAAO,CACH,uCAAK,SAAS,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK;YAC5B,GAAG;YACJ,uCAAK,SAAS,EAAE,4BAAM,CAAC,OAAO,IAEzB,YAAY,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAClC,CACJ,CACT,CAAC;IACN,CAAC;CACJ;AAEQ,wBAAM"}
+{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../../src/components/ui/drawer/Drawer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAuE;AAEvE,2CAAqC;AAErC,qDAAkD;AAElD,mDAAwD;AAExD,MAAM,cAAc,GAAG,GAAG,CAAC;AAU3B,MAAM,MAAM,GAAG,IAAA,kBAAU,EAA8B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;;IAClE,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC5E,MAAM,UAAU,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAEhD,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,UAAU,CAAC,OAAO,GAAG,IAAI,oBAAO,CAAC,GAAG,EAAE;YAClC,yBAAyB,CAAC,KAAK,CAAC,CAAC;QACrC,CAAC,EAAE,cAAc,CAAC,CAAC;QAEnB,OAAO,GAAG,EAAE;;YACR,MAAA,UAAU,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAC;YAC3B,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC;QAC9B,CAAC,CAAC;IACN,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAA,iBAAS,EAAC,GAAG,EAAE;;QACX,IAAI,KAAK,CAAC,MAAM,EAAE,CAAC;YACf,MAAA,UAAU,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAC;YAC3B,yBAAyB,CAAC,IAAI,CAAC,CAAC;QACpC,CAAC;aACI,CAAC;YACF,MAAA,UAAU,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;QAChC,CAAC;IACL,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAGnB,MAAM,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IACjC,MAAM,KAAK,GAAG;QACV,SAAS,EAAE,cAAc,CAAC,IAAI;KACjC,CAAC;IAEF,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,IAAI,sBAAsB,CAAC;IAE5D,MAAM,UAAU,GAAG,MAAA,KAAK,CAAC,UAAU,mCAAI,IAAI,CAAC;IAC5C,MAAM,GAAG,GAAG,UAAU,IAAI,8BAAC,qBAAS,IAAC,OAAO,EAAE,KAAK,CAAC,OAAO,GAAI,CAAC;IAEhE,OAAO,CACH,8BAAC,4BAAY,IAAC,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG;QAC3D,GAAG;QACJ,8BAAC,uBAAO,QAEH,YAAY,IAAI,KAAK,CAAC,QAAQ,CACzB,CACC,CAClB,CAAC;AACN,CAAC,CAAC,CAAC;AAOM,wBAAM;AALf,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC;AAC9B,MAAM,CAAC,QAAQ,GAAG,GAAG,EAAE,CAAC,4BAAY,CAAC,QAAQ,EAAE,CAAC;AAEhD,MAAM,qBAAqB,GAAG,uBAAO,CAAC,QAAQ,EAAE,CAAC;AAEhC,sDAAqB"}

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

@@ -0,0 +1,168 @@
+declare const StyledDrawer: import("@stitches/react/types/styled-component").StyledComponent<"div", {}, {}, import("@stitches/react/types/css-util").CSS<{}, {
+    colors: {
+        background: "white";
+        mainColor: "#008ad2";
+        mainColorAlt: "#006AA9";
+        activeBg: "#e7e7e7";
+        inactiveBg: "#d3d3de";
+        inactiveDarkBg: "#999";
+        toggleHandleBg: "#e0e0e0";
+        toggleHandleBorder: "#cdcdcd";
+        toggleBgDisabled: "#f0f0f0";
+        toggleHandleBorderDisabled: "#c29f7d";
+        toggleHandleBgDisabled: "#deae84";
+        icon: "#636363";
+        border: "#d5d5d5";
+        buttonBorder: "#bababa";
+        headerBorder: "#c8c8c9";
+        headerBg: "#efeff0";
+        headerText: "#484848";
+        text: "#323232";
+        sub: "#959595";
+        popText: "#666";
+        toolbarBorder: "#ababab";
+        toolbarBg: "#f8f8f8";
+        modalBg: "#f7f7f7";
+        modalButtonBg: "#f8f8f8";
+        modalButtonBorder: "#c2c2c2";
+        inputDisabledBg: "#f3f3f3";
+        inputDisabledText: "#959595";
+        choiceBg: "#ffffff";
+        choiceText: "#999999";
+        choiceActiveBg: "#f3f3f3";
+        choiceActiveText: "#313131";
+        choiceBorder: "#cfcfcf";
+        selectorText: "#606060";
+        selectorActive: "#008ad2";
+        blue1: "#038bf4";
+        blue2: "#b7d6f5";
+        blue3: "#dbe6ff";
+        blue4: "#33b4ff";
+        blue5: "#30a2e6";
+        orange1: "#ff7200";
+        orange1Darker: "#cc5b00";
+        purple1: "#7357e8";
+        green1: "#3ec234";
+        green1Darker: "#38af2f";
+        pink1: "#ff388f";
+        red1: "#ea2700";
+        yellow1: "#ffde9d";
+        yellow2: "#e4a429";
+        yellow3: "#fff5db";
+        pinky1: "#f5c0b7";
+        pinky2: "#e07b67";
+        pinky3: "#ffe1db";
+        grey1: "#737373";
+        focusColor: "#dcaf00";
+        scrollbarsThumb: "#737373";
+        scrollbarsBg: "transparent";
+        tableStripedBg: "#fafafa";
+        toolButtonText: "#666e80";
+    };
+}, import("@stitches/react/types/config").DefaultThemeMap, {
+    mx: (value: string | number) => {
+        marginLeft: string | number;
+        marginRight: string | number;
+    };
+    my: (value: string | number) => {
+        marginTop: string | number;
+        marginBottom: string | number;
+    };
+    px: (value: string | number) => {
+        paddingLeft: string | number;
+        paddingRight: string | number;
+    };
+    py: (value: string | number) => {
+        paddingTop: string | number;
+        paddingBottom: string | number;
+    };
+    size: (value: string | number) => {
+        width: string | number;
+        height: string | number;
+    };
+}>>;
+declare const Content: import("@stitches/react/types/styled-component").StyledComponent<"div", {}, {}, import("@stitches/react/types/css-util").CSS<{}, {
+    colors: {
+        background: "white";
+        mainColor: "#008ad2";
+        mainColorAlt: "#006AA9";
+        activeBg: "#e7e7e7";
+        inactiveBg: "#d3d3de";
+        inactiveDarkBg: "#999";
+        toggleHandleBg: "#e0e0e0";
+        toggleHandleBorder: "#cdcdcd";
+        toggleBgDisabled: "#f0f0f0";
+        toggleHandleBorderDisabled: "#c29f7d";
+        toggleHandleBgDisabled: "#deae84";
+        icon: "#636363";
+        border: "#d5d5d5";
+        buttonBorder: "#bababa";
+        headerBorder: "#c8c8c9";
+        headerBg: "#efeff0";
+        headerText: "#484848";
+        text: "#323232";
+        sub: "#959595";
+        popText: "#666";
+        toolbarBorder: "#ababab";
+        toolbarBg: "#f8f8f8";
+        modalBg: "#f7f7f7";
+        modalButtonBg: "#f8f8f8";
+        modalButtonBorder: "#c2c2c2";
+        inputDisabledBg: "#f3f3f3";
+        inputDisabledText: "#959595";
+        choiceBg: "#ffffff";
+        choiceText: "#999999";
+        choiceActiveBg: "#f3f3f3";
+        choiceActiveText: "#313131";
+        choiceBorder: "#cfcfcf";
+        selectorText: "#606060";
+        selectorActive: "#008ad2";
+        blue1: "#038bf4";
+        blue2: "#b7d6f5";
+        blue3: "#dbe6ff";
+        blue4: "#33b4ff";
+        blue5: "#30a2e6";
+        orange1: "#ff7200";
+        orange1Darker: "#cc5b00";
+        purple1: "#7357e8";
+        green1: "#3ec234";
+        green1Darker: "#38af2f";
+        pink1: "#ff388f";
+        red1: "#ea2700";
+        yellow1: "#ffde9d";
+        yellow2: "#e4a429";
+        yellow3: "#fff5db";
+        pinky1: "#f5c0b7";
+        pinky2: "#e07b67";
+        pinky3: "#ffe1db";
+        grey1: "#737373";
+        focusColor: "#dcaf00";
+        scrollbarsThumb: "#737373";
+        scrollbarsBg: "transparent";
+        tableStripedBg: "#fafafa";
+        toolButtonText: "#666e80";
+    };
+}, import("@stitches/react/types/config").DefaultThemeMap, {
+    mx: (value: string | number) => {
+        marginLeft: string | number;
+        marginRight: string | number;
+    };
+    my: (value: string | number) => {
+        marginTop: string | number;
+        marginBottom: string | number;
+    };
+    px: (value: string | number) => {
+        paddingLeft: string | number;
+        paddingRight: string | number;
+    };
+    py: (value: string | number) => {
+        paddingTop: string | number;
+        paddingBottom: string | number;
+    };
+    size: (value: string | number) => {
+        width: string | number;
+        height: string | number;
+    };
+}>>;
+export { StyledDrawer, Content, };
+//# sourceMappingURL=Drawer.styled.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.styled.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/drawer/Drawer.styled.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAUhB,CAAC;AAEH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAEX,CAAC;AAEH,OAAO,EACH,YAAY,EACZ,OAAO,GACV,CAAC"}

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

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Content = exports.StyledDrawer = void 0;
+const theme_1 = require("../../../theme");
+const StyledDrawer = (0, theme_1.styled)("div", {
+    position: "fixed",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    background: "white",
+    zIndex: 1,
+    transition: "transform 300ms",
+    overflow: "auto",
+});
+exports.StyledDrawer = StyledDrawer;
+const Content = (0, theme_1.styled)("div", {
+    height: "100%",
+});
+exports.Content = Content;
+//# sourceMappingURL=Drawer.styled.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.styled.js","sourceRoot":"","sources":["../../../../src/components/ui/drawer/Drawer.styled.ts"],"names":[],"mappings":";;;AAAA,0CAAwC;AAExC,MAAM,YAAY,GAAG,IAAA,cAAM,EAAC,KAAK,EAAE;IAC/B,QAAQ,EAAE,OAAO;IACjB,GAAG,EAAE,CAAC;IACN,IAAI,EAAE,CAAC;IACP,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,CAAC;IACT,UAAU,EAAE,OAAO;IACnB,MAAM,EAAE,CAAC;IACT,UAAU,EAAE,iBAAiB;IAC7B,QAAQ,EAAE,MAAM;CACnB,CAAC,CAAC;AAOC,oCAAY;AALhB,MAAM,OAAO,GAAG,IAAA,cAAM,EAAC,KAAK,EAAE;IAC1B,MAAM,EAAE,MAAM;CACjB,CAAC,CAAC;AAIC,0BAAO"}

package/dist/components/ui/keyValue/KeyValue.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-interface Props {
+type KeyValueProps = {
     items: {
         key?: React.ReactNode;
         value?: React.ReactNode;
@@ -9,7 +9,13 @@ interface Props {
     cols?: number;
     valueFirst?: boolean;
     className?: string;
-}
-declare const KeyValue: React.FC<Props>;
-export { KeyValue };
+};
+declare const KeyValue: React.ForwardRefExoticComponent<KeyValueProps & React.RefAttributes<HTMLDivElement>>;
+declare const KeyValueItemSelector: string;
+declare const KeyValuePairSelector: string;
+declare const KeyValueKeySelector: string;
+declare const KeyValueValueSelector: string;
+declare const KeyValueIconSelector: string;
+export { KeyValue, KeyValueItemSelector, KeyValuePairSelector, KeyValueKeySelector, KeyValueValueSelector, KeyValueIconSelector, };
+export type { KeyValueProps };
 //# sourceMappingURL=KeyValue.d.ts.map

package/dist/components/ui/keyValue/KeyValue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"KeyValue.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/keyValue/KeyValue.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,UAAU,KAAK;IACX,KAAK,EAAE;QAAE,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;KAAE,EAAE,CAAC;IAC1G,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAID,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAkD7B,CAAC;AAEF,OAAO,EAAE,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"KeyValue.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/keyValue/KeyValue.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAW1C,KAAK,aAAa,GAAG;IACjB,KAAK,EAAE;QAAE,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;KAAE,EAAE,CAAC;IAC1G,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAIF,QAAA,MAAM,QAAQ,sFAqDZ,CAAC;AAKH,QAAA,MAAM,oBAAoB,QAAkB,CAAC;AAC7C,QAAA,MAAM,oBAAoB,QAA0B,CAAC;AACrD,QAAA,MAAM,mBAAmB,QAAiB,CAAC;AAC3C,QAAA,MAAM,qBAAqB,QAAmB,CAAC;AAC/C,QAAA,MAAM,oBAAoB,QAAkB,CAAC;AAE7C,OAAO,EACH,QAAQ,EACR,oBAAoB,EACpB,oBAAoB,EACpB,mBAAmB,EACnB,qBAAqB,EACrB,oBAAoB,GACvB,CAAC;AACF,YAAY,EAAE,aAAa,EAAE,CAAC"}

package/dist/components/ui/keyValue/KeyValue.js

@@ -1,14 +1,43 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.KeyValue = void 0;
-const react_1 = __importDefault(require("react"));
-const classnames_1 = __importDefault(require("classnames"));
-const KeyValue_module_scss_1 = __importDefault(require("./KeyValue.module.scss"));
+exports.KeyValueIconSelector = exports.KeyValueValueSelector = exports.KeyValueKeySelector = exports.KeyValuePairSelector = exports.KeyValueItemSelector = exports.KeyValue = void 0;
+const react_1 = __importStar(require("react"));
+const KeyValue_styled_1 = require("./KeyValue.styled");
 const DEFAULT_COLS = 2;
-const KeyValue = (props) => {
+const KeyValue = (0, react_1.forwardRef)((props, ref) => {
     var _a;
     const cols = (_a = props.cols) !== null && _a !== void 0 ? _a : DEFAULT_COLS;
     const items = props.items.map((value, key) => {
@@ -16,19 +45,19 @@ const KeyValue = (props) => {
         const style = { width };
         const isFirstRow = key < cols;
         const isFirstCol = (key % cols) === 0;
-        const className = (0, classnames_1.default)(KeyValue_module_scss_1.default.item, {
-            [KeyValue_module_scss_1.default.itemNotFirstRow]: !isFirstRow,
-            [KeyValue_module_scss_1.default.itemNotFirstCol]: !isFirstCol,
-        });
-        const kvKey = value.key != null ? react_1.default.createElement("div", { className: KeyValue_module_scss_1.default.key }, value.key) : null;
-        const kvValue = value.value != null ? react_1.default.createElement("div", { className: KeyValue_module_scss_1.default.value }, value.value) : null;
-        const keyValue = (react_1.default.createElement("div", { className: KeyValue_module_scss_1.default.kv },
+        const kvKey = value.key != null ? react_1.default.createElement(KeyValue_styled_1.Key, null, value.key) : null;
+        const kvValue = value.value != null ? react_1.default.createElement(KeyValue_styled_1.Value, null, value.value) : null;
+        const keyValue = (react_1.default.createElement(KeyValue_styled_1.KeyValuePair, null,
             props.valueFirst ? kvValue : kvKey,
             !props.valueFirst ? kvValue : kvKey));
-        const icon = value.icon != null ? react_1.default.createElement("div", { className: KeyValue_module_scss_1.default.icon }, value.icon) : null;
+        const icon = value.icon != null ? react_1.default.createElement(KeyValue_styled_1.Icon, null, value.icon) : null;
         const component = value.onClick ? "button" : "div";
-        return react_1.default.createElement(component, {
-            key, style, className,
+        return react_1.default.createElement(KeyValue_styled_1.Item, {
+            key: key,
+            style: style,
+            as: component,
+            notFirstRow: !isFirstRow,
+            notFirstCol: !isFirstCol,
         }, react_1.default.createElement(react_1.default.Fragment, null,
             icon,
             keyValue));
@@ -38,10 +67,23 @@ const KeyValue = (props) => {
     if (missingItems) {
         const width = `${(100 / cols) * (missingItems)}%`;
         const style = { width };
-        const cls = (0, classnames_1.default)(KeyValue_module_scss_1.default.item, KeyValue_module_scss_1.default.missingItem);
-        items.push(react_1.default.createElement("div", { key: "extra", style: style, className: cls }));
+        const firstRow = items.length < cols;
+        const firstCol = (items.length % cols) === 0;
+        items.push(react_1.default.createElement(KeyValue_styled_1.Item, { key: "extra", css: style, notFirstCol: !firstCol, notFirstRow: !firstRow }));
     }
-    return (react_1.default.createElement("div", { className: (0, classnames_1.default)(KeyValue_module_scss_1.default.container, props.className) }, items));
-};
+    return (react_1.default.createElement(KeyValue_styled_1.Container, { className: props.className, ref: ref }, items));
+});
 exports.KeyValue = KeyValue;
+KeyValue.displayName = "KeyValue";
+KeyValue.toString = () => KeyValue_styled_1.Container.toString();
+const KeyValueItemSelector = KeyValue_styled_1.Item.toString();
+exports.KeyValueItemSelector = KeyValueItemSelector;
+const KeyValuePairSelector = KeyValue_styled_1.KeyValuePair.toString();
+exports.KeyValuePairSelector = KeyValuePairSelector;
+const KeyValueKeySelector = KeyValue_styled_1.Key.toString();
+exports.KeyValueKeySelector = KeyValueKeySelector;
+const KeyValueValueSelector = KeyValue_styled_1.Value.toString();
+exports.KeyValueValueSelector = KeyValueValueSelector;
+const KeyValueIconSelector = KeyValue_styled_1.Icon.toString();
+exports.KeyValueIconSelector = KeyValueIconSelector;
 //# sourceMappingURL=KeyValue.js.map

package/dist/components/ui/keyValue/KeyValue.js.map

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