react-native-skelo 0.0.1 → 0.0.3

package/lib/typescript/core/registry/SkeletonRegistry.d.ts

@@ -0,0 +1,57 @@
+import type { ComponentType } from 'react';
+import type { SkeletonPlugin } from '../../types';
+/**
+ * Registry for skeleton plugins
+ *
+ * Manages mapping between React components and their skeleton generation strategies
+ */
+export declare class SkeletonRegistry {
+    private plugins;
+    private nameIndex;
+    /**
+     * Register a plugin for a component
+     *
+     * @param plugin - Plugin configuration
+     * @throws Error if plugin is invalid
+     */
+    register<P>(plugin: SkeletonPlugin<P>): void;
+    /**
+     * Unregister a plugin
+     *
+     * @param component - Component to unregister
+     */
+    unregister(component: ComponentType): void;
+    /**
+     * Get plugin for a component
+     *
+     * @param component - Component type
+     * @returns Plugin or undefined
+     */
+    getPlugin(component: ComponentType): SkeletonPlugin | undefined;
+    /**
+     * Get plugin by name
+     *
+     * @param name - Plugin name
+     * @returns Plugin or undefined
+     */
+    getPluginByName(name: string): SkeletonPlugin | undefined;
+    /**
+     * Check if component has a plugin
+     *
+     * @param component - Component type
+     * @returns True if plugin exists
+     */
+    hasPlugin(component: ComponentType): boolean;
+    /**
+     * Get all registered plugins
+     *
+     * @returns Array of all plugins
+     */
+    getAllPlugins(): SkeletonPlugin[];
+    /**
+     * Clear all plugins
+     */
+    clear(): void;
+}
+export declare const registry: SkeletonRegistry;
+//# sourceMappingURL=SkeletonRegistry.d.ts.map

package/lib/typescript/core/registry/SkeletonRegistry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonRegistry.d.ts","sourceRoot":"","sources":["../../../../src/core/registry/SkeletonRegistry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD;;;;GAIG;AACH,qBAAa,gBAAgB;IAC3B,OAAO,CAAC,OAAO,CAAsD;IACrE,OAAO,CAAC,SAAS,CAA0C;IAE3D;;;;;OAKG;IACH,QAAQ,CAAC,CAAC,EAAE,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,GAAG,IAAI;IA8B5C;;;;OAIG;IACH,UAAU,CAAC,SAAS,EAAE,aAAa,GAAG,IAAI;IAQ1C;;;;;OAKG;IACH,SAAS,CAAC,SAAS,EAAE,aAAa,GAAG,cAAc,GAAG,SAAS;IAI/D;;;;;OAKG;IACH,eAAe,CAAC,IAAI,EAAE,MAAM,GAAG,cAAc,GAAG,SAAS;IAIzD;;;;;OAKG;IACH,SAAS,CAAC,SAAS,EAAE,aAAa,GAAG,OAAO;IAI5C;;;;OAIG;IACH,aAAa,IAAI,cAAc,EAAE;IAIjC;;OAEG;IACH,KAAK,IAAI,IAAI;CAId;AAGD,eAAO,MAAM,QAAQ,kBAAyB,CAAC"}

package/lib/typescript/core/registry/index.d.ts

@@ -0,0 +1,2 @@
+export { SkeletonRegistry, registry } from './SkeletonRegistry';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/core/registry/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/registry/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC"}

package/lib/typescript/core/resolver/StyleResolver.d.ts

@@ -0,0 +1,54 @@
+import type { ReactElement } from 'react';
+import type { DimensionValue } from 'react-native';
+import type { ResolvedStyle } from '../../types';
+/**
+ * StyleResolver class for extracting and resolving component styles
+ */
+export declare class StyleResolver {
+    /**
+     * Resolve styles from a React element
+     *
+     * @param element - React element
+     * @returns Resolved style object
+     */
+    static resolve(element: ReactElement): ResolvedStyle;
+    /**
+     * Get dimensions from element props and style
+     *
+     * @param element - React element
+     * @returns Object with width and height
+     */
+    static getDimensions(element: ReactElement): {
+        width?: DimensionValue;
+        height?: DimensionValue;
+    };
+    /**
+     * Check if element has explicit dimensions
+     *
+     * @param element - React element
+     * @returns True if both width and height are defined
+     */
+    static hasExplicitDimensions(element: ReactElement): boolean;
+    /**
+     * Get border radius from style
+     *
+     * @param element - React element
+     * @returns Border radius value or undefined
+     */
+    static getBorderRadius(element: ReactElement): number | undefined;
+    /**
+     * Get font size from style
+     *
+     * @param element - React element
+     * @returns Font size value or undefined
+     */
+    static getFontSize(element: ReactElement): number | undefined;
+    /**
+     * Get line height from style
+     *
+     * @param element - React element
+     * @returns Line height value or undefined
+     */
+    static getLineHeight(element: ReactElement): number | undefined;
+}
+//# sourceMappingURL=StyleResolver.d.ts.map

