react-alp-connection-state 6.0.1 → 6.1.1
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/CHANGELOG.md +22 -0
- package/dist/index-browser.cjs.js +111 -0
- package/dist/index-browser.cjs.js.map +1 -0
- package/dist/index-browser.es.js +0 -4
- package/dist/index-browser.es.js.map +1 -1
- package/dist/index-browsermodern.es.js +0 -4
- package/dist/index-browsermodern.es.js.map +1 -1
- package/dist/index-node14.cjs +107 -0
- package/dist/index-node14.cjs.map +1 -0
- package/dist/index-node14.mjs +0 -4
- package/dist/index-node14.mjs.map +1 -1
- package/dist/index.d.ts.map +1 -1
- package/package.json +10 -6
- package/src/index.tsx +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,28 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [6.1.1](https://github.com/christophehurpeau/alp/compare/react-alp-connection-state@6.1.0...react-alp-connection-state@6.1.1) (2022-10-13)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* **react-alp-connection-state:** remove console.log ([cf4af9e](https://github.com/christophehurpeau/alp/commit/cf4af9e31071039fe30ab16e9e7adb7cf967832c))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
# [6.1.0](https://github.com/christophehurpeau/alp/compare/react-alp-connection-state@6.0.1...react-alp-connection-state@6.1.0) (2022-03-05)
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
### Features
|
|
21
|
+
|
|
22
|
+
* **react-alp-connection-state:** create cjs version ([8171bc6](https://github.com/christophehurpeau/alp/commit/8171bc62dd38810679ff5297a054e80459d96881))
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
6
28
|
## [6.0.1](https://github.com/christophehurpeau/alp/compare/react-alp-connection-state@6.0.0...react-alp-connection-state@6.0.1) (2022-02-20)
|
|
7
29
|
|
|
8
30
|
**Note:** Version bump only for package react-alp-connection-state
|
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var react = require('react');
|
|
6
|
+
var reactNative = require('react-native');
|
|
7
|
+
var jsxRuntime_js = require('react/jsx-runtime.js');
|
|
8
|
+
|
|
9
|
+
var defaultTheme = {
|
|
10
|
+
container: {
|
|
11
|
+
backgroundColor: 'rgba(247, 25, 0, 0.8)',
|
|
12
|
+
color: '#fff',
|
|
13
|
+
textShadowColor: '#111',
|
|
14
|
+
textShadowOffset: {
|
|
15
|
+
width: 0,
|
|
16
|
+
height: -1
|
|
17
|
+
},
|
|
18
|
+
textShadowRadius: 1
|
|
19
|
+
},
|
|
20
|
+
backgroundColorConnected: 'rgba(25, 200, 60, 0.8)'
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
var useCreateCalcNative = function useCreateCalcNative() {
|
|
24
|
+
var dimensions = reactNative.useWindowDimensions();
|
|
25
|
+
return function (webCalc, createCalc) {
|
|
26
|
+
return createCalc(dimensions);
|
|
27
|
+
};
|
|
28
|
+
};
|
|
29
|
+
|
|
30
|
+
var useCreateCalcWeb = function useCreateCalcWeb() {
|
|
31
|
+
return function (webCalc) {
|
|
32
|
+
return "calc(" + webCalc + ")";
|
|
33
|
+
};
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
var useCreateCalc = reactNative.Platform.OS === 'web' ? useCreateCalcWeb : useCreateCalcNative; // example: const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100);
|
|
37
|
+
|
|
38
|
+
var styles = reactNative.StyleSheet.create({
|
|
39
|
+
connectionStateContainer: {
|
|
40
|
+
backgroundColor: defaultTheme.container.backgroundColor,
|
|
41
|
+
position: 'absolute',
|
|
42
|
+
top: 0,
|
|
43
|
+
right: 0,
|
|
44
|
+
left: 0,
|
|
45
|
+
height: 2,
|
|
46
|
+
color: defaultTheme.container.color,
|
|
47
|
+
textShadowOffset: defaultTheme.container.textShadowOffset,
|
|
48
|
+
textShadowRadius: defaultTheme.container.textShadowRadius,
|
|
49
|
+
boxShadow: "0 2px 3px 0 rgba(0, 0, 0, 0.15), 0 2px 5px 0 rgba(0, 0, 0, 0.2)",
|
|
50
|
+
zIndex: 9,
|
|
51
|
+
transition: 'top .8s, background-color .2s'
|
|
52
|
+
},
|
|
53
|
+
hide: {
|
|
54
|
+
top: -24
|
|
55
|
+
},
|
|
56
|
+
connectionStateText: {
|
|
57
|
+
backgroundColor: defaultTheme.container.backgroundColor,
|
|
58
|
+
position: 'absolute',
|
|
59
|
+
width: 200,
|
|
60
|
+
height: 22,
|
|
61
|
+
lineHeight: 22,
|
|
62
|
+
top: 2,
|
|
63
|
+
textAlign: 'center',
|
|
64
|
+
borderBottomLeftRadius: 5,
|
|
65
|
+
borderBottomRightRadius: 5,
|
|
66
|
+
transition: 'background-color .2s'
|
|
67
|
+
}
|
|
68
|
+
});
|
|
69
|
+
function ConnectionState(_ref) {
|
|
70
|
+
var theme = _ref.theme,
|
|
71
|
+
forceHidden = _ref.forceHidden,
|
|
72
|
+
state = _ref.state,
|
|
73
|
+
children = _ref.children;
|
|
74
|
+
var unloadingRef = react.useRef(false);
|
|
75
|
+
var createCalc = useCreateCalc();
|
|
76
|
+
var left = createCalc('50% - 100px', function (_ref2) {
|
|
77
|
+
var width = _ref2.width;
|
|
78
|
+
return width / 2 - 100;
|
|
79
|
+
}); // TODO use calc() in web ?
|
|
80
|
+
|
|
81
|
+
react.useEffect(function () {
|
|
82
|
+
if (typeof window === 'undefined') return;
|
|
83
|
+
|
|
84
|
+
var beforeUnloadHandler = function beforeUnloadHandler() {
|
|
85
|
+
unloadingRef.current = true;
|
|
86
|
+
};
|
|
87
|
+
|
|
88
|
+
window.addEventListener('beforeunload', beforeUnloadHandler);
|
|
89
|
+
return function () {
|
|
90
|
+
window.removeEventListener('beforeunload', beforeUnloadHandler);
|
|
91
|
+
};
|
|
92
|
+
}, []);
|
|
93
|
+
return /*#__PURE__*/jsxRuntime_js.jsx(reactNative.View, {
|
|
94
|
+
style: [styles.connectionStateContainer, (forceHidden || !state || state === 'connected') && styles.hide, theme == null ? void 0 : theme.container, state === 'connected' && {
|
|
95
|
+
backgroundColor: (theme || defaultTheme).backgroundColorConnected
|
|
96
|
+
}],
|
|
97
|
+
children: !state ? null : /*#__PURE__*/jsxRuntime_js.jsx(reactNative.View, {
|
|
98
|
+
style: [styles.connectionStateText, theme && {
|
|
99
|
+
backgroundColor: theme.container.backgroundColor
|
|
100
|
+
}, state === 'connected' && {
|
|
101
|
+
backgroundColor: (theme || defaultTheme).backgroundColorConnected
|
|
102
|
+
}, {
|
|
103
|
+
left: left
|
|
104
|
+
}],
|
|
105
|
+
children: children
|
|
106
|
+
})
|
|
107
|
+
});
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
exports.ConnectionState = ConnectionState;
|
|
111
|
+
//# sourceMappingURL=index-browser.cjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index-browser.cjs.js","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport { useEffect, useRef } from 'react';\nimport type { ScaledSize } from 'react-native';\nimport { View, StyleSheet, Platform, useWindowDimensions } from 'react-native';\n\nconst defaultTheme = {\n container: {\n backgroundColor: 'rgba(247, 25, 0, 0.8)',\n color: '#fff',\n textShadowColor: '#111',\n textShadowOffset: { width: 0, height: -1 },\n textShadowRadius: 1,\n },\n backgroundColorConnected: 'rgba(25, 200, 60, 0.8)',\n};\n\nexport type ConnectionStateTheme = typeof defaultTheme;\nexport type State = null | 'connecting' | 'connected' | 'disconnected';\n\nexport interface ConnectionStateProps {\n theme?: ConnectionStateTheme;\n forceHidden?: boolean;\n state: State;\n children: NonNullable<ReactNode>;\n}\n\nconst zDepth1 =\n '0 2px 3px 0 rgba(0, 0, 0, 0.15), 0 2px 5px 0 rgba(0, 0, 0, 0.2)';\n\ntype CreateCalc = (\n webCalc: string,\n createCalc: (dimensions: ScaledSize) => number,\n) => string | number;\n\nconst useCreateCalcNative = (): CreateCalc => {\n const dimensions = useWindowDimensions();\n return (webCalc, createCalc) => createCalc(dimensions);\n};\nconst useCreateCalcWeb = (): CreateCalc => {\n return (webCalc) => `calc(${webCalc})`;\n};\nconst useCreateCalc =\n Platform.OS === 'web' ? useCreateCalcWeb : useCreateCalcNative;\n\n// example: const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100);\n\nconst styles = StyleSheet.create({\n connectionStateContainer: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n top: 0,\n right: 0,\n left: 0,\n height: 2,\n color: defaultTheme.container.color,\n textShadowOffset: defaultTheme.container.textShadowOffset,\n textShadowRadius: defaultTheme.container.textShadowRadius,\n boxShadow: zDepth1,\n zIndex: 9,\n transition: 'top .8s, background-color .2s',\n },\n hide: {\n top: -24,\n },\n connectionStateText: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n width: 200,\n height: 22,\n lineHeight: 22,\n top: 2,\n textAlign: 'center',\n borderBottomLeftRadius: 5,\n borderBottomRightRadius: 5,\n transition: 'background-color .2s',\n },\n});\n\nexport function ConnectionState({\n theme,\n forceHidden,\n state,\n children,\n}: ConnectionStateProps): ReactElement | null {\n const unloadingRef = useRef<boolean>(false);\n\n const createCalc = useCreateCalc();\n const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100); // TODO use calc() in web ?\n\n useEffect((): (() => void) | undefined => {\n if (typeof window === 'undefined') return;\n\n const beforeUnloadHandler = (): void => {\n unloadingRef.current = true;\n };\n window.addEventListener('beforeunload', beforeUnloadHandler);\n\n return (): void => {\n window.removeEventListener('beforeunload', beforeUnloadHandler);\n };\n }, []);\n\n const shouldHide = forceHidden || !state || state === 'connected';\n\n return (\n <View\n style={[\n styles.connectionStateContainer,\n shouldHide && styles.hide,\n theme?.container,\n state === 'connected' && {\n backgroundColor: (theme || defaultTheme).backgroundColorConnected,\n },\n ]}\n >\n {!state ? null : (\n <View\n style={[\n styles.connectionStateText,\n theme && { backgroundColor: theme.container.backgroundColor },\n state === 'connected' && {\n backgroundColor: (theme || defaultTheme).backgroundColorConnected,\n },\n { left },\n ]}\n >\n {children}\n </View>\n )}\n </View>\n );\n}\n"],"names":["defaultTheme","container","backgroundColor","color","textShadowColor","textShadowOffset","width","height","textShadowRadius","backgroundColorConnected","useCreateCalcNative","dimensions","useWindowDimensions","webCalc","createCalc","useCreateCalcWeb","useCreateCalc","Platform","OS","styles","StyleSheet","create","connectionStateContainer","position","top","right","left","boxShadow","zIndex","transition","hide","connectionStateText","lineHeight","textAlign","borderBottomLeftRadius","borderBottomRightRadius","ConnectionState","theme","forceHidden","state","children","unloadingRef","useRef","useEffect","window","beforeUnloadHandler","current","addEventListener","removeEventListener","_jsx","View"],"mappings":"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"}
|
package/dist/index-browser.es.js
CHANGED
|
@@ -67,10 +67,6 @@ function ConnectionState(_ref) {
|
|
|
67
67
|
forceHidden = _ref.forceHidden,
|
|
68
68
|
state = _ref.state,
|
|
69
69
|
children = _ref.children;
|
|
70
|
-
console.log({
|
|
71
|
-
state: state,
|
|
72
|
-
forceHidden: forceHidden
|
|
73
|
-
});
|
|
74
70
|
var unloadingRef = useRef(false);
|
|
75
71
|
var createCalc = useCreateCalc();
|
|
76
72
|
var left = createCalc('50% - 100px', function (_ref2) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index-browser.es.js","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport { useEffect, useRef } from 'react';\nimport type { ScaledSize } from 'react-native';\nimport { View, StyleSheet, Platform, useWindowDimensions } from 'react-native';\n\nconst defaultTheme = {\n container: {\n backgroundColor: 'rgba(247, 25, 0, 0.8)',\n color: '#fff',\n textShadowColor: '#111',\n textShadowOffset: { width: 0, height: -1 },\n textShadowRadius: 1,\n },\n backgroundColorConnected: 'rgba(25, 200, 60, 0.8)',\n};\n\nexport type ConnectionStateTheme = typeof defaultTheme;\nexport type State = null | 'connecting' | 'connected' | 'disconnected';\n\nexport interface ConnectionStateProps {\n theme?: ConnectionStateTheme;\n forceHidden?: boolean;\n state: State;\n children: NonNullable<ReactNode>;\n}\n\nconst zDepth1 =\n '0 2px 3px 0 rgba(0, 0, 0, 0.15), 0 2px 5px 0 rgba(0, 0, 0, 0.2)';\n\ntype CreateCalc = (\n webCalc: string,\n createCalc: (dimensions: ScaledSize) => number,\n) => string | number;\n\nconst useCreateCalcNative = (): CreateCalc => {\n const dimensions = useWindowDimensions();\n return (webCalc, createCalc) => createCalc(dimensions);\n};\nconst useCreateCalcWeb = (): CreateCalc => {\n return (webCalc) => `calc(${webCalc})`;\n};\nconst useCreateCalc =\n Platform.OS === 'web' ? useCreateCalcWeb : useCreateCalcNative;\n\n// example: const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100);\n\nconst styles = StyleSheet.create({\n connectionStateContainer: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n top: 0,\n right: 0,\n left: 0,\n height: 2,\n color: defaultTheme.container.color,\n textShadowOffset: defaultTheme.container.textShadowOffset,\n textShadowRadius: defaultTheme.container.textShadowRadius,\n boxShadow: zDepth1,\n zIndex: 9,\n transition: 'top .8s, background-color .2s',\n },\n hide: {\n top: -24,\n },\n connectionStateText: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n width: 200,\n height: 22,\n lineHeight: 22,\n top: 2,\n textAlign: 'center',\n borderBottomLeftRadius: 5,\n borderBottomRightRadius: 5,\n transition: 'background-color .2s',\n },\n});\n\nexport function ConnectionState({\n theme,\n forceHidden,\n state,\n children,\n}: ConnectionStateProps): ReactElement | null {\n
|
|
1
|
+
{"version":3,"file":"index-browser.es.js","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport { useEffect, useRef } from 'react';\nimport type { ScaledSize } from 'react-native';\nimport { View, StyleSheet, Platform, useWindowDimensions } from 'react-native';\n\nconst defaultTheme = {\n container: {\n backgroundColor: 'rgba(247, 25, 0, 0.8)',\n color: '#fff',\n textShadowColor: '#111',\n textShadowOffset: { width: 0, height: -1 },\n textShadowRadius: 1,\n },\n backgroundColorConnected: 'rgba(25, 200, 60, 0.8)',\n};\n\nexport type ConnectionStateTheme = typeof defaultTheme;\nexport type State = null | 'connecting' | 'connected' | 'disconnected';\n\nexport interface ConnectionStateProps {\n theme?: ConnectionStateTheme;\n forceHidden?: boolean;\n state: State;\n children: NonNullable<ReactNode>;\n}\n\nconst zDepth1 =\n '0 2px 3px 0 rgba(0, 0, 0, 0.15), 0 2px 5px 0 rgba(0, 0, 0, 0.2)';\n\ntype CreateCalc = (\n webCalc: string,\n createCalc: (dimensions: ScaledSize) => number,\n) => string | number;\n\nconst useCreateCalcNative = (): CreateCalc => {\n const dimensions = useWindowDimensions();\n return (webCalc, createCalc) => createCalc(dimensions);\n};\nconst useCreateCalcWeb = (): CreateCalc => {\n return (webCalc) => `calc(${webCalc})`;\n};\nconst useCreateCalc =\n Platform.OS === 'web' ? useCreateCalcWeb : useCreateCalcNative;\n\n// example: const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100);\n\nconst styles = StyleSheet.create({\n connectionStateContainer: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n top: 0,\n right: 0,\n left: 0,\n height: 2,\n color: defaultTheme.container.color,\n textShadowOffset: defaultTheme.container.textShadowOffset,\n textShadowRadius: defaultTheme.container.textShadowRadius,\n boxShadow: zDepth1,\n zIndex: 9,\n transition: 'top .8s, background-color .2s',\n },\n hide: {\n top: -24,\n },\n connectionStateText: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n width: 200,\n height: 22,\n lineHeight: 22,\n top: 2,\n textAlign: 'center',\n borderBottomLeftRadius: 5,\n borderBottomRightRadius: 5,\n transition: 'background-color .2s',\n },\n});\n\nexport function ConnectionState({\n theme,\n forceHidden,\n state,\n children,\n}: ConnectionStateProps): ReactElement | null {\n const unloadingRef = useRef<boolean>(false);\n\n const createCalc = useCreateCalc();\n const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100); // TODO use calc() in web ?\n\n useEffect((): (() => void) | undefined => {\n if (typeof window === 'undefined') return;\n\n const beforeUnloadHandler = (): void => {\n unloadingRef.current = true;\n };\n window.addEventListener('beforeunload', beforeUnloadHandler);\n\n return (): void => {\n window.removeEventListener('beforeunload', beforeUnloadHandler);\n };\n }, []);\n\n const shouldHide = forceHidden || !state || state === 'connected';\n\n return (\n <View\n style={[\n styles.connectionStateContainer,\n shouldHide && styles.hide,\n theme?.container,\n state === 'connected' && {\n backgroundColor: (theme || defaultTheme).backgroundColorConnected,\n },\n ]}\n >\n {!state ? null : (\n <View\n style={[\n styles.connectionStateText,\n theme && { backgroundColor: theme.container.backgroundColor },\n state === 'connected' && {\n backgroundColor: (theme || defaultTheme).backgroundColorConnected,\n },\n { left },\n ]}\n >\n {children}\n </View>\n )}\n </View>\n );\n}\n"],"names":["defaultTheme","container","backgroundColor","color","textShadowColor","textShadowOffset","width","height","textShadowRadius","backgroundColorConnected","useCreateCalcNative","dimensions","useWindowDimensions","webCalc","createCalc","useCreateCalcWeb","useCreateCalc","Platform","OS","styles","StyleSheet","create","connectionStateContainer","position","top","right","left","boxShadow","zIndex","transition","hide","connectionStateText","lineHeight","textAlign","borderBottomLeftRadius","borderBottomRightRadius","ConnectionState","theme","forceHidden","state","children","unloadingRef","useRef","useEffect","window","beforeUnloadHandler","current","addEventListener","removeEventListener","_jsx"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index-browsermodern.es.js","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport { useEffect, useRef } from 'react';\nimport type { ScaledSize } from 'react-native';\nimport { View, StyleSheet, Platform, useWindowDimensions } from 'react-native';\n\nconst defaultTheme = {\n container: {\n backgroundColor: 'rgba(247, 25, 0, 0.8)',\n color: '#fff',\n textShadowColor: '#111',\n textShadowOffset: { width: 0, height: -1 },\n textShadowRadius: 1,\n },\n backgroundColorConnected: 'rgba(25, 200, 60, 0.8)',\n};\n\nexport type ConnectionStateTheme = typeof defaultTheme;\nexport type State = null | 'connecting' | 'connected' | 'disconnected';\n\nexport interface ConnectionStateProps {\n theme?: ConnectionStateTheme;\n forceHidden?: boolean;\n state: State;\n children: NonNullable<ReactNode>;\n}\n\nconst zDepth1 =\n '0 2px 3px 0 rgba(0, 0, 0, 0.15), 0 2px 5px 0 rgba(0, 0, 0, 0.2)';\n\ntype CreateCalc = (\n webCalc: string,\n createCalc: (dimensions: ScaledSize) => number,\n) => string | number;\n\nconst useCreateCalcNative = (): CreateCalc => {\n const dimensions = useWindowDimensions();\n return (webCalc, createCalc) => createCalc(dimensions);\n};\nconst useCreateCalcWeb = (): CreateCalc => {\n return (webCalc) => `calc(${webCalc})`;\n};\nconst useCreateCalc =\n Platform.OS === 'web' ? useCreateCalcWeb : useCreateCalcNative;\n\n// example: const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100);\n\nconst styles = StyleSheet.create({\n connectionStateContainer: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n top: 0,\n right: 0,\n left: 0,\n height: 2,\n color: defaultTheme.container.color,\n textShadowOffset: defaultTheme.container.textShadowOffset,\n textShadowRadius: defaultTheme.container.textShadowRadius,\n boxShadow: zDepth1,\n zIndex: 9,\n transition: 'top .8s, background-color .2s',\n },\n hide: {\n top: -24,\n },\n connectionStateText: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n width: 200,\n height: 22,\n lineHeight: 22,\n top: 2,\n textAlign: 'center',\n borderBottomLeftRadius: 5,\n borderBottomRightRadius: 5,\n transition: 'background-color .2s',\n },\n});\n\nexport function ConnectionState({\n theme,\n forceHidden,\n state,\n children,\n}: ConnectionStateProps): ReactElement | null {\n
|
|
1
|
+
{"version":3,"file":"index-browsermodern.es.js","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport { useEffect, useRef } from 'react';\nimport type { ScaledSize } from 'react-native';\nimport { View, StyleSheet, Platform, useWindowDimensions } from 'react-native';\n\nconst defaultTheme = {\n container: {\n backgroundColor: 'rgba(247, 25, 0, 0.8)',\n color: '#fff',\n textShadowColor: '#111',\n textShadowOffset: { width: 0, height: -1 },\n textShadowRadius: 1,\n },\n backgroundColorConnected: 'rgba(25, 200, 60, 0.8)',\n};\n\nexport type ConnectionStateTheme = typeof defaultTheme;\nexport type State = null | 'connecting' | 'connected' | 'disconnected';\n\nexport interface ConnectionStateProps {\n theme?: ConnectionStateTheme;\n forceHidden?: boolean;\n state: State;\n children: NonNullable<ReactNode>;\n}\n\nconst zDepth1 =\n '0 2px 3px 0 rgba(0, 0, 0, 0.15), 0 2px 5px 0 rgba(0, 0, 0, 0.2)';\n\ntype CreateCalc = (\n webCalc: string,\n createCalc: (dimensions: ScaledSize) => number,\n) => string | number;\n\nconst useCreateCalcNative = (): CreateCalc => {\n const dimensions = useWindowDimensions();\n return (webCalc, createCalc) => createCalc(dimensions);\n};\nconst useCreateCalcWeb = (): CreateCalc => {\n return (webCalc) => `calc(${webCalc})`;\n};\nconst useCreateCalc =\n Platform.OS === 'web' ? useCreateCalcWeb : useCreateCalcNative;\n\n// example: const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100);\n\nconst styles = StyleSheet.create({\n connectionStateContainer: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n top: 0,\n right: 0,\n left: 0,\n height: 2,\n color: defaultTheme.container.color,\n textShadowOffset: defaultTheme.container.textShadowOffset,\n textShadowRadius: defaultTheme.container.textShadowRadius,\n boxShadow: zDepth1,\n zIndex: 9,\n transition: 'top .8s, background-color .2s',\n },\n hide: {\n top: -24,\n },\n connectionStateText: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n width: 200,\n height: 22,\n lineHeight: 22,\n top: 2,\n textAlign: 'center',\n borderBottomLeftRadius: 5,\n borderBottomRightRadius: 5,\n transition: 'background-color .2s',\n },\n});\n\nexport function ConnectionState({\n theme,\n forceHidden,\n state,\n children,\n}: ConnectionStateProps): ReactElement | null {\n const unloadingRef = useRef<boolean>(false);\n\n const createCalc = useCreateCalc();\n const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100); // TODO use calc() in web ?\n\n useEffect((): (() => void) | undefined => {\n if (typeof window === 'undefined') return;\n\n const beforeUnloadHandler = (): void => {\n unloadingRef.current = true;\n };\n window.addEventListener('beforeunload', beforeUnloadHandler);\n\n return (): void => {\n window.removeEventListener('beforeunload', beforeUnloadHandler);\n };\n }, []);\n\n const shouldHide = forceHidden || !state || state === 'connected';\n\n return (\n <View\n style={[\n styles.connectionStateContainer,\n shouldHide && styles.hide,\n theme?.container,\n state === 'connected' && {\n backgroundColor: (theme || defaultTheme).backgroundColorConnected,\n },\n ]}\n >\n {!state ? null : (\n <View\n style={[\n styles.connectionStateText,\n theme && { backgroundColor: theme.container.backgroundColor },\n state === 'connected' && {\n backgroundColor: (theme || defaultTheme).backgroundColorConnected,\n },\n { left },\n ]}\n >\n {children}\n </View>\n )}\n </View>\n );\n}\n"],"names":["defaultTheme","container","backgroundColor","color","textShadowColor","textShadowOffset","width","height","textShadowRadius","backgroundColorConnected","useCreateCalcNative","dimensions","useWindowDimensions","webCalc","createCalc","useCreateCalcWeb","useCreateCalc","Platform","OS","styles","StyleSheet","create","connectionStateContainer","position","top","right","left","boxShadow","zIndex","transition","hide","connectionStateText","lineHeight","textAlign","borderBottomLeftRadius","borderBottomRightRadius","ConnectionState","theme","forceHidden","state","children","unloadingRef","useRef","useEffect","window","beforeUnloadHandler","current","addEventListener","removeEventListener","_jsx"],"mappings":"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"}
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const react = require('react');
|
|
6
|
+
const reactNative = require('react-native');
|
|
7
|
+
const jsxRuntime_js = require('react/jsx-runtime.js');
|
|
8
|
+
|
|
9
|
+
const defaultTheme = {
|
|
10
|
+
container: {
|
|
11
|
+
backgroundColor: 'rgba(247, 25, 0, 0.8)',
|
|
12
|
+
color: '#fff',
|
|
13
|
+
textShadowColor: '#111',
|
|
14
|
+
textShadowOffset: {
|
|
15
|
+
width: 0,
|
|
16
|
+
height: -1
|
|
17
|
+
},
|
|
18
|
+
textShadowRadius: 1
|
|
19
|
+
},
|
|
20
|
+
backgroundColorConnected: 'rgba(25, 200, 60, 0.8)'
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
const useCreateCalcNative = () => {
|
|
24
|
+
const dimensions = reactNative.useWindowDimensions();
|
|
25
|
+
return (webCalc, createCalc) => createCalc(dimensions);
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
const useCreateCalcWeb = () => {
|
|
29
|
+
return webCalc => `calc(${webCalc})`;
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
const useCreateCalc = reactNative.Platform.OS === 'web' ? useCreateCalcWeb : useCreateCalcNative; // example: const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100);
|
|
33
|
+
|
|
34
|
+
const styles = reactNative.StyleSheet.create({
|
|
35
|
+
connectionStateContainer: {
|
|
36
|
+
backgroundColor: defaultTheme.container.backgroundColor,
|
|
37
|
+
position: 'absolute',
|
|
38
|
+
top: 0,
|
|
39
|
+
right: 0,
|
|
40
|
+
left: 0,
|
|
41
|
+
height: 2,
|
|
42
|
+
color: defaultTheme.container.color,
|
|
43
|
+
textShadowOffset: defaultTheme.container.textShadowOffset,
|
|
44
|
+
textShadowRadius: defaultTheme.container.textShadowRadius,
|
|
45
|
+
boxShadow: "0 2px 3px 0 rgba(0, 0, 0, 0.15), 0 2px 5px 0 rgba(0, 0, 0, 0.2)",
|
|
46
|
+
zIndex: 9,
|
|
47
|
+
transition: 'top .8s, background-color .2s'
|
|
48
|
+
},
|
|
49
|
+
hide: {
|
|
50
|
+
top: -24
|
|
51
|
+
},
|
|
52
|
+
connectionStateText: {
|
|
53
|
+
backgroundColor: defaultTheme.container.backgroundColor,
|
|
54
|
+
position: 'absolute',
|
|
55
|
+
width: 200,
|
|
56
|
+
height: 22,
|
|
57
|
+
lineHeight: 22,
|
|
58
|
+
top: 2,
|
|
59
|
+
textAlign: 'center',
|
|
60
|
+
borderBottomLeftRadius: 5,
|
|
61
|
+
borderBottomRightRadius: 5,
|
|
62
|
+
transition: 'background-color .2s'
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
function ConnectionState({
|
|
66
|
+
theme,
|
|
67
|
+
forceHidden,
|
|
68
|
+
state,
|
|
69
|
+
children
|
|
70
|
+
}) {
|
|
71
|
+
const unloadingRef = react.useRef(false);
|
|
72
|
+
const createCalc = useCreateCalc();
|
|
73
|
+
const left = createCalc('50% - 100px', ({
|
|
74
|
+
width
|
|
75
|
+
}) => width / 2 - 100); // TODO use calc() in web ?
|
|
76
|
+
|
|
77
|
+
react.useEffect(() => {
|
|
78
|
+
if (typeof window === 'undefined') return;
|
|
79
|
+
|
|
80
|
+
const beforeUnloadHandler = () => {
|
|
81
|
+
unloadingRef.current = true;
|
|
82
|
+
};
|
|
83
|
+
|
|
84
|
+
window.addEventListener('beforeunload', beforeUnloadHandler);
|
|
85
|
+
return () => {
|
|
86
|
+
window.removeEventListener('beforeunload', beforeUnloadHandler);
|
|
87
|
+
};
|
|
88
|
+
}, []);
|
|
89
|
+
return /*#__PURE__*/jsxRuntime_js.jsx(reactNative.View, {
|
|
90
|
+
style: [styles.connectionStateContainer, (forceHidden || !state || state === 'connected') && styles.hide, theme?.container, state === 'connected' && {
|
|
91
|
+
backgroundColor: (theme || defaultTheme).backgroundColorConnected
|
|
92
|
+
}],
|
|
93
|
+
children: !state ? null : /*#__PURE__*/jsxRuntime_js.jsx(reactNative.View, {
|
|
94
|
+
style: [styles.connectionStateText, theme && {
|
|
95
|
+
backgroundColor: theme.container.backgroundColor
|
|
96
|
+
}, state === 'connected' && {
|
|
97
|
+
backgroundColor: (theme || defaultTheme).backgroundColorConnected
|
|
98
|
+
}, {
|
|
99
|
+
left
|
|
100
|
+
}],
|
|
101
|
+
children: children
|
|
102
|
+
})
|
|
103
|
+
});
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
exports.ConnectionState = ConnectionState;
|
|
107
|
+
//# sourceMappingURL=index-node14.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index-node14.cjs","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport { useEffect, useRef } from 'react';\nimport type { ScaledSize } from 'react-native';\nimport { View, StyleSheet, Platform, useWindowDimensions } from 'react-native';\n\nconst defaultTheme = {\n container: {\n backgroundColor: 'rgba(247, 25, 0, 0.8)',\n color: '#fff',\n textShadowColor: '#111',\n textShadowOffset: { width: 0, height: -1 },\n textShadowRadius: 1,\n },\n backgroundColorConnected: 'rgba(25, 200, 60, 0.8)',\n};\n\nexport type ConnectionStateTheme = typeof defaultTheme;\nexport type State = null | 'connecting' | 'connected' | 'disconnected';\n\nexport interface ConnectionStateProps {\n theme?: ConnectionStateTheme;\n forceHidden?: boolean;\n state: State;\n children: NonNullable<ReactNode>;\n}\n\nconst zDepth1 =\n '0 2px 3px 0 rgba(0, 0, 0, 0.15), 0 2px 5px 0 rgba(0, 0, 0, 0.2)';\n\ntype CreateCalc = (\n webCalc: string,\n createCalc: (dimensions: ScaledSize) => number,\n) => string | number;\n\nconst useCreateCalcNative = (): CreateCalc => {\n const dimensions = useWindowDimensions();\n return (webCalc, createCalc) => createCalc(dimensions);\n};\nconst useCreateCalcWeb = (): CreateCalc => {\n return (webCalc) => `calc(${webCalc})`;\n};\nconst useCreateCalc =\n Platform.OS === 'web' ? useCreateCalcWeb : useCreateCalcNative;\n\n// example: const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100);\n\nconst styles = StyleSheet.create({\n connectionStateContainer: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n top: 0,\n right: 0,\n left: 0,\n height: 2,\n color: defaultTheme.container.color,\n textShadowOffset: defaultTheme.container.textShadowOffset,\n textShadowRadius: defaultTheme.container.textShadowRadius,\n boxShadow: zDepth1,\n zIndex: 9,\n transition: 'top .8s, background-color .2s',\n },\n hide: {\n top: -24,\n },\n connectionStateText: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n width: 200,\n height: 22,\n lineHeight: 22,\n top: 2,\n textAlign: 'center',\n borderBottomLeftRadius: 5,\n borderBottomRightRadius: 5,\n transition: 'background-color .2s',\n },\n});\n\nexport function ConnectionState({\n theme,\n forceHidden,\n state,\n children,\n}: ConnectionStateProps): ReactElement | null {\n const unloadingRef = useRef<boolean>(false);\n\n const createCalc = useCreateCalc();\n const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100); // TODO use calc() in web ?\n\n useEffect((): (() => void) | undefined => {\n if (typeof window === 'undefined') return;\n\n const beforeUnloadHandler = (): void => {\n unloadingRef.current = true;\n };\n window.addEventListener('beforeunload', beforeUnloadHandler);\n\n return (): void => {\n window.removeEventListener('beforeunload', beforeUnloadHandler);\n };\n }, []);\n\n const shouldHide = forceHidden || !state || state === 'connected';\n\n return (\n <View\n style={[\n styles.connectionStateContainer,\n shouldHide && styles.hide,\n theme?.container,\n state === 'connected' && {\n backgroundColor: (theme || defaultTheme).backgroundColorConnected,\n },\n ]}\n >\n {!state ? null : (\n <View\n style={[\n styles.connectionStateText,\n theme && { backgroundColor: theme.container.backgroundColor },\n state === 'connected' && {\n backgroundColor: (theme || defaultTheme).backgroundColorConnected,\n },\n { left },\n ]}\n >\n {children}\n </View>\n )}\n </View>\n );\n}\n"],"names":["defaultTheme","container","backgroundColor","color","textShadowColor","textShadowOffset","width","height","textShadowRadius","backgroundColorConnected","useCreateCalcNative","dimensions","useWindowDimensions","webCalc","createCalc","useCreateCalcWeb","useCreateCalc","Platform","OS","styles","StyleSheet","create","connectionStateContainer","position","top","right","left","boxShadow","zIndex","transition","hide","connectionStateText","lineHeight","textAlign","borderBottomLeftRadius","borderBottomRightRadius","ConnectionState","theme","forceHidden","state","children","unloadingRef","useRef","useEffect","window","beforeUnloadHandler","current","addEventListener","removeEventListener","_jsx","View"],"mappings":"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"}
|
package/dist/index-node14.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index-node14.mjs","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport { useEffect, useRef } from 'react';\nimport type { ScaledSize } from 'react-native';\nimport { View, StyleSheet, Platform, useWindowDimensions } from 'react-native';\n\nconst defaultTheme = {\n container: {\n backgroundColor: 'rgba(247, 25, 0, 0.8)',\n color: '#fff',\n textShadowColor: '#111',\n textShadowOffset: { width: 0, height: -1 },\n textShadowRadius: 1,\n },\n backgroundColorConnected: 'rgba(25, 200, 60, 0.8)',\n};\n\nexport type ConnectionStateTheme = typeof defaultTheme;\nexport type State = null | 'connecting' | 'connected' | 'disconnected';\n\nexport interface ConnectionStateProps {\n theme?: ConnectionStateTheme;\n forceHidden?: boolean;\n state: State;\n children: NonNullable<ReactNode>;\n}\n\nconst zDepth1 =\n '0 2px 3px 0 rgba(0, 0, 0, 0.15), 0 2px 5px 0 rgba(0, 0, 0, 0.2)';\n\ntype CreateCalc = (\n webCalc: string,\n createCalc: (dimensions: ScaledSize) => number,\n) => string | number;\n\nconst useCreateCalcNative = (): CreateCalc => {\n const dimensions = useWindowDimensions();\n return (webCalc, createCalc) => createCalc(dimensions);\n};\nconst useCreateCalcWeb = (): CreateCalc => {\n return (webCalc) => `calc(${webCalc})`;\n};\nconst useCreateCalc =\n Platform.OS === 'web' ? useCreateCalcWeb : useCreateCalcNative;\n\n// example: const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100);\n\nconst styles = StyleSheet.create({\n connectionStateContainer: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n top: 0,\n right: 0,\n left: 0,\n height: 2,\n color: defaultTheme.container.color,\n textShadowOffset: defaultTheme.container.textShadowOffset,\n textShadowRadius: defaultTheme.container.textShadowRadius,\n boxShadow: zDepth1,\n zIndex: 9,\n transition: 'top .8s, background-color .2s',\n },\n hide: {\n top: -24,\n },\n connectionStateText: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n width: 200,\n height: 22,\n lineHeight: 22,\n top: 2,\n textAlign: 'center',\n borderBottomLeftRadius: 5,\n borderBottomRightRadius: 5,\n transition: 'background-color .2s',\n },\n});\n\nexport function ConnectionState({\n theme,\n forceHidden,\n state,\n children,\n}: ConnectionStateProps): ReactElement | null {\n
|
|
1
|
+
{"version":3,"file":"index-node14.mjs","sources":["../src/index.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport { useEffect, useRef } from 'react';\nimport type { ScaledSize } from 'react-native';\nimport { View, StyleSheet, Platform, useWindowDimensions } from 'react-native';\n\nconst defaultTheme = {\n container: {\n backgroundColor: 'rgba(247, 25, 0, 0.8)',\n color: '#fff',\n textShadowColor: '#111',\n textShadowOffset: { width: 0, height: -1 },\n textShadowRadius: 1,\n },\n backgroundColorConnected: 'rgba(25, 200, 60, 0.8)',\n};\n\nexport type ConnectionStateTheme = typeof defaultTheme;\nexport type State = null | 'connecting' | 'connected' | 'disconnected';\n\nexport interface ConnectionStateProps {\n theme?: ConnectionStateTheme;\n forceHidden?: boolean;\n state: State;\n children: NonNullable<ReactNode>;\n}\n\nconst zDepth1 =\n '0 2px 3px 0 rgba(0, 0, 0, 0.15), 0 2px 5px 0 rgba(0, 0, 0, 0.2)';\n\ntype CreateCalc = (\n webCalc: string,\n createCalc: (dimensions: ScaledSize) => number,\n) => string | number;\n\nconst useCreateCalcNative = (): CreateCalc => {\n const dimensions = useWindowDimensions();\n return (webCalc, createCalc) => createCalc(dimensions);\n};\nconst useCreateCalcWeb = (): CreateCalc => {\n return (webCalc) => `calc(${webCalc})`;\n};\nconst useCreateCalc =\n Platform.OS === 'web' ? useCreateCalcWeb : useCreateCalcNative;\n\n// example: const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100);\n\nconst styles = StyleSheet.create({\n connectionStateContainer: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n top: 0,\n right: 0,\n left: 0,\n height: 2,\n color: defaultTheme.container.color,\n textShadowOffset: defaultTheme.container.textShadowOffset,\n textShadowRadius: defaultTheme.container.textShadowRadius,\n boxShadow: zDepth1,\n zIndex: 9,\n transition: 'top .8s, background-color .2s',\n },\n hide: {\n top: -24,\n },\n connectionStateText: {\n backgroundColor: defaultTheme.container.backgroundColor,\n position: 'absolute',\n width: 200,\n height: 22,\n lineHeight: 22,\n top: 2,\n textAlign: 'center',\n borderBottomLeftRadius: 5,\n borderBottomRightRadius: 5,\n transition: 'background-color .2s',\n },\n});\n\nexport function ConnectionState({\n theme,\n forceHidden,\n state,\n children,\n}: ConnectionStateProps): ReactElement | null {\n const unloadingRef = useRef<boolean>(false);\n\n const createCalc = useCreateCalc();\n const left = createCalc('50% - 100px', ({ width }) => width / 2 - 100); // TODO use calc() in web ?\n\n useEffect((): (() => void) | undefined => {\n if (typeof window === 'undefined') return;\n\n const beforeUnloadHandler = (): void => {\n unloadingRef.current = true;\n };\n window.addEventListener('beforeunload', beforeUnloadHandler);\n\n return (): void => {\n window.removeEventListener('beforeunload', beforeUnloadHandler);\n };\n }, []);\n\n const shouldHide = forceHidden || !state || state === 'connected';\n\n return (\n <View\n style={[\n styles.connectionStateContainer,\n shouldHide && styles.hide,\n theme?.container,\n state === 'connected' && {\n backgroundColor: (theme || defaultTheme).backgroundColorConnected,\n },\n ]}\n >\n {!state ? null : (\n <View\n style={[\n styles.connectionStateText,\n theme && { backgroundColor: theme.container.backgroundColor },\n state === 'connected' && {\n backgroundColor: (theme || defaultTheme).backgroundColorConnected,\n },\n { left },\n ]}\n >\n {children}\n </View>\n )}\n </View>\n );\n}\n"],"names":["defaultTheme","container","backgroundColor","color","textShadowColor","textShadowOffset","width","height","textShadowRadius","backgroundColorConnected","useCreateCalcNative","dimensions","useWindowDimensions","webCalc","createCalc","useCreateCalcWeb","useCreateCalc","Platform","OS","styles","StyleSheet","create","connectionStateContainer","position","top","right","left","boxShadow","zIndex","transition","hide","connectionStateText","lineHeight","textAlign","borderBottomLeftRadius","borderBottomRightRadius","ConnectionState","theme","forceHidden","state","children","unloadingRef","useRef","useEffect","window","beforeUnloadHandler","current","addEventListener","removeEventListener","_jsx"],"mappings":"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"}
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKrD,QAAA,MAAM,YAAY;;;;;;;;;;;;CASjB,CAAC;AAEF,oBAAY,oBAAoB,GAAG,OAAO,YAAY,CAAC;AACvD,oBAAY,KAAK,GAAG,IAAI,GAAG,YAAY,GAAG,WAAW,GAAG,cAAc,CAAC;AAEvE,MAAM,WAAW,oBAAoB;IACnC,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAC7B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;CAClC;AAsDD,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,WAAW,EACX,KAAK,EACL,QAAQ,GACT,EAAE,oBAAoB,GAAG,YAAY,GAAG,IAAI,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKrD,QAAA,MAAM,YAAY;;;;;;;;;;;;CASjB,CAAC;AAEF,oBAAY,oBAAoB,GAAG,OAAO,YAAY,CAAC;AACvD,oBAAY,KAAK,GAAG,IAAI,GAAG,YAAY,GAAG,WAAW,GAAG,cAAc,CAAC;AAEvE,MAAM,WAAW,oBAAoB;IACnC,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAC7B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;CAClC;AAsDD,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,WAAW,EACX,KAAK,EACL,QAAQ,GACT,EAAE,oBAAoB,GAAG,YAAY,GAAG,IAAI,CAgD5C"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-alp-connection-state",
|
|
3
|
-
"version": "6.
|
|
3
|
+
"version": "6.1.1",
|
|
4
4
|
"description": "connection state",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"author": "Christophe Hurpeau <christophe@hurpeau.com> (https://christophe.hurpeau.com)",
|
|
@@ -30,13 +30,15 @@
|
|
|
30
30
|
"./package.json": "./package.json",
|
|
31
31
|
".": {
|
|
32
32
|
"node": {
|
|
33
|
-
"import": "./dist/index-node14.mjs"
|
|
33
|
+
"import": "./dist/index-node14.mjs",
|
|
34
|
+
"require": "./dist/index-node14.cjs"
|
|
34
35
|
},
|
|
35
36
|
"browser": {
|
|
36
37
|
"browser:modern": {
|
|
37
38
|
"import": "./dist/index-browsermodern.es.js"
|
|
38
39
|
},
|
|
39
|
-
"import": "./dist/index-browser.es.js"
|
|
40
|
+
"import": "./dist/index-browser.es.js",
|
|
41
|
+
"require": "./dist/index-browser.cjs.js"
|
|
40
42
|
}
|
|
41
43
|
}
|
|
42
44
|
},
|
|
@@ -63,6 +65,7 @@
|
|
|
63
65
|
"target": "node",
|
|
64
66
|
"version": "14",
|
|
65
67
|
"formats": [
|
|
68
|
+
"cjs",
|
|
66
69
|
"es"
|
|
67
70
|
]
|
|
68
71
|
},
|
|
@@ -76,6 +79,7 @@
|
|
|
76
79
|
{
|
|
77
80
|
"target": "browser",
|
|
78
81
|
"formats": [
|
|
82
|
+
"cjs",
|
|
79
83
|
"es"
|
|
80
84
|
]
|
|
81
85
|
}
|
|
@@ -105,8 +109,8 @@
|
|
|
105
109
|
"babel-preset-modern-browsers": "15.0.2",
|
|
106
110
|
"pob-babel": "32.2.0",
|
|
107
111
|
"react": "17.0.2",
|
|
108
|
-
"react-native": "0.
|
|
109
|
-
"typescript": "4.
|
|
112
|
+
"react-native": "0.70.2",
|
|
113
|
+
"typescript": "4.6.2"
|
|
110
114
|
},
|
|
111
|
-
"gitHead": "
|
|
115
|
+
"gitHead": "81644a1b75145fc792fadce0c04096aea046994b"
|
|
112
116
|
}
|
package/src/index.tsx
CHANGED