@cube-dev/ui-kit 0.117.0 → 0.119.0

package/dist/styles/types.d.ts

@@ -1,495 +0,0 @@
-
-import { StyleValue, StyleValueStateMap } from "../utils/styles.js";
-import { KeyframesSteps, PropertyDefinition } from "../injector/types.js";
-import { CSSProperties } from "react";
-
-//#region src/tasty/styles/types.d.ts
-/**
- * Extensible interface for named color tokens.
- * Augment this interface to register project-specific color names
- * for autocomplete in `fill`, `color`, `svgFill`, and other color style props.
- *
- * @example
- * ```typescript
- * declare module '@cube-dev/ui-kit' {
- *   interface TastyNamedColors {
- *     primary: true;
- *     danger: true;
- *   }
- * }
- * ```
- */
-interface TastyNamedColors {}
-type NamedColorKey = Extract<keyof TastyNamedColors, string>;
-type NamedColor = [NamedColorKey] extends [never] ? string : NamedColorKey;
-/**
- * Extensible interface for typography preset names.
- * Augment this interface to register project-specific preset names for autocomplete.
- *
- * @example
- * ```typescript
- * declare module '@cube-dev/ui-kit' {
- *   interface TastyPresetNames {
- *     h1: true;
- *     t3: true;
- *   }
- * }
- * ```
- */
-interface TastyPresetNames {}
-type PresetNameKey = Extract<keyof TastyPresetNames, string>;
-type PresetName = [PresetNameKey] extends [never] ? string : PresetNameKey;
-type Digit = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
-type OpaquePercentage = '' | `.${Digit}` | `.${Digit}${Digit}` | '.100';
-interface StylesInterface extends Omit<CSSProperties, 'color' | 'fill' | 'font' | 'outline' | 'type' | 'gap' | 'padding' | 'margin' | 'width' | 'height' | 'border' | 'transition' | 'placeContent' | 'placeItems'> {
-  /**
-   * @deprecated Use `flow` style instead.
-   */
-  flexDirection: CSSProperties['flexDirection'];
-  /**
-   * @deprecated Use `placeContent`, `placeItems`, `gridColumns`, `gridRows`, and `gridTemplate` styles instead.
-   */
-  grid: CSSProperties['grid'];
-  /**
-   * @deprecated Use `flexShrink`, `flexGrow`, and `flexBasis` styles instead.
-   */
-  flex: CSSProperties['flex'];
-  /**
-   * Set the background color of the element. Shortcut for `background-color` with enhanced support for Tasty color tokens and syntaxes.
-   *
-   * Examples:
-   * - `fill="#purple.10"` // purple background with 10% opacity
-   * - `fill="#danger"` // danger theme color
-   * - `fill="rgb(255 128 0)"` // custom RGB color
-   * - `fill={true}` // default fill color
-   */
-  fill?: `#${NamedColor}${OpaquePercentage}` | `rgb(${string})` | `rgba(${string})` | boolean | (string & {});
-  /**
-   * @deprecated Use `fill` instead.
-   */
-  backgroundColor?: CSSProperties['backgroundColor'];
-  /**
-   * Set the background image of the element. Shortcut for `background-image` with enhanced support for Tasty tokens.
-   *
-   * Examples:
-   * - `image="url(/path/to/image.png)"` // image from URL
-   * - `image="linear-gradient(to right, #purple, #danger)"` // gradient
-   */
-  image?: CSSProperties['backgroundImage'];
-  /**
-   * @deprecated Use `image` instead.
-   */
-  backgroundImage?: CSSProperties['backgroundImage'];
-  /**
-   * @deprecated Use separate background styles (`fill`, `image`, `backgroundSize`, etc.) instead.
-   * When set, overrides all other background-related styles.
-   */
-  background?: CSSProperties['background'];
-  /**
-   * Set the fill color of SVG elements. Outputs the native CSS `fill` property with enhanced support for Tasty color tokens and syntaxes.
-   *
-   * Examples:
-   * - `svgFill="#purple.10"` // purple fill with 10% opacity
-   * - `svgFill="#danger"` // danger theme color
-   * - `svgFill="rgb(255 128 0)"` // custom RGB color
-   * - `svgFill="currentColor"` // inherit from parent color
-   */
-  svgFill?: `#${NamedColor}${OpaquePercentage}` | `rgb(${string})` | `rgba(${string})` | (string & {});
-  /**
-   * Set the text (current) color of the element. Shortcut for `color` with enhanced support for Tasty color tokens and syntaxes.
-   *
-   * Examples:
-   * - `color="#purple"` // purple text color
-   * - `color="#danger.6"` // danger color with 60% opacity
-   * - `color="red"` // CSS color name
-   * - `color={true}` // currentColor
-   */
-  color?: `#${NamedColor}${OpaquePercentage}` | `rgb(${string})` | `rgba(${string})` | boolean | string;
-  /**
-   * The fade style applies gradient-based fading masks to the edges of an element. Replaces complex CSS mask gradients with a simple, declarative API.
-   *
-   * Syntax: `[width] [directions] [#from-color] [#to-color]`
-   *
-   * Multiple groups can be separated by commas to specify different colors per direction.
-   *
-   * Color tokens (optional):
-   * - First color: transparent start of gradient (default: `rgb(0 0 0 / 0)`)
-   * - Second color: opaque end of gradient (default: `rgb(0 0 0 / 1)`)
-   *
-   * Examples:
-   * - `fade="top"` // fade only top edge with default width
-   * - `fade="2x left right"` // fade left and right edges with 2x width
-   * - `fade="1x top"` // fade only top edge with 1x width
-   * - `fade="3x 1x top bottom"` // top: 3x width, bottom: 1x width
-   * - `fade="2x #transparent #dark"` // custom colors for gradient mask
-   * - `fade="1x top #clear #solid"` // top edge with custom mask colors
-   * - `fade="top #red #blue, bottom #green #yellow"` // different colors per direction
-   * - `fade="2x top #a #b, 1x bottom #c #d"` // different widths and colors per direction
-   */
-  fade?: 'top' | 'right' | 'bottom' | 'left' | string;
-  /**
-   * @deprecated Use `scrollbar` style instead.
-   * Whether the element has styled scrollbar.
-   */
-  styledScrollbar?: boolean;
-  /**
-   * The scrollbar style provides a powerful and flexible way to control the appearance and behavior of scrollbars across browsers. It supports custom sizing, color, visibility, and advanced modifiers for modern UI needs.
-   *
-   * Syntax: `[modifiers] [size] [color1] [color2] [color3]`
-   *
-   * Modifiers: `thin`, `none`, `auto`, `stable`, `both-edges`, `always`, `styled`
-   *
-   * Examples:
-   * - `scrollbar={true}` // thin scrollbar, default color
-   * - `scrollbar="thin 10px #purple.40 #dark.04"`
-   * - `scrollbar="styled 12px #purple.40 #dark.04 #white.10"`
-   * - `scrollbar="none"`
-   * - `scrollbar="always 8px #primary.50 #white.02"`
-   */
-  scrollbar?: string | boolean | number;
-  /**
-   * Set font weight for bold texts.
-   */
-  boldFontWeight?: number;
-  /**
-   * The gap style is a powerful, cross-layout shorthand for spacing between child elements. Works with flex, grid, and block layouts.
-   *
-   * For flex/grid: sets native `gap` property
-   * For block layouts: emulated using margin on children
-   *
-   * Examples:
-   * - `gap="2x"` // gap: 2x (or margin-bottom: 2x for block)
-   * - `gap="1x 2x"` // row gap: 1x, column gap: 2x
-   * - `gap={true}` // default gap (1x)
-   */
-  gap?: CSSProperties['gap'] | string | boolean;
-  /**
-   * Shorthand for element padding. Supports custom units, directional modifiers, and design-system-driven defaults.
-   *
-   * Examples:
-   * - `padding="2x 1x"` // top/bottom: 2x, left/right: 1x
-   * - `padding="2x top"` // only top padding: 2x
-   * - `padding="1x left right"` // left and right padding: 1x
-   * - `padding={true}` // default padding on all sides
-   */
-  padding?: CSSProperties['padding'] | string | boolean;
-  /**
-   * Shorthand for element margin. Supports custom units, directional modifiers, and design-system-driven defaults.
-   *
-   * Examples:
-   * - `margin="2x 1x"` // top/bottom: 2x, left/right: 1x
-   * - `margin="2x top"` // only top margin: 2x
-   * - `margin="1x left right"` // left and right margin: 1x
-   * - `margin={true}` // default margin on all sides
-   */
-  margin?: CSSProperties['margin'] | string | boolean;
-  /**
-   * Concise shorthand for setting element width, including min-width and max-width. Supports custom units and advanced sizing keywords.
-   *
-   * Syntax: `[value]` | `[min max]` | `[min value max]` | `[modifier value]`
-   *
-   * Modifiers: `min`, `max`
-   * Keywords: `stretch`, `max-content`, `min-content`, `fit-content`
-   *
-   * Examples:
-   * - `width="10x"` // width: 10x
-   * - `width="1x 10x"` // min-width: 1x; max-width: 10x
-   * - `width="min 2x"` // min-width: 2x
-   * - `width="stretch"` // width: stretch (fill-available)
-   * - `width={true}` // width: auto
-   */
-  width?: CSSProperties['width'] | string | boolean;
-  /**
-   * Concise shorthand for setting element height, including min-height and max-height. Supports custom units and advanced sizing keywords.
-   *
-   * Syntax: `[value]` | `[min max]` | `[min value max]` | `[modifier value]`
-   *
-   * Modifiers: `min`, `max`
-   * Keywords: `stretch`, `max-content`, `min-content`, `fit-content`
-   *
-   * Examples:
-   * - `height="100px"` // height: 100px
-   * - `height="1x 5x 10x"` // min-height: 1x; height: 5x; max-height: 10x
-   * - `height="min 2x"` // min-height: 2x
-   * - `height={true}` // height: auto
-   */
-  height?: CSSProperties['height'] | string | boolean;
-  /**
-   * Shorthand for border width, style, and color. Supports directional modifiers and design-system defaults.
-   *
-   * Syntax: `[width] [style] [color] [directions]` | `[directions]` | `true`
-   *
-   * Multiple groups can be separated by commas. Later groups override earlier groups for conflicting directions.
-   *
-   * Examples:
-   * - `border={true}` // default border on all sides (1bw solid)
-   * - `border="2bw dashed #purple"` // 2bw dashed purple border
-   * - `border="2bw top"` // only top border: 2bw solid
-   * - `border="dotted #danger left right"` // left/right: 1bw dotted danger
-   * - `border="1bw #red, 2bw #blue top"` // all sides red 1bw, top overridden to blue 2bw
-   * - `border="1bw, dashed top bottom, #purple left right"` // base 1bw, dashed on top/bottom, purple on left/right
-   */
-  border?: CSSProperties['border'] | string | boolean;
-  /**
-   * Powerful shorthand for CSS transitions using semantic names and design tokens. Supports grouped transitions for common UI effects.
-   *
-   * Semantic names: `fade`, `fill`, `border`, `radius`, `shadow`, `preset`, `gap`, `theme`
-   * Multiple transitions: separated by commas
-   *
-   * Examples:
-   * - `transition="fill 0.2s, radius 0.3s"` // transitions background-color and border-radius
-   * - `transition="fade 0.15s ease-in"` // transitions mask with easing
-   * - `transition="theme 0.3s"` // transitions all theme-related properties
-   * - `transition="preset 0.2s"` // transitions typography properties
-   */
-  transition?: CSSProperties['transition'] | string;
-  /**
-   * Whether the element is hidden using `display: none`. Boolean shortcut for conditional element visibility.
-   *
-   * Examples:
-   * - `hide={true}` // display: none
-   * - `hide={false}` // element remains visible
-   */
-  hide?: boolean;
-  /**
-   * The shadow style adds shadow effects around an element's frame. Supports multiple effects separated by commas with X/Y offsets, blur, spread radius, and color.
-   *
-   * Examples:
-   * - `shadow="1x .5x .5x #dark.50"` // custom shadow with Tasty units and colors
-   * - `shadow="0 1x 2x #dark.20"` // standard shadow syntax
-   * - `shadow={true}` // default shadow from design system
-   */
-  shadow?: string | boolean;
-  /**
-   * The radius style rounds the corners of an element's outer border edge. Supports custom units, advanced shapes, and directional modifiers.
-   *
-   * Syntax: `[value] [modifiers]` | `[shape]` | `true`
-   *
-   * Shapes: `round` (fully rounded), `ellipse` (50%), `leaf`, `backleaf` (asymmetric)
-   * Directional modifiers: `top`, `right`, `bottom`, `left`
-   *
-   * Examples:
-   * - `radius="2r"` // border-radius: calc(var(--radius) * 2)
-   * - `radius={true}` // default radius (1r)
-   * - `radius="round"` // fully rounded (9999rem)
-   * - `radius="leaf"` // asymmetric leaf shape
-   * - `radius="1r top"` // round only top corners
-   */
-  radius?: 'round' | 'ellipse' | 'leaf' | 'backleaf' | string | true;
-  /**
-   * The flow style is a unified shorthand for controlling layout direction and wrapping in both flex and grid containers. Replaces `flexDirection` and `gridAutoFlow`.
-   *
-   * For flex: sets `flex-flow` (direction + wrapping)
-   * For grid: sets `grid-auto-flow` (direction + density)
-   * For block: determines gap direction (row/column)
-   *
-   * Syntax: `[direction] [wrap|dense]`
-   *
-   * Examples:
-   * - `flow="row wrap"` // flex-flow: row wrap
-   * - `flow="column dense"` // grid-auto-flow: column dense
-   * - `flow="row"` // primary axis direction
-   */
-  flow?: CSSProperties['flexFlow'] | CSSProperties['gridAutoFlow'] | string;
-  /**
-   * The gridAreas style specifies named grid areas, establishing cells in the grid and assigning them names.
-   *
-   * Examples:
-   * - `gridAreas='"header header" "sidebar content" "footer footer"'`
-   */
-  gridAreas?: CSSProperties['gridTemplateAreas'];
-  /**
-   * The gridColumns style defines line names and track sizing functions of grid columns.
-   *
-   * Examples:
-   * - `gridColumns="1fr 2fr 1fr"` // three columns with flex ratios
-   * - `gridColumns={3}` // three equal columns (shorthand)
-   * - `gridColumns="repeat(auto-fit, minmax(200px, 1fr))"` // responsive columns
-   */
-  gridColumns?: CSSProperties['gridTemplateColumns'] | number;
-  /**
-   * The gridRows style defines line names and track sizing functions of grid rows.
-   *
-   * Examples:
-   * - `gridRows="auto 1fr auto"` // header, content, footer layout
-   * - `gridRows={4}` // four equal rows (shorthand)
-   * - `gridRows="repeat(3, 100px)"` // three 100px rows
-   */
-  gridRows?: CSSProperties['gridTemplateRows'] | number;
-  /**
-   * The gridTemplate style is a shorthand property for defining grid columns, rows, and areas simultaneously.
-   *
-   * Examples:
-   * - `gridTemplate='"header header" auto "content sidebar" 1fr / 2fr 1fr'`
-   */
-  gridTemplate?: CSSProperties['gridTemplate'];
-  /**
-   * The font style specifies a prioritized list of font family names with design-system-driven defaults and fallbacks.
-   *
-   * Examples:
-   * - `font="monospace"` // monospace font stack
-   * - `font="Helvetica, Arial, sans-serif"` // custom font list
-   * - `font={true}` // default design system font
-   */
-  font?: CSSProperties['fontFamily'] | boolean;
-  /**
-   * The outline style sets the outline for the element.
-   *
-   * Syntax: `[width] [style] [color] / [offset]` | `true`
-   *
-   * Examples:
-   * - `outline="2ow dashed #purple"` // 2ow dashed purple outline
-   * - `outline="2ow #danger / 1x"` // 2ow solid danger outline, 1x offset
-   * - `outline={true}` // default outline (1ow solid)
-   */
-  outline?: string | boolean;
-  /**
-   * The outline offset style sets the offset of the outline.
-   *
-   * Examples:
-   * - `outlineOffset="4px"` // 4px offset
-   * - `outlineOffset="1x"` // 1x (8px) offset
-   */
-  outlineOffset?: string | number;
-  /**
-   * The preset style sets base text settings according to named presets. Affects `font-size`, `line-height`, `letter-spacing`, `font-weight`, and `text-transform`.
-   *
-   * Preset names are project-specific. Augment `TastyPresetNames` to register them for autocomplete.
-   *
-   * Examples:
-   * - `preset="h1"` // heading 1 typography
-   * - `preset="h2 strong"` // bold heading 2
-   * - `preset="t3"` // text size 3
-   */
-  preset?: PresetName | (string & {});
-  /**
-   * Shorthand for `align-items` and `align-content`. Sets both properties for unified vertical alignment in flex/grid layouts.
-   *
-   * Examples:
-   * - `align="center"` // align-items: center; align-content: center
-   * - `align="flex-start"` // align both to start
-   * - `align="space-between"` // distribute space between items
-   */
-  align?: CSSProperties['alignItems'] | CSSProperties['alignContent'];
-  /**
-   * Shorthand for `justify-items` and `justify-content`. Sets both properties for unified horizontal alignment in flex/grid layouts.
-   *
-   * Examples:
-   * - `justify="center"` // justify-items: center; justify-content: center
-   * - `justify="space-between"` // distribute space between items
-   * - `justify="flex-end"` // align both to end
-   */
-  justify?: CSSProperties['justifyItems'] | CSSProperties['justifyContent'];
-  /**
-   * Shorthand for `place-items` and `place-content`. Sets both properties for unified alignment of both axes in grid/flex layouts.
-   *
-   * Examples:
-   * - `place="center"` // place-items: center; place-content: center
-   * - `place="start end"` // place-items: start; place-content: end
-   * - `place="stretch"` // place both to stretch
-   */
-  place?: CSSProperties['placeItems'] | CSSProperties['placeContent'] | string;
-  /**
-   * Sets `place-content` property for aligning and distributing content in grid/flex containers.
-   *
-   * Examples:
-   * - `placeContent="center"` // center content in both axes
-   * - `placeContent="space-between"` // distribute content with space between
-   */
-  placeContent?: CSSProperties['placeContent'];
-  /**
-   * Sets `place-items` property for aligning items in grid/flex containers.
-   *
-   * Examples:
-   * - `placeItems="center"` // center items in both axes
-   * - `placeItems="start end"` // start on block axis, end on inline axis
-   */
-  placeItems?: CSSProperties['placeItems'];
-  /**
-   * Shorthand for `top`, `right`, `bottom`, and `left` offsets. Supports custom units, directional modifiers, and positioning.
-   *
-   * Examples:
-   * - `inset="0"` // all sides: 0
-   * - `inset="2x top"` // only top offset: 2x
-   * - `inset="1x left right"` // left and right offsets: 1x
-   * - `inset={true}` // all sides: 0
-   */
-  inset?: 'top' | 'right' | 'bottom' | 'left' | string | CSSProperties['inset'];
-  /**
-   * Local keyframes definitions for this component.
-   * Keys are animation names, values are keyframes step definitions.
-   * Local keyframes override global keyframes with the same name.
-   *
-   * Examples:
-   * - `'@keyframes': { fadeIn: { from: { opacity: 0 }, to: { opacity: 1 } } }`
-   * - `'@keyframes': { pulse: { '0%, 100%': { transform: 'scale(1)' }, '50%': { transform: 'scale(1.05)' } } }`
-   */
-  '@keyframes'?: Record<string, KeyframesSteps>;
-  /**
-   * CSS @property definitions for custom properties using tasty token syntax.
-   * Properties are registered once and are permanent (never removed).
-   *
-   * Token formats:
-   * - `$name` for regular properties → `--name` (requires syntax to be specified)
-   * - `#name` for color properties → `--name-color` (auto-sets syntax: '<color>', defaults initialValue: 'transparent')
-   *
-   * Examples:
-   * - `'@properties': { '$rotation': { syntax: '<angle>', inherits: false, initialValue: '45deg' } }`
-   * - `'@properties': { '#theme': { initialValue: 'purple' } }` // syntax: '<color>' is auto-set
-   */
-  '@properties'?: Record<string, PropertyDefinition>;
-  /**
-   * Apply one or more predefined style recipes by name.
-   * Recipes are defined globally via `configure({ recipes: { ... } })`.
-   * Multiple recipes are space-separated. Use `|` to separate base recipes
-   * (applied before component styles) from post recipes (applied after, via mergeStyles).
-   *
-   * Examples:
-   * - `recipe: 'card'` // Apply the 'card' recipe
-   * - `recipe: 'card elevated'` // Apply 'card' then 'elevated', then component styles
-   * - `recipe: 'reset input | input-autofill'` // Base recipes, then post recipe
-   * - `recipe: ''` // Clear recipes from base styles when extending
-   */
-  recipe?: string;
-}
-/** Special style keys that should not be wrapped in StyleValue/StyleValueStateMap */
-type SpecialStyleKeys = '@keyframes' | '@properties' | 'recipe';
-type StylesWithoutSelectors = { [key in keyof StylesInterface as key extends SpecialStyleKeys ? never : key]?: StyleValue<StylesInterface[key]> | StyleValueStateMap<StylesInterface[key]> };
-/**
- * Index signature for recipe-specific arbitrary keys.
- * Supports local predefined states (`@name`), vendor-prefixed CSS properties (`-webkit-*`),
- * CSS custom properties (`$name`), and color tokens (`#name`).
- * Unlike StylesIndexSignature, does NOT allow sub-element selectors (recipes are flat).
- */
-interface RecipeIndexSignature {
-  [key: string]: StyleValue<string | number | boolean | undefined> | StyleValueStateMap<string | number | boolean | undefined>;
-}
-/**
- * Style type for recipe definitions.
- * Like StylesWithoutSelectors but also allows `@keyframes`, `@properties`,
- * local predefined states, and vendor-prefixed CSS properties.
- * Excludes `recipe` to prevent recursive references.
- */
-type RecipeStyles = StylesWithoutSelectors & RecipeIndexSignature & {
-  '@keyframes'?: StylesInterface['@keyframes'];
-  '@properties'?: StylesInterface['@properties'];
-};
-/** Special properties that are not regular style values */
-interface SpecialStyleProperties {
-  '@keyframes'?: StylesInterface['@keyframes'];
-  '@properties'?: StylesInterface['@properties'];
-  recipe?: StylesInterface['recipe'];
-}
-/** Index signature for arbitrary style keys (sub-elements, CSS variables, etc.) */
-interface StylesIndexSignature {
-  [key: string]: StyleValue<string | number | boolean | undefined> | StyleValueStateMap<string | number | boolean | undefined> | Styles | false | StylesInterface['@keyframes'] | StylesInterface['@properties'];
-  /**
-   * Selector combinator: `undefined` (descendant, default), `'>'` (child), `'+'` (adjacent), `'~'` (sibling).
-   * Can chain with capitalized names: `'> Body > Row >'`. Spaces required around combinators.
-   */
-  $?: string;
-}
-type Styles = StylesWithoutSelectors & SpecialStyleProperties & StylesIndexSignature;
-//#endregion
-export { RecipeStyles, Styles };
-//# sourceMappingURL=types.d.ts.map

