@seed-ship/mcp-ui-solid 6.5.0 → 6.6.0

package/dist/components/ExpandableWrapper.cjs

@@ -2,7 +2,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const web = require("solid-js/web");
 const solidJs = require("solid-js");
-var _tmpl$ = /* @__PURE__ */ web.template(`<svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z">`), _tmpl$2 = /* @__PURE__ */ web.template(`<button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors">`), _tmpl$3 = /* @__PURE__ */ web.template(`<div class="fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm"role=dialog aria-modal=true tabindex=-1 style="animation:expandable-fade-in 0.15s ease-out"><div class="relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden"style="animation:expandable-scale-in 0.15s ease-out"><div class="flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0"><h2 class="text-lg font-semibold text-gray-900 dark:text-white truncate"></h2><div class="flex items-center gap-2"><!$><!/><button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"aria-label="Close expanded view"><svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M6 18L18 6M6 6l12 12"></path></svg></button></div></div><div class="flex-1 min-h-0 overflow-auto p-4 flex flex-col">`), _tmpl$4 = /* @__PURE__ */ web.template(`<style>
+const MCPUIStringsContext = require("../context/MCPUIStringsContext.cjs");
+var _tmpl$ = /* @__PURE__ */ web.template(`<svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z">`), _tmpl$2 = /* @__PURE__ */ web.template(`<button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors">`), _tmpl$3 = /* @__PURE__ */ web.template(`<div class="fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm"role=dialog aria-modal=true tabindex=-1 style="animation:expandable-fade-in 0.15s ease-out"><div class="relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden"style="animation:expandable-scale-in 0.15s ease-out"><div class="flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0"><h2 class="text-lg font-semibold text-gray-900 dark:text-white truncate"></h2><div class="flex items-center gap-2"><!$><!/><button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"><svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M6 18L18 6M6 6l12 12"></path></svg></button></div></div><div class="flex-1 min-h-0 overflow-auto p-4 flex flex-col">`), _tmpl$4 = /* @__PURE__ */ web.template(`<style>
             @keyframes expandable-fade-in {
               from { opacity: 0; }
               to { opacity: 1; }
@@ -11,12 +12,13 @@ var _tmpl$ = /* @__PURE__ */ web.template(`<svg class="w-5 h-5"fill=none viewBox
               from { opacity: 0; transform: scale(0.97); }
               to { opacity: 1; transform: scale(1); }
             }
-          `), _tmpl$5 = /* @__PURE__ */ web.template(`<div class="relative group"><div><div></div></div><button title=Expand aria-label="Expand to fullscreen"><svg class="w-3.5 h-3.5 text-gray-500 dark:text-gray-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5"></path></svg></button><!$><!/>`), _tmpl$6 = /* @__PURE__ */ web.template(`<svg class="w-5 h-5 text-green-500"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M5 13l4 4L19 7">`);
+          `), _tmpl$5 = /* @__PURE__ */ web.template(`<div class="relative group"><div><div></div></div><button aria-label="Expand to fullscreen"><svg class="w-3.5 h-3.5 text-gray-500 dark:text-gray-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5"></path></svg></button><!$><!/>`), _tmpl$6 = /* @__PURE__ */ web.template(`<svg class="w-5 h-5 text-green-500"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M5 13l4 4L19 7">`);
 const ExpandedContext = solidJs.createContext(() => false);
 const useExpanded = () => solidJs.useContext(ExpandedContext);
 const ExpandableWrapper = (props) => {
   const [isExpanded, setIsExpanded] = solidJs.createSignal(false);
   const [copied, setCopied] = solidJs.createSignal(false);
+  const strings = MCPUIStringsContext.useMCPUIStrings();
   let dialogRef;
   let contentRef;
   let inlineSlotRef;
@@ -91,7 +93,7 @@ const ExpandableWrapper = (props) => {
               typeof _ref$3 === "function" ? web.use(_ref$3, _el$5) : dialogRef = _el$5;
               _el$5.$$click = handleBackdropClick;
               _el$6.$$click = (e) => e.stopPropagation();
-              web.insert(_el$8, () => props.title || "Expanded View");
+              web.insert(_el$8, () => props.title || strings.expandedView);
               web.insert(_el$9, web.createComponent(solidJs.Show, {
                 get when() {
                   return props.copyData;
@@ -111,7 +113,7 @@ const ExpandableWrapper = (props) => {
                     }
                   }));
                   web.effect((_p$) => {
-                    var _v$ = props.copyLabel || "Copy to clipboard", _v$2 = props.copyLabel || "Copy to clipboard";
+                    var _v$ = props.copyLabel || strings.copyToClipboard, _v$2 = props.copyLabel || strings.copyToClipboard;
                     _v$ !== _p$.e && web.setAttribute(_el$0, "title", _p$.e = _v$);
                     _v$2 !== _p$.t && web.setAttribute(_el$0, "aria-label", _p$.t = _v$2);
                     return _p$;
@@ -126,7 +128,15 @@ const ExpandableWrapper = (props) => {
               _el$10.$$click = handleClose;
               var _ref$4 = modalSlotRef;
               typeof _ref$4 === "function" ? web.use(_ref$4, _el$13) : modalSlotRef = _el$13;
-              web.effect(() => web.setAttribute(_el$5, "aria-label", props.title || "Expanded view"));
+              web.effect((_p$) => {
+                var _v$3 = props.title || strings.expandedView, _v$4 = strings.closeExpandedView;
+                _v$3 !== _p$.e && web.setAttribute(_el$5, "aria-label", _p$.e = _v$3);
+                _v$4 !== _p$.t && web.setAttribute(_el$10, "aria-label", _p$.t = _v$4);
+                return _p$;
+              }, {
+                e: void 0,
+                t: void 0
+              });
               web.runHydrationEvents();
               return _el$5;
             })(), web.getNextElement(_tmpl$4)];
@@ -134,7 +144,15 @@ const ExpandableWrapper = (props) => {
         });
       }
     }), _el$16, _co$2);
-    web.effect(() => web.className(_el$4, `absolute top-2 right-2 z-10 ${props.toolbarVariant === "always-visible" ? "opacity-60 hover:opacity-100" : "opacity-0 group-hover:opacity-70 hover:!opacity-100"} p-1.5 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm`));
+    web.effect((_p$) => {
+      var _v$5 = `absolute top-2 right-2 z-10 ${props.toolbarVariant === "always-visible" ? "opacity-60 hover:opacity-100" : "opacity-0 group-hover:opacity-70 hover:!opacity-100"} p-1.5 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm`, _v$6 = strings.expand;
+      _v$5 !== _p$.e && web.className(_el$4, _p$.e = _v$5);
+      _v$6 !== _p$.t && web.setAttribute(_el$4, "title", _p$.t = _v$6);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0
+    });
     web.runHydrationEvents();
     return _el$;
   })();

