@mieweb/ui 0.10.0-dev.2 → 0.10.0-dev.21

package/dist/{chunk-JHULS3EC.js → chunk-GBUVIGD5.js}

@@ -32,6 +32,92 @@ function useDirection(elementRef) {
   }, [currentElement]);
   return direction;
 }
+var KEYBOARD_INSET_VAR = "--mieweb-keyboard-inset";
+var VISUAL_VIEWPORT_HEIGHT_VAR = "--mieweb-visual-viewport-height";
+var VISUAL_VIEWPORT_OFFSET_TOP_VAR = "--mieweb-visual-viewport-offset-top";
+var KEYBOARD_OPEN_ATTRIBUTE = "data-keyboard-open";
+var KEYBOARD_SOURCE_ATTRIBUTE = "data-keyboard-source";
+var CLOSED = { keyboardInset: 0, isKeyboardOpen: false };
+function useKeyboardInset(options = {}) {
+  const { enabled = true, source = "visual-viewport" } = options;
+  const [state, setState] = useState(CLOSED);
+  useEffect(() => {
+    if (!enabled || typeof window === "undefined") return;
+    const root = document.documentElement;
+    const publish = (keyboardInset) => {
+      const isKeyboardOpen = keyboardInset > 0;
+      root.style.setProperty(KEYBOARD_INSET_VAR, `${keyboardInset}px`);
+      root.toggleAttribute(KEYBOARD_OPEN_ATTRIBUTE, isKeyboardOpen);
+      setState(
+        (previous) => previous.keyboardInset === keyboardInset ? previous : { keyboardInset, isKeyboardOpen }
+      );
+    };
+    const clear = () => {
+      root.style.removeProperty(KEYBOARD_INSET_VAR);
+      root.style.removeProperty(VISUAL_VIEWPORT_HEIGHT_VAR);
+      root.style.removeProperty(VISUAL_VIEWPORT_OFFSET_TOP_VAR);
+      root.removeAttribute(KEYBOARD_OPEN_ATTRIBUTE);
+      root.removeAttribute(KEYBOARD_SOURCE_ATTRIBUTE);
+      setState(CLOSED);
+    };
+    if (source === "native") {
+      const handleWillShow = (event) => {
+        publish(
+          Math.max(
+            0,
+            Math.round(event.keyboardHeight ?? 0)
+          )
+        );
+      };
+      const handleWillHide = () => publish(0);
+      root.setAttribute(KEYBOARD_SOURCE_ATTRIBUTE, source);
+      publish(0);
+      window.addEventListener("keyboardWillShow", handleWillShow);
+      window.addEventListener("keyboardWillHide", handleWillHide);
+      return () => {
+        window.removeEventListener("keyboardWillShow", handleWillShow);
+        window.removeEventListener("keyboardWillHide", handleWillHide);
+        clear();
+      };
+    }
+    const viewport = window.visualViewport;
+    if (!viewport) return;
+    let frame = 0;
+    const measure = () => {
+      frame = 0;
+      const zoomed = Math.abs(viewport.scale - 1) > 0.01;
+      const keyboardInset = zoomed ? 0 : Math.max(
+        0,
+        Math.round(
+          window.innerHeight - viewport.height - viewport.offsetTop
+        )
+      );
+      root.style.setProperty(
+        VISUAL_VIEWPORT_HEIGHT_VAR,
+        `${zoomed ? window.innerHeight : Math.round(viewport.height)}px`
+      );
+      root.style.setProperty(
+        VISUAL_VIEWPORT_OFFSET_TOP_VAR,
+        `${zoomed ? 0 : Math.round(viewport.offsetTop)}px`
+      );
+      publish(keyboardInset);
+    };
+    const schedule = () => {
+      if (frame === 0) frame = requestAnimationFrame(measure);
+    };
+    root.setAttribute(KEYBOARD_SOURCE_ATTRIBUTE, source);
+    measure();
+    viewport.addEventListener("resize", schedule);
+    viewport.addEventListener("scroll", schedule);
+    return () => {
+      cancelAnimationFrame(frame);
+      viewport.removeEventListener("resize", schedule);
+      viewport.removeEventListener("scroll", schedule);
+      clear();
+    };
+  }, [enabled, source]);
+  return state;
+}
 function useKeyboardShortcut(key, callback, options = {}) {
   const {
     enabled = true,
@@ -125,6 +211,6 @@ function useIsMobileOrTablet() {
   return useMediaQuery("(max-width: 1023px)");
 }
 
-export { RTL_LOCALES, isRtlLocale, useCommandK, useDirection, useIsDesktop, useIsLargeDesktop, useIsMobile, useIsMobileOrTablet, useIsSmallTablet, useIsTablet, useKeyboardShortcut, useMediaQuery };
-//# sourceMappingURL=chunk-JHULS3EC.js.map
-//# sourceMappingURL=chunk-JHULS3EC.js.map
+export { KEYBOARD_INSET_VAR, KEYBOARD_OPEN_ATTRIBUTE, KEYBOARD_SOURCE_ATTRIBUTE, RTL_LOCALES, VISUAL_VIEWPORT_HEIGHT_VAR, VISUAL_VIEWPORT_OFFSET_TOP_VAR, isRtlLocale, useCommandK, useDirection, useIsDesktop, useIsLargeDesktop, useIsMobile, useIsMobileOrTablet, useIsSmallTablet, useIsTablet, useKeyboardInset, useKeyboardShortcut, useMediaQuery };
+//# sourceMappingURL=chunk-GBUVIGD5.js.map
+//# sourceMappingURL=chunk-GBUVIGD5.js.map

package/dist/chunk-GBUVIGD5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/useDirection.ts","../src/hooks/useKeyboardInset.ts","../src/hooks/useKeyboardShortcut.ts","../src/hooks/useMediaQuery.ts"],"names":["useState","useEffect"],"mappings":"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","file":"chunk-GBUVIGD5.js","sourcesContent":["import { useState, useEffect } from 'react';\nimport type { RefObject } from 'react';\n\nexport type Direction = 'ltr' | 'rtl';\n\n/** Locales whose primary script reads right-to-left. */\nexport const RTL_LOCALES = ['ar', 'he', 'fa', 'ur'] as const;\n\n/**\n * Returns true when the given locale (e.g. `ar`, `ar-SA`, `he_IL`) uses a\n * right-to-left script.\n */\nexport function isRtlLocale(locale: string): boolean {\n  const lang = locale.toLowerCase().split(/[-_]/)[0];\n  return (RTL_LOCALES as readonly string[]).includes(lang);\n}\n\nfunction resolveDirection(element?: HTMLElement | null): Direction {\n  if (typeof document === 'undefined') return 'ltr';\n  const target = element ?? document.documentElement;\n  return getComputedStyle(target).direction === 'rtl' ? 'rtl' : 'ltr';\n}\n\n/**\n * Hook returning the effective text direction (`ltr` | `rtl`) inherited from\n * the nearest `dir` attribute — zero setup for consumers who set\n * `<html dir=\"rtl\">`.\n *\n * Use for JS-level direction logic that CSS logical properties can't cover:\n * inverting ArrowLeft/ArrowRight keyboard handling, popover/toast placement,\n * drag math, etc.\n *\n * @param elementRef - Optional ref; when provided, direction is resolved from\n *   that element (respecting any local `dir` override) instead of `<html>`.\n *\n * @example\n * ```tsx\n * const direction = useDirection();\n * const nextKey = direction === 'rtl' ? 'ArrowLeft' : 'ArrowRight';\n * ```\n */\nexport function useDirection(\n  elementRef?: RefObject<HTMLElement | null>\n): Direction {\n  const [direction, setDirection] = useState<Direction>(() =>\n    resolveDirection(elementRef?.current)\n  );\n\n  useEffect(() => {\n    const update = () => setDirection(resolveDirection(elementRef?.current));\n    update();\n    // dir changes are rare; observing the whole tree for just this attribute is cheap.\n    const observer = new MutationObserver(update);\n    observer.observe(document.documentElement, {\n      attributes: true,\n      attributeFilter: ['dir'],\n      subtree: true,\n    });\n    return () => observer.disconnect();\n  }, [elementRef]);\n\n  // Re-sync when a re-render points elementRef.current at a different node:\n  // the MutationObserver only fires on `dir` attribute mutations, so a swapped\n  // ref target with a different inherited direction would otherwise go stale.\n  const currentElement = elementRef?.current ?? null;\n  useEffect(() => {\n    setDirection(resolveDirection(currentElement));\n  }, [currentElement]);\n\n  return direction;\n}\n","import { useEffect, useState } from 'react';\n\n/** CSS custom properties written to `<html>` while the hook is mounted. */\nexport const KEYBOARD_INSET_VAR = '--mieweb-keyboard-inset';\nexport const VISUAL_VIEWPORT_HEIGHT_VAR = '--mieweb-visual-viewport-height';\nexport const VISUAL_VIEWPORT_OFFSET_TOP_VAR =\n  '--mieweb-visual-viewport-offset-top';\n/** Boolean attribute set on `<html>` while an on-screen keyboard is open. */\nexport const KEYBOARD_OPEN_ATTRIBUTE = 'data-keyboard-open';\n/** Attribute on `<html>` naming the active {@link KeyboardInsetSource}. */\nexport const KEYBOARD_SOURCE_ATTRIBUTE = 'data-keyboard-source';\n\n/**\n * Where keyboard metrics come from.\n *\n * - `'visual-viewport'` — the Visual Viewport API. Works in any browser, but\n *   iOS only reports the keyboard once its slide-in animation has finished.\n * - `'native'` — `keyboardWillShow` / `keyboardWillHide` window events with a\n *   `keyboardHeight` property, as fired by `cordova-plugin-ionic-keyboard` and\n *   Capacitor's Keyboard plugin. They arrive *before* the keyboard animates,\n *   so layout can move in step with it.\n */\nexport type KeyboardInsetSource = 'visual-viewport' | 'native';\n\nexport interface KeyboardInsetState {\n  /** Pixels of the layout viewport covered by the on-screen keyboard. */\n  keyboardInset: number;\n  /** Whether an on-screen keyboard currently covers part of the page. */\n  isKeyboardOpen: boolean;\n}\n\nexport interface UseKeyboardInsetOptions {\n  /** Track the keyboard; `false` stops tracking and clears the CSS variables. @default true */\n  enabled?: boolean;\n  /** Where keyboard metrics come from. @default 'visual-viewport' */\n  source?: KeyboardInsetSource;\n}\n\ninterface NativeKeyboardEvent extends Event {\n  keyboardHeight?: number;\n}\n\nconst CLOSED: KeyboardInsetState = { keyboardInset: 0, isKeyboardOpen: false };\n\n/**\n * Tracks the on-screen keyboard and publishes it on `<html>`.\n *\n * ### `source: 'native'` (Cordova / Capacitor apps)\n *\n * Listens for the native keyboard plugin's `keyboardWillShow` /\n * `keyboardWillHide` window events. Configure the plugin so the WebView is\n * neither resized nor panned (for `cordova-plugin-ionic-keyboard`:\n * `KeyboardResize=false`), keep the app shell at full height, and move only\n * the composer dock by `--mieweb-keyboard-inset` with a short transition\n * (~250ms) so it rides up with the keyboard. Only `--mieweb-keyboard-inset`,\n * `data-keyboard-open` and `data-keyboard-source` are published; the\n * visual-viewport variables stay unset.\n *\n * ### `source: 'visual-viewport'` (browsers, default)\n *\n * Uses the Visual Viewport API.\n *\n * iOS Safari and WKWebView (Cordova) ignore\n * `interactive-widget=resizes-content`, and `dvh` does not shrink for the\n * keyboard: the page keeps its full height and iOS pans the visual viewport\n * to reveal the focused input, pushing headers off-screen. This hook\n * measures what is actually visible and publishes it on `<html>` so an app\n * shell can follow the visible area instead:\n *\n * - `--mieweb-keyboard-inset` — keyboard height in px (0 when closed)\n * - `--mieweb-visual-viewport-height` — visible height in px\n * - `--mieweb-visual-viewport-offset-top` — how far iOS panned the page\n * - `data-keyboard-open` — present while the keyboard is open\n *\n * On browsers that already resize the layout for the keyboard (Chrome on\n * Android with `interactive-widget=resizes-content`) the inset stays 0 and\n * the variables simply mirror the layout viewport.\n *\n * iOS reports the visual viewport only after the keyboard has finished\n * animating, so a shell sized this way snaps into place once the keyboard\n * lands. Prefer `source: 'native'` wherever a native keyboard plugin exists.\n *\n * Mount it once, near the app root.\n *\n * @example\n * ```tsx\n * function AppShell({ children }) {\n *   useKeyboardInset();\n *   return (\n *     <div\n *       style={{\n *         height: 'var(--mieweb-visual-viewport-height, 100dvh)',\n *         transform: 'translateY(var(--mieweb-visual-viewport-offset-top, 0px))',\n *       }}\n *     >\n *       {children}\n *     </div>\n *   );\n * }\n * ```\n *\n * @example Native app (keyboard plugin with WebView resizing disabled)\n * ```tsx\n * function ComposerDock({ children }) {\n *   useKeyboardInset({ source: 'native' });\n *   return (\n *     <div\n *       style={{\n *         paddingBottom: 'calc(var(--mieweb-keyboard-inset, 0px) + 0.5rem)',\n *         transition: 'padding-bottom 250ms ease',\n *       }}\n *     >\n *       {children}\n *     </div>\n *   );\n * }\n * ```\n */\nexport function useKeyboardInset(\n  options: UseKeyboardInsetOptions = {}\n): KeyboardInsetState {\n  const { enabled = true, source = 'visual-viewport' } = options;\n  const [state, setState] = useState<KeyboardInsetState>(CLOSED);\n\n  useEffect(() => {\n    if (!enabled || typeof window === 'undefined') return;\n    const root = document.documentElement;\n\n    const publish = (keyboardInset: number) => {\n      const isKeyboardOpen = keyboardInset > 0;\n      root.style.setProperty(KEYBOARD_INSET_VAR, `${keyboardInset}px`);\n      root.toggleAttribute(KEYBOARD_OPEN_ATTRIBUTE, isKeyboardOpen);\n      setState((previous) =>\n        previous.keyboardInset === keyboardInset\n          ? previous\n          : { keyboardInset, isKeyboardOpen }\n      );\n    };\n\n    const clear = () => {\n      root.style.removeProperty(KEYBOARD_INSET_VAR);\n      root.style.removeProperty(VISUAL_VIEWPORT_HEIGHT_VAR);\n      root.style.removeProperty(VISUAL_VIEWPORT_OFFSET_TOP_VAR);\n      root.removeAttribute(KEYBOARD_OPEN_ATTRIBUTE);\n      root.removeAttribute(KEYBOARD_SOURCE_ATTRIBUTE);\n      setState(CLOSED);\n    };\n\n    if (source === 'native') {\n      const handleWillShow = (event: Event) => {\n        publish(\n          Math.max(\n            0,\n            Math.round((event as NativeKeyboardEvent).keyboardHeight ?? 0)\n          )\n        );\n      };\n      const handleWillHide = () => publish(0);\n\n      root.setAttribute(KEYBOARD_SOURCE_ATTRIBUTE, source);\n      publish(0);\n      window.addEventListener('keyboardWillShow', handleWillShow);\n      window.addEventListener('keyboardWillHide', handleWillHide);\n\n      return () => {\n        window.removeEventListener('keyboardWillShow', handleWillShow);\n        window.removeEventListener('keyboardWillHide', handleWillHide);\n        clear();\n      };\n    }\n\n    const viewport = window.visualViewport;\n    if (!viewport) return;\n\n    let frame = 0;\n\n    const measure = () => {\n      frame = 0;\n      // Pinch-zoom shrinks the visual viewport too; that is not a keyboard.\n      const zoomed = Math.abs(viewport.scale - 1) > 0.01;\n      const keyboardInset = zoomed\n        ? 0\n        : Math.max(\n            0,\n            Math.round(\n              window.innerHeight - viewport.height - viewport.offsetTop\n            )\n          );\n\n      root.style.setProperty(\n        VISUAL_VIEWPORT_HEIGHT_VAR,\n        `${zoomed ? window.innerHeight : Math.round(viewport.height)}px`\n      );\n      root.style.setProperty(\n        VISUAL_VIEWPORT_OFFSET_TOP_VAR,\n        `${zoomed ? 0 : Math.round(viewport.offsetTop)}px`\n      );\n      publish(keyboardInset);\n    };\n\n    // Coalesce the resize + scroll bursts iOS fires while the keyboard\n    // animates into one write per frame.\n    const schedule = () => {\n      if (frame === 0) frame = requestAnimationFrame(measure);\n    };\n\n    root.setAttribute(KEYBOARD_SOURCE_ATTRIBUTE, source);\n    measure();\n    viewport.addEventListener('resize', schedule);\n    viewport.addEventListener('scroll', schedule);\n\n    return () => {\n      cancelAnimationFrame(frame);\n      viewport.removeEventListener('resize', schedule);\n      viewport.removeEventListener('scroll', schedule);\n      clear();\n    };\n  }, [enabled, source]);\n\n  return state;\n}\n","import { useEffect, useCallback } from 'react';\n\n/**\n * Options for keyboard shortcut hook\n */\nexport interface KeyboardShortcutOptions {\n  /** Whether the shortcut is currently enabled (default: true) */\n  enabled?: boolean;\n  /** Modifier keys required (default: none) */\n  modifiers?: {\n    ctrl?: boolean;\n    shift?: boolean;\n    alt?: boolean;\n    meta?: boolean;\n  };\n  /** Whether to prevent default browser behavior (default: true) */\n  preventDefault?: boolean;\n  /** Whether to stop event propagation (default: false) */\n  stopPropagation?: boolean;\n  /** Element types to ignore when the shortcut is pressed (default: ['INPUT', 'TEXTAREA', 'SELECT']) */\n  ignoreInputs?: boolean;\n}\n\n/**\n * Hook that triggers a callback when a specific keyboard shortcut is pressed.\n * Supports modifier keys (Ctrl, Shift, Alt, Meta) and ignores input fields by default.\n *\n * @param key - The key to listen for (e.g., 'k', 'Enter', 'Escape', '/')\n * @param callback - Function to call when the shortcut is pressed\n * @param options - Configuration options\n *\n * @example\n * ```tsx\n * // Cmd/Ctrl+K to open search\n * useKeyboardShortcut('k', openSearch, { modifiers: { meta: true, ctrl: true } });\n *\n * // Forward slash to focus search (ignoring when typing)\n * useKeyboardShortcut('/', focusSearch);\n *\n * // Escape to close modal\n * useKeyboardShortcut('Escape', closeModal);\n * ```\n */\nexport function useKeyboardShortcut(\n  key: string,\n  callback: (event: KeyboardEvent) => void,\n  options: KeyboardShortcutOptions = {}\n): void {\n  const {\n    enabled = true,\n    modifiers = {},\n    preventDefault = true,\n    stopPropagation = false,\n    ignoreInputs = true,\n  } = options;\n\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      // Check if we should ignore input fields\n      if (ignoreInputs) {\n        const target = event.target as HTMLElement;\n        const tagName = target.tagName.toUpperCase();\n        if (\n          tagName === 'INPUT' ||\n          tagName === 'TEXTAREA' ||\n          tagName === 'SELECT' ||\n          target.isContentEditable\n        ) {\n          return;\n        }\n      }\n\n      // Check modifiers\n      const { ctrl, shift, alt, meta } = modifiers;\n\n      // For Cmd+K style shortcuts, allow either meta (Mac) or ctrl (Windows/Linux)\n      const metaOrCtrl = meta || ctrl;\n      if (metaOrCtrl) {\n        if (!(event.metaKey || event.ctrlKey)) return;\n      } else {\n        // If no meta/ctrl modifier specified, ensure neither is pressed\n        if (event.metaKey || event.ctrlKey) return;\n      }\n\n      if (shift && !event.shiftKey) return;\n      if (alt && !event.altKey) return;\n\n      // Check key match (case-insensitive for letters)\n      const eventKey =\n        event.key.length === 1 ? event.key.toLowerCase() : event.key;\n      const targetKey = key.length === 1 ? key.toLowerCase() : key;\n      if (eventKey !== targetKey) return;\n\n      if (preventDefault) {\n        event.preventDefault();\n      }\n      if (stopPropagation) {\n        event.stopPropagation();\n      }\n\n      callback(event);\n    },\n    [key, callback, modifiers, preventDefault, stopPropagation, ignoreInputs]\n  );\n\n  useEffect(() => {\n    if (!enabled) return;\n\n    document.addEventListener('keydown', handleKeyDown);\n    return () => document.removeEventListener('keydown', handleKeyDown);\n  }, [handleKeyDown, enabled]);\n}\n\n/**\n * Hook for the common Cmd/Ctrl+K shortcut pattern (command palette, search, etc.)\n *\n * @param callback - Function to call when Cmd/Ctrl+K is pressed\n * @param enabled - Whether the shortcut is active (default: true)\n *\n * @example\n * ```tsx\n * useCommandK(() => setIsOpen(true));\n * ```\n */\nexport function useCommandK(callback: () => void, enabled = true): void {\n  useKeyboardShortcut('k', callback, {\n    enabled,\n    modifiers: { meta: true, ctrl: true },\n    ignoreInputs: false, // Cmd+K should work even in inputs\n  });\n}\n","import { useState, useEffect } from 'react';\n\n/**\n * Hook that tracks whether a media query matches.\n * Uses the native `matchMedia` API for efficient media query tracking.\n *\n * @param query - CSS media query string (e.g., '(min-width: 768px)')\n * @returns Boolean indicating whether the media query matches\n *\n * @example\n * ```tsx\n * function ResponsiveComponent() {\n *   const isMobile = useMediaQuery('(max-width: 767px)');\n *   const isTablet = useMediaQuery('(min-width: 768px) and (max-width: 1023px)');\n *   const isDesktop = useMediaQuery('(min-width: 1024px)');\n *\n *   return (\n *     <div>\n *       {isMobile && <MobileLayout />}\n *       {isTablet && <TabletLayout />}\n *       {isDesktop && <DesktopLayout />}\n *     </div>\n *   );\n * }\n * ```\n */\nexport function useMediaQuery(query: string): boolean {\n  // Initialize with null to indicate SSR/initial state\n  const [matches, setMatches] = useState<boolean>(() => {\n    // Check if we're in a browser environment\n    if (typeof window === 'undefined') return false;\n    return window.matchMedia(query).matches;\n  });\n\n  useEffect(() => {\n    if (typeof window === 'undefined') return;\n\n    const mediaQuery = window.matchMedia(query);\n\n    // Set initial value\n    setMatches(mediaQuery.matches);\n\n    // Handler for media query changes\n    const handler = (event: MediaQueryListEvent) => {\n      setMatches(event.matches);\n    };\n\n    // Modern browsers use addEventListener\n    if (mediaQuery.addEventListener) {\n      mediaQuery.addEventListener('change', handler);\n      return () => mediaQuery.removeEventListener('change', handler);\n    }\n\n    // Fallback for older browsers\n    mediaQuery.addListener(handler);\n    return () => mediaQuery.removeListener(handler);\n  }, [query]);\n\n  return matches;\n}\n\n/**\n * Preset breakpoint hooks following common responsive design patterns\n */\n\n/** Returns true when viewport is smaller than 640px (mobile) */\nexport function useIsMobile(): boolean {\n  return useMediaQuery('(max-width: 639px)');\n}\n\n/** Returns true when viewport is 640px-767px (large mobile / small tablet) */\nexport function useIsSmallTablet(): boolean {\n  return useMediaQuery('(min-width: 640px) and (max-width: 767px)');\n}\n\n/** Returns true when viewport is 768px-1023px (tablet) */\nexport function useIsTablet(): boolean {\n  return useMediaQuery('(min-width: 768px) and (max-width: 1023px)');\n}\n\n/** Returns true when viewport is 1024px or larger (desktop) */\nexport function useIsDesktop(): boolean {\n  return useMediaQuery('(min-width: 1024px)');\n}\n\n/** Returns true when viewport is 1280px or larger (large desktop) */\nexport function useIsLargeDesktop(): boolean {\n  return useMediaQuery('(min-width: 1280px)');\n}\n\n/** Returns true when viewport is smaller than 1024px (mobile/tablet) */\nexport function useIsMobileOrTablet(): boolean {\n  return useMediaQuery('(max-width: 1023px)');\n}\n"]}

package/dist/chunk-GU5OS7JJ.cjs

@@ -0,0 +1,281 @@
+'use strict';
+
+var chunk4NCDU5IG_cjs = require('./chunk-4NCDU5IG.cjs');
+var chunkXXVUHLQN_cjs = require('./chunk-XXVUHLQN.cjs');
+var chunkL7L5S2HO_cjs = require('./chunk-L7L5S2HO.cjs');
+var chunkX6A27RGO_cjs = require('./chunk-X6A27RGO.cjs');
+var chunkS5RVSXDV_cjs = require('./chunk-S5RVSXDV.cjs');
+var React = require('react');
+var classVarianceAuthority = require('class-variance-authority');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var itemVariants = classVarianceAuthority.cva(
+  [
+    "flex w-full items-start gap-3 border-b border-border px-3 text-start",
+    "last:border-b-0",
+    "transition-colors",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring"
+  ],
+  {
+    variants: {
+      density: {
+        comfortable: "py-3",
+        compact: "py-2"
+      },
+      interactive: {
+        true: "cursor-pointer hover:bg-muted",
+        false: ""
+      },
+      selected: {
+        true: "bg-primary-500/10",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      density: "comfortable",
+      interactive: false,
+      selected: false
+    }
+  }
+);
+function buildGroups(items, groupBy, accessors, ungrouped, stages) {
+  if (groupBy === "none") return [{ id: "", label: "", items }];
+  const read = groupBy === "status" ? accessors.getStatus : accessors.getGroup;
+  if (!read) return [{ id: "", label: "", items }];
+  const buckets = /* @__PURE__ */ new Map();
+  for (const item of items) {
+    const key = read(item) ?? "";
+    const bucket = buckets.get(key);
+    if (bucket) bucket.push(item);
+    else buckets.set(key, [item]);
+  }
+  const groups = [];
+  for (const stage of (groupBy === "status" ? stages : void 0) ?? []) {
+    groups.push({
+      id: stage.id,
+      label: stage.label,
+      accent: stage.accent,
+      items: buckets.get(stage.id) ?? []
+    });
+    buckets.delete(stage.id);
+  }
+  for (const [key, bucket] of buckets) {
+    groups.push({ id: key, label: key || ungrouped, items: bucket });
+  }
+  return groups;
+}
+function ListView({
+  items,
+  accessors,
+  loading = false,
+  error = null,
+  selectedId = null,
+  onOpen,
+  getHref,
+  renderItem,
+  emptyState,
+  labels,
+  stages,
+  groupBy = stages ? "status" : "none",
+  defaultCollapsedGroups,
+  onRetry,
+  density,
+  className,
+  classNames,
+  headingLevel: Heading = "h3"
+}) {
+  const text = { ...chunk4NCDU5IG_cjs.defaultViewLabels, ...labels };
+  const baseId = React__namespace.useId();
+  const [collapsed, setCollapsed] = React__namespace.useState(
+    () => new Set(defaultCollapsedGroups ?? [])
+  );
+  const groups = React__namespace.useMemo(
+    () => buildGroups(items, groupBy, accessors, text.ungrouped, stages),
+    [items, groupBy, accessors, text.ungrouped, stages]
+  );
+  const state = (content) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "list-view-state",
+      className: chunkS5RVSXDV_cjs.cn(
+        "text-muted-foreground flex flex-col items-center justify-center gap-2 px-4 py-10 text-center text-sm",
+        classNames?.state
+      ),
+      children: content
+    }
+  );
+  let body;
+  if (error) {
+    body = state(
+      /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { role: "alert", className: "text-destructive", children: text.error }),
+        onRetry && /* @__PURE__ */ jsxRuntime.jsx(chunkX6A27RGO_cjs.Button, { variant: "ghost", size: "sm", onClick: onRetry, children: text.retry })
+      ] })
+    );
+  } else if (loading) {
+    body = state(
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(chunkXXVUHLQN_cjs.Spinner, { size: "sm", label: text.loading }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, children: text.loading })
+      ] })
+    );
+  } else if (items.length === 0) {
+    body = emptyState ?? state(text.empty);
+  } else {
+    body = groups.map((group, groupIndex) => {
+      const isCollapsed = collapsed.has(group.id);
+      const headerId = `${baseId}-group-${groupIndex}`;
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "section",
+        {
+          "data-slot": "list-view-group",
+          className: chunkS5RVSXDV_cjs.cn(classNames?.group),
+          children: [
+            group.label && /* @__PURE__ */ jsxRuntime.jsx(Heading, { className: "sticky top-0 z-10", children: /* @__PURE__ */ jsxRuntime.jsxs(
+              "button",
+              {
+                type: "button",
+                id: headerId,
+                "aria-expanded": !isCollapsed,
+                onClick: () => setCollapsed((prev) => {
+                  const next = new Set(prev);
+                  if (!next.delete(group.id)) next.add(group.id);
+                  return next;
+                }),
+                "data-slot": "list-view-group-header",
+                className: chunkS5RVSXDV_cjs.cn(
+                  "border-border bg-muted text-muted-foreground flex w-full items-center gap-2 border-b px-3 py-2 text-start text-xs font-semibold tracking-wide uppercase",
+                  "focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none focus-visible:ring-inset",
+                  classNames?.groupHeader
+                ),
+                children: [
+                  isCollapsed ? /* @__PURE__ */ jsxRuntime.jsx(
+                    chunkL7L5S2HO_cjs.ChevronRight,
+                    {
+                      className: "size-3.5 rtl:rotate-180",
+                      "aria-hidden": true
+                    }
+                  ) : /* @__PURE__ */ jsxRuntime.jsx(chunkL7L5S2HO_cjs.ChevronDown, { className: "size-3.5", "aria-hidden": true }),
+                  group.accent && /* @__PURE__ */ jsxRuntime.jsx(
+                    "span",
+                    {
+                      "aria-hidden": true,
+                      className: chunkS5RVSXDV_cjs.cn(
+                        "size-2 shrink-0 rounded-full",
+                        chunk4NCDU5IG_cjs.accentClasses[group.accent].marker
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { children: group.label }),
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ms-auto font-normal tabular-nums", children: group.items.length })
+                ]
+              }
+            ) }),
+            !isCollapsed && /* @__PURE__ */ jsxRuntime.jsxs("ul", { "aria-labelledby": group.label ? headerId : void 0, children: [
+              group.items.map((item) => {
+                const id = accessors.getId(item);
+                const selected = id === selectedId;
+                const accent = accessors.getAccent?.(item);
+                const subtitle = accessors.getSubtitle?.(item);
+                const content = renderItem?.(item, { view: "list" }) ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  accent && /* @__PURE__ */ jsxRuntime.jsx(
+                    "span",
+                    {
+                      "aria-hidden": true,
+                      className: chunkS5RVSXDV_cjs.cn(
+                        "mt-1.5 size-2 shrink-0 rounded-full",
+                        chunk4NCDU5IG_cjs.accentClasses[accent].marker
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "min-w-0 flex-1", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground block truncate font-medium", children: accessors.getTitle(item) }),
+                    subtitle && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground block truncate text-sm", children: subtitle })
+                  ] })
+                ] });
+                const classes = chunkS5RVSXDV_cjs.cn(
+                  itemVariants({
+                    density,
+                    interactive: Boolean(onOpen || getHref),
+                    selected
+                  }),
+                  classNames?.item,
+                  selected && classNames?.selectedItem
+                );
+                const href = getHref?.(id, item);
+                return /* @__PURE__ */ jsxRuntime.jsx("li", { children: href ? (
+                  // An anchor, not a handler, so the row is middle-clickable
+                  // and crawlable; onOpen still runs for router navigation.
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "a",
+                    {
+                      href,
+                      "aria-current": selected ? "true" : void 0,
+                      "data-slot": "list-view-item",
+                      className: classes,
+                      onClick: (event) => {
+                        if (!onOpen || event.defaultPrevented || event.metaKey || event.ctrlKey || event.shiftKey || event.button !== 0)
+                          return;
+                        event.preventDefault();
+                        onOpen(id, item);
+                      },
+                      children: content
+                    }
+                  )
+                ) : onOpen ? /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-current": selected ? "true" : void 0,
+                    "data-slot": "list-view-item",
+                    className: classes,
+                    onClick: () => onOpen(id, item),
+                    children: content
+                  }
+                ) : /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "list-view-item", className: classes, children: content }) }, id);
+              }),
+              group.items.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("li", { className: "text-muted-foreground px-3 py-2 text-sm", children: text.empty })
+            ] })
+          ]
+        },
+        group.id
+      );
+    });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "list-view",
+      className: chunkS5RVSXDV_cjs.cn(
+        "border-border bg-card overflow-hidden rounded-lg border",
+        className
+      ),
+      children: body
+    }
+  );
+}
+
+exports.ListView = ListView;
+exports.itemVariants = itemVariants;
+//# sourceMappingURL=chunk-GU5OS7JJ.cjs.map
+//# sourceMappingURL=chunk-GU5OS7JJ.cjs.map

