@cube-dev/ui-kit 0.9.6 → 0.9.7

package/dist/cjs/components/content/Badge/Badge.js

@@ -1,58 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Badge = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const themes_1 = __importDefault(require("../../../data/themes"));
-const list_1 = require("../../../styles/list");
-const styles_1 = require("../../../utils/styles");
-const filterBaseProps_1 = require("../../../utils/filterBaseProps");
-const styled_1 = require("../../../styled");
-const RawBadge = (0, styled_1.styled)({
-    name: 'Badge',
-    props: { role: 'region' },
-    styles: {
-        display: 'inline-flex',
-        placeContent: 'center',
-        placeItems: 'center',
-        padding: {
-            '': '0',
-            single: '0 1px',
-            multiple: '0 2px',
-        },
-        radius: 'round',
-        preset: 'tag',
-        width: 'min 16px',
-        height: '16px',
-        textAlign: 'center',
-        fontWeight: 600,
-        color: '#white',
-        fill: {
-            '': '#purple',
-            ...Object.keys(themes_1.default).reduce((map, type) => {
-                map[`[data-type="${type}"]`] = themes_1.default[type].color;
-                return map;
-            }, {}),
-        },
-    },
-});
-exports.Badge = (0, react_1.forwardRef)((allProps, ref) => {
-    let { type, children, ...props } = allProps;
-    const styles = (0, styles_1.extractStyles)(props, list_1.CONTAINER_STYLES);
-    return ((0, jsx_runtime_1.jsx)(RawBadge, { ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), "data-type": type, mods: {
-            single: typeof children === 'string' && children.length === 1,
-            multiple: typeof children === 'string' && children.length === 2,
-        }, styles: styles, ref: ref, children: children }, void 0));
-});
-
-        

package/dist/cjs/components/content/Card/Card.js

