@iress-oss/ids-components 0.0.1-dev.2 → 0.0.1-dev.3

package/dist/patterns/Loading/LoadingSuspense.js

@@ -1,51 +1,53 @@
-import { jsxs as R, Fragment as v, jsx as r } from "react/jsx-runtime";
-import { useMemo as a, useRef as C, useState as b, Suspense as k, useEffect as F } from "react";
-import { Q as f } from "../../Loading-rKDsRTjZ.js";
+import { jsxs as d, Fragment as a, jsx as n } from "react/jsx-runtime";
+import { useMemo as S, useRef as F, useState as g, useEffect as b, Suspense as R } from "react";
+import { Q as i } from "../../Loading-rKDsRTjZ.js";
 import { useSuspenseResource as I, uncacheSuspenseResource as E } from "./hooks/useSuspenseResource.js";
-const x = ({
+const k = ({
   children: s,
-  delay: l,
-  onLoaded: u,
+  delay: r,
+  onLoaded: l,
   pattern: e,
   startFrom: c,
   ...t
 }) => {
-  const o = a(() => l || (e === "component" || e === "default" || e === "validate" ? 0 : e === "long" ? 1300 : 250), [l, e]), d = a(() => c || (e === "component" || e === "default" || e === "long" ? 0 : 250), [c, e]), m = C(!1), [n, j] = b(!1), h = f.shouldRender(n, o, d, 0), [i, S] = b(!1), g = () => {
-    m.current || (m.current = !0, j(() => !0), h ? setTimeout(() => {
-      S(!0), u == null || u();
-    }, o) : (S(!0), u == null || u()));
+  const w = S(() => r || (e === "component" || e === "default" || e === "validate" ? 0 : e === "long" ? 1300 : 500), [r, e]), x = S(() => c || (e === "component" || e === "default" || e === "long" ? 0 : 250), [c, e]), m = F(!1), [u, j] = g(!1), o = i.shouldRender(u, w, x), [f, C] = g(!1);
+  b(() => {
+    u && !o && (C(!0), l == null || l());
+  }, [u, l, o]);
+  const h = () => {
+    m.current || (m.current = !0, j(() => !0));
   };
-  return e === "component" || e === "validate" ? /* @__PURE__ */ R(v, { children: [
-    /* @__PURE__ */ r(
-      f,
+  return e === "component" || e === "validate" ? /* @__PURE__ */ d(a, { children: [
+    /* @__PURE__ */ n(
+      i,
       {
         pattern: e,
-        loaded: n,
+        loaded: u,
         ...t,
-        children: i && s
+        children: f && s
       }
     ),
-    /* @__PURE__ */ r(k, { fallback: null, children: !i && /* @__PURE__ */ r(w, { onResolved: g, children: !n && s }) })
-  ] }) : /* @__PURE__ */ R(v, { children: [
-    h && /* @__PURE__ */ r(
-      f,
+    /* @__PURE__ */ n(R, { fallback: null, children: !f && /* @__PURE__ */ n(v, { onResolved: h, children: !u && s }) })
+  ] }) : /* @__PURE__ */ d(a, { children: [
+    o && /* @__PURE__ */ n(
+      i,
       {
         pattern: e,
-        loaded: n,
+        loaded: u,
         ...t
       }
     ),
-    /* @__PURE__ */ r(k, { fallback: null, children: i ? s : /* @__PURE__ */ r(w, { onResolved: g, children: !n && s }) })
+    /* @__PURE__ */ n(R, { fallback: null, children: f ? s : /* @__PURE__ */ n(v, { onResolved: h, children: !u && s }) })
   ] });
 };
-x.use = I;
-x.uncache = E;
-const w = ({
+k.use = I;
+k.uncache = E;
+const v = ({
   onResolved: s,
-  children: l
-}) => (F(() => {
+  children: r
+}) => (b(() => {
   s();
-}, [s]), l);
+}, [s]), r);
 export {
-  x as IressLoadingSuspense
+  k as IressLoadingSuspense
 };

package/dist/src/patterns/Loading/LoadingSuspense.d.ts

@@ -5,7 +5,7 @@ import { PageLoadingProps } from './components/PageLoading';
 import { ComponentLoadingProps } from './components/ComponentLoading';
 import { LongLoadingProps } from './components/LongLoading';
 import { DefaultLoadingProps } from './components/DefaultLoading';
-type IressLoadingSuspenseProps = (Omit<StartUpLoadingProps, 'loaded'> | ValidateLoadingProps | Omit<PageLoadingProps, 'loaded'> | Omit<ComponentLoadingProps, 'loaded'> | Omit<LongLoadingProps, 'loaded'> | DefaultLoadingProps) & {
+export type IressLoadingSuspenseProps = (Omit<StartUpLoadingProps, 'loaded'> | ValidateLoadingProps | Omit<PageLoadingProps, 'loaded'> | Omit<ComponentLoadingProps, 'loaded'> | Omit<LongLoadingProps, 'loaded'> | DefaultLoadingProps) & {
     /**
      * The content that will be rendered inside the Suspense boundary.
      * Typically includes lazy-loaded components and components that use the `use` or `IressLoadingSuspense.use` hook.
@@ -71,4 +71,3 @@ export declare const IressLoadingSuspense: {
      */
     uncache: (fetcher: () => Promise<unknown>, timeout?: number) => void;
 };
-export {};

package/dist/src/patterns/Loading/hooks/useShouldRenderLoading.d.ts

@@ -4,6 +4,7 @@
  * @param isLoaded - A boolean value that determines if the component waiting to be loaded has finished loading.
  * @param delay - Once a component has loaded, how long should the loading indicator be displayed for. This is useful to allow the loading indicator to animate out.
  * @param startFrom - If a component is still loading after this time in milliseconds, you should show the loading message. Default is 500ms, meaning a user will not even see the loading indicator if the page loads before this time.
+ * @param avoidDelayTimeout - If the component has a start up animation, this is the time in milliseconds that we will avoid the delay timeout for. This is useful to speed up the loading indicator removal if the component loaded before the first half of an animation finishes.
  * @returns A boolean value that determines whether the `IressLoading` component should be rendered.
  */
 export declare const useShouldRenderLoading: (isLoaded: boolean, delay?: number, startFrom?: number, avoidDelayTimeout?: number) => boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iress-oss/ids-components",
-  "version": "0.0.1-dev.2",
+  "version": "0.0.1-dev.3",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },