@munchi_oy/native-ui 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +568 -0
- package/dist/index.d.ts +568 -0
- package/dist/index.js +1 -0
- package/dist/index.mjs +1 -0
- package/global.css +53 -0
- package/nativewind-env.d.ts +2 -0
- package/package.json +88 -0
- package/src/MAlert.tsx +38 -0
- package/src/MAnimation.tsx +55 -0
- package/src/MAvatar.tsx +111 -0
- package/src/MBadge.tsx +72 -0
- package/src/MButton.tsx +90 -0
- package/src/MCard.tsx +15 -0
- package/src/MChevron.tsx +47 -0
- package/src/MConfirmation.tsx +68 -0
- package/src/MCountDown.tsx +120 -0
- package/src/MDateTimePicker.tsx +124 -0
- package/src/MDivider.tsx +69 -0
- package/src/MDrawerRightPanel.tsx +187 -0
- package/src/MDropdown.tsx +277 -0
- package/src/MInput.tsx +162 -0
- package/src/MLabel.tsx +3 -0
- package/src/MLucideIcon.tsx +21 -0
- package/src/MModal.tsx +287 -0
- package/src/MNativeAlert.tsx +33 -0
- package/src/MNumpad.tsx +520 -0
- package/src/MPicker.tsx +150 -0
- package/src/MPinPadKeys.tsx +104 -0
- package/src/MPortal.tsx +4 -0
- package/src/MProgressBar.tsx +74 -0
- package/src/MRadioGroup.tsx +4 -0
- package/src/MRequiredLabel.tsx +21 -0
- package/src/MResponsiveContainer.tsx +74 -0
- package/src/MSearch.tsx +138 -0
- package/src/MSelector.tsx +48 -0
- package/src/MSkeleton.tsx +3 -0
- package/src/MSwitch.tsx +13 -0
- package/src/MTable.tsx +17 -0
- package/src/MTabs.tsx +198 -0
- package/src/MText.tsx +51 -0
- package/src/MTimerUp.tsx +88 -0
- package/src/MToggle.tsx +51 -0
- package/src/constants.ts +19 -0
- package/src/hooks/useColorScheme.tsx +12 -0
- package/src/hooks/useIconColors.ts +19 -0
- package/src/index.ts +124 -0
- package/src/primitives/accordion.tsx +143 -0
- package/src/primitives/alert-dialog.tsx +181 -0
- package/src/primitives/alert.tsx +94 -0
- package/src/primitives/aspect-ratio.tsx +5 -0
- package/src/primitives/avatar.tsx +47 -0
- package/src/primitives/badge.tsx +57 -0
- package/src/primitives/button.tsx +92 -0
- package/src/primitives/card.tsx +86 -0
- package/src/primitives/checkbox.tsx +35 -0
- package/src/primitives/collapsible.tsx +9 -0
- package/src/primitives/context-menu.tsx +255 -0
- package/src/primitives/dialog.tsx +166 -0
- package/src/primitives/dropdown-menu.tsx +264 -0
- package/src/primitives/hover-card.tsx +45 -0
- package/src/primitives/input.tsx +25 -0
- package/src/primitives/label.tsx +33 -0
- package/src/primitives/menubar.tsx +266 -0
- package/src/primitives/navigation-menu.tsx +192 -0
- package/src/primitives/popover.tsx +46 -0
- package/src/primitives/progress.tsx +82 -0
- package/src/primitives/radio-group.tsx +42 -0
- package/src/primitives/select.tsx +192 -0
- package/src/primitives/separator.tsx +28 -0
- package/src/primitives/skeleton.tsx +39 -0
- package/src/primitives/switch.tsx +102 -0
- package/src/primitives/table.tsx +107 -0
- package/src/primitives/tabs.tsx +66 -0
- package/src/primitives/text.tsx +28 -0
- package/src/primitives/textarea.tsx +39 -0
- package/src/primitives/toggle-group.tsx +89 -0
- package/src/primitives/toggle.tsx +91 -0
- package/src/primitives/tooltip.tsx +40 -0
- package/src/primitives/typography.tsx +214 -0
- package/src/theme.ts +43 -0
- package/src/tokens.ts +7 -0
- package/src/utils.ts +14 -0
- package/tailwind.config.ts +112 -0
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,568 @@
|
|
|
1
|
+
import { ClassValue } from 'clsx';
|
|
2
|
+
import * as React$1 from 'react';
|
|
3
|
+
import React__default, { ReactNode } from 'react';
|
|
4
|
+
import * as LucideIcons from 'lucide-react-native';
|
|
5
|
+
import { LucideIcon, LucideProps } from 'lucide-react-native';
|
|
6
|
+
import * as react_native from 'react-native';
|
|
7
|
+
import { ViewProps, ImageSourcePropType, ImageProps, TextProps, PressableProps, View, Text, ScrollView, StyleProp, ViewStyle, TextInputProps, TextInput, SwitchProps } from 'react-native';
|
|
8
|
+
import { AnimationObject, LottieViewProps } from 'lottie-react-native';
|
|
9
|
+
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
10
|
+
import { VariantProps } from 'class-variance-authority';
|
|
11
|
+
import DateTimePicker from 'react-native-ui-datepicker';
|
|
12
|
+
import { CountdownProps, CountdownRenderProps } from 'react-countdown';
|
|
13
|
+
import { DropdownProps } from 'react-native-element-dropdown/lib/typescript/components/Dropdown/model';
|
|
14
|
+
import Animated from 'react-native-reanimated';
|
|
15
|
+
export { Portal as MPortal, PortalHost as MPortalHost } from '@rn-primitives/portal';
|
|
16
|
+
|
|
17
|
+
declare function cn(...inputs: ClassValue[]): string;
|
|
18
|
+
|
|
19
|
+
declare function useColorScheme(): {
|
|
20
|
+
colorScheme: "light" | "dark";
|
|
21
|
+
isDarkColorScheme: boolean;
|
|
22
|
+
setColorScheme: (scheme: Parameters<(value: "light" | "dark" | "system") => void>[0]) => void;
|
|
23
|
+
toggleColorScheme: () => void;
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
/** Icon `color` values aligned with `NAV_THEME` + semantic muted text (matches `global.css` muted-foreground). */
|
|
27
|
+
declare function useIconColors(): {
|
|
28
|
+
foreground: string;
|
|
29
|
+
muted: string;
|
|
30
|
+
primary: string;
|
|
31
|
+
destructive: string;
|
|
32
|
+
/** For icons/spinners on `bg-destructive` (matches `--destructive-foreground`). */
|
|
33
|
+
onDestructive: string;
|
|
34
|
+
/** For icons/spinners on `bg-primary` (matches `--primary-foreground`). */
|
|
35
|
+
onPrimary: string;
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
declare const NAV_THEME: {
|
|
39
|
+
readonly light: {
|
|
40
|
+
background: string;
|
|
41
|
+
border: string;
|
|
42
|
+
card: string;
|
|
43
|
+
notification: string;
|
|
44
|
+
primary: string;
|
|
45
|
+
text: string;
|
|
46
|
+
};
|
|
47
|
+
readonly dark: {
|
|
48
|
+
background: string;
|
|
49
|
+
border: string;
|
|
50
|
+
card: string;
|
|
51
|
+
notification: string;
|
|
52
|
+
primary: string;
|
|
53
|
+
text: string;
|
|
54
|
+
};
|
|
55
|
+
};
|
|
56
|
+
|
|
57
|
+
declare const typography: {
|
|
58
|
+
readonly regular: "DMSans_400Regular";
|
|
59
|
+
readonly medium: "DMSans_500Medium";
|
|
60
|
+
readonly bold: "DMSans_700Bold";
|
|
61
|
+
};
|
|
62
|
+
type TypographyToken = keyof typeof typography;
|
|
63
|
+
|
|
64
|
+
declare const lightVars: {
|
|
65
|
+
readonly "--background": "0 0% 95.7%";
|
|
66
|
+
readonly "--foreground": "0 0% 7.8%";
|
|
67
|
+
readonly "--card": "0 0% 100%";
|
|
68
|
+
readonly "--card-foreground": "0 0% 7.8%";
|
|
69
|
+
readonly "--popover": "0 0% 100%";
|
|
70
|
+
readonly "--popover-foreground": "0 0% 7.8%";
|
|
71
|
+
readonly "--primary": "0 0% 7.8%";
|
|
72
|
+
readonly "--primary-foreground": "0 0% 100%";
|
|
73
|
+
readonly "--secondary": "0 0% 93%";
|
|
74
|
+
readonly "--secondary-foreground": "0 0% 7.8%";
|
|
75
|
+
readonly "--muted": "0 0% 93%";
|
|
76
|
+
readonly "--muted-foreground": "0 0% 45%";
|
|
77
|
+
readonly "--accent": "0 0% 89.4%";
|
|
78
|
+
readonly "--accent-foreground": "0 0% 7.8%";
|
|
79
|
+
readonly "--destructive": "0 84.2% 60.2%";
|
|
80
|
+
readonly "--destructive-foreground": "0 0% 100%";
|
|
81
|
+
readonly "--border": "0 0% 78%";
|
|
82
|
+
readonly "--input": "0 0% 78%";
|
|
83
|
+
readonly "--ring": "0 0% 7.8%";
|
|
84
|
+
};
|
|
85
|
+
declare const darkVars: {
|
|
86
|
+
readonly "--background": "0 0% 7.8%";
|
|
87
|
+
readonly "--foreground": "0 0% 100%";
|
|
88
|
+
readonly "--card": "0 0% 14.5%";
|
|
89
|
+
readonly "--card-foreground": "0 0% 100%";
|
|
90
|
+
readonly "--popover": "0 0% 14.5%";
|
|
91
|
+
readonly "--popover-foreground": "0 0% 100%";
|
|
92
|
+
readonly "--primary": "0 0% 100%";
|
|
93
|
+
readonly "--primary-foreground": "0 0% 7.8%";
|
|
94
|
+
readonly "--secondary": "0 0% 18%";
|
|
95
|
+
readonly "--secondary-foreground": "0 0% 100%";
|
|
96
|
+
readonly "--muted": "0 0% 11%";
|
|
97
|
+
readonly "--muted-foreground": "0 0% 60%";
|
|
98
|
+
readonly "--accent": "0 0% 21.2%";
|
|
99
|
+
readonly "--accent-foreground": "0 0% 100%";
|
|
100
|
+
readonly "--destructive": "0 72% 51%";
|
|
101
|
+
readonly "--destructive-foreground": "0 0% 100%";
|
|
102
|
+
readonly "--border": "0 0% 28%";
|
|
103
|
+
readonly "--input": "0 0% 28%";
|
|
104
|
+
readonly "--ring": "0 0% 60%";
|
|
105
|
+
};
|
|
106
|
+
|
|
107
|
+
interface MAlertProps extends Pick<ViewProps, "className"> {
|
|
108
|
+
title: string;
|
|
109
|
+
description?: string;
|
|
110
|
+
icon: LucideIcon;
|
|
111
|
+
iconSize?: number;
|
|
112
|
+
iconClassName?: ViewProps["className"];
|
|
113
|
+
variant?: "default" | "destructive";
|
|
114
|
+
}
|
|
115
|
+
declare const MAlert: {
|
|
116
|
+
({ title, description, icon, iconSize, iconClassName, variant, className }: MAlertProps): React$1.JSX.Element;
|
|
117
|
+
displayName: string;
|
|
118
|
+
};
|
|
119
|
+
|
|
120
|
+
interface MAnimationProps {
|
|
121
|
+
animationSource: AnimationObject;
|
|
122
|
+
lottieViewProps: Omit<LottieViewProps, "source">;
|
|
123
|
+
children?: React__default.ReactNode;
|
|
124
|
+
childrenClass?: string;
|
|
125
|
+
text?: string;
|
|
126
|
+
subText?: string;
|
|
127
|
+
}
|
|
128
|
+
declare const MAnimation: {
|
|
129
|
+
({ children, animationSource, lottieViewProps, childrenClass, text, subText }: MAnimationProps): React__default.JSX.Element;
|
|
130
|
+
displayName: string;
|
|
131
|
+
};
|
|
132
|
+
|
|
133
|
+
declare const Avatar: React$1.ForwardRefExoticComponent<react_native.ViewProps & {
|
|
134
|
+
asChild?: boolean;
|
|
135
|
+
} & {
|
|
136
|
+
alt: string;
|
|
137
|
+
} & React$1.RefAttributes<react_native.View>>;
|
|
138
|
+
|
|
139
|
+
declare const avatarVariants: (props?: ({
|
|
140
|
+
size?: "full" | "xs" | "sm" | "lg" | "xl" | "md" | "xxl" | null | undefined;
|
|
141
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
142
|
+
interface MAvatarProps extends React__default.ComponentPropsWithoutRef<typeof Avatar>, VariantProps<typeof avatarVariants> {
|
|
143
|
+
source?: ImageSourcePropType;
|
|
144
|
+
fallbackText?: string;
|
|
145
|
+
imageClassName?: ImageProps["className"];
|
|
146
|
+
fallbackClassName?: ViewProps["className"];
|
|
147
|
+
fallbackTextClassName?: TextProps["className"];
|
|
148
|
+
}
|
|
149
|
+
declare const MAvatar: React__default.ForwardRefExoticComponent<MAvatarProps & React__default.RefAttributes<react_native.View>>;
|
|
150
|
+
|
|
151
|
+
declare const badgeVariants: (props?: ({
|
|
152
|
+
variant?: "default" | "destructive" | "accent" | "muted" | "primary" | "gray" | "custom" | null | undefined;
|
|
153
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
154
|
+
interface MBadgeProps extends Pick<ViewProps, "className">, VariantProps<typeof badgeVariants> {
|
|
155
|
+
text: string;
|
|
156
|
+
show?: boolean;
|
|
157
|
+
customBackgroundColor?: string;
|
|
158
|
+
textClassName?: TextProps["className"];
|
|
159
|
+
}
|
|
160
|
+
declare const MBadge: React__default.FC<MBadgeProps>;
|
|
161
|
+
|
|
162
|
+
declare const buttonVariants: (props?: ({
|
|
163
|
+
variant?: "link" | "default" | "destructive" | "none" | "primary" | "custom" | "white" | "outline" | "secondary" | "ghost" | null | undefined;
|
|
164
|
+
size?: "default" | "icon" | "none" | "sm" | "lg" | null | undefined;
|
|
165
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
166
|
+
interface MButtonProps extends Omit<PressableProps, "children">, VariantProps<typeof buttonVariants> {
|
|
167
|
+
onPress?: () => void;
|
|
168
|
+
disabled?: boolean;
|
|
169
|
+
children: React__default.ReactNode;
|
|
170
|
+
}
|
|
171
|
+
declare const MButton: React__default.ForwardRefExoticComponent<MButtonProps & React__default.RefAttributes<View>>;
|
|
172
|
+
|
|
173
|
+
interface MChevronProps {
|
|
174
|
+
isOpen: boolean;
|
|
175
|
+
size?: number;
|
|
176
|
+
/** Override the chevron color. Defaults to the theme foreground color. */
|
|
177
|
+
color?: string;
|
|
178
|
+
}
|
|
179
|
+
declare const MChevron: {
|
|
180
|
+
({ isOpen, size, color }: MChevronProps): React$1.JSX.Element;
|
|
181
|
+
displayName: string;
|
|
182
|
+
};
|
|
183
|
+
|
|
184
|
+
type CalendarProps = React__default.ComponentProps<typeof DateTimePicker>;
|
|
185
|
+
declare const MDateTimePicker: {
|
|
186
|
+
({ className, classNames, showOutsideDays, containerHeight, components, minDate, maxDate, ...props }: React__default.ComponentProps<typeof DateTimePicker>): React__default.JSX.Element;
|
|
187
|
+
displayName: string;
|
|
188
|
+
};
|
|
189
|
+
|
|
190
|
+
declare const dividerVariants: (props?: ({
|
|
191
|
+
direction?: "horizontal" | "vertical" | null | undefined;
|
|
192
|
+
variant?: "sm" | "lg" | "md" | null | undefined;
|
|
193
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
194
|
+
interface MDividerProps extends Pick<ViewProps, "className" | "style">, VariantProps<typeof dividerVariants> {
|
|
195
|
+
/** When set, overrides theme border color (e.g. legacy `#D3D3D3`). */
|
|
196
|
+
color?: string;
|
|
197
|
+
}
|
|
198
|
+
declare const MDivider: {
|
|
199
|
+
({ className, direction, variant, color, style }: MDividerProps): React$1.JSX.Element;
|
|
200
|
+
displayName: string;
|
|
201
|
+
};
|
|
202
|
+
|
|
203
|
+
type IconName = keyof typeof LucideIcons;
|
|
204
|
+
interface MLucideIconProps extends LucideProps {
|
|
205
|
+
name: IconName;
|
|
206
|
+
}
|
|
207
|
+
declare const MLucideIcon: {
|
|
208
|
+
({ name, ...props }: MLucideIconProps): React__default.JSX.Element | null;
|
|
209
|
+
displayName: string;
|
|
210
|
+
};
|
|
211
|
+
|
|
212
|
+
type PickerItem<T> = {
|
|
213
|
+
label: string;
|
|
214
|
+
value: T;
|
|
215
|
+
};
|
|
216
|
+
type MPickerProps<T> = Pick<PressableProps, "className"> & {
|
|
217
|
+
data: PickerItem<T>[];
|
|
218
|
+
onSelect: (item: PickerItem<T>) => void;
|
|
219
|
+
placeholder: string;
|
|
220
|
+
selectedValue?: T | null;
|
|
221
|
+
textClassName?: TextProps["className"];
|
|
222
|
+
dropdownContainerClassName?: ViewProps["className"];
|
|
223
|
+
itemContainerClassName?: PressableProps["className"];
|
|
224
|
+
itemTextClassName?: TextProps["className"];
|
|
225
|
+
};
|
|
226
|
+
declare const MPicker: {
|
|
227
|
+
<T>({ data, onSelect, placeholder, selectedValue, className, textClassName, dropdownContainerClassName, itemContainerClassName, itemTextClassName }: MPickerProps<T>): React__default.ReactElement;
|
|
228
|
+
displayName: string;
|
|
229
|
+
};
|
|
230
|
+
|
|
231
|
+
declare const progressBarVariants: (props?: ({
|
|
232
|
+
size?: "sm" | "lg" | "md" | null | undefined;
|
|
233
|
+
variant?: "default" | "destructive" | "accent" | "gray" | "secondary" | "pink" | "blue" | "green" | null | undefined;
|
|
234
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
235
|
+
interface MProgressBarProps extends Pick<ViewProps, "className">, VariantProps<typeof progressBarVariants> {
|
|
236
|
+
progress: number;
|
|
237
|
+
fillClassName?: ViewProps["className"];
|
|
238
|
+
}
|
|
239
|
+
declare const MProgressBar: React__default.FC<MProgressBarProps>;
|
|
240
|
+
|
|
241
|
+
interface MResponsiveContainerProps extends Omit<ViewProps, "children"> {
|
|
242
|
+
children: React__default.ReactNode;
|
|
243
|
+
/**
|
|
244
|
+
* Responsive padding values. Keys are Tailwind breakpoints; values must be
|
|
245
|
+
* valid Tailwind spacing scale steps (0, 1, 2, 3, 4, 5, 6, 8, 10, 12, …).
|
|
246
|
+
*/
|
|
247
|
+
padding?: {
|
|
248
|
+
xs?: number;
|
|
249
|
+
sm?: number;
|
|
250
|
+
md?: number;
|
|
251
|
+
lg?: number;
|
|
252
|
+
xl?: number;
|
|
253
|
+
"2xl"?: number;
|
|
254
|
+
};
|
|
255
|
+
/**
|
|
256
|
+
* Responsive margin values. Keys are Tailwind breakpoints; values must be
|
|
257
|
+
* valid Tailwind spacing scale steps (0, 1, 2, 3, 4, 5, 6, 8, 10, 12, …).
|
|
258
|
+
*/
|
|
259
|
+
margin?: {
|
|
260
|
+
xs?: number;
|
|
261
|
+
sm?: number;
|
|
262
|
+
md?: number;
|
|
263
|
+
lg?: number;
|
|
264
|
+
xl?: number;
|
|
265
|
+
"2xl"?: number;
|
|
266
|
+
};
|
|
267
|
+
}
|
|
268
|
+
declare const MResponsiveContainer: React__default.FC<MResponsiveContainerProps>;
|
|
269
|
+
|
|
270
|
+
declare const mTextVariants: (props?: ({
|
|
271
|
+
variant?: "default" | null | undefined;
|
|
272
|
+
size?: "base" | "xs" | "sm" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | null | undefined;
|
|
273
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
274
|
+
interface MTextProps extends Omit<TextProps, "allowFontScaling">, VariantProps<typeof mTextVariants> {
|
|
275
|
+
children: React__default.ReactNode;
|
|
276
|
+
}
|
|
277
|
+
declare const MText: React__default.ForwardRefExoticComponent<MTextProps & React__default.RefAttributes<Text>>;
|
|
278
|
+
|
|
279
|
+
type MRequiredLabelProps = ViewProps & {
|
|
280
|
+
label: string;
|
|
281
|
+
};
|
|
282
|
+
declare const MRequiredLabel: ({ label, className, ...props }: MRequiredLabelProps) => React$1.JSX.Element;
|
|
283
|
+
|
|
284
|
+
declare enum ModalHeight {
|
|
285
|
+
ExtraSmall = "xs",
|
|
286
|
+
Small = "sm",
|
|
287
|
+
Medium = "md",
|
|
288
|
+
Large = "lg",
|
|
289
|
+
ExtraLarge = "xl",
|
|
290
|
+
ExtraExtraLarge = "xxl",
|
|
291
|
+
Auto = "auto"
|
|
292
|
+
}
|
|
293
|
+
declare const ModalScrollContext: React$1.Context<React$1.RefObject<ScrollView | null> | null>;
|
|
294
|
+
declare const modalVariants: (props?: ({
|
|
295
|
+
variant?: "auto" | "xs" | "sm" | "lg" | "md" | "fullscreen" | null | undefined;
|
|
296
|
+
height?: ModalHeight | null | undefined;
|
|
297
|
+
background?: "dark" | "primary" | "white" | "transparent" | null | undefined;
|
|
298
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
299
|
+
interface MModalProps extends VariantProps<typeof modalVariants> {
|
|
300
|
+
isVisible: boolean;
|
|
301
|
+
onClose: () => void;
|
|
302
|
+
onButtonClose?: () => void;
|
|
303
|
+
onBack?: () => void;
|
|
304
|
+
onDismiss?: () => void;
|
|
305
|
+
children: React.ReactNode;
|
|
306
|
+
header?: React.ReactNode;
|
|
307
|
+
headingText?: string;
|
|
308
|
+
containerClassName?: ViewProps["className"];
|
|
309
|
+
closable?: boolean;
|
|
310
|
+
footer?: React.ReactNode;
|
|
311
|
+
showCloseButton?: boolean;
|
|
312
|
+
showBackButton?: boolean;
|
|
313
|
+
keyboardAvoidingEnabled?: boolean;
|
|
314
|
+
}
|
|
315
|
+
interface ModalBodyProps {
|
|
316
|
+
children: React.ReactNode;
|
|
317
|
+
scrollable?: boolean;
|
|
318
|
+
}
|
|
319
|
+
declare const ModalContent: React.FC<{
|
|
320
|
+
body: ReactNode;
|
|
321
|
+
footer?: ReactNode;
|
|
322
|
+
}>;
|
|
323
|
+
declare const MModal: React$1.FC<MModalProps> & {
|
|
324
|
+
Body: {
|
|
325
|
+
({ children, scrollable }: ModalBodyProps): React$1.JSX.Element;
|
|
326
|
+
displayName: string;
|
|
327
|
+
};
|
|
328
|
+
Footer: React$1.FC<{
|
|
329
|
+
children: React.ReactNode;
|
|
330
|
+
}>;
|
|
331
|
+
};
|
|
332
|
+
|
|
333
|
+
interface MDrawerRightPanelProps {
|
|
334
|
+
isVisible: boolean;
|
|
335
|
+
onClose: () => void;
|
|
336
|
+
header?: ReactNode;
|
|
337
|
+
footer?: ReactNode;
|
|
338
|
+
children: ReactNode;
|
|
339
|
+
closable?: boolean;
|
|
340
|
+
widthFraction?: number;
|
|
341
|
+
className?: string;
|
|
342
|
+
scrollable?: boolean;
|
|
343
|
+
}
|
|
344
|
+
declare const MDrawerRightPanel: {
|
|
345
|
+
({ isVisible, onClose, header, footer, children, closable, widthFraction, className, scrollable }: MDrawerRightPanelProps): React$1.JSX.Element;
|
|
346
|
+
displayName: string;
|
|
347
|
+
};
|
|
348
|
+
|
|
349
|
+
interface MNativeAlertProps {
|
|
350
|
+
title: string;
|
|
351
|
+
description: string;
|
|
352
|
+
onPress: () => void;
|
|
353
|
+
onPressText: string;
|
|
354
|
+
onCancel: () => void;
|
|
355
|
+
onCancelText: string;
|
|
356
|
+
}
|
|
357
|
+
declare const MNativeAlert: {
|
|
358
|
+
({ title, description, onPress, onPressText, onCancel, onCancelText }: MNativeAlertProps): void;
|
|
359
|
+
displayName: string;
|
|
360
|
+
};
|
|
361
|
+
|
|
362
|
+
interface MCountDownProps extends Omit<CountdownProps, "renderer" | "className">, Pick<ViewProps, "className"> {
|
|
363
|
+
warningThreshold?: number;
|
|
364
|
+
textClassName?: TextProps["className"];
|
|
365
|
+
showPrefix?: boolean;
|
|
366
|
+
countUp?: boolean;
|
|
367
|
+
renderer?: (props: CountdownRenderProps) => React__default.ReactNode;
|
|
368
|
+
}
|
|
369
|
+
declare const MCountDown: React__default.FC<MCountDownProps>;
|
|
370
|
+
|
|
371
|
+
type MDropdownFieldFrame = "none" | "mInputSm2xl" | "mInputCompact" | "pill";
|
|
372
|
+
type MDropdownProps<T = unknown> = DropdownProps<T> & {
|
|
373
|
+
customStyles?: StyleProp<ViewStyle>;
|
|
374
|
+
fieldFrame?: MDropdownFieldFrame;
|
|
375
|
+
};
|
|
376
|
+
declare const MDropdown: {
|
|
377
|
+
<T = unknown>({ data, placeholder, value, onFocus, onBlur, onChange, customStyles, fieldFrame, style, containerStyle, itemContainerStyle, selectedTextStyle, placeholderStyle, activeColor: activeColorProp, maxHeight, renderRightIcon: renderRightIconProp, selectedTextProps: selectedTextPropsProp, mode, ...rest }: MDropdownProps<T>): React$1.JSX.Element;
|
|
378
|
+
displayName: string;
|
|
379
|
+
};
|
|
380
|
+
|
|
381
|
+
declare const containerVariants$1: (props?: ({
|
|
382
|
+
size?: "default" | "sm" | "lg" | null | undefined;
|
|
383
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
384
|
+
interface MSearchProps extends Omit<TextInputProps, "className">, VariantProps<typeof containerVariants$1> {
|
|
385
|
+
value: string;
|
|
386
|
+
onChangeText: (text: string) => void;
|
|
387
|
+
onClear?: () => void;
|
|
388
|
+
placeholder?: string;
|
|
389
|
+
className?: ViewProps["className"];
|
|
390
|
+
containerClassName?: ViewProps["className"];
|
|
391
|
+
inputClassName?: TextProps["className"];
|
|
392
|
+
iconSize?: number;
|
|
393
|
+
}
|
|
394
|
+
declare const MSearch: React__default.ForwardRefExoticComponent<MSearchProps & React__default.RefAttributes<TextInput>>;
|
|
395
|
+
|
|
396
|
+
interface MSelectorProps {
|
|
397
|
+
label: string;
|
|
398
|
+
isSelected: boolean;
|
|
399
|
+
onPress: () => void;
|
|
400
|
+
description?: string | null;
|
|
401
|
+
}
|
|
402
|
+
declare const MSelector: React__default.MemoExoticComponent<({ label, isSelected, onPress, description }: MSelectorProps) => React__default.JSX.Element>;
|
|
403
|
+
|
|
404
|
+
interface MToggleOption<T> {
|
|
405
|
+
key: T;
|
|
406
|
+
label: string;
|
|
407
|
+
disabled?: boolean;
|
|
408
|
+
}
|
|
409
|
+
interface MToggleProps<T> {
|
|
410
|
+
options: MToggleOption<T>[];
|
|
411
|
+
selectedKey: T;
|
|
412
|
+
onSelect: (key: T) => void;
|
|
413
|
+
}
|
|
414
|
+
declare const MToggle: {
|
|
415
|
+
<T>({ options, selectedKey, onSelect }: MToggleProps<T>): React$1.JSX.Element;
|
|
416
|
+
displayName: string;
|
|
417
|
+
};
|
|
418
|
+
|
|
419
|
+
interface MConfirmationProps {
|
|
420
|
+
message: string;
|
|
421
|
+
onConfirm: () => void;
|
|
422
|
+
onCancel: () => void;
|
|
423
|
+
confirmText?: string;
|
|
424
|
+
cancelText?: string;
|
|
425
|
+
isLoading?: boolean;
|
|
426
|
+
}
|
|
427
|
+
declare const MConfirmation: React__default.FC<MConfirmationProps>;
|
|
428
|
+
|
|
429
|
+
interface MPinPadKeysProps {
|
|
430
|
+
onDigit: (d: string) => void;
|
|
431
|
+
onBackspace: () => void;
|
|
432
|
+
isLoading: boolean;
|
|
433
|
+
}
|
|
434
|
+
declare const MPinPadKeys: React__default.FC<MPinPadKeysProps>;
|
|
435
|
+
|
|
436
|
+
declare enum NumpadMode {
|
|
437
|
+
Discount = "discount",
|
|
438
|
+
Table = "table",
|
|
439
|
+
Price = "price",
|
|
440
|
+
Cash = "cash",
|
|
441
|
+
Quantity = "quantity",
|
|
442
|
+
Phone = "phone",
|
|
443
|
+
GiftCard = "giftcard"
|
|
444
|
+
}
|
|
445
|
+
declare const getDecimalSeparator: () => string;
|
|
446
|
+
interface MNumpadProps {
|
|
447
|
+
customAmount: string | null;
|
|
448
|
+
setCustomAmount: (amount: string | null) => void;
|
|
449
|
+
mode: NumpadMode;
|
|
450
|
+
maxDigits?: number;
|
|
451
|
+
}
|
|
452
|
+
declare const MNumpad: React__default.FC<MNumpadProps>;
|
|
453
|
+
|
|
454
|
+
interface Tab<T> {
|
|
455
|
+
key: T;
|
|
456
|
+
label?: string;
|
|
457
|
+
icon?: React__default.ReactNode;
|
|
458
|
+
disabled?: boolean;
|
|
459
|
+
}
|
|
460
|
+
interface MTabsProps<T> extends Omit<ViewProps, "children"> {
|
|
461
|
+
tabs: Tab<T>[];
|
|
462
|
+
activeTab: T | null;
|
|
463
|
+
onTabChange: (tab: T) => void;
|
|
464
|
+
tabClassName?: string;
|
|
465
|
+
activeTabClassName?: string;
|
|
466
|
+
disabled?: boolean;
|
|
467
|
+
size?: "default" | "compact";
|
|
468
|
+
variant?: "default" | "ghost";
|
|
469
|
+
stretch?: boolean;
|
|
470
|
+
}
|
|
471
|
+
declare const MTabs: {
|
|
472
|
+
<T>({ tabs, activeTab, onTabChange, className, style, disabled, size, variant, stretch, ...viewProps }: MTabsProps<T>): React__default.JSX.Element;
|
|
473
|
+
displayName: string;
|
|
474
|
+
};
|
|
475
|
+
|
|
476
|
+
interface MTimerUpProps extends Pick<ViewProps, "className"> {
|
|
477
|
+
date: string | number | Date;
|
|
478
|
+
textClassName?: TextProps["className"];
|
|
479
|
+
}
|
|
480
|
+
declare const MTimerUp: React__default.FC<MTimerUpProps>;
|
|
481
|
+
|
|
482
|
+
declare const Card: React$1.ForwardRefExoticComponent<ViewProps & React$1.RefAttributes<View>>;
|
|
483
|
+
declare const CardHeader: React$1.ForwardRefExoticComponent<ViewProps & React$1.RefAttributes<View>>;
|
|
484
|
+
declare const CardTitle: React$1.ForwardRefExoticComponent<TextProps & React$1.RefAttributes<Text>>;
|
|
485
|
+
declare const CardDescription: React$1.ForwardRefExoticComponent<TextProps & React$1.RefAttributes<Text>>;
|
|
486
|
+
declare const CardContent: React$1.ForwardRefExoticComponent<ViewProps & React$1.RefAttributes<View>>;
|
|
487
|
+
declare const CardFooter: React$1.ForwardRefExoticComponent<ViewProps & React$1.RefAttributes<View>>;
|
|
488
|
+
|
|
489
|
+
declare function Skeleton({ className, ...props }: Omit<React$1.ComponentPropsWithoutRef<typeof Animated.View>, "style">): React$1.JSX.Element;
|
|
490
|
+
|
|
491
|
+
type MSwitchProps = Omit<SwitchProps, "trackColor" | "thumbColor" | "ios_backgroundColor">;
|
|
492
|
+
declare const MSwitch: {
|
|
493
|
+
(props: MSwitchProps): React$1.JSX.Element;
|
|
494
|
+
displayName: string;
|
|
495
|
+
};
|
|
496
|
+
|
|
497
|
+
declare const Table: React$1.ForwardRefExoticComponent<react_native.ViewProps & {
|
|
498
|
+
asChild?: boolean;
|
|
499
|
+
} & React$1.RefAttributes<react_native.View>>;
|
|
500
|
+
declare const TableHeader: React$1.ForwardRefExoticComponent<react_native.ViewProps & {
|
|
501
|
+
asChild?: boolean;
|
|
502
|
+
} & React$1.RefAttributes<react_native.View>>;
|
|
503
|
+
declare const TableBody: React$1.ForwardRefExoticComponent<react_native.ViewProps & {
|
|
504
|
+
asChild?: boolean;
|
|
505
|
+
} & React$1.RefAttributes<react_native.View>>;
|
|
506
|
+
declare const TableFooter: React$1.ForwardRefExoticComponent<react_native.ViewProps & {
|
|
507
|
+
asChild?: boolean;
|
|
508
|
+
} & React$1.RefAttributes<react_native.View>>;
|
|
509
|
+
declare const TableRow: React$1.ForwardRefExoticComponent<Omit<react_native.PressableProps & React$1.RefAttributes<react_native.View>, "ref"> & {
|
|
510
|
+
asChild?: boolean;
|
|
511
|
+
} & {
|
|
512
|
+
onKeyDown?: (ev: React$1.KeyboardEvent) => void;
|
|
513
|
+
onKeyUp?: (ev: React$1.KeyboardEvent) => void;
|
|
514
|
+
} & React$1.RefAttributes<react_native.View>>;
|
|
515
|
+
declare const TableHead: React$1.ForwardRefExoticComponent<react_native.ViewProps & {
|
|
516
|
+
asChild?: boolean;
|
|
517
|
+
} & React$1.RefAttributes<react_native.View>>;
|
|
518
|
+
declare const TableCell: React$1.ForwardRefExoticComponent<react_native.ViewProps & {
|
|
519
|
+
asChild?: boolean;
|
|
520
|
+
} & React$1.RefAttributes<react_native.View>>;
|
|
521
|
+
|
|
522
|
+
declare const containerVariants: (props?: ({
|
|
523
|
+
size?: "default" | "sm" | "lg" | null | undefined;
|
|
524
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
525
|
+
declare const inputWrapperVariants: (props?: ({
|
|
526
|
+
size?: "default" | "sm" | "lg" | null | undefined;
|
|
527
|
+
radius?: "xl" | "2xl" | null | undefined;
|
|
528
|
+
hasError?: boolean | null | undefined;
|
|
529
|
+
focused?: boolean | null | undefined;
|
|
530
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
531
|
+
interface MInputProps extends Omit<TextInputProps, "className">, VariantProps<typeof containerVariants> {
|
|
532
|
+
label?: string;
|
|
533
|
+
errorMessage?: string;
|
|
534
|
+
rightIcon?: ReactNode;
|
|
535
|
+
className?: ViewProps["className"];
|
|
536
|
+
inputClassName?: string;
|
|
537
|
+
radius?: VariantProps<typeof inputWrapperVariants>["radius"];
|
|
538
|
+
}
|
|
539
|
+
declare const MInput: {
|
|
540
|
+
({ label, errorMessage, rightIcon, size, radius, className, inputClassName, onFocus, onBlur, placeholderTextColor, ...textInputProps }: MInputProps): React$1.JSX.Element;
|
|
541
|
+
displayName: string;
|
|
542
|
+
};
|
|
543
|
+
|
|
544
|
+
declare const Label: React$1.ForwardRefExoticComponent<react_native.TextProps & {
|
|
545
|
+
asChild?: boolean;
|
|
546
|
+
} & {
|
|
547
|
+
nativeID?: string;
|
|
548
|
+
htmlFor?: string;
|
|
549
|
+
} & React$1.RefAttributes<react_native.Text>>;
|
|
550
|
+
|
|
551
|
+
declare const RadioGroup: React$1.ForwardRefExoticComponent<react_native.ViewProps & {
|
|
552
|
+
asChild?: boolean;
|
|
553
|
+
} & {
|
|
554
|
+
value: string | undefined;
|
|
555
|
+
onValueChange: (val: string) => void;
|
|
556
|
+
disabled?: boolean;
|
|
557
|
+
} & React$1.RefAttributes<View>>;
|
|
558
|
+
declare const RadioGroupItem: React$1.ForwardRefExoticComponent<Omit<react_native.PressableProps & React$1.RefAttributes<View>, "ref"> & {
|
|
559
|
+
asChild?: boolean;
|
|
560
|
+
} & {
|
|
561
|
+
onKeyDown?: (ev: React$1.KeyboardEvent) => void;
|
|
562
|
+
onKeyUp?: (ev: React$1.KeyboardEvent) => void;
|
|
563
|
+
} & {
|
|
564
|
+
value: string;
|
|
565
|
+
'aria-labelledby'?: string;
|
|
566
|
+
} & React$1.RefAttributes<View>>;
|
|
567
|
+
|
|
568
|
+
export { type CalendarProps, type IconName, MAlert, type MAlertProps, MAnimation, type MAnimationProps, MAvatar, type MAvatarProps, MBadge, type MBadgeProps, MButton, type MButtonProps, Card as MCard, CardContent as MCardContent, CardDescription as MCardDescription, CardFooter as MCardFooter, CardHeader as MCardHeader, CardTitle as MCardTitle, MChevron, type MChevronProps, MConfirmation, type MConfirmationProps, MCountDown, type MCountDownProps, MDateTimePicker, MDivider, type MDividerProps, MDrawerRightPanel, type MDrawerRightPanelProps, MDropdown, type MDropdownProps, MInput, type MInputProps, Label as MLabel, MLucideIcon, type MLucideIconProps, MModal, type MModalProps, MNativeAlert, type MNativeAlertProps, MNumpad, type MNumpadProps, MPicker, type MPickerProps, MPinPadKeys, type MPinPadKeysProps, MProgressBar, type MProgressBarProps, RadioGroup as MRadioGroup, RadioGroupItem as MRadioGroupItem, MRequiredLabel, MResponsiveContainer, MSearch, type MSearchProps, MSelector, type MSelectorProps, Skeleton as MSkeleton, MSwitch, type MSwitchProps, Table as MTable, TableBody as MTableBody, TableCell as MTableCell, TableFooter as MTableFooter, TableHead as MTableHead, TableHeader as MTableHeader, TableRow as MTableRow, MTabs, type MTabsProps, MText, type MTextProps, MTimerUp, type MTimerUpProps, MToggle, type MToggleOption, type MToggleProps, ModalContent, ModalHeight, ModalScrollContext, NAV_THEME, NumpadMode, type PickerItem, type Tab, type TypographyToken, buttonVariants, cn, darkVars, getDecimalSeparator, lightVars, typography, useColorScheme, useIconColors };
|