@xaui/native 0.0.21 → 0.0.24

package/dist/timepicker/index.d.cts

@@ -0,0 +1,215 @@
+import React, { ReactNode } from 'react';
+import { StyleProp, ViewStyle, TextStyle } from 'react-native';
+import { T as ThemeColor } from '../index-BOw6tbkc.cjs';
+
+type TimeValue = {
+    /**
+     * Hours value (0-23 for 24-hour format, 1-12 for 12-hour format)
+     */
+    hours: number;
+    /**
+     * Minutes value (0-59)
+     */
+    minutes: number;
+};
+type TimePickerMode = 'hour' | 'minute';
+type TimePeriod = 'AM' | 'PM';
+type TimePickerProps = {
+    /**
+     * Current time value
+     */
+    value?: TimeValue;
+    /**
+     * Callback fired when time changes
+     */
+    onChange?: (time: TimeValue) => void;
+    /**
+     * Use 24-hour format. When false, shows AM/PM selector
+     * @default false
+     */
+    is24Hour?: boolean;
+    /**
+     * Theme color for selected elements
+     * @default 'primary'
+     */
+    themeColor?: ThemeColor;
+    /**
+     * Custom container style
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Minimum selectable time
+     */
+    minTime?: TimeValue;
+    /**
+     * Maximum selectable time
+     */
+    maxTime?: TimeValue;
+};
+type TimePickerDialogProps = {
+    /**
+     * Whether the dialog is open
+     */
+    isOpen: boolean;
+    /**
+     * Callback fired when dialog should close
+     */
+    onClose: () => void;
+    /**
+     * Current time value
+     */
+    value?: TimeValue;
+    /**
+     * Callback fired when time changes during selection
+     */
+    onChange?: (time: TimeValue) => void;
+    /**
+     * Use 24-hour format. When false, shows AM/PM selector
+     * @default false
+     */
+    is24Hour?: boolean;
+    /**
+     * Theme color for selected elements
+     * @default 'primary'
+     */
+    themeColor?: ThemeColor;
+    /**
+     * Dialog title
+     * @default 'Select time'
+     */
+    title?: ReactNode;
+    /**
+     * Confirm button text
+     * @default 'OK'
+     */
+    confirmText?: string;
+    /**
+     * Cancel button text
+     * @default 'Cancel'
+     */
+    cancelText?: string;
+    /**
+     * Callback fired when confirm button is pressed
+     */
+    onConfirm?: (time: TimeValue) => void;
+    /**
+     * Callback fired when cancel button is pressed
+     */
+    onCancel?: () => void;
+};
+type TimePickerTriggerProps = {
+    /**
+     * Current time value shown in trigger.
+     */
+    value?: TimeValue;
+    /**
+     * Placeholder shown when no value is selected.
+     * @default 'Select time'
+     */
+    placeholder?: string;
+    /**
+     * Use 24-hour format for display.
+     * @default false
+     */
+    is24Hour?: boolean;
+    /**
+     * Theme color for visual accents.
+     * @default 'primary'
+     */
+    themeColor?: ThemeColor;
+    /**
+     * Disable interaction.
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Read-only state that blocks opening.
+     * @default false
+     */
+    isReadOnly?: boolean;
+    /**
+     * Show clear button when value exists.
+     * @default true
+     */
+    isClearable?: boolean;
+    /**
+     * Optional custom right icon.
+     */
+    icon?: ReactNode;
+    /**
+     * Custom trigger container style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Custom trigger text style.
+     */
+    textStyle?: StyleProp<TextStyle>;
+    /**
+     * Press handler used to open dialog.
+     */
+    onPress: () => void;
+    /**
+     * Clear handler used when clear button is pressed.
+     */
+    onClear?: () => void;
+};
+
+declare const TimePicker: React.FC<TimePickerProps>;
+
+declare const TimePickerDialog: React.FC<TimePickerDialogProps>;
+
+declare const TimePickerTrigger: React.FC<TimePickerTriggerProps>;
+
+/**
+ * Convert 24-hour time to 12-hour format with period
+ */
+declare const to12HourFormat: (hours: number) => {
+    hours: number;
+    period: TimePeriod;
+};
+/**
+ * Convert 12-hour time with period to 24-hour format
+ */
+declare const to24HourFormat: (hours: number, period: TimePeriod) => number;
+/**
+ * Format time value to display string
+ */
+declare const formatTimeValue: (time: TimeValue, is24Hour: boolean) => string;
+/**
+ * Calculate angle for hour hand on clock face
+ */
+declare const getHourAngle: (hour: number, is24Hour: boolean) => number;
+/**
+ * Calculate angle for minute hand on clock face
+ */
+declare const getMinuteAngle: (minute: number) => number;
+/**
+ * Convert angle to hour value
+ */
+declare const angleToHour: (angle: number, _is24Hour: boolean) => number;
+/**
+ * Convert angle to minute value
+ */
+declare const angleToMinute: (angle: number) => number;
+/**
+ * Calculate angle from touch position on clock face
+ */
+declare const calculateAngleFromPosition: (centerX: number, centerY: number, touchX: number, touchY: number) => number;
+/**
+ * Validate if time is within min/max range
+ */
+declare const isTimeInRange: (time: TimeValue, minTime?: TimeValue, maxTime?: TimeValue) => boolean;
+/**
+ * Get current time as TimeValue
+ */
+declare const getCurrentTime: () => TimeValue;
+/**
+ * Clamp hour value to valid range
+ */
+declare const clampHour: (hour: number, is24Hour: boolean) => number;
+/**
+ * Clamp minute value to valid range
+ */
+declare const clampMinute: (minute: number) => number;
+
+export { type TimePeriod, TimePicker, TimePickerDialog, type TimePickerDialogProps, type TimePickerMode, type TimePickerProps, TimePickerTrigger, type TimePickerTriggerProps, type TimeValue, angleToHour, angleToMinute, calculateAngleFromPosition, clampHour, clampMinute, formatTimeValue, getCurrentTime, getHourAngle, getMinuteAngle, isTimeInRange, to12HourFormat, to24HourFormat };