package/dist/styles/width.js

@@ -1,21 +0,0 @@
-/** @license MIT | @cube-dev/ui-kit v0.117.0 | Cube Dev Team */
-import { dimensionStyle } from "./dimension.js";
-
-//#region src/tasty/styles/width.ts
-const dimension = dimensionStyle("width");
-function widthStyle({ width, minWidth, maxWidth }) {
-	return dimension({
-		value: width,
-		min: minWidth,
-		max: maxWidth
-	});
-}
-widthStyle.__lookupStyles = [
-	"width",
-	"minWidth",
-	"maxWidth"
-];
-
-//#endregion
-export { widthStyle };
-//# sourceMappingURL=width.js.map

package/dist/styles/width.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"width.js","names":[],"sources":["../../src/tasty/styles/width.ts"],"sourcesContent":["import { dimensionStyle } from './dimension';\n\nconst dimension = dimensionStyle('width');\n\ninterface WidthStyleProps {\n  width?: string | number | boolean;\n  minWidth?: string | number | boolean;\n  maxWidth?: string | number | boolean;\n}\n\nexport function widthStyle({ width, minWidth, maxWidth }: WidthStyleProps) {\n  return dimension({ value: width, min: minWidth, max: maxWidth });\n}\n\nwidthStyle.__lookupStyles = ['width', 'minWidth', 'maxWidth'];\n"],"mappings":";;;;AAEA,MAAM,YAAY,eAAe,QAAQ;AAQzC,SAAgB,WAAW,EAAE,OAAO,UAAU,YAA6B;AACzE,QAAO,UAAU;EAAE,OAAO;EAAO,KAAK;EAAU,KAAK;EAAU,CAAC;;AAGlE,WAAW,iBAAiB;CAAC;CAAS;CAAY;CAAW"}

