@umituz/react-native-design-system 1.4.1 → 1.4.3
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/lib/index.d.ts +2 -3
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +2 -3
- package/lib/index.js.map +1 -1
- package/lib/presentation/atoms/AtomicButton.d.ts +0 -1
- package/lib/presentation/atoms/AtomicButton.d.ts.map +1 -1
- package/lib/presentation/atoms/AtomicButton.js +6 -9
- package/lib/presentation/atoms/AtomicButton.js.map +1 -1
- package/lib/presentation/atoms/AtomicFab.d.ts +0 -1
- package/lib/presentation/atoms/AtomicFab.d.ts.map +1 -1
- package/lib/presentation/atoms/AtomicFab.js +4 -5
- package/lib/presentation/atoms/AtomicFab.js.map +1 -1
- package/lib/presentation/atoms/AtomicProgress.d.ts +0 -3
- package/lib/presentation/atoms/AtomicProgress.d.ts.map +1 -1
- package/lib/presentation/atoms/AtomicProgress.js +1 -2
- package/lib/presentation/atoms/AtomicProgress.js.map +1 -1
- package/lib/presentation/atoms/AtomicTouchable.d.ts +1 -11
- package/lib/presentation/atoms/AtomicTouchable.d.ts.map +1 -1
- package/lib/presentation/atoms/AtomicTouchable.js +6 -19
- package/lib/presentation/atoms/AtomicTouchable.js.map +1 -1
- package/lib/presentation/atoms/fab/types/index.d.ts +0 -5
- package/lib/presentation/atoms/fab/types/index.d.ts.map +1 -1
- package/lib/presentation/atoms/index.d.ts +1 -4
- package/lib/presentation/atoms/index.d.ts.map +1 -1
- package/lib/presentation/atoms/index.js +0 -3
- package/lib/presentation/atoms/index.js.map +1 -1
- package/lib/presentation/atoms/touchable/styles/touchableStyles.d.ts +0 -5
- package/lib/presentation/atoms/touchable/styles/touchableStyles.d.ts.map +1 -1
- package/lib/presentation/atoms/touchable/styles/touchableStyles.js +0 -8
- package/lib/presentation/atoms/touchable/styles/touchableStyles.js.map +1 -1
- package/lib/presentation/atoms/touchable/types/index.d.ts +1 -7
- package/lib/presentation/atoms/touchable/types/index.d.ts.map +1 -1
- package/lib/presentation/organisms/ScreenLayout.d.ts +0 -15
- package/lib/presentation/organisms/ScreenLayout.d.ts.map +1 -1
- package/lib/presentation/organisms/ScreenLayout.js +1 -10
- package/lib/presentation/organisms/ScreenLayout.js.map +1 -1
- package/lib/presentation/tokens/AppDesignTokens.d.ts +1 -1
- package/lib/presentation/tokens/AppDesignTokens.d.ts.map +1 -1
- package/lib/presentation/tokens/AppDesignTokens.js +1 -1
- package/lib/presentation/tokens/AppDesignTokens.js.map +1 -1
- package/lib/presentation/tokens/core/BaseTokens.d.ts +0 -25
- package/lib/presentation/tokens/core/BaseTokens.d.ts.map +1 -1
- package/lib/presentation/tokens/core/BaseTokens.js +1 -16
- package/lib/presentation/tokens/core/BaseTokens.js.map +1 -1
- package/lib/presentation/tokens/core/TokenFactory.d.ts +2 -15
- package/lib/presentation/tokens/core/TokenFactory.d.ts.map +1 -1
- package/lib/presentation/tokens/core/TokenFactory.js +1 -2
- package/lib/presentation/tokens/core/TokenFactory.js.map +1 -1
- package/package.json +1 -1
- package/src/index.ts +1 -4
- package/src/presentation/atoms/AtomicButton.tsx +5 -16
- package/src/presentation/atoms/AtomicFab.tsx +3 -9
- package/src/presentation/atoms/AtomicProgress.tsx +0 -4
- package/src/presentation/atoms/AtomicTouchable.tsx +3 -27
- package/src/presentation/atoms/fab/types/index.ts +0 -6
- package/src/presentation/atoms/index.ts +0 -12
- package/src/presentation/atoms/touchable/styles/touchableStyles.ts +0 -9
- package/src/presentation/atoms/touchable/types/index.ts +1 -8
- package/src/presentation/organisms/ScreenLayout.tsx +0 -40
- package/src/presentation/tokens/AppDesignTokens.ts +0 -2
- package/src/presentation/tokens/core/BaseTokens.ts +1 -19
- package/src/presentation/tokens/core/TokenFactory.ts +2 -4
- package/lib/presentation/atoms/AtomicSkeleton.d.ts +0 -37
- package/lib/presentation/atoms/AtomicSkeleton.d.ts.map +0 -1
- package/lib/presentation/atoms/AtomicSkeleton.js +0 -53
- package/lib/presentation/atoms/AtomicSkeleton.js.map +0 -1
- package/lib/presentation/loading/presentation/components/LoadingState.d.ts +0 -39
- package/lib/presentation/loading/presentation/components/LoadingState.d.ts.map +0 -1
- package/lib/presentation/loading/presentation/components/LoadingState.js +0 -123
- package/lib/presentation/loading/presentation/components/LoadingState.js.map +0 -1
- package/src/presentation/atoms/AtomicSkeleton.tsx +0 -95
- package/src/presentation/loading/presentation/components/LoadingState.tsx +0 -200
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/atoms/touchable/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAE3E;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE5E;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAE9D;;;GAGG;AACH,MAAM,WAAW,OAAO;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/atoms/touchable/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAE3E;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE5E;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAE9D;;;GAGG;AACH,MAAM,WAAW,OAAO;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAEjD;;OAEG;IACH,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAEnD;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAEpD;;OAEG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAErD;;;OAGG;IACH,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAE7B;;;OAGG;IACH,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAE5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAE3B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAEpC;;OAEG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAErC;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;IAE/C;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB"}
|
|
@@ -4,7 +4,6 @@
|
|
|
4
4
|
* Provides consistent layout structure for all screens:
|
|
5
5
|
* - SafeAreaView with configurable edges
|
|
6
6
|
* - Optional ScrollView for content
|
|
7
|
-
* - Loading state support
|
|
8
7
|
* - Theme-aware background colors
|
|
9
8
|
* - Optional header/footer slots
|
|
10
9
|
* - Consistent spacing and padding
|
|
@@ -17,7 +16,6 @@
|
|
|
17
16
|
* Advanced:
|
|
18
17
|
* <ScreenLayout
|
|
19
18
|
* scrollable={false}
|
|
20
|
-
* loading={isLoading}
|
|
21
19
|
* edges={['top', 'bottom']}
|
|
22
20
|
* header={<CustomHeader />}
|
|
23
21
|
* >
|
|
@@ -45,19 +43,6 @@ export interface ScreenLayoutProps {
|
|
|
45
43
|
* - [] - No safe area (use cautiously)
|
|
46
44
|
*/
|
|
47
45
|
edges?: Edge[];
|
|
48
|
-
/**
|
|
49
|
-
* Show loading state
|
|
50
|
-
* When true, displays LoadingState component
|
|
51
|
-
*/
|
|
52
|
-
loading?: boolean;
|
|
53
|
-
/**
|
|
54
|
-
* Loading icon name (default: 'settings')
|
|
55
|
-
*/
|
|
56
|
-
loadingIcon?: string;
|
|
57
|
-
/**
|
|
58
|
-
* Loading message (default: 'Loading...')
|
|
59
|
-
*/
|
|
60
|
-
loadingMessage?: string;
|
|
61
46
|
/**
|
|
62
47
|
* Optional header component
|
|
63
48
|
* Rendered above scrollable content
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScreenLayout.d.ts","sourceRoot":"","sources":["../../../src/presentation/organisms/ScreenLayout.tsx"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"ScreenLayout.d.ts","sourceRoot":"","sources":["../../../src/presentation/organisms/ScreenLayout.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAgC,SAAS,EAAE,MAAM,cAAc,CAAC;AACvE,OAAO,EAAgB,IAAI,EAAE,MAAM,gCAAgC,CAAC;AAGpE,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;IAEf;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC;IAE3B;;OAEG;IACH,qBAAqB,CAAC,EAAE,SAAS,CAAC;IAElC;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAE5B;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAuDpD,CAAC"}
|
|
@@ -4,7 +4,6 @@
|
|
|
4
4
|
* Provides consistent layout structure for all screens:
|
|
5
5
|
* - SafeAreaView with configurable edges
|
|
6
6
|
* - Optional ScrollView for content
|
|
7
|
-
* - Loading state support
|
|
8
7
|
* - Theme-aware background colors
|
|
9
8
|
* - Optional header/footer slots
|
|
10
9
|
* - Consistent spacing and padding
|
|
@@ -17,7 +16,6 @@
|
|
|
17
16
|
* Advanced:
|
|
18
17
|
* <ScreenLayout
|
|
19
18
|
* scrollable={false}
|
|
20
|
-
* loading={isLoading}
|
|
21
19
|
* edges={['top', 'bottom']}
|
|
22
20
|
* header={<CustomHeader />}
|
|
23
21
|
* >
|
|
@@ -28,18 +26,11 @@ import React, { useMemo } from 'react';
|
|
|
28
26
|
import { View, ScrollView, StyleSheet } from 'react-native';
|
|
29
27
|
import { SafeAreaView } from 'react-native-safe-area-context';
|
|
30
28
|
import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
|
|
31
|
-
|
|
32
|
-
export const ScreenLayout = ({ children, scrollable = true, edges = ['top'], loading = false, loadingIcon = 'settings', loadingMessage = 'Loading...', header, footer, backgroundColor, containerStyle, contentContainerStyle, testID, hideScrollIndicator = false, keyboardAvoiding = false, }) => {
|
|
29
|
+
export const ScreenLayout = ({ children, scrollable = true, edges = ['top'], header, footer, backgroundColor, containerStyle, contentContainerStyle, testID, hideScrollIndicator = false, keyboardAvoiding = false, }) => {
|
|
33
30
|
// Automatically uses current theme from global store
|
|
34
31
|
const tokens = useAppDesignTokens();
|
|
35
32
|
const styles = useMemo(() => getStyles(tokens), [tokens]);
|
|
36
33
|
const bgColor = backgroundColor || tokens.colors.backgroundPrimary;
|
|
37
|
-
// Show loading state
|
|
38
|
-
if (loading) {
|
|
39
|
-
return (<SafeAreaView style={[styles.container, { backgroundColor: bgColor }, containerStyle]} edges={edges} testID={testID}>
|
|
40
|
-
<LoadingState icon={loadingIcon} message={loadingMessage} size="large" fullScreen/>
|
|
41
|
-
</SafeAreaView>);
|
|
42
|
-
}
|
|
43
34
|
// Non-scrollable layout
|
|
44
35
|
if (!scrollable) {
|
|
45
36
|
return (<SafeAreaView style={[styles.container, { backgroundColor: bgColor }, containerStyle]} edges={edges} testID={testID}>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScreenLayout.js","sourceRoot":"","sources":["../../../src/presentation/organisms/ScreenLayout.tsx"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"ScreenLayout.js","sourceRoot":"","sources":["../../../src/presentation/organisms/ScreenLayout.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,EAAa,MAAM,cAAc,CAAC;AACvE,OAAO,EAAE,YAAY,EAAQ,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAqEjE,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,EACxD,QAAQ,EACR,UAAU,GAAG,IAAI,EACjB,KAAK,GAAG,CAAC,KAAK,CAAC,EACf,MAAM,EACN,MAAM,EACN,eAAe,EACf,cAAc,EACd,qBAAqB,EACrB,MAAM,EACN,mBAAmB,GAAG,KAAK,EAC3B,gBAAgB,GAAG,KAAK,GACzB,EAAE,EAAE;IACH,qDAAqD;IACrD,MAAM,MAAM,GAAG,kBAAkB,EAAE,CAAC;IACpC,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAE1D,MAAM,OAAO,GAAG,eAAe,IAAI,MAAM,CAAC,MAAM,CAAC,iBAAiB,CAAC;IAEnE,wBAAwB;IACxB,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,OAAO,CACL,CAAC,YAAY,CACX,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,EAAE,eAAe,EAAE,OAAO,EAAE,EAAE,cAAc,CAAC,CAAC,CACxE,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;QAAA,CAAC,MAAM,CACP;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,qBAAqB,CAAC,CAAC,CACnD;UAAA,CAAC,QAAQ,CACX;QAAA,EAAE,IAAI,CACN;QAAA,CAAC,MAAM,CACT;MAAA,EAAE,YAAY,CAAC,CAChB,CAAC;IACJ,CAAC;IAED,8BAA8B;IAC9B,OAAO,CACL,CAAC,YAAY,CACX,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,EAAE,eAAe,EAAE,OAAO,EAAE,EAAE,cAAc,CAAC,CAAC,CACxE,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,MAAM,CACP;MAAA,CAAC,UAAU,CACT,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CACzB,qBAAqB,CAAC,CAAC,CAAC,MAAM,CAAC,aAAa,EAAE,qBAAqB,CAAC,CAAC,CACrE,4BAA4B,CAAC,CAAC,CAAC,mBAAmB,CAAC,CACnD,yBAAyB,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAElE;QAAA,CAAC,QAAQ,CACX;MAAA,EAAE,UAAU,CACZ;MAAA,CAAC,MAAM,CACT;IAAA,EAAE,YAAY,CAAC,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,MAA6C,EAAE,EAAE,CAClE,UAAU,CAAC,MAAM,CAAC;IAChB,SAAS,EAAE;QACT,IAAI,EAAE,CAAC;KACR;IACD,OAAO,EAAE;QACP,IAAI,EAAE,CAAC;KACR;IACD,UAAU,EAAE;QACV,IAAI,EAAE,CAAC;KACR;IACD,aAAa,EAAE;QACb,QAAQ,EAAE,CAAC;QACX,iBAAiB,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE;QACpC,aAAa,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE;KACjC;CACF,CAAC,CAAC"}
|
|
@@ -9,6 +9,6 @@
|
|
|
9
9
|
* @module AppDesignTokens
|
|
10
10
|
*/
|
|
11
11
|
export { createDesignTokens, STATIC_DESIGN_TOKENS, STATIC_TOKENS, withAlpha, type DesignTokens, type ThemeMode, type ColorPalette, } from './core/TokenFactory';
|
|
12
|
-
export { BASE_TOKENS, spacing, typography,
|
|
12
|
+
export { BASE_TOKENS, spacing, typography, borders, iconSizes, opacity, avatarSizes, type Spacing, type Typography, type Borders, type IconSizes, type Opacity, type AvatarSizes, type BaseTokens, } from './core/BaseTokens';
|
|
13
13
|
export { lightColors, darkColors, getColorPalette, } from './core/ColorPalette';
|
|
14
14
|
//# sourceMappingURL=AppDesignTokens.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppDesignTokens.d.ts","sourceRoot":"","sources":["../../../src/presentation/tokens/AppDesignTokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAMH,OAAO,EACL,kBAAkB,EAClB,oBAAoB,EACpB,aAAa,EACb,SAAS,EACT,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,YAAY,GAClB,MAAM,qBAAqB,CAAC;AAM7B,OAAO,EACL,WAAW,EACX,OAAO,EACP,UAAU,EACV,
|
|
1
|
+
{"version":3,"file":"AppDesignTokens.d.ts","sourceRoot":"","sources":["../../../src/presentation/tokens/AppDesignTokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAMH,OAAO,EACL,kBAAkB,EAClB,oBAAoB,EACpB,aAAa,EACb,SAAS,EACT,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,YAAY,GAClB,MAAM,qBAAqB,CAAC;AAM7B,OAAO,EACL,WAAW,EACX,OAAO,EACP,UAAU,EACV,OAAO,EACP,SAAS,EACT,OAAO,EACP,WAAW,EACX,KAAK,OAAO,EACZ,KAAK,UAAU,EACf,KAAK,OAAO,EACZ,KAAK,SAAS,EACd,KAAK,OAAO,EACZ,KAAK,WAAW,EAChB,KAAK,UAAU,GAChB,MAAM,mBAAmB,CAAC;AAM3B,OAAO,EACL,WAAW,EACX,UAAU,EACV,eAAe,GAChB,MAAM,qBAAqB,CAAC"}
|
|
@@ -15,7 +15,7 @@ export { createDesignTokens, STATIC_DESIGN_TOKENS, STATIC_TOKENS, withAlpha, } f
|
|
|
15
15
|
// =============================================================================
|
|
16
16
|
// BASE TOKEN EXPORTS
|
|
17
17
|
// =============================================================================
|
|
18
|
-
export { BASE_TOKENS, spacing, typography,
|
|
18
|
+
export { BASE_TOKENS, spacing, typography, borders, iconSizes, opacity, avatarSizes, } from './core/BaseTokens';
|
|
19
19
|
// =============================================================================
|
|
20
20
|
// COLOR PALETTE EXPORTS
|
|
21
21
|
// =============================================================================
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppDesignTokens.js","sourceRoot":"","sources":["../../../src/presentation/tokens/AppDesignTokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,gFAAgF;AAChF,mCAAmC;AACnC,gFAAgF;AAEhF,OAAO,EACL,kBAAkB,EAClB,oBAAoB,EACpB,aAAa,EACb,SAAS,GAIV,MAAM,qBAAqB,CAAC;AAE7B,gFAAgF;AAChF,qBAAqB;AACrB,gFAAgF;AAEhF,OAAO,EACL,WAAW,EACX,OAAO,EACP,UAAU,EACV,
|
|
1
|
+
{"version":3,"file":"AppDesignTokens.js","sourceRoot":"","sources":["../../../src/presentation/tokens/AppDesignTokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,gFAAgF;AAChF,mCAAmC;AACnC,gFAAgF;AAEhF,OAAO,EACL,kBAAkB,EAClB,oBAAoB,EACpB,aAAa,EACb,SAAS,GAIV,MAAM,qBAAqB,CAAC;AAE7B,gFAAgF;AAChF,qBAAqB;AACrB,gFAAgF;AAEhF,OAAO,EACL,WAAW,EACX,OAAO,EACP,UAAU,EACV,OAAO,EACP,SAAS,EACT,OAAO,EACP,WAAW,GAQZ,MAAM,mBAAmB,CAAC;AAE3B,gFAAgF;AAChF,wBAAwB;AACxB,gFAAgF;AAEhF,OAAO,EACL,WAAW,EACX,UAAU,EACV,eAAe,GAChB,MAAM,qBAAqB,CAAC"}
|
|
@@ -73,18 +73,6 @@ export declare const typography: {
|
|
|
73
73
|
readonly caption: TextStyle;
|
|
74
74
|
readonly overline: TextStyle;
|
|
75
75
|
};
|
|
76
|
-
export declare const animations: {
|
|
77
|
-
readonly fastest: 150;
|
|
78
|
-
readonly fast: 150;
|
|
79
|
-
readonly normal: 300;
|
|
80
|
-
readonly slow: 500;
|
|
81
|
-
readonly slower: 750;
|
|
82
|
-
readonly slowest: 1000;
|
|
83
|
-
readonly easeInOut: "ease-in-out";
|
|
84
|
-
readonly easeIn: "ease-in";
|
|
85
|
-
readonly easeOut: "ease-out";
|
|
86
|
-
readonly linear: "linear";
|
|
87
|
-
};
|
|
88
76
|
export declare const opacity: {
|
|
89
77
|
readonly disabled: 0.6;
|
|
90
78
|
readonly subtle: 0.8;
|
|
@@ -233,18 +221,6 @@ export declare const BASE_TOKENS: {
|
|
|
233
221
|
readonly caption: TextStyle;
|
|
234
222
|
readonly overline: TextStyle;
|
|
235
223
|
};
|
|
236
|
-
readonly animations: {
|
|
237
|
-
readonly fastest: 150;
|
|
238
|
-
readonly fast: 150;
|
|
239
|
-
readonly normal: 300;
|
|
240
|
-
readonly slow: 500;
|
|
241
|
-
readonly slower: 750;
|
|
242
|
-
readonly slowest: 1000;
|
|
243
|
-
readonly easeInOut: "ease-in-out";
|
|
244
|
-
readonly easeIn: "ease-in";
|
|
245
|
-
readonly easeOut: "ease-out";
|
|
246
|
-
readonly linear: "linear";
|
|
247
|
-
};
|
|
248
224
|
readonly opacity: {
|
|
249
225
|
readonly disabled: 0.6;
|
|
250
226
|
readonly subtle: 0.8;
|
|
@@ -327,7 +303,6 @@ export declare const BASE_TOKENS: {
|
|
|
327
303
|
};
|
|
328
304
|
export type Spacing = typeof spacing;
|
|
329
305
|
export type Typography = typeof typography;
|
|
330
|
-
export type Animations = typeof animations;
|
|
331
306
|
export type Opacity = typeof opacity;
|
|
332
307
|
export type Borders = typeof borders;
|
|
333
308
|
export type Sizes = typeof sizes;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseTokens.d.ts","sourceRoot":"","sources":["../../../../src/presentation/tokens/core/BaseTokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAMzC,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;CA6BV,CAAC;AAMX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;2BAoChB,SAAS;4BAMT,SAAS;2BAMT,SAAS;4BAOT,SAAS;6BAMT,SAAS;4BAMT,SAAS;yBAOT,SAAS;0BAMT,SAAS;yBAMT,SAAS;wBAOT,SAAS;yBAMT,SAAS;wBAMT,SAAS;yBAOT,SAAS;0BAMT,SAAS;yBAMT,SAAS;2BAUT,SAAS;4BAMT,SAAS;2BAMT,SAAS;qBAMT,SAAS;sBAMT,SAAS;uBAQT,SAAS;CACN,CAAC;
|
|
1
|
+
{"version":3,"file":"BaseTokens.d.ts","sourceRoot":"","sources":["../../../../src/presentation/tokens/core/BaseTokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAMzC,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;CA6BV,CAAC;AAMX,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;2BAoChB,SAAS;4BAMT,SAAS;2BAMT,SAAS;4BAOT,SAAS;6BAMT,SAAS;4BAMT,SAAS;yBAOT,SAAS;0BAMT,SAAS;yBAMT,SAAS;wBAOT,SAAS;yBAMT,SAAS;wBAMT,SAAS;yBAOT,SAAS;0BAMT,SAAS;yBAMT,SAAS;2BAUT,SAAS;4BAMT,SAAS;2BAMT,SAAS;qBAMT,SAAS;sBAMT,SAAS;uBAQT,SAAS;CACN,CAAC;AAUX,eAAO,MAAM,OAAO;;;;;;CAMV,CAAC;AAMX,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyCV,CAAC;AAMX,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;CA8BR,CAAC;AAMX,eAAO,MAAM,SAAS;;;;;;;CAOZ,CAAC;AAMX,eAAO,MAAM,WAAW;;;;;;;CAOd,CAAC;AAMX;;;GAGG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+BA1QjB,SAAS;gCAMT,SAAS;+BAMT,SAAS;gCAOT,SAAS;iCAMT,SAAS;gCAMT,SAAS;6BAOT,SAAS;8BAMT,SAAS;6BAMT,SAAS;4BAOT,SAAS;6BAMT,SAAS;4BAMT,SAAS;6BAOT,SAAS;8BAMT,SAAS;6BAMT,SAAS;+BAUT,SAAS;gCAMT,SAAS;+BAMT,SAAS;yBAMT,SAAS;0BAMT,SAAS;2BAQT,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgJN,CAAC;AAMX,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAC;AACrC,MAAM,MAAM,UAAU,GAAG,OAAO,UAAU,CAAC;AAC3C,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAC;AACrC,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAC;AACrC,MAAM,MAAM,KAAK,GAAG,OAAO,KAAK,CAAC;AACjC,MAAM,MAAM,SAAS,GAAG,OAAO,SAAS,CAAC;AACzC,MAAM,MAAM,WAAW,GAAG,OAAO,WAAW,CAAC;AAC7C,MAAM,MAAM,UAAU,GAAG,OAAO,WAAW,CAAC"}
|
|
@@ -184,22 +184,8 @@ export const typography = {
|
|
|
184
184
|
},
|
|
185
185
|
};
|
|
186
186
|
// =============================================================================
|
|
187
|
-
// ANIMATION TOKENS
|
|
187
|
+
// ANIMATION TOKENS - REMOVED (moved to separate package)
|
|
188
188
|
// =============================================================================
|
|
189
|
-
export const animations = {
|
|
190
|
-
// Duration scale (milliseconds)
|
|
191
|
-
fastest: 150,
|
|
192
|
-
fast: 150,
|
|
193
|
-
normal: 300,
|
|
194
|
-
slow: 500,
|
|
195
|
-
slower: 750,
|
|
196
|
-
slowest: 1000,
|
|
197
|
-
// Easing functions
|
|
198
|
-
easeInOut: 'ease-in-out',
|
|
199
|
-
easeIn: 'ease-in',
|
|
200
|
-
easeOut: 'ease-out',
|
|
201
|
-
linear: 'linear',
|
|
202
|
-
};
|
|
203
189
|
// =============================================================================
|
|
204
190
|
// OPACITY TOKENS
|
|
205
191
|
// =============================================================================
|
|
@@ -312,7 +298,6 @@ export const avatarSizes = {
|
|
|
312
298
|
export const BASE_TOKENS = {
|
|
313
299
|
spacing,
|
|
314
300
|
typography,
|
|
315
|
-
animations,
|
|
316
301
|
opacity,
|
|
317
302
|
borders,
|
|
318
303
|
sizes,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseTokens.js","sourceRoot":"","sources":["../../../../src/presentation/tokens/core/BaseTokens.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"BaseTokens.js","sourceRoot":"","sources":["../../../../src/presentation/tokens/core/BaseTokens.ts"],"names":[],"mappings":"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"}
|
|
@@ -12,13 +12,12 @@ import { BASE_TOKENS } from './BaseTokens';
|
|
|
12
12
|
import { withAlpha, type ThemeMode, type ColorPalette } from './ColorPalette';
|
|
13
13
|
/**
|
|
14
14
|
* Complete design tokens shape
|
|
15
|
-
* Combines static tokens (spacing, typography,
|
|
15
|
+
* Combines static tokens (spacing, typography, borders) + dynamic colors
|
|
16
16
|
*/
|
|
17
17
|
export type DesignTokens = {
|
|
18
18
|
colors: ColorPalette;
|
|
19
19
|
spacing: typeof BASE_TOKENS.spacing;
|
|
20
20
|
typography: typeof BASE_TOKENS.typography;
|
|
21
|
-
animations: typeof BASE_TOKENS.animations;
|
|
22
21
|
iconSizes: typeof BASE_TOKENS.iconSizes;
|
|
23
22
|
opacity: typeof BASE_TOKENS.opacity;
|
|
24
23
|
avatarSizes: typeof BASE_TOKENS.avatarSizes;
|
|
@@ -64,7 +63,7 @@ export declare const createDesignTokens: (mode: ThemeMode) => DesignTokens;
|
|
|
64
63
|
*/
|
|
65
64
|
export declare const STATIC_DESIGN_TOKENS: DesignTokens;
|
|
66
65
|
/**
|
|
67
|
-
* STATIC TOKENS (spacing, typography,
|
|
66
|
+
* STATIC TOKENS (spacing, typography, borders)
|
|
68
67
|
* These DON'T change with theme - safe to use anywhere
|
|
69
68
|
*/
|
|
70
69
|
export declare const STATIC_TOKENS: {
|
|
@@ -132,18 +131,6 @@ export declare const STATIC_TOKENS: {
|
|
|
132
131
|
readonly caption: import("react-native").TextStyle;
|
|
133
132
|
readonly overline: import("react-native").TextStyle;
|
|
134
133
|
};
|
|
135
|
-
readonly animations: {
|
|
136
|
-
readonly fastest: 150;
|
|
137
|
-
readonly fast: 150;
|
|
138
|
-
readonly normal: 300;
|
|
139
|
-
readonly slow: 500;
|
|
140
|
-
readonly slower: 750;
|
|
141
|
-
readonly slowest: 1000;
|
|
142
|
-
readonly easeInOut: "ease-in-out";
|
|
143
|
-
readonly easeIn: "ease-in";
|
|
144
|
-
readonly easeOut: "ease-out";
|
|
145
|
-
readonly linear: "linear";
|
|
146
|
-
};
|
|
147
134
|
readonly opacity: {
|
|
148
135
|
readonly disabled: 0.6;
|
|
149
136
|
readonly subtle: 0.8;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TokenFactory.d.ts","sourceRoot":"","sources":["../../../../src/presentation/tokens/core/TokenFactory.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAmB,SAAS,EAAE,KAAK,SAAS,EAAE,KAAK,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAM/F;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB,MAAM,EAAE,YAAY,CAAC;IACrB,OAAO,EAAE,OAAO,WAAW,CAAC,OAAO,CAAC;IACpC,UAAU,EAAE,OAAO,WAAW,CAAC,UAAU,CAAC;IAC1C,
|
|
1
|
+
{"version":3,"file":"TokenFactory.d.ts","sourceRoot":"","sources":["../../../../src/presentation/tokens/core/TokenFactory.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAmB,SAAS,EAAE,KAAK,SAAS,EAAE,KAAK,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAM/F;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB,MAAM,EAAE,YAAY,CAAC;IACrB,OAAO,EAAE,OAAO,WAAW,CAAC,OAAO,CAAC;IACpC,UAAU,EAAE,OAAO,WAAW,CAAC,UAAU,CAAC;IAC1C,SAAS,EAAE,OAAO,WAAW,CAAC,SAAS,CAAC;IACxC,OAAO,EAAE,OAAO,WAAW,CAAC,OAAO,CAAC;IACpC,WAAW,EAAE,OAAO,WAAW,CAAC,WAAW,CAAC;IAC5C,OAAO,EAAE,OAAO,WAAW,CAAC,OAAO,GAAG;QACpC,IAAI,EAAE,OAAO,WAAW,CAAC,OAAO,CAAC,IAAI,GAAG;YAAE,WAAW,EAAE,MAAM,CAAA;SAAE,CAAC;QAChE,KAAK,EAAE,OAAO,WAAW,CAAC,OAAO,CAAC,KAAK,GAAG;YAAE,WAAW,EAAE,MAAM,CAAA;SAAE,CAAC;KACnE,CAAC;CACH,CAAC;AAMF;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,kBAAkB,GAAI,MAAM,SAAS,KAAG,YA6BpD,CAAC;AAMF;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,oBAAoB,cAA8B,CAAC;AAEhE;;;GAGG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAc,CAAC;AAMzC,OAAO,EAAE,SAAS,EAAE,CAAC;AACrB,YAAY,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC"}
|
|
@@ -40,7 +40,6 @@ export const createDesignTokens = (mode) => {
|
|
|
40
40
|
// ✅ STATIC: These don't change with theme
|
|
41
41
|
spacing: BASE_TOKENS.spacing,
|
|
42
42
|
typography: BASE_TOKENS.typography,
|
|
43
|
-
animations: BASE_TOKENS.animations,
|
|
44
43
|
iconSizes: BASE_TOKENS.iconSizes,
|
|
45
44
|
opacity: BASE_TOKENS.opacity,
|
|
46
45
|
avatarSizes: BASE_TOKENS.avatarSizes,
|
|
@@ -76,7 +75,7 @@ export const createDesignTokens = (mode) => {
|
|
|
76
75
|
*/
|
|
77
76
|
export const STATIC_DESIGN_TOKENS = createDesignTokens('light');
|
|
78
77
|
/**
|
|
79
|
-
* STATIC TOKENS (spacing, typography,
|
|
78
|
+
* STATIC TOKENS (spacing, typography, borders)
|
|
80
79
|
* These DON'T change with theme - safe to use anywhere
|
|
81
80
|
*/
|
|
82
81
|
export const STATIC_TOKENS = BASE_TOKENS;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TokenFactory.js","sourceRoot":"","sources":["../../../../src/presentation/tokens/core/TokenFactory.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,SAAS,EAAqC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"TokenFactory.js","sourceRoot":"","sources":["../../../../src/presentation/tokens/core/TokenFactory.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,SAAS,EAAqC,MAAM,gBAAgB,CAAC;AAuB/F,gFAAgF;AAChF,yBAAyB;AACzB,gFAAgF;AAEhF;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,IAAe,EAAgB,EAAE;IAClE,mCAAmC;IACnC,MAAM,MAAM,GAAG,eAAe,CAAC,IAAI,CAAC,CAAC;IAErC,yCAAyC;IACzC,OAAO;QACL,oCAAoC;QACpC,MAAM;QAEN,0CAA0C;QAC1C,OAAO,EAAE,WAAW,CAAC,OAAO;QAC5B,UAAU,EAAE,WAAW,CAAC,UAAU;QAClC,SAAS,EAAE,WAAW,CAAC,SAAS;QAChC,OAAO,EAAE,WAAW,CAAC,OAAO;QAC5B,WAAW,EAAE,WAAW,CAAC,WAAW;QAEpC,wDAAwD;QACxD,OAAO,EAAE;YACP,GAAG,WAAW,CAAC,OAAO;YACtB,IAAI,EAAE;gBACJ,GAAG,WAAW,CAAC,OAAO,CAAC,IAAI;gBAC3B,WAAW,EAAE,MAAM,CAAC,MAAM;aAC3B;YACD,KAAK,EAAE;gBACL,GAAG,WAAW,CAAC,OAAO,CAAC,KAAK;gBAC5B,WAAW,EAAE,MAAM,CAAC,MAAM;aAC3B;SACF;KACF,CAAC;AACJ,CAAC,CAAC;AAEF,gFAAgF;AAChF,kDAAkD;AAClD,gFAAgF;AAEhF;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,kBAAkB,CAAC,OAAO,CAAC,CAAC;AAEhE;;;GAGG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,WAAW,CAAC;AAEzC,gFAAgF;AAChF,kBAAkB;AAClB,gFAAgF;AAEhF,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@umituz/react-native-design-system",
|
|
3
|
-
"version": "1.4.
|
|
3
|
+
"version": "1.4.3",
|
|
4
4
|
"description": "Universal design system for React Native apps - Domain-Driven Design architecture with Material Design 3 components",
|
|
5
5
|
"main": "./lib/index.js",
|
|
6
6
|
"types": "./lib/index.d.ts",
|
package/src/index.ts
CHANGED
|
@@ -11,12 +11,11 @@
|
|
|
11
11
|
* - presentation/atoms: Primitive UI components (AtomicButton, AtomicText, etc.)
|
|
12
12
|
* - presentation/molecules: Composite components (SearchBar, ListItem, etc.)
|
|
13
13
|
* - presentation/organisms: Complex patterns (ScreenLayout, AppHeader, FormContainer)
|
|
14
|
-
* - presentation/loading: Loading states (LoadingState, LoadingSpinner)
|
|
15
14
|
* - presentation/tokens: Design tokens (colors, typography, spacing, etc.)
|
|
16
15
|
* - presentation/utils: Utility functions and helpers
|
|
17
16
|
*
|
|
18
17
|
* Usage:
|
|
19
|
-
* import { AtomicButton, AtomicFilter, AtomicTouchable, SearchBar,
|
|
18
|
+
* import { AtomicButton, AtomicFilter, AtomicTouchable, SearchBar, STATIC_TOKENS } from '@umituz/react-native-design-system';
|
|
20
19
|
*/
|
|
21
20
|
|
|
22
21
|
// =============================================================================
|
|
@@ -255,7 +254,6 @@ export {
|
|
|
255
254
|
// Individual base tokens
|
|
256
255
|
spacing,
|
|
257
256
|
typography,
|
|
258
|
-
animations,
|
|
259
257
|
borders,
|
|
260
258
|
|
|
261
259
|
// Type exports
|
|
@@ -264,7 +262,6 @@ export {
|
|
|
264
262
|
type ColorPalette,
|
|
265
263
|
type Spacing,
|
|
266
264
|
type Typography,
|
|
267
|
-
type Animations,
|
|
268
265
|
type Borders,
|
|
269
266
|
type BaseTokens,
|
|
270
267
|
} from './presentation/tokens/AppDesignTokens';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { StyleSheet, StyleProp, ViewStyle, TextStyle, TouchableOpacity,
|
|
2
|
+
import { StyleSheet, StyleProp, ViewStyle, TextStyle, TouchableOpacity, View } from 'react-native';
|
|
3
3
|
import { AtomicText } from './AtomicText';
|
|
4
4
|
import { Icon } from '../../domains/icons/presentation/components/Icon';
|
|
5
5
|
import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
|
|
@@ -15,7 +15,6 @@ export interface AtomicButtonProps {
|
|
|
15
15
|
variant?: ButtonVariant;
|
|
16
16
|
size?: ButtonSize;
|
|
17
17
|
disabled?: boolean;
|
|
18
|
-
loading?: boolean;
|
|
19
18
|
icon?: IconName;
|
|
20
19
|
fullWidth?: boolean;
|
|
21
20
|
style?: StyleProp<ViewStyle>;
|
|
@@ -30,7 +29,6 @@ export const AtomicButton: React.FC<AtomicButtonProps> = ({
|
|
|
30
29
|
variant = 'primary',
|
|
31
30
|
size = 'md',
|
|
32
31
|
disabled = false,
|
|
33
|
-
loading = false,
|
|
34
32
|
icon,
|
|
35
33
|
fullWidth = false,
|
|
36
34
|
style,
|
|
@@ -40,7 +38,7 @@ export const AtomicButton: React.FC<AtomicButtonProps> = ({
|
|
|
40
38
|
const tokens = useAppDesignTokens();
|
|
41
39
|
|
|
42
40
|
const handlePress = () => {
|
|
43
|
-
if (!disabled
|
|
41
|
+
if (!disabled) {
|
|
44
42
|
onPress();
|
|
45
43
|
}
|
|
46
44
|
};
|
|
@@ -181,7 +179,7 @@ export const AtomicButton: React.FC<AtomicButtonProps> = ({
|
|
|
181
179
|
];
|
|
182
180
|
|
|
183
181
|
const buttonText = title || children;
|
|
184
|
-
const showIcon = icon
|
|
182
|
+
const showIcon = icon;
|
|
185
183
|
const iconColor = variantStyles.text.color;
|
|
186
184
|
|
|
187
185
|
return (
|
|
@@ -189,17 +187,11 @@ export const AtomicButton: React.FC<AtomicButtonProps> = ({
|
|
|
189
187
|
style={containerStyle}
|
|
190
188
|
onPress={handlePress}
|
|
191
189
|
activeOpacity={0.8}
|
|
192
|
-
disabled={disabled
|
|
190
|
+
disabled={disabled}
|
|
193
191
|
testID={testID}
|
|
194
192
|
>
|
|
195
193
|
<View style={styles.content}>
|
|
196
|
-
{
|
|
197
|
-
<ActivityIndicator
|
|
198
|
-
size="small"
|
|
199
|
-
color={variantStyles.text.color}
|
|
200
|
-
style={styles.loader}
|
|
201
|
-
/>
|
|
202
|
-
) : showIcon ? (
|
|
194
|
+
{showIcon ? (
|
|
203
195
|
<Icon
|
|
204
196
|
name={icon}
|
|
205
197
|
customSize={config.iconSize}
|
|
@@ -239,9 +231,6 @@ const styles = StyleSheet.create({
|
|
|
239
231
|
icon: {
|
|
240
232
|
marginRight: 8,
|
|
241
233
|
},
|
|
242
|
-
loader: {
|
|
243
|
-
marginRight: 8,
|
|
244
|
-
},
|
|
245
234
|
});
|
|
246
235
|
|
|
247
236
|
export type { AtomicButtonProps as ButtonProps };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { TouchableOpacity,
|
|
2
|
+
import { TouchableOpacity, StyleSheet } from 'react-native';
|
|
3
3
|
import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
|
|
4
4
|
import { useResponsive } from '../hooks/useResponsive';
|
|
5
5
|
import { AtomicIcon } from './AtomicIcon';
|
|
@@ -40,7 +40,6 @@ export { FAB_SIZES, getFabVariants, getFabIconSize, getFabBorder };
|
|
|
40
40
|
* - Material Design 3 sizes (sm: 40px, md: 56px, lg: 72px)
|
|
41
41
|
* - Three variants: primary, secondary, surface
|
|
42
42
|
* - Responsive positioning (above tab bar, safe area aware)
|
|
43
|
-
* - Loading state with spinner
|
|
44
43
|
* - Disabled state with opacity
|
|
45
44
|
* - Theme-aware colors from design tokens
|
|
46
45
|
* - Border for depth (no shadows per CLAUDE.md)
|
|
@@ -51,14 +50,13 @@ export const AtomicFab: React.FC<AtomicFabProps> = ({
|
|
|
51
50
|
variant = 'primary',
|
|
52
51
|
size = 'md',
|
|
53
52
|
disabled = false,
|
|
54
|
-
loading = false,
|
|
55
53
|
style,
|
|
56
54
|
testID,
|
|
57
55
|
accessibilityLabel,
|
|
58
56
|
}) => {
|
|
59
57
|
const tokens = useAppDesignTokens();
|
|
60
58
|
const responsive = useResponsive();
|
|
61
|
-
const isDisabled = disabled
|
|
59
|
+
const isDisabled = disabled;
|
|
62
60
|
|
|
63
61
|
// Get configurations
|
|
64
62
|
const sizeConfig = FAB_SIZES[size as 'sm' | 'md' | 'lg'];
|
|
@@ -94,11 +92,7 @@ export const AtomicFab: React.FC<AtomicFabProps> = ({
|
|
|
94
92
|
accessibilityLabel={accessibilityLabel || `${icon} button`}
|
|
95
93
|
accessibilityRole="button"
|
|
96
94
|
>
|
|
97
|
-
{
|
|
98
|
-
<ActivityIndicator size="small" color={variantConfig.iconColor} />
|
|
99
|
-
) : (
|
|
100
|
-
<AtomicIcon name={icon} size={iconSize} customColor={variantConfig.iconColor} />
|
|
101
|
-
)}
|
|
95
|
+
<AtomicIcon name={icon} size={iconSize} customColor={variantConfig.iconColor} />
|
|
102
96
|
</TouchableOpacity>
|
|
103
97
|
);
|
|
104
98
|
};
|
|
@@ -10,7 +10,6 @@
|
|
|
10
10
|
* Usage:
|
|
11
11
|
* - File upload progress
|
|
12
12
|
* - Task completion progress
|
|
13
|
-
* - Loading progress
|
|
14
13
|
* - Achievement progress
|
|
15
14
|
* - Form completion
|
|
16
15
|
*/
|
|
@@ -42,8 +41,6 @@ export interface AtomicProgressProps {
|
|
|
42
41
|
showValue?: boolean;
|
|
43
42
|
/** Custom text color */
|
|
44
43
|
textColor?: string;
|
|
45
|
-
/** Animation duration in milliseconds */
|
|
46
|
-
animationDuration?: number;
|
|
47
44
|
/** Style overrides */
|
|
48
45
|
style?: ViewStyle | ViewStyle[];
|
|
49
46
|
/** Test ID for testing */
|
|
@@ -64,7 +61,6 @@ export const AtomicProgress: React.FC<AtomicProgressProps> = ({
|
|
|
64
61
|
showPercentage = false,
|
|
65
62
|
showValue = false,
|
|
66
63
|
textColor,
|
|
67
|
-
animationDuration = 300,
|
|
68
64
|
style,
|
|
69
65
|
testID,
|
|
70
66
|
}) => {
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { Pressable,
|
|
2
|
+
import { Pressable, StyleSheet } from 'react-native';
|
|
3
3
|
import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
|
|
4
4
|
import { AtomicTouchableProps, TouchableFeedback, FeedbackStrength } from './touchable/types';
|
|
5
5
|
import {
|
|
6
6
|
getOpacityValue,
|
|
7
7
|
getTouchableContainerStyle,
|
|
8
8
|
getDisabledStyle,
|
|
9
|
-
getLoadingContainerStyle,
|
|
10
9
|
normalizeHitSlop,
|
|
11
10
|
} from './touchable/styles/touchableStyles';
|
|
12
11
|
|
|
@@ -21,7 +20,6 @@ export {
|
|
|
21
20
|
getOpacityValue,
|
|
22
21
|
getTouchableContainerStyle,
|
|
23
22
|
getDisabledStyle,
|
|
24
|
-
getLoadingContainerStyle,
|
|
25
23
|
normalizeHitSlop,
|
|
26
24
|
} from './touchable/styles/touchableStyles';
|
|
27
25
|
|
|
@@ -34,7 +32,6 @@ export {
|
|
|
34
32
|
* Features:
|
|
35
33
|
* - Multiple feedback variants (opacity, highlight, ripple, none)
|
|
36
34
|
* - Configurable feedback strength (subtle, normal, strong)
|
|
37
|
-
* - Loading state with indicator
|
|
38
35
|
* - Disabled state with visual feedback
|
|
39
36
|
* - Hit slop customization for small touch targets
|
|
40
37
|
* - Minimum 48x48 touch target (iOS HIG compliance)
|
|
@@ -48,15 +45,6 @@ export {
|
|
|
48
45
|
* <AtomicText>Press Me</AtomicText>
|
|
49
46
|
* </AtomicTouchable>
|
|
50
47
|
*
|
|
51
|
-
* // With loading state
|
|
52
|
-
* <AtomicTouchable
|
|
53
|
-
* onPress={handleSubmit}
|
|
54
|
-
* loading={isSubmitting}
|
|
55
|
-
* feedback="highlight"
|
|
56
|
-
* >
|
|
57
|
-
* <AtomicText>Submit</AtomicText>
|
|
58
|
-
* </AtomicTouchable>
|
|
59
|
-
*
|
|
60
48
|
* // With custom hit slop (extends touch area)
|
|
61
49
|
* <AtomicTouchable
|
|
62
50
|
* onPress={handlePress}
|
|
@@ -76,7 +64,6 @@ export const AtomicTouchable: React.FC<AtomicTouchableProps> = ({
|
|
|
76
64
|
feedback = 'opacity',
|
|
77
65
|
strength = 'normal',
|
|
78
66
|
disabled = false,
|
|
79
|
-
loading = false,
|
|
80
67
|
hitSlop,
|
|
81
68
|
style,
|
|
82
69
|
pressedStyle,
|
|
@@ -92,7 +79,7 @@ export const AtomicTouchable: React.FC<AtomicTouchableProps> = ({
|
|
|
92
79
|
const tokens = useAppDesignTokens();
|
|
93
80
|
|
|
94
81
|
// Determine if touchable should be disabled
|
|
95
|
-
const isDisabled = disabled
|
|
82
|
+
const isDisabled = disabled;
|
|
96
83
|
|
|
97
84
|
// Get opacity value based on strength
|
|
98
85
|
const opacityValue = getOpacityValue(strength as 'subtle' | 'normal' | 'strong');
|
|
@@ -169,21 +156,10 @@ export const AtomicTouchable: React.FC<AtomicTouchableProps> = ({
|
|
|
169
156
|
accessibilityRole={accessibilityRole}
|
|
170
157
|
accessibilityState={{
|
|
171
158
|
disabled: isDisabled,
|
|
172
|
-
busy: loading,
|
|
173
159
|
}}
|
|
174
160
|
testID={testID}
|
|
175
161
|
>
|
|
176
|
-
{
|
|
177
|
-
<View style={getLoadingContainerStyle()}>
|
|
178
|
-
<ActivityIndicator
|
|
179
|
-
size="small"
|
|
180
|
-
color={tokens.colors.primary}
|
|
181
|
-
testID={`${testID}-loading`}
|
|
182
|
-
/>
|
|
183
|
-
</View>
|
|
184
|
-
) : (
|
|
185
|
-
children
|
|
186
|
-
)}
|
|
162
|
+
{children}
|
|
187
163
|
</Pressable>
|
|
188
164
|
);
|
|
189
165
|
};
|
|
@@ -84,11 +84,6 @@ import {
|
|
|
84
84
|
type AtomicDividerProps,
|
|
85
85
|
} from './AtomicDivider';
|
|
86
86
|
|
|
87
|
-
import {
|
|
88
|
-
AtomicSkeleton,
|
|
89
|
-
type AtomicSkeletonProps,
|
|
90
|
-
} from './AtomicSkeleton';
|
|
91
|
-
|
|
92
87
|
import {
|
|
93
88
|
AtomicProgress,
|
|
94
89
|
type AtomicProgressProps,
|
|
@@ -198,11 +193,6 @@ export {
|
|
|
198
193
|
type AtomicDividerProps,
|
|
199
194
|
};
|
|
200
195
|
|
|
201
|
-
export {
|
|
202
|
-
AtomicSkeleton,
|
|
203
|
-
type AtomicSkeletonProps,
|
|
204
|
-
};
|
|
205
|
-
|
|
206
196
|
export {
|
|
207
197
|
AtomicProgress,
|
|
208
198
|
type AtomicProgressProps,
|
|
@@ -260,7 +250,6 @@ export type AtomicComponentProps =
|
|
|
260
250
|
| AtomicAvatarProps
|
|
261
251
|
| AtomicChipProps
|
|
262
252
|
| AtomicDividerProps
|
|
263
|
-
| AtomicSkeletonProps
|
|
264
253
|
| AtomicProgressProps
|
|
265
254
|
| AtomicAvatarGroupProps
|
|
266
255
|
| AtomicFabProps
|
|
@@ -366,7 +355,6 @@ const defaultExport = {
|
|
|
366
355
|
AtomicAvatar,
|
|
367
356
|
AtomicChip,
|
|
368
357
|
AtomicDivider,
|
|
369
|
-
AtomicSkeleton,
|
|
370
358
|
AtomicProgress,
|
|
371
359
|
AtomicAvatarGroup,
|
|
372
360
|
AtomicFab,
|