@fountain-ui/core 2.0.0-beta.98 → 3.0.0-alpha.10

package/build/commonjs/Chip/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyChip';\nexport type { default as ChipProps } from './LegacyChipProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './Chip';\nexport type { default as ChipProps } from './ChipProps';\nexport { chipSizes, chipStartElementVariants } from './ChipProps';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA"}

package/build/commonjs/Chip/useChipStyle.js

@@ -17,13 +17,11 @@ function useChipStyle(size, startElementVariant, isEndElement) {
 
     const fontStyleMap = {
       small: (0, _styles.createFontStyle)(theme, {
-        // TODO: select typography.
-        // selector: (typography) => typography.caption1.medium,
+        selector: typography => typography.caption1.medium,
         color: theme.palette.text.strong
       }),
       large: (0, _styles.createFontStyle)(theme, {
-        // TODO: select typography.
-        // selector: (typography) => typography.body2.medium,
+        selector: typography => typography.body2.medium,
         color: theme.palette.text.strong
       })
     };
@@ -44,9 +42,7 @@ function useChipStyle(size, startElementVariant, isEndElement) {
       backgroundColor: theme.palette.fill.weaker,
       borderRadius: theme.shape.radius.full,
       flexDirection: 'row',
-      height: 'fit-content',
-      overflow: 'hidden',
-      width: 'fit-content'
+      overflow: 'hidden'
     };
     const isLarge = size === 'large';
     const variantStyleMap = {

package/build/commonjs/Chip/useChipStyle.js.map

@@ -1 +1 @@
-{"version":3,"names":["useChipStyle","size","startElementVariant","isEndElement","theme","useTheme","useMemo","fontStyleMap","small","createFontStyle","color","palette","text","strong","large","endElementStyleMap","height","marginLeft","spacing","width","baseContainerStyle","alignItems","backgroundColor","fill","weaker","borderRadius","shape","radius","full","flexDirection","overflow","isLarge","variantStyleMap","avatar","container","paddingLeft","paddingRight","paddingVertical","startElement","marginRight","icon","justifyContent","image","default","paddingBottom","paddingHorizontal","paddingTop","endElement","label"],"sources":["useChipStyle.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { ChipSize, ChipStartElementVariant } from './ChipProps';\n\ninterface ChipStyle {\n    container: FountainUiStyle;\n    endElement?: FountainUiStyle;\n    label: TextStyle;\n    startElement?: FountainUiStyle;\n}\n\ntype VariantStyleMap = Record<ChipStartElementVariant, Partial<ChipStyle>>;\n\n// TODO: need to refactoring...\nexport default function useChipStyle(\n    size: ChipSize,\n    startElementVariant: ChipStartElementVariant,\n    isEndElement: boolean,\n): ChipStyle {\n    const theme = useTheme();\n\n    return useMemo<ChipStyle>(() => {\n        const fontStyleMap: Record<ChipSize, TextStyle> = {\n            small: createFontStyle(theme, {\n                // TODO: select typography.\n                // selector: (typography) => typography.caption1.medium,\n                color: theme.palette.text.strong,\n            }),\n            large: createFontStyle(theme, {\n                // TODO: select typography.\n                // selector: (typography) => typography.body2.medium,\n                color: theme.palette.text.strong,\n            }),\n        };\n\n        const endElementStyleMap: Record<ChipSize, FountainUiStyle> = {\n            small: {\n                height: 14,\n                marginLeft: theme.spacing(2),\n                width: 8.17,\n            },\n            large: {\n                height: 16,\n                marginLeft: theme.spacing(2.5),\n                width: 9,\n            },\n        };\n\n        const baseContainerStyle: FountainUiStyle = {\n            alignItems: 'center',\n            backgroundColor: theme.palette.fill.weaker,\n            borderRadius: theme.shape.radius.full,\n            flexDirection: 'row',\n            height: 'fit-content',\n            overflow: 'hidden',\n            width: 'fit-content',\n        };\n\n        const isLarge = size === 'large';\n\n        const variantStyleMap: VariantStyleMap = {\n            avatar: {\n                container: {\n                    paddingLeft: theme.spacing(isLarge ? 1.5 : 1.25),\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingVertical: theme.spacing(isLarge ? 1.25 : 1),\n                },\n                startElement: {\n                    borderRadius: theme.shape.radius.full,\n                    height: isLarge ? 24 : 22,\n                    marginRight: theme.spacing(isLarge ? 1.5 : 1.25),\n                    width: isLarge ? 24 : 22,\n                },\n            },\n            icon: {\n                container: {\n                    paddingLeft: theme.spacing(1.5),\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingVertical: theme.spacing(isLarge ? 1.5 : 1.25),\n                },\n                startElement: {\n                    alignItems: 'center',\n                    height: isLarge ? 22 : 20,\n                    justifyContent: 'center',\n                    marginRight: theme.spacing(isLarge ? 1 : 0.75),\n                    width: isLarge ? 22 : 20,\n                },\n            },\n            image: {\n                container: {\n                    alignItems: 'center',\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                },\n                startElement: {\n                    borderRadius: theme.shape.radius.full,\n                    height: isLarge ? 34 : 30,\n                    marginRight: theme.spacing(1.5),\n                    width: isLarge ? 45 : 40,\n                },\n            },\n            default: {\n                container: {\n                    paddingBottom: theme.spacing(1.75),\n                    paddingHorizontal: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingTop: theme.spacing(1.5),\n                },\n            },\n        };\n\n        return {\n            container: {\n                ...baseContainerStyle,\n                ...variantStyleMap[startElementVariant]?.container,\n                ...(isEndElement ? { paddingRight: theme.spacing(isLarge ? 2.5 : 2.25) } : {}),\n            },\n            endElement: endElementStyleMap[size],\n            label: fontStyleMap[size],\n            startElement: variantStyleMap[startElementVariant]?.startElement,\n        };\n    }, [theme, size, startElementVariant]);\n}\n"],"mappings":"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"}
+{"version":3,"names":["useChipStyle","size","startElementVariant","isEndElement","theme","useTheme","useMemo","fontStyleMap","small","createFontStyle","selector","typography","caption1","medium","color","palette","text","strong","large","body2","endElementStyleMap","height","marginLeft","spacing","width","baseContainerStyle","alignItems","backgroundColor","fill","weaker","borderRadius","shape","radius","full","flexDirection","overflow","isLarge","variantStyleMap","avatar","container","paddingLeft","paddingRight","paddingVertical","startElement","marginRight","icon","justifyContent","image","default","paddingBottom","paddingHorizontal","paddingTop","endElement","label"],"sources":["useChipStyle.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { ChipSize, ChipStartElementVariant } from './ChipProps';\n\ninterface ChipStyle {\n    container: FountainUiStyle;\n    endElement?: FountainUiStyle;\n    label: TextStyle;\n    startElement?: FountainUiStyle;\n}\n\ntype VariantStyleMap = Record<ChipStartElementVariant, Partial<ChipStyle>>;\n\n// TODO: need to refactoring...\nexport default function useChipStyle(\n    size: ChipSize,\n    startElementVariant: ChipStartElementVariant,\n    isEndElement: boolean,\n): ChipStyle {\n    const theme = useTheme();\n\n    return useMemo<ChipStyle>(() => {\n        const fontStyleMap: Record<ChipSize, TextStyle> = {\n            small: createFontStyle(theme, {\n                selector: (typography) => typography.caption1.medium,\n                color: theme.palette.text.strong,\n            }),\n            large: createFontStyle(theme, {\n                selector: (typography) => typography.body2.medium,\n                color: theme.palette.text.strong,\n            }),\n        };\n\n        const endElementStyleMap: Record<ChipSize, FountainUiStyle> = {\n            small: {\n                height: 14,\n                marginLeft: theme.spacing(2),\n                width: 8.17,\n            },\n            large: {\n                height: 16,\n                marginLeft: theme.spacing(2.5),\n                width: 9,\n            },\n        };\n\n        const baseContainerStyle: FountainUiStyle = {\n            alignItems: 'center',\n            backgroundColor: theme.palette.fill.weaker,\n            borderRadius: theme.shape.radius.full,\n            flexDirection: 'row',\n            overflow: 'hidden',\n        };\n\n        const isLarge = size === 'large';\n\n        const variantStyleMap: VariantStyleMap = {\n            avatar: {\n                container: {\n                    paddingLeft: theme.spacing(isLarge ? 1.5 : 1.25),\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingVertical: theme.spacing(isLarge ? 1.25 : 1),\n                },\n                startElement: {\n                    borderRadius: theme.shape.radius.full,\n                    height: isLarge ? 24 : 22,\n                    marginRight: theme.spacing(isLarge ? 1.5 : 1.25),\n                    width: isLarge ? 24 : 22,\n                },\n            },\n            icon: {\n                container: {\n                    paddingLeft: theme.spacing(1.5),\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingVertical: theme.spacing(isLarge ? 1.5 : 1.25),\n                },\n                startElement: {\n                    alignItems: 'center',\n                    height: isLarge ? 22 : 20,\n                    justifyContent: 'center',\n                    marginRight: theme.spacing(isLarge ? 1 : 0.75),\n                    width: isLarge ? 22 : 20,\n                },\n            },\n            image: {\n                container: {\n                    alignItems: 'center',\n                    paddingRight: theme.spacing(isLarge ? 3.5 : 3),\n                },\n                startElement: {\n                    borderRadius: theme.shape.radius.full,\n                    height: isLarge ? 34 : 30,\n                    marginRight: theme.spacing(1.5),\n                    width: isLarge ? 45 : 40,\n                },\n            },\n            default: {\n                container: {\n                    paddingBottom: theme.spacing(1.75),\n                    paddingHorizontal: theme.spacing(isLarge ? 3.5 : 3),\n                    paddingTop: theme.spacing(1.5),\n                },\n            },\n        };\n\n        return {\n            container: {\n                ...baseContainerStyle,\n                ...variantStyleMap[startElementVariant]?.container,\n                ...(isEndElement ? { paddingRight: theme.spacing(isLarge ? 2.5 : 2.25) } : {}),\n            },\n            endElement: endElementStyleMap[size],\n            label: fontStyleMap[size],\n            startElement: variantStyleMap[startElementVariant]?.startElement,\n        };\n    }, [theme, size, startElementVariant]);\n}\n"],"mappings":"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"}

package/build/commonjs/Dialog/Dialog.js

@@ -13,13 +13,11 @@ var _styles = require("@fountain-ui/styles");
 
 var _Column = _interopRequireDefault(require("../Column"));
 
-var _DialogMedia = _interopRequireDefault(require("../DialogMedia/DialogMedia"));
-
 var _Modal = _interopRequireWildcard(require("../Modal"));
 
-var _Paper = _interopRequireDefault(require("../Paper"));
+var _ShadowView = _interopRequireDefault(require("../ShadowView"));
 
-var _utils = require("../utils");
+var _DialogContext = require("./DialogContext");
 
 var _useDialogStyle = _interopRequireDefault(require("./useDialogStyle"));
 
@@ -118,18 +116,6 @@ function Dialog(props) {
   const initialOpacity = animationType === _Modal.ANIMATION_TYPE.SLIDE && fullScreen ? 1 : undefined;
   const initialTranslateY = animationType === _Modal.ANIMATION_TYPE.FADE ? 0 : undefined;
   const paperStyle = (0, _styles.css)([styles.paper, styleProp]);
-
-  const contents = _react.Children.map(children, child => {
-    // @ts-ignore
-    if (child.type === _DialogMedia.default) {
-      return (0, _utils.cloneElementSafely)(child, {
-        style: styles.mediaWrapper
-      });
-    }
-
-    return child;
-  });
-
   return /*#__PURE__*/_react.default.createElement(_Modal.default, _extends({
     animationStyle: styles.container,
     closeAnimation: closeAnimation,
@@ -141,16 +127,19 @@ function Dialog(props) {
     offsetAnimation: offsetAnimation,
     visible: visible,
     style: styles.root
-  }, otherProps), /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, topElement ? /*#__PURE__*/_react.default.createElement(_Column.default, {
+  }, otherProps), /*#__PURE__*/_react.default.createElement(_DialogContext.DialogProvider, {
+    value: {
+      size
+    }
+  }, topElement ? /*#__PURE__*/_react.default.createElement(_Column.default, {
     style: fullScreen ? undefined : styles.topElementContainer
   }, /*#__PURE__*/_react.default.createElement(_Column.default, {
     style: styles.topElementContent,
     onLayout: handleTopElementLayout
-  }, topElement)) : null, /*#__PURE__*/_react.default.createElement(_Paper.default, {
-    elevation: 6,
-    square: fullScreen,
+  }, topElement)) : null, /*#__PURE__*/_react.default.createElement(_ShadowView.default, {
+    variant: 600,
     style: paperStyle
-  }, contents)));
+  }, children)));
 }
 
 ;