package/dist/tasty/chunks/cacheKey.d.ts

@@ -1,2 +0,0 @@
-
-import "../styles/types.js";

package/dist/tasty/chunks/cacheKey.js

@@ -1,71 +0,0 @@
-/** @license MIT | @cube-dev/ui-kit v0.117.0 | Cube Dev Team */
-import { extractLocalPredefinedStates, extractPredefinedStateRefs } from "../states/index.js";
-
-//#region src/tasty/chunks/cacheKey.ts
-/**
-* Chunk-specific cache key generation.
-*
-* Generates cache keys that only include styles relevant to a specific chunk,
-* enabling more granular caching and reuse.
-*
-* Enhanced to support predefined states:
-* - Global predefined states don't affect cache keys (constant across app)
-* - Local predefined states only affect cache keys if referenced in the chunk
-*/
-/**
-* Recursively serialize a value with sorted keys for stable output.
-* This ensures that {a: 1, b: 2} and {b: 2, a: 1} produce the same string.
-*/
-function stableStringify(value) {
-	if (value === null) return "null";
-	if (value === void 0) return "undefined";
-	if (typeof value !== "object") return JSON.stringify(value);
-	if (Array.isArray(value)) return "[" + value.map(stableStringify).join(",") + "]";
-	const obj = value;
-	const sortedKeys = Object.keys(obj).sort();
-	const parts = [];
-	for (const key of sortedKeys) if (obj[key] !== void 0) parts.push(`${JSON.stringify(key)}:${stableStringify(obj[key])}`);
-	return "{" + parts.join(",") + "}";
-}
-/**
-* Generate a cache key for a specific chunk.
-*
-* Only includes the styles that belong to this chunk, allowing
-* chunks to be cached independently.
-*
-* Also includes relevant local predefined states that are referenced
-* by this chunk's styles.
-*
-* @param styles - The full styles object
-* @param chunkName - Name of the chunk
-* @param styleKeys - Keys of styles belonging to this chunk
-* @returns A stable cache key string
-*/
-function generateChunkCacheKey(styles, chunkName, styleKeys) {
-	const parts = [chunkName];
-	const sortedKeys = styleKeys.slice().sort();
-	let chunkStylesStr = "";
-	for (const key of sortedKeys) {
-		const value = styles[key];
-		if (value !== void 0) {
-			const serialized = stableStringify(value);
-			parts.push(`${key}:${serialized}`);
-			chunkStylesStr += serialized;
-		}
-	}
-	const localStates = extractLocalPredefinedStates(styles);
-	if (Object.keys(localStates).length > 0) {
-		const referencedStates = extractPredefinedStateRefs(chunkStylesStr);
-		const relevantLocalStates = [];
-		for (const stateName of referencedStates) if (localStates[stateName]) relevantLocalStates.push(`${stateName}=${localStates[stateName]}`);
-		if (relevantLocalStates.length > 0) {
-			relevantLocalStates.sort();
-			parts.unshift(`[states:${relevantLocalStates.join("|")}]`);
-		}
-	}
-	return parts.join("\0");
-}
-
-//#endregion
-export { generateChunkCacheKey };
-//# sourceMappingURL=cacheKey.js.map