package/lib/typescript/core/resolver/StyleResolver.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyleResolver.d.ts","sourceRoot":"","sources":["../../../../src/core/resolver/StyleResolver.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAGjD;;GAEG;AACH,qBAAa,aAAa;IACxB;;;;;OAKG;IACH,MAAM,CAAC,OAAO,CAAC,OAAO,EAAE,YAAY,GAAG,aAAa;IAOpD;;;;;OAKG;IACH,MAAM,CAAC,aAAa,CAAC,OAAO,EAAE,YAAY,GAAG;QAC3C,KAAK,CAAC,EAAE,cAAc,CAAC;QACvB,MAAM,CAAC,EAAE,cAAc,CAAC;KACzB;IAKD;;;;;OAKG;IACH,MAAM,CAAC,qBAAqB,CAAC,OAAO,EAAE,YAAY,GAAG,OAAO;IAK5D;;;;;OAKG;IACH,MAAM,CAAC,eAAe,CAAC,OAAO,EAAE,YAAY,GAAG,MAAM,GAAG,SAAS;IAKjE;;;;;OAKG;IACH,MAAM,CAAC,WAAW,CAAC,OAAO,EAAE,YAAY,GAAG,MAAM,GAAG,SAAS;IAK7D;;;;;OAKG;IACH,MAAM,CAAC,aAAa,CAAC,OAAO,EAAE,YAAY,GAAG,MAAM,GAAG,SAAS;CAIhE"}

package/lib/typescript/core/resolver/index.d.ts

@@ -0,0 +1,2 @@
+export { StyleResolver } from './StyleResolver';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/core/resolver/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/resolver/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}

package/lib/typescript/deep.d.ts

@@ -0,0 +1,2 @@
+export declare const deepEnabled = true;
+//# sourceMappingURL=deep.d.ts.map

package/lib/typescript/deep.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"deep.d.ts","sourceRoot":"","sources":["../../src/deep.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,WAAW,OAAO,CAAC"}

package/lib/typescript/index.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Skelo - Automatic skeleton loading for React Native
+ *
+ * Write your UI once. Skelo builds the loading state automatically.
+ *
+ * @packageDocumentation
+ */
+export { Skeleton } from './components/Skeleton';
+export { SkeletonIgnore } from './components/SkeletonIgnore';
+export { withSkeleton } from './components/withSkeleton';
+export type { WithSkeletonOptions } from './components/withSkeleton';
+export { StyleSkeleton } from './core/generator/StyleSkeleton';
+export type { StyleInput } from './core/generator/StyleSkeleton';
+export { Skelo } from './Skelo';
+export type { SkeletonProps, SkeletonConfig, SkeletonPlugin, SkeletonStrategy, SkeletonContext, } from './types';
+export { SkeletonBox, SkeletonText, SkeletonImage, SkeletonCircle } from './components/primitives';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,YAAY,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC/D,YAAY,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAGjE,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAGhC,YAAY,EACV,aAAa,EACb,cAAc,EACd,cAAc,EACd,gBAAgB,EAChB,eAAe,GAChB,MAAM,SAAS,CAAC;AAGjB,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC"}

package/lib/typescript/plugins/ImagePlugin.d.ts

@@ -0,0 +1,11 @@
+import type { SkeletonPlugin } from '../types';
+import type { ImageProps } from 'react-native';
+/**
+ * Built-in plugin for React Native Image component
+ *
+ * Renders Image as:
+ * - SkeletonCircle if circular (avatar-like)
+ * - SkeletonImage otherwise
+ */
+export declare const ImagePlugin: SkeletonPlugin<ImageProps>;
+//# sourceMappingURL=ImagePlugin.d.ts.map