package/build/commonjs/Dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"names":["TOP_ELEMENT_OFFSET","Dialog","props","animationType","ANIMATION_TYPE","SLIDE","children","fullScreen","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","contents","Children","map","child","DialogMedia","cloneElementSafely","mediaWrapper","container","root","topElementContainer","topElementContent"],"sources":["Dialog.tsx"],"sourcesContent":["import React, { Children, useMemo, useState } from 'react';\nimport { LayoutChangeEvent, useWindowDimensions } from 'react-native';\nimport { css } from '@fountain-ui/styles';\nimport Column from '../Column';\nimport DialogMedia from '../DialogMedia/DialogMedia';\nimport Modal, { ANIMATION_TYPE, AnimationUnit } from '../Modal';\nimport Paper from '../Paper';\nimport { cloneElementSafely, FalsyReactElement } from '../utils';\nimport type DialogProps from './DialogProps';\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        fullScreen = false,\n        hideBackdrop,\n        onClose,\n        style: styleProp,\n        size = 'medium',\n        visible,\n        topElement,\n        ...otherProps\n    } = props;\n\n    const styles = useDialogStyle(size, fullScreen);\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 && !fullScreen) {\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, fullScreen, 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 && !fullScreen) {\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, fullScreen]);\n\n    const initialOpacity = animationType === ANIMATION_TYPE.SLIDE && fullScreen ? 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    const contents = Children.map(children, (child) => {\n        // @ts-ignore\n        if (child.type === DialogMedia) {\n            return cloneElementSafely(child as FalsyReactElement, { style: styles.mediaWrapper });\n        }\n        return child;\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            <React.Fragment>\n                {topElement ? (\n                    <Column style={fullScreen ? undefined : styles.topElementContainer}>\n                        <Column\n                            style={styles.topElementContent}\n                            onLayout={handleTopElementLayout}\n                        >\n                            {topElement}\n                        </Column>\n                    </Column>\n                ) : null}\n\n                <Paper\n                    elevation={6}\n                    square={fullScreen}\n                    style={paperStyle}\n                >\n                    {contents}\n                </Paper>\n            </React.Fragment>\n        </Modal>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["TOP_ELEMENT_OFFSET","Dialog","props","animationType","ANIMATION_TYPE","SLIDE","children","fullScreen","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        fullScreen = false,\n        hideBackdrop,\n        onClose,\n        style: styleProp,\n        size = 'medium',\n        visible,\n        topElement,\n        ...otherProps\n    } = props;\n\n    const styles = useDialogStyle(size, fullScreen);\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 && !fullScreen) {\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, fullScreen, 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 && !fullScreen) {\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, fullScreen]);\n\n    const initialOpacity = animationType === ANIMATION_TYPE.SLIDE && fullScreen ? 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={fullScreen ? undefined : 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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"}

package/build/commonjs/Dialog/DialogContext.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useDialogContext = exports.DialogProvider = void 0;
+
+var _react = require("react");
+
+const DialogContext = /*#__PURE__*/(0, _react.createContext)({
+  size: 'medium'
+});
+const DialogProvider = DialogContext.Provider;
+exports.DialogProvider = DialogProvider;
+
+const useDialogContext = () => (0, _react.useContext)(DialogContext);
+
+exports.useDialogContext = useDialogContext;
+//# sourceMappingURL=DialogContext.js.map

package/build/commonjs/Dialog/DialogContext.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["DialogContext","createContext","size","DialogProvider","Provider","useDialogContext","useContext"],"sources":["DialogContext.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\nimport type { DialogSize } from './DialogProps';\n\nexport type Context = {\n    size: DialogSize;\n};\n\nconst DialogContext = createContext<Context>({\n    size: 'medium',\n});\n\nexport const DialogProvider = DialogContext.Provider;\n\nexport const useDialogContext = () => useContext(DialogContext);\n"],"mappings":";;;;;;;AAAA;;AAOA,MAAMA,aAAa,gBAAG,IAAAC,oBAAA,EAAuB;EACzCC,IAAI,EAAE;AADmC,CAAvB,CAAtB;AAIO,MAAMC,cAAc,GAAGH,aAAa,CAACI,QAArC;;;AAEA,MAAMC,gBAAgB,GAAG,MAAM,IAAAC,iBAAA,EAAWN,aAAX,CAA/B"}

package/build/commonjs/Dialog/index.js

@@ -3,14 +3,44 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "DialogProvider", {
+  enumerable: true,
+  get: function () {
+    return _DialogContext.DialogProvider;
+  }
+});
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function () {
-    return _LegacyDialog.default;
+    return _Dialog.default;
+  }
+});
+Object.defineProperty(exports, "dialogSizes", {
+  enumerable: true,
+  get: function () {
+    return _DialogProps.dialogSizes;
   }
 });
+Object.defineProperty(exports, "useDialogContext", {
+  enumerable: true,
+  get: function () {
+    return _DialogContext.useDialogContext;
+  }
+});
+Object.defineProperty(exports, "useDialogSectionStyle", {
+  enumerable: true,
+  get: function () {
+    return _useDialogSectionStyle.default;
+  }
+});
+
+var _Dialog = _interopRequireDefault(require("./Dialog"));
+
+var _DialogProps = require("./DialogProps");
+
+var _DialogContext = require("./DialogContext");
 
-var _LegacyDialog = _interopRequireDefault(require("./LegacyDialog"));
+var _useDialogSectionStyle = _interopRequireDefault(require("./useDialogSectionStyle"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 //# sourceMappingURL=index.js.map

package/build/commonjs/Dialog/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyDialog';\nexport type { default as DialogProps } from './LegacyDialogProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './Dialog';\nexport type { default as DialogProps } from './DialogProps';\nexport { dialogSizes } from './DialogProps';\nexport { DialogProvider, useDialogContext } from './DialogContext';\nexport { default as useDialogSectionStyle } from './useDialogSectionStyle';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA;;AACA;;AACA"}

package/build/commonjs/Dialog/useDialogSectionStyle.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useDialogSectionStyle;
+
+var _react = require("react");
+
+var _reactNative = require("react-native");
+
+var _styles = require("../styles");
+
+var _DialogContext = require("./DialogContext");
+
+function useDialogSectionStyle() {
+  const {
+    size
+  } = (0, _DialogContext.useDialogContext)();
+  const {
+    width: windowWidth
+  } = (0, _reactNative.useWindowDimensions)();
+  const theme = (0, _styles.useTheme)();
+  return (0, _react.useMemo)(() => {
+    const sizePaddingHorizontalMap = {
+      small: {
+        paddingHorizontal: theme.spacing(6)
+      },
+      medium: {
+        // TODO: need to refactor breakpoints.
+        paddingHorizontal: theme.spacing(windowWidth >= 448 ? 8 : 6)
+      },
+      large: {
+        paddingHorizontal: theme.spacing(8)
+      }
+    };
+    return sizePaddingHorizontalMap[size];
+  }, [size, theme, windowWidth]);
+}
+//# sourceMappingURL=useDialogSectionStyle.js.map

package/build/commonjs/Dialog/useDialogSectionStyle.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useDialogSectionStyle","size","useDialogContext","width","windowWidth","useWindowDimensions","theme","useTheme","useMemo","sizePaddingHorizontalMap","small","paddingHorizontal","spacing","medium","large"],"sources":["useDialogSectionStyle.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { useWindowDimensions } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport { useDialogContext } from './DialogContext';\nimport type { DialogSize } from './DialogProps';\n\nexport default function useDialogSectionStyle() {\n    const { size } = useDialogContext();\n\n    const { width: windowWidth } = useWindowDimensions();\n\n    const theme = useTheme();\n\n    return useMemo<FountainUiStyle>(() => {\n        const sizePaddingHorizontalMap: Record<DialogSize, FountainUiStyle> = {\n            small: {\n                paddingHorizontal: theme.spacing(6),\n            },\n            medium: {\n                // TODO: need to refactor breakpoints.\n                paddingHorizontal: theme.spacing(windowWidth >= 448 ? 8 : 6),\n            },\n            large: {\n                paddingHorizontal: theme.spacing(8),\n            },\n        };\n\n        return sizePaddingHorizontalMap[size];\n    }, [size, theme, windowWidth]);\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AAGe,SAASA,qBAAT,GAAiC;EAC5C,MAAM;IAAEC;EAAF,IAAW,IAAAC,+BAAA,GAAjB;EAEA,MAAM;IAAEC,KAAK,EAAEC;EAAT,IAAyB,IAAAC,gCAAA,GAA/B;EAEA,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO,IAAAC,cAAA,EAAyB,MAAM;IAClC,MAAMC,wBAA6D,GAAG;MAClEC,KAAK,EAAE;QACHC,iBAAiB,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;MADhB,CAD2D;MAIlEC,MAAM,EAAE;QACJ;QACAF,iBAAiB,EAAEL,KAAK,CAACM,OAAN,CAAcR,WAAW,IAAI,GAAf,GAAqB,CAArB,GAAyB,CAAvC;MAFf,CAJ0D;MAQlEU,KAAK,EAAE;QACHH,iBAAiB,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;MADhB;IAR2D,CAAtE;IAaA,OAAOH,wBAAwB,CAACR,IAAD,CAA/B;EACH,CAfM,EAeJ,CAACA,IAAD,EAAOK,KAAP,EAAcF,WAAd,CAfI,CAAP;AAgBH"}

package/build/commonjs/Dialog/useDialogStyle.js

@@ -18,29 +18,24 @@ function useDialogStyle(size, fullScreen) {
     width: windowWidth
   } = (0, _reactNative.useWindowDimensions)();
   return (0, _react.useMemo)(() => {
-    var _sizeStyleMap$size, _sizeStyleMap$size2;
+    var _sizeStyleMap$size;
 
     const sizeStyleMap = {
       small: {
-        maxWidth: 260,
-        paddingHorizontal: theme.spacing(6)
+        maxWidth: 260
       },
       medium: {
-        maxWidth: 400,
-        // TODO: need to refactor breakpoints.
-        paddingHorizontal: theme.spacing(windowWidth >= 448 ? 8 : 6)
+        maxWidth: 400
       },
       large: {
         maxWidth: 512,
         minHeight: 360,
-        paddingHorizontal: theme.spacing(8),
         width: 512
       }
     };
-    const marginVertical = theme.spacing(6);
-    const dialogMaxHeight = windowHeight - marginVertical * 2;
-    const paddingHorizontal = (_sizeStyleMap$size = sizeStyleMap[size]) === null || _sizeStyleMap$size === void 0 ? void 0 : _sizeStyleMap$size.paddingHorizontal;
-    const dialogMaxWidth = (_sizeStyleMap$size2 = sizeStyleMap[size]) === null || _sizeStyleMap$size2 === void 0 ? void 0 : _sizeStyleMap$size2.maxWidth;
+    const containerPaddingVertical = theme.spacing(6);
+    const dialogMaxHeight = windowHeight - containerPaddingVertical * 2;
+    const dialogMaxWidth = (_sizeStyleMap$size = sizeStyleMap[size]) === null || _sizeStyleMap$size === void 0 ? void 0 : _sizeStyleMap$size.maxWidth;
     return {
       root: {
         alignItems: 'center',
@@ -51,13 +46,19 @@ function useDialogStyle(size, fullScreen) {
         height: '100%',
         width: '100%'
       } : {
+        alignItems: 'center',
         // TODO: need to refactor breakpoints.
-        marginHorizontal: theme.spacing(windowWidth > 320 ? 6 : 4)
+        paddingHorizontal: theme.spacing(windowWidth > 320 ? 6 : 4),
+        paddingVertical: containerPaddingVertical,
+        width: '100%'
       },
       paper: fullScreen ? {
-        flexGrow: 1
+        backgroundColor: theme.palette.surface.base,
+        height: '100%',
+        width: '100%'
       } : {
-        marginVertical,
+        backgroundColor: theme.palette.surface.base,
+        borderRadius: theme.shape.radius.xl,
         maxHeight: dialogMaxHeight,
         overflow: 'hidden',
         width: '100%',
@@ -69,11 +70,8 @@ function useDialogStyle(size, fullScreen) {
       },
       topElementContent: {
         position: 'absolute',
-        bottom: -1 * theme.spacing(4),
+        bottom: 0,
         width: '100%'
-      },
-      mediaWrapper: {
-        marginHorizontal: theme.spacing(4) - (paddingHorizontal ?? 0)
       }
     };
   }, [theme, windowHeight, windowWidth, size, fullScreen]);

package/build/commonjs/Dialog/useDialogStyle.js.map

@@ -1 +1 @@
-{"version":3,"names":["useDialogStyle","size","fullScreen","theme","useTheme","height","windowHeight","width","windowWidth","useWindowDimensions","useMemo","sizeStyleMap","small","maxWidth","paddingHorizontal","spacing","medium","large","minHeight","marginVertical","dialogMaxHeight","dialogMaxWidth","root","alignItems","justifyContent","zIndex","dialog","container","marginHorizontal","paper","flexGrow","maxHeight","overflow","topElementContainer","topElementContent","position","bottom","mediaWrapper"],"sources":["useDialogStyle.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { useWindowDimensions } from 'react-native';\nimport type { FountainUiStyle, NamedStylesStringUnion } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport type { DialogSize } from './DialogProps';\n\ntype SizeStyleMap = FountainUiStyle & {\n    maxWidth: number;\n    paddingHorizontal: number;\n}\n\ntype DialogStyleKeys =\n    | 'root'\n    | 'container'\n    | 'paper'\n    | 'topElementContainer'\n    | 'topElementContent'\n    | 'mediaWrapper';\n\ntype DialogStyles = NamedStylesStringUnion<DialogStyleKeys>;\n\nexport default function useDialogStyle(size: DialogSize, fullScreen: boolean): DialogStyles {\n    const theme = useTheme();\n\n    const {\n        height: windowHeight,\n        width: windowWidth,\n    } = useWindowDimensions();\n\n    return useMemo(() => {\n        const sizeStyleMap: Record<DialogSize, SizeStyleMap> = {\n            small: {\n                maxWidth: 260,\n                paddingHorizontal: theme.spacing(6),\n            },\n            medium: {\n                maxWidth: 400,\n                // TODO: need to refactor breakpoints.\n                paddingHorizontal: theme.spacing(windowWidth >= 448 ? 8 : 6),\n            },\n            large: {\n                maxWidth: 512,\n                minHeight: 360,\n                paddingHorizontal: theme.spacing(8),\n                width: 512,\n            },\n        };\n\n        const marginVertical = theme.spacing(6);\n        const dialogMaxHeight = windowHeight - marginVertical * 2;\n        const paddingHorizontal = sizeStyleMap[size]?.paddingHorizontal;\n        const dialogMaxWidth = sizeStyleMap[size]?.maxWidth;\n\n        return {\n            root: {\n                alignItems: 'center',\n                justifyContent: 'center',\n                zIndex: theme.zIndex.dialog,\n            },\n            container: fullScreen ? {\n                height: '100%',\n                width: '100%',\n            } : {\n                // TODO: need to refactor breakpoints.\n                marginHorizontal: theme.spacing(windowWidth > 320 ? 6 : 4),\n            },\n            paper: fullScreen ? {\n                flexGrow: 1,\n            } : {\n                marginVertical,\n                maxHeight: dialogMaxHeight,\n                overflow: 'hidden',\n                width: '100%',\n                ...sizeStyleMap[size],\n            },\n            topElementContainer: {\n                maxWidth: dialogMaxWidth,\n                width: '100%',\n            },\n            topElementContent: {\n                position: 'absolute',\n                bottom: -1 * theme.spacing(4),\n                width: '100%',\n            },\n            mediaWrapper: {\n                marginHorizontal: theme.spacing(4) - (paddingHorizontal ?? 0),\n            },\n        };\n    }, [theme, windowHeight, windowWidth, size, fullScreen]);\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAkBe,SAASA,cAAT,CAAwBC,IAAxB,EAA0CC,UAA1C,EAA6E;EACxF,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAM;IACFC,MAAM,EAAEC,YADN;IAEFC,KAAK,EAAEC;EAFL,IAGF,IAAAC,gCAAA,GAHJ;EAKA,OAAO,IAAAC,cAAA,EAAQ,MAAM;IAAA;;IACjB,MAAMC,YAA8C,GAAG;MACnDC,KAAK,EAAE;QACHC,QAAQ,EAAE,GADP;QAEHC,iBAAiB,EAAEX,KAAK,CAACY,OAAN,CAAc,CAAd;MAFhB,CAD4C;MAKnDC,MAAM,EAAE;QACJH,QAAQ,EAAE,GADN;QAEJ;QACAC,iBAAiB,EAAEX,KAAK,CAACY,OAAN,CAAcP,WAAW,IAAI,GAAf,GAAqB,CAArB,GAAyB,CAAvC;MAHf,CAL2C;MAUnDS,KAAK,EAAE;QACHJ,QAAQ,EAAE,GADP;QAEHK,SAAS,EAAE,GAFR;QAGHJ,iBAAiB,EAAEX,KAAK,CAACY,OAAN,CAAc,CAAd,CAHhB;QAIHR,KAAK,EAAE;MAJJ;IAV4C,CAAvD;IAkBA,MAAMY,cAAc,GAAGhB,KAAK,CAACY,OAAN,CAAc,CAAd,CAAvB;IACA,MAAMK,eAAe,GAAGd,YAAY,GAAGa,cAAc,GAAG,CAAxD;IACA,MAAML,iBAAiB,yBAAGH,YAAY,CAACV,IAAD,CAAf,uDAAG,mBAAoBa,iBAA9C;IACA,MAAMO,cAAc,0BAAGV,YAAY,CAACV,IAAD,CAAf,wDAAG,oBAAoBY,QAA3C;IAEA,OAAO;MACHS,IAAI,EAAE;QACFC,UAAU,EAAE,QADV;QAEFC,cAAc,EAAE,QAFd;QAGFC,MAAM,EAAEtB,KAAK,CAACsB,MAAN,CAAaC;MAHnB,CADH;MAMHC,SAAS,EAAEzB,UAAU,GAAG;QACpBG,MAAM,EAAE,MADY;QAEpBE,KAAK,EAAE;MAFa,CAAH,GAGjB;QACA;QACAqB,gBAAgB,EAAEzB,KAAK,CAACY,OAAN,CAAcP,WAAW,GAAG,GAAd,GAAoB,CAApB,GAAwB,CAAtC;MAFlB,CATD;MAaHqB,KAAK,EAAE3B,UAAU,GAAG;QAChB4B,QAAQ,EAAE;MADM,CAAH,GAEb;QACAX,cADA;QAEAY,SAAS,EAAEX,eAFX;QAGAY,QAAQ,EAAE,QAHV;QAIAzB,KAAK,EAAE,MAJP;QAKA,GAAGI,YAAY,CAACV,IAAD;MALf,CAfD;MAsBHgC,mBAAmB,EAAE;QACjBpB,QAAQ,EAAEQ,cADO;QAEjBd,KAAK,EAAE;MAFU,CAtBlB;MA0BH2B,iBAAiB,EAAE;QACfC,QAAQ,EAAE,UADK;QAEfC,MAAM,EAAE,CAAC,CAAD,GAAKjC,KAAK,CAACY,OAAN,CAAc,CAAd,CAFE;QAGfR,KAAK,EAAE;MAHQ,CA1BhB;MA+BH8B,YAAY,EAAE;QACVT,gBAAgB,EAAEzB,KAAK,CAACY,OAAN,CAAc,CAAd,KAAoBD,iBAAiB,IAAI,CAAzC;MADR;IA/BX,CAAP;EAmCH,CA3DM,EA2DJ,CAACX,KAAD,EAAQG,YAAR,EAAsBE,WAAtB,EAAmCP,IAAnC,EAAyCC,UAAzC,CA3DI,CAAP;AA4DH"}
+{"version":3,"names":["useDialogStyle","size","fullScreen","theme","useTheme","height","windowHeight","width","windowWidth","useWindowDimensions","useMemo","sizeStyleMap","small","maxWidth","medium","large","minHeight","containerPaddingVertical","spacing","dialogMaxHeight","dialogMaxWidth","root","alignItems","justifyContent","zIndex","dialog","container","paddingHorizontal","paddingVertical","paper","backgroundColor","palette","surface","base","borderRadius","shape","radius","xl","maxHeight","overflow","topElementContainer","topElementContent","position","bottom"],"sources":["useDialogStyle.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { useWindowDimensions } from 'react-native';\nimport type { FountainUiStyle, NamedStylesStringUnion } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport type { DialogSize } from './DialogProps';\n\ntype DialogStyleKeys =\n    | 'root'\n    | 'container'\n    | 'paper'\n    | 'topElementContainer'\n    | 'topElementContent';\n\ntype DialogStyles = NamedStylesStringUnion<DialogStyleKeys>;\n\nexport default function useDialogStyle(size: DialogSize, fullScreen: boolean): DialogStyles {\n    const theme = useTheme();\n\n    const {\n        height: windowHeight,\n        width: windowWidth,\n    } = useWindowDimensions();\n\n    return useMemo(() => {\n        const sizeStyleMap: Record<DialogSize, FountainUiStyle> = {\n            small: {\n                maxWidth: 260,\n            },\n            medium: {\n                maxWidth: 400,\n            },\n            large: {\n                maxWidth: 512,\n                minHeight: 360,\n                width: 512,\n            },\n        };\n\n        const containerPaddingVertical = theme.spacing(6);\n        const dialogMaxHeight = windowHeight - containerPaddingVertical * 2;\n        const dialogMaxWidth = sizeStyleMap[size]?.maxWidth;\n\n        return {\n            root: {\n                alignItems: 'center',\n                justifyContent: 'center',\n                zIndex: theme.zIndex.dialog,\n            },\n            container: fullScreen ? {\n                height: '100%',\n                width: '100%',\n            } : {\n                alignItems: 'center',\n                // TODO: need to refactor breakpoints.\n                paddingHorizontal: theme.spacing(windowWidth > 320 ? 6 : 4),\n                paddingVertical: containerPaddingVertical,\n                width: '100%',\n            },\n            paper: fullScreen ? {\n                backgroundColor: theme.palette.surface.base,\n                height: '100%',\n                width: '100%',\n            } : {\n                backgroundColor: theme.palette.surface.base,\n                borderRadius: theme.shape.radius.xl,\n                maxHeight: dialogMaxHeight,\n                overflow: 'hidden',\n                width: '100%',\n                ...sizeStyleMap[size],\n            },\n            topElementContainer: {\n                maxWidth: dialogMaxWidth,\n                width: '100%',\n            },\n            topElementContent: {\n                position: 'absolute',\n                bottom: 0,\n                width: '100%',\n            },\n        };\n    }, [theme, windowHeight, windowWidth, size, fullScreen]);\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAYe,SAASA,cAAT,CAAwBC,IAAxB,EAA0CC,UAA1C,EAA6E;EACxF,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAM;IACFC,MAAM,EAAEC,YADN;IAEFC,KAAK,EAAEC;EAFL,IAGF,IAAAC,gCAAA,GAHJ;EAKA,OAAO,IAAAC,cAAA,EAAQ,MAAM;IAAA;;IACjB,MAAMC,YAAiD,GAAG;MACtDC,KAAK,EAAE;QACHC,QAAQ,EAAE;MADP,CAD+C;MAItDC,MAAM,EAAE;QACJD,QAAQ,EAAE;MADN,CAJ8C;MAOtDE,KAAK,EAAE;QACHF,QAAQ,EAAE,GADP;QAEHG,SAAS,EAAE,GAFR;QAGHT,KAAK,EAAE;MAHJ;IAP+C,CAA1D;IAcA,MAAMU,wBAAwB,GAAGd,KAAK,CAACe,OAAN,CAAc,CAAd,CAAjC;IACA,MAAMC,eAAe,GAAGb,YAAY,GAAGW,wBAAwB,GAAG,CAAlE;IACA,MAAMG,cAAc,yBAAGT,YAAY,CAACV,IAAD,CAAf,uDAAG,mBAAoBY,QAA3C;IAEA,OAAO;MACHQ,IAAI,EAAE;QACFC,UAAU,EAAE,QADV;QAEFC,cAAc,EAAE,QAFd;QAGFC,MAAM,EAAErB,KAAK,CAACqB,MAAN,CAAaC;MAHnB,CADH;MAMHC,SAAS,EAAExB,UAAU,GAAG;QACpBG,MAAM,EAAE,MADY;QAEpBE,KAAK,EAAE;MAFa,CAAH,GAGjB;QACAe,UAAU,EAAE,QADZ;QAEA;QACAK,iBAAiB,EAAExB,KAAK,CAACe,OAAN,CAAcV,WAAW,GAAG,GAAd,GAAoB,CAApB,GAAwB,CAAtC,CAHnB;QAIAoB,eAAe,EAAEX,wBAJjB;QAKAV,KAAK,EAAE;MALP,CATD;MAgBHsB,KAAK,EAAE3B,UAAU,GAAG;QAChB4B,eAAe,EAAE3B,KAAK,CAAC4B,OAAN,CAAcC,OAAd,CAAsBC,IADvB;QAEhB5B,MAAM,EAAE,MAFQ;QAGhBE,KAAK,EAAE;MAHS,CAAH,GAIb;QACAuB,eAAe,EAAE3B,KAAK,CAAC4B,OAAN,CAAcC,OAAd,CAAsBC,IADvC;QAEAC,YAAY,EAAE/B,KAAK,CAACgC,KAAN,CAAYC,MAAZ,CAAmBC,EAFjC;QAGAC,SAAS,EAAEnB,eAHX;QAIAoB,QAAQ,EAAE,QAJV;QAKAhC,KAAK,EAAE,MALP;QAMA,GAAGI,YAAY,CAACV,IAAD;MANf,CApBD;MA4BHuC,mBAAmB,EAAE;QACjB3B,QAAQ,EAAEO,cADO;QAEjBb,KAAK,EAAE;MAFU,CA5BlB;MAgCHkC,iBAAiB,EAAE;QACfC,QAAQ,EAAE,UADK;QAEfC,MAAM,EAAE,CAFO;QAGfpC,KAAK,EAAE;MAHQ;IAhChB,CAAP;EAsCH,CAzDM,EAyDJ,CAACJ,KAAD,EAAQG,YAAR,EAAsBE,WAAtB,EAAmCP,IAAnC,EAAyCC,UAAzC,CAzDI,CAAP;AA0DH"}

package/build/commonjs/DialogActions/DialogActions.js

@@ -9,20 +9,35 @@ var _react = _interopRequireDefault(require("react"));
 
 var _Column = _interopRequireDefault(require("../Column"));
 
+var _Dialog = require("../Dialog");
+
 var _styles = require("../styles");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 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); }
 
+const useStyles = function () {
+  const theme = (0, _styles.useTheme)();
+  return {
+    root: {
+      paddingTop: theme.spacing(2),
+      paddingBottom: theme.spacing(4)
+    }
+  };
+};
+
 function DialogActions(props) {
   const {
     children,
+    style: styleProp,
     ...otherProps
   } = props;
+  const styles = useStyles();
+  const sectionStyle = (0, _Dialog.useDialogSectionStyle)();
+  const rootStyle = (0, _styles.css)([styles.root, sectionStyle, styleProp]);
   return /*#__PURE__*/_react.default.createElement(_Column.default, _extends({
-    alignItems: 'center',
-    insets: _styles.EdgeInsets.fromLTRB(0, 2, 0, 4)
+    style: rootStyle
   }, otherProps), children);
 }
 

package/build/commonjs/DialogActions/DialogActions.js.map

@@ -1 +1 @@
-{"version":3,"names":["DialogActions","props","children","otherProps","EdgeInsets","fromLTRB"],"sources":["DialogActions.tsx"],"sourcesContent":["import React from 'react';\nimport Column from '../Column';\nimport { EdgeInsets } from '../styles';\nimport type DialogActionsProps from './DialogActionsProps';\n\nexport default function DialogActions(props: DialogActionsProps) {\n    const {\n        children,\n        ...otherProps\n    } = props;\n\n    return (\n        <Column\n            alignItems={'center'}\n            insets={EdgeInsets.fromLTRB(0, 2, 0, 4)}\n            {...otherProps}\n        >\n            {children}\n        </Column>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;;;AAGe,SAASA,aAAT,CAAuBC,KAAvB,EAAkD;EAC7D,MAAM;IACFC,QADE;IAEF,GAAGC;EAFD,IAGFF,KAHJ;EAKA,oBACI,6BAAC,eAAD;IACI,UAAU,EAAE,QADhB;IAEI,MAAM,EAAEG,kBAAA,CAAWC,QAAX,CAAoB,CAApB,EAAuB,CAAvB,EAA0B,CAA1B,EAA6B,CAA7B;EAFZ,GAGQF,UAHR,GAKKD,QALL,CADJ;AASH;;AAAA"}
+{"version":3,"names":["useStyles","theme","useTheme","root","paddingTop","spacing","paddingBottom","DialogActions","props","children","style","styleProp","otherProps","styles","sectionStyle","useDialogSectionStyle","rootStyle","css"],"sources":["DialogActions.tsx"],"sourcesContent":["import React from 'react';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport Column from '../Column';\nimport { useDialogSectionStyle } from '../Dialog';\nimport { css, useTheme } from '../styles';\nimport type DialogActionsProps from './DialogActionsProps';\n\ntype DialogActionsStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<DialogActionsStyles> = function (): DialogActionsStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            paddingTop: theme.spacing(2),\n            paddingBottom: theme.spacing(4),\n        },\n    };\n};\n\nexport default function DialogActions(props: DialogActionsProps) {\n    const {\n        children,\n        style: styleProp,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const sectionStyle = useDialogSectionStyle();\n\n    const rootStyle = css([\n        styles.root,\n        sectionStyle,\n        styleProp,\n    ]);\n\n    return (\n        <Column\n            style={rootStyle}\n            {...otherProps}\n        >\n            {children}\n        </Column>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;AACA;;;;;;AAKA,MAAMA,SAAyC,GAAG,YAAiC;EAC/E,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAEH,KAAK,CAACI,OAAN,CAAc,CAAd,CADV;MAEFC,aAAa,EAAEL,KAAK,CAACI,OAAN,CAAc,CAAd;IAFb;EADH,CAAP;AAMH,CATD;;AAWe,SAASE,aAAT,CAAuBC,KAAvB,EAAkD;EAC7D,MAAM;IACFC,QADE;IAEFC,KAAK,EAAEC,SAFL;IAGF,GAAGC;EAHD,IAIFJ,KAJJ;EAMA,MAAMK,MAAM,GAAGb,SAAS,EAAxB;EAEA,MAAMc,YAAY,GAAG,IAAAC,6BAAA,GAArB;EAEA,MAAMC,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBJ,MAAM,CAACV,IADW,EAElBW,YAFkB,EAGlBH,SAHkB,CAAJ,CAAlB;EAMA,oBACI,6BAAC,eAAD;IACI,KAAK,EAAEK;EADX,GAEQJ,UAFR,GAIKH,QAJL,CADJ;AAQH;;AAAA"}

package/build/commonjs/DialogActions/index.js

@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function () {
-    return _LegacyDialogActions.default;
+    return _DialogActions.default;
   }
 });
 
-var _LegacyDialogActions = _interopRequireDefault(require("./LegacyDialogActions"));
+var _DialogActions = _interopRequireDefault(require("./DialogActions"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 //# sourceMappingURL=index.js.map

package/build/commonjs/DialogActions/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyDialogActions';\nexport type { default as DialogActionsProps } from './DialogActionsProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './DialogActions';\nexport type { default as DialogActionsProps } from './DialogActionsProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}

package/build/commonjs/DialogContent/DialogContent.js

@@ -9,6 +9,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _reactNative = require("react-native");
 
+var _Dialog = require("../Dialog");
+
 var _styles = require("../styles");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -35,16 +37,17 @@ function DialogContent(props) {
   } = props;
   const theme = (0, _styles.useTheme)();
   const styles = useStyles();
-  const rootStyle = (0, _styles.css)([styles.root, styleProp]);
+  const sectionStyle = (0, _Dialog.useDialogSectionStyle)();
+  const rootStyle = (0, _styles.css)([styles.root, sectionStyle, styleProp]);
   const contentFontStyle = (0, _styles.createFontStyle)(theme, {
-    // TODO: select typography.
-    // selector: (typography) => typography.body2.regular,
+    selector: typography => typography.body2.regular,
     color: theme.palette.text.base
   });
   const contentStyle = (0, _styles.css)([contentFontStyle, {
     textAlign
   }]);
   return /*#__PURE__*/_react.default.createElement(_reactNative.ScrollView, _extends({
+    bounces: false,
     style: rootStyle
   }, otherProps), typeof children === 'string' ? /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
     style: contentStyle

package/build/commonjs/DialogContent/DialogContent.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","theme","useTheme","root","flexGrow","flexShrink","marginVertical","spacing","DialogContent","props","children","style","styleProp","textAlign","otherProps","styles","rootStyle","css","contentFontStyle","createFontStyle","color","palette","text","base","contentStyle"],"sources":["DialogContent.tsx"],"sourcesContent":["import React from 'react';\nimport { ScrollView, Text, TextStyle } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type DialogContentProps from './DialogContentProps';\n\ntype DialogContentStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<DialogContentStyles> = function (): DialogContentStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            flexGrow: 1,\n            flexShrink: 1,\n            marginVertical: theme.spacing(4),\n        },\n    };\n};\n\nexport default function DialogContent(props: DialogContentProps) {\n    const {\n        children,\n        style: styleProp,\n        textAlign = 'left' as TextStyle['textAlign'],\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 contentFontStyle = createFontStyle(theme, {\n        // TODO: select typography.\n        // selector: (typography) => typography.body2.regular,\n        color: theme.palette.text.base,\n    });\n\n    const contentStyle = css([\n        contentFontStyle,\n        { textAlign },\n    ]);\n\n    return (\n        <ScrollView\n            style={rootStyle}\n            {...otherProps}\n        >\n            {typeof children === 'string' ? (\n                <Text style={contentStyle}>\n                    {children}\n                </Text>\n            ) : (children)}\n        </ScrollView>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;;;AAKA,MAAMA,SAAyC,GAAG,YAAiC;EAC/E,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,QAAQ,EAAE,CADR;MAEFC,UAAU,EAAE,CAFV;MAGFC,cAAc,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;IAHd;EADH,CAAP;AAOH,CAVD;;AAYe,SAASC,aAAT,CAAuBC,KAAvB,EAAkD;EAC7D,MAAM;IACFC,QADE;IAEFC,KAAK,EAAEC,SAFL;IAGFC,SAAS,GAAG,MAHV;IAIF,GAAGC;EAJD,IAKFL,KALJ;EAOA,MAAMR,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAMa,MAAM,GAAGf,SAAS,EAAxB;EAEA,MAAMgB,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAACZ,IADW,EAElBS,SAFkB,CAAJ,CAAlB;EAKA,MAAMM,gBAAgB,GAAG,IAAAC,uBAAA,EAAgBlB,KAAhB,EAAuB;IAC5C;IACA;IACAmB,KAAK,EAAEnB,KAAK,CAACoB,OAAN,CAAcC,IAAd,CAAmBC;EAHkB,CAAvB,CAAzB;EAMA,MAAMC,YAAY,GAAG,IAAAP,WAAA,EAAI,CACrBC,gBADqB,EAErB;IAAEL;EAAF,CAFqB,CAAJ,CAArB;EAKA,oBACI,6BAAC,uBAAD;IACI,KAAK,EAAEG;EADX,GAEQF,UAFR,GAIK,OAAOJ,QAAP,KAAoB,QAApB,gBACG,6BAAC,iBAAD;IAAM,KAAK,EAAEc;EAAb,GACKd,QADL,CADH,GAIIA,QART,CADJ;AAYH;;AAAA"}
+{"version":3,"names":["useStyles","theme","useTheme","root","flexGrow","flexShrink","marginVertical","spacing","DialogContent","props","children","style","styleProp","textAlign","otherProps","styles","sectionStyle","useDialogSectionStyle","rootStyle","css","contentFontStyle","createFontStyle","selector","typography","body2","regular","color","palette","text","base","contentStyle"],"sources":["DialogContent.tsx"],"sourcesContent":["import React from 'react';\nimport { ScrollView, Text, TextStyle } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { useDialogSectionStyle } from '../Dialog';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type DialogContentProps from './DialogContentProps';\n\ntype DialogContentStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<DialogContentStyles> = function (): DialogContentStyles {\n    const theme = useTheme();\n\n    return {\n        root: {\n            flexGrow: 1,\n            flexShrink: 1,\n            marginVertical: theme.spacing(4),\n        },\n    };\n};\n\nexport default function DialogContent(props: DialogContentProps) {\n    const {\n        children,\n        style: styleProp,\n        textAlign = 'left' as TextStyle['textAlign'],\n        ...otherProps\n    } = props;\n\n    const theme = useTheme();\n\n    const styles = useStyles();\n\n    const sectionStyle = useDialogSectionStyle();\n\n    const rootStyle = css([\n        styles.root,\n        sectionStyle,\n        styleProp,\n    ]);\n\n    const contentFontStyle = createFontStyle(theme, {\n        selector: (typography) => typography.body2.regular,\n        color: theme.palette.text.base,\n    });\n\n    const contentStyle = css([\n        contentFontStyle,\n        { textAlign },\n    ]);\n\n    return (\n        <ScrollView\n            bounces={false}\n            style={rootStyle}\n            {...otherProps}\n        >\n            {typeof children === 'string' ? (\n                <Text style={contentStyle}>\n                    {children}\n                </Text>\n            ) : (children)}\n        </ScrollView>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;;;AAKA,MAAMA,SAAyC,GAAG,YAAiC;EAC/E,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,QAAQ,EAAE,CADR;MAEFC,UAAU,EAAE,CAFV;MAGFC,cAAc,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;IAHd;EADH,CAAP;AAOH,CAVD;;AAYe,SAASC,aAAT,CAAuBC,KAAvB,EAAkD;EAC7D,MAAM;IACFC,QADE;IAEFC,KAAK,EAAEC,SAFL;IAGFC,SAAS,GAAG,MAHV;IAIF,GAAGC;EAJD,IAKFL,KALJ;EAOA,MAAMR,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAMa,MAAM,GAAGf,SAAS,EAAxB;EAEA,MAAMgB,YAAY,GAAG,IAAAC,6BAAA,GAArB;EAEA,MAAMC,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBJ,MAAM,CAACZ,IADW,EAElBa,YAFkB,EAGlBJ,SAHkB,CAAJ,CAAlB;EAMA,MAAMQ,gBAAgB,GAAG,IAAAC,uBAAA,EAAgBpB,KAAhB,EAAuB;IAC5CqB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,KAAX,CAAiBC,OADC;IAE5CC,KAAK,EAAEzB,KAAK,CAAC0B,OAAN,CAAcC,IAAd,CAAmBC;EAFkB,CAAvB,CAAzB;EAKA,MAAMC,YAAY,GAAG,IAAAX,WAAA,EAAI,CACrBC,gBADqB,EAErB;IAAEP;EAAF,CAFqB,CAAJ,CAArB;EAKA,oBACI,6BAAC,uBAAD;IACI,OAAO,EAAE,KADb;IAEI,KAAK,EAAEK;EAFX,GAGQJ,UAHR,GAKK,OAAOJ,QAAP,KAAoB,QAApB,gBACG,6BAAC,iBAAD;IAAM,KAAK,EAAEoB;EAAb,GACKpB,QADL,CADH,GAIIA,QATT,CADJ;AAaH;;AAAA"}

package/build/commonjs/DialogContent/index.js

@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function () {
-    return _LegacyDialogContent.default;
+    return _DialogContent.default;
   }
 });
 
-var _LegacyDialogContent = _interopRequireDefault(require("./LegacyDialogContent"));
+var _DialogContent = _interopRequireDefault(require("./DialogContent"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 //# sourceMappingURL=index.js.map

package/build/commonjs/DialogContent/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyDialogContent';\nexport type { default as DialogContentProps } from './LegacyDialogContentProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './DialogContent';\nexport type { default as DialogContentProps } from './DialogContentProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}

package/build/commonjs/DialogMedia/DialogMedia.js

@@ -24,6 +24,7 @@ const useStyles = function () {
       paddingTop: theme.spacing(8)
     },
     image: {
+      paddingHorizontal: theme.spacing(4),
       paddingTop: theme.spacing(4)
     }
   };

package/build/commonjs/DialogMedia/DialogMedia.js.map

@@ -1 +1 @@
-{"version":3,"names":["useStyles","theme","useTheme","icon","alignItems","justifyContent","paddingTop","spacing","image","DialogMedia","props","children","variant","style","styleProp","otherProps","styles","rootStyle","css"],"sources":["DialogMedia.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport type DialogMediaProps from './DialogMediaProps';\nimport type { DialogMediaVariant } from './DialogMediaProps';\n\ntype DialogMediaStyles = NamedStylesStringUnion<DialogMediaVariant>;\n\nconst useStyles: UseStyles<DialogMediaStyles> = function (): DialogMediaStyles {\n    const theme = useTheme();\n\n    return {\n        icon: {\n            alignItems: 'center',\n            justifyContent: 'center',\n            paddingTop: theme.spacing(8),\n        },\n        image: {\n            paddingTop: theme.spacing(4),\n        },\n    };\n};\n\nexport default function DialogMedia(props: DialogMediaProps) {\n    const {\n        children,\n        variant = 'image',\n        style: styleProp,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const rootStyle = css([\n        styles[variant],\n        styleProp,\n    ]);\n\n    return (\n        <View\n            style={rootStyle}\n            {...otherProps}\n        >\n            {children}\n        </View>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;;;AAMA,MAAMA,SAAuC,GAAG,YAA+B;EAC3E,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,cAAc,EAAE,QAFd;MAGFC,UAAU,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;IAHV,CADH;IAMHC,KAAK,EAAE;MACHF,UAAU,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;IADT;EANJ,CAAP;AAUH,CAbD;;AAee,SAASE,WAAT,CAAqBC,KAArB,EAA8C;EACzD,MAAM;IACFC,QADE;IAEFC,OAAO,GAAG,OAFR;IAGFC,KAAK,EAAEC,SAHL;IAIF,GAAGC;EAJD,IAKFL,KALJ;EAOA,MAAMM,MAAM,GAAGhB,SAAS,EAAxB;EAEA,MAAMiB,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAACJ,OAAD,CADY,EAElBE,SAFkB,CAAJ,CAAlB;EAKA,oBACI,6BAAC,iBAAD;IACI,KAAK,EAAEG;EADX,GAEQF,UAFR,GAIKJ,QAJL,CADJ;AAQH;;AAAA"}
+{"version":3,"names":["useStyles","theme","useTheme","icon","alignItems","justifyContent","paddingTop","spacing","image","paddingHorizontal","DialogMedia","props","children","variant","style","styleProp","otherProps","styles","rootStyle","css"],"sources":["DialogMedia.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport type DialogMediaProps from './DialogMediaProps';\nimport type { DialogMediaVariant } from './DialogMediaProps';\n\ntype DialogMediaStyles = NamedStylesStringUnion<DialogMediaVariant>;\n\nconst useStyles: UseStyles<DialogMediaStyles> = function (): DialogMediaStyles {\n    const theme = useTheme();\n\n    return {\n        icon: {\n            alignItems: 'center',\n            justifyContent: 'center',\n            paddingTop: theme.spacing(8),\n        },\n        image: {\n            paddingHorizontal: theme.spacing(4),\n            paddingTop: theme.spacing(4),\n        },\n    };\n};\n\nexport default function DialogMedia(props: DialogMediaProps) {\n    const {\n        children,\n        variant = 'image',\n        style: styleProp,\n        ...otherProps\n    } = props;\n\n    const styles = useStyles();\n\n    const rootStyle = css([\n        styles[variant],\n        styleProp,\n    ]);\n\n    return (\n        <View\n            style={rootStyle}\n            {...otherProps}\n        >\n            {children}\n        </View>\n    );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;;;AAMA,MAAMA,SAAuC,GAAG,YAA+B;EAC3E,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,cAAc,EAAE,QAFd;MAGFC,UAAU,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;IAHV,CADH;IAMHC,KAAK,EAAE;MACHC,iBAAiB,EAAER,KAAK,CAACM,OAAN,CAAc,CAAd,CADhB;MAEHD,UAAU,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;IAFT;EANJ,CAAP;AAWH,CAdD;;AAgBe,SAASG,WAAT,CAAqBC,KAArB,EAA8C;EACzD,MAAM;IACFC,QADE;IAEFC,OAAO,GAAG,OAFR;IAGFC,KAAK,EAAEC,SAHL;IAIF,GAAGC;EAJD,IAKFL,KALJ;EAOA,MAAMM,MAAM,GAAGjB,SAAS,EAAxB;EAEA,MAAMkB,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAACJ,OAAD,CADY,EAElBE,SAFkB,CAAJ,CAAlB;EAKA,oBACI,6BAAC,iBAAD;IACI,KAAK,EAAEG;EADX,GAEQF,UAFR,GAIKJ,QAJL,CADJ;AAQH;;AAAA"}

package/build/commonjs/DialogMedia/index.js

@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function () {
-    return _LegacyDialogMedia.default;
+    return _DialogMedia.default;
   }
 });
 
-var _LegacyDialogMedia = _interopRequireDefault(require("./LegacyDialogMedia"));
+var _DialogMedia = _interopRequireDefault(require("./DialogMedia"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 //# sourceMappingURL=index.js.map

package/build/commonjs/DialogMedia/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyDialogMedia';\nexport type { default as DialogMediaProps } from './LegacyDialogMediaProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './DialogMedia';\nexport type { default as DialogMediaProps } from './DialogMediaProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}