package/dist/chunk-GU5OS7JJ.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ListView/ListView.tsx"],"names":["cva","defaultViewLabels","React","jsx","cn","jsxs","Fragment","Button","Spinner","ChevronRight","ChevronDown","accentClasses"],"mappings":"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","file":"chunk-GU5OS7JJ.cjs","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { Button } from '../Button';\nimport { Spinner } from '../Spinner';\nimport { ChevronDownIcon, ChevronRightIcon } from '../Icons';\nimport {\n  accentClasses,\n  defaultViewLabels,\n  type Stage,\n  type ViewBaseProps,\n} from '../../views/types';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type ListViewSlot =\n  | 'group'\n  | 'groupHeader'\n  | 'item'\n  | 'selectedItem'\n  | 'state';\n\nexport interface ListViewProps<T>\n  extends ViewBaseProps<T>, VariantProps<typeof itemVariants> {\n  /**\n   * Group rows by `accessors.getStatus`, using these stages for order and\n   * labels. Items whose status matches no stage are appended under their own\n   * heading rather than dropped.\n   */\n  stages?: readonly Stage[];\n  /** Group by `accessors.getGroup` instead of by stage. */\n  groupBy?: 'status' | 'group' | 'none';\n  /** Groups that start collapsed. Uncontrolled; the user can reopen them. */\n  defaultCollapsedGroups?: readonly string[];\n  /** Retries the failed load. Renders the retry action only when provided. */\n  onRetry?: () => void;\n  classNames?: Partial<Record<ListViewSlot, string>>;\n  /** Heading level for group headers, under the page's own heading. */\n  headingLevel?: 'h2' | 'h3' | 'h4';\n}\n\ninterface Group<T> {\n  id: string;\n  label: string;\n  accent?: Stage['accent'];\n  items: T[];\n}\n\n// =============================================================================\n// Variants\n// =============================================================================\n\nconst itemVariants = cva(\n  [\n    'flex w-full items-start gap-3 border-b border-border px-3 text-start',\n    'last:border-b-0',\n    'transition-colors',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring',\n  ],\n  {\n    variants: {\n      density: {\n        comfortable: 'py-3',\n        compact: 'py-2',\n      },\n      interactive: {\n        true: 'cursor-pointer hover:bg-muted',\n        false: '',\n      },\n      selected: {\n        true: 'bg-primary-500/10',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      density: 'comfortable',\n      interactive: false,\n      selected: false,\n    },\n  }\n);\n\n// =============================================================================\n// Grouping\n// =============================================================================\n\nfunction buildGroups<T>(\n  items: T[],\n  groupBy: 'status' | 'group' | 'none',\n  accessors: ListViewProps<T>['accessors'],\n  ungrouped: string,\n  stages?: readonly Stage[]\n): Group<T>[] {\n  if (groupBy === 'none') return [{ id: '', label: '', items }];\n\n  const read = groupBy === 'status' ? accessors.getStatus : accessors.getGroup;\n  if (!read) return [{ id: '', label: '', items }];\n\n  const buckets = new Map<string, T[]>();\n  for (const item of items) {\n    const key = read(item) ?? '';\n    const bucket = buckets.get(key);\n    if (bucket) bucket.push(item);\n    else buckets.set(key, [item]);\n  }\n\n  const groups: Group<T>[] = [];\n  // Stages fix the order, and an empty stage still shows — a board column that\n  // disappears when it empties hides the fact that the stage exists. This only\n  // applies to `groupBy=\"status\"`: stages name statuses, so seeding them under\n  // `groupBy=\"group\"` would print an empty \"Backlog\"/\"In progress\" above the\n  // real buckets. `ViewSet` always passes its shared stages, so that case is\n  // reachable with nothing more than `listProps={{ groupBy: 'group' }}`.\n  for (const stage of (groupBy === 'status' ? stages : undefined) ?? []) {\n    groups.push({\n      id: stage.id,\n      label: stage.label,\n      accent: stage.accent,\n      items: buckets.get(stage.id) ?? [],\n    });\n    buckets.delete(stage.id);\n  }\n  for (const [key, bucket] of buckets) {\n    groups.push({ id: key, label: key || ungrouped, items: bucket });\n  }\n  return groups;\n}\n\n// =============================================================================\n// Component\n// =============================================================================\n\n/**\n * Declared `parameters.catalog.collection` — the three load states below are\n * part of this component's API, not decoration.\n */\nexport function ListView<T>({\n  items,\n  accessors,\n  loading = false,\n  error = null,\n  selectedId = null,\n  onOpen,\n  getHref,\n  renderItem,\n  emptyState,\n  labels,\n  stages,\n  groupBy = stages ? 'status' : 'none',\n  defaultCollapsedGroups,\n  onRetry,\n  density,\n  className,\n  classNames,\n  headingLevel: Heading = 'h3',\n}: ListViewProps<T>) {\n  const text = { ...defaultViewLabels, ...labels };\n  // Ids come from position, not from the status text: two distinct statuses can\n  // normalise to the same string, and a duplicate id makes `aria-labelledby`\n  // resolve to the wrong heading.\n  const baseId = React.useId();\n  const [collapsed, setCollapsed] = React.useState<Set<string>>(\n    () => new Set(defaultCollapsedGroups ?? [])\n  );\n\n  const groups = React.useMemo(\n    () => buildGroups(items, groupBy, accessors, text.ungrouped, stages),\n    [items, groupBy, accessors, text.ungrouped, stages]\n  );\n\n  const state = (content: React.ReactNode) => (\n    <div\n      data-slot=\"list-view-state\"\n      className={cn(\n        'text-muted-foreground flex flex-col items-center justify-center gap-2 px-4 py-10 text-center text-sm',\n        classNames?.state\n      )}\n    >\n      {content}\n    </div>\n  );\n\n  let body: React.ReactNode;\n  if (error) {\n    body = state(\n      <>\n        <p role=\"alert\" className=\"text-destructive\">\n          {text.error}\n        </p>\n        {onRetry && (\n          <Button variant=\"ghost\" size=\"sm\" onClick={onRetry}>\n            {text.retry}\n          </Button>\n        )}\n      </>\n    );\n  } else if (loading) {\n    // Spinner is the status region and carries the accessible name; the visible\n    // copy beside it would otherwise be announced twice.\n    body = state(\n      <span className=\"flex items-center gap-2\">\n        <Spinner size=\"sm\" label={text.loading} />\n        <span aria-hidden>{text.loading}</span>\n      </span>\n    );\n  } else if (items.length === 0) {\n    body = emptyState ?? state(text.empty);\n  } else {\n    body = groups.map((group, groupIndex) => {\n      const isCollapsed = collapsed.has(group.id);\n      const headerId = `${baseId}-group-${groupIndex}`;\n      return (\n        <section\n          key={group.id}\n          data-slot=\"list-view-group\"\n          className={cn(classNames?.group)}\n        >\n          {group.label && (\n            <Heading className=\"sticky top-0 z-10\">\n              <button\n                type=\"button\"\n                id={headerId}\n                aria-expanded={!isCollapsed}\n                onClick={() =>\n                  setCollapsed((prev) => {\n                    const next = new Set(prev);\n                    if (!next.delete(group.id)) next.add(group.id);\n                    return next;\n                  })\n                }\n                data-slot=\"list-view-group-header\"\n                className={cn(\n                  'border-border bg-muted text-muted-foreground flex w-full items-center gap-2 border-b px-3 py-2 text-start text-xs font-semibold tracking-wide uppercase',\n                  'focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none focus-visible:ring-inset',\n                  classNames?.groupHeader\n                )}\n              >\n                {isCollapsed ? (\n                  <ChevronRightIcon\n                    className=\"size-3.5 rtl:rotate-180\"\n                    aria-hidden\n                  />\n                ) : (\n                  <ChevronDownIcon className=\"size-3.5\" aria-hidden />\n                )}\n                {group.accent && (\n                  <span\n                    aria-hidden\n                    className={cn(\n                      'size-2 shrink-0 rounded-full',\n                      accentClasses[group.accent].marker\n                    )}\n                  />\n                )}\n                <span>{group.label}</span>\n                <span className=\"ms-auto font-normal tabular-nums\">\n                  {group.items.length}\n                </span>\n              </button>\n            </Heading>\n          )}\n          {!isCollapsed && (\n            <ul aria-labelledby={group.label ? headerId : undefined}>\n              {group.items.map((item) => {\n                const id = accessors.getId(item);\n                const selected = id === selectedId;\n                const accent = accessors.getAccent?.(item);\n                const subtitle = accessors.getSubtitle?.(item);\n                const content = renderItem?.(item, { view: 'list' }) ?? (\n                  <>\n                    {accent && (\n                      <span\n                        aria-hidden\n                        className={cn(\n                          'mt-1.5 size-2 shrink-0 rounded-full',\n                          accentClasses[accent].marker\n                        )}\n                      />\n                    )}\n                    <span className=\"min-w-0 flex-1\">\n                      <span className=\"text-foreground block truncate font-medium\">\n                        {accessors.getTitle(item)}\n                      </span>\n                      {subtitle && (\n                        <span className=\"text-muted-foreground block truncate text-sm\">\n                          {subtitle}\n                        </span>\n                      )}\n                    </span>\n                  </>\n                );\n                const classes = cn(\n                  itemVariants({\n                    density,\n                    interactive: Boolean(onOpen || getHref),\n                    selected,\n                  }),\n                  classNames?.item,\n                  selected && classNames?.selectedItem\n                );\n                const href = getHref?.(id, item);\n                return (\n                  <li key={id}>\n                    {href ? (\n                      // An anchor, not a handler, so the row is middle-clickable\n                      // and crawlable; onOpen still runs for router navigation.\n                      <a\n                        href={href}\n                        aria-current={selected ? 'true' : undefined}\n                        data-slot=\"list-view-item\"\n                        className={classes}\n                        onClick={(event) => {\n                          if (\n                            !onOpen ||\n                            event.defaultPrevented ||\n                            event.metaKey ||\n                            event.ctrlKey ||\n                            event.shiftKey ||\n                            event.button !== 0\n                          )\n                            return;\n                          event.preventDefault();\n                          onOpen(id, item);\n                        }}\n                      >\n                        {content}\n                      </a>\n                    ) : onOpen ? (\n                      <button\n                        type=\"button\"\n                        aria-current={selected ? 'true' : undefined}\n                        data-slot=\"list-view-item\"\n                        className={classes}\n                        onClick={() => onOpen(id, item)}\n                      >\n                        {content}\n                      </button>\n                    ) : (\n                      <div data-slot=\"list-view-item\" className={classes}>\n                        {content}\n                      </div>\n                    )}\n                  </li>\n                );\n              })}\n              {group.items.length === 0 && (\n                <li className=\"text-muted-foreground px-3 py-2 text-sm\">\n                  {text.empty}\n                </li>\n              )}\n            </ul>\n          )}\n        </section>\n      );\n    });\n  }\n\n  return (\n    <div\n      data-slot=\"list-view\"\n      className={cn(\n        'border-border bg-card overflow-hidden rounded-lg border',\n        className\n      )}\n    >\n      {body}\n    </div>\n  );\n}\n\nexport { itemVariants as listViewItemVariants };\n"]}