package/dist/tasty/chunks/cacheKey.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"cacheKey.js","names":[],"sources":["../../../src/tasty/chunks/cacheKey.ts"],"sourcesContent":["/**\n * Chunk-specific cache key generation.\n *\n * Generates cache keys that only include styles relevant to a specific chunk,\n * enabling more granular caching and reuse.\n *\n * Enhanced to support predefined states:\n * - Global predefined states don't affect cache keys (constant across app)\n * - Local predefined states only affect cache keys if referenced in the chunk\n */\n\nimport {\n  extractLocalPredefinedStates,\n  extractPredefinedStateRefs,\n} from '../states';\nimport { Styles } from '../styles/types';\n\n/**\n * Recursively serialize a value with sorted keys for stable output.\n * This ensures that {a: 1, b: 2} and {b: 2, a: 1} produce the same string.\n */\nfunction stableStringify(value: unknown): string {\n  if (value === null) {\n    return 'null';\n  }\n  if (value === undefined) {\n    return 'undefined';\n  }\n  if (typeof value !== 'object') {\n    return JSON.stringify(value);\n  }\n  if (Array.isArray(value)) {\n    return '[' + value.map(stableStringify).join(',') + ']';\n  }\n  // Object: sort keys for stable order\n  const obj = value as Record<string, unknown>;\n  const sortedKeys = Object.keys(obj).sort();\n  const parts: string[] = [];\n  for (const key of sortedKeys) {\n    if (obj[key] !== undefined) {\n      parts.push(`${JSON.stringify(key)}:${stableStringify(obj[key])}`);\n    }\n  }\n  return '{' + parts.join(',') + '}';\n}\n\n/**\n * Generate a cache key for a specific chunk.\n *\n * Only includes the styles that belong to this chunk, allowing\n * chunks to be cached independently.\n *\n * Also includes relevant local predefined states that are referenced\n * by this chunk's styles.\n *\n * @param styles - The full styles object\n * @param chunkName - Name of the chunk\n * @param styleKeys - Keys of styles belonging to this chunk\n * @returns A stable cache key string\n */\nexport function generateChunkCacheKey(\n  styles: Styles,\n  chunkName: string,\n  styleKeys: string[],\n): string {\n  // Start with chunk name for namespace separation\n  const parts: string[] = [chunkName];\n\n  // Sort keys for stable ordering\n  const sortedKeys = styleKeys.slice().sort();\n\n  // Build the chunk-specific styles string for predefined state detection\n  let chunkStylesStr = '';\n\n  for (const key of sortedKeys) {\n    const value = styles[key];\n    if (value !== undefined) {\n      // Use stable stringify for consistent serialization regardless of key order\n      const serialized = stableStringify(value);\n      parts.push(`${key}:${serialized}`);\n      chunkStylesStr += serialized;\n    }\n  }\n\n  // Extract local predefined states from the full styles object\n  const localStates = extractLocalPredefinedStates(styles);\n\n  // Only include local predefined states that are actually referenced in this chunk\n  if (Object.keys(localStates).length > 0) {\n    const referencedStates = extractPredefinedStateRefs(chunkStylesStr);\n    const relevantLocalStates: string[] = [];\n\n    for (const stateName of referencedStates) {\n      if (localStates[stateName]) {\n        relevantLocalStates.push(`${stateName}=${localStates[stateName]}`);\n      }\n    }\n\n    // Add relevant local states to the cache key (sorted for stability)\n    if (relevantLocalStates.length > 0) {\n      relevantLocalStates.sort();\n      parts.unshift(`[states:${relevantLocalStates.join('|')}]`);\n    }\n  }\n\n  // Use null character as separator (safe, not in JSON output)\n  return parts.join('\\0');\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAqBA,SAAS,gBAAgB,OAAwB;AAC/C,KAAI,UAAU,KACZ,QAAO;AAET,KAAI,UAAU,OACZ,QAAO;AAET,KAAI,OAAO,UAAU,SACnB,QAAO,KAAK,UAAU,MAAM;AAE9B,KAAI,MAAM,QAAQ,MAAM,CACtB,QAAO,MAAM,MAAM,IAAI,gBAAgB,CAAC,KAAK,IAAI,GAAG;CAGtD,MAAM,MAAM;CACZ,MAAM,aAAa,OAAO,KAAK,IAAI,CAAC,MAAM;CAC1C,MAAM,QAAkB,EAAE;AAC1B,MAAK,MAAM,OAAO,WAChB,KAAI,IAAI,SAAS,OACf,OAAM,KAAK,GAAG,KAAK,UAAU,IAAI,CAAC,GAAG,gBAAgB,IAAI,KAAK,GAAG;AAGrE,QAAO,MAAM,MAAM,KAAK,IAAI,GAAG;;;;;;;;;;;;;;;;AAiBjC,SAAgB,sBACd,QACA,WACA,WACQ;CAER,MAAM,QAAkB,CAAC,UAAU;CAGnC,MAAM,aAAa,UAAU,OAAO,CAAC,MAAM;CAG3C,IAAI,iBAAiB;AAErB,MAAK,MAAM,OAAO,YAAY;EAC5B,MAAM,QAAQ,OAAO;AACrB,MAAI,UAAU,QAAW;GAEvB,MAAM,aAAa,gBAAgB,MAAM;AACzC,SAAM,KAAK,GAAG,IAAI,GAAG,aAAa;AAClC,qBAAkB;;;CAKtB,MAAM,cAAc,6BAA6B,OAAO;AAGxD,KAAI,OAAO,KAAK,YAAY,CAAC,SAAS,GAAG;EACvC,MAAM,mBAAmB,2BAA2B,eAAe;EACnE,MAAM,sBAAgC,EAAE;AAExC,OAAK,MAAM,aAAa,iBACtB,KAAI,YAAY,WACd,qBAAoB,KAAK,GAAG,UAAU,GAAG,YAAY,aAAa;AAKtE,MAAI,oBAAoB,SAAS,GAAG;AAClC,uBAAoB,MAAM;AAC1B,SAAM,QAAQ,WAAW,oBAAoB,KAAK,IAAI,CAAC,GAAG;;;AAK9D,QAAO,MAAM,KAAK,KAAK"}

package/dist/tasty/chunks/definitions.d.ts

@@ -1,38 +0,0 @@
-
-//#region src/tasty/chunks/definitions.d.ts
-declare const CHUNK_NAMES: {
-  /** Special chunk for styles that cannot be split (e.g., @starting-style) */readonly COMBINED: "combined";
-  readonly SUBCOMPONENTS: "subcomponents";
-  readonly APPEARANCE: "appearance";
-  readonly FONT: "font";
-  readonly DIMENSION: "dimension";
-  readonly DISPLAY: "display";
-  readonly LAYOUT: "layout";
-  readonly POSITION: "position";
-  readonly MISC: "misc";
-};
-type ChunkName = (typeof CHUNK_NAMES)[keyof typeof CHUNK_NAMES];
-/**
- * Pre-computed map for O(1) style-to-chunk lookup.
- * Built once at module load time.
- */
-declare const STYLE_TO_CHUNK: Map<string, ChunkName>;
-interface ChunkInfo {
-  /** Name of the chunk */
-  name: ChunkName | string;
-  /** Style keys belonging to this chunk */
-  styleKeys: string[];
-}
-/**
- * Categorize style keys into chunks.
- *
- * Returns chunks in a deterministic order (by CHUNK_ORDER) regardless
- * of the order of keys in the input styles object.
- *
- * @param styles - The styles object to categorize
- * @returns Map of chunk name to array of style keys in that chunk (in priority order)
- */
-declare function categorizeStyleKeys(styles: Record<string, unknown>): Map<string, string[]>;
-//#endregion
-export { CHUNK_NAMES, ChunkInfo, ChunkName, STYLE_TO_CHUNK, categorizeStyleKeys };
-//# sourceMappingURL=definitions.d.ts.map