@unleash/proxy-client-react/dist/unleash-react.js

React interface for working with unleash

import { UnleashClient as H } from "unleash-proxy-client";
import { InMemoryStorageProvider as Z, LocalStorageProvider as $, UnleashClient as N } from "unleash-proxy-client";
import f, { useState as i, useEffect as g, useMemo as C, useContext as M, useRef as k } from "react";
const A = f.createContext(null), _ = {
  bootstrap: [],
  disableRefresh: !0,
  disableMetrics: !0,
  url: "http://localhost",
  appName: "offline",
  clientKey: "not-used"
}, q = "startTransition", I = f[q] || ((e) => e()), K = ({
  config: e,
  children: r,
  unleashClient: t,
  startClient: a = !0,
  stopClient: u = !0,
  startTransition: s = I
}) => {
  var E, h, m;
  const l = e || _, o = f.useRef(
    t || new H(l)
  ), [n, F] = f.useState(
    !!(t ? e != null && e.bootstrap && (e == null ? void 0 : e.bootstrapOverride) !== !1 || (E = t.isReady) != null && E.call(t) : l.bootstrap && l.bootstrapOverride !== !1)
  ), [x, b] = i(((m = (h = o.current).getError) == null ? void 0 : m.call(h)) || null);
  g(() => {
    !l && !t && console.error(
      `You must provide either a config or an unleash client to the flag provider.
        If you are initializing the client in useEffect, you can avoid this warning
        by checking if the client exists before rendering.`
    );
    const c = (y) => {
      s(() => {
        b((U) => U || y);
      });
    }, R = (y) => {
      s(() => {
        b(null);
      });
    };
    let p = null;
    const P = () => {
      p = setTimeout(() => {
        s(() => {
          F(!0);
        });
      }, 0);
    };
    return o.current.on("ready", P), o.current.on("error", c), o.current.on("recovered", R), a && (o.current.stop(), o.current.start()), function() {
      o.current && (o.current.off("error", c), o.current.off("ready", P), o.current.off("recovered", R), u && o.current.stop()), p && clearTimeout(p);
    };
  }, []);
  const T = C(
    () => ({
      on: (...c) => o.current.on(...c),
      off: (...c) => o.current.off(...c),
      isEnabled: (...c) => o.current.isEnabled(...c),
      updateContext: async (...c) => await o.current.updateContext(...c),
      getVariant: (...c) => o.current.getVariant(...c),
      client: o.current,
      flagsReady: n,
      flagsError: x,
      setFlagsReady: F,
      setFlagsError: b
    }),
    [n, x]
  );
  return /* @__PURE__ */ f.createElement(A.Provider, { value: T }, r);
}, S = {
  on: (e, r, t) => (console.error("on() must be used within a FlagProvider"), v),
  off: (e, r) => (console.error("off() must be used within a FlagProvider"), v),
  updateContext: async () => {
    console.error("updateContext() must be used within a FlagProvider");
  },
  isEnabled: () => (console.error("isEnabled() must be used within a FlagProvider"), !1),
  getVariant: () => (console.error("getVariant() must be used within a FlagProvider"), { name: "disabled", enabled: !1 })
}, v = {
  ...S,
  toggles: [],
  impressionDataAll: {},
  context: {},
  storage: {},
  start: () => {
  },
  stop: () => {
  },
  isReady: () => !1,
  getError: () => null,
  getAllToggles: () => []
}, O = {
  ...S,
  client: v,
  flagsReady: !1,
  setFlagsReady: () => {
    console.error("setFlagsReady() must be used within a FlagProvider");
  },
  flagsError: null,
  setFlagsError: () => {
    console.error("setFlagsError() must be used within a FlagProvider");
  }
};
function d() {
  const e = M(A);
  return e || (console.error("useFlagContext() must be used within a FlagProvider"), O);
}
const L = (e) => {
  const { isEnabled: r, client: t } = d(), [a, u] = i(!!r(e)), s = k();
  return s.current = a, g(() => {
    if (!t)
      return;
    const l = () => {
      const n = r(e);
      n !== s.current && (s.current = n, u(!!n));
    }, o = () => {
      const n = r(e);
      s.current = n, u(n);
    };
    return t.on("update", l), t.on("ready", o), () => {
      t.off("update", l), t.off("ready", o);
    };
  }, [t]), a;
}, Y = () => {
  const { client: e } = d(), [r, t] = i(e.getAllToggles());
  return g(() => {
    const a = () => {
      t(e.getAllToggles());
    };
    return e.on("update", a), () => {
      e.off("update", a);
    };
  }, []), r;
}, j = () => {
  const { flagsReady: e, flagsError: r } = d();
  return { flagsReady: e, flagsError: r };
}, z = (e, r) => {
  var a, u, s, l;
  return !(e.name === (r == null ? void 0 : r.name) && e.enabled === (r == null ? void 0 : r.enabled) && e.feature_enabled === (r == null ? void 0 : r.feature_enabled) && ((a = e.payload) == null ? void 0 : a.type) === ((u = r == null ? void 0 : r.payload) == null ? void 0 : u.type) && ((s = e.payload) == null ? void 0 : s.value) === ((l = r == null ? void 0 : r.payload) == null ? void 0 : l.value));
}, G = (e) => {
  const { getVariant: r, client: t } = d(), [a, u] = i(r(e)), s = k({
    name: a.name,
    enabled: a.enabled
  });
  return s.current = a, g(() => {
    if (!t)
      return;
    const l = () => {
      const n = r(e);
      z(s.current, n) && (u(n), s.current = n);
    }, o = () => {
      const n = r(e);
      s.current.name = n == null ? void 0 : n.name, s.current.enabled = n == null ? void 0 : n.enabled, u(n);
    };
    return t.on("update", l), t.on("ready", o), () => {
      t.off("update", l), t.off("ready", o);
    };
  }, [t]), a || {};
}, J = () => {
  const { updateContext: e } = d();
  return e;
}, Q = () => {
  const { client: e } = d();
  return e;
};
export {
  A as FlagContext,
  K as FlagProvider,
  Z as InMemoryStorageProvider,
  $ as LocalStorageProvider,
  N as UnleashClient,
  K as default,
  L as useFlag,
  Y as useFlags,
  j as useFlagsStatus,
  Q as useUnleashClient,
  J as useUnleashContext,
  G as useVariant
};
//# sourceMappingURL=unleash-react.js.map