@12min/ds 1.0.0 → 3.0.0

package/dist/index.native.d.mts

@@ -1,6 +1,6 @@
-export { Colors, Typography, colors, typography } from './tokens/index.mjs';
-import { T as Theme } from './darkTheme-gaad4-zD.mjs';
-export { d as darkTheme, l as lightTheme } from './darkTheme-gaad4-zD.mjs';
+export { BorderWidth, Colors, Grid, Opacity, Radius, Shadow, Spacing, Typography, borderWidth, colors, grid, opacity, radius, shadow, spacing, typography } from './tokens/index.mjs';
+import { T as Theme, C as ChipSize, a as CheckboxSize } from './Checkbox.styles-DPyXzxFJ.mjs';
+export { d as darkTheme, l as lightTheme } from './Checkbox.styles-DPyXzxFJ.mjs';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { PressableProps, StyleProp, ViewStyle } from 'react-native';
 
@@ -25,21 +25,53 @@ type ButtonProps = {
 };
 declare function Button({ variant, size, disabled, children, onPress }: ButtonProps): react_jsx_runtime.JSX.Element;
 
+type ButtonIconVariant = 'primary' | 'secondary' | 'ghost' | 'overlay';
+type ButtonIconSize = 'sm' | 'md' | 'lg';
+type ButtonIconProps = {
+    icon: React.ReactNode;
+    accessibilityLabel: string;
+    variant?: ButtonIconVariant;
+    size?: ButtonIconSize;
+    disabled?: boolean;
+    onPress?: PressableProps['onPress'];
+};
+declare function ButtonIcon({ icon, accessibilityLabel, variant, size, disabled, onPress }: ButtonIconProps): react_jsx_runtime.JSX.Element;
+
+type DismissButtonVariant = 'subtle' | 'ghost';
+type DismissButtonSize = 'xs' | 'sm' | 'md';
+type DismissButtonProps = {
+    accessibilityLabel?: string;
+    variant?: DismissButtonVariant;
+    size?: DismissButtonSize;
+    disabled?: boolean;
+    onPress?: PressableProps['onPress'];
+};
+declare function DismissButton({ accessibilityLabel, variant, size, disabled, onPress }: DismissButtonProps): react_jsx_runtime.JSX.Element;
+
 type ChipProps = {
     children: React.ReactNode;
     checked?: boolean;
+    disabled?: boolean;
+    size?: ChipSize;
+    leading?: React.ReactNode;
+    trailing?: React.ReactNode;
     onPress?: () => void;
     style?: StyleProp<ViewStyle>;
 };
-declare function Chip({ children, checked, onPress, style }: ChipProps): react_jsx_runtime.JSX.Element;
+declare function Chip({ children, checked, disabled, size, leading, trailing, onPress, style }: ChipProps): react_jsx_runtime.JSX.Element;
 
-type AlertVariant = 'success' | 'info';
+type AlertVariant = 'success' | 'info' | 'warning' | 'error';
+type AlertSize = 'default' | 'compact';
+type AlertLayout = 'stacked' | 'inline';
 type AlertProps = {
     variant?: AlertVariant;
-    title: string;
+    size?: AlertSize;
+    layout?: AlertLayout;
+    title?: string;
     description?: string;
+    onDismiss?: () => void;
 };