@@ -1,30 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Card = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Base_1 = require("../../Base");
-const list_1 = require("../../../styles/list");
-const styles_1 = require("../../../utils/styles");
-const filterBaseProps_1 = require("../../../utils/filterBaseProps");
-const DEFAULT_STYLES = {
-    display: 'block',
-    flow: 'column',
-    radius: '1x',
-    fill: '#white',
-    border: true,
-    padding: '3x',
-};
-exports.Card = (0, react_1.forwardRef)((props, ref) => {
-    const styles = (0, styles_1.extractStyles)(props, list_1.CONTAINER_STYLES, DEFAULT_STYLES);
-    return ((0, jsx_runtime_1.jsx)(Base_1.Base, { role: "region", ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
-});
-
-        

package/dist/cjs/components/content/Content.js

@@ -1,42 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Content = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const styled_1 = require("../../styled");
-const list_1 = require("../../styles/list");
-const styles_1 = require("../../utils/styles");
-const filterBaseProps_1 = require("../../utils/filterBaseProps");
-const react_2 = require("../../utils/react");
-const STYLE_LIST = [...list_1.CONTAINER_STYLES, ...list_1.TEXT_STYLES];
-const RawContent = (0, styled_1.styled)({
-    name: 'Content',
-    tag: 'section',
-    styles: {
-        gridArea: 'content',
-        preset: 'p3',
-        color: '#dark.75',
-        display: 'block',
-        flow: 'column',
-        gap: '2x',
-        overflow: 'auto',
-        styledScrollbar: true,
-    },
-    props: {
-        'data-id': 'Content',
-    },
-});
-exports.Content = (0, react_1.forwardRef)((props, ref) => {
-    props = (0, react_2.useSlotProps)(props, 'content');
-    const styles = (0, styles_1.extractStyles)(props, STYLE_LIST);
-    return ((0, jsx_runtime_1.jsx)(RawContent, { ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
-});
-
-        

package/dist/cjs/components/content/Divider.js

@@ -1,53 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Divider = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Base_1 = require("../Base");
-const list_1 = require("../../styles/list");
-const styles_1 = require("../../utils/styles");
-const filterBaseProps_1 = require("../../utils/filterBaseProps");
-const react_2 = require("../../utils/react");
-const STYLE_LIST = [...list_1.OUTER_STYLES, ...list_1.BASE_STYLES, ...list_1.COLOR_STYLES];
-const DEFAULT_STYLES = {
-    gridArea: 'divider',
-    display: {
-        '': 'block',
-        text: 'grid',
-    },
-    gridColumns: '1fr auto 1fr',
-    placeItems: 'center stretch',
-    gap: '1x',
-    preset: 'c1',
-    height: {
-        '': '1bw 1bw',
-        text: 'auto',
-    },
-    fill: {
-        '': '#border',
-        text: 'none',
-    },
-    border: '0',
-    margin: '0',
-    Line: {
-        height: '1bw 1bw',
-        fill: '#border',
-    },
-};
-exports.Divider = (0, react_1.forwardRef)((props, ref) => {
-    const { mods, children, ...otherProps } = (0, react_2.useSlotProps)(props, 'divider');
-    const styles = (0, styles_1.extractStyles)(otherProps, STYLE_LIST, DEFAULT_STYLES);
-    return ((0, jsx_runtime_1.jsx)(Base_1.Base, { as: children ? 'div' : 'hr', role: children ? 'separator' : undefined, mods: {
-            text: !!children,
-            ...mods,
-        }, "data-id": "Divider", ...(0, filterBaseProps_1.filterBaseProps)(otherProps, { eventProps: true }), styles: styles, ref: ref, children: children && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { "data-element": "Line" }, void 0), (0, jsx_runtime_1.jsx)("div", { children: children }, void 0), (0, jsx_runtime_1.jsx)("div", { "data-element": "Line" }, void 0)] }, void 0)) }, void 0));
-});
-
-        

package/dist/cjs/components/content/Footer.js

@@ -1,36 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Footer = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const list_1 = require("../../styles/list");
-const styles_1 = require("../../utils/styles");
-const filterBaseProps_1 = require("../../utils/filterBaseProps");
-const react_2 = require("../../utils/react");
-const styled_1 = require("../../styled");
-const STYLE_LIST = [...list_1.CONTAINER_STYLES, ...list_1.TEXT_STYLES];
-const RawFooter = (0, styled_1.styled)({
-    name: 'Footer',
-    styles: {
-        gridArea: 'footer',
-        display: 'block',
-        flow: 'column',
-    },
-    props: {
-        'data-id': 'Footer',
-    },
-});
-exports.Footer = (0, react_1.forwardRef)((props, ref) => {
-    props = (0, react_2.useSlotProps)(props, 'footer');
-    const styles = (0, styles_1.extractStyles)(props, STYLE_LIST);
-    return ((0, jsx_runtime_1.jsx)(RawFooter, { ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
-});
-
-        

package/dist/cjs/components/content/Header.js

@@ -1,35 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Header = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const styled_1 = require("../../styled");
-const list_1 = require("../../styles/list");
-const styles_1 = require("../../utils/styles");
-const filterBaseProps_1 = require("../../utils/filterBaseProps");
-const react_2 = require("../../utils/react");
-const STYLE_LIST = [...list_1.CONTAINER_STYLES, ...list_1.TEXT_STYLES];
-const RawHeader = (0, styled_1.styled)({
-    name: 'Header',
-    tag: 'header',
-    props: { 'data-id': 'Header' },
-    styles: {
-        display: 'block',
-        gridArea: 'header',
-        flow: 'column',
-    },
-});
-exports.Header = (0, react_1.forwardRef)((props, ref) => {
-    props = (0, react_2.useSlotProps)(props, 'header');
-    const styles = (0, styles_1.extractStyles)(props, STYLE_LIST);
-    return ((0, jsx_runtime_1.jsx)(RawHeader, { ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
-});
-
-        

package/dist/cjs/components/content/Paragraph.js

@@ -1,27 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Paragraph = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Text_1 = require("./Text");
-const list_1 = require("../../styles/list");
-const styles_1 = require("../../utils/styles");
-const DEFAULT_STYLES = {
-    preset: 'p3',
-    color: '#dark.75',
-    display: 'block',
-};
-const STYLE_PROPS = [...list_1.CONTAINER_STYLES, ...list_1.TEXT_STYLES];
-exports.Paragraph = (0, react_1.forwardRef)((props, ref) => {
-    const styles = (0, styles_1.extractStyles)(props, STYLE_PROPS, DEFAULT_STYLES);
-    return (0, jsx_runtime_1.jsx)(Text_1.Text, { as: "p", qa: "Paragraph", ...props, styles: styles, ref: ref }, void 0);
-});
-
-        

package/dist/cjs/components/content/Placeholder/Placeholder.js

@@ -1,51 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Placeholder = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Base_1 = require("../../Base");
-const list_1 = require("../../../styles/list");
-const styles_1 = require("../../../utils/styles");
-const filterBaseProps_1 = require("../../../utils/filterBaseProps");
-const DEFAULT_STYLES = {
-    display: 'block',
-    fill: '#dark.10',
-    height: '2x',
-    opacity: '.35',
-};
-const CSS = `
-  --placeholder-animation-time: 1.4s;
-  --placeholder-animation-size: calc((180rem + 100vw) / 3);
-  background-image: linear-gradient(135deg, rgba(var(--dark-color-rgb), .15) 0%, rgba(var(--dark-color-rgb), .15) 5%, rgba(var(--dark-color-rgb), 0) 35%, rgba(var(--dark-03-color-rgb), .2) 50%, rgba(var(--dark-03-color-rgb), 0) 65%, rgba(var(--dark-color-rgb), .15) 95%, rgba(var(--dark-color-rgb), .15) 100%);
-  background-repeat: repeat;
-  background-size: var(--placeholder-animation-size);
-  animation: placeholder-animation var(--placeholder-animation-time) linear infinite;
-
-  @keyframes placeholder-animation {
-    0% {
-      background-position: 0 0;
-    }
-    100% {
-      background-position: var(--placeholder-animation-size) 0;
-    }
-  }
-`;
-exports.Placeholder = (0, react_1.forwardRef)((allProps, ref) => {
-    let { size = '2x', circle, ...props } = allProps;
-    const styles = (0, styles_1.extractStyles)(props, list_1.CONTAINER_STYLES, {
-        ...DEFAULT_STYLES,
-        height: size,
-        width: circle ? size : false,
-        radius: circle ? '9999rem' : '1r',
-    });
-    return ((0, jsx_runtime_1.jsx)(Base_1.Base, { role: "region", css: CSS, ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
-});
-
-        

package/dist/cjs/components/content/PrismCode/PrismCode.js

@@ -1,44 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PrismCode = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const prismjs_1 = __importDefault(require("prismjs"));
-const styled_1 = require("../../../styled");
-const list_1 = require("../../../styles/list");
-const RawPre = (0, styled_1.styled)({
-    name: 'CodeBlock',
-    tag: 'pre',
-    styleProps: list_1.CONTAINER_STYLES.concat([]),
-    props: { className: 'cube-prism-code' },
-    styles: {
-        margin: 0,
-        Code: {
-            display: 'block',
-        },
-    },
-});
-function PrismCode(props, ref) {
-    let { code, language = 'javascript', ...otherProps } = props;
-    (0, react_1.useEffect)(() => {
-        prismjs_1.default.highlightAll();
-    });
-    return ((0, jsx_runtime_1.jsx)(RawPre, { ref: ref, className: "cube-prism-code", ...otherProps, children: (0, jsx_runtime_1.jsx)("code", { "data-element": "Code", className: `language-${language}`, children: code }, void 0) }, void 0));
-}
-/**
- * Code block with syntax highlighting
- */
-const _PrismCode = (0, react_1.forwardRef)(PrismCode);
-exports.PrismCode = _PrismCode;
-
-        

package/dist/cjs/components/content/Result/Result.js

@@ -1,105 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Result = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const icons_1 = require("@ant-design/icons");
-const Title_1 = require("../Title");
-const styled_1 = require("../../../styled");
-const list_1 = require("../../../styles/list");
-const filterBaseProps_1 = require("../../../utils/filterBaseProps");
-const styles_1 = require("../../../utils/styles");
-const react_2 = require("../../../utils/react");
-const Container = (0, styled_1.styled)({
-    name: 'ResultContainer',
-    tag: 'section',
-    styles: {
-        display: 'flex',
-        flow: 'column',
-        placeItems: 'center',
-        gap: '3x',
-        padding: '6x 4x',
-        textAlign: 'center',
-        Content: {
-            display: 'block',
-        },
-        Title: {
-            display: 'flex',
-            flow: 'column',
-            placeItems: 'inherit',
-            gap: '1x',
-        },
-    },
-});
-const IconWrapper = (0, styled_1.styled)({
-    styles: {
-        fontSize: '10x',
-    },
-});
-const statusIconMap = {
-    success: {
-        color: '#success',
-        component: icons_1.CheckCircleFilled,
-    },
-    error: {
-        color: '#danger',
-        component: icons_1.CloseCircleFilled,
-    },
-    info: {
-        color: '#purple',
-        component: icons_1.InfoCircleFilled,
-    },
-    warning: {
-        color: '#note',
-        component: icons_1.WarningFilled,
-    },
-    404: {
-        color: '#purple',
-        component: () => {
-            // TODO: Needs to be implemented in the future
-            return null;
-        },
-    },
-    403: {
-        color: '#purple',
-        component: () => {
-            // TODO: Needs to be implemented in the future
-            return null;
-        },
-    },
-    500: {
-        color: '#purple',
-        component: () => {
-            // TODO: Needs to be implemented in the future
-            return null;
-        },
-    },
-};
-function Result(props, ref) {
-    const { children, icon, status, subTitle, title, ...otherProps } = props;
-    if (icon && status) {
-        console.warn('Don\'t use "icon" and "status" together, it can lead to possible errors.');
-    }
-    const iconNode = (0, react_1.useMemo)(() => {
-        if (icon) {
-            return icon;
-        }
-        const { color, component: Component } = status && statusIconMap.hasOwnProperty(status)
-            ? statusIconMap[status]
-            : statusIconMap.info;
-        return ((0, jsx_runtime_1.jsx)(IconWrapper, { "data-element": "IconWrapper", styles: { color }, children: (0, jsx_runtime_1.jsx)(Component, { "data-element": "Icon" }, void 0) }, void 0));
-    }, [icon, status]);
-    const styles = (0, styles_1.extractStyles)(otherProps, list_1.CONTAINER_STYLES);
-    return ((0, jsx_runtime_1.jsxs)(Container, { ...(0, filterBaseProps_1.filterBaseProps)(otherProps, { eventProps: true }), ref: ref, styles: styles, children: [iconNode, (title || subTitle) && ((0, jsx_runtime_1.jsxs)("div", { "data-element": "Title", children: [(0, react_2.wrapNodeIfPlain)(title, () => ((0, jsx_runtime_1.jsx)(Title_1.Title, { level: 2, preset: "h4", children: title }, void 0))), (0, react_2.wrapNodeIfPlain)(subTitle, () => ((0, jsx_runtime_1.jsx)(Title_1.Title, { level: 3, preset: "h5m", children: subTitle }, void 0)))] }, void 0)), children && (0, jsx_runtime_1.jsx)("div", { "data-element": "Content", children: children }, void 0)] }, void 0));
-}
-const _Result = (0, react_1.forwardRef)(Result);
-exports.Result = _Result;
-
-        

package/dist/cjs/components/content/Skeleton/Skeleton.js

@@ -1,79 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Skeleton = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Placeholder_1 = require("../Placeholder/Placeholder");
-const Flow_1 = require("../../layout/Flow");
-const Space_1 = require("../../layout/Space");
-const Grid_1 = require("../../layout/Grid");
-const LAYOUT_MAP = {
-    page({ lines, children, ...props }) {
-        return ((0, jsx_runtime_1.jsxs)(Flow_1.Flow, { gap: "4x", ...props, children: [(0, jsx_runtime_1.jsxs)(Space_1.Space, { placeContent: "space-between", children: [(0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, { width: "100px 25% 300px" }, void 0), (0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, { width: "50px 10% 150px" }, void 0)] }, void 0), (0, jsx_runtime_1.jsx)(Flow_1.Flow, { gap: "2x", children: children
-                        || Array(lines || 5)
-                            .fill(0)
-                            .map((item, i) => (0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, {}, i)) }, void 0)] }, void 0));
-    },
-    content({ children, lines, ...props }) {
-        return ((0, jsx_runtime_1.jsx)(Flow_1.Flow, { gap: "2x", ...props, children: children
-                || Array(lines || 5)
-                    .fill(0)
-                    .map((item, i) => (0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, {}, i)) }, void 0));
-    },
-    topbar(props) {
-        return ((0, jsx_runtime_1.jsxs)(Space_1.Space, { gap: "4x", placeContent: "space-between", height: "6x", padding: "1x", border: "bottom", ...props, children: [(0, jsx_runtime_1.jsxs)(Space_1.Space, { children: [(0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, { circle: true, size: "4x" }, void 0), (0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, { width: "20x" }, void 0)] }, void 0), (0, jsx_runtime_1.jsxs)(Space_1.Space, { children: [(0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, { width: "10x" }, void 0), (0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, { circle: true, size: "4x" }, void 0)] }, void 0)] }, void 0));
-    },
-    menu({ lines, ...props }) {
-        return ((0, jsx_runtime_1.jsx)(Flow_1.Flow, { gap: "3.25x", ...props, padding: "3x 1x", children: Array(lines || 5)
-                .fill(0)
-                .map((item, i) => ((0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, {}, i))) }, void 0));
-    },
-    stats({ cards, ...props }) {
-        return ((0, jsx_runtime_1.jsx)(Space_1.Space, { gap: "4x", ...props, children: Array(cards || 3)
-                .fill(0)
-                .map((item, i) => ((0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, { radius: "1x", width: "20x", height: "12x", flexGrow: 1 }, i))) }, void 0));
-    },
-    tabs({ tabs, children, lines, ...props }) {
-        return ((0, jsx_runtime_1.jsxs)(Flow_1.Flow, { gap: "4x", ...props, children: [(0, jsx_runtime_1.jsx)(Space_1.Space, { children: Array(tabs || 3)
-                        .fill(0)
-                        .map((item, i) => ((0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, { width: "15x" }, i))) }, void 0), (0, jsx_runtime_1.jsx)(Flow_1.Flow, { gap: "2x", children: children
-                        || Array(lines || 5)
-                            .fill(0)
-                            .map((item, i) => (0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, {}, i)) }, void 0)] }, void 0));
-    },
-    table({ rows, columns, ...props }) {
-        columns = columns || 5;
-        rows = rows || 5;
-        return ((0, jsx_runtime_1.jsx)(Grid_1.Grid, { columns: `repeat(${columns}, 1fr)`, gap: "3x", ...props, padding: "1x 0", children: Array(rows)
-                .fill(0)
-                .map((item, i) => {
-                return Array(columns)
-                    .fill(0)
-                    .map((item, j) => {
-                    return ((0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, { size: !i ? '3x' : '2x' }, `${i}.${j}`));
-                });
-            }) }, void 0));
-    },
-    chart({ columns, ...props }) {
-        columns = columns || 12;
-        const heightMap = [1, 4, 2, 5, 8, 9, 5, 3, 4, 2, 6, 7, 2];
-        return ((0, jsx_runtime_1.jsx)(Grid_1.Grid, { columns: `repeat(${columns}, 1fr)`, gap: "3x", padding: "1x 0", placeItems: "end stretch", height: "40x", ...props, children: Array(columns)
-                .fill(0)
-                .map((item, i) => {
-                return ((0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, { height: `${heightMap[i % 12] * 10}%`, width: "max 6x" }, i));
-            }) }, void 0));
-    },
-};
-function Skeleton({ layout, ...props }) {
-    layout = layout || 'page';
-    return LAYOUT_MAP[layout] ? (LAYOUT_MAP[layout]({ ...props, qa: 'Skeleton' })) : ((0, jsx_runtime_1.jsx)(Placeholder_1.Placeholder, { ...props }, void 0));
-}
-exports.Skeleton = Skeleton;
-
-        

package/dist/cjs/components/content/Tag/Tag.js

@@ -1,94 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.6
- * Released under the MIT license.
- */
-
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Tag = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const themes_1 = __importDefault(require("../../../data/themes"));
-const list_1 = require("../../../styles/list");
-const styles_1 = require("../../../utils/styles");
-const filterBaseProps_1 = require("../../../utils/filterBaseProps");
-const Action_1 = require("../../actions/Action");
-const Suffix_1 = require("../../layout/Suffix");
-const Block_1 = require("../../Block");
-const icons_1 = require("@ant-design/icons");
-const styled_1 = require("../../../styled");
-const RawTag = (0, styled_1.styled)({
-    name: 'Tag',
-    styles: {
-        position: 'relative',
-        display: 'inline-flex',
-        placeContent: 'center start',
-        placeItems: 'center start',
-        radius: '1r',
-        preset: 't4m',
-        width: '16px max-content max-content',
-        height: 'min-content',
-        textAlign: 'left',
-        whiteSpace: 'nowrap',
-        padding: {
-            '': '0 (1x - 1bw)',
-            closable: '0 (2.5x - 1bw) 0 (1x - 1bw)',
-        },
-        fill: {
-            '': '#dark.04',
-            ...Object.keys(themes_1.default).reduce((map, type) => {
-                map[`[data-type="${type}"]`] = themes_1.default[type].fill;
-                return map;
-            }, {}),
-        },
-        color: {
-            '': '#dark.65',
-            ...Object.keys(themes_1.default).reduce((map, type) => {
-                map[`[data-type="${type}"]`] = themes_1.default[type].color;
-                return map;
-            }, {}),
-        },
-        border: {
-            '': true,
-            ...Object.keys(themes_1.default).reduce((map, type) => {
-                map[`[data-type="${type}"]`] = themes_1.default[type].border;
-                return map;
-            }, {}),
-        },
-    },
-    props: { role: 'status' },
-});
-const DEFAULT_CONTENT_STYLES = {
-    width: 'max 100%',
-    textOverflow: 'ellipsis',
-    overflow: 'hidden',
-    pointerEvents: 'none',
-};
-const DEFAULT_CLOSE_STYLES = {
-    display: 'grid',
-    placeItems: 'center',
-    color: true,
-    placeSelf: 'center',
-    opacity: {
-        '': 0.85,
-        'pressed | hovered': 1,
-    },
-    transition: 'opacity',
-    padding: '0 .5x',
-};
-const Tag = (allProps, ref) => {
-    let { type, isClosable, onClose, children, ...props } = allProps;
-    const styles = (0, styles_1.extractStyles)(props, list_1.CONTAINER_STYLES);
-    return ((0, jsx_runtime_1.jsxs)(RawTag, { ...(0, filterBaseProps_1.filterBaseProps)(props, { eventProps: true }), styles: styles, "data-type": type, mods: { closable: isClosable }, ref: ref, children: [(0, jsx_runtime_1.jsx)(Block_1.Block, { mods: { closable: isClosable }, styles: DEFAULT_CONTENT_STYLES, children: children }, void 0), isClosable ? ((0, jsx_runtime_1.jsx)(Suffix_1.Suffix, { outerGap: "0", children: (0, jsx_runtime_1.jsx)(Action_1.Action, { onPress: onClose, styles: DEFAULT_CLOSE_STYLES, label: "Close", children: (0, jsx_runtime_1.jsx)(icons_1.CloseOutlined, { style: {
-                            fontSize: 'calc(var(--font-size) - (var(--border-width) * 2))',
-                        } }, void 0) }, void 0) }, void 0)) : undefined] }, void 0));
-};
-const _Tag = (0, react_1.forwardRef)(Tag);
-exports.Tag = _Tag;
-
-