@fountain-ui/core 3.0.0-alpha.34 → 3.0.0-alpha.35
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/Modal/Modal.js +1 -1
- package/build/commonjs/Modal/Modal.js.map +1 -1
- package/build/commonjs/TextField/TextField.js +2 -1
- package/build/commonjs/TextField/TextField.js.map +1 -1
- package/build/module/Modal/Modal.js +1 -1
- package/build/module/Modal/Modal.js.map +1 -1
- package/build/module/TextField/TextField.js +2 -1
- package/build/module/TextField/TextField.js.map +1 -1
- package/package.json +2 -2
- package/src/Modal/Modal.tsx +1 -1
- package/src/TextField/TextField.tsx +1 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["createModalCloseEvent","reason","metadata","Modal","props","animationStyle","backdropOpacity","children","closeAnimation","disableAnimation","hideBackdrop","initialOpacity","initialTranslateY","onClose","onEnter","onEnterProp","onEntered","onEnteredProp","onExit","onExitProp","onExited","onExitedProp","openAnimation","offsetAnimation","style","visible","otherProps","handleBackdropPress","exited","setExited","React","useState","elevationStyle","useElevationStyle","css","StyleSheet","absoluteFill"],"sources":["Modal.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { css, StyleSheet } from '../styles';\nimport { useElevationStyle } from '../hooks';\nimport type ModalProps from './ModalProps';\nimport AnimatedContainer from './AnimatedContainer';\nimport SimpleBackdrop from './SimpleBackdrop';\n\nexport type ModalCloseReasonType = 'OUTSIDE_PRESS' | 'HARDWARE_BACK_PRESS' | 'CLOSE_BUTTON_PRESS' | 'UNKNOWN';\n\nexport interface ModalCloseEvent {\n metadata: {\n reason: ModalCloseReasonType\n };\n}\n\nexport const createModalCloseEvent = (reason: ModalCloseReasonType) => ({\n metadata: {\n reason,\n },\n});\n\nexport default function Modal(props: ModalProps) {\n const {\n animationStyle,\n backdropOpacity = 0.
|
|
1
|
+
{"version":3,"names":["createModalCloseEvent","reason","metadata","Modal","props","animationStyle","backdropOpacity","children","closeAnimation","disableAnimation","hideBackdrop","initialOpacity","initialTranslateY","onClose","onEnter","onEnterProp","onEntered","onEnteredProp","onExit","onExitProp","onExited","onExitedProp","openAnimation","offsetAnimation","style","visible","otherProps","handleBackdropPress","exited","setExited","React","useState","elevationStyle","useElevationStyle","css","StyleSheet","absoluteFill"],"sources":["Modal.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { css, StyleSheet } from '../styles';\nimport { useElevationStyle } from '../hooks';\nimport type ModalProps from './ModalProps';\nimport AnimatedContainer from './AnimatedContainer';\nimport SimpleBackdrop from './SimpleBackdrop';\n\nexport type ModalCloseReasonType = 'OUTSIDE_PRESS' | 'HARDWARE_BACK_PRESS' | 'CLOSE_BUTTON_PRESS' | 'UNKNOWN';\n\nexport interface ModalCloseEvent {\n metadata: {\n reason: ModalCloseReasonType\n };\n}\n\nexport const createModalCloseEvent = (reason: ModalCloseReasonType) => ({\n metadata: {\n reason,\n },\n});\n\nexport default function Modal(props: ModalProps) {\n const {\n animationStyle,\n backdropOpacity = 0.75,\n children,\n closeAnimation,\n disableAnimation = false,\n hideBackdrop = false,\n initialOpacity,\n initialTranslateY,\n onClose,\n onEnter: onEnterProp,\n onEntered: onEnteredProp,\n onExit: onExitProp,\n onExited: onExitedProp,\n openAnimation,\n offsetAnimation,\n style,\n visible,\n ...otherProps\n } = props;\n\n const handleBackdropPress = () => {\n if (onClose) {\n onClose(createModalCloseEvent('OUTSIDE_PRESS'));\n }\n };\n\n const [exited, setExited] = React.useState(true);\n\n const elevationStyle = useElevationStyle(6);\n\n const onEnter = () => {\n setExited(false);\n onEnterProp?.();\n };\n\n const onEntered = () => {\n onEnteredProp?.();\n };\n\n const onExit = () => {\n onExitProp?.();\n };\n\n const onExited = () => {\n setExited(true);\n onExitedProp?.();\n };\n\n if (!visible) {\n if (disableAnimation || exited) {\n return null;\n }\n }\n\n return (\n <View\n style={css([\n StyleSheet.absoluteFill,\n elevationStyle,\n style,\n ])}\n {...otherProps}\n >\n {(!hideBackdrop && visible) ? (\n <SimpleBackdrop\n onPress={handleBackdropPress}\n opacity={backdropOpacity}\n />\n ) : null}\n\n {!disableAnimation ? (\n <AnimatedContainer\n children={children}\n closeAnimation={closeAnimation}\n initialOpacity={initialOpacity}\n initialTranslateY={initialTranslateY}\n onEnter={onEnter}\n onEntered={onEntered}\n onExit={onExit}\n onExited={onExited}\n openAnimation={openAnimation}\n offsetAnimation={offsetAnimation}\n style={animationStyle}\n visible={visible}\n />\n ) : children}\n </View>\n );\n};\n"],"mappings":";;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;;;AAUO,MAAMA,qBAAqB,GAAIC,MAAD,KAAmC;EACpEC,QAAQ,EAAE;IACND;EADM;AAD0D,CAAnC,CAA9B;;;;AAMQ,SAASE,KAAT,CAAeC,KAAf,EAAkC;EAC7C,MAAM;IACFC,cADE;IAEFC,eAAe,GAAG,IAFhB;IAGFC,QAHE;IAIFC,cAJE;IAKFC,gBAAgB,GAAG,KALjB;IAMFC,YAAY,GAAG,KANb;IAOFC,cAPE;IAQFC,iBARE;IASFC,OATE;IAUFC,OAAO,EAAEC,WAVP;IAWFC,SAAS,EAAEC,aAXT;IAYFC,MAAM,EAAEC,UAZN;IAaFC,QAAQ,EAAEC,YAbR;IAcFC,aAdE;IAeFC,eAfE;IAgBFC,KAhBE;IAiBFC,OAjBE;IAkBF,GAAGC;EAlBD,IAmBFtB,KAnBJ;;EAqBA,MAAMuB,mBAAmB,GAAG,MAAM;IAC9B,IAAId,OAAJ,EAAa;MACTA,OAAO,CAACb,qBAAqB,CAAC,eAAD,CAAtB,CAAP;IACH;EACJ,CAJD;;EAMA,MAAM,CAAC4B,MAAD,EAASC,SAAT,IAAsBC,cAAA,CAAMC,QAAN,CAAe,IAAf,CAA5B;;EAEA,MAAMC,cAAc,GAAG,IAAAC,wBAAA,EAAkB,CAAlB,CAAvB;;EAEA,MAAMnB,OAAO,GAAG,MAAM;IAClBe,SAAS,CAAC,KAAD,CAAT;IACAd,WAAW,SAAX,IAAAA,WAAW,WAAX,YAAAA,WAAW;EACd,CAHD;;EAKA,MAAMC,SAAS,GAAG,MAAM;IACpBC,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa;EAChB,CAFD;;EAIA,MAAMC,MAAM,GAAG,MAAM;IACjBC,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU;EACb,CAFD;;EAIA,MAAMC,QAAQ,GAAG,MAAM;IACnBS,SAAS,CAAC,IAAD,CAAT;IACAR,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY;EACf,CAHD;;EAKA,IAAI,CAACI,OAAL,EAAc;IACV,IAAIhB,gBAAgB,IAAImB,MAAxB,EAAgC;MAC5B,OAAO,IAAP;IACH;EACJ;;EAED,oBACI,6BAAC,iBAAD;IACI,KAAK,EAAE,IAAAM,WAAA,EAAI,CACPC,kBAAA,CAAWC,YADJ,EAEPJ,cAFO,EAGPR,KAHO,CAAJ;EADX,GAMQE,UANR,GAQM,CAAChB,YAAD,IAAiBe,OAAlB,gBACG,6BAAC,uBAAD;IACI,OAAO,EAAEE,mBADb;IAEI,OAAO,EAAErB;EAFb,EADH,GAKG,IAbR,EAeK,CAACG,gBAAD,gBACG,6BAAC,0BAAD;IACI,QAAQ,EAAEF,QADd;IAEI,cAAc,EAAEC,cAFpB;IAGI,cAAc,EAAEG,cAHpB;IAII,iBAAiB,EAAEC,iBAJvB;IAKI,OAAO,EAAEE,OALb;IAMI,SAAS,EAAEE,SANf;IAOI,MAAM,EAAEE,MAPZ;IAQI,QAAQ,EAAEE,QARd;IASI,aAAa,EAAEE,aATnB;IAUI,eAAe,EAAEC,eAVrB;IAWI,KAAK,EAAElB,cAXX;IAYI,OAAO,EAAEoB;EAZb,EADH,GAeGlB,QA9BR,CADJ;AAkCH;;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["styles","StyleSheet","create","root","alignItems","flexGrow","input","inputWrapper","placeholderWrapper","absoluteFillObject","justifyContent","secureToggleButton","padding","position","right","searchIconContainer","left","loadingSinner","height","width","clearButton","secureButtonContainer","TextField","React","forwardRef","props","ref","autoFocus","containerStyle","containerStyleProp","editable","hint","isLoading","onBlur","onChangeText","onChangeTextProp","onFocus","placeholder","placeholderProp","placeholderTextColor","placeholderTextColorProp","secureTextEntry","secureTextEntryProp","showClearButton","showClearButtonProp","status","style","styleProp","title","value","variant","otherProps","isSearch","disabled","theme","useTheme","isFocused","setIsFocused","useState","setSecureTextEntry","variantStyles","useVariantStyleMap","handleBlur","event","handleFocus","handleSecureTogglePress","current","handleChangeText","text","handleClear","titleFontStyle","createFontStyle","selector","typography","caption1","color","palette","strong","inputStyle","css","inputFontStyle","Platform","OS","outlineWidth","placeholderFontStyle","disabledLabel","opacity","length","hintStyle"],"sources":["TextField.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport type { NativeSyntheticEvent, TextInputFocusEventData } from 'react-native';\nimport { Platform, StyleSheet, Text, TextInput, View } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { css } from '@fountain-ui/styles';\nimport IconButton from '../IconButton/IconButton';\nimport { Clear, EyeOff, EyeOn, LoadingSpinner, Search } from '../internal/icons';\nimport Row from '../Row';\nimport { createFontStyle, useTheme } from '../styles';\nimport type TextFieldProps from './TextFieldProps';\nimport type { TextFieldStatus, TextFieldVariant } from './TextFieldProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\nconst styles = StyleSheet.create({\n root: {\n alignItems: 'center',\n flexGrow: 1,\n },\n input: {\n flexGrow: 1,\n },\n inputWrapper: {\n flexGrow: 1,\n },\n placeholderWrapper: {\n ...StyleSheet.absoluteFillObject,\n justifyContent: 'center',\n },\n secureToggleButton: {\n alignItems: 'flex-end',\n padding: 0,\n position: 'absolute',\n right: 0,\n },\n searchIconContainer: {\n left: 12,\n position: 'absolute',\n },\n loadingSinner: {\n height: 19,\n width: 19,\n },\n clearButton: {\n height: 36,\n position: 'absolute',\n right: 2,\n width: 32,\n },\n secureButtonContainer: {\n justifyContent: 'center',\n width: 32,\n },\n});\n\nconst TextField = React.forwardRef<TextInput, TextFieldProps>(function TextField(props, ref) {\n const {\n autoFocus,\n containerStyle: containerStyleProp,\n editable = true,\n hint,\n isLoading,\n onBlur,\n onChangeText: onChangeTextProp,\n onFocus,\n placeholder: placeholderProp,\n placeholderTextColor: placeholderTextColorProp,\n secureTextEntry: secureTextEntryProp,\n showClearButton: showClearButtonProp,\n status = 'default' as TextFieldStatus,\n style: styleProp,\n title,\n value,\n variant = 'default' as TextFieldVariant,\n ...otherProps\n } = props;\n\n const isSearch = variant === 'search';\n\n const disabled = !editable || isLoading;\n\n const theme = useTheme();\n\n const [isFocused, setIsFocused] = useState<boolean>(autoFocus ?? false);\n const [secureTextEntry, setSecureTextEntry] = useState<boolean>(secureTextEntryProp ?? false);\n\n const variantStyles = useVariantStyleMap(variant, status, isFocused);\n\n const handleBlur = (event: NativeSyntheticEvent<TextInputFocusEventData>) => {\n setIsFocused(false);\n onBlur?.(event);\n };\n\n const handleFocus = (event: NativeSyntheticEvent<TextInputFocusEventData>) => {\n setIsFocused(true);\n onFocus?.(event);\n };\n\n const handleSecureTogglePress = () => {\n setSecureTextEntry((current) => !current);\n };\n\n const handleChangeText = (text: string) => {\n onChangeTextProp?.(text);\n };\n\n const handleClear = () => {\n handleChangeText('');\n };\n\n const showClearButton = showClearButtonProp ?? isSearch;\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (typography) => typography.caption1['semiBold'],\n color: theme.palette.text.strong,\n });\n\n const inputStyle = css([\n styles.input,\n variantStyles.inputStyle,\n variantStyles.inputFontStyle,\n Platform.OS === 'web' ? { outlineWidth: 0 } as FountainUiStyle : {},\n styleProp,\n ]);\n\n const placeholderFontStyle = css([\n variantStyles.inputFontStyle,\n { color: placeholderTextColorProp ?? theme.palette.status.disabledLabel },\n ]);\n\n const containerStyle = css([\n styles.root,\n variantStyles.containerStyle,\n { opacity: disabled ? 0.3 : 1 },\n containerStyleProp,\n ]);\n\n return (\n <View>\n {title && !isSearch ? (\n <Text\n children={title}\n style={titleFontStyle}\n />\n ) : null}\n\n <Row style={containerStyle}>\n <React.Fragment>\n {isSearch ? (\n <View style={styles.searchIconContainer}>\n {isLoading ? (\n <LoadingSpinner style={styles.loadingSinner}/>\n ) : (\n <Search\n color={'base'}\n height={19}\n width={19}\n />\n )}\n </View>\n ) : null}\n\n <View style={styles.inputWrapper}>\n <View\n pointerEvents={'none'}\n style={styles.placeholderWrapper}\n >\n {placeholderProp && !value ? (\n <Text\n children={placeholderProp}\n numberOfLines={1}\n style={placeholderFontStyle}\n />\n ) : null}\n </View>\n\n <TextInput\n autoFocus={autoFocus}\n editable={!disabled}\n onBlur={handleBlur}\n onChangeText={handleChangeText}\n onFocus={handleFocus}\n ref={ref}\n secureTextEntry={secureTextEntry}\n style={inputStyle}\n value={value}\n {...otherProps}\n />\n </View>\n </React.Fragment>\n\n {showClearButton && value?.length && value.length > 0 ? (\n <IconButton\n color={'base'}\n children={\n <Clear\n height={17.31}\n width={15.9}\n />\n }\n onPress={handleClear}\n style={styles.clearButton}\n />\n ) : null}\n\n {secureTextEntryProp && !isSearch ? (\n <View style={styles.secureButtonContainer}>\n <IconButton\n color={'base'}\n onPress={handleSecureTogglePress}\n style={styles.secureToggleButton}\n >\n {secureTextEntry ? (\n <EyeOff\n height={19}\n width={17.42}\n />\n ) : (\n <EyeOn\n height={19}\n width={17.42}\n />\n )}\n </IconButton>\n </View>\n ) : null}\n </Row>\n\n {hint && !isSearch ? (\n <Text\n children={hint}\n style={variantStyles.hintStyle}\n />\n ) : null}\n </View>\n );\n});\n\nexport default TextField;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["styles","StyleSheet","create","root","alignItems","flexGrow","input","inputWrapper","flexShrink","placeholderWrapper","absoluteFillObject","justifyContent","secureToggleButton","padding","position","right","searchIconContainer","left","loadingSinner","height","width","clearButton","secureButtonContainer","TextField","React","forwardRef","props","ref","autoFocus","containerStyle","containerStyleProp","editable","hint","isLoading","onBlur","onChangeText","onChangeTextProp","onFocus","placeholder","placeholderProp","placeholderTextColor","placeholderTextColorProp","secureTextEntry","secureTextEntryProp","showClearButton","showClearButtonProp","status","style","styleProp","title","value","variant","otherProps","isSearch","disabled","theme","useTheme","isFocused","setIsFocused","useState","setSecureTextEntry","variantStyles","useVariantStyleMap","handleBlur","event","handleFocus","handleSecureTogglePress","current","handleChangeText","text","handleClear","titleFontStyle","createFontStyle","selector","typography","caption1","color","palette","strong","inputStyle","css","inputFontStyle","Platform","OS","outlineWidth","placeholderFontStyle","disabledLabel","opacity","length","hintStyle"],"sources":["TextField.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport type { NativeSyntheticEvent, TextInputFocusEventData } from 'react-native';\nimport { Platform, StyleSheet, Text, TextInput, View } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { css } from '@fountain-ui/styles';\nimport IconButton from '../IconButton/IconButton';\nimport { Clear, EyeOff, EyeOn, LoadingSpinner, Search } from '../internal/icons';\nimport Row from '../Row';\nimport { createFontStyle, useTheme } from '../styles';\nimport type TextFieldProps from './TextFieldProps';\nimport type { TextFieldStatus, TextFieldVariant } from './TextFieldProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\nconst styles = StyleSheet.create({\n root: {\n alignItems: 'center',\n flexGrow: 1,\n },\n input: {\n flexGrow: 1,\n },\n inputWrapper: {\n flexGrow: 1,\n flexShrink: 1,\n },\n placeholderWrapper: {\n ...StyleSheet.absoluteFillObject,\n justifyContent: 'center',\n },\n secureToggleButton: {\n alignItems: 'flex-end',\n padding: 0,\n position: 'absolute',\n right: 0,\n },\n searchIconContainer: {\n left: 12,\n position: 'absolute',\n },\n loadingSinner: {\n height: 19,\n width: 19,\n },\n clearButton: {\n height: 36,\n position: 'absolute',\n right: 2,\n width: 32,\n },\n secureButtonContainer: {\n justifyContent: 'center',\n width: 32,\n },\n});\n\nconst TextField = React.forwardRef<TextInput, TextFieldProps>(function TextField(props, ref) {\n const {\n autoFocus,\n containerStyle: containerStyleProp,\n editable = true,\n hint,\n isLoading,\n onBlur,\n onChangeText: onChangeTextProp,\n onFocus,\n placeholder: placeholderProp,\n placeholderTextColor: placeholderTextColorProp,\n secureTextEntry: secureTextEntryProp,\n showClearButton: showClearButtonProp,\n status = 'default' as TextFieldStatus,\n style: styleProp,\n title,\n value,\n variant = 'default' as TextFieldVariant,\n ...otherProps\n } = props;\n\n const isSearch = variant === 'search';\n\n const disabled = !editable || isLoading;\n\n const theme = useTheme();\n\n const [isFocused, setIsFocused] = useState<boolean>(autoFocus ?? false);\n const [secureTextEntry, setSecureTextEntry] = useState<boolean>(secureTextEntryProp ?? false);\n\n const variantStyles = useVariantStyleMap(variant, status, isFocused);\n\n const handleBlur = (event: NativeSyntheticEvent<TextInputFocusEventData>) => {\n setIsFocused(false);\n onBlur?.(event);\n };\n\n const handleFocus = (event: NativeSyntheticEvent<TextInputFocusEventData>) => {\n setIsFocused(true);\n onFocus?.(event);\n };\n\n const handleSecureTogglePress = () => {\n setSecureTextEntry((current) => !current);\n };\n\n const handleChangeText = (text: string) => {\n onChangeTextProp?.(text);\n };\n\n const handleClear = () => {\n handleChangeText('');\n };\n\n const showClearButton = showClearButtonProp ?? isSearch;\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (typography) => typography.caption1['semiBold'],\n color: theme.palette.text.strong,\n });\n\n const inputStyle = css([\n styles.input,\n variantStyles.inputStyle,\n variantStyles.inputFontStyle,\n Platform.OS === 'web' ? { outlineWidth: 0 } as FountainUiStyle : {},\n styleProp,\n ]);\n\n const placeholderFontStyle = css([\n variantStyles.inputFontStyle,\n { color: placeholderTextColorProp ?? theme.palette.status.disabledLabel },\n ]);\n\n const containerStyle = css([\n styles.root,\n variantStyles.containerStyle,\n { opacity: disabled ? 0.3 : 1 },\n containerStyleProp,\n ]);\n\n return (\n <View>\n {title && !isSearch ? (\n <Text\n children={title}\n style={titleFontStyle}\n />\n ) : null}\n\n <Row style={containerStyle}>\n <React.Fragment>\n {isSearch ? (\n <View style={styles.searchIconContainer}>\n {isLoading ? (\n <LoadingSpinner style={styles.loadingSinner}/>\n ) : (\n <Search\n color={'base'}\n height={19}\n width={19}\n />\n )}\n </View>\n ) : null}\n\n <View style={styles.inputWrapper}>\n <View\n pointerEvents={'none'}\n style={styles.placeholderWrapper}\n >\n {placeholderProp && !value ? (\n <Text\n children={placeholderProp}\n numberOfLines={1}\n style={placeholderFontStyle}\n />\n ) : null}\n </View>\n\n <TextInput\n autoFocus={autoFocus}\n editable={!disabled}\n onBlur={handleBlur}\n onChangeText={handleChangeText}\n onFocus={handleFocus}\n ref={ref}\n secureTextEntry={secureTextEntry}\n style={inputStyle}\n value={value}\n {...otherProps}\n />\n </View>\n </React.Fragment>\n\n {showClearButton && value?.length && value.length > 0 ? (\n <IconButton\n color={'base'}\n children={\n <Clear\n height={17.31}\n width={15.9}\n />\n }\n onPress={handleClear}\n style={styles.clearButton}\n />\n ) : null}\n\n {secureTextEntryProp && !isSearch ? (\n <View style={styles.secureButtonContainer}>\n <IconButton\n color={'base'}\n onPress={handleSecureTogglePress}\n style={styles.secureToggleButton}\n >\n {secureTextEntry ? (\n <EyeOff\n height={19}\n width={17.42}\n />\n ) : (\n <EyeOn\n height={19}\n width={17.42}\n />\n )}\n </IconButton>\n </View>\n ) : null}\n </Row>\n\n {hint && !isSearch ? (\n <Text\n children={hint}\n style={variantStyles.hintStyle}\n />\n ) : null}\n </View>\n );\n});\n\nexport default TextField;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","View","css","StyleSheet","useElevationStyle","AnimatedContainer","SimpleBackdrop","createModalCloseEvent","reason","metadata","Modal","props","animationStyle","backdropOpacity","children","closeAnimation","disableAnimation","hideBackdrop","initialOpacity","initialTranslateY","onClose","onEnter","onEnterProp","onEntered","onEnteredProp","onExit","onExitProp","onExited","onExitedProp","openAnimation","offsetAnimation","style","visible","otherProps","handleBackdropPress","exited","setExited","useState","elevationStyle","absoluteFill"],"sources":["Modal.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { css, StyleSheet } from '../styles';\nimport { useElevationStyle } from '../hooks';\nimport type ModalProps from './ModalProps';\nimport AnimatedContainer from './AnimatedContainer';\nimport SimpleBackdrop from './SimpleBackdrop';\n\nexport type ModalCloseReasonType = 'OUTSIDE_PRESS' | 'HARDWARE_BACK_PRESS' | 'CLOSE_BUTTON_PRESS' | 'UNKNOWN';\n\nexport interface ModalCloseEvent {\n metadata: {\n reason: ModalCloseReasonType\n };\n}\n\nexport const createModalCloseEvent = (reason: ModalCloseReasonType) => ({\n metadata: {\n reason,\n },\n});\n\nexport default function Modal(props: ModalProps) {\n const {\n animationStyle,\n backdropOpacity = 0.
|
|
1
|
+
{"version":3,"names":["React","View","css","StyleSheet","useElevationStyle","AnimatedContainer","SimpleBackdrop","createModalCloseEvent","reason","metadata","Modal","props","animationStyle","backdropOpacity","children","closeAnimation","disableAnimation","hideBackdrop","initialOpacity","initialTranslateY","onClose","onEnter","onEnterProp","onEntered","onEnteredProp","onExit","onExitProp","onExited","onExitedProp","openAnimation","offsetAnimation","style","visible","otherProps","handleBackdropPress","exited","setExited","useState","elevationStyle","absoluteFill"],"sources":["Modal.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { css, StyleSheet } from '../styles';\nimport { useElevationStyle } from '../hooks';\nimport type ModalProps from './ModalProps';\nimport AnimatedContainer from './AnimatedContainer';\nimport SimpleBackdrop from './SimpleBackdrop';\n\nexport type ModalCloseReasonType = 'OUTSIDE_PRESS' | 'HARDWARE_BACK_PRESS' | 'CLOSE_BUTTON_PRESS' | 'UNKNOWN';\n\nexport interface ModalCloseEvent {\n metadata: {\n reason: ModalCloseReasonType\n };\n}\n\nexport const createModalCloseEvent = (reason: ModalCloseReasonType) => ({\n metadata: {\n reason,\n },\n});\n\nexport default function Modal(props: ModalProps) {\n const {\n animationStyle,\n backdropOpacity = 0.75,\n children,\n closeAnimation,\n disableAnimation = false,\n hideBackdrop = false,\n initialOpacity,\n initialTranslateY,\n onClose,\n onEnter: onEnterProp,\n onEntered: onEnteredProp,\n onExit: onExitProp,\n onExited: onExitedProp,\n openAnimation,\n offsetAnimation,\n style,\n visible,\n ...otherProps\n } = props;\n\n const handleBackdropPress = () => {\n if (onClose) {\n onClose(createModalCloseEvent('OUTSIDE_PRESS'));\n }\n };\n\n const [exited, setExited] = React.useState(true);\n\n const elevationStyle = useElevationStyle(6);\n\n const onEnter = () => {\n setExited(false);\n onEnterProp?.();\n };\n\n const onEntered = () => {\n onEnteredProp?.();\n };\n\n const onExit = () => {\n onExitProp?.();\n };\n\n const onExited = () => {\n setExited(true);\n onExitedProp?.();\n };\n\n if (!visible) {\n if (disableAnimation || exited) {\n return null;\n }\n }\n\n return (\n <View\n style={css([\n StyleSheet.absoluteFill,\n elevationStyle,\n style,\n ])}\n {...otherProps}\n >\n {(!hideBackdrop && visible) ? (\n <SimpleBackdrop\n onPress={handleBackdropPress}\n opacity={backdropOpacity}\n />\n ) : null}\n\n {!disableAnimation ? (\n <AnimatedContainer\n children={children}\n closeAnimation={closeAnimation}\n initialOpacity={initialOpacity}\n initialTranslateY={initialTranslateY}\n onEnter={onEnter}\n onEntered={onEntered}\n onExit={onExit}\n onExited={onExited}\n openAnimation={openAnimation}\n offsetAnimation={offsetAnimation}\n style={animationStyle}\n visible={visible}\n />\n ) : children}\n </View>\n );\n};\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AACA,SAASC,GAAT,EAAcC,UAAd,QAAgC,WAAhC;AACA,SAASC,iBAAT,QAAkC,UAAlC;AAEA,OAAOC,iBAAP,MAA8B,qBAA9B;AACA,OAAOC,cAAP,MAA2B,kBAA3B;AAUA,OAAO,MAAMC,qBAAqB,GAAIC,MAAD,KAAmC;EACpEC,QAAQ,EAAE;IACND;EADM;AAD0D,CAAnC,CAA9B;AAMP,eAAe,SAASE,KAAT,CAAeC,KAAf,EAAkC;EAC7C,MAAM;IACFC,cADE;IAEFC,eAAe,GAAG,IAFhB;IAGFC,QAHE;IAIFC,cAJE;IAKFC,gBAAgB,GAAG,KALjB;IAMFC,YAAY,GAAG,KANb;IAOFC,cAPE;IAQFC,iBARE;IASFC,OATE;IAUFC,OAAO,EAAEC,WAVP;IAWFC,SAAS,EAAEC,aAXT;IAYFC,MAAM,EAAEC,UAZN;IAaFC,QAAQ,EAAEC,YAbR;IAcFC,aAdE;IAeFC,eAfE;IAgBFC,KAhBE;IAiBFC,OAjBE;IAkBF,GAAGC;EAlBD,IAmBFtB,KAnBJ;;EAqBA,MAAMuB,mBAAmB,GAAG,MAAM;IAC9B,IAAId,OAAJ,EAAa;MACTA,OAAO,CAACb,qBAAqB,CAAC,eAAD,CAAtB,CAAP;IACH;EACJ,CAJD;;EAMA,MAAM,CAAC4B,MAAD,EAASC,SAAT,IAAsBpC,KAAK,CAACqC,QAAN,CAAe,IAAf,CAA5B;EAEA,MAAMC,cAAc,GAAGlC,iBAAiB,CAAC,CAAD,CAAxC;;EAEA,MAAMiB,OAAO,GAAG,MAAM;IAClBe,SAAS,CAAC,KAAD,CAAT;IACAd,WAAW,SAAX,IAAAA,WAAW,WAAX,YAAAA,WAAW;EACd,CAHD;;EAKA,MAAMC,SAAS,GAAG,MAAM;IACpBC,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa;EAChB,CAFD;;EAIA,MAAMC,MAAM,GAAG,MAAM;IACjBC,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU;EACb,CAFD;;EAIA,MAAMC,QAAQ,GAAG,MAAM;IACnBS,SAAS,CAAC,IAAD,CAAT;IACAR,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY;EACf,CAHD;;EAKA,IAAI,CAACI,OAAL,EAAc;IACV,IAAIhB,gBAAgB,IAAImB,MAAxB,EAAgC;MAC5B,OAAO,IAAP;IACH;EACJ;;EAED,oBACI,oBAAC,IAAD;IACI,KAAK,EAAEjC,GAAG,CAAC,CACPC,UAAU,CAACoC,YADJ,EAEPD,cAFO,EAGPP,KAHO,CAAD;EADd,GAMQE,UANR,GAQM,CAAChB,YAAD,IAAiBe,OAAlB,gBACG,oBAAC,cAAD;IACI,OAAO,EAAEE,mBADb;IAEI,OAAO,EAAErB;EAFb,EADH,GAKG,IAbR,EAeK,CAACG,gBAAD,gBACG,oBAAC,iBAAD;IACI,QAAQ,EAAEF,QADd;IAEI,cAAc,EAAEC,cAFpB;IAGI,cAAc,EAAEG,cAHpB;IAII,iBAAiB,EAAEC,iBAJvB;IAKI,OAAO,EAAEE,OALb;IAMI,SAAS,EAAEE,SANf;IAOI,MAAM,EAAEE,MAPZ;IAQI,QAAQ,EAAEE,QARd;IASI,aAAa,EAAEE,aATnB;IAUI,eAAe,EAAEC,eAVrB;IAWI,KAAK,EAAElB,cAXX;IAYI,OAAO,EAAEoB;EAZb,EADH,GAeGlB,QA9BR,CADJ;AAkCH;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useState","Platform","StyleSheet","Text","TextInput","View","css","IconButton","Clear","EyeOff","EyeOn","LoadingSpinner","Search","Row","createFontStyle","useTheme","useVariantStyleMap","styles","create","root","alignItems","flexGrow","input","inputWrapper","placeholderWrapper","absoluteFillObject","justifyContent","secureToggleButton","padding","position","right","searchIconContainer","left","loadingSinner","height","width","clearButton","secureButtonContainer","TextField","forwardRef","props","ref","autoFocus","containerStyle","containerStyleProp","editable","hint","isLoading","onBlur","onChangeText","onChangeTextProp","onFocus","placeholder","placeholderProp","placeholderTextColor","placeholderTextColorProp","secureTextEntry","secureTextEntryProp","showClearButton","showClearButtonProp","status","style","styleProp","title","value","variant","otherProps","isSearch","disabled","theme","isFocused","setIsFocused","setSecureTextEntry","variantStyles","handleBlur","event","handleFocus","handleSecureTogglePress","current","handleChangeText","text","handleClear","titleFontStyle","selector","typography","caption1","color","palette","strong","inputStyle","inputFontStyle","OS","outlineWidth","placeholderFontStyle","disabledLabel","opacity","length","hintStyle"],"sources":["TextField.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport type { NativeSyntheticEvent, TextInputFocusEventData } from 'react-native';\nimport { Platform, StyleSheet, Text, TextInput, View } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { css } from '@fountain-ui/styles';\nimport IconButton from '../IconButton/IconButton';\nimport { Clear, EyeOff, EyeOn, LoadingSpinner, Search } from '../internal/icons';\nimport Row from '../Row';\nimport { createFontStyle, useTheme } from '../styles';\nimport type TextFieldProps from './TextFieldProps';\nimport type { TextFieldStatus, TextFieldVariant } from './TextFieldProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\nconst styles = StyleSheet.create({\n root: {\n alignItems: 'center',\n flexGrow: 1,\n },\n input: {\n flexGrow: 1,\n },\n inputWrapper: {\n flexGrow: 1,\n },\n placeholderWrapper: {\n ...StyleSheet.absoluteFillObject,\n justifyContent: 'center',\n },\n secureToggleButton: {\n alignItems: 'flex-end',\n padding: 0,\n position: 'absolute',\n right: 0,\n },\n searchIconContainer: {\n left: 12,\n position: 'absolute',\n },\n loadingSinner: {\n height: 19,\n width: 19,\n },\n clearButton: {\n height: 36,\n position: 'absolute',\n right: 2,\n width: 32,\n },\n secureButtonContainer: {\n justifyContent: 'center',\n width: 32,\n },\n});\n\nconst TextField = React.forwardRef<TextInput, TextFieldProps>(function TextField(props, ref) {\n const {\n autoFocus,\n containerStyle: containerStyleProp,\n editable = true,\n hint,\n isLoading,\n onBlur,\n onChangeText: onChangeTextProp,\n onFocus,\n placeholder: placeholderProp,\n placeholderTextColor: placeholderTextColorProp,\n secureTextEntry: secureTextEntryProp,\n showClearButton: showClearButtonProp,\n status = 'default' as TextFieldStatus,\n style: styleProp,\n title,\n value,\n variant = 'default' as TextFieldVariant,\n ...otherProps\n } = props;\n\n const isSearch = variant === 'search';\n\n const disabled = !editable || isLoading;\n\n const theme = useTheme();\n\n const [isFocused, setIsFocused] = useState<boolean>(autoFocus ?? false);\n const [secureTextEntry, setSecureTextEntry] = useState<boolean>(secureTextEntryProp ?? false);\n\n const variantStyles = useVariantStyleMap(variant, status, isFocused);\n\n const handleBlur = (event: NativeSyntheticEvent<TextInputFocusEventData>) => {\n setIsFocused(false);\n onBlur?.(event);\n };\n\n const handleFocus = (event: NativeSyntheticEvent<TextInputFocusEventData>) => {\n setIsFocused(true);\n onFocus?.(event);\n };\n\n const handleSecureTogglePress = () => {\n setSecureTextEntry((current) => !current);\n };\n\n const handleChangeText = (text: string) => {\n onChangeTextProp?.(text);\n };\n\n const handleClear = () => {\n handleChangeText('');\n };\n\n const showClearButton = showClearButtonProp ?? isSearch;\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (typography) => typography.caption1['semiBold'],\n color: theme.palette.text.strong,\n });\n\n const inputStyle = css([\n styles.input,\n variantStyles.inputStyle,\n variantStyles.inputFontStyle,\n Platform.OS === 'web' ? { outlineWidth: 0 } as FountainUiStyle : {},\n styleProp,\n ]);\n\n const placeholderFontStyle = css([\n variantStyles.inputFontStyle,\n { color: placeholderTextColorProp ?? theme.palette.status.disabledLabel },\n ]);\n\n const containerStyle = css([\n styles.root,\n variantStyles.containerStyle,\n { opacity: disabled ? 0.3 : 1 },\n containerStyleProp,\n ]);\n\n return (\n <View>\n {title && !isSearch ? (\n <Text\n children={title}\n style={titleFontStyle}\n />\n ) : null}\n\n <Row style={containerStyle}>\n <React.Fragment>\n {isSearch ? (\n <View style={styles.searchIconContainer}>\n {isLoading ? (\n <LoadingSpinner style={styles.loadingSinner}/>\n ) : (\n <Search\n color={'base'}\n height={19}\n width={19}\n />\n )}\n </View>\n ) : null}\n\n <View style={styles.inputWrapper}>\n <View\n pointerEvents={'none'}\n style={styles.placeholderWrapper}\n >\n {placeholderProp && !value ? (\n <Text\n children={placeholderProp}\n numberOfLines={1}\n style={placeholderFontStyle}\n />\n ) : null}\n </View>\n\n <TextInput\n autoFocus={autoFocus}\n editable={!disabled}\n onBlur={handleBlur}\n onChangeText={handleChangeText}\n onFocus={handleFocus}\n ref={ref}\n secureTextEntry={secureTextEntry}\n style={inputStyle}\n value={value}\n {...otherProps}\n />\n </View>\n </React.Fragment>\n\n {showClearButton && value?.length && value.length > 0 ? (\n <IconButton\n color={'base'}\n children={\n <Clear\n height={17.31}\n width={15.9}\n />\n }\n onPress={handleClear}\n style={styles.clearButton}\n />\n ) : null}\n\n {secureTextEntryProp && !isSearch ? (\n <View style={styles.secureButtonContainer}>\n <IconButton\n color={'base'}\n onPress={handleSecureTogglePress}\n style={styles.secureToggleButton}\n >\n {secureTextEntry ? (\n <EyeOff\n height={19}\n width={17.42}\n />\n ) : (\n <EyeOn\n height={19}\n width={17.42}\n />\n )}\n </IconButton>\n </View>\n ) : null}\n </Row>\n\n {hint && !isSearch ? (\n <Text\n children={hint}\n style={variantStyles.hintStyle}\n />\n ) : null}\n </View>\n );\n});\n\nexport default TextField;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["React","useState","Platform","StyleSheet","Text","TextInput","View","css","IconButton","Clear","EyeOff","EyeOn","LoadingSpinner","Search","Row","createFontStyle","useTheme","useVariantStyleMap","styles","create","root","alignItems","flexGrow","input","inputWrapper","flexShrink","placeholderWrapper","absoluteFillObject","justifyContent","secureToggleButton","padding","position","right","searchIconContainer","left","loadingSinner","height","width","clearButton","secureButtonContainer","TextField","forwardRef","props","ref","autoFocus","containerStyle","containerStyleProp","editable","hint","isLoading","onBlur","onChangeText","onChangeTextProp","onFocus","placeholder","placeholderProp","placeholderTextColor","placeholderTextColorProp","secureTextEntry","secureTextEntryProp","showClearButton","showClearButtonProp","status","style","styleProp","title","value","variant","otherProps","isSearch","disabled","theme","isFocused","setIsFocused","setSecureTextEntry","variantStyles","handleBlur","event","handleFocus","handleSecureTogglePress","current","handleChangeText","text","handleClear","titleFontStyle","selector","typography","caption1","color","palette","strong","inputStyle","inputFontStyle","OS","outlineWidth","placeholderFontStyle","disabledLabel","opacity","length","hintStyle"],"sources":["TextField.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport type { NativeSyntheticEvent, TextInputFocusEventData } from 'react-native';\nimport { Platform, StyleSheet, Text, TextInput, View } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { css } from '@fountain-ui/styles';\nimport IconButton from '../IconButton/IconButton';\nimport { Clear, EyeOff, EyeOn, LoadingSpinner, Search } from '../internal/icons';\nimport Row from '../Row';\nimport { createFontStyle, useTheme } from '../styles';\nimport type TextFieldProps from './TextFieldProps';\nimport type { TextFieldStatus, TextFieldVariant } from './TextFieldProps';\nimport useVariantStyleMap from './useVariantStyleMap';\n\nconst styles = StyleSheet.create({\n root: {\n alignItems: 'center',\n flexGrow: 1,\n },\n input: {\n flexGrow: 1,\n },\n inputWrapper: {\n flexGrow: 1,\n flexShrink: 1,\n },\n placeholderWrapper: {\n ...StyleSheet.absoluteFillObject,\n justifyContent: 'center',\n },\n secureToggleButton: {\n alignItems: 'flex-end',\n padding: 0,\n position: 'absolute',\n right: 0,\n },\n searchIconContainer: {\n left: 12,\n position: 'absolute',\n },\n loadingSinner: {\n height: 19,\n width: 19,\n },\n clearButton: {\n height: 36,\n position: 'absolute',\n right: 2,\n width: 32,\n },\n secureButtonContainer: {\n justifyContent: 'center',\n width: 32,\n },\n});\n\nconst TextField = React.forwardRef<TextInput, TextFieldProps>(function TextField(props, ref) {\n const {\n autoFocus,\n containerStyle: containerStyleProp,\n editable = true,\n hint,\n isLoading,\n onBlur,\n onChangeText: onChangeTextProp,\n onFocus,\n placeholder: placeholderProp,\n placeholderTextColor: placeholderTextColorProp,\n secureTextEntry: secureTextEntryProp,\n showClearButton: showClearButtonProp,\n status = 'default' as TextFieldStatus,\n style: styleProp,\n title,\n value,\n variant = 'default' as TextFieldVariant,\n ...otherProps\n } = props;\n\n const isSearch = variant === 'search';\n\n const disabled = !editable || isLoading;\n\n const theme = useTheme();\n\n const [isFocused, setIsFocused] = useState<boolean>(autoFocus ?? false);\n const [secureTextEntry, setSecureTextEntry] = useState<boolean>(secureTextEntryProp ?? false);\n\n const variantStyles = useVariantStyleMap(variant, status, isFocused);\n\n const handleBlur = (event: NativeSyntheticEvent<TextInputFocusEventData>) => {\n setIsFocused(false);\n onBlur?.(event);\n };\n\n const handleFocus = (event: NativeSyntheticEvent<TextInputFocusEventData>) => {\n setIsFocused(true);\n onFocus?.(event);\n };\n\n const handleSecureTogglePress = () => {\n setSecureTextEntry((current) => !current);\n };\n\n const handleChangeText = (text: string) => {\n onChangeTextProp?.(text);\n };\n\n const handleClear = () => {\n handleChangeText('');\n };\n\n const showClearButton = showClearButtonProp ?? isSearch;\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (typography) => typography.caption1['semiBold'],\n color: theme.palette.text.strong,\n });\n\n const inputStyle = css([\n styles.input,\n variantStyles.inputStyle,\n variantStyles.inputFontStyle,\n Platform.OS === 'web' ? { outlineWidth: 0 } as FountainUiStyle : {},\n styleProp,\n ]);\n\n const placeholderFontStyle = css([\n variantStyles.inputFontStyle,\n { color: placeholderTextColorProp ?? theme.palette.status.disabledLabel },\n ]);\n\n const containerStyle = css([\n styles.root,\n variantStyles.containerStyle,\n { opacity: disabled ? 0.3 : 1 },\n containerStyleProp,\n ]);\n\n return (\n <View>\n {title && !isSearch ? (\n <Text\n children={title}\n style={titleFontStyle}\n />\n ) : null}\n\n <Row style={containerStyle}>\n <React.Fragment>\n {isSearch ? (\n <View style={styles.searchIconContainer}>\n {isLoading ? (\n <LoadingSpinner style={styles.loadingSinner}/>\n ) : (\n <Search\n color={'base'}\n height={19}\n width={19}\n />\n )}\n </View>\n ) : null}\n\n <View style={styles.inputWrapper}>\n <View\n pointerEvents={'none'}\n style={styles.placeholderWrapper}\n >\n {placeholderProp && !value ? (\n <Text\n children={placeholderProp}\n numberOfLines={1}\n style={placeholderFontStyle}\n />\n ) : null}\n </View>\n\n <TextInput\n autoFocus={autoFocus}\n editable={!disabled}\n onBlur={handleBlur}\n onChangeText={handleChangeText}\n onFocus={handleFocus}\n ref={ref}\n secureTextEntry={secureTextEntry}\n style={inputStyle}\n value={value}\n {...otherProps}\n />\n </View>\n </React.Fragment>\n\n {showClearButton && value?.length && value.length > 0 ? (\n <IconButton\n color={'base'}\n children={\n <Clear\n height={17.31}\n width={15.9}\n />\n }\n onPress={handleClear}\n style={styles.clearButton}\n />\n ) : null}\n\n {secureTextEntryProp && !isSearch ? (\n <View style={styles.secureButtonContainer}>\n <IconButton\n color={'base'}\n onPress={handleSecureTogglePress}\n style={styles.secureToggleButton}\n >\n {secureTextEntry ? (\n <EyeOff\n height={19}\n width={17.42}\n />\n ) : (\n <EyeOn\n height={19}\n width={17.42}\n />\n )}\n </IconButton>\n </View>\n ) : null}\n </Row>\n\n {hint && !isSearch ? (\n <Text\n children={hint}\n style={variantStyles.hintStyle}\n />\n ) : null}\n </View>\n );\n});\n\nexport default TextField;\n"],"mappings":"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"}
|
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.35",
|
|
4
4
|
"author": "Fountain-UI Team",
|
|
5
5
|
"description": "React components that implement Tappytoon's Fountain Design.",
|
|
6
6
|
"license": "MIT",
|
|
@@ -67,5 +67,5 @@
|
|
|
67
67
|
"publishConfig": {
|
|
68
68
|
"access": "public"
|
|
69
69
|
},
|
|
70
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "7fbf959cedc5772feab5c9f6ba8ad649a8b160f6"
|
|
71
71
|
}
|
package/src/Modal/Modal.tsx
CHANGED
|
@@ -23,7 +23,7 @@ export const createModalCloseEvent = (reason: ModalCloseReasonType) => ({
|
|
|
23
23
|
export default function Modal(props: ModalProps) {
|
|
24
24
|
const {
|
|
25
25
|
animationStyle,
|
|
26
|
-
backdropOpacity = 0.
|
|
26
|
+
backdropOpacity = 0.75,
|
|
27
27
|
children,
|
|
28
28
|
closeAnimation,
|
|
29
29
|
disableAnimation = false,
|