package/dist/components/ExpandableWrapper.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandableWrapper.cjs","sources":["../../src/components/ExpandableWrapper.tsx"],"sourcesContent":["/**\n * ExpandableWrapper - Generic expand/fullscreen wrapper for components\n * v2.2.0: Reusable wrapper that adds expand button + fullscreen modal\n *\n * Uses DOM reparenting to avoid rendering children twice — critical for\n * imperative components like ChartJS that bind instances to DOM nodes.\n */\n\nimport { Component, Show, createSignal, createEffect, onCleanup, JSX, createContext, useContext, Accessor } from 'solid-js'\nimport { Portal } from 'solid-js/web'\n\n/** Context for child components to know if they're in expanded/fullscreen view */\nconst ExpandedContext = createContext<Accessor<boolean>>(() => false)\n\n/** Hook for child components to read expanded state */\nexport const useExpanded = () => useContext(ExpandedContext)\n\nexport interface ExpandableWrapperProps {\n  /** Content to render inline (and in expanded view) */\n  children: JSX.Element\n  /** Title shown in the expanded modal header */\n  title?: string\n  /** Data string for copy-to-clipboard in expanded view */\n  copyData?: string\n  /** Label for copy button tooltip */\n  copyLabel?: string\n  /**\n   * Visibility behavior of the inline expand button (v6.3.0 — axe 4 deposium handoff).\n   *   - `'hover'` (default) : opacity 0, fades to 0.7 on parent group hover.\n   *     Backwards-compatible — pre-v6.3.0 behavior.\n   *   - `'always-visible'` : opacity 0.6 permanent, 1 on hover. Use this when\n   *     the inline button needs to be discoverable without hovering — esp.\n   *     on touch surfaces and consumer themes where the hover-only pattern\n   *     hides the affordance.\n   */\n  toolbarVariant?: 'hover' | 'always-visible'\n}\n\n/**\n * Wraps any component with an expand button (top-right corner).\n * Opens a fullscreen Portal modal. The children's DOM is physically\n * reparented into the modal (not duplicated), so imperative bindings\n * like Chart.js canvas refs stay intact.\n *\n * @example\n * <ExpandableWrapper title=\"Sales Data\" copyData={tsvData}>\n *   <TableRenderer ... />\n * </ExpandableWrapper>\n */\nexport const ExpandableWrapper: Component<ExpandableWrapperProps> = (props) => {\n  const [isExpanded, setIsExpanded] = createSignal(false)\n  const [copied, setCopied] = createSignal(false)\n  let dialogRef: HTMLDivElement | undefined\n  let contentRef: HTMLDivElement | undefined\n  let inlineSlotRef: HTMLDivElement | undefined\n  let modalSlotRef: HTMLDivElement | undefined\n\n  const handleOpen = () => setIsExpanded(true)\n  const handleClose = () => setIsExpanded(false)\n\n  // Reparent content DOM between inline and modal slots\n  createEffect(() => {\n    if (!contentRef) return\n\n    if (isExpanded()) {\n      // Move content into modal\n      modalSlotRef?.appendChild(contentRef)\n    } else {\n      // Move content back to inline\n      inlineSlotRef?.appendChild(contentRef)\n    }\n  })\n\n  // Keyboard: Escape to close\n  createEffect(() => {\n    if (!isExpanded()) return\n\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        handleClose()\n      }\n    }\n\n    document.addEventListener('keydown', onKeyDown)\n    onCleanup(() => document.removeEventListener('keydown', onKeyDown))\n  })\n\n  // Prevent body scroll when expanded\n  createEffect(() => {\n    if (isExpanded()) {\n      const prev = document.body.style.overflow\n      document.body.style.overflow = 'hidden'\n      // Focus the dialog\n      setTimeout(() => dialogRef?.focus(), 10)\n      onCleanup(() => {\n        document.body.style.overflow = prev\n      })\n    }\n  })\n\n  const handleBackdropClick = (e: MouseEvent) => {\n    if (e.target === e.currentTarget) handleClose()\n  }\n\n  const handleCopy = async () => {\n    if (!props.copyData) return\n    try {\n      await navigator.clipboard.writeText(props.copyData)\n      setCopied(true)\n      setTimeout(() => setCopied(false), 2000)\n    } catch (err) {\n      console.error('Failed to copy:', err)\n    }\n  }\n\n  return (\n    <div class=\"relative group\">\n      {/* Inline slot — content lives here when not expanded */}\n      <div ref={inlineSlotRef}>\n        <div ref={contentRef}>\n          <ExpandedContext.Provider value={isExpanded}>\n            {props.children}\n          </ExpandedContext.Provider>\n        </div>\n      </div>\n\n      {/* Expand button — visibility per `toolbarVariant` (default 'hover') */}\n      <button\n        onClick={handleOpen}\n        class={`absolute top-2 right-2 z-10 ${\n          props.toolbarVariant === 'always-visible'\n            ? 'opacity-60 hover:opacity-100'\n            : 'opacity-0 group-hover:opacity-70 hover:!opacity-100'\n        } p-1.5 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm`}\n        title=\"Expand\"\n        aria-label=\"Expand to fullscreen\"\n      >\n        <svg class=\"w-3.5 h-3.5 text-gray-500 dark:text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5\" />\n        </svg>\n      </button>\n\n      {/* Fullscreen modal via Portal */}\n      <Show when={isExpanded()}>\n        <Portal>\n          <div\n            class=\"fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm\"\n            style={{ animation: 'expandable-fade-in 0.15s ease-out' }}\n            onClick={handleBackdropClick}\n            role=\"dialog\"\n            aria-modal=\"true\"\n            aria-label={props.title || 'Expanded view'}\n            tabIndex={-1}\n            ref={dialogRef}\n          >\n            {/* Modal panel */}\n            <div\n              class=\"relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden\"\n              style={{ animation: 'expandable-scale-in 0.15s ease-out' }}\n              onClick={(e) => e.stopPropagation()}\n            >\n              {/* Header */}\n              <div class=\"flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0\">\n                <h2 class=\"text-lg font-semibold text-gray-900 dark:text-white truncate\">\n                  {props.title || 'Expanded View'}\n                </h2>\n                <div class=\"flex items-center gap-2\">\n                  {/* Copy button */}\n                  <Show when={props.copyData}>\n                    <button\n                      onClick={handleCopy}\n                      class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                      title={props.copyLabel || 'Copy to clipboard'}\n                      aria-label={props.copyLabel || 'Copy to clipboard'}\n                    >\n                      <Show\n                        when={!copied()}\n                        fallback={\n                          <svg class=\"w-5 h-5 text-green-500\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\" />\n                          </svg>\n                        }\n                      >\n                        <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\" />\n                        </svg>\n                      </Show>\n                    </button>\n                  </Show>\n                  {/* Close button */}\n                  <button\n                    onClick={handleClose}\n                    class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                    aria-label=\"Close expanded view\"\n                  >\n                    <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                      <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n                    </svg>\n                  </button>\n                </div>\n              </div>\n\n              {/* Modal slot — content is reparented here when expanded.\n                  v6.1.0 : `flex flex-col` lets aware children opt into\n                  `flex-1 min-h-0` to fill the modal vertically (chart,\n                  table, map, graph). Unaware children keep working\n                  thanks to `overflow-auto` (their natural height\n                  scrolls if it overflows the slot). */}\n              <div class=\"flex-1 min-h-0 overflow-auto p-4 flex flex-col\" ref={modalSlotRef} />\n            </div>\n          </div>\n\n          <style>{`\n            @keyframes expandable-fade-in {\n              from { opacity: 0; }\n              to { opacity: 1; }\n            }\n            @keyframes expandable-scale-in {\n              from { opacity: 0; transform: scale(0.97); }\n              to { opacity: 1; transform: scale(1); }\n            }\n          `}</style>\n        </Portal>\n      </Show>\n    </div>\n  )\n}\n"],"names":["ExpandedContext","createContext","useExpanded","useContext","ExpandableWrapper","props","isExpanded","setIsExpanded","createSignal","copied","setCopied","dialogRef","contentRef","inlineSlotRef","modalSlotRef","handleOpen","handleClose","createEffect","appendChild","onKeyDown","e","key","preventDefault","document","addEventListener","onCleanup","removeEventListener","prev","body","style","overflow","setTimeout","focus","handleBackdropClick","target","currentTarget","handleCopy","copyData","navigator","clipboard","writeText","err","console","error","_el$","_$getNextElement","_tmpl$5","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$15","_el$16","_co$2","_$getNextMarker","_ref$","_$use","_ref$2","_$insert","_$createComponent","Provider","value","children","$$click","Show","when","Portal","_el$5","_tmpl$3","_el$6","_el$7","_el$8","_el$9","_el$11","_el$12","_co$","_el$10","_el$13","_ref$3","stopPropagation","title","_el$0","_tmpl$2","fallback","_tmpl$6","_tmpl$","_$effect","_p$","_v$","copyLabel","_v$2","_$setAttribute","t","undefined","_$runHydrationEvents","_ref$4","_tmpl$4","_$className","toolbarVariant","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"ExpandableWrapper.cjs","sources":["../../src/components/ExpandableWrapper.tsx"],"sourcesContent":["/**\n * ExpandableWrapper - Generic expand/fullscreen wrapper for components\n * v2.2.0: Reusable wrapper that adds expand button + fullscreen modal\n *\n * Uses DOM reparenting to avoid rendering children twice — critical for\n * imperative components like ChartJS that bind instances to DOM nodes.\n */\n\nimport { Component, Show, createSignal, createEffect, onCleanup, JSX, createContext, useContext, Accessor } from 'solid-js'\nimport { Portal } from 'solid-js/web'\nimport { useMCPUIStrings } from '../context/MCPUIStringsContext'\n\n/** Context for child components to know if they're in expanded/fullscreen view */\nconst ExpandedContext = createContext<Accessor<boolean>>(() => false)\n\n/** Hook for child components to read expanded state */\nexport const useExpanded = () => useContext(ExpandedContext)\n\nexport interface ExpandableWrapperProps {\n  /** Content to render inline (and in expanded view) */\n  children: JSX.Element\n  /** Title shown in the expanded modal header */\n  title?: string\n  /** Data string for copy-to-clipboard in expanded view */\n  copyData?: string\n  /** Label for copy button tooltip */\n  copyLabel?: string\n  /**\n   * Visibility behavior of the inline expand button (v6.3.0 — axe 4 deposium handoff).\n   *   - `'hover'` (default) : opacity 0, fades to 0.7 on parent group hover.\n   *     Backwards-compatible — pre-v6.3.0 behavior.\n   *   - `'always-visible'` : opacity 0.6 permanent, 1 on hover. Use this when\n   *     the inline button needs to be discoverable without hovering — esp.\n   *     on touch surfaces and consumer themes where the hover-only pattern\n   *     hides the affordance.\n   */\n  toolbarVariant?: 'hover' | 'always-visible'\n}\n\n/**\n * Wraps any component with an expand button (top-right corner).\n * Opens a fullscreen Portal modal. The children's DOM is physically\n * reparented into the modal (not duplicated), so imperative bindings\n * like Chart.js canvas refs stay intact.\n *\n * @example\n * <ExpandableWrapper title=\"Sales Data\" copyData={tsvData}>\n *   <TableRenderer ... />\n * </ExpandableWrapper>\n */\nexport const ExpandableWrapper: Component<ExpandableWrapperProps> = (props) => {\n  const [isExpanded, setIsExpanded] = createSignal(false)\n  const [copied, setCopied] = createSignal(false)\n  const strings = useMCPUIStrings()\n  let dialogRef: HTMLDivElement | undefined\n  let contentRef: HTMLDivElement | undefined\n  let inlineSlotRef: HTMLDivElement | undefined\n  let modalSlotRef: HTMLDivElement | undefined\n\n  const handleOpen = () => setIsExpanded(true)\n  const handleClose = () => setIsExpanded(false)\n\n  // Reparent content DOM between inline and modal slots\n  createEffect(() => {\n    if (!contentRef) return\n\n    if (isExpanded()) {\n      // Move content into modal\n      modalSlotRef?.appendChild(contentRef)\n    } else {\n      // Move content back to inline\n      inlineSlotRef?.appendChild(contentRef)\n    }\n  })\n\n  // Keyboard: Escape to close\n  createEffect(() => {\n    if (!isExpanded()) return\n\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        handleClose()\n      }\n    }\n\n    document.addEventListener('keydown', onKeyDown)\n    onCleanup(() => document.removeEventListener('keydown', onKeyDown))\n  })\n\n  // Prevent body scroll when expanded\n  createEffect(() => {\n    if (isExpanded()) {\n      const prev = document.body.style.overflow\n      document.body.style.overflow = 'hidden'\n      // Focus the dialog\n      setTimeout(() => dialogRef?.focus(), 10)\n      onCleanup(() => {\n        document.body.style.overflow = prev\n      })\n    }\n  })\n\n  const handleBackdropClick = (e: MouseEvent) => {\n    if (e.target === e.currentTarget) handleClose()\n  }\n\n  const handleCopy = async () => {\n    if (!props.copyData) return\n    try {\n      await navigator.clipboard.writeText(props.copyData)\n      setCopied(true)\n      setTimeout(() => setCopied(false), 2000)\n    } catch (err) {\n      console.error('Failed to copy:', err)\n    }\n  }\n\n  return (\n    <div class=\"relative group\">\n      {/* Inline slot — content lives here when not expanded */}\n      <div ref={inlineSlotRef}>\n        <div ref={contentRef}>\n          <ExpandedContext.Provider value={isExpanded}>\n            {props.children}\n          </ExpandedContext.Provider>\n        </div>\n      </div>\n\n      {/* Expand button — visibility per `toolbarVariant` (default 'hover') */}\n      <button\n        onClick={handleOpen}\n        class={`absolute top-2 right-2 z-10 ${\n          props.toolbarVariant === 'always-visible'\n            ? 'opacity-60 hover:opacity-100'\n            : 'opacity-0 group-hover:opacity-70 hover:!opacity-100'\n        } p-1.5 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm`}\n        title={strings.expand}\n        aria-label=\"Expand to fullscreen\"\n      >\n        <svg class=\"w-3.5 h-3.5 text-gray-500 dark:text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5\" />\n        </svg>\n      </button>\n\n      {/* Fullscreen modal via Portal */}\n      <Show when={isExpanded()}>\n        <Portal>\n          <div\n            class=\"fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm\"\n            style={{ animation: 'expandable-fade-in 0.15s ease-out' }}\n            onClick={handleBackdropClick}\n            role=\"dialog\"\n            aria-modal=\"true\"\n            aria-label={props.title || strings.expandedView}\n            tabIndex={-1}\n            ref={dialogRef}\n          >\n            {/* Modal panel */}\n            <div\n              class=\"relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden\"\n              style={{ animation: 'expandable-scale-in 0.15s ease-out' }}\n              onClick={(e) => e.stopPropagation()}\n            >\n              {/* Header */}\n              <div class=\"flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0\">\n                <h2 class=\"text-lg font-semibold text-gray-900 dark:text-white truncate\">\n                  {props.title || strings.expandedView}\n                </h2>\n                <div class=\"flex items-center gap-2\">\n                  {/* Copy button */}\n                  <Show when={props.copyData}>\n                    <button\n                      onClick={handleCopy}\n                      class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                      title={props.copyLabel || strings.copyToClipboard}\n                      aria-label={props.copyLabel || strings.copyToClipboard}\n                    >\n                      <Show\n                        when={!copied()}\n                        fallback={\n                          <svg class=\"w-5 h-5 text-green-500\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\" />\n                          </svg>\n                        }\n                      >\n                        <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\" />\n                        </svg>\n                      </Show>\n                    </button>\n                  </Show>\n                  {/* Close button */}\n                  <button\n                    onClick={handleClose}\n                    class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                    aria-label={strings.closeExpandedView}\n                  >\n                    <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                      <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n                    </svg>\n                  </button>\n                </div>\n              </div>\n\n              {/* Modal slot — content is reparented here when expanded.\n                  v6.1.0 : `flex flex-col` lets aware children opt into\n                  `flex-1 min-h-0` to fill the modal vertically (chart,\n                  table, map, graph). Unaware children keep working\n                  thanks to `overflow-auto` (their natural height\n                  scrolls if it overflows the slot). */}\n              <div class=\"flex-1 min-h-0 overflow-auto p-4 flex flex-col\" ref={modalSlotRef} />\n            </div>\n          </div>\n\n          <style>{`\n            @keyframes expandable-fade-in {\n              from { opacity: 0; }\n              to { opacity: 1; }\n            }\n            @keyframes expandable-scale-in {\n              from { opacity: 0; transform: scale(0.97); }\n              to { opacity: 1; transform: scale(1); }\n            }\n          `}</style>\n        </Portal>\n      </Show>\n    </div>\n  )\n}\n"],"names":["ExpandedContext","createContext","useExpanded","useContext","ExpandableWrapper","props","isExpanded","setIsExpanded","createSignal","copied","setCopied","strings","useMCPUIStrings","dialogRef","contentRef","inlineSlotRef","modalSlotRef","handleOpen","handleClose","createEffect","appendChild","onKeyDown","e","key","preventDefault","document","addEventListener","onCleanup","removeEventListener","prev","body","style","overflow","setTimeout","focus","handleBackdropClick","target","currentTarget","handleCopy","copyData","navigator","clipboard","writeText","err","console","error","_el$","_$getNextElement","_tmpl$5","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$15","_el$16","_co$2","_$getNextMarker","_ref$","_$use","_ref$2","_$insert","_$createComponent","Provider","value","children","$$click","Show","when","Portal","_el$5","_tmpl$3","_el$6","_el$7","_el$8","_el$9","_el$11","_el$12","_co$","_el$10","_el$13","_ref$3","stopPropagation","title","expandedView","_el$0","_tmpl$2","fallback","_tmpl$6","_tmpl$","_$effect","_p$","_v$","copyLabel","copyToClipboard","_v$2","_$setAttribute","t","undefined","_$runHydrationEvents","_ref$4","_v$3","_v$4","closeExpandedView","_tmpl$4","_v$5","toolbarVariant","_v$6","expand","_$className","_$delegateEvents"],"mappings":"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"}

package/dist/components/ExpandableWrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandableWrapper.d.ts","sourceRoot":"","sources":["../../src/components/ExpandableWrapper.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,SAAS,EAA+C,GAAG,EAA6B,QAAQ,EAAE,MAAM,UAAU,CAAA;AAM3H,uDAAuD;AACvD,eAAO,MAAM,WAAW,yBAAoC,CAAA;AAE5D,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAA;IACrB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;;;;OAQG;IACH,cAAc,CAAC,EAAE,OAAO,GAAG,gBAAgB,CAAA;CAC5C;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,iBAAiB,EAAE,SAAS,CAAC,sBAAsB,CAkL/D,CAAA"}
+{"version":3,"file":"ExpandableWrapper.d.ts","sourceRoot":"","sources":["../../src/components/ExpandableWrapper.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,SAAS,EAA+C,GAAG,EAA6B,QAAQ,EAAE,MAAM,UAAU,CAAA;AAO3H,uDAAuD;AACvD,eAAO,MAAM,WAAW,yBAAoC,CAAA;AAE5D,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAA;IACrB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;;;;OAQG;IACH,cAAc,CAAC,EAAE,OAAO,GAAG,gBAAgB,CAAA;CAC5C;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,iBAAiB,EAAE,SAAS,CAAC,sBAAsB,CAmL/D,CAAA"}

package/dist/components/ExpandableWrapper.js

@@ -1,6 +1,7 @@
 import { delegateEvents, getNextElement, template, getNextMarker, insert, createComponent, Portal, use, effect, setAttribute, runHydrationEvents, className } from "solid-js/web";
 import { createContext, useContext, createSignal, createEffect, onCleanup, Show } from "solid-js";
-var _tmpl$ = /* @__PURE__ */ template(`<svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z">`), _tmpl$2 = /* @__PURE__ */ template(`<button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors">`), _tmpl$3 = /* @__PURE__ */ template(`<div class="fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm"role=dialog aria-modal=true tabindex=-1 style="animation:expandable-fade-in 0.15s ease-out"><div class="relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden"style="animation:expandable-scale-in 0.15s ease-out"><div class="flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0"><h2 class="text-lg font-semibold text-gray-900 dark:text-white truncate"></h2><div class="flex items-center gap-2"><!$><!/><button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"aria-label="Close expanded view"><svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M6 18L18 6M6 6l12 12"></path></svg></button></div></div><div class="flex-1 min-h-0 overflow-auto p-4 flex flex-col">`), _tmpl$4 = /* @__PURE__ */ template(`<style>
+import { useMCPUIStrings } from "../context/MCPUIStringsContext.js";
+var _tmpl$ = /* @__PURE__ */ template(`<svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z">`), _tmpl$2 = /* @__PURE__ */ template(`<button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors">`), _tmpl$3 = /* @__PURE__ */ template(`<div class="fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm"role=dialog aria-modal=true tabindex=-1 style="animation:expandable-fade-in 0.15s ease-out"><div class="relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden"style="animation:expandable-scale-in 0.15s ease-out"><div class="flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0"><h2 class="text-lg font-semibold text-gray-900 dark:text-white truncate"></h2><div class="flex items-center gap-2"><!$><!/><button class="p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors"><svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M6 18L18 6M6 6l12 12"></path></svg></button></div></div><div class="flex-1 min-h-0 overflow-auto p-4 flex flex-col">`), _tmpl$4 = /* @__PURE__ */ template(`<style>
             @keyframes expandable-fade-in {
               from { opacity: 0; }
               to { opacity: 1; }
@@ -9,12 +10,13 @@ var _tmpl$ = /* @__PURE__ */ template(`<svg class="w-5 h-5"fill=none viewBox="0
               from { opacity: 0; transform: scale(0.97); }
               to { opacity: 1; transform: scale(1); }
             }
-          `), _tmpl$5 = /* @__PURE__ */ template(`<div class="relative group"><div><div></div></div><button title=Expand aria-label="Expand to fullscreen"><svg class="w-3.5 h-3.5 text-gray-500 dark:text-gray-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5"></path></svg></button><!$><!/>`), _tmpl$6 = /* @__PURE__ */ template(`<svg class="w-5 h-5 text-green-500"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M5 13l4 4L19 7">`);
+          `), _tmpl$5 = /* @__PURE__ */ template(`<div class="relative group"><div><div></div></div><button aria-label="Expand to fullscreen"><svg class="w-3.5 h-3.5 text-gray-500 dark:text-gray-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5"></path></svg></button><!$><!/>`), _tmpl$6 = /* @__PURE__ */ template(`<svg class="w-5 h-5 text-green-500"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M5 13l4 4L19 7">`);
 const ExpandedContext = createContext(() => false);
 const useExpanded = () => useContext(ExpandedContext);
 const ExpandableWrapper = (props) => {
   const [isExpanded, setIsExpanded] = createSignal(false);
   const [copied, setCopied] = createSignal(false);
+  const strings = useMCPUIStrings();
   let dialogRef;
   let contentRef;
   let inlineSlotRef;
@@ -89,7 +91,7 @@ const ExpandableWrapper = (props) => {
               typeof _ref$3 === "function" ? use(_ref$3, _el$5) : dialogRef = _el$5;
               _el$5.$$click = handleBackdropClick;
               _el$6.$$click = (e) => e.stopPropagation();
-              insert(_el$8, () => props.title || "Expanded View");
+              insert(_el$8, () => props.title || strings.expandedView);
               insert(_el$9, createComponent(Show, {
                 get when() {
                   return props.copyData;
@@ -109,7 +111,7 @@ const ExpandableWrapper = (props) => {
                     }
                   }));
                   effect((_p$) => {
-                    var _v$ = props.copyLabel || "Copy to clipboard", _v$2 = props.copyLabel || "Copy to clipboard";
+                    var _v$ = props.copyLabel || strings.copyToClipboard, _v$2 = props.copyLabel || strings.copyToClipboard;
                     _v$ !== _p$.e && setAttribute(_el$0, "title", _p$.e = _v$);
                     _v$2 !== _p$.t && setAttribute(_el$0, "aria-label", _p$.t = _v$2);
                     return _p$;
@@ -124,7 +126,15 @@ const ExpandableWrapper = (props) => {
               _el$10.$$click = handleClose;
               var _ref$4 = modalSlotRef;
               typeof _ref$4 === "function" ? use(_ref$4, _el$13) : modalSlotRef = _el$13;
-              effect(() => setAttribute(_el$5, "aria-label", props.title || "Expanded view"));
+              effect((_p$) => {
+                var _v$3 = props.title || strings.expandedView, _v$4 = strings.closeExpandedView;
+                _v$3 !== _p$.e && setAttribute(_el$5, "aria-label", _p$.e = _v$3);
+                _v$4 !== _p$.t && setAttribute(_el$10, "aria-label", _p$.t = _v$4);
+                return _p$;
+              }, {
+                e: void 0,
+                t: void 0
+              });
               runHydrationEvents();
               return _el$5;
             })(), getNextElement(_tmpl$4)];
@@ -132,7 +142,15 @@ const ExpandableWrapper = (props) => {
         });
       }
     }), _el$16, _co$2);
-    effect(() => className(_el$4, `absolute top-2 right-2 z-10 ${props.toolbarVariant === "always-visible" ? "opacity-60 hover:opacity-100" : "opacity-0 group-hover:opacity-70 hover:!opacity-100"} p-1.5 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm`));
+    effect((_p$) => {
+      var _v$5 = `absolute top-2 right-2 z-10 ${props.toolbarVariant === "always-visible" ? "opacity-60 hover:opacity-100" : "opacity-0 group-hover:opacity-70 hover:!opacity-100"} p-1.5 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm`, _v$6 = strings.expand;
+      _v$5 !== _p$.e && className(_el$4, _p$.e = _v$5);
+      _v$6 !== _p$.t && setAttribute(_el$4, "title", _p$.t = _v$6);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0
+    });
     runHydrationEvents();
     return _el$;
   })();

