@0610studio/zs-ui 0.17.0 → 0.18.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/android/build.gradle +3 -3
- package/build/ZsUiView.js +2 -2
- package/build/ZsUiView.js.map +1 -1
- package/build/ZsUiView.web.js +2 -4
- package/build/ZsUiView.web.js.map +1 -1
- package/build/assets/SvgCheck.js +2 -4
- package/build/assets/SvgCheck.js.map +1 -1
- package/build/assets/SvgExclamation.js +2 -9
- package/build/assets/SvgExclamation.js.map +1 -1
- package/build/assets/SvgX.js +3 -5
- package/build/assets/SvgX.js.map +1 -1
- package/build/context/OverlayContext.js +2 -29
- package/build/context/OverlayContext.js.map +1 -1
- package/build/context/ThemeContext.d.ts.map +1 -1
- package/build/context/ThemeContext.js +72 -42
- package/build/context/ThemeContext.js.map +1 -1
- package/build/overlay/AlertOverlay/index.js +8 -25
- package/build/overlay/AlertOverlay/index.js.map +1 -1
- package/build/overlay/BottomSheetOverlay/index.d.ts.map +1 -1
- package/build/overlay/BottomSheetOverlay/index.js +3 -18
- package/build/overlay/BottomSheetOverlay/index.js.map +1 -1
- package/build/overlay/LoadingNotify/index.js +4 -5
- package/build/overlay/LoadingNotify/index.js.map +1 -1
- package/build/overlay/Modality/index.d.ts.map +1 -1
- package/build/overlay/Modality/index.js +20 -32
- package/build/overlay/Modality/index.js.map +1 -1
- package/build/overlay/PopOver/PopOverButton.js +3 -6
- package/build/overlay/PopOver/PopOverButton.js.map +1 -1
- package/build/overlay/PopOver/PopOverMenu.js +7 -12
- package/build/overlay/PopOver/PopOverMenu.js.map +1 -1
- package/build/overlay/SnackbarNotify/index.js +4 -6
- package/build/overlay/SnackbarNotify/index.js.map +1 -1
- package/build/overlay/SnackbarNotify/ui/SnackbarItem.js +6 -13
- package/build/overlay/SnackbarNotify/ui/SnackbarItem.js.map +1 -1
- package/build/overlay/ZSPortal/index.js +3 -7
- package/build/overlay/ZSPortal/index.js.map +1 -1
- package/build/overlay/ui/ModalBackground.js +5 -9
- package/build/overlay/ui/ModalBackground.js.map +1 -1
- package/build/ui/ZSAboveKeyboard/index.js +2 -5
- package/build/ui/ZSAboveKeyboard/index.js.map +1 -1
- package/build/ui/ZSBlockButton/index.js +13 -17
- package/build/ui/ZSBlockButton/index.js.map +1 -1
- package/build/ui/ZSContainer/index.js +3 -36
- package/build/ui/ZSContainer/index.js.map +1 -1
- package/build/ui/ZSPressable/index.d.ts.map +1 -1
- package/build/ui/ZSPressable/index.js +2 -10
- package/build/ui/ZSPressable/index.js.map +1 -1
- package/build/ui/ZSRadioGroup/index.js +41 -64
- package/build/ui/ZSRadioGroup/index.js.map +1 -1
- package/build/ui/ZSSkeleton/index.d.ts.map +1 -1
- package/build/ui/ZSSkeleton/index.js +3 -13
- package/build/ui/ZSSkeleton/index.js.map +1 -1
- package/build/ui/ZSSkeletonBox/index.d.ts.map +1 -1
- package/build/ui/ZSSkeletonBox/index.js +9 -17
- package/build/ui/ZSSkeletonBox/index.js.map +1 -1
- package/build/ui/ZSSwitch/index.d.ts.map +1 -1
- package/build/ui/ZSSwitch/index.js +16 -23
- package/build/ui/ZSSwitch/index.js.map +1 -1
- package/build/ui/ZSText/index.js +2 -2
- package/build/ui/ZSText/index.js.map +1 -1
- package/build/ui/ZSTextField/index.d.ts.map +1 -1
- package/build/ui/ZSTextField/index.js +40 -59
- package/build/ui/ZSTextField/index.js.map +1 -1
- package/build/ui/ZSTextField/ui/ButtonClose.js +2 -3
- package/build/ui/ZSTextField/ui/ButtonClose.js.map +1 -1
- package/build/ui/ZSTextField/ui/ErrorComponent.js +2 -7
- package/build/ui/ZSTextField/ui/ErrorComponent.js.map +1 -1
- package/build/ui/ZSView/index.js +3 -4
- package/build/ui/ZSView/index.js.map +1 -1
- package/build/ui/atoms/AnimatedWrapper.d.ts.map +1 -1
- package/build/ui/atoms/AnimatedWrapper.js +4 -6
- package/build/ui/atoms/AnimatedWrapper.js.map +1 -1
- package/build/ui/atoms/TextAtom.js +2 -4
- package/build/ui/atoms/TextAtom.js.map +1 -1
- package/build/ui/atoms/ViewAtom.js +2 -4
- package/build/ui/atoms/ViewAtom.js.map +1 -1
- package/ios/ZsUi.podspec +1 -1
- package/package.json +30 -28
package/android/build.gradle
CHANGED
|
@@ -23,10 +23,10 @@ if (useManagedAndroidSdkVersions) {
|
|
|
23
23
|
}
|
|
24
24
|
}
|
|
25
25
|
project.android {
|
|
26
|
-
compileSdkVersion safeExtGet("compileSdkVersion",
|
|
26
|
+
compileSdkVersion safeExtGet("compileSdkVersion", 36)
|
|
27
27
|
defaultConfig {
|
|
28
|
-
minSdkVersion safeExtGet("minSdkVersion",
|
|
29
|
-
targetSdkVersion safeExtGet("targetSdkVersion",
|
|
28
|
+
minSdkVersion safeExtGet("minSdkVersion", 24)
|
|
29
|
+
targetSdkVersion safeExtGet("targetSdkVersion", 36)
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
}
|
package/build/ZsUiView.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
2
|
import { requireNativeViewManager } from 'expo-modules-core';
|
|
2
|
-
import * as React from 'react';
|
|
3
3
|
const NativeView = requireNativeViewManager('ZsUi');
|
|
4
4
|
export default function ZsUiView(props) {
|
|
5
|
-
return
|
|
5
|
+
return _jsx(NativeView, { ...props });
|
|
6
6
|
}
|
|
7
7
|
//# sourceMappingURL=ZsUiView.js.map
|
package/build/ZsUiView.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ZsUiView.js","sourceRoot":"","sources":["../src/ZsUiView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"ZsUiView.js","sourceRoot":"","sources":["../src/ZsUiView.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AAK7D,MAAM,UAAU,GACd,wBAAwB,CAAC,MAAM,CAAC,CAAC;AAEnC,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAoB;IACnD,OAAO,KAAC,UAAU,OAAK,KAAK,GAAI,CAAC;AACnC,CAAC","sourcesContent":["import { requireNativeViewManager } from 'expo-modules-core';\nimport * as React from 'react';\n\nimport { ZsUiViewProps } from './ZsUi.types';\n\nconst NativeView: React.ComponentType<ZsUiViewProps> =\n requireNativeViewManager('ZsUi');\n\nexport default function ZsUiView(props: ZsUiViewProps) {\n return <NativeView {...props} />;\n}\n"]}
|
package/build/ZsUiView.web.js
CHANGED
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
export default function ZsUiView(props) {
|
|
3
|
-
return (
|
|
4
|
-
<span>{props.name}</span>
|
|
5
|
-
</div>);
|
|
3
|
+
return (_jsx("div", { children: _jsx("span", { children: props.name }) }));
|
|
6
4
|
}
|
|
7
5
|
//# sourceMappingURL=ZsUiView.web.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ZsUiView.web.js","sourceRoot":"","sources":["../src/ZsUiView.web.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ZsUiView.web.js","sourceRoot":"","sources":["../src/ZsUiView.web.tsx"],"names":[],"mappings":";AAIA,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAoB;IACnD,OAAO,CACL,wBACE,yBAAO,KAAK,CAAC,IAAI,GAAQ,GACrB,CACP,CAAC;AACJ,CAAC","sourcesContent":["import * as React from 'react';\n\nimport { ZsUiViewProps } from './ZsUi.types';\n\nexport default function ZsUiView(props: ZsUiViewProps) {\n return (\n <div>\n <span>{props.name}</span>\n </div>\n );\n}\n"]}
|
package/build/assets/SvgCheck.js
CHANGED
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import Svg, { Path } from 'react-native-svg';
|
|
3
3
|
export const SvgCheck = ({ size = 24, color = '#ffffff', strokeWidth = "2" }) => {
|
|
4
|
-
return (
|
|
5
|
-
<Path d="M6 12L10.2426 16.2426L18.727 7.75732" stroke={color} strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round"/>
|
|
6
|
-
</Svg>);
|
|
4
|
+
return (_jsx(Svg, { width: size, height: size, viewBox: "0 0 24 24", fill: "none", children: _jsx(Path, { d: "M6 12L10.2426 16.2426L18.727 7.75732", stroke: color, strokeWidth: strokeWidth, strokeLinecap: "round", strokeLinejoin: "round" }) }));
|
|
7
5
|
};
|
|
8
6
|
//# sourceMappingURL=SvgCheck.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SvgCheck.js","sourceRoot":"","sources":["../../src/assets/SvgCheck.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SvgCheck.js","sourceRoot":"","sources":["../../src/assets/SvgCheck.tsx"],"names":[],"mappings":";AACA,OAAO,GAAG,EAAE,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE7C,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,IAAI,GAAG,EAAE,EAAE,KAAK,GAAG,SAAS,EAAE,WAAW,GAAG,GAAG,EAAE,EAAE,EAAE;IAC9E,OAAO,CACL,KAAC,GAAG,IAAC,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,YAC7D,KAAC,IAAI,IACH,CAAC,EAAC,sCAAsC,EACxC,MAAM,EAAE,KAAK,EACb,WAAW,EAAE,WAAW,EACxB,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,GACtB,GACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport Svg, { Path } from 'react-native-svg';\n\nexport const SvgCheck = ({ size = 24, color = '#ffffff', strokeWidth = \"2\" }) => {\n return (\n <Svg width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\">\n <Path\n d=\"M6 12L10.2426 16.2426L18.727 7.75732\"\n stroke={color}\n strokeWidth={strokeWidth}\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </Svg>\n );\n};\n"]}
|
|
@@ -1,14 +1,7 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import Svg, { Path, Circle } from 'react-native-svg';
|
|
3
3
|
const SvgExclamation = ({ size = 24, backgroundColor = '#FF4D4F', exclamationColor = '#FFFFFF', }) => {
|
|
4
|
-
return (
|
|
5
|
-
{/* 배경 원 */}
|
|
6
|
-
<Circle cx="12" cy="12" r="10" fill={backgroundColor}/>
|
|
7
|
-
|
|
8
|
-
{/* 느낌표 표시 */}
|
|
9
|
-
<Path d="M12 6.5v6" stroke={exclamationColor} strokeWidth="2.2" strokeLinecap="round"/>
|
|
10
|
-
<Circle cx="12.1" cy="17" r="1.5" fill={exclamationColor}/>
|
|
11
|
-
</Svg>);
|
|
4
|
+
return (_jsxs(Svg, { width: size, height: size, viewBox: "0 0 24 24", children: [_jsx(Circle, { cx: "12", cy: "12", r: "10", fill: backgroundColor }), _jsx(Path, { d: "M12 6.5v6", stroke: exclamationColor, strokeWidth: "2.2", strokeLinecap: "round" }), _jsx(Circle, { cx: "12.1", cy: "17", r: "1.5", fill: exclamationColor })] }));
|
|
12
5
|
};
|
|
13
6
|
export default SvgExclamation;
|
|
14
7
|
//# sourceMappingURL=SvgExclamation.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SvgExclamation.js","sourceRoot":"","sources":["../../src/assets/SvgExclamation.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SvgExclamation.js","sourceRoot":"","sources":["../../src/assets/SvgExclamation.tsx"],"names":[],"mappings":";AACA,OAAO,GAAG,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAErD,MAAM,cAAc,GAAG,CAAC,EACtB,IAAI,GAAG,EAAE,EACT,eAAe,GAAG,SAAS,EAC3B,gBAAgB,GAAG,SAAS,GAC7B,EAAE,EAAE;IACH,OAAO,CACL,MAAC,GAAG,IACF,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,EACZ,OAAO,EAAC,WAAW,aAGnB,KAAC,MAAM,IACL,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,CAAC,EAAC,IAAI,EACN,IAAI,EAAE,eAAe,GACrB,EAGF,KAAC,IAAI,IACH,CAAC,EAAC,WAAW,EACb,MAAM,EAAE,gBAAgB,EACxB,WAAW,EAAC,KAAK,EACjB,aAAa,EAAC,OAAO,GACrB,EACF,KAAC,MAAM,IACL,EAAE,EAAC,MAAM,EACT,EAAE,EAAC,IAAI,EACP,CAAC,EAAC,KAAK,EACP,IAAI,EAAE,gBAAgB,GACtB,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import React from 'react';\nimport Svg, { Path, Circle } from 'react-native-svg';\n\nconst SvgExclamation = ({ \n size = 24,\n backgroundColor = '#FF4D4F',\n exclamationColor = '#FFFFFF',\n}) => {\n return (\n <Svg\n width={size}\n height={size}\n viewBox=\"0 0 24 24\"\n >\n {/* 배경 원 */}\n <Circle\n cx=\"12\"\n cy=\"12\"\n r=\"10\"\n fill={backgroundColor}\n />\n \n {/* 느낌표 표시 */}\n <Path\n d=\"M12 6.5v6\"\n stroke={exclamationColor}\n strokeWidth=\"2.2\"\n strokeLinecap=\"round\"\n />\n <Circle\n cx=\"12.1\"\n cy=\"17\"\n r=\"1.5\"\n fill={exclamationColor}\n />\n </Svg>\n );\n};\n\nexport default SvgExclamation;"]}
|
package/build/assets/SvgX.js
CHANGED
|
@@ -1,14 +1,12 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import Svg, { Path } from 'react-native-svg';
|
|
3
3
|
export const SvgX = ({ size = 12, color = '#5E696E' }) => {
|
|
4
4
|
const strokeWidth = size * 0.12;
|
|
5
|
-
return (
|
|
6
|
-
<Path d={`
|
|
5
|
+
return (_jsx(Svg, { width: size, height: size, viewBox: `0 0 ${size} ${size}`, children: _jsx(Path, { d: `
|
|
7
6
|
M ${size * 0.25} ${size * 0.25}
|
|
8
7
|
Q ${size / 2} ${size / 2} ${size * 0.75} ${size * 0.75}
|
|
9
8
|
M ${size * 0.25} ${size * 0.75}
|
|
10
9
|
Q ${size / 2} ${size / 2} ${size * 0.75} ${size * 0.25}
|
|
11
|
-
|
|
12
|
-
</Svg>);
|
|
10
|
+
`, stroke: color, strokeWidth: strokeWidth, strokeLinecap: "round" }) }));
|
|
13
11
|
};
|
|
14
12
|
//# sourceMappingURL=SvgX.js.map
|
package/build/assets/SvgX.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SvgX.js","sourceRoot":"","sources":["../../src/assets/SvgX.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SvgX.js","sourceRoot":"","sources":["../../src/assets/SvgX.tsx"],"names":[],"mappings":";AACA,OAAO,GAAG,EAAE,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE7C,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EAAE,IAAI,GAAG,EAAE,EAAE,KAAK,GAAG,SAAS,EAAE,EAAE,EAAE;IACvD,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,CAAC;IAEhC,OAAO,CACL,KAAC,GAAG,IAAC,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,IAAI,IAAI,IAAI,EAAE,YAC5D,KAAC,IAAI,IACH,CAAC,EAAE;cACG,IAAI,GAAG,IAAI,IAAI,IAAI,GAAG,IAAI;cAC1B,IAAI,GAAG,CAAC,IAAI,IAAI,GAAG,CAAC,IAAI,IAAI,GAAG,IAAI,IAAI,IAAI,GAAG,IAAI;cAClD,IAAI,GAAG,IAAI,IAAI,IAAI,GAAG,IAAI;cAC1B,IAAI,GAAG,CAAC,IAAI,IAAI,GAAG,CAAC,IAAI,IAAI,GAAG,IAAI,IAAI,IAAI,GAAG,IAAI;SACvD,EACD,MAAM,EAAE,KAAK,EACb,WAAW,EAAE,WAAW,EACxB,aAAa,EAAC,OAAO,GACrB,GACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport Svg, { Path } from 'react-native-svg';\n\nexport const SvgX = ({ size = 12, color = '#5E696E' }) => {\n const strokeWidth = size * 0.12;\n \n return (\n <Svg width={size} height={size} viewBox={`0 0 ${size} ${size}`}>\n <Path\n d={`\n M ${size * 0.25} ${size * 0.25}\n Q ${size / 2} ${size / 2} ${size * 0.75} ${size * 0.75}\n M ${size * 0.25} ${size * 0.75}\n Q ${size / 2} ${size / 2} ${size * 0.75} ${size * 0.25}\n `}\n stroke={color}\n strokeWidth={strokeWidth}\n strokeLinecap=\"round\"\n />\n </Svg>\n );\n};"]}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
2
|
import { useCallback, useEffect, useMemo, useState } from 'react';
|
|
2
3
|
import { BackHandler, Dimensions, Keyboard } from 'react-native';
|
|
3
4
|
import { AlertContext, SnackbarContext, BottomSheetContext, PopOverContext, ModalityContext, LoaderContext, OverlayContext } from '../model/useOverlay';
|
|
@@ -202,34 +203,6 @@ export function OverlayProvider({ customSnackbar, maxSnackbarCount = 3, loaderCo
|
|
|
202
203
|
loaderVisible,
|
|
203
204
|
setLoaderVisible,
|
|
204
205
|
]);
|
|
205
|
-
return (
|
|
206
|
-
<AlertContext.Provider value={alertContextValue}>
|
|
207
|
-
<SnackbarContext.Provider value={snackbarContextValue}>
|
|
208
|
-
<BottomSheetContext.Provider value={bottomSheetContextValue}>
|
|
209
|
-
<PopOverContext.Provider value={popOverContextValue}>
|
|
210
|
-
<ModalityContext.Provider value={modalityContextValue}>
|
|
211
|
-
<LoaderContext.Provider value={loaderContextValue}>
|
|
212
|
-
<PortalProvider>
|
|
213
|
-
{children}
|
|
214
|
-
|
|
215
|
-
<Modality modalityComponent={modalityComponent} foldableSingleScreen={modalityFoldableSingleScreen}/>
|
|
216
|
-
|
|
217
|
-
<BottomSheetOverlay headerComponent={bottomSheetHeader} component={bottomSheetComponent} options={bottomSheetOptions}/>
|
|
218
|
-
|
|
219
|
-
<PopOverMenu px={popOverLocation?.px} py={popOverLocation?.py} component={popOverComponent}/>
|
|
220
|
-
|
|
221
|
-
<AlertOverlay title={title} informative={informative} actions={actions || {}} isBackgroundTouchClose={isBackgroundTouchClose} titleStyle={titleStyle} informativeStyle={informativeStyle} secondaryButtonStyle={secondaryButtonStyle} primaryButtonStyle={primaryButtonStyle} secondaryButtonTextStyle={secondaryButtonTextStyle}/>
|
|
222
|
-
|
|
223
|
-
<SnackbarNotify customSnackbar={customSnackbar}/>
|
|
224
|
-
|
|
225
|
-
<LoadingNotify loaderComponent={loaderComponent}/>
|
|
226
|
-
</PortalProvider>
|
|
227
|
-
</LoaderContext.Provider>
|
|
228
|
-
</ModalityContext.Provider>
|
|
229
|
-
</PopOverContext.Provider>
|
|
230
|
-
</BottomSheetContext.Provider>
|
|
231
|
-
</SnackbarContext.Provider>
|
|
232
|
-
</AlertContext.Provider>
|
|
233
|
-
</OverlayContext.Provider>);
|
|
206
|
+
return (_jsx(OverlayContext.Provider, { value: overlayContextValue, children: _jsx(AlertContext.Provider, { value: alertContextValue, children: _jsx(SnackbarContext.Provider, { value: snackbarContextValue, children: _jsx(BottomSheetContext.Provider, { value: bottomSheetContextValue, children: _jsx(PopOverContext.Provider, { value: popOverContextValue, children: _jsx(ModalityContext.Provider, { value: modalityContextValue, children: _jsx(LoaderContext.Provider, { value: loaderContextValue, children: _jsxs(PortalProvider, { children: [children, _jsx(Modality, { modalityComponent: modalityComponent, foldableSingleScreen: modalityFoldableSingleScreen }), _jsx(BottomSheetOverlay, { headerComponent: bottomSheetHeader, component: bottomSheetComponent, options: bottomSheetOptions }), _jsx(PopOverMenu, { px: popOverLocation?.px, py: popOverLocation?.py, component: popOverComponent }), _jsx(AlertOverlay, { title: title, informative: informative, actions: actions || {}, isBackgroundTouchClose: isBackgroundTouchClose, titleStyle: titleStyle, informativeStyle: informativeStyle, secondaryButtonStyle: secondaryButtonStyle, primaryButtonStyle: primaryButtonStyle, secondaryButtonTextStyle: secondaryButtonTextStyle }), _jsx(SnackbarNotify, { customSnackbar: customSnackbar }), _jsx(LoadingNotify, { loaderComponent: loaderComponent })] }) }) }) }) }) }) }) }));
|
|
234
207
|
}
|
|
235
208
|
//# sourceMappingURL=OverlayContext.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverlayContext.js","sourceRoot":"","sources":["../../src/context/OverlayContext.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useMemo, useState } from 'react';\nimport { BackHandler, Dimensions, Keyboard, TextProps, TouchableOpacityProps } from 'react-native';\nimport { AlertContext, SnackbarContext, BottomSheetContext, PopOverContext, ModalityContext, LoaderContext, OverlayContext } from '../model/useOverlay';\nimport { AlertActions, BottomSheetHeight, BottomSheetOptions, HideOption, ModalityProps, OverlayProviderProps, PopOverMenuProps, ShowAlertProps, ShowBottomSheetProps, ShowSnackBarProps, SnackItem } from '../model/types';\nimport AlertOverlay from '../overlay/AlertOverlay';\nimport SnackbarNotify from '../overlay/SnackbarNotify';\nimport BottomSheetOverlay from '../overlay/BottomSheetOverlay';\nimport LoadingNotify from '../overlay/LoadingNotify';\nimport PopOverMenu from '../overlay/PopOver/PopOverMenu';\nimport Modality from '../overlay/Modality';\nimport { PortalProvider } from '../overlay/ZSPortal';\nimport { setGlobalOverlayRef } from '../model/globalOverlay';\n\nexport function OverlayProvider({\n customSnackbar,\n maxSnackbarCount = 3,\n loaderComponent,\n children\n}: OverlayProviderProps) {\n const defaultBottomSheetMaxHeight = Dimensions.get('window').height;\n\n // Alert\n const [title, setTitle] = useState<string>('');\n const [informative, setInformative] = useState<string>('');\n const [alertVisible, setAlertVisible] = useState<boolean>(false);\n const [actions, setActions] = useState<AlertActions>();\n const [isBackgroundTouchClose, setIsBackgroundTouchClose] = useState<boolean>(true);\n const [titleStyle, setTitleStyle] = useState<TextProps['style']>();\n const [informativeStyle, setInformativeStyle] = useState<TextProps['style']>();\n const [secondaryButtonStyle, setSecondaryButtonStyle] = useState<TouchableOpacityProps['style']>();\n const [primaryButtonStyle, setPrimaryButtonStyle] = useState<TouchableOpacityProps['style']>();\n const [secondaryButtonTextStyle, setSecondaryButtonTextStyle] = useState<TextProps['style']>();\n\n // Snackbar\n const [snackItemStack, setSnackItemStack] = useState<SnackItem[]>([]);\n\n // BottomSheet\n const [bottomSheetVisible, setBottomSheetVisible] = useState<boolean>(false);\n const [bottomSheetComponent, setBottomSheetComponent] = useState<React.ReactNode>(null);\n const [bottomSheetHeader, setBottomSheetHeader] = useState<React.ReactNode>(null);\n const [bottomSheetOptions, setBottomSheetOptions] = useState<BottomSheetOptions>();\n const [bottomSheetHeight, setBottomSheetHeight] = useState<BottomSheetHeight>(300);\n const [bottomSheetMaxHeight, setBottomSheetMaxHeight] = useState<number>(defaultBottomSheetMaxHeight);\n\n // Loading\n const [loaderVisible, setLoaderVisible] = useState<boolean>(false);\n\n // PopOver\n const [popOverVisible, setPopOverVisible] = useState<boolean>(false);\n const [popOverLocation, setPopOverLocation] = useState<{ px: PopOverMenuProps['px'], py: PopOverMenuProps['py'] }>({ px: 0, py: 0 });\n const [popOverComponent, setPopOverComponent] = useState<React.ReactNode>(false);\n\n // Modality\n const [modalityVisible, setModalityVisible] = useState<boolean>(false);\n const [modalityComponent, setModalityComponent] = useState<React.ReactNode>(false);\n const [modalityFoldableSingleScreen, setModalityFoldableSingleScreen] = useState<boolean>(false);\n\n const showAlert = useCallback(({\n title,\n informative,\n actions,\n isBackgroundTouchClose = true,\n titleStyle,\n informativeStyle,\n secondaryButtonStyle,\n primaryButtonStyle,\n secondaryButtonTextStyle,\n }: ShowAlertProps) => {\n Keyboard.dismiss();\n setTitle(title || '');\n setInformative(informative || '');\n setActions(actions || {} as AlertActions);\n setIsBackgroundTouchClose(isBackgroundTouchClose);\n setAlertVisible(true);\n\n setTitleStyle(titleStyle);\n setInformativeStyle(informativeStyle);\n setSecondaryButtonStyle(secondaryButtonStyle);\n setPrimaryButtonStyle(primaryButtonStyle);\n setSecondaryButtonTextStyle(secondaryButtonTextStyle);\n }, []);\n\n const showBottomSheet = useCallback(({\n headerComponent,\n component,\n options,\n }: ShowBottomSheetProps) => {\n Keyboard.dismiss();\n setBottomSheetComponent(component);\n setBottomSheetHeader(headerComponent);\n setBottomSheetOptions(options);\n setBottomSheetHeight(options?.height ?? 300);\n setBottomSheetMaxHeight(options?.maxHeight ?? defaultBottomSheetMaxHeight);\n setBottomSheetVisible(true);\n }, [defaultBottomSheetMaxHeight]);\n\n const showLoader = useCallback(() => {\n setLoaderVisible(true);\n }, []);\n\n const showPopOverMenu = useCallback(({\n px,\n py,\n component\n }: PopOverMenuProps) => {\n Keyboard.dismiss();\n setPopOverLocation({ px, py });\n setPopOverComponent(component);\n setPopOverVisible(true);\n }, []);\n\n const showModality = useCallback(({\n component,\n foldableSingleScreen\n }: ModalityProps) => {\n Keyboard.dismiss();\n setModalityComponent(component);\n setModalityVisible(true);\n setModalityFoldableSingleScreen(foldableSingleScreen || false);\n }, []);\n\n const showSnackBar = useCallback(({\n message,\n type = 'success',\n index = Date.now(),\n snackbarDuration = 3500\n }: ShowSnackBarProps) => {\n setSnackItemStack((prev) => {\n const newStack = [...prev, { message, type, index: index, snackbarDuration: snackbarDuration }];\n return newStack.length > maxSnackbarCount ? newStack.slice(1) : newStack;\n });\n }, [maxSnackbarCount]);\n\n const hideSnackBar = useCallback((index: number) => {\n setSnackItemStack((prev) => prev.filter((item) => item.index !== index));\n }, []);\n\n const hideOverlay = useCallback((option: HideOption) => {\n Keyboard.dismiss();\n switch (option) {\n case 'alert':\n setAlertVisible(false);\n break;\n case 'modal':\n setModalityVisible(false);\n break;\n case 'snack':\n setSnackItemStack([]);\n break;\n case 'bottomSheet':\n setBottomSheetVisible(false);\n break;\n case 'loader':\n setLoaderVisible(false);\n break;\n case 'popOver':\n setPopOverVisible(false);\n break;\n case 'all':\n setModalityVisible(false);\n setAlertVisible(false);\n setSnackItemStack([]);\n setLoaderVisible(false);\n setPopOverVisible(false);\n setBottomSheetVisible(false);\n break;\n default:\n break;\n };\n }, []);\n\n // 안드로이드 뒤로가기 버튼 제어\n const backPressHandler = useCallback(() => {\n if (loaderVisible) {\n return true;\n }\n if (alertVisible || modalityVisible || popOverVisible || bottomSheetVisible) {\n hideOverlay('all');\n return true;\n }\n return false;\n }, [alertVisible, loaderVisible, modalityVisible, popOverVisible, bottomSheetVisible, hideOverlay]);\n\n useEffect(() => {\n const backHandler = BackHandler.addEventListener('hardwareBackPress', backPressHandler);\n return () => backHandler.remove();\n }, [backPressHandler]);\n\n // ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------\n\n const overlayContextValue = useMemo(() => ({\n hideOverlay,\n showAlert,\n showSnackBar,\n showBottomSheet,\n showPopOverMenu,\n showModality,\n showLoader,\n }), [hideOverlay, showAlert, showSnackBar, showBottomSheet, showPopOverMenu, showModality, showLoader]);\n\n // Global overlay reference 업데이트\n useEffect(() => {\n setGlobalOverlayRef(overlayContextValue);\n\n // Cleanup 시 global reference 제거\n return () => {\n setGlobalOverlayRef(null);\n };\n }, [overlayContextValue]);\n\n const alertContextValue = useMemo(() => ({\n alertVisible,\n setAlertVisible,\n }), [\n alertVisible,\n setAlertVisible,\n ]);\n\n const snackbarContextValue = useMemo(() => ({\n snackItemStack,\n hideSnackBar,\n }), [\n snackItemStack,\n hideSnackBar,\n ]);\n\n const bottomSheetContextValue = useMemo(() => ({\n bottomSheetVisible,\n setBottomSheetVisible,\n height: bottomSheetHeight,\n setHeight: setBottomSheetHeight,\n maxHeight: bottomSheetMaxHeight,\n }), [\n bottomSheetVisible,\n setBottomSheetVisible,\n bottomSheetHeight,\n setBottomSheetHeight,\n bottomSheetMaxHeight,\n ]);\n\n const popOverContextValue = useMemo(() => ({\n popOverVisible,\n setPopOverVisible,\n }), [\n popOverVisible,\n setPopOverVisible,\n ]);\n\n const modalityContextValue = useMemo(() => ({\n modalityVisible,\n setModalityVisible,\n }), [\n modalityVisible,\n setModalityVisible,\n ]);\n\n const loaderContextValue = useMemo(() => ({\n loaderVisible,\n setLoaderVisible,\n }), [\n loaderVisible,\n setLoaderVisible,\n ]);\n\n return (\n <OverlayContext.Provider value={overlayContextValue}>\n <AlertContext.Provider value={alertContextValue}>\n <SnackbarContext.Provider value={snackbarContextValue}>\n <BottomSheetContext.Provider value={bottomSheetContextValue}>\n <PopOverContext.Provider value={popOverContextValue}>\n <ModalityContext.Provider value={modalityContextValue}>\n <LoaderContext.Provider value={loaderContextValue}>\n <PortalProvider>\n {children}\n\n <Modality modalityComponent={modalityComponent} foldableSingleScreen={modalityFoldableSingleScreen} />\n\n <BottomSheetOverlay\n headerComponent={bottomSheetHeader}\n component={bottomSheetComponent}\n options={bottomSheetOptions}\n />\n\n <PopOverMenu\n px={popOverLocation?.px}\n py={popOverLocation?.py}\n component={popOverComponent}\n />\n\n <AlertOverlay\n title={title}\n informative={informative}\n actions={actions || {} as AlertActions}\n isBackgroundTouchClose={isBackgroundTouchClose}\n titleStyle={titleStyle}\n informativeStyle={informativeStyle}\n secondaryButtonStyle={secondaryButtonStyle}\n primaryButtonStyle={primaryButtonStyle}\n secondaryButtonTextStyle={secondaryButtonTextStyle}\n />\n\n <SnackbarNotify\n customSnackbar={customSnackbar}\n />\n\n <LoadingNotify\n loaderComponent={loaderComponent}\n />\n </PortalProvider>\n </LoaderContext.Provider>\n </ModalityContext.Provider>\n </PopOverContext.Provider>\n </BottomSheetContext.Provider>\n </SnackbarContext.Provider>\n </AlertContext.Provider>\n </OverlayContext.Provider>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"OverlayContext.js","sourceRoot":"","sources":["../../src/context/OverlayContext.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useMemo, useState } from 'react';\nimport { BackHandler, Dimensions, Keyboard, TextProps, TouchableOpacityProps } from 'react-native';\nimport { AlertContext, SnackbarContext, BottomSheetContext, PopOverContext, ModalityContext, LoaderContext, OverlayContext } from '../model/useOverlay';\nimport { AlertActions, BottomSheetHeight, BottomSheetOptions, HideOption, ModalityProps, OverlayProviderProps, PopOverMenuProps, ShowAlertProps, ShowBottomSheetProps, ShowSnackBarProps, SnackItem } from '../model/types';\nimport AlertOverlay from '../overlay/AlertOverlay';\nimport SnackbarNotify from '../overlay/SnackbarNotify';\nimport BottomSheetOverlay from '../overlay/BottomSheetOverlay';\nimport LoadingNotify from '../overlay/LoadingNotify';\nimport PopOverMenu from '../overlay/PopOver/PopOverMenu';\nimport Modality from '../overlay/Modality';\nimport { PortalProvider } from '../overlay/ZSPortal';\nimport { setGlobalOverlayRef } from '../model/globalOverlay';\n\nexport function OverlayProvider({\n customSnackbar,\n maxSnackbarCount = 3,\n loaderComponent,\n children\n}: OverlayProviderProps) {\n const defaultBottomSheetMaxHeight = Dimensions.get('window').height;\n\n // Alert\n const [title, setTitle] = useState<string>('');\n const [informative, setInformative] = useState<string>('');\n const [alertVisible, setAlertVisible] = useState<boolean>(false);\n const [actions, setActions] = useState<AlertActions>();\n const [isBackgroundTouchClose, setIsBackgroundTouchClose] = useState<boolean>(true);\n const [titleStyle, setTitleStyle] = useState<TextProps['style']>();\n const [informativeStyle, setInformativeStyle] = useState<TextProps['style']>();\n const [secondaryButtonStyle, setSecondaryButtonStyle] = useState<TouchableOpacityProps['style']>();\n const [primaryButtonStyle, setPrimaryButtonStyle] = useState<TouchableOpacityProps['style']>();\n const [secondaryButtonTextStyle, setSecondaryButtonTextStyle] = useState<TextProps['style']>();\n\n // Snackbar\n const [snackItemStack, setSnackItemStack] = useState<SnackItem[]>([]);\n\n // BottomSheet\n const [bottomSheetVisible, setBottomSheetVisible] = useState<boolean>(false);\n const [bottomSheetComponent, setBottomSheetComponent] = useState<React.ReactNode>(null);\n const [bottomSheetHeader, setBottomSheetHeader] = useState<React.ReactNode>(null);\n const [bottomSheetOptions, setBottomSheetOptions] = useState<BottomSheetOptions>();\n const [bottomSheetHeight, setBottomSheetHeight] = useState<BottomSheetHeight>(300);\n const [bottomSheetMaxHeight, setBottomSheetMaxHeight] = useState<number>(defaultBottomSheetMaxHeight);\n\n // Loading\n const [loaderVisible, setLoaderVisible] = useState<boolean>(false);\n\n // PopOver\n const [popOverVisible, setPopOverVisible] = useState<boolean>(false);\n const [popOverLocation, setPopOverLocation] = useState<{ px: PopOverMenuProps['px'], py: PopOverMenuProps['py'] }>({ px: 0, py: 0 });\n const [popOverComponent, setPopOverComponent] = useState<React.ReactNode>(false);\n\n // Modality\n const [modalityVisible, setModalityVisible] = useState<boolean>(false);\n const [modalityComponent, setModalityComponent] = useState<React.ReactNode>(false);\n const [modalityFoldableSingleScreen, setModalityFoldableSingleScreen] = useState<boolean>(false);\n\n const showAlert = useCallback(({\n title,\n informative,\n actions,\n isBackgroundTouchClose = true,\n titleStyle,\n informativeStyle,\n secondaryButtonStyle,\n primaryButtonStyle,\n secondaryButtonTextStyle,\n }: ShowAlertProps) => {\n Keyboard.dismiss();\n setTitle(title || '');\n setInformative(informative || '');\n setActions(actions || {} as AlertActions);\n setIsBackgroundTouchClose(isBackgroundTouchClose);\n setAlertVisible(true);\n\n setTitleStyle(titleStyle);\n setInformativeStyle(informativeStyle);\n setSecondaryButtonStyle(secondaryButtonStyle);\n setPrimaryButtonStyle(primaryButtonStyle);\n setSecondaryButtonTextStyle(secondaryButtonTextStyle);\n }, []);\n\n const showBottomSheet = useCallback(({\n headerComponent,\n component,\n options,\n }: ShowBottomSheetProps) => {\n Keyboard.dismiss();\n setBottomSheetComponent(component);\n setBottomSheetHeader(headerComponent);\n setBottomSheetOptions(options);\n setBottomSheetHeight(options?.height ?? 300);\n setBottomSheetMaxHeight(options?.maxHeight ?? defaultBottomSheetMaxHeight);\n setBottomSheetVisible(true);\n }, [defaultBottomSheetMaxHeight]);\n\n const showLoader = useCallback(() => {\n setLoaderVisible(true);\n }, []);\n\n const showPopOverMenu = useCallback(({\n px,\n py,\n component\n }: PopOverMenuProps) => {\n Keyboard.dismiss();\n setPopOverLocation({ px, py });\n setPopOverComponent(component);\n setPopOverVisible(true);\n }, []);\n\n const showModality = useCallback(({\n component,\n foldableSingleScreen\n }: ModalityProps) => {\n Keyboard.dismiss();\n setModalityComponent(component);\n setModalityVisible(true);\n setModalityFoldableSingleScreen(foldableSingleScreen || false);\n }, []);\n\n const showSnackBar = useCallback(({\n message,\n type = 'success',\n index = Date.now(),\n snackbarDuration = 3500\n }: ShowSnackBarProps) => {\n setSnackItemStack((prev) => {\n const newStack = [...prev, { message, type, index: index, snackbarDuration: snackbarDuration }];\n return newStack.length > maxSnackbarCount ? newStack.slice(1) : newStack;\n });\n }, [maxSnackbarCount]);\n\n const hideSnackBar = useCallback((index: number) => {\n setSnackItemStack((prev) => prev.filter((item) => item.index !== index));\n }, []);\n\n const hideOverlay = useCallback((option: HideOption) => {\n Keyboard.dismiss();\n switch (option) {\n case 'alert':\n setAlertVisible(false);\n break;\n case 'modal':\n setModalityVisible(false);\n break;\n case 'snack':\n setSnackItemStack([]);\n break;\n case 'bottomSheet':\n setBottomSheetVisible(false);\n break;\n case 'loader':\n setLoaderVisible(false);\n break;\n case 'popOver':\n setPopOverVisible(false);\n break;\n case 'all':\n setModalityVisible(false);\n setAlertVisible(false);\n setSnackItemStack([]);\n setLoaderVisible(false);\n setPopOverVisible(false);\n setBottomSheetVisible(false);\n break;\n default:\n break;\n };\n }, []);\n\n // 안드로이드 뒤로가기 버튼 제어\n const backPressHandler = useCallback(() => {\n if (loaderVisible) {\n return true;\n }\n if (alertVisible || modalityVisible || popOverVisible || bottomSheetVisible) {\n hideOverlay('all');\n return true;\n }\n return false;\n }, [alertVisible, loaderVisible, modalityVisible, popOverVisible, bottomSheetVisible, hideOverlay]);\n\n useEffect(() => {\n const backHandler = BackHandler.addEventListener('hardwareBackPress', backPressHandler);\n return () => backHandler.remove();\n }, [backPressHandler]);\n\n // ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------\n\n const overlayContextValue = useMemo(() => ({\n hideOverlay,\n showAlert,\n showSnackBar,\n showBottomSheet,\n showPopOverMenu,\n showModality,\n showLoader,\n }), [hideOverlay, showAlert, showSnackBar, showBottomSheet, showPopOverMenu, showModality, showLoader]);\n\n // Global overlay reference 업데이트\n useEffect(() => {\n setGlobalOverlayRef(overlayContextValue);\n\n // Cleanup 시 global reference 제거\n return () => {\n setGlobalOverlayRef(null);\n };\n }, [overlayContextValue]);\n\n const alertContextValue = useMemo(() => ({\n alertVisible,\n setAlertVisible,\n }), [\n alertVisible,\n setAlertVisible,\n ]);\n\n const snackbarContextValue = useMemo(() => ({\n snackItemStack,\n hideSnackBar,\n }), [\n snackItemStack,\n hideSnackBar,\n ]);\n\n const bottomSheetContextValue = useMemo(() => ({\n bottomSheetVisible,\n setBottomSheetVisible,\n height: bottomSheetHeight,\n setHeight: setBottomSheetHeight,\n maxHeight: bottomSheetMaxHeight,\n }), [\n bottomSheetVisible,\n setBottomSheetVisible,\n bottomSheetHeight,\n setBottomSheetHeight,\n bottomSheetMaxHeight,\n ]);\n\n const popOverContextValue = useMemo(() => ({\n popOverVisible,\n setPopOverVisible,\n }), [\n popOverVisible,\n setPopOverVisible,\n ]);\n\n const modalityContextValue = useMemo(() => ({\n modalityVisible,\n setModalityVisible,\n }), [\n modalityVisible,\n setModalityVisible,\n ]);\n\n const loaderContextValue = useMemo(() => ({\n loaderVisible,\n setLoaderVisible,\n }), [\n loaderVisible,\n setLoaderVisible,\n ]);\n\n return (\n <OverlayContext.Provider value={overlayContextValue}>\n <AlertContext.Provider value={alertContextValue}>\n <SnackbarContext.Provider value={snackbarContextValue}>\n <BottomSheetContext.Provider value={bottomSheetContextValue}>\n <PopOverContext.Provider value={popOverContextValue}>\n <ModalityContext.Provider value={modalityContextValue}>\n <LoaderContext.Provider value={loaderContextValue}>\n <PortalProvider>\n {children}\n\n <Modality modalityComponent={modalityComponent} foldableSingleScreen={modalityFoldableSingleScreen} />\n\n <BottomSheetOverlay\n headerComponent={bottomSheetHeader}\n component={bottomSheetComponent}\n options={bottomSheetOptions}\n />\n\n <PopOverMenu\n px={popOverLocation?.px}\n py={popOverLocation?.py}\n component={popOverComponent}\n />\n\n <AlertOverlay\n title={title}\n informative={informative}\n actions={actions || {} as AlertActions}\n isBackgroundTouchClose={isBackgroundTouchClose}\n titleStyle={titleStyle}\n informativeStyle={informativeStyle}\n secondaryButtonStyle={secondaryButtonStyle}\n primaryButtonStyle={primaryButtonStyle}\n secondaryButtonTextStyle={secondaryButtonTextStyle}\n />\n\n <SnackbarNotify\n customSnackbar={customSnackbar}\n />\n\n <LoadingNotify\n loaderComponent={loaderComponent}\n />\n </PortalProvider>\n </LoaderContext.Provider>\n </ModalityContext.Provider>\n </PopOverContext.Provider>\n </BottomSheetContext.Provider>\n </SnackbarContext.Provider>\n </AlertContext.Provider>\n </OverlayContext.Provider>\n );\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"ThemeContext.d.ts","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiF,MAAM,OAAO,CAAC;AAKtG,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AAE5E,OAAkB,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAEhE,MAAM,WAAW,kBAAkB;IACjC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE;YAAE,KAAK,CAAC,EAAE,KAAK,CAAC;YAAC,IAAI,CAAC,EAAE,KAAK,CAAA;SAAE,CAAA;KAAE,KAAK,KAAK,CAAC;CAC/G;AAED,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,uBAAuB,CAAC;IACpC,SAAS,EAAE,eAAe,CAAC;CAC5B;AAED,MAAM,WAAW,OAAQ,SAAQ,KAAK;IACpC,IAAI,EAAE,OAAO,GAAG,MAAM,CAAC;IACvB,wBAAwB,EAAE,OAAO,CAAC;IAClC,uBAAuB,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IACtD,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AA2CD,eAAO,MAAM,QAAQ,kBAMpB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA2GtD,CAAA"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { createContext, useContext, useMemo, useReducer, useEffect, useCallback } from 'react';
|
|
2
3
|
import { Platform, useColorScheme } from 'react-native';
|
|
3
4
|
import AsyncStorage from '@react-native-async-storage/async-storage';
|
|
4
5
|
import * as NavigationBar from 'expo-navigation-bar';
|
|
@@ -6,6 +7,30 @@ import palette from '../theme/palette';
|
|
|
6
7
|
import typography from '../theme/typography';
|
|
7
8
|
import elevation from '../theme/elevation';
|
|
8
9
|
const ThemeContext = createContext(null);
|
|
10
|
+
const getSystemMode = (systemColorScheme) => systemColorScheme === 'dark' ? 'dark' : 'light';
|
|
11
|
+
function themeReducer(state, action) {
|
|
12
|
+
switch (action.type) {
|
|
13
|
+
case 'HYDRATE':
|
|
14
|
+
return action.state;
|
|
15
|
+
case 'SYNC_SYSTEM_MODE':
|
|
16
|
+
return state.isUsingSystemColorScheme
|
|
17
|
+
? { ...state, mode: action.systemMode }
|
|
18
|
+
: state;
|
|
19
|
+
case 'SET_USE_SYSTEM_COLOR_SCHEME':
|
|
20
|
+
return {
|
|
21
|
+
...state,
|
|
22
|
+
isUsingSystemColorScheme: action.useSystem,
|
|
23
|
+
mode: action.useSystem ? action.systemMode : state.mode,
|
|
24
|
+
};
|
|
25
|
+
case 'TOGGLE_THEME':
|
|
26
|
+
return {
|
|
27
|
+
isUsingSystemColorScheme: false,
|
|
28
|
+
mode: state.mode === 'light' ? 'dark' : 'light',
|
|
29
|
+
};
|
|
30
|
+
default:
|
|
31
|
+
return state;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
9
34
|
export const useTheme = () => {
|
|
10
35
|
const context = useContext(ThemeContext);
|
|
11
36
|
if (!context) {
|
|
@@ -15,8 +40,12 @@ export const useTheme = () => {
|
|
|
15
40
|
};
|
|
16
41
|
export const ThemeProvider = ({ themeFonts, children, isDarkModeEnabled = true, customPalette }) => {
|
|
17
42
|
const systemColorScheme = useColorScheme(); // 시스템 다크 모드 감지
|
|
18
|
-
const
|
|
19
|
-
const [
|
|
43
|
+
const systemMode = getSystemMode(systemColorScheme);
|
|
44
|
+
const [themeState, dispatchTheme] = useReducer(themeReducer, {
|
|
45
|
+
isUsingSystemColorScheme: isDarkModeEnabled,
|
|
46
|
+
mode: isDarkModeEnabled ? systemMode : 'light',
|
|
47
|
+
});
|
|
48
|
+
const { isUsingSystemColorScheme, mode } = themeState;
|
|
20
49
|
// AsyncStorage에서 시스템 모드 사용 설정 값 로드
|
|
21
50
|
useEffect(() => {
|
|
22
51
|
let isMounted = true;
|
|
@@ -24,24 +53,31 @@ export const ThemeProvider = ({ themeFonts, children, isDarkModeEnabled = true,
|
|
|
24
53
|
try {
|
|
25
54
|
if (!isMounted)
|
|
26
55
|
return;
|
|
27
|
-
if (isDarkModeEnabled) {
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
setMode(storedMode === 'dark' ? 'dark' : 'light');
|
|
37
|
-
}
|
|
38
|
-
else {
|
|
39
|
-
setMode(systemColorScheme === 'dark' ? 'dark' : 'light');
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
else {
|
|
43
|
-
setMode('light');
|
|
56
|
+
if (!isDarkModeEnabled) {
|
|
57
|
+
dispatchTheme({
|
|
58
|
+
type: 'HYDRATE',
|
|
59
|
+
state: {
|
|
60
|
+
isUsingSystemColorScheme: false,
|
|
61
|
+
mode: 'light',
|
|
62
|
+
},
|
|
63
|
+
});
|
|
64
|
+
return;
|
|
44
65
|
}
|
|
66
|
+
const storedUseSystemColorScheme = await AsyncStorage.getItem('useSystemColorScheme');
|
|
67
|
+
const storedMode = await AsyncStorage.getItem('themeMode');
|
|
68
|
+
if (!isMounted)
|
|
69
|
+
return;
|
|
70
|
+
const isUsingSystemColorScheme = storedUseSystemColorScheme === null
|
|
71
|
+
? true
|
|
72
|
+
: storedUseSystemColorScheme === 'true';
|
|
73
|
+
const savedMode = storedMode === 'dark' || storedMode === 'light' ? storedMode : undefined;
|
|
74
|
+
dispatchTheme({
|
|
75
|
+
type: 'HYDRATE',
|
|
76
|
+
state: {
|
|
77
|
+
isUsingSystemColorScheme,
|
|
78
|
+
mode: isUsingSystemColorScheme ? systemMode : savedMode ?? systemMode,
|
|
79
|
+
},
|
|
80
|
+
});
|
|
45
81
|
}
|
|
46
82
|
catch (error) {
|
|
47
83
|
console.error('Failed to load theme settings', error);
|
|
@@ -51,35 +87,31 @@ export const ThemeProvider = ({ themeFonts, children, isDarkModeEnabled = true,
|
|
|
51
87
|
return () => {
|
|
52
88
|
isMounted = false;
|
|
53
89
|
};
|
|
54
|
-
}, [isDarkModeEnabled,
|
|
90
|
+
}, [isDarkModeEnabled, systemMode]);
|
|
55
91
|
// 시스템 다크 모드 변경에 따른 효과 적용
|
|
56
92
|
useEffect(() => {
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
}
|
|
60
|
-
}, [isUsingSystemColorScheme, systemColorScheme]);
|
|
93
|
+
dispatchTheme({ type: 'SYNC_SYSTEM_MODE', systemMode });
|
|
94
|
+
}, [systemMode]);
|
|
61
95
|
// 안드로이드 하단 제스쳐 영역 스타일
|
|
62
96
|
useEffect(() => {
|
|
63
97
|
if (Platform.OS === 'android') {
|
|
64
|
-
NavigationBar.
|
|
65
|
-
const currentPalette = customPalette ? customPalette({ mode }) : palette({ mode });
|
|
66
|
-
NavigationBar.setBackgroundColorAsync(currentPalette.background.base);
|
|
98
|
+
NavigationBar.setStyle(mode);
|
|
67
99
|
}
|
|
68
|
-
}, [mode
|
|
100
|
+
}, [mode]);
|
|
69
101
|
// 테마 토글 함수
|
|
70
102
|
const toggleTheme = useCallback(async () => {
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
}, []);
|
|
103
|
+
const newMode = mode === 'light' ? 'dark' : 'light';
|
|
104
|
+
dispatchTheme({ type: 'TOGGLE_THEME' }); // 사용자 지정 모드로 전환
|
|
105
|
+
await AsyncStorage.multiSet([
|
|
106
|
+
['useSystemColorScheme', 'false'],
|
|
107
|
+
['themeMode', newMode],
|
|
108
|
+
]);
|
|
109
|
+
}, [mode]);
|
|
78
110
|
// 시스템 모드 사용 설정 변경 함수
|
|
79
111
|
const handleSetUseSystemColorScheme = useCallback(async (useSystem) => {
|
|
80
|
-
|
|
112
|
+
dispatchTheme({ type: 'SET_USE_SYSTEM_COLOR_SCHEME', useSystem, systemMode });
|
|
81
113
|
await AsyncStorage.setItem('useSystemColorScheme', useSystem.toString());
|
|
82
|
-
}, []);
|
|
114
|
+
}, [systemMode]);
|
|
83
115
|
const themeValue = useMemo(() => {
|
|
84
116
|
const currentPalette = customPalette ? customPalette({ mode }) : palette({ mode });
|
|
85
117
|
return {
|
|
@@ -92,9 +124,7 @@ export const ThemeProvider = ({ themeFonts, children, isDarkModeEnabled = true,
|
|
|
92
124
|
typography: typography({ themeFonts }),
|
|
93
125
|
elevation: elevation(currentPalette)
|
|
94
126
|
};
|
|
95
|
-
}, [mode, isUsingSystemColorScheme,
|
|
96
|
-
return (
|
|
97
|
-
{children}
|
|
98
|
-
</ThemeContext.Provider>);
|
|
127
|
+
}, [mode, isUsingSystemColorScheme, themeFonts, customPalette, handleSetUseSystemColorScheme, toggleTheme]);
|
|
128
|
+
return (_jsx(ThemeContext.Provider, { value: themeValue, children: children }));
|
|
99
129
|
};
|
|
100
130
|
//# sourceMappingURL=ThemeContext.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeContext.js","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { createContext, useContext, useMemo, useState, useEffect, useCallback } from 'react';\nimport { Platform, useColorScheme } from 'react-native';\nimport AsyncStorage from '@react-native-async-storage/async-storage';\nimport * as NavigationBar from 'expo-navigation-bar';\nimport palette from '../theme/palette';\nimport { Theme, ThemeFonts, TypographyVariantsProps } from '../theme/types';\nimport typography from '../theme/typography';\nimport elevation, { ElevationStyles } from '../theme/elevation';\n\nexport interface ThemeProviderProps {\n themeFonts?: ThemeFonts;\n children: React.ReactNode;\n isDarkModeEnabled?: boolean;\n customPalette?: (config: { mode?: 'light' | 'dark'; themeColors?: { light?: Theme; dark?: Theme } }) => Theme;\n}\n\nexport interface ThemeProps {\n palette: Palette;\n typography: TypographyVariantsProps;\n elevation: ElevationStyles;\n}\n\nexport interface Palette extends Theme {\n mode: 'light' | 'dark';\n isUsingSystemColorScheme: boolean;\n setUseSystemColorScheme: (useSystem: boolean) => void;\n toggleTheme: () => void;\n}\n\nconst ThemeContext = createContext<ThemeProps | null>(null);\n\nexport const useTheme = () => {\n const context = useContext(ThemeContext);\n if (!context) {\n throw new Error('useTheme must be used within a ThemeProvider');\n }\n return context;\n}\n\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({ themeFonts, children, isDarkModeEnabled = true, customPalette }) => {\n const systemColorScheme = useColorScheme(); // 시스템 다크 모드 감지\n const [isUsingSystemColorScheme, setUseSystemColorScheme] = useState(isDarkModeEnabled ? true : false);\n const [mode, setMode] = useState<'light' | 'dark'>(isDarkModeEnabled ? (systemColorScheme === 'dark' ? 'dark' : 'light') : 'light');\n\n // AsyncStorage에서 시스템 모드 사용 설정 값 로드\n useEffect(() => {\n let isMounted = true;\n\n const loadSettings = async () => {\n try {\n if (!isMounted) return;\n \n if (isDarkModeEnabled) {\n const storedUseSystemColorScheme = await AsyncStorage.getItem('useSystemColorScheme');\n const storedMode = await AsyncStorage.getItem('themeMode');\n\n if (!isMounted) return;\n\n if (storedUseSystemColorScheme !== null) {\n setUseSystemColorScheme(storedUseSystemColorScheme === 'true');\n }\n if (storedMode) {\n setMode(storedMode === 'dark' ? 'dark' : 'light');\n } else {\n setMode(systemColorScheme === 'dark' ? 'dark' : 'light');\n }\n } else {\n setMode('light');\n }\n } catch (error) {\n console.error('Failed to load theme settings', error);\n }\n };\n\n loadSettings();\n\n return () => {\n isMounted = false;\n };\n }, [isDarkModeEnabled, systemColorScheme]);\n\n // 시스템 다크 모드 변경에 따른 효과 적용\n useEffect(() => {\n if (isUsingSystemColorScheme) {\n setMode(systemColorScheme === 'dark' ? 'dark' : 'light');\n }\n }, [isUsingSystemColorScheme, systemColorScheme]);\n\n // 안드로이드 하단 제스쳐 영역 스타일\n useEffect(() => {\n if (Platform.OS === 'android') {\n NavigationBar.setButtonStyleAsync(mode);\n const currentPalette = customPalette ? customPalette({ mode }) : palette({ mode });\n NavigationBar.setBackgroundColorAsync(currentPalette.background.base)\n }\n }, [mode, customPalette])\n\n // 테마 토글 함수\n const toggleTheme = useCallback(async () => {\n setUseSystemColorScheme(false); // 사용자 지정 모드로 전환\n setMode((prevMode) => {\n const newMode = prevMode === 'light' ? 'dark' : 'light';\n AsyncStorage.setItem('themeMode', newMode); // 로컬스토리지에 저장\n return newMode;\n });\n }, []);\n\n // 시스템 모드 사용 설정 변경 함수\n const handleSetUseSystemColorScheme = useCallback(async (useSystem: boolean) => {\n setUseSystemColorScheme(useSystem);\n await AsyncStorage.setItem('useSystemColorScheme', useSystem.toString());\n }, []);\n\n const themeValue = useMemo(() => {\n const currentPalette = customPalette ? customPalette({ mode }) : palette({ mode });\n return {\n palette: {\n isUsingSystemColorScheme,\n setUseSystemColorScheme: handleSetUseSystemColorScheme,\n toggleTheme,\n ...currentPalette, // 선택된 모드에 따른 팔레트 적용\n },\n typography: typography({ themeFonts }),\n elevation: elevation(currentPalette)\n };\n }, [mode, isUsingSystemColorScheme, typography, themeFonts, customPalette]);\n\n return (\n <ThemeContext.Provider value={themeValue}>\n {children}\n </ThemeContext.Provider>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ThemeContext.js","sourceRoot":"","sources":["../../src/context/ThemeContext.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { createContext, useContext, useMemo, useReducer, useEffect, useCallback } from 'react';\nimport { Platform, useColorScheme } from 'react-native';\nimport AsyncStorage from '@react-native-async-storage/async-storage';\nimport * as NavigationBar from 'expo-navigation-bar';\nimport palette from '../theme/palette';\nimport { Theme, ThemeFonts, TypographyVariantsProps } from '../theme/types';\nimport typography from '../theme/typography';\nimport elevation, { ElevationStyles } from '../theme/elevation';\n\nexport interface ThemeProviderProps {\n themeFonts?: ThemeFonts;\n children: React.ReactNode;\n isDarkModeEnabled?: boolean;\n customPalette?: (config: { mode?: 'light' | 'dark'; themeColors?: { light?: Theme; dark?: Theme } }) => Theme;\n}\n\nexport interface ThemeProps {\n palette: Palette;\n typography: TypographyVariantsProps;\n elevation: ElevationStyles;\n}\n\nexport interface Palette extends Theme {\n mode: 'light' | 'dark';\n isUsingSystemColorScheme: boolean;\n setUseSystemColorScheme: (useSystem: boolean) => void;\n toggleTheme: () => void;\n}\n\nconst ThemeContext = createContext<ThemeProps | null>(null);\ntype ThemeMode = 'light' | 'dark';\n\ntype ThemeState = {\n mode: ThemeMode;\n isUsingSystemColorScheme: boolean;\n};\n\ntype ThemeAction =\n | { type: 'HYDRATE'; state: ThemeState }\n | { type: 'SYNC_SYSTEM_MODE'; systemMode: ThemeMode }\n | { type: 'SET_USE_SYSTEM_COLOR_SCHEME'; useSystem: boolean; systemMode: ThemeMode }\n | { type: 'TOGGLE_THEME' };\n\nconst getSystemMode = (systemColorScheme: ReturnType<typeof useColorScheme>): ThemeMode =>\n systemColorScheme === 'dark' ? 'dark' : 'light';\n\nfunction themeReducer(state: ThemeState, action: ThemeAction): ThemeState {\n switch (action.type) {\n case 'HYDRATE':\n return action.state;\n case 'SYNC_SYSTEM_MODE':\n return state.isUsingSystemColorScheme\n ? { ...state, mode: action.systemMode }\n : state;\n case 'SET_USE_SYSTEM_COLOR_SCHEME':\n return {\n ...state,\n isUsingSystemColorScheme: action.useSystem,\n mode: action.useSystem ? action.systemMode : state.mode,\n };\n case 'TOGGLE_THEME':\n return {\n isUsingSystemColorScheme: false,\n mode: state.mode === 'light' ? 'dark' : 'light',\n };\n default:\n return state;\n }\n}\n\nexport const useTheme = () => {\n const context = useContext(ThemeContext);\n if (!context) {\n throw new Error('useTheme must be used within a ThemeProvider');\n }\n return context;\n}\n\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({ themeFonts, children, isDarkModeEnabled = true, customPalette }) => {\n const systemColorScheme = useColorScheme(); // 시스템 다크 모드 감지\n const systemMode = getSystemMode(systemColorScheme);\n const [themeState, dispatchTheme] = useReducer(\n themeReducer,\n {\n isUsingSystemColorScheme: isDarkModeEnabled,\n mode: isDarkModeEnabled ? systemMode : 'light',\n }\n );\n const { isUsingSystemColorScheme, mode } = themeState;\n\n // AsyncStorage에서 시스템 모드 사용 설정 값 로드\n useEffect(() => {\n let isMounted = true;\n\n const loadSettings = async () => {\n try {\n if (!isMounted) return;\n \n if (!isDarkModeEnabled) {\n dispatchTheme({\n type: 'HYDRATE',\n state: {\n isUsingSystemColorScheme: false,\n mode: 'light',\n },\n });\n return;\n }\n\n const storedUseSystemColorScheme = await AsyncStorage.getItem('useSystemColorScheme');\n const storedMode = await AsyncStorage.getItem('themeMode');\n\n if (!isMounted) return;\n\n const isUsingSystemColorScheme = storedUseSystemColorScheme === null\n ? true\n : storedUseSystemColorScheme === 'true';\n const savedMode = storedMode === 'dark' || storedMode === 'light' ? storedMode : undefined;\n\n dispatchTheme({\n type: 'HYDRATE',\n state: {\n isUsingSystemColorScheme,\n mode: isUsingSystemColorScheme ? systemMode : savedMode ?? systemMode,\n },\n });\n } catch (error) {\n console.error('Failed to load theme settings', error);\n }\n };\n\n loadSettings();\n\n return () => {\n isMounted = false;\n };\n }, [isDarkModeEnabled, systemMode]);\n\n // 시스템 다크 모드 변경에 따른 효과 적용\n useEffect(() => {\n dispatchTheme({ type: 'SYNC_SYSTEM_MODE', systemMode });\n }, [systemMode]);\n\n // 안드로이드 하단 제스쳐 영역 스타일\n useEffect(() => {\n if (Platform.OS === 'android') {\n NavigationBar.setStyle(mode);\n }\n }, [mode])\n\n // 테마 토글 함수\n const toggleTheme = useCallback(async () => {\n const newMode = mode === 'light' ? 'dark' : 'light';\n dispatchTheme({ type: 'TOGGLE_THEME' }); // 사용자 지정 모드로 전환\n await AsyncStorage.multiSet([\n ['useSystemColorScheme', 'false'],\n ['themeMode', newMode],\n ]);\n }, [mode]);\n\n // 시스템 모드 사용 설정 변경 함수\n const handleSetUseSystemColorScheme = useCallback(async (useSystem: boolean) => {\n dispatchTheme({ type: 'SET_USE_SYSTEM_COLOR_SCHEME', useSystem, systemMode });\n await AsyncStorage.setItem('useSystemColorScheme', useSystem.toString());\n }, [systemMode]);\n\n const themeValue = useMemo(() => {\n const currentPalette = customPalette ? customPalette({ mode }) : palette({ mode });\n return {\n palette: {\n isUsingSystemColorScheme,\n setUseSystemColorScheme: handleSetUseSystemColorScheme,\n toggleTheme,\n ...currentPalette, // 선택된 모드에 따른 팔레트 적용\n },\n typography: typography({ themeFonts }),\n elevation: elevation(currentPalette)\n };\n }, [mode, isUsingSystemColorScheme, themeFonts, customPalette, handleSetUseSystemColorScheme, toggleTheme]);\n\n return (\n <ThemeContext.Provider value={themeValue}>\n {children}\n </ThemeContext.Provider>\n );\n}\n"]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback, useMemo } from 'react';
|
|
2
3
|
import { Dimensions, StyleSheet, TouchableOpacity } from 'react-native';
|
|
3
4
|
import Animated, { FadeInDown, FadeOutDown } from 'react-native-reanimated';
|
|
4
5
|
import { useAlert } from '../../model/useOverlay';
|
|
@@ -20,30 +21,12 @@ function AlertOverlay({ actions, title, informative, isBackgroundTouchClose, tit
|
|
|
20
21
|
setAlertVisible(false);
|
|
21
22
|
}, [setAlertVisible]);
|
|
22
23
|
return (!alertVisible ? null :
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
{secondary ? (<>
|
|
30
|
-
<TouchableOpacity style={[
|
|
31
|
-
styles.button,
|
|
32
|
-
{ backgroundColor: background.neutral, marginRight: 8 },
|
|
33
|
-
secondaryButtonStyle
|
|
34
|
-
]} onPress={handleButtonPress(secondary?.onPress)}>
|
|
35
|
-
<ZSText typo='label.2' style={[secondaryButtonTextStyle]}>{secondary.label}</ZSText>
|
|
36
|
-
</TouchableOpacity>
|
|
37
|
-
|
|
38
|
-
<TouchableOpacity style={[styles.button, { backgroundColor: primaryColor.main }, primaryButtonStyle]} onPress={handleButtonPress(primary?.onPress)}>
|
|
39
|
-
<ZSText typo='label.2' color='white' style={[secondaryButtonTextStyle]}>{primary?.label || '확인'}</ZSText>
|
|
40
|
-
</TouchableOpacity>
|
|
41
|
-
</>) : (<TouchableOpacity style={[styles.button, { backgroundColor: primaryColor.main }, primaryButtonStyle]} onPress={handleButtonPress(primary?.onPress)}>
|
|
42
|
-
<ZSText typo='label.2' color='white' style={[secondaryButtonTextStyle]}>{primary?.label || '확인'}</ZSText>
|
|
43
|
-
</TouchableOpacity>)}
|
|
44
|
-
</ViewAtom>)}
|
|
45
|
-
</Animated.View>
|
|
46
|
-
</ModalBackground>);
|
|
24
|
+
_jsx(ModalBackground, { zIndex: Z_INDEX_VALUE.ALERT, modalBgColor: modalBgColor, onPress: () => { if (isBackgroundTouchClose)
|
|
25
|
+
setAlertVisible(false); }, children: _jsxs(Animated.View, { entering: FadeInDown.duration(300), exiting: FadeOutDown.duration(100), style: [styles.contentContainer, { width: modalWidth }], children: [title && (_jsx(ZSText, { typo: 'subTitle.1', style: [styles.title, titleStyle], children: title })), informative && (_jsx(ZSText, { typo: 'body.2', style: [styles.informative, informativeStyle], children: informative })), actions && (_jsx(ViewAtom, { style: styles.buttonContainer, children: secondary ? (_jsxs(_Fragment, { children: [_jsx(TouchableOpacity, { style: [
|
|
26
|
+
styles.button,
|
|
27
|
+
{ backgroundColor: background.neutral, marginRight: 8 },
|
|
28
|
+
secondaryButtonStyle
|
|
29
|
+
], onPress: handleButtonPress(secondary?.onPress), children: _jsx(ZSText, { typo: 'label.2', style: [secondaryButtonTextStyle], children: secondary.label }) }), _jsx(TouchableOpacity, { style: [styles.button, { backgroundColor: primaryColor.main }, primaryButtonStyle], onPress: handleButtonPress(primary?.onPress), children: _jsx(ZSText, { typo: 'label.2', color: 'white', style: [secondaryButtonTextStyle], children: primary?.label || '확인' }) })] })) : (_jsx(TouchableOpacity, { style: [styles.button, { backgroundColor: primaryColor.main }, primaryButtonStyle], onPress: handleButtonPress(primary?.onPress), children: _jsx(ZSText, { typo: 'label.2', color: 'white', style: [secondaryButtonTextStyle], children: primary?.label || '확인' }) })) }))] }) }, alertVisible ? 'visibleao' : 'hiddenao'));
|
|
47
30
|
}
|
|
48
31
|
export default AlertOverlay;
|
|
49
32
|
const createStyles = ({ background }) => StyleSheet.create({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/overlay/AlertOverlay/index.tsx"],"names":[],"mappings":"AAAA,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/overlay/AlertOverlay/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport { Dimensions, StyleSheet, TouchableOpacity } from 'react-native';\nimport Animated, { FadeInDown, FadeOutDown } from 'react-native-reanimated';\nimport { AlertActions, ShowAlertProps } from '../../model/types';\nimport { useAlert } from '../../model/useOverlay';\nimport { useTheme } from '../../context/ThemeContext';\nimport { ThemeBackground } from '../../theme/types';\nimport ModalBackground from '../ui/ModalBackground';\nimport ViewAtom from '../../ui/atoms/ViewAtom';\nimport { Z_INDEX_VALUE } from '../../model/utils';\nimport ZSText from '../../ui/ZSText';\n\nconst windowWidth = Dimensions.get('window').width;\n\nfunction AlertOverlay({\n actions,\n title,\n informative,\n isBackgroundTouchClose,\n titleStyle,\n informativeStyle,\n secondaryButtonStyle,\n primaryButtonStyle,\n secondaryButtonTextStyle,\n}: ShowAlertProps) {\n const { alertVisible, setAlertVisible } = useAlert();\n const { palette: { background, primary: primaryColor, modalBgColor } } = useTheme();\n const styles = useMemo(() => createStyles({ background }), [background]);\n const modalWidth = Math.min(windowWidth - 60, 400);\n const { primary, secondary } = actions || {} as AlertActions;\n\n const handleButtonPress = useCallback((onPressFunction?: () => void) => () => {\n if (onPressFunction) onPressFunction();\n setAlertVisible(false);\n }, [setAlertVisible]);\n\n return (\n !alertVisible ? null :\n <ModalBackground\n zIndex={Z_INDEX_VALUE.ALERT}\n key={alertVisible ? 'visibleao' : 'hiddenao'}\n modalBgColor={modalBgColor}\n onPress={() => { if (isBackgroundTouchClose) setAlertVisible(false); }}\n >\n <Animated.View\n entering={FadeInDown.duration(300)}\n exiting={FadeOutDown.duration(100)}\n style={[styles.contentContainer, { width: modalWidth }]}\n >\n {title && (\n <ZSText typo='subTitle.1' style={[styles.title, titleStyle]}>{title}</ZSText>\n )}\n {informative && (\n <ZSText typo='body.2' style={[styles.informative, informativeStyle]}>{informative}</ZSText>\n )}\n {actions && (\n <ViewAtom style={styles.buttonContainer}>\n {secondary ? (\n <>\n <TouchableOpacity\n style={[\n styles.button,\n { backgroundColor: background.neutral, marginRight: 8 },\n secondaryButtonStyle\n ]}\n onPress={handleButtonPress(secondary?.onPress)}\n >\n <ZSText typo='label.2' style={[secondaryButtonTextStyle]}>{secondary.label}</ZSText>\n </TouchableOpacity>\n\n <TouchableOpacity\n style={[styles.button, { backgroundColor: primaryColor.main }, primaryButtonStyle]}\n onPress={handleButtonPress(primary?.onPress)}\n >\n <ZSText typo='label.2' color='white' style={[secondaryButtonTextStyle]}>{primary?.label || '확인'}</ZSText>\n </TouchableOpacity>\n </>\n ) : (\n <TouchableOpacity\n style={[styles.button, { backgroundColor: primaryColor.main }, primaryButtonStyle]}\n onPress={handleButtonPress(primary?.onPress)}\n >\n <ZSText typo='label.2' color='white' style={[secondaryButtonTextStyle]}>{primary?.label || '확인'}</ZSText>\n </TouchableOpacity>\n )}\n </ViewAtom>\n )}\n </Animated.View>\n </ModalBackground>\n )\n}\n\nexport default AlertOverlay;\n\nconst createStyles = ({ background }: { background: ThemeBackground; }) =>\n StyleSheet.create({\n title: {\n marginBottom: 8,\n width: '100%',\n paddingHorizontal: 4\n },\n informative: {\n marginTop: 8,\n width: '100%',\n paddingHorizontal: 4\n },\n buttonContainer: {\n flexDirection: 'row',\n width: '100%',\n marginTop: 24,\n alignItems: 'center',\n justifyContent: 'flex-end',\n },\n button: {\n flex: 1,\n justifyContent: 'center',\n alignItems: 'center',\n paddingVertical: 14,\n borderRadius: 12,\n },\n avoidingView: {\n flex: 1,\n justifyContent: 'center'\n },\n contentContainer: {\n alignItems: 'center',\n backgroundColor: background.base,\n borderRadius: 22,\n paddingBottom: 18,\n paddingTop: 24,\n paddingHorizontal: 20,\n },\n });\n"]}
|