@apicurio/common-ui-components 2.1.0 → 2.1.1

package/dist/auth/AuthConfigContext.d.ts

@@ -26,6 +26,28 @@ export interface OidcAuthOptions {
      * @default 300000 (5 minutes)
      */
     stateMaxAge?: number;
+    /**
+     * Custom redirect handler for client-side navigation after OIDC authentication.
+     * This allows React Router or other routing libraries to handle navigation
+     * without causing a full page refresh.
+     *
+     * If not provided, defaults to `window.location.href = location` which causes
+     * a full page reload.
+     *
+     * @example
+     * // With React Router v6
+     * import { useNavigate } from 'react-router-dom';
+     *
+     * const navigate = useNavigate();
+     * const authConfig = {
+     *   type: "oidc",
+     *   options: {
+     *     // ... other options
+     *     onRedirect: (location) => navigate(location)
+     *   }
+     * };
+     */
+    onRedirect?: (location: string) => void;
 }
 export interface AuthConfig {
     type: "none" | "basic" | "oidc";

package/dist/main.js

@@ -1,4 +1,4 @@
-import H, { createContext as ut, useContext as _t, useState as T, useEffect as pe, memo as Re, forwardRef as ne, useCallback as De, useMemo as qe } from "react";
+import F, { createContext as ut, useContext as _t, useState as T, useEffect as pe, memo as Re, forwardRef as ne, useCallback as De, useMemo as qe } from "react";
 import { jsx as a, jsxs as v, Fragment as Ue } from "react/jsx-runtime";
 import { useInterval as pt, Tooltip as ft, EmptyState as oe, EmptyStateVariant as wt, EmptyStateHeader as ae, EmptyStateBody as Se, Spinner as te, Alert as mt, Dropdown as vt, MenuToggle as Be, DropdownList as St, Divider as Ke, DropdownItem as yt, Select as bt, SelectOption as kt, TextInput as ce, Button as le, TextArea as Tt, AboutModal as It, TextContent as Et, Text as $e, TextVariants as Le, TextList as je, TextListItem as b, Modal as Ae, Form as ze, FormGroup as He, Progress as Ct, EmptyStateIcon as Ve, ChipGroup as Pt, Chip as Rt, InputGroup as Ut, ButtonVariant as At, Pagination as xt, PaginationVariant as Ot, Skeleton as Nt } from "@patternfly/react-core";
 import { EllipsisVIcon as Dt, ChevronDownIcon as qt, ChevronRightIcon as $t, ErrorCircleOIcon as Lt, SearchIcon as jt } from "@patternfly/react-icons";
@@ -65,39 +65,39 @@ var Qt = {
   },
   error: () => {
   }
-}, L, j, he = /* @__PURE__ */ ((e) => (e[e.NONE = 0] = "NONE", e[e.ERROR = 1] = "ERROR", e[e.WARN = 2] = "WARN", e[e.INFO = 3] = "INFO", e[e.DEBUG = 4] = "DEBUG", e))(he || {});
+}, j, H, he = /* @__PURE__ */ ((e) => (e[e.NONE = 0] = "NONE", e[e.ERROR = 1] = "ERROR", e[e.WARN = 2] = "WARN", e[e.INFO = 3] = "INFO", e[e.DEBUG = 4] = "DEBUG", e))(he || {});
 ((e) => {
   function t() {
-    L = 3, j = Qt;
+    j = 3, H = Qt;
   }
   e.reset = t;
   function s(r) {
     if (!(0 <= r && r <= 4))
       throw new Error("Invalid log level");
-    L = r;
+    j = r;
   }
   e.setLevel = s;
   function i(r) {
-    j = r;
+    H = r;
   }
   e.setLogger = i;
 })(he || (he = {}));
