@umituz/react-native-design-system 1.3.5 → 1.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -2
- package/lib/domains/icons/presentation/components/Icon.d.ts.map +1 -1
- package/lib/domains/icons/presentation/components/Icon.js.map +1 -1
- package/lib/index.d.ts +2 -6
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +2 -9
- package/lib/index.js.map +1 -1
- package/lib/presentation/atoms/AtomicBadge.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 +7 -28
- package/lib/presentation/atoms/AtomicButton.js.map +1 -1
- package/lib/presentation/atoms/AtomicCard.d.ts.map +1 -1
- package/lib/presentation/atoms/AtomicCard.js +4 -23
- package/lib/presentation/atoms/AtomicCard.js.map +1 -1
- package/lib/presentation/atoms/AtomicDatePicker.js +1 -1
- package/lib/presentation/atoms/AtomicDatePicker.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/AtomicImage.js.map +1 -1
- package/lib/presentation/atoms/AtomicPicker.js +1 -1
- package/lib/presentation/atoms/AtomicPicker.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/AtomicSkeleton.d.ts +4 -10
- package/lib/presentation/atoms/AtomicSkeleton.d.ts.map +1 -1
- package/lib/presentation/atoms/AtomicSkeleton.js +7 -38
- package/lib/presentation/atoms/AtomicSkeleton.js.map +1 -1
- package/lib/presentation/atoms/AtomicSwitch.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/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/molecules/AtomicConfirmationModal.d.ts.map +1 -1
- package/lib/presentation/molecules/AtomicConfirmationModal.js +2 -1
- package/lib/presentation/molecules/AtomicConfirmationModal.js.map +1 -1
- package/lib/presentation/molecules/languageswitcher/hooks/useLanguageNavigation.d.ts +1 -1
- package/lib/presentation/molecules/languageswitcher/hooks/useLanguageNavigation.d.ts.map +1 -1
- package/lib/presentation/molecules/languageswitcher/hooks/useLanguageNavigation.js +2 -0
- package/lib/presentation/molecules/languageswitcher/hooks/useLanguageNavigation.js.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/commonStyles.d.ts +1 -1
- package/lib/presentation/tokens/commonStyles.js +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 +0 -18
- 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 -3
- package/src/domains/icons/presentation/components/Icon.tsx +3 -3
- package/src/index.ts +1 -27
- package/src/presentation/atoms/AtomicBadge.tsx +3 -3
- package/src/presentation/atoms/AtomicButton.tsx +8 -44
- package/src/presentation/atoms/AtomicCard.tsx +4 -32
- package/src/presentation/atoms/AtomicDatePicker.tsx +1 -1
- package/src/presentation/atoms/AtomicFab.tsx +6 -12
- package/src/presentation/atoms/AtomicImage.tsx +2 -2
- package/src/presentation/atoms/AtomicPicker.tsx +1 -1
- package/src/presentation/atoms/AtomicProgress.tsx +0 -4
- package/src/presentation/atoms/AtomicSkeleton.tsx +6 -57
- package/src/presentation/atoms/AtomicSwitch.tsx +2 -2
- package/src/presentation/atoms/AtomicTouchable.tsx +4 -28
- package/src/presentation/atoms/fab/types/index.ts +0 -6
- package/src/presentation/atoms/touchable/styles/touchableStyles.ts +0 -9
- package/src/presentation/atoms/touchable/types/index.ts +1 -8
- package/src/presentation/molecules/AtomicConfirmationModal.tsx +3 -2
- package/src/presentation/molecules/languageswitcher/hooks/useLanguageNavigation.ts +2 -0
- package/src/presentation/organisms/ScreenLayout.tsx +0 -40
- package/src/presentation/tokens/AppDesignTokens.ts +0 -2
- package/src/presentation/tokens/commonStyles.ts +1 -1
- package/src/presentation/tokens/core/BaseTokens.ts +0 -22
- package/src/presentation/tokens/core/TokenFactory.ts +2 -4
- package/lib/presentation/loading/index.d.ts +0 -23
- package/lib/presentation/loading/index.d.ts.map +0 -1
- package/lib/presentation/loading/index.js +0 -26
- package/lib/presentation/loading/index.js.map +0 -1
- package/lib/presentation/loading/presentation/components/LoadingSpinner.d.ts +0 -28
- package/lib/presentation/loading/presentation/components/LoadingSpinner.d.ts.map +0 -1
- package/lib/presentation/loading/presentation/components/LoadingSpinner.js +0 -77
- package/lib/presentation/loading/presentation/components/LoadingSpinner.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/lib/presentation/loading/presentation/hooks/useLoading.d.ts +0 -50
- package/lib/presentation/loading/presentation/hooks/useLoading.d.ts.map +0 -1
- package/lib/presentation/loading/presentation/hooks/useLoading.js +0 -49
- package/lib/presentation/loading/presentation/hooks/useLoading.js.map +0 -1
- package/src/presentation/loading/index.ts +0 -40
- package/src/presentation/loading/presentation/components/LoadingSpinner.tsx +0 -116
- package/src/presentation/loading/presentation/components/LoadingState.tsx +0 -200
- package/src/presentation/loading/presentation/hooks/useLoading.ts +0 -100
|
@@ -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;AAMX,eAAO,MAAM,
|
|
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;AAMX,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+BAtQjB,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4IN,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,23 +184,6 @@ export const typography = {
|
|
|
184
184
|
},
|
|
185
185
|
};
|
|
186
186
|
// =============================================================================
|
|
187
|
-
// ANIMATION TOKENS
|
|
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
|
-
// =============================================================================
|
|
204
187
|
// OPACITY TOKENS
|
|
205
188
|
// =============================================================================
|
|
206
189
|
export const opacity = {
|
|
@@ -312,7 +295,6 @@ export const avatarSizes = {
|
|
|
312
295
|
export const BASE_TOKENS = {
|
|
313
296
|
spacing,
|
|
314
297
|
typography,
|
|
315
|
-
animations,
|
|
316
298
|
opacity,
|
|
317
299
|
borders,
|
|
318
300
|
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.
|
|
3
|
+
"version": "1.4.0",
|
|
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",
|
|
@@ -33,7 +33,6 @@
|
|
|
33
33
|
"peerDependencies": {
|
|
34
34
|
"react": ">=18.2.0",
|
|
35
35
|
"react-native": ">=0.74.0",
|
|
36
|
-
"react-native-reanimated": "~3.10.1",
|
|
37
36
|
"react-native-svg": ">=13.0.0",
|
|
38
37
|
"@react-native-community/datetimepicker": "8.0.1",
|
|
39
38
|
"@expo/vector-icons": "^14.0.0",
|
|
@@ -63,7 +62,6 @@
|
|
|
63
62
|
"@types/react-native": "^0.73.0",
|
|
64
63
|
"react": ">=18.2.0",
|
|
65
64
|
"react-native": ">=0.74.0",
|
|
66
|
-
"react-native-reanimated": "~3.10.1",
|
|
67
65
|
"react-native-svg": "^15.0.0",
|
|
68
66
|
"@expo/vector-icons": "^14.0.0",
|
|
69
67
|
"lucide-react-native": "^0.468.0",
|
|
@@ -30,7 +30,7 @@ import { View, StyleSheet, StyleProp, ViewStyle } from 'react-native';
|
|
|
30
30
|
import { useAppDesignTokens } from '../../../../presentation/hooks/useAppDesignTokens';
|
|
31
31
|
import { CURRENT_LIBRARY } from '../../domain/config/IconLibraryConfig';
|
|
32
32
|
import { LucideAdapter } from '../../infrastructure/adapters/LucideAdapter';
|
|
33
|
-
import type { IconProps } from '../../domain/interfaces/IIconAdapter';
|
|
33
|
+
import type { IconProps, IconSize, IconColor } from '../../domain/interfaces/IIconAdapter';
|
|
34
34
|
|
|
35
35
|
/**
|
|
36
36
|
* Get adapter based on current library configuration
|
|
@@ -76,10 +76,10 @@ export const Icon: React.FC<IconProps> = ({
|
|
|
76
76
|
}
|
|
77
77
|
|
|
78
78
|
// Calculate icon size
|
|
79
|
-
const iconSize = adapter.getIconSize(size, customSize);
|
|
79
|
+
const iconSize = adapter.getIconSize(size as IconSize, customSize);
|
|
80
80
|
|
|
81
81
|
// Get icon color from theme
|
|
82
|
-
const iconColor = adapter.getIconColor(color, tokens, customColor);
|
|
82
|
+
const iconColor = adapter.getIconColor(color as IconColor, tokens, customColor);
|
|
83
83
|
|
|
84
84
|
// Get stroke width (for outline icons)
|
|
85
85
|
const iconStrokeWidth = strokeWidth || adapter.getStrokeWidth?.() || 2;
|
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
|
// =============================================================================
|
|
@@ -228,29 +227,6 @@ export {
|
|
|
228
227
|
// Note: FeedbackModal moved to @domains/feedback
|
|
229
228
|
// Import from feedback domain: import { FeedbackModal } from '@domains/feedback';
|
|
230
229
|
|
|
231
|
-
// =============================================================================
|
|
232
|
-
// LOADING - Loading States
|
|
233
|
-
// =============================================================================
|
|
234
|
-
|
|
235
|
-
export {
|
|
236
|
-
LoadingState,
|
|
237
|
-
type LoadingStateProps,
|
|
238
|
-
type LoadingStateSize,
|
|
239
|
-
} from './presentation/loading/presentation/components/LoadingState';
|
|
240
|
-
|
|
241
|
-
export {
|
|
242
|
-
LoadingSpinner,
|
|
243
|
-
type LoadingSpinnerProps,
|
|
244
|
-
type LoadingSpinnerSize,
|
|
245
|
-
type LoadingSpinnerColor,
|
|
246
|
-
} from './presentation/loading/presentation/components/LoadingSpinner';
|
|
247
|
-
|
|
248
|
-
export {
|
|
249
|
-
useLoading,
|
|
250
|
-
type LoadingConfig,
|
|
251
|
-
type UseLoadingReturn,
|
|
252
|
-
} from './presentation/loading/presentation/hooks/useLoading';
|
|
253
|
-
|
|
254
230
|
// =============================================================================
|
|
255
231
|
// TOKENS - Design Tokens (Refactored with ZERO duplication)
|
|
256
232
|
// =============================================================================
|
|
@@ -272,7 +248,6 @@ export {
|
|
|
272
248
|
// Individual base tokens
|
|
273
249
|
spacing,
|
|
274
250
|
typography,
|
|
275
|
-
animations,
|
|
276
251
|
borders,
|
|
277
252
|
|
|
278
253
|
// Type exports
|
|
@@ -281,7 +256,6 @@ export {
|
|
|
281
256
|
type ColorPalette,
|
|
282
257
|
type Spacing,
|
|
283
258
|
type Typography,
|
|
284
|
-
type Animations,
|
|
285
259
|
type Borders,
|
|
286
260
|
type BaseTokens,
|
|
287
261
|
} from './presentation/tokens/AppDesignTokens';
|
|
@@ -97,9 +97,9 @@ export const AtomicBadge: React.FC<AtomicBadgeProps> = ({
|
|
|
97
97
|
const tokens = useAppDesignTokens();
|
|
98
98
|
const styles = getStyles(tokens);
|
|
99
99
|
|
|
100
|
-
const sizeConfig = getSizeConfig(tokens)[size];
|
|
101
|
-
const colors = getVariantColors(tokens, variant);
|
|
102
|
-
const borderRadius = getBorderRadius(shape, sizeConfig.borderRadius, tokens);
|
|
100
|
+
const sizeConfig = getSizeConfig(tokens)[size as 'xs' | 'sm' | 'md' | 'lg'];
|
|
101
|
+
const colors = getVariantColors(tokens, variant as 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info');
|
|
102
|
+
const borderRadius = getBorderRadius(shape as 'circle' | 'rounded' | 'square', sizeConfig.borderRadius, tokens);
|
|
103
103
|
|
|
104
104
|
// Handle max value display
|
|
105
105
|
const displayValue = React.useMemo(() => {
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { StyleSheet, StyleProp, ViewStyle, TextStyle, TouchableOpacity,
|
|
3
|
-
import Animated, { useSharedValue, useAnimatedStyle, withSpring } from 'react-native-reanimated';
|
|
2
|
+
import { StyleSheet, StyleProp, ViewStyle, TextStyle, TouchableOpacity, View } from 'react-native';
|
|
4
3
|
import { AtomicText } from './AtomicText';
|
|
5
4
|
import { Icon } from '../../domains/icons/presentation/components/Icon';
|
|
6
5
|
import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
|
|
@@ -16,7 +15,6 @@ export interface AtomicButtonProps {
|
|
|
16
15
|
variant?: ButtonVariant;
|
|
17
16
|
size?: ButtonSize;
|
|
18
17
|
disabled?: boolean;
|
|
19
|
-
loading?: boolean;
|
|
20
18
|
icon?: IconName;
|
|
21
19
|
fullWidth?: boolean;
|
|
22
20
|
style?: StyleProp<ViewStyle>;
|
|
@@ -24,8 +22,6 @@ export interface AtomicButtonProps {
|
|
|
24
22
|
testID?: string;
|
|
25
23
|
}
|
|
26
24
|
|
|
27
|
-
const AnimatedTouchable = Animated.createAnimatedComponent(TouchableOpacity);
|
|
28
|
-
|
|
29
25
|
export const AtomicButton: React.FC<AtomicButtonProps> = ({
|
|
30
26
|
title,
|
|
31
27
|
children,
|
|
@@ -33,7 +29,6 @@ export const AtomicButton: React.FC<AtomicButtonProps> = ({
|
|
|
33
29
|
variant = 'primary',
|
|
34
30
|
size = 'md',
|
|
35
31
|
disabled = false,
|
|
36
|
-
loading = false,
|
|
37
32
|
icon,
|
|
38
33
|
fullWidth = false,
|
|
39
34
|
style,
|
|
@@ -42,28 +37,8 @@ export const AtomicButton: React.FC<AtomicButtonProps> = ({
|
|
|
42
37
|
}) => {
|
|
43
38
|
const tokens = useAppDesignTokens();
|
|
44
39
|
|
|
45
|
-
// Animation
|
|
46
|
-
const scale = useSharedValue(1);
|
|
47
|
-
|
|
48
|
-
const animatedStyle = useAnimatedStyle(() => ({
|
|
49
|
-
transform: [{ scale: scale.value }],
|
|
50
|
-
}));
|
|
51
|
-
|
|
52
|
-
const handlePressIn = () => {
|
|
53
|
-
if (!disabled && !loading) {
|
|
54
|
-
scale.value = withSpring(0.95, {
|
|
55
|
-
damping: 15,
|
|
56
|
-
stiffness: 150,
|
|
57
|
-
});
|
|
58
|
-
}
|
|
59
|
-
};
|
|
60
|
-
|
|
61
|
-
const handlePressOut = () => {
|
|
62
|
-
scale.value = withSpring(1);
|
|
63
|
-
};
|
|
64
|
-
|
|
65
40
|
const handlePress = () => {
|
|
66
|
-
if (!disabled
|
|
41
|
+
if (!disabled) {
|
|
67
42
|
onPress();
|
|
68
43
|
}
|
|
69
44
|
};
|
|
@@ -204,27 +179,19 @@ export const AtomicButton: React.FC<AtomicButtonProps> = ({
|
|
|
204
179
|
];
|
|
205
180
|
|
|
206
181
|
const buttonText = title || children;
|
|
207
|
-
const showIcon = icon
|
|
182
|
+
const showIcon = !!icon;
|
|
208
183
|
const iconColor = variantStyles.text.color;
|
|
209
184
|
|
|
210
185
|
return (
|
|
211
|
-
<
|
|
212
|
-
style={
|
|
213
|
-
onPressIn={handlePressIn}
|
|
214
|
-
onPressOut={handlePressOut}
|
|
186
|
+
<TouchableOpacity
|
|
187
|
+
style={containerStyle}
|
|
215
188
|
onPress={handlePress}
|
|
216
189
|
activeOpacity={0.8}
|
|
217
|
-
disabled={disabled
|
|
190
|
+
disabled={disabled}
|
|
218
191
|
testID={testID}
|
|
219
192
|
>
|
|
220
193
|
<View style={styles.content}>
|
|
221
|
-
{
|
|
222
|
-
<ActivityIndicator
|
|
223
|
-
size="small"
|
|
224
|
-
color={variantStyles.text.color}
|
|
225
|
-
style={styles.loader}
|
|
226
|
-
/>
|
|
227
|
-
) : showIcon ? (
|
|
194
|
+
{showIcon ? (
|
|
228
195
|
<Icon
|
|
229
196
|
name={icon}
|
|
230
197
|
customSize={config.iconSize}
|
|
@@ -237,7 +204,7 @@ export const AtomicButton: React.FC<AtomicButtonProps> = ({
|
|
|
237
204
|
{buttonText}
|
|
238
205
|
</AtomicText>
|
|
239
206
|
</View>
|
|
240
|
-
</
|
|
207
|
+
</TouchableOpacity>
|
|
241
208
|
);
|
|
242
209
|
};
|
|
243
210
|
|
|
@@ -264,9 +231,6 @@ const styles = StyleSheet.create({
|
|
|
264
231
|
icon: {
|
|
265
232
|
marginRight: 8,
|
|
266
233
|
},
|
|
267
|
-
loader: {
|
|
268
|
-
marginRight: 8,
|
|
269
|
-
},
|
|
270
234
|
});
|
|
271
235
|
|
|
272
236
|
export type { AtomicButtonProps as ButtonProps };
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { View, StyleProp, ViewStyle } from 'react-native';
|
|
3
|
-
import Animated, { useSharedValue, useAnimatedStyle, withSpring } from 'react-native-reanimated';
|
|
4
|
-
import { Pressable } from 'react-native';
|
|
2
|
+
import { View, StyleProp, ViewStyle, Pressable } from 'react-native';
|
|
5
3
|
import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
|
|
6
4
|
|
|
7
5
|
export type AtomicCardVariant = 'flat' | 'elevated' | 'outlined';
|
|
@@ -17,7 +15,6 @@ export interface AtomicCardProps {
|
|
|
17
15
|
testID?: string;
|
|
18
16
|
}
|
|
19
17
|
|
|
20
|
-
const AnimatedPressable = Animated.createAnimatedComponent(Pressable);
|
|
21
18
|
|
|
22
19
|
export const AtomicCard: React.FC<AtomicCardProps> = ({
|
|
23
20
|
variant = 'elevated',
|
|
@@ -30,26 +27,6 @@ export const AtomicCard: React.FC<AtomicCardProps> = ({
|
|
|
30
27
|
}) => {
|
|
31
28
|
const tokens = useAppDesignTokens();
|
|
32
29
|
|
|
33
|
-
// Animation for tap feedback
|
|
34
|
-
const scale = useSharedValue(1);
|
|
35
|
-
|
|
36
|
-
const animatedStyle = useAnimatedStyle(() => ({
|
|
37
|
-
transform: [{ scale: scale.value }],
|
|
38
|
-
}));
|
|
39
|
-
|
|
40
|
-
const handlePressIn = () => {
|
|
41
|
-
if (onPress && !disabled) {
|
|
42
|
-
scale.value = withSpring(0.98, {
|
|
43
|
-
damping: 15,
|
|
44
|
-
stiffness: 150,
|
|
45
|
-
});
|
|
46
|
-
}
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
const handlePressOut = () => {
|
|
50
|
-
scale.value = withSpring(1);
|
|
51
|
-
};
|
|
52
|
-
|
|
53
30
|
const handlePress = () => {
|
|
54
31
|
if (onPress && !disabled) {
|
|
55
32
|
onPress();
|
|
@@ -116,17 +93,12 @@ export const AtomicCard: React.FC<AtomicCardProps> = ({
|
|
|
116
93
|
</View>
|
|
117
94
|
);
|
|
118
95
|
|
|
119
|
-
// If onPress provided, wrap with
|
|
96
|
+
// If onPress provided, wrap with pressable
|
|
120
97
|
if (onPress && !disabled) {
|
|
121
98
|
return (
|
|
122
|
-
<
|
|
123
|
-
style={animatedStyle}
|
|
124
|
-
onPressIn={handlePressIn}
|
|
125
|
-
onPressOut={handlePressOut}
|
|
126
|
-
onPress={handlePress}
|
|
127
|
-
>
|
|
99
|
+
<Pressable onPress={handlePress}>
|
|
128
100
|
{cardContent}
|
|
129
|
-
</
|
|
101
|
+
</Pressable>
|
|
130
102
|
);
|
|
131
103
|
}
|
|
132
104
|
|
|
@@ -215,7 +215,7 @@ export const AtomicDatePicker: React.FC<AtomicDatePickerProps> = ({
|
|
|
215
215
|
{show && (
|
|
216
216
|
<Modal
|
|
217
217
|
transparent
|
|
218
|
-
animationType=
|
|
218
|
+
animationType="none"
|
|
219
219
|
visible={show}
|
|
220
220
|
onRequestClose={() => setShow(false)}
|
|
221
221
|
>
|
|
@@ -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,20 +50,19 @@ 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
|
-
const sizeConfig = FAB_SIZES[size];
|
|
62
|
+
const sizeConfig = FAB_SIZES[size as 'sm' | 'md' | 'lg'];
|
|
65
63
|
const variants = getFabVariants(tokens);
|
|
66
|
-
const variantConfig = variants[variant];
|
|
67
|
-
const iconSize = getFabIconSize(size);
|
|
64
|
+
const variantConfig = variants[variant as 'primary' | 'secondary' | 'surface'];
|
|
65
|
+
const iconSize = getFabIconSize(size as 'sm' | 'md' | 'lg');
|
|
68
66
|
|
|
69
67
|
// Combine styles
|
|
70
68
|
const fabStyle = StyleSheet.flatten([
|
|
@@ -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
|
};
|
|
@@ -75,8 +75,8 @@ export const AtomicImage: React.FC<AtomicImageProps> = ({
|
|
|
75
75
|
const tokens = useAppDesignTokens();
|
|
76
76
|
const styles = getStyles(tokens);
|
|
77
77
|
|
|
78
|
-
const imageSize = SIZE_CONFIG[size];
|
|
79
|
-
const calculatedBorderRadius = borderRadius ?? getBorderRadius(shape, imageSize, tokens);
|
|
78
|
+
const imageSize = SIZE_CONFIG[size as 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl'];
|
|
79
|
+
const calculatedBorderRadius = borderRadius ?? getBorderRadius(shape as 'square' | 'circle' | 'rounded', imageSize, tokens);
|
|
80
80
|
|
|
81
81
|
const containerStyle = [
|
|
82
82
|
styles.container,
|
|
@@ -382,7 +382,7 @@ export const AtomicPicker: React.FC<AtomicPickerProps> = ({
|
|
|
382
382
|
{/* Selection Modal */}
|
|
383
383
|
<Modal
|
|
384
384
|
visible={modalVisible}
|
|
385
|
-
animationType="
|
|
385
|
+
animationType="none"
|
|
386
386
|
transparent
|
|
387
387
|
onRequestClose={closeModal}
|
|
388
388
|
testID={`${testID}-modal`}
|
|
@@ -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
|
}) => {
|