@wix/web5-core 1.56.0

package/dist/cjs/components/placement/buildPlacementDependencies.js

@@ -0,0 +1,214 @@
+"use strict";
+
+exports.__esModule = true;
+exports.buildPlacementDependencies = buildPlacementDependencies;
+var _react = require("react");
+var _defaultExtractor = require("../../entity/defaultExtractor");
+var _fetchEntityListData = require("../../entity/fetchEntityListData");
+var _PlacementPayloadContext = require("./PlacementPayloadContext");
+/**
+ * buildPlacementDependencies (DL #088 D3.4).
+ *
+ * Produces a `ComponentDependencies` value tailored to the placement surface.
+ * The placement-bundled section components consume the same DI hooks the full
+ * app does (`useWeb5Link`, `useConversation`, `useMarkdownUtils`, …) but
+ * placement needs **different impls** for some of them:
+ *
+ *   - `useWeb5Link` — `web5://` links always redirect to full Web5 (D12).
+ *   - `useConversation.sendMessage` — calls into the placement bundle's submit
+ *     pathway (D11/D13) via the `onSubmit` callback.
+ *   - Everything else — safe defaults (no-ops, passthroughs, or stubs that
+ *     throw with a clear message if accidentally called by a section that
+ *     isn't placement-ready).
+ *
+ * Per OQ10, the exact set of fields that need real impls vs no-ops depends on
+ * which section components the loaded client UMD actually registers in
+ * placement. v1 ships safe stubs; we tighten them per-section as integration
+ * surfaces gaps.
+ *
+ * The caller can override any field via `opts.overrides`.
+ */
+
+const FROM_PARAM = 'from';
+const WEB5_ID_PARAM = 'web5_id';
+
+/**
+ * Append `web5Id` as `?web5_id=` onto an outbound navigable URL so the
+ * destination page's placement renders warm too. Skips `web5://` / `mailto:` /
+ * hash- or query-only / cross-origin URLs, preserves the original
+ * relative/absolute shape, and is idempotent.
+ */
+function forwardWeb5Id(url, web5Id) {
+  if (typeof window === 'undefined' || !url || !web5Id) return url;
+  if (url.startsWith('web5://') || url.startsWith('mailto:') || url.startsWith('#') || url.startsWith('?')) {
+    return url;
+  }
+  let target;
+  try {
+    target = new URL(url, window.location.href);
+  } catch {
+    return url;
+  }
+  // Never leak the id cross-site — only decorate same-origin destinations.
+  if (target.origin !== window.location.origin) return url;
+  if (target.searchParams.get(WEB5_ID_PARAM) === web5Id) return url;
+  target.searchParams.set(WEB5_ID_PARAM, web5Id);
+  const isAbsolute = /^[a-zA-Z][a-zA-Z\d+\-.]*:/.test(url) || url.startsWith('//');
+  return isAbsolute ? target.toString() : target.pathname + target.search + target.hash;
+}
+function makeWeb5LinkApi(opts) {
+  const fullAppUrl = opts.fullAppUrl ?? '/web5';
+  const decorate = url => {
+    const web5Id = opts.getForwardWeb5Id == null ? void 0 : opts.getForwardWeb5Id();
+    return web5Id && url ? forwardWeb5Id(url, web5Id) : url;
+  };
+  const navigateFull = originalUrl => {
+    if (typeof window === 'undefined') return;
+    const target = `${fullAppUrl}?${FROM_PARAM}=${encodeURIComponent(originalUrl)}`;
+    window.location.assign(target);
+  };
+  return {
+    handleLinkClick: (e, url) => {
+      if (!url) return;
+      if (url.startsWith('web5://')) {
+        // D12: web5:// links from placement always redirect to full Web5.
+        e.preventDefault();
+        navigateFull(url);
+      }
+      // Other URLs use normal browser navigation (the <a href> default). The
+      // href the section already rendered came through `resolveUrl`, so it
+      // already carries `?web5_id=` when forwarding is enabled.
+    },
+    sendWeb5Message: url => navigateFull(url),
+    navigateToUrl: url => {
+      if (typeof window !== 'undefined') {
+        window.location.assign(decorate(url));
+      }
+    },
+    transformUrl: () => null,
+    resolveUrl: url => decorate(url),
+    isExternalUrl: () => false,
+    isActionRegistered: () => false,
+    executeAction: async () => undefined
+  };
+}
+function makeConversationApi(opts) {
+  return {
+    sendMessage: async (message, trackingOptions) => {
+      await (opts.onSubmit == null ? void 0 : opts.onSubmit(message, trackingOptions));
+    },
+    loadConversationByTriggerId: async () => {
+      // No-op for v1 — placement is bound to a single trigger (its own).
+      // Browsing other triggers means leaving placement; see D6 history.
+    }
+  };
+}
+const STUB_MARKDOWN_UTILS = {
+  parseMarkdownToAst: () => ({}),
+  extractLinks: () => [],
+  extractText: () => ''
+};
+
+/**
+ * Real entity transforms (DL #099 PR 4). Pure payload-row → entity-data
+ * mappers — no React, no host environment — so the placement can wire
+ * them in directly. Section components in placement-ready client UMDs
+ * pull these via `useEntityTransforms()` and pass them as the
+ * `options.transform` to `useResolveGenericEntityData`.
+ *
+ * Before DL #099 these were throwing stubs because the placement had
+ * no payload to feed them. Now the BE's `answer.payload` rides through
+ * `PlacementPayloadProvider` and the resolver actually runs.
+ */
+const REAL_ENTITY_TRANSFORMS = {
+  transformToSolutionEntityData: _defaultExtractor.transformToSolutionEntityData,
+  transformToBlogPostEntityData: _defaultExtractor.transformToBlogPostEntityData,
+  transformToGenericEntityData: _defaultExtractor.transformToGenericEntityData
+};
+function buildPlacementDependencies(opts = {}) {
+  const web5LinkApi = makeWeb5LinkApi(opts);
+  const conversationApi = makeConversationApi(opts);
+  const entityFetcher = opts.entityFetcher;
+  const built = {
+    useWeb5Link: () => web5LinkApi,
+    useConversation: () => conversationApi,
+    useDebugImageContext: () => false,
+    // Real payload-lookup resolver (DL #099 PR 4). Reads the accumulated
+    // streaming `answer.payload` and the client UMD's `entityConfig` from
+    // `PlacementPayloadProvider`; if either is missing we pass entities
+    // through unchanged. No async fallback — the placement has no
+    // entity-list API; sections render what the payload provided or nothing.
+    useResolveGenericEntityData: (entities, options) => {
+      const {
+        entityConfig
+      } = (0, _PlacementPayloadContext.usePlacementPayload)();
+
+      // The placement resolves entity data exclusively via the items API
+      // — mirroring the main app's `useEntityListData`
+      // (web50-server-ui/src/hooks/useEntityListData.ts). The streaming
+      // `answer.payload` is intentionally ignored (DL #099 PR 4 follow-up):
+      // its shape varies per query and partial coverage caused empty cards.
+      const idsToFetch = (0, _react.useMemo)(() => entities.filter(e => !e.data).map(e => e.entityId), [entities]);
+      const idsKey = idsToFetch.join(',');
+      const [apiData, setApiData] = (0, _react.useState)(() => new Map());
+      const [apiSettled, setApiSettled] = (0, _react.useState)(false);
+      (0, _react.useEffect)(() => {
+        if (!entityFetcher || idsToFetch.length === 0) {
+          setApiSettled(true);
+          return;
+        }
+        let cancelled = false;
+        setApiSettled(false);
+        (0, _fetchEntityListData.fetchEntityListData)(idsToFetch, {
+          fetchImpl: entityFetcher
+        }).then(map => {
+          if (cancelled) return;
+          setApiData(prev => {
+            if (map.size === 0) return prev;
+            const next = new Map(prev);
+            for (const [k, v] of map) next.set(k, v);
+            return next;
+          });
+          setApiSettled(true);
+        }).catch(() => {
+          if (!cancelled) setApiSettled(true);
+        });
+        return () => {
+          cancelled = true;
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+      }, [idsKey]);
+
+      // Merge API rows. Per-type config looked up via entityConfig; falls
+      // back to a synthetic config if the client UMD didn't register a row
+      // for this entityType (rare).
+      const enrichedEntities = (0, _react.useMemo)(() => {
+        if (apiData.size === 0) return entities;
+        return entities.map(entity => {
+          if (entity.data) return entity;
+          const raw = apiData.get(entity.entityId);
+          if (!raw) return entity;
+          const typeConfig = (entityConfig == null ? void 0 : entityConfig.entityTypes[entity.entityType]) ?? {
+            payloadType: entity.entityType,
+            urlMatchProperty: 'url'
+          };
+          return {
+            ...entity,
+            data: options.transform(raw, typeConfig)
+          };
+        });
+      }, [entities, apiData, entityConfig]);
+      return {
+        enrichedEntities,
+        loading: !apiSettled
+      };
+    },
+    entityTransforms: REAL_ENTITY_TRANSFORMS,
+    markdownUtils: STUB_MARKDOWN_UTILS
+  };
+  return {
+    ...built,
+    ...(opts.overrides ?? {})
+  };
+}
+//# sourceMappingURL=buildPlacementDependencies.js.map

package/dist/cjs/components/placement/buildPlacementDependencies.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_defaultExtractor","_fetchEntityListData","_PlacementPayloadContext","FROM_PARAM","WEB5_ID_PARAM","forwardWeb5Id","url","web5Id","window","startsWith","target","URL","location","href","origin","searchParams","get","set","isAbsolute","test","toString","pathname","search","hash","makeWeb5LinkApi","opts","fullAppUrl","decorate","getForwardWeb5Id","navigateFull","originalUrl","encodeURIComponent","assign","handleLinkClick","e","preventDefault","sendWeb5Message","navigateToUrl","transformUrl","resolveUrl","isExternalUrl","isActionRegistered","executeAction","undefined","makeConversationApi","sendMessage","message","trackingOptions","onSubmit","loadConversationByTriggerId","STUB_MARKDOWN_UTILS","parseMarkdownToAst","extractLinks","extractText","REAL_ENTITY_TRANSFORMS","transformToSolutionEntityData","transformToBlogPostEntityData","transformToGenericEntityData","buildPlacementDependencies","web5LinkApi","conversationApi","entityFetcher","built","useWeb5Link","useConversation","useDebugImageContext","useResolveGenericEntityData","entities","options","entityConfig","usePlacementPayload","idsToFetch","useMemo","filter","data","map","entityId","idsKey","join","apiData","setApiData","useState","Map","apiSettled","setApiSettled","useEffect","length","cancelled","fetchEntityListData","fetchImpl","then","prev","size","next","k","v","catch","enrichedEntities","entity","raw","typeConfig","entityTypes","entityType","payloadType","urlMatchProperty","transform","loading","entityTransforms","markdownUtils","overrides"],"sources":["../../../../src/components/placement/buildPlacementDependencies.ts"],"sourcesContent":["/**\n * buildPlacementDependencies (DL #088 D3.4).\n *\n * Produces a `ComponentDependencies` value tailored to the placement surface.\n * The placement-bundled section components consume the same DI hooks the full\n * app does (`useWeb5Link`, `useConversation`, `useMarkdownUtils`, …) but\n * placement needs **different impls** for some of them:\n *\n *   - `useWeb5Link` — `web5://` links always redirect to full Web5 (D12).\n *   - `useConversation.sendMessage` — calls into the placement bundle's submit\n *     pathway (D11/D13) via the `onSubmit` callback.\n *   - Everything else — safe defaults (no-ops, passthroughs, or stubs that\n *     throw with a clear message if accidentally called by a section that\n *     isn't placement-ready).\n *\n * Per OQ10, the exact set of fields that need real impls vs no-ops depends on\n * which section components the loaded client UMD actually registers in\n * placement. v1 ships safe stubs; we tighten them per-section as integration\n * surfaces gaps.\n *\n * The caller can override any field via `opts.overrides`.\n */\nimport { useEffect, useMemo, useState } from 'react';\nimport type {\n  ComponentDependencies,\n  Web5LinkApi,\n  ConversationApi,\n  MarkdownUtils,\n  EntityTransforms,\n  SendMessageOptions,\n} from '../../types/dependencies';\nimport {\n  transformToSolutionEntityData,\n  transformToBlogPostEntityData,\n  transformToGenericEntityData,\n} from '../../entity/defaultExtractor';\nimport { fetchEntityListData } from '../../entity/fetchEntityListData';\nimport { usePlacementPayload } from './PlacementPayloadContext';\nimport type { ApiPayloadItem, EntityTypeConfig } from '../../types/entity';\n\nexport interface BuildPlacementDependenciesOptions {\n  /**\n   * URL the placement navigates to when a `web5://` link is clicked or\n   * `sendWeb5Message` is called. Defaults to `/web5`. The original URL is\n   * passed as a query param so the full app can pick up where placement left off.\n   */\n  fullAppUrl?: string;\n  /**\n   * Called when a section component invokes `useConversation().sendMessage(...)`.\n   * Wired by the placement bundle to its D10 submit pathway.\n   */\n  onSubmit?: (\n    message: string,\n    options?: SendMessageOptions,\n  ) => Promise<void> | void;\n  /**\n   * Auth-aware `fetch` for the items API\n   * (`/wix-assistant-web5/v1/items?id=…`). Same Wix-OAuth strategy the\n   * placement's conversation fetcher uses — the host page can't make\n   * anonymous cross-origin calls to wixapis.com (no\n   * Access-Control-Allow-Credentials on the response), so the placement\n   * bundle creates a Wix-auth fetcher in `main.ts` and supplies it here.\n   * When omitted, the resolver skips the API step and only enriches\n   * from the streaming `answer.payload` (DL #099 PR 4).\n   */\n  entityFetcher?: typeof fetch;\n  /**\n   * Returns the `web5_id` value to forward onto same-origin navigable URLs the\n   * placement's section components resolve (entity cards, links) — the\n   * placement's own response trigger id (optionally `<triggerId>;<threadId>`,\n   * DL #110), falling back to the page's `?web5_id=`. Read at resolve/navigate\n   * time so a value captured mid-stream is used. Mirrors the main app, which\n   * forwards its current conversation's trigger id (see web50-server-ui\n   * `useWeb5Link.appendWeb5Id`). Carrying it forward keeps the destination\n   * page's placement (e.g. `pdpFraming`) warm so it renders. Omit to forward\n   * nothing.\n   */\n  getForwardWeb5Id?: () => string | undefined;\n  /**\n   * Optional overrides for any of the auto-built deps. Merged shallowly on top\n   * of the defaults — pass `useWeb5Link: customHook` to take full control.\n   */\n  overrides?: Partial<ComponentDependencies>;\n}\n\nconst FROM_PARAM = 'from';\nconst WEB5_ID_PARAM = 'web5_id';\n\n/**\n * Append `web5Id` as `?web5_id=` onto an outbound navigable URL so the\n * destination page's placement renders warm too. Skips `web5://` / `mailto:` /\n * hash- or query-only / cross-origin URLs, preserves the original\n * relative/absolute shape, and is idempotent.\n */\nfunction forwardWeb5Id(url: string, web5Id: string): string {\n  if (typeof window === 'undefined' || !url || !web5Id) return url;\n  if (\n    url.startsWith('web5://') ||\n    url.startsWith('mailto:') ||\n    url.startsWith('#') ||\n    url.startsWith('?')\n  ) {\n    return url;\n  }\n  let target: URL;\n  try {\n    target = new URL(url, window.location.href);\n  } catch {\n    return url;\n  }\n  // Never leak the id cross-site — only decorate same-origin destinations.\n  if (target.origin !== window.location.origin) return url;\n  if (target.searchParams.get(WEB5_ID_PARAM) === web5Id) return url;\n  target.searchParams.set(WEB5_ID_PARAM, web5Id);\n  const isAbsolute =\n    /^[a-zA-Z][a-zA-Z\\d+\\-.]*:/.test(url) || url.startsWith('//');\n  return isAbsolute\n    ? target.toString()\n    : target.pathname + target.search + target.hash;\n}\n\nfunction makeWeb5LinkApi(opts: BuildPlacementDependenciesOptions): Web5LinkApi {\n  const fullAppUrl = opts.fullAppUrl ?? '/web5';\n  const decorate = <T extends string | undefined>(url: T): T => {\n    const web5Id = opts.getForwardWeb5Id?.();\n    return web5Id && url ? (forwardWeb5Id(url, web5Id) as T) : url;\n  };\n\n  const navigateFull = (originalUrl: string): void => {\n    if (typeof window === 'undefined') return;\n    const target = `${fullAppUrl}?${FROM_PARAM}=${encodeURIComponent(originalUrl)}`;\n    window.location.assign(target);\n  };\n\n  return {\n    handleLinkClick: (e, url) => {\n      if (!url) return;\n      if (url.startsWith('web5://')) {\n        // D12: web5:// links from placement always redirect to full Web5.\n        e.preventDefault();\n        navigateFull(url);\n      }\n      // Other URLs use normal browser navigation (the <a href> default). The\n      // href the section already rendered came through `resolveUrl`, so it\n      // already carries `?web5_id=` when forwarding is enabled.\n    },\n    sendWeb5Message: (url) => navigateFull(url),\n    navigateToUrl: (url) => {\n      if (typeof window !== 'undefined') {\n        window.location.assign(decorate(url));\n      }\n    },\n    transformUrl: () => null,\n    resolveUrl: (url) => decorate(url),\n    isExternalUrl: () => false,\n    isActionRegistered: () => false,\n    executeAction: async () => undefined,\n  };\n}\n\nfunction makeConversationApi(\n  opts: BuildPlacementDependenciesOptions,\n): ConversationApi {\n  return {\n    sendMessage: async (message, trackingOptions) => {\n      await opts.onSubmit?.(message, trackingOptions);\n    },\n    loadConversationByTriggerId: async () => {\n      // No-op for v1 — placement is bound to a single trigger (its own).\n      // Browsing other triggers means leaving placement; see D6 history.\n    },\n  };\n}\n\nconst STUB_MARKDOWN_UTILS: MarkdownUtils = {\n  parseMarkdownToAst: () => ({}),\n  extractLinks: () => [],\n  extractText: () => '',\n};\n\n/**\n * Real entity transforms (DL #099 PR 4). Pure payload-row → entity-data\n * mappers — no React, no host environment — so the placement can wire\n * them in directly. Section components in placement-ready client UMDs\n * pull these via `useEntityTransforms()` and pass them as the\n * `options.transform` to `useResolveGenericEntityData`.\n *\n * Before DL #099 these were throwing stubs because the placement had\n * no payload to feed them. Now the BE's `answer.payload` rides through\n * `PlacementPayloadProvider` and the resolver actually runs.\n */\nconst REAL_ENTITY_TRANSFORMS: EntityTransforms = {\n  transformToSolutionEntityData,\n  transformToBlogPostEntityData,\n  transformToGenericEntityData,\n};\n\nexport function buildPlacementDependencies(\n  opts: BuildPlacementDependenciesOptions = {},\n): ComponentDependencies {\n  const web5LinkApi = makeWeb5LinkApi(opts);\n  const conversationApi = makeConversationApi(opts);\n  const entityFetcher = opts.entityFetcher;\n\n  const built: ComponentDependencies = {\n    useWeb5Link: () => web5LinkApi,\n    useConversation: () => conversationApi,\n    useDebugImageContext: () => false,\n    // Real payload-lookup resolver (DL #099 PR 4). Reads the accumulated\n    // streaming `answer.payload` and the client UMD's `entityConfig` from\n    // `PlacementPayloadProvider`; if either is missing we pass entities\n    // through unchanged. No async fallback — the placement has no\n    // entity-list API; sections render what the payload provided or nothing.\n    useResolveGenericEntityData: (entities, options) => {\n      const { entityConfig } = usePlacementPayload();\n\n      // The placement resolves entity data exclusively via the items API\n      // — mirroring the main app's `useEntityListData`\n      // (web50-server-ui/src/hooks/useEntityListData.ts). The streaming\n      // `answer.payload` is intentionally ignored (DL #099 PR 4 follow-up):\n      // its shape varies per query and partial coverage caused empty cards.\n      const idsToFetch = useMemo(\n        () => entities.filter((e) => !e.data).map((e) => e.entityId),\n        [entities],\n      );\n      const idsKey = idsToFetch.join(',');\n\n      const [apiData, setApiData] = useState<\n        Map<string, ApiPayloadItem>\n      >(() => new Map());\n      const [apiSettled, setApiSettled] = useState(false);\n\n      useEffect(() => {\n        if (!entityFetcher || idsToFetch.length === 0) {\n          setApiSettled(true);\n          return;\n        }\n        let cancelled = false;\n        setApiSettled(false);\n        fetchEntityListData(idsToFetch, { fetchImpl: entityFetcher })\n          .then((map) => {\n            if (cancelled) return;\n            setApiData((prev) => {\n              if (map.size === 0) return prev;\n              const next = new Map(prev);\n              for (const [k, v] of map) next.set(k, v);\n              return next;\n            });\n            setApiSettled(true);\n          })\n          .catch(() => {\n            if (!cancelled) setApiSettled(true);\n          });\n        return () => {\n          cancelled = true;\n        };\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n      }, [idsKey]);\n\n      // Merge API rows. Per-type config looked up via entityConfig; falls\n      // back to a synthetic config if the client UMD didn't register a row\n      // for this entityType (rare).\n      const enrichedEntities = useMemo(() => {\n        if (apiData.size === 0) return entities;\n        return entities.map((entity) => {\n          if (entity.data) return entity;\n          const raw = apiData.get(entity.entityId);\n          if (!raw) return entity;\n          const typeConfig: EntityTypeConfig =\n            entityConfig?.entityTypes[entity.entityType] ?? {\n              payloadType: entity.entityType,\n              urlMatchProperty: 'url',\n            };\n          return { ...entity, data: options.transform(raw, typeConfig) };\n        });\n      }, [entities, apiData, entityConfig]);\n\n      return { enrichedEntities, loading: !apiSettled };\n    },\n    entityTransforms: REAL_ENTITY_TRANSFORMS,\n    markdownUtils: STUB_MARKDOWN_UTILS,\n  };\n\n  return { ...built, ...(opts.overrides ?? {}) };\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/ui/BottomContainer.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.BottomContainer = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _utils = require("../../lib/utils");
+var _jsxFileName = "/home/builduser/work/c2b6ca0b3fa984ee/packages/web5-core/dist/cjs/components/ui/BottomContainer.tsx";
+const BottomContainer = ({
+  children,
+  className = '',
+  isCollapsed = false,
+  isInline = false
+}) => {
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _utils.cn)('z-10', isInline ? isCollapsed ? 'absolute bottom-0 right-0 w-auto pointer-events-none' : 'w-full' : isCollapsed ? 'fixed bottom-0 right-0 w-auto pointer-events-none' : 'fixed bottom-0 left-0 right-0', className),
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 18,
+      columnNumber: 5
+    }
+  }, children);
+};
+exports.BottomContainer = BottomContainer;
+//# sourceMappingURL=BottomContainer.js.map

