@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 @@
|
|
|
1
|
+
{"version":3,"file":"MkInput.js","sourceRoot":"","sources":["../../src/components/MkInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ViewStyle } from 'react-native';
|
|
3
|
+
export interface MkLoadingProps {
|
|
4
|
+
visible?: boolean;
|
|
5
|
+
label?: string;
|
|
6
|
+
size?: 'sm' | 'md' | 'lg';
|
|
7
|
+
overlay?: boolean;
|
|
8
|
+
color?: string;
|
|
9
|
+
style?: ViewStyle;
|
|
10
|
+
}
|
|
11
|
+
export declare const MkLoading: React.FC<MkLoadingProps>;
|
|
12
|
+
//# sourceMappingURL=MkLoading.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkLoading.d.ts","sourceRoot":"","sources":["../../src/components/MkLoading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9C,MAAM,WAAW,cAAc;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAID,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA4B9C,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { View, Text, ActivityIndicator, StyleSheet, Modal } from 'react-native';
|
|
3
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
4
|
+
const RN_SIZES = { sm: 'small', md: 'small', lg: 'large' };
|
|
5
|
+
export const MkLoading = ({ visible = true, label, size = 'md', overlay = false, color, style, }) => {
|
|
6
|
+
const { theme } = useMkTheme();
|
|
7
|
+
if (!visible)
|
|
8
|
+
return null;
|
|
9
|
+
const indicator = (_jsxs(View, { style: [styles.wrapper, style], children: [_jsx(ActivityIndicator, { size: RN_SIZES[size], color: color || theme.primary }), label ? _jsx(Text, { style: [styles.label, { color: theme.mutedForeground }], children: label }) : null] }));
|
|
10
|
+
if (overlay) {
|
|
11
|
+
return (_jsx(Modal, { transparent: true, visible: true, animationType: "fade", children: _jsx(View, { style: styles.overlay, children: indicator }) }));
|
|
12
|
+
}
|
|
13
|
+
return indicator;
|
|
14
|
+
};
|
|
15
|
+
const styles = StyleSheet.create({
|
|
16
|
+
wrapper: { alignItems: 'center', justifyContent: 'center', gap: 12, padding: 16 },
|
|
17
|
+
label: { fontSize: 13 },
|
|
18
|
+
overlay: { flex: 1, alignItems: 'center', justifyContent: 'center', backgroundColor: 'rgba(0,0,0,0.3)' },
|
|
19
|
+
});
|
|
20
|
+
//# sourceMappingURL=MkLoading.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkLoading.js","sourceRoot":"","sources":["../../src/components/MkLoading.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,iBAAiB,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAChF,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAWtD,MAAM,QAAQ,GAAsC,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC;AAE9F,MAAM,CAAC,MAAM,SAAS,GAA6B,CAAC,EAChD,OAAO,GAAG,IAAI,EACd,KAAK,EACL,IAAI,GAAG,IAAI,EACX,OAAO,GAAG,KAAK,EACf,KAAK,EACL,KAAK,GACR,EAAE,EAAE;IACD,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,EAAE,CAAC;IAE/B,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAC;IAE1B,MAAM,SAAS,GAAG,CACd,MAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,KAAK,CAAC,aAChC,KAAC,iBAAiB,IAAC,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,IAAI,KAAK,CAAC,OAAO,GAAI,EACzE,KAAK,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,eAAe,EAAE,CAAC,YAAG,KAAK,GAAQ,CAAC,CAAC,CAAC,IAAI,IAC1F,CACV,CAAC;IAEF,IAAI,OAAO,EAAE,CAAC;QACV,OAAO,CACH,KAAC,KAAK,IAAC,WAAW,QAAC,OAAO,QAAC,aAAa,EAAC,MAAM,YAC3C,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,YAAG,SAAS,GAAQ,GAC3C,CACX,CAAC;IACN,CAAC;IAED,OAAO,SAAS,CAAC;AACrB,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC7B,OAAO,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,EAAE,GAAG,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE;IACjF,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE;IACvB,OAAO,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,EAAE,eAAe,EAAE,iBAAiB,EAAE;CAC3G,CAAC,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface MkModalProps {
|
|
3
|
+
isOpen: boolean;
|
|
4
|
+
onClose: () => void;
|
|
5
|
+
title?: string;
|
|
6
|
+
children: React.ReactNode;
|
|
7
|
+
confirmText?: string;
|
|
8
|
+
cancelText?: string;
|
|
9
|
+
onConfirm?: () => void;
|
|
10
|
+
showCancel?: boolean;
|
|
11
|
+
variant?: 'default' | 'destructive' | 'warning' | 'success';
|
|
12
|
+
size?: 'sm' | 'md' | 'lg' | 'full';
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* MkModal (Mobile)
|
|
16
|
+
* 🚀 Parity with Web version using React Native's <Modal>.
|
|
17
|
+
* Features backdrop blur and smooth slide-up animation.
|
|
18
|
+
*/
|
|
19
|
+
export declare const MkModal: React.FC<MkModalProps>;
|
|
20
|
+
//# sourceMappingURL=MkModal.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkModal.d.ts","sourceRoot":"","sources":["../../src/components/MkModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,MAAM,WAAW,YAAY;IACzB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,GAAG,SAAS,GAAG,SAAS,CAAC;IAE5D,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;CACtC;AAED;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAsE1C,CAAC"}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Modal, View, Text, TouchableOpacity, StyleSheet, ScrollView, Dimensions, Platform } from 'react-native';
|
|
3
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
4
|
+
import { MkButton } from './MkButton';
|
|
5
|
+
/**
|
|
6
|
+
* MkModal (Mobile)
|
|
7
|
+
* 🚀 Parity with Web version using React Native's <Modal>.
|
|
8
|
+
* Features backdrop blur and smooth slide-up animation.
|
|
9
|
+
*/
|
|
10
|
+
export const MkModal = ({ isOpen, onClose, title, children, confirmText, cancelText = 'Cancelar', onConfirm, showCancel = true, variant = 'default', size = 'md' }) => {
|
|
11
|
+
const { theme } = useMkTheme();
|
|
12
|
+
return (_jsx(Modal, { visible: isOpen, transparent: true, animationType: "slide", onRequestClose: onClose, children: _jsxs(View, { style: styles.overlay, children: [_jsx(TouchableOpacity, { style: styles.backdrop, activeOpacity: 1, onPress: onClose }), _jsxs(View, { style: [
|
|
13
|
+
styles.container,
|
|
14
|
+
{ backgroundColor: theme.background, borderColor: theme.border },
|
|
15
|
+
size === 'full' ? styles.fullSize : styles.standardSize
|
|
16
|
+
], children: [_jsxs(View, { style: [styles.header, { borderBottomColor: theme.border }], children: [title ? _jsx(Text, { style: [styles.title, { color: theme.foreground }], children: title }) : _jsx(View, {}), _jsx(TouchableOpacity, { onPress: onClose, children: _jsx(Text, { style: [styles.closeX, { color: theme.mutedForeground }], children: "\u2715" }) })] }), _jsx(ScrollView, { style: styles.content, children: typeof children === 'string' ? (_jsx(Text, { style: { color: theme.foreground, lineHeight: 22 }, children: children })) : children }), (onConfirm || showCancel) && (_jsxs(View, { style: [styles.footer, {
|
|
17
|
+
backgroundColor: Platform.OS === 'ios' ? theme.background : theme.muted,
|
|
18
|
+
borderTopColor: theme.border
|
|
19
|
+
}], children: [showCancel && (_jsx(View, { style: { flex: 1, marginRight: 8 }, children: _jsx(MkButton, { variant: "outline", onPress: onClose, label: cancelText }) })), onConfirm && (_jsx(View, { style: { flex: 1 }, children: _jsx(MkButton, { variant: variant === 'destructive' ? 'error' : 'primary', onPress: onConfirm, label: confirmText || 'Aceptar' }) }))] }))] })] }) }));
|
|
20
|
+
};
|
|
21
|
+
const { height, width } = Dimensions.get('window');
|
|
22
|
+
const styles = StyleSheet.create({
|
|
23
|
+
overlay: {
|
|
24
|
+
flex: 1,
|
|
25
|
+
justifyContent: 'flex-end', // Slide from bottom
|
|
26
|
+
backgroundColor: 'rgba(0,0,0,0.5)',
|
|
27
|
+
},
|
|
28
|
+
backdrop: Object.assign({}, StyleSheet.absoluteFill),
|
|
29
|
+
container: {
|
|
30
|
+
borderTopLeftRadius: 24,
|
|
31
|
+
borderTopRightRadius: 24,
|
|
32
|
+
borderWidth: 1,
|
|
33
|
+
elevation: 5,
|
|
34
|
+
shadowColor: '#000',
|
|
35
|
+
shadowOffset: { width: 0, height: -2 },
|
|
36
|
+
shadowOpacity: 0.1,
|
|
37
|
+
shadowRadius: 10,
|
|
38
|
+
},
|
|
39
|
+
standardSize: {
|
|
40
|
+
maxHeight: height * 0.8,
|
|
41
|
+
},
|
|
42
|
+
fullSize: {
|
|
43
|
+
height: height,
|
|
44
|
+
borderRadius: 0,
|
|
45
|
+
},
|
|
46
|
+
header: {
|
|
47
|
+
flexDirection: 'row',
|
|
48
|
+
justifyContent: 'space-between',
|
|
49
|
+
alignItems: 'center',
|
|
50
|
+
padding: 20,
|
|
51
|
+
borderBottomWidth: 1,
|
|
52
|
+
},
|
|
53
|
+
title: {
|
|
54
|
+
fontSize: 18,
|
|
55
|
+
fontWeight: 'bold',
|
|
56
|
+
},
|
|
57
|
+
closeX: {
|
|
58
|
+
fontSize: 24,
|
|
59
|
+
fontWeight: '300',
|
|
60
|
+
},
|
|
61
|
+
content: {
|
|
62
|
+
padding: 20,
|
|
63
|
+
},
|
|
64
|
+
footer: {
|
|
65
|
+
flexDirection: 'row',
|
|
66
|
+
padding: 16,
|
|
67
|
+
paddingBottom: Platform.OS === 'ios' ? 32 : 16, // SafeArea fallback
|
|
68
|
+
borderTopWidth: 1,
|
|
69
|
+
}
|
|
70
|
+
});
|
|
71
|
+
//# sourceMappingURL=MkModal.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkModal.js","sourceRoot":"","sources":["../../src/components/MkModal.tsx"],"names":[],"mappings":";AACA,OAAO,EACH,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,UAAU,EACV,QAAQ,EACX,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAgBtC;;;;GAIG;AACH,MAAM,CAAC,MAAM,OAAO,GAA2B,CAAC,EAC5C,MAAM,EACN,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAAW,EACX,UAAU,GAAG,UAAU,EACvB,SAAS,EACT,UAAU,GAAG,IAAI,EACjB,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,IAAI,EACd,EAAE,EAAE;IACD,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,EAAE,CAAC;IAE/B,OAAO,CACH,KAAC,KAAK,IACF,OAAO,EAAE,MAAM,EACf,WAAW,EAAE,IAAI,EACjB,aAAa,EAAC,OAAO,EACrB,cAAc,EAAE,OAAO,YAEvB,MAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,aACvB,KAAC,gBAAgB,IACb,KAAK,EAAE,MAAM,CAAC,QAAQ,EACtB,aAAa,EAAE,CAAC,EAChB,OAAO,EAAE,OAAO,GAClB,EACF,MAAC,IAAI,IAAC,KAAK,EAAE;wBACT,MAAM,CAAC,SAAS;wBAChB,EAAE,eAAe,EAAE,KAAK,CAAC,UAAU,EAAE,WAAW,EAAE,KAAK,CAAC,MAAM,EAAE;wBAChE,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,YAAY;qBAC1D,aACG,MAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,iBAAiB,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC,aAC5D,KAAK,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,CAAC,YAAG,KAAK,GAAQ,CAAC,CAAC,CAAC,KAAC,IAAI,KAAG,EAC5F,KAAC,gBAAgB,IAAC,OAAO,EAAE,OAAO,YAC9B,KAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,eAAe,EAAE,CAAC,uBAAU,GACzD,IAChB,EAEP,KAAC,UAAU,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,YAC5B,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC5B,KAAC,IAAI,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,UAAU,EAAE,EAAE,EAAE,YAAG,QAAQ,GAAQ,CAC9E,CAAC,CAAC,CAAC,QAAQ,GACH,EAEZ,CAAC,SAAS,IAAI,UAAU,CAAC,IAAI,CAC1B,MAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE;oCACzB,eAAe,EAAE,QAAQ,CAAC,EAAE,KAAK,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK;oCACvE,cAAc,EAAE,KAAK,CAAC,MAAM;iCAC/B,CAAC,aACG,UAAU,IAAI,CACX,KAAC,IAAI,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,WAAW,EAAE,CAAC,EAAE,YACpC,KAAC,QAAQ,IAAC,OAAO,EAAC,SAAS,EAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,GAAI,GAChE,CACV,EACA,SAAS,IAAI,CACV,KAAC,IAAI,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YACpB,KAAC,QAAQ,IACL,OAAO,EAAE,OAAO,KAAK,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EACxD,OAAO,EAAE,SAAS,EAClB,KAAK,EAAE,WAAW,IAAI,SAAS,GACjC,GACC,CACV,IACE,CACV,IACE,IACJ,GACH,CACX,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;AAEnD,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC7B,OAAO,EAAE;QACL,IAAI,EAAE,CAAC;QACP,cAAc,EAAE,UAAU,EAAE,oBAAoB;QAChD,eAAe,EAAE,iBAAiB;KACrC;IACD,QAAQ,oBACD,UAAU,CAAC,YAAY,CAC7B;IACD,SAAS,EAAE;QACP,mBAAmB,EAAE,EAAE;QACvB,oBAAoB,EAAE,EAAE;QACxB,WAAW,EAAE,CAAC;QACd,SAAS,EAAE,CAAC;QACZ,WAAW,EAAE,MAAM;QACnB,YAAY,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,EAAE;QACtC,aAAa,EAAE,GAAG;QAClB,YAAY,EAAE,EAAE;KACnB;IACD,YAAY,EAAE;QACV,SAAS,EAAE,MAAM,GAAG,GAAG;KAC1B;IACD,QAAQ,EAAE;QACN,MAAM,EAAE,MAAM;QACd,YAAY,EAAE,CAAC;KAClB;IACD,MAAM,EAAE;QACJ,aAAa,EAAE,KAAK;QACpB,cAAc,EAAE,eAAe;QAC/B,UAAU,EAAE,QAAQ;QACpB,OAAO,EAAE,EAAE;QACX,iBAAiB,EAAE,CAAC;KACvB;IACD,KAAK,EAAE;QACH,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,MAAM;KACrB;IACD,MAAM,EAAE;QACJ,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,KAAK;KACpB;IACD,OAAO,EAAE;QACL,OAAO,EAAE,EAAE;KACd;IACD,MAAM,EAAE;QACJ,aAAa,EAAE,KAAK;QACpB,OAAO,EAAE,EAAE;QACX,aAAa,EAAE,QAAQ,CAAC,EAAE,KAAK,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,oBAAoB;QACpE,cAAc,EAAE,CAAC;KACpB;CACJ,CAAC,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ViewStyle } from 'react-native';
|
|
3
|
+
export interface MkProgressBarProps {
|
|
4
|
+
value: number;
|
|
5
|
+
max?: number;
|
|
6
|
+
label?: string;
|
|
7
|
+
showPercent?: boolean;
|
|
8
|
+
variant?: 'primary' | 'success' | 'warning' | 'error' | 'info';
|
|
9
|
+
size?: 'sm' | 'md' | 'lg';
|
|
10
|
+
style?: ViewStyle;
|
|
11
|
+
}
|
|
12
|
+
export declare const MkProgressBar: React.FC<MkProgressBarProps>;
|
|
13
|
+
//# sourceMappingURL=MkProgressBar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkProgressBar.d.ts","sourceRoot":"","sources":["../../src/components/MkProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9C,MAAM,WAAW,kBAAkB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;IAC/D,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAYD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA2BtD,CAAC"}
|
|
@@ -0,0 +1,27 @@
|
|
|
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 VARIANT_COLORS = {
|
|
5
|
+
primary: '', // will use theme.primary
|
|
6
|
+
success: '#22c55e',
|
|
7
|
+
warning: '#f59e0b',
|
|
8
|
+
error: '#ef4444',
|
|
9
|
+
info: '#3b82f6',
|
|
10
|
+
};
|
|
11
|
+
const SIZE_HEIGHT = { sm: 4, md: 8, lg: 12 };
|
|
12
|
+
export const MkProgressBar = ({ value, max = 100, label, showPercent = false, variant = 'primary', size = 'md', style, }) => {
|
|
13
|
+
const { theme } = useMkTheme();
|
|
14
|
+
const percent = Math.min(Math.max((value / max) * 100, 0), 100);
|
|
15
|
+
const barColor = variant === 'primary' ? theme.primary : VARIANT_COLORS[variant];
|
|
16
|
+
const height = SIZE_HEIGHT[size];
|
|
17
|
+
return (_jsxs(View, { style: [styles.container, style], children: [(label || showPercent) ? (_jsxs(View, { style: styles.header, children: [label ? _jsx(Text, { style: [styles.label, { color: theme.foreground }], children: label }) : _jsx(View, {}), showPercent ? _jsxs(Text, { style: [styles.percent, { color: theme.mutedForeground }], children: [Math.round(percent), "%"] }) : null] })) : null, _jsx(View, { style: [styles.track, { height, backgroundColor: theme.muted }], children: _jsx(View, { style: [styles.bar, { width: `${percent}%`, backgroundColor: barColor, height }] }) })] }));
|
|
18
|
+
};
|
|
19
|
+
const styles = StyleSheet.create({
|
|
20
|
+
container: { gap: 6, width: '100%' },
|
|
21
|
+
header: { flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' },
|
|
22
|
+
label: { fontSize: 13, fontWeight: '500' },
|
|
23
|
+
percent: { fontSize: 12, fontWeight: '600' },
|
|
24
|
+
track: { borderRadius: 999, overflow: 'hidden' },
|
|
25
|
+
bar: { borderRadius: 999 },
|
|
26
|
+
});
|
|
27
|
+
//# sourceMappingURL=MkProgressBar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkProgressBar.js","sourceRoot":"","sources":["../../src/components/MkProgressBar.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ViewStyle } from 'react-native';
|
|
3
|
+
export interface MkRadioOption {
|
|
4
|
+
value: string | number;
|
|
5
|
+
label: string;
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
}
|
|
8
|
+
export interface MkRadioProps {
|
|
9
|
+
label?: string;
|
|
10
|
+
options: MkRadioOption[];
|
|
11
|
+
value?: string | number | null;
|
|
12
|
+
onChange?: (value: string | number) => void;
|
|
13
|
+
direction?: 'horizontal' | 'vertical';
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
error?: string;
|
|
16
|
+
size?: 'sm' | 'md' | 'lg';
|
|
17
|
+
style?: ViewStyle;
|
|
18
|
+
}
|
|
19
|
+
export declare const MkRadio: React.FC<MkRadioProps>;
|
|
20
|
+
//# sourceMappingURL=MkRadio.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkRadio.d.ts","sourceRoot":"","sources":["../../src/components/MkRadio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9C,MAAM,WAAW,aAAa;IAC1B,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,YAAY;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,aAAa,EAAE,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAID,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAsD1C,CAAC"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback } from 'react';
|
|
3
|
+
import { View, Text, Pressable, StyleSheet } from 'react-native';
|
|
4
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
5
|
+
const SIZES = { sm: 16, md: 20, lg: 24 };
|
|
6
|
+
export const MkRadio = ({ label, options, value, onChange, direction = 'vertical', disabled = false, error, size = 'md', style, }) => {
|
|
7
|
+
const { theme } = useMkTheme();
|
|
8
|
+
const boxSize = SIZES[size];
|
|
9
|
+
const dotSize = boxSize * 0.5;
|
|
10
|
+
const handleSelect = useCallback((optValue) => { if (!disabled)
|
|
11
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(optValue); }, [disabled, onChange]);
|
|
12
|
+
return (_jsxs(View, { style: [styles.container, style], children: [label ? _jsx(Text, { style: [styles.groupLabel, { color: theme.foreground }], children: label }) : null, _jsx(View, { style: [styles.options, direction === 'horizontal' && styles.horizontal], children: options.map((opt) => {
|
|
13
|
+
const isSelected = value === opt.value;
|
|
14
|
+
const isDisabled = disabled || opt.disabled;
|
|
15
|
+
return (_jsxs(Pressable, { onPress: () => handleSelect(opt.value), disabled: isDisabled, style: ({ pressed }) => [
|
|
16
|
+
styles.option,
|
|
17
|
+
isDisabled && { opacity: 0.5 },
|
|
18
|
+
pressed && { opacity: 0.7 },
|
|
19
|
+
], children: [_jsx(View, { style: [
|
|
20
|
+
styles.radio,
|
|
21
|
+
{ width: boxSize, height: boxSize, borderColor: error ? theme.error : isSelected ? theme.primary : theme.border },
|
|
22
|
+
], children: isSelected && (_jsx(View, { style: { width: dotSize, height: dotSize, borderRadius: dotSize / 2, backgroundColor: theme.primary } })) }), _jsx(Text, { style: [styles.text, { color: theme.foreground }], children: opt.label })] }, String(opt.value)));
|
|
23
|
+
}) }), error ? _jsx(Text, { style: [styles.errorText, { color: theme.error }], children: error }) : null] }));
|
|
24
|
+
};
|
|
25
|
+
const styles = StyleSheet.create({
|
|
26
|
+
container: { gap: 6 },
|
|
27
|
+
groupLabel: { fontSize: 14, fontWeight: '500', opacity: 0.9 },
|
|
28
|
+
options: { gap: 12 },
|
|
29
|
+
horizontal: { flexDirection: 'row', flexWrap: 'wrap' },
|
|
30
|
+
option: { flexDirection: 'row', alignItems: 'center', gap: 8 },
|
|
31
|
+
radio: { borderWidth: 2, borderRadius: 999, alignItems: 'center', justifyContent: 'center' },
|
|
32
|
+
text: { fontSize: 14 },
|
|
33
|
+
errorText: { fontSize: 12, fontWeight: '500' },
|
|
34
|
+
});
|
|
35
|
+
//# sourceMappingURL=MkRadio.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkRadio.js","sourceRoot":"","sources":["../../src/components/MkRadio.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ViewStyle } from 'react-native';
|
|
3
|
+
/**
|
|
4
|
+
* @module MkSearchInput (Mobile)
|
|
5
|
+
* @description Search input with integrated debounce. Same API as mk-web.
|
|
6
|
+
*/
|
|
7
|
+
export interface MkSearchInputProps {
|
|
8
|
+
onSearch: (term: string) => void;
|
|
9
|
+
delay?: number;
|
|
10
|
+
placeholder?: string;
|
|
11
|
+
value?: string;
|
|
12
|
+
defaultValue?: string;
|
|
13
|
+
size?: 'sm' | 'md' | 'lg';
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
loading?: boolean;
|
|
16
|
+
clearable?: boolean;
|
|
17
|
+
style?: ViewStyle;
|
|
18
|
+
autoFocus?: boolean;
|
|
19
|
+
}
|
|
20
|
+
export declare const MkSearchInput: React.FC<MkSearchInputProps>;
|
|
21
|
+
//# sourceMappingURL=MkSearchInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkSearchInput.d.ts","sourceRoot":"","sources":["../../src/components/MkSearchInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAC7D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAK9C;;;GAGG;AAEH,MAAM,WAAW,kBAAkB;IAC/B,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB;AAKD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAoEtD,CAAC"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import React, { useCallback, useRef, useState } from 'react';
|
|
3
|
+
import { View, TextInput, TouchableOpacity, Text, ActivityIndicator, StyleSheet } from 'react-native';
|
|
4
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
5
|
+
import { useMkDebounce } from '../hooks/useMkDebounce';
|
|
6
|
+
const SIZE_HEIGHT = { sm: 36, md: 44, lg: 52 };
|
|
7
|
+
const SIZE_FONT = { sm: 13, md: 14, lg: 16 };
|
|
8
|
+
export const MkSearchInput = ({ onSearch, delay = 350, placeholder = 'Buscar...', value, defaultValue = '', size = 'md', disabled = false, loading = false, clearable = true, style, autoFocus = false, }) => {
|
|
9
|
+
const { theme } = useMkTheme();
|
|
10
|
+
const [internalValue, setInternalValue] = useState(defaultValue);
|
|
11
|
+
const inputValue = value !== undefined ? value : internalValue;
|
|
12
|
+
const debouncedTerm = useMkDebounce(inputValue, delay);
|
|
13
|
+
const prevTermRef = useRef('');
|
|
14
|
+
React.useEffect(() => {
|
|
15
|
+
if (debouncedTerm !== prevTermRef.current) {
|
|
16
|
+
prevTermRef.current = debouncedTerm;
|
|
17
|
+
onSearch(debouncedTerm);
|
|
18
|
+
}
|
|
19
|
+
}, [debouncedTerm, onSearch]);
|
|
20
|
+
const handleChange = useCallback((text) => {
|
|
21
|
+
setInternalValue(text);
|
|
22
|
+
}, []);
|
|
23
|
+
const handleClear = useCallback(() => {
|
|
24
|
+
setInternalValue('');
|
|
25
|
+
onSearch('');
|
|
26
|
+
}, [onSearch]);
|
|
27
|
+
const height = SIZE_HEIGHT[size];
|
|
28
|
+
const fontSize = SIZE_FONT[size];
|
|
29
|
+
const hasValue = inputValue.length > 0;
|
|
30
|
+
return (_jsxs(View, { style: [
|
|
31
|
+
styles.wrapper,
|
|
32
|
+
{ height, backgroundColor: theme.muted, borderColor: theme.border, borderRadius: 999, opacity: disabled ? 0.5 : 1 },
|
|
33
|
+
style,
|
|
34
|
+
], children: [_jsx(View, { style: styles.icon, children: loading
|
|
35
|
+
? _jsx(ActivityIndicator, { size: "small", color: theme.mutedForeground })
|
|
36
|
+
: _jsx(Text, { style: { color: theme.mutedForeground, fontSize: 16 }, children: "\uD83D\uDD0D" }) }), _jsx(TextInput, { value: inputValue, onChangeText: handleChange, placeholder: placeholder, placeholderTextColor: theme.mutedForeground, editable: !disabled, autoFocus: autoFocus, style: [styles.input, { fontSize, color: theme.foreground }], returnKeyType: "search" }), clearable && hasValue && !disabled && (_jsx(TouchableOpacity, { onPress: handleClear, style: styles.clearBtn, hitSlop: { top: 8, bottom: 8, left: 8, right: 8 }, children: _jsx(Text, { style: { color: theme.mutedForeground, fontSize: 14, fontWeight: '600' }, children: "\u2715" }) }))] }));
|
|
37
|
+
};
|
|
38
|
+
const styles = StyleSheet.create({
|
|
39
|
+
wrapper: { flexDirection: 'row', alignItems: 'center', borderWidth: 1, paddingHorizontal: 12, gap: 8 },
|
|
40
|
+
icon: { width: 20, alignItems: 'center' },
|
|
41
|
+
input: { flex: 1, padding: 0 },
|
|
42
|
+
clearBtn: { padding: 4 },
|
|
43
|
+
});
|
|
44
|
+
//# sourceMappingURL=MkSearchInput.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkSearchInput.js","sourceRoot":"","sources":["../../src/components/MkSearchInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
interface Option {
|
|
3
|
+
label: string;
|
|
4
|
+
value: string | number;
|
|
5
|
+
}
|
|
6
|
+
interface MkSelectProps {
|
|
7
|
+
label?: string;
|
|
8
|
+
error?: string;
|
|
9
|
+
options: Option[];
|
|
10
|
+
value?: string | number;
|
|
11
|
+
placeholder?: string;
|
|
12
|
+
onSelect: (value: string | number) => void;
|
|
13
|
+
}
|
|
14
|
+
export declare const MkSelect: React.FC<MkSelectProps>;
|
|
15
|
+
export {};
|
|
16
|
+
//# sourceMappingURL=MkSelect.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkSelect.d.ts","sourceRoot":"","sources":["../../src/components/MkSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAMxC,UAAU,MAAM;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,UAAU,aAAa;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAiE5C,CAAC"}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useState } from 'react';
|
|
3
|
+
import { View, Text, TouchableOpacity, Modal, FlatList, StyleSheet, Pressable } from 'react-native';
|
|
4
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
5
|
+
import { tokens } from '@mk/core';
|
|
6
|
+
import { IconArrowDown, IconCheck } from './MkIcons';
|
|
7
|
+
export const MkSelect = ({ label, error, options = [], value, placeholder = "Seleccionar...", onSelect }) => {
|
|
8
|
+
const { theme } = useMkTheme();
|
|
9
|
+
const [modalVisible, setModalVisible] = useState(false);
|
|
10
|
+
const selectedOption = options.find(o => o.value === value);
|
|
11
|
+
const handleSelect = (val) => {
|
|
12
|
+
onSelect(val);
|
|
13
|
+
setModalVisible(false);
|
|
14
|
+
};
|
|
15
|
+
return (_jsxs(View, { style: styles.container, children: [label && _jsx(Text, { style: [styles.label, { color: theme.foreground }], children: label }), _jsxs(TouchableOpacity, { style: [styles.trigger, { backgroundColor: theme.background, borderColor: error ? theme.error : theme.border }], onPress: () => setModalVisible(true), children: [_jsx(Text, { style: [styles.triggerText, { color: selectedOption ? theme.foreground : theme.mutedForeground }], children: selectedOption ? selectedOption.label : placeholder }), _jsx(IconArrowDown, { size: 18, color: theme.mutedForeground })] }), error && _jsx(Text, { style: [styles.errorText, { color: theme.error }], children: error }), _jsx(Modal, { visible: modalVisible, transparent: true, animationType: "fade", onRequestClose: () => setModalVisible(false), children: _jsx(Pressable, { style: styles.overlay, onPress: () => setModalVisible(false), children: _jsxs(View, { style: [styles.modalContent, { backgroundColor: theme.background }], children: [_jsx(View, { style: [styles.modalHeader, { borderBottomColor: theme.border }], children: _jsx(Text, { style: [styles.modalTitle, { color: theme.foreground }], children: label || 'Opciones' }) }), _jsx(FlatList, { data: options, keyExtractor: (item) => String(item.value), renderItem: ({ item }) => (_jsxs(TouchableOpacity, { style: [styles.option, { borderBottomColor: theme.border }], onPress: () => handleSelect(item.value), children: [_jsx(Text, { style: [styles.optionText, { color: item.value === value ? theme.primary : theme.foreground }], children: item.label }), item.value === value && _jsx(IconCheck, { size: 20, color: theme.primary })] })) })] }) }) })] }));
|
|
16
|
+
};
|
|
17
|
+
const styles = StyleSheet.create({
|
|
18
|
+
container: {
|
|
19
|
+
gap: 6,
|
|
20
|
+
marginBottom: 12,
|
|
21
|
+
},
|
|
22
|
+
label: {
|
|
23
|
+
fontSize: 14,
|
|
24
|
+
fontWeight: '500',
|
|
25
|
+
opacity: 0.9,
|
|
26
|
+
},
|
|
27
|
+
trigger: {
|
|
28
|
+
height: 48,
|
|
29
|
+
borderWidth: 1,
|
|
30
|
+
borderRadius: tokens.shared.radius,
|
|
31
|
+
paddingHorizontal: 12,
|
|
32
|
+
flexDirection: 'row',
|
|
33
|
+
alignItems: 'center',
|
|
34
|
+
justifyContent: 'space-between',
|
|
35
|
+
},
|
|
36
|
+
triggerText: {
|
|
37
|
+
fontSize: 16,
|
|
38
|
+
},
|
|
39
|
+
overlay: {
|
|
40
|
+
flex: 1,
|
|
41
|
+
backgroundColor: 'rgba(0,0,0,0.5)',
|
|
42
|
+
justifyContent: 'flex-end',
|
|
43
|
+
},
|
|
44
|
+
modalContent: {
|
|
45
|
+
borderTopLeftRadius: 20,
|
|
46
|
+
borderTopRightRadius: 20,
|
|
47
|
+
paddingBottom: 40,
|
|
48
|
+
maxHeight: '70%',
|
|
49
|
+
},
|
|
50
|
+
modalHeader: {
|
|
51
|
+
padding: 20,
|
|
52
|
+
borderBottomWidth: 1,
|
|
53
|
+
alignItems: 'center',
|
|
54
|
+
},
|
|
55
|
+
modalTitle: {
|
|
56
|
+
fontSize: 18,
|
|
57
|
+
fontWeight: '700',
|
|
58
|
+
},
|
|
59
|
+
option: {
|
|
60
|
+
padding: 20,
|
|
61
|
+
flexDirection: 'row',
|
|
62
|
+
alignItems: 'center',
|
|
63
|
+
justifyContent: 'space-between',
|
|
64
|
+
borderBottomWidth: 0.5,
|
|
65
|
+
},
|
|
66
|
+
optionText: {
|
|
67
|
+
fontSize: 16,
|
|
68
|
+
},
|
|
69
|
+
errorText: {
|
|
70
|
+
fontSize: 12,
|
|
71
|
+
fontWeight: '500',
|
|
72
|
+
marginTop: 2,
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
//# sourceMappingURL=MkSelect.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkSelect.js","sourceRoot":"","sources":["../../src/components/MkSelect.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ViewStyle } from 'react-native';
|
|
3
|
+
export interface MkSkeletonProps {
|
|
4
|
+
variant?: 'text' | 'circle' | 'rect';
|
|
5
|
+
width?: number | string;
|
|
6
|
+
height?: number;
|
|
7
|
+
lines?: number;
|
|
8
|
+
gap?: number;
|
|
9
|
+
radius?: number;
|
|
10
|
+
style?: ViewStyle;
|
|
11
|
+
}
|
|
12
|
+
export declare const MkSkeleton: React.FC<MkSkeletonProps>;
|
|
13
|
+
//# sourceMappingURL=MkSkeleton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkSkeleton.d.ts","sourceRoot":"","sources":["../../src/components/MkSkeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG9C,MAAM,WAAW,eAAe;IAC5B,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;IACrC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAmBD,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAgChD,CAAC"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useRef } from 'react';
|
|
3
|
+
import { View, Animated, StyleSheet } from 'react-native';
|
|
4
|
+
const ShimmerBox = ({ style }) => {
|
|
5
|
+
const opacity = useRef(new Animated.Value(0.3)).current;
|
|
6
|
+
useEffect(() => {
|
|
7
|
+
const animation = Animated.loop(Animated.sequence([
|
|
8
|
+
Animated.timing(opacity, { toValue: 1, duration: 750, useNativeDriver: true }),
|
|
9
|
+
Animated.timing(opacity, { toValue: 0.3, duration: 750, useNativeDriver: true }),
|
|
10
|
+
]));
|
|
11
|
+
animation.start();
|
|
12
|
+
return () => animation.stop();
|
|
13
|
+
}, [opacity]);
|
|
14
|
+
return _jsx(Animated.View, { style: [styles.skeleton, style, { opacity }] });
|
|
15
|
+
};
|
|
16
|
+
export const MkSkeleton = ({ variant = 'text', width = '100%', height, lines = 1, gap = 8, radius, style, }) => {
|
|
17
|
+
if (variant === 'circle') {
|
|
18
|
+
const size = typeof width === 'number' ? width : 40;
|
|
19
|
+
return _jsx(ShimmerBox, { style: Object.assign({ width: size, height: size, borderRadius: size / 2 }, style) });
|
|
20
|
+
}
|
|
21
|
+
if (variant === 'rect') {
|
|
22
|
+
return _jsx(ShimmerBox, { style: Object.assign({ width: width, height: height || 80, borderRadius: radius !== null && radius !== void 0 ? radius : 8 }, style) });
|
|
23
|
+
}
|
|
24
|
+
if (lines <= 1) {
|
|
25
|
+
return _jsx(ShimmerBox, { style: Object.assign({ width: width, height: height || 14, borderRadius: radius !== null && radius !== void 0 ? radius : 4 }, style) });
|
|
26
|
+
}
|
|
27
|
+
return (_jsx(View, { style: [{ gap }, style], children: Array.from({ length: lines }).map((_, i) => (_jsx(ShimmerBox, { style: { width: i === lines - 1 ? '70%' : '100%', height: height || 14, borderRadius: radius !== null && radius !== void 0 ? radius : 4 } }, i))) }));
|
|
28
|
+
};
|
|
29
|
+
const styles = StyleSheet.create({
|
|
30
|
+
skeleton: { backgroundColor: '#e2e8f0' },
|
|
31
|
+
});
|
|
32
|
+
//# sourceMappingURL=MkSkeleton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkSkeleton.js","sourceRoot":"","sources":["../../src/components/MkSkeleton.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAY1D,MAAM,UAAU,GAAmC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC7D,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC;IAExD,SAAS,CAAC,GAAG,EAAE;QACX,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAC3B,QAAQ,CAAC,QAAQ,CAAC;YACd,QAAQ,CAAC,MAAM,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,eAAe,EAAE,IAAI,EAAE,CAAC;YAC9E,QAAQ,CAAC,MAAM,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,eAAe,EAAE,IAAI,EAAE,CAAC;SACnF,CAAC,CACL,CAAC;QACF,SAAS,CAAC,KAAK,EAAE,CAAC;QAClB,OAAO,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;IAClC,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,KAAC,QAAQ,CAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,QAAQ,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,GAAI,CAAC;AAC3E,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAA8B,CAAC,EAClD,OAAO,GAAG,MAAM,EAChB,KAAK,GAAG,MAAM,EACd,MAAM,EACN,KAAK,GAAG,CAAC,EACT,GAAG,GAAG,CAAC,EACP,MAAM,EACN,KAAK,GACR,EAAE,EAAE;IACD,IAAI,OAAO,KAAK,QAAQ,EAAE,CAAC;QACvB,MAAM,IAAI,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;QACpD,OAAO,KAAC,UAAU,IAAC,KAAK,kBAAI,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,GAAG,CAAC,IAAM,KAAa,IAAM,CAAC;IAC3G,CAAC;IAED,IAAI,OAAO,KAAK,MAAM,EAAE,CAAC;QACrB,OAAO,KAAC,UAAU,IAAC,KAAK,kBAAI,KAAK,EAAE,KAAY,EAAE,MAAM,EAAE,MAAM,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,CAAC,IAAM,KAAa,IAAM,CAAC;IAC9H,CAAC;IAED,IAAI,KAAK,IAAI,CAAC,EAAE,CAAC;QACb,OAAO,KAAC,UAAU,IAAC,KAAK,kBAAI,KAAK,EAAE,KAAY,EAAE,MAAM,EAAE,MAAM,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,CAAC,IAAM,KAAa,IAAM,CAAC;IAC9H,CAAC;IAED,OAAO,CACH,KAAC,IAAI,IAAC,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,KAAK,CAAC,YACxB,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACzC,KAAC,UAAU,IAEP,KAAK,EAAE,EAAE,KAAK,EAAE,CAAC,KAAK,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,CAAC,EAAE,IAD9F,CAAC,CAER,CACL,CAAC,GACC,CACV,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC7B,QAAQ,EAAE,EAAE,eAAe,EAAE,SAAS,EAAE;CAC3C,CAAC,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ViewStyle } from 'react-native';
|
|
3
|
+
export interface MkSwitchProps {
|
|
4
|
+
label?: string;
|
|
5
|
+
checked?: boolean;
|
|
6
|
+
onChange?: (checked: boolean) => void;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
size?: 'sm' | 'md' | 'lg';
|
|
9
|
+
error?: string;
|
|
10
|
+
style?: ViewStyle;
|
|
11
|
+
}
|
|
12
|
+
export declare const MkSwitch: React.FC<MkSwitchProps>;
|
|
13
|
+
//# sourceMappingURL=MkSwitch.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MkSwitch.d.ts","sourceRoot":"","sources":["../../src/components/MkSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9C,MAAM,WAAW,aAAa;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB;AAQD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAsF5C,CAAC"}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback, useRef, useEffect } from 'react';
|
|
3
|
+
import { Pressable, View, Text, StyleSheet, Animated } from 'react-native';
|
|
4
|
+
import { useMkTheme } from '../theme/MkThemeProvider';
|
|
5
|
+
const SIZES = {
|
|
6
|
+
sm: { track: { w: 32, h: 18 }, thumb: 14 },
|
|
7
|
+
md: { track: { w: 40, h: 22 }, thumb: 18 },
|
|
8
|
+
lg: { track: { w: 48, h: 26 }, thumb: 22 },
|
|
9
|
+
};
|
|
10
|
+
export const MkSwitch = ({ label, checked = false, onChange, disabled = false, size = 'md', error, style, }) => {
|
|
11
|
+
const { theme } = useMkTheme();
|
|
12
|
+
const dim = SIZES[size];
|
|
13
|
+
const animatedValue = useRef(new Animated.Value(checked ? 1 : 0)).current;
|
|
14
|
+
useEffect(() => {
|
|
15
|
+
Animated.spring(animatedValue, {
|
|
16
|
+
toValue: checked ? 1 : 0,
|
|
17
|
+
useNativeDriver: true,
|
|
18
|
+
bounciness: 4,
|
|
19
|
+
speed: 14,
|
|
20
|
+
}).start();
|
|
21
|
+
}, [checked]);
|
|
22
|
+
const handlePress = useCallback(() => {
|
|
23
|
+
if (!disabled)
|
|
24
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(!checked);
|
|
25
|
+
}, [checked, disabled, onChange]);
|
|
26
|
+
const translateX = animatedValue.interpolate({
|
|
27
|
+
inputRange: [0, 1],
|
|
28
|
+
outputRange: [0, dim.track.w - dim.thumb - 4],
|
|
29
|
+
});
|
|
30
|
+
const activeOpacity = animatedValue;
|
|
31
|
+
return (_jsxs(View, { style: [styles.container, style], children: [_jsxs(Pressable, { onPress: handlePress, disabled: disabled, style: ({ pressed }) => [
|
|
32
|
+
styles.row,
|
|
33
|
+
disabled && { opacity: 0.5 },
|
|
34
|
+
pressed && { opacity: 0.8 },
|
|
35
|
+
], children: [_jsxs(View, { style: [
|
|
36
|
+
styles.track,
|
|
37
|
+
{
|
|
38
|
+
width: dim.track.w,
|
|
39
|
+
height: dim.track.h,
|
|
40
|
+
backgroundColor: theme.muted,
|
|
41
|
+
borderColor: error ? theme.error : 'transparent',
|
|
42
|
+
borderWidth: error ? 2 : 0,
|
|
43
|
+
},
|
|
44
|
+
], children: [_jsx(Animated.View, { style: [
|
|
45
|
+
StyleSheet.absoluteFill,
|
|
46
|
+
{
|
|
47
|
+
backgroundColor: theme.primary,
|
|
48
|
+
opacity: activeOpacity,
|
|
49
|
+
borderRadius: 999,
|
|
50
|
+
},
|
|
51
|
+
] }), _jsx(Animated.View, { style: [
|
|
52
|
+
styles.thumb,
|
|
53
|
+
{
|
|
54
|
+
width: dim.thumb,
|
|
55
|
+
height: dim.thumb,
|
|
56
|
+
transform: [{ translateX }],
|
|
57
|
+
},
|
|
58
|
+
] })] }), label ? _jsx(Text, { style: [styles.text, { color: theme.foreground }], children: label }) : null] }), error ? _jsx(Text, { style: [styles.errorText, { color: theme.error }], children: error }) : null] }));
|
|
59
|
+
};
|
|
60
|
+
const styles = StyleSheet.create({
|
|
61
|
+
container: { gap: 4 },
|
|
62
|
+
row: { flexDirection: 'row', alignItems: 'center', gap: 10 },
|
|
63
|
+
track: { borderRadius: 999, justifyContent: 'center', paddingHorizontal: 2, overflow: 'hidden' },
|
|
64
|
+
thumb: { backgroundColor: '#fff', borderRadius: 999, elevation: 2, shadowColor: '#000', shadowOpacity: 0.15, shadowRadius: 2, shadowOffset: { width: 0, height: 1 } },
|
|
65
|
+
text: { fontSize: 14 },
|
|
66
|
+
errorText: { fontSize: 12, fontWeight: '500', marginLeft: 50 },
|
|
67
|
+
});
|
|
68
|
+
//# sourceMappingURL=MkSwitch.js.map
|