@cube-dev/ui-kit 0.0.0-canary-55e23f2 → 0.0.0-canary-21dd9ff

package/types/tasty/index.d.ts

@@ -11,6 +11,7 @@ export * from './providers/BreakpointsProvider';
 export * from './utils/mergeStyles';
 export * from './utils/warnings';
 export * from './utils/getDisplayName';
+export * from './injector';
 export type { TastyProps, GlobalTastyProps, AllBasePropsWithMods, } from './tasty';
 export type { AllBaseProps, BaseProps, BaseStyleProps, DimensionStyleProps, ColorStyleProps, OuterStyleProps, PositionStyleProps, TextStyleProps, BlockStyleProps, ContainerStyleProps, BasePropsWithoutChildren, Props, FlowStyleProps, ShortGridStyles, GlobalStyledProps, TagName, } from './types';
 export type { StylesInterface, Styles, StylesWithoutSelectors, NoType, Selector, SuffixForSelector, NotSelector, } from './styles/types';

package/types/tasty/injector/flatten.d.ts

@@ -0,0 +1,16 @@
+import { FlattenedRule } from './types';
+/**
+ * Parse and flatten nested CSS
+ * Handles &, .Class, SubElement patterns from renderStyles output
+ * Preserves at-rule context (media queries, supports, etc.)
+ */
+export declare function flattenNestedCss(cssText: string, baseClassName: string, atRuleStack?: string[]): FlattenedRule[];
+/**
+ * Flatten nested CSS for a concrete selector (global styles).
+ * Unlike the className-based variant, this preserves the provided selector string as-is.
+ */
+export declare function flattenNestedCssForSelector(cssText: string, baseSelector: string, atRuleStack?: string[]): FlattenedRule[];
+/**
+ * Wrap a CSS rule with at-rules (media queries, supports, etc.)
+ */
+export declare function wrapWithAtRules(rule: string, atRules?: string[]): string;

package/types/tasty/injector/index.d.ts

@@ -0,0 +1,64 @@
+import { StyleResult } from '../utils/renderStyles';
+import { StyleInjector } from './injector';
+import { DisposeFunction, InjectResult, StyleInjectorConfig } from './types';
+declare const GLOBAL_INJECTOR_KEY = "__TASTY_GLOBAL_INJECTOR__";
+declare global {
+    interface Window {
+        [GLOBAL_INJECTOR_KEY]?: StyleInjector;
+    }
+}
+/**
+ * Configure the global style injector
+ */
+export declare function configure(config?: Partial<StyleInjectorConfig>): void;
+/**
+ * Inject styles and return className with dispose function
+ */
+export declare function inject(rules: StyleResult[], options?: {
+    root?: Document | ShadowRoot;
+}): InjectResult;
+/**
+ * Inject global CSS rule (legacy method - not supported in direct injector)
+ */
+export declare function injectGlobal(selector: string, cssText: string, options?: {
+    root?: Document | ShadowRoot;
+}): DisposeFunction;
+/**
+ * Get CSS text from all sheets (for SSR)
+ */
+export declare function getCssText(options?: {
+    root?: Document | ShadowRoot;
+}): string;
+/**
+ * Collect only CSS used by a rendered subtree (like jest-styled-components).
+ * Pass the container returned by render(...).
+ */
+export declare function getCssTextForNode(node: ParentNode | Element | DocumentFragment, options?: {
+    root?: Document | ShadowRoot;
+}): string;
+/**
+ * Force cleanup of unused rules
+ */
+export declare function cleanup(root?: Document | ShadowRoot): void;
+/**
+ * Check if we're currently running in a test environment
+ */
+export declare function getIsTestEnvironment(): boolean;
+/**
+ * Get the global injector instance for debugging
+ */
+export declare const injector: {
+    readonly instance: StyleInjector;
+};
+/**
+ * Destroy all resources and clean up
+ */
+export declare function destroy(root?: Document | ShadowRoot): void;
+/**
+ * Create a new isolated injector instance
+ */
+export declare function createInjector(config?: Partial<StyleInjectorConfig>): StyleInjector;
+export type { StyleInjectorConfig, InjectResult, DisposeFunction, RuleInfo, SheetInfo, RootRegistry, FlattenedRule, KeyframesInfo, DisposedRuleInfo, CacheMetrics, } from './types';
+export { StyleInjector } from './injector';
+export { SheetManager } from './sheet-manager';
+export { flattenNestedCss } from './flatten';

