@ozen-ui/responsive 0.84.0 → 0.84.2

package/__inner__/cjs/ui/ResponsiveProps/ResponsiveProps.js

@@ -8,8 +8,8 @@ var hooks_1 = require("../../hooks");
 var provider_1 = require("../../provider");
 var utils_2 = require("../utils");
 var ResponsiveProps = function (_a) {
-    var _b;
-    var component = _a.component, props = _a.props, sharedPropsProp = _a.sharedProps, fallback = _a.fallback;
+    var _b, _c, _d;
+    var component = _a.component, props = _a.props, sharedPropsProp = _a.sharedProps, fallback = _a.fallback, childrenProp = _a.children;
     var store = (0, provider_1.useResponsiveContext)().store;
     var breakpoint = (0, hooks_1.useBreakpoint)();
     var type = (0, hooks_1.useDeviceType)();
@@ -19,9 +19,6 @@ var ResponsiveProps = function (_a) {
     };
     var Fallback = fallback !== null && fallback !== void 0 ? fallback : (function () { return null; });
     var rawNeededProps = (_b = (0, utils_2.resolveBreakpoints)(store.scope, props, device)) === null || _b === void 0 ? void 0 : _b.value;
-    if (!rawNeededProps) {
-        return react_1.default.createElement(Fallback, null);
-    }
     var sharedProps = (function () {
         if (!sharedPropsProp) {
             return null;
@@ -34,7 +31,16 @@ var ResponsiveProps = function (_a) {
     var neededProps = (0, utils_1.isFunction)(rawNeededProps)
         ? rawNeededProps()
         : rawNeededProps;
+    var isNullProps = neededProps === null;
+    var isWithoutProps = rawNeededProps === undefined && !sharedProps && !childrenProp;
+    if (isNullProps || isWithoutProps) {
+        return react_1.default.createElement(Fallback, null);
+    }
     var Component = component;
-    return react_1.default.createElement(Component, tslib_1.__assign({}, sharedProps, neededProps));
+    var children = (_d = (_c = neededProps === null || neededProps === void 0 ? void 0 : neededProps.children) !== null && _c !== void 0 ? _c : sharedProps === null || sharedProps === void 0 ? void 0 : sharedProps.children) !== null && _d !== void 0 ? _d : childrenProp;
+    return (
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-expect-error
+    react_1.default.createElement(Component, tslib_1.__assign({}, sharedProps, neededProps), children));
 };
 exports.ResponsiveProps = ResponsiveProps;

package/__inner__/cjs/ui/utils/utils.js

@@ -13,8 +13,8 @@ var resolveBreakpoints = function (scope, by, device) {
     var bestMixed = null;
     try {
         for (var _c = tslib_1.__values(Object.entries(by)), _d = _c.next(); !_d.done; _d = _c.next()) {
-            var _e = tslib_1.__read(_d.value, 2), rawKey = _e[0], Comp = _e[1];
-            if (!Comp) {
+            var _e = tslib_1.__read(_d.value, 2), rawKey = _e[0], value = _e[1];
+            if (!value && value !== null) {
                 continue;
             }
             var key = rawKey;
@@ -31,7 +31,7 @@ var resolveBreakpoints = function (scope, by, device) {
             }
             var rank = SIZE_RANK[size];
             if (rank <= currentRank && (!bestMixed || rank > bestMixed.rank)) {
-                bestMixed = { key: key, rank: rank, value: Comp };
+                bestMixed = { key: key, rank: rank, value: value };
             }
         }
     }
@@ -46,7 +46,7 @@ var resolveBreakpoints = function (scope, by, device) {
         return { key: bestMixed.key, value: bestMixed.value };
     }
     var typeOnly = by[device.type];
-    if (typeOnly) {
+    if (typeOnly || typeOnly === null) {
         return { key: device.type, value: typeOnly };
     }
     var bestSize = null;
@@ -54,12 +54,12 @@ var resolveBreakpoints = function (scope, by, device) {
         for (var _g = tslib_1.__values(scope.sizesAscending), _h = _g.next(); !_h.done; _h = _g.next()) {
             var size = _h.value;
             var value = by[size];
-            if (!value) {
+            if (!value && value !== null) {
                 continue;
             }
             var rank = SIZE_RANK[size];
             if (rank <= currentRank && (!bestSize || rank > bestSize.rank)) {
-                bestSize = { key: size, rank: rank, value: value };
+                bestSize = { key: size, rank: rank, value: value !== null && value !== void 0 ? value : null };
             }
         }
     }
@@ -73,6 +73,6 @@ var resolveBreakpoints = function (scope, by, device) {
     if (bestSize) {
         return { key: bestSize.key, value: bestSize.value };
     }
-    return null;
+    return undefined;
 };
 exports.resolveBreakpoints = resolveBreakpoints;

package/__inner__/cjs/user-agent/user-agent-parser.js

@@ -18,18 +18,13 @@ var UserAgentParser = /** @class */ (function () {
             if (!rawType) {
                 return 'desktop';
             }
-            var _loop_1 = function (rawType_1, uaTypes) {
-                var type = rawType_1;
-                if (uaTypes.some(function (type) { return type === rawType_1; })) {
-                    return { value: type };
-                }
-            };
             try {
                 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()) {
-                    var _d = tslib_1.__read(_c.value, 2), rawType_1 = _d[0], uaTypes = _d[1];
-                    var state_1 = _loop_1(rawType_1, uaTypes);
-                    if (typeof state_1 === "object")
-                        return state_1.value;
+                    var _d = tslib_1.__read(_c.value, 2), _type = _d[0], uaTypes = _d[1];
+                    var type = _type;
+                    if (uaTypes.some(function (type) { return type === rawType; })) {
+                        return type;
+                    }
                 }
             }
             catch (e_1_1) { e_1 = { error: e_1_1 }; }

package/__inner__/esm/ui/ResponsiveProps/ResponsiveProps.js

@@ -5,8 +5,8 @@ import { useBreakpoint, useDeviceType } from '../../hooks';
 import { useResponsiveContext } from '../../provider';
 import { resolveBreakpoints } from '../utils';
 export var ResponsiveProps = function (_a) {
-    var _b;
-    var component = _a.component, props = _a.props, sharedPropsProp = _a.sharedProps, fallback = _a.fallback;
+    var _b, _c, _d;
+    var component = _a.component, props = _a.props, sharedPropsProp = _a.sharedProps, fallback = _a.fallback, childrenProp = _a.children;
     var store = useResponsiveContext().store;
     var breakpoint = useBreakpoint();
     var type = useDeviceType();
@@ -16,9 +16,6 @@ export var ResponsiveProps = function (_a) {
     };
     var Fallback = fallback !== null && fallback !== void 0 ? fallback : (function () { return null; });
     var rawNeededProps = (_b = resolveBreakpoints(store.scope, props, device)) === null || _b === void 0 ? void 0 : _b.value;
-    if (!rawNeededProps) {
-        return React.createElement(Fallback, null);
-    }
     var sharedProps = (function () {
         if (!sharedPropsProp) {
             return null;
@@ -31,6 +28,15 @@ export var ResponsiveProps = function (_a) {
     var neededProps = isFunction(rawNeededProps)
         ? rawNeededProps()
         : rawNeededProps;
+    var isNullProps = neededProps === null;
+    var isWithoutProps = rawNeededProps === undefined && !sharedProps && !childrenProp;
+    if (isNullProps || isWithoutProps) {
+        return React.createElement(Fallback, null);
+    }
     var Component = component;
-    return React.createElement(Component, __assign({}, sharedProps, neededProps));
+    var children = (_d = (_c = neededProps === null || neededProps === void 0 ? void 0 : neededProps.children) !== null && _c !== void 0 ? _c : sharedProps === null || sharedProps === void 0 ? void 0 : sharedProps.children) !== null && _d !== void 0 ? _d : childrenProp;
+    return (
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-expect-error
+    React.createElement(Component, __assign({}, sharedProps, neededProps), children));
 };

package/__inner__/esm/ui/utils/utils.js

@@ -10,8 +10,8 @@ export var resolveBreakpoints = function (scope, by, device) {
     var bestMixed = null;
     try {
         for (var _c = __values(Object.entries(by)), _d = _c.next(); !_d.done; _d = _c.next()) {
-            var _e = __read(_d.value, 2), rawKey = _e[0], Comp = _e[1];
-            if (!Comp) {
+            var _e = __read(_d.value, 2), rawKey = _e[0], value = _e[1];
+            if (!value && value !== null) {
                 continue;
             }
             var key = rawKey;
@@ -28,7 +28,7 @@ export var resolveBreakpoints = function (scope, by, device) {
             }
             var rank = SIZE_RANK[size];
             if (rank <= currentRank && (!bestMixed || rank > bestMixed.rank)) {
-                bestMixed = { key: key, rank: rank, value: Comp };
+                bestMixed = { key: key, rank: rank, value: value };
             }
         }
     }
@@ -43,7 +43,7 @@ export var resolveBreakpoints = function (scope, by, device) {
         return { key: bestMixed.key, value: bestMixed.value };
     }
     var typeOnly = by[device.type];
-    if (typeOnly) {
+    if (typeOnly || typeOnly === null) {
         return { key: device.type, value: typeOnly };
     }
     var bestSize = null;
@@ -51,12 +51,12 @@ export var resolveBreakpoints = function (scope, by, device) {
         for (var _g = __values(scope.sizesAscending), _h = _g.next(); !_h.done; _h = _g.next()) {
             var size = _h.value;
             var value = by[size];
-            if (!value) {
+            if (!value && value !== null) {
                 continue;
             }
             var rank = SIZE_RANK[size];
             if (rank <= currentRank && (!bestSize || rank > bestSize.rank)) {
-                bestSize = { key: size, rank: rank, value: value };
+                bestSize = { key: size, rank: rank, value: value !== null && value !== void 0 ? value : null };
             }
         }
     }
@@ -70,5 +70,5 @@ export var resolveBreakpoints = function (scope, by, device) {
     if (bestSize) {
         return { key: bestSize.key, value: bestSize.value };
     }
-    return null;
+    return undefined;
 };

package/__inner__/esm/user-agent/user-agent-parser.js

@@ -15,18 +15,13 @@ var UserAgentParser = /** @class */ (function () {
             if (!rawType) {
                 return 'desktop';
             }
-            var _loop_1 = function (rawType_1, uaTypes) {
-                var type = rawType_1;
-                if (uaTypes.some(function (type) { return type === rawType_1; })) {
-                    return { value: type };
-                }
-            };
             try {
                 for (var _b = __values(Object.entries(USER_AGENT_PARSER_TYPE_TO_INTERNAL_TYPE)), _c = _b.next(); !_c.done; _c = _b.next()) {
-                    var _d = __read(_c.value, 2), rawType_1 = _d[0], uaTypes = _d[1];
-                    var state_1 = _loop_1(rawType_1, uaTypes);
-                    if (typeof state_1 === "object")
-                        return state_1.value;
+                    var _d = __read(_c.value, 2), _type = _d[0], uaTypes = _d[1];
+                    var type = _type;
+                    if (uaTypes.some(function (type) { return type === rawType; })) {
+                        return type;
+                    }
                 }
             }
             catch (e_1_1) { e_1 = { error: e_1_1 }; }

package/__inner__/types/ui/ResponsiveProps/ResponsiveProps.d.ts

@@ -2,4 +2,4 @@ import type { ElementType } from 'react';
 import React from 'react';
 import type { Breakpoints } from '../../entities';
 import type { ResponsivePropsProps } from './types';
-export declare const ResponsiveProps: <TBreakpoints extends Breakpoints, Component extends ElementType>({ component, props, sharedProps: sharedPropsProp, fallback, }: ResponsivePropsProps<TBreakpoints, Component>) => React.JSX.Element;
+export declare const ResponsiveProps: <TBreakpoints extends Breakpoints, Component extends ElementType>({ component, props, sharedProps: sharedPropsProp, fallback, children: childrenProp, }: ResponsivePropsProps<TBreakpoints, Component>) => React.JSX.Element;

package/__inner__/types/ui/ResponsiveProps/types.d.ts

@@ -3,6 +3,7 @@ import type { Breakpoints, ByBreakpoints } from '../../entities';
 export type ResponsivePropsProps<TBreakpoints extends Breakpoints, Component extends ElementType> = {
     fallback?: () => ReactNode;
     component: Component;
-    props: ByBreakpoints<TBreakpoints, ComponentProps<Component> | (() => ComponentProps<Component>)>;
+    props: ByBreakpoints<TBreakpoints, Partial<ComponentProps<Component>> | null | (() => Partial<ComponentProps<Component>> | null)>;
     sharedProps?: Partial<ComponentProps<Component>> | (() => Partial<ComponentProps<Component>>);
+    children?: 'children' extends keyof ComponentProps<Component> ? ComponentProps<Component>['children'] : never;
 };

package/__inner__/types/ui/utils/utils.d.ts

@@ -2,5 +2,5 @@ import type { BreakpointKey, Breakpoints, Scope } from '../../entities';
 import type { BreakpointMap, DeviceInfo } from './types';
 export declare const resolveBreakpoints: <TBreakpoints extends Breakpoints, Value>(scope: Scope<TBreakpoints>, by: BreakpointMap<TBreakpoints, Value>, device: DeviceInfo<TBreakpoints>) => {
     key: BreakpointKey<TBreakpoints>;
-    value: Value;
-} | null;
+    value: Value | null;
+} | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ozen-ui/responsive",
-  "version": "0.84.0",
+  "version": "0.84.2",
   "description": "React component library",
   "files": [
     "*"
@@ -19,7 +19,7 @@
   "license": "MIT",
   "dependencies": {
     "ua-parser-js": "2.0.8",
-    "@ozen-ui/kit": "0.84.0"
+    "@ozen-ui/kit": "0.84.2"
   },
   "devDependencies": {
     "@types/lodash.isequal": "^4.5.0"