package/dist/cjs/components/ui/BottomContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_utils","_jsxFileName","BottomContainer","children","className","isCollapsed","isInline","default","createElement","cn","__self","__source","fileName","lineNumber","columnNumber","exports"],"sources":["../../../../src/components/ui/BottomContainer.tsx"],"sourcesContent":["import React, { FC, ReactNode } from 'react';\nimport { cn } from '../../lib/utils';\n\nexport interface BottomContainerProps {\n  children: ReactNode;\n  className?: string;\n  isCollapsed?: boolean;\n  isInline?: boolean;\n}\n\nexport const BottomContainer: FC<BottomContainerProps> = ({\n  children,\n  className = '',\n  isCollapsed = false,\n  isInline = false,\n}) => {\n  return (\n    <div\n      className={cn(\n        'z-10',\n        isInline\n          ? isCollapsed\n            ? 'absolute bottom-0 right-0 w-auto pointer-events-none'\n            : 'w-full'\n          : isCollapsed\n          ? 'fixed bottom-0 right-0 w-auto pointer-events-none'\n          : 'fixed bottom-0 left-0 right-0',\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAAqC,IAAAE,YAAA;AAS9B,MAAMC,eAAyC,GAAGA,CAAC;EACxDC,QAAQ;EACRC,SAAS,GAAG,EAAE;EACdC,WAAW,GAAG,KAAK;EACnBC,QAAQ,GAAG;AACb,CAAC,KAAK;EACJ,oBACET,MAAA,CAAAU,OAAA,CAAAC,aAAA;IACEJ,SAAS,EAAE,IAAAK,SAAE,EACX,MAAM,EACNH,QAAQ,GACJD,WAAW,GACT,sDAAsD,GACtD,QAAQ,GACVA,WAAW,GACX,mDAAmD,GACnD,+BAA+B,EACnCD,SACF,CAAE;IAAAM,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAX,YAAA;MAAAY,UAAA;MAAAC,YAAA;IAAA;EAAA,GAEDX,QACE,CAAC;AAEV,CAAC;AAACY,OAAA,CAAAb,eAAA,GAAAA,eAAA","ignoreList":[]}

package/dist/cjs/components/ui/CalloutBlock.js

@@ -0,0 +1,156 @@
+"use strict";
+
+exports.__esModule = true;
+exports.CalloutBlock = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _MarkdownText = require("./MarkdownText");
+var _utils = require("../../lib/utils");
+var _jsxFileName = "/home/builduser/work/c2b6ca0b3fa984ee/packages/web5-core/dist/cjs/components/ui/CalloutBlock.tsx";
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const SparkleIcon = /*#__PURE__*/_react.default.forwardRef(({
+  className,
+  style
+}, ref) => /*#__PURE__*/_react.default.createElement("svg", {
+  ref: ref,
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "var(--callout-icon-size, 0.55em)",
+  height: "var(--callout-icon-size, 0.55em)",
+  viewBox: "0 0 13 13",
+  fill: "none",
+  className: className,
+  style: style,
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 11,
+    columnNumber: 3
+  }
+}, /*#__PURE__*/_react.default.createElement("path", {
+  d: "M6.5 0C6.94256 0 7.32364 0.312427 7.41056 0.74646L7.61076 1.74716C7.97829 3.58508 9.41497 5.02173 11.2528 5.38932L12.2536 5.58946C12.6876 5.67626 13 6.05737 13 6.5C13 6.94263 12.6876 7.32374 12.2536 7.41054L11.2528 7.61068C9.41497 7.97827 7.97829 9.41492 7.61076 11.2528L7.41056 12.2535C7.32364 12.6876 6.94256 13 6.5 13C6.05744 13 5.67636 12.6876 5.58945 12.2535L5.38924 11.2528C5.02171 9.41492 3.58503 7.97827 1.7472 7.61068L0.746386 7.41054C0.312372 7.32374 0 6.94263 0 6.5C0 6.05737 0.312372 5.67626 0.746386 5.58946L1.7472 5.38932C3.58503 5.02173 5.02171 3.58508 5.38924 1.74716L5.58945 0.74646C5.67636 0.312427 6.05744 0 6.5 0Z",
+  fill: "var(--callout-icon-color, var(--body-text-color))",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 21,
+    columnNumber: 5
+  }
+})));
+const CalloutBlock = ({
+  callout,
+  className,
+  showIcon = true
+}) => {
+  const containerRef = (0, _react.useRef)(null);
+  const iconRef = (0, _react.useRef)(null);
+  const [isVisible, setIsVisible] = (0, _react.useState)(false);
+  (0, _react.useEffect)(() => {
+    const el = containerRef.current;
+    if (!el) {
+      return;
+    }
+    const observer = new IntersectionObserver(([entry]) => {
+      if (entry.isIntersecting) {
+        setIsVisible(true);
+        observer.disconnect();
+      }
+    }, {
+      threshold: 0.1
+    });
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, []);
+  (0, _react.useEffect)(() => {
+    const icon = iconRef.current;
+    const container = containerRef.current;
+    if (!isVisible || !icon || !container) {
+      return;
+    }
+    const styles = getComputedStyle(container);
+    const duration = parseFloat(styles.getPropertyValue('--callout-star-duration') || '1050');
+    const delay = parseFloat(styles.getPropertyValue('--callout-star-delay') || '600');
+    icon.animate([{
+      transform: 'scale(0.5) rotate(-30deg)',
+      opacity: 0
+    }, {
+      transform: 'scale(1.2) rotate(5deg)',
+      opacity: 1,
+      offset: 0.35
+    }, {
+      transform: 'scale(0.9) rotate(-2deg)',
+      opacity: 1,
+      offset: 0.55
+    }, {
+      transform: 'scale(1.05) rotate(1deg)',
+      opacity: 1,
+      offset: 0.75
+    }, {
+      transform: 'scale(0.98) rotate(0deg)',
+      opacity: 1,
+      offset: 0.9
+    }, {
+      transform: 'scale(1) rotate(0deg)',
+      opacity: 1
+    }], {
+      duration,
+      delay,
+      easing: 'ease-out',
+      fill: 'forwards'
+    });
+  }, [isVisible]);
+  const maskGradient = 'linear-gradient(176deg, black 0%, black 40%, transparent 55%, transparent 100%)';
+  const maskPosition = isVisible ? '0% 0%' : '0% 100%';
+  const streamStyle = {
+    WebkitMaskImage: maskGradient,
+    maskImage: maskGradient,
+    WebkitMaskSize: '100% 500%',
+    maskSize: '100% 500%',
+    WebkitMaskRepeat: 'no-repeat',
+    maskRepeat: 'no-repeat',
+    WebkitMaskPosition: maskPosition,
+    maskPosition,
+    transition: isVisible ? '-webkit-mask-position 3s linear var(--callout-stream-delay, 1.5s), mask-position 3s linear var(--callout-stream-delay, 1.5s)' : 'none'
+  };
+  return /*#__PURE__*/_react.default.createElement("div", {
+    ref: containerRef,
+    className: (0, _utils.cn)('flex items-start font-display font-medium text-callout-block gap-[0.625em]', className),
+    style: {
+      color: 'var(--callout-text-color, var(--body-text-color))'
+    },
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 106,
+      columnNumber: 5
+    }
+  }, showIcon ? /*#__PURE__*/_react.default.createElement(SparkleIcon, {
+    ref: iconRef,
+    className: "mt-[0.45em] shrink-0",
+    style: {
+      opacity: 0
+    },
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 115,
+      columnNumber: 9
+    }
+  }) : null, /*#__PURE__*/_react.default.createElement("div", {
+    style: streamStyle,
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 121,
+      columnNumber: 7
+    }
+  }, /*#__PURE__*/_react.default.createElement(_MarkdownText.MarkdownText, {
+    className: "[&]:text-[length:inherit] [&]:text-inherit [&]:leading-[inherit] [&_p]:mb-0 [&_p]:mt-0 [&_p]:text-[length:inherit] [&_p]:text-inherit [&_p]:leading-[inherit]",
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 122,
+      columnNumber: 9
+    }
+  }, callout.text)));
+};
+exports.CalloutBlock = CalloutBlock;
+//# sourceMappingURL=CalloutBlock.js.map

package/dist/cjs/components/ui/CalloutBlock.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_MarkdownText","_utils","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","SparkleIcon","React","forwardRef","className","style","ref","createElement","xmlns","width","height","viewBox","fill","__self","__source","fileName","lineNumber","columnNumber","d","CalloutBlock","callout","showIcon","containerRef","useRef","iconRef","isVisible","setIsVisible","useState","useEffect","el","current","observer","IntersectionObserver","entry","isIntersecting","disconnect","threshold","observe","icon","container","styles","getComputedStyle","duration","parseFloat","getPropertyValue","delay","animate","transform","opacity","offset","easing","maskGradient","maskPosition","streamStyle","WebkitMaskImage","maskImage","WebkitMaskSize","maskSize","WebkitMaskRepeat","maskRepeat","WebkitMaskPosition","transition","cn","color","MarkdownText","text","exports"],"sources":["../../../../src/components/ui/CalloutBlock.tsx"],"sourcesContent":["import React, { useRef, useState, useEffect } from 'react';\nimport type { FC } from 'react';\nimport type { Callout } from '../../types/callout';\nimport { MarkdownText } from './MarkdownText';\nimport { cn } from '../../lib/utils';\n\nconst SparkleIcon = React.forwardRef<\n  SVGSVGElement,\n  { className?: string; style?: React.CSSProperties }\n>(({ className, style }, ref) => (\n  <svg\n    ref={ref}\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"var(--callout-icon-size, 0.55em)\"\n    height=\"var(--callout-icon-size, 0.55em)\"\n    viewBox=\"0 0 13 13\"\n    fill=\"none\"\n    className={className}\n    style={style}\n  >\n    <path\n      d=\"M6.5 0C6.94256 0 7.32364 0.312427 7.41056 0.74646L7.61076 1.74716C7.97829 3.58508 9.41497 5.02173 11.2528 5.38932L12.2536 5.58946C12.6876 5.67626 13 6.05737 13 6.5C13 6.94263 12.6876 7.32374 12.2536 7.41054L11.2528 7.61068C9.41497 7.97827 7.97829 9.41492 7.61076 11.2528L7.41056 12.2535C7.32364 12.6876 6.94256 13 6.5 13C6.05744 13 5.67636 12.6876 5.58945 12.2535L5.38924 11.2528C5.02171 9.41492 3.58503 7.97827 1.7472 7.61068L0.746386 7.41054C0.312372 7.32374 0 6.94263 0 6.5C0 6.05737 0.312372 5.67626 0.746386 5.58946L1.7472 5.38932C3.58503 5.02173 5.02171 3.58508 5.38924 1.74716L5.58945 0.74646C5.67636 0.312427 6.05744 0 6.5 0Z\"\n      fill=\"var(--callout-icon-color, var(--body-text-color))\"\n    />\n  </svg>\n));\n\nexport interface CalloutBlockProps {\n  callout: Callout;\n  className?: string;\n  showIcon?: boolean;\n}\n\nexport const CalloutBlock: FC<CalloutBlockProps> = ({\n  callout,\n  className,\n  showIcon = true,\n}) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const iconRef = useRef<SVGSVGElement>(null);\n  const [isVisible, setIsVisible] = useState(false);\n\n  useEffect(() => {\n    const el = containerRef.current;\n    if (!el) {\n      return;\n    }\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        if (entry.isIntersecting) {\n          setIsVisible(true);\n          observer.disconnect();\n        }\n      },\n      { threshold: 0.1 },\n    );\n    observer.observe(el);\n    return () => observer.disconnect();\n  }, []);\n\n  useEffect(() => {\n    const icon = iconRef.current;\n    const container = containerRef.current;\n    if (!isVisible || !icon || !container) {\n      return;\n    }\n    const styles = getComputedStyle(container);\n    const duration = parseFloat(\n      styles.getPropertyValue('--callout-star-duration') || '1050',\n    );\n    const delay = parseFloat(\n      styles.getPropertyValue('--callout-star-delay') || '600',\n    );\n    icon.animate(\n      [\n        { transform: 'scale(0.5) rotate(-30deg)', opacity: 0 },\n        { transform: 'scale(1.2) rotate(5deg)', opacity: 1, offset: 0.35 },\n        { transform: 'scale(0.9) rotate(-2deg)', opacity: 1, offset: 0.55 },\n        { transform: 'scale(1.05) rotate(1deg)', opacity: 1, offset: 0.75 },\n        { transform: 'scale(0.98) rotate(0deg)', opacity: 1, offset: 0.9 },\n        { transform: 'scale(1) rotate(0deg)', opacity: 1 },\n      ],\n      { duration, delay, easing: 'ease-out', fill: 'forwards' },\n    );\n  }, [isVisible]);\n\n  const maskGradient =\n    'linear-gradient(176deg, black 0%, black 40%, transparent 55%, transparent 100%)';\n  const maskPosition = isVisible ? '0% 0%' : '0% 100%';\n\n  const streamStyle: React.CSSProperties = {\n    WebkitMaskImage: maskGradient,\n    maskImage: maskGradient,\n    WebkitMaskSize: '100% 500%',\n    maskSize: '100% 500%',\n    WebkitMaskRepeat: 'no-repeat',\n    maskRepeat: 'no-repeat',\n    WebkitMaskPosition: maskPosition,\n    maskPosition,\n    transition: isVisible\n      ? '-webkit-mask-position 3s linear var(--callout-stream-delay, 1.5s), mask-position 3s linear var(--callout-stream-delay, 1.5s)'\n      : 'none',\n  };\n\n  return (\n    <div\n      ref={containerRef}\n      className={cn(\n        'flex items-start font-display font-medium text-callout-block gap-[0.625em]',\n        className,\n      )}\n      style={{ color: 'var(--callout-text-color, var(--body-text-color))' }}\n    >\n      {showIcon ? (\n        <SparkleIcon\n          ref={iconRef}\n          className=\"mt-[0.45em] shrink-0\"\n          style={{ opacity: 0 }}\n        />\n      ) : null}\n      <div style={streamStyle}>\n        <MarkdownText className=\"[&]:text-[length:inherit] [&]:text-inherit [&]:leading-[inherit] [&_p]:mb-0 [&_p]:mt-0 [&_p]:text-[length:inherit] [&_p]:text-inherit [&_p]:leading-[inherit]\">\n          {callout.text}\n        </MarkdownText>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/ui/Disclaimer.css

@@ -0,0 +1,35 @@
+/* "AI can make mistakes. Learn more" footer. Mounted by the host app
+   alongside the FeedbackBar; clients can override the whole component via
+   the DisclaimerComponent UI slot.
+
+   Typography defaults mirror `.web5-feedback-bar` so a single client-side
+   override (`--web5-feedback-bar-color`) re-skins both together. The
+   disclaimer-specific vars stay as escape hatches when divergence is
+   needed. */
+
+.web5-disclaimer {
+  margin: 0;
+  font-size: var(
+    --web5-disclaimer-font-size,
+    var(--web5-feedback-bar-font-size, 13px)
+  );
+  font-weight: 400;
+  line-height: normal;
+  color: var(
+    --web5-disclaimer-color,
+    var(--web5-feedback-bar-color, var(--web5-feedback-label-color, #6b7280))
+  );
+  text-align: var(--web5-disclaimer-text-align, left);
+}
+
+.web5-disclaimer__link {
+  color: inherit;
+  text-decoration: underline;
+  text-decoration-skip-ink: none;
+  cursor: pointer;
+}
+
+.web5-disclaimer__link:hover,
+.web5-disclaimer__link:focus-visible {
+  color: var(--web5-disclaimer-link-hover-color, inherit);
+}

package/dist/cjs/components/ui/Disclaimer.js

@@ -0,0 +1,56 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.Disclaimer = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _utils = require("../../lib/utils");
+var _jsxFileName = "/home/builduser/work/c2b6ca0b3fa984ee/packages/web5-core/dist/cjs/components/ui/Disclaimer.tsx";
+/**
+ * "AI can make mistakes. Learn more" footer. Renders as plain text + an
+ * optional link; clients can override the whole component via the
+ * `DisclaimerComponent` UI slot.
+ */
+const Disclaimer = ({
+  text = 'AI can make mistakes.',
+  learnMoreText = 'Learn more',
+  learnMoreHref,
+  learnMoreTarget = '_blank',
+  onLearnMoreClick,
+  className
+}) => {
+  const showLink = Boolean(learnMoreHref);
+  const rel = learnMoreTarget === '_blank' ? 'noopener noreferrer' : undefined;
+  return /*#__PURE__*/_react.default.createElement("p", {
+    className: (0, _utils.cn)('web5-disclaimer', className),
+    role: "note",
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 35,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: "web5-disclaimer__text",
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 36,
+      columnNumber: 7
+    }
+  }, text), showLink && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, ' ', /*#__PURE__*/_react.default.createElement("a", {
+    className: "web5-disclaimer__link",
+    href: learnMoreHref,
+    target: learnMoreTarget,
+    rel: rel,
+    onClick: onLearnMoreClick,
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 40,
+      columnNumber: 11
+    }
+  }, learnMoreText)));
+};
+exports.Disclaimer = Disclaimer;
+//# sourceMappingURL=Disclaimer.js.map

package/dist/cjs/components/ui/Disclaimer.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_utils","_jsxFileName","Disclaimer","text","learnMoreText","learnMoreHref","learnMoreTarget","onLearnMoreClick","className","showLink","Boolean","rel","undefined","default","createElement","cn","role","__self","__source","fileName","lineNumber","columnNumber","Fragment","href","target","onClick","exports"],"sources":["../../../../src/components/ui/Disclaimer.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { cn } from '../../lib/utils';\n\nexport interface DisclaimerProps {\n  /** Disclaimer body text. Default: \"AI can make mistakes.\" */\n  text?: string;\n  /** Label for the trailing link. Default: \"Learn more\". */\n  learnMoreText?: string;\n  /** URL the \"Learn more\" link opens. When omitted, the link is not rendered. */\n  learnMoreHref?: string;\n  /** Override the link target. Default: `_blank` (opens in a new tab). */\n  learnMoreTarget?: '_blank' | '_self' | '_parent' | '_top';\n  /** Click handler invoked before navigation. Use to fire analytics. */\n  onLearnMoreClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;\n  className?: string;\n}\n\n/**\n * \"AI can make mistakes. Learn more\" footer. Renders as plain text + an\n * optional link; clients can override the whole component via the\n * `DisclaimerComponent` UI slot.\n */\nexport const Disclaimer: FC<DisclaimerProps> = ({\n  text = 'AI can make mistakes.',\n  learnMoreText = 'Learn more',\n  learnMoreHref,\n  learnMoreTarget = '_blank',\n  onLearnMoreClick,\n  className,\n}) => {\n  const showLink = Boolean(learnMoreHref);\n  const rel = learnMoreTarget === '_blank' ? 'noopener noreferrer' : undefined;\n\n  return (\n    <p className={cn('web5-disclaimer', className)} role=\"note\">\n      <span className=\"web5-disclaimer__text\">{text}</span>\n      {showLink && (\n        <>\n          {' '}\n          <a\n            className=\"web5-disclaimer__link\"\n            href={learnMoreHref}\n            target={learnMoreTarget}\n            rel={rel}\n            onClick={onLearnMoreClick}\n          >\n            {learnMoreText}\n          </a>\n        </>\n      )}\n    </p>\n  );\n};\n"],"mappings":";;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAAqC,IAAAE,YAAA;AAgBrC;AACA;AACA;AACA;AACA;AACO,MAAMC,UAA+B,GAAGA,CAAC;EAC9CC,IAAI,GAAG,uBAAuB;EAC9BC,aAAa,GAAG,YAAY;EAC5BC,aAAa;EACbC,eAAe,GAAG,QAAQ;EAC1BC,gBAAgB;EAChBC;AACF,CAAC,KAAK;EACJ,MAAMC,QAAQ,GAAGC,OAAO,CAACL,aAAa,CAAC;EACvC,MAAMM,GAAG,GAAGL,eAAe,KAAK,QAAQ,GAAG,qBAAqB,GAAGM,SAAS;EAE5E,oBACEf,MAAA,CAAAgB,OAAA,CAAAC,aAAA;IAAGN,SAAS,EAAE,IAAAO,SAAE,EAAC,iBAAiB,EAAEP,SAAS,CAAE;IAACQ,IAAI,EAAC,MAAM;IAAAC,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAlB,YAAA;MAAAmB,UAAA;MAAAC,YAAA;IAAA;EAAA,gBACzDxB,MAAA,CAAAgB,OAAA,CAAAC,aAAA;IAAMN,SAAS,EAAC,uBAAuB;IAAAS,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAlB,YAAA;MAAAmB,UAAA;MAAAC,YAAA;IAAA;EAAA,GAAElB,IAAW,CAAC,EACpDM,QAAQ,iBACPZ,MAAA,CAAAgB,OAAA,CAAAC,aAAA,CAAAjB,MAAA,CAAAgB,OAAA,CAAAS,QAAA,QACG,GAAG,eACJzB,MAAA,CAAAgB,OAAA,CAAAC,aAAA;IACEN,SAAS,EAAC,uBAAuB;IACjCe,IAAI,EAAElB,aAAc;IACpBmB,MAAM,EAAElB,eAAgB;IACxBK,GAAG,EAAEA,GAAI;IACTc,OAAO,EAAElB,gBAAiB;IAAAU,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAlB,YAAA;MAAAmB,UAAA;MAAAC,YAAA;IAAA;EAAA,GAEzBjB,aACA,CACH,CAEH,CAAC;AAER,CAAC;AAACsB,OAAA,CAAAxB,UAAA,GAAAA,UAAA","ignoreList":[]}