package/types/tasty/injector/injector.d.ts

@@ -0,0 +1,82 @@
+/**
+ * Style injector that works with structured style objects
+ * Eliminates CSS string parsing for better performance
+ */
+import { StyleResult } from '../utils/renderStyles';
+import { DisposeFunction, InjectResult, StyleInjectorConfig } from './types';
+export declare class StyleInjector {
+    private sheetManager;
+    private config;
+    private cleanupScheduled;
+    constructor(config?: StyleInjectorConfig);
+    /**
+     * Inject styles from StyleResult objects
+     */
+    inject(rules: StyleResult[], options?: {
+        root?: Document | ShadowRoot;
+    }): InjectResult;
+    /**
+     * Convert StyleResult to FlattenedRule format
+     */
+    private convertToFlattenedRules;
+    /**
+     * Extract className from rules (assumes first rule contains the base className)
+     */
+    private extractClassName;
+    /**
+     * Generate cache key from flattened rules with optimized deduplication
+     */
+    private generateCacheKey;
+    /**
+     * Dispose of a className
+     */
+    private dispose;
+    /**
+     * Cleanup unused rules
+     */
+    cleanup(root?: Document | ShadowRoot): void;
+    /**
+     * Schedule cleanup to run in the next microtask
+     */
+    private scheduleCleanup;
+    /**
+     * Inject global CSS rule
+     */
+    injectGlobal(selector: string, cssText: string, options?: {
+        root?: Document | ShadowRoot;
+    }): DisposeFunction;
+    /**
+     * Get CSS text from all sheets (for SSR)
+     */
+    getCssText(options?: {
+        root?: Document | ShadowRoot;
+    }): string;
+    /**
+     * Get CSS only for the provided tasty classNames (e.g., ["t0","t3"])
+     */
+    getCssTextForClasses(classNames: Iterable<string>, options?: {
+        root?: Document | ShadowRoot;
+    }): string;
+    /**
+     * Get cache performance metrics
+     */
+    getMetrics(options?: {
+        root?: Document | ShadowRoot;
+    }): any;
+    /**
+     * Reset cache performance metrics
+     */
+    resetMetrics(options?: {
+        root?: Document | ShadowRoot;
+    }): void;
+    /**
+     * Force cleanup of disposed rulesets (useful for memory pressure)
+     */
+    forceCleanupDisposed(options?: {
+        root?: Document | ShadowRoot;
+    }): void;
+    /**
+     * Destroy all resources for a root
+     */
+    destroy(root?: Document | ShadowRoot): void;
+}

package/types/tasty/injector/sheet-manager.d.ts

