@tachui/primitives 0.8.0-alpha

package/dist/controls/Toggle.d.ts

@@ -0,0 +1,207 @@
+/**
+ * Enhanced Toggle Component (Phase 6.4.5)
+ *
+ * SwiftUI-inspired Toggle component with switch-style boolean controls,
+ * smooth animations, and multiple style variants.
+ */
+import type { ModifiableComponent, ModifierBuilder } from '@tachui/core';
+import type { Signal } from '@tachui/core';
+import type { ComponentInstance, ComponentProps, DOMNode } from '@tachui/core';
+/**
+ * Toggle component properties
+ */
+export interface ToggleProps extends ComponentProps {
+    isOn: boolean | Signal<boolean>;
+    onToggle?: (isOn: boolean) => void;
+    label?: string | (() => string) | Signal<string> | ComponentInstance;
+    variant?: 'switch' | 'checkbox' | 'button';
+    size?: 'small' | 'medium' | 'large';
+    color?: string;
+    offColor?: string;
+    thumbColor?: string;
+    disabled?: boolean | Signal<boolean>;
+    animated?: boolean;
+    labelPosition?: 'leading' | 'trailing';
+    spacing?: number;
+    accessibilityLabel?: string;
+    accessibilityHint?: string;
+}
+/**
+ * Enhanced Toggle component class
+ */
+export declare class EnhancedToggle implements ComponentInstance<ToggleProps> {
+    props: ToggleProps;
+    readonly type: "component";
+    readonly id: string;
+    mounted: boolean;
+    cleanup: (() => void)[];
+    private toggleElement;
+    private setIsAnimating;
+    constructor(props: ToggleProps);
+    /**
+     * Get current toggle state
+     */
+    private getIsOn;
+    /**
+     * Check if toggle is disabled
+     */
+    private isDisabled;
+    /**
+     * Resolve label content
+     */
+    private resolveLabel;
+    /**
+     * Helper to render component content safely
+     */
+    private renderComponentContent;
+    /**
+     * Handle toggle change
+     */
+    private handleToggle;
+    /**
+     * Get toggle size styles
+     */
+    private getSizeStyles;
+    /**
+     * Render switch variant
+     */
+    private renderSwitch;
+    /**
+     * Render checkbox variant
+     */
+    private renderCheckbox;
+    /**
+     * Render button variant
+     */
+    private renderButton;
+    /**
+     * Render toggle control based on variant
+     */
+    private renderToggleControl;
+    /**
+     * Render label content
+     */
+    private renderLabel;
+    render(): DOMNode;
+}
+/**
+ * Toggle component function
+ */
+export declare function Toggle(isOn: boolean | Signal<boolean>, props?: Omit<ToggleProps, 'isOn'>): ModifiableComponent<ToggleProps> & {
+    modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+};
+/**
+ * Toggle with label
+ */
+export declare function ToggleWithLabel(label: string | (() => string) | Signal<string> | ComponentInstance, isOn: boolean | Signal<boolean>, props?: Omit<ToggleProps, 'isOn' | 'label'>): ModifiableComponent<ToggleProps> & {
+    modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+};
+/**
+ * Toggle style variants
+ */
+export declare const ToggleStyles: {
+    /**
+     * Switch toggle (default)
+     */
+    Switch(isOn: boolean | Signal<boolean>, props?: Omit<ToggleProps, "isOn" | "variant">): ModifiableComponent<ToggleProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+    };
+    /**
+     * Checkbox toggle
+     */
+    Checkbox(isOn: boolean | Signal<boolean>, props?: Omit<ToggleProps, "isOn" | "variant">): ModifiableComponent<ToggleProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+    };
+    /**
+     * Button toggle
+     */
+    Button(isOn: boolean | Signal<boolean>, props?: Omit<ToggleProps, "isOn" | "variant">): ModifiableComponent<ToggleProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+    };
+    /**
+     * Small toggle
+     */
+    Small(isOn: boolean | Signal<boolean>, props?: Omit<ToggleProps, "isOn" | "size">): ModifiableComponent<ToggleProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+    };
+    /**
+     * Large toggle
+     */
+    Large(isOn: boolean | Signal<boolean>, props?: Omit<ToggleProps, "isOn" | "size">): ModifiableComponent<ToggleProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+    };
+    /**
+     * Custom color toggle
+     */
+    CustomColor(isOn: boolean | Signal<boolean>, color: string, props?: Omit<ToggleProps, "isOn" | "color">): ModifiableComponent<ToggleProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+    };
+    /**
+     * Toggle with leading label
+     */
+    WithLeadingLabel(label: string | (() => string) | Signal<string> | ComponentInstance, isOn: boolean | Signal<boolean>, props?: Omit<ToggleProps, "isOn" | "label" | "labelPosition">): ModifiableComponent<ToggleProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+    };
+    /**
+     * Toggle with trailing label (default)
+     */
+    WithTrailingLabel(label: string | (() => string) | Signal<string> | ComponentInstance, isOn: boolean | Signal<boolean>, props?: Omit<ToggleProps, "isOn" | "label" | "labelPosition">): ModifiableComponent<ToggleProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+    };
+};
+/**
+ * Toggle utilities
+ */
+export declare const ToggleUtils: {
+    /**
+     * Create a toggle group with multiple options
+     */
+    createGroup(options: Array<{
+        key: string;
+        label: string;
+        isOn: boolean | Signal<boolean>;
+        onToggle?: (isOn: boolean) => void;
+    }>, props?: Omit<ToggleProps, "isOn" | "label" | "onToggle">): (ModifiableComponent<ToggleProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+    })[];
+    /**
+     * Create exclusive toggle group (radio-like behavior)
+     */
+    createExclusiveGroup(options: Array<{
+        key: string;
+        label: string;
+    }>, selectedKey: string | Signal<string>, onSelectionChange?: (key: string) => void, props?: Omit<ToggleProps, "isOn" | "label" | "onToggle">): (ModifiableComponent<ToggleProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ToggleProps>>;
+    })[];
+    /**
+     * Batch toggle operations
+     */
+    batch: {
+        /**
+         * Toggle all items in a group
+         */
+        toggleAll(toggles: Array<{
+            isOn: boolean | Signal<boolean>;
+            onToggle?: (isOn: boolean) => void;
+        }>, newState: boolean): void;
+        /**
+         * Get state of all toggles in a group
+         */
+        getStates(toggles: Array<{
+            isOn: boolean | Signal<boolean>;
+        }>): boolean[];
+        /**
+         * Check if all toggles are on
+         */
+        allOn(toggles: Array<{
+            isOn: boolean | Signal<boolean>;
+        }>): boolean;
+        /**
+         * Check if any toggle is on
+         */
+        anyOn(toggles: Array<{
+            isOn: boolean | Signal<boolean>;
+        }>): boolean;
+    };
+};
+//# sourceMappingURL=Toggle.d.ts.map

