@canlooks/can-ui 0.0.106 → 0.0.107

package/dist/cjs/components/deferred/deferred.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+export type DeferredPropsWithoutValue = {
+    init?: ReactNode;
+    value?: undefined;
+    children?: ReactNode | ((updating: boolean, deferredValue: undefined) => ReactNode);
+};
+export type DeferredPropsWithValue<T> = {
+    init?: ReactNode;
+    value: T;
+    children?: ReactNode | ((updating: boolean, deferredValue: T) => ReactNode);
+};
+export declare function Deferred(props: DeferredPropsWithoutValue): ReactNode;
+export declare function Deferred<T>(props: DeferredPropsWithValue<T>): ReactNode;

package/dist/cjs/components/deferred/deferred.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Deferred = Deferred;
+const react_1 = require("react");
+function Deferred({ init, value, children }) {
+    const [initialized, setInitialized] = (0, react_1.useState)(false);
+    const deferredInitialized = (0, react_1.useDeferredValue)(initialized);
+    (0, react_1.useEffect)(() => {
+        setInitialized(true);
+    }, []);
+    const deferredValue = (0, react_1.useDeferredValue)(value);
+    if (!deferredInitialized) {
+        return init;
+    }
+    return typeof children === 'function'
+        ? children(deferredValue !== value, deferredValue)
+        : children;
+}

package/dist/cjs/components/deferred/index.d.ts

@@ -0,0 +1 @@
+export * from './deferred';

package/dist/cjs/components/deferred/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./deferred"), exports);

package/dist/cjs/index.d.ts

@@ -28,6 +28,7 @@ export * from './components/curd';
 export * from './components/dataGrid';
 export * from './components/dateTimePicker';
 export * from './components/dateTimeRangePicker';
+export * from './components/deferred';
 export * from './components/descriptions';
 export * from './components/dialog';
 export * from './components/divider';

package/dist/cjs/index.js

@@ -31,6 +31,7 @@ tslib_1.__exportStar(require("./components/curd"), exports);
 tslib_1.__exportStar(require("./components/dataGrid"), exports);
 tslib_1.__exportStar(require("./components/dateTimePicker"), exports);
 tslib_1.__exportStar(require("./components/dateTimeRangePicker"), exports);
+tslib_1.__exportStar(require("./components/deferred"), exports);
 tslib_1.__exportStar(require("./components/descriptions"), exports);
 tslib_1.__exportStar(require("./components/dialog"), exports);
 tslib_1.__exportStar(require("./components/divider"), exports);

package/dist/esm/components/deferred/deferred.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+export type DeferredPropsWithoutValue = {
+    init?: ReactNode;
+    value?: undefined;
+    children?: ReactNode | ((updating: boolean, deferredValue: undefined) => ReactNode);
+};
+export type DeferredPropsWithValue<T> = {
+    init?: ReactNode;
+    value: T;
+    children?: ReactNode | ((updating: boolean, deferredValue: T) => ReactNode);
+};
+export declare function Deferred(props: DeferredPropsWithoutValue): ReactNode;
+export declare function Deferred<T>(props: DeferredPropsWithValue<T>): ReactNode;

package/dist/esm/components/deferred/deferred.js

@@ -0,0 +1,15 @@
+import { useDeferredValue, useEffect, useState } from 'react';
+export function Deferred({ init, value, children }) {
+    const [initialized, setInitialized] = useState(false);
+    const deferredInitialized = useDeferredValue(initialized);
+    useEffect(() => {
+        setInitialized(true);
+    }, []);
+    const deferredValue = useDeferredValue(value);
+    if (!deferredInitialized) {
+        return init;
+    }
+    return typeof children === 'function'
+        ? children(deferredValue !== value, deferredValue)
+        : children;
+}

package/dist/esm/components/deferred/index.d.ts

@@ -0,0 +1 @@
+export * from './deferred';

package/dist/esm/components/deferred/index.js

@@ -0,0 +1 @@
+export * from './deferred';

package/dist/esm/index.d.ts

@@ -28,6 +28,7 @@ export * from './components/curd';
 export * from './components/dataGrid';
 export * from './components/dateTimePicker';
 export * from './components/dateTimeRangePicker';
+export * from './components/deferred';
 export * from './components/descriptions';
 export * from './components/dialog';
 export * from './components/divider';

package/dist/esm/index.js

@@ -28,6 +28,7 @@ export * from './components/curd';
 export * from './components/dataGrid';
 export * from './components/dateTimePicker';
 export * from './components/dateTimeRangePicker';
+export * from './components/deferred';
 export * from './components/descriptions';
 export * from './components/dialog';
 export * from './components/divider';