@cube-dev/ui-kit 0.0.0-canary-3f98351 → 0.0.0-canary-00718fb

package/es/tasty/states/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 
@@ -14,12 +14,7 @@
 import { hasStylesGenerated } from '../config.js';
 import { isDevEnv } from '../utils/isDevEnv.js';
 // Built-in state names that cannot be overridden
-const BUILTIN_STATES = new Set([
-    '@starting',
-    '@keyframes',
-    '@properties',
-    '@supports',
-]);
+const BUILTIN_STATES = new Set(['@starting', '@keyframes', '@supports']);
 // Reserved prefixes that are built-in
 const RESERVED_PREFIXES = [
     '@media',
@@ -28,7 +23,6 @@ const RESERVED_PREFIXES = [
     '@(',
     '@starting',
     '@keyframes',
-    '@properties',
     '@supports',
 ];
 // Global predefined states storage

package/es/tasty/static/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/static/tastyStatic.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/static/types.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/align.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/border.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 
@@ -19,39 +19,9 @@ const BORDER_STYLES = [
     'outset',
 ];
 /**
- * Process a single group and return border values for its directions.
- * @returns Object with directions as keys and border values, or null for "all directions"
- */
-function processGroup(group) {
-    const { values, mods, colors } = group;
-    const directions = filterMods(mods, DIRECTIONS);
-    const typeMods = filterMods(mods, BORDER_STYLES);
-    const width = values[0] || 'var(--border-width)';
-    const style = typeMods[0] || 'solid';
-    const color = colors?.[0] || 'var(--border-color)';
-    return {
-        directions,
-        borderValue: { width, style, color },
-    };
-}
-/**
- * Format a border value to CSS string.
- */
-function formatBorderValue(value) {
-    return `${value.width} ${value.style} ${value.color}`;
-}
-/**
- * Border style handler with multi-group support.
- *
- * Single group (backward compatible):
- * - `border="1bw solid #red"` - all sides
- * - `border="1bw solid #red top left"` - only top and left
- *
- * Multi-group (new):
- * - `border="1bw #red, 2bw #blue top"` - all sides red 1bw, then top overridden to blue 2bw
- * - `border="1bw, dashed top bottom, #purple left right"` - base 1bw, dashed on top/bottom, purple on left/right
  *
- * Later groups override earlier groups for conflicting directions.
+ * @param border
+ * @return {{border: string}|*}
  */
 export function borderStyle({ border }) {
     if (!border && border !== 0)
@@ -59,91 +29,27 @@ export function borderStyle({ border }) {
     if (border === true)
         border = '1bw';
     const processed = parseStyle(String(border));
-    const groups = processed.groups ?? [];
-    if (!groups.length)
-        return;
-    // Single group - use original logic for backward compatibility
-    if (groups.length === 1) {
-        const { directions, borderValue } = processGroup({
-            values: groups[0].values ?? [],
-            mods: groups[0].mods ?? [],
-            colors: groups[0].colors ?? [],
-        });
-        const styleValue = formatBorderValue(borderValue);
-        if (!directions.length) {
-            return { border: styleValue };
-        }
-        const zeroValue = `0 ${borderValue.style} ${borderValue.color}`;
-        return DIRECTIONS.reduce((styles, dir) => {
-            if (directions.includes(dir)) {
-                styles[`border-${dir}`] = styleValue;
-            }
-            else {
-                styles[`border-${dir}`] = zeroValue;
-            }
-            return styles;
-        }, {});
-    }
-    // Multi-group - process groups in order, later groups override earlier
-    // Track whether any group specifies directions
-    let hasAnyDirections = false;
-    // Build a map of direction -> border value
-    // Start with undefined (no border set)
-    const directionMap = {
-        top: null,
-        right: null,
-        bottom: null,
-        left: null,
-    };
-    // Track the last "all directions" value for fallback
-    let allDirectionsValue = null;
-    // Process groups in order (first to last)
-    for (const group of groups) {
-        const { directions, borderValue } = processGroup({
-            values: group.values ?? [],
-            mods: group.mods ?? [],
-            colors: group.colors ?? [],
-        });
-        if (directions.length === 0) {
-            // No specific directions - applies to all
-            allDirectionsValue = borderValue;
-            // Set all directions
-            for (const dir of DIRECTIONS) {
-                directionMap[dir] = borderValue;
-            }
-        }
-        else {
-            // Specific directions - override only those
-            hasAnyDirections = true;
-            for (const dir of directions) {
-                directionMap[dir] = borderValue;
-            }
-        }
-    }
-    // If no group specified any directions and we have an all-directions value,
-    // return the simple `border` shorthand
-    if (!hasAnyDirections && allDirectionsValue) {
-        return { border: formatBorderValue(allDirectionsValue) };
+    const { values, mods, colors } = processed.groups[0] ??
+        { values: [], mods: [], colors: [] };
+    const directions = filterMods(mods, DIRECTIONS);
+    const typeMods = filterMods(mods, BORDER_STYLES);
+    const value = values[0] || 'var(--border-width)';
+    const type = typeMods[0] || 'solid';
+    const borderColor = (colors && colors[0]) || 'var(--border-color)';
+    const styleValue = [value, type, borderColor].join(' ');
+    if (!directions.length) {
+        return { border: styleValue };
     }
-    // Otherwise, output individual border-* properties
-    const result = {};
-    for (const dir of DIRECTIONS) {
-        const value = directionMap[dir];
-        if (value) {
-            result[`border-${dir}`] = formatBorderValue(value);
+    const zeroValue = [0, type, borderColor].join(' ');
+    return DIRECTIONS.reduce((styles, dir) => {
+        if (mods.includes(dir)) {
+            styles[`border-${dir}`] = styleValue;
         }
         else {
-            // No border for this direction - set to 0
-            // Use the last all-directions value for style/color consistency, or defaults
-            const fallback = allDirectionsValue || {
-                width: '0',
-                style: 'solid',
-                color: 'var(--border-color)',
-            };
-            result[`border-${dir}`] = `0 ${fallback.style} ${fallback.color}`;
+            styles[`border-${dir}`] = zeroValue;
         }
-    }
-    return result;
+        return styles;
+    }, {});
 }
 borderStyle.__lookupStyles = ['border'];
 

package/es/tasty/styles/boxShadow.combinator.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/color.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/createStyle.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/dimension.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/display.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/fade.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 
@@ -12,58 +12,25 @@ const DIRECTION_MAP = {
     top: 'to bottom',
     bottom: 'to top',
 };
-// Default mask colors (standard black with alpha for gradient masks)
-const DEFAULT_TRANSPARENT_COLOR = 'rgb(0 0 0 / 0)';
-const DEFAULT_OPAQUE_COLOR = 'rgb(0 0 0 / 1)';
-/**
- * Process a single group and return gradient strings for its directions.
- */
-function processGroup(group, isOnlyGroup) {
-    let { values, mods, colors } = group;
+export function fadeStyle({ fade }) {
+    if (!fade)
+        return;
+    const processed = parseStyle(fade);
+    let { values, mods } = processed.groups[0] ?? { values: [], mods: [] };
     let directions = filterMods(mods, DIRECTIONS);
     if (!values.length) {
         values = ['var(--fade-width)'];
     }
-    // If this is the only group and no directions specified, apply to all edges
     if (!directions.length) {
-        if (isOnlyGroup) {
-            directions = ['top', 'right', 'bottom', 'left'];
-        }
-        else {
-            // For multi-group without explicit direction, skip this group
-            return [];
-        }
-    }
-    // Extract colors: first = transparent mask color, second = opaque mask color
-    const transparentColor = colors?.[0] || DEFAULT_TRANSPARENT_COLOR;
-    const opaqueColor = colors?.[1] || DEFAULT_OPAQUE_COLOR;
-    return directions.map((direction, index) => {
-        const size = values[index] || values[index % 2] || values[0];
-        return `linear-gradient(${DIRECTION_MAP[direction]}, ${transparentColor} 0%, ${opaqueColor} ${size})`;
-    });
-}
-export function fadeStyle({ fade }) {
-    if (!fade)
-        return;
-    const processed = parseStyle(fade);
-    const groups = processed.groups ?? [];
-    if (!groups.length)
-        return;
-    const isOnlyGroup = groups.length === 1;
-    // Process all groups and collect gradients
-    const gradients = [];
-    for (const group of groups) {
-        const groupGradients = processGroup({
-            values: group.values ?? [],
-            mods: group.mods ?? [],
-            colors: group.colors ?? [],
-        }, isOnlyGroup);
-        gradients.push(...groupGradients);
+        directions = ['top', 'right', 'bottom', 'left'];
     }
-    if (!gradients.length)
-        return;
     return {
-        mask: gradients.join(', '),
+        mask: directions
+            .map((direction, index) => {
+            const size = values[index] || values[index % 2] || values[0];
+            return `linear-gradient(${DIRECTION_MAP[direction]}, rgb(0 0 0 / 0) 0%, rgb(0 0 0 / 1) ${size})`;
+        })
+            .join(', '),
         'mask-composite': 'intersect',
     };
 }

package/es/tasty/styles/fill.js

@@ -1,19 +1,68 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 
 import { parseStyle } from '../utils/styles.js';
-export function fillStyle({ fill }) {
-    if (!fill)
+export function fillStyle({ fill, backgroundColor, image, backgroundImage, backgroundPosition, backgroundSize, backgroundRepeat, backgroundAttachment, backgroundOrigin, backgroundClip, background, }) {
+    // If background is set, it overrides everything
+    if (background) {
+        const processed = parseStyle(background);
+        return { background: processed.output || background };
+    }
+    const result = {};
+    // Priority: backgroundColor > fill
+    const colorValue = backgroundColor ?? fill;
+    if (colorValue) {
+        const parsed = parseStyle(colorValue);
+        result['background-color'] = parsed.groups[0]?.colors[0] || colorValue;
+    }
+    // Priority: backgroundImage > image
+    const imageValue = backgroundImage ?? image;
+    if (imageValue) {
+        const parsed = parseStyle(imageValue);
+        result['background-image'] = parsed.output || imageValue;
+    }
+    // Other background properties (pass through with parseStyle for token support)
+    if (backgroundPosition) {
+        result['background-position'] =
+            parseStyle(backgroundPosition).output || backgroundPosition;
+    }
+    if (backgroundSize) {
+        result['background-size'] =
+            parseStyle(backgroundSize).output || backgroundSize;
+    }
+    if (backgroundRepeat) {
+        result['background-repeat'] = backgroundRepeat;
+    }
+    if (backgroundAttachment) {
+        result['background-attachment'] = backgroundAttachment;
+    }
+    if (backgroundOrigin) {
+        result['background-origin'] = backgroundOrigin;
+    }
+    if (backgroundClip) {
+        result['background-clip'] = backgroundClip;
+    }
+    if (Object.keys(result).length === 0)
         return;
-    const processed = parseStyle(fill);
-    fill = processed.groups[0]?.colors[0] || fill;
-    return { 'background-color': fill };
+    return result;
 }
-fillStyle.__lookupStyles = ['fill'];
+fillStyle.__lookupStyles = [
+    'fill',
+    'backgroundColor',
+    'image',
+    'backgroundImage',
+    'backgroundPosition',
+    'backgroundSize',
+    'backgroundRepeat',
+    'backgroundAttachment',
+    'backgroundOrigin',
+    'backgroundClip',
+    'background',
+];
 export function svgFillStyle({ svgFill }) {
     if (!svgFill)
         return;

package/es/tasty/styles/flow.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/font.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/fontStyle.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/gap.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/groupRadius.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/height.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/inset.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/justify.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/list.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 
@@ -46,7 +46,7 @@ export const BLOCK_STYLES = [
     ...BLOCK_INNER_STYLES,
     ...BLOCK_OUTER_STYLES,
 ];
-export const COLOR_STYLES = ['color', 'fill', 'fade'];
+export const COLOR_STYLES = ['color', 'fill', 'fade', 'image'];
 export const TEXT_STYLES = [
     'textTransform',
     'fontWeight',

package/es/tasty/styles/margin.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/outline.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/padding.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/place.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/predefined.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/preset.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/radius.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/reset.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/scrollbar.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/shadow.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */
 

package/es/tasty/styles/styledScrollbar.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-3f98351
+ * @cube-dev/ui-kit v0.0.0-canary-00718fb
  * Released under the MIT license.
  */