package/dist/controls/Toggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.d.ts","sourceRoot":"","sources":["../../src/controls/Toggle.ts"],"names":[],"mappings":"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"}

package/dist/controls/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Control Components
+ */
+export { Button, EnhancedButton, ButtonStyles, defaultButtonTheme, type ButtonProps, type ButtonRole, type ButtonSize, type ButtonState, type ButtonTheme, type ButtonVariant, } from './Button';
+export { Link, LinkUtils, type EnhancedLinkProps, type OpenURLAction, } from './Link';
+export { Toggle, EnhancedToggle, ToggleStyles, ToggleUtils, ToggleWithLabel, type ToggleProps, } from './Toggle';
+export { Picker, EnhancedPicker, PickerStyles, PickerUtils, type PickerOption, type PickerProps, } from './Picker';
+//# sourceMappingURL=index.d.ts.map

package/dist/controls/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/controls/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EACL,MAAM,EACN,cAAc,EACd,YAAY,EACZ,kBAAkB,EAClB,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,UAAU,EACf,KAAK,WAAW,EAChB,KAAK,WAAW,EAChB,KAAK,aAAa,GACnB,MAAM,UAAU,CAAA;AAEjB,OAAO,EACL,IAAI,EACJ,SAAS,EACT,KAAK,iBAAiB,EACtB,KAAK,aAAa,GACnB,MAAM,QAAQ,CAAA;AAEf,OAAO,EACL,MAAM,EACN,cAAc,EACd,YAAY,EACZ,WAAW,EACX,eAAe,EACf,KAAK,WAAW,GACjB,MAAM,UAAU,CAAA;AAEjB,OAAO,EACL,MAAM,EACN,cAAc,EACd,YAAY,EACZ,WAAW,EACX,KAAK,YAAY,EACjB,KAAK,WAAW,GACjB,MAAM,UAAU,CAAA"}