package/dist/timepicker/index.d.ts

@@ -0,0 +1,215 @@
+import React, { ReactNode } from 'react';
+import { StyleProp, ViewStyle, TextStyle } from 'react-native';
+import { T as ThemeColor } from '../index-BOw6tbkc.js';
+
+type TimeValue = {
+    /**
+     * Hours value (0-23 for 24-hour format, 1-12 for 12-hour format)
+     */
+    hours: number;
+    /**
+     * Minutes value (0-59)
+     */
+    minutes: number;
+};
+type TimePickerMode = 'hour' | 'minute';
+type TimePeriod = 'AM' | 'PM';
+type TimePickerProps = {
+    /**
+     * Current time value
+     */
+    value?: TimeValue;
+    /**
+     * Callback fired when time changes
+     */
+    onChange?: (time: TimeValue) => void;
+    /**
+     * Use 24-hour format. When false, shows AM/PM selector
+     * @default false
+     */
+    is24Hour?: boolean;
+    /**
+     * Theme color for selected elements
+     * @default 'primary'
+     */
+    themeColor?: ThemeColor;
+    /**
+     * Custom container style
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Minimum selectable time
+     */
+    minTime?: TimeValue;
+    /**
+     * Maximum selectable time
+     */
+    maxTime?: TimeValue;
+};
+type TimePickerDialogProps = {
+    /**
+     * Whether the dialog is open
+     */
+    isOpen: boolean;
+    /**
+     * Callback fired when dialog should close
+     */
+    onClose: () => void;
+    /**
+     * Current time value
+     */
+    value?: TimeValue;
+    /**
+     * Callback fired when time changes during selection
+     */
+    onChange?: (time: TimeValue) => void;
+    /**
+     * Use 24-hour format. When false, shows AM/PM selector
+     * @default false
+     */
+    is24Hour?: boolean;
+    /**
+     * Theme color for selected elements
+     * @default 'primary'
+     */
+    themeColor?: ThemeColor;
+    /**
+     * Dialog title
+     * @default 'Select time'
+     */
+    title?: ReactNode;
+    /**
+     * Confirm button text
+     * @default 'OK'
+     */
+    confirmText?: string;
+    /**
+     * Cancel button text
+     * @default 'Cancel'
+     */
+    cancelText?: string;
+    /**
+     * Callback fired when confirm button is pressed
+     */
+    onConfirm?: (time: TimeValue) => void;
+    /**
+     * Callback fired when cancel button is pressed
+     */
+    onCancel?: () => void;
+};
+type TimePickerTriggerProps = {
+    /**
+     * Current time value shown in trigger.
+     */
+    value?: TimeValue;
+    /**
+     * Placeholder shown when no value is selected.
+     * @default 'Select time'
+     */
+    placeholder?: string;
+    /**
+     * Use 24-hour format for display.
+     * @default false
+     */
+    is24Hour?: boolean;
+    /**
+     * Theme color for visual accents.
+     * @default 'primary'
+     */
+    themeColor?: ThemeColor;
+    /**
+     * Disable interaction.
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Read-only state that blocks opening.
+     * @default false
+     */
+    isReadOnly?: boolean;
+    /**
+     * Show clear button when value exists.
+     * @default true
+     */
+    isClearable?: boolean;
+    /**
+     * Optional custom right icon.
+     */
+    icon?: ReactNode;
+    /**
+     * Custom trigger container style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Custom trigger text style.
+     */
+    textStyle?: StyleProp<TextStyle>;
+    /**
+     * Press handler used to open dialog.
+     */
+    onPress: () => void;
+    /**
+     * Clear handler used when clear button is pressed.
+     */
+    onClear?: () => void;
+};
+
+declare const TimePicker: React.FC<TimePickerProps>;
+
+declare const TimePickerDialog: React.FC<TimePickerDialogProps>;
+
+declare const TimePickerTrigger: React.FC<TimePickerTriggerProps>;
+
+/**
+ * Convert 24-hour time to 12-hour format with period
+ */
+declare const to12HourFormat: (hours: number) => {
+    hours: number;
+    period: TimePeriod;
+};
+/**
+ * Convert 12-hour time with period to 24-hour format
+ */
+declare const to24HourFormat: (hours: number, period: TimePeriod) => number;
+/**
+ * Format time value to display string
+ */
+declare const formatTimeValue: (time: TimeValue, is24Hour: boolean) => string;
+/**
+ * Calculate angle for hour hand on clock face
+ */
+declare const getHourAngle: (hour: number, is24Hour: boolean) => number;
+/**
+ * Calculate angle for minute hand on clock face
+ */
+declare const getMinuteAngle: (minute: number) => number;
+/**
+ * Convert angle to hour value
+ */
+declare const angleToHour: (angle: number, _is24Hour: boolean) => number;
+/**
+ * Convert angle to minute value
+ */
+declare const angleToMinute: (angle: number) => number;
+/**
+ * Calculate angle from touch position on clock face
+ */
+declare const calculateAngleFromPosition: (centerX: number, centerY: number, touchX: number, touchY: number) => number;
+/**
+ * Validate if time is within min/max range
+ */
+declare const isTimeInRange: (time: TimeValue, minTime?: TimeValue, maxTime?: TimeValue) => boolean;
+/**
+ * Get current time as TimeValue
+ */
+declare const getCurrentTime: () => TimeValue;
+/**
+ * Clamp hour value to valid range
+ */
+declare const clampHour: (hour: number, is24Hour: boolean) => number;
+/**
+ * Clamp minute value to valid range
+ */
+declare const clampMinute: (minute: number) => number;
+
+export { type TimePeriod, TimePicker, TimePickerDialog, type TimePickerDialogProps, type TimePickerMode, type TimePickerProps, TimePickerTrigger, type TimePickerTriggerProps, type TimeValue, angleToHour, angleToMinute, calculateAngleFromPosition, clampHour, clampMinute, formatTimeValue, getCurrentTime, getHourAngle, getMinuteAngle, isTimeInRange, to12HourFormat, to24HourFormat };