package/lib/typescript/plugins/ImagePlugin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImagePlugin.d.ts","sourceRoot":"","sources":["../../../src/plugins/ImagePlugin.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC/C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C;;;;;;GAMG;AACH,eAAO,MAAM,WAAW,EAAE,cAAc,CAAC,UAAU,CAoDlD,CAAC"}

package/lib/typescript/plugins/TextPlugin.d.ts

@@ -0,0 +1,12 @@
+import type { SkeletonPlugin } from '../types';
+import type { TextProps } from 'react-native';
+/**
+ * Built-in plugin for React Native Text component
+ *
+ * Renders Text as SkeletonText with:
+ * - Estimated line count from text content
+ * - Font size from style
+ * - Line height from style
+ */
+export declare const TextPlugin: SkeletonPlugin<TextProps>;
+//# sourceMappingURL=TextPlugin.d.ts.map

package/lib/typescript/plugins/TextPlugin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextPlugin.d.ts","sourceRoot":"","sources":["../../../src/plugins/TextPlugin.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C;;;;;;;GAOG;AACH,eAAO,MAAM,UAAU,EAAE,cAAc,CAAC,SAAS,CAoChD,CAAC"}

package/lib/typescript/plugins/ViewPlugin.d.ts

@@ -0,0 +1,11 @@
+import type { SkeletonPlugin } from '../types';
+import type { ViewProps } from 'react-native';
+/**
+ * Built-in plugin for React Native View component
+ *
+ * Renders View as:
+ * - SkeletonBox if has explicit width/height
+ * - Container with parsed children otherwise
+ */
+export declare const ViewPlugin: SkeletonPlugin<ViewProps>;
+//# sourceMappingURL=ViewPlugin.d.ts.map

package/lib/typescript/plugins/ViewPlugin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ViewPlugin.d.ts","sourceRoot":"","sources":["../../../src/plugins/ViewPlugin.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C;;;;;;GAMG;AACH,eAAO,MAAM,UAAU,EAAE,cAAc,CAAC,SAAS,CAsDhD,CAAC"}

package/lib/typescript/plugins/index.d.ts

@@ -0,0 +1,4 @@
+export { ViewPlugin } from './ViewPlugin';
+export { TextPlugin } from './TextPlugin';
+export { ImagePlugin } from './ImagePlugin';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/plugins/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}

package/lib/typescript/types/index.d.ts

@@ -0,0 +1,3 @@
+export type { SkeletonProps, SkeletonConfig, ResolvedStyle, ComponentNode } from './skeleton';
+export type { SkeletonPlugin, SkeletonStrategy, SkeletonContext, SkeletonPrimitives, SkeletonUtils, PluginMetadata, BoxProps, TextProps, ImageProps, CircleProps, } from './plugin';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE9F,YAAY,EACV,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,kBAAkB,EAClB,aAAa,EACb,cAAc,EACd,QAAQ,EACR,SAAS,EACT,UAAU,EACV,WAAW,GACZ,MAAM,UAAU,CAAC"}

package/lib/typescript/types/plugin.d.ts