package/dist/controls/index.js

@@ -0,0 +1,18 @@
+import { B as s, a as t, E as l, h as n, c as g, L as i, b as o, P as c, i as T, j as h, T as k, e as r, f as d, g as u, d as B } from "../Picker-DrZ7ibdt.js";
+export {
+  s as Button,
+  t as ButtonStyles,
+  l as EnhancedButton,
+  n as EnhancedPicker,
+  g as EnhancedToggle,
+  i as Link,
+  o as LinkUtils,
+  c as Picker,
+  T as PickerStyles,
+  h as PickerUtils,
+  k as Toggle,
+  r as ToggleStyles,
+  d as ToggleUtils,
+  u as ToggleWithLabel,
+  B as defaultButtonTheme
+};

package/dist/display/HTML.d.ts

@@ -0,0 +1,120 @@
+/**
+ * Simple HTML Element Components
+ *
+ * Basic HTML element wrappers with modifier support for simple use cases.
+ * For enhanced SwiftUI-style components with advanced features,
+ * use the main component exports (Button, Image, Text, etc.).
+ */
+import type { ComponentProps } from '@tachui/core';
+/**
+ * Simple HTML element wrappers with modifier support
+ *
+ * These are basic HTML element wrappers for simple use cases.
+ * For enhanced SwiftUI-style components with advanced features,
+ * use the main component exports (Button, Image, Text, etc.).
+ */
+export declare const HTML: {
+    /**
+     * Create a div element with modifier support
+     */
+    div: (props?: {
+        children?: any;
+    }) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+        modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+    };
+    /**
+     * Create a span element with modifier support
+     */
+    span: (props?: {
+        children?: any;
+    }) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+        modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+    };
+    /**
+     * Create a paragraph element with modifier support
+     */
+    p: (props?: {
+        children?: any;
+    }) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+        modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+    };
+    /**
+     * Create a button element with modifier support
+     *
+     * Note: For enhanced button features (press states, variants, accessibility),
+     * use the main Button component instead.
+     */
+    button: (props?: {
+        children?: any;
+        onClick?: () => void;
+    }) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+        modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+    };
+    /**
+     * Create an input element with modifier support
+     */
+    input: (props?: {
+        type?: string;
+        value?: string;
+        placeholder?: string;
+        onChange?: (value: string) => void;
+    }) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+        modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+    };
+    /**
+     * Create an image element with modifier support
+     *
+     * Note: For enhanced image features (loading states, content modes, progressive loading),
+     * use the main Image component instead.
+     */
+    img: (props: {
+        src: string;
+        alt?: string;
+        width?: number | string;
+        height?: number | string;
+    }) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+        modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+    };
+    /**
+     * Create a heading element with modifier support
+     */
+    heading: (level: 1 | 2 | 3 | 4 | 5 | 6) => (props?: {
+        children?: any;
+    }) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+        modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+    };
+};
+/**
+ * Shorthand for heading elements
+ */
+export declare const H1: (props?: {
+    children?: any;
+}) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+    modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+};
+export declare const H2: (props?: {
+    children?: any;
+}) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+    modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+};
+export declare const H3: (props?: {
+    children?: any;
+}) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+    modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+};
+export declare const H4: (props?: {
+    children?: any;
+}) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+    modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+};
+export declare const H5: (props?: {
+    children?: any;
+}) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+    modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+};
+export declare const H6: (props?: {
+    children?: any;
+}) => import("@tachui/core").ModifiableComponent<ComponentProps> & {
+    modifier: import("@tachui/core").ModifierBuilder<import("@tachui/core").ModifiableComponent<ComponentProps>>;
+};
+//# sourceMappingURL=HTML.d.ts.map

