@planningcenter/topbar 11.2.5-qa-827.0 → 11.2.5-qa-832.0

package/dist/topbar.js

@@ -6,6 +6,7 @@ var pcoUrl$1 = require('@planningcenter/url');
 var general = require('@planningcenter/icons/paths/general');
 var Jolt = require('@planningcenter/jolt-client');
 var shim = require('use-sync-external-store/shim');
+require('react/jsx-runtime');
 var tapestryReact = require('@planningcenter/tapestry-react');
 var addOns = require('@planningcenter/add-ons');
 var churchCenter = require('@planningcenter/icons/paths/church-center');
@@ -2248,10 +2249,750 @@ const sortByAttribute = attr => arr => arr.slice().sort((a, b) => a[attr].locale
 const appsMenuFormatter = apps => sortByAttribute("name")(apps).reduce((acc, item) => (item.name || "") === "Church Center" || (item.name || "") === "API" ? acc : item.name === "Home" ? [item, ...acc] : [...acc, item], []);
 const connectedPeopleMenuFormatter = connectedPeople => connectedPeople.slice().sort((a, b) => a.attributes["organization_name"].localeCompare(b.attributes["organization_name"]));
 
+// Generated by scripts/write-version.cjs from package.json. Do not edit.
+const BRIDGE_VERSION = "0.0.7-qa-41.0";
+
+/**
+ * PCA_BRIDGE_BUS_INIT — the script injected via
+ * `injectedJavaScriptBeforeContentLoaded` before any web content loads.
+ *
+ * Installs `window.__pcaBridge` in the WebView's JS context. The bus:
+ *   - is per-WebView-context-by-construction (each WebView has its own JS
+ *     context; the global lives only in that context)
+ *   - accepts multiple registered handlers per reserved message type so
+ *     multiple Bridge instances in the same WebView can coexist
+ *   - buffers messages of a type with no registered handlers for up to 5s
+ *   - pings native with `__bridge/busReady` after install so the native
+ *     transport can flush its outgoing queue and trigger `reannounceLocal()`
+ *
+ * The bus runs as an IIFE so consumers can dispatch and register against it
+ * immediately. Internal state (buffers, handlers) is closure-private.
+ */
+
+const PCA_BRIDGE_BUS_INIT = `
+(function () {
+  if (typeof window === 'undefined') return
+  if (window.__pcaBridge) return  // idempotent in case it's injected twice
+
+  var BRIDGE_VERSION = ${JSON.stringify(BRIDGE_VERSION)}
+  var BUFFER_TTL_MS = 5000
+  var handlers = Object.create(null)  // type -> Array<fn>
+  var buffer = Object.create(null)    // type -> Array<{msg, receivedAt}>
+  var logger = {
+    debug: function () {},
+    warn: function (msg, ctx) {
+      try { console.warn('[pca-bridge]', msg, ctx) } catch (e) {}
+    },
+    error: function (msg, ctx) {
+      try { console.error('[pca-bridge]', msg, ctx) } catch (e) {}
+    }
+  }
+
+  function now() { return Date.now() }
+
+  function sweepBuffer() {
+    var cutoff = now() - BUFFER_TTL_MS
+    var dropped = []
+    var hasAny = false
+    for (var type in buffer) {
+      var entries = buffer[type]
+      var kept = []
+      for (var i = 0; i < entries.length; i++) {
+        if (entries[i].receivedAt >= cutoff) {
+          kept.push(entries[i])
+        } else {
+          dropped.push({ type: type, ageMs: now() - entries[i].receivedAt })
+        }
+      }
+      if (kept.length === 0) delete buffer[type]
+      else {
+        buffer[type] = kept
+        hasAny = true
+      }
+    }
+    if (dropped.length > 0 && window.ReactNativeWebView && typeof window.ReactNativeWebView.postMessage === 'function') {
+      try {
+        window.ReactNativeWebView.postMessage(JSON.stringify({
+          type: '__bridge/drop',
+          bridgeVersion: BRIDGE_VERSION,
+          messages: dropped
+        }))
+      } catch (e) {}
+    }
+    // Stop ticking when the buffer drains; ensureSweep() restarts on demand.
+    if (!hasAny && sweepInterval !== null) {
+      clearInterval(sweepInterval)
+      sweepInterval = null
+    }
+  }
+
+  var sweepInterval = null
+  function ensureSweep() {
+    if (sweepInterval !== null) return
+    sweepInterval = setInterval(sweepBuffer, 1000)
+  }
+
+  function register(type, fn) {
+    if (!handlers[type]) handlers[type] = []
+    handlers[type].push(fn)
+    // Drain any buffered messages for this type, applying the same TTL the
+    // background sweep uses so entries that already expired don't get
+    // delivered just because sweep hasn't run yet.
+    var pending = buffer[type]
+    if (pending && pending.length > 0) {
+      delete buffer[type]
+      var cutoff = now() - BUFFER_TTL_MS
+      for (var i = 0; i < pending.length; i++) {
+        if (pending[i].receivedAt < cutoff) continue
+        try { fn(pending[i].msg) } catch (e) {
+          logger.error('Handler threw while draining buffer', { type: type, error: e })
+        }
+      }
+    }
+  }
+
+  function unregister(type, fn) {
+    var arr = handlers[type]
+    if (!arr) return
+    var idx = arr.indexOf(fn)
+    if (idx >= 0) arr.splice(idx, 1)
+    if (arr.length === 0) delete handlers[type]
+  }
+
+  function dispatch(msg) {
+    if (!msg || typeof msg !== 'object' || typeof msg.type !== 'string') return
+    var type = msg.type
+    var arr = handlers[type]
+    if (arr && arr.length > 0) {
+      // Snapshot the array to avoid issues if a handler registers/unregisters during dispatch
+      var snapshot = arr.slice()
+      for (var i = 0; i < snapshot.length; i++) {
+        try { snapshot[i](msg) } catch (e) {
+          logger.error('Handler threw during dispatch', { type: type, error: e })
+        }
+      }
+    } else {
+      if (!buffer[type]) buffer[type] = []
+      buffer[type].push({ msg: msg, receivedAt: now() })
+      ensureSweep()
+    }
+  }
+
+  function setLogger(next) {
+    // Validate both methods the bus actually calls; a partial logger would
+    // throw TypeError when dispatch/register tries to invoke a missing one.
+    if (next && typeof next.warn === 'function' && typeof next.error === 'function') {
+      logger = next
+    }
+  }
+
+  window.__pcaBridge = {
+    register: register,
+    unregister: unregister,
+    dispatch: dispatch,
+    setLogger: setLogger
+  }
+
+  // Ping native: the bus is ready in this JS context. Native transport
+  // listens for this to (a) flush its outgoing queue and (b) call
+  // bridge.reannounceLocal() so the freshly-loaded web context learns about
+  // already-exposed local actions/values.
+  try {
+    if (window.ReactNativeWebView && typeof window.ReactNativeWebView.postMessage === 'function') {
+      window.ReactNativeWebView.postMessage(JSON.stringify({ type: '__bridge/busReady', bridgeVersion: BRIDGE_VERSION }))
+    }
+  } catch (e) {}
+})();
+true;
+`;
+
+class TimeoutError extends Error {
+  constructor(name, timeoutMs) {
+    super(`Call to "${name}" timed out after ${timeoutMs}ms`);
+    this.name = 'TimeoutError';
+  }
+}
+class HandlerError extends Error {
+  constructor(name, code, originalMessage) {
+    super(`Handler for "${name}" threw [${code}]: ${originalMessage}`);
+    this.name = 'HandlerError';
+  }
+}
+class DisposedError extends Error {
+  constructor(name) {
+    super(`Bridge disposed while call to "${name}" was in flight`);
+    this.name = 'DisposedError';
+  }
+}
+
+let idCounter = 0;
+function generateId() {
+  idCounter += 1;
+  return `pca-bridge-${idCounter}`;
+}
+const noopLogger = {
+  debug: () => {},
+  warn: () => {},
+  error: () => {}
+};
+function isIndexable(x) {
+  return typeof x === 'object' && x !== null;
+}
+
+/**
+ * Shallow equality, one level deep. Used by `BridgeCore.publish` to dedup
+ * re-emissions of new-but-content-equal values (e.g., a freshly-built
+ * `modalButtons` array whose contents didn't change between renders).
+ */
+function shallowEqual(a, b) {
+  const sameRef = Object.is(a, b);
+  const bothComparableObjects = isIndexable(a) && isIndexable(b) && Array.isArray(a) === Array.isArray(b);
+  let result;
+  if (sameRef) {
+    result = true;
+  } else if (!bothComparableObjects) {
+    result = false;
+  } else {
+    const keys = Object.keys(a);
+    result = keys.length === Object.keys(b).length && keys.every(k => Object.prototype.hasOwnProperty.call(b, k) && Object.is(a[k], b[k]));
+  }
+  return result;
+}
+function isWireEnvelope(parsed) {
+  return typeof parsed === 'object' && parsed !== null && 'type' in parsed && typeof parsed.type === 'string' && parsed.type.startsWith('__bridge/') && 'bridgeVersion' in parsed && typeof parsed.bridgeVersion === 'string';
+}
+function parseWireEnvelope(rawData) {
+  let parsed;
+  try {
+    parsed = JSON.parse(rawData);
+  } catch {
+    parsed = null;
+  }
+  return isWireEnvelope(parsed) ? parsed : null;
+}
+
+const DEFAULT_TIMEOUT_MS = 5000;
+const INCOMING_CALL_QUEUE_TTL_MS = 5000;
+const INCOMING_CALL_QUEUE_MAX_PER_ACTION = 32;
+class BridgeCore {
+  injectedJavaScriptBeforeContentLoaded = PCA_BRIDGE_BUS_INIT;
+  localVersion = BRIDGE_VERSION;
+  // `never` arg type lets us widen any user-defined `LocalActions[K]` callable
+  // with a single `as` cast inside `expose()`.
+  localActions = new Map();
+  localValues = new Map();
+  remoteActions = new Set();
+  remoteValues = new Map();
+  actionListeners = new Map();
+  valueListeners = new Map();
+  pendingCalls = new Map();
+  callQueue = new Map();
+
+  // Private backing field + public getter so the `readonly` declared on the
+  // Bridge interface is actually enforced — not just at the interface level
+  // but for any code holding a concrete BridgeCore reference.
+  _remoteVersion = undefined;
+  get remoteVersion() {
+    return this._remoteVersion;
+  }
+  disposed = false;
+  constructor(options) {
+    const sendRaw = options.send;
+    this.send = msg => {
+      sendRaw({
+        ...msg,
+        bridgeVersion: BRIDGE_VERSION
+      });
+    };
+    this.logger = options.logger ?? noopLogger;
+    this.defaultTimeoutMs = options.defaultTimeoutMs ?? DEFAULT_TIMEOUT_MS;
+    this.now = options.now ?? Date.now;
+  }
+  call(name, args, options) {
+    const requestId = generateId();
+    const timeoutMs = options?.timeoutMs ?? this.defaultTimeoutMs;
+    return new Promise((resolve, reject) => {
+      const timer = setTimeout(() => {
+        if (this.pendingCalls.delete(requestId)) {
+          reject(new TimeoutError(name, timeoutMs));
+        }
+      }, timeoutMs);
+      // Heterogeneous map: cast the typed resolve to the loose storage slot.
+      this.pendingCalls.set(requestId, {
+        name,
+        resolve: resolve,
+        reject,
+        timer
+      });
+      this.send({
+        type: '__bridge/call',
+        requestId,
+        name,
+        args
+      });
+    });
+  }
+  expose(name, handler) {
+    if (this.localActions.has(name)) {
+      this.logger.warn('Action already exposed; last-write-wins (the previous handler is gone)', {
+        name
+      });
+    }
+    this.localActions.set(name, handler);
+    this.send({
+      type: '__bridge/exposed',
+      name,
+      kind: 'action'
+    });
+    const queued = this.callQueue.get(name);
+    if (queued) {
+      this.callQueue.delete(name);
+      const cutoff = this.now() - INCOMING_CALL_QUEUE_TTL_MS;
+      for (const entry of queued) {
+        if (entry.receivedAt >= cutoff) {
+          void this.invokeLocalHandler(entry.msg);
+        } else {
+          this.logger.warn('Queued incoming call expired before handler registered', {
+            name,
+            ageMs: this.now() - entry.receivedAt
+          });
+          this.rejectQueued(entry, 'expired');
+        }
+      }
+    }
+  }
+  unexpose(name) {
+    if (this.localActions.delete(name)) {
+      this.send({
+        type: '__bridge/unexposed',
+        name,
+        kind: 'action'
+      });
+    }
+  }
+  hasRemoteAction(name) {
+    return this.remoteActions.has(name);
+  }
+  onRemoteAction(name, callback) {
+    let set = this.actionListeners.get(name);
+    if (!set) {
+      set = new Set();
+      this.actionListeners.set(name, set);
+    }
+    set.add(callback);
+    return () => {
+      const current = this.actionListeners.get(name);
+      if (current) {
+        current.delete(callback);
+        if (current.size === 0) {
+          this.actionListeners.delete(name);
+        }
+      }
+    };
+  }
+  publish(name, value) {
+    // Skip wire send if content unchanged — callers may publish on every
+    // render with a fresh-but-content-equal value.
+    if (!shallowEqual(this.localValues.get(name), value)) {
+      this.localValues.set(name, value);
+      this.send({
+        type: '__bridge/publish',
+        name,
+        value
+      });
+    }
+  }
+  unpublish(name) {
+    if (this.localValues.delete(name)) {
+      this.send({
+        type: '__bridge/unexposed',
+        name,
+        kind: 'value'
+      });
+    }
+  }
+  seedLocalValue(name, value) {
+    this.localValues.set(name, value);
+  }
+  getRemoteValue(name) {
+    return this.remoteValues.get(name);
+  }
+  onRemoteValue(name, callback) {
+    let set = this.valueListeners.get(name);
+    if (!set) {
+      set = new Set();
+      this.valueListeners.set(name, set);
+    }
+    const wrapped = callback;
+    set.add(wrapped);
+    return () => {
+      const current = this.valueListeners.get(name);
+      if (current) {
+        current.delete(wrapped);
+        if (current.size === 0) {
+          this.valueListeners.delete(name);
+        }
+      }
+    };
+  }
+  reannounceLocal() {
+    for (const name of this.localActions.keys()) {
+      this.send({
+        type: '__bridge/exposed',
+        name,
+        kind: 'action'
+      });
+    }
+    for (const [name, value] of this.localValues) {
+      this.send({
+        type: '__bridge/exposed',
+        name,
+        kind: 'value',
+        currentValue: value
+      });
+    }
+  }
+
+  /**
+   * Drop remote-side cached state. Called by transports when the remote JS
+   * context is about to be torn down (e.g., WebView reload): the new context
+   * will re-announce what it actually exposes, and stale entries would
+   * otherwise silently mask removed actions/values.
+   */
+  clearRemoteState() {
+    for (const name of this.remoteActions) {
+      this.notifySet(this.actionListeners, name, false, 'action availability');
+    }
+    this.remoteActions.clear();
+    for (const name of this.remoteValues.keys()) {
+      this.notifySet(this.valueListeners, name, undefined, 'remote value change');
+    }
+    this.remoteValues.clear();
+    this._remoteVersion = undefined;
+  }
+  handleMessage(rawData) {
+    const msg = parseWireEnvelope(rawData);
+    let consumed = false;
+    if (msg) {
+      this.handleIncomingMessage(msg);
+      consumed = true;
+    }
+    return consumed;
+  }
+  applyLogger(logger) {
+    if (this.logger === noopLogger) {
+      this.logger = logger;
+      return true;
+    }
+    return false;
+  }
+  handleLoadStart() {}
+  handleLoadEnd() {}
+  handleNavigationStateChange(navState) {
+    if (!navState.loading) {
+      this.handleLoadEnd();
+    }
+  }
+  handleIncomingMessage(msg) {
+    if (!this.disposed) {
+      this._remoteVersion = msg.bridgeVersion;
+      switch (msg.type) {
+        case '__bridge/call':
+          void this.routeIncomingCall(msg);
+          break;
+        case '__bridge/response':
+          this.handleIncomingResponse(msg);
+          break;
+        case '__bridge/exposed':
+          this.handleIncomingExposed(msg);
+          break;
+        case '__bridge/unexposed':
+          this.handleIncomingUnexposed(msg);
+          break;
+        case '__bridge/publish':
+          this.handleIncomingPublish(msg);
+          break;
+        case '__bridge/busReady':
+        case '__bridge/drop':
+          break;
+        default:
+          {
+            // parseWireEnvelope admits any `__bridge/*` type; this catches
+            // future message types a remote on a newer bridge sends to us.
+            const unknown = msg;
+            this.logger.warn('Received unknown bridge message type; ignoring', {
+              type: unknown.type,
+              remoteVersion: this.remoteVersion
+            });
+            break;
+          }
+      }
+    }
+  }
+  get debug() {
+    return {
+      listLocalActions: () => Array.from(this.localActions.keys()),
+      listRemoteActions: () => Array.from(this.remoteActions),
+      listLocalValues: () => Array.from(this.localValues.keys()),
+      listRemoteValues: () => Array.from(this.remoteValues.keys())
+    };
+  }
+  dispose() {
+    if (!this.disposed) {
+      this.disposed = true;
+      for (const pending of this.pendingCalls.values()) {
+        clearTimeout(pending.timer);
+        pending.reject(new DisposedError(pending.name));
+      }
+      this.pendingCalls.clear();
+      this.callQueue.clear();
+    }
+  }
+  async routeIncomingCall(msg) {
+    if (this.localActions.has(msg.name)) {
+      await this.invokeLocalHandler(msg);
+      return;
+    }
+    let queued = this.callQueue.get(msg.name);
+    if (!queued) {
+      queued = [];
+      this.callQueue.set(msg.name, queued);
+    }
+    // Evict TTL-expired and over-capacity entries so a remote that spams an
+    // unknown action can't grow the queue without bound. Each evicted call
+    // gets an error response so the caller fails fast.
+    const cutoff = this.now() - INCOMING_CALL_QUEUE_TTL_MS;
+    while (queued.length > 0) {
+      const head = queued[0];
+      if (!head || head.receivedAt >= cutoff) break;
+      queued.shift();
+      this.rejectQueued(head, 'expired');
+    }
+    while (queued.length >= INCOMING_CALL_QUEUE_MAX_PER_ACTION) {
+      const evicted = queued.shift();
+      if (!evicted) break;
+      this.rejectQueued(evicted, 'queue_full');
+    }
+    queued.push({
+      msg,
+      receivedAt: this.now()
+    });
+  }
+  rejectQueued(entry, code) {
+    this.send({
+      type: '__bridge/response',
+      requestId: entry.msg.requestId,
+      ok: false,
+      code,
+      message: `Queued call to "${entry.msg.name}" dropped (${code})`
+    });
+  }
+  async invokeLocalHandler(msg) {
+    // Handler may have been unregistered between queue push and drain. Reply
+    // with an explicit error so the caller fails fast instead of timing out.
+    const handler = this.localActions.get(msg.name);
+    if (!handler) {
+      this.send({
+        type: '__bridge/response',
+        requestId: msg.requestId,
+        ok: false,
+        code: 'unexposed',
+        message: `No handler exposed for "${msg.name}"`
+      });
+      return;
+    }
+    try {
+      const result = await handler(msg.args);
+      this.send({
+        type: '__bridge/response',
+        requestId: msg.requestId,
+        ok: true,
+        result
+      });
+    } catch (error) {
+      this.send({
+        type: '__bridge/response',
+        requestId: msg.requestId,
+        ok: false,
+        code: 'thrown',
+        message: error instanceof Error ? error.message : String(error)
+      });
+    }
+  }
+  handleIncomingResponse(msg) {
+    const pending = this.pendingCalls.get(msg.requestId);
+    if (pending) {
+      this.pendingCalls.delete(msg.requestId);
+      clearTimeout(pending.timer);
+      if (msg.ok) {
+        pending.resolve(msg.result);
+      } else {
+        pending.reject(new HandlerError(pending.name, msg.code, msg.message));
+      }
+    } else {
+      this.logger.warn('Response for unknown or already-resolved requestId', {
+        requestId: msg.requestId
+      });
+    }
+  }
+  handleIncomingExposed(msg) {
+    if (msg.kind === 'action') {
+      if (!this.remoteActions.has(msg.name)) {
+        this.remoteActions.add(msg.name);
+        this.notifySet(this.actionListeners, msg.name, true, 'action availability');
+      }
+    } else {
+      this.remoteValues.set(msg.name, msg.currentValue);
+      this.notifySet(this.valueListeners, msg.name, msg.currentValue, 'remote value change');
+    }
+  }
+  handleIncomingUnexposed(msg) {
+    if (msg.kind === 'action') {
+      if (this.remoteActions.delete(msg.name)) {
+        this.notifySet(this.actionListeners, msg.name, false, 'action availability');
+      }
+    } else if (this.remoteValues.delete(msg.name)) {
+      this.notifySet(this.valueListeners, msg.name, undefined, 'remote value change');
+    }
+  }
+  handleIncomingPublish(msg) {
+    this.remoteValues.set(msg.name, msg.value);
+    this.notifySet(this.valueListeners, msg.name, msg.value, 'remote value change');
+  }
+  notifySet(subs, name, value, label) {
+    const set = subs.get(name);
+    if (set) {
+      for (const callback of set) {
+        try {
+          callback(value);
+        } catch (error) {
+          this.logger.error(`Subscriber threw during ${label} notification`, {
+            name,
+            error
+          });
+        }
+      }
+    }
+  }
+}
+
+// Subset of window.__pcaBridge that bridge_web.ts needs.
+
+const INBOUND_TYPES = ['__bridge/call', '__bridge/response', '__bridge/exposed', '__bridge/unexposed', '__bridge/publish'];
+class WebBridge extends BridgeCore {
+  constructor(options = {}) {
+    const bus = window.__pcaBridge;
+    super({
+      send: msg => {
+        if (window.ReactNativeWebView) {
+          try {
+            window.ReactNativeWebView.postMessage(JSON.stringify(msg));
+          } catch (error) {
+            options.logger?.error('WebBridge postMessage failed', {
+              error
+            });
+          }
+        }
+      },
+      logger: options.logger,
+      defaultTimeoutMs: options.defaultTimeoutMs
+    });
+    this.bus = bus;
+    this.handlerFn = msg => {
+      this.handleIncomingMessage(msg);
+    };
+    if (bus) {
+      if (options.logger) {
+        bus.setLogger(options.logger);
+      }
+      for (const type of INBOUND_TYPES) {
+        bus.register(type, this.handlerFn);
+      }
+      if (window.ReactNativeWebView) {
+        try {
+          window.ReactNativeWebView.postMessage(JSON.stringify({
+            type: '__bridge/busReady',
+            bridgeVersion: BRIDGE_VERSION
+          }));
+        } catch (error) {
+          options.logger?.error('WebBridge busReady post failed', {
+            error
+          });
+        }
+      }
+    } else {
+      options.logger?.warn('WebBridge constructed without window.__pcaBridge — bus init script may not have run');
+    }
+  }
+  applyLogger(logger) {
+    const applied = super.applyLogger(logger);
+    if (applied && this.bus) {
+      this.bus.setLogger(logger);
+    }
+    return applied;
+  }
+  dispose() {
+    if (this.bus) {
+      for (const type of INBOUND_TYPES) {
+        this.bus.unregister(type, this.handlerFn);
+      }
+    }
+    super.dispose();
+  }
+}
+function getOrCreateWebBridge(options = {}) {
+  if (window.__pcaWebBridge && options.logger) {
+    window.__pcaWebBridge.applyLogger(options.logger);
+  } else if (!window.__pcaWebBridge) {
+    window.__pcaWebBridge = new WebBridge(options);
+  }
+  return window.__pcaWebBridge;
+}
+
+const WebBridgeContext = /*#__PURE__*/React.createContext(null);
+function useWebBridge() {
+  const ctxBridge = React.useContext(WebBridgeContext);
+  if (ctxBridge) {
+    // oxlint-disable-next-line typescript/no-unsafe-type-assertion
+    return ctxBridge;
+  } else {
+    // oxlint-disable-next-line typescript/no-unsafe-type-assertion
+    return getOrCreateWebBridge();
+  }
+}
+function useBridgePublish(bridge, name, value) {
+  // publish() dedups by shallow equality, so this effect is safe to re-run
+  // on every value change without spamming wire messages.
+  React.useEffect(() => {
+    bridge.publish(name, value);
+  }, [bridge, name, value]);
+  React.useEffect(() => {
+    return () => {
+      bridge.unpublish(name);
+    };
+  }, [bridge, name]);
+}
+
 const useSetCurrentRouteInfo = ({
   routes,
   app
 }) => {
+  const bridge = useWebBridge();
+  useBridgePublish(bridge, "routeInfo", {
+    currentApp: app,
+    currentRoutes: routes.map(({
+      key,
+      props: {
+        to,
+        href,
+        active
+      }
+    }) => ({
+      active,
+      name: key,
+      url: to !== null && to !== void 0 ? to : href
+    }))
+  });
   React.useEffect(() => {
     if (window.topbar) {
       window.topbar.routeInfo = {
@@ -3627,11 +4368,6 @@ const {
   LoadingIndicator: LoadingIndicator$1,
   StackView: StackView$1
 } = addOns.components;
-function CalendlyWidget(props) {
-  return props.url ? /*#__PURE__*/React.createElement(reactCalendly.InlineWidget, {
-    ...props
-  }) : null;
-}
 function HelpdeskComponent({
   appName,
   closeDrawer,
@@ -3700,69 +4436,14 @@ function HelpdeskComponent({
       spacing: 1
     }, /*#__PURE__*/React.createElement(DrawerHeading, null, "Help and support"), /*#__PURE__*/React.createElement(LoadingIndicator$1, null)))),
     additionalComponents: {
-      CalendlyWidget: {
-        component: CalendlyWidget,
-        properties: {
-          pageSettings: {
-            attribute: false
-          },
-          prefill: {
-            attribute: false
-          },
-          styles: {
-            attribute: false
-          },
-          url: {
-            type: String
-          }
-        }
-      },
-      DocumentationSearch: {
-        component: DocumentationSearch,
-        properties: {
-          currentAppName: {
-            type: String
-          },
-          indexName: {
-            type: String
-          }
-        }
-      },
-      DrawerHeader: {
-        component: DrawerHeader,
-        properties: {
-          closeDrawer: {
-            type: Function,
-            event: false
-          }
-        }
-      },
+      // @ts-expect-error TODO: Relax type specification in add-ons-js to not require children
+      CalendlyWidget: reactCalendly.InlineWidget,
+      DocumentationSearch,
+      DrawerHeader,
       DrawerHeading,
-      PicobotIframe: {
-        component: PicobotIframe,
-        properties: {
-          currentPath: {
-            attribute: false
-          },
-          onChangePath: {
-            type: Function,
-            event: false
-          },
-          onMessage: {
-            type: Function,
-            event: false
-          }
-        }
-      },
+      PicobotIframe,
       ScrollContainer,
-      SwitchView: {
-        component: SwitchView,
-        properties: {
-          activeIndex: {
-            type: Number
-          }
-        }
-      }
+      SwitchView
     },
     args: {
       appName,
@@ -4366,13 +5047,8 @@ const {
 function NavLinkWithBadge({
   children,
   badge,
-  borderBottomColor,
-  borderBottomStyle,
-  borderBottomWidth,
-  color,
-  fontSize,
-  fontWeight,
-  onClick
+  onClick,
+  ...rest
 }) {
   return /*#__PURE__*/React.createElement(tapestryReact.StackView, {
     as: "button",
@@ -4382,14 +5058,7 @@ function NavLinkWithBadge({
     paddingBottom: 0.75,
     onClick: () => onClick(),
     spacing: 1,
-    ...{
-      borderBottomColor,
-      borderBottomStyle,
-      borderBottomWidth,
-      color,
-      fontSize,
-      fontWeight
-    }
+    ...rest
   }, children, badge && /*#__PURE__*/React.createElement(tapestryReact.Badge, {
     size: "sm",
     fontWeight: "600",
@@ -4441,55 +5110,11 @@ function TasksComponent({
       spacing: 1
     }, /*#__PURE__*/React.createElement(DrawerHeading, null, "To do"), /*#__PURE__*/React.createElement(LoadingIndicator, null)))),
     additionalComponents: {
-      DrawerHeader: {
-        component: DrawerHeader,
-        properties: {
-          closeDrawer: {
-            event: false,
-            type: Function
-          }
-        }
-      },
+      DrawerHeader,
       DrawerHeading,
-      NavLinkWithBadge: {
-        component: NavLinkWithBadge,
-        properties: {
-          badge: {
-            attribute: false
-          },
-          borderBottomColor: {
-            type: String
-          },
-          borderBottomStyle: {
-            type: String
-          },
-          borderBottomWidth: {
-            type: String
-          },
-          color: {
-            type: String
-          },
-          fontSize: {
-            attribute: false
-          },
-          fontWeight: {
-            attribute: false
-          },
-          onClick: {
-            event: false,
-            type: Function
-          }
-        }
-      },
+      NavLinkWithBadge,
       ScrollContainer,
-      SwitchView: {
-        component: SwitchView,
-        properties: {
-          activeIndex: {
-            type: Number
-          }
-        }
-      }
+      SwitchView
     },
     args: {
       closeDrawer,