@chayns-components/core 5.0.0-beta.991 → 5.0.0-beta.992
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/lib/cjs/components/page-provider/PageProvider.js +1 -1
- package/lib/cjs/components/page-provider/PageProvider.js.map +1 -1
- package/lib/cjs/utils/pageProvider.js +5 -82
- package/lib/cjs/utils/pageProvider.js.map +1 -1
- package/lib/esm/components/page-provider/PageProvider.js +1 -1
- package/lib/esm/components/page-provider/PageProvider.js.map +1 -1
- package/lib/esm/utils/pageProvider.js +5 -81
- package/lib/esm/utils/pageProvider.js.map +1 -1
- package/lib/types/utils/pageProvider.d.ts +2 -3
- package/package.json +2 -2
|
@@ -31,7 +31,7 @@ const PageProvider = ({
|
|
|
31
31
|
runtimeEnvironment
|
|
32
32
|
} = (0, _chaynsApi.getEnvironment)();
|
|
33
33
|
const shouldUsePadding = !shouldRemovePadding && ![_chaynsApi.RuntimeEnviroment.IntercomPlugin, _chaynsApi.RuntimeEnviroment.PagemakerPlugin, 6].includes(runtimeEnvironment);
|
|
34
|
-
const usableHeight = (0, _pageProvider.useUsableHeight)(
|
|
34
|
+
const usableHeight = (0, _pageProvider.useUsableHeight)();
|
|
35
35
|
return /*#__PURE__*/_react.default.createElement(_PageProvider.StyledPageProvider, {
|
|
36
36
|
className: "page-provider",
|
|
37
37
|
$shouldUsePadding: shouldUsePadding,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageProvider.js","names":["_chaynsApi","require","_react","_interopRequireDefault","_styledComponents","_pageProvider","_ColorSchemeProvider","_PageProvider","e","__esModule","default","GlobalStyle","createGlobalStyle","PageProvider","children","color","colorMode","cssVariables","secondaryColor","style","designSettings","shouldRemovePadding","shouldUseUsableHeight","runtimeEnvironment","getEnvironment","shouldUsePadding","RuntimeEnviroment","IntercomPlugin","PagemakerPlugin","includes","usableHeight","useUsableHeight","createElement","StyledPageProvider","className","$shouldUsePadding","$usableHeight","undefined","height","displayName","_default","exports"],"sources":["../../../../src/components/page-provider/PageProvider.tsx"],"sourcesContent":["import { getEnvironment, RuntimeEnviroment } from 'chayns-api';\nimport React, { FC } from 'react';\nimport { createGlobalStyle } from 'styled-components';\nimport { useUsableHeight } from '../../utils/pageProvider';\nimport ColorSchemeProvider, {\n type ColorSchemeProviderProps,\n} from '../color-scheme-provider/ColorSchemeProvider';\nimport { StyledPageProvider } from './PageProvider.styles';\n\ninterface PageProviderProps extends ColorSchemeProviderProps {\n /**\n * Whether the padding should be removed.\n */\n shouldRemovePadding?: boolean;\n /**\n * Whether the usable height should be used.\n */\n shouldUseUsableHeight?: boolean;\n}\n\nconst GlobalStyle = createGlobalStyle`\n *, *::before, *::after {\n box-sizing: border-box;\n }\n`;\n\nconst PageProvider: FC<PageProviderProps> = ({\n children,\n color,\n colorMode,\n cssVariables = {},\n secondaryColor,\n style = {},\n designSettings,\n shouldRemovePadding,\n shouldUseUsableHeight,\n}) => {\n const { runtimeEnvironment } = getEnvironment();\n const shouldUsePadding =\n !shouldRemovePadding &&\n ![RuntimeEnviroment.IntercomPlugin, RuntimeEnviroment.PagemakerPlugin, 6].includes(\n runtimeEnvironment as number,\n );\n\n const usableHeight = useUsableHeight(
|
|
1
|
+
{"version":3,"file":"PageProvider.js","names":["_chaynsApi","require","_react","_interopRequireDefault","_styledComponents","_pageProvider","_ColorSchemeProvider","_PageProvider","e","__esModule","default","GlobalStyle","createGlobalStyle","PageProvider","children","color","colorMode","cssVariables","secondaryColor","style","designSettings","shouldRemovePadding","shouldUseUsableHeight","runtimeEnvironment","getEnvironment","shouldUsePadding","RuntimeEnviroment","IntercomPlugin","PagemakerPlugin","includes","usableHeight","useUsableHeight","createElement","StyledPageProvider","className","$shouldUsePadding","$usableHeight","undefined","height","displayName","_default","exports"],"sources":["../../../../src/components/page-provider/PageProvider.tsx"],"sourcesContent":["import { getEnvironment, RuntimeEnviroment } from 'chayns-api';\nimport React, { FC } from 'react';\nimport { createGlobalStyle } from 'styled-components';\nimport { useUsableHeight } from '../../utils/pageProvider';\nimport ColorSchemeProvider, {\n type ColorSchemeProviderProps,\n} from '../color-scheme-provider/ColorSchemeProvider';\nimport { StyledPageProvider } from './PageProvider.styles';\n\ninterface PageProviderProps extends ColorSchemeProviderProps {\n /**\n * Whether the padding should be removed.\n */\n shouldRemovePadding?: boolean;\n /**\n * Whether the usable height should be used.\n */\n shouldUseUsableHeight?: boolean;\n}\n\nconst GlobalStyle = createGlobalStyle`\n *, *::before, *::after {\n box-sizing: border-box;\n }\n`;\n\nconst PageProvider: FC<PageProviderProps> = ({\n children,\n color,\n colorMode,\n cssVariables = {},\n secondaryColor,\n style = {},\n designSettings,\n shouldRemovePadding,\n shouldUseUsableHeight,\n}) => {\n const { runtimeEnvironment } = getEnvironment();\n const shouldUsePadding =\n !shouldRemovePadding &&\n ![RuntimeEnviroment.IntercomPlugin, RuntimeEnviroment.PagemakerPlugin, 6].includes(\n runtimeEnvironment as number,\n );\n\n const usableHeight = useUsableHeight();\n\n return (\n <StyledPageProvider\n className=\"page-provider\"\n $shouldUsePadding={shouldUsePadding}\n $usableHeight={shouldUseUsableHeight ? usableHeight : undefined}\n >\n <ColorSchemeProvider\n color={color}\n secondaryColor={secondaryColor}\n colorMode={colorMode}\n style={shouldUseUsableHeight ? { ...style, height: '100%' } : style}\n designSettings={designSettings}\n cssVariables={cssVariables}\n >\n {children}\n </ColorSchemeProvider>\n <GlobalStyle />\n </StyledPageProvider>\n );\n};\nPageProvider.displayName = 'PageProvider';\n\nexport default PageProvider;\n"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,iBAAA,GAAAH,OAAA;AACA,IAAAI,aAAA,GAAAJ,OAAA;AACA,IAAAK,oBAAA,GAAAH,sBAAA,CAAAF,OAAA;AAGA,IAAAM,aAAA,GAAAN,OAAA;AAA2D,SAAAE,uBAAAK,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAa3D,MAAMG,WAAW,GAAG,IAAAC,mCAAiB;AACrC;AACA;AACA;AACA,CAAC;AAED,MAAMC,YAAmC,GAAGA,CAAC;EACzCC,QAAQ;EACRC,KAAK;EACLC,SAAS;EACTC,YAAY,GAAG,CAAC,CAAC;EACjBC,cAAc;EACdC,KAAK,GAAG,CAAC,CAAC;EACVC,cAAc;EACdC,mBAAmB;EACnBC;AACJ,CAAC,KAAK;EACF,MAAM;IAAEC;EAAmB,CAAC,GAAG,IAAAC,yBAAc,EAAC,CAAC;EAC/C,MAAMC,gBAAgB,GAClB,CAACJ,mBAAmB,IACpB,CAAC,CAACK,4BAAiB,CAACC,cAAc,EAAED,4BAAiB,CAACE,eAAe,EAAE,CAAC,CAAC,CAACC,QAAQ,CAC9EN,kBACJ,CAAC;EAEL,MAAMO,YAAY,GAAG,IAAAC,6BAAe,EAAC,CAAC;EAEtC,oBACI7B,MAAA,CAAAQ,OAAA,CAAAsB,aAAA,CAACzB,aAAA,CAAA0B,kBAAkB;IACfC,SAAS,EAAC,eAAe;IACzBC,iBAAiB,EAAEV,gBAAiB;IACpCW,aAAa,EAAEd,qBAAqB,GAAGQ,YAAY,GAAGO;EAAU,gBAEhEnC,MAAA,CAAAQ,OAAA,CAAAsB,aAAA,CAAC1B,oBAAA,CAAAI,OAAmB;IAChBK,KAAK,EAAEA,KAAM;IACbG,cAAc,EAAEA,cAAe;IAC/BF,SAAS,EAAEA,SAAU;IACrBG,KAAK,EAAEG,qBAAqB,GAAG;MAAE,GAAGH,KAAK;MAAEmB,MAAM,EAAE;IAAO,CAAC,GAAGnB,KAAM;IACpEC,cAAc,EAAEA,cAAe;IAC/BH,YAAY,EAAEA;EAAa,GAE1BH,QACgB,CAAC,eACtBZ,MAAA,CAAAQ,OAAA,CAAAsB,aAAA,CAACrB,WAAW,MAAE,CACE,CAAC;AAE7B,CAAC;AACDE,YAAY,CAAC0B,WAAW,GAAG,cAAc;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA/B,OAAA,GAE3BG,YAAY","ignoreList":[]}
|
|
@@ -3,86 +3,16 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.useUsableHeight = exports.getUsableHeight =
|
|
6
|
+
exports.useUsableHeight = exports.getUsableHeight = void 0;
|
|
7
7
|
var _chaynsApi = require("chayns-api");
|
|
8
|
-
|
|
9
|
-
const getPagePadding = () => {
|
|
10
|
-
const {
|
|
11
|
-
runtimeEnvironment
|
|
12
|
-
} = (0, _chaynsApi.getEnvironment)();
|
|
13
|
-
if (typeof runtimeEnvironment === 'number' && [4, 5].includes(runtimeEnvironment)) {
|
|
14
|
-
return '0';
|
|
15
|
-
}
|
|
16
|
-
if (matchMedia(_pageProvider.PAGE_BREAKPOINTS.desktop).matches) {
|
|
17
|
-
return '35px 43px 30px';
|
|
18
|
-
}
|
|
19
|
-
return '15px 10px 20px';
|
|
20
|
-
};
|
|
21
|
-
exports.getPagePadding = getPagePadding;
|
|
22
|
-
const getPageProviderInformation = () => {
|
|
23
|
-
const padding = getPagePadding().split(' ');
|
|
24
|
-
const parseValue = value => {
|
|
25
|
-
const parsed = parseInt(value.replace('px', ''), 10);
|
|
26
|
-
return Number.isNaN(parsed) ? 0 : parsed;
|
|
27
|
-
};
|
|
28
|
-
if (padding.length === 1) {
|
|
29
|
-
const value = parseValue(padding[0] ?? '');
|
|
30
|
-
return {
|
|
31
|
-
top: value,
|
|
32
|
-
right: value,
|
|
33
|
-
bottom: value,
|
|
34
|
-
left: value
|
|
35
|
-
};
|
|
36
|
-
}
|
|
37
|
-
if (padding.length === 2) {
|
|
38
|
-
const [vertical, horizontal] = padding.map(parseValue);
|
|
39
|
-
return {
|
|
40
|
-
top: vertical ?? 0,
|
|
41
|
-
right: horizontal ?? 0,
|
|
42
|
-
bottom: vertical ?? 0,
|
|
43
|
-
left: horizontal ?? 0
|
|
44
|
-
};
|
|
45
|
-
}
|
|
46
|
-
if (padding.length === 3) {
|
|
47
|
-
const [top, horizontal, bottom] = padding.map(parseValue);
|
|
48
|
-
return {
|
|
49
|
-
top: top ?? 0,
|
|
50
|
-
right: horizontal ?? 0,
|
|
51
|
-
bottom: bottom ?? 0,
|
|
52
|
-
left: horizontal ?? 0
|
|
53
|
-
};
|
|
54
|
-
}
|
|
55
|
-
if (padding.length === 4) {
|
|
56
|
-
const [top, right, bottom, left] = padding.map(parseValue);
|
|
57
|
-
return {
|
|
58
|
-
top: top ?? 0,
|
|
59
|
-
right: right ?? 0,
|
|
60
|
-
bottom: bottom ?? 0,
|
|
61
|
-
left: left ?? 0
|
|
62
|
-
};
|
|
63
|
-
}
|
|
64
|
-
return {
|
|
65
|
-
top: 0,
|
|
66
|
-
right: 0,
|
|
67
|
-
bottom: 0,
|
|
68
|
-
left: 0
|
|
69
|
-
};
|
|
70
|
-
};
|
|
71
|
-
const getUsableHeight = async shouldRemovePadding => {
|
|
8
|
+
const getUsableHeight = async () => {
|
|
72
9
|
let usableHeight;
|
|
73
10
|
const {
|
|
74
11
|
bottomBarHeight,
|
|
75
12
|
offsetTop,
|
|
76
13
|
windowHeight
|
|
77
14
|
} = await (0, _chaynsApi.getWindowMetrics)();
|
|
78
|
-
|
|
79
|
-
bottom,
|
|
80
|
-
top
|
|
81
|
-
} = shouldRemovePadding ? {
|
|
82
|
-
bottom: 0,
|
|
83
|
-
top: 0
|
|
84
|
-
} : getPageProviderInformation();
|
|
85
|
-
usableHeight = windowHeight - bottom - top;
|
|
15
|
+
usableHeight = windowHeight;
|
|
86
16
|
if (bottomBarHeight) {
|
|
87
17
|
usableHeight -= bottomBarHeight;
|
|
88
18
|
}
|
|
@@ -92,21 +22,14 @@ const getUsableHeight = async shouldRemovePadding => {
|
|
|
92
22
|
return usableHeight;
|
|
93
23
|
};
|
|
94
24
|
exports.getUsableHeight = getUsableHeight;
|
|
95
|
-
const useUsableHeight =
|
|
25
|
+
const useUsableHeight = () => {
|
|
96
26
|
let usableHeight;
|
|
97
27
|
const {
|
|
98
28
|
bottomBarHeight,
|
|
99
29
|
offsetTop,
|
|
100
30
|
windowHeight
|
|
101
31
|
} = (0, _chaynsApi.useWindowMetrics)();
|
|
102
|
-
|
|
103
|
-
bottom,
|
|
104
|
-
top
|
|
105
|
-
} = shouldRemovePadding ? {
|
|
106
|
-
bottom: 0,
|
|
107
|
-
top: 0
|
|
108
|
-
} : getPageProviderInformation();
|
|
109
|
-
usableHeight = windowHeight - bottom - top;
|
|
32
|
+
usableHeight = windowHeight;
|
|
110
33
|
if (bottomBarHeight) {
|
|
111
34
|
usableHeight -= bottomBarHeight;
|
|
112
35
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pageProvider.js","names":["_chaynsApi","require","
|
|
1
|
+
{"version":3,"file":"pageProvider.js","names":["_chaynsApi","require","getUsableHeight","usableHeight","bottomBarHeight","offsetTop","windowHeight","getWindowMetrics","exports","useUsableHeight","useWindowMetrics"],"sources":["../../../src/utils/pageProvider.ts"],"sourcesContent":["import { getWindowMetrics, useWindowMetrics } from 'chayns-api';\n\nexport const getUsableHeight = async () => {\n let usableHeight;\n\n const { bottomBarHeight, offsetTop, windowHeight } = await getWindowMetrics();\n\n usableHeight = windowHeight;\n\n if (bottomBarHeight) {\n usableHeight -= bottomBarHeight;\n }\n\n if (offsetTop) {\n usableHeight -= offsetTop;\n }\n\n return usableHeight;\n};\n\nexport const useUsableHeight = () => {\n let usableHeight;\n\n const { bottomBarHeight, offsetTop, windowHeight } = useWindowMetrics();\n usableHeight = windowHeight;\n\n if (bottomBarHeight) {\n usableHeight -= bottomBarHeight;\n }\n\n if (offsetTop) {\n usableHeight -= offsetTop;\n }\n\n return usableHeight;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AAEO,MAAMC,eAAe,GAAG,MAAAA,CAAA,KAAY;EACvC,IAAIC,YAAY;EAEhB,MAAM;IAAEC,eAAe;IAAEC,SAAS;IAAEC;EAAa,CAAC,GAAG,MAAM,IAAAC,2BAAgB,EAAC,CAAC;EAE7EJ,YAAY,GAAGG,YAAY;EAE3B,IAAIF,eAAe,EAAE;IACjBD,YAAY,IAAIC,eAAe;EACnC;EAEA,IAAIC,SAAS,EAAE;IACXF,YAAY,IAAIE,SAAS;EAC7B;EAEA,OAAOF,YAAY;AACvB,CAAC;AAACK,OAAA,CAAAN,eAAA,GAAAA,eAAA;AAEK,MAAMO,eAAe,GAAGA,CAAA,KAAM;EACjC,IAAIN,YAAY;EAEhB,MAAM;IAAEC,eAAe;IAAEC,SAAS;IAAEC;EAAa,CAAC,GAAG,IAAAI,2BAAgB,EAAC,CAAC;EACvEP,YAAY,GAAGG,YAAY;EAE3B,IAAIF,eAAe,EAAE;IACjBD,YAAY,IAAIC,eAAe;EACnC;EAEA,IAAIC,SAAS,EAAE;IACXF,YAAY,IAAIE,SAAS;EAC7B;EAEA,OAAOF,YAAY;AACvB,CAAC;AAACK,OAAA,CAAAC,eAAA,GAAAA,eAAA","ignoreList":[]}
|
|
@@ -25,7 +25,7 @@ const PageProvider = _ref => {
|
|
|
25
25
|
runtimeEnvironment
|
|
26
26
|
} = getEnvironment();
|
|
27
27
|
const shouldUsePadding = !shouldRemovePadding && ![RuntimeEnviroment.IntercomPlugin, RuntimeEnviroment.PagemakerPlugin, 6].includes(runtimeEnvironment);
|
|
28
|
-
const usableHeight = useUsableHeight(
|
|
28
|
+
const usableHeight = useUsableHeight();
|
|
29
29
|
return /*#__PURE__*/React.createElement(StyledPageProvider, {
|
|
30
30
|
className: "page-provider",
|
|
31
31
|
$shouldUsePadding: shouldUsePadding,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageProvider.js","names":["getEnvironment","RuntimeEnviroment","React","createGlobalStyle","useUsableHeight","ColorSchemeProvider","StyledPageProvider","GlobalStyle","PageProvider","_ref","children","color","colorMode","cssVariables","secondaryColor","style","designSettings","shouldRemovePadding","shouldUseUsableHeight","runtimeEnvironment","shouldUsePadding","IntercomPlugin","PagemakerPlugin","includes","usableHeight","createElement","className","$shouldUsePadding","$usableHeight","undefined","height","displayName"],"sources":["../../../../src/components/page-provider/PageProvider.tsx"],"sourcesContent":["import { getEnvironment, RuntimeEnviroment } from 'chayns-api';\nimport React, { FC } from 'react';\nimport { createGlobalStyle } from 'styled-components';\nimport { useUsableHeight } from '../../utils/pageProvider';\nimport ColorSchemeProvider, {\n type ColorSchemeProviderProps,\n} from '../color-scheme-provider/ColorSchemeProvider';\nimport { StyledPageProvider } from './PageProvider.styles';\n\ninterface PageProviderProps extends ColorSchemeProviderProps {\n /**\n * Whether the padding should be removed.\n */\n shouldRemovePadding?: boolean;\n /**\n * Whether the usable height should be used.\n */\n shouldUseUsableHeight?: boolean;\n}\n\nconst GlobalStyle = createGlobalStyle`\n *, *::before, *::after {\n box-sizing: border-box;\n }\n`;\n\nconst PageProvider: FC<PageProviderProps> = ({\n children,\n color,\n colorMode,\n cssVariables = {},\n secondaryColor,\n style = {},\n designSettings,\n shouldRemovePadding,\n shouldUseUsableHeight,\n}) => {\n const { runtimeEnvironment } = getEnvironment();\n const shouldUsePadding =\n !shouldRemovePadding &&\n ![RuntimeEnviroment.IntercomPlugin, RuntimeEnviroment.PagemakerPlugin, 6].includes(\n runtimeEnvironment as number,\n );\n\n const usableHeight = useUsableHeight(
|
|
1
|
+
{"version":3,"file":"PageProvider.js","names":["getEnvironment","RuntimeEnviroment","React","createGlobalStyle","useUsableHeight","ColorSchemeProvider","StyledPageProvider","GlobalStyle","PageProvider","_ref","children","color","colorMode","cssVariables","secondaryColor","style","designSettings","shouldRemovePadding","shouldUseUsableHeight","runtimeEnvironment","shouldUsePadding","IntercomPlugin","PagemakerPlugin","includes","usableHeight","createElement","className","$shouldUsePadding","$usableHeight","undefined","height","displayName"],"sources":["../../../../src/components/page-provider/PageProvider.tsx"],"sourcesContent":["import { getEnvironment, RuntimeEnviroment } from 'chayns-api';\nimport React, { FC } from 'react';\nimport { createGlobalStyle } from 'styled-components';\nimport { useUsableHeight } from '../../utils/pageProvider';\nimport ColorSchemeProvider, {\n type ColorSchemeProviderProps,\n} from '../color-scheme-provider/ColorSchemeProvider';\nimport { StyledPageProvider } from './PageProvider.styles';\n\ninterface PageProviderProps extends ColorSchemeProviderProps {\n /**\n * Whether the padding should be removed.\n */\n shouldRemovePadding?: boolean;\n /**\n * Whether the usable height should be used.\n */\n shouldUseUsableHeight?: boolean;\n}\n\nconst GlobalStyle = createGlobalStyle`\n *, *::before, *::after {\n box-sizing: border-box;\n }\n`;\n\nconst PageProvider: FC<PageProviderProps> = ({\n children,\n color,\n colorMode,\n cssVariables = {},\n secondaryColor,\n style = {},\n designSettings,\n shouldRemovePadding,\n shouldUseUsableHeight,\n}) => {\n const { runtimeEnvironment } = getEnvironment();\n const shouldUsePadding =\n !shouldRemovePadding &&\n ![RuntimeEnviroment.IntercomPlugin, RuntimeEnviroment.PagemakerPlugin, 6].includes(\n runtimeEnvironment as number,\n );\n\n const usableHeight = useUsableHeight();\n\n return (\n <StyledPageProvider\n className=\"page-provider\"\n $shouldUsePadding={shouldUsePadding}\n $usableHeight={shouldUseUsableHeight ? usableHeight : undefined}\n >\n <ColorSchemeProvider\n color={color}\n secondaryColor={secondaryColor}\n colorMode={colorMode}\n style={shouldUseUsableHeight ? { ...style, height: '100%' } : style}\n designSettings={designSettings}\n cssVariables={cssVariables}\n >\n {children}\n </ColorSchemeProvider>\n <GlobalStyle />\n </StyledPageProvider>\n );\n};\nPageProvider.displayName = 'PageProvider';\n\nexport default PageProvider;\n"],"mappings":"AAAA,SAASA,cAAc,EAAEC,iBAAiB,QAAQ,YAAY;AAC9D,OAAOC,KAAK,MAAc,OAAO;AACjC,SAASC,iBAAiB,QAAQ,mBAAmB;AACrD,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,OAAOC,mBAAmB,MAEnB,8CAA8C;AACrD,SAASC,kBAAkB,QAAQ,uBAAuB;AAa1D,MAAMC,WAAW,GAAGJ,iBAAiB;AACrC;AACA;AACA;AACA,CAAC;AAED,MAAMK,YAAmC,GAAGC,IAAA,IAUtC;EAAA,IAVuC;IACzCC,QAAQ;IACRC,KAAK;IACLC,SAAS;IACTC,YAAY,GAAG,CAAC,CAAC;IACjBC,cAAc;IACdC,KAAK,GAAG,CAAC,CAAC;IACVC,cAAc;IACdC,mBAAmB;IACnBC;EACJ,CAAC,GAAAT,IAAA;EACG,MAAM;IAAEU;EAAmB,CAAC,GAAGnB,cAAc,CAAC,CAAC;EAC/C,MAAMoB,gBAAgB,GAClB,CAACH,mBAAmB,IACpB,CAAC,CAAChB,iBAAiB,CAACoB,cAAc,EAAEpB,iBAAiB,CAACqB,eAAe,EAAE,CAAC,CAAC,CAACC,QAAQ,CAC9EJ,kBACJ,CAAC;EAEL,MAAMK,YAAY,GAAGpB,eAAe,CAAC,CAAC;EAEtC,oBACIF,KAAA,CAAAuB,aAAA,CAACnB,kBAAkB;IACfoB,SAAS,EAAC,eAAe;IACzBC,iBAAiB,EAAEP,gBAAiB;IACpCQ,aAAa,EAAEV,qBAAqB,GAAGM,YAAY,GAAGK;EAAU,gBAEhE3B,KAAA,CAAAuB,aAAA,CAACpB,mBAAmB;IAChBM,KAAK,EAAEA,KAAM;IACbG,cAAc,EAAEA,cAAe;IAC/BF,SAAS,EAAEA,SAAU;IACrBG,KAAK,EAAEG,qBAAqB,GAAG;MAAE,GAAGH,KAAK;MAAEe,MAAM,EAAE;IAAO,CAAC,GAAGf,KAAM;IACpEC,cAAc,EAAEA,cAAe;IAC/BH,YAAY,EAAEA;EAAa,GAE1BH,QACgB,CAAC,eACtBR,KAAA,CAAAuB,aAAA,CAAClB,WAAW,MAAE,CACE,CAAC;AAE7B,CAAC;AACDC,YAAY,CAACuB,WAAW,GAAG,cAAc;AAEzC,eAAevB,YAAY","ignoreList":[]}
|
|
@@ -1,81 +1,12 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
export const getPagePadding = () => {
|
|
4
|
-
const {
|
|
5
|
-
runtimeEnvironment
|
|
6
|
-
} = getEnvironment();
|
|
7
|
-
if (typeof runtimeEnvironment === 'number' && [4, 5].includes(runtimeEnvironment)) {
|
|
8
|
-
return '0';
|
|
9
|
-
}
|
|
10
|
-
if (matchMedia(PAGE_BREAKPOINTS.desktop).matches) {
|
|
11
|
-
return '35px 43px 30px';
|
|
12
|
-
}
|
|
13
|
-
return '15px 10px 20px';
|
|
14
|
-
};
|
|
15
|
-
const getPageProviderInformation = () => {
|
|
16
|
-
const padding = getPagePadding().split(' ');
|
|
17
|
-
const parseValue = value => {
|
|
18
|
-
const parsed = parseInt(value.replace('px', ''), 10);
|
|
19
|
-
return Number.isNaN(parsed) ? 0 : parsed;
|
|
20
|
-
};
|
|
21
|
-
if (padding.length === 1) {
|
|
22
|
-
const value = parseValue(padding[0] ?? '');
|
|
23
|
-
return {
|
|
24
|
-
top: value,
|
|
25
|
-
right: value,
|
|
26
|
-
bottom: value,
|
|
27
|
-
left: value
|
|
28
|
-
};
|
|
29
|
-
}
|
|
30
|
-
if (padding.length === 2) {
|
|
31
|
-
const [vertical, horizontal] = padding.map(parseValue);
|
|
32
|
-
return {
|
|
33
|
-
top: vertical ?? 0,
|
|
34
|
-
right: horizontal ?? 0,
|
|
35
|
-
bottom: vertical ?? 0,
|
|
36
|
-
left: horizontal ?? 0
|
|
37
|
-
};
|
|
38
|
-
}
|
|
39
|
-
if (padding.length === 3) {
|
|
40
|
-
const [top, horizontal, bottom] = padding.map(parseValue);
|
|
41
|
-
return {
|
|
42
|
-
top: top ?? 0,
|
|
43
|
-
right: horizontal ?? 0,
|
|
44
|
-
bottom: bottom ?? 0,
|
|
45
|
-
left: horizontal ?? 0
|
|
46
|
-
};
|
|
47
|
-
}
|
|
48
|
-
if (padding.length === 4) {
|
|
49
|
-
const [top, right, bottom, left] = padding.map(parseValue);
|
|
50
|
-
return {
|
|
51
|
-
top: top ?? 0,
|
|
52
|
-
right: right ?? 0,
|
|
53
|
-
bottom: bottom ?? 0,
|
|
54
|
-
left: left ?? 0
|
|
55
|
-
};
|
|
56
|
-
}
|
|
57
|
-
return {
|
|
58
|
-
top: 0,
|
|
59
|
-
right: 0,
|
|
60
|
-
bottom: 0,
|
|
61
|
-
left: 0
|
|
62
|
-
};
|
|
63
|
-
};
|
|
64
|
-
export const getUsableHeight = async shouldRemovePadding => {
|
|
1
|
+
import { getWindowMetrics, useWindowMetrics } from 'chayns-api';
|
|
2
|
+
export const getUsableHeight = async () => {
|
|
65
3
|
let usableHeight;
|
|
66
4
|
const {
|
|
67
5
|
bottomBarHeight,
|
|
68
6
|
offsetTop,
|
|
69
7
|
windowHeight
|
|
70
8
|
} = await getWindowMetrics();
|
|
71
|
-
|
|
72
|
-
bottom,
|
|
73
|
-
top
|
|
74
|
-
} = shouldRemovePadding ? {
|
|
75
|
-
bottom: 0,
|
|
76
|
-
top: 0
|
|
77
|
-
} : getPageProviderInformation();
|
|
78
|
-
usableHeight = windowHeight - bottom - top;
|
|
9
|
+
usableHeight = windowHeight;
|
|
79
10
|
if (bottomBarHeight) {
|
|
80
11
|
usableHeight -= bottomBarHeight;
|
|
81
12
|
}
|
|
@@ -84,21 +15,14 @@ export const getUsableHeight = async shouldRemovePadding => {
|
|
|
84
15
|
}
|
|
85
16
|
return usableHeight;
|
|
86
17
|
};
|
|
87
|
-
export const useUsableHeight =
|
|
18
|
+
export const useUsableHeight = () => {
|
|
88
19
|
let usableHeight;
|
|
89
20
|
const {
|
|
90
21
|
bottomBarHeight,
|
|
91
22
|
offsetTop,
|
|
92
23
|
windowHeight
|
|
93
24
|
} = useWindowMetrics();
|
|
94
|
-
|
|
95
|
-
bottom,
|
|
96
|
-
top
|
|
97
|
-
} = shouldRemovePadding ? {
|
|
98
|
-
bottom: 0,
|
|
99
|
-
top: 0
|
|
100
|
-
} : getPageProviderInformation();
|
|
101
|
-
usableHeight = windowHeight - bottom - top;
|
|
25
|
+
usableHeight = windowHeight;
|
|
102
26
|
if (bottomBarHeight) {
|
|
103
27
|
usableHeight -= bottomBarHeight;
|
|
104
28
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pageProvider.js","names":["
|
|
1
|
+
{"version":3,"file":"pageProvider.js","names":["getWindowMetrics","useWindowMetrics","getUsableHeight","usableHeight","bottomBarHeight","offsetTop","windowHeight","useUsableHeight"],"sources":["../../../src/utils/pageProvider.ts"],"sourcesContent":["import { getWindowMetrics, useWindowMetrics } from 'chayns-api';\n\nexport const getUsableHeight = async () => {\n let usableHeight;\n\n const { bottomBarHeight, offsetTop, windowHeight } = await getWindowMetrics();\n\n usableHeight = windowHeight;\n\n if (bottomBarHeight) {\n usableHeight -= bottomBarHeight;\n }\n\n if (offsetTop) {\n usableHeight -= offsetTop;\n }\n\n return usableHeight;\n};\n\nexport const useUsableHeight = () => {\n let usableHeight;\n\n const { bottomBarHeight, offsetTop, windowHeight } = useWindowMetrics();\n usableHeight = windowHeight;\n\n if (bottomBarHeight) {\n usableHeight -= bottomBarHeight;\n }\n\n if (offsetTop) {\n usableHeight -= offsetTop;\n }\n\n return usableHeight;\n};\n"],"mappings":"AAAA,SAASA,gBAAgB,EAAEC,gBAAgB,QAAQ,YAAY;AAE/D,OAAO,MAAMC,eAAe,GAAG,MAAAA,CAAA,KAAY;EACvC,IAAIC,YAAY;EAEhB,MAAM;IAAEC,eAAe;IAAEC,SAAS;IAAEC;EAAa,CAAC,GAAG,MAAMN,gBAAgB,CAAC,CAAC;EAE7EG,YAAY,GAAGG,YAAY;EAE3B,IAAIF,eAAe,EAAE;IACjBD,YAAY,IAAIC,eAAe;EACnC;EAEA,IAAIC,SAAS,EAAE;IACXF,YAAY,IAAIE,SAAS;EAC7B;EAEA,OAAOF,YAAY;AACvB,CAAC;AAED,OAAO,MAAMI,eAAe,GAAGA,CAAA,KAAM;EACjC,IAAIJ,YAAY;EAEhB,MAAM;IAAEC,eAAe;IAAEC,SAAS;IAAEC;EAAa,CAAC,GAAGL,gBAAgB,CAAC,CAAC;EACvEE,YAAY,GAAGG,YAAY;EAE3B,IAAIF,eAAe,EAAE;IACjBD,YAAY,IAAIC,eAAe;EACnC;EAEA,IAAIC,SAAS,EAAE;IACXF,YAAY,IAAIE,SAAS;EAC7B;EAEA,OAAOF,YAAY;AACvB,CAAC","ignoreList":[]}
|
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
export declare const
|
|
2
|
-
export declare const
|
|
3
|
-
export declare const useUsableHeight: (shouldRemovePadding?: boolean) => number;
|
|
1
|
+
export declare const getUsableHeight: () => Promise<number>;
|
|
2
|
+
export declare const useUsableHeight: () => number;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/core",
|
|
3
|
-
"version": "5.0.0-beta.
|
|
3
|
+
"version": "5.0.0-beta.992",
|
|
4
4
|
"description": "A set of beautiful React components for developing your own applications with chayns.",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"browserslist": [
|
|
@@ -87,5 +87,5 @@
|
|
|
87
87
|
"publishConfig": {
|
|
88
88
|
"access": "public"
|
|
89
89
|
},
|
|
90
|
-
"gitHead": "
|
|
90
|
+
"gitHead": "9c7ff0545e285c85e242074da863cdb599d2e2c7"
|
|
91
91
|
}
|