@cube-dev/ui-kit 0.56.3 → 0.58.0

package/cjs/tasty/styles/reset.js

@@ -1,91 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.resetStyle = resetStyle;
-const styles_1 = require("../utils/styles");
-const RESET_MAP = {
-    input: [
-        {
-            css: `
--webkit-appearance: none;
-word-spacing: initial;
--webkit-text-fill-color: currentColor;
-`,
-        },
-        {
-            $: '::-webkit-search-cancel-button',
-            css: 'display: none',
-        },
-        {
-            $: [
-                ':-webkit-autofill',
-                ':-webkit-autofill:hover',
-                ':-webkit-autofill:focus',
-            ],
-            css: `
-caret-color: var(--purple-color);
--webkit-text-fill-color: var(--purple-color);
--webkit-box-shadow: 0 0 0px 9999rem var(--white-color) inset;
-box-shadow: 0 0 0px 9999rem var(--white-color) inset;
-font-family: inherit;
-font-size: inherit;
-line-height: inherit;
-`,
-        },
-        {
-            $: '[disabled]',
-            css: `
--webkit-opacity: 1;
-`,
-        },
-        {
-            $: '::placeholder',
-            css: `
--webkit-text-fill-color: var(--local-placeholder-color);
-color: var(--local-placeholder-color);
-filter: saturate(.33);
-`,
-        },
-        {
-            $: '::-webkit-search-cancel-button',
-            css: `
-display: none;
--webkit-appearance: none;
-`,
-        },
-        {
-            $: ':not([disabled])::placeholder',
-            css: '--local-placeholder-color: var(--placeholder-color, rgba(var(--dark-color-rgb), .3));\n',
-        },
-    ],
-    button: [
-        {
-            css: `
-appearance: none;
-touch-action: manipulation;
--webkit-tap-highlight-color: transparent;
-text-decoration: none;
-`,
-        },
-    ],
-};
-function resetStyle({ reset }) {
-    if (!reset)
-        return;
-    const { mods } = (0, styles_1.parseStyle)(reset, 1);
-    return mods.reduce((sum, mod) => {
-        if (RESET_MAP[mod]) {
-            sum.push(...RESET_MAP[mod]);
-        }
-        return sum;
-    }, []);
-}
-resetStyle.__lookupStyles = ['reset'];
-
-        

package/cjs/tasty/styles/shadow.js

@@ -1,29 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.shadowStyle = shadowStyle;
-const styles_1 = require("../utils/styles");
-function toBoxShadow(shadow) {
-    const { values, mods, color } = (0, styles_1.parseStyle)(shadow);
-    const mod = mods[0] || '';
-    const shadowColor = color || 'var(--shadow-color)';
-    return [mod, ...values, shadowColor].join(' ');
-}
-function shadowStyle({ shadow }) {
-    if (!shadow)
-        return '';
-    if (shadow === true)
-        shadow = '0 5px 15px #shadow';
-    return {
-        '--local-shadow-box-shadow': shadow.split(',').map(toBoxShadow).join(','),
-    };
-}
-shadowStyle.__lookupStyles = ['shadow'];
-
-        

package/cjs/tasty/styles/styledScrollbar.js

@@ -1,56 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.styledScrollbarStyle = styledScrollbarStyle;
-function styledScrollbarStyle({ styledScrollbar: val }) {
-    if (val == null)
-        return null;
-    if (!val) {
-        return [
-            {
-                $: '::-webkit-scrollbar',
-                display: 'none',
-            },
-            {
-                'scrollbar-width': 'none',
-            },
-        ];
-    }
-    return [
-        {
-            $: '::-webkit-scrollbar',
-            width: 'var(--scrollbar-width)',
-            height: 'var(--scrollbar-width)',
-        },
-        {
-            $: '::-webkit-scrollbar-track',
-            'background-color': 'var(--scrollbar-bg-color)',
-        },
-        {
-            $: '::-webkit-scrollbar-thumb',
-            'background-color': 'var(--scrollbar-thumb-color)',
-            'border-radius': 'var(--scrollbar-radius)',
-            border: 'var(--scrollbar-outline-width) solid var(--scrollbar-outline-color)',
-            'background-clip': 'padding-box',
-        },
-        {
-            $: '::-webkit-scrollbar-corner',
-            'background-color': 'var(--scrollbar-corner-color)',
-        },
-        // Breaks the scrollbar in the latest Chromium browsers
-        // {
-        //   'scrollbar-width': 'thin',
-        //   'scrollbar-color':
-        //     'var(--scrollbar-bg-color) var(--scrollbar-thumb-color)',
-        // },
-    ];
-}
-styledScrollbarStyle.__lookupStyles = ['styledScrollbar'];
-
-        

