@cube-dev/ui-kit 0.9.4 → 0.9.7

package/dist/cjs/styles/color.js

@@ -1,43 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.colorStyle = void 0;
-const styles_1 = require("../utils/styles");
-function colorStyle({ color }) {
-    if (!color)
-        return '';
-    if (color === true)
-        color = 'currentColor';
-    if (color.startsWith('#')) {
-        color = (0, styles_1.parseColor)(color).color || color;
-    }
-    const match = color.match(/var\(--(.+?)-color/);
-    let name = '';
-    if (match) {
-        name = match[1];
-    }
-    const styles = [
-        {
-            color: color,
-        },
-    ];
-    if (name) {
-        styles.push([
-            {
-                '--current-color': `var(--${name}-color, ${name})`,
-                '--current-color-rgb': `var(--${name}-color-rgb)`,
-            },
-        ]);
-    }
-    return styles;
-}
-exports.colorStyle = colorStyle;
-colorStyle.__lookupStyles = ['color'];
-
-        

package/dist/cjs/styles/dimension.js

@@ -1,89 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.dimensionStyle = void 0;
-const styles_1 = require("../utils/styles");
-const DEFAULT_MIN_SIZE = 'var(--gap)';
-const DEFAULT_MAX_SIZE = '100%';
-function isSizingSupport(val) {
-    return typeof CSS !== 'undefined' && typeof CSS.supports !== 'undefined'
-        ? CSS.supports('height', val)
-        : false;
-}
-const STRETCH = 'stretch';
-const FILL_AVAILABLE = 'fill-available';
-const WEBKIT_FILL_AVAILABLE = '-webkit-fill-available';
-const MOZ_FILL_AVAILABLE = '-moz-fill-available';
-const STRETCH_SIZE = isSizingSupport(STRETCH)
-    ? STRETCH
-    : isSizingSupport(FILL_AVAILABLE)
-        ? FILL_AVAILABLE
-        : isSizingSupport(WEBKIT_FILL_AVAILABLE)
-            ? WEBKIT_FILL_AVAILABLE
-            : isSizingSupport(MOZ_FILL_AVAILABLE)
-                ? MOZ_FILL_AVAILABLE
-                : null;
-const INTRINSIC_MODS = ['max-content', 'min-content', 'fit-content', 'stretch'];
-function dimensionStyle(name) {
-    const minStyle = `min-${name}`;
-    const maxStyle = `max-${name}`;
-    return (val) => {
-        if (!val)
-            return '';
-        if (typeof val === 'number') {
-            val = `${val}px`;
-        }
-        val = String(val);
-        const styles = {
-            [name]: 'auto',
-            [minStyle]: 'initial',
-            [maxStyle]: 'initial',
-        };
-        const { mods, values } = (0, styles_1.parseStyle)(val);
-        (0, styles_1.transferMods)(INTRINSIC_MODS, mods, values);
-        values.forEach((v, i) => {
-            if (v === 'stretch') {
-                values[i] = STRETCH_SIZE || (name === 'height' ? '100vh' : '100vw');
-            }
-        });
-        let flag = false;
-        for (let mod of mods) {
-            switch (mod) {
-                case 'min':
-                    styles[minStyle] = values[0] || DEFAULT_MIN_SIZE;
-                    flag = true;
-                    break;
-                case 'max':
-                    styles[maxStyle] = values[0] || DEFAULT_MAX_SIZE;
-                    flag = true;
-                    break;
-                default:
-                    break;
-            }
-        }
-        if (!flag || !mods.length) {
-            if (values.length === 2) {
-                styles[minStyle] = values[0];
-                styles[maxStyle] = values[1];
-            }
-            else if (values.length === 3) {
-                styles[minStyle] = values[0];
-                styles[name] = values[1];
-                styles[maxStyle] = values[2];
-            }
-            else {
-                styles[name] = values[0] || 'auto';
-            }
-        }
-        return styles;
-    };
-}
-exports.dimensionStyle = dimensionStyle;
-
-        

package/dist/cjs/styles/display.js

@@ -1,17 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.displayStyle = void 0;
-function displayStyle({ display, hide }) {
-    return { display: !hide ? display : 'none' };
-}
-exports.displayStyle = displayStyle;
-displayStyle.__lookupStyles = ['display', 'hide'];
-
-        

package/dist/cjs/styles/fill.js

@@ -1,42 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.fillStyle = void 0;
-const styles_1 = require("../utils/styles");
-function fillStyle({ fill }) {
-    if (!fill)
-        return '';
-    if (fill.startsWith('#')) {
-        fill = (0, styles_1.parseStyle)(fill).color || fill;
-    }
-    const match = fill.match(/var\(--(.+?)-color/);
-    let name = '';
-    if (match) {
-        name = match[1];
-    }
-    const styles = [
-        {
-            'background-color': fill,
-        },
-    ];
-    if (name) {
-        styles.push([
-            {
-                $: '>*',
-                '--context-fill-color': fill,
-                '--context-fill-color-rgb': `var(--${name}-color-rgb)`,
-            },
-        ]);
-    }
-    return styles;
-}
-exports.fillStyle = fillStyle;
-fillStyle.__lookupStyles = ['fill'];
-
-        

package/dist/cjs/styles/flow.js

@@ -1,24 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.flowStyle = void 0;
-function flowStyle({ display = 'block', flow }) {
-    let style;
-    if (display.includes('grid')) {
-        style = 'grid-auto-flow';
-    }
-    else if (display.includes('flex')) {
-        style = 'flex-flow';
-    }
-    return style ? { [style]: flow } : null;
-}
-exports.flowStyle = flowStyle;
-flowStyle.__lookupStyles = ['display', 'flow'];
-
-        

package/dist/cjs/styles/font.js

@@ -1,27 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.fontStyle = void 0;
-function fontStyle({ font }) {
-    if (font == null || font === false)
-        return null;
-    const fontFamily = font === 'monospace'
-        ? 'var(--monospace-font)'
-        : font === true
-            ? 'var(--font)'
-            : `${font}, var(--font)`;
-    return {
-        'font-family': fontFamily,
-        '--font-family': fontFamily,
-    };
-}
-exports.fontStyle = fontStyle;
-fontStyle.__lookupStyles = ['font'];
-
-        

package/dist/cjs/styles/fontStyle.js

@@ -1,23 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.fontStyleStyle = void 0;
-function fontStyleStyle({ fontStyle }) {
-    if (fontStyle === true) {
-        fontStyle = 'italic';
-    }
-    if (fontStyle !== 'inherit') {
-        fontStyle = fontStyle ? 'italic' : 'normal';
-    }
-    return { 'font-style': fontStyle };
-}
-exports.fontStyleStyle = fontStyleStyle;
-fontStyleStyle.__lookupStyles = ['fontStyle'];
-
-        

package/dist/cjs/styles/gap.js

@@ -1,67 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.gapStyle = void 0;
-const styles_1 = require("../utils/styles");
-function gapStyle({ display, flow, gap }) {
-    if (typeof gap === 'number') {
-        gap = `${gap}px`;
-    }
-    if (!gap) {
-        return;
-    }
-    if (gap === true) {
-        gap = '1.5x';
-    }
-    const isGrid = display.includes('grid');
-    const isFlex = display.includes('flex');
-    const isWrap = flow
-        ? flow.includes('wrap') && !flow.includes('nowrap')
-        : false;
-    if (!isGrid && flow == null) {
-        flow = isFlex ? 'row' : 'column';
-    }
-    const { values } = (0, styles_1.parseStyle)(gap);
-    gap = values.join(' ');
-    if (isGrid) {
-        return { gap };
-    }
-    const isReverse = isFlex && flow.includes('reverse');
-    const gapDir = gap && !isGrid
-        ? !isReverse
-            ? flow.includes('row')
-                ? 'right'
-                : 'bottom'
-            : flow.includes('row')
-                ? 'left'
-                : 'top'
-        : '';
-    const marginFirst = isReverse ? 'margin-left' : 'margin-right';
-    const marginSecond = isReverse ? 'margin-top' : 'margin-bottom';
-    return isWrap
-        ? [
-            {
-                [marginFirst]: `calc(-1 * ${values[1] || values[0]})`,
-                [marginSecond]: `calc(-1 * ${values[0]})`,
-            },
-            {
-                $: '& > *',
-                [marginFirst]: values[1] || values[0],
-                [marginSecond]: values[0],
-            },
-        ]
-        : {
-            $: '& > *:not(:last-child)',
-            [`margin-${gapDir}`]: gap,
-        };
-}
-exports.gapStyle = gapStyle;
-gapStyle.__lookupStyles = ['display', 'flow', 'gap'];
-
-        

package/dist/cjs/styles/groupRadius.js

@@ -1,64 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.groupRadiusAttr = void 0;
-const styles_1 = require("../utils/styles");
-const MAP = {
-    row: ['* 0 0 *', '0 * * 0'],
-    column: ['* * 0 0', '0 0 * *'],
-};
-function groupRadiusAttr({ groupRadius, flow }) {
-    if (!groupRadius)
-        return '';
-    if (groupRadius === true)
-        groupRadius = '1r';
-    const { values, mods } = (0, styles_1.parseStyle)(groupRadius);
-    flow = flow || 'row';
-    const reverse = mods.includes('reverse');
-    let value = values[0];
-    if (!value) {
-        if (mods.includes('round')) {
-            value = '9999rem';
-        }
-        else if (mods.includes('ellipse')) {
-            value = '50%';
-        }
-        else {
-            value = 'var(--radius)';
-        }
-    }
-    const startValue = MAP[flow][reverse ? 1 : 0].replace(/\*/g, value);
-    const endValue = MAP[flow][reverse ? 0 : 1].replace(/\*/g, value);
-    return [
-        {
-            $: '>:first-child:not(:last-child)',
-            'border-radius': startValue,
-            '--local-radius': startValue,
-        },
-        {
-            $: '>:last-child:not(:first-child)',
-            'border-radius': endValue,
-            '--local-radius': endValue,
-        },
-        {
-            $: '>:last-child:first-child',
-            'border-radius': value,
-            '--local-radius': value,
-        },
-        {
-            $: '>:not(:last-child):not(:first-child)',
-            'border-radius': '0',
-            '--local-radius': '0',
-        },
-    ];
-}
-exports.groupRadiusAttr = groupRadiusAttr;
-groupRadiusAttr.__lookupStyles = ['groupRadius', 'flow'];
-
-        

package/dist/cjs/styles/height.js

@@ -1,19 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.heightStyle = void 0;
-const dimension_1 = require("./dimension");
-const dimension = (0, dimension_1.dimensionStyle)('height');
-function heightStyle({ height }) {
-    return dimension(height);
-}
-exports.heightStyle = heightStyle;
-heightStyle.__lookupStyles = ['height'];
-
-        

package/dist/cjs/styles/index.js

@@ -1,105 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.defineStyleAlias = exports.defineCustomStyle = exports.STYLE_HANDLER_MAP = exports.createStyle = void 0;
-const styles_1 = require("../utils/styles");
-const string_1 = require("../utils/string");
-const CACHE = {};
-function createStyle(styleName, cssStyle, converter) {
-    const key = `${styleName}.${cssStyle || ''}`;
-    if (!CACHE[key]) {
-        CACHE[key] = (0, styles_1.styleHandlerCacheWrapper)((styleMap) => {
-            let styleValue = styleMap[styleName];
-            if (styleValue == null || styleValue === false)
-                return;
-            const finalCssStyle = cssStyle || (0, string_1.toSnakeCase)(styleName).replace(/^@/, '--');
-            // convert non-string values
-            if (converter && typeof styleValue !== 'string') {
-                styleValue = converter(styleValue);
-                if (!styleValue)
-                    return;
-            }
-            if (typeof styleValue === 'string'
-                && finalCssStyle.startsWith('--')
-                && finalCssStyle.endsWith('-color')) {
-                styleValue = styleValue.trim();
-                const rgba = (0, styles_1.strToRgb)(styleValue);
-                const { color, name } = (0, styles_1.parseColor)(styleValue);
-                if (name && rgba) {
-                    return {
-                        [finalCssStyle]: `var(--${name}-color, ${rgba})`,
-                        [`${finalCssStyle}-rgb`]: `var(--${name}-color-rgb, ${(0, styles_1.getRgbValuesFromRgbaString)(rgba).join(', ')})`,
-                    };
-                }
-                else if (name) {
-                    if (color) {
-                        return {
-                            [finalCssStyle]: color,
-                            [`${finalCssStyle}-rgb`]: `var(--${name}-color-rgb)`,
-                        };
-                    }
-                    return {
-                        [finalCssStyle]: `var(--${name}-color)`,
-                        [`${finalCssStyle}-rgb`]: `var(--${name}-color-rgb)`,
-                    };
-                }
-                else if (rgba) {
-                    return {
-                        [finalCssStyle]: rgba,
-                        [`${finalCssStyle}-rgb`]: (0, styles_1.getRgbValuesFromRgbaString)(rgba).join(', '),
-                    };
-                }
-                return {
-                    [finalCssStyle]: color,
-                };
-            }
-            const { value } = (0, styles_1.parseStyle)(styleValue, 1);
-            return { [finalCssStyle]: value };
-        });
-        CACHE[key].__lookupStyles = [styleName];
-    }
-    return CACHE[key];
-}
-exports.createStyle = createStyle;
-exports.STYLE_HANDLER_MAP = {};
-function defineCustomStyle(names, handler) {
-    let handlerWithLookup;
-    if (typeof names === 'function') {
-        handlerWithLookup = names;
-        names = handlerWithLookup.__lookupStyles;
-    }
-    else if (handler) {
-        handlerWithLookup = Object.assign(handler, { __lookupStyles: names });
-    }
-    else {
-        console.warn('CubeUIKit: incorrect custom style definition:', names);
-        return;
-    }
-    handlerWithLookup = (0, styles_1.styleHandlerCacheWrapper)(handlerWithLookup);
-    if (Array.isArray(names)) {
-        // just to pass type checking
-        names.forEach((name) => {
-            if (!exports.STYLE_HANDLER_MAP[name]) {
-                exports.STYLE_HANDLER_MAP[name] = [];
-            }
-            exports.STYLE_HANDLER_MAP[name].push(handlerWithLookup);
-        });
-    }
-}
-exports.defineCustomStyle = defineCustomStyle;
-function defineStyleAlias(styleName, cssStyleName, converter) {
-    const styleHandler = createStyle(styleName, cssStyleName, converter);
-    if (!exports.STYLE_HANDLER_MAP[styleName]) {
-        exports.STYLE_HANDLER_MAP[styleName] = [];
-    }
-    exports.STYLE_HANDLER_MAP[styleName].push(styleHandler);
-}
-exports.defineStyleAlias = defineStyleAlias;
-
-        

package/dist/cjs/styles/justify.js

@@ -1,24 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.justifyStyle = void 0;
-function justifyStyle({ justify }) {
-    if (typeof justify !== 'string')
-        return;
-    if (!justify)
-        return;
-    return {
-        'justify-items': justify,
-        'justify-content': justify,
-    };
-}
-exports.justifyStyle = justifyStyle;
-justifyStyle.__lookupStyles = ['justify'];
-
-        

package/dist/cjs/styles/list.js

@@ -1,87 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.OUTER_STYLES = exports.CONTAINER_STYLES = exports.FLOW_STYLES = exports.DIMENSION_STYLES = exports.TEXT_STYLES = exports.COLOR_STYLES = exports.BLOCK_STYLES = exports.POSITION_STYLES = exports.BASE_STYLES = void 0;
-exports.BASE_STYLES = [
-    'display',
-    'font',
-    'preset',
-    'hide',
-    'opacity',
-    'whiteSpace',
-];
-exports.POSITION_STYLES = [
-    'gridArea',
-    'order',
-    'gridColumn',
-    'gridRow',
-    'placeSelf',
-    'alignSelf',
-    'justifySelf',
-    'zIndex',
-    'margin',
-];
-exports.BLOCK_STYLES = [
-    'reset',
-    'padding',
-    'paddingInline',
-    'paddingBlock',
-    'shadow',
-    'border',
-    'radius',
-    'opacity',
-    'overflow',
-    'styledScrollbar',
-    'hide',
-    'outline',
-    'textAlign',
-];
-exports.COLOR_STYLES = ['color', 'fill'];
-exports.TEXT_STYLES = [
-    'textTransform',
-    'fontWeight',
-    'fontStyle',
-];
-exports.DIMENSION_STYLES = [
-    'width',
-    'height',
-    'flexBasis',
-    'flexGrow',
-    'flexShrink',
-    'flex',
-];
-exports.FLOW_STYLES = [
-    'flow',
-    'placeItems',
-    'placeContent',
-    'alignItems',
-    'alignContent',
-    'justifyItems',
-    'justifyContent',
-    'align',
-    'justify',
-    'gap',
-    'columnGap',
-    'rowGap',
-    'gridColumns',
-    'gridRows',
-    'gridTemplate',
-    'gridAreas',
-];
-exports.CONTAINER_STYLES = [
-    ...exports.BASE_STYLES,
-    ...exports.COLOR_STYLES,
-    ...exports.DIMENSION_STYLES,
-    ...exports.POSITION_STYLES,
-    ...exports.BLOCK_STYLES,
-    ...exports.FLOW_STYLES,
-];
-exports.OUTER_STYLES = [...exports.POSITION_STYLES, ...exports.DIMENSION_STYLES];
-
-        

package/dist/cjs/styles/margin.js

@@ -1,50 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.4
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.marginStyle = void 0;
-const styles_1 = require("../utils/styles");
-function marginStyle({ margin, marginBlock, marginInline, marginTop, marginRight, marginBottom, marginLeft, }) {
-    if (typeof margin === 'number') {
-        margin = `${margin}px`;
-    }
-    if (!margin)
-        return '';
-    if (margin === true)
-        margin = '1x';
-    let { values, mods } = (0, styles_1.parseStyle)(margin);
-    let directions = (0, styles_1.filterMods)(mods, styles_1.DIRECTIONS);
-    if (!values.length) {
-        values = ['var(--gap)'];
-    }
-    if (!directions.length) {
-        directions = styles_1.DIRECTIONS;
-    }
-    const marginDirs = [marginTop, marginRight, marginBottom, marginLeft];
-    return directions.reduce((styles, dir) => {
-        const index = styles_1.DIRECTIONS.indexOf(dir);
-        if (((!!(index % 2) && marginInline == null)
-            || (!(index % 2) && marginBlock == null))
-            && marginDirs[index] == null) {
-            styles[`margin-${dir}`] = values[index] || values[index % 2] || values[0];
-        }
-        return styles;
-    }, {});
-}
-exports.marginStyle = marginStyle;
-marginStyle.__lookupStyles = [
-    'margin',
-    'marginTop',
-    'marginRight',
-    'marginBottom',
-    'marginLeft',
-    'marginBlock',
-    'marginInline',
-];
-
-