@ozen-ui/responsive 0.84.0
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/README.md +26 -0
- package/__inner__/cjs/constants/environment/constants/index.js +5 -0
- package/__inner__/cjs/constants/environment/constants/isDev.js +5 -0
- package/__inner__/cjs/constants/environment/constants/isProduction.js +4 -0
- package/__inner__/cjs/constants/environment/index.js +4 -0
- package/__inner__/cjs/constants/index.js +4 -0
- package/__inner__/cjs/entities/breakpoint.js +2 -0
- package/__inner__/cjs/entities/index.js +9 -0
- package/__inner__/cjs/entities/orientation.js +4 -0
- package/__inner__/cjs/entities/os.js +4 -0
- package/__inner__/cjs/entities/scope.js +2 -0
- package/__inner__/cjs/entities/type.js +4 -0
- package/__inner__/cjs/entities/viewport.js +2 -0
- package/__inner__/cjs/fabric/fabric.js +79 -0
- package/__inner__/cjs/fabric/index.js +5 -0
- package/__inner__/cjs/fabric/infers/base.js +2 -0
- package/__inner__/cjs/fabric/infers/breakpoint.js +2 -0
- package/__inner__/cjs/fabric/infers/index.js +8 -0
- package/__inner__/cjs/fabric/infers/orientation.js +2 -0
- package/__inner__/cjs/fabric/infers/os.js +2 -0
- package/__inner__/cjs/fabric/infers/type.js +2 -0
- package/__inner__/cjs/fabric/infers/viewport.js +2 -0
- package/__inner__/cjs/fabric/utils.js +25 -0
- package/__inner__/cjs/hooks/index.js +15 -0
- package/__inner__/cjs/hooks/useBreakpoint.js +16 -0
- package/__inner__/cjs/hooks/useBreakpointObserver.js +19 -0
- package/__inner__/cjs/hooks/useDeviceType.js +16 -0
- package/__inner__/cjs/hooks/useDeviceTypeObserver.js +19 -0
- package/__inner__/cjs/hooks/useOS.js +16 -0
- package/__inner__/cjs/hooks/useOSObserver.js +19 -0
- package/__inner__/cjs/hooks/useOrientation.js +16 -0
- package/__inner__/cjs/hooks/useOrientationObserver.js +19 -0
- package/__inner__/cjs/hooks/useSnapshot.js +16 -0
- package/__inner__/cjs/hooks/useSnapshotObserver.js +19 -0
- package/__inner__/cjs/hooks/useViewport.js +16 -0
- package/__inner__/cjs/hooks/useViewportObserver.js +19 -0
- package/__inner__/cjs/index.js +4 -0
- package/__inner__/cjs/provider/ResponsiveContext.js +16 -0
- package/__inner__/cjs/provider/ResponsiveProvider.js +24 -0
- package/__inner__/cjs/provider/index.js +6 -0
- package/__inner__/cjs/provider/types.js +2 -0
- package/__inner__/cjs/store/ResponsiveStore.js +95 -0
- package/__inner__/cjs/store/index.js +5 -0
- package/__inner__/cjs/store/types.js +2 -0
- package/__inner__/cjs/store/utils.js +69 -0
- package/__inner__/cjs/ui/ResponsiveNodes/ResponsiveNodes.js +30 -0
- package/__inner__/cjs/ui/ResponsiveNodes/index.js +5 -0
- package/__inner__/cjs/ui/ResponsiveNodes/types.js +2 -0
- package/__inner__/cjs/ui/ResponsiveProps/ResponsiveProps.js +40 -0
- package/__inner__/cjs/ui/ResponsiveProps/index.js +5 -0
- package/__inner__/cjs/ui/ResponsiveProps/types.js +2 -0
- package/__inner__/cjs/ui/index.js +5 -0
- package/__inner__/cjs/ui/utils/index.js +5 -0
- package/__inner__/cjs/ui/utils/types.js +2 -0
- package/__inner__/cjs/ui/utils/utils.js +78 -0
- package/__inner__/cjs/user-agent/constants.js +115 -0
- package/__inner__/cjs/user-agent/index.js +5 -0
- package/__inner__/cjs/user-agent/user-agent-parser.js +92 -0
- package/__inner__/esm/constants/environment/constants/index.js +2 -0
- package/__inner__/esm/constants/environment/constants/isDev.js +2 -0
- package/__inner__/esm/constants/environment/constants/isProduction.js +1 -0
- package/__inner__/esm/constants/environment/index.js +1 -0
- package/__inner__/esm/constants/index.js +1 -0
- package/__inner__/esm/entities/breakpoint.js +1 -0
- package/__inner__/esm/entities/index.js +6 -0
- package/__inner__/esm/entities/orientation.js +1 -0
- package/__inner__/esm/entities/os.js +1 -0
- package/__inner__/esm/entities/scope.js +1 -0
- package/__inner__/esm/entities/type.js +1 -0
- package/__inner__/esm/entities/viewport.js +1 -0
- package/__inner__/esm/fabric/fabric.js +75 -0
- package/__inner__/esm/fabric/index.js +2 -0
- package/__inner__/esm/fabric/infers/base.js +1 -0
- package/__inner__/esm/fabric/infers/breakpoint.js +1 -0
- package/__inner__/esm/fabric/infers/index.js +5 -0
- package/__inner__/esm/fabric/infers/orientation.js +1 -0
- package/__inner__/esm/fabric/infers/os.js +1 -0
- package/__inner__/esm/fabric/infers/type.js +1 -0
- package/__inner__/esm/fabric/infers/viewport.js +1 -0
- package/__inner__/esm/fabric/utils.js +21 -0
- package/__inner__/esm/hooks/index.js +12 -0
- package/__inner__/esm/hooks/useBreakpoint.js +12 -0
- package/__inner__/esm/hooks/useBreakpointObserver.js +15 -0
- package/__inner__/esm/hooks/useDeviceType.js +12 -0
- package/__inner__/esm/hooks/useDeviceTypeObserver.js +15 -0
- package/__inner__/esm/hooks/useOS.js +12 -0
- package/__inner__/esm/hooks/useOSObserver.js +15 -0
- package/__inner__/esm/hooks/useOrientation.js +12 -0
- package/__inner__/esm/hooks/useOrientationObserver.js +15 -0
- package/__inner__/esm/hooks/useSnapshot.js +12 -0
- package/__inner__/esm/hooks/useSnapshotObserver.js +15 -0
- package/__inner__/esm/hooks/useViewport.js +12 -0
- package/__inner__/esm/hooks/useViewportObserver.js +15 -0
- package/__inner__/esm/index.js +1 -0
- package/__inner__/esm/provider/ResponsiveContext.js +12 -0
- package/__inner__/esm/provider/ResponsiveProvider.js +19 -0
- package/__inner__/esm/provider/index.js +3 -0
- package/__inner__/esm/provider/types.js +1 -0
- package/__inner__/esm/store/ResponsiveStore.js +92 -0
- package/__inner__/esm/store/index.js +2 -0
- package/__inner__/esm/store/types.js +1 -0
- package/__inner__/esm/store/utils.js +62 -0
- package/__inner__/esm/ui/ResponsiveNodes/ResponsiveNodes.js +25 -0
- package/__inner__/esm/ui/ResponsiveNodes/index.js +2 -0
- package/__inner__/esm/ui/ResponsiveNodes/types.js +1 -0
- package/__inner__/esm/ui/ResponsiveProps/ResponsiveProps.js +36 -0
- package/__inner__/esm/ui/ResponsiveProps/index.js +2 -0
- package/__inner__/esm/ui/ResponsiveProps/types.js +1 -0
- package/__inner__/esm/ui/index.js +2 -0
- package/__inner__/esm/ui/utils/index.js +2 -0
- package/__inner__/esm/ui/utils/types.js +1 -0
- package/__inner__/esm/ui/utils/utils.js +74 -0
- package/__inner__/esm/user-agent/constants.js +112 -0
- package/__inner__/esm/user-agent/index.js +2 -0
- package/__inner__/esm/user-agent/user-agent-parser.js +89 -0
- package/__inner__/types/constants/environment/constants/index.d.ts +2 -0
- package/__inner__/types/constants/environment/constants/isDev.d.ts +1 -0
- package/__inner__/types/constants/environment/constants/isProduction.d.ts +1 -0
- package/__inner__/types/constants/environment/index.d.ts +1 -0
- package/__inner__/types/constants/index.d.ts +1 -0
- package/__inner__/types/entities/breakpoint.d.ts +21 -0
- package/__inner__/types/entities/index.d.ts +6 -0
- package/__inner__/types/entities/orientation.d.ts +7 -0
- package/__inner__/types/entities/os.d.ts +8 -0
- package/__inner__/types/entities/scope.d.ts +11 -0
- package/__inner__/types/entities/type.d.ts +8 -0
- package/__inner__/types/entities/viewport.d.ts +4 -0
- package/__inner__/types/fabric/fabric.d.ts +25 -0
- package/__inner__/types/fabric/index.d.ts +2 -0
- package/__inner__/types/fabric/infers/base.d.ts +2 -0
- package/__inner__/types/fabric/infers/breakpoint.d.ts +5 -0
- package/__inner__/types/fabric/infers/index.d.ts +5 -0
- package/__inner__/types/fabric/infers/orientation.d.ts +4 -0
- package/__inner__/types/fabric/infers/os.d.ts +4 -0
- package/__inner__/types/fabric/infers/type.d.ts +4 -0
- package/__inner__/types/fabric/infers/viewport.d.ts +3 -0
- package/__inner__/types/fabric/utils.d.ts +2 -0
- package/__inner__/types/hooks/index.d.ts +12 -0
- package/__inner__/types/hooks/useBreakpoint.d.ts +2 -0
- package/__inner__/types/hooks/useBreakpointObserver.d.ts +2 -0
- package/__inner__/types/hooks/useDeviceType.d.ts +2 -0
- package/__inner__/types/hooks/useDeviceTypeObserver.d.ts +2 -0
- package/__inner__/types/hooks/useOS.d.ts +2 -0
- package/__inner__/types/hooks/useOSObserver.d.ts +2 -0
- package/__inner__/types/hooks/useOrientation.d.ts +2 -0
- package/__inner__/types/hooks/useOrientationObserver.d.ts +2 -0
- package/__inner__/types/hooks/useSnapshot.d.ts +2 -0
- package/__inner__/types/hooks/useSnapshotObserver.d.ts +3 -0
- package/__inner__/types/hooks/useViewport.d.ts +2 -0
- package/__inner__/types/hooks/useViewportObserver.d.ts +2 -0
- package/__inner__/types/index.d.ts +1 -0
- package/__inner__/types/provider/ResponsiveContext.d.ts +8 -0
- package/__inner__/types/provider/ResponsiveProvider.d.ts +4 -0
- package/__inner__/types/provider/index.d.ts +3 -0
- package/__inner__/types/provider/types.d.ts +6 -0
- package/__inner__/types/store/ResponsiveStore.d.ts +16 -0
- package/__inner__/types/store/index.d.ts +2 -0
- package/__inner__/types/store/types.d.ts +12 -0
- package/__inner__/types/store/utils.d.ts +5 -0
- package/__inner__/types/ui/ResponsiveNodes/ResponsiveNodes.d.ts +4 -0
- package/__inner__/types/ui/ResponsiveNodes/index.d.ts +2 -0
- package/__inner__/types/ui/ResponsiveNodes/types.d.ts +6 -0
- package/__inner__/types/ui/ResponsiveProps/ResponsiveProps.d.ts +5 -0
- package/__inner__/types/ui/ResponsiveProps/index.d.ts +2 -0
- package/__inner__/types/ui/ResponsiveProps/types.d.ts +8 -0
- package/__inner__/types/ui/index.d.ts +2 -0
- package/__inner__/types/ui/utils/index.d.ts +2 -0
- package/__inner__/types/ui/utils/types.d.ts +6 -0
- package/__inner__/types/ui/utils/utils.d.ts +6 -0
- package/__inner__/types/user-agent/constants.d.ts +108 -0
- package/__inner__/types/user-agent/index.d.ts +2 -0
- package/__inner__/types/user-agent/user-agent-parser.d.ts +11 -0
- package/package.json +34 -0
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.ResponsiveStore = void 0;
|
|
4
|
+
var eventBus_1 = require("@ozen-ui/kit/utils");
|
|
5
|
+
var user_agent_1 = require("../user-agent");
|
|
6
|
+
var utils_1 = require("./utils");
|
|
7
|
+
var ResponsiveStore = /** @class */ (function () {
|
|
8
|
+
function ResponsiveStore(scope) {
|
|
9
|
+
this.eventBus = new eventBus_1.EventBus();
|
|
10
|
+
this.raf = 0;
|
|
11
|
+
this.cleanup = null;
|
|
12
|
+
this.scope = scope;
|
|
13
|
+
this.snapshot = this.getSnapshot();
|
|
14
|
+
}
|
|
15
|
+
ResponsiveStore.prototype.getSnapshot = function () {
|
|
16
|
+
var viewport = {
|
|
17
|
+
width: window.innerWidth,
|
|
18
|
+
height: window.innerHeight,
|
|
19
|
+
};
|
|
20
|
+
var deviceType = user_agent_1.userAgentParser.deviceType, OSName = user_agent_1.userAgentParser.OSName;
|
|
21
|
+
var orientation = (0, utils_1.getOrientationState)(viewport);
|
|
22
|
+
var size = (0, utils_1.getBreakpointState)(this.scope, viewport.width);
|
|
23
|
+
var type = (0, utils_1.getTypeState)(this.scope, deviceType);
|
|
24
|
+
var os = (0, utils_1.getOSState)(this.scope, OSName);
|
|
25
|
+
return {
|
|
26
|
+
viewport: viewport,
|
|
27
|
+
type: type,
|
|
28
|
+
os: os,
|
|
29
|
+
size: size,
|
|
30
|
+
orientation: orientation,
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
ResponsiveStore.prototype.mount = function () {
|
|
34
|
+
var _this = this;
|
|
35
|
+
var onResize = function () { return _this.schedule(); };
|
|
36
|
+
window.addEventListener('resize', onResize, { passive: true });
|
|
37
|
+
window.addEventListener('orientationchange', onResize, { passive: true });
|
|
38
|
+
this.cleanup = function () {
|
|
39
|
+
window.removeEventListener('resize', onResize);
|
|
40
|
+
window.removeEventListener('orientationchange', onResize);
|
|
41
|
+
if (_this.raf) {
|
|
42
|
+
window.cancelAnimationFrame(_this.raf);
|
|
43
|
+
}
|
|
44
|
+
_this.raf = 0;
|
|
45
|
+
};
|
|
46
|
+
this.snapshot = this.getSnapshot();
|
|
47
|
+
};
|
|
48
|
+
ResponsiveStore.prototype.unmount = function () {
|
|
49
|
+
var _a;
|
|
50
|
+
(_a = this.cleanup) === null || _a === void 0 ? void 0 : _a.call(this);
|
|
51
|
+
this.cleanup = null;
|
|
52
|
+
};
|
|
53
|
+
ResponsiveStore.prototype.notify = function () {
|
|
54
|
+
var _this = this;
|
|
55
|
+
this.raf = 0;
|
|
56
|
+
user_agent_1.userAgentParser.update();
|
|
57
|
+
var next = this.getSnapshot();
|
|
58
|
+
var events = [];
|
|
59
|
+
if (next.orientation.current !== this.snapshot.orientation.current) {
|
|
60
|
+
events.push('orientationChange');
|
|
61
|
+
}
|
|
62
|
+
if (next.size.current !== this.snapshot.size.current) {
|
|
63
|
+
events.push('breakpointChange');
|
|
64
|
+
}
|
|
65
|
+
if (next.os.current !== this.snapshot.os.current) {
|
|
66
|
+
events.push('osChange');
|
|
67
|
+
}
|
|
68
|
+
if (next.type.current !== this.snapshot.type.current) {
|
|
69
|
+
events.push('typeChange');
|
|
70
|
+
}
|
|
71
|
+
if (next.viewport.width !== this.snapshot.viewport.width ||
|
|
72
|
+
next.viewport.height !== this.snapshot.viewport.height) {
|
|
73
|
+
events.push('viewportChange');
|
|
74
|
+
}
|
|
75
|
+
if (events.length > 0) {
|
|
76
|
+
events.push('snapshotChange');
|
|
77
|
+
}
|
|
78
|
+
events.forEach(function (event) {
|
|
79
|
+
_this.eventBus.publish(event, {
|
|
80
|
+
previous: _this.snapshot,
|
|
81
|
+
current: next,
|
|
82
|
+
});
|
|
83
|
+
});
|
|
84
|
+
this.snapshot = next;
|
|
85
|
+
};
|
|
86
|
+
ResponsiveStore.prototype.schedule = function () {
|
|
87
|
+
var _this = this;
|
|
88
|
+
if (this.raf) {
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
this.raf = window.requestAnimationFrame(function () { return _this.notify(); });
|
|
92
|
+
};
|
|
93
|
+
return ResponsiveStore;
|
|
94
|
+
}());
|
|
95
|
+
exports.ResponsiveStore = ResponsiveStore;
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getOSState = exports.getBreakpointState = exports.getOrientationState = exports.getTypeState = void 0;
|
|
4
|
+
var utils_1 = require("@ozen-ui/kit/utils");
|
|
5
|
+
var getTypeState = function (scope, current) {
|
|
6
|
+
var typeState = {
|
|
7
|
+
current: current,
|
|
8
|
+
};
|
|
9
|
+
Object.values(scope.typeVariant).forEach(function (deviceType) {
|
|
10
|
+
typeState["is".concat((0, utils_1.capitalizeFirstLetter)(deviceType))] =
|
|
11
|
+
deviceType === current;
|
|
12
|
+
});
|
|
13
|
+
return typeState;
|
|
14
|
+
};
|
|
15
|
+
exports.getTypeState = getTypeState;
|
|
16
|
+
var getOrientationState = function (_a) {
|
|
17
|
+
var width = _a.width, height = _a.height;
|
|
18
|
+
var isVertical = width < height;
|
|
19
|
+
var isHorizontal = !isVertical;
|
|
20
|
+
return {
|
|
21
|
+
isHorizontal: isHorizontal,
|
|
22
|
+
isVertical: isVertical,
|
|
23
|
+
current: isVertical ? 'vertical' : 'horizontal',
|
|
24
|
+
};
|
|
25
|
+
};
|
|
26
|
+
exports.getOrientationState = getOrientationState;
|
|
27
|
+
var getBreakpointState = function (scope, width) {
|
|
28
|
+
var breakpointState = {};
|
|
29
|
+
var currentSizeIndex = 0;
|
|
30
|
+
for (var i = 0; i < scope.sizesAscending.length; i++) {
|
|
31
|
+
var size = scope.sizesAscending[i];
|
|
32
|
+
var breakpoint = scope.breakpoints[size];
|
|
33
|
+
if (i === 0 && width <= breakpoint) {
|
|
34
|
+
currentSizeIndex = i;
|
|
35
|
+
breakpointState.current = size;
|
|
36
|
+
break;
|
|
37
|
+
}
|
|
38
|
+
if (width >= breakpoint) {
|
|
39
|
+
currentSizeIndex = i;
|
|
40
|
+
breakpointState.current = size;
|
|
41
|
+
}
|
|
42
|
+
else {
|
|
43
|
+
break;
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
var writeIsKey = function (key, value) {
|
|
47
|
+
breakpointState[key] =
|
|
48
|
+
value;
|
|
49
|
+
};
|
|
50
|
+
scope.sizesAscending.forEach(function (deviceSize, index) {
|
|
51
|
+
writeIsKey("is".concat(deviceSize.toUpperCase()), currentSizeIndex === index);
|
|
52
|
+
writeIsKey("above".concat(deviceSize.toUpperCase()), currentSizeIndex > index);
|
|
53
|
+
writeIsKey("below".concat(deviceSize.toUpperCase()), currentSizeIndex < index);
|
|
54
|
+
writeIsKey("atOrAbove".concat(deviceSize.toUpperCase()), currentSizeIndex >= index);
|
|
55
|
+
writeIsKey("atOrBelow".concat(deviceSize.toUpperCase()), currentSizeIndex <= index);
|
|
56
|
+
});
|
|
57
|
+
return breakpointState;
|
|
58
|
+
};
|
|
59
|
+
exports.getBreakpointState = getBreakpointState;
|
|
60
|
+
var getOSState = function (scope, current) {
|
|
61
|
+
var OSState = {
|
|
62
|
+
current: current,
|
|
63
|
+
};
|
|
64
|
+
Object.values(scope.osVariant).forEach(function (OS) {
|
|
65
|
+
OSState["is".concat((0, utils_1.capitalizeFirstLetter)(OS))] = OS === current;
|
|
66
|
+
});
|
|
67
|
+
return OSState;
|
|
68
|
+
};
|
|
69
|
+
exports.getOSState = getOSState;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.ResponsiveNodes = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = tslib_1.__importDefault(require("react"));
|
|
6
|
+
var utils_1 = require("@ozen-ui/kit/utils");
|
|
7
|
+
var hooks_1 = require("../../hooks");
|
|
8
|
+
var ResponsiveContext_1 = require("../../provider/ResponsiveContext");
|
|
9
|
+
var utils_2 = require("../utils/utils");
|
|
10
|
+
var ResponsiveNodes = function (_a) {
|
|
11
|
+
var _b;
|
|
12
|
+
var by = _a.by, fallback = _a.fallback;
|
|
13
|
+
var store = (0, ResponsiveContext_1.useResponsiveContext)().store;
|
|
14
|
+
var breakpoint = (0, hooks_1.useBreakpoint)();
|
|
15
|
+
var type = (0, hooks_1.useDeviceType)();
|
|
16
|
+
var device = {
|
|
17
|
+
size: breakpoint.current,
|
|
18
|
+
type: type.current,
|
|
19
|
+
};
|
|
20
|
+
var Fallback = fallback !== null && fallback !== void 0 ? fallback : (function () { return null; });
|
|
21
|
+
var component = (_b = (0, utils_2.resolveBreakpoints)(store.scope, by, device)) === null || _b === void 0 ? void 0 : _b.value;
|
|
22
|
+
if (!component) {
|
|
23
|
+
return react_1.default.createElement(Fallback, null);
|
|
24
|
+
}
|
|
25
|
+
if ((0, utils_1.isFunction)(component)) {
|
|
26
|
+
return component();
|
|
27
|
+
}
|
|
28
|
+
return component;
|
|
29
|
+
};
|
|
30
|
+
exports.ResponsiveNodes = ResponsiveNodes;
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.ResponsiveProps = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = tslib_1.__importDefault(require("react"));
|
|
6
|
+
var utils_1 = require("@ozen-ui/kit/utils");
|
|
7
|
+
var hooks_1 = require("../../hooks");
|
|
8
|
+
var provider_1 = require("../../provider");
|
|
9
|
+
var utils_2 = require("../utils");
|
|
10
|
+
var ResponsiveProps = function (_a) {
|
|
11
|
+
var _b;
|
|
12
|
+
var component = _a.component, props = _a.props, sharedPropsProp = _a.sharedProps, fallback = _a.fallback;
|
|
13
|
+
var store = (0, provider_1.useResponsiveContext)().store;
|
|
14
|
+
var breakpoint = (0, hooks_1.useBreakpoint)();
|
|
15
|
+
var type = (0, hooks_1.useDeviceType)();
|
|
16
|
+
var device = {
|
|
17
|
+
size: breakpoint.current,
|
|
18
|
+
type: type.current,
|
|
19
|
+
};
|
|
20
|
+
var Fallback = fallback !== null && fallback !== void 0 ? fallback : (function () { return null; });
|
|
21
|
+
var rawNeededProps = (_b = (0, utils_2.resolveBreakpoints)(store.scope, props, device)) === null || _b === void 0 ? void 0 : _b.value;
|
|
22
|
+
if (!rawNeededProps) {
|
|
23
|
+
return react_1.default.createElement(Fallback, null);
|
|
24
|
+
}
|
|
25
|
+
var sharedProps = (function () {
|
|
26
|
+
if (!sharedPropsProp) {
|
|
27
|
+
return null;
|
|
28
|
+
}
|
|
29
|
+
if ((0, utils_1.isFunction)(sharedPropsProp)) {
|
|
30
|
+
return sharedPropsProp();
|
|
31
|
+
}
|
|
32
|
+
return sharedPropsProp;
|
|
33
|
+
})();
|
|
34
|
+
var neededProps = (0, utils_1.isFunction)(rawNeededProps)
|
|
35
|
+
? rawNeededProps()
|
|
36
|
+
: rawNeededProps;
|
|
37
|
+
var Component = component;
|
|
38
|
+
return react_1.default.createElement(Component, tslib_1.__assign({}, sharedProps, neededProps));
|
|
39
|
+
};
|
|
40
|
+
exports.ResponsiveProps = ResponsiveProps;
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/* eslint-disable no-continue */
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.resolveBreakpoints = void 0;
|
|
5
|
+
var tslib_1 = require("tslib");
|
|
6
|
+
var resolveBreakpoints = function (scope, by, device) {
|
|
7
|
+
var e_1, _a, e_2, _b;
|
|
8
|
+
var SIZE_RANK = {};
|
|
9
|
+
scope.sizesAscending.forEach(function (size, index) {
|
|
10
|
+
SIZE_RANK[size] = index;
|
|
11
|
+
});
|
|
12
|
+
var currentRank = SIZE_RANK[device.size];
|
|
13
|
+
var bestMixed = null;
|
|
14
|
+
try {
|
|
15
|
+
for (var _c = tslib_1.__values(Object.entries(by)), _d = _c.next(); !_d.done; _d = _c.next()) {
|
|
16
|
+
var _e = tslib_1.__read(_d.value, 2), rawKey = _e[0], Comp = _e[1];
|
|
17
|
+
if (!Comp) {
|
|
18
|
+
continue;
|
|
19
|
+
}
|
|
20
|
+
var key = rawKey;
|
|
21
|
+
var parts = rawKey.split(':');
|
|
22
|
+
if (parts.length !== 2) {
|
|
23
|
+
continue;
|
|
24
|
+
}
|
|
25
|
+
var _f = tslib_1.__read(parts, 2), type = _f[0], size = _f[1];
|
|
26
|
+
if (type !== device.type) {
|
|
27
|
+
continue;
|
|
28
|
+
}
|
|
29
|
+
if (!(size in SIZE_RANK)) {
|
|
30
|
+
continue;
|
|
31
|
+
}
|
|
32
|
+
var rank = SIZE_RANK[size];
|
|
33
|
+
if (rank <= currentRank && (!bestMixed || rank > bestMixed.rank)) {
|
|
34
|
+
bestMixed = { key: key, rank: rank, value: Comp };
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
39
|
+
finally {
|
|
40
|
+
try {
|
|
41
|
+
if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
|
|
42
|
+
}
|
|
43
|
+
finally { if (e_1) throw e_1.error; }
|
|
44
|
+
}
|
|
45
|
+
if (bestMixed) {
|
|
46
|
+
return { key: bestMixed.key, value: bestMixed.value };
|
|
47
|
+
}
|
|
48
|
+
var typeOnly = by[device.type];
|
|
49
|
+
if (typeOnly) {
|
|
50
|
+
return { key: device.type, value: typeOnly };
|
|
51
|
+
}
|
|
52
|
+
var bestSize = null;
|
|
53
|
+
try {
|
|
54
|
+
for (var _g = tslib_1.__values(scope.sizesAscending), _h = _g.next(); !_h.done; _h = _g.next()) {
|
|
55
|
+
var size = _h.value;
|
|
56
|
+
var value = by[size];
|
|
57
|
+
if (!value) {
|
|
58
|
+
continue;
|
|
59
|
+
}
|
|
60
|
+
var rank = SIZE_RANK[size];
|
|
61
|
+
if (rank <= currentRank && (!bestSize || rank > bestSize.rank)) {
|
|
62
|
+
bestSize = { key: size, rank: rank, value: value };
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
catch (e_2_1) { e_2 = { error: e_2_1 }; }
|
|
67
|
+
finally {
|
|
68
|
+
try {
|
|
69
|
+
if (_h && !_h.done && (_b = _g.return)) _b.call(_g);
|
|
70
|
+
}
|
|
71
|
+
finally { if (e_2) throw e_2.error; }
|
|
72
|
+
}
|
|
73
|
+
if (bestSize) {
|
|
74
|
+
return { key: bestSize.key, value: bestSize.value };
|
|
75
|
+
}
|
|
76
|
+
return null;
|
|
77
|
+
};
|
|
78
|
+
exports.resolveBreakpoints = resolveBreakpoints;
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.USER_AGENT_PARSER_TYPE_TO_INTERNAL_TYPE = exports.USER_AGENT_PARSER_OS_TO_INTERNAL_OS = void 0;
|
|
4
|
+
var UADeviceType = {
|
|
5
|
+
CONSOLE: 'console',
|
|
6
|
+
DESKTOP: 'desktop',
|
|
7
|
+
EMBEDDED: 'embedded',
|
|
8
|
+
MOBILE: 'mobile',
|
|
9
|
+
SMARTTV: 'smarttv',
|
|
10
|
+
TABLET: 'tablet',
|
|
11
|
+
WEARABLE: 'wearable',
|
|
12
|
+
XR: 'xr',
|
|
13
|
+
};
|
|
14
|
+
var OSName = {
|
|
15
|
+
AIX: 'AIX',
|
|
16
|
+
AMIGA_OS: 'Amiga OS',
|
|
17
|
+
ANDROID: 'Android',
|
|
18
|
+
ANDROID_X86: 'Android-x86',
|
|
19
|
+
ARCAOS: 'ArcaOS',
|
|
20
|
+
ARCH: 'Arch',
|
|
21
|
+
BADA: 'Bada',
|
|
22
|
+
BEOS: 'BeOS',
|
|
23
|
+
BLACKBERRY: 'BlackBerry',
|
|
24
|
+
CENTOS: 'CentOS',
|
|
25
|
+
CHROME_OS: 'Chrome OS',
|
|
26
|
+
CHROMECAST: 'Chromecast',
|
|
27
|
+
CHROMECAST_ANDROID: 'Chromecast Android',
|
|
28
|
+
CHROMECAST_FUCHSIA: 'Chromecast Fuchsia',
|
|
29
|
+
CHROMECAST_LINUX: 'Chromecast Linux',
|
|
30
|
+
CHROMECAST_SMARTSPEAKER: 'Chromecast SmartSpeaker',
|
|
31
|
+
CONTIKI: 'Contiki',
|
|
32
|
+
DEBIAN: 'Debian',
|
|
33
|
+
DEEPIN: 'Deepin',
|
|
34
|
+
DRAGONFLY: 'DragonFly',
|
|
35
|
+
ELEMENTARY_OS: 'elementary OS',
|
|
36
|
+
FEDORA: 'Fedora',
|
|
37
|
+
FIREFOX_OS: 'Firefox OS',
|
|
38
|
+
FREEBSD: 'FreeBSD',
|
|
39
|
+
FUCHSIA: 'Fuchsia',
|
|
40
|
+
GENTOO: 'Gentoo',
|
|
41
|
+
GHOSTBSD: 'GhostBSD',
|
|
42
|
+
GNU: 'GNU',
|
|
43
|
+
HAIKU: 'Haiku',
|
|
44
|
+
HARMONYOS: 'HarmonyOS',
|
|
45
|
+
HP_UX: 'HP-UX',
|
|
46
|
+
HURD: 'Hurd',
|
|
47
|
+
IOS: 'iOS',
|
|
48
|
+
JOLI: 'Joli',
|
|
49
|
+
KAIOS: 'KaiOS',
|
|
50
|
+
KNOPPIX: 'Knoppix',
|
|
51
|
+
KUBUNTU: 'Kubuntu',
|
|
52
|
+
LINPUS: 'Linpus',
|
|
53
|
+
LINSPIRE: 'Linspire',
|
|
54
|
+
LINUX: 'Linux',
|
|
55
|
+
MACOS: 'macOS',
|
|
56
|
+
MAEMO: 'Maemo',
|
|
57
|
+
MAGEIA: 'Mageia',
|
|
58
|
+
MANDRIVA: 'Mandriva',
|
|
59
|
+
MANJARO: 'Manjaro',
|
|
60
|
+
MEEGO: 'MeeGo',
|
|
61
|
+
MINIX: 'Minix',
|
|
62
|
+
MINT: 'Mint',
|
|
63
|
+
MORPH_OS: 'Morph OS',
|
|
64
|
+
NETBSD: 'NetBSD',
|
|
65
|
+
NETRANGE: 'NetRange',
|
|
66
|
+
NETTV: 'NetTV',
|
|
67
|
+
NINTENDO: 'Nintendo',
|
|
68
|
+
OPENHARMONY: 'OpenHarmony',
|
|
69
|
+
OPENBSD: 'OpenBSD',
|
|
70
|
+
OPENVMS: 'OpenVMS',
|
|
71
|
+
OS2: 'OS/2',
|
|
72
|
+
PALM: 'Palm',
|
|
73
|
+
PC_BSD: 'PC-BSD',
|
|
74
|
+
PCLINUXOS: 'PCLinuxOS',
|
|
75
|
+
PICO: 'Pico',
|
|
76
|
+
PLAN9: 'Plan9',
|
|
77
|
+
PLAYSTATION: 'PlayStation',
|
|
78
|
+
QNX: 'QNX',
|
|
79
|
+
RASPBIAN: 'Raspbian',
|
|
80
|
+
REDHAT: 'RedHat',
|
|
81
|
+
RIM_TABLET_OS: 'RIM Tablet OS',
|
|
82
|
+
RISC_OS: 'RISC OS',
|
|
83
|
+
SABAYON: 'Sabayon',
|
|
84
|
+
SAILFISH: 'Sailfish',
|
|
85
|
+
SERENITYOS: 'SerenityOS',
|
|
86
|
+
SERIES40: 'Series40',
|
|
87
|
+
SLACKWARE: 'Slackware',
|
|
88
|
+
SOLARIS: 'Solaris',
|
|
89
|
+
SUSE: 'SUSE',
|
|
90
|
+
SYMBIAN: 'Symbian',
|
|
91
|
+
TIZEN: 'Tizen',
|
|
92
|
+
UBUNTU: 'Ubuntu',
|
|
93
|
+
UBUNTU_TOUCH: 'Ubuntu Touch',
|
|
94
|
+
UNIX: 'Unix',
|
|
95
|
+
VECTORLINUX: 'VectorLinux',
|
|
96
|
+
WATCHOS: 'watchOS',
|
|
97
|
+
WEBOS: 'WebOS',
|
|
98
|
+
WINDOWS: 'Windows',
|
|
99
|
+
WINDOWS_CE: 'Windows CE',
|
|
100
|
+
WINDOWS_IOT: 'Windows IoT',
|
|
101
|
+
WINDOWS_MOBILE: 'Windows Mobile',
|
|
102
|
+
WINDOWS_PHONE: 'Windows Phone',
|
|
103
|
+
WINDOWS_RT: 'Windows RT',
|
|
104
|
+
XBOX: 'Xbox',
|
|
105
|
+
XUBUNTU: 'Xubuntu',
|
|
106
|
+
ZENWALK: 'Zenwalk',
|
|
107
|
+
};
|
|
108
|
+
exports.USER_AGENT_PARSER_OS_TO_INTERNAL_OS = {
|
|
109
|
+
macOS: ['macOS'],
|
|
110
|
+
ios: ['iOS'],
|
|
111
|
+
};
|
|
112
|
+
exports.USER_AGENT_PARSER_TYPE_TO_INTERNAL_TYPE = {
|
|
113
|
+
mobile: ['mobile'],
|
|
114
|
+
tablet: ['tablet'],
|
|
115
|
+
};
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.userAgentParser = exports.UserAgentParser = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var ua_parser_js_1 = require("ua-parser-js");
|
|
6
|
+
var constants_1 = require("./constants");
|
|
7
|
+
var UserAgentParser = /** @class */ (function () {
|
|
8
|
+
function UserAgentParser(userAgent) {
|
|
9
|
+
this.userAgent = new ua_parser_js_1.UAParser(userAgent);
|
|
10
|
+
}
|
|
11
|
+
UserAgentParser.prototype.update = function () {
|
|
12
|
+
this.userAgent = new ua_parser_js_1.UAParser();
|
|
13
|
+
};
|
|
14
|
+
Object.defineProperty(UserAgentParser.prototype, "deviceType", {
|
|
15
|
+
get: function () {
|
|
16
|
+
var e_1, _a;
|
|
17
|
+
var rawType = this.device.type;
|
|
18
|
+
if (!rawType) {
|
|
19
|
+
return 'desktop';
|
|
20
|
+
}
|
|
21
|
+
var _loop_1 = function (rawType_1, uaTypes) {
|
|
22
|
+
var type = rawType_1;
|
|
23
|
+
if (uaTypes.some(function (type) { return type === rawType_1; })) {
|
|
24
|
+
return { value: type };
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
try {
|
|
28
|
+
for (var _b = tslib_1.__values(Object.entries(constants_1.USER_AGENT_PARSER_TYPE_TO_INTERNAL_TYPE)), _c = _b.next(); !_c.done; _c = _b.next()) {
|
|
29
|
+
var _d = tslib_1.__read(_c.value, 2), rawType_1 = _d[0], uaTypes = _d[1];
|
|
30
|
+
var state_1 = _loop_1(rawType_1, uaTypes);
|
|
31
|
+
if (typeof state_1 === "object")
|
|
32
|
+
return state_1.value;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
36
|
+
finally {
|
|
37
|
+
try {
|
|
38
|
+
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
|
|
39
|
+
}
|
|
40
|
+
finally { if (e_1) throw e_1.error; }
|
|
41
|
+
}
|
|
42
|
+
return 'desktop';
|
|
43
|
+
},
|
|
44
|
+
enumerable: false,
|
|
45
|
+
configurable: true
|
|
46
|
+
});
|
|
47
|
+
Object.defineProperty(UserAgentParser.prototype, "OSName", {
|
|
48
|
+
get: function () {
|
|
49
|
+
var e_2, _a;
|
|
50
|
+
var rawName = this.OS.name;
|
|
51
|
+
if (!rawName) {
|
|
52
|
+
return 'unknown';
|
|
53
|
+
}
|
|
54
|
+
try {
|
|
55
|
+
for (var _b = tslib_1.__values(Object.entries(constants_1.USER_AGENT_PARSER_OS_TO_INTERNAL_OS)), _c = _b.next(); !_c.done; _c = _b.next()) {
|
|
56
|
+
var _d = tslib_1.__read(_c.value, 2), rawOS = _d[0], uaOS = _d[1];
|
|
57
|
+
var OS = rawOS;
|
|
58
|
+
if (uaOS.some(function (OS) { return OS === rawName; })) {
|
|
59
|
+
return OS;
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
catch (e_2_1) { e_2 = { error: e_2_1 }; }
|
|
64
|
+
finally {
|
|
65
|
+
try {
|
|
66
|
+
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
|
|
67
|
+
}
|
|
68
|
+
finally { if (e_2) throw e_2.error; }
|
|
69
|
+
}
|
|
70
|
+
return 'unknown';
|
|
71
|
+
},
|
|
72
|
+
enumerable: false,
|
|
73
|
+
configurable: true
|
|
74
|
+
});
|
|
75
|
+
Object.defineProperty(UserAgentParser.prototype, "device", {
|
|
76
|
+
get: function () {
|
|
77
|
+
return this.userAgent.getDevice();
|
|
78
|
+
},
|
|
79
|
+
enumerable: false,
|
|
80
|
+
configurable: true
|
|
81
|
+
});
|
|
82
|
+
Object.defineProperty(UserAgentParser.prototype, "OS", {
|
|
83
|
+
get: function () {
|
|
84
|
+
return this.userAgent.getOS();
|
|
85
|
+
},
|
|
86
|
+
enumerable: false,
|
|
87
|
+
configurable: true
|
|
88
|
+
});
|
|
89
|
+
return UserAgentParser;
|
|
90
|
+
}());
|
|
91
|
+
exports.UserAgentParser = UserAgentParser;
|
|
92
|
+
exports.userAgentParser = new UserAgentParser();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export var isProduction = process.env.NODE_ENV === 'production';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './constants';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './environment';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export var orientation = ['horizontal', 'vertical'];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export var OSVariant = ['macOS', 'ios', 'unknown'];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export var type = ['mobile', 'tablet', 'desktop'];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|