package/dist/components/ExpandableWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandableWrapper.js","sources":["../../src/components/ExpandableWrapper.tsx"],"sourcesContent":["/**\n * ExpandableWrapper - Generic expand/fullscreen wrapper for components\n * v2.2.0: Reusable wrapper that adds expand button + fullscreen modal\n *\n * Uses DOM reparenting to avoid rendering children twice — critical for\n * imperative components like ChartJS that bind instances to DOM nodes.\n */\n\nimport { Component, Show, createSignal, createEffect, onCleanup, JSX, createContext, useContext, Accessor } from 'solid-js'\nimport { Portal } from 'solid-js/web'\n\n/** Context for child components to know if they're in expanded/fullscreen view */\nconst ExpandedContext = createContext<Accessor<boolean>>(() => false)\n\n/** Hook for child components to read expanded state */\nexport const useExpanded = () => useContext(ExpandedContext)\n\nexport interface ExpandableWrapperProps {\n  /** Content to render inline (and in expanded view) */\n  children: JSX.Element\n  /** Title shown in the expanded modal header */\n  title?: string\n  /** Data string for copy-to-clipboard in expanded view */\n  copyData?: string\n  /** Label for copy button tooltip */\n  copyLabel?: string\n  /**\n   * Visibility behavior of the inline expand button (v6.3.0 — axe 4 deposium handoff).\n   *   - `'hover'` (default) : opacity 0, fades to 0.7 on parent group hover.\n   *     Backwards-compatible — pre-v6.3.0 behavior.\n   *   - `'always-visible'` : opacity 0.6 permanent, 1 on hover. Use this when\n   *     the inline button needs to be discoverable without hovering — esp.\n   *     on touch surfaces and consumer themes where the hover-only pattern\n   *     hides the affordance.\n   */\n  toolbarVariant?: 'hover' | 'always-visible'\n}\n\n/**\n * Wraps any component with an expand button (top-right corner).\n * Opens a fullscreen Portal modal. The children's DOM is physically\n * reparented into the modal (not duplicated), so imperative bindings\n * like Chart.js canvas refs stay intact.\n *\n * @example\n * <ExpandableWrapper title=\"Sales Data\" copyData={tsvData}>\n *   <TableRenderer ... />\n * </ExpandableWrapper>\n */\nexport const ExpandableWrapper: Component<ExpandableWrapperProps> = (props) => {\n  const [isExpanded, setIsExpanded] = createSignal(false)\n  const [copied, setCopied] = createSignal(false)\n  let dialogRef: HTMLDivElement | undefined\n  let contentRef: HTMLDivElement | undefined\n  let inlineSlotRef: HTMLDivElement | undefined\n  let modalSlotRef: HTMLDivElement | undefined\n\n  const handleOpen = () => setIsExpanded(true)\n  const handleClose = () => setIsExpanded(false)\n\n  // Reparent content DOM between inline and modal slots\n  createEffect(() => {\n    if (!contentRef) return\n\n    if (isExpanded()) {\n      // Move content into modal\n      modalSlotRef?.appendChild(contentRef)\n    } else {\n      // Move content back to inline\n      inlineSlotRef?.appendChild(contentRef)\n    }\n  })\n\n  // Keyboard: Escape to close\n  createEffect(() => {\n    if (!isExpanded()) return\n\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        handleClose()\n      }\n    }\n\n    document.addEventListener('keydown', onKeyDown)\n    onCleanup(() => document.removeEventListener('keydown', onKeyDown))\n  })\n\n  // Prevent body scroll when expanded\n  createEffect(() => {\n    if (isExpanded()) {\n      const prev = document.body.style.overflow\n      document.body.style.overflow = 'hidden'\n      // Focus the dialog\n      setTimeout(() => dialogRef?.focus(), 10)\n      onCleanup(() => {\n        document.body.style.overflow = prev\n      })\n    }\n  })\n\n  const handleBackdropClick = (e: MouseEvent) => {\n    if (e.target === e.currentTarget) handleClose()\n  }\n\n  const handleCopy = async () => {\n    if (!props.copyData) return\n    try {\n      await navigator.clipboard.writeText(props.copyData)\n      setCopied(true)\n      setTimeout(() => setCopied(false), 2000)\n    } catch (err) {\n      console.error('Failed to copy:', err)\n    }\n  }\n\n  return (\n    <div class=\"relative group\">\n      {/* Inline slot — content lives here when not expanded */}\n      <div ref={inlineSlotRef}>\n        <div ref={contentRef}>\n          <ExpandedContext.Provider value={isExpanded}>\n            {props.children}\n          </ExpandedContext.Provider>\n        </div>\n      </div>\n\n      {/* Expand button — visibility per `toolbarVariant` (default 'hover') */}\n      <button\n        onClick={handleOpen}\n        class={`absolute top-2 right-2 z-10 ${\n          props.toolbarVariant === 'always-visible'\n            ? 'opacity-60 hover:opacity-100'\n            : 'opacity-0 group-hover:opacity-70 hover:!opacity-100'\n        } p-1.5 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm`}\n        title=\"Expand\"\n        aria-label=\"Expand to fullscreen\"\n      >\n        <svg class=\"w-3.5 h-3.5 text-gray-500 dark:text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5\" />\n        </svg>\n      </button>\n\n      {/* Fullscreen modal via Portal */}\n      <Show when={isExpanded()}>\n        <Portal>\n          <div\n            class=\"fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm\"\n            style={{ animation: 'expandable-fade-in 0.15s ease-out' }}\n            onClick={handleBackdropClick}\n            role=\"dialog\"\n            aria-modal=\"true\"\n            aria-label={props.title || 'Expanded view'}\n            tabIndex={-1}\n            ref={dialogRef}\n          >\n            {/* Modal panel */}\n            <div\n              class=\"relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden\"\n              style={{ animation: 'expandable-scale-in 0.15s ease-out' }}\n              onClick={(e) => e.stopPropagation()}\n            >\n              {/* Header */}\n              <div class=\"flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0\">\n                <h2 class=\"text-lg font-semibold text-gray-900 dark:text-white truncate\">\n                  {props.title || 'Expanded View'}\n                </h2>\n                <div class=\"flex items-center gap-2\">\n                  {/* Copy button */}\n                  <Show when={props.copyData}>\n                    <button\n                      onClick={handleCopy}\n                      class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                      title={props.copyLabel || 'Copy to clipboard'}\n                      aria-label={props.copyLabel || 'Copy to clipboard'}\n                    >\n                      <Show\n                        when={!copied()}\n                        fallback={\n                          <svg class=\"w-5 h-5 text-green-500\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\" />\n                          </svg>\n                        }\n                      >\n                        <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\" />\n                        </svg>\n                      </Show>\n                    </button>\n                  </Show>\n                  {/* Close button */}\n                  <button\n                    onClick={handleClose}\n                    class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                    aria-label=\"Close expanded view\"\n                  >\n                    <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                      <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n                    </svg>\n                  </button>\n                </div>\n              </div>\n\n              {/* Modal slot — content is reparented here when expanded.\n                  v6.1.0 : `flex flex-col` lets aware children opt into\n                  `flex-1 min-h-0` to fill the modal vertically (chart,\n                  table, map, graph). Unaware children keep working\n                  thanks to `overflow-auto` (their natural height\n                  scrolls if it overflows the slot). */}\n              <div class=\"flex-1 min-h-0 overflow-auto p-4 flex flex-col\" ref={modalSlotRef} />\n            </div>\n          </div>\n\n          <style>{`\n            @keyframes expandable-fade-in {\n              from { opacity: 0; }\n              to { opacity: 1; }\n            }\n            @keyframes expandable-scale-in {\n              from { opacity: 0; transform: scale(0.97); }\n              to { opacity: 1; transform: scale(1); }\n            }\n          `}</style>\n        </Portal>\n      </Show>\n    </div>\n  )\n}\n"],"names":["ExpandedContext","createContext","useExpanded","useContext","ExpandableWrapper","props","isExpanded","setIsExpanded","createSignal","copied","setCopied","dialogRef","contentRef","inlineSlotRef","modalSlotRef","handleOpen","handleClose","createEffect","appendChild","onKeyDown","e","key","preventDefault","document","addEventListener","onCleanup","removeEventListener","prev","body","style","overflow","setTimeout","focus","handleBackdropClick","target","currentTarget","handleCopy","copyData","navigator","clipboard","writeText","err","console","error","_el$","_$getNextElement","_tmpl$5","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$15","_el$16","_co$2","_$getNextMarker","_ref$","_$use","_ref$2","_$insert","_$createComponent","Provider","value","children","$$click","Show","when","Portal","_el$5","_tmpl$3","_el$6","_el$7","_el$8","_el$9","_el$11","_el$12","_co$","_el$10","_el$13","_ref$3","stopPropagation","title","_el$0","_tmpl$2","fallback","_tmpl$6","_tmpl$","_$effect","_p$","_v$","copyLabel","_v$2","_$setAttribute","t","undefined","_$runHydrationEvents","_ref$4","_tmpl$4","_$className","toolbarVariant","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"ExpandableWrapper.js","sources":["../../src/components/ExpandableWrapper.tsx"],"sourcesContent":["/**\n * ExpandableWrapper - Generic expand/fullscreen wrapper for components\n * v2.2.0: Reusable wrapper that adds expand button + fullscreen modal\n *\n * Uses DOM reparenting to avoid rendering children twice — critical for\n * imperative components like ChartJS that bind instances to DOM nodes.\n */\n\nimport { Component, Show, createSignal, createEffect, onCleanup, JSX, createContext, useContext, Accessor } from 'solid-js'\nimport { Portal } from 'solid-js/web'\nimport { useMCPUIStrings } from '../context/MCPUIStringsContext'\n\n/** Context for child components to know if they're in expanded/fullscreen view */\nconst ExpandedContext = createContext<Accessor<boolean>>(() => false)\n\n/** Hook for child components to read expanded state */\nexport const useExpanded = () => useContext(ExpandedContext)\n\nexport interface ExpandableWrapperProps {\n  /** Content to render inline (and in expanded view) */\n  children: JSX.Element\n  /** Title shown in the expanded modal header */\n  title?: string\n  /** Data string for copy-to-clipboard in expanded view */\n  copyData?: string\n  /** Label for copy button tooltip */\n  copyLabel?: string\n  /**\n   * Visibility behavior of the inline expand button (v6.3.0 — axe 4 deposium handoff).\n   *   - `'hover'` (default) : opacity 0, fades to 0.7 on parent group hover.\n   *     Backwards-compatible — pre-v6.3.0 behavior.\n   *   - `'always-visible'` : opacity 0.6 permanent, 1 on hover. Use this when\n   *     the inline button needs to be discoverable without hovering — esp.\n   *     on touch surfaces and consumer themes where the hover-only pattern\n   *     hides the affordance.\n   */\n  toolbarVariant?: 'hover' | 'always-visible'\n}\n\n/**\n * Wraps any component with an expand button (top-right corner).\n * Opens a fullscreen Portal modal. The children's DOM is physically\n * reparented into the modal (not duplicated), so imperative bindings\n * like Chart.js canvas refs stay intact.\n *\n * @example\n * <ExpandableWrapper title=\"Sales Data\" copyData={tsvData}>\n *   <TableRenderer ... />\n * </ExpandableWrapper>\n */\nexport const ExpandableWrapper: Component<ExpandableWrapperProps> = (props) => {\n  const [isExpanded, setIsExpanded] = createSignal(false)\n  const [copied, setCopied] = createSignal(false)\n  const strings = useMCPUIStrings()\n  let dialogRef: HTMLDivElement | undefined\n  let contentRef: HTMLDivElement | undefined\n  let inlineSlotRef: HTMLDivElement | undefined\n  let modalSlotRef: HTMLDivElement | undefined\n\n  const handleOpen = () => setIsExpanded(true)\n  const handleClose = () => setIsExpanded(false)\n\n  // Reparent content DOM between inline and modal slots\n  createEffect(() => {\n    if (!contentRef) return\n\n    if (isExpanded()) {\n      // Move content into modal\n      modalSlotRef?.appendChild(contentRef)\n    } else {\n      // Move content back to inline\n      inlineSlotRef?.appendChild(contentRef)\n    }\n  })\n\n  // Keyboard: Escape to close\n  createEffect(() => {\n    if (!isExpanded()) return\n\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        handleClose()\n      }\n    }\n\n    document.addEventListener('keydown', onKeyDown)\n    onCleanup(() => document.removeEventListener('keydown', onKeyDown))\n  })\n\n  // Prevent body scroll when expanded\n  createEffect(() => {\n    if (isExpanded()) {\n      const prev = document.body.style.overflow\n      document.body.style.overflow = 'hidden'\n      // Focus the dialog\n      setTimeout(() => dialogRef?.focus(), 10)\n      onCleanup(() => {\n        document.body.style.overflow = prev\n      })\n    }\n  })\n\n  const handleBackdropClick = (e: MouseEvent) => {\n    if (e.target === e.currentTarget) handleClose()\n  }\n\n  const handleCopy = async () => {\n    if (!props.copyData) return\n    try {\n      await navigator.clipboard.writeText(props.copyData)\n      setCopied(true)\n      setTimeout(() => setCopied(false), 2000)\n    } catch (err) {\n      console.error('Failed to copy:', err)\n    }\n  }\n\n  return (\n    <div class=\"relative group\">\n      {/* Inline slot — content lives here when not expanded */}\n      <div ref={inlineSlotRef}>\n        <div ref={contentRef}>\n          <ExpandedContext.Provider value={isExpanded}>\n            {props.children}\n          </ExpandedContext.Provider>\n        </div>\n      </div>\n\n      {/* Expand button — visibility per `toolbarVariant` (default 'hover') */}\n      <button\n        onClick={handleOpen}\n        class={`absolute top-2 right-2 z-10 ${\n          props.toolbarVariant === 'always-visible'\n            ? 'opacity-60 hover:opacity-100'\n            : 'opacity-0 group-hover:opacity-70 hover:!opacity-100'\n        } p-1.5 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-all shadow-sm`}\n        title={strings.expand}\n        aria-label=\"Expand to fullscreen\"\n      >\n        <svg class=\"w-3.5 h-3.5 text-gray-500 dark:text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5\" />\n        </svg>\n      </button>\n\n      {/* Fullscreen modal via Portal */}\n      <Show when={isExpanded()}>\n        <Portal>\n          <div\n            class=\"fixed inset-0 z-50 flex flex-col bg-black/50 backdrop-blur-sm\"\n            style={{ animation: 'expandable-fade-in 0.15s ease-out' }}\n            onClick={handleBackdropClick}\n            role=\"dialog\"\n            aria-modal=\"true\"\n            aria-label={props.title || strings.expandedView}\n            tabIndex={-1}\n            ref={dialogRef}\n          >\n            {/* Modal panel */}\n            <div\n              class=\"relative flex flex-col m-4 flex-1 bg-white dark:bg-gray-800 rounded-lg shadow-xl overflow-hidden\"\n              style={{ animation: 'expandable-scale-in 0.15s ease-out' }}\n              onClick={(e) => e.stopPropagation()}\n            >\n              {/* Header */}\n              <div class=\"flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-gray-700 flex-shrink-0\">\n                <h2 class=\"text-lg font-semibold text-gray-900 dark:text-white truncate\">\n                  {props.title || strings.expandedView}\n                </h2>\n                <div class=\"flex items-center gap-2\">\n                  {/* Copy button */}\n                  <Show when={props.copyData}>\n                    <button\n                      onClick={handleCopy}\n                      class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                      title={props.copyLabel || strings.copyToClipboard}\n                      aria-label={props.copyLabel || strings.copyToClipboard}\n                    >\n                      <Show\n                        when={!copied()}\n                        fallback={\n                          <svg class=\"w-5 h-5 text-green-500\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 13l4 4L19 7\" />\n                          </svg>\n                        }\n                      >\n                        <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\" />\n                        </svg>\n                      </Show>\n                    </button>\n                  </Show>\n                  {/* Close button */}\n                  <button\n                    onClick={handleClose}\n                    class=\"p-1.5 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors\"\n                    aria-label={strings.closeExpandedView}\n                  >\n                    <svg class=\"w-5 h-5\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n                      <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n                    </svg>\n                  </button>\n                </div>\n              </div>\n\n              {/* Modal slot — content is reparented here when expanded.\n                  v6.1.0 : `flex flex-col` lets aware children opt into\n                  `flex-1 min-h-0` to fill the modal vertically (chart,\n                  table, map, graph). Unaware children keep working\n                  thanks to `overflow-auto` (their natural height\n                  scrolls if it overflows the slot). */}\n              <div class=\"flex-1 min-h-0 overflow-auto p-4 flex flex-col\" ref={modalSlotRef} />\n            </div>\n          </div>\n\n          <style>{`\n            @keyframes expandable-fade-in {\n              from { opacity: 0; }\n              to { opacity: 1; }\n            }\n            @keyframes expandable-scale-in {\n              from { opacity: 0; transform: scale(0.97); }\n              to { opacity: 1; transform: scale(1); }\n            }\n          `}</style>\n        </Portal>\n      </Show>\n    </div>\n  )\n}\n"],"names":["ExpandedContext","createContext","useExpanded","useContext","ExpandableWrapper","props","isExpanded","setIsExpanded","createSignal","copied","setCopied","strings","useMCPUIStrings","dialogRef","contentRef","inlineSlotRef","modalSlotRef","handleOpen","handleClose","createEffect","appendChild","onKeyDown","e","key","preventDefault","document","addEventListener","onCleanup","removeEventListener","prev","body","style","overflow","setTimeout","focus","handleBackdropClick","target","currentTarget","handleCopy","copyData","navigator","clipboard","writeText","err","console","error","_el$","_$getNextElement","_tmpl$5","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$15","_el$16","_co$2","_$getNextMarker","_ref$","_$use","_ref$2","_$insert","_$createComponent","Provider","value","children","$$click","Show","when","Portal","_el$5","_tmpl$3","_el$6","_el$7","_el$8","_el$9","_el$11","_el$12","_co$","_el$10","_el$13","_ref$3","stopPropagation","title","expandedView","_el$0","_tmpl$2","fallback","_tmpl$6","_tmpl$","_$effect","_p$","_v$","copyLabel","copyToClipboard","_v$2","_$setAttribute","t","undefined","_$runHydrationEvents","_ref$4","_v$3","_v$4","closeExpandedView","_tmpl$4","_v$5","toolbarVariant","_v$6","expand","_$className","_$delegateEvents"],"mappings":"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"}

package/dist/components/FeedbackInline.cjs

@@ -2,9 +2,11 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const web = require("solid-js/web");
 const solidJs = require("solid-js");
-var _tmpl$ = /* @__PURE__ */ web.template(`<button type=button class="p-1 rounded hover:bg-green-500/10 text-deposium-slate-500 hover:text-green-500 transition-colors"title=Utile aria-label="Mark response as useful"data-feedback-inline-rating=positive><svg class="w-3.5 h-3.5"fill=none stroke=currentColor viewBox="0 0 24 24"><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M14 9V5a3 3 0 00-3-3l-4 9v11h11.28a2 2 0 002-1.7l1.38-9a2 2 0 00-2-2.3H14z M3 15v7">`), _tmpl$2 = /* @__PURE__ */ web.template(`<button type=button class="p-1 rounded hover:bg-red-500/10 text-deposium-slate-500 hover:text-red-500 transition-colors"title="Pas utile"aria-label="Mark response as not useful"data-feedback-inline-rating=negative><svg class="w-3.5 h-3.5"fill=none stroke=currentColor viewBox="0 0 24 24"><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M10 15v4a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10z M21 4v7">`), _tmpl$3 = /* @__PURE__ */ web.template(`<div>`), _tmpl$4 = /* @__PURE__ */ web.template(`<span class="text-[11px] text-deposium-slate-500">`);
+const MCPUIStringsContext = require("../context/MCPUIStringsContext.cjs");
+var _tmpl$ = /* @__PURE__ */ web.template(`<button type=button class="p-1 rounded hover:bg-green-500/10 text-deposium-slate-500 hover:text-green-500 transition-colors"aria-label="Mark response as useful"data-feedback-inline-rating=positive><svg class="w-3.5 h-3.5"fill=none stroke=currentColor viewBox="0 0 24 24"><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M14 9V5a3 3 0 00-3-3l-4 9v11h11.28a2 2 0 002-1.7l1.38-9a2 2 0 00-2-2.3H14z M3 15v7">`), _tmpl$2 = /* @__PURE__ */ web.template(`<button type=button class="p-1 rounded hover:bg-red-500/10 text-deposium-slate-500 hover:text-red-500 transition-colors"aria-label="Mark response as not useful"data-feedback-inline-rating=negative><svg class="w-3.5 h-3.5"fill=none stroke=currentColor viewBox="0 0 24 24"><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M10 15v4a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10z M21 4v7">`), _tmpl$3 = /* @__PURE__ */ web.template(`<div>`), _tmpl$4 = /* @__PURE__ */ web.template(`<span class="text-[11px] text-deposium-slate-500">`);
 const FeedbackInline = (props) => {
   const [rating, setRating] = solidJs.createSignal(null);
+  const strings = MCPUIStringsContext.useMCPUIStrings();
   const handle = (value) => {
     if (rating() !== null) return;
     setRating(value);
@@ -29,7 +31,7 @@ const FeedbackInline = (props) => {
           var _el$4 = web.getNextElement(_tmpl$4);
           web.insert(_el$4, (() => {
             var _c$ = web.memo(() => rating() === "positive");
-            return () => _c$() ? props.positiveAck ?? "Merci !" : props.negativeAck ?? "Noté, on s'améliore";
+            return () => _c$() ? props.positiveAck ?? strings.feedbackPositiveAck : props.negativeAck ?? strings.feedbackNegativeAck;
           })());
           return _el$4;
         })();
@@ -38,11 +40,13 @@ const FeedbackInline = (props) => {
         return [(() => {
           var _el$2 = web.getNextElement(_tmpl$);
           _el$2.$$click = () => handle("positive");
+          web.effect(() => web.setAttribute(_el$2, "title", strings.feedbackUseful));
           web.runHydrationEvents();
           return _el$2;
         })(), (() => {
           var _el$3 = web.getNextElement(_tmpl$2);
           _el$3.$$click = () => handle("negative");
+          web.effect(() => web.setAttribute(_el$3, "title", strings.feedbackNotUseful));
           web.runHydrationEvents();
           return _el$3;
         })()];

package/dist/components/FeedbackInline.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FeedbackInline.cjs","sources":["../../src/components/FeedbackInline.tsx"],"sourcesContent":["/**\n * FeedbackInline — per-message inline feedback (thumbs up/down)\n *\n * @experimental\n * @since v5.2.0\n *\n * A small, non-blocking per-message feedback primitive. Sits next to an\n * assistant message, captures a rating, calls back to the consumer for\n * persistence. Best-effort by design — no retry UX, no revision UX.\n *\n * ## When to use vs other feedback primitives\n *\n * - **`FeedbackInline`** (this) → per-message thumb-up/down, non-blocking,\n *   many can coexist.\n * - **`ChatPrompt` (type=choice)** → modal, one-at-a-time above the input,\n *   used when the agent needs a blocking answer.\n * - **`ScratchpadPanel` feedback section** → structured feedback bound to a\n *   scratchpad turn, panel-side.\n *\n * ## Persistence is the consumer's job\n *\n * The component flips to \"submitted\" state *optimistically* on click and\n * calls `onSubmit(rating, context)`. Network failures do not revert the UI —\n * feedback is best-effort. If you need stricter semantics (offline retry,\n * revision, ...) wrap this in your own component.\n *\n * @example\n * ```tsx\n * <FeedbackInline\n *   messageHash={msg.hash}\n *   context={{ intent: msg.intent, confidenceBand: msg.band }}\n *   onSubmit={(rating, ctx) =>\n *     fetch('/api/feedback', {\n *       method: 'POST',\n *       headers: { 'Content-Type': 'application/json' },\n *       body: JSON.stringify({ message_hash: msg.hash, rating, ...ctx }),\n *     })\n *   }\n * />\n * ```\n */\n\nimport { Component, Show, createSignal } from 'solid-js'\n\nexport interface FeedbackInlineContext {\n  intent?: string\n  confidenceBand?: string\n  tags?: string[]\n  [key: string]: unknown\n}\n\nexport interface FeedbackInlineProps {\n  /** Stable identifier for the message being rated. */\n  messageHash?: string\n  /**\n   * Called on click. Consumer is responsible for persistence (HTTP, store,\n   * localStorage). Return value ignored.\n   */\n  onSubmit: (rating: 'positive' | 'negative', context?: FeedbackInlineContext) => void | Promise<void>\n  /** Extra context forwarded to `onSubmit`. */\n  context?: FeedbackInlineContext\n  /** Ack text shown after positive rating. Default: 'Merci !' */\n  positiveAck?: string\n  /** Ack text shown after negative rating. Default: \"Noté, on s'améliore\" */\n  negativeAck?: string\n  /** Extra Tailwind classes on the container. */\n  class?: string\n}\n\n/**\n * @experimental\n * Per-message inline feedback (thumbs up/down). Non-blocking.\n */\nexport const FeedbackInline: Component<FeedbackInlineProps> = (props) => {\n  const [rating, setRating] = createSignal<'positive' | 'negative' | null>(null)\n\n  const handle = (value: 'positive' | 'negative') => {\n    if (rating() !== null) return // already submitted, final state\n    setRating(value)\n    try {\n      // Fire-and-forget. If the consumer returns a Promise that rejects,\n      // swallow it — feedback is best-effort by design.\n      const result = props.onSubmit(value, props.context)\n      if (result && typeof (result as Promise<void>).catch === 'function') {\n        ;(result as Promise<void>).catch(() => {\n          /* non-blocking */\n        })\n      }\n    } catch {\n      /* non-blocking */\n    }\n  }\n\n  return (\n    <div class={`flex items-center gap-1 ${props.class ?? ''}`.trim()}>\n      <Show\n        when={rating() === null}\n        fallback={\n          <span class=\"text-[11px] text-deposium-slate-500\">\n            {rating() === 'positive'\n              ? (props.positiveAck ?? 'Merci !')\n              : (props.negativeAck ?? \"Noté, on s'améliore\")}\n          </span>\n        }\n      >\n        <button\n          type=\"button\"\n          onClick={() => handle('positive')}\n          class=\"p-1 rounded hover:bg-green-500/10 text-deposium-slate-500 hover:text-green-500 transition-colors\"\n          title=\"Utile\"\n          aria-label=\"Mark response as useful\"\n          data-feedback-inline-rating=\"positive\"\n        >\n          <svg class=\"w-3.5 h-3.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke-width=\"2\"\n              d=\"M14 9V5a3 3 0 00-3-3l-4 9v11h11.28a2 2 0 002-1.7l1.38-9a2 2 0 00-2-2.3H14z M3 15v7\"\n            />\n          </svg>\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => handle('negative')}\n          class=\"p-1 rounded hover:bg-red-500/10 text-deposium-slate-500 hover:text-red-500 transition-colors\"\n          title=\"Pas utile\"\n          aria-label=\"Mark response as not useful\"\n          data-feedback-inline-rating=\"negative\"\n        >\n          <svg class=\"w-3.5 h-3.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke-width=\"2\"\n              d=\"M10 15v4a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10z M21 4v7\"\n            />\n          </svg>\n        </button>\n      </Show>\n    </div>\n  )\n}\n"],"names":["FeedbackInline","props","rating","setRating","createSignal","handle","value","result","onSubmit","context","catch","_el$","_$getNextElement","_tmpl$3","_$insert","_$createComponent","Show","when","fallback","_el$4","_tmpl$4","_c$","_$memo","positiveAck","negativeAck","children","_el$2","_tmpl$","$$click","_$runHydrationEvents","_el$3","_tmpl$2","_$effect","_$className","class","trim","_$delegateEvents"],"mappings":";;;;;AAyEO,MAAMA,iBAAkDC,CAAAA,UAAU;AACvE,QAAM,CAACC,QAAQC,SAAS,IAAIC,QAAAA,aAA6C,IAAI;AAE7E,QAAMC,SAASA,CAACC,UAAmC;AACjD,QAAIJ,OAAAA,MAAa,KAAM;AACvBC,cAAUG,KAAK;AACf,QAAI;AAGF,YAAMC,SAASN,MAAMO,SAASF,OAAOL,MAAMQ,OAAO;AAClD,UAAIF,UAAU,OAAQA,OAAyBG,UAAU,YAAY;AACnE;AAAEH,eAAyBG,MAAM,MAAM;AAAA,QACrC,CACD;AAAA,MACH;AAAA,IACF,QAAQ;AAAA,IACN;AAAA,EAEJ;AAEA,UAAA,MAAA;AAAA,QAAAC,OAAAC,IAAAA,eAAAC,OAAA;AAAAC,eAAAH,MAAAI,IAAAA,gBAEKC,cAAI;AAAA,MAAA,IACHC,OAAI;AAAA,eAAEf,aAAa;AAAA,MAAI;AAAA,MAAA,IACvBgB,WAAQ;AAAA,gBAAA,MAAA;AAAA,cAAAC,QAAAP,IAAAA,eAAAQ,OAAA;AAAAN,cAAAA,OAAAK,QAAA,MAAA;AAAA,gBAAAE,MAAAC,IAAAA,KAAA,MAEHpB,OAAAA,MAAa,UAAU;AAAA,mBAAA,MAAvBmB,IAAAA,IACIpB,MAAMsB,eAAe,YACrBtB,MAAMuB,eAAe;AAAA,UAAsB,IAAA;AAAA,iBAAAL;AAAAA,QAAA,GAAA;AAAA,MAAA;AAAA,MAAA,IAAAM,WAAA;AAAA,eAAA,EAAA,MAAA;AAAA,cAAAC,QAAAd,IAAAA,eAAAe,MAAA;AAAAD,gBAAAE,UAMzC,MAAMvB,OAAO,UAAU;AAACwB,iCAAAA;AAAA,iBAAAH;AAAAA,QAAA,GAAA,IAAA,MAAA;AAAA,cAAAI,QAAAlB,IAAAA,eAAAmB,OAAA;AAAAD,gBAAAF,UAiBxB,MAAMvB,OAAO,UAAU;AAACwB,iCAAAA;AAAA,iBAAAC;AAAAA,QAAA,IAAA;AAAA,MAAA;AAAA,IAAA,CAAA,CAAA;AAAAE,QAAAA,OAAA,MAAAC,IAAAA,UAAAtB,MA9B3B,2BAA2BV,MAAMiC,SAAS,EAAE,GAAGC,KAAAA,CAAM,CAAA;AAAA,WAAAxB;AAAAA,EAAA,GAAA;AAgDrE;AAACyB,IAAAA,eAAA,CAAA,OAAA,CAAA;;"}
+{"version":3,"file":"FeedbackInline.cjs","sources":["../../src/components/FeedbackInline.tsx"],"sourcesContent":["/**\n * FeedbackInline — per-message inline feedback (thumbs up/down)\n *\n * @experimental\n * @since v5.2.0\n *\n * A small, non-blocking per-message feedback primitive. Sits next to an\n * assistant message, captures a rating, calls back to the consumer for\n * persistence. Best-effort by design — no retry UX, no revision UX.\n *\n * ## When to use vs other feedback primitives\n *\n * - **`FeedbackInline`** (this) → per-message thumb-up/down, non-blocking,\n *   many can coexist.\n * - **`ChatPrompt` (type=choice)** → modal, one-at-a-time above the input,\n *   used when the agent needs a blocking answer.\n * - **`ScratchpadPanel` feedback section** → structured feedback bound to a\n *   scratchpad turn, panel-side.\n *\n * ## Persistence is the consumer's job\n *\n * The component flips to \"submitted\" state *optimistically* on click and\n * calls `onSubmit(rating, context)`. Network failures do not revert the UI —\n * feedback is best-effort. If you need stricter semantics (offline retry,\n * revision, ...) wrap this in your own component.\n *\n * @example\n * ```tsx\n * <FeedbackInline\n *   messageHash={msg.hash}\n *   context={{ intent: msg.intent, confidenceBand: msg.band }}\n *   onSubmit={(rating, ctx) =>\n *     fetch('/api/feedback', {\n *       method: 'POST',\n *       headers: { 'Content-Type': 'application/json' },\n *       body: JSON.stringify({ message_hash: msg.hash, rating, ...ctx }),\n *     })\n *   }\n * />\n * ```\n */\n\nimport { Component, Show, createSignal } from 'solid-js'\nimport { useMCPUIStrings } from '../context/MCPUIStringsContext'\n\nexport interface FeedbackInlineContext {\n  intent?: string\n  confidenceBand?: string\n  tags?: string[]\n  [key: string]: unknown\n}\n\nexport interface FeedbackInlineProps {\n  /** Stable identifier for the message being rated. */\n  messageHash?: string\n  /**\n   * Called on click. Consumer is responsible for persistence (HTTP, store,\n   * localStorage). Return value ignored.\n   */\n  onSubmit: (rating: 'positive' | 'negative', context?: FeedbackInlineContext) => void | Promise<void>\n  /** Extra context forwarded to `onSubmit`. */\n  context?: FeedbackInlineContext\n  /** Ack text shown after positive rating. Defaults to `MCPUIStrings.feedbackPositiveAck` ('Thanks!' in EN). */\n  positiveAck?: string\n  /** Ack text shown after negative rating. Defaults to `MCPUIStrings.feedbackNegativeAck`. */\n  negativeAck?: string\n  /** Extra Tailwind classes on the container. */\n  class?: string\n}\n\n/**\n * @experimental\n * Per-message inline feedback (thumbs up/down). Non-blocking.\n */\nexport const FeedbackInline: Component<FeedbackInlineProps> = (props) => {\n  const [rating, setRating] = createSignal<'positive' | 'negative' | null>(null)\n  const strings = useMCPUIStrings()\n\n  const handle = (value: 'positive' | 'negative') => {\n    if (rating() !== null) return // already submitted, final state\n    setRating(value)\n    try {\n      // Fire-and-forget. If the consumer returns a Promise that rejects,\n      // swallow it — feedback is best-effort by design.\n      const result = props.onSubmit(value, props.context)\n      if (result && typeof (result as Promise<void>).catch === 'function') {\n        ;(result as Promise<void>).catch(() => {\n          /* non-blocking */\n        })\n      }\n    } catch {\n      /* non-blocking */\n    }\n  }\n\n  return (\n    <div class={`flex items-center gap-1 ${props.class ?? ''}`.trim()}>\n      <Show\n        when={rating() === null}\n        fallback={\n          <span class=\"text-[11px] text-deposium-slate-500\">\n            {rating() === 'positive'\n              ? (props.positiveAck ?? strings.feedbackPositiveAck)\n              : (props.negativeAck ?? strings.feedbackNegativeAck)}\n          </span>\n        }\n      >\n        <button\n          type=\"button\"\n          onClick={() => handle('positive')}\n          class=\"p-1 rounded hover:bg-green-500/10 text-deposium-slate-500 hover:text-green-500 transition-colors\"\n          title={strings.feedbackUseful}\n          aria-label=\"Mark response as useful\"\n          data-feedback-inline-rating=\"positive\"\n        >\n          <svg class=\"w-3.5 h-3.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke-width=\"2\"\n              d=\"M14 9V5a3 3 0 00-3-3l-4 9v11h11.28a2 2 0 002-1.7l1.38-9a2 2 0 00-2-2.3H14z M3 15v7\"\n            />\n          </svg>\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => handle('negative')}\n          class=\"p-1 rounded hover:bg-red-500/10 text-deposium-slate-500 hover:text-red-500 transition-colors\"\n          title={strings.feedbackNotUseful}\n          aria-label=\"Mark response as not useful\"\n          data-feedback-inline-rating=\"negative\"\n        >\n          <svg class=\"w-3.5 h-3.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke-width=\"2\"\n              d=\"M10 15v4a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10z M21 4v7\"\n            />\n          </svg>\n        </button>\n      </Show>\n    </div>\n  )\n}\n"],"names":["FeedbackInline","props","rating","setRating","createSignal","strings","useMCPUIStrings","handle","value","result","onSubmit","context","catch","_el$","_$getNextElement","_tmpl$3","_$insert","_$createComponent","Show","when","fallback","_el$4","_tmpl$4","_c$","_$memo","positiveAck","feedbackPositiveAck","negativeAck","feedbackNegativeAck","children","_el$2","_tmpl$","$$click","_$effect","_$setAttribute","feedbackUseful","_$runHydrationEvents","_el$3","_tmpl$2","feedbackNotUseful","_$className","class","trim","_$delegateEvents"],"mappings":";;;;;;AA0EO,MAAMA,iBAAkDC,CAAAA,UAAU;AACvE,QAAM,CAACC,QAAQC,SAAS,IAAIC,QAAAA,aAA6C,IAAI;AAC7E,QAAMC,UAAUC,oBAAAA,gBAAAA;AAEhB,QAAMC,SAASA,CAACC,UAAmC;AACjD,QAAIN,OAAAA,MAAa,KAAM;AACvBC,cAAUK,KAAK;AACf,QAAI;AAGF,YAAMC,SAASR,MAAMS,SAASF,OAAOP,MAAMU,OAAO;AAClD,UAAIF,UAAU,OAAQA,OAAyBG,UAAU,YAAY;AACnE;AAAEH,eAAyBG,MAAM,MAAM;AAAA,QACrC,CACD;AAAA,MACH;AAAA,IACF,QAAQ;AAAA,IACN;AAAA,EAEJ;AAEA,UAAA,MAAA;AAAA,QAAAC,OAAAC,IAAAA,eAAAC,OAAA;AAAAC,eAAAH,MAAAI,IAAAA,gBAEKC,cAAI;AAAA,MAAA,IACHC,OAAI;AAAA,eAAEjB,aAAa;AAAA,MAAI;AAAA,MAAA,IACvBkB,WAAQ;AAAA,gBAAA,MAAA;AAAA,cAAAC,QAAAP,IAAAA,eAAAQ,OAAA;AAAAN,cAAAA,OAAAK,QAAA,MAAA;AAAA,gBAAAE,MAAAC,IAAAA,KAAA,MAEHtB,OAAAA,MAAa,UAAU;AAAA,mBAAA,MAAvBqB,QACItB,MAAMwB,eAAepB,QAAQqB,sBAC7BzB,MAAM0B,eAAetB,QAAQuB;AAAAA,UAAoB,IAAA;AAAA,iBAAAP;AAAAA,QAAA,GAAA;AAAA,MAAA;AAAA,MAAA,IAAAQ,WAAA;AAAA,eAAA,EAAA,MAAA;AAAA,cAAAC,QAAAhB,IAAAA,eAAAiB,MAAA;AAAAD,gBAAAE,UAM/C,MAAMzB,OAAO,UAAU;AAAC0B,cAAAA,aAAAC,IAAAA,aAAAJ,OAAA,SAE1BzB,QAAQ8B,cAAc,CAAA;AAAAC,iCAAAA;AAAA,iBAAAN;AAAAA,QAAA,GAAA,IAAA,MAAA;AAAA,cAAAO,QAAAvB,IAAAA,eAAAwB,OAAA;AAAAD,gBAAAL,UAepB,MAAMzB,OAAO,UAAU;AAAC0B,cAAAA,aAAAC,IAAAA,aAAAG,OAAA,SAE1BhC,QAAQkC,iBAAiB,CAAA;AAAAH,iCAAAA;AAAA,iBAAAC;AAAAA,QAAA,IAAA;AAAA,MAAA;AAAA,IAAA,CAAA,CAAA;AAAAJ,QAAAA,OAAA,MAAAO,IAAAA,UAAA3B,MAhC1B,2BAA2BZ,MAAMwC,SAAS,EAAE,GAAGC,KAAAA,CAAM,CAAA;AAAA,WAAA7B;AAAAA,EAAA,GAAA;AAgDrE;AAAC8B,IAAAA,eAAA,CAAA,OAAA,CAAA;;"}

package/dist/components/FeedbackInline.d.ts

@@ -56,9 +56,9 @@ export interface FeedbackInlineProps {
     onSubmit: (rating: 'positive' | 'negative', context?: FeedbackInlineContext) => void | Promise<void>;
     /** Extra context forwarded to `onSubmit`. */
     context?: FeedbackInlineContext;
-    /** Ack text shown after positive rating. Default: 'Merci !' */
+    /** Ack text shown after positive rating. Defaults to `MCPUIStrings.feedbackPositiveAck` ('Thanks!' in EN). */
     positiveAck?: string;
-    /** Ack text shown after negative rating. Default: "Noté, on s'améliore" */
+    /** Ack text shown after negative rating. Defaults to `MCPUIStrings.feedbackNegativeAck`. */
     negativeAck?: string;
     /** Extra Tailwind classes on the container. */
     class?: string;

package/dist/components/FeedbackInline.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FeedbackInline.d.ts","sourceRoot":"","sources":["../../src/components/FeedbackInline.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AAEH,OAAO,EAAE,SAAS,EAAsB,MAAM,UAAU,CAAA;AAExD,MAAM,WAAW,qBAAqB;IACpC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAA;IACf,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CACvB;AAED,MAAM,WAAW,mBAAmB;IAClC,qDAAqD;IACrD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,MAAM,EAAE,UAAU,GAAG,UAAU,EAAE,OAAO,CAAC,EAAE,qBAAqB,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IACpG,6CAA6C;IAC7C,OAAO,CAAC,EAAE,qBAAqB,CAAA;IAC/B,+DAA+D;IAC/D,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED;;;GAGG;AACH,eAAO,MAAM,cAAc,EAAE,SAAS,CAAC,mBAAmB,CAqEzD,CAAA"}
+{"version":3,"file":"FeedbackInline.d.ts","sourceRoot":"","sources":["../../src/components/FeedbackInline.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AAEH,OAAO,EAAE,SAAS,EAAsB,MAAM,UAAU,CAAA;AAGxD,MAAM,WAAW,qBAAqB;IACpC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAA;IACf,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CACvB;AAED,MAAM,WAAW,mBAAmB;IAClC,qDAAqD;IACrD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,MAAM,EAAE,UAAU,GAAG,UAAU,EAAE,OAAO,CAAC,EAAE,qBAAqB,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;IACpG,6CAA6C;IAC7C,OAAO,CAAC,EAAE,qBAAqB,CAAA;IAC/B,8GAA8G;IAC9G,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,4FAA4F;IAC5F,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED;;;GAGG;AACH,eAAO,MAAM,cAAc,EAAE,SAAS,CAAC,mBAAmB,CAsEzD,CAAA"}

package/dist/components/FeedbackInline.js

@@ -1,8 +1,10 @@
-import { delegateEvents, getNextElement, template, insert, createComponent, runHydrationEvents, memo, effect, className } from "solid-js/web";
+import { delegateEvents, getNextElement, template, insert, createComponent, effect, setAttribute, runHydrationEvents, memo, className } from "solid-js/web";
 import { createSignal, Show } from "solid-js";
-var _tmpl$ = /* @__PURE__ */ template(`<button type=button class="p-1 rounded hover:bg-green-500/10 text-deposium-slate-500 hover:text-green-500 transition-colors"title=Utile aria-label="Mark response as useful"data-feedback-inline-rating=positive><svg class="w-3.5 h-3.5"fill=none stroke=currentColor viewBox="0 0 24 24"><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M14 9V5a3 3 0 00-3-3l-4 9v11h11.28a2 2 0 002-1.7l1.38-9a2 2 0 00-2-2.3H14z M3 15v7">`), _tmpl$2 = /* @__PURE__ */ template(`<button type=button class="p-1 rounded hover:bg-red-500/10 text-deposium-slate-500 hover:text-red-500 transition-colors"title="Pas utile"aria-label="Mark response as not useful"data-feedback-inline-rating=negative><svg class="w-3.5 h-3.5"fill=none stroke=currentColor viewBox="0 0 24 24"><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M10 15v4a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10z M21 4v7">`), _tmpl$3 = /* @__PURE__ */ template(`<div>`), _tmpl$4 = /* @__PURE__ */ template(`<span class="text-[11px] text-deposium-slate-500">`);
+import { useMCPUIStrings } from "../context/MCPUIStringsContext.js";
+var _tmpl$ = /* @__PURE__ */ template(`<button type=button class="p-1 rounded hover:bg-green-500/10 text-deposium-slate-500 hover:text-green-500 transition-colors"aria-label="Mark response as useful"data-feedback-inline-rating=positive><svg class="w-3.5 h-3.5"fill=none stroke=currentColor viewBox="0 0 24 24"><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M14 9V5a3 3 0 00-3-3l-4 9v11h11.28a2 2 0 002-1.7l1.38-9a2 2 0 00-2-2.3H14z M3 15v7">`), _tmpl$2 = /* @__PURE__ */ template(`<button type=button class="p-1 rounded hover:bg-red-500/10 text-deposium-slate-500 hover:text-red-500 transition-colors"aria-label="Mark response as not useful"data-feedback-inline-rating=negative><svg class="w-3.5 h-3.5"fill=none stroke=currentColor viewBox="0 0 24 24"><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M10 15v4a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10z M21 4v7">`), _tmpl$3 = /* @__PURE__ */ template(`<div>`), _tmpl$4 = /* @__PURE__ */ template(`<span class="text-[11px] text-deposium-slate-500">`);
 const FeedbackInline = (props) => {
   const [rating, setRating] = createSignal(null);
+  const strings = useMCPUIStrings();
   const handle = (value) => {
     if (rating() !== null) return;
     setRating(value);
@@ -27,7 +29,7 @@ const FeedbackInline = (props) => {
           var _el$4 = getNextElement(_tmpl$4);
           insert(_el$4, (() => {
             var _c$ = memo(() => rating() === "positive");
-            return () => _c$() ? props.positiveAck ?? "Merci !" : props.negativeAck ?? "Noté, on s'améliore";
+            return () => _c$() ? props.positiveAck ?? strings.feedbackPositiveAck : props.negativeAck ?? strings.feedbackNegativeAck;
           })());
           return _el$4;
         })();
@@ -36,11 +38,13 @@ const FeedbackInline = (props) => {
         return [(() => {
           var _el$2 = getNextElement(_tmpl$);
           _el$2.$$click = () => handle("positive");
+          effect(() => setAttribute(_el$2, "title", strings.feedbackUseful));
           runHydrationEvents();
           return _el$2;
         })(), (() => {
           var _el$3 = getNextElement(_tmpl$2);
           _el$3.$$click = () => handle("negative");
+          effect(() => setAttribute(_el$3, "title", strings.feedbackNotUseful));
           runHydrationEvents();
           return _el$3;
         })()];

package/dist/components/FeedbackInline.js.map

@@ -1 +1 @@
-{"version":3,"file":"FeedbackInline.js","sources":["../../src/components/FeedbackInline.tsx"],"sourcesContent":["/**\n * FeedbackInline — per-message inline feedback (thumbs up/down)\n *\n * @experimental\n * @since v5.2.0\n *\n * A small, non-blocking per-message feedback primitive. Sits next to an\n * assistant message, captures a rating, calls back to the consumer for\n * persistence. Best-effort by design — no retry UX, no revision UX.\n *\n * ## When to use vs other feedback primitives\n *\n * - **`FeedbackInline`** (this) → per-message thumb-up/down, non-blocking,\n *   many can coexist.\n * - **`ChatPrompt` (type=choice)** → modal, one-at-a-time above the input,\n *   used when the agent needs a blocking answer.\n * - **`ScratchpadPanel` feedback section** → structured feedback bound to a\n *   scratchpad turn, panel-side.\n *\n * ## Persistence is the consumer's job\n *\n * The component flips to \"submitted\" state *optimistically* on click and\n * calls `onSubmit(rating, context)`. Network failures do not revert the UI —\n * feedback is best-effort. If you need stricter semantics (offline retry,\n * revision, ...) wrap this in your own component.\n *\n * @example\n * ```tsx\n * <FeedbackInline\n *   messageHash={msg.hash}\n *   context={{ intent: msg.intent, confidenceBand: msg.band }}\n *   onSubmit={(rating, ctx) =>\n *     fetch('/api/feedback', {\n *       method: 'POST',\n *       headers: { 'Content-Type': 'application/json' },\n *       body: JSON.stringify({ message_hash: msg.hash, rating, ...ctx }),\n *     })\n *   }\n * />\n * ```\n */\n\nimport { Component, Show, createSignal } from 'solid-js'\n\nexport interface FeedbackInlineContext {\n  intent?: string\n  confidenceBand?: string\n  tags?: string[]\n  [key: string]: unknown\n}\n\nexport interface FeedbackInlineProps {\n  /** Stable identifier for the message being rated. */\n  messageHash?: string\n  /**\n   * Called on click. Consumer is responsible for persistence (HTTP, store,\n   * localStorage). Return value ignored.\n   */\n  onSubmit: (rating: 'positive' | 'negative', context?: FeedbackInlineContext) => void | Promise<void>\n  /** Extra context forwarded to `onSubmit`. */\n  context?: FeedbackInlineContext\n  /** Ack text shown after positive rating. Default: 'Merci !' */\n  positiveAck?: string\n  /** Ack text shown after negative rating. Default: \"Noté, on s'améliore\" */\n  negativeAck?: string\n  /** Extra Tailwind classes on the container. */\n  class?: string\n}\n\n/**\n * @experimental\n * Per-message inline feedback (thumbs up/down). Non-blocking.\n */\nexport const FeedbackInline: Component<FeedbackInlineProps> = (props) => {\n  const [rating, setRating] = createSignal<'positive' | 'negative' | null>(null)\n\n  const handle = (value: 'positive' | 'negative') => {\n    if (rating() !== null) return // already submitted, final state\n    setRating(value)\n    try {\n      // Fire-and-forget. If the consumer returns a Promise that rejects,\n      // swallow it — feedback is best-effort by design.\n      const result = props.onSubmit(value, props.context)\n      if (result && typeof (result as Promise<void>).catch === 'function') {\n        ;(result as Promise<void>).catch(() => {\n          /* non-blocking */\n        })\n      }\n    } catch {\n      /* non-blocking */\n    }\n  }\n\n  return (\n    <div class={`flex items-center gap-1 ${props.class ?? ''}`.trim()}>\n      <Show\n        when={rating() === null}\n        fallback={\n          <span class=\"text-[11px] text-deposium-slate-500\">\n            {rating() === 'positive'\n              ? (props.positiveAck ?? 'Merci !')\n              : (props.negativeAck ?? \"Noté, on s'améliore\")}\n          </span>\n        }\n      >\n        <button\n          type=\"button\"\n          onClick={() => handle('positive')}\n          class=\"p-1 rounded hover:bg-green-500/10 text-deposium-slate-500 hover:text-green-500 transition-colors\"\n          title=\"Utile\"\n          aria-label=\"Mark response as useful\"\n          data-feedback-inline-rating=\"positive\"\n        >\n          <svg class=\"w-3.5 h-3.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke-width=\"2\"\n              d=\"M14 9V5a3 3 0 00-3-3l-4 9v11h11.28a2 2 0 002-1.7l1.38-9a2 2 0 00-2-2.3H14z M3 15v7\"\n            />\n          </svg>\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => handle('negative')}\n          class=\"p-1 rounded hover:bg-red-500/10 text-deposium-slate-500 hover:text-red-500 transition-colors\"\n          title=\"Pas utile\"\n          aria-label=\"Mark response as not useful\"\n          data-feedback-inline-rating=\"negative\"\n        >\n          <svg class=\"w-3.5 h-3.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke-width=\"2\"\n              d=\"M10 15v4a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10z M21 4v7\"\n            />\n          </svg>\n        </button>\n      </Show>\n    </div>\n  )\n}\n"],"names":["FeedbackInline","props","rating","setRating","createSignal","handle","value","result","onSubmit","context","catch","_el$","_$getNextElement","_tmpl$3","_$insert","_$createComponent","Show","when","fallback","_el$4","_tmpl$4","_c$","_$memo","positiveAck","negativeAck","children","_el$2","_tmpl$","$$click","_$runHydrationEvents","_el$3","_tmpl$2","_$effect","_$className","class","trim","_$delegateEvents"],"mappings":";;;AAyEO,MAAMA,iBAAkDC,CAAAA,UAAU;AACvE,QAAM,CAACC,QAAQC,SAAS,IAAIC,aAA6C,IAAI;AAE7E,QAAMC,SAASA,CAACC,UAAmC;AACjD,QAAIJ,OAAAA,MAAa,KAAM;AACvBC,cAAUG,KAAK;AACf,QAAI;AAGF,YAAMC,SAASN,MAAMO,SAASF,OAAOL,MAAMQ,OAAO;AAClD,UAAIF,UAAU,OAAQA,OAAyBG,UAAU,YAAY;AACnE;AAAEH,eAAyBG,MAAM,MAAM;AAAA,QACrC,CACD;AAAA,MACH;AAAA,IACF,QAAQ;AAAA,IACN;AAAA,EAEJ;AAEA,UAAA,MAAA;AAAA,QAAAC,OAAAC,eAAAC,OAAA;AAAAC,WAAAH,MAAAI,gBAEKC,MAAI;AAAA,MAAA,IACHC,OAAI;AAAA,eAAEf,aAAa;AAAA,MAAI;AAAA,MAAA,IACvBgB,WAAQ;AAAA,gBAAA,MAAA;AAAA,cAAAC,QAAAP,eAAAQ,OAAA;AAAAN,iBAAAK,QAAA,MAAA;AAAA,gBAAAE,MAAAC,KAAA,MAEHpB,OAAAA,MAAa,UAAU;AAAA,mBAAA,MAAvBmB,IAAAA,IACIpB,MAAMsB,eAAe,YACrBtB,MAAMuB,eAAe;AAAA,UAAsB,IAAA;AAAA,iBAAAL;AAAAA,QAAA,GAAA;AAAA,MAAA;AAAA,MAAA,IAAAM,WAAA;AAAA,eAAA,EAAA,MAAA;AAAA,cAAAC,QAAAd,eAAAe,MAAA;AAAAD,gBAAAE,UAMzC,MAAMvB,OAAO,UAAU;AAACwB,6BAAAA;AAAA,iBAAAH;AAAAA,QAAA,GAAA,IAAA,MAAA;AAAA,cAAAI,QAAAlB,eAAAmB,OAAA;AAAAD,gBAAAF,UAiBxB,MAAMvB,OAAO,UAAU;AAACwB,6BAAAA;AAAA,iBAAAC;AAAAA,QAAA,IAAA;AAAA,MAAA;AAAA,IAAA,CAAA,CAAA;AAAAE,WAAA,MAAAC,UAAAtB,MA9B3B,2BAA2BV,MAAMiC,SAAS,EAAE,GAAGC,KAAAA,CAAM,CAAA;AAAA,WAAAxB;AAAAA,EAAA,GAAA;AAgDrE;AAACyB,eAAA,CAAA,OAAA,CAAA;"}
+{"version":3,"file":"FeedbackInline.js","sources":["../../src/components/FeedbackInline.tsx"],"sourcesContent":["/**\n * FeedbackInline — per-message inline feedback (thumbs up/down)\n *\n * @experimental\n * @since v5.2.0\n *\n * A small, non-blocking per-message feedback primitive. Sits next to an\n * assistant message, captures a rating, calls back to the consumer for\n * persistence. Best-effort by design — no retry UX, no revision UX.\n *\n * ## When to use vs other feedback primitives\n *\n * - **`FeedbackInline`** (this) → per-message thumb-up/down, non-blocking,\n *   many can coexist.\n * - **`ChatPrompt` (type=choice)** → modal, one-at-a-time above the input,\n *   used when the agent needs a blocking answer.\n * - **`ScratchpadPanel` feedback section** → structured feedback bound to a\n *   scratchpad turn, panel-side.\n *\n * ## Persistence is the consumer's job\n *\n * The component flips to \"submitted\" state *optimistically* on click and\n * calls `onSubmit(rating, context)`. Network failures do not revert the UI —\n * feedback is best-effort. If you need stricter semantics (offline retry,\n * revision, ...) wrap this in your own component.\n *\n * @example\n * ```tsx\n * <FeedbackInline\n *   messageHash={msg.hash}\n *   context={{ intent: msg.intent, confidenceBand: msg.band }}\n *   onSubmit={(rating, ctx) =>\n *     fetch('/api/feedback', {\n *       method: 'POST',\n *       headers: { 'Content-Type': 'application/json' },\n *       body: JSON.stringify({ message_hash: msg.hash, rating, ...ctx }),\n *     })\n *   }\n * />\n * ```\n */\n\nimport { Component, Show, createSignal } from 'solid-js'\nimport { useMCPUIStrings } from '../context/MCPUIStringsContext'\n\nexport interface FeedbackInlineContext {\n  intent?: string\n  confidenceBand?: string\n  tags?: string[]\n  [key: string]: unknown\n}\n\nexport interface FeedbackInlineProps {\n  /** Stable identifier for the message being rated. */\n  messageHash?: string\n  /**\n   * Called on click. Consumer is responsible for persistence (HTTP, store,\n   * localStorage). Return value ignored.\n   */\n  onSubmit: (rating: 'positive' | 'negative', context?: FeedbackInlineContext) => void | Promise<void>\n  /** Extra context forwarded to `onSubmit`. */\n  context?: FeedbackInlineContext\n  /** Ack text shown after positive rating. Defaults to `MCPUIStrings.feedbackPositiveAck` ('Thanks!' in EN). */\n  positiveAck?: string\n  /** Ack text shown after negative rating. Defaults to `MCPUIStrings.feedbackNegativeAck`. */\n  negativeAck?: string\n  /** Extra Tailwind classes on the container. */\n  class?: string\n}\n\n/**\n * @experimental\n * Per-message inline feedback (thumbs up/down). Non-blocking.\n */\nexport const FeedbackInline: Component<FeedbackInlineProps> = (props) => {\n  const [rating, setRating] = createSignal<'positive' | 'negative' | null>(null)\n  const strings = useMCPUIStrings()\n\n  const handle = (value: 'positive' | 'negative') => {\n    if (rating() !== null) return // already submitted, final state\n    setRating(value)\n    try {\n      // Fire-and-forget. If the consumer returns a Promise that rejects,\n      // swallow it — feedback is best-effort by design.\n      const result = props.onSubmit(value, props.context)\n      if (result && typeof (result as Promise<void>).catch === 'function') {\n        ;(result as Promise<void>).catch(() => {\n          /* non-blocking */\n        })\n      }\n    } catch {\n      /* non-blocking */\n    }\n  }\n\n  return (\n    <div class={`flex items-center gap-1 ${props.class ?? ''}`.trim()}>\n      <Show\n        when={rating() === null}\n        fallback={\n          <span class=\"text-[11px] text-deposium-slate-500\">\n            {rating() === 'positive'\n              ? (props.positiveAck ?? strings.feedbackPositiveAck)\n              : (props.negativeAck ?? strings.feedbackNegativeAck)}\n          </span>\n        }\n      >\n        <button\n          type=\"button\"\n          onClick={() => handle('positive')}\n          class=\"p-1 rounded hover:bg-green-500/10 text-deposium-slate-500 hover:text-green-500 transition-colors\"\n          title={strings.feedbackUseful}\n          aria-label=\"Mark response as useful\"\n          data-feedback-inline-rating=\"positive\"\n        >\n          <svg class=\"w-3.5 h-3.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke-width=\"2\"\n              d=\"M14 9V5a3 3 0 00-3-3l-4 9v11h11.28a2 2 0 002-1.7l1.38-9a2 2 0 00-2-2.3H14z M3 15v7\"\n            />\n          </svg>\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => handle('negative')}\n          class=\"p-1 rounded hover:bg-red-500/10 text-deposium-slate-500 hover:text-red-500 transition-colors\"\n          title={strings.feedbackNotUseful}\n          aria-label=\"Mark response as not useful\"\n          data-feedback-inline-rating=\"negative\"\n        >\n          <svg class=\"w-3.5 h-3.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              stroke-width=\"2\"\n              d=\"M10 15v4a3 3 0 003 3l4-9V2H5.72a2 2 0 00-2 1.7l-1.38 9a2 2 0 002 2.3H10z M21 4v7\"\n            />\n          </svg>\n        </button>\n      </Show>\n    </div>\n  )\n}\n"],"names":["FeedbackInline","props","rating","setRating","createSignal","strings","useMCPUIStrings","handle","value","result","onSubmit","context","catch","_el$","_$getNextElement","_tmpl$3","_$insert","_$createComponent","Show","when","fallback","_el$4","_tmpl$4","_c$","_$memo","positiveAck","feedbackPositiveAck","negativeAck","feedbackNegativeAck","children","_el$2","_tmpl$","$$click","_$effect","_$setAttribute","feedbackUseful","_$runHydrationEvents","_el$3","_tmpl$2","feedbackNotUseful","_$className","class","trim","_$delegateEvents"],"mappings":";;;;AA0EO,MAAMA,iBAAkDC,CAAAA,UAAU;AACvE,QAAM,CAACC,QAAQC,SAAS,IAAIC,aAA6C,IAAI;AAC7E,QAAMC,UAAUC,gBAAAA;AAEhB,QAAMC,SAASA,CAACC,UAAmC;AACjD,QAAIN,OAAAA,MAAa,KAAM;AACvBC,cAAUK,KAAK;AACf,QAAI;AAGF,YAAMC,SAASR,MAAMS,SAASF,OAAOP,MAAMU,OAAO;AAClD,UAAIF,UAAU,OAAQA,OAAyBG,UAAU,YAAY;AACnE;AAAEH,eAAyBG,MAAM,MAAM;AAAA,QACrC,CACD;AAAA,MACH;AAAA,IACF,QAAQ;AAAA,IACN;AAAA,EAEJ;AAEA,UAAA,MAAA;AAAA,QAAAC,OAAAC,eAAAC,OAAA;AAAAC,WAAAH,MAAAI,gBAEKC,MAAI;AAAA,MAAA,IACHC,OAAI;AAAA,eAAEjB,aAAa;AAAA,MAAI;AAAA,MAAA,IACvBkB,WAAQ;AAAA,gBAAA,MAAA;AAAA,cAAAC,QAAAP,eAAAQ,OAAA;AAAAN,iBAAAK,QAAA,MAAA;AAAA,gBAAAE,MAAAC,KAAA,MAEHtB,OAAAA,MAAa,UAAU;AAAA,mBAAA,MAAvBqB,QACItB,MAAMwB,eAAepB,QAAQqB,sBAC7BzB,MAAM0B,eAAetB,QAAQuB;AAAAA,UAAoB,IAAA;AAAA,iBAAAP;AAAAA,QAAA,GAAA;AAAA,MAAA;AAAA,MAAA,IAAAQ,WAAA;AAAA,eAAA,EAAA,MAAA;AAAA,cAAAC,QAAAhB,eAAAiB,MAAA;AAAAD,gBAAAE,UAM/C,MAAMzB,OAAO,UAAU;AAAC0B,uBAAAC,aAAAJ,OAAA,SAE1BzB,QAAQ8B,cAAc,CAAA;AAAAC,6BAAAA;AAAA,iBAAAN;AAAAA,QAAA,GAAA,IAAA,MAAA;AAAA,cAAAO,QAAAvB,eAAAwB,OAAA;AAAAD,gBAAAL,UAepB,MAAMzB,OAAO,UAAU;AAAC0B,uBAAAC,aAAAG,OAAA,SAE1BhC,QAAQkC,iBAAiB,CAAA;AAAAH,6BAAAA;AAAA,iBAAAC;AAAAA,QAAA,IAAA;AAAA,MAAA;AAAA,IAAA,CAAA,CAAA;AAAAJ,WAAA,MAAAO,UAAA3B,MAhC1B,2BAA2BZ,MAAMwC,SAAS,EAAE,GAAGC,KAAAA,CAAM,CAAA;AAAA,WAAA7B;AAAAA,EAAA,GAAA;AAgDrE;AAAC8B,eAAA,CAAA,OAAA,CAAA;"}