package/cjs/tasty/styles/transition.js

@@ -1,89 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DEFAULT_TIMING = void 0;
-exports.transitionStyle = transitionStyle;
-const styles_1 = require("../utils/styles");
-const MAP = {
-    fade: ['mask'],
-    translate: ['transform', 'translate'],
-    rotate: ['transform', 'rotate'],
-    scale: ['transform', 'scale'],
-    placeSelf: ['transform', 'top', 'right', 'bottom', 'left'],
-    fill: ['background-color'],
-    border: ['border', 'box-shadow'],
-    filter: ['filter', 'backdrop-filter'],
-    radius: ['border-radius'],
-    shadow: ['box-shadow'],
-    outline: ['box-shadow'],
-    preset: [
-        'font-size',
-        'line-height',
-        'letter-spacing',
-        'font-weight',
-        'font-style',
-    ],
-    text: ['font-weight', 'text-decoration-color'],
-    theme: ['color', 'background-color', 'box-shadow', 'border', 'border-radius'],
-    inset: ['box-shadow'],
-    mark: ['box-shadow'],
-    width: ['max-width', 'min-width', 'width'],
-    height: ['max-height', 'min-height', 'height'],
-    gap: ['gap', 'margin'],
-    zIndex: ['z-index'],
-    image: ['background-image', 'background-position', 'background-size'],
-};
-exports.DEFAULT_TIMING = 'var(--transition)';
-const DEFAULT_EASING = 'linear';
-function getTiming(name) {
-    return `var(--${name}-transition, var(--transition))`;
-}
-function transitionStyle({ transition }) {
-    if (!transition)
-        return;
-    const tokens = (0, styles_1.parseStyle)(transition).all;
-    if (!tokens)
-        return;
-    let tempTransition = [];
-    const transitions = [];
-    tokens.forEach((token) => {
-        if (token === ',') {
-            if (tempTransition) {
-                transitions.push(tempTransition);
-                tempTransition = [];
-            }
-        }
-        else {
-            tempTransition.push(token);
-        }
-    });
-    if (tempTransition) {
-        transitions.push(tempTransition);
-    }
-    const map = {};
-    transitions.forEach((transition) => {
-        const name = transition[0];
-        const timing = transition[1];
-        const easing = transition[2];
-        const delay = transition[3];
-        const styles = MAP[name] || [name];
-        styles.forEach((style) => {
-            map[style] = [name, easing, timing, delay];
-        });
-    });
-    const result = Object.entries(map)
-        .map(([style, [name, easing, timing, delay]]) => {
-        return `${style}  ${timing || getTiming(name)} ${easing || DEFAULT_EASING} ${delay || '0s'}`;
-    })
-        .join(', ');
-    return { transition: result };
-}
-transitionStyle.__lookupStyles = ['transition'];
-
-        

package/cjs/tasty/styles/types.js

@@ -1,11 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-
-        

package/cjs/tasty/styles/width.js

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

package/cjs/tasty/tasty.js