package/dist/display/HTML.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HTML.d.ts","sourceRoot":"","sources":["../../src/display/HTML.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,KAAK,EAAqB,cAAc,EAAE,MAAM,cAAc,CAAA;AA4BrE;;;;;;GAMG;AACH,eAAO,MAAM,IAAI;IACf;;OAEG;kBACU;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAE;;;IAS/B;;OAEG;mBACW;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAE;;;IAShC;;OAEG;gBACQ;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAE;;;IAS7B;;;;;OAKG;qBACa;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;KAAE;;;IAsBxD;;OAEG;oBAEM;QACL,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,WAAW,CAAC,EAAE,MAAM,CAAA;QACpB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;KACnC;;;IAcH;;;;;OAKG;iBACU;QACX,GAAG,EAAE,MAAM,CAAA;QACX,GAAG,CAAC,EAAE,MAAM,CAAA;QACZ,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;QACvB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;KACzB;;;IAUD;;OAEG;qBAEO,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,MAC5B,QAAO;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAO;;;CAQlC,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,EAAE,WAbH;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE;;CAaG,CAAA;AACjC,eAAO,MAAM,EAAE,WAdH;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE;;CAcG,CAAA;AACjC,eAAO,MAAM,EAAE,WAfH;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE;;CAeG,CAAA;AACjC,eAAO,MAAM,EAAE,WAhBH;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE;;CAgBG,CAAA;AACjC,eAAO,MAAM,EAAE,WAjBH;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE;;CAiBG,CAAA;AACjC,eAAO,MAAM,EAAE,WAlBH;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE;;CAkBG,CAAA"}

package/dist/display/Image.d.ts