-declare function Alert({ variant, title, description }: AlertProps): react_jsx_runtime.JSX.Element;
+declare function Alert({ variant, size, layout, title, description, onDismiss }: AlertProps): react_jsx_runtime.JSX.Element;
 
 type ProgressBarProps = {
     value: number;
@@ -52,29 +84,48 @@ type InputProps = {
     placeholder?: string;
     state?: InputState;
     leadingIcon?: React.ReactNode;
+    trailingIcon?: React.ReactNode;
     onChangeText?: (text: string) => void;
     onFocus?: () => void;
     onBlur?: () => void;
     style?: StyleProp<ViewStyle>;
 };
-declare function Input({ value, placeholder, state, leadingIcon, onChangeText, onFocus, onBlur, style }: InputProps): react_jsx_runtime.JSX.Element;
+declare function Input({ value, placeholder, state, leadingIcon, trailingIcon, onChangeText, onFocus, onBlur, style }: InputProps): react_jsx_runtime.JSX.Element;
+
+type InputFieldProps = {
+    label?: string;
+    required?: boolean;
+    helperText?: string;
+    error?: boolean;
+    value?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    leadingIcon?: React.ReactNode;
+    trailingIcon?: React.ReactNode;
+    onChangeText?: (text: string) => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+};
+declare function InputField({ label, required, helperText, error, value, placeholder, disabled, leadingIcon, trailingIcon, onChangeText, onFocus, onBlur, }: InputFieldProps): react_jsx_runtime.JSX.Element;
 
 type CheckboxProps = {
     checked?: boolean;
     onChange?: (checked: boolean) => void;
     disabled?: boolean;
+    size?: CheckboxSize;
 };
-declare function Checkbox({ checked, onChange, disabled }: CheckboxProps): react_jsx_runtime.JSX.Element;
+declare function Checkbox({ checked, onChange, disabled, size }: CheckboxProps): react_jsx_runtime.JSX.Element;
 
-type RadioItemProps = {
-    label: string;
-    description?: string;
-    selected?: boolean;
-    icon?: React.ReactNode;
-    onPress?: () => void;
-    style?: StyleProp<ViewStyle>;
+type ToggleSwitchSize = 'xs' | 'sm' | 'md';
+type ToggleSwitchProps = {
+    value?: boolean;
+    onChange?: (value: boolean) => void;
+    disabled?: boolean;
+    size?: ToggleSwitchSize;
+    accessibilityLabel: string;
+    onPress?: PressableProps['onPress'];
 };
-declare function RadioItem({ label, description, selected, icon, onPress, style }: RadioItemProps): react_jsx_runtime.JSX.Element;
+declare function ToggleSwitch({ value, onChange, disabled, size, accessibilityLabel }: ToggleSwitchProps): react_jsx_runtime.JSX.Element;
 
 type RadioGroupProps = {
     children: React.ReactNode;
@@ -83,25 +134,39 @@ type RadioGroupProps = {
 };
 declare function RadioGroup({ children, label, style }: RadioGroupProps): react_jsx_runtime.JSX.Element;
 
-type ActionItemProps = {
+type ChoiceCardType = 'radio' | 'checkbox' | 'action';
+type ChoiceCardProps = {
+    type?: ChoiceCardType;
     label: string;
     description?: string;
     selected?: boolean;
-    icon?: React.ReactNode;
+    disabled?: boolean;
+    leading?: React.ReactNode;
+    showTrailing?: boolean;
     onPress?: () => void;
-    style?: StyleProp<ViewStyle>;
 };
-declare function ActionItem({ label, description, selected, icon, onPress, style }: ActionItemProps): react_jsx_runtime.JSX.Element;
+declare function ChoiceCard({ type, label, description, selected, disabled, leading, showTrailing, onPress }: ChoiceCardProps): react_jsx_runtime.JSX.Element;
 
-type Step = {
+type ListItemTrailing = 'none' | 'radio' | 'checkbox' | 'action' | 'switch';
+type ListItemProps = {
+    trailing?: ListItemTrailing;
     label: string;
+    description?: string;
+    selected?: boolean;
+    disabled?: boolean;
+    leading?: React.ReactNode;
+    switchValue?: boolean;
+    onSwitchChange?: (value: boolean) => void;
+    onPress?: () => void;
 };
+declare function ListItem({ trailing, label, description, selected, disabled, leading, switchValue, onSwitchChange, onPress }: ListItemProps): react_jsx_runtime.JSX.Element;
+
 type StepperProps = {
-    steps: Step[];
+    totalSteps: number;
     currentStep: number;
     style?: StyleProp<ViewStyle>;
 };
-declare function Stepper({ steps, currentStep, style }: StepperProps): react_jsx_runtime.JSX.Element;
+declare function Stepper({ totalSteps, currentStep, style }: StepperProps): react_jsx_runtime.JSX.Element;
 
 type RatingScaleOption = {
     emoji: string;
@@ -111,8 +176,9 @@ type RatingScaleProps = {
     value?: number | null;
     onChange?: (value: number) => void;
     options?: ReadonlyArray<RatingScaleOption>;
+    disabled?: boolean;
     style?: StyleProp<ViewStyle>;
 };
-declare function RatingScale({ value, onChange, options, style }: RatingScaleProps): react_jsx_runtime.JSX.Element;
+declare function RatingScale({ value, onChange, options, disabled, style }: RatingScaleProps): react_jsx_runtime.JSX.Element;
 
-export { ActionItem, Alert, Button, Checkbox, Chip, DSThemeProvider, Input, ProgressBar, RadioGroup, RadioItem, RatingScale, Stepper, Theme, useTheme };
+export { Alert, Button, ButtonIcon, Checkbox, Chip, ChoiceCard, DSThemeProvider, DismissButton, Input, InputField, ListItem, ProgressBar, RadioGroup, RatingScale, Stepper, Theme, ToggleSwitch, useTheme };

package/dist/index.native.d.ts

@@ -1,6 +1,6 @@
-export { Colors, Typography, colors, typography } from './tokens/index.js';
-import { T as Theme } from './darkTheme-gaad4-zD.js';
-export { d as darkTheme, l as lightTheme } from './darkTheme-gaad4-zD.js';
+export { BorderWidth, Colors, Grid, Opacity, Radius, Shadow, Spacing, Typography, borderWidth, colors, grid, opacity, radius, shadow, spacing, typography } from './tokens/index.js';
+import { T as Theme, C as ChipSize, a as CheckboxSize } from './Checkbox.styles-DPyXzxFJ.js';
+export { d as darkTheme, l as lightTheme } from './Checkbox.styles-DPyXzxFJ.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { PressableProps, StyleProp, ViewStyle } from 'react-native';
 
@@ -25,21 +25,53 @@ type ButtonProps = {
 };
 declare function Button({ variant, size, disabled, children, onPress }: ButtonProps): react_jsx_runtime.JSX.Element;
 
+type ButtonIconVariant = 'primary' | 'secondary' | 'ghost' | 'overlay';
+type ButtonIconSize = 'sm' | 'md' | 'lg';
+type ButtonIconProps = {
+    icon: React.ReactNode;
+    accessibilityLabel: string;
+    variant?: ButtonIconVariant;
+    size?: ButtonIconSize;
+    disabled?: boolean;
+    onPress?: PressableProps['onPress'];
+};
+declare function ButtonIcon({ icon, accessibilityLabel, variant, size, disabled, onPress }: ButtonIconProps): react_jsx_runtime.JSX.Element;
+
+type DismissButtonVariant = 'subtle' | 'ghost';
+type DismissButtonSize = 'xs' | 'sm' | 'md';
+type DismissButtonProps = {
+    accessibilityLabel?: string;
+    variant?: DismissButtonVariant;
+    size?: DismissButtonSize;
+    disabled?: boolean;
+    onPress?: PressableProps['onPress'];
+};
+declare function DismissButton({ accessibilityLabel, variant, size, disabled, onPress }: DismissButtonProps): react_jsx_runtime.JSX.Element;
+
 type ChipProps = {
     children: React.ReactNode;
     checked?: boolean;
+    disabled?: boolean;
+    size?: ChipSize;
+    leading?: React.ReactNode;
+    trailing?: React.ReactNode;
     onPress?: () => void;
     style?: StyleProp<ViewStyle>;
 };
-declare function Chip({ children, checked, onPress, style }: ChipProps): react_jsx_runtime.JSX.Element;
+declare function Chip({ children, checked, disabled, size, leading, trailing, onPress, style }: ChipProps): react_jsx_runtime.JSX.Element;
 
-type AlertVariant = 'success' | 'info';
+type AlertVariant = 'success' | 'info' | 'warning' | 'error';
+type AlertSize = 'default' | 'compact';
+type AlertLayout = 'stacked' | 'inline';
 type AlertProps = {
     variant?: AlertVariant;
-    title: string;
+    size?: AlertSize;
+    layout?: AlertLayout;
+    title?: string;
     description?: string;
+    onDismiss?: () => void;
 };
-declare function Alert({ variant, title, description }: AlertProps): react_jsx_runtime.JSX.Element;
+declare function Alert({ variant, size, layout, title, description, onDismiss }: AlertProps): react_jsx_runtime.JSX.Element;
 
 type ProgressBarProps = {
     value: number;
@@ -52,29 +84,48 @@ type InputProps = {
     placeholder?: string;
     state?: InputState;
     leadingIcon?: React.ReactNode;
+    trailingIcon?: React.ReactNode;
     onChangeText?: (text: string) => void;
     onFocus?: () => void;
     onBlur?: () => void;
     style?: StyleProp<ViewStyle>;
 };
-declare function Input({ value, placeholder, state, leadingIcon, onChangeText, onFocus, onBlur, style }: InputProps): react_jsx_runtime.JSX.Element;
+declare function Input({ value, placeholder, state, leadingIcon, trailingIcon, onChangeText, onFocus, onBlur, style }: InputProps): react_jsx_runtime.JSX.Element;
+
+type InputFieldProps = {
+    label?: string;
+    required?: boolean;
+    helperText?: string;
+    error?: boolean;
+    value?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    leadingIcon?: React.ReactNode;
+    trailingIcon?: React.ReactNode;
+    onChangeText?: (text: string) => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+};
+declare function InputField({ label, required, helperText, error, value, placeholder, disabled, leadingIcon, trailingIcon, onChangeText, onFocus, onBlur, }: InputFieldProps): react_jsx_runtime.JSX.Element;
 
 type CheckboxProps = {
     checked?: boolean;
     onChange?: (checked: boolean) => void;
     disabled?: boolean;
+    size?: CheckboxSize;
 };
-declare function Checkbox({ checked, onChange, disabled }: CheckboxProps): react_jsx_runtime.JSX.Element;
+declare function Checkbox({ checked, onChange, disabled, size }: CheckboxProps): react_jsx_runtime.JSX.Element;
 
-type RadioItemProps = {
-    label: string;
-    description?: string;
-    selected?: boolean;
-    icon?: React.ReactNode;
-    onPress?: () => void;
-    style?: StyleProp<ViewStyle>;
+type ToggleSwitchSize = 'xs' | 'sm' | 'md';
+type ToggleSwitchProps = {
+    value?: boolean;
+    onChange?: (value: boolean) => void;
+    disabled?: boolean;
+    size?: ToggleSwitchSize;
+    accessibilityLabel: string;
+    onPress?: PressableProps['onPress'];
 };
-declare function RadioItem({ label, description, selected, icon, onPress, style }: RadioItemProps): react_jsx_runtime.JSX.Element;
+declare function ToggleSwitch({ value, onChange, disabled, size, accessibilityLabel }: ToggleSwitchProps): react_jsx_runtime.JSX.Element;
 
 type RadioGroupProps = {
     children: React.ReactNode;
@@ -83,25 +134,39 @@ type RadioGroupProps = {
 };
 declare function RadioGroup({ children, label, style }: RadioGroupProps): react_jsx_runtime.JSX.Element;
 
-type ActionItemProps = {
+type ChoiceCardType = 'radio' | 'checkbox' | 'action';
+type ChoiceCardProps = {
+    type?: ChoiceCardType;
     label: string;
     description?: string;
     selected?: boolean;
-    icon?: React.ReactNode;
+    disabled?: boolean;
+    leading?: React.ReactNode;
+    showTrailing?: boolean;
     onPress?: () => void;
-    style?: StyleProp<ViewStyle>;
 };
-declare function ActionItem({ label, description, selected, icon, onPress, style }: ActionItemProps): react_jsx_runtime.JSX.Element;
+declare function ChoiceCard({ type, label, description, selected, disabled, leading, showTrailing, onPress }: ChoiceCardProps): react_jsx_runtime.JSX.Element;
 
-type Step = {
+type ListItemTrailing = 'none' | 'radio' | 'checkbox' | 'action' | 'switch';
+type ListItemProps = {
+    trailing?: ListItemTrailing;
     label: string;
+    description?: string;
+    selected?: boolean;
+    disabled?: boolean;
+    leading?: React.ReactNode;
+    switchValue?: boolean;
+    onSwitchChange?: (value: boolean) => void;
+    onPress?: () => void;
 };
+declare function ListItem({ trailing, label, description, selected, disabled, leading, switchValue, onSwitchChange, onPress }: ListItemProps): react_jsx_runtime.JSX.Element;
+
 type StepperProps = {
-    steps: Step[];
+    totalSteps: number;
     currentStep: number;
     style?: StyleProp<ViewStyle>;
 };
-declare function Stepper({ steps, currentStep, style }: StepperProps): react_jsx_runtime.JSX.Element;
+declare function Stepper({ totalSteps, currentStep, style }: StepperProps): react_jsx_runtime.JSX.Element;
 
 type RatingScaleOption = {
     emoji: string;
@@ -111,8 +176,9 @@ type RatingScaleProps = {
     value?: number | null;
     onChange?: (value: number) => void;
     options?: ReadonlyArray<RatingScaleOption>;
+    disabled?: boolean;
     style?: StyleProp<ViewStyle>;
 };
-declare function RatingScale({ value, onChange, options, style }: RatingScaleProps): react_jsx_runtime.JSX.Element;
+declare function RatingScale({ value, onChange, options, disabled, style }: RatingScaleProps): react_jsx_runtime.JSX.Element;
 
-export { ActionItem, Alert, Button, Checkbox, Chip, DSThemeProvider, Input, ProgressBar, RadioGroup, RadioItem, RatingScale, Stepper, Theme, useTheme };
+export { Alert, Button, ButtonIcon, Checkbox, Chip, ChoiceCard, DSThemeProvider, DismissButton, Input, InputField, ListItem, ProgressBar, RadioGroup, RatingScale, Stepper, Theme, ToggleSwitch, useTheme };