@makroz/mobile 1.0.1
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/LICENSE +33 -0
- package/README.md +19 -0
- package/dist/auth/MkAuthContext.d.ts +72 -0
- package/dist/auth/MkAuthContext.d.ts.map +1 -0
- package/dist/auth/MkAuthContext.js +19 -0
- package/dist/auth/MkAuthContext.js.map +1 -0
- package/dist/auth/MkAuthForm.d.ts +31 -0
- package/dist/auth/MkAuthForm.d.ts.map +1 -0
- package/dist/auth/MkAuthForm.js +180 -0
- package/dist/auth/MkAuthForm.js.map +1 -0
- package/dist/auth/MkAuthProvider.d.ts +57 -0
- package/dist/auth/MkAuthProvider.d.ts.map +1 -0
- package/dist/auth/MkAuthProvider.js +282 -0
- package/dist/auth/MkAuthProvider.js.map +1 -0
- package/dist/auth/secureStorage.d.ts +63 -0
- package/dist/auth/secureStorage.d.ts.map +1 -0
- package/dist/auth/secureStorage.js +104 -0
- package/dist/auth/secureStorage.js.map +1 -0
- package/dist/auth/types.d.ts +65 -0
- package/dist/auth/types.d.ts.map +1 -0
- package/dist/auth/types.js +10 -0
- package/dist/auth/types.js.map +1 -0
- package/dist/auth/useMkAuth.d.ts +17 -0
- package/dist/auth/useMkAuth.d.ts.map +1 -0
- package/dist/auth/useMkAuth.js +24 -0
- package/dist/auth/useMkAuth.js.map +1 -0
- package/dist/components/MkAccordion.d.ts +19 -0
- package/dist/components/MkAccordion.d.ts.map +1 -0
- package/dist/components/MkAccordion.js +49 -0
- package/dist/components/MkAccordion.js.map +1 -0
- package/dist/components/MkAlert.d.ts +18 -0
- package/dist/components/MkAlert.d.ts.map +1 -0
- package/dist/components/MkAlert.js +35 -0
- package/dist/components/MkAlert.js.map +1 -0
- package/dist/components/MkAvatar.d.ts +12 -0
- package/dist/components/MkAvatar.d.ts.map +1 -0
- package/dist/components/MkAvatar.js +33 -0
- package/dist/components/MkAvatar.js.map +1 -0
- package/dist/components/MkBadge.d.ts +11 -0
- package/dist/components/MkBadge.d.ts.map +1 -0
- package/dist/components/MkBadge.js +22 -0
- package/dist/components/MkBadge.js.map +1 -0
- package/dist/components/MkButton.d.ts +13 -0
- package/dist/components/MkButton.d.ts.map +1 -0
- package/dist/components/MkButton.js +53 -0
- package/dist/components/MkButton.js.map +1 -0
- package/dist/components/MkCard.d.ts +15 -0
- package/dist/components/MkCard.d.ts.map +1 -0
- package/dist/components/MkCard.js +25 -0
- package/dist/components/MkCard.js.map +1 -0
- package/dist/components/MkCheck.d.ts +18 -0
- package/dist/components/MkCheck.d.ts.map +1 -0
- package/dist/components/MkCheck.js +33 -0
- package/dist/components/MkCheck.js.map +1 -0
- package/dist/components/MkDatePicker.d.ts +30 -0
- package/dist/components/MkDatePicker.d.ts.map +1 -0
- package/dist/components/MkDatePicker.js +87 -0
- package/dist/components/MkDatePicker.js.map +1 -0
- package/dist/components/MkDivider.d.ts +11 -0
- package/dist/components/MkDivider.d.ts.map +1 -0
- package/dist/components/MkDivider.js +28 -0
- package/dist/components/MkDivider.js.map +1 -0
- package/dist/components/MkDropDown.d.ts +37 -0
- package/dist/components/MkDropDown.d.ts.map +1 -0
- package/dist/components/MkDropDown.js +82 -0
- package/dist/components/MkDropDown.js.map +1 -0
- package/dist/components/MkEmptyState.d.ts +11 -0
- package/dist/components/MkEmptyState.d.ts.map +1 -0
- package/dist/components/MkEmptyState.js +16 -0
- package/dist/components/MkEmptyState.js.map +1 -0
- package/dist/components/MkFileUpload.d.ts +63 -0
- package/dist/components/MkFileUpload.d.ts.map +1 -0
- package/dist/components/MkFileUpload.js +80 -0
- package/dist/components/MkFileUpload.js.map +1 -0
- package/dist/components/MkIcons.d.ts +15 -0
- package/dist/components/MkIcons.d.ts.map +1 -0
- package/dist/components/MkIcons.js +35 -0
- package/dist/components/MkIcons.js.map +1 -0
- package/dist/components/MkInfiniteList.d.ts +22 -0
- package/dist/components/MkInfiniteList.d.ts.map +1 -0
- package/dist/components/MkInfiniteList.js +62 -0
- package/dist/components/MkInfiniteList.js.map +1 -0
- package/dist/components/MkInput.d.ts +16 -0
- package/dist/components/MkInput.d.ts.map +1 -0
- package/dist/components/MkInput.js +66 -0
- package/dist/components/MkInput.js.map +1 -0
- package/dist/components/MkLoading.d.ts +12 -0
- package/dist/components/MkLoading.d.ts.map +1 -0
- package/dist/components/MkLoading.js +20 -0
- package/dist/components/MkLoading.js.map +1 -0
- package/dist/components/MkModal.d.ts +20 -0
- package/dist/components/MkModal.d.ts.map +1 -0
- package/dist/components/MkModal.js +71 -0
- package/dist/components/MkModal.js.map +1 -0
- package/dist/components/MkProgressBar.d.ts +13 -0
- package/dist/components/MkProgressBar.d.ts.map +1 -0
- package/dist/components/MkProgressBar.js +27 -0
- package/dist/components/MkProgressBar.js.map +1 -0
- package/dist/components/MkRadio.d.ts +20 -0
- package/dist/components/MkRadio.d.ts.map +1 -0
- package/dist/components/MkRadio.js +35 -0
- package/dist/components/MkRadio.js.map +1 -0
- package/dist/components/MkSearchInput.d.ts +21 -0
- package/dist/components/MkSearchInput.d.ts.map +1 -0
- package/dist/components/MkSearchInput.js +44 -0
- package/dist/components/MkSearchInput.js.map +1 -0
- package/dist/components/MkSelect.d.ts +16 -0
- package/dist/components/MkSelect.d.ts.map +1 -0
- package/dist/components/MkSelect.js +75 -0
- package/dist/components/MkSelect.js.map +1 -0
- package/dist/components/MkSkeleton.d.ts +13 -0
- package/dist/components/MkSkeleton.d.ts.map +1 -0
- package/dist/components/MkSkeleton.js +32 -0
- package/dist/components/MkSkeleton.js.map +1 -0
- package/dist/components/MkSwitch.d.ts +13 -0
- package/dist/components/MkSwitch.d.ts.map +1 -0
- package/dist/components/MkSwitch.js +68 -0
- package/dist/components/MkSwitch.js.map +1 -0
- package/dist/components/MkTable.d.ts +39 -0
- package/dist/components/MkTable.d.ts.map +1 -0
- package/dist/components/MkTable.js +47 -0
- package/dist/components/MkTable.js.map +1 -0
- package/dist/components/MkTabs.d.ts +19 -0
- package/dist/components/MkTabs.d.ts.map +1 -0
- package/dist/components/MkTabs.js +38 -0
- package/dist/components/MkTabs.js.map +1 -0
- package/dist/components/MkTextArea.d.ts +17 -0
- package/dist/components/MkTextArea.d.ts.map +1 -0
- package/dist/components/MkTextArea.js +18 -0
- package/dist/components/MkTextArea.js.map +1 -0
- package/dist/components/MkToastRenderer.d.ts +3 -0
- package/dist/components/MkToastRenderer.d.ts.map +1 -0
- package/dist/components/MkToastRenderer.js +133 -0
- package/dist/components/MkToastRenderer.js.map +1 -0
- package/dist/components/MkTooltip.d.ts +15 -0
- package/dist/components/MkTooltip.d.ts.map +1 -0
- package/dist/components/MkTooltip.js +36 -0
- package/dist/components/MkTooltip.js.map +1 -0
- package/dist/components/MkWindowList.d.ts +47 -0
- package/dist/components/MkWindowList.d.ts.map +1 -0
- package/dist/components/MkWindowList.js +50 -0
- package/dist/components/MkWindowList.js.map +1 -0
- package/dist/components/index.d.ts +30 -0
- package/dist/components/index.d.ts.map +1 -0
- package/dist/components/index.js +33 -0
- package/dist/components/index.js.map +1 -0
- package/dist/context/MkApiContext.d.ts +15 -0
- package/dist/context/MkApiContext.d.ts.map +1 -0
- package/dist/context/MkApiContext.js +27 -0
- package/dist/context/MkApiContext.js.map +1 -0
- package/dist/context/MkAuthContext.d.ts +19 -0
- package/dist/context/MkAuthContext.d.ts.map +1 -0
- package/dist/context/MkAuthContext.js +86 -0
- package/dist/context/MkAuthContext.js.map +1 -0
- package/dist/context/MkConfirmContext.d.ts +8 -0
- package/dist/context/MkConfirmContext.d.ts.map +1 -0
- package/dist/context/MkConfirmContext.js +36 -0
- package/dist/context/MkConfirmContext.js.map +1 -0
- package/dist/context/MkToastContext.d.ts +19 -0
- package/dist/context/MkToastContext.d.ts.map +1 -0
- package/dist/context/MkToastContext.js +86 -0
- package/dist/context/MkToastContext.js.map +1 -0
- package/dist/hooks/filePicker.types.d.ts +13 -0
- package/dist/hooks/filePicker.types.d.ts.map +1 -0
- package/dist/hooks/filePicker.types.js +7 -0
- package/dist/hooks/filePicker.types.js.map +1 -0
- package/dist/hooks/useApi.d.ts +19 -0
- package/dist/hooks/useApi.d.ts.map +1 -0
- package/dist/hooks/useApi.js +78 -0
- package/dist/hooks/useApi.js.map +1 -0
- package/dist/hooks/useApi.test.d.ts +2 -0
- package/dist/hooks/useApi.test.d.ts.map +1 -0
- package/dist/hooks/useApi.test.js +10 -0
- package/dist/hooks/useApi.test.js.map +1 -0
- package/dist/hooks/useMkCrud.d.ts +39 -0
- package/dist/hooks/useMkCrud.d.ts.map +1 -0
- package/dist/hooks/useMkCrud.js +118 -0
- package/dist/hooks/useMkCrud.js.map +1 -0
- package/dist/hooks/useMkDebounce.d.ts +24 -0
- package/dist/hooks/useMkDebounce.d.ts.map +1 -0
- package/dist/hooks/useMkDebounce.js +36 -0
- package/dist/hooks/useMkDebounce.js.map +1 -0
- package/dist/hooks/useMkEffectDebug.d.ts +6 -0
- package/dist/hooks/useMkEffectDebug.d.ts.map +1 -0
- package/dist/hooks/useMkEffectDebug.js +23 -0
- package/dist/hooks/useMkEffectDebug.js.map +1 -0
- package/dist/hooks/useMkEvent.d.ts +42 -0
- package/dist/hooks/useMkEvent.d.ts.map +1 -0
- package/dist/hooks/useMkEvent.js +49 -0
- package/dist/hooks/useMkEvent.js.map +1 -0
- package/dist/hooks/useMkFilePickerCli.d.ts +59 -0
- package/dist/hooks/useMkFilePickerCli.d.ts.map +1 -0
- package/dist/hooks/useMkFilePickerCli.js +68 -0
- package/dist/hooks/useMkFilePickerCli.js.map +1 -0
- package/dist/hooks/useMkFilePickerExpo.d.ts +38 -0
- package/dist/hooks/useMkFilePickerExpo.d.ts.map +1 -0
- package/dist/hooks/useMkFilePickerExpo.js +68 -0
- package/dist/hooks/useMkFilePickerExpo.js.map +1 -0
- package/dist/hooks/useMkForm.d.ts +43 -0
- package/dist/hooks/useMkForm.d.ts.map +1 -0
- package/dist/hooks/useMkForm.js +115 -0
- package/dist/hooks/useMkForm.js.map +1 -0
- package/dist/hooks/useMkInfiniteList.d.ts +16 -0
- package/dist/hooks/useMkInfiniteList.d.ts.map +1 -0
- package/dist/hooks/useMkInfiniteList.js +58 -0
- package/dist/hooks/useMkInfiniteList.js.map +1 -0
- package/dist/hooks/useMkList.d.ts +61 -0
- package/dist/hooks/useMkList.d.ts.map +1 -0
- package/dist/hooks/useMkList.js +55 -0
- package/dist/hooks/useMkList.js.map +1 -0
- package/dist/hooks/useMkLocalStorage.d.ts +6 -0
- package/dist/hooks/useMkLocalStorage.d.ts.map +1 -0
- package/dist/hooks/useMkLocalStorage.js +28 -0
- package/dist/hooks/useMkLocalStorage.js.map +1 -0
- package/dist/hooks/useMkPrevious.d.ts +6 -0
- package/dist/hooks/useMkPrevious.d.ts.map +1 -0
- package/dist/hooks/useMkPrevious.js +13 -0
- package/dist/hooks/useMkPrevious.js.map +1 -0
- package/dist/hooks/useMkToggle.d.ts +6 -0
- package/dist/hooks/useMkToggle.d.ts.map +1 -0
- package/dist/hooks/useMkToggle.js +13 -0
- package/dist/hooks/useMkToggle.js.map +1 -0
- package/dist/index.d.ts +29 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +32 -0
- package/dist/index.js.map +1 -0
- package/dist/theme/MkThemeProvider.d.ts +14 -0
- package/dist/theme/MkThemeProvider.d.ts.map +1 -0
- package/dist/theme/MkThemeProvider.js +22 -0
- package/dist/theme/MkThemeProvider.js.map +1 -0
- package/eslint-plugin-mk/index.js +20 -0
- package/package.json +66 -0
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { View, Text, StyleSheet } from 'react-native';
|
|
3
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
4
|
+
const SPACING = { sm: 8, md: 16, lg: 24 };
|
|
5
|
+
export const MkDivider = ({ label, orientation = 'horizontal', variant = 'solid', spacing = 'md', style, }) => {
|
|
6
|
+
const { theme } = useMkTheme();
|
|
7
|
+
const space = SPACING[spacing];
|
|
8
|
+
const borderStyle = variant === 'dashed' ? 'dashed' : variant === 'dotted' ? 'dotted' : 'solid';
|
|
9
|
+
if (orientation === 'vertical') {
|
|
10
|
+
return (_jsx(View, { style: [
|
|
11
|
+
{ width: 1, alignSelf: 'stretch', backgroundColor: variant === 'solid' ? theme.border : undefined, borderLeftWidth: variant !== 'solid' ? 1 : 0, borderLeftColor: theme.border, borderStyle, marginHorizontal: space },
|
|
12
|
+
style,
|
|
13
|
+
] }));
|
|
14
|
+
}
|
|
15
|
+
if (label) {
|
|
16
|
+
return (_jsxs(View, { style: [styles.withLabel, { marginVertical: space }, style], children: [_jsx(View, { style: [styles.line, { backgroundColor: theme.border }] }), _jsx(Text, { style: [styles.label, { color: theme.mutedForeground }], children: label }), _jsx(View, { style: [styles.line, { backgroundColor: theme.border }] })] }));
|
|
17
|
+
}
|
|
18
|
+
return (_jsx(View, { style: [
|
|
19
|
+
{ height: variant === 'solid' ? 1 : 0, backgroundColor: variant === 'solid' ? theme.border : undefined, borderTopWidth: variant !== 'solid' ? 1 : 0, borderTopColor: theme.border, borderStyle, marginVertical: space },
|
|
20
|
+
style,
|
|
21
|
+
] }));
|
|
22
|
+
};
|
|
23
|
+
const styles = StyleSheet.create({
|
|
24
|
+
withLabel: { flexDirection: 'row', alignItems: 'center', gap: 12 },
|
|
25
|
+
line: { flex: 1, height: 1 },
|
|
26
|
+
label: { fontSize: 11, fontWeight: '500', textTransform: 'uppercase', letterSpacing: 0.5 },
|
|
27
|
+
});
|
|
28
|
+
//# sourceMappingURL=MkDivider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkDivider.js","sourceRoot":"","sources":["../../src/components/MkDivider.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ViewStyle } from 'react-native';
|
|
3
|
+
/**
|
|
4
|
+
* @module MkDropDown (Mobile)
|
|
5
|
+
* @description Floating action menu as a Modal bottom-sheet-style popup.
|
|
6
|
+
* Same prop API as mk-web's MkDropDown: options, onSelect, withSearch, value.
|
|
7
|
+
*
|
|
8
|
+
* @example
|
|
9
|
+
* ```tsx
|
|
10
|
+
* <MkDropDown
|
|
11
|
+
* options={[
|
|
12
|
+
* { value: 'edit', label: 'Editar', icon: <EditIcon /> },
|
|
13
|
+
* { value: 'delete', label: 'Eliminar' },
|
|
14
|
+
* ]}
|
|
15
|
+
* onSelect={(val) => handleAction(val)}
|
|
16
|
+
* withSearch
|
|
17
|
+
* />
|
|
18
|
+
* ```
|
|
19
|
+
*/
|
|
20
|
+
export interface MkDropdownOptionType {
|
|
21
|
+
value: string | number;
|
|
22
|
+
label: string;
|
|
23
|
+
icon?: React.ReactNode;
|
|
24
|
+
}
|
|
25
|
+
export interface MkDropDownProps {
|
|
26
|
+
options: MkDropdownOptionType[];
|
|
27
|
+
onSelect: (value: string | number) => void;
|
|
28
|
+
/** Custom trigger element. Default: "⋮" icon. */
|
|
29
|
+
initiator?: React.ReactNode;
|
|
30
|
+
withSearch?: boolean;
|
|
31
|
+
value?: string | number;
|
|
32
|
+
placeholder?: string;
|
|
33
|
+
/** Style for the container */
|
|
34
|
+
style?: ViewStyle;
|
|
35
|
+
}
|
|
36
|
+
export declare const MkDropDown: React.FC<MkDropDownProps>;
|
|
37
|
+
//# sourceMappingURL=MkDropDown.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkDropDown.d.ts","sourceRoot":"","sources":["../../src/components/MkDropDown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AACtE,OAAO,KAAK,EAAE,SAAS,EAAC,MAAM,cAAc,CAAC;AAK7C;;;;;;;;;;;;;;;;GAgBG;AAEH,MAAM,WAAW,oBAAoB;IACjC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,MAAM,WAAW,eAAe;IAC5B,OAAO,EAAE,oBAAoB,EAAE,CAAC;IAChC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC3C,iDAAiD;IACjD,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8BAA8B;IAC9B,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA0HhD,CAAC"}
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useState, useCallback, useMemo } from 'react';
|
|
3
|
+
import { View, Text, TouchableOpacity, TextInput, Modal, FlatList, StyleSheet, Pressable } from 'react-native';
|
|
4
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
5
|
+
import { tokens } from '@mk/core';
|
|
6
|
+
export const MkDropDown = ({ options, onSelect, initiator, withSearch = false, value, placeholder = 'Buscar...', style, }) => {
|
|
7
|
+
const { theme } = useMkTheme();
|
|
8
|
+
const [isOpen, setIsOpen] = useState(false);
|
|
9
|
+
const [searchTerm, setSearchTerm] = useState('');
|
|
10
|
+
const filteredOptions = useMemo(() => {
|
|
11
|
+
if (!searchTerm)
|
|
12
|
+
return options;
|
|
13
|
+
return options.filter((opt) => opt.label.toLowerCase().includes(searchTerm.toLowerCase()));
|
|
14
|
+
}, [options, searchTerm]);
|
|
15
|
+
const handleSelect = useCallback((val) => {
|
|
16
|
+
onSelect(val);
|
|
17
|
+
setIsOpen(false);
|
|
18
|
+
setSearchTerm('');
|
|
19
|
+
}, [onSelect]);
|
|
20
|
+
const handleClose = useCallback(() => {
|
|
21
|
+
setIsOpen(false);
|
|
22
|
+
setSearchTerm('');
|
|
23
|
+
}, []);
|
|
24
|
+
const renderOption = useCallback(({ item }) => (_jsxs(TouchableOpacity, { onPress: () => handleSelect(item.value), activeOpacity: 0.6, style: [
|
|
25
|
+
styles.option,
|
|
26
|
+
value === item.value && { backgroundColor: theme.primary },
|
|
27
|
+
], children: [item.icon ? _jsx(View, { style: styles.optionIcon, children: item.icon }) : null, _jsx(Text, { style: [
|
|
28
|
+
styles.optionLabel,
|
|
29
|
+
{ color: value === item.value ? theme.primaryForeground : theme.foreground },
|
|
30
|
+
], children: item.label })] })), [handleSelect, theme, value]);
|
|
31
|
+
return (_jsxs(View, { style: style, children: [_jsx(TouchableOpacity, { onPress: () => setIsOpen(true), activeOpacity: 0.6, children: initiator || (_jsx(Text, { style: { fontSize: 20, color: theme.mutedForeground, paddingHorizontal: 8 }, children: "\u22EE" })) }), _jsx(Modal, { visible: isOpen, transparent: true, animationType: "fade", onRequestClose: handleClose, children: _jsx(Pressable, { style: styles.backdrop, onPress: handleClose, children: _jsxs(Pressable, { style: [
|
|
32
|
+
styles.menu,
|
|
33
|
+
{
|
|
34
|
+
backgroundColor: theme.background,
|
|
35
|
+
borderColor: theme.border,
|
|
36
|
+
borderRadius: tokens.shared.radius,
|
|
37
|
+
},
|
|
38
|
+
], onPress: () => { }, children: [withSearch && (_jsx(View, { style: [styles.searchBox, { borderBottomColor: theme.border }], children: _jsx(TextInput, { autoFocus: true, value: searchTerm, onChangeText: setSearchTerm, placeholder: placeholder, placeholderTextColor: theme.mutedForeground, style: [
|
|
39
|
+
styles.searchInput,
|
|
40
|
+
{
|
|
41
|
+
color: theme.foreground,
|
|
42
|
+
backgroundColor: theme.muted,
|
|
43
|
+
borderColor: theme.border,
|
|
44
|
+
},
|
|
45
|
+
] }) })), filteredOptions.length > 0 ? (_jsx(FlatList, { data: filteredOptions, renderItem: renderOption, keyExtractor: (item) => String(item.value), style: styles.optionsList, showsVerticalScrollIndicator: false })) : (_jsx(View, { style: styles.empty, children: _jsx(Text, { style: { color: theme.mutedForeground, fontSize: 14 }, children: "Sin resultados" }) }))] }) }) })] }));
|
|
46
|
+
};
|
|
47
|
+
const styles = StyleSheet.create({
|
|
48
|
+
backdrop: {
|
|
49
|
+
flex: 1,
|
|
50
|
+
backgroundColor: 'rgba(0,0,0,0.35)',
|
|
51
|
+
justifyContent: 'center',
|
|
52
|
+
alignItems: 'center',
|
|
53
|
+
padding: 24,
|
|
54
|
+
},
|
|
55
|
+
menu: {
|
|
56
|
+
width: '100%',
|
|
57
|
+
maxWidth: 340,
|
|
58
|
+
maxHeight: 400,
|
|
59
|
+
borderWidth: 1,
|
|
60
|
+
overflow: 'hidden',
|
|
61
|
+
elevation: 12,
|
|
62
|
+
shadowColor: '#000',
|
|
63
|
+
shadowOpacity: 0.15,
|
|
64
|
+
shadowRadius: 16,
|
|
65
|
+
shadowOffset: { width: 0, height: 8 },
|
|
66
|
+
},
|
|
67
|
+
searchBox: { padding: 8, borderBottomWidth: 1 },
|
|
68
|
+
searchInput: { paddingHorizontal: 12, paddingVertical: 8, borderWidth: 1, borderRadius: 6, fontSize: 14 },
|
|
69
|
+
optionsList: { maxHeight: 300, padding: 4 },
|
|
70
|
+
option: {
|
|
71
|
+
flexDirection: 'row',
|
|
72
|
+
alignItems: 'center',
|
|
73
|
+
gap: 8,
|
|
74
|
+
paddingVertical: 10,
|
|
75
|
+
paddingHorizontal: 14,
|
|
76
|
+
borderRadius: 6,
|
|
77
|
+
},
|
|
78
|
+
optionIcon: { width: 20, alignItems: 'center' },
|
|
79
|
+
optionLabel: { fontSize: 14 },
|
|
80
|
+
empty: { padding: 24, alignItems: 'center' },
|
|
81
|
+
});
|
|
82
|
+
//# sourceMappingURL=MkDropDown.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkDropDown.js","sourceRoot":"","sources":["../../src/components/MkDropDown.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ViewStyle } from 'react-native';
|
|
3
|
+
export interface MkEmptyStateProps {
|
|
4
|
+
icon?: React.ReactNode;
|
|
5
|
+
title?: string;
|
|
6
|
+
description?: string;
|
|
7
|
+
action?: React.ReactNode;
|
|
8
|
+
style?: ViewStyle;
|
|
9
|
+
}
|
|
10
|
+
export declare const MkEmptyState: React.FC<MkEmptyStateProps>;
|
|
11
|
+
//# sourceMappingURL=MkEmptyState.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkEmptyState.d.ts","sourceRoot":"","sources":["../../src/components/MkEmptyState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9C,MAAM,WAAW,iBAAiB;IAC9B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAmBpD,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { View, Text, StyleSheet } from 'react-native';
|
|
3
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
4
|
+
export const MkEmptyState = ({ icon, title = 'Sin datos', description, action, style, }) => {
|
|
5
|
+
const { theme } = useMkTheme();
|
|
6
|
+
return (_jsxs(View, { style: [styles.container, style], children: [icon ? _jsx(View, { style: styles.icon, children: icon }) : (_jsx(Text, { style: styles.defaultIcon, children: "\uD83D\uDCED" })), _jsx(Text, { style: [styles.title, { color: theme.foreground }], children: title }), description ? _jsx(Text, { style: [styles.description, { color: theme.mutedForeground }], children: description }) : null, action ? _jsx(View, { style: styles.action, children: action }) : null] }));
|
|
7
|
+
};
|
|
8
|
+
const styles = StyleSheet.create({
|
|
9
|
+
container: { alignItems: 'center', justifyContent: 'center', padding: 48, gap: 8 },
|
|
10
|
+
icon: { opacity: 0.6, marginBottom: 4 },
|
|
11
|
+
defaultIcon: { fontSize: 48, opacity: 0.5, marginBottom: 4 },
|
|
12
|
+
title: { fontSize: 18, fontWeight: '600', textAlign: 'center' },
|
|
13
|
+
description: { fontSize: 14, textAlign: 'center', maxWidth: 320, lineHeight: 21 },
|
|
14
|
+
action: { marginTop: 12 },
|
|
15
|
+
});
|
|
16
|
+
//# sourceMappingURL=MkEmptyState.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkEmptyState.js","sourceRoot":"","sources":["../../src/components/MkEmptyState.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAUtD,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,EACtD,IAAI,EACJ,KAAK,GAAG,WAAW,EACnB,WAAW,EACX,MAAM,EACN,KAAK,GACR,EAAE,EAAE;IACD,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,EAAE,CAAC;IAE/B,OAAO,CACH,MAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,aACjC,IAAI,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,IAAI,YAAG,IAAI,GAAQ,CAAC,CAAC,CAAC,CAC9C,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,WAAW,6BAAW,CAC7C,EACD,KAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,CAAC,YAAG,KAAK,GAAQ,EACvE,WAAW,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,eAAe,EAAE,CAAC,YAAG,WAAW,GAAQ,CAAC,CAAC,CAAC,IAAI,EAC9G,MAAM,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,MAAM,YAAG,MAAM,GAAQ,CAAC,CAAC,CAAC,IAAI,IACzD,CACV,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC7B,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE;IAClF,IAAI,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,YAAY,EAAE,CAAC,EAAE;IACvC,WAAW,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,YAAY,EAAE,CAAC,EAAE;IAC5D,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE;IAC/D,WAAW,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,UAAU,EAAE,EAAE,EAAE;IACjF,MAAM,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE;CAC5B,CAAC,CAAC"}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ViewStyle } from 'react-native';
|
|
3
|
+
/**
|
|
4
|
+
* @module MkFileUpload (Mobile)
|
|
5
|
+
* @description 100% dependency-free file upload UI for React Native.
|
|
6
|
+
*
|
|
7
|
+
* This component has ZERO native picker dependencies — it never imports
|
|
8
|
+
* expo-image-picker, expo-document-picker, react-native-image-picker, or
|
|
9
|
+
* react-native-document-picker. It only handles UI: the tap zone, previews,
|
|
10
|
+
* file list, and error display.
|
|
11
|
+
*
|
|
12
|
+
* Use a picker adapter hook to bridge it with your preferred library:
|
|
13
|
+
* - Expo projects → `useMkFilePickerExpo` (from this package)
|
|
14
|
+
* - RN CLI projects → `useMkFilePickerCli` (from this package)
|
|
15
|
+
*
|
|
16
|
+
* @example Expo
|
|
17
|
+
* ```tsx
|
|
18
|
+
* const picker = useMkFilePickerExpo({ mediaType: 'images', multiple: true });
|
|
19
|
+
* <MkFileUpload onTap={picker.pick} onFiles={handleFiles} />
|
|
20
|
+
* ```
|
|
21
|
+
*
|
|
22
|
+
* @example RN CLI
|
|
23
|
+
* ```tsx
|
|
24
|
+
* const picker = useMkFilePickerCli({ type: ['image/*'], multiple: true });
|
|
25
|
+
* <MkFileUpload onTap={picker.pick} onFiles={handleFiles} />
|
|
26
|
+
* ```
|
|
27
|
+
*/
|
|
28
|
+
/** Normalized file result returned by picker adapters (useMkFilePickerExpo / useMkFilePickerCli). */
|
|
29
|
+
export interface MkFilePickerResult {
|
|
30
|
+
name: string;
|
|
31
|
+
uri: string;
|
|
32
|
+
type: string;
|
|
33
|
+
sizeMB?: number;
|
|
34
|
+
}
|
|
35
|
+
/** @deprecated Use MkFilePickerResult instead */
|
|
36
|
+
export type MkMobileFileInfo = MkFilePickerResult;
|
|
37
|
+
export interface MkFileInfo {
|
|
38
|
+
file?: any;
|
|
39
|
+
name: string;
|
|
40
|
+
sizeMB: number;
|
|
41
|
+
preview?: string;
|
|
42
|
+
type: string;
|
|
43
|
+
/** Mobile-only: local URI to the file */
|
|
44
|
+
uri?: string;
|
|
45
|
+
}
|
|
46
|
+
export interface MkFileUploadProps {
|
|
47
|
+
onFiles: (files: MkFileInfo[]) => void;
|
|
48
|
+
/**
|
|
49
|
+
* Called when user taps the zone. Return picked files or [].
|
|
50
|
+
* Use `useMkFilePickerExpo().pick` or `useMkFilePickerCli().pick` as the value.
|
|
51
|
+
*/
|
|
52
|
+
onTap?: () => Promise<MkFilePickerResult[]>;
|
|
53
|
+
accept?: string;
|
|
54
|
+
multiple?: boolean;
|
|
55
|
+
maxSizeMB?: number;
|
|
56
|
+
label?: string;
|
|
57
|
+
sublabel?: string;
|
|
58
|
+
disabled?: boolean;
|
|
59
|
+
error?: string;
|
|
60
|
+
style?: ViewStyle;
|
|
61
|
+
}
|
|
62
|
+
export declare const MkFileUpload: React.FC<MkFileUploadProps>;
|
|
63
|
+
//# sourceMappingURL=MkFileUpload.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkFileUpload.d.ts","sourceRoot":"","sources":["../../src/components/MkFileUpload.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9C;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,qGAAqG;AACrG,MAAM,WAAW,kBAAkB;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,iDAAiD;AACjD,MAAM,MAAM,gBAAgB,GAAG,kBAAkB,CAAC;AAElD,MAAM,WAAW,UAAU;IACvB,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,yCAAyC;IACzC,GAAG,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,iBAAiB;IAC9B,OAAO,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IACvC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,OAAO,CAAC,kBAAkB,EAAE,CAAC,CAAC;IAC5C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAkGpD,CAAC"}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback, useState } from 'react';
|
|
3
|
+
import { View, Text, TouchableOpacity, Image, StyleSheet } from 'react-native';
|
|
4
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
5
|
+
export const MkFileUpload = ({ onFiles, onTap, multiple = false, maxSizeMB = 10, label = 'Toca para seleccionar archivos', sublabel, disabled = false, error, style, }) => {
|
|
6
|
+
const { theme } = useMkTheme();
|
|
7
|
+
const [fileList, setFileList] = useState([]);
|
|
8
|
+
const [localError, setLocalError] = useState('');
|
|
9
|
+
const handleTap = useCallback(async () => {
|
|
10
|
+
if (disabled || !onTap)
|
|
11
|
+
return;
|
|
12
|
+
try {
|
|
13
|
+
const picked = await onTap();
|
|
14
|
+
if (!picked || picked.length === 0)
|
|
15
|
+
return;
|
|
16
|
+
const errored = [];
|
|
17
|
+
const results = picked
|
|
18
|
+
.filter((f) => {
|
|
19
|
+
if (f.sizeMB && f.sizeMB > maxSizeMB) {
|
|
20
|
+
errored.push(`"${f.name}" supera ${maxSizeMB}MB`);
|
|
21
|
+
return false;
|
|
22
|
+
}
|
|
23
|
+
return true;
|
|
24
|
+
})
|
|
25
|
+
.map((f) => ({
|
|
26
|
+
name: f.name,
|
|
27
|
+
sizeMB: f.sizeMB || 0,
|
|
28
|
+
type: f.type,
|
|
29
|
+
uri: f.uri,
|
|
30
|
+
preview: f.type.startsWith('image/') ? f.uri : undefined,
|
|
31
|
+
}));
|
|
32
|
+
if (errored.length > 0) {
|
|
33
|
+
setLocalError(errored.join('. '));
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
setLocalError('');
|
|
37
|
+
const next = multiple ? [...fileList, ...results] : results;
|
|
38
|
+
setFileList(next);
|
|
39
|
+
onFiles(next);
|
|
40
|
+
}
|
|
41
|
+
catch (e) {
|
|
42
|
+
setLocalError('Error al seleccionar archivo');
|
|
43
|
+
}
|
|
44
|
+
}, [disabled, onTap, multiple, fileList, maxSizeMB, onFiles]);
|
|
45
|
+
const removeFile = useCallback((idx) => {
|
|
46
|
+
const next = fileList.filter((_, i) => i !== idx);
|
|
47
|
+
setFileList(next);
|
|
48
|
+
onFiles(next);
|
|
49
|
+
}, [fileList, onFiles]);
|
|
50
|
+
const displayedError = error || localError;
|
|
51
|
+
return (_jsxs(View, { style: style, children: [_jsxs(TouchableOpacity, { onPress: handleTap, disabled: disabled, activeOpacity: 0.7, style: [
|
|
52
|
+
styles.dropzone,
|
|
53
|
+
{ borderColor: displayedError ? '#ef4444' : theme.border, backgroundColor: theme.muted },
|
|
54
|
+
disabled && { opacity: 0.5 },
|
|
55
|
+
], children: [_jsx(Text, { style: styles.icon, children: "\uD83D\uDCC2" }), _jsx(Text, { style: [styles.label, { color: theme.foreground }], children: label }), _jsx(Text, { style: [styles.sublabel, { color: theme.mutedForeground }], children: sublabel || `Máx. ${maxSizeMB}MB` })] }), !!displayedError && (_jsx(Text, { style: styles.error, children: displayedError })), fileList.length > 0 && (_jsx(View, { style: styles.list, children: fileList.map((f, idx) => (_jsxs(View, { style: [styles.item, { borderColor: theme.border, backgroundColor: theme.muted }], children: [f.preview
|
|
56
|
+
? _jsx(Image, { source: { uri: f.preview }, style: styles.thumb })
|
|
57
|
+
: _jsx(Text, { style: styles.docIcon, children: "\uD83D\uDCC4" }), _jsx(Text, { style: [styles.name, { color: theme.foreground }], numberOfLines: 1, children: f.name }), _jsxs(Text, { style: [styles.size, { color: theme.mutedForeground }], children: ["(", f.sizeMB.toFixed(1), "MB)"] }), _jsx(TouchableOpacity, { onPress: () => removeFile(idx), hitSlop: { top: 8, bottom: 8, left: 8, right: 8 }, children: _jsx(Text, { style: { color: theme.mutedForeground, fontSize: 14 }, children: "\u2715" }) })] }, `${f.name}-${idx}`))) }))] }));
|
|
58
|
+
};
|
|
59
|
+
const styles = StyleSheet.create({
|
|
60
|
+
dropzone: {
|
|
61
|
+
alignItems: 'center',
|
|
62
|
+
justifyContent: 'center',
|
|
63
|
+
padding: 32,
|
|
64
|
+
borderWidth: 2,
|
|
65
|
+
borderStyle: 'dashed',
|
|
66
|
+
borderRadius: 12,
|
|
67
|
+
gap: 6,
|
|
68
|
+
},
|
|
69
|
+
icon: { fontSize: 32, opacity: 0.7 },
|
|
70
|
+
label: { fontSize: 15, fontWeight: '500', textAlign: 'center' },
|
|
71
|
+
sublabel: { fontSize: 13, textAlign: 'center' },
|
|
72
|
+
error: { fontSize: 13, color: '#ef4444', fontWeight: '500', marginTop: 6 },
|
|
73
|
+
list: { gap: 8, marginTop: 8 },
|
|
74
|
+
item: { flexDirection: 'row', alignItems: 'center', gap: 10, padding: 10, borderWidth: 1, borderRadius: 8 },
|
|
75
|
+
thumb: { width: 36, height: 36, borderRadius: 4 },
|
|
76
|
+
docIcon: { fontSize: 24 },
|
|
77
|
+
name: { flex: 1, fontSize: 13 },
|
|
78
|
+
size: { fontSize: 11 },
|
|
79
|
+
});
|
|
80
|
+
//# sourceMappingURL=MkFileUpload.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkFileUpload.js","sourceRoot":"","sources":["../../src/components/MkFileUpload.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { SvgProps } from 'react-native-svg';
|
|
3
|
+
export interface MkIconProps extends SvgProps {
|
|
4
|
+
size?: number | string;
|
|
5
|
+
color?: string;
|
|
6
|
+
variant?: 'primary' | 'muted' | 'error' | string;
|
|
7
|
+
}
|
|
8
|
+
export declare const MkIconWrap: React.FC<MkIconProps>;
|
|
9
|
+
export declare const IconArrowDown: (props: MkIconProps) => React.JSX.Element;
|
|
10
|
+
export declare const IconCheck: (props: MkIconProps) => React.JSX.Element;
|
|
11
|
+
export declare const IconTrash: (props: MkIconProps) => React.JSX.Element;
|
|
12
|
+
export declare const IconEdit: (props: MkIconProps) => React.JSX.Element;
|
|
13
|
+
export declare const IconClose: (props: MkIconProps) => React.JSX.Element;
|
|
14
|
+
export declare const Icon3Dots: (props: MkIconProps) => React.JSX.Element;
|
|
15
|
+
//# sourceMappingURL=MkIcons.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkIcons.d.ts","sourceRoot":"","sources":["../../src/components/MkIcons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIjD,MAAM,WAAW,WAAY,SAAQ,QAAQ;IACzC,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;CACpD;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAqC5C,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,OAAO,WAAW,sBAE/C,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,OAAO,WAAW,sBAE3C,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,OAAO,WAAW,sBAK3C,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,OAAO,WAAW,sBAK1C,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,OAAO,WAAW,sBAK3C,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,OAAO,WAAW,sBAM3C,CAAC"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
12
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
import Svg, { Path, Polyline, Line, Circle } from 'react-native-svg';
|
|
14
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
15
|
+
export const MkIconWrap = (_a) => {
|
|
16
|
+
var { children, size = 24, color, variant, style } = _a, props = __rest(_a, ["children", "size", "color", "variant", "style"]);
|
|
17
|
+
const { theme } = useMkTheme();
|
|
18
|
+
const getVariantColor = (v) => {
|
|
19
|
+
switch (v) {
|
|
20
|
+
case 'primary': return theme.primary;
|
|
21
|
+
case 'muted': return theme.mutedForeground;
|
|
22
|
+
case 'error': return theme.error;
|
|
23
|
+
default: return theme.foreground;
|
|
24
|
+
}
|
|
25
|
+
};
|
|
26
|
+
const finalColor = color || getVariantColor(variant);
|
|
27
|
+
return (_jsx(Svg, Object.assign({ width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: finalColor, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", style: style }, props, { children: children })));
|
|
28
|
+
};
|
|
29
|
+
export const IconArrowDown = (props) => (_jsx(MkIconWrap, Object.assign({}, props, { children: _jsx(Polyline, { points: "6 9 12 15 18 9" }) })));
|
|
30
|
+
export const IconCheck = (props) => (_jsx(MkIconWrap, Object.assign({}, props, { children: _jsx(Polyline, { points: "20 6 9 17 4 12" }) })));
|
|
31
|
+
export const IconTrash = (props) => (_jsxs(MkIconWrap, Object.assign({}, props, { children: [_jsx(Polyline, { points: "3 6 5 6 21 6" }), _jsx(Path, { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })] })));
|
|
32
|
+
export const IconEdit = (props) => (_jsxs(MkIconWrap, Object.assign({}, props, { children: [_jsx(Path, { d: "M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" }), _jsx(Path, { d: "M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z" })] })));
|
|
33
|
+
export const IconClose = (props) => (_jsxs(MkIconWrap, Object.assign({}, props, { children: [_jsx(Line, { x1: "18", y1: "6", x2: "6", y2: "18" }), _jsx(Line, { x1: "6", y1: "6", x2: "18", y2: "18" })] })));
|
|
34
|
+
export const Icon3Dots = (props) => (_jsxs(MkIconWrap, Object.assign({}, props, { children: [_jsx(Circle, { cx: "12", cy: "12", r: "1" }), _jsx(Circle, { cx: "19", cy: "12", r: "1" }), _jsx(Circle, { cx: "5", cy: "12", r: "1" })] })));
|
|
35
|
+
//# sourceMappingURL=MkIcons.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkIcons.js","sourceRoot":"","sources":["../../src/components/MkIcons.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface MkInfiniteListProps<T> {
|
|
3
|
+
items: T[];
|
|
4
|
+
renderItem: ({ item, index }: {
|
|
5
|
+
item: T;
|
|
6
|
+
index: number;
|
|
7
|
+
}) => React.ReactElement | null;
|
|
8
|
+
loading?: boolean;
|
|
9
|
+
isRefreshing?: boolean;
|
|
10
|
+
hasMore?: boolean;
|
|
11
|
+
onLoadMore: () => void;
|
|
12
|
+
onRefresh: () => void;
|
|
13
|
+
emptyMessage?: string;
|
|
14
|
+
estimatedItemSize?: number;
|
|
15
|
+
}
|
|
16
|
+
/**
|
|
17
|
+
* MkInfiniteList (Mobile)
|
|
18
|
+
* Optimized for React Native using best practices:
|
|
19
|
+
* Virtualization, memory management, and Batching.
|
|
20
|
+
*/
|
|
21
|
+
export declare function MkInfiniteList<T>({ items, renderItem, loading, isRefreshing, hasMore, onLoadMore, onRefresh, emptyMessage, estimatedItemSize }: MkInfiniteListProps<T>): React.JSX.Element;
|
|
22
|
+
//# sourceMappingURL=MkInfiniteList.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkInfiniteList.d.ts","sourceRoot":"","sources":["../../src/components/MkInfiniteList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AASpD,MAAM,WAAW,mBAAmB,CAAC,CAAC;IAClC,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,UAAU,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE;QAAE,IAAI,EAAE,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;IACvF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,CAAC,EAAE,EAC9B,KAAK,EACL,UAAU,EACV,OAAO,EACP,YAAY,EACZ,OAAO,EACP,UAAU,EACV,SAAS,EACT,YAAyC,EACzC,iBAAuB,EAC1B,EAAE,mBAAmB,CAAC,CAAC,CAAC,qBA0DxB"}
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback } from 'react';
|
|
3
|
+
import { FlashList } from '@shopify/flash-list';
|
|
4
|
+
import { ActivityIndicator, View, Text, RefreshControl, StyleSheet } from 'react-native';
|
|
5
|
+
/**
|
|
6
|
+
* MkInfiniteList (Mobile)
|
|
7
|
+
* Optimized for React Native using best practices:
|
|
8
|
+
* Virtualization, memory management, and Batching.
|
|
9
|
+
*/
|
|
10
|
+
export function MkInfiniteList({ items, renderItem, loading, isRefreshing, hasMore, onLoadMore, onRefresh, emptyMessage = "No se encontraron datos.", estimatedItemSize = 100 }) {
|
|
11
|
+
const renderFooter = useCallback(() => {
|
|
12
|
+
if (!loading || isRefreshing)
|
|
13
|
+
return null;
|
|
14
|
+
return (_jsx(View, { style: styles.footer, children: _jsx(ActivityIndicator, { size: "small", color: "#3b82f6" }) }));
|
|
15
|
+
}, [loading, isRefreshing]);
|
|
16
|
+
const renderEmpty = useCallback(() => {
|
|
17
|
+
if (loading)
|
|
18
|
+
return null;
|
|
19
|
+
return (_jsx(View, { style: styles.emptyContainer, children: _jsx(Text, { style: styles.emptyText, children: emptyMessage }) }));
|
|
20
|
+
}, [loading, emptyMessage]);
|
|
21
|
+
return (_jsx(FlashList, { data: items, renderItem: renderItem, estimatedItemSize: estimatedItemSize, keyExtractor: (item, index) => {
|
|
22
|
+
if (item && typeof item === 'object') {
|
|
23
|
+
if (item.id !== undefined && item.id !== null)
|
|
24
|
+
return String(item.id);
|
|
25
|
+
if (item.uuid !== undefined && item.uuid !== null)
|
|
26
|
+
return String(item.uuid);
|
|
27
|
+
if (item.key !== undefined && item.key !== null)
|
|
28
|
+
return String(item.key);
|
|
29
|
+
}
|
|
30
|
+
return `mk-item-${index}`;
|
|
31
|
+
},
|
|
32
|
+
// Optimization Props
|
|
33
|
+
removeClippedSubviews: true,
|
|
34
|
+
// Interaction Props
|
|
35
|
+
onEndReached: onLoadMore, onEndReachedThreshold: 0.5,
|
|
36
|
+
// Feedback Components
|
|
37
|
+
ListFooterComponent: renderFooter, ListEmptyComponent: renderEmpty,
|
|
38
|
+
// Pull to Refresh
|
|
39
|
+
refreshControl: _jsx(RefreshControl, { refreshing: isRefreshing === true, onRefresh: onRefresh, colors: ['#3b82f6'], tintColor: "#3b82f6" // iOS
|
|
40
|
+
}),
|
|
41
|
+
// Standard spacing
|
|
42
|
+
contentContainerStyle: styles.content }));
|
|
43
|
+
}
|
|
44
|
+
const styles = StyleSheet.create({
|
|
45
|
+
content: {
|
|
46
|
+
paddingVertical: 16,
|
|
47
|
+
},
|
|
48
|
+
footer: {
|
|
49
|
+
padding: 20,
|
|
50
|
+
alignItems: 'center',
|
|
51
|
+
},
|
|
52
|
+
emptyContainer: {
|
|
53
|
+
padding: 50,
|
|
54
|
+
alignItems: 'center',
|
|
55
|
+
},
|
|
56
|
+
emptyText: {
|
|
57
|
+
color: '#64748b',
|
|
58
|
+
fontSize: 14,
|
|
59
|
+
textAlign: 'center',
|
|
60
|
+
}
|
|
61
|
+
});
|
|
62
|
+
//# sourceMappingURL=MkInfiniteList.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkInfiniteList.js","sourceRoot":"","sources":["../../src/components/MkInfiniteList.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,WAAW,EAAW,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAAO,EACH,iBAAiB,EACjB,IAAI,EACJ,IAAI,EACJ,cAAc,EACd,UAAU,EACb,MAAM,cAAc,CAAC;AActB;;;;GAIG;AACH,MAAM,UAAU,cAAc,CAAI,EAC9B,KAAK,EACL,UAAU,EACV,OAAO,EACP,YAAY,EACZ,OAAO,EACP,UAAU,EACV,SAAS,EACT,YAAY,GAAG,0BAA0B,EACzC,iBAAiB,GAAG,GAAG,EACF;IAErB,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE;QAClC,IAAI,CAAC,OAAO,IAAI,YAAY;YAAE,OAAO,IAAI,CAAC;QAC1C,OAAO,CACH,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,MAAM,YACtB,KAAC,iBAAiB,IAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,SAAS,GAAG,GAC/C,CACV,CAAC;IACN,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC;IAE5B,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACjC,IAAI,OAAO;YAAE,OAAO,IAAI,CAAC;QACzB,OAAO,CACH,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,cAAc,YAC9B,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,SAAS,YAAG,YAAY,GAAQ,GACjD,CACV,CAAC;IACN,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC;IAE5B,OAAO,CACH,KAAC,SAAS,IACN,IAAI,EAAE,KAAK,EACX,UAAU,EAAE,UAAU,EACtB,iBAAiB,EAAE,iBAAiB,EACpC,YAAY,EAAE,CAAC,IAAS,EAAE,KAAK,EAAE,EAAE;YAC/B,IAAI,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE,CAAC;gBACnC,IAAI,IAAI,CAAC,EAAE,KAAK,SAAS,IAAI,IAAI,CAAC,EAAE,KAAK,IAAI;oBAAE,OAAO,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;gBACtE,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,IAAI;oBAAE,OAAO,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;gBAC5E,IAAI,IAAI,CAAC,GAAG,KAAK,SAAS,IAAI,IAAI,CAAC,GAAG,KAAK,IAAI;oBAAE,OAAO,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YAC7E,CAAC;YACD,OAAO,WAAW,KAAK,EAAE,CAAC;QAC9B,CAAC;QACD,qBAAqB;QACrB,qBAAqB,EAAE,IAAI;QAE3B,oBAAoB;QACpB,YAAY,EAAE,UAAU,EACxB,qBAAqB,EAAE,GAAG;QAE1B,sBAAsB;QACtB,mBAAmB,EAAE,YAAY,EACjC,kBAAkB,EAAE,WAAW;QAE/B,kBAAkB;QAClB,cAAc,EACV,KAAC,cAAc,IACX,UAAU,EAAE,YAAY,KAAK,IAAI,EACjC,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,CAAC,SAAS,CAAC,EACnB,SAAS,EAAC,SAAS,CAAG,MAAM;WAC9B;QAGN,mBAAmB;QACnB,qBAAqB,EAAE,MAAM,CAAC,OAAO,GACvC,CACL,CAAC;AACN,CAAC;AAED,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC7B,OAAO,EAAE;QACL,eAAe,EAAE,EAAE;KACtB;IACD,MAAM,EAAE;QACJ,OAAO,EAAE,EAAE;QACX,UAAU,EAAE,QAAQ;KACvB;IACD,cAAc,EAAE;QACZ,OAAO,EAAE,EAAE;QACX,UAAU,EAAE,QAAQ;KACvB;IACD,SAAS,EAAE;QACP,KAAK,EAAE,SAAS;QAChB,QAAQ,EAAE,EAAE;QACZ,SAAS,EAAE,QAAQ;KACtB;CACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
interface MkInputProps {
|
|
3
|
+
label?: string;
|
|
4
|
+
error?: string;
|
|
5
|
+
success?: boolean;
|
|
6
|
+
helperText?: string;
|
|
7
|
+
placeholder?: string;
|
|
8
|
+
value?: string;
|
|
9
|
+
iconLeft?: React.ReactNode;
|
|
10
|
+
iconRight?: React.ReactNode;
|
|
11
|
+
onChangeText?: (text: string) => void;
|
|
12
|
+
secureTextEntry?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare const MkInput: React.FC<MkInputProps>;
|
|
15
|
+
export {};
|
|
16
|
+
//# sourceMappingURL=MkInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkInput.d.ts","sourceRoot":"","sources":["../../src/components/MkInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,YAAY;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAyC1C,CAAC"}
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
12
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
import { View, TextInput, Text, StyleSheet } from 'react-native';
|
|
14
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
15
|
+
import { tokens } from '@mk/core';
|
|
16
|
+
export const MkInput = (_a) => {
|
|
17
|
+
var { label, error, success, helperText, iconLeft, iconRight } = _a, props = __rest(_a, ["label", "error", "success", "helperText", "iconLeft", "iconRight"]);
|
|
18
|
+
const { theme } = useMkTheme();
|
|
19
|
+
return (_jsxs(View, { style: styles.container, children: [label && _jsx(Text, { style: [styles.label, { color: theme.foreground }], children: label }), _jsxs(View, { style: [
|
|
20
|
+
styles.wrapper,
|
|
21
|
+
{
|
|
22
|
+
backgroundColor: theme.background,
|
|
23
|
+
borderColor: error ? theme.error : success ? theme.success : theme.border
|
|
24
|
+
}
|
|
25
|
+
], children: [iconLeft && _jsx(View, { style: styles.icon, children: iconLeft }), _jsx(TextInput, Object.assign({ style: [
|
|
26
|
+
styles.input,
|
|
27
|
+
{ color: theme.foreground }
|
|
28
|
+
], placeholderTextColor: theme.mutedForeground }, props)), iconRight && _jsx(View, { style: styles.icon, children: iconRight })] }), error ? (_jsx(Text, { style: [styles.errorText, { color: theme.error }], children: error })) : helperText ? (_jsx(Text, { style: [styles.helperText, { color: theme.mutedForeground }], children: helperText })) : null] }));
|
|
29
|
+
};
|
|
30
|
+
const styles = StyleSheet.create({
|
|
31
|
+
container: {
|
|
32
|
+
gap: 6,
|
|
33
|
+
marginBottom: 12,
|
|
34
|
+
},
|
|
35
|
+
label: {
|
|
36
|
+
fontSize: 14,
|
|
37
|
+
fontWeight: '500',
|
|
38
|
+
opacity: 0.9,
|
|
39
|
+
},
|
|
40
|
+
input: {
|
|
41
|
+
flex: 1,
|
|
42
|
+
height: 48,
|
|
43
|
+
paddingHorizontal: 12,
|
|
44
|
+
fontSize: 16,
|
|
45
|
+
},
|
|
46
|
+
wrapper: {
|
|
47
|
+
flexDirection: 'row',
|
|
48
|
+
alignItems: 'center',
|
|
49
|
+
borderWidth: 1,
|
|
50
|
+
borderRadius: tokens.shared.radius,
|
|
51
|
+
},
|
|
52
|
+
icon: {
|
|
53
|
+
paddingHorizontal: 12,
|
|
54
|
+
justifyContent: 'center',
|
|
55
|
+
alignItems: 'center',
|
|
56
|
+
},
|
|
57
|
+
errorText: {
|
|
58
|
+
fontSize: 12,
|
|
59
|
+
fontWeight: '500',
|
|
60
|
+
},
|
|
61
|
+
helperText: {
|
|
62
|
+
fontSize: 12,
|
|
63
|
+
opacity: 0.8,
|
|
64
|
+
}
|
|
65
|
+
});
|
|
66
|
+
//# sourceMappingURL=MkInput.js.map
|