@@ -0,0 +1,144 @@
+import type { ComponentType, ReactElement, ReactNode } from 'react';
+import type { DimensionValue } from 'react-native';
+import type { SkeletonConfig, ResolvedStyle } from './skeleton';
+/**
+ * Plugin for custom component skeleton generation
+ *
+ * @example
+ * ```tsx
+ * const AvatarPlugin: SkeletonPlugin<AvatarProps> = {
+ *   name: 'Avatar',
+ *   component: Avatar,
+ *   strategy: (props, { primitives }) => {
+ *     return <primitives.Circle size={props.size || 40} />;
+ *   },
+ * };
+ * ```
+ */
+export interface SkeletonPlugin<P = any> {
+    /**
+     * Unique identifier for the plugin
+     */
+    name: string;
+    /**
+     * Component type this plugin handles
+     */
+    component: ComponentType<P>;
+    /**
+     * Strategy function to generate skeleton
+     */
+    strategy: SkeletonStrategy<P>;
+    /**
+     * Optional: Plugin version
+     */
+    version?: string;
+    /**
+     * Optional: Plugin metadata
+     */
+    metadata?: PluginMetadata;
+}
+/**
+ * Strategy function signature
+ */
+export type SkeletonStrategy<P = any> = (props: P, context: SkeletonContext) => ReactElement | null;
+/**
+ * Context provided to plugin strategies
+ */
+export interface SkeletonContext {
+    /**
+     * Configuration from parent Skeleton component
+     */
+    config: SkeletonConfig;
+    /**
+     * Theme information (light/dark)
+     */
+    theme: 'light' | 'dark';
+    /**
+     * Recursively parse children
+     */
+    parseChildren: (children: ReactNode) => ReactNode;
+    /**
+     * Access to skeleton primitives
+     */
+    primitives: SkeletonPrimitives;
+    /**
+     * Utility functions
+     */
+    utils: SkeletonUtils;
+}
+/**
+ * Skeleton primitive components
+ */
+export interface SkeletonPrimitives {
+    Box: ComponentType<BoxProps>;
+    Text: ComponentType<TextProps>;
+    Image: ComponentType<ImageProps>;
+    Circle: ComponentType<CircleProps>;
+}
+/**
+ * Utility functions for plugins
+ */
+export interface SkeletonUtils {
+    /**
+     * Flatten and resolve styles
+     */
+    resolveStyle: (style: any) => ResolvedStyle;
+    /**
+     * Extract dimensions from a resolved style
+     */
+    extractDimensions: (style: ResolvedStyle) => {
+        width?: DimensionValue;
+        height?: DimensionValue;
+    };
+    /**
+     * Generate random width for natural look
+     */
+    randomWidth: (min?: number, max?: number) => string;
+}
+/**
+ * Plugin metadata
+ */
+export interface PluginMetadata {
+    author?: string;
+    description?: string;
+    repository?: string;
+    license?: string;
+}
+/**
+ * Animation and color props shared by all skeleton primitives
+ */
+export interface SkeletonAnimationProps {
+    animation?: 'shimmer' | 'pulse' | 'none';
+    baseColor?: string;
+    highlightColor?: string;
+    duration?: number;
+}
+/**
+ * Props for skeleton primitives
+ */
+export interface BoxProps extends SkeletonAnimationProps {
+    width?: DimensionValue;
+    height?: DimensionValue;
+    borderRadius?: number;
+    style?: any;
+    children?: ReactNode;
+}
+export interface TextProps extends SkeletonAnimationProps {
+    lines?: number;
+    fontSize?: number;
+    lineHeight?: number;
+    width?: DimensionValue;
+    lastLineWidth?: DimensionValue;
+    style?: any;
+}
+export interface ImageProps extends SkeletonAnimationProps {
+    width?: DimensionValue;
+    height?: DimensionValue;
+    borderRadius?: number;
+    style?: any;
+}
+export interface CircleProps extends SkeletonAnimationProps {
+    size?: number;
+    style?: any;
+}
+//# sourceMappingURL=plugin.d.ts.map

package/lib/typescript/types/plugin.d.ts.map

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

package/lib/typescript/types/skeleton.d.ts

