@0610studio/zs-ui 0.2.4 → 0.3.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/build/index.d.ts +2 -2
- package/build/index.js.map +1 -1
- package/build/theme/types.d.ts +6 -1
- package/build/theme/types.d.ts.map +1 -1
- package/build/theme/types.js.map +1 -1
- package/build/ui/ZSPressable/index.d.ts.map +1 -1
- package/build/ui/ZSPressable/index.js +1 -1
- package/build/ui/ZSPressable/index.js.map +1 -1
- package/build/ui/ZSText/index.d.ts +2 -2
- package/build/ui/ZSText/index.d.ts.map +1 -1
- package/build/ui/ZSText/index.js +2 -1
- package/build/ui/ZSText/index.js.map +1 -1
- package/build/ui/ZSView/index.d.ts +2 -0
- package/build/ui/ZSView/index.d.ts.map +1 -1
- package/build/ui/ZSView/index.js +2 -2
- package/build/ui/ZSView/index.js.map +1 -1
- package/build/ui/atoms/AnimatedWrapper.d.ts +3 -1
- package/build/ui/atoms/AnimatedWrapper.d.ts.map +1 -1
- package/build/ui/atoms/AnimatedWrapper.js +6 -4
- package/build/ui/atoms/AnimatedWrapper.js.map +1 -1
- package/package.json +1 -1
package/build/index.d.ts
CHANGED
|
@@ -6,9 +6,9 @@ export { useTheme, OverlayProvider, ThemeProvider, ZSView, AnimatedWrapper, Text
|
|
|
6
6
|
import type { ThemeProviderProps, ThemeProps, Palette } from "./model/useThemeProvider";
|
|
7
7
|
import { ZSTextProps } from "./ui/ZSText";
|
|
8
8
|
import { BoxStyle } from "./ui/ZSTextField";
|
|
9
|
-
import { ColorPalette, ColorPaletteExtend, ThemeTextType, ThemeBorderType, ThemeBackground, MainColors, Theme, TypographyVariants, ThemeFonts, TypoNumber, TypographyVariantsProps, TypoStyle, TypoOptions, TypoSubStyle,
|
|
9
|
+
import { ColorPalette, ColorPaletteExtend, ThemeTextType, ThemeBorderType, ThemeBackground, MainColors, Theme, TypographyVariants, ThemeFonts, TypoNumber, TypographyVariantsProps, TypoStyle, TypoOptions, TypoSubStyle, TypoColorOptions } from "./theme/types";
|
|
10
10
|
import { SnackItem, ShowAlertProps, ShowSnackBarProps, ShowBottomSheetProps, PopOverMenuProps, CustomSnackbarProps, OverlayProviderProps, AlertAction, AlertActions, SnackType, HideOption, BottomSheetOptions } from "./model/types";
|
|
11
11
|
import { RadioOption, ShadowLevel, ShadowStyle } from "./ui/types";
|
|
12
12
|
import { ZSContainerRef } from "./ui/ZSContainer";
|
|
13
|
-
export type { ThemeProviderProps, ThemeProps, Palette, ZSTextProps, BoxStyle, ColorPalette, ColorPaletteExtend, ThemeTextType, ThemeBorderType, ThemeBackground, MainColors, Theme, TypographyVariants, ThemeFonts, TypoNumber, TypographyVariantsProps, TypoStyle, TypoOptions, TypoSubStyle,
|
|
13
|
+
export type { ThemeProviderProps, ThemeProps, Palette, ZSTextProps, BoxStyle, ColorPalette, ColorPaletteExtend, ThemeTextType, ThemeBorderType, ThemeBackground, MainColors, Theme, TypographyVariants, ThemeFonts, TypoNumber, TypographyVariantsProps, TypoStyle, TypoOptions, TypoSubStyle, TypoColorOptions, SnackItem, ShowAlertProps, ShowSnackBarProps, ShowBottomSheetProps, PopOverMenuProps, CustomSnackbarProps, OverlayProviderProps, AlertAction, AlertActions, SnackType, HideOption, BottomSheetOptions, RadioOption, ShadowLevel, ShadowStyle, ZSContainerRef };
|
|
14
14
|
//# sourceMappingURL=index.d.ts.map
|
package/build/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,eAAe,EACf,aAAa,GACd,MAAM,SAAS,CAAA;AAEhB,OAAO,EACL,MAAM,EACN,eAAe,EACf,QAAQ,EACR,cAAc,EACd,WAAW,EACX,WAAW,EACX,MAAM,EACN,cAAc,EACd,WAAW,EACX,YAAY,EACZ,cAAc,GACf,MAAM,MAAM,CAAC;AAEd,OAAO,cAAc,MAAM,oCAAoC,CAAC;AAEhE,OAAO,EACL,YAAY,EACZ,kBAAkB,EAClB,cAAc,EACd,kBAAkB,EAClB,UAAU,EACV,aAAa,EACb,WAAW,GACZ,MAAM,WAAW,CAAC;AAEnB,OAAO,EACL,QAAQ,EACR,eAAe,EACf,aAAa;AACb,MAAM;AACN,MAAM,EACN,eAAe,EACf,QAAQ,EACR,cAAc,EACd,WAAW,EACX,WAAW,EACX,MAAM,EACN,cAAc,EACd,WAAW,EACX,YAAY,EACZ,cAAc,EACd,cAAc;AACd,MAAM;AACN,YAAY,EACZ,kBAAkB,EAClB,cAAc,EACd,kBAAkB,EAClB,UAAU,EACV,aAAa,EACb,WAAW,GACZ,CAAC","sourcesContent":["import {\n useTheme,\n OverlayProvider,\n ThemeProvider,\n} from './model'\n\nimport {\n ZSView,\n AnimatedWrapper,\n TextAtom,\n ScrollViewAtom,\n ZSContainer,\n ZSPressable,\n ZSText,\n ThrottleButton,\n ZSTextField,\n ZSRadioGroup,\n ZSBottomButton,\n} from './ui';\n\nimport ErrorComponent from './ui/ZSTextField/ui/ErrorComponent';\n\nimport {\n AlertOverlay,\n BottomSheetOverlay,\n SnackbarNotify,\n useOverlayProvider,\n useOverlay,\n PopOverButton,\n PopOverMenu,\n} from './overlay';\n\nexport {\n useTheme,\n OverlayProvider,\n ThemeProvider,\n // ---\n ZSView,\n AnimatedWrapper,\n TextAtom,\n ScrollViewAtom,\n ZSContainer,\n ZSPressable,\n ZSText,\n ThrottleButton,\n ZSTextField,\n ZSRadioGroup,\n ZSBottomButton,\n ErrorComponent,\n // ---\n AlertOverlay,\n BottomSheetOverlay,\n SnackbarNotify,\n useOverlayProvider,\n useOverlay,\n PopOverButton,\n PopOverMenu,\n};\n\n// ------------------------------------------------------\n\nimport type {\n ThemeProviderProps,\n ThemeProps,\n Palette,\n} from \"./model/useThemeProvider\";\nimport { ZSTextProps } from \"./ui/ZSText\";\nimport { BoxStyle } from \"./ui/ZSTextField\";\nimport {\n ColorPalette,\n ColorPaletteExtend,\n ThemeTextType,\n ThemeBorderType,\n ThemeBackground,\n MainColors,\n Theme,\n TypographyVariants,\n ThemeFonts,\n TypoNumber,\n TypographyVariantsProps,\n TypoStyle,\n TypoOptions,\n TypoSubStyle,\n
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,eAAe,EACf,aAAa,GACd,MAAM,SAAS,CAAA;AAEhB,OAAO,EACL,MAAM,EACN,eAAe,EACf,QAAQ,EACR,cAAc,EACd,WAAW,EACX,WAAW,EACX,MAAM,EACN,cAAc,EACd,WAAW,EACX,YAAY,EACZ,cAAc,GACf,MAAM,MAAM,CAAC;AAEd,OAAO,cAAc,MAAM,oCAAoC,CAAC;AAEhE,OAAO,EACL,YAAY,EACZ,kBAAkB,EAClB,cAAc,EACd,kBAAkB,EAClB,UAAU,EACV,aAAa,EACb,WAAW,GACZ,MAAM,WAAW,CAAC;AAEnB,OAAO,EACL,QAAQ,EACR,eAAe,EACf,aAAa;AACb,MAAM;AACN,MAAM,EACN,eAAe,EACf,QAAQ,EACR,cAAc,EACd,WAAW,EACX,WAAW,EACX,MAAM,EACN,cAAc,EACd,WAAW,EACX,YAAY,EACZ,cAAc,EACd,cAAc;AACd,MAAM;AACN,YAAY,EACZ,kBAAkB,EAClB,cAAc,EACd,kBAAkB,EAClB,UAAU,EACV,aAAa,EACb,WAAW,GACZ,CAAC","sourcesContent":["import {\n useTheme,\n OverlayProvider,\n ThemeProvider,\n} from './model'\n\nimport {\n ZSView,\n AnimatedWrapper,\n TextAtom,\n ScrollViewAtom,\n ZSContainer,\n ZSPressable,\n ZSText,\n ThrottleButton,\n ZSTextField,\n ZSRadioGroup,\n ZSBottomButton,\n} from './ui';\n\nimport ErrorComponent from './ui/ZSTextField/ui/ErrorComponent';\n\nimport {\n AlertOverlay,\n BottomSheetOverlay,\n SnackbarNotify,\n useOverlayProvider,\n useOverlay,\n PopOverButton,\n PopOverMenu,\n} from './overlay';\n\nexport {\n useTheme,\n OverlayProvider,\n ThemeProvider,\n // ---\n ZSView,\n AnimatedWrapper,\n TextAtom,\n ScrollViewAtom,\n ZSContainer,\n ZSPressable,\n ZSText,\n ThrottleButton,\n ZSTextField,\n ZSRadioGroup,\n ZSBottomButton,\n ErrorComponent,\n // ---\n AlertOverlay,\n BottomSheetOverlay,\n SnackbarNotify,\n useOverlayProvider,\n useOverlay,\n PopOverButton,\n PopOverMenu,\n};\n\n// ------------------------------------------------------\n\nimport type {\n ThemeProviderProps,\n ThemeProps,\n Palette,\n} from \"./model/useThemeProvider\";\nimport { ZSTextProps } from \"./ui/ZSText\";\nimport { BoxStyle } from \"./ui/ZSTextField\";\nimport {\n ColorPalette,\n ColorPaletteExtend,\n ThemeTextType,\n ThemeBorderType,\n ThemeBackground,\n MainColors,\n Theme,\n TypographyVariants,\n ThemeFonts,\n TypoNumber,\n TypographyVariantsProps,\n TypoStyle,\n TypoOptions,\n TypoSubStyle,\n TypoColorOptions\n} from \"./theme/types\";\nimport {\n SnackItem,\n ShowAlertProps,\n ShowSnackBarProps,\n ShowBottomSheetProps,\n PopOverMenuProps,\n CustomSnackbarProps,\n OverlayProviderProps,\n AlertAction,\n AlertActions,\n SnackType,\n HideOption,\n BottomSheetOptions\n} from \"./model/types\";\nimport {\n RadioOption,\n ShadowLevel,\n ShadowStyle,\n} from \"./ui/types\";\nimport { ZSContainerRef } from \"./ui/ZSContainer\";\n\nexport type {\n ThemeProviderProps,\n ThemeProps,\n Palette,\n ZSTextProps,\n BoxStyle,\n ColorPalette,\n ColorPaletteExtend,\n ThemeTextType,\n ThemeBorderType,\n ThemeBackground,\n MainColors,\n Theme,\n TypographyVariants,\n ThemeFonts,\n TypoNumber,\n TypographyVariantsProps,\n TypoStyle,\n TypoOptions,\n TypoSubStyle,\n TypoColorOptions,\n SnackItem,\n ShowAlertProps,\n ShowSnackBarProps,\n ShowBottomSheetProps,\n PopOverMenuProps,\n CustomSnackbarProps,\n OverlayProviderProps,\n AlertAction,\n AlertActions,\n SnackType,\n HideOption,\n BottomSheetOptions,\n RadioOption,\n ShadowLevel,\n ShadowStyle,\n ZSContainerRef\n};\n"]}
|
package/build/theme/types.d.ts
CHANGED
|
@@ -115,6 +115,11 @@ export interface TypographyVariantsProps extends TypographyVariants {
|
|
|
115
115
|
}
|
|
116
116
|
export type TypoStyle = 'heading' | 'title' | 'subTitle' | 'label' | 'body' | 'caption';
|
|
117
117
|
export type TypoOptions = 'heading.1' | 'heading.2' | 'heading.3' | 'heading.4' | 'heading.5' | 'heading.6' | 'title.1' | 'title.2' | 'title.3' | 'title.4' | 'title.5' | 'title.6' | 'subTitle.1' | 'subTitle.2' | 'subTitle.3' | 'subTitle.4' | 'subTitle.5' | 'subTitle.6' | 'body.1' | 'body.2' | 'body.3' | 'body.4' | 'body.5' | 'body.6' | 'label.1' | 'label.2' | 'label.3' | 'label.4' | 'label.5' | 'label.6' | 'caption.1' | 'caption.2' | 'caption.3' | 'caption.4' | 'caption.5' | 'caption.6';
|
|
118
|
+
export type CommonColorOptions = 'danger' | 'danger.5' | 'danger.10' | 'danger.20' | 'danger.30' | 'danger.40' | 'danger.50' | 'danger.60' | 'danger.70' | 'danger.80' | 'danger.90' | 'danger.100' | 'warning' | 'warning.5' | 'warning.10' | 'warning.20' | 'warning.30' | 'warning.40' | 'warning.50' | 'warning.60' | 'warning.70' | 'warning.80' | 'warning.90' | 'warning.100' | 'success' | 'success.5' | 'success.10' | 'success.20' | 'success.30' | 'success.40' | 'success.50' | 'success.60' | 'success.70' | 'success.80' | 'success.90' | 'success.100' | 'information' | 'information.5' | 'information.10' | 'information.20' | 'information.30' | 'information.40' | 'information.50' | 'information.60' | 'information.70' | 'information.80' | 'information.90' | 'information.100' | 'grey.5' | 'grey.10' | 'grey.20' | 'grey.30' | 'grey.40' | 'grey.50' | 'grey.60' | 'grey.70' | 'grey.80' | 'grey.90' | 'grey.100';
|
|
118
119
|
export type TypoSubStyle = '1' | '2' | '3' | '4' | '5' | '6';
|
|
119
|
-
export type
|
|
120
|
+
export type TypoColor = 'primary' | 'secondary' | 'disabled' | 'danger' | 'warning' | 'success' | 'information' | 'white' | 'black';
|
|
121
|
+
export type ViewColor = 'layer1' | 'layer2' | 'neutral' | 'base' | 'danger' | 'warning' | 'success' | 'information';
|
|
122
|
+
export type TypoColorOptions = 'primary' | 'secondary' | 'disabled' | 'white' | 'black' | CommonColorOptions;
|
|
123
|
+
export type SubColorOptions = undefined | '0' | '5' | '10' | '20' | '30' | '40' | '50' | '60' | '70' | '80' | '90' | '100';
|
|
124
|
+
export type ViewColorOptions = 'layer1' | 'layer2' | 'neutral' | 'base' | CommonColorOptions;
|
|
120
125
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"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"}
|
package/build/theme/types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"AAoGC,CAAC;AAYD,CAAC;AAaD,CAAC","sourcesContent":["import { TextProps } from \"react-native\";\n\nexport type ColorPalette = {\n 0: string;\n 5: string;\n 10: string; // p-lighter\n 20: string; // p-light\n 30: string;\n 40: string;\n 50: string; // p-main\n 60: string; // p-dark\n 70: string; // p-darker\n 80: string;\n 90: string;\n 100: string;\n main: string;\n};\n\nexport type ColorPaletteExtend = ColorPalette & {\n lighter: string;\n light: string;\n dark: string;\n darker: string;\n};\n\nexport interface ThemeTextType {\n main: string;\n primary: string;\n secondary: string;\n disabled: string;\n danger: string;\n warning: string;\n success: string;\n information: string;\n white: string;\n black: string;\n}\n\nexport interface ThemeBorderType {\n box: string;\n active: string;\n base: string;\n danger: string;\n warning: string;\n success: string;\n information: string;\n}\n\nexport interface ThemeBackground {\n layer1: string;\n layer2: string;\n neutral: string;\n base: string;\n danger: string;\n warning: string;\n success: string;\n information: string;\n}\n\nexport interface MainColors {\n primary: string;\n secondary: string;\n danger: string;\n warning: string;\n success: string;\n information: string;\n grey: string;\n}\n\nexport interface Theme {\n mode: 'light' | 'dark';\n primary: ColorPaletteExtend;\n secondary: ColorPalette;\n danger: ColorPalette;\n warning: ColorPalette;\n success: ColorPalette;\n information: ColorPalette;\n grey: ColorPalette;\n text: ThemeTextType;\n border: ThemeBorderType;\n background: ThemeBackground;\n action: {\n hover: string;\n pressed: string;\n disable: string;\n };\n divider: string;\n elevationShadow: string[];\n modalBgColor: string;\n mainColor: MainColors;\n}\n\nexport interface TypographyVariants {\n themeFonts?: ThemeFonts;\n heading: TypoNumber;\n label: TypoNumber;\n title: TypoNumber;\n subTitle: TypoNumber;\n body: TypoNumber;\n caption: TypoNumber;\n};\n\nexport interface ThemeFonts {\n 100?: string;\n 200?: string;\n 300?: string;\n 400: string;\n 500?: string;\n 600?: string;\n 700: string;\n 800?: string;\n 900?: string;\n};\n\nexport interface TypoNumber {\n '1': TextProps['style'];\n '2': TextProps['style'];\n '3': TextProps['style'];\n '4': TextProps['style'];\n '5': TextProps['style'];\n '6': TextProps['style'];\n}\n\nexport interface TypographyVariantsProps extends TypographyVariants {\n themeFonts?: ThemeFonts;\n};\n\nexport type TypoStyle = 'heading' | 'title' | 'subTitle' | 'label' | 'body' | 'caption';\n\nexport type TypoOptions =\n 'heading.1' |\n 'heading.2' |\n 'heading.3' |\n 'heading.4' |\n 'heading.5' |\n 'heading.6' |\n 'title.1' |\n 'title.2' |\n 'title.3' |\n 'title.4' |\n 'title.5' |\n 'title.6' |\n 'subTitle.1' |\n 'subTitle.2' |\n 'subTitle.3' |\n 'subTitle.4' |\n 'subTitle.5' |\n 'subTitle.6' |\n 'body.1' |\n 'body.2' |\n 'body.3' |\n 'body.4' |\n 'body.5' |\n 'body.6' |\n 'label.1' |\n 'label.2' |\n 'label.3' |\n 'label.4' |\n 'label.5' |\n 'label.6' |\n 'caption.1' |\n 'caption.2' |\n 'caption.3' |\n 'caption.4' |\n 'caption.5' |\n 'caption.6';\n\nexport type TypoSubStyle = '1' | '2' | '3' | '4' | '5' | '6';\n\nexport type
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"AAoGC,CAAC;AAYD,CAAC;AAaD,CAAC","sourcesContent":["import { TextProps } from \"react-native\";\n\nexport type ColorPalette = {\n 0: string;\n 5: string;\n 10: string; // p-lighter\n 20: string; // p-light\n 30: string;\n 40: string;\n 50: string; // p-main\n 60: string; // p-dark\n 70: string; // p-darker\n 80: string;\n 90: string;\n 100: string;\n main: string;\n};\n\nexport type ColorPaletteExtend = ColorPalette & {\n lighter: string;\n light: string;\n dark: string;\n darker: string;\n};\n\nexport interface ThemeTextType {\n main: string;\n primary: string;\n secondary: string;\n disabled: string;\n danger: string;\n warning: string;\n success: string;\n information: string;\n white: string;\n black: string;\n}\n\nexport interface ThemeBorderType {\n box: string;\n active: string;\n base: string;\n danger: string;\n warning: string;\n success: string;\n information: string;\n}\n\nexport interface ThemeBackground {\n layer1: string;\n layer2: string;\n neutral: string;\n base: string;\n danger: string;\n warning: string;\n success: string;\n information: string;\n}\n\nexport interface MainColors {\n primary: string;\n secondary: string;\n danger: string;\n warning: string;\n success: string;\n information: string;\n grey: string;\n}\n\nexport interface Theme {\n mode: 'light' | 'dark';\n primary: ColorPaletteExtend;\n secondary: ColorPalette;\n danger: ColorPalette;\n warning: ColorPalette;\n success: ColorPalette;\n information: ColorPalette;\n grey: ColorPalette;\n text: ThemeTextType;\n border: ThemeBorderType;\n background: ThemeBackground;\n action: {\n hover: string;\n pressed: string;\n disable: string;\n };\n divider: string;\n elevationShadow: string[];\n modalBgColor: string;\n mainColor: MainColors;\n}\n\nexport interface TypographyVariants {\n themeFonts?: ThemeFonts;\n heading: TypoNumber;\n label: TypoNumber;\n title: TypoNumber;\n subTitle: TypoNumber;\n body: TypoNumber;\n caption: TypoNumber;\n};\n\nexport interface ThemeFonts {\n 100?: string;\n 200?: string;\n 300?: string;\n 400: string;\n 500?: string;\n 600?: string;\n 700: string;\n 800?: string;\n 900?: string;\n};\n\nexport interface TypoNumber {\n '1': TextProps['style'];\n '2': TextProps['style'];\n '3': TextProps['style'];\n '4': TextProps['style'];\n '5': TextProps['style'];\n '6': TextProps['style'];\n}\n\nexport interface TypographyVariantsProps extends TypographyVariants {\n themeFonts?: ThemeFonts;\n};\n\nexport type TypoStyle = 'heading' | 'title' | 'subTitle' | 'label' | 'body' | 'caption';\n\nexport type TypoOptions =\n 'heading.1' |\n 'heading.2' |\n 'heading.3' |\n 'heading.4' |\n 'heading.5' |\n 'heading.6' |\n 'title.1' |\n 'title.2' |\n 'title.3' |\n 'title.4' |\n 'title.5' |\n 'title.6' |\n 'subTitle.1' |\n 'subTitle.2' |\n 'subTitle.3' |\n 'subTitle.4' |\n 'subTitle.5' |\n 'subTitle.6' |\n 'body.1' |\n 'body.2' |\n 'body.3' |\n 'body.4' |\n 'body.5' |\n 'body.6' |\n 'label.1' |\n 'label.2' |\n 'label.3' |\n 'label.4' |\n 'label.5' |\n 'label.6' |\n 'caption.1' |\n 'caption.2' |\n 'caption.3' |\n 'caption.4' |\n 'caption.5' |\n 'caption.6';\n\nexport type CommonColorOptions = 'danger' | 'danger.5' | 'danger.10' | 'danger.20' | 'danger.30' | 'danger.40' | 'danger.50' | 'danger.60' | 'danger.70' | 'danger.80' | 'danger.90' | 'danger.100'\n| 'warning' | 'warning.5' | 'warning.10' | 'warning.20' | 'warning.30' | 'warning.40' | 'warning.50' | 'warning.60' | 'warning.70' | 'warning.80' | 'warning.90' | 'warning.100'\n| 'success' | 'success.5' | 'success.10' | 'success.20' | 'success.30' | 'success.40' | 'success.50' | 'success.60' | 'success.70' | 'success.80' | 'success.90' | 'success.100'\n| 'information' | 'information.5' | 'information.10' | 'information.20' | 'information.30' | 'information.40' | 'information.50' | 'information.60' | 'information.70' | 'information.80' | 'information.90' | 'information.100'\n| 'grey.5' | 'grey.10' | 'grey.20' | 'grey.30' | 'grey.40' | 'grey.50' | 'grey.60' | 'grey.70' | 'grey.80' | 'grey.90' | 'grey.100';\n\nexport type TypoSubStyle = '1' | '2' | '3' | '4' | '5' | '6';\n\nexport type TypoColor = 'primary' | 'secondary' | 'disabled' | 'danger' | 'warning' | 'success' | 'information' | 'white' | 'black';\n\nexport type ViewColor = 'layer1' | 'layer2' | 'neutral' | 'base' | 'danger' | 'warning' | 'success' | 'information';\n\nexport type TypoColorOptions = 'primary' | 'secondary' | 'disabled' | 'white' | 'black' | CommonColorOptions;\n\nexport type SubColorOptions = undefined | '0' | '5' | '10' | '20' | '30' | '40' | '50' | '60' | '70' | '80' | '90' | '100';\n\nexport type ViewColorOptions = 'layer1' | 'layer2' | 'neutral' | 'base' | CommonColorOptions;"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSPressable/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAA4B,SAAS,EAAE,MAAM,cAAc,CAAC;AAGnE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAI5C,UAAU,gBAAiB,SAAQ,SAAS;IAC1C,OAAO,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC/B,WAAW,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IACpC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,6BAA6B,CAAC,EAAE,MAAM,CAAC;IACvC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,iBAAS,WAAW,CAAC,EACnB,OAAO,EACP,WAAW,EACX,WAAkB,EAClB,sBAAmD,EACnD,6BAAkC,EAClC,IAAI,EACJ,QAAQ,EACR,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSPressable/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAA4B,SAAS,EAAE,MAAM,cAAc,CAAC;AAGnE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAI5C,UAAU,gBAAiB,SAAQ,SAAS;IAC1C,OAAO,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC/B,WAAW,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IACpC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,6BAA6B,CAAC,EAAE,MAAM,CAAC;IACvC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,iBAAS,WAAW,CAAC,EACnB,OAAO,EACP,WAAW,EACX,WAAkB,EAClB,sBAAmD,EACnD,6BAAkC,EAClC,IAAI,EACJ,QAAQ,EACR,cAAc,EACd,SAAiB,EACjB,GAAG,KAAK,EACT,EAAE,gBAAgB,qBAgDlB;AAED,eAAe,WAAW,CAAC"}
|
|
@@ -3,7 +3,7 @@ import { Pressable } from "react-native";
|
|
|
3
3
|
import Animated, { interpolate, useAnimatedStyle, useSharedValue, withTiming, runOnJS } from "react-native-reanimated";
|
|
4
4
|
import AnimatedWrapper from "../atoms/AnimatedWrapper";
|
|
5
5
|
const DEFAULT_DURATION = { duration: 100 };
|
|
6
|
-
function ZSPressable({ onPress, onLongPress, isAnimation = true, pressedBackgroundColor = 'rgba(180, 180, 180, 0.1)', pressedBackgroundBorderRadius = 16, flex, minWidth, elevationLevel
|
|
6
|
+
function ZSPressable({ onPress, onLongPress, isAnimation = true, pressedBackgroundColor = 'rgba(180, 180, 180, 0.1)', pressedBackgroundBorderRadius = 16, flex, minWidth, elevationLevel, fullWidth = false, ...props }) {
|
|
7
7
|
const isButtonPress = useSharedValue(0);
|
|
8
8
|
const boxAnimation = useAnimatedStyle(() => {
|
|
9
9
|
const scale = interpolate(isButtonPress.value, [0, 1], [1, 0.96], 'clamp');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSPressable/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAiB,SAAS,EAAa,MAAM,cAAc,CAAC;AACnE,OAAO,QAAQ,EAAE,EAAE,WAAW,EAAE,gBAAgB,EAAE,cAAc,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AACvH,OAAO,eAAe,MAAM,0BAA0B,CAAC;AAGvD,MAAM,gBAAgB,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC;AAc3C,SAAS,WAAW,CAAC,EACnB,OAAO,EACP,WAAW,EACX,WAAW,GAAG,IAAI,EAClB,sBAAsB,GAAG,0BAA0B,EACnD,6BAA6B,GAAG,EAAE,EAClC,IAAI,EACJ,QAAQ,EACR,cAAc,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSPressable/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAiB,SAAS,EAAa,MAAM,cAAc,CAAC;AACnE,OAAO,QAAQ,EAAE,EAAE,WAAW,EAAE,gBAAgB,EAAE,cAAc,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AACvH,OAAO,eAAe,MAAM,0BAA0B,CAAC;AAGvD,MAAM,gBAAgB,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC;AAc3C,SAAS,WAAW,CAAC,EACnB,OAAO,EACP,WAAW,EACX,WAAW,GAAG,IAAI,EAClB,sBAAsB,GAAG,0BAA0B,EACnD,6BAA6B,GAAG,EAAE,EAClC,IAAI,EACJ,QAAQ,EACR,cAAc,EACd,SAAS,GAAG,KAAK,EACjB,GAAG,KAAK,EACS;IACjB,MAAM,aAAa,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC;IAExC,MAAM,YAAY,GAAG,gBAAgB,CAAC,GAAG,EAAE;QACzC,MAAM,KAAK,GAAG,WAAW,CACvB,aAAa,CAAC,KAAK,EACnB,CAAC,CAAC,EAAE,CAAC,CAAC,EACN,CAAC,CAAC,EAAE,IAAI,CAAC,EACT,OAAO,CACR,CAAC;QACF,OAAO;YACL,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,UAAU,CAAC,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC;SAC5D,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,gBAAgB,GAAG,WAAW,CAClC,CAAC,OAAgB,EAAE,EAAE;QACnB,OAAO,CAAC,GAAG,EAAE;YACX,aAAa,CAAC,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACxC,CAAC,CAAC,EAAE,CAAC;QACL,OAAO;YACL,eAAe,EAAE,OAAO,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,aAAa;YACjE,YAAY,EAAE,6BAA6B;YAC3C,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI;YAC1B,QAAQ,EAAE,QAAQ;YAClB,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAsC;SAC1E,CAAC;IACJ,CAAC,EACD,CAAC,sBAAsB,EAAE,6BAA6B,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,CAAC,CACnF,CAAC;IAEF,OAAO,CACL,CAAC,SAAS,CACR,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,KAAK,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAElD;MAAA,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,CACjC;QAAA,CAAC,eAAe,CACd,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,cAAc,CAAC,CAAC,cAAc,CAAC,CAC/B,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAEnB;UAAA,CAAC,KAAK,CAAC,QAAQ,CACjB;QAAA,EAAE,eAAe,CACnB;MAAA,EAAE,QAAQ,CAAC,IAAI,CACjB;IAAA,EAAE,SAAS,CAAC,CACb,CAAC;AACJ,CAAC;AAED,eAAe,WAAW,CAAC","sourcesContent":["import React, { useCallback } from \"react\";\nimport { FlexAlignType, Pressable, ViewProps } from \"react-native\";\nimport Animated, { interpolate, useAnimatedStyle, useSharedValue, withTiming, runOnJS } from \"react-native-reanimated\";\nimport AnimatedWrapper from \"../atoms/AnimatedWrapper\";\nimport type { ShadowLevel } from \"../types\";\n\nconst DEFAULT_DURATION = { duration: 100 };\n\ninterface ZSPressableProps extends ViewProps {\n onPress: (value?: any) => void;\n onLongPress?: (value?: any) => void;\n pressedBackgroundColor?: string;\n pressedBackgroundBorderRadius?: number;\n flex?: number;\n minWidth?: number;\n isAnimation?: boolean;\n elevationLevel?: ShadowLevel;\n fullWidth?: boolean;\n}\n\nfunction ZSPressable({\n onPress,\n onLongPress,\n isAnimation = true,\n pressedBackgroundColor = 'rgba(180, 180, 180, 0.1)',\n pressedBackgroundBorderRadius = 16,\n flex,\n minWidth,\n elevationLevel,\n fullWidth = false,\n ...props\n}: ZSPressableProps) {\n const isButtonPress = useSharedValue(0);\n\n const boxAnimation = useAnimatedStyle(() => {\n const scale = interpolate(\n isButtonPress.value,\n [0, 1],\n [1, 0.96],\n 'clamp'\n );\n return {\n transform: [{ scale: withTiming(scale, DEFAULT_DURATION) }],\n };\n }, []);\n\n const handlePressStyle = useCallback(\n (pressed: boolean) => {\n runOnJS(() => {\n isButtonPress.value = pressed ? 1 : 0;\n })();\n return {\n backgroundColor: pressed ? pressedBackgroundColor : 'transparent',\n borderRadius: pressedBackgroundBorderRadius,\n flex: fullWidth ? 1 : flex,\n minWidth: minWidth,\n alignSelf: fullWidth ? 'stretch' : undefined as FlexAlignType | undefined,\n };\n },\n [pressedBackgroundColor, pressedBackgroundBorderRadius, flex, minWidth, fullWidth]\n );\n\n return (\n <Pressable\n onPress={onPress}\n onLongPress={onLongPress}\n style={({ pressed }) => handlePressStyle(pressed)}\n >\n <Animated.View style={boxAnimation}>\n <AnimatedWrapper\n isAnimation={isAnimation}\n elevationLevel={elevationLevel}\n style={props.style}\n >\n {props.children}\n </AnimatedWrapper>\n </Animated.View>\n </Pressable>\n );\n}\n\nexport default ZSPressable;\n"]}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { TextProps } from "react-native/types";
|
|
3
|
-
import { TypoOptions,
|
|
3
|
+
import { TypoOptions, TypoColorOptions } from "../../theme/types";
|
|
4
4
|
export interface ZSTextProps extends TextProps {
|
|
5
5
|
typo?: TypoOptions;
|
|
6
|
-
color?:
|
|
6
|
+
color?: TypoColorOptions;
|
|
7
7
|
}
|
|
8
8
|
declare function ZSText({ typo, color, ...props }: ZSTextProps): React.JSX.Element;
|
|
9
9
|
declare const _default: React.MemoExoticComponent<typeof ZSText>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSText/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AACpC,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE/C,OAAO,EAAE,WAAW,EAAa,gBAAgB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSText/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AACpC,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE/C,OAAO,EAAE,WAAW,EAAa,gBAAgB,EAA4C,MAAM,mBAAmB,CAAC;AAGvH,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC1C,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC5B;AAED,iBAAS,MAAM,CAAC,EACd,IAAe,EACf,KAAiB,EACjB,GAAG,KAAK,EACT,EAAE,WAAW,qBAKb;;AAED,wBAA4B"}
|
package/build/ui/ZSText/index.js
CHANGED
|
@@ -4,7 +4,8 @@ import TextAtom from "../atoms/TextAtom";
|
|
|
4
4
|
function ZSText({ typo = 'body.2', color = 'primary', ...props }) {
|
|
5
5
|
const { palette, typography } = useTheme();
|
|
6
6
|
const [s01, s02] = typo.split('.');
|
|
7
|
-
|
|
7
|
+
const [c01, c02] = color.split('.');
|
|
8
|
+
return <TextAtom {...props} style={[typography[s01][s02], { color: c02 ? palette[c01][c02] : palette.text[c01] }, props.style]}>{props.children}</TextAtom>;
|
|
8
9
|
}
|
|
9
10
|
export default memo(ZSText);
|
|
10
11
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSText/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAEpC,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAExD,OAAO,QAAQ,MAAM,mBAAmB,CAAA;AAOxC,SAAS,MAAM,CAAC,EACd,IAAI,GAAG,QAAQ,EACf,KAAK,GAAG,SAAS,EACjB,GAAG,KAAK,EACI;IACV,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC3C,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAA8B,CAAC;IAChE,OAAO,CAAC,QAAQ,CAAC,IAAI,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSText/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAEpC,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAExD,OAAO,QAAQ,MAAM,mBAAmB,CAAA;AAOxC,SAAS,MAAM,CAAC,EACd,IAAI,GAAG,QAAQ,EACf,KAAK,GAAG,SAAS,EACjB,GAAG,KAAK,EACI;IACV,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC3C,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAA8B,CAAC;IAChE,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAiC,CAAC;IACpE,OAAO,CAAC,QAAQ,CAAC,IAAI,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,QAAQ,CAAC,CAAA;AAC/J,CAAC;AAED,eAAe,IAAI,CAAC,MAAM,CAAC,CAAC","sourcesContent":["import React, { memo } from 'react';\nimport { TextProps } from \"react-native/types\";\nimport { useTheme } from \"../../model/useThemeProvider\";\nimport { TypoOptions, TypoStyle, TypoColorOptions, TypoSubStyle, TypoColor, SubColorOptions } from \"../../theme/types\";\nimport TextAtom from \"../atoms/TextAtom\"\n\nexport interface ZSTextProps extends TextProps {\n typo?: TypoOptions;\n color?: TypoColorOptions;\n}\n\nfunction ZSText({\n typo = 'body.2',\n color = 'primary',\n ...props\n}: ZSTextProps) {\n const { palette, typography } = useTheme();\n const [s01, s02] = typo.split('.') as [TypoStyle, TypoSubStyle];\n const [c01, c02] = color.split('.') as [TypoColor, SubColorOptions];\n return <TextAtom {...props} style={[typography[s01][s02], { color: c02 ? palette[c01][c02] : palette.text[c01] }, props.style]}>{props.children}</TextAtom>\n}\n\nexport default memo(ZSText);\n"]}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { ViewProps } from 'react-native';
|
|
3
3
|
import { ShadowLevel } from '../types';
|
|
4
|
+
import { ViewColorOptions } from '../../theme';
|
|
4
5
|
type Props = ViewProps & {
|
|
5
6
|
isAnimation?: boolean;
|
|
6
7
|
elevationLevel?: ShadowLevel;
|
|
8
|
+
color?: ViewColorOptions;
|
|
7
9
|
};
|
|
8
10
|
declare const _default: React.NamedExoticComponent<Props>;
|
|
9
11
|
export default _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSView/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAc,MAAM,cAAc,CAAC;AAGrD,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/ZSView/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAc,MAAM,cAAc,CAAC;AAGrD,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,KAAK,KAAK,GAAG,SAAS,GAAG;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B,CAAC;;AAsBF,wBAA4B"}
|
package/build/ui/ZSView/index.js
CHANGED
|
@@ -2,14 +2,14 @@ import React, { memo, useMemo } from 'react';
|
|
|
2
2
|
import { StyleSheet } from 'react-native';
|
|
3
3
|
import { useTheme } from '../../model/useThemeProvider';
|
|
4
4
|
import AnimatedWrapper from '../atoms/AnimatedWrapper';
|
|
5
|
-
const ZSView = ({ isAnimation = false, elevationLevel = 0, style, children, ...rest }) => {
|
|
5
|
+
const ZSView = ({ isAnimation = false, elevationLevel = 0, style, children, color, ...rest }) => {
|
|
6
6
|
const { palette } = useTheme();
|
|
7
7
|
const styles = useMemo(() => StyleSheet.create({
|
|
8
8
|
container: {
|
|
9
9
|
backgroundColor: palette.background.base,
|
|
10
10
|
},
|
|
11
11
|
}), [palette.background.base]);
|
|
12
|
-
return (<AnimatedWrapper isAnimation={isAnimation} elevationLevel={elevationLevel} style={[styles.container, style]} {...rest}>
|
|
12
|
+
return (<AnimatedWrapper color={color} isAnimation={isAnimation} elevationLevel={elevationLevel} style={[styles.container, style]} {...rest}>
|
|
13
13
|
{children}
|
|
14
14
|
</AnimatedWrapper>);
|
|
15
15
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSView/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAa,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AACxD,OAAO,eAAe,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/ZSView/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAa,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AACxD,OAAO,eAAe,MAAM,0BAA0B,CAAC;AAUvD,MAAM,MAAM,GAAoB,CAAC,EAAE,WAAW,GAAG,KAAK,EAAE,cAAc,GAAG,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE;IAC/G,MAAM,EAAE,OAAO,EAAE,GAAG,QAAQ,EAAE,CAAC;IAE/B,MAAM,MAAM,GAAG,OAAO,CACpB,GAAG,EAAE,CACH,UAAU,CAAC,MAAM,CAAC;QAChB,SAAS,EAAE;YACT,eAAe,EAAE,OAAO,CAAC,UAAU,CAAC,IAAI;SACzC;KACF,CAAC,EACJ,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,CAC1B,CAAC;IAEF,OAAO,CACL,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,CAAC,WAAW,CAAC,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,CAClI;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,eAAe,CAAC,CACnB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,IAAI,CAAC,MAAM,CAAC,CAAC","sourcesContent":["import React, { memo, useMemo } from 'react';\nimport { ViewProps, StyleSheet } from 'react-native';\nimport { useTheme } from '../../model/useThemeProvider';\nimport AnimatedWrapper from '../atoms/AnimatedWrapper';\nimport { ShadowLevel } from '../types';\nimport { ViewColorOptions } from '../../theme';\n\ntype Props = ViewProps & {\n isAnimation?: boolean;\n elevationLevel?: ShadowLevel;\n color?: ViewColorOptions;\n};\n\nconst ZSView: React.FC<Props> = ({ isAnimation = false, elevationLevel = 0, style, children, color, ...rest }) => {\n const { palette } = useTheme();\n\n const styles = useMemo(\n () =>\n StyleSheet.create({\n container: {\n backgroundColor: palette.background.base,\n },\n }),\n [palette.background.base],\n );\n\n return (\n <AnimatedWrapper color={color} isAnimation={isAnimation} elevationLevel={elevationLevel} style={[styles.container, style]} {...rest}>\n {children}\n </AnimatedWrapper>\n );\n};\n\nexport default memo(ZSView);\n"]}
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { ViewProps } from 'react-native';
|
|
3
3
|
import { ShadowLevel } from '../types';
|
|
4
|
+
import { ViewColorOptions } from '../../theme/types';
|
|
4
5
|
interface AnimatedWrapperProps extends ViewProps {
|
|
5
6
|
isAnimation: boolean;
|
|
6
7
|
elevationLevel?: ShadowLevel;
|
|
7
8
|
duration?: number;
|
|
9
|
+
color?: ViewColorOptions;
|
|
8
10
|
}
|
|
9
|
-
declare function AnimatedWrapper({ isAnimation, elevationLevel, duration, style, children, ...props }: AnimatedWrapperProps): React.JSX.Element;
|
|
11
|
+
declare function AnimatedWrapper({ isAnimation, elevationLevel, duration, style, children, color, ...props }: AnimatedWrapperProps): React.JSX.Element;
|
|
10
12
|
declare const _default: React.MemoExoticComponent<typeof AnimatedWrapper>;
|
|
11
13
|
export default _default;
|
|
12
14
|
//# sourceMappingURL=AnimatedWrapper.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AnimatedWrapper.d.ts","sourceRoot":"","sources":["../../../src/ui/atoms/AnimatedWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,EAAQ,SAAS,EAAY,MAAM,cAAc,CAAC;AAGzD,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"AnimatedWrapper.d.ts","sourceRoot":"","sources":["../../../src/ui/atoms/AnimatedWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,EAAQ,SAAS,EAAY,MAAM,cAAc,CAAC;AAGzD,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAEvC,OAAO,EAA8B,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAKjF,UAAU,oBAAqB,SAAQ,SAAS;IAC9C,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B;AAED,iBAAS,eAAe,CAAC,EACvB,WAAkB,EAClB,cAAkB,EAClB,QAA2B,EAC3B,KAAK,EACL,QAAQ,EACR,KAAK,EACL,GAAG,KAAK,EACT,EAAE,oBAAoB,qBAgDtB;;AAED,wBAA2C"}
|
|
@@ -5,9 +5,11 @@ import { useTheme } from '../../model/useThemeProvider';
|
|
|
5
5
|
import { IOS_SHADOW } from '../../theme/elevation';
|
|
6
6
|
const DEFAULT_DURATION = 200;
|
|
7
7
|
const SHADOW_DURATION = 50;
|
|
8
|
-
function AnimatedWrapper({ isAnimation = true, elevationLevel = 0, duration = DEFAULT_DURATION, style, children, ...props }) {
|
|
9
|
-
const { elevation } = useTheme();
|
|
8
|
+
function AnimatedWrapper({ isAnimation = true, elevationLevel = 0, duration = DEFAULT_DURATION, style, children, color, ...props }) {
|
|
9
|
+
const { elevation, palette } = useTheme();
|
|
10
10
|
const opacity = useSharedValue(0);
|
|
11
|
+
const [c01, c02] = color ? color.split('.') : [undefined, undefined];
|
|
12
|
+
const backgroundColor = c02 ? palette[c01][c02] : c01 ? palette.background[c01] : elevationLevel ? palette.background.base : undefined;
|
|
11
13
|
// 그림자 및 기타 스타일을 플랫폼에 맞게 미리 계산
|
|
12
14
|
const staticStyle = useMemo(() => {
|
|
13
15
|
return { ...elevation[elevationLevel] };
|
|
@@ -34,9 +36,9 @@ function AnimatedWrapper({ isAnimation = true, elevationLevel = 0, duration = DE
|
|
|
34
36
|
}), [duration, onEntering]);
|
|
35
37
|
// 애니메이션이 비활성화된 경우 기본 View로 렌더링
|
|
36
38
|
if (!isAnimation) {
|
|
37
|
-
return <View style={[style,
|
|
39
|
+
return <View style={[style, backgroundColor && { backgroundColor }, { ...elevation[elevationLevel] }]} {...props}>{children}</View>;
|
|
38
40
|
}
|
|
39
|
-
return (<Animated.View style={[style, staticStyle, animatedStyle]} {...animationProps} {...props}>
|
|
41
|
+
return (<Animated.View style={[style, backgroundColor && { backgroundColor }, staticStyle, animatedStyle]} {...animationProps} {...props}>
|
|
40
42
|
{children}
|
|
41
43
|
</Animated.View>);
|
|
42
44
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AnimatedWrapper.js","sourceRoot":"","sources":["../../../src/ui/atoms/AnimatedWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,IAAI,EAAa,QAAQ,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,QAAQ,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,gBAAgB,EAAE,UAAU,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAC/H,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAExD,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"AnimatedWrapper.js","sourceRoot":"","sources":["../../../src/ui/atoms/AnimatedWrapper.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useMemo, useCallback } from 'react';\nimport { View, ViewProps, Platform } from 'react-native';\nimport Animated, { FadeInDown, FadeOut, useAnimatedStyle, withTiming, useSharedValue, runOnJS } from 'react-native-reanimated';\nimport { useTheme } from '../../model/useThemeProvider';\nimport { ShadowLevel } from '../types';\nimport { IOS_SHADOW } from '../../theme/elevation';\nimport { SubColorOptions, ViewColor, ViewColorOptions } from '../../theme/types';\n\nconst DEFAULT_DURATION = 200 as const;\nconst SHADOW_DURATION = 50 as const;\n\ninterface AnimatedWrapperProps extends ViewProps {\n isAnimation: boolean;\n elevationLevel?: ShadowLevel;\n duration?: number;\n color?: ViewColorOptions;\n}\n\nfunction AnimatedWrapper({\n isAnimation = true,\n elevationLevel = 0,\n duration = DEFAULT_DURATION,\n style,\n children,\n color,\n ...props\n}: AnimatedWrapperProps) {\n const { elevation, palette } = useTheme();\n const opacity = useSharedValue(0);\n const [c01, c02] = color ? color.split('.') as [ViewColor, SubColorOptions] : [undefined, undefined];\n const backgroundColor = c02 ? palette[c01][c02] : c01 ? palette.background[c01] : elevationLevel ? palette.background.base : undefined;\n\n // 그림자 및 기타 스타일을 플랫폼에 맞게 미리 계산\n const staticStyle = useMemo(() => {\n return { ...elevation[elevationLevel] };\n }, [elevation]);\n\n // 애니메이션 스타일 정의 (iOS 그림자 및 Android elevation 처리)\n const animatedStyle = useAnimatedStyle(() => {\n if (Platform.OS === 'ios') {\n return { shadowOpacity: opacity.value * IOS_SHADOW[elevationLevel].shadowOpacity };\n }\n return { elevation: opacity.value * elevationLevel };\n }, [elevationLevel]);\n\n // 컴포넌트가 등장할 때 애니메이션 핸들링\n const onEntering = useCallback(() => {\n opacity.value = withTiming(1, { duration: SHADOW_DURATION });\n }, [opacity]);\n\n const animationProps = useMemo(() => ({\n entering: FadeInDown.duration(duration).withCallback((finished) => {\n 'worklet';\n if (finished) {\n runOnJS(onEntering)();\n }\n }),\n exiting: FadeOut.duration(50),\n }), [duration, onEntering]);\n\n // 애니메이션이 비활성화된 경우 기본 View로 렌더링\n if (!isAnimation) {\n return <View style={[style, backgroundColor && { backgroundColor }, { ...elevation[elevationLevel] }]} {...props}>{children}</View>;\n }\n\n return (\n <Animated.View\n style={[style, backgroundColor && { backgroundColor }, staticStyle, animatedStyle]}\n {...animationProps}\n {...props}\n >\n {children}\n </Animated.View>\n );\n}\n\nexport default React.memo(AnimatedWrapper);\n"]}
|