@wix/web5-core 1.56.0

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

@@ -0,0 +1,109 @@
+/* SectionSkeleton — status-driven placeholder for a not-yet-streamed V3
+   section (DL #106). Self-contained: structure/sizing live here (NOT Tailwind
+   utilities) so the skeleton renders correctly regardless of whether the
+   consuming app's Tailwind scans this core package. Colors are tokenized; the
+   `shimmer` keyframe is defined globally in base-utilities.css. */
+
+.w5-skeleton {
+  /* Decorative; never intercept clicks or text selection. */
+  pointer-events: none;
+  user-select: none;
+  padding-block: 4rem;
+}
+
+@media (min-width: 64rem) {
+  .w5-skeleton {
+    padding-block: 6rem;
+  }
+}
+
+.w5-skeleton__inner {
+  width: 100%;
+  max-width: var(--container-section, 1080px);
+  margin-inline: auto;
+  padding-inline: 1.5rem;
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+}
+
+.w5-skeleton__grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 1.5rem;
+}
+
+@media (min-width: 48rem) {
+  .w5-skeleton__grid {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+}
+
+.w5-skeleton__card {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+}
+
+.w5-skeleton__lines {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+}
+
+/* --- bar sizes --------------------------------------------------------------- */
+.w5-skeleton__title {
+  height: 1.75rem;
+  width: 33%;
+  border-radius: 6px;
+}
+.w5-skeleton__media {
+  width: 100%;
+  aspect-ratio: 1 / 1;
+  border-radius: 12px;
+}
+.w5-skeleton__tile {
+  width: 100%;
+  height: 6rem;
+  border-radius: 12px;
+}
+.w5-skeleton__row {
+  width: 100%;
+  height: 2.5rem;
+  border-radius: 6px;
+}
+.w5-skeleton__line {
+  height: 1rem;
+  border-radius: 4px;
+}
+.w5-skeleton__line--lg {
+  width: 100%;
+}
+.w5-skeleton__line--md {
+  width: 80%;
+}
+.w5-skeleton__line--sm {
+  width: 60%;
+}
+
+/* --- shimmer treatment ------------------------------------------------------- */
+.w5-skeleton__bar {
+  display: block;
+  /* Grey base with a lighter sheen swept across by the global `shimmer`
+     keyframe (pans background-position -200% → 200%). Both tones are tokens. */
+  background-color: var(--color-border);
+  background-image: linear-gradient(
+    90deg,
+    var(--color-border) 25%,
+    var(--color-muted) 37%,
+    var(--color-border) 63%
+  );
+  background-size: 200% 100%;
+  animation: shimmer 1.4s ease-in-out infinite;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .w5-skeleton__bar {
+    animation: none;
+  }
+}

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

@@ -0,0 +1,190 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.SectionSkeleton = void 0;
+var _react = _interopRequireDefault(require("react"));
+require("./SectionSkeleton.css");
+var _jsxFileName = "/home/builduser/work/c2b6ca0b3fa984ee/packages/web5-core/dist/cjs/components/ui/SectionSkeleton.tsx";
+/**
+ * Default status-driven placeholder for a V3 section that's been declared (its
+ * `<!-- section ... -->` remark arrived in the layout pass) but whose body
+ * hasn't finished streaming yet (DL #106). Lives in core so every surface has a
+ * sensible default; client packages can override via
+ * `uiSlots.SectionSkeletonComponent` and the app resolves the override at
+ * render time (see web50-server-ui `SectionSkeletonSlot`).
+ *
+ * Unlike real sections it does NOT go through the ComponentRegistry — the
+ * registry maps parsed content nodes to components, and a skeleton has no
+ * content node. The consumption layer hand-builds a `PageSection` whose
+ * `component` is this element.
+ *
+ * Shape is chosen from the section's `semantic`/`sectionType` so the placeholder
+ * roughly matches what will replace it (cards for item grids, tiles for KPIs,
+ * rows for tables, lines for prose) — minimizing reflow on the skeleton→content
+ * swap.
+ */
+
+const shapeFor = (sectionType = '', semantic = '') => {
+  const key = `${semantic} ${sectionType}`.toLowerCase();
+  if (/\bkpi\b|metric/.test(key)) {
+    return 'tiles';
+  }
+  if (/comparison|table/.test(key)) {
+    return 'rows';
+  }
+  if (/item|feature_list|gallery|card/.test(key)) {
+    return 'cards';
+  }
+  return 'lines';
+};
+const Cards = () => /*#__PURE__*/_react.default.createElement("div", {
+  className: "w5-skeleton__grid",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 45,
+    columnNumber: 3
+  }
+}, [0, 1, 2, 3].map(i => /*#__PURE__*/_react.default.createElement("div", {
+  key: i,
+  className: "w5-skeleton__card",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 47,
+    columnNumber: 7
+  }
+}, /*#__PURE__*/_react.default.createElement("span", {
+  className: "w5-skeleton__bar w5-skeleton__media",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 48,
+    columnNumber: 9
+  }
+}), /*#__PURE__*/_react.default.createElement("span", {
+  className: "w5-skeleton__bar w5-skeleton__line w5-skeleton__line--md",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 49,
+    columnNumber: 9
+  }
+}), /*#__PURE__*/_react.default.createElement("span", {
+  className: "w5-skeleton__bar w5-skeleton__line w5-skeleton__line--sm",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 50,
+    columnNumber: 9
+  }
+}))));
+const Tiles = () => /*#__PURE__*/_react.default.createElement("div", {
+  className: "w5-skeleton__grid",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 57,
+    columnNumber: 3
+  }
+}, [0, 1, 2, 3].map(i => /*#__PURE__*/_react.default.createElement("span", {
+  key: i,
+  className: "w5-skeleton__bar w5-skeleton__tile",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 59,
+    columnNumber: 7
+  }
+})));
+const Rows = () => /*#__PURE__*/_react.default.createElement("div", {
+  className: "w5-skeleton__lines",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 65,
+    columnNumber: 3
+  }
+}, [0, 1, 2, 3, 4].map(i => /*#__PURE__*/_react.default.createElement("span", {
+  key: i,
+  className: "w5-skeleton__bar w5-skeleton__row",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 67,
+    columnNumber: 7
+  }
+})));
+const LINE_WIDTHS = ['lg', 'md', 'lg', 'md', 'sm'];
+const Lines = () => /*#__PURE__*/_react.default.createElement("div", {
+  className: "w5-skeleton__lines",
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 74,
+    columnNumber: 3
+  }
+}, LINE_WIDTHS.map((w, i) => /*#__PURE__*/_react.default.createElement("span", {
+  key: i,
+  className: `w5-skeleton__bar w5-skeleton__line w5-skeleton__line--${w}`,
+  __self: void 0,
+  __source: {
+    fileName: _jsxFileName,
+    lineNumber: 76,
+    columnNumber: 7
+  }
+})));
+const SHAPES = {
+  cards: Cards,
+  tiles: Tiles,
+  rows: Rows,
+  lines: Lines
+};
+const SectionSkeleton = ({
+  sectionType,
+  semantic,
+  className = ''
+}) => {
+  const shape = shapeFor(sectionType, semantic);
+  const Shape = SHAPES[shape];
+  const label = (semantic || sectionType || 'content').replace(/[-_]/g, ' ');
+  return /*#__PURE__*/_react.default.createElement("section", {
+    className: `w5-skeleton ${className}`.trim(),
+    role: "status",
+    "aria-busy": "true",
+    "aria-label": `Loading ${label} section`,
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 101,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "w5-skeleton__inner",
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 107,
+      columnNumber: 7
+    }
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: "w5-skeleton__bar w5-skeleton__title",
+    "aria-hidden": "true",
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 108,
+      columnNumber: 9
+    }
+  }), /*#__PURE__*/_react.default.createElement(Shape, {
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 112,
+      columnNumber: 9
+    }
+  })));
+};
+exports.SectionSkeleton = SectionSkeleton;
+//# sourceMappingURL=SectionSkeleton.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_jsxFileName","shapeFor","sectionType","semantic","key","toLowerCase","test","Cards","default","createElement","className","__self","__source","fileName","lineNumber","columnNumber","map","i","Tiles","Rows","LINE_WIDTHS","Lines","w","SHAPES","cards","tiles","rows","lines","SectionSkeleton","shape","Shape","label","replace","trim","role","exports"],"sources":["../../../../src/components/ui/SectionSkeleton.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport './SectionSkeleton.css';\n\n/**\n * Default status-driven placeholder for a V3 section that's been declared (its\n * `<!-- section ... -->` remark arrived in the layout pass) but whose body\n * hasn't finished streaming yet (DL #106). Lives in core so every surface has a\n * sensible default; client packages can override via\n * `uiSlots.SectionSkeletonComponent` and the app resolves the override at\n * render time (see web50-server-ui `SectionSkeletonSlot`).\n *\n * Unlike real sections it does NOT go through the ComponentRegistry — the\n * registry maps parsed content nodes to components, and a skeleton has no\n * content node. The consumption layer hand-builds a `PageSection` whose\n * `component` is this element.\n *\n * Shape is chosen from the section's `semantic`/`sectionType` so the placeholder\n * roughly matches what will replace it (cards for item grids, tiles for KPIs,\n * rows for tables, lines for prose) — minimizing reflow on the skeleton→content\n * swap.\n */\nexport interface SectionSkeletonProps {\n  sectionType?: string;\n  semantic?: string;\n  className?: string;\n}\n\ntype SkeletonShape = 'cards' | 'tiles' | 'rows' | 'lines';\n\nconst shapeFor = (sectionType = '', semantic = ''): SkeletonShape => {\n  const key = `${semantic} ${sectionType}`.toLowerCase();\n  if (/\\bkpi\\b|metric/.test(key)) {\n    return 'tiles';\n  }\n  if (/comparison|table/.test(key)) {\n    return 'rows';\n  }\n  if (/item|feature_list|gallery|card/.test(key)) {\n    return 'cards';\n  }\n  return 'lines';\n};\n\nconst Cards: FC = () => (\n  <div className=\"w5-skeleton__grid\">\n    {[0, 1, 2, 3].map((i) => (\n      <div key={i} className=\"w5-skeleton__card\">\n        <span className=\"w5-skeleton__bar w5-skeleton__media\" />\n        <span className=\"w5-skeleton__bar w5-skeleton__line w5-skeleton__line--md\" />\n        <span className=\"w5-skeleton__bar w5-skeleton__line w5-skeleton__line--sm\" />\n      </div>\n    ))}\n  </div>\n);\n\nconst Tiles: FC = () => (\n  <div className=\"w5-skeleton__grid\">\n    {[0, 1, 2, 3].map((i) => (\n      <span key={i} className=\"w5-skeleton__bar w5-skeleton__tile\" />\n    ))}\n  </div>\n);\n\nconst Rows: FC = () => (\n  <div className=\"w5-skeleton__lines\">\n    {[0, 1, 2, 3, 4].map((i) => (\n      <span key={i} className=\"w5-skeleton__bar w5-skeleton__row\" />\n    ))}\n  </div>\n);\n\nconst LINE_WIDTHS = ['lg', 'md', 'lg', 'md', 'sm'] as const;\nconst Lines: FC = () => (\n  <div className=\"w5-skeleton__lines\">\n    {LINE_WIDTHS.map((w, i) => (\n      <span\n        key={i}\n        className={`w5-skeleton__bar w5-skeleton__line w5-skeleton__line--${w}`}\n      />\n    ))}\n  </div>\n);\n\nconst SHAPES: Record<SkeletonShape, FC> = {\n  cards: Cards,\n  tiles: Tiles,\n  rows: Rows,\n  lines: Lines,\n};\n\nexport const SectionSkeleton: FC<SectionSkeletonProps> = ({\n  sectionType,\n  semantic,\n  className = '',\n}) => {\n  const shape = shapeFor(sectionType, semantic);\n  const Shape = SHAPES[shape];\n  const label = (semantic || sectionType || 'content').replace(/[-_]/g, ' ');\n\n  return (\n    <section\n      className={`w5-skeleton ${className}`.trim()}\n      role=\"status\"\n      aria-busy=\"true\"\n      aria-label={`Loading ${label} section`}\n    >\n      <div className=\"w5-skeleton__inner\">\n        <span\n          className=\"w5-skeleton__bar w5-skeleton__title\"\n          aria-hidden=\"true\"\n        />\n        <Shape />\n      </div>\n    </section>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,122 @@
+"use strict";
+
+exports.__esModule = true;
+exports.SmartIcon = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _ComponentDependenciesContext = require("../../context/ComponentDependenciesContext");
+var _jsxFileName = "/home/builduser/work/c2b6ca0b3fa984ee/packages/web5-core/dist/cjs/components/ui/SmartIcon.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); }
+function sanitizeAndAdoptSvg(raw, container) {
+  const parser = new DOMParser();
+  const doc = parser.parseFromString(raw, 'image/svg+xml');
+  const svg = doc.querySelector('svg');
+  if (!svg) {
+    return;
+  }
+  svg.querySelectorAll('script, foreignObject, iframe, object, embed').forEach(el => el.remove());
+  svg.querySelectorAll('*').forEach(el => {
+    for (const attr of [...el.attributes]) {
+      if (attr.name.startsWith('on')) {
+        el.removeAttribute(attr.name);
+      }
+    }
+  });
+  svg.style.width = '100%';
+  svg.style.height = 'auto';
+  container.replaceChildren(document.adoptNode(svg));
+}
+const SCOPED_CLASS = 'smart-icon-svg';
+const COLOR_STYLE = `.${SCOPED_CLASS} path:not([fill="none"]), .${SCOPED_CLASS} circle:not([fill="none"]), .${SCOPED_CLASS} rect:not([fill="none"]), .${SCOPED_CLASS} line:not([fill="none"]), .${SCOPED_CLASS} polygon:not([fill="none"]), .${SCOPED_CLASS} polyline:not([fill="none"]), .${SCOPED_CLASS} ellipse:not([fill="none"]) { fill: currentColor; }`;
+const SmartIcon = ({
+  iconHint,
+  width = 24,
+  color,
+  label,
+  fallback
+}) => {
+  const {
+    resolveIcons
+  } = (0, _ComponentDependenciesContext.useComponentDependencies)();
+  const [svgContent, setSvgContent] = (0, _react.useState)();
+  const containerRef = (0, _react.useRef)(null);
+  const hintRef = (0, _react.useRef)(iconHint);
+  hintRef.current = iconHint;
+  const resolve = (0, _react.useCallback)(async () => {
+    if (!resolveIcons || !iconHint) {
+      return;
+    }
+    try {
+      const result = await resolveIcons([iconHint]);
+      if (hintRef.current === iconHint && result[iconHint]) {
+        setSvgContent(result[iconHint]);
+      }
+    } catch {
+      // Silently ignore resolution failures
+    }
+  }, [resolveIcons, iconHint]);
+  (0, _react.useEffect)(() => {
+    resolve();
+  }, [resolve]);
+  (0, _react.useEffect)(() => {
+    if (!svgContent || !containerRef.current) {
+      return;
+    }
+    sanitizeAndAdoptSvg(svgContent, containerRef.current);
+  }, [svgContent]);
+  if (!svgContent) {
+    if (fallback !== undefined) {
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, fallback);
+    }
+    return /*#__PURE__*/_react.default.createElement("span", {
+      "aria-hidden": label ? undefined : true,
+      role: label ? 'img' : undefined,
+      "aria-label": label || undefined,
+      style: {
+        display: 'inline-block',
+        width,
+        height: width
+      },
+      __self: void 0,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 92,
+        columnNumber: 7
+      }
+    });
+  }
+  return /*#__PURE__*/_react.default.createElement("span", {
+    "aria-hidden": label ? undefined : true,
+    role: label ? 'img' : undefined,
+    "aria-label": label || undefined,
+    style: {
+      display: 'inline-block',
+      width,
+      height: 'auto',
+      color
+    },
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 102,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement("style", {
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 108,
+      columnNumber: 7
+    }
+  }, COLOR_STYLE), /*#__PURE__*/_react.default.createElement("span", {
+    ref: containerRef,
+    className: SCOPED_CLASS,
+    __self: void 0,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 109,
+      columnNumber: 7
+    }
+  }));
+};
+exports.SmartIcon = SmartIcon;
+//# sourceMappingURL=SmartIcon.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_ComponentDependenciesContext","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","sanitizeAndAdoptSvg","raw","container","parser","DOMParser","doc","parseFromString","svg","querySelector","querySelectorAll","forEach","el","remove","attr","attributes","name","startsWith","removeAttribute","style","width","height","replaceChildren","document","adoptNode","SCOPED_CLASS","COLOR_STYLE","SmartIcon","iconHint","color","label","fallback","resolveIcons","useComponentDependencies","svgContent","setSvgContent","useState","containerRef","useRef","hintRef","current","resolve","useCallback","result","useEffect","undefined","createElement","Fragment","role","display","__self","__source","fileName","lineNumber","columnNumber","ref","className","exports"],"sources":["../../../../src/components/ui/SmartIcon.tsx"],"sourcesContent":["import React, { useRef, useEffect, useState, useCallback } from 'react';\nimport { useComponentDependencies } from '../../context/ComponentDependenciesContext';\n\nexport interface SmartIconProps {\n  iconHint: string;\n  width?: number;\n  color?: string;\n  /**\n   * Accessible name for screen readers. Omit for decorative icons (the default).\n   */\n  label?: string;\n  /**\n   * Rendered in place of the icon whenever a resolved SVG is not (yet) available:\n   * no resolver in context, no `iconHint`, resolution still pending, or resolution\n   * returned nothing / errored. Lets callers guarantee a meaningful icon always\n   * shows (e.g. a bundled fallback icon) instead of a blank placeholder box.\n   */\n  fallback?: React.ReactNode;\n}\n\nfunction sanitizeAndAdoptSvg(raw: string, container: HTMLElement): void {\n  const parser = new DOMParser();\n  const doc = parser.parseFromString(raw, 'image/svg+xml');\n  const svg = doc.querySelector('svg');\n  if (!svg) {\n    return;\n  }\n\n  svg\n    .querySelectorAll('script, foreignObject, iframe, object, embed')\n    .forEach((el) => el.remove());\n  svg.querySelectorAll('*').forEach((el) => {\n    for (const attr of [...el.attributes]) {\n      if (attr.name.startsWith('on')) {\n        el.removeAttribute(attr.name);\n      }\n    }\n  });\n\n  svg.style.width = '100%';\n  svg.style.height = 'auto';\n\n  container.replaceChildren(document.adoptNode(svg));\n}\n\nconst SCOPED_CLASS = 'smart-icon-svg';\nconst COLOR_STYLE = `.${SCOPED_CLASS} path:not([fill=\"none\"]), .${SCOPED_CLASS} circle:not([fill=\"none\"]), .${SCOPED_CLASS} rect:not([fill=\"none\"]), .${SCOPED_CLASS} line:not([fill=\"none\"]), .${SCOPED_CLASS} polygon:not([fill=\"none\"]), .${SCOPED_CLASS} polyline:not([fill=\"none\"]), .${SCOPED_CLASS} ellipse:not([fill=\"none\"]) { fill: currentColor; }`;\n\nexport const SmartIcon: React.FC<SmartIconProps> = ({\n  iconHint,\n  width = 24,\n  color,\n  label,\n  fallback,\n}) => {\n  const { resolveIcons } = useComponentDependencies();\n  const [svgContent, setSvgContent] = useState<string | undefined>();\n  const containerRef = useRef<HTMLSpanElement>(null);\n  const hintRef = useRef(iconHint);\n  hintRef.current = iconHint;\n\n  const resolve = useCallback(async () => {\n    if (!resolveIcons || !iconHint) {\n      return;\n    }\n    try {\n      const result = await resolveIcons([iconHint]);\n      if (hintRef.current === iconHint && result[iconHint]) {\n        setSvgContent(result[iconHint]);\n      }\n    } catch {\n      // Silently ignore resolution failures\n    }\n  }, [resolveIcons, iconHint]);\n\n  useEffect(() => {\n    resolve();\n  }, [resolve]);\n\n  useEffect(() => {\n    if (!svgContent || !containerRef.current) {\n      return;\n    }\n    sanitizeAndAdoptSvg(svgContent, containerRef.current);\n  }, [svgContent]);\n\n  if (!svgContent) {\n    if (fallback !== undefined) {\n      return <>{fallback}</>;\n    }\n    return (\n      <span\n        aria-hidden={label ? undefined : true}\n        role={label ? 'img' : undefined}\n        aria-label={label || undefined}\n        style={{ display: 'inline-block', width, height: width }}\n      />\n    );\n  }\n\n  return (\n    <span\n      aria-hidden={label ? undefined : true}\n      role={label ? 'img' : undefined}\n      aria-label={label || undefined}\n      style={{ display: 'inline-block', width, height: 'auto', color }}\n    >\n      <style>{COLOR_STYLE}</style>\n      <span ref={containerRef} className={SCOPED_CLASS} />\n    </span>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,169 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.LinkType = void 0;
+exports.UnifiedLink = UnifiedLink;
+exports.detectLinkType = detectLinkType;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var _linkTypes = require("../../types/link-types");
+var _entityLinkParser = require("../../utils/entityLinkParser");
+var _utils = require("../../lib/utils");
+var _useWeb5Link = require("../../hooks/useWeb5Link");
+var _ComponentDependenciesContext = require("../../context/ComponentDependenciesContext");
+var _diagnosticTypes = require("../../component/diagnosticTypes");
+var _ArrowUpIcon = require("./icons/ArrowUpIcon");
+var _ArrowTopRightIcon = require("./icons/ArrowTopRightIcon");
+var _jsxFileName = "/home/builduser/work/c2b6ca0b3fa984ee/packages/web5-core/dist/cjs/components/ui/UnifiedLink.tsx";
+let LinkType = exports.LinkType = /*#__PURE__*/function (LinkType) {
+  LinkType["ASK"] = "ask";
+  LinkType["ACTION"] = "action";
+  LinkType["NAVIGATE"] = "navigate";
+  return LinkType;
+}({});
+const ARROW_BY_TYPE = {
+  [LinkType.ASK]: _ArrowUpIcon.ArrowUpIcon,
+  [LinkType.ACTION]: _ArrowTopRightIcon.ArrowTopRightIcon,
+  [LinkType.NAVIGATE]: _ArrowUpIcon.ArrowUpIcon
+};
+function detectLinkType(href) {
+  if (!href) {
+    return LinkType.NAVIGATE;
+  }
+  if ((0, _linkTypes.isWeb5AskUrl)(href)) {
+    return LinkType.ASK;
+  }
+  if ((0, _linkTypes.isWeb5ActionUrl)(href)) {
+    return LinkType.ACTION;
+  }
+  return LinkType.NAVIGATE;
+}
+function UnifiedLink({
+  href,
+  linkType: linkTypeProp,
+  variant = 'primary',
+  active = false,
+  hideArrow,
+  className,
+  children,
+  onClick,
+  ...props
+}) {
+  const {
+    handleLinkClick,
+    resolveUrl
+  } = (0, _useWeb5Link.useWeb5Link)();
+  const {
+    reportDiagnostic
+  } = (0, _ComponentDependenciesContext.useComponentDependencies)();
+  if (!(0, _entityLinkParser.validateLinkUrl)(href)) {
+    reportDiagnostic == null || reportDiagnostic(_diagnosticTypes.DIAGNOSTIC_TYPES.BROKEN_WEB5_LINK, 'unifiedLink', `link rejected: "${href}"`);
+    return null;
+  }
+  const resolvedHref = resolveUrl(href) ?? href;
+  const linkType = linkTypeProp ?? detectLinkType(href);
+  const ArrowIcon = ARROW_BY_TYPE[linkType];
+  const showArrow = !hideArrow && variant !== 'inline';
+
+  // web5:// hrefs must never reach the browser — Safari iOS attempts custom-scheme
+  // navigation before JS fires, producing an "address is invalid" error.
+  const safeHref = href != null && href.startsWith('web5://') ? '#' : resolvedHref;
+  const handleClick = e => {
+    onClick == null || onClick(e);
+    if (!e.defaultPrevented && resolvedHref) {
+      handleLinkClick(e, resolvedHref);
+    }
+  };
+  if (variant === 'inline') {
+    return /*#__PURE__*/_react.default.createElement("a", (0, _extends2.default)({
+      href: safeHref,
+      className: (0, _utils.cn)('text-primary underline underline-offset-4 hover:text-primary/80 cursor-pointer', className),
+      onClick: handleClick
+    }, props, {
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 96,
+        columnNumber: 7
+      }
+    }), children);
+  }
+  if (variant === 'secondary') {
+    return /*#__PURE__*/_react.default.createElement("a", (0, _extends2.default)({
+      href: safeHref,
+      className: (0, _utils.cn)('inline w-fit cursor-pointer', 'text-sm leading-[18px] text-text-accent', className),
+      onClick: handleClick
+    }, props, {
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 112,
+        columnNumber: 7
+      }
+    }), children, showArrow && /*#__PURE__*/_react.default.createElement("span", {
+      className: "inline whitespace-nowrap",
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 124,
+        columnNumber: 11
+      }
+    }, "\xA0", /*#__PURE__*/_react.default.createElement(ArrowIcon, {
+      className: "ml-0.5 inline-block size-4 align-middle",
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 126,
+        columnNumber: 13
+      }
+    })));
+  }
+
+  // Primary variant — pill with arrow circle and hover overlay
+  return /*#__PURE__*/_react.default.createElement("a", (0, _extends2.default)({
+    href: safeHref,
+    className: (0, _utils.cn)('group relative flex md:w-fit md:max-w-[500px] items-center justify-between rounded-[80px] pl-5 pr-[3px] py-[3px] gap-2 cursor-pointer overflow-hidden', 'text-sm leading-[14px]', active ? 'bg-text-accent text-white' : 'bg-white border border-text-accent/30 text-text-accent', className),
+    onClick: handleClick
+  }, props, {
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 135,
+      columnNumber: 5
+    }
+  }), /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _utils.cn)('absolute inset-[3px] rounded-[80px] pointer-events-none', 'origin-right scale-x-0 group-hover:scale-x-100', 'transition-transform duration-300 ease-out', active ? 'bg-text-accent-hover' : 'bg-text-accent/10'),
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 149,
+      columnNumber: 7
+    }
+  }), /*#__PURE__*/_react.default.createElement("span", {
+    className: "relative z-[1] min-w-0 py-[10px] truncate",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 157,
+      columnNumber: 7
+    }
+  }, children), showArrow && /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _utils.cn)('relative z-[1] flex items-center justify-center rounded-full shrink-0', 'size-[34px] p-2.5', active ? 'bg-text-accent-hover' : 'bg-text-accent/10'),
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 161,
+      columnNumber: 9
+    }
+  }, /*#__PURE__*/_react.default.createElement(ArrowIcon, {
+    className: "size-4",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 168,
+      columnNumber: 11
+    }
+  })));
+}
+//# sourceMappingURL=UnifiedLink.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_linkTypes","_entityLinkParser","_utils","_useWeb5Link","_ComponentDependenciesContext","_diagnosticTypes","_ArrowUpIcon","_ArrowTopRightIcon","_jsxFileName","LinkType","exports","ARROW_BY_TYPE","ASK","ArrowUpIcon","ACTION","ArrowTopRightIcon","NAVIGATE","detectLinkType","href","isWeb5AskUrl","isWeb5ActionUrl","UnifiedLink","linkType","linkTypeProp","variant","active","hideArrow","className","children","onClick","props","handleLinkClick","resolveUrl","useWeb5Link","reportDiagnostic","useComponentDependencies","validateLinkUrl","DIAGNOSTIC_TYPES","BROKEN_WEB5_LINK","resolvedHref","ArrowIcon","showArrow","safeHref","startsWith","handleClick","e","defaultPrevented","default","createElement","_extends2","cn","__self","__source","fileName","lineNumber","columnNumber"],"sources":["../../../../src/components/ui/UnifiedLink.tsx"],"sourcesContent":["import React from 'react';\nimport { isWeb5AskUrl, isWeb5ActionUrl } from '../../types/link-types';\nimport { validateLinkUrl } from '../../utils/entityLinkParser';\nimport { cn } from '../../lib/utils';\nimport { useWeb5Link } from '../../hooks/useWeb5Link';\nimport { useComponentDependencies } from '../../context/ComponentDependenciesContext';\nimport { DIAGNOSTIC_TYPES } from '../../component/diagnosticTypes';\nimport { ArrowUpIcon } from './icons/ArrowUpIcon';\nimport { ArrowTopRightIcon } from './icons/ArrowTopRightIcon';\n\nexport enum LinkType {\n  ASK = 'ask',\n  ACTION = 'action',\n  NAVIGATE = 'navigate',\n}\n\nexport type LinkVariant = 'primary' | 'secondary' | 'inline';\n\nexport interface UnifiedLinkProps\n  extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n  href?: string;\n  /** Override auto-detected link type */\n  linkType?: LinkType;\n  /** Visual variant */\n  variant?: LinkVariant;\n  /** Whether this is the first/active item (dark bg). Only applies to primary variant. */\n  active?: boolean;\n  /** Hide the arrow icon */\n  hideArrow?: boolean;\n  children: React.ReactNode;\n}\n\nconst ARROW_BY_TYPE: Record<\n  LinkType,\n  React.FC<React.SVGProps<SVGSVGElement>>\n> = {\n  [LinkType.ASK]: ArrowUpIcon,\n  [LinkType.ACTION]: ArrowTopRightIcon,\n  [LinkType.NAVIGATE]: ArrowUpIcon,\n};\n\nexport function detectLinkType(href: string | undefined): LinkType {\n  if (!href) {\n    return LinkType.NAVIGATE;\n  }\n  if (isWeb5AskUrl(href)) {\n    return LinkType.ASK;\n  }\n  if (isWeb5ActionUrl(href)) {\n    return LinkType.ACTION;\n  }\n  return LinkType.NAVIGATE;\n}\n\nexport function UnifiedLink({\n  href,\n  linkType: linkTypeProp,\n  variant = 'primary',\n  active = false,\n  hideArrow,\n  className,\n  children,\n  onClick,\n  ...props\n}: UnifiedLinkProps) {\n  const { handleLinkClick, resolveUrl } = useWeb5Link();\n  const { reportDiagnostic } = useComponentDependencies();\n\n  if (!validateLinkUrl(href)) {\n    reportDiagnostic?.(\n      DIAGNOSTIC_TYPES.BROKEN_WEB5_LINK,\n      'unifiedLink',\n      `link rejected: \"${href}\"`,\n    );\n    return null;\n  }\n\n  const resolvedHref = resolveUrl(href) ?? href;\n  const linkType = linkTypeProp ?? detectLinkType(href);\n  const ArrowIcon = ARROW_BY_TYPE[linkType];\n  const showArrow = !hideArrow && variant !== 'inline';\n\n  // web5:// hrefs must never reach the browser — Safari iOS attempts custom-scheme\n  // navigation before JS fires, producing an \"address is invalid\" error.\n  const safeHref = href?.startsWith('web5://') ? '#' : resolvedHref;\n\n  const handleClick = (e: React.MouseEvent<HTMLAnchorElement>) => {\n    onClick?.(e);\n    if (!e.defaultPrevented && resolvedHref) {\n      handleLinkClick(e, resolvedHref);\n    }\n  };\n\n  if (variant === 'inline') {\n    return (\n      <a\n        href={safeHref}\n        className={cn(\n          'text-primary underline underline-offset-4 hover:text-primary/80 cursor-pointer',\n          className,\n        )}\n        onClick={handleClick}\n        {...props}\n      >\n        {children}\n      </a>\n    );\n  }\n\n  if (variant === 'secondary') {\n    return (\n      <a\n        href={safeHref}\n        className={cn(\n          'inline w-fit cursor-pointer',\n          'text-sm leading-[18px] text-text-accent',\n          className,\n        )}\n        onClick={handleClick}\n        {...props}\n      >\n        {children}\n        {showArrow && (\n          <span className=\"inline whitespace-nowrap\">\n            &nbsp;\n            <ArrowIcon className=\"ml-0.5 inline-block size-4 align-middle\" />\n          </span>\n        )}\n      </a>\n    );\n  }\n\n  // Primary variant — pill with arrow circle and hover overlay\n  return (\n    <a\n      href={safeHref}\n      className={cn(\n        'group relative flex md:w-fit md:max-w-[500px] items-center justify-between rounded-[80px] pl-5 pr-[3px] py-[3px] gap-2 cursor-pointer overflow-hidden',\n        'text-sm leading-[14px]',\n        active\n          ? 'bg-text-accent text-white'\n          : 'bg-white border border-text-accent/30 text-text-accent',\n        className,\n      )}\n      onClick={handleClick}\n      {...props}\n    >\n      {/* Hover overlay — expands from right (arrow) to fill pill */}\n      <span\n        className={cn(\n          'absolute inset-[3px] rounded-[80px] pointer-events-none',\n          'origin-right scale-x-0 group-hover:scale-x-100',\n          'transition-transform duration-300 ease-out',\n          active ? 'bg-text-accent-hover' : 'bg-text-accent/10',\n        )}\n      />\n      <span className=\"relative z-[1] min-w-0 py-[10px] truncate\">\n        {children}\n      </span>\n      {showArrow && (\n        <span\n          className={cn(\n            'relative z-[1] flex items-center justify-center rounded-full shrink-0',\n            'size-[34px] p-2.5',\n            active ? 'bg-text-accent-hover' : 'bg-text-accent/10',\n          )}\n        >\n          <ArrowIcon className=\"size-4\" />\n        </span>\n      )}\n    </a>\n  );\n}\n"],"mappings":"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","ignoreList":[]}