@@ -1,183 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-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 (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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Element = void 0;
-exports.tasty = tasty;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = __importStar(require("styled-components"));
-const react_1 = require("react");
-const react_is_1 = require("react-is");
-const BreakpointsProvider_1 = require("./providers/BreakpointsProvider");
-const modAttrs_1 = require("./utils/modAttrs");
-const renderStyles_1 = require("./utils/renderStyles");
-const responsive_1 = require("./utils/responsive");
-const list_1 = require("./styles/list");
-const cache_wrapper_1 = require("./utils/cache-wrapper");
-const mergeStyles_1 = require("./utils/mergeStyles");
-const getDisplayName_1 = require("./utils/getDisplayName");
-// Implementation
-function tasty(Component, options) {
-    if (typeof Component === 'string') {
-        let selector = Component;
-        let styles = options;
-        let Element = (0, styled_components_1.createGlobalStyle) `${({ $css }) => $css}`;
-        const _StyleDeclarationComponent = ({ breakpoints, }) => {
-            let contextBreakpoints = (0, react_1.useContext)(BreakpointsProvider_1.BreakpointsContext);
-            breakpoints = breakpoints ?? contextBreakpoints;
-            const breakpointsHash = breakpoints.join(',');
-            let css = (0, react_1.useMemo)(() => styles
-                ? `\n{}${selector}{${(0, renderStyles_1.renderStyles)(styles, (0, responsive_1.pointsToZones)(breakpoints || [980]))}}`
-                : '', [breakpointsHash]);
-            return (0, jsx_runtime_1.jsx)(Element, { "$css": css });
-        };
-        _StyleDeclarationComponent.displayName = `TastyStyleDeclaration(${Component})`;
-        return _StyleDeclarationComponent;
-    }
-    if ((0, react_is_1.isValidElementType)(Component)) {
-        let { as: extendTag, element: extendElement, ...defaultProps } = options ?? {};
-        let propsWithStyles = ['styles'].concat(Object.keys(defaultProps).filter((prop) => prop.endsWith('Styles')));
-        let _WrappedComponent = (0, react_1.forwardRef)((props, ref) => {
-            const { as, element, ...restProps } = props;
-            const propsWithStylesValues = propsWithStyles.map((prop) => props[prop]);
-            const mergedStylesMap = (0, react_1.useMemo)(() => {
-                return propsWithStyles.reduce((map, prop) => {
-                    if (restProps[prop] != null && defaultProps[prop] != null) {
-                        map[prop] = (0, mergeStyles_1.mergeStyles)(defaultProps[prop], restProps[prop]);
-                    }
-                    else {
-                        map[prop] = restProps[prop] || defaultProps[prop];
-                    }
-                    return map;
-                }, {});
-            }, [propsWithStylesValues]);
-            return ((0, jsx_runtime_1.jsx)(Component, { ref: ref, ...defaultProps, ...restProps, ...mergedStylesMap, as: as ?? extendTag, element: element || extendElement }));
-        });
-        _WrappedComponent.displayName = `TastyWrappedComponent(${(0, getDisplayName_1.getDisplayName)(Component, defaultProps.qa ?? extendTag ?? 'Anonymous')})`;
-        return _WrappedComponent;
-    }
-    const tastyOptions = Component;
-    let { as: originalAs = 'div', element: defaultElement, styles: defaultStyles, styleProps, variants, ...defaultProps } = tastyOptions;
-    let _TastyComponent;
-    if (variants) {
-        /**
-         * Create a tasty component for each variant.
-         * Then return a component that receives a `variant` and chooses the right component.
-         */
-        const variantComponents = Object.keys(variants).reduce((map, variant) => {
-            const variantStyles = variants?.[variant];
-            map[variant] = tasty({
-                as: originalAs,
-                styles: (0, mergeStyles_1.mergeStyles)(defaultStyles, variantStyles),
-                styleProps,
-                ...defaultProps,
-            });
-            return map;
-        }, {});
-        if (!variantComponents['default']) {
-            variantComponents['default'] = tasty({
-                as: originalAs,
-                styles: defaultStyles,
-                styleProps,
-                ...defaultProps,
-            });
-        }
-        // eslint-disable-next-line react/display-name
-        _TastyComponent = (0, react_1.forwardRef)((allProps, ref) => {
-            const { variant, ...restProps } = allProps;
-            const Component = (variantComponents[variant] ||
-                variantComponents['default']);
-            return ((0, jsx_runtime_1.jsx)(Component
-            // @ts-ignore
-            , { 
-                // @ts-ignore
-                ref: ref, ...restProps }));
-        });
-    }
-    else {
-        let Element = styled_components_1.default[originalAs](({ $css }) => $css);
-        /**
-         * An additional optimization that allows to avoid rendering styles across various instances
-         * of the same element if no custom styles are provided via `styles` prop or direct style props.
-         */
-        const renderDefaultStyles = (0, cache_wrapper_1.cacheWrapper)((breakpoints) => {
-            return (0, renderStyles_1.renderStyles)(defaultStyles || {}, (0, responsive_1.pointsToZones)(breakpoints));
-        });
-        let { qa: defaultQa, qaVal: defaultQaVal, ...otherDefaultProps } = defaultProps ?? {};
-        // eslint-disable-next-line react/display-name
-        _TastyComponent = (0, react_1.forwardRef)((allProps, ref) => {
-            let { as, styles, variant, breakpoints, mods, element, qa, qaVal, ...otherProps } = allProps;
-            let propStyles = (styleProps
-                ? styleProps.concat(list_1.BASE_STYLES)
-                : list_1.BASE_STYLES).reduce((map, prop) => {
-                if (prop in otherProps) {
-                    map[prop] = otherProps[prop];
-                    delete otherProps[prop];
-                }
-                return map;
-            }, {});
-            if (Object.keys(propStyles).length === 0) {
-                propStyles = null;
-            }
-            if (!styles || (styles && Object.keys(styles).length === 0)) {
-                styles = undefined;
-            }
-            const propStylesCacheKey = JSON.stringify(propStyles);
-            const stylesCacheKey = (0, react_1.useMemo)(() => {
-                return JSON.stringify(styles);
-            }, [styles]);
-            const useDefaultStyles = !propStyles && !styles;
-            const styleCacheKey = (0, react_1.useMemo)(() => {
-                return `${styles ? JSON.stringify(styles) : ''}.${propStyles ? JSON.stringify(propStyles) : ''}`;
-            }, [propStylesCacheKey, stylesCacheKey]);
-            let allStyles = (0, react_1.useMemo)(() => useDefaultStyles
-                ? defaultStyles
-                : (0, mergeStyles_1.mergeStyles)(defaultStyles, styles, propStyles), [styleCacheKey]);
-            let contextBreakpoints = (0, react_1.useContext)(BreakpointsProvider_1.BreakpointsContext);
-            breakpoints = breakpoints ?? contextBreakpoints;
-            let renderedStyles = (0, react_1.useMemo)(() => {
-                return useDefaultStyles
-                    ? renderDefaultStyles(breakpoints)
-                    : (0, renderStyles_1.renderStyles)(allStyles, (0, responsive_1.pointsToZones)(breakpoints));
-            }, [allStyles, breakpoints]);
-            if (mods) {
-                Object.assign(otherProps, (0, modAttrs_1.modAttrs)(mods));
-            }
-            return ((0, jsx_runtime_1.jsx)(Element, { as: as ?? originalAs, "data-element": element || defaultElement, "data-qa": qa || defaultQa, "data-qaval": qaVal || defaultQaVal, ...otherDefaultProps, ...otherProps, ref: ref, "$css": renderedStyles }));
-        });
-    }
-    _TastyComponent.displayName = `TastyComponent(${defaultProps.qa || originalAs})`;
-    return _TastyComponent;
-}
-const Element = tasty({});
-exports.Element = Element;
-
-        

package/cjs/tasty/types.js

@@ -1,11 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-
-        

package/cjs/tasty/utils/cache-wrapper.js

@@ -1,34 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.cacheWrapper = cacheWrapper;
-/**
- * Create a function that caches the result up to the limit.
- */
-function cacheWrapper(handler, limit = 1000) {
-    let cache = {};
-    let count = 0;
-    return ((firstArg, secondArg) => {
-        const key = typeof firstArg === 'string' && secondArg == null
-            ? firstArg
-            : JSON.stringify([firstArg, secondArg]);
-        if (!cache[key]) {
-            if (count > limit) {
-                cache = {};
-                count = 0;
-            }
-            count++;
-            cache[key] =
-                secondArg == null ? handler(firstArg) : handler(firstArg, secondArg);
-        }
-        return cache[key];
-    });
-}
-
-        

package/cjs/tasty/utils/case-converter.js

@@ -1,15 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.camelToKebab = camelToKebab;
-function camelToKebab(str) {
-    return str.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
-}
-
-        

package/cjs/tasty/utils/colors.js

@@ -1,18 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.color = color;
-function color(name, opacity = 1) {
-    if (opacity !== 1) {
-        return `rgba(var(--${name}-color-rgb), ${opacity})`;
-    }
-    return `var(--${name}-color)`;
-}
-
-