package/dist/{chunk-V7D3YGUV.js → chunk-GVLNXPJX.js}

@@ -1,5 +1,5 @@
-import { FenceBlock } from './chunk-H4ZXMQQW.js';
-import { Button } from './chunk-GOALNQZ2.js';
+import { FenceBlock } from './chunk-QOVJ6Z6R.js';
+import { Button } from './chunk-7YO7DNUV.js';
 import { Code, Eye, Maximize2 } from 'lucide-react';
 import { useState, useRef, useEffect, useCallback } from 'react';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
@@ -131,5 +131,5 @@ var HtmlPreviewBlock = ({
 };
 
 export { HtmlPreviewBlock };
-//# sourceMappingURL=chunk-V7D3YGUV.js.map
-//# sourceMappingURL=chunk-V7D3YGUV.js.map
+//# sourceMappingURL=chunk-GVLNXPJX.js.map
+//# sourceMappingURL=chunk-GVLNXPJX.js.map

package/dist/{chunk-V7D3YGUV.js.map → chunk-GVLNXPJX.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Markdown/HtmlPreviewBlock.tsx"],"names":[],"mappings":"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","file":"chunk-V7D3YGUV.js","sourcesContent":["/** Sandboxed iframe preview for HTML code blocks. */\nimport { Code, Eye, Maximize2 } from 'lucide-react';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '../Button';\nimport { FenceBlock } from './FenceBlock';\n\ninterface HtmlPreviewBlockProps {\n  code: string;\n  id: string;\n}\n\nfunction isFullDocument(html: string): boolean {\n  return /<!DOCTYPE|<html/i.test(html);\n}\n\nfunction wrapFragment(html: string): string {\n  return `<!DOCTYPE html>\n<html>\n<head><meta charset=\"utf-8\"><style>body{margin:0;padding:8px;font-family:system-ui,sans-serif;font-size:14px}</style></head>\n<body>${html}</body>\n</html>`;\n}\n\nexport const HtmlPreviewBlock: React.FC<HtmlPreviewBlockProps> = ({\n  code,\n  id,\n}) => {\n  const [showPreview, setShowPreview] = useState(false);\n  const [expanded, setExpanded] = useState(false);\n  const iframeRef = useRef<HTMLIFrameElement>(null);\n  const [iframeHeight, setIframeHeight] = useState(200);\n\n  const srcdoc = isFullDocument(code) ? code : wrapFragment(code);\n\n  useEffect(() => {\n    function handleMessage(event: globalThis.MessageEvent) {\n      // Sandboxed srcDoc iframes report origin \"null\"; validate source to prevent spoofing.\n      if (event.origin !== 'null' && event.origin !== window.location.origin)\n        return;\n      if (event.source !== iframeRef.current?.contentWindow) return;\n      if (event.data?.type === 'HTML_PREVIEW_RESIZE' && event.data?.id === id) {\n        setIframeHeight(Math.min(Math.max(event.data.height, 200), 4000));\n      }\n    }\n    window.addEventListener('message', handleMessage);\n    return () => window.removeEventListener('message', handleMessage);\n  }, [id]);\n\n  useEffect(() => {\n    if (!expanded) return;\n    function handleKey(e: KeyboardEvent) {\n      if (e.key === 'Escape') setExpanded(false);\n    }\n    document.addEventListener('keydown', handleKey);\n    return () => document.removeEventListener('keydown', handleKey);\n  }, [expanded]);\n\n  const togglePreview = useCallback(() => setShowPreview((v) => !v), []);\n\n  const headerActions = (\n    <>\n      <Button\n        variant=\"ghost\"\n        size=\"sm\"\n        onClick={togglePreview}\n        className=\"h-7 gap-1 px-2 text-xs\"\n      >\n        {showPreview ? (\n          <Code className=\"h-3 w-3\" />\n        ) : (\n          <Eye className=\"h-3 w-3\" />\n        )}\n        {showPreview ? 'Code' : 'Preview'}\n      </Button>\n      {showPreview && (\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          onClick={() => setExpanded(true)}\n          className=\"h-7 w-7 p-0\"\n          aria-label=\"Expand preview\"\n        >\n          <Maximize2 className=\"h-3 w-3\" />\n        </Button>\n      )}\n    </>\n  );\n\n  return (\n    <>\n      <FenceBlock code={code} language=\"html\" headerActions={headerActions}>\n        <div className=\"relative\">\n          {showPreview ? (\n            <iframe\n              ref={iframeRef}\n              srcDoc={srcdoc}\n              // `allow-scripts` lets previewed HTML run its own JS (charts, demos,\n              // and the optional resize-postMessage handshake). It is intentionally\n              // NOT paired with `allow-same-origin`, so the content runs in an\n              // opaque (null) origin with no access to this page, cookies, or storage.\n              sandbox=\"allow-scripts allow-forms\"\n              referrerPolicy=\"no-referrer\"\n              className=\"w-full border-0\"\n              style={{ height: iframeHeight }}\n              title=\"HTML Preview\"\n            />\n          ) : (\n            <pre className=\"overflow-x-auto p-3 text-sm\">\n              <code>{code}</code>\n            </pre>\n          )}\n        </div>\n      </FenceBlock>\n\n      {expanded && (\n        <div\n          className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-label=\"HTML Preview\"\n        >\n          <button\n            type=\"button\"\n            aria-label=\"Close preview\"\n            className=\"absolute inset-0 h-full w-full cursor-default border-0 bg-transparent p-0\"\n            onClick={() => setExpanded(false)}\n          />\n          <div className=\"relative h-[90vh] w-[90vw] overflow-hidden rounded-lg bg-white shadow-xl dark:bg-neutral-900\">\n            <div className=\"flex items-center justify-between border-b border-neutral-200 px-4 py-2 dark:border-neutral-700\">\n              <span className=\"text-sm font-medium\">HTML Preview</span>\n              <Button\n                variant=\"ghost\"\n                size=\"sm\"\n                onClick={() => setExpanded(false)}\n              >\n                Close\n              </Button>\n            </div>\n            <iframe\n              srcDoc={srcdoc}\n              sandbox=\"allow-scripts allow-forms\"\n              referrerPolicy=\"no-referrer\"\n              className=\"h-full w-full border-0\"\n              title=\"HTML Preview (expanded)\"\n            />\n          </div>\n        </div>\n      )}\n    </>\n  );\n};\n"]}
+{"version":3,"sources":["../src/components/Markdown/HtmlPreviewBlock.tsx"],"names":[],"mappings":"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","file":"chunk-GVLNXPJX.js","sourcesContent":["/** Sandboxed iframe preview for HTML code blocks. */\nimport { Code, Eye, Maximize2 } from 'lucide-react';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '../Button';\nimport { FenceBlock } from './FenceBlock';\n\ninterface HtmlPreviewBlockProps {\n  code: string;\n  id: string;\n}\n\nfunction isFullDocument(html: string): boolean {\n  return /<!DOCTYPE|<html/i.test(html);\n}\n\nfunction wrapFragment(html: string): string {\n  return `<!DOCTYPE html>\n<html>\n<head><meta charset=\"utf-8\"><style>body{margin:0;padding:8px;font-family:system-ui,sans-serif;font-size:14px}</style></head>\n<body>${html}</body>\n</html>`;\n}\n\nexport const HtmlPreviewBlock: React.FC<HtmlPreviewBlockProps> = ({\n  code,\n  id,\n}) => {\n  const [showPreview, setShowPreview] = useState(false);\n  const [expanded, setExpanded] = useState(false);\n  const iframeRef = useRef<HTMLIFrameElement>(null);\n  const [iframeHeight, setIframeHeight] = useState(200);\n\n  const srcdoc = isFullDocument(code) ? code : wrapFragment(code);\n\n  useEffect(() => {\n    function handleMessage(event: globalThis.MessageEvent) {\n      // Sandboxed srcDoc iframes report origin \"null\"; validate source to prevent spoofing.\n      if (event.origin !== 'null' && event.origin !== window.location.origin)\n        return;\n      if (event.source !== iframeRef.current?.contentWindow) return;\n      if (event.data?.type === 'HTML_PREVIEW_RESIZE' && event.data?.id === id) {\n        setIframeHeight(Math.min(Math.max(event.data.height, 200), 4000));\n      }\n    }\n    window.addEventListener('message', handleMessage);\n    return () => window.removeEventListener('message', handleMessage);\n  }, [id]);\n\n  useEffect(() => {\n    if (!expanded) return;\n    function handleKey(e: KeyboardEvent) {\n      if (e.key === 'Escape') setExpanded(false);\n    }\n    document.addEventListener('keydown', handleKey);\n    return () => document.removeEventListener('keydown', handleKey);\n  }, [expanded]);\n\n  const togglePreview = useCallback(() => setShowPreview((v) => !v), []);\n\n  const headerActions = (\n    <>\n      <Button\n        variant=\"ghost\"\n        size=\"sm\"\n        onClick={togglePreview}\n        className=\"h-7 gap-1 px-2 text-xs\"\n      >\n        {showPreview ? (\n          <Code className=\"h-3 w-3\" />\n        ) : (\n          <Eye className=\"h-3 w-3\" />\n        )}\n        {showPreview ? 'Code' : 'Preview'}\n      </Button>\n      {showPreview && (\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          onClick={() => setExpanded(true)}\n          className=\"h-7 w-7 p-0\"\n          aria-label=\"Expand preview\"\n        >\n          <Maximize2 className=\"h-3 w-3\" />\n        </Button>\n      )}\n    </>\n  );\n\n  return (\n    <>\n      <FenceBlock code={code} language=\"html\" headerActions={headerActions}>\n        <div className=\"relative\">\n          {showPreview ? (\n            <iframe\n              ref={iframeRef}\n              srcDoc={srcdoc}\n              // `allow-scripts` lets previewed HTML run its own JS (charts, demos,\n              // and the optional resize-postMessage handshake). It is intentionally\n              // NOT paired with `allow-same-origin`, so the content runs in an\n              // opaque (null) origin with no access to this page, cookies, or storage.\n              sandbox=\"allow-scripts allow-forms\"\n              referrerPolicy=\"no-referrer\"\n              className=\"w-full border-0\"\n              style={{ height: iframeHeight }}\n              title=\"HTML Preview\"\n            />\n          ) : (\n            <pre className=\"overflow-x-auto p-3 text-sm\">\n              <code>{code}</code>\n            </pre>\n          )}\n        </div>\n      </FenceBlock>\n\n      {expanded && (\n        <div\n          className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-label=\"HTML Preview\"\n        >\n          <button\n            type=\"button\"\n            aria-label=\"Close preview\"\n            className=\"absolute inset-0 h-full w-full cursor-default border-0 bg-transparent p-0\"\n            onClick={() => setExpanded(false)}\n          />\n          <div className=\"relative h-[90vh] w-[90vw] overflow-hidden rounded-lg bg-white shadow-xl dark:bg-neutral-900\">\n            <div className=\"flex items-center justify-between border-b border-neutral-200 px-4 py-2 dark:border-neutral-700\">\n              <span className=\"text-sm font-medium\">HTML Preview</span>\n              <Button\n                variant=\"ghost\"\n                size=\"sm\"\n                onClick={() => setExpanded(false)}\n              >\n                Close\n              </Button>\n            </div>\n            <iframe\n              srcDoc={srcdoc}\n              sandbox=\"allow-scripts allow-forms\"\n              referrerPolicy=\"no-referrer\"\n              className=\"h-full w-full border-0\"\n              title=\"HTML Preview (expanded)\"\n            />\n          </div>\n        </div>\n      )}\n    </>\n  );\n};\n"]}

package/dist/chunk-GVM6DTR5.js

@@ -0,0 +1,90 @@
+import { cva } from 'class-variance-authority';
+
+// src/components/Button/button-variants.ts
+var buttonVariants = cva(
+  // Base styles
+  [
+    "inline-flex items-center justify-center gap-2",
+    "min-w-0 whitespace-nowrap",
+    "font-semibold transition-all duration-200",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    "disabled:pointer-events-none disabled:opacity-50",
+    "active:scale-[0.98]"
+  ],
+  {
+    variants: {
+      variant: {
+        primary: [
+          "bg-primary-800 text-white",
+          "hover:bg-primary-900",
+          "active:bg-primary-950"
+        ],
+        secondary: [
+          "bg-neutral-200 text-neutral-900",
+          "hover:bg-neutral-300",
+          "active:bg-neutral-400",
+          "dark:bg-neutral-700 dark:text-neutral-100",
+          "dark:hover:bg-neutral-600",
+          "dark:active:bg-neutral-500"
+        ],
+        ghost: [
+          "bg-transparent text-neutral-600",
+          "hover:bg-neutral-100",
+          "active:bg-neutral-200",
+          "dark:text-neutral-400",
+          "dark:hover:bg-neutral-800",
+          "dark:active:bg-neutral-700"
+        ],
+        outline: [
+          "border-2 border-primary-800 text-primary-800 bg-transparent",
+          "hover:bg-primary-50 hover:text-primary-900",
+          "active:bg-primary-100",
+          "dark:border-primary-400 dark:text-primary-400",
+          // Lighten the label as the hover/active fill darkens: primary-400
+          // on primary-950 is only ~3.3:1 in the BlueHive palette (WCAG AA
+          // needs 4.5:1); primary-200/950 and primary-100/900 clear it in
+          // every brand palette. See issue #511.
+          "dark:hover:bg-primary-950 dark:hover:text-primary-200",
+          "dark:active:bg-primary-900 dark:active:text-primary-100"
+        ],
+        danger: [
+          "bg-red-600 text-white",
+          "hover:bg-red-700",
+          "active:bg-red-800"
+        ],
+        link: [
+          "text-primary-800 underline-offset-4",
+          "hover:underline hover:text-primary-900",
+          "active:text-primary-950",
+          "dark:text-primary-400"
+        ]
+      },
+      size: {
+        sm: "h-8 px-3 text-sm rounded-md",
+        md: "h-10 px-4 text-base rounded-lg",
+        lg: "h-12 px-6 text-lg rounded-xl",
+        icon: "h-10 w-10 rounded-lg"
+      },
+      fullWidth: {
+        true: "w-full",
+        false: ""
+      },
+      /** Opt-in hover motion (see src/styles/effects.css). */
+      effect: {
+        none: "",
+        sheen: "mie-fx-sheen hover:-translate-y-0.5",
+        orbit: "mie-fx-orbit hover:-translate-y-0.5"
+      }
+    },
+    defaultVariants: {
+      variant: "primary",
+      size: "md",
+      fullWidth: false,
+      effect: "none"
+    }
+  }
+);
+
+export { buttonVariants };
+//# sourceMappingURL=chunk-GVM6DTR5.js.map
+//# sourceMappingURL=chunk-GVM6DTR5.js.map