@fountain-ui/core 3.0.0-alpha.19 → 3.0.0-alpha.20
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/commonjs/BottomSheetTitle/BottomSheetTitle.js +3 -2
- package/build/commonjs/BottomSheetTitle/BottomSheetTitle.js.map +1 -1
- package/build/commonjs/Dialog/Dialog.js +3 -9
- package/build/commonjs/Dialog/Dialog.js.map +1 -1
- package/build/commonjs/Radio/Radio.js +6 -3
- package/build/commonjs/Radio/Radio.js.map +1 -1
- package/build/commonjs/RadioGroup/RadioGroup.js +2 -27
- package/build/commonjs/RadioGroup/RadioGroup.js.map +1 -1
- package/build/module/BottomSheetTitle/BottomSheetTitle.js +3 -2
- package/build/module/BottomSheetTitle/BottomSheetTitle.js.map +1 -1
- package/build/module/Dialog/Dialog.js +2 -7
- package/build/module/Dialog/Dialog.js.map +1 -1
- package/build/module/Radio/Radio.js +6 -3
- package/build/module/Radio/Radio.js.map +1 -1
- package/build/module/RadioGroup/RadioGroup.js +2 -20
- package/build/module/RadioGroup/RadioGroup.js.map +1 -1
- package/build/typescript/Dialog/Dialog.d.ts +1 -6
- package/package.json +3 -3
- package/src/BottomSheetTitle/BottomSheetTitle.tsx +2 -1
- package/src/Dialog/Dialog.tsx +2 -7
- package/src/Radio/Radio.tsx +5 -2
- package/src/RadioGroup/RadioGroup.tsx +2 -28
- package/build/commonjs/Dialog/FullDialogCloseButton.js +0 -55
- package/build/commonjs/Dialog/FullDialogCloseButton.js.map +0 -1
- package/build/module/Dialog/FullDialogCloseButton.js +0 -42
- package/build/module/Dialog/FullDialogCloseButton.js.map +0 -1
- package/build/typescript/Dialog/FullDialogCloseButton.d.ts +0 -10
- package/src/Dialog/FullDialogCloseButton.tsx +0 -63
|
@@ -23,7 +23,7 @@ const useStyles = function () {
|
|
|
23
23
|
const theme = (0, _styles.useTheme)();
|
|
24
24
|
return {
|
|
25
25
|
root: {
|
|
26
|
-
alignItems: '
|
|
26
|
+
alignItems: 'flex-start',
|
|
27
27
|
gap: theme.spacing(8),
|
|
28
28
|
justifyContent: 'space-between',
|
|
29
29
|
marginBottom: theme.spacing(4),
|
|
@@ -31,7 +31,8 @@ const useStyles = function () {
|
|
|
31
31
|
},
|
|
32
32
|
title: {
|
|
33
33
|
paddingBottom: theme.spacing(1.25),
|
|
34
|
-
paddingTop: theme.spacing(1)
|
|
34
|
+
paddingTop: theme.spacing(1),
|
|
35
|
+
minWidth: 0
|
|
35
36
|
},
|
|
36
37
|
actionButton: {
|
|
37
38
|
paddingBottom: theme.spacing(1.75),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useStyles","theme","useTheme","root","alignItems","gap","spacing","justifyContent","marginBottom","paddingHorizontal","title","paddingBottom","paddingTop","actionButton","BottomSheetTitle","props","actionButtonProps","children","style","styleProp","otherProps","styles","rootStyle","css","titleFontStyle","createFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","titleStyle","disabled","onPress"],"sources":["BottomSheetTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Button from '../Button/Button';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type BottomSheetTitleProps from './BottomSheetTitleProps';\n\ntype BottomSheetTitleStyles = NamedStylesStringUnion<'root' | 'title' | 'actionButton'>;\n\nconst useStyles: UseStyles<BottomSheetTitleStyles> = function (): BottomSheetTitleStyles {\n const theme = useTheme();\n\n return {\n root: {\n alignItems: '
|
|
1
|
+
{"version":3,"names":["useStyles","theme","useTheme","root","alignItems","gap","spacing","justifyContent","marginBottom","paddingHorizontal","title","paddingBottom","paddingTop","minWidth","actionButton","BottomSheetTitle","props","actionButtonProps","children","style","styleProp","otherProps","styles","rootStyle","css","titleFontStyle","createFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","titleStyle","disabled","onPress"],"sources":["BottomSheetTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Button from '../Button/Button';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type BottomSheetTitleProps from './BottomSheetTitleProps';\n\ntype BottomSheetTitleStyles = NamedStylesStringUnion<'root' | 'title' | 'actionButton'>;\n\nconst useStyles: UseStyles<BottomSheetTitleStyles> = function (): BottomSheetTitleStyles {\n const theme = useTheme();\n\n return {\n root: {\n alignItems: 'flex-start',\n gap: theme.spacing(8),\n justifyContent: 'space-between',\n marginBottom: theme.spacing(4),\n paddingHorizontal: theme.spacing(6),\n },\n title: {\n paddingBottom: theme.spacing(1.25),\n paddingTop: theme.spacing(1),\n minWidth: 0,\n },\n actionButton: {\n paddingBottom: theme.spacing(1.75),\n paddingHorizontal: 0,\n paddingTop: theme.spacing(1.25),\n },\n };\n};\n\nexport default function BottomSheetTitle(props: BottomSheetTitleProps) {\n const {\n actionButtonProps,\n children,\n style: styleProp,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const styles = useStyles();\n\n const rootStyle = css([\n styles.root,\n styleProp,\n ]);\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (typography) => typography.header3.semiBold,\n color: theme.palette.text.strong,\n });\n\n const titleStyle = css([\n styles.title,\n titleFontStyle,\n ]);\n\n return (\n <Row\n style={rootStyle}\n {...otherProps}\n >\n <Text\n children={children}\n style={titleStyle}\n />\n\n {actionButtonProps ? (\n <Button\n children={actionButtonProps.title}\n color={'accent'}\n disabled={actionButtonProps.disabled ?? false}\n disableMinWidth={true}\n onPress={actionButtonProps.onPress}\n size={'large'}\n style={styles.actionButton}\n variant={'text'}\n />\n ) : null}\n </Row>\n );\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;AAKA,MAAMA,SAA4C,GAAG,YAAoC;EACrF,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,YADV;MAEFC,GAAG,EAAEJ,KAAK,CAACK,OAAN,CAAc,CAAd,CAFH;MAGFC,cAAc,EAAE,eAHd;MAIFC,YAAY,EAAEP,KAAK,CAACK,OAAN,CAAc,CAAd,CAJZ;MAKFG,iBAAiB,EAAER,KAAK,CAACK,OAAN,CAAc,CAAd;IALjB,CADH;IAQHI,KAAK,EAAE;MACHC,aAAa,EAAEV,KAAK,CAACK,OAAN,CAAc,IAAd,CADZ;MAEHM,UAAU,EAAEX,KAAK,CAACK,OAAN,CAAc,CAAd,CAFT;MAGHO,QAAQ,EAAE;IAHP,CARJ;IAaHC,YAAY,EAAE;MACVH,aAAa,EAAEV,KAAK,CAACK,OAAN,CAAc,IAAd,CADL;MAEVG,iBAAiB,EAAE,CAFT;MAGVG,UAAU,EAAEX,KAAK,CAACK,OAAN,CAAc,IAAd;IAHF;EAbX,CAAP;AAmBH,CAtBD;;AAwBe,SAASS,gBAAT,CAA0BC,KAA1B,EAAwD;EACnE,MAAM;IACFC,iBADE;IAEFC,QAFE;IAGFC,KAAK,EAAEC,SAHL;IAIF,GAAGC;EAJD,IAKFL,KALJ;EAOA,MAAMf,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAMoB,MAAM,GAAGtB,SAAS,EAAxB;EAEA,MAAMuB,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAACnB,IADW,EAElBiB,SAFkB,CAAJ,CAAlB;EAKA,MAAMK,cAAc,GAAG,IAAAC,uBAAA,EAAgBzB,KAAhB,EAAuB;IAC1C0B,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,OAAX,CAAmBC,QADH;IAE1CC,KAAK,EAAE9B,KAAK,CAAC+B,OAAN,CAAcC,IAAd,CAAmBC;EAFgB,CAAvB,CAAvB;EAKA,MAAMC,UAAU,GAAG,IAAAX,WAAA,EAAI,CACnBF,MAAM,CAACZ,KADY,EAEnBe,cAFmB,CAAJ,CAAnB;EAKA,oBACI,6BAAC,YAAD;IACI,KAAK,EAAEF;EADX,GAEQF,UAFR,gBAII,6BAAC,iBAAD;IACI,QAAQ,EAAEH,QADd;IAEI,KAAK,EAAEiB;EAFX,EAJJ,EASKlB,iBAAiB,gBACd,6BAAC,eAAD;IACI,QAAQ,EAAEA,iBAAiB,CAACP,KADhC;IAEI,KAAK,EAAE,QAFX;IAGI,QAAQ,EAAEO,iBAAiB,CAACmB,QAAlB,IAA8B,KAH5C;IAII,eAAe,EAAE,IAJrB;IAKI,OAAO,EAAEnB,iBAAiB,CAACoB,OAL/B;IAMI,IAAI,EAAE,OANV;IAOI,KAAK,EAAEf,MAAM,CAACR,YAPlB;IAQI,OAAO,EAAE;EARb,EADc,GAWd,IApBR,CADJ;AAwBH"}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.default =
|
|
6
|
+
exports.default = Dialog;
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
9
|
|
|
@@ -19,8 +19,6 @@ var _ShadowView = _interopRequireDefault(require("../ShadowView"));
|
|
|
19
19
|
|
|
20
20
|
var _DialogContext = require("./DialogContext");
|
|
21
21
|
|
|
22
|
-
var _FullDialogCloseButton = _interopRequireDefault(require("./FullDialogCloseButton"));
|
|
23
|
-
|
|
24
22
|
var _useDialogStyle = _interopRequireDefault(require("./useDialogStyle"));
|
|
25
23
|
|
|
26
24
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -33,7 +31,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
|
|
|
33
31
|
|
|
34
32
|
const TOP_ELEMENT_OFFSET = 20;
|
|
35
33
|
|
|
36
|
-
|
|
34
|
+
function Dialog(props) {
|
|
37
35
|
const {
|
|
38
36
|
animationType = _Modal.ANIMATION_TYPE.SLIDE,
|
|
39
37
|
children,
|
|
@@ -141,9 +139,5 @@ const Dialog = props => {
|
|
|
141
139
|
variant: 600,
|
|
142
140
|
style: paperStyle
|
|
143
141
|
}, children)));
|
|
144
|
-
}
|
|
145
|
-
|
|
146
|
-
Dialog.FullDialogCloseButton = _FullDialogCloseButton.default;
|
|
147
|
-
var _default = Dialog;
|
|
148
|
-
exports.default = _default;
|
|
142
|
+
}
|
|
149
143
|
//# sourceMappingURL=Dialog.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["TOP_ELEMENT_OFFSET","Dialog","props","animationType","ANIMATION_TYPE","SLIDE","children","hideBackdrop","onClose","style","styleProp","size","visible","topElement","otherProps","styles","useDialogStyle","height","screenHeight","useWindowDimensions","topElementHeight","setTopElementHeight","useState","handleTopElementLayout","event","nativeEvent","layout","offsetAnimation","useMemo","toValue","type","closeAnimation","FADE","duration","openAnimation","delay","initialOpacity","undefined","initialTranslateY","paperStyle","css","paper","container","root","topElementContainer","topElementContent"
|
|
1
|
+
{"version":3,"names":["TOP_ELEMENT_OFFSET","Dialog","props","animationType","ANIMATION_TYPE","SLIDE","children","hideBackdrop","onClose","style","styleProp","size","visible","topElement","otherProps","styles","useDialogStyle","height","screenHeight","useWindowDimensions","topElementHeight","setTopElementHeight","useState","handleTopElementLayout","event","nativeEvent","layout","offsetAnimation","useMemo","toValue","type","closeAnimation","FADE","duration","openAnimation","delay","initialOpacity","undefined","initialTranslateY","paperStyle","css","paper","container","root","topElementContainer","topElementContent"],"sources":["Dialog.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport { LayoutChangeEvent, useWindowDimensions } from 'react-native';\nimport { css } from '@fountain-ui/styles';\nimport Column from '../Column';\nimport Modal, { ANIMATION_TYPE, AnimationUnit } from '../Modal';\nimport ShadowView from '../ShadowView';\nimport type DialogProps from './DialogProps';\nimport { DialogProvider } from './DialogContext';\nimport useDialogStyle from './useDialogStyle';\n\nconst TOP_ELEMENT_OFFSET = 20;\n\nexport default function Dialog(props: DialogProps) {\n const {\n animationType = ANIMATION_TYPE.SLIDE,\n children,\n hideBackdrop,\n onClose,\n style: styleProp,\n size = 'medium',\n visible,\n topElement,\n ...otherProps\n } = props;\n\n const styles = useDialogStyle(size);\n\n const { height: screenHeight } = useWindowDimensions();\n\n const [topElementHeight, setTopElementHeight] = useState(0);\n const handleTopElementLayout = (event: LayoutChangeEvent) => {\n const { height } = event.nativeEvent.layout;\n setTopElementHeight(height);\n };\n\n const offsetAnimation = useMemo<AnimationUnit[]>(() => {\n if (topElementHeight === 0) {\n return [];\n }\n\n return [{\n toValue: (topElementHeight - TOP_ELEMENT_OFFSET) / 2,\n type: ANIMATION_TYPE.SLIDE,\n }];\n }, [topElementHeight]);\n\n const closeAnimation = useMemo<AnimationUnit[]>(() => {\n if (animationType === ANIMATION_TYPE.FADE) {\n return [{\n toValue: 0,\n type: ANIMATION_TYPE.FADE,\n }];\n } else if (animationType === ANIMATION_TYPE.SLIDE) {\n return [\n {\n toValue: screenHeight,\n type: ANIMATION_TYPE.SLIDE,\n },\n {\n duration: 150,\n toValue: 0,\n type: ANIMATION_TYPE.FADE,\n },\n ];\n }\n\n return [{\n duration: 150,\n toValue: screenHeight,\n type: ANIMATION_TYPE.SLIDE,\n }];\n }, [animationType, screenHeight]);\n\n const openAnimation = useMemo<AnimationUnit[]>(() => {\n if (animationType === ANIMATION_TYPE.FADE) {\n return [{\n toValue: 1,\n type: ANIMATION_TYPE.FADE,\n }];\n } else if (animationType === ANIMATION_TYPE.SLIDE) {\n return [\n {\n toValue: 0,\n type: ANIMATION_TYPE.SLIDE,\n },\n {\n delay: 50,\n duration: 150,\n toValue: 1,\n type: ANIMATION_TYPE.FADE,\n },\n ];\n }\n\n return [{\n toValue: 0,\n type: ANIMATION_TYPE.SLIDE,\n }];\n }, [animationType]);\n\n const initialOpacity = animationType === ANIMATION_TYPE.SLIDE ? 1 : undefined;\n\n const initialTranslateY = animationType === ANIMATION_TYPE.FADE ? 0 : undefined;\n\n const paperStyle = css([\n styles.paper,\n styleProp,\n ]);\n\n return (\n <Modal\n animationStyle={styles.container}\n closeAnimation={closeAnimation}\n hideBackdrop={hideBackdrop || animationType === ANIMATION_TYPE.FADE}\n initialOpacity={initialOpacity}\n initialTranslateY={initialTranslateY}\n onClose={onClose}\n openAnimation={openAnimation}\n offsetAnimation={offsetAnimation}\n visible={visible}\n style={styles.root}\n {...otherProps}\n >\n <DialogProvider value={{ size }}>\n {topElement ? (\n <Column style={styles.topElementContainer}>\n <Column\n style={styles.topElementContent}\n onLayout={handleTopElementLayout}\n >\n {topElement}\n </Column>\n </Column>\n ) : null}\n\n <ShadowView\n variant={600}\n style={paperStyle}\n >\n {children}\n </ShadowView>\n </DialogProvider>\n </Modal>\n );\n}\n"],"mappings":"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"}
|
|
@@ -36,12 +36,15 @@ const useStyles = function () {
|
|
|
36
36
|
return {
|
|
37
37
|
root: {
|
|
38
38
|
alignItems: 'center',
|
|
39
|
+
borderBottomColor: theme.palette.border.weak,
|
|
40
|
+
borderBottomWidth: 0.5,
|
|
39
41
|
flexDirection: 'row',
|
|
40
|
-
gap:
|
|
41
|
-
justifyContent: 'space-between'
|
|
42
|
+
gap: 32,
|
|
43
|
+
justifyContent: 'space-between',
|
|
44
|
+
paddingVertical: 14
|
|
42
45
|
},
|
|
43
46
|
content: {
|
|
44
|
-
gap:
|
|
47
|
+
gap: 8,
|
|
45
48
|
minHeight: 20
|
|
46
49
|
}
|
|
47
50
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["DEFAULT_START_ICON_SIZE","useStyles","theme","useTheme","root","alignItems","flexDirection","gap","
|
|
1
|
+
{"version":3,"names":["DEFAULT_START_ICON_SIZE","useStyles","theme","useTheme","root","alignItems","borderBottomColor","palette","border","weak","borderBottomWidth","flexDirection","gap","justifyContent","paddingVertical","content","minHeight","Radio","props","checked","children","checkedIcon","checkIconProp","disabled","onChange","onChangeProp","startIcon","startIconProp","style","value","otherProps","styles","context","useContext","RadioContext","handlePress","isChecked","defaultCheckedIcon","icon","cloneElementSafely","color","height","width","rootStyle","css","fontStyle","createFontStyle","selector","typography","body1","regular","text","strong"],"sources":["Radio.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { Check as CheckedIcon } from '../internal';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport { RadioContext } from '../RadioGroup/RadioContextProvider';\nimport type RadioProps from './RadioProps';\n\nconst DEFAULT_START_ICON_SIZE = 21;\n\ntype RadioStyles = NamedStylesStringUnion<'root' | 'content'>;\n\nconst useStyles: UseStyles<RadioStyles> = function (): RadioStyles {\n const theme = useTheme();\n\n return {\n root: {\n alignItems: 'center',\n borderBottomColor: theme.palette.border.weak,\n borderBottomWidth: 0.5,\n flexDirection: 'row',\n gap: 32,\n justifyContent: 'space-between',\n paddingVertical: 14,\n },\n content: {\n gap: 8,\n minHeight: 20,\n },\n };\n};\n\nexport default function Radio(props: RadioProps) {\n const {\n checked = false,\n children,\n checkedIcon: checkIconProp,\n disabled = false,\n onChange: onChangeProp,\n startIcon: startIconProp,\n style,\n value,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const styles = useStyles();\n\n const context = useContext(RadioContext);\n\n const handlePress = () => {\n const onChange = context?.onChange ?? onChangeProp;\n if (onChange) {\n onChange(value);\n }\n };\n\n const isChecked = context?.value === value ?? checked;\n\n const defaultCheckedIcon = (\n <CheckedIcon color={'accent'}/>\n );\n\n const checkedIcon = checkIconProp ?? defaultCheckedIcon;\n const icon = isChecked ? checkedIcon : null;\n\n const startIcon = cloneElementSafely(startIconProp, {\n color: 'strong',\n height: DEFAULT_START_ICON_SIZE,\n width: DEFAULT_START_ICON_SIZE,\n });\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typography) => typography.body1.regular,\n color: theme.palette.text.strong,\n });\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n <Row\n alignItems={'center'}\n style={styles.content}\n >\n {startIcon}\n\n <Text\n children={children}\n style={fontStyle}\n />\n </Row>\n\n {icon}\n </ButtonBase>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAGA,MAAMA,uBAAuB,GAAG,EAAhC;;AAIA,MAAMC,SAAiC,GAAG,YAAyB;EAC/D,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,iBAAiB,EAAEJ,KAAK,CAACK,OAAN,CAAcC,MAAd,CAAqBC,IAFtC;MAGFC,iBAAiB,EAAE,GAHjB;MAIFC,aAAa,EAAE,KAJb;MAKFC,GAAG,EAAE,EALH;MAMFC,cAAc,EAAE,eANd;MAOFC,eAAe,EAAE;IAPf,CADH;IAUHC,OAAO,EAAE;MACLH,GAAG,EAAE,CADA;MAELI,SAAS,EAAE;IAFN;EAVN,CAAP;AAeH,CAlBD;;AAoBe,SAASC,KAAT,CAAeC,KAAf,EAAkC;EAC7C,MAAM;IACFC,OAAO,GAAG,KADR;IAEFC,QAFE;IAGFC,WAAW,EAAEC,aAHX;IAIFC,QAAQ,GAAG,KAJT;IAKFC,QAAQ,EAAEC,YALR;IAMFC,SAAS,EAAEC,aANT;IAOFC,KAPE;IAQFC,KARE;IASF,GAAGC;EATD,IAUFZ,KAVJ;EAYA,MAAMhB,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAM4B,MAAM,GAAG9B,SAAS,EAAxB;EAEA,MAAM+B,OAAO,GAAG,IAAAC,iBAAA,EAAWC,kCAAX,CAAhB;;EAEA,MAAMC,WAAW,GAAG,MAAM;IACtB,MAAMX,QAAQ,GAAG,CAAAQ,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAER,QAAT,KAAqBC,YAAtC;;IACA,IAAID,QAAJ,EAAc;MACVA,QAAQ,CAACK,KAAD,CAAR;IACH;EACJ,CALD;;EAOA,MAAMO,SAAS,GAAG,CAAAJ,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEH,KAAT,MAAmBA,KAAnB,IAA4BV,OAA9C;;EAEA,MAAMkB,kBAAkB,gBACpB,6BAAC,eAAD;IAAa,KAAK,EAAE;EAApB,EADJ;;EAIA,MAAMhB,WAAW,GAAGC,aAAa,IAAIe,kBAArC;EACA,MAAMC,IAAI,GAAGF,SAAS,GAAGf,WAAH,GAAiB,IAAvC;EAEA,MAAMK,SAAS,GAAG,IAAAa,yBAAA,EAAmBZ,aAAnB,EAAkC;IAChDa,KAAK,EAAE,QADyC;IAEhDC,MAAM,EAAEzC,uBAFwC;IAGhD0C,KAAK,EAAE1C;EAHyC,CAAlC,CAAlB;EAMA,MAAM2C,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBb,MAAM,CAAC3B,IADW,EAElBwB,KAFkB,CAAJ,CAAlB;EAKA,MAAMiB,SAAS,GAAG,IAAAC,uBAAA,EAAgB5C,KAAhB,EAAuB;IACrC6C,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,KAAX,CAAiBC,OADN;IAErCV,KAAK,EAAEtC,KAAK,CAACK,OAAN,CAAc4C,IAAd,CAAmBC;EAFW,CAAvB,CAAlB;EAKA,oBACI,6BAAC,mBAAD;IACI,QAAQ,EAAE7B,QADd;IAEI,OAAO,EAAEY,WAFb;IAGI,KAAK,EAAEQ;EAHX,GAIQb,UAJR,gBAMI,6BAAC,YAAD;IACI,UAAU,EAAE,QADhB;IAEI,KAAK,EAAEC,MAAM,CAAChB;EAFlB,GAIKW,SAJL,eAMI,6BAAC,iBAAD;IACI,QAAQ,EAAEN,QADd;IAEI,KAAK,EAAEyB;EAFX,EANJ,CANJ,EAkBKP,IAlBL,CADJ;AAsBH;;AAAA"}
|
|
@@ -5,33 +5,14 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = RadioGroup;
|
|
7
7
|
|
|
8
|
-
var _react =
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
10
|
var _reactNative = require("react-native");
|
|
11
11
|
|
|
12
|
-
var _styles = require("../styles");
|
|
13
|
-
|
|
14
|
-
var _utils = require("../utils");
|
|
15
|
-
|
|
16
12
|
var _RadioContextProvider = _interopRequireDefault(require("./RadioContextProvider"));
|
|
17
13
|
|
|
18
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
15
|
|
|
20
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
|
-
|
|
22
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
23
|
-
|
|
24
|
-
const useStyles = function () {
|
|
25
|
-
const theme = (0, _styles.useTheme)();
|
|
26
|
-
return {
|
|
27
|
-
root: {
|
|
28
|
-
borderBottomColor: theme.palette.border.weak,
|
|
29
|
-
borderBottomWidth: 0.5,
|
|
30
|
-
paddingVertical: theme.spacing(3.5)
|
|
31
|
-
}
|
|
32
|
-
};
|
|
33
|
-
};
|
|
34
|
-
|
|
35
16
|
function RadioGroup(props) {
|
|
36
17
|
const {
|
|
37
18
|
children,
|
|
@@ -39,18 +20,12 @@ function RadioGroup(props) {
|
|
|
39
20
|
onChange,
|
|
40
21
|
...otherProps
|
|
41
22
|
} = props;
|
|
42
|
-
const styles = useStyles();
|
|
43
|
-
|
|
44
|
-
const radios = _react.Children.map(children, child => /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
45
|
-
style: styles.root
|
|
46
|
-
}, (0, _utils.cloneElementSafely)(child)));
|
|
47
|
-
|
|
48
23
|
return /*#__PURE__*/_react.default.createElement(_RadioContextProvider.default, {
|
|
49
24
|
value: {
|
|
50
25
|
value,
|
|
51
26
|
onChange
|
|
52
27
|
}
|
|
53
|
-
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, otherProps,
|
|
28
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, otherProps, children));
|
|
54
29
|
}
|
|
55
30
|
|
|
56
31
|
;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["RadioGroup","props","children","value","onChange","otherProps"],"sources":["RadioGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport RadioContextProvider from './RadioContextProvider';\nimport type RadioGroupProps from './RadioGroupProps';\n\nexport default function RadioGroup(props: RadioGroupProps) {\n const {\n children,\n value,\n onChange,\n ...otherProps\n } = props;\n\n return (\n <RadioContextProvider value={{ value, onChange }}>\n <View {...otherProps}>\n {children}\n </View>\n </RadioContextProvider>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAGe,SAASA,UAAT,CAAoBC,KAApB,EAA4C;EACvD,MAAM;IACFC,QADE;IAEFC,KAFE;IAGFC,QAHE;IAIF,GAAGC;EAJD,IAKFJ,KALJ;EAOA,oBACI,6BAAC,6BAAD;IAAsB,KAAK,EAAE;MAAEE,KAAF;MAASC;IAAT;EAA7B,gBACI,6BAAC,iBAAD,EAAUC,UAAV,EACKH,QADL,CADJ,CADJ;AAOH;;AAAA"}
|
|
@@ -10,7 +10,7 @@ const useStyles = function () {
|
|
|
10
10
|
const theme = useTheme();
|
|
11
11
|
return {
|
|
12
12
|
root: {
|
|
13
|
-
alignItems: '
|
|
13
|
+
alignItems: 'flex-start',
|
|
14
14
|
gap: theme.spacing(8),
|
|
15
15
|
justifyContent: 'space-between',
|
|
16
16
|
marginBottom: theme.spacing(4),
|
|
@@ -18,7 +18,8 @@ const useStyles = function () {
|
|
|
18
18
|
},
|
|
19
19
|
title: {
|
|
20
20
|
paddingBottom: theme.spacing(1.25),
|
|
21
|
-
paddingTop: theme.spacing(1)
|
|
21
|
+
paddingTop: theme.spacing(1),
|
|
22
|
+
minWidth: 0
|
|
22
23
|
},
|
|
23
24
|
actionButton: {
|
|
24
25
|
paddingBottom: theme.spacing(1.75),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Text","Button","Row","createFontStyle","css","useTheme","useStyles","theme","root","alignItems","gap","spacing","justifyContent","marginBottom","paddingHorizontal","title","paddingBottom","paddingTop","actionButton","BottomSheetTitle","props","actionButtonProps","children","style","styleProp","otherProps","styles","rootStyle","titleFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","titleStyle","disabled","onPress"],"sources":["BottomSheetTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Button from '../Button/Button';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type BottomSheetTitleProps from './BottomSheetTitleProps';\n\ntype BottomSheetTitleStyles = NamedStylesStringUnion<'root' | 'title' | 'actionButton'>;\n\nconst useStyles: UseStyles<BottomSheetTitleStyles> = function (): BottomSheetTitleStyles {\n const theme = useTheme();\n\n return {\n root: {\n alignItems: '
|
|
1
|
+
{"version":3,"names":["React","Text","Button","Row","createFontStyle","css","useTheme","useStyles","theme","root","alignItems","gap","spacing","justifyContent","marginBottom","paddingHorizontal","title","paddingBottom","paddingTop","minWidth","actionButton","BottomSheetTitle","props","actionButtonProps","children","style","styleProp","otherProps","styles","rootStyle","titleFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","titleStyle","disabled","onPress"],"sources":["BottomSheetTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Button from '../Button/Button';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type BottomSheetTitleProps from './BottomSheetTitleProps';\n\ntype BottomSheetTitleStyles = NamedStylesStringUnion<'root' | 'title' | 'actionButton'>;\n\nconst useStyles: UseStyles<BottomSheetTitleStyles> = function (): BottomSheetTitleStyles {\n const theme = useTheme();\n\n return {\n root: {\n alignItems: 'flex-start',\n gap: theme.spacing(8),\n justifyContent: 'space-between',\n marginBottom: theme.spacing(4),\n paddingHorizontal: theme.spacing(6),\n },\n title: {\n paddingBottom: theme.spacing(1.25),\n paddingTop: theme.spacing(1),\n minWidth: 0,\n },\n actionButton: {\n paddingBottom: theme.spacing(1.75),\n paddingHorizontal: 0,\n paddingTop: theme.spacing(1.25),\n },\n };\n};\n\nexport default function BottomSheetTitle(props: BottomSheetTitleProps) {\n const {\n actionButtonProps,\n children,\n style: styleProp,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const styles = useStyles();\n\n const rootStyle = css([\n styles.root,\n styleProp,\n ]);\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (typography) => typography.header3.semiBold,\n color: theme.palette.text.strong,\n });\n\n const titleStyle = css([\n styles.title,\n titleFontStyle,\n ]);\n\n return (\n <Row\n style={rootStyle}\n {...otherProps}\n >\n <Text\n children={children}\n style={titleStyle}\n />\n\n {actionButtonProps ? (\n <Button\n children={actionButtonProps.title}\n color={'accent'}\n disabled={actionButtonProps.disabled ?? false}\n disableMinWidth={true}\n onPress={actionButtonProps.onPress}\n size={'large'}\n style={styles.actionButton}\n variant={'text'}\n />\n ) : null}\n </Row>\n );\n}\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,OAAOC,MAAP,MAAmB,kBAAnB;AACA,OAAOC,GAAP,MAAgB,QAAhB;AACA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,QAA/B,QAA+C,WAA/C;;AAKA,MAAMC,SAA4C,GAAG,YAAoC;EACrF,MAAMC,KAAK,GAAGF,QAAQ,EAAtB;EAEA,OAAO;IACHG,IAAI,EAAE;MACFC,UAAU,EAAE,YADV;MAEFC,GAAG,EAAEH,KAAK,CAACI,OAAN,CAAc,CAAd,CAFH;MAGFC,cAAc,EAAE,eAHd;MAIFC,YAAY,EAAEN,KAAK,CAACI,OAAN,CAAc,CAAd,CAJZ;MAKFG,iBAAiB,EAAEP,KAAK,CAACI,OAAN,CAAc,CAAd;IALjB,CADH;IAQHI,KAAK,EAAE;MACHC,aAAa,EAAET,KAAK,CAACI,OAAN,CAAc,IAAd,CADZ;MAEHM,UAAU,EAAEV,KAAK,CAACI,OAAN,CAAc,CAAd,CAFT;MAGHO,QAAQ,EAAE;IAHP,CARJ;IAaHC,YAAY,EAAE;MACVH,aAAa,EAAET,KAAK,CAACI,OAAN,CAAc,IAAd,CADL;MAEVG,iBAAiB,EAAE,CAFT;MAGVG,UAAU,EAAEV,KAAK,CAACI,OAAN,CAAc,IAAd;IAHF;EAbX,CAAP;AAmBH,CAtBD;;AAwBA,eAAe,SAASS,gBAAT,CAA0BC,KAA1B,EAAwD;EACnE,MAAM;IACFC,iBADE;IAEFC,QAFE;IAGFC,KAAK,EAAEC,SAHL;IAIF,GAAGC;EAJD,IAKFL,KALJ;EAOA,MAAMd,KAAK,GAAGF,QAAQ,EAAtB;EAEA,MAAMsB,MAAM,GAAGrB,SAAS,EAAxB;EAEA,MAAMsB,SAAS,GAAGxB,GAAG,CAAC,CAClBuB,MAAM,CAACnB,IADW,EAElBiB,SAFkB,CAAD,CAArB;EAKA,MAAMI,cAAc,GAAG1B,eAAe,CAACI,KAAD,EAAQ;IAC1CuB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,OAAX,CAAmBC,QADH;IAE1CC,KAAK,EAAE3B,KAAK,CAAC4B,OAAN,CAAcC,IAAd,CAAmBC;EAFgB,CAAR,CAAtC;EAKA,MAAMC,UAAU,GAAGlC,GAAG,CAAC,CACnBuB,MAAM,CAACZ,KADY,EAEnBc,cAFmB,CAAD,CAAtB;EAKA,oBACI,oBAAC,GAAD;IACI,KAAK,EAAED;EADX,GAEQF,UAFR,gBAII,oBAAC,IAAD;IACI,QAAQ,EAAEH,QADd;IAEI,KAAK,EAAEe;EAFX,EAJJ,EASKhB,iBAAiB,gBACd,oBAAC,MAAD;IACI,QAAQ,EAAEA,iBAAiB,CAACP,KADhC;IAEI,KAAK,EAAE,QAFX;IAGI,QAAQ,EAAEO,iBAAiB,CAACiB,QAAlB,IAA8B,KAH5C;IAII,eAAe,EAAE,IAJrB;IAKI,OAAO,EAAEjB,iBAAiB,CAACkB,OAL/B;IAMI,IAAI,EAAE,OANV;IAOI,KAAK,EAAEb,MAAM,CAACR,YAPlB;IAQI,OAAO,EAAE;EARb,EADc,GAWd,IApBR,CADJ;AAwBH"}
|
|
@@ -7,11 +7,9 @@ import Column from '../Column';
|
|
|
7
7
|
import Modal, { ANIMATION_TYPE } from '../Modal';
|
|
8
8
|
import ShadowView from '../ShadowView';
|
|
9
9
|
import { DialogProvider } from './DialogContext';
|
|
10
|
-
import FullDialogCloseButton from './FullDialogCloseButton';
|
|
11
10
|
import useDialogStyle from './useDialogStyle';
|
|
12
11
|
const TOP_ELEMENT_OFFSET = 20;
|
|
13
|
-
|
|
14
|
-
const Dialog = props => {
|
|
12
|
+
export default function Dialog(props) {
|
|
15
13
|
const {
|
|
16
14
|
animationType = ANIMATION_TYPE.SLIDE,
|
|
17
15
|
children,
|
|
@@ -119,8 +117,5 @@ const Dialog = props => {
|
|
|
119
117
|
variant: 600,
|
|
120
118
|
style: paperStyle
|
|
121
119
|
}, children)));
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
Dialog.FullDialogCloseButton = FullDialogCloseButton;
|
|
125
|
-
export default Dialog;
|
|
120
|
+
}
|
|
126
121
|
//# sourceMappingURL=Dialog.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useMemo","useState","useWindowDimensions","css","Column","Modal","ANIMATION_TYPE","ShadowView","DialogProvider","
|
|
1
|
+
{"version":3,"names":["React","useMemo","useState","useWindowDimensions","css","Column","Modal","ANIMATION_TYPE","ShadowView","DialogProvider","useDialogStyle","TOP_ELEMENT_OFFSET","Dialog","props","animationType","SLIDE","children","hideBackdrop","onClose","style","styleProp","size","visible","topElement","otherProps","styles","height","screenHeight","topElementHeight","setTopElementHeight","handleTopElementLayout","event","nativeEvent","layout","offsetAnimation","toValue","type","closeAnimation","FADE","duration","openAnimation","delay","initialOpacity","undefined","initialTranslateY","paperStyle","paper","container","root","topElementContainer","topElementContent"],"sources":["Dialog.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport { LayoutChangeEvent, useWindowDimensions } from 'react-native';\nimport { css } from '@fountain-ui/styles';\nimport Column from '../Column';\nimport Modal, { ANIMATION_TYPE, AnimationUnit } from '../Modal';\nimport ShadowView from '../ShadowView';\nimport type DialogProps from './DialogProps';\nimport { DialogProvider } from './DialogContext';\nimport useDialogStyle from './useDialogStyle';\n\nconst TOP_ELEMENT_OFFSET = 20;\n\nexport default function Dialog(props: DialogProps) {\n const {\n animationType = ANIMATION_TYPE.SLIDE,\n children,\n hideBackdrop,\n onClose,\n style: styleProp,\n size = 'medium',\n visible,\n topElement,\n ...otherProps\n } = props;\n\n const styles = useDialogStyle(size);\n\n const { height: screenHeight } = useWindowDimensions();\n\n const [topElementHeight, setTopElementHeight] = useState(0);\n const handleTopElementLayout = (event: LayoutChangeEvent) => {\n const { height } = event.nativeEvent.layout;\n setTopElementHeight(height);\n };\n\n const offsetAnimation = useMemo<AnimationUnit[]>(() => {\n if (topElementHeight === 0) {\n return [];\n }\n\n return [{\n toValue: (topElementHeight - TOP_ELEMENT_OFFSET) / 2,\n type: ANIMATION_TYPE.SLIDE,\n }];\n }, [topElementHeight]);\n\n const closeAnimation = useMemo<AnimationUnit[]>(() => {\n if (animationType === ANIMATION_TYPE.FADE) {\n return [{\n toValue: 0,\n type: ANIMATION_TYPE.FADE,\n }];\n } else if (animationType === ANIMATION_TYPE.SLIDE) {\n return [\n {\n toValue: screenHeight,\n type: ANIMATION_TYPE.SLIDE,\n },\n {\n duration: 150,\n toValue: 0,\n type: ANIMATION_TYPE.FADE,\n },\n ];\n }\n\n return [{\n duration: 150,\n toValue: screenHeight,\n type: ANIMATION_TYPE.SLIDE,\n }];\n }, [animationType, screenHeight]);\n\n const openAnimation = useMemo<AnimationUnit[]>(() => {\n if (animationType === ANIMATION_TYPE.FADE) {\n return [{\n toValue: 1,\n type: ANIMATION_TYPE.FADE,\n }];\n } else if (animationType === ANIMATION_TYPE.SLIDE) {\n return [\n {\n toValue: 0,\n type: ANIMATION_TYPE.SLIDE,\n },\n {\n delay: 50,\n duration: 150,\n toValue: 1,\n type: ANIMATION_TYPE.FADE,\n },\n ];\n }\n\n return [{\n toValue: 0,\n type: ANIMATION_TYPE.SLIDE,\n }];\n }, [animationType]);\n\n const initialOpacity = animationType === ANIMATION_TYPE.SLIDE ? 1 : undefined;\n\n const initialTranslateY = animationType === ANIMATION_TYPE.FADE ? 0 : undefined;\n\n const paperStyle = css([\n styles.paper,\n styleProp,\n ]);\n\n return (\n <Modal\n animationStyle={styles.container}\n closeAnimation={closeAnimation}\n hideBackdrop={hideBackdrop || animationType === ANIMATION_TYPE.FADE}\n initialOpacity={initialOpacity}\n initialTranslateY={initialTranslateY}\n onClose={onClose}\n openAnimation={openAnimation}\n offsetAnimation={offsetAnimation}\n visible={visible}\n style={styles.root}\n {...otherProps}\n >\n <DialogProvider value={{ size }}>\n {topElement ? (\n <Column style={styles.topElementContainer}>\n <Column\n style={styles.topElementContent}\n onLayout={handleTopElementLayout}\n >\n {topElement}\n </Column>\n </Column>\n ) : null}\n\n <ShadowView\n variant={600}\n style={paperStyle}\n >\n {children}\n </ShadowView>\n </DialogProvider>\n </Modal>\n );\n}\n"],"mappings":"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"}
|
|
@@ -15,12 +15,15 @@ const useStyles = function () {
|
|
|
15
15
|
return {
|
|
16
16
|
root: {
|
|
17
17
|
alignItems: 'center',
|
|
18
|
+
borderBottomColor: theme.palette.border.weak,
|
|
19
|
+
borderBottomWidth: 0.5,
|
|
18
20
|
flexDirection: 'row',
|
|
19
|
-
gap:
|
|
20
|
-
justifyContent: 'space-between'
|
|
21
|
+
gap: 32,
|
|
22
|
+
justifyContent: 'space-between',
|
|
23
|
+
paddingVertical: 14
|
|
21
24
|
},
|
|
22
25
|
content: {
|
|
23
|
-
gap:
|
|
26
|
+
gap: 8,
|
|
24
27
|
minHeight: 20
|
|
25
28
|
}
|
|
26
29
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useContext","Text","ButtonBase","Check","CheckedIcon","Row","createFontStyle","css","useTheme","cloneElementSafely","RadioContext","DEFAULT_START_ICON_SIZE","useStyles","theme","root","alignItems","flexDirection","gap","
|
|
1
|
+
{"version":3,"names":["React","useContext","Text","ButtonBase","Check","CheckedIcon","Row","createFontStyle","css","useTheme","cloneElementSafely","RadioContext","DEFAULT_START_ICON_SIZE","useStyles","theme","root","alignItems","borderBottomColor","palette","border","weak","borderBottomWidth","flexDirection","gap","justifyContent","paddingVertical","content","minHeight","Radio","props","checked","children","checkedIcon","checkIconProp","disabled","onChange","onChangeProp","startIcon","startIconProp","style","value","otherProps","styles","context","handlePress","isChecked","defaultCheckedIcon","icon","color","height","width","rootStyle","fontStyle","selector","typography","body1","regular","text","strong"],"sources":["Radio.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { Check as CheckedIcon } from '../internal';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport { RadioContext } from '../RadioGroup/RadioContextProvider';\nimport type RadioProps from './RadioProps';\n\nconst DEFAULT_START_ICON_SIZE = 21;\n\ntype RadioStyles = NamedStylesStringUnion<'root' | 'content'>;\n\nconst useStyles: UseStyles<RadioStyles> = function (): RadioStyles {\n const theme = useTheme();\n\n return {\n root: {\n alignItems: 'center',\n borderBottomColor: theme.palette.border.weak,\n borderBottomWidth: 0.5,\n flexDirection: 'row',\n gap: 32,\n justifyContent: 'space-between',\n paddingVertical: 14,\n },\n content: {\n gap: 8,\n minHeight: 20,\n },\n };\n};\n\nexport default function Radio(props: RadioProps) {\n const {\n checked = false,\n children,\n checkedIcon: checkIconProp,\n disabled = false,\n onChange: onChangeProp,\n startIcon: startIconProp,\n style,\n value,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const styles = useStyles();\n\n const context = useContext(RadioContext);\n\n const handlePress = () => {\n const onChange = context?.onChange ?? onChangeProp;\n if (onChange) {\n onChange(value);\n }\n };\n\n const isChecked = context?.value === value ?? checked;\n\n const defaultCheckedIcon = (\n <CheckedIcon color={'accent'}/>\n );\n\n const checkedIcon = checkIconProp ?? defaultCheckedIcon;\n const icon = isChecked ? checkedIcon : null;\n\n const startIcon = cloneElementSafely(startIconProp, {\n color: 'strong',\n height: DEFAULT_START_ICON_SIZE,\n width: DEFAULT_START_ICON_SIZE,\n });\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typography) => typography.body1.regular,\n color: theme.palette.text.strong,\n });\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n <Row\n alignItems={'center'}\n style={styles.content}\n >\n {startIcon}\n\n <Text\n children={children}\n style={fontStyle}\n />\n </Row>\n\n {icon}\n </ButtonBase>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1,20 +1,6 @@
|
|
|
1
|
-
import React
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import { View } from 'react-native';
|
|
3
|
-
import { useTheme } from '../styles';
|
|
4
|
-
import { cloneElementSafely } from '../utils';
|
|
5
3
|
import RadioContextProvider from './RadioContextProvider';
|
|
6
|
-
|
|
7
|
-
const useStyles = function () {
|
|
8
|
-
const theme = useTheme();
|
|
9
|
-
return {
|
|
10
|
-
root: {
|
|
11
|
-
borderBottomColor: theme.palette.border.weak,
|
|
12
|
-
borderBottomWidth: 0.5,
|
|
13
|
-
paddingVertical: theme.spacing(3.5)
|
|
14
|
-
}
|
|
15
|
-
};
|
|
16
|
-
};
|
|
17
|
-
|
|
18
4
|
export default function RadioGroup(props) {
|
|
19
5
|
const {
|
|
20
6
|
children,
|
|
@@ -22,16 +8,12 @@ export default function RadioGroup(props) {
|
|
|
22
8
|
onChange,
|
|
23
9
|
...otherProps
|
|
24
10
|
} = props;
|
|
25
|
-
const styles = useStyles();
|
|
26
|
-
const radios = Children.map(children, child => /*#__PURE__*/React.createElement(View, {
|
|
27
|
-
style: styles.root
|
|
28
|
-
}, cloneElementSafely(child)));
|
|
29
11
|
return /*#__PURE__*/React.createElement(RadioContextProvider, {
|
|
30
12
|
value: {
|
|
31
13
|
value,
|
|
32
14
|
onChange
|
|
33
15
|
}
|
|
34
|
-
}, /*#__PURE__*/React.createElement(View, otherProps,
|
|
16
|
+
}, /*#__PURE__*/React.createElement(View, otherProps, children));
|
|
35
17
|
}
|
|
36
18
|
;
|
|
37
19
|
//# sourceMappingURL=RadioGroup.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","
|
|
1
|
+
{"version":3,"names":["React","View","RadioContextProvider","RadioGroup","props","children","value","onChange","otherProps"],"sources":["RadioGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport RadioContextProvider from './RadioContextProvider';\nimport type RadioGroupProps from './RadioGroupProps';\n\nexport default function RadioGroup(props: RadioGroupProps) {\n const {\n children,\n value,\n onChange,\n ...otherProps\n } = props;\n\n return (\n <RadioContextProvider value={{ value, onChange }}>\n <View {...otherProps}>\n {children}\n </View>\n </RadioContextProvider>\n );\n};\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AACA,OAAOC,oBAAP,MAAiC,wBAAjC;AAGA,eAAe,SAASC,UAAT,CAAoBC,KAApB,EAA4C;EACvD,MAAM;IACFC,QADE;IAEFC,KAFE;IAGFC,QAHE;IAIF,GAAGC;EAJD,IAKFJ,KALJ;EAOA,oBACI,oBAAC,oBAAD;IAAsB,KAAK,EAAE;MAAEE,KAAF;MAASC;IAAT;EAA7B,gBACI,oBAAC,IAAD,EAAUC,UAAV,EACKH,QADL,CADJ,CADJ;AAOH;AAAA"}
|
|
@@ -1,8 +1,3 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type DialogProps from './DialogProps';
|
|
3
|
-
|
|
4
|
-
declare const Dialog: {
|
|
5
|
-
(props: DialogProps): JSX.Element;
|
|
6
|
-
FullDialogCloseButton: typeof FullDialogCloseButton;
|
|
7
|
-
};
|
|
8
|
-
export default Dialog;
|
|
3
|
+
export default function Dialog(props: DialogProps): JSX.Element;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fountain-ui/core",
|
|
3
|
-
"version": "3.0.0-alpha.
|
|
3
|
+
"version": "3.0.0-alpha.20",
|
|
4
4
|
"author": "Fountain-UI Team",
|
|
5
5
|
"description": "React components that implement Tappytoon's Fountain Design.",
|
|
6
6
|
"license": "MIT",
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
"prepare": "bob build"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@fountain-ui/styles": "^3.0.0-alpha.
|
|
17
|
+
"@fountain-ui/styles": "^3.0.0-alpha.10",
|
|
18
18
|
"@fountain-ui/utils": "^3.0.0-alpha.1"
|
|
19
19
|
},
|
|
20
20
|
"peerDependencies": {
|
|
@@ -67,5 +67,5 @@
|
|
|
67
67
|
"publishConfig": {
|
|
68
68
|
"access": "public"
|
|
69
69
|
},
|
|
70
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "cbf3d668134714e8aa469c418335717e25d628a8"
|
|
71
71
|
}
|
|
@@ -13,7 +13,7 @@ const useStyles: UseStyles<BottomSheetTitleStyles> = function (): BottomSheetTit
|
|
|
13
13
|
|
|
14
14
|
return {
|
|
15
15
|
root: {
|
|
16
|
-
alignItems: '
|
|
16
|
+
alignItems: 'flex-start',
|
|
17
17
|
gap: theme.spacing(8),
|
|
18
18
|
justifyContent: 'space-between',
|
|
19
19
|
marginBottom: theme.spacing(4),
|
|
@@ -22,6 +22,7 @@ const useStyles: UseStyles<BottomSheetTitleStyles> = function (): BottomSheetTit
|
|
|
22
22
|
title: {
|
|
23
23
|
paddingBottom: theme.spacing(1.25),
|
|
24
24
|
paddingTop: theme.spacing(1),
|
|
25
|
+
minWidth: 0,
|
|
25
26
|
},
|
|
26
27
|
actionButton: {
|
|
27
28
|
paddingBottom: theme.spacing(1.75),
|
package/src/Dialog/Dialog.tsx
CHANGED
|
@@ -6,12 +6,11 @@ import Modal, { ANIMATION_TYPE, AnimationUnit } from '../Modal';
|
|
|
6
6
|
import ShadowView from '../ShadowView';
|
|
7
7
|
import type DialogProps from './DialogProps';
|
|
8
8
|
import { DialogProvider } from './DialogContext';
|
|
9
|
-
import FullDialogCloseButton from './FullDialogCloseButton';
|
|
10
9
|
import useDialogStyle from './useDialogStyle';
|
|
11
10
|
|
|
12
11
|
const TOP_ELEMENT_OFFSET = 20;
|
|
13
12
|
|
|
14
|
-
|
|
13
|
+
export default function Dialog(props: DialogProps) {
|
|
15
14
|
const {
|
|
16
15
|
animationType = ANIMATION_TYPE.SLIDE,
|
|
17
16
|
children,
|
|
@@ -143,8 +142,4 @@ const Dialog = (props: DialogProps) => {
|
|
|
143
142
|
</DialogProvider>
|
|
144
143
|
</Modal>
|
|
145
144
|
);
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
Dialog.FullDialogCloseButton = FullDialogCloseButton;
|
|
149
|
-
|
|
150
|
-
export default Dialog;
|
|
145
|
+
}
|
package/src/Radio/Radio.tsx
CHANGED
|
@@ -19,12 +19,15 @@ const useStyles: UseStyles<RadioStyles> = function (): RadioStyles {
|
|
|
19
19
|
return {
|
|
20
20
|
root: {
|
|
21
21
|
alignItems: 'center',
|
|
22
|
+
borderBottomColor: theme.palette.border.weak,
|
|
23
|
+
borderBottomWidth: 0.5,
|
|
22
24
|
flexDirection: 'row',
|
|
23
|
-
gap:
|
|
25
|
+
gap: 32,
|
|
24
26
|
justifyContent: 'space-between',
|
|
27
|
+
paddingVertical: 14,
|
|
25
28
|
},
|
|
26
29
|
content: {
|
|
27
|
-
gap:
|
|
30
|
+
gap: 8,
|
|
28
31
|
minHeight: 20,
|
|
29
32
|
},
|
|
30
33
|
};
|
|
@@ -1,26 +1,8 @@
|
|
|
1
|
-
import React
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import { View } from 'react-native';
|
|
3
|
-
import type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';
|
|
4
|
-
import { useTheme } from '../styles';
|
|
5
|
-
import type { FalsyReactElement } from '../utils';
|
|
6
|
-
import { cloneElementSafely } from '../utils';
|
|
7
3
|
import RadioContextProvider from './RadioContextProvider';
|
|
8
4
|
import type RadioGroupProps from './RadioGroupProps';
|
|
9
5
|
|
|
10
|
-
type RadioItemStyles = NamedStylesStringUnion<'root'>;
|
|
11
|
-
|
|
12
|
-
const useStyles: UseStyles<RadioItemStyles> = function (): RadioItemStyles {
|
|
13
|
-
const theme = useTheme();
|
|
14
|
-
|
|
15
|
-
return {
|
|
16
|
-
root: {
|
|
17
|
-
borderBottomColor: theme.palette.border.weak,
|
|
18
|
-
borderBottomWidth: 0.5,
|
|
19
|
-
paddingVertical: theme.spacing(3.5),
|
|
20
|
-
},
|
|
21
|
-
};
|
|
22
|
-
};
|
|
23
|
-
|
|
24
6
|
export default function RadioGroup(props: RadioGroupProps) {
|
|
25
7
|
const {
|
|
26
8
|
children,
|
|
@@ -29,18 +11,10 @@ export default function RadioGroup(props: RadioGroupProps) {
|
|
|
29
11
|
...otherProps
|
|
30
12
|
} = props;
|
|
31
13
|
|
|
32
|
-
const styles = useStyles();
|
|
33
|
-
|
|
34
|
-
const radios = Children.map(children, (child) => (
|
|
35
|
-
<View style={styles.root}>
|
|
36
|
-
{cloneElementSafely(child as FalsyReactElement)}
|
|
37
|
-
</View>
|
|
38
|
-
));
|
|
39
|
-
|
|
40
14
|
return (
|
|
41
15
|
<RadioContextProvider value={{ value, onChange }}>
|
|
42
16
|
<View {...otherProps}>
|
|
43
|
-
{
|
|
17
|
+
{children}
|
|
44
18
|
</View>
|
|
45
19
|
</RadioContextProvider>
|
|
46
20
|
);
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = FullDialogCloseButton;
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
|
-
var _reactNative = require("react-native");
|
|
11
|
-
|
|
12
|
-
var _styles = require("../styles");
|
|
13
|
-
|
|
14
|
-
var _IconButton = _interopRequireDefault(require("../IconButton"));
|
|
15
|
-
|
|
16
|
-
var _internal = require("../internal");
|
|
17
|
-
|
|
18
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
|
-
|
|
20
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
21
|
-
|
|
22
|
-
const useStyles = function () {
|
|
23
|
-
const theme = (0, _styles.useTheme)();
|
|
24
|
-
return {
|
|
25
|
-
root: {
|
|
26
|
-
paddingBottom: 40,
|
|
27
|
-
paddingTop: 16
|
|
28
|
-
},
|
|
29
|
-
button: {
|
|
30
|
-
alignSelf: 'center',
|
|
31
|
-
backgroundColor: theme.palette.fill.baseAlt,
|
|
32
|
-
borderRadius: theme.shape.radius.full,
|
|
33
|
-
height: 48,
|
|
34
|
-
width: 48
|
|
35
|
-
}
|
|
36
|
-
};
|
|
37
|
-
};
|
|
38
|
-
|
|
39
|
-
function FullDialogCloseButton(props) {
|
|
40
|
-
const {
|
|
41
|
-
onPress,
|
|
42
|
-
style: styleProp,
|
|
43
|
-
...otherProps
|
|
44
|
-
} = props;
|
|
45
|
-
const styles = useStyles();
|
|
46
|
-
const rootStyle = (0, _styles.css)([styles.root, styleProp]);
|
|
47
|
-
return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({
|
|
48
|
-
style: rootStyle
|
|
49
|
-
}, otherProps), /*#__PURE__*/_react.default.createElement(_IconButton.default, {
|
|
50
|
-
iconSize: 'large',
|
|
51
|
-
onPress: onPress,
|
|
52
|
-
style: styles.button
|
|
53
|
-
}, /*#__PURE__*/_react.default.createElement(_internal.Close, null)));
|
|
54
|
-
}
|
|
55
|
-
//# sourceMappingURL=FullDialogCloseButton.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["useStyles","theme","useTheme","root","paddingBottom","paddingTop","button","alignSelf","backgroundColor","palette","fill","baseAlt","borderRadius","shape","radius","full","height","width","FullDialogCloseButton","props","onPress","style","styleProp","otherProps","styles","rootStyle","css"],"sources":["FullDialogCloseButton.tsx"],"sourcesContent":["import React from 'react';\nimport type { ViewProps } from 'react-native';\nimport { View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport type { IconButtonProps } from '../IconButton';\nimport { css, useTheme } from '../styles';\nimport type { OverridableComponentProps } from '../types';\nimport IconButton from '../IconButton';\nimport { Close } from '../internal';\n\ntype TabsStyles = NamedStylesStringUnion<'root' | 'button'>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {\n paddingBottom: 40,\n paddingTop: 16,\n },\n button: {\n alignSelf: 'center',\n backgroundColor: theme.palette.fill.baseAlt,\n borderRadius: theme.shape.radius.full,\n height: 48,\n width: 48,\n },\n };\n};\n\ninterface FullDialogCloseButtonProps extends OverridableComponentProps<ViewProps, {\n onPress: IconButtonProps['onPress'];\n}> {}\n\nexport default function FullDialogCloseButton(props: FullDialogCloseButtonProps) {\n const {\n onPress,\n style: styleProp,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const rootStyle = css([\n styles.root,\n styleProp,\n ]);\n\n return (\n <View\n style={rootStyle}\n {...otherProps}\n >\n <IconButton\n iconSize={'large'}\n onPress={onPress}\n style={styles.button}\n >\n <Close/>\n </IconButton>\n </View>\n );\n}\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAGA;;AAEA;;AACA;;;;;;AAIA,MAAMA,SAAgC,GAAG,YAAwB;EAC7D,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,aAAa,EAAE,EADb;MAEFC,UAAU,EAAE;IAFV,CADH;IAKHC,MAAM,EAAE;MACJC,SAAS,EAAE,QADP;MAEJC,eAAe,EAAEP,KAAK,CAACQ,OAAN,CAAcC,IAAd,CAAmBC,OAFhC;MAGJC,YAAY,EAAEX,KAAK,CAACY,KAAN,CAAYC,MAAZ,CAAmBC,IAH7B;MAIJC,MAAM,EAAE,EAJJ;MAKJC,KAAK,EAAE;IALH;EALL,CAAP;AAaH,CAhBD;;AAsBe,SAASC,qBAAT,CAA+BC,KAA/B,EAAkE;EAC7E,MAAM;IACFC,OADE;IAEFC,KAAK,EAAEC,SAFL;IAGF,GAAGC;EAHD,IAIFJ,KAJJ;EAMA,MAAMK,MAAM,GAAGxB,SAAS,EAAxB;EAEA,MAAMyB,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAACrB,IADW,EAElBmB,SAFkB,CAAJ,CAAlB;EAKA,oBACI,6BAAC,iBAAD;IACI,KAAK,EAAEG;EADX,GAEQF,UAFR,gBAII,6BAAC,mBAAD;IACI,QAAQ,EAAE,OADd;IAEI,OAAO,EAAEH,OAFb;IAGI,KAAK,EAAEI,MAAM,CAAClB;EAHlB,gBAKI,6BAAC,eAAD,OALJ,CAJJ,CADJ;AAcH"}
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { View } from 'react-native';
|
|
5
|
-
import { css, useTheme } from '../styles';
|
|
6
|
-
import IconButton from '../IconButton';
|
|
7
|
-
import { Close } from '../internal';
|
|
8
|
-
|
|
9
|
-
const useStyles = function () {
|
|
10
|
-
const theme = useTheme();
|
|
11
|
-
return {
|
|
12
|
-
root: {
|
|
13
|
-
paddingBottom: 40,
|
|
14
|
-
paddingTop: 16
|
|
15
|
-
},
|
|
16
|
-
button: {
|
|
17
|
-
alignSelf: 'center',
|
|
18
|
-
backgroundColor: theme.palette.fill.baseAlt,
|
|
19
|
-
borderRadius: theme.shape.radius.full,
|
|
20
|
-
height: 48,
|
|
21
|
-
width: 48
|
|
22
|
-
}
|
|
23
|
-
};
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
export default function FullDialogCloseButton(props) {
|
|
27
|
-
const {
|
|
28
|
-
onPress,
|
|
29
|
-
style: styleProp,
|
|
30
|
-
...otherProps
|
|
31
|
-
} = props;
|
|
32
|
-
const styles = useStyles();
|
|
33
|
-
const rootStyle = css([styles.root, styleProp]);
|
|
34
|
-
return /*#__PURE__*/React.createElement(View, _extends({
|
|
35
|
-
style: rootStyle
|
|
36
|
-
}, otherProps), /*#__PURE__*/React.createElement(IconButton, {
|
|
37
|
-
iconSize: 'large',
|
|
38
|
-
onPress: onPress,
|
|
39
|
-
style: styles.button
|
|
40
|
-
}, /*#__PURE__*/React.createElement(Close, null)));
|
|
41
|
-
}
|
|
42
|
-
//# sourceMappingURL=FullDialogCloseButton.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["React","View","css","useTheme","IconButton","Close","useStyles","theme","root","paddingBottom","paddingTop","button","alignSelf","backgroundColor","palette","fill","baseAlt","borderRadius","shape","radius","full","height","width","FullDialogCloseButton","props","onPress","style","styleProp","otherProps","styles","rootStyle"],"sources":["FullDialogCloseButton.tsx"],"sourcesContent":["import React from 'react';\nimport type { ViewProps } from 'react-native';\nimport { View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport type { IconButtonProps } from '../IconButton';\nimport { css, useTheme } from '../styles';\nimport type { OverridableComponentProps } from '../types';\nimport IconButton from '../IconButton';\nimport { Close } from '../internal';\n\ntype TabsStyles = NamedStylesStringUnion<'root' | 'button'>;\n\nconst useStyles: UseStyles<TabsStyles> = function (): TabsStyles {\n const theme = useTheme();\n\n return {\n root: {\n paddingBottom: 40,\n paddingTop: 16,\n },\n button: {\n alignSelf: 'center',\n backgroundColor: theme.palette.fill.baseAlt,\n borderRadius: theme.shape.radius.full,\n height: 48,\n width: 48,\n },\n };\n};\n\ninterface FullDialogCloseButtonProps extends OverridableComponentProps<ViewProps, {\n onPress: IconButtonProps['onPress'];\n}> {}\n\nexport default function FullDialogCloseButton(props: FullDialogCloseButtonProps) {\n const {\n onPress,\n style: styleProp,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const rootStyle = css([\n styles.root,\n styleProp,\n ]);\n\n return (\n <View\n style={rootStyle}\n {...otherProps}\n >\n <IconButton\n iconSize={'large'}\n onPress={onPress}\n style={styles.button}\n >\n <Close/>\n </IconButton>\n </View>\n );\n}\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAASC,IAAT,QAAqB,cAArB;AAGA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AAEA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,KAAT,QAAsB,aAAtB;;AAIA,MAAMC,SAAgC,GAAG,YAAwB;EAC7D,MAAMC,KAAK,GAAGJ,QAAQ,EAAtB;EAEA,OAAO;IACHK,IAAI,EAAE;MACFC,aAAa,EAAE,EADb;MAEFC,UAAU,EAAE;IAFV,CADH;IAKHC,MAAM,EAAE;MACJC,SAAS,EAAE,QADP;MAEJC,eAAe,EAAEN,KAAK,CAACO,OAAN,CAAcC,IAAd,CAAmBC,OAFhC;MAGJC,YAAY,EAAEV,KAAK,CAACW,KAAN,CAAYC,MAAZ,CAAmBC,IAH7B;MAIJC,MAAM,EAAE,EAJJ;MAKJC,KAAK,EAAE;IALH;EALL,CAAP;AAaH,CAhBD;;AAsBA,eAAe,SAASC,qBAAT,CAA+BC,KAA/B,EAAkE;EAC7E,MAAM;IACFC,OADE;IAEFC,KAAK,EAAEC,SAFL;IAGF,GAAGC;EAHD,IAIFJ,KAJJ;EAMA,MAAMK,MAAM,GAAGvB,SAAS,EAAxB;EAEA,MAAMwB,SAAS,GAAG5B,GAAG,CAAC,CAClB2B,MAAM,CAACrB,IADW,EAElBmB,SAFkB,CAAD,CAArB;EAKA,oBACI,oBAAC,IAAD;IACI,KAAK,EAAEG;EADX,GAEQF,UAFR,gBAII,oBAAC,UAAD;IACI,QAAQ,EAAE,OADd;IAEI,OAAO,EAAEH,OAFb;IAGI,KAAK,EAAEI,MAAM,CAAClB;EAHlB,gBAKI,oBAAC,KAAD,OALJ,CAJJ,CADJ;AAcH"}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import type { ViewProps } from 'react-native';
|
|
3
|
-
import type { IconButtonProps } from '../IconButton';
|
|
4
|
-
import type { OverridableComponentProps } from '../types';
|
|
5
|
-
interface FullDialogCloseButtonProps extends OverridableComponentProps<ViewProps, {
|
|
6
|
-
onPress: IconButtonProps['onPress'];
|
|
7
|
-
}> {
|
|
8
|
-
}
|
|
9
|
-
export default function FullDialogCloseButton(props: FullDialogCloseButtonProps): JSX.Element;
|
|
10
|
-
export {};
|
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { ViewProps } from 'react-native';
|
|
3
|
-
import { View } from 'react-native';
|
|
4
|
-
import type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';
|
|
5
|
-
import type { IconButtonProps } from '../IconButton';
|
|
6
|
-
import { css, useTheme } from '../styles';
|
|
7
|
-
import type { OverridableComponentProps } from '../types';
|
|
8
|
-
import IconButton from '../IconButton';
|
|
9
|
-
import { Close } from '../internal';
|
|
10
|
-
|
|
11
|
-
type TabsStyles = NamedStylesStringUnion<'root' | 'button'>;
|
|
12
|
-
|
|
13
|
-
const useStyles: UseStyles<TabsStyles> = function (): TabsStyles {
|
|
14
|
-
const theme = useTheme();
|
|
15
|
-
|
|
16
|
-
return {
|
|
17
|
-
root: {
|
|
18
|
-
paddingBottom: 40,
|
|
19
|
-
paddingTop: 16,
|
|
20
|
-
},
|
|
21
|
-
button: {
|
|
22
|
-
alignSelf: 'center',
|
|
23
|
-
backgroundColor: theme.palette.fill.baseAlt,
|
|
24
|
-
borderRadius: theme.shape.radius.full,
|
|
25
|
-
height: 48,
|
|
26
|
-
width: 48,
|
|
27
|
-
},
|
|
28
|
-
};
|
|
29
|
-
};
|
|
30
|
-
|
|
31
|
-
interface FullDialogCloseButtonProps extends OverridableComponentProps<ViewProps, {
|
|
32
|
-
onPress: IconButtonProps['onPress'];
|
|
33
|
-
}> {}
|
|
34
|
-
|
|
35
|
-
export default function FullDialogCloseButton(props: FullDialogCloseButtonProps) {
|
|
36
|
-
const {
|
|
37
|
-
onPress,
|
|
38
|
-
style: styleProp,
|
|
39
|
-
...otherProps
|
|
40
|
-
} = props;
|
|
41
|
-
|
|
42
|
-
const styles = useStyles();
|
|
43
|
-
|
|
44
|
-
const rootStyle = css([
|
|
45
|
-
styles.root,
|
|
46
|
-
styleProp,
|
|
47
|
-
]);
|
|
48
|
-
|
|
49
|
-
return (
|
|
50
|
-
<View
|
|
51
|
-
style={rootStyle}
|
|
52
|
-
{...otherProps}
|
|
53
|
-
>
|
|
54
|
-
<IconButton
|
|
55
|
-
iconSize={'large'}
|
|
56
|
-
onPress={onPress}
|
|
57
|
-
style={styles.button}
|
|
58
|
-
>
|
|
59
|
-
<Close/>
|
|
60
|
-
</IconButton>
|
|
61
|
-
</View>
|
|
62
|
-
);
|
|
63
|
-
}
|