-var p = class q {
+var p = class $ {
   constructor(t) {
     this._name = t;
   }
   /* eslint-disable @typescript-eslint/no-unsafe-enum-comparison */
   debug(...t) {
-    L >= 4 && j.debug(q._format(this._name, this._method), ...t);
+    j >= 4 && H.debug($._format(this._name, this._method), ...t);
   }
   info(...t) {
-    L >= 3 && j.info(q._format(this._name, this._method), ...t);
+    j >= 3 && H.info($._format(this._name, this._method), ...t);
   }
   warn(...t) {
-    L >= 2 && j.warn(q._format(this._name, this._method), ...t);
+    j >= 2 && H.warn($._format(this._name, this._method), ...t);
   }
   error(...t) {
-    L >= 1 && j.error(q._format(this._name, this._method), ...t);
+    j >= 1 && H.error($._format(this._name, this._method), ...t);
   }
   /* eslint-enable @typescript-eslint/no-unsafe-enum-comparison */
   throw(t) {
@@ -108,7 +108,7 @@ var p = class q {
     return s._method = t, s.debug("begin"), s;
   }
   static createStatic(t, s) {
-    const i = new q(`${t}.${s}`);
+    const i = new $(`${t}.${s}`);
     return i.debug("begin"), i;
   }
   static _format(t, s) {
@@ -118,16 +118,16 @@ var p = class q {
   /* eslint-disable @typescript-eslint/no-unsafe-enum-comparison */
   // helpers for static class methods
   static debug(t, ...s) {
-    L >= 4 && j.debug(q._format(t), ...s);
+    j >= 4 && H.debug($._format(t), ...s);
   }
   static info(t, ...s) {
-    L >= 3 && j.info(q._format(t), ...s);
+    j >= 3 && H.info($._format(t), ...s);
   }
   static warn(t, ...s) {
-    L >= 2 && j.warn(q._format(t), ...s);
+    j >= 2 && H.warn($._format(t), ...s);
   }
   static error(t, ...s) {
-    L >= 1 && j.error(q._format(t), ...s);
+    j >= 1 && H.error($._format(t), ...s);
   }
   /* eslint-enable @typescript-eslint/no-unsafe-enum-comparison */
 };
@@ -152,7 +152,7 @@ var ge = class {
     ), c = C.encodeBase64Url(new Uint8Array(o));
     return `${n}.${c}`;
   }
-}, Xt = "10000000-1000-4000-8000-100000000000", ye = (e) => btoa([...new Uint8Array(e)].map((t) => String.fromCharCode(t)).join("")), Ge = class $ {
+}, Xt = "10000000-1000-4000-8000-100000000000", ye = (e) => btoa([...new Uint8Array(e)].map((t) => String.fromCharCode(t)).join("")), Ge = class L {
   static _randomWord() {
     const t = new Uint32Array(1);
     return crypto.getRandomValues(t), t[0];
@@ -163,14 +163,14 @@ var ge = class {
   static generateUUIDv4() {
     return Xt.replace(
       /[018]/g,
-      (s) => (+s ^ $._randomWord() & 15 >> +s / 4).toString(16)
+      (s) => (+s ^ L._randomWord() & 15 >> +s / 4).toString(16)
     ).replace(/-/g, "");
   }
   /**
    * PKCE: Generate a code verifier
    */
   static generateCodeVerifier() {
-    return $.generateUUIDv4() + $.generateUUIDv4() + $.generateUUIDv4();
+    return L.generateUUIDv4() + L.generateUUIDv4() + L.generateUUIDv4();
   }
   /**
    * PKCE: Generate a code challenge
@@ -239,8 +239,8 @@ var ge = class {
       default:
         throw new Error("Unknown jwk type");
     }
-    const i = await $.hash("SHA-256", JSON.stringify(s));
-    return $.encodeBase64Url(i);
+    const i = await L.hash("SHA-256", JSON.stringify(s));
+    return L.encodeBase64Url(i);
   }
   static async generateDPoPProof({
     url: t,
@@ -256,7 +256,7 @@ var ge = class {
       htu: t,
       iat: Math.floor(Date.now() / 1e3)
     };
-    s && (o = await $.hash("SHA-256", s), c = $.encodeBase64Url(o), l.ath = c), n && (l.nonce = n);
+    s && (o = await L.hash("SHA-256", s), c = L.encodeBase64Url(o), l.ath = c), n && (l.nonce = n);
     try {
       const d = await crypto.subtle.exportKey("jwk", r.publicKey), h = {
         alg: "ES256",
@@ -276,7 +276,7 @@ var ge = class {
   static async generateDPoPJkt(t) {
     try {
       const s = await crypto.subtle.exportKey("jwk", t.publicKey);
-      return await $.customCalculateJwkThumbprint(s);
+      return await L.customCalculateJwkThumbprint(s);
     } catch (s) {
       throw s instanceof TypeError ? new Error(`Could not retrieve dpop keys from storage: ${s.message}`) : s;
     }
@@ -692,10 +692,10 @@ var C = Ge, J = class {
     ui_locales: k,
     acr_values: x,
     resource: I,
-    response_mode: N,
+    response_mode: D,
     // behavior flags
     filterProtocolClaims: P = !0,
-    loadUserInfo: F = !1,
+    loadUserInfo: M = !1,
     requestTimeoutInSeconds: R,
     staleStateAgeInSeconds: w = rs,
     mergeClaimsStrategy: E = { array: "replace" },
@@ -706,20 +706,20 @@ var C = Ge, J = class {
     fetchRequestCredentials: f,
     refreshTokenAllowedScope: m,
     // extra
-    extraQueryParams: D = {},
+    extraQueryParams: q = {},
     extraTokenParams: B = {},
     extraHeaders: K = {},
     dpop: X,
     omitScopeWhenRequesting: we = !1
   }) {
     var Y;
-    if (this.authority = e, t ? this.metadataUrl = t : (this.metadataUrl = e, e && (this.metadataUrl.endsWith("/") || (this.metadataUrl += "/"), this.metadataUrl += ".well-known/openid-configuration")), this.metadata = s, this.metadataSeed = r, this.signingKeys = i, this.client_id = n, this.client_secret = o, this.response_type = c, this.scope = l, this.redirect_uri = d, this.post_logout_redirect_uri = h, this.client_authentication = g, this.prompt = _, this.display = S, this.max_age = A, this.ui_locales = k, this.acr_values = x, this.resource = I, this.response_mode = N, this.filterProtocolClaims = P ?? !0, this.loadUserInfo = !!F, this.staleStateAgeInSeconds = w, this.mergeClaimsStrategy = E, this.omitScopeWhenRequesting = we, this.disablePKCE = !!U, this.revokeTokenAdditionalContentTypes = V, this.fetchRequestCredentials = f || "same-origin", this.requestTimeoutInSeconds = R, y)
+    if (this.authority = e, t ? this.metadataUrl = t : (this.metadataUrl = e, e && (this.metadataUrl.endsWith("/") || (this.metadataUrl += "/"), this.metadataUrl += ".well-known/openid-configuration")), this.metadata = s, this.metadataSeed = r, this.signingKeys = i, this.client_id = n, this.client_secret = o, this.response_type = c, this.scope = l, this.redirect_uri = d, this.post_logout_redirect_uri = h, this.client_authentication = g, this.prompt = _, this.display = S, this.max_age = A, this.ui_locales = k, this.acr_values = x, this.resource = I, this.response_mode = D, this.filterProtocolClaims = P ?? !0, this.loadUserInfo = !!M, this.staleStateAgeInSeconds = w, this.mergeClaimsStrategy = E, this.omitScopeWhenRequesting = we, this.disablePKCE = !!U, this.revokeTokenAdditionalContentTypes = V, this.fetchRequestCredentials = f || "same-origin", this.requestTimeoutInSeconds = R, y)
       this.stateStore = y;
     else {
       const se = typeof window < "u" ? window.localStorage : new Qe();
       this.stateStore = new Xe({ store: se });
     }
-    if (this.refreshTokenAllowedScope = m, this.extraQueryParams = D, this.extraTokenParams = B, this.extraHeaders = K, this.dpop = X, this.dpop && !((Y = this.dpop) != null && Y.store))
+    if (this.refreshTokenAllowedScope = m, this.extraQueryParams = q, this.extraTokenParams = B, this.extraHeaders = K, this.dpop = X, this.dpop && !((Y = this.dpop) != null && Y.store))
       throw new Error("A DPoPStore is required when dpop is enabled");
   }
 }, ns = class {
@@ -1044,9 +1044,9 @@ var C = Ge, J = class {
     extraQueryParams: k,
     extraTokenParams: x,
     disablePKCE: I,
-    dpopJkt: N,
+    dpopJkt: D,
     omitScopeWhenRequesting: P,
-    ...F
+    ...M
   }) {
     if (!t)
       throw this._logger.error("create: No url passed"), new Error("url");
@@ -1074,10 +1074,10 @@ var C = Ge, J = class {
       extraTokenParams: x,
       skipUserInfo: A
     }), w = new URL(t);
-    w.searchParams.append("client_id", i), w.searchParams.append("redirect_uri", r), w.searchParams.append("response_type", n), P || w.searchParams.append("scope", o), g && w.searchParams.append("nonce", g), N && w.searchParams.append("dpop_jkt", N);
+    w.searchParams.append("client_id", i), w.searchParams.append("redirect_uri", r), w.searchParams.append("response_type", n), P || w.searchParams.append("scope", o), g && w.searchParams.append("nonce", g), D && w.searchParams.append("dpop_jkt", D);
     let E = R.id;
     _ && (E = `${E}${G}${_}`), w.searchParams.append("state", E), R.code_challenge && (w.searchParams.append("code_challenge", R.code_challenge), w.searchParams.append("code_challenge_method", "S256")), S && (Array.isArray(S) ? S : [S]).forEach((y) => w.searchParams.append("resource", y));
-    for (const [U, y] of Object.entries({ response_mode: l, ...F, ...k }))
+    for (const [U, y] of Object.entries({ response_mode: l, ...M, ...k }))
       y != null && w.searchParams.append(U, y.toString());
     return new tt({
       url: w.href,
@@ -1203,9 +1203,9 @@ var as = et, cs = "openid", me = class {
     ui_locales: k = this.settings.ui_locales,
     acr_values: x = this.settings.acr_values,
     resource: I = this.settings.resource,
-    response_mode: N = this.settings.response_mode,
+    response_mode: D = this.settings.response_mode,
     extraQueryParams: P = this.settings.extraQueryParams,
-    extraTokenParams: F = this.settings.extraTokenParams,
+    extraTokenParams: M = this.settings.extraTokenParams,
     dpopJkt: R,
     omitScopeWhenRequesting: w = this.settings.omitScopeWhenRequesting
   }) {
@@ -1235,9 +1235,9 @@ var as = et, cs = "openid", me = class {
       request: t,
       request_uri: s,
       extraQueryParams: P,
-      extraTokenParams: F,
+      extraTokenParams: M,
       request_type: i,
-      response_mode: N,
+      response_mode: D,
       client_secret: this.settings.client_secret,
       skipUserInfo: o,
       nonce: c,
@@ -1593,15 +1593,15 @@ var as = et, cs = "openid", me = class {
       monitorSession: k = !1,
       monitorAnonymousSession: x = !1,
       checkSessionIntervalInSeconds: I = ws,
-      query_status_response_type: N = "code",
+      query_status_response_type: D = "code",
       stopCheckSessionOnError: P = !0,
-      revokeTokenTypes: F = ["access_token", "refresh_token"],
+      revokeTokenTypes: M = ["access_token", "refresh_token"],
       revokeTokensOnSignout: R = !1,
       includeIdTokenInSilentSignout: w = !1,
       accessTokenExpiringNotificationTimeInSeconds: E = fs,
       userStore: U
     } = e;
-    if (super(e), this.popup_redirect_uri = t, this.popup_post_logout_redirect_uri = s, this.popupWindowFeatures = i, this.popupWindowTarget = r, this.redirectMethod = n, this.redirectTarget = o, this.iframeNotifyParentOrigin = c, this.iframeScriptOrigin = l, this.silent_redirect_uri = h, this.silentRequestTimeoutInSeconds = g || d || at, this.automaticSilentRenew = _, this.validateSubOnSilentRenew = S, this.includeIdTokenInSilentRenew = A, this.monitorSession = k, this.monitorAnonymousSession = x, this.checkSessionIntervalInSeconds = I, this.stopCheckSessionOnError = P, this.query_status_response_type = N, this.revokeTokenTypes = F, this.revokeTokensOnSignout = R, this.includeIdTokenInSilentSignout = w, this.accessTokenExpiringNotificationTimeInSeconds = E, U)
+    if (super(e), this.popup_redirect_uri = t, this.popup_post_logout_redirect_uri = s, this.popupWindowFeatures = i, this.popupWindowTarget = r, this.redirectMethod = n, this.redirectTarget = o, this.iframeNotifyParentOrigin = c, this.iframeScriptOrigin = l, this.silent_redirect_uri = h, this.silentRequestTimeoutInSeconds = g || d || at, this.automaticSilentRenew = _, this.validateSubOnSilentRenew = S, this.includeIdTokenInSilentRenew = A, this.monitorSession = k, this.monitorAnonymousSession = x, this.checkSessionIntervalInSeconds = I, this.stopCheckSessionOnError = P, this.query_status_response_type = D, this.revokeTokenTypes = M, this.revokeTokensOnSignout = R, this.includeIdTokenInSilentSignout = w, this.accessTokenExpiringNotificationTimeInSeconds = E, U)
       this.userStore = U;
     else {
       const y = typeof window < "u" ? window.sessionStorage : new Qe();
@@ -2380,7 +2380,7 @@ var as = et, cs = "openid", me = class {
     return await C.generateDPoPJkt(t.keys);
   }
 };
-const Ps = ["url", "clientId", "redirectUri", "scope", "logoutUrl", "loadUserInfo", "useStateBasedRedirect", "stateMaxAge"], Rs = "openid profile email", fe = "apicurio.oidc.state.", Us = 3e5;
+const Ps = ["url", "clientId", "redirectUri", "scope", "logoutUrl", "loadUserInfo", "useStateBasedRedirect", "stateMaxAge", "onRedirect"], Rs = "openid profile email", fe = "apicurio.oidc.state.", Us = 3e5;
 function As(e, t) {
   const s = {};
   return e.forEach((i) => {
@@ -2431,21 +2431,21 @@ function qs(e) {
 function $s(e) {
   return !e || e.trim() === "" ? !1 : !e.startsWith("/") || e.includes("://") ? (console.warn(`[Auth] Invalid redirect location (must be relative path): ${e}`), !1) : e.toLowerCase().startsWith("javascript:") ? (console.warn(`[Auth] Blocked potentially malicious redirect location: ${e}`), !1) : !0;
 }
-let u, M;
-const Ls = (e) => (M = As(Ps, e), new Cs({
-  authority: M.url,
-  client_id: M.clientId,
-  redirect_uri: M.redirectUri,
+let u, O;
+const Ls = (e) => (O = As(Ps, e), new Cs({
+  authority: O.url,
+  client_id: O.clientId,
+  redirect_uri: O.redirectUri,
   response_type: "code",
-  scope: M.scope || Rs,
+  scope: O.scope || Rs,
   filterProtocolClaims: !0,
   includeIdTokenInSilentRenew: !0,
   includeIdTokenInSilentSignout: !0,
-  loadUserInfo: M.loadUserInfo ?? !0
+  loadUserInfo: O.loadUserInfo ?? !0
 })), js = async () => {
   try {
     console.debug("[Auth] Logging in using OIDC");
-    const e = new URL(window.location.href), t = await (u == null ? void 0 : u.getUser()), s = M.useStateBasedRedirect !== !1, i = M.stateMaxAge || Us;
+    const e = new URL(window.location.href), t = await (u == null ? void 0 : u.getUser()), s = O.useStateBasedRedirect !== !1, i = O.stateMaxAge || Us;
     if (s && qs(i), e.searchParams.get("state") || t) {
       const r = await (u == null ? void 0 : u.signinRedirectCallback());
       if (u == null || u.startSilentRenew(), console.debug("[Auth] Started silent token renewal"), s && (r != null && r.state)) {
@@ -2453,7 +2453,7 @@ const Ls = (e) => (M = As(Ps, e), new Cs({
         if (n) {
           const o = Ns(n);
           if (Ds(n), o && $s(o)) {
-            console.debug(`[Auth] Redirecting to stored location: ${o}`), window.location.href = o;
+            console.debug(`[Auth] Redirecting to stored location: ${o}`), O.onRedirect ? O.onRedirect(o) : window.location.href = o;
             return;
           } else
             console.debug("[Auth] No valid stored location found, staying at current page");
@@ -2479,7 +2479,7 @@ const Ls = (e) => (M = As(Ps, e), new Cs({
   const e = await (u == null ? void 0 : u.getUser()), t = e == null ? void 0 : e.id_token;
   return u == null ? void 0 : u.removeUser().then(() => u == null ? void 0 : u.signoutRedirect({
     id_token_hint: t,
-    post_logout_redirect_uri: M.logoutUrl || window.location.href
+    post_logout_redirect_uri: O.logoutUrl || window.location.href
   }));
 }, Ms = async () => await (u == null ? void 0 : u.getUser()) != null, Ws = async () => {
   const e = await (u == null ? void 0 : u.getUser());
@@ -2565,24 +2565,24 @@ const Ks = async (e, t) => {
   return pe(() => {
     o();
   }, [e.date]), n === "fromNow" ? /* @__PURE__ */ a(ft, { content: /* @__PURE__ */ a("span", { children: i }), children: /* @__PURE__ */ a("span", { children: t }) }) : /* @__PURE__ */ a("span", { children: t });
-}, ci = (e) => /* @__PURE__ */ a(Ce, { date: e.date, format: "fromNow" }), O = ({ condition: e, children: t }) => (typeof e == "boolean" ? e : e()) ? /* @__PURE__ */ a(H.Fragment, { children: t }) : /* @__PURE__ */ a(H.Fragment, {}), li = ({ collection: e, emptyState: t, emptyStateTitle: s, emptyStateMessage: i, children: r }) => {
+}, ci = (e) => /* @__PURE__ */ a(Ce, { date: e.date, format: "fromNow" }), N = ({ condition: e, children: t }) => (typeof e == "boolean" ? e : e()) ? /* @__PURE__ */ a(F.Fragment, { children: t }) : /* @__PURE__ */ a(F.Fragment, {}), li = ({ collection: e, emptyState: t, emptyStateTitle: s, emptyStateMessage: i, children: r }) => {
   const n = () => !e || e.length === 0, o = t || /* @__PURE__ */ v(oe, { variant: wt.xs, children: [
     /* @__PURE__ */ a(ae, { titleText: s || "None found", headingLevel: "h4" }),
     /* @__PURE__ */ a(Se, { children: i || "No items found." })
   ] });
-  return n() ? /* @__PURE__ */ a(H.Fragment, { children: o }) : /* @__PURE__ */ a(H.Fragment, { children: r });
+  return n() ? /* @__PURE__ */ a(F.Fragment, { children: o }) : /* @__PURE__ */ a(F.Fragment, { children: r });
 }, _e = ({ isLoading: e, loadingComponent: t, children: s }) => {
   const i = () => typeof e == "boolean" ? e : e(), r = t || /* @__PURE__ */ a(te, {});
-  return i() ? /* @__PURE__ */ a(H.Fragment, { children: r }) : /* @__PURE__ */ a(H.Fragment, { children: s });
+  return i() ? /* @__PURE__ */ a(F.Fragment, { children: r }) : /* @__PURE__ */ a(F.Fragment, { children: s });
 }, di = ({ toolbar: e, alwaysShowToolbar: t, emptyState: s, filteredEmptyState: i, isLoading: r, isError: n, loadingComponent: o, errorComponent: c, isEmpty: l, isFiltered: d, children: h }) => {
   const g = t || !l || d || n;
-  return c || (c = /* @__PURE__ */ a("div", { style: { padding: "15px", backgroundColor: "white" }, children: /* @__PURE__ */ a(mt, { isInline: !0, variant: "danger", title: "Error: Something went wrong!", children: /* @__PURE__ */ a("p", { children: "Something went wrong with the action you attempted, but we're not sure what it was. Try reloading the page and hopef for a better result, or contact your admin to report the error." }) }) })), /* @__PURE__ */ v(H.Fragment, { children: [
-    /* @__PURE__ */ a(O, { condition: g, children: e }),
+  return c || (c = /* @__PURE__ */ a("div", { style: { padding: "15px", backgroundColor: "white" }, children: /* @__PURE__ */ a(mt, { isInline: !0, variant: "danger", title: "Error: Something went wrong!", children: /* @__PURE__ */ a("p", { children: "Something went wrong with the action you attempted, but we're not sure what it was. Try reloading the page and hopef for a better result, or contact your admin to report the error." }) }) })), /* @__PURE__ */ v(F.Fragment, { children: [
+    /* @__PURE__ */ a(N, { condition: g, children: e }),
     /* @__PURE__ */ v(_e, { isLoading: r, loadingComponent: o, children: [
-      /* @__PURE__ */ a(O, { condition: !l && !n, children: h }),
-      /* @__PURE__ */ a(O, { condition: l && d && !n, children: i }),
-      /* @__PURE__ */ a(O, { condition: l && !d && !n, children: s }),
-      /* @__PURE__ */ a(O, { condition: n, children: c })
+      /* @__PURE__ */ a(N, { condition: !l && !n, children: h }),
+      /* @__PURE__ */ a(N, { condition: l && d && !n, children: i }),
+      /* @__PURE__ */ a(N, { condition: l && !d && !n, children: s }),
+      /* @__PURE__ */ a(N, { condition: n, children: c })
     ] })
   ] });
 }, hi = (e) => {
@@ -2599,7 +2599,7 @@ const Ks = async (e, t) => {
     appendTo: e.menuAppendTo
   };
   let c = /* @__PURE__ */ a(Dt, { title: e.label });
-  return e.isKebab || (c = /* @__PURE__ */ a(H.Fragment, { children: e.label })), /* @__PURE__ */ a(
+  return e.isKebab || (c = /* @__PURE__ */ a(F.Fragment, { children: e.label })), /* @__PURE__ */ a(
     vt,
     {
       isOpen: t,
@@ -2718,11 +2718,11 @@ const Ks = async (e, t) => {
       /* @__PURE__ */ a("div", { className: "url-clear-button", children: /* @__PURE__ */ a(le, { "data-testid": `${e.testId}-clear`, variant: "control", isDisabled: !h(), onClick: S, children: "Clear" }) })
     ] }),
     /* @__PURE__ */ a("div", { className: "url-upload-preview", children: /* @__PURE__ */ v(_e, { isLoading: n, loadingComponent: A, children: [
-      /* @__PURE__ */ a(O, { condition: g, children: /* @__PURE__ */ v("div", { className: "url-upload-error", style: Ys, children: [
+      /* @__PURE__ */ a(N, { condition: g, children: /* @__PURE__ */ v("div", { className: "url-upload-error", style: Ys, children: [
         /* @__PURE__ */ a("div", { children: "Error getting content from URL." }),
         /* @__PURE__ */ a("div", { children: c })
       ] }) }),
-      /* @__PURE__ */ a(O, { condition: !g(), children: /* @__PURE__ */ a(
+      /* @__PURE__ */ a(N, { condition: !g(), children: /* @__PURE__ */ a(
         Tt,
         {
           "data-testid": `${e.testId}-preview`,
@@ -2903,23 +2903,23 @@ const Ks = async (e, t) => {
       /* AUTHENTICATED */
     );
   }, []), /* @__PURE__ */ v(Ue, { children: [
-    /* @__PURE__ */ a(O, { condition: t === 0 && i.isOidcAuthEnabled(), children: /* @__PURE__ */ v(oe, { children: [
+    /* @__PURE__ */ a(N, { condition: t === 0 && i.isOidcAuthEnabled(), children: /* @__PURE__ */ v(oe, { children: [
       /* @__PURE__ */ a(ae, { titleText: "Loading", headingLevel: "h4" }),
       /* @__PURE__ */ a(Se, { children: /* @__PURE__ */ a(te, { size: "xl", "aria-label": "Loading spinner" }) })
     ] }) }),
-    /* @__PURE__ */ a(O, { condition: t === 0 && i.isBasicAuthEnabled(), children: /* @__PURE__ */ a(Zs, { onLogin: r }) }),
-    /* @__PURE__ */ a(O, { condition: t === 2, children: /* @__PURE__ */ v(oe, { children: [
+    /* @__PURE__ */ a(N, { condition: t === 0 && i.isBasicAuthEnabled(), children: /* @__PURE__ */ a(Zs, { onLogin: r }) }),
+    /* @__PURE__ */ a(N, { condition: t === 2, children: /* @__PURE__ */ v(oe, { children: [
       /* @__PURE__ */ a(ae, { titleText: "Empty state", headingLevel: "h4", icon: /* @__PURE__ */ a(Ve, { icon: Lt }) }),
       /* @__PURE__ */ a(Se, { children: "Authentication failed." })
     ] }) }),
-    /* @__PURE__ */ a(O, { condition: t === 1, children: e.children })
+    /* @__PURE__ */ a(N, { condition: t === 1, children: e.children })
   ] });
 }, mi = (e) => {
   const t = lt();
   return (() => {
     let i = !0;
     return e.enabled !== void 0 && (i = i && (t.isOidcAuthEnabled() === e.enabled || t.isBasicAuthEnabled() === e.enabled)), i;
-  })() ? /* @__PURE__ */ a(H.Fragment, { children: e.children }) : /* @__PURE__ */ a(H.Fragment, {});
+  })() ? /* @__PURE__ */ a(F.Fragment, { children: e.children }) : /* @__PURE__ */ a(F.Fragment, {});
 }, vi = (e) => /* @__PURE__ */ a(Pt, { categoryName: e.categoryName || "Filters", isClosable: !0, onClick: e.onClearAllCriteria, children: e.criteria.map((t, s) => /* @__PURE__ */ v(Rt, { onClick: () => e.onRemoveCriteria(t), children: [
   /* @__PURE__ */ a("b", { children: t.filterBy.label }),
   /* @__PURE__ */ a("span", { children: ": " }),
@@ -3032,17 +3032,17 @@ const ki = ({
   children: k,
   variant: x
 }) => {
-  const [I, N] = T(1e3);
+  const [I, D] = T(1e3);
   let P;
-  const F = ({ width: f }) => {
+  const M = ({ width: f }) => {
     P && cancelAnimationFrame(P), f && (P = requestAnimationFrame(() => {
-      N(f);
+      D(f);
     }));
-  }, { ref: R } = Bt({ onResize: F }), w = I >= 576, E = De(
+  }, { ref: R } = Bt({ onResize: M }), w = I >= 576, E = De(
     (f) => w && f !== 0 && f !== s.length - 1,
     [s, w]
   ), U = qe(() => s.map((f, m) => {
-    const D = ne(
+    const q = ne(
       ({ children: B, ...K }, X) => /* @__PURE__ */ a(
         ht,
         {
@@ -3057,8 +3057,8 @@ const ki = ({
         }
       )
     );
-    return D.displayName = "ResponsiveThCurried", r({
-      Th: D,
+    return q.displayName = "ResponsiveThCurried", r({
+      Th: q,
       key: `header_${f}`,
       column: f,
       colIndex: m
@@ -3073,7 +3073,7 @@ const ki = ({
   ]), y = De(
     (f) => {
       const m = ne(
-        ({ children: D, ...B }, K) => /* @__PURE__ */ a(
+        ({ children: q, ...B }, K) => /* @__PURE__ */ a(
           Pe,
           {
             position: f,
@@ -3082,7 +3082,7 @@ const ki = ({
             canHide: E(f),
             ...B,
             ref: K,
-            children: D
+            children: q
           }
         )
       );
@@ -3114,14 +3114,14 @@ const ki = ({
             }
           ),
           i == null ? void 0 : i.map((f, m) => {
-            const D = l !== void 0 && l({ row: f, rowIndex: m }), B = d !== void 0 && d({ row: f, rowIndex: m }), K = !D && g ? () => g({ row: f, rowIndex: m }) : void 0, X = s.map((Y, se) => n({
+            const q = l !== void 0 && l({ row: f, rowIndex: m }), B = d !== void 0 && d({ row: f, rowIndex: m }), K = !q && g ? () => g({ row: f, rowIndex: m }) : void 0, X = s.map((Y, se) => n({
               Td: V[se],
               key: `row_${m}_cell_${Y}`,
               column: Y,
               colIndex: se,
               rowIndex: m,
               row: f
-            })), we = !D && o && /* @__PURE__ */ a(
+            })), we = !q && o && /* @__PURE__ */ a(
               Pe,
               {
                 position: s.length,
@@ -3136,7 +3136,7 @@ const ki = ({
             return /* @__PURE__ */ v(
               gt,
               {
-                isDeleted: D,
+                isDeleted: q,
                 isSelected: B,
                 onClick: K,
                 rowOuiaId: S == null ? void 0 : S({ row: f, rowIndex: m }),
@@ -3226,7 +3226,7 @@ export {
   gt as DeletableRow,
   vi as FilterChips,
   ci as FromNow,
-  O as If,
+  N as If,
   mi as IfAuth,
   li as IfNotEmpty,
   _e as IfNotLoading,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@apicurio/common-ui-components",
   "private": false,
-  "version": "2.1.0",
+  "version": "2.1.1",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",