@xaui/native 0.0.23 → 0.0.24

package/dist/segment-button/index.js

@@ -1,8 +1,8 @@
-import "../chunk-DXXNBF5P.js";
+import "../chunk-CZFDZPAS.js";
 import {
   useBorderRadiusStyles,
   useXUITheme
-} from "../chunk-LTKYHG5V.js";
+} from "../chunk-I4V5Y5GD.js";
 
 // src/components/segment-button/segment-button.tsx
 import React, { useCallback, useMemo as useMemo2, useState } from "react";

package/dist/{components/select/select.type.d.mts → select/index.d.cts}

@@ -1,10 +1,11 @@
-import type { ReactNode } from 'react';
-import type { TextStyle, ViewStyle } from 'react-native';
-import type { Radius, Size, ThemeColor } from '../../types';
-export type SelectVariant = 'outlined' | 'flat' | 'light' | 'faded' | 'underlined';
-export type SelectLabelPlacement = 'inside' | 'outside' | 'outside-left' | 'outside-top';
-export type SelectSelectionMode = 'single' | 'multiple';
-export type SelectProps = {
+import React, { ReactNode } from 'react';
+import { ViewStyle, TextStyle } from 'react-native';
+import { T as ThemeColor, S as Size, R as Radius } from '../index-BOw6tbkc.cjs';
+
+type SelectVariant = 'outlined' | 'flat' | 'light' | 'faded' | 'underlined';
+type SelectLabelPlacement = 'inside' | 'outside' | 'outside-left' | 'outside-top';
+type SelectSelectionMode = 'single' | 'multiple';
+type SelectProps = {
     /**
      * Select items.
      */
@@ -112,7 +113,7 @@ export type SelectProps = {
      */
     textStyle?: TextStyle;
 } & SelectEvents;
-export type SelectEvents = {
+type SelectEvents = {
     /**
      * Fired when the listbox closes.
      */
@@ -130,7 +131,7 @@ export type SelectEvents = {
      */
     onClear?: () => void;
 };
-export type SelectItemProps = {
+type SelectItemProps = {
     /**
      * Label for the item.
      */
@@ -183,4 +184,9 @@ export type SelectItemProps = {
      */
     onSelected?: () => void;
 };
-//# sourceMappingURL=select.type.d.ts.map
+
+declare const Select: React.FC<SelectProps>;
+
+declare const SelectItem: React.FC<SelectItemProps>;
+
+export { Select, SelectItem, type SelectItemProps, type SelectLabelPlacement, type SelectProps, type SelectSelectionMode, type SelectVariant };

package/dist/select/index.d.ts

@@ -1,4 +1,192 @@
-export { Select } from './select';
-export { SelectItem } from './select-item';
-export type { SelectProps, SelectItemProps, SelectVariant, SelectLabelPlacement, SelectSelectionMode, } from './select.type';
-//# sourceMappingURL=index.d.ts.map
+import React, { ReactNode } from 'react';
+import { ViewStyle, TextStyle } from 'react-native';
+import { T as ThemeColor, S as Size, R as Radius } from '../index-BOw6tbkc.js';
+
+type SelectVariant = 'outlined' | 'flat' | 'light' | 'faded' | 'underlined';
+type SelectLabelPlacement = 'inside' | 'outside' | 'outside-left' | 'outside-top';
+type SelectSelectionMode = 'single' | 'multiple';
+type SelectProps = {
+    /**
+     * Select items.
+     */
+    children: ReactNode;
+    /**
+     * Selection mode for the list.
+     * @default 'single'
+     */
+    selectionMode?: SelectSelectionMode;
+    /**
+     * Controlled selected keys.
+     */
+    selectedKeys?: string[];
+    /**
+     * Disabled item keys.
+     */
+    disabledKeys?: string[];
+    /**
+     * Default selected keys (uncontrolled).
+     */
+    defaultSelectedKeys?: string[];
+    /**
+     * Variant of the select trigger.
+     * @default 'flat'
+     */
+    variant?: SelectVariant;
+    /**
+     * Theme color for the select.
+     * @default 'default'
+     */
+    themeColor?: ThemeColor;
+    /**
+     * Size of the select.
+     * @default 'md'
+     */
+    size?: Size;
+    /**
+     * Border radius of the select.
+     * @default 'md'
+     */
+    radius?: Radius;
+    /**
+     * Placeholder for empty value.
+     */
+    placeholder?: string;
+    /**
+     * Label placement.
+     * @default 'outside'
+     */
+    labelPlacement?: SelectLabelPlacement;
+    /**
+     * Label content.
+     */
+    label?: ReactNode;
+    /**
+     * Helper text below the select.
+     */
+    hint?: ReactNode;
+    /**
+     * Error message when invalid.
+     */
+    errorMessage?: ReactNode;
+    /**
+     * Content before the value.
+     */
+    startContent?: ReactNode;
+    /**
+     * Content after the value.
+     */
+    endContent?: ReactNode;
+    /**
+     * Custom selector icon.
+     */
+    selectorIcon?: ReactNode;
+    /**
+     * Max listbox height.
+     * @default 280
+     */
+    maxListboxHeight?: number;
+    /**
+     * Full width select.
+     * @default false
+     */
+    fullWidth?: boolean;
+    /**
+     * Controlled open state.
+     */
+    isOpened?: boolean;
+    /**
+     * Disable the select.
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Mark as invalid.
+     * @default false
+     */
+    isInvalid?: boolean;
+    /**
+     * Style for the trigger container.
+     */
+    style?: ViewStyle;
+    /**
+     * Style for the value text.
+     */
+    textStyle?: TextStyle;
+} & SelectEvents;
+type SelectEvents = {
+    /**
+     * Fired when the listbox closes.
+     */
+    onClose?: () => void;
+    /**
+     * Fired when open state changes.
+     */
+    onOpenChange?: (isOpen: boolean) => void;
+    /**
+     * Fired when selection changes.
+     */
+    onSelectionChange?: (keys: string[]) => void;
+    /**
+     * Fired when the selection is cleared.
+     */
+    onClear?: () => void;
+};
+type SelectItemProps = {
+    /**
+     * Label for the item.
+     */
+    label: ReactNode;
+    /**
+     * Unique value for the item.
+     */
+    value: string;
+    /**
+     * Optional description.
+     */
+    description?: ReactNode;
+    /**
+     * Content before the label.
+     */
+    startContent?: ReactNode;
+    /**
+     * Content after the label.
+     */
+    endContent?: ReactNode;
+    /**
+     * Custom selected icon.
+     */
+    selectedIcon?: ReactNode;
+    /**
+     * Disable the item.
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Select the item.
+     * @default false
+     */
+    isSelected?: boolean;
+    /**
+     * Read-only item.
+     * @default false
+     */
+    isReadOnly?: boolean;
+    /**
+     * Style for the item container.
+     */
+    style?: ViewStyle;
+    /**
+     * Style for the label text.
+     */
+    textStyle?: TextStyle;
+    /**
+     * Callback fired when the item is selected.
+     */
+    onSelected?: () => void;
+};
+
+declare const Select: React.FC<SelectProps>;
+
+declare const SelectItem: React.FC<SelectItemProps>;
+
+export { Select, SelectItem, type SelectItemProps, type SelectLabelPlacement, type SelectProps, type SelectSelectionMode, type SelectVariant };

package/dist/select/index.js

@@ -1,10 +1,6 @@
-import {
-  CheckmarkIcon
-} from "../chunk-GBHQCAKW.js";
-import "../chunk-DXXNBF5P.js";
 import {
   useXUITheme
-} from "../chunk-LTKYHG5V.js";
+} from "../chunk-GHCVNQET.js";
 
 // src/components/select/select.tsx
 import React3, { useCallback as useCallback2, useMemo as useMemo2 } from "react";
@@ -717,9 +713,25 @@ var Select = ({
 };
 
 // src/components/select/select-item.tsx
-import React4, { useContext } from "react";
+import React5, { useContext } from "react";
 import { Pressable as Pressable3, Text as Text3, View as View3 } from "react-native";
 
+// src/components/select/checkmark-icon.tsx
+import React4 from "react";
+import Svg2, { Polyline } from "react-native-svg";
+function CheckmarkIcon({ color, size }) {
+  return /* @__PURE__ */ React4.createElement(Svg2, { width: size, height: size, viewBox: "0 0 17 18", fill: "none" }, /* @__PURE__ */ React4.createElement(
+    Polyline,
+    {
+      points: "1 9 7 14 15 4",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ));
+}
+
 // src/components/select/select-item.hook.ts
 import { useMemo as useMemo3 } from "react";
 import { getSafeThemeColor as getSafeThemeColor2 } from "@xaui/core";
@@ -839,7 +851,7 @@ var SelectItem = ({
     }
     onSelected?.();
   };
-  return /* @__PURE__ */ React4.createElement(
+  return /* @__PURE__ */ React5.createElement(
     Pressable3,
     {
       onPress: handlePress,
@@ -856,7 +868,7 @@ var SelectItem = ({
       ]
     },
     startContent,
-    /* @__PURE__ */ React4.createElement(View3, { style: styles2.content }, /* @__PURE__ */ React4.createElement(
+    /* @__PURE__ */ React5.createElement(View3, { style: styles2.content }, /* @__PURE__ */ React5.createElement(
       Text3,
       {
         style: [
@@ -866,7 +878,7 @@ var SelectItem = ({
         ]
       },
       label
-    ), description && /* @__PURE__ */ React4.createElement(
+    ), description && /* @__PURE__ */ React5.createElement(
       Text3,
       {
         style: [
@@ -876,7 +888,7 @@ var SelectItem = ({
       },
       description
     )),
-    isSelected && (selectedIcon || /* @__PURE__ */ React4.createElement(CheckmarkIcon, { color: checkmarkColor, size: 16 })),
+    isSelected && (selectedIcon || /* @__PURE__ */ React5.createElement(CheckmarkIcon, { color: checkmarkColor, size: 16 })),
     endContent
   );
 };

package/dist/{components/skeleton/skeleton.type.d.mts → skeleton/index.d.cts}

@@ -1,7 +1,8 @@
-import { ReactNode } from 'react';
-import type { ColorValue, DimensionValue, StyleProp, ViewStyle } from 'react-native';
-import type { Radius } from '../../types';
-export type SkeletonProps = {
+import React, { ReactNode } from 'react';
+import { ColorValue, DimensionValue, StyleProp, ViewStyle } from 'react-native';
+import { R as Radius } from '../index-BOw6tbkc.cjs';
+
+type SkeletonProps = {
     /**
      * The content to display when loading completes.
      */
@@ -38,4 +39,7 @@ export type SkeletonProps = {
      */
     style?: StyleProp<ViewStyle>;
 };
-//# sourceMappingURL=skeleton.type.d.ts.map
+
+declare const Skeleton: React.FC<SkeletonProps>;
+
+export { Skeleton, type SkeletonProps };

package/dist/skeleton/index.d.ts

@@ -1,3 +1,45 @@
-export { Skeleton } from './skeleton';
-export type { SkeletonProps } from './skeleton.type';
-//# sourceMappingURL=index.d.ts.map
+import React, { ReactNode } from 'react';
+import { ColorValue, DimensionValue, StyleProp, ViewStyle } from 'react-native';
+import { R as Radius } from '../index-BOw6tbkc.js';
+
+type SkeletonProps = {
+    /**
+     * The content to display when loading completes.
+     */
+    children: ReactNode;
+    /**
+     * Whether the content is loaded.
+     * @default false
+     */
+    isLoaded: boolean;
+    /**
+     * Whether to disable the animation.
+     * @default false
+     */
+    disableAnimation?: boolean;
+    /**
+     * Custom background color for the skeleton.
+     */
+    skeletonColor?: ColorValue;
+    /**
+     * Width of the skeleton.
+     */
+    width?: DimensionValue;
+    /**
+     * Height of the skeleton.
+     */
+    height?: DimensionValue;
+    /**
+     * Border radius of the skeleton.
+     * @default 'md'
+     */
+    radius?: Radius;
+    /**
+     * Custom style for the skeleton container.
+     */
+    style?: StyleProp<ViewStyle>;
+};
+
+declare const Skeleton: React.FC<SkeletonProps>;
+
+export { Skeleton, type SkeletonProps };

package/dist/skeleton/index.js

@@ -1,7 +1,7 @@
-import "../chunk-DXXNBF5P.js";
+import "../chunk-CZFDZPAS.js";
 import {
   useXUITheme
-} from "../chunk-LTKYHG5V.js";
+} from "../chunk-I4V5Y5GD.js";
 
 // src/components/skeleton/skeleton.tsx
 import React, { useEffect, useMemo, useRef } from "react";

package/dist/{components/slider/slider.type.d.mts → slider/index.d.cts}

@@ -1,8 +1,9 @@
-import type { ReactNode } from 'react';
-import type { TextStyle, ViewStyle } from 'react-native';
-import type { Radius, Size, ThemeColor } from '../../types';
-export type SliderOrientation = 'horizontal' | 'vertical';
-export type SliderMark = {
+import React, { ReactNode } from 'react';
+import { ViewStyle, TextStyle } from 'react-native';
+import { S as Size, T as ThemeColor, R as Radius } from '../index-BOw6tbkc.cjs';
+
+type SliderOrientation = 'horizontal' | 'vertical';
+type SliderMark = {
     /**
      * Value where the mark should be displayed.
      */
@@ -62,7 +63,7 @@ type SliderCustomAppearance = {
      */
     markLabel?: TextStyle;
 };
-export type SliderProps = {
+type SliderProps = {
     /**
      * Controlled slider value.
      */
@@ -164,5 +165,7 @@ export type SliderProps = {
      */
     customAppearance?: SliderCustomAppearance;
 };
-export {};
-//# sourceMappingURL=slider.type.d.ts.map
+
+declare const Slider: React.FC<SliderProps>;
+
+export { Slider, type SliderMark, type SliderOrientation, type SliderProps };

package/dist/slider/index.d.ts

@@ -1,3 +1,171 @@
-export { Slider } from './slider';
-export type { SliderProps, SliderOrientation, SliderMark } from './slider.type';
-//# sourceMappingURL=index.d.ts.map
+import React, { ReactNode } from 'react';
+import { ViewStyle, TextStyle } from 'react-native';
+import { S as Size, T as ThemeColor, R as Radius } from '../index-BOw6tbkc.js';
+
+type SliderOrientation = 'horizontal' | 'vertical';
+type SliderMark = {
+    /**
+     * Value where the mark should be displayed.
+     */
+    value: number;
+    /**
+     * Optional label for the mark.
+     */
+    label?: ReactNode;
+};
+type SliderCustomAppearance = {
+    /**
+     * Custom style for the root container.
+     */
+    container?: ViewStyle;
+    /**
+     * Custom style for the label row.
+     */
+    header?: ViewStyle;
+    /**
+     * Custom style for the label text.
+     */
+    label?: TextStyle;
+    /**
+     * Custom style for the value text.
+     */
+    value?: TextStyle;
+    /**
+     * Custom style for track container.
+     */
+    trackContainer?: ViewStyle;
+    /**
+     * Custom style for track background.
+     */
+    track?: ViewStyle;
+    /**
+     * Custom style for filled track.
+     */
+    fill?: ViewStyle;
+    /**
+     * Custom style for thumb.
+     */
+    thumb?: ViewStyle;
+    /**
+     * Custom style for step dots.
+     */
+    step?: ViewStyle;
+    /**
+     * Custom style for active step dots.
+     */
+    activeStep?: ViewStyle;
+    /**
+     * Custom style for mark container.
+     */
+    mark?: ViewStyle;
+    /**
+     * Custom style for mark label.
+     */
+    markLabel?: TextStyle;
+};
+type SliderProps = {
+    /**
+     * Controlled slider value.
+     */
+    value?: number;
+    /**
+     * Default value in uncontrolled mode.
+     */
+    defaultValue?: number;
+    /**
+     * Minimum allowed value.
+     * @default 0
+     */
+    minValue?: number;
+    /**
+     * Maximum allowed value.
+     * @default 100
+     */
+    maxValue?: number;
+    /**
+     * Value step increment.
+     * @default 1
+     */
+    step?: number;
+    /**
+     * Slider label.
+     */
+    label?: ReactNode;
+    /**
+     * Whether to show the numeric value text.
+     * @default false
+     */
+    showValueLabel?: boolean;
+    /**
+     * Number formatting options for value label.
+     */
+    formatOptions?: Intl.NumberFormatOptions;
+    /**
+     * Optional static marks.
+     */
+    marks?: SliderMark[];
+    /**
+     * Show one step dot per step.
+     * @default false
+     */
+    showSteps?: boolean;
+    /**
+     * Slider orientation.
+     * @default 'horizontal'
+     */
+    orientation?: SliderOrientation;
+    /**
+     * Size of track and thumb.
+     * @default 'md'
+     */
+    size?: Size;
+    /**
+     * Theme color for fill/thumb.
+     * @default 'primary'
+     */
+    color?: ThemeColor;
+    /**
+     * Border radius for track.
+     * @default 'full'
+     */
+    radius?: Radius;
+    /**
+     * Optional content before track.
+     */
+    startContent?: ReactNode;
+    /**
+     * Optional content after track.
+     */
+    endContent?: ReactNode;
+    /**
+     * Whether interactions are disabled.
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Whether value is read-only.
+     * @default false
+     */
+    isReadOnly?: boolean;
+    /**
+     * Optional track length in pixels.
+     * When omitted, the slider uses available layout size.
+     */
+    trackLength?: number;
+    /**
+     * Callback fired on value changes.
+     */
+    onChange?: (value: number) => void;
+    /**
+     * Callback fired when interaction ends.
+     */
+    onChangeEnd?: (value: number) => void;
+    /**
+     * Custom style overrides.
+     */
+    customAppearance?: SliderCustomAppearance;
+};
+
+declare const Slider: React.FC<SliderProps>;
+
+export { Slider, type SliderMark, type SliderOrientation, type SliderProps };

package/dist/slider/index.js

@@ -1,8 +1,7 @@
-import "../chunk-DXXNBF5P.js";
 import {
   useBorderRadiusStyles,
   useXUITheme
-} from "../chunk-LTKYHG5V.js";
+} from "../chunk-4KSZLONZ.js";
 
 // src/components/slider/slider.tsx
 import React, { useCallback, useEffect, useMemo as useMemo2, useRef, useState } from "react";

package/dist/stepper/index.cjs

@@ -392,7 +392,15 @@ var StepperItem = ({
       );
     }
     return String(indicatorState.index + 1);
-  }, [indicator, indicatorState, sizeStyles.indicatorSize, isLocked, isCompleted, itemKey, colors2]);
+  }, [
+    indicator,
+    indicatorState,
+    sizeStyles.indicatorSize,
+    isLocked,
+    isCompleted,
+    itemKey,
+    colors2
+  ]);
   (0, import_react9.useEffect)(() => {
     import_react_native6.Animated.timing(lineProgress, {
       toValue: lineTargetProgress,