@@ -0,0 +1,176 @@
+import type { ReactElement, ReactNode } from 'react';
+import type { DimensionValue, FlexAlignType } from 'react-native';
+/**
+ * Props for the main Skeleton component
+ *
+ * @example
+ * ```tsx
+ * <Skeleton loading={true} animation="shimmer">
+ *   <YourComponent />
+ * </Skeleton>
+ * ```
+ */
+export interface SkeletonProps {
+    /**
+     * Whether to show skeleton (true) or actual content (false)
+     */
+    loading: boolean;
+    /**
+     * Animation type
+     * - 'shimmer': Moving gradient animation (default)
+     * - 'pulse': Fade in/out animation
+     * - 'none': Static skeleton
+     *
+     * @default 'shimmer'
+     */
+    animation?: 'shimmer' | 'pulse' | 'none';
+    /**
+     * Animation duration in milliseconds
+     * @default 1200
+     */
+    duration?: number;
+    /**
+     * Base skeleton color
+     * @default Auto-detected based on color scheme (light/dark)
+     */
+    baseColor?: string;
+    /**
+     * Shimmer highlight color
+     * @default Auto-detected based on color scheme (light/dark)
+     */
+    highlightColor?: string;
+    /**
+     * Default border radius for skeleton elements
+     * @default 4
+     */
+    borderRadius?: number;
+    /**
+     * Components to render.
+     *
+     * When `styles` is provided, `children` is optional — the skeleton is derived
+     * from the styles instead of the child tree.
+     */
+    children?: ReactNode;
+    /**
+     * Generate the skeleton directly from a set of styles instead of from the
+     * child element tree. Accepts a `StyleSheet.create` object (values used in
+     * definition order) or an array of styles.
+     *
+     * Because a StyleSheet has no hierarchy, the result is a vertical stack of
+     * skeleton shapes — one per style that has visual dimensions.
+     *
+     * @example
+     * ```tsx
+     * <Skeleton loading={loading} styles={styles} />
+     * ```
+     */
+    styles?: Record<string, unknown> | unknown[];
+    /**
+     * When using `styles`, style keys to skip (e.g. layout containers).
+     */
+    excludeStyles?: string[];
+    /**
+     * Deep mode: expand opaque (custom) child components into their real
+     * host-element tree via offline rendering, producing a structured skeleton
+     * without inlining host elements.
+     *
+     * @experimental Renders the children offline to introspect them, so their
+     * mount effects run during expansion and they render outside your app's
+     * providers (navigation/theme/redux). Best for presentational trees; guard
+     * effectful/context-dependent screens or register a plugin for them. Falls
+     * back to static parsing if offline rendering is unavailable or fails.
+     * Requires `react-reconciler` to be installed.
+     *
+     * @default false
+     */
+    deep?: boolean;
+    /**
+     * Enable accessibility features
+     * @default true
+     */
+    accessible?: boolean;
+    /**
+     * Screen reader label
+     * @default "Loading content"
+     */
+    accessibilityLabel?: string;
+    /**
+     * Debug mode (development only)
+     * Shows component boundaries and names
+     * @default false
+     */
+    debug?: boolean;
+}
+/**
+ * Configuration options for SkeletonProvider
+ */
+export interface SkeletonConfig {
+    /**
+     * Default animation type
+     * @default 'shimmer'
+     */
+    animation?: 'shimmer' | 'pulse' | 'none';
+    /**
+     * Default animation duration in milliseconds
+     * @default 1200
+     */
+    duration?: number;
+    /**
+     * Default base color
+     */
+    baseColor?: string;
+    /**
+     * Default highlight color
+     */
+    highlightColor?: string;
+    /**
+     * Default border radius
+     * @default 4
+     */
+    borderRadius?: number;
+    /**
+     * Enable debug mode globally
+     * @default false
+     */
+    debug?: boolean;
+}
+/**
+ * Resolved style properties extracted from React Native styles
+ */
+export interface ResolvedStyle {
+    width?: DimensionValue;
+    height?: DimensionValue;
+    borderRadius?: number;
+    backgroundColor?: string;
+    fontSize?: number;
+    lineHeight?: number;
+    marginTop?: number;
+    marginBottom?: number;
+    marginLeft?: number;
+    marginRight?: number;
+    paddingTop?: number;
+    paddingBottom?: number;
+    paddingLeft?: number;
+    paddingRight?: number;
+    flexDirection?: 'row' | 'column';
+    alignItems?: FlexAlignType;
+    justifyContent?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
+}
+/**
+ * Parsed component node in the tree
+ */
+export interface ComponentNode {
+    type: string;
+    props: any;
+    style: ResolvedStyle;
+    children: ComponentNode[];
+    /**
+     * The original React element this node was parsed from.
+     *
+     * Retained so the renderer can fall back to rendering-and-measuring the
+     * real element when it is an opaque (non-host) component the parser can't
+     * introspect. Excluded from debug serialization.
+     */
+    element?: ReactElement;
+}
+//# sourceMappingURL=skeleton.d.ts.map

package/lib/typescript/types/skeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../../src/types/skeleton.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAElE;;;;;;;;;GASG;AACH,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IAEjB;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;IAEzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;;;;;;;;;OAYG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,OAAO,EAAE,CAAC;IAE7C;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IAEzB;;;;;;;;;;;;;OAaG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;IAEzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IACjC,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B,cAAc,CAAC,EACb,YAAY,GAAG,UAAU,GAAG,QAAQ,GAAG,eAAe,GAAG,cAAc,GAAG,cAAc,CAAC;CAC5F;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,GAAG,CAAC;IACX,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,aAAa,EAAE,CAAC;IAC1B;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB"}