@@ -0,0 +1,192 @@
+/**
+ * Enhanced Image Component (Phase 5.4)
+ *
+ * SwiftUI-inspired Image component with loading states, error handling,
+ * responsive sizing, and advanced image handling capabilities.
+ */
+import type { ModifiableComponent, ModifierBuilder } from '@tachui/core';
+import type { Signal } from '@tachui/core';
+import type { ComponentInstance, ComponentProps } from '@tachui/core';
+import { ImageAsset } from '@tachui/core';
+import type { Concatenatable, ComponentSegment } from '@tachui/core';
+import { ConcatenatedComponent } from '@tachui/core';
+import { type ElementOverrideProps } from '@tachui/core';
+import { ComponentWithCSSClasses, type CSSClassesProps } from '@tachui/core';
+/**
+ * Image loading state
+ */
+export type ImageLoadingState = 'idle' | 'loading' | 'loaded' | 'error';
+/**
+ * Image content mode (how image fits within bounds)
+ */
+export type ImageContentMode = 'fit' | 'fill' | 'stretch' | 'center' | 'scaleDown';
+/**
+ * Image resize mode for different screen densities
+ */
+export type ImageResizeMode = 'cover' | 'contain' | 'fill' | 'none';
+/**
+ * Image loading strategy
+ */
+export type ImageLoadingStrategy = 'eager' | 'lazy';
+/**
+ * Image component properties with element override support and CSS classes
+ */
+export interface ImageProps extends ComponentProps, ElementOverrideProps, CSSClassesProps {
+    src?: string | Signal<string> | ImageAsset;
+    srcSet?: string | Signal<string>;
+    alt?: string | Signal<string>;
+    width?: number | string | Signal<number | string>;
+    height?: number | string | Signal<number | string>;
+    aspectRatio?: number | Signal<number>;
+    contentMode?: ImageContentMode;
+    resizeMode?: ImageResizeMode;
+    loadingStrategy?: ImageLoadingStrategy;
+    placeholder?: string | ComponentInstance;
+    errorPlaceholder?: string | ComponentInstance;
+    loadingState?: Signal<ImageLoadingState>;
+    onLoadingStateChange?: (state: ImageLoadingState) => void;
+    onLoad?: (event: Event) => void;
+    onError?: (event: Event) => void;
+    onLoadStart?: () => void;
+    crossOrigin?: 'anonymous' | 'use-credentials';
+    decoding?: 'sync' | 'async' | 'auto';
+    fetchPriority?: 'high' | 'low' | 'auto';
+    accessibilityLabel?: string;
+    accessibilityRole?: string;
+    blur?: number | Signal<number>;
+    opacity?: number | Signal<number>;
+    grayscale?: boolean | Signal<boolean>;
+    sepia?: boolean | Signal<boolean>;
+    lowQualitySrc?: string;
+    highQualitySrc?: string;
+}
+/**
+ * Enhanced Image component class with element override support and CSS classes
+ */
+export declare class EnhancedImage extends ComponentWithCSSClasses implements ComponentInstance<ImageProps>, Concatenatable<ImageProps> {
+    props: ImageProps;
+    readonly type: "component";
+    readonly id: string;
+    mounted: boolean;
+    cleanup: (() => void)[];
+    private effectiveTag;
+    private validationResult;
+    private loadingStateSignal;
+    private setLoadingState;
+    /**
+     * Set loading state and notify callback
+     */
+    private setLoadingStateWithCallback;
+    constructor(props: ImageProps);
+    /**
+     * Render the image component with reactive content handling
+     */
+    render(): import("@tachui/core").DOMNode | import("@tachui/core").DOMNode[];
+    /**
+     * Set up ImageAsset reactivity for a real DOM element (called from onDOMReady)
+     */
+    private setupImageAssetReactivityForDOMElement;
+    /**
+     * Concatenate this image with another concatenatable component
+     */
+    concat<U extends Concatenatable<any>>(other: U): ConcatenatedComponent<ImageProps | U>;
+    /**
+     * Convert this image to a segment for concatenation
+     */
+    toSegment(): ComponentSegment;
+    /**
+     * Check if this component supports concatenation
+     */
+    isConcatenatable(): boolean;
+    /**
+     * Determine accessibility role for concatenation
+     */
+    private determineAccessibilityRole;
+    /**
+     * Merge accessibility roles when combining components
+     */
+    private mergeAccessibilityRoles;
+}
+/**
+ * Create enhanced Image component with modifier support and SwiftUI-style shorthands
+ *
+ * @example
+ * ```typescript
+ * // Using aspectRatio modifier
+ * Image('photo.jpg')
+ *   .aspectRatio(16/9, 'fit')
+ *
+ * // Using SwiftUI-style shorthands
+ * Image('photo.jpg')
+ *   .scaledToFit()  // Same as aspectRatio(undefined, 'fit')
+ *
+ * Image('photo.jpg')
+ *   .scaledToFill() // Same as aspectRatio(undefined, 'fill')
+ * ```
+ */
+/**
+ * Extended Image component interface with SwiftUI-style shorthands
+ */
+export interface ImageWithShorthands extends ModifiableComponent<ImageProps> {
+    modifier: ModifierBuilder<ModifiableComponent<ImageProps>>;
+    scaledToFit(): ImageWithShorthands;
+    scaledToFill(): ImageWithShorthands;
+}
+export declare function Image(src: string | Signal<string> | ImageAsset, props?: Omit<ImageProps, 'src'>): ImageWithShorthands;
+/**
+ * Image loading states for external use
+ */
+export declare const ImageStates: {
+    idle: "idle";
+    loading: "loading";
+    loaded: "loaded";
+    error: "error";
+};
+/**
+ * Image content modes for external use
+ */
+export declare const ImageContentModes: {
+    fit: "fit";
+    fill: "fill";
+    stretch: "stretch";
+    center: "center";
+    scaleDown: "scaleDown";
+};
+/**
+ * Image utility functions
+ *
+ * These utilities work seamlessly with the new scaledTo* shorthands:
+ *
+ * @example
+ * ```typescript
+ * // Combine utilities with shorthands
+ * ImageUtils.responsive([...])
+ *   .scaledToFit()
+ *   .frame(200, 200)
+ * ```
+ */
+export declare const ImageUtils: {
+    /**
+     * Create a responsive image with multiple sources
+     */
+    responsive(sources: {
+        src: string;
+        width?: number;
+        media?: string;
+    }[], fallbackSrc: string, props?: Omit<ImageProps, "src" | "srcSet">): ModifiableComponent<ImageProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ImageProps>>;
+    };
+    /**
+     * Create an image with progressive loading
+     */
+    progressive(lowQualitySrc: string, highQualitySrc: string, props?: Omit<ImageProps, "src" | "lowQualitySrc" | "highQualitySrc">): ModifiableComponent<ImageProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ImageProps>>;
+    };
+    /**
+     * Create an image with loading placeholder
+     */
+    withPlaceholder(src: string | Signal<string>, placeholderSrc: string, props?: Omit<ImageProps, "src" | "placeholder">): ModifiableComponent<ImageProps> & {
+        modifier: ModifierBuilder<ModifiableComponent<ImageProps>>;
+    };
+};
+//# sourceMappingURL=Image.d.ts.map

package/dist/display/Image.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../src/display/Image.ts"],"names":[],"mappings":"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"}