@@ -0,0 +1,74 @@
+import { CacheMetrics, FlattenedRule, RootRegistry, RuleInfo, SheetInfo, StyleInjectorConfig } from './types';
+export declare class SheetManager {
+    private rootRegistries;
+    private config;
+    constructor(config: StyleInjectorConfig);
+    /**
+     * Get or create registry for a root (Document or ShadowRoot)
+     */
+    getRegistry(root: Document | ShadowRoot): RootRegistry;
+    /**
+     * Create a new stylesheet for the registry
+     */
+    createSheet(registry: RootRegistry, root: Document | ShadowRoot): SheetInfo;
+    /**
+     * Create a style element and append to document
+     */
+    private createStyleElement;
+    /**
+     * Insert CSS rules as a single block
+     */
+    insertRule(registry: RootRegistry, flattenedRules: FlattenedRule[], className: string, root: Document | ShadowRoot): RuleInfo | null;
+    /**
+     * Insert global CSS rules
+     */
+    insertGlobalRule(registry: RootRegistry, flattenedRules: FlattenedRule[], className: string, root: Document | ShadowRoot): RuleInfo | null;
+    /**
+     * Delete a CSS rule from the sheet
+     */
+    deleteRule(registry: RootRegistry, ruleInfo: RuleInfo): void;
+    /**
+     * Find a sheet with available space or return null
+     */
+    private findAvailableSheet;
+    /**
+     * Find an available rule index in the sheet
+     */
+    findAvailableRuleIndex(sheet: SheetInfo): number;
+    /**
+     * Move a ruleset to disposed cache for potential reuse
+     */
+    moveToDisposedCache(registry: RootRegistry, className: string): void;
+    /**
+     * Restore a ruleset from disposed cache
+     */
+    restoreFromDisposedCache(registry: RootRegistry, className: string): RuleInfo | null;
+    /**
+     * Actually remove CSS rules from DOM (lazy cleanup)
+     */
+    private performActualCleanup;
+    /**
+     * Process the deletion queue for cleanup
+     */
+    processCleanupQueue(registry: RootRegistry): void;
+    /**
+     * Get total number of rules across all sheets
+     */
+    getTotalRuleCount(registry: RootRegistry): number;
+    /**
+     * Get CSS text from all sheets (for SSR)
+     */
+    getCssText(registry: RootRegistry): string;
+    /**
+     * Get cache performance metrics
+     */
+    getMetrics(registry: RootRegistry): CacheMetrics | null;
+    /**
+     * Reset cache performance metrics
+     */
+    resetMetrics(registry: RootRegistry): void;
+    /**
+     * Clean up resources for a root
+     */
+    cleanup(root: Document | ShadowRoot): void;
+}

package/types/tasty/injector/types.d.ts

@@ -0,0 +1,71 @@
+export interface InjectResult {
+    className: string;
+    dispose: () => void;
+}
+export type DisposeFunction = () => void;
+export interface StyleInjectorConfig {
+    nonce?: string;
+    maxRulesPerSheet?: number;
+    cacheSize?: number;
+    cleanupDelay?: number;
+    idleCleanup?: boolean;
+    collectMetrics?: boolean;
+    forceTextInjection?: boolean;
+    /** When false, avoid storing full cssText for each rule block to reduce memory. */
+    debugMode?: boolean;
+}
+export interface RuleInfo {
+    className: string;
+    ruleIndex: number;
+    sheetIndex: number;
+    cssText: string[];
+    /** Inclusive end index of the contiguous block of inserted rules for this className */
+    endRuleIndex?: number;
+}
+export interface SheetInfo {
+    sheet: HTMLStyleElement;
+    ruleCount: number;
+    holes: number[];
+}
+export interface DisposedRuleInfo {
+    ruleInfo: RuleInfo;
+    disposedAt: number;
+    recentlyUsed: boolean;
+}
+export interface CacheMetrics {
+    hits: number;
+    misses: number;
+    disposedHits: number;
+    evictions: number;
+    totalInsertions: number;
+    totalDisposals: number;
+    domCleanups: number;
+    startTime: number;
+}
+export interface RootRegistry {
+    sheets: SheetInfo[];
+    refCounts: Map<string, number>;
+    rules: Map<string, RuleInfo>;
+    deletionQueue: string[];
+    /** Deduplication set of fully materialized CSS rules inserted into sheets */
+    ruleTextSet: Set<string>;
+    /** LRU cache for disposed rulesets that can be quickly reused */
+    disposedCache: import('../parser/lru').Lru<string, DisposedRuleInfo>;
+    /** Cleanup timeouts for lazy disposal */
+    cleanupTimeouts: Map<string, ReturnType<typeof requestIdleCallback> | ReturnType<typeof setTimeout>>;
+    /** Performance metrics (optional) */
+    metrics?: CacheMetrics;
+    /** Counter for generating sequential class names like t0, t1, t2... */
+    classCounter: number;
+}
+export interface FlattenedRule {
+    selector: string;
+    declarations: string;
+    atRules?: string[];
+}
+export interface KeyframesInfo {
+    name: string;
+    sheetIndex: number;
+    ruleIndex: number;
+    cssText: string;
+}

package/types/tasty/parser/lru.d.ts

@@ -3,9 +3,13 @@ export declare class Lru<K, V> {
     private map;
     private head;
     private tail;
-    constructor(limit?: number);
+    private onEvict?;
+    constructor(limit?: number, onEvict?: (key: K, value: V) => void);
+    setOnEvict(fn?: (key: K, value: V) => void): void;
     get(key: K): V | undefined;
     set(key: K, value: V): void;
+    delete(key: K): void;
+    keys(): IterableIterator<K>;
     private touch;
     private evict;
     clear(): void;

package/types/tasty/styles/color.d.ts

@@ -1,6 +1,8 @@
 export declare function colorStyle({ color }: {
     color: any;
-}): any[] | "";
+}): "" | {
+    color: any;
+};
 export declare namespace colorStyle {
     var __lookupStyles: string[];
 }

package/types/tasty/styles/reset.d.ts

@@ -1,7 +1,6 @@
-import { CSSMap } from '../utils/styles';
 export declare function resetStyle({ reset }: {
     reset: any;
-}): CSSMap[] | undefined;
+}): any[] | undefined;
 export declare namespace resetStyle {
     var __lookupStyles: string[];
 }

package/types/tasty/types.d.ts

@@ -32,8 +32,6 @@ export interface BasePropsWithoutChildren<K extends TagName = TagName> extends P
     isDisabled?: boolean;
     /** Plain css for the element */
     css?: string;
-    /** The element name for using in style overriding */
-    styleName?: string;
     /** The CSS style map */
     style?: CSSProperties | (CSSProperties & {
         [key: string]: string | number | null;

package/types/tasty/utils/renderStyles.d.ts

@@ -1,10 +1,28 @@
+/**
+ * Style rendering that works with structured style objects
+ * Eliminates CSS string parsing for better performance
+ */
 import { Styles } from '../styles/types';
-export declare function isSelector(key: any): any;
+export interface StyleResult {
+    selector: string;
+    declarations: string;
+    atRules?: string[];
+}
+export interface RenderResult {
+    rules: StyleResult[];
+    className?: string;
+}
+/**
+ * Check if a key represents a CSS selector
+ */
+export declare function isSelector(key: string): boolean;
+/**
+ * Render styles without CSS string conversion
+ * This is a performance-optimized version of renderStyles
+ */
+export declare function renderStyles(styles?: Styles, responsive?: number[], className?: string): RenderResult;
 /**
- * Render style props to complete Styled Components CSS.
- * @param styles - Complete style props.
- * @param responsive - A list of responsive zones
- * @param {string} [suffix]
- * @return {string}
+ * Render styles for global injection (without class names)
+ * Returns CSS with & selectors that injectGlobal can process
  */
-export declare function renderStyles(styles?: Styles, responsive?: number[], suffix?: string): any;
+export declare function renderStylesForGlobal(styles?: Styles, responsive?: number[]): string;

package/types/tasty/utils/styles.d.ts

@@ -95,6 +95,7 @@ export declare const CUSTOM_UNITS: {
 };
 export declare const DIRECTIONS: string[];
 export declare function createRule(prop: string, value: StyleValue, selector?: string): string;
+export declare function getModSelector(modName: string): string;
 export declare function customFunc(name: string, fn: (groups: StyleDetails[]) => string): void;
 /**
  *
@@ -137,12 +138,6 @@ export declare function extractStyles(props: {
 }, styleList?: readonly string[], defaultStyles?: Styles, propMap?: {
     [key: string]: string;
 }, ignoreList?: readonly string[]): Styles;
-/**
- * Render CSSMap to Styled Components CSS
- * @param styles
- * @param [selector]
- */
-export declare function renderStylesToSC(styles: StyleHandlerResult, selector?: string): any;
 /**
  * Compile states to finite CSS with selectors.
  * State values should contain a string value with CSS style list.
@@ -151,9 +146,6 @@ export declare function renderStylesToSC(styles: StyleHandlerResult, selector?:
  * @param {string} suffix
  */
 export declare function applyStates(selector: string, states: any, suffix?: string): any;
-export declare function styleHandlerCacheWrapper(styleHandler: StyleHandler, limit?: number): ((styleMap: any, suffix?: string | undefined) => any) & {
-    __lookupStyles: string[];
-};
 /**
  * Replace state values with new ones.
  * For example, if you want to replace initial values with finite CSS code.