package/lib/typescript/utils/componentUtils.d.ts

@@ -0,0 +1,40 @@
+import { isValidElement } from 'react';
+import type { ReactElement, ReactNode } from 'react';
+export { isValidElement };
+/**
+ * Get component display name or type name
+ *
+ * @param element - React element
+ * @returns Component name as string
+ */
+export declare function getComponentName(element: ReactElement): string;
+/**
+ * Check if element is a React Fragment
+ *
+ * @param element - React element
+ * @returns True if element is a Fragment
+ */
+export declare function isFragment(element: ReactElement): boolean;
+/**
+ * Flatten children, handling Fragments recursively
+ *
+ * @param children - React children
+ * @returns Flattened array of children
+ */
+export declare function flattenChildren(children: ReactNode): ReactNode[];
+/**
+ * Check if component is a touchable component
+ *
+ * @param element - React element
+ * @returns True if component is touchable
+ */
+export declare function isTouchableComponent(element: ReactElement): boolean;
+/**
+ * Generate random width percentage for natural skeleton look
+ *
+ * @param min - Minimum percentage (0-100)
+ * @param max - Maximum percentage (0-100)
+ * @returns Random percentage as string (e.g., "75%")
+ */
+export declare function randomWidth(min?: number, max?: number): string;
+//# sourceMappingURL=componentUtils.d.ts.map

package/lib/typescript/utils/componentUtils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"componentUtils.d.ts","sourceRoot":"","sources":["../../../src/utils/componentUtils.ts"],"names":[],"mappings":"AAAA,OAAc,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC9C,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAmBrD,OAAO,EAAE,cAAc,EAAE,CAAC;AA2B1B;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,YAAY,GAAG,MAAM,CA6C9D;AAED;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,OAAO,EAAE,YAAY,GAAG,OAAO,CAEzD;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,QAAQ,EAAE,SAAS,GAAG,SAAS,EAAE,CAmBhE;AAED;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,YAAY,GAAG,OAAO,CAUnE;AAED;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,GAAG,GAAE,MAAW,EAAE,GAAG,GAAE,MAAW,GAAG,MAAM,CAGtE"}

package/lib/typescript/utils/index.d.ts

@@ -0,0 +1,3 @@
+export { resolveStyle, extractDimensions, isPercentage, percentageToNumber } from './styleUtils';
+export { getComponentName, isFragment, flattenChildren, isTouchableComponent, randomWidth, } from './componentUtils';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/utils/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAEjG,OAAO,EACL,gBAAgB,EAChB,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,WAAW,GACZ,MAAM,kBAAkB,CAAC"}

package/lib/typescript/utils/styleUtils.d.ts

@@ -0,0 +1,41 @@
+import type { DimensionValue } from 'react-native';
+import type { ResolvedStyle } from '../types';
+/**
+ * Flatten and resolve styles from React Native style prop
+ *
+ * @param style - Style prop (can be object, array, or StyleSheet reference)
+ * @returns Flattened style object
+ */
+export declare function resolveStyle(style: any): ResolvedStyle;
+/**
+ * Extract dimensions from resolved style
+ *
+ * @param style - Resolved style object
+ * @returns Object with width and height (if present)
+ */
+export declare function extractDimensions(style: ResolvedStyle): {
+    width?: DimensionValue;
+    height?: DimensionValue;
+};
+/**
+ * Check if a resolved style declares both an explicit width and height
+ *
+ * @param style - Resolved style object
+ * @returns True if both width and height are defined
+ */
+export declare function hasExplicitSize(style: ResolvedStyle): boolean;
+/**
+ * Check if a value is a percentage string
+ *
+ * @param value - Value to check
+ * @returns True if value is a percentage string
+ */
+export declare function isPercentage(value: any): boolean;
+/**
+ * Convert percentage to number (strips %)
+ *
+ * @param value - Percentage string (e.g., "50%")
+ * @returns Number without % sign
+ */
+export declare function percentageToNumber(value: string): number;
+//# sourceMappingURL=styleUtils.d.ts.map