@cube-dev/ui-kit 0.9.5 → 0.9.8

package/dist/es/styles/padding.js

@@ -1,47 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-import { parseStyle, DIRECTIONS, filterMods } from '../utils/styles';
-export function paddingStyle({ padding, paddingBlock, paddingInline, paddingTop, paddingRight, paddingBottom, paddingLeft, }) {
-    if (typeof padding === 'number') {
-        padding = `${padding}px`;
-    }
-    if (!padding)
-        return '';
-    if (padding === true)
-        padding = '1x';
-    let { values, mods } = parseStyle(padding);
-    let directions = filterMods(mods, DIRECTIONS);
-    if (!values.length) {
-        values = ['var(--gap)'];
-    }
-    if (!directions.length) {
-        directions = DIRECTIONS;
-    }
-    const paddingDirs = [paddingTop, paddingRight, paddingBottom, paddingLeft];
-    return directions.reduce((styles, dir) => {
-        const index = DIRECTIONS.indexOf(dir);
-        if (((!!(index % 2) && paddingInline == null)
-            || (!(index % 2) && paddingBlock == null))
-            && paddingDirs[index] == null) {
-            styles[`padding-${dir}`]
-                = values[index] || values[index % 2] || values[0];
-        }
-        return styles;
-    }, {});
-}
-paddingStyle.__lookupStyles = [
-    'padding',
-    'paddingTop',
-    'paddingRight',
-    'paddingBottom',
-    'paddingLeft',
-    'paddingBlock',
-    'paddingInline',
-];
-
-        

package/dist/es/styles/paddingBlock.js

@@ -1,36 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-import { parseStyle } from '../utils/styles';
-export function paddingBlockStyle({ paddingBlock: padding, paddingTop, paddingBottom, }) {
-    if (typeof padding === 'number') {
-        padding = `${padding}px`;
-    }
-    if (!padding)
-        return '';
-    if (padding === true)
-        padding = '1x';
-    let { values } = parseStyle(padding);
-    if (!values.length) {
-        values = ['var(--gap)'];
-    }
-    const styles = {};
-    if (paddingTop == null) {
-        styles['padding-top'] = values[0];
-    }
-    if (paddingBottom == null) {
-        styles['padding-bottom'] = values[1] || values[0];
-    }
-    return styles;
-}
-paddingBlockStyle.__lookupStyles = [
-    'paddingBlock',
-    'paddingTop',
-    'paddingBottom',
-];
-
-        

package/dist/es/styles/paddingInline.js

@@ -1,36 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-import { parseStyle } from '../utils/styles';
-export function paddingInlineStyle({ paddingInline: padding, paddingLeft, paddingRight, }) {
-    if (typeof padding === 'number') {
-        padding = `${padding}px`;
-    }
-    if (!padding)
-        return '';
-    if (padding === true)
-        padding = '1x';
-    let { values } = parseStyle(padding);
-    if (!values.length) {
-        values = ['var(--gap)'];
-    }
-    const styles = {};
-    if (paddingLeft == null) {
-        styles['padding-left'] = values[0];
-    }
-    if (paddingRight == null) {
-        styles['padding-right'] = values[1] || values[0];
-    }
-    return styles;
-}
-paddingInlineStyle.__lookupStyles = [
-    'paddingInline',
-    'paddingLeft',
-    'paddingRight',
-];
-
-        

package/dist/es/styles/predefined.js

@@ -1,120 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-import { gapStyle } from './gap';
-import { flowStyle } from './flow';
-import { resetStyle } from './reset';
-import { colorStyle } from './color';
-import { fillStyle } from './fill';
-import { widthStyle } from './width';
-import { heightStyle } from './height';
-import { radiusStyle } from './radius';
-import { borderStyle } from './border';
-import { shadowStyle } from './shadow';
-import { paddingStyle } from './padding';
-import { paddingBlockStyle } from './paddingBlock';
-import { paddingInlineStyle } from './paddingInline';
-import { presetStyle } from './preset';
-import { fontStyleStyle } from './fontStyle';
-import { marginStyle } from './margin';
-import { marginBlockStyle } from './marginBlock';
-import { marginInlineStyle } from './marginInline';
-import { fontStyle } from './font';
-import { outlineStyle } from './outline';
-import { transitionStyle } from './transition';
-import { groupRadiusAttr } from './groupRadius';
-import { boxShadowCombinator } from './boxShadow.combinator';
-import { styledScrollbarStyle } from './styledScrollbar';
-import { displayStyle } from './display';
-import { alignStyle } from './align';
-import { justifyStyle } from './justify';
-import { defineCustomStyle, defineStyleAlias } from './index';
-const numberConverter = (val) => {
-    if (typeof val === 'number') {
-        return `${val}px`;
-    }
-    return val;
-};
-const columnsConverter = (val) => {
-    if (typeof val === 'number') {
-        return 'minmax(1px, 1fr) '.repeat(val).trim();
-    }
-    return;
-};
-const rowsConverter = (val) => {
-    if (typeof val === 'number') {
-        return 'auto '.repeat(val).trim();
-    }
-    return;
-};
-// Manually define styles that are used in other custom styles.
-// Otherwise, they won't be handled as expected.
-defineStyleAlias('fontSize');
-defineStyleAlias('lineHeight');
-defineStyleAlias('fontWeight');
-defineStyleAlias('fontStyle');
-defineStyleAlias('letterSpacing');
-defineStyleAlias('textTransform');
-defineStyleAlias('fontFamily');
-defineStyleAlias('paddingTop');
-defineStyleAlias('paddingRight');
-defineStyleAlias('paddingBottom');
-defineStyleAlias('paddingLeft');
-defineStyleAlias('marginTop');
-defineStyleAlias('marginRight');
-defineStyleAlias('marginBottom');
-defineStyleAlias('marginLeft');
-// Coordinates
-defineStyleAlias('top', 'top', numberConverter);
-defineStyleAlias('right', 'right', numberConverter);
-defineStyleAlias('bottom', 'bottom', numberConverter);
-defineStyleAlias('left', 'left', numberConverter);
-// Style aliases
-defineStyleAlias('gridAreas', 'grid-template-areas');
-defineStyleAlias('gridColumns', 'grid-template-columns', columnsConverter);
-defineStyleAlias('gridRows', 'grid-template-rows', rowsConverter);
-defineStyleAlias('gridTemplate', 'grid-template', (val) => {
-    if (typeof val !== 'string')
-        return;
-    return val
-        .split('/')
-        .map((s, i) => (i ? columnsConverter : rowsConverter)(s))
-        .join('/');
-});
-[
-    displayStyle,
-    transitionStyle,
-    resetStyle,
-    fillStyle,
-    widthStyle,
-    marginStyle,
-    marginBlockStyle,
-    marginInlineStyle,
-    gapStyle,
-    flowStyle,
-    colorStyle,
-    heightStyle,
-    radiusStyle,
-    borderStyle,
-    shadowStyle,
-    paddingStyle,
-    paddingBlockStyle,
-    paddingInlineStyle,
-    alignStyle,
-    justifyStyle,
-    presetStyle,
-    boxShadowCombinator,
-    outlineStyle,
-    fontStyle,
-    fontStyleStyle,
-    groupRadiusAttr,
-    styledScrollbarStyle,
-]
-    // @ts-ignore
-    .forEach((handler) => defineCustomStyle(handler));
-
-        

package/dist/es/styles/preset.js

@@ -1,51 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-import { parseStyle } from '../utils/styles';
-export function presetStyle({ preset, fontSize, lineHeight, textTransform, letterSpacing, fontWeight, fontStyle, font, }) {
-    if (!preset)
-        return '';
-    if (preset === true)
-        preset = '';
-    const { mods } = parseStyle(preset);
-    const name = mods[0] || 'default';
-    const styles = {};
-    if (!fontSize) {
-        styles['font-size'] = styles['--font-size'] = `var(--${name}-font-size, var(--initial-font-size, inherit))`;
-    }
-    if (!lineHeight) {
-        styles['line-height'] = styles['--line-height'] = `var(--${name}-line-height, var(--initial-line-height, 1.5))`;
-    }
-    if (!letterSpacing) {
-        styles['letter-spacing'] = styles['--letter-spacing'] = `var(--${name}-letter-spacing, var(--initial-letter-spacing, 0))`;
-    }
-    if (!fontWeight) {
-        styles['font-weight'] = styles['--font-weight'] = `var(--${name}-font-weight, var(--initial-font-weight, 400))`;
-    }
-    if (!fontStyle) {
-        styles['font-style'] = styles['--font-style'] = `var(--${name}-font-style, var(--initial-font-style, normal))`;
-    }
-    if (!textTransform) {
-        styles['text-transform'] = styles['--text-transform'] = `var(--${name}-text-transform, var(--initial-text-transform, none))`;
-    }
-    if (!font) {
-        styles['font-family'] = styles['--font-family'] = `var(--${name}-font-family, var(--font))`;
-    }
-    return styles;
-}
-presetStyle.__lookupStyles = [
-    'preset',
-    'fontSize',
-    'lineHeight',
-    'letterSpacing',
-    'textTransform',
-    'fontWeight',
-    'fontStyle',
-    'font',
-];
-
-        

package/dist/es/styles/radius.js

@@ -1,72 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-import { parseStyle, DIRECTIONS } from '../utils/styles';
-const PROP = 'var(--radius)';
-const SHARP = 'var(--leaf-sharp-radius)';
-export function radiusStyle({ radius }) {
-    if (typeof radius === 'number') {
-        radius = `${radius}px`;
-    }
-    if (!radius)
-        return '';
-    if (radius === true)
-        radius = '1r';
-    let { mods, values } = parseStyle(radius, 1);
-    if (mods.includes('round')) {
-        values = ['9999rem'];
-    }
-    else if (mods.includes('ellipse')) {
-        values = ['50%'];
-    }
-    else if (!values.length) {
-        values = [PROP];
-    }
-    if (mods.includes('leaf')) {
-        values = [
-            values[1] || SHARP,
-            values[0] || PROP,
-            values[1] || SHARP,
-            values[0] || PROP,
-        ];
-    }
-    else if (mods.includes('backleaf')) {
-        values = [
-            values[0] || PROP,
-            values[1] || SHARP,
-            values[0] || PROP,
-            values[1] || SHARP,
-        ];
-    }
-    else if (mods.length) {
-        const arr = ['0', '0', '0', '0'];
-        let flag = false;
-        DIRECTIONS.forEach((dir, i) => {
-            if (!mods.includes(dir))
-                return;
-            flag = true;
-            arr[i] = values[0] || PROP;
-            arr[(i + 1) % 4] = values[0] || PROP;
-        });
-        if (flag) {
-            values = arr;
-        }
-    }
-    return [
-        {
-            '--local-radius': values.join(' '),
-            'border-radius': 'var(--local-radius)',
-        },
-        {
-            $: '>*',
-            '--context-radius': values.join(' '),
-        },
-    ];
-}
-radiusStyle.__lookupStyles = ['radius'];
-
-        

package/dist/es/styles/reset.js

@@ -1,100 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-import { parseStyle } from '../utils/styles';
-const RESET_MAP = {
-    input: [
-        {
-            css: `
--webkit-appearance: none;
-font-family: inherit;
-font-weight: inherit;
-word-spacing: initial;
--webkit-text-fill-color: currentColor;
-box-sizing: border-box;
-user-select: auto;
-resize: none;
-`,
-        },
-        {
-            $: '::-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: `
-color: inherit;
-background: transparent;
--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: `
-transition: all var(--transition) linear;
-background: transparent;
-border: none;
-outline: none;
-appearance: none;
-position: relative;
-touch-action: manipulation;
--webkit-tap-highlight-color: transparent;
-text-decoration: none;
-`,
-        },
-    ],
-};
-export function resetStyle({ reset }) {
-    if (!reset)
-        return;
-    const { mods } = parseStyle(reset, 1);
-    return mods.reduce((sum, mod) => {
-        if (RESET_MAP[mod]) {
-            sum.push(...RESET_MAP[mod]);
-        }
-        return sum;
-    }, []);
-}
-resetStyle.__lookupStyles = ['reset'];
-
-        

package/dist/es/styles/shadow.js

@@ -1,23 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-import { parseStyle } from '../utils/styles';
-export function shadowStyle({ shadow }) {
-    if (!shadow)
-        return '';
-    if (shadow === true)
-        shadow = '0 5px 15px #shadow';
-    const { values, mods, color } = parseStyle(shadow);
-    const mod = mods[0] || '';
-    const shadowColor = color || 'var(--shadow-color)';
-    return {
-        '--local-shadow-box-shadow': [mod, ...values, shadowColor].join(' '),
-    };
-}
-shadowStyle.__lookupStyles = ['shadow'];
-
-        

package/dist/es/styles/styledScrollbar.js

@@ -1,51 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-export 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)',
-        },
-        {
-            'scrollbar-width': 'thin',
-            'scrollbar-color': 'var(--scrollbar-bg-color) var(--scrollbar-thumb-color)',
-        },
-    ];
-}
-styledScrollbarStyle.__lookupStyles = ['styledScrollbar'];
-
-        

package/dist/es/styles/transition.js

@@ -1,84 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-import { parseStyle } from '../utils/styles';
-const MAP = {
-    move: ['transform'],
-    rotate: ['transform'],
-    scale: ['transform'],
-    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'],
-};
-export const DEFAULT_TIMING = 'var(--transition)';
-const DEFAULT_EASING = 'linear';
-function getTiming(name) {
-    return `var(--${name}-transition, var(--transition))`;
-}
-export function transitionStyle({ transition }) {
-    if (!transition)
-        return;
-    const tokens = 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/dist/es/styles/types.js

@@ -1,10 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-export {};
-
-        

package/dist/es/styles/width.js

@@ -1,15 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-import { dimensionStyle } from './dimension';
-const dimension = dimensionStyle('width');
-export function widthStyle({ width }) {
-    return dimension(width);
-}
-widthStyle.__lookupStyles = ['width'];
-
-        

package/dist/es/test/setup.js

@@ -1,12 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.9.5
- * Released under the MIT license.
- */
-
-import '@testing-library/jest-dom';
-import '@testing-library/jest-dom/extend-expect';
-import 'jest-styled-components';
-
-