@fountain-ui/core 2.0.0-beta.94 → 2.0.0-beta.96
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/Dialog/Dialog.js +26 -50
- package/build/commonjs/Dialog/Dialog.js.map +1 -1
- package/build/commonjs/Dialog/DialogProps.js +7 -0
- package/build/commonjs/Dialog/DialogProps.js.map +1 -1
- package/build/commonjs/Dialog/LegacyDialog.js +181 -0
- package/build/commonjs/Dialog/LegacyDialog.js.map +1 -0
- package/build/commonjs/Dialog/LegacyDialogProps.js +2 -0
- package/build/commonjs/Dialog/LegacyDialogProps.js.map +1 -0
- package/build/commonjs/Dialog/index.js +2 -2
- package/build/commonjs/Dialog/index.js.map +1 -1
- package/build/commonjs/Dialog/useDialogStyle.js +81 -0
- package/build/commonjs/Dialog/useDialogStyle.js.map +1 -0
- package/build/commonjs/DialogActions/DialogActions.js +2 -2
- package/build/commonjs/DialogActions/DialogActions.js.map +1 -1
- package/build/commonjs/DialogActions/LegacyDialogActions.js +30 -0
- package/build/commonjs/DialogActions/LegacyDialogActions.js.map +1 -0
- package/build/commonjs/DialogActions/index.js +2 -2
- package/build/commonjs/DialogActions/index.js.map +1 -1
- package/build/commonjs/DialogContent/DialogContent.js +30 -11
- package/build/commonjs/DialogContent/DialogContent.js.map +1 -1
- package/build/commonjs/DialogContent/DialogContentProps.js.map +1 -1
- package/build/commonjs/DialogContent/LegacyDialogContent.js +36 -0
- package/build/commonjs/DialogContent/LegacyDialogContent.js.map +1 -0
- package/build/commonjs/DialogContent/LegacyDialogContentProps.js +2 -0
- package/build/commonjs/DialogContent/LegacyDialogContentProps.js.map +1 -0
- package/build/commonjs/DialogContent/index.js +2 -2
- package/build/commonjs/DialogContent/index.js.map +1 -1
- package/build/commonjs/DialogMedia/DialogMedia.js +24 -10
- package/build/commonjs/DialogMedia/DialogMedia.js.map +1 -1
- package/build/commonjs/DialogMedia/DialogMediaProps.js +7 -0
- package/build/commonjs/DialogMedia/DialogMediaProps.js.map +1 -1
- package/build/commonjs/DialogMedia/LegacyDialogMedia.js +33 -0
- package/build/commonjs/DialogMedia/LegacyDialogMedia.js.map +1 -0
- package/build/commonjs/DialogMedia/LegacyDialogMediaProps.js +2 -0
- package/build/commonjs/DialogMedia/LegacyDialogMediaProps.js.map +1 -0
- package/build/commonjs/DialogMedia/index.js +2 -2
- package/build/commonjs/DialogMedia/index.js.map +1 -1
- package/build/commonjs/DialogTitle/DialogTitle.js +27 -11
- package/build/commonjs/DialogTitle/DialogTitle.js.map +1 -1
- package/build/commonjs/DialogTitle/DialogTitleProps.js.map +1 -1
- package/build/commonjs/DialogTitle/LegacyDialogTitle.js +36 -0
- package/build/commonjs/DialogTitle/LegacyDialogTitle.js.map +1 -0
- package/build/commonjs/DialogTitle/LegacyDialogTitleProps.js +2 -0
- package/build/commonjs/DialogTitle/LegacyDialogTitleProps.js.map +1 -0
- package/build/commonjs/DialogTitle/index.js +2 -2
- package/build/commonjs/DialogTitle/index.js.map +1 -1
- package/build/commonjs/hooks/useCollapsibleAppBar.js +3 -2
- package/build/commonjs/hooks/useCollapsibleAppBar.js.map +1 -1
- package/build/module/Dialog/Dialog.js +23 -52
- package/build/module/Dialog/Dialog.js.map +1 -1
- package/build/module/Dialog/DialogProps.js +1 -1
- package/build/module/Dialog/DialogProps.js.map +1 -1
- package/build/module/Dialog/LegacyDialog.js +160 -0
- package/build/module/Dialog/LegacyDialog.js.map +1 -0
- package/build/module/Dialog/LegacyDialogProps.js +2 -0
- package/build/module/Dialog/LegacyDialogProps.js.map +1 -0
- package/build/module/Dialog/index.js +1 -1
- package/build/module/Dialog/index.js.map +1 -1
- package/build/module/Dialog/useDialogStyle.js +71 -0
- package/build/module/Dialog/useDialogStyle.js.map +1 -0
- package/build/module/DialogActions/DialogActions.js +2 -2
- package/build/module/DialogActions/DialogActions.js.map +1 -1
- package/build/module/DialogActions/LegacyDialogActions.js +17 -0
- package/build/module/DialogActions/LegacyDialogActions.js.map +1 -0
- package/build/module/DialogActions/index.js +1 -1
- package/build/module/DialogActions/index.js.map +1 -1
- package/build/module/DialogContent/DialogContent.js +32 -11
- package/build/module/DialogContent/DialogContent.js.map +1 -1
- package/build/module/DialogContent/DialogContentProps.js.map +1 -1
- package/build/module/DialogContent/LegacyDialogContent.js +22 -0
- package/build/module/DialogContent/LegacyDialogContent.js.map +1 -0
- package/build/module/DialogContent/LegacyDialogContentProps.js +2 -0
- package/build/module/DialogContent/LegacyDialogContentProps.js.map +1 -0
- package/build/module/DialogContent/index.js +1 -1
- package/build/module/DialogContent/index.js.map +1 -1
- package/build/module/DialogMedia/DialogMedia.js +24 -10
- package/build/module/DialogMedia/DialogMedia.js.map +1 -1
- package/build/module/DialogMedia/DialogMediaProps.js +1 -1
- package/build/module/DialogMedia/DialogMediaProps.js.map +1 -1
- package/build/module/DialogMedia/LegacyDialogMedia.js +21 -0
- package/build/module/DialogMedia/LegacyDialogMedia.js.map +1 -0
- package/build/module/DialogMedia/LegacyDialogMediaProps.js +2 -0
- package/build/module/DialogMedia/LegacyDialogMediaProps.js.map +1 -0
- package/build/module/DialogMedia/index.js +1 -1
- package/build/module/DialogMedia/index.js.map +1 -1
- package/build/module/DialogTitle/DialogTitle.js +29 -11
- package/build/module/DialogTitle/DialogTitle.js.map +1 -1
- package/build/module/DialogTitle/DialogTitleProps.js.map +1 -1
- package/build/module/DialogTitle/LegacyDialogTitle.js +22 -0
- package/build/module/DialogTitle/LegacyDialogTitle.js.map +1 -0
- package/build/module/DialogTitle/LegacyDialogTitleProps.js +2 -0
- package/build/module/DialogTitle/LegacyDialogTitleProps.js.map +1 -0
- package/build/module/DialogTitle/index.js +1 -1
- package/build/module/DialogTitle/index.js.map +1 -1
- package/build/module/hooks/useCollapsibleAppBar.js +3 -2
- package/build/module/hooks/useCollapsibleAppBar.js.map +1 -1
- package/build/typescript/Dialog/DialogProps.d.ts +7 -0
- package/build/typescript/Dialog/LegacyDialog.d.ts +3 -0
- package/build/typescript/Dialog/LegacyDialogProps.d.ts +25 -0
- package/build/typescript/Dialog/index.d.ts +2 -2
- package/build/typescript/Dialog/useDialogStyle.d.ts +6 -0
- package/build/typescript/DialogActions/LegacyDialogActions.d.ts +3 -0
- package/build/typescript/DialogActions/index.d.ts +1 -1
- package/build/typescript/DialogContent/DialogContentProps.d.ts +5 -5
- package/build/typescript/DialogContent/LegacyDialogContent.d.ts +3 -0
- package/build/typescript/DialogContent/LegacyDialogContentProps.d.ts +10 -0
- package/build/typescript/DialogContent/index.d.ts +2 -2
- package/build/typescript/DialogMedia/DialogMediaProps.d.ts +7 -10
- package/build/typescript/DialogMedia/LegacyDialogMedia.d.ts +3 -0
- package/build/typescript/DialogMedia/LegacyDialogMediaProps.d.ts +15 -0
- package/build/typescript/DialogMedia/index.d.ts +2 -2
- package/build/typescript/DialogTitle/DialogTitleProps.d.ts +2 -13
- package/build/typescript/DialogTitle/LegacyDialogTitle.d.ts +3 -0
- package/build/typescript/DialogTitle/LegacyDialogTitleProps.d.ts +15 -0
- package/build/typescript/DialogTitle/index.d.ts +2 -2
- package/package.json +3 -3
- package/src/Dialog/Dialog.tsx +27 -69
- package/src/Dialog/DialogProps.ts +9 -0
- package/src/Dialog/LegacyDialog.tsx +198 -0
- package/src/Dialog/LegacyDialogProps.ts +28 -0
- package/src/Dialog/index.ts +2 -2
- package/src/Dialog/useDialogStyle.ts +90 -0
- package/src/DialogActions/DialogActions.tsx +2 -4
- package/src/DialogActions/LegacyDialogActions.tsx +23 -0
- package/src/DialogActions/index.ts +2 -2
- package/src/DialogContent/DialogContent.tsx +47 -16
- package/src/DialogContent/DialogContentProps.ts +5 -5
- package/src/DialogContent/LegacyDialogContent.tsx +30 -0
- package/src/DialogContent/LegacyDialogContentProps.ts +10 -0
- package/src/DialogContent/index.ts +2 -2
- package/src/DialogMedia/DialogMedia.tsx +35 -8
- package/src/DialogMedia/DialogMediaProps.ts +7 -10
- package/src/DialogMedia/LegacyDialogMedia.tsx +21 -0
- package/src/DialogMedia/LegacyDialogMediaProps.ts +16 -0
- package/src/DialogMedia/index.ts +2 -2
- package/src/DialogTitle/DialogTitle.tsx +46 -16
- package/src/DialogTitle/DialogTitleProps.ts +2 -14
- package/src/DialogTitle/LegacyDialogTitle.tsx +30 -0
- package/src/DialogTitle/LegacyDialogTitleProps.ts +16 -0
- package/src/DialogTitle/index.ts +2 -2
- package/src/hooks/useCollapsibleAppBar.ts +14 -11
|
@@ -7,9 +7,7 @@ exports.default = DialogContent;
|
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
|
-
var
|
|
11
|
-
|
|
12
|
-
var _Typography = _interopRequireDefault(require("../Typography"));
|
|
10
|
+
var _reactNative = require("react-native");
|
|
13
11
|
|
|
14
12
|
var _styles = require("../styles");
|
|
15
13
|
|
|
@@ -17,19 +15,40 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
17
15
|
|
|
18
16
|
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); }
|
|
19
17
|
|
|
18
|
+
const useStyles = function () {
|
|
19
|
+
const theme = (0, _styles.useTheme)();
|
|
20
|
+
return {
|
|
21
|
+
root: {
|
|
22
|
+
flexGrow: 1,
|
|
23
|
+
flexShrink: 1,
|
|
24
|
+
marginVertical: theme.spacing(4)
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
};
|
|
28
|
+
|
|
20
29
|
function DialogContent(props) {
|
|
21
30
|
const {
|
|
22
31
|
children,
|
|
23
|
-
|
|
32
|
+
style: styleProp,
|
|
33
|
+
textAlign = 'left',
|
|
24
34
|
...otherProps
|
|
25
35
|
} = props;
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
36
|
+
const theme = (0, _styles.useTheme)();
|
|
37
|
+
const styles = useStyles();
|
|
38
|
+
const rootStyle = (0, _styles.css)([styles.root, styleProp]);
|
|
39
|
+
const contentFontStyle = (0, _styles.createFontStyle)(theme, {
|
|
40
|
+
// TODO: select typography.
|
|
41
|
+
// selector: (typography) => typography.body2.regular,
|
|
42
|
+
color: theme.palette.text.base
|
|
43
|
+
});
|
|
44
|
+
const contentStyle = (0, _styles.css)([contentFontStyle, {
|
|
45
|
+
textAlign
|
|
46
|
+
}]);
|
|
47
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.ScrollView, _extends({
|
|
48
|
+
style: rootStyle
|
|
49
|
+
}, otherProps), typeof children === 'string' ? /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
50
|
+
style: contentStyle
|
|
51
|
+
}, children) : children);
|
|
33
52
|
}
|
|
34
53
|
|
|
35
54
|
;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["DialogContent","props","children","
|
|
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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["DialogContentProps.ts"],"sourcesContent":["import type {
|
|
1
|
+
{"version":3,"names":[],"sources":["DialogContentProps.ts"],"sourcesContent":["import type { ScrollViewProps, TextStyle } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\n\nexport default interface DialogContentProps extends OverridableComponentProps<ScrollViewProps, {\n /**\n * Sets the horizontal alignment of the text inside the dialog content.\n * @default 'left'\n */\n textAlign?: TextStyle['textAlign'];\n}> {}\n"],"mappings":""}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = DialogContent;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _Column = _interopRequireDefault(require("../Column"));
|
|
11
|
+
|
|
12
|
+
var _Typography = _interopRequireDefault(require("../Typography"));
|
|
13
|
+
|
|
14
|
+
var _styles = require("../styles");
|
|
15
|
+
|
|
16
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
+
|
|
18
|
+
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); }
|
|
19
|
+
|
|
20
|
+
function DialogContent(props) {
|
|
21
|
+
const {
|
|
22
|
+
children,
|
|
23
|
+
disableTypography = false,
|
|
24
|
+
...otherProps
|
|
25
|
+
} = props;
|
|
26
|
+
return /*#__PURE__*/_react.default.createElement(_Column.default, _extends({
|
|
27
|
+
insets: _styles.EdgeInsets.fromVH(2, 6)
|
|
28
|
+
}, otherProps), disableTypography ? children : /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
29
|
+
children: children,
|
|
30
|
+
color: 'textSecondary',
|
|
31
|
+
variant: 'body2'
|
|
32
|
+
}));
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
;
|
|
36
|
+
//# sourceMappingURL=LegacyDialogContent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["DialogContent","props","children","disableTypography","otherProps","EdgeInsets","fromVH"],"sources":["LegacyDialogContent.tsx"],"sourcesContent":["import React from 'react';\nimport Column from '../Column';\nimport Typography from '../Typography';\nimport { EdgeInsets } from '../styles';\nimport type DialogContentProps from './LegacyDialogContentProps';\n\nexport default function DialogContent(props: DialogContentProps) {\n const {\n children,\n disableTypography = false,\n ...otherProps\n } = props;\n\n return (\n <Column\n insets={EdgeInsets.fromVH(2, 6)}\n {...otherProps}\n >\n {disableTypography ? (\n children\n ) : (\n <Typography\n children={children}\n color={'textSecondary'}\n variant={'body2'}\n />\n )}\n </Column>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAGe,SAASA,aAAT,CAAuBC,KAAvB,EAAkD;EAC7D,MAAM;IACFC,QADE;IAEFC,iBAAiB,GAAG,KAFlB;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,oBACI,6BAAC,eAAD;IACI,MAAM,EAAEI,kBAAA,CAAWC,MAAX,CAAkB,CAAlB,EAAqB,CAArB;EADZ,GAEQF,UAFR,GAIKD,iBAAiB,GACdD,QADc,gBAGd,6BAAC,mBAAD;IACI,QAAQ,EAAEA,QADd;IAEI,KAAK,EAAE,eAFX;IAGI,OAAO,EAAE;EAHb,EAPR,CADJ;AAgBH;;AAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sources":["LegacyDialogContentProps.ts"],"sourcesContent":["import type { OverridableComponentProps } from '../types';\nimport type { ColumnProps } from '../Column';\n\nexport default interface DialogContentProps extends OverridableComponentProps<ColumnProps, {\n /**\n * If `true`, the children won't be wrapped by a typography component.\n * @default false\n */\n disableTypography?: boolean;\n}> {}\n"],"mappings":""}
|
|
@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
Object.defineProperty(exports, "default", {
|
|
7
7
|
enumerable: true,
|
|
8
8
|
get: function () {
|
|
9
|
-
return
|
|
9
|
+
return _LegacyDialogContent.default;
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
12
|
|
|
13
|
-
var
|
|
13
|
+
var _LegacyDialogContent = _interopRequireDefault(require("./LegacyDialogContent"));
|
|
14
14
|
|
|
15
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
16
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyDialogContent';\nexport type { default as DialogContentProps } from './LegacyDialogContentProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
|
|
@@ -7,26 +7,40 @@ exports.default = DialogMedia;
|
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
|
|
12
|
+
var _styles = require("../styles");
|
|
11
13
|
|
|
12
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
15
|
|
|
14
16
|
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); }
|
|
15
17
|
|
|
18
|
+
const useStyles = function () {
|
|
19
|
+
const theme = (0, _styles.useTheme)();
|
|
20
|
+
return {
|
|
21
|
+
icon: {
|
|
22
|
+
alignItems: 'center',
|
|
23
|
+
justifyContent: 'center',
|
|
24
|
+
paddingTop: theme.spacing(8)
|
|
25
|
+
},
|
|
26
|
+
image: {
|
|
27
|
+
paddingTop: theme.spacing(4)
|
|
28
|
+
}
|
|
29
|
+
};
|
|
30
|
+
};
|
|
31
|
+
|
|
16
32
|
function DialogMedia(props) {
|
|
17
33
|
const {
|
|
18
34
|
children,
|
|
19
|
-
image,
|
|
35
|
+
variant = 'image',
|
|
36
|
+
style: styleProp,
|
|
20
37
|
...otherProps
|
|
21
38
|
} = props;
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
uri: image
|
|
28
|
-
}
|
|
29
|
-
}, otherProps));
|
|
39
|
+
const styles = useStyles();
|
|
40
|
+
const rootStyle = (0, _styles.css)([styles[variant], styleProp]);
|
|
41
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({
|
|
42
|
+
style: rootStyle
|
|
43
|
+
}, otherProps), children);
|
|
30
44
|
}
|
|
31
45
|
|
|
32
46
|
;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["DialogMedia","props","children","
|
|
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"}
|
|
@@ -1,2 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.dialogMediaVariants = void 0;
|
|
7
|
+
const dialogMediaVariants = ['image', 'icon'];
|
|
8
|
+
exports.dialogMediaVariants = dialogMediaVariants;
|
|
2
9
|
//# sourceMappingURL=DialogMediaProps.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["DialogMediaProps.ts"],"sourcesContent":["import type {
|
|
1
|
+
{"version":3,"names":["dialogMediaVariants"],"sources":["DialogMediaProps.ts"],"sourcesContent":["import type { ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\n\nexport const dialogMediaVariants = ['image', 'icon'] as const;\nexport type DialogMediaVariant = typeof dialogMediaVariants[number];\n\nexport default interface DialogMediaProps extends OverridableComponentProps<ViewProps, {\n /**\n * Determines design variations of the component.\n * @default 'image'\n */\n variant?: DialogMediaVariant;\n}> {}\n"],"mappings":";;;;;;AAGO,MAAMA,mBAAmB,GAAG,CAAC,OAAD,EAAU,MAAV,CAA5B"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = DialogMedia;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _Image = _interopRequireDefault(require("../Image"));
|
|
11
|
+
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
+
|
|
14
|
+
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); }
|
|
15
|
+
|
|
16
|
+
function DialogMedia(props) {
|
|
17
|
+
const {
|
|
18
|
+
children,
|
|
19
|
+
image,
|
|
20
|
+
...otherProps
|
|
21
|
+
} = props;
|
|
22
|
+
return /*#__PURE__*/_react.default.createElement(_Image.default, _extends({
|
|
23
|
+
disableOutline: true,
|
|
24
|
+
loading: 'eager',
|
|
25
|
+
overlaidChildren: children,
|
|
26
|
+
source: {
|
|
27
|
+
uri: image
|
|
28
|
+
}
|
|
29
|
+
}, otherProps));
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
;
|
|
33
|
+
//# sourceMappingURL=LegacyDialogMedia.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["DialogMedia","props","children","image","otherProps","uri"],"sources":["LegacyDialogMedia.tsx"],"sourcesContent":["import React from 'react';\nimport Image from '../Image';\nimport type DialogMediaProps from './LegacyDialogMediaProps';\n\nexport default function DialogMedia(props: DialogMediaProps) {\n const {\n children,\n image,\n ...otherProps\n } = props;\n\n return (\n <Image\n disableOutline={true}\n loading={'eager'}\n overlaidChildren={children}\n source={{ uri: image }}\n {...otherProps}\n />\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;;;;;AAGe,SAASA,WAAT,CAAqBC,KAArB,EAA8C;EACzD,MAAM;IACFC,QADE;IAEFC,KAFE;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,oBACI,6BAAC,cAAD;IACI,cAAc,EAAE,IADpB;IAEI,OAAO,EAAE,OAFb;IAGI,gBAAgB,EAAEC,QAHtB;IAII,MAAM,EAAE;MAAEG,GAAG,EAAEF;IAAP;EAJZ,GAKQC,UALR,EADJ;AASH;;AAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sources":["LegacyDialogMediaProps.ts"],"sourcesContent":["import type { ImageProps } from '../Image';\nimport type { OverridableComponentProps } from '../types';\n\ntype BaseProps = Omit<ImageProps, 'source' | 'overlaidChildren'>;\n\nexport default interface DialogMediaProps extends OverridableComponentProps<BaseProps, {\n /**\n * The content of the component.\n */\n children?: ImageProps['overlaidChildren'];\n\n /**\n * Image to be displayed as a background image.\n */\n image: string;\n}> {}\n"],"mappings":""}
|
|
@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
Object.defineProperty(exports, "default", {
|
|
7
7
|
enumerable: true,
|
|
8
8
|
get: function () {
|
|
9
|
-
return
|
|
9
|
+
return _LegacyDialogMedia.default;
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
12
|
|
|
13
|
-
var
|
|
13
|
+
var _LegacyDialogMedia = _interopRequireDefault(require("./LegacyDialogMedia"));
|
|
14
14
|
|
|
15
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
16
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyDialogMedia';\nexport type { default as DialogMediaProps } from './LegacyDialogMediaProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
|
|
@@ -7,9 +7,7 @@ exports.default = DialogTitle;
|
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
|
-
var
|
|
11
|
-
|
|
12
|
-
var _Typography = _interopRequireDefault(require("../Typography"));
|
|
10
|
+
var _reactNative = require("react-native");
|
|
13
11
|
|
|
14
12
|
var _styles = require("../styles");
|
|
15
13
|
|
|
@@ -17,19 +15,37 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
17
15
|
|
|
18
16
|
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); }
|
|
19
17
|
|
|
18
|
+
const useStyles = function () {
|
|
19
|
+
const theme = (0, _styles.useTheme)();
|
|
20
|
+
return {
|
|
21
|
+
root: {
|
|
22
|
+
paddingTop: theme.spacing(6.5)
|
|
23
|
+
},
|
|
24
|
+
title: {
|
|
25
|
+
textAlign: 'center'
|
|
26
|
+
}
|
|
27
|
+
};
|
|
28
|
+
};
|
|
29
|
+
|
|
20
30
|
function DialogTitle(props) {
|
|
21
31
|
const {
|
|
22
32
|
children,
|
|
23
|
-
|
|
33
|
+
style: styleProp,
|
|
24
34
|
...otherProps
|
|
25
35
|
} = props;
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
})
|
|
36
|
+
const theme = (0, _styles.useTheme)();
|
|
37
|
+
const styles = useStyles();
|
|
38
|
+
const rootStyle = (0, _styles.css)([styles.root, styleProp]);
|
|
39
|
+
const titleFontStyle = (0, _styles.createFontStyle)(theme, {
|
|
40
|
+
selector: typography => typography.header3.semiBold,
|
|
41
|
+
color: theme.palette.text.strong
|
|
42
|
+
});
|
|
43
|
+
const titleStyle = (0, _styles.css)([styles.title, titleFontStyle]);
|
|
44
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, _extends({}, otherProps, {
|
|
45
|
+
style: rootStyle
|
|
46
|
+
}), typeof children === 'string' ? /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
47
|
+
style: titleStyle
|
|
48
|
+
}, children) : children);
|
|
33
49
|
}
|
|
34
50
|
|
|
35
51
|
;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["DialogTitle","props","children","
|
|
1
|
+
{"version":3,"names":["useStyles","theme","useTheme","root","paddingTop","spacing","title","textAlign","DialogTitle","props","children","style","styleProp","otherProps","styles","rootStyle","css","titleFontStyle","createFontStyle","selector","typography","header3","semiBold","color","palette","text","strong","titleStyle"],"sources":["DialogTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type DialogTitleProps from './DialogTitleProps';\n\ntype DialogTitleStyles = NamedStylesStringUnion<'root' | 'title'>;\n\nconst useStyles: UseStyles<DialogTitleStyles> = function (): DialogTitleStyles {\n const theme = useTheme();\n\n return {\n root: {\n paddingTop: theme.spacing(6.5),\n },\n title: {\n textAlign: 'center',\n },\n };\n};\n\nexport default function DialogTitle(props: DialogTitleProps) {\n const {\n children,\n style: styleProp,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const styles = useStyles();\n\n const rootStyle = css([\n styles.root,\n styleProp,\n ]);\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (typography) => typography.header3.semiBold,\n color: theme.palette.text.strong,\n });\n\n const titleStyle = css([\n styles.title,\n titleFontStyle,\n ]);\n\n return (\n <View\n {...otherProps}\n style={rootStyle}\n >\n {typeof children === 'string' ? (\n <Text style={titleStyle}>\n {children}\n </Text>\n ) : (children)}\n </View>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;;;AAKA,MAAMA,SAAuC,GAAG,YAA+B;EAC3E,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAEH,KAAK,CAACI,OAAN,CAAc,GAAd;IADV,CADH;IAIHC,KAAK,EAAE;MACHC,SAAS,EAAE;IADR;EAJJ,CAAP;AAQH,CAXD;;AAae,SAASC,WAAT,CAAqBC,KAArB,EAA8C;EACzD,MAAM;IACFC,QADE;IAEFC,KAAK,EAAEC,SAFL;IAGF,GAAGC;EAHD,IAIFJ,KAJJ;EAMA,MAAMR,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAMY,MAAM,GAAGd,SAAS,EAAxB;EAEA,MAAMe,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBF,MAAM,CAACX,IADW,EAElBS,SAFkB,CAAJ,CAAlB;EAKA,MAAMK,cAAc,GAAG,IAAAC,uBAAA,EAAgBjB,KAAhB,EAAuB;IAC1CkB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,OAAX,CAAmBC,QADH;IAE1CC,KAAK,EAAEtB,KAAK,CAACuB,OAAN,CAAcC,IAAd,CAAmBC;EAFgB,CAAvB,CAAvB;EAKA,MAAMC,UAAU,GAAG,IAAAX,WAAA,EAAI,CACnBF,MAAM,CAACR,KADY,EAEnBW,cAFmB,CAAJ,CAAnB;EAKA,oBACI,6BAAC,iBAAD,eACQJ,UADR;IAEI,KAAK,EAAEE;EAFX,IAIK,OAAOL,QAAP,KAAoB,QAApB,gBACG,6BAAC,iBAAD;IAAM,KAAK,EAAEiB;EAAb,GACKjB,QADL,CADH,GAIIA,QART,CADJ;AAYH;;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["DialogTitleProps.ts"],"sourcesContent":["import type {
|
|
1
|
+
{"version":3,"names":[],"sources":["DialogTitleProps.ts"],"sourcesContent":["import type { ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\n\nexport default interface DialogTitleProps extends OverridableComponentProps<ViewProps, {}> {}\n"],"mappings":""}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = DialogTitle;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _Row = _interopRequireDefault(require("../Row"));
|
|
11
|
+
|
|
12
|
+
var _Typography = _interopRequireDefault(require("../Typography"));
|
|
13
|
+
|
|
14
|
+
var _styles = require("../styles");
|
|
15
|
+
|
|
16
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
+
|
|
18
|
+
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); }
|
|
19
|
+
|
|
20
|
+
function DialogTitle(props) {
|
|
21
|
+
const {
|
|
22
|
+
children,
|
|
23
|
+
disableTypography = false,
|
|
24
|
+
...otherProps
|
|
25
|
+
} = props;
|
|
26
|
+
return /*#__PURE__*/_react.default.createElement(_Row.default, _extends({
|
|
27
|
+
insets: _styles.EdgeInsets.fromLTRB(6, 6, 6, 2)
|
|
28
|
+
}, otherProps), disableTypography ? children : /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
29
|
+
children: children,
|
|
30
|
+
color: 'textPrimary',
|
|
31
|
+
variant: 'h2'
|
|
32
|
+
}));
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
;
|
|
36
|
+
//# sourceMappingURL=LegacyDialogTitle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["DialogTitle","props","children","disableTypography","otherProps","EdgeInsets","fromLTRB"],"sources":["LegacyDialogTitle.tsx"],"sourcesContent":["import React from 'react';\nimport Row from '../Row';\nimport Typography from '../Typography';\nimport { EdgeInsets } from '../styles';\nimport type DialogTitleProps from './LegacyDialogTitleProps';\n\nexport default function DialogTitle(props: DialogTitleProps) {\n const {\n children,\n disableTypography = false,\n ...otherProps\n } = props;\n\n return (\n <Row\n insets={EdgeInsets.fromLTRB(6, 6, 6, 2)}\n {...otherProps}\n >\n {disableTypography ? (\n children\n ) : (\n <Typography\n children={children}\n color={'textPrimary'}\n variant={'h2'}\n />\n )}\n </Row>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAGe,SAASA,WAAT,CAAqBC,KAArB,EAA8C;EACzD,MAAM;IACFC,QADE;IAEFC,iBAAiB,GAAG,KAFlB;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,oBACI,6BAAC,YAAD;IACI,MAAM,EAAEI,kBAAA,CAAWC,QAAX,CAAoB,CAApB,EAAuB,CAAvB,EAA0B,CAA1B,EAA6B,CAA7B;EADZ,GAEQF,UAFR,GAIKD,iBAAiB,GACdD,QADc,gBAGd,6BAAC,mBAAD;IACI,QAAQ,EAAEA,QADd;IAEI,KAAK,EAAE,aAFX;IAGI,OAAO,EAAE;EAHb,EAPR,CADJ;AAgBH;;AAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sources":["LegacyDialogTitleProps.ts"],"sourcesContent":["import type { TypographyProps } from '../Typography';\nimport type { OverridableComponentProps } from '../types';\nimport type { RowProps } from '../Row';\n\nexport default interface DialogTitleProps extends OverridableComponentProps<RowProps, {\n /**\n * The content of the component.\n */\n children?: TypographyProps['children'];\n\n /**\n * If `true`, the children won't be wrapped by a typography component.\n * @default false\n */\n disableTypography?: boolean;\n}> {}\n"],"mappings":""}
|
|
@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
Object.defineProperty(exports, "default", {
|
|
7
7
|
enumerable: true,
|
|
8
8
|
get: function () {
|
|
9
|
-
return
|
|
9
|
+
return _LegacyDialogTitle.default;
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
12
|
|
|
13
|
-
var
|
|
13
|
+
var _LegacyDialogTitle = _interopRequireDefault(require("./LegacyDialogTitle"));
|
|
14
14
|
|
|
15
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
16
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './LegacyDialogTitle';\nexport type { default as DialogTitleProps } from './LegacyDialogTitleProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
|
|
@@ -114,8 +114,9 @@ function useCollapsibleAppBar() {
|
|
|
114
114
|
const minOffsetY = -maxTy;
|
|
115
115
|
const maxOffsetY = event.contentSize.height - event.layoutMeasurement.height;
|
|
116
116
|
const safeOffsetY = Math.min(Math.max(offsetY, minOffsetY), maxOffsetY);
|
|
117
|
-
const
|
|
118
|
-
const
|
|
117
|
+
const safeLastOffsetY = Math.min(Math.max(lastOffsetY.value, minOffsetY), maxOffsetY);
|
|
118
|
+
const dy = safeOffsetY - safeLastOffsetY;
|
|
119
|
+
const newTranslateY = safeOffsetY <= 0 ? 0 : supportsReverseScroll ? dy === 0 ? lastTranslateY.value : dy > 0 ? maxTy : 0 : safeLastOffsetY === minOffsetY ? 0 : maxTy;
|
|
119
120
|
translateY.value = (0, _reactNativeReanimated.withTiming)(newTranslateY, ANIMATION_CONFIG);
|
|
120
121
|
lastTranslateY.value = newTranslateY;
|
|
121
122
|
overlapped.value = offsetY > 0;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["defaultOptions","keyboardDismissMode","dividerExposureMode","supportsReverseScroll","ANIMATION_CONFIG","duration","TRANSPARENT","SUPPORTS_DRAG_DETECTION","Platform","OS","dismissKeyboard","Keyboard","dismiss","useCollapsibleAppBar","userOptions","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","appBarHeight","onAppBarLayout","useHeight","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","isScrolled","setIsScrolled","useState","theme","useTheme","animatedStyle","useAnimatedStyle","transform","value","borderColor","palette","divider","borderBottomWidth","StyleSheet","hairlineWidth","indexRef","useRef","offsetsRef","onScrollViewChanged","useCallback","nextIndex","prevIndex","current","savedOffsetY","withTiming","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","maxTy","dy","Math","min","max","minOffsetY","maxOffsetY","contentSize","height","layoutMeasurement","safeOffsetY","newTranslateY","onEndDrag","onMomentumEnd","ty","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport {\n Falsy,\n Keyboard,\n Platform,\n RegisteredStyle,\n ScrollViewProps,\n StyleSheet,\n ViewProps,\n ViewStyle,\n} from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport {\n runOnJS,\n useAnimatedScrollHandler,\n useAnimatedStyle,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useTheme } from '@fountain-ui/styles';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n top?: number;\n bottom?: number;\n left?: number;\n right?: number;\n}\n\nexport interface Options {\n keyboardDismissMode?: 'none' | 'on-drag';\n dividerExposureMode?: 'always' | 'overlapped';\n supportsReverseScroll?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n appBarStyle: ViewStyleProp;\n onAppBarLayout: OnLayoutCallback;\n onCollapsibleToolbarLayout: OnLayoutCallback;\n onScroll: OnScroll;\n onScrollViewChanged: (index: number) => void;\n scrollContentInsets: ContentInsets;\n isScrolled: boolean;\n}\n\nconst defaultOptions: Required<Options> = {\n keyboardDismissMode: 'none',\n dividerExposureMode: 'overlapped',\n supportsReverseScroll: true,\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\nconst TRANSPARENT = '#FFFFFF00';\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\nconst dismissKeyboard = () => Keyboard.dismiss();\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n const { keyboardDismissMode, dividerExposureMode, supportsReverseScroll }: Required<Options> = {\n ...defaultOptions,\n ...userOptions,\n };\n\n const styles = useAppbarStyles();\n\n const safeAreaInsets = useSafeAreaInsets();\n\n const [appBarHeight, onAppBarLayout] = useHeight();\n const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n const maxTranslateY = useDerivedValue(() => -collapsibleToolbarHeight, [collapsibleToolbarHeight]);\n\n const translateY = useSharedValue<number>(0);\n const lastTranslateY = useSharedValue<number>(0);\n const lastOffsetY = useSharedValue<number>(0);\n const overlapped = useSharedValue<boolean>(false);\n\n const [isScrolled, setIsScrolled] = useState<boolean>(false);\n\n const theme = useTheme();\n\n const animatedStyle = useAnimatedStyle(() => {\n const transform = [{ translateY: translateY.value }];\n\n return {\n transform,\n borderColor: dividerExposureMode === 'always' || overlapped.value ? theme.palette.divider : TRANSPARENT,\n borderBottomWidth: StyleSheet.hairlineWidth,\n };\n }, [\n theme,\n dividerExposureMode,\n ]);\n\n const indexRef = useRef<number>(0);\n const offsetsRef = useRef<Array<number>>([]);\n\n const onScrollViewChanged = useCallback((nextIndex: number) => {\n const prevIndex = indexRef.current;\n if (prevIndex === nextIndex) {\n return;\n }\n\n offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n lastOffsetY.value = savedOffsetY;\n\n indexRef.current = nextIndex;\n\n // Determine whether to overlap every time index is changed.\n overlapped.value = savedOffsetY > 0;\n\n // If next ScrollView's offset is too short, expand app bar.\n if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n translateY.value = withTiming(0, ANIMATION_CONFIG);\n }\n }, [appBarHeight]);\n\n const scrollHandler = useAnimatedScrollHandler({\n onBeginDrag: () => {\n if (keyboardDismissMode === 'on-drag') {\n runOnJS(dismissKeyboard)();\n }\n lastTranslateY.value = translateY.value;\n },\n onMomentumBegin: () => {\n lastTranslateY.value = translateY.value;\n },\n onScroll: (event) => {\n const offsetY = event.contentOffset.y;\n\n if (!isScrolled && offsetY > 0) {\n runOnJS(setIsScrolled)(true);\n } else if (isScrolled && offsetY <= 0) {\n runOnJS(setIsScrolled)(false);\n }\n\n const maxTy = maxTranslateY.value;\n\n if (SUPPORTS_DRAG_DETECTION) {\n const dy = offsetY - lastOffsetY.value;\n\n translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n overlapped.value = offsetY + translateY.value > 0;\n } else {\n const minOffsetY = -maxTy;\n const maxOffsetY = event.contentSize.height - event.layoutMeasurement.height;\n\n const safeOffsetY = Math.min(Math.max(offsetY, minOffsetY), maxOffsetY);\n const dy = safeOffsetY - lastOffsetY.value;\n\n const newTranslateY = supportsReverseScroll\n ? dy === 0\n ? lastTranslateY.value\n : dy > 0\n ? maxTy\n : 0\n : lastOffsetY.value === minOffsetY\n ? 0\n : maxTy;\n\n translateY.value = withTiming(newTranslateY, ANIMATION_CONFIG);\n lastTranslateY.value = newTranslateY;\n\n overlapped.value = offsetY > 0;\n\n lastOffsetY.value = offsetY;\n }\n },\n onEndDrag: (event) => {\n lastOffsetY.value = event.contentOffset.y;\n },\n onMomentumEnd: (event) => {\n const offsetY = event.contentOffset.y;\n\n lastOffsetY.value = offsetY;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n // If toolbar is already positioned on edge, do nothing.\n if (ty <= maxTy || ty >= 0) {\n return;\n }\n\n const threshold = maxTy * 0.5;\n\n const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n overlapped.value = offsetY + nextTranslateY > 0;\n\n translateY.value = withTiming(nextTranslateY, ANIMATION_CONFIG);\n },\n }, [keyboardDismissMode, appBarHeight, isScrolled]);\n\n const hasCollapsible = collapsibleToolbarHeight > 0;\n\n const appBarStyle = [\n animatedStyle,\n { paddingTop: safeAreaInsets.top },\n hasCollapsible ? styles.floating : undefined,\n ];\n\n return {\n appBarStyle,\n onAppBarLayout,\n onCollapsibleToolbarLayout,\n onScroll: scrollHandler,\n onScrollViewChanged,\n scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n isScrolled,\n };\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["defaultOptions","keyboardDismissMode","dividerExposureMode","supportsReverseScroll","ANIMATION_CONFIG","duration","TRANSPARENT","SUPPORTS_DRAG_DETECTION","Platform","OS","dismissKeyboard","Keyboard","dismiss","useCollapsibleAppBar","userOptions","styles","useAppbarStyles","safeAreaInsets","useSafeAreaInsets","appBarHeight","onAppBarLayout","useHeight","collapsibleToolbarHeight","onCollapsibleToolbarLayout","maxTranslateY","useDerivedValue","translateY","useSharedValue","lastTranslateY","lastOffsetY","overlapped","isScrolled","setIsScrolled","useState","theme","useTheme","animatedStyle","useAnimatedStyle","transform","value","borderColor","palette","divider","borderBottomWidth","StyleSheet","hairlineWidth","indexRef","useRef","offsetsRef","onScrollViewChanged","useCallback","nextIndex","prevIndex","current","savedOffsetY","withTiming","scrollHandler","useAnimatedScrollHandler","onBeginDrag","runOnJS","onMomentumBegin","onScroll","event","offsetY","contentOffset","y","maxTy","dy","Math","min","max","minOffsetY","maxOffsetY","contentSize","height","layoutMeasurement","safeOffsetY","safeLastOffsetY","newTranslateY","onEndDrag","onMomentumEnd","ty","threshold","nextTranslateY","hasCollapsible","appBarStyle","paddingTop","top","floating","undefined","scrollContentInsets"],"sources":["useCollapsibleAppBar.ts"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport {\n Falsy,\n Keyboard,\n Platform,\n RegisteredStyle,\n ScrollViewProps,\n StyleSheet,\n ViewProps,\n ViewStyle,\n} from 'react-native';\nimport type { WithTimingConfig } from 'react-native-reanimated';\nimport {\n runOnJS,\n useAnimatedScrollHandler,\n useAnimatedStyle,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { useTheme } from '@fountain-ui/styles';\nimport { useHeight } from '../internal/hooks';\nimport useAppbarStyles from './useAppbarStyles';\n\ntype WebOnlyStyle = { boxShadow: any };\n\ntype ViewStyleProp = Array<ViewStyle | RegisteredStyle<ViewStyle> | WebOnlyStyle | Falsy>;\n\ntype OnScroll = ScrollViewProps['onScroll'];\n\ntype OnLayoutCallback = ViewProps['onLayout'];\n\nexport interface ContentInsets {\n top?: number;\n bottom?: number;\n left?: number;\n right?: number;\n}\n\nexport interface Options {\n keyboardDismissMode?: 'none' | 'on-drag';\n dividerExposureMode?: 'always' | 'overlapped';\n supportsReverseScroll?: boolean;\n}\n\nexport interface CollapsibleAppBar {\n appBarStyle: ViewStyleProp;\n onAppBarLayout: OnLayoutCallback;\n onCollapsibleToolbarLayout: OnLayoutCallback;\n onScroll: OnScroll;\n onScrollViewChanged: (index: number) => void;\n scrollContentInsets: ContentInsets;\n isScrolled: boolean;\n}\n\nconst defaultOptions: Required<Options> = {\n keyboardDismissMode: 'none',\n dividerExposureMode: 'overlapped',\n supportsReverseScroll: true,\n};\n\nconst ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 100 };\nconst TRANSPARENT = '#FFFFFF00';\n\nconst SUPPORTS_DRAG_DETECTION = Platform.OS !== 'web';\nconst dismissKeyboard = () => Keyboard.dismiss();\n\nexport default function useCollapsibleAppBar(userOptions: Options = defaultOptions): CollapsibleAppBar {\n const { keyboardDismissMode, dividerExposureMode, supportsReverseScroll }: Required<Options> = {\n ...defaultOptions,\n ...userOptions,\n };\n\n const styles = useAppbarStyles();\n\n const safeAreaInsets = useSafeAreaInsets();\n\n const [appBarHeight, onAppBarLayout] = useHeight();\n const [collapsibleToolbarHeight, onCollapsibleToolbarLayout] = useHeight();\n\n const maxTranslateY = useDerivedValue(() => -collapsibleToolbarHeight, [collapsibleToolbarHeight]);\n\n const translateY = useSharedValue<number>(0);\n const lastTranslateY = useSharedValue<number>(0);\n const lastOffsetY = useSharedValue<number>(0);\n const overlapped = useSharedValue<boolean>(false);\n\n const [isScrolled, setIsScrolled] = useState<boolean>(false);\n\n const theme = useTheme();\n\n const animatedStyle = useAnimatedStyle(() => {\n const transform = [{ translateY: translateY.value }];\n\n return {\n transform,\n borderColor: dividerExposureMode === 'always' || overlapped.value ? theme.palette.divider : TRANSPARENT,\n borderBottomWidth: StyleSheet.hairlineWidth,\n };\n }, [\n theme,\n dividerExposureMode,\n ]);\n\n const indexRef = useRef<number>(0);\n const offsetsRef = useRef<Array<number>>([]);\n\n const onScrollViewChanged = useCallback((nextIndex: number) => {\n const prevIndex = indexRef.current;\n if (prevIndex === nextIndex) {\n return;\n }\n\n offsetsRef.current[prevIndex] = lastOffsetY.value;\n\n const savedOffsetY = offsetsRef.current[nextIndex] ?? 0;\n lastOffsetY.value = savedOffsetY;\n\n indexRef.current = nextIndex;\n\n // Determine whether to overlap every time index is changed.\n overlapped.value = savedOffsetY > 0;\n\n // If next ScrollView's offset is too short, expand app bar.\n if (translateY.value < 0 && savedOffsetY < appBarHeight) {\n translateY.value = withTiming(0, ANIMATION_CONFIG);\n }\n }, [appBarHeight]);\n\n const scrollHandler = useAnimatedScrollHandler({\n onBeginDrag: () => {\n if (keyboardDismissMode === 'on-drag') {\n runOnJS(dismissKeyboard)();\n }\n lastTranslateY.value = translateY.value;\n },\n onMomentumBegin: () => {\n lastTranslateY.value = translateY.value;\n },\n onScroll: (event) => {\n const offsetY = event.contentOffset.y;\n\n if (!isScrolled && offsetY > 0) {\n runOnJS(setIsScrolled)(true);\n } else if (isScrolled && offsetY <= 0) {\n runOnJS(setIsScrolled)(false);\n }\n\n const maxTy = maxTranslateY.value;\n\n if (SUPPORTS_DRAG_DETECTION) {\n const dy = offsetY - lastOffsetY.value;\n\n translateY.value = offsetY <= 0 ? 0 : Math.min(Math.max(lastTranslateY.value - dy, maxTy), 0);\n\n overlapped.value = offsetY + translateY.value > 0;\n } else {\n const minOffsetY = -maxTy;\n const maxOffsetY = event.contentSize.height - event.layoutMeasurement.height;\n\n const safeOffsetY = Math.min(Math.max(offsetY, minOffsetY), maxOffsetY);\n const safeLastOffsetY = Math.min(Math.max(lastOffsetY.value, minOffsetY), maxOffsetY);\n const dy = safeOffsetY - safeLastOffsetY;\n\n const newTranslateY = safeOffsetY <= 0\n ? 0\n : supportsReverseScroll\n ? dy === 0\n ? lastTranslateY.value\n : dy > 0\n ? maxTy\n : 0\n : safeLastOffsetY === minOffsetY\n ? 0\n : maxTy;\n\n translateY.value = withTiming(newTranslateY, ANIMATION_CONFIG);\n lastTranslateY.value = newTranslateY;\n\n overlapped.value = offsetY > 0;\n\n lastOffsetY.value = offsetY;\n }\n },\n onEndDrag: (event) => {\n lastOffsetY.value = event.contentOffset.y;\n },\n onMomentumEnd: (event) => {\n const offsetY = event.contentOffset.y;\n\n lastOffsetY.value = offsetY;\n\n const ty = translateY.value;\n const maxTy = maxTranslateY.value;\n\n // If toolbar is already positioned on edge, do nothing.\n if (ty <= maxTy || ty >= 0) {\n return;\n }\n\n const threshold = maxTy * 0.5;\n\n const nextTranslateY = (ty > threshold || offsetY < appBarHeight) ? 0 : maxTy;\n\n overlapped.value = offsetY + nextTranslateY > 0;\n\n translateY.value = withTiming(nextTranslateY, ANIMATION_CONFIG);\n },\n }, [keyboardDismissMode, appBarHeight, isScrolled]);\n\n const hasCollapsible = collapsibleToolbarHeight > 0;\n\n const appBarStyle = [\n animatedStyle,\n { paddingTop: safeAreaInsets.top },\n hasCollapsible ? styles.floating : undefined,\n ];\n\n return {\n appBarStyle,\n onAppBarLayout,\n onCollapsibleToolbarLayout,\n onScroll: scrollHandler,\n onScrollViewChanged,\n scrollContentInsets: { top: hasCollapsible ? appBarHeight : 0 },\n isScrolled,\n };\n};\n"],"mappings":"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"}
|