@almadar/ui 6.52.0 → 6.53.1

package/dist/components/index.js

@@ -1,19 +1,627 @@
+import { JsonTreeEditor } from '../chunk-UOTYAPV5.js';
+export { JsonTreeEditor } from '../chunk-UOTYAPV5.js';
+export { keyChord, mergeCaptureTables, useAgentChat, useCompile, useConnectGitHub, useDeepAgentGeneration, useDisconnectGitHub, useExtensions, useFileEditor, useFileSystem, useGitHubBranches, useGitHubRepo, useGitHubRepos, useGitHubStatus, useKeyboardRouter, useNavStack, usePreview, useRenderInterpolation, useTraitListens, useUIEvents, useValidation } from '../chunk-2LFBQ4IS.js';
+export { I18nProvider, createTranslate, useFormatContext, useTranslate } from '../chunk-E37BYSXY.js';
+export { parseLessonSegments } from '../chunk-OKWD7LPO.js';
 export { assertUniqueSlotsPerHost } from '../chunk-O2EIWXWE.js';
-export { keyChord, mergeCaptureTables, useAgentChat, useCompile, useConnectGitHub, useDeepAgentGeneration, useDisconnectGitHub, useExtensions, useFileEditor, useFileSystem, useGitHubBranches, useGitHubRepo, useGitHubRepos, useGitHubStatus, useKeyboardRouter, useNavStack, usePreview, useRenderInterpolation, useTraitListens, useUIEvents, useValidation } from '../chunk-XUSSAWKL.js';
-export { I18nProvider, createTranslate, useFormatContext, useTranslate } from '../chunk-NCNP2RKZ.js';
 export { SharedEntityStoreContext, createSharedEntityStore, runTickFrame, useSharedEntitySnapshot, useSharedEntityStore, useSharedEntityStoreContext } from '../chunk-DQTV6QVS.js';
-export { DEFAULT_SLOTS, useUISlotManager } from '../chunk-2QB2PXOO.js';
-export { ALL_PRESETS, Accordion, Card2 as ActionCard, ActionPalette, ActionTile, ActivationBlock, Alert, AlgoGraphCanvas, AlgorithmCanvas, AnimatedCounter, AnimatedGraphic, AnimatedReveal, Aside, AssetPicker, AtlasImage, AtlasPanel, AuthLayout, Avatar, Badge, BehaviorView, BiologyCanvas, BloomQuizBlock, BranchingLogicBuilder, Breadcrumb, Button, ButtonGroup, COMPACT_MEDIA_QUERY, CalendarGrid, Canvas, Canvas2D, Card, CardBody, CardContent, CardFooter, CardGrid, CardHeader, CardTitle, Carousel, Center, ChangeList, Chart, ChartLegend, ChatBar, Checkbox, ChemistryCanvas, ChoiceButton, Coachmark, CodeBlock, CodeRunnerPanel, CollapsibleSection, CommandPalette, CommitRow, ConditionalWrapper, ConfettiEffect, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ControlButton, ControlGrid, CounterTemplate, DEFAULT_LIKERT_OPTION_KEYS, DEFAULT_MATRIX_COLUMN_KEYS, DIAMOND_TOP_Y, DashboardGrid, DashboardLayout, DataGrid, DataList, DataTable, DateRangePicker, DateRangeSelector, DayCell, DetailPanel, Dialog, DialogueBubble, Divider, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DockLayout, DocumentDetails, DocumentPanel, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, ELEMENT_SELECTED_EVENT, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmojiPicker, EmptyState, EntityDisplayEvents, ErrorBoundary, ErrorState, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureGrid, FileTree, FilterGroup, FilterPill, Flex, FlipCard, FlipContainer, FloatingActionButton, FloatingToolbar, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, FxOverlay, GameAudioContext, GameAudioCue, GameAudioProvider, GameAudioToggle, GameHud, GameIcon, GameMenu, GameShell, Gantt, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, Header, HealthBar, Icon, IconButton, IconPicker, Image, ImportPreviewTree, ImportProgress, ImportSourcePicker, InfiniteScrollSentinel, Input, InputGroup, JazariStateMachine, JsonTreeEditor, Label, LawReferenceTooltip, LearningCanvas, LearningScene3D, Lightbox, LikertScale, LineChart, List, LoadingState, MapView, MarkdownContent, MasterDetail, MasterDetailLayout, MathCanvas, MatrixQuestion, MediaGallery, Menu, Meter, Modal, ModalSlot, ModuleCard, Navigation, NodeSlotEditor, NumberStepper, OnboardingSpotlight, OptionConstraintGroup, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, PageTransition, Pagination, PatternTile, PhysicsCanvas, Popover, PositionedCanvas, ProgressBar, ProgressDots, PropertyInspector, PullToRefresh, QrScanner, QuizBlock, Radio, RangeSlider, ReflectionBlock, RelationSelect, RepeatableFormSection, ReplyTree, RichTextEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreDisplay, SearchInput, Section, SectionHeader, SegmentRenderer, Select, SequenceBar, SidePanel, Sidebar, SignaturePad, SimpleGrid, Skeleton, SlotContentRenderer, SocialProof, SortableList, Spacer, Sparkline, Spinner, Split, SplitPane, StarRating, StatBadge, StatCard, StatDisplay, StateGraph, StateJsonView, StateMachineView, StatusBar, StatusDot, SubagentTracePanel, SvgBranch, SvgConnection, SvgFlow, SvgGrid, SvgLobe, SvgMesh, SvgMorph, SvgNode, SvgPulse, SvgRing, SvgShield, SvgStack, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagInput, TerrainPalette, TextHighlight, Textarea, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TopNavItem, TraitFrame, TraitSlot, TraitStateViewer, TrendIndicator, TypewriterText, UISlotComponent, UISlotRenderer, UploadDropZone, VersionDiff, ViolationAlert, VoteStack, WizardContainer, WizardNavigation, WizardProgress, applyCompletion, applySuggestions, arrowBetween, billboardLabel, boardEntity, bool, calculateAttackTargets, calculateValidMoves, createInitialGameState, createUnitAnimationState, cylinderBetween, dispatchCommandPaletteCommand, get3DClickPayload, getCurrentFrame, getTileDimensions, inferDirection, isoToScreen, makeAsset, makeAssetMap, meshSphere, num, objAvailableActions, objAvailableEvents, objCurrentState, objIcon, objId, objMaxRules, objName, objRules, objStates, parseEditFocus, pendulum, projectileMotion, registerCodeLanguageLoader, renderPatternValue, resolveFrame, resolveSheetDirection, rows, sanitizeRichHtml, screenToIso, springOscillator, str, tickAnimationState, toCodeLanguage, transitionAnimation, unitHealth, unitPosition, unitTeam, useAnchorRect, useAtlasSliceDataUrl, useCamera, useCompactLayout, useDockLayout, useGameAudio, useGameAudioContext, useImageCache, useUnitSpriteAtlas, vec2 } from '../chunk-EERAGPBW.js';
-export { Box, HStack, Stack, VStack } from '../chunk-BHZG4PDZ.js';
-export { Typography } from '../chunk-CLSLVFSP.js';
-export { ALMADAR_DND_MIME, parseQueryBinding, useAuthContext, useCanvasGestures, useDragReorder, useDraggable, useDropZone, useInfiniteScroll, useLongPress, useMediaQuery, usePrefersReducedMotion, usePullToRefresh, useQuerySingleton, useSwipeGesture } from '../chunk-TWHYH25Q.js';
+export { DEFAULT_SLOTS, useUISlotManager } from '../chunk-VHTJRS2N.js';
+import { GridPicker, Icon, Button, FormSection, Select, ThemedPortal, Switch, Input } from '../chunk-HUG25TT3.js';
+export { ALL_PRESETS, Accordion, Card2 as ActionCard, ActionPalette, ActionTile, ActivationBlock, AgentActivityFeed, AgentActivityRow, AgentChatFeed, AgentThinkingRow, Alert, AlgoGraphCanvas, AlgorithmCanvas, AnimatedCounter, AnimatedGraphic, AnimatedReveal, Aside, AtlasImage, AtlasPanel, AuthLayout, Avatar, Badge, BehaviorView, BiologyCanvas, BloomQuizBlock, BranchingLogicBuilder, Breadcrumb, Button, ButtonGroup, COMPACT_MEDIA_QUERY, CalendarGrid, Canvas, Canvas2D, Card, CardBody, CardContent, CardFooter, CardHeader, CardTitle, Carousel, Center, ChangeList, Chart, ChartLegend, ChatBar, Checkbox, ChemistryCanvas, ChoiceButton, CodeBlock, CodeRunnerPanel, CollapsibleSection, CommandPalette, CommitRow, ConditionalWrapper, ConfettiEffect, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ControlButton, ControlGrid, CounterTemplate, DEFAULT_LIKERT_OPTION_KEYS, DEFAULT_MATRIX_COLUMN_KEYS, DIAMOND_TOP_Y, DashboardGrid, DashboardLayout, DataGrid, DataList, DateRangePicker, DateRangeSelector, DayCell, DetailPanel, Dialog, DialogueBubble, Divider, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DockLayout, DocumentDetails, DocumentPanel, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, ELEMENT_SELECTED_EVENT, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmojiPicker, EmptyState, ErrorBoundary, ErrorState, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureGrid, FileTree, FilterGroup, FilterPill, Flex, FlipCard, FlipContainer, FloatingActionButton, FloatingToolbar, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, FxOverlay, GameAudioContext, GameAudioCue, GameAudioProvider, GameAudioToggle, GameHud, GameIcon, GameMenu, GameShell, Gantt, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, Header, HealthBar, Icon, IconButton, Image, ImportPreviewTree, ImportProgress, ImportSourcePicker, InfiniteScrollSentinel, Input, InputGroup, JazariStateMachine, Label, LawReferenceTooltip, LearningCanvas, LearningScene3D, Lightbox, LikertScale, LineChart, LoadingState, MapView, MarkdownContent, MasterDetailLayout, MathCanvas, MatrixQuestion, MediaGallery, Menu, Meter, Modal, ModalSlot, ModuleCard, Navigation, NumberStepper, OptionConstraintGroup, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, PageTransition, Pagination, PatternTile, PhysicsCanvas, Popover, PositionedCanvas, ProgressBar, ProgressDots, PullToRefresh, QrScanner, QuizBlock, Radio, RangeSlider, ReflectionBlock, RelationSelect, RepeatableFormSection, ReplyTree, RichTextEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreDisplay, SearchInput, Section, SectionHeader, SegmentRenderer, Select, SequenceBar, SidePanel, Sidebar, SignaturePad, SimpleGrid, Skeleton, SkeletonTree, SlotContentRenderer, SocialProof, SortableList, Spacer, Sparkline, Spinner, Split, SplitPane, StarRating, StatBadge, StatCard, StatDisplay, StateGraph, StateJsonView, StateMachineView, StatusBar, StatusDot, SubagentTracePanel, SvgBranch, SvgConnection, SvgFlow, SvgGrid, SvgLobe, SvgMesh, SvgMorph, SvgNode, SvgPulse, SvgRing, SvgShield, SvgStack, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagInput, TerrainPalette, TextHighlight, Textarea, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TopNavItem, TraitFrame, TraitSlot, TraitStateViewer, TrendIndicator, TypewriterText, UISlotComponent, UISlotRenderer, UploadDropZone, VersionDiff, ViolationAlert, VoteStack, WizardContainer, WizardNavigation, WizardProgress, activityRowFacts, applyCompletion, applySuggestions, arrowBetween, billboardLabel, boardEntity, bool, calculateAttackTargets, calculateValidMoves, createInitialGameState, createUnitAnimationState, cylinderBetween, dispatchCommandPaletteCommand, get3DClickPayload, getCurrentFrame, getTileDimensions, groupIntoConversations, inferDirection, isoToScreen, makeAsset, makeAssetMap, meshSphere, num, objAvailableActions, objAvailableEvents, objCurrentState, objIcon, objId, objMaxRules, objName, objRules, objStates, parseEditFocus, pendulum, projectileMotion, registerCodeLanguageLoader, renderPatternValue, resolveFrame, resolveSheetDirection, rows, sanitizeRichHtml, screenToIso, springOscillator, str, tickAnimationState, toCodeLanguage, transitionAnimation, unitHealth, unitPosition, unitTeam, useAtlasSliceDataUrl, useCamera, useCompactLayout, useDockLayout, useGameAudio, useGameAudioContext, useImageCache, useUnitSpriteAtlas, vec2 } from '../chunk-HUG25TT3.js';
+import { getKnownPatterns, getPatternDefinition } from '../chunk-PQKU62LK.js';
+import { VStack, HStack, Box } from '../chunk-7LM6I3NA.js';
+export { Box, HStack, Stack, VStack } from '../chunk-7LM6I3NA.js';
+import { Typography } from '../chunk-HB4C27KU.js';
+export { Typography } from '../chunk-HB4C27KU.js';
+export { ALMADAR_DND_MIME, parseQueryBinding, useAuthContext, useCanvasGestures, useDragReorder, useDraggable, useDropZone, useInfiniteScroll, useLongPress, useMediaQuery, usePrefersReducedMotion, usePullToRefresh, useQuerySingleton, useSwipeGesture } from '../chunk-JRW33U35.js';
 export { useTapReveal } from '../chunk-XJTHMW4G.js';
 export { useEmitEvent, useEventBus, useEventListener } from '../chunk-6EV3OEBQ.js';
-export { Presence, parseLessonSegments, parseMarkdownWithCodeBlocks, usePresence } from '../chunk-G4GMXYMY.js';
+import '../chunk-PEST66PN.js';
+export { Presence, parseMarkdownWithCodeBlocks, usePresence } from '../chunk-KQXXO42S.js';
 import '../chunk-O7OLVVBR.js';
-export { cn } from '../chunk-IN3BVW2Z.js';
-import '../chunk-V5AGW2JN.js';
-import '../chunk-WB2A6V3I.js';
-import '../chunk-PQKU62LK.js';
-import '../chunk-YHY5K2Y7.js';
+import { cn, domPassthrough } from '../chunk-64WACXM7.js';
+export { cn } from '../chunk-64WACXM7.js';
+import '../chunk-QVXLKFUQ.js';
+import '../chunk-7KSLPY56.js';
 import '../chunk-QPXIAUJD.js';
+import React4, { useMemo, useCallback, useState, useEffect, useRef, useLayoutEffect } from 'react';
+import { isSecretConfigType } from '@almadar/core';
+import { useTranslate } from '@almadar/ui/hooks';
+import * as LucideIcons from 'lucide-react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+function pascalToKebab(name) {
+  return name.replace(/([a-z0-9])([A-Z])/g, "$1-$2").replace(/([A-Z])([A-Z][a-z])/g, "$1-$2").toLowerCase();
+}
+function kebabToPascal(name) {
+  return name.split("-").map((part) => /^\d+$/.test(part) ? part : part.charAt(0).toUpperCase() + part.slice(1)).join("");
+}
+var ICON_ITEMS = (() => {
+  const items = [];
+  for (const [exportName, candidate] of Object.entries(LucideIcons)) {
+    if (!/^[A-Z]/.test(exportName)) continue;
+    if (exportName.endsWith("Icon")) continue;
+    if (exportName.startsWith("Lucide")) continue;
+    const isComponent = candidate !== null && (typeof candidate === "object" || typeof candidate === "function") && "$$typeof" in candidate;
+    if (!isComponent) continue;
+    const kebab = pascalToKebab(exportName);
+    if (kebabToPascal(kebab) !== exportName) continue;
+    items.push({ id: kebab, label: kebab, category: "icons" });
+  }
+  return items;
+})();
+var IconPicker = ({ value, onChange, className }) => {
+  const { t } = useTranslate();
+  const items = useMemo(() => {
+    const category = t("iconPicker.category");
+    return ICON_ITEMS.map((item) => ({ ...item, category }));
+  }, [t]);
+  return /* @__PURE__ */ jsx(
+    GridPicker,
+    {
+      items,
+      value,
+      onChange,
+      searchPlaceholder: t("iconPicker.search"),
+      renderThumbnail: (it) => /* @__PURE__ */ jsx(Icon, { name: it.id }),
+      cellSize: 32,
+      className
+    }
+  );
+};
+IconPicker.displayName = "IconPicker";
+var THUMB_PX = 32;
+var IMAGE_KINDS = /* @__PURE__ */ new Set([
+  "image",
+  "spritesheet",
+  "scene",
+  "portrait"
+]);
+function iconForKind(kind) {
+  if (kind === "audio") return "music";
+  if (kind === "model") return "box";
+  return "file";
+}
+var AssetPicker = ({
+  assets,
+  value,
+  onChange,
+  className
+}) => {
+  const byUrl = useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const entry of assets) map.set(entry.url, entry);
+    return map;
+  }, [assets]);
+  const items = useMemo(
+    () => assets.map((entry) => ({
+      id: entry.url,
+      label: entry.name,
+      category: entry.category
+    })),
+    [assets]
+  );
+  const categories = useMemo(() => {
+    const seen = [];
+    for (const entry of assets) {
+      if (!seen.includes(entry.category)) seen.push(entry.category);
+    }
+    return seen;
+  }, [assets]);
+  const renderThumbnail = useCallback(
+    (item) => {
+      const entry = byUrl.get(item.id);
+      if (entry === void 0) return null;
+      if (IMAGE_KINDS.has(entry.kind)) {
+        return /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: entry.thumbnailUrl ?? entry.url,
+            alt: entry.name,
+            loading: "lazy",
+            width: THUMB_PX,
+            height: THUMB_PX,
+            style: { width: THUMB_PX, height: THUMB_PX, objectFit: "cover" }
+          }
+        );
+      }
+      return /* @__PURE__ */ jsx(Icon, { name: iconForKind(entry.kind), size: "sm" });
+    },
+    [byUrl]
+  );
+  return /* @__PURE__ */ jsx(
+    GridPicker,
+    {
+      items,
+      value,
+      onChange,
+      categories,
+      renderThumbnail,
+      cellSize: THUMB_PX,
+      className
+    }
+  );
+};
+AssetPicker.displayName = "AssetPicker";
+var TIER_ORDER = ["presentation", "domain", "policy", "infra", "internal"];
+var TIER_LABEL_KEYS = {
+  presentation: "propertyInspector.tier.presentation",
+  domain: "propertyInspector.tier.domain",
+  policy: "propertyInspector.tier.policy",
+  infra: "propertyInspector.tier.infra",
+  internal: "propertyInspector.tier.internal"
+};
+function currentValue(decl, override) {
+  return override !== void 0 ? override : decl.default;
+}
+function TextLikeControl({
+  field,
+  numeric,
+  secret,
+  value,
+  onCommit
+}) {
+  const initial = value === void 0 || value === null ? "" : String(value);
+  const [draft, setDraft] = React4.useState(initial);
+  React4.useEffect(() => setDraft(initial), [initial]);
+  const commit = () => {
+    if (numeric) {
+      const n = draft.trim() === "" ? 0 : Number(draft);
+      onCommit(field, Number.isNaN(n) ? 0 : n);
+    } else {
+      onCommit(field, draft);
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    Input,
+    {
+      inputType: secret ? "password" : numeric ? "number" : "text",
+      value: draft,
+      onChange: (e) => setDraft(e.target.value),
+      onBlur: commit,
+      onKeyDown: (e) => {
+        if (e.key === "Enter") commit();
+      }
+    }
+  );
+}
+var SCALAR_TYPES = /* @__PURE__ */ new Set(["string", "number", "boolean", "icon", "asset", "Asset", "secret", "event"]);
+function isTraitConfigObject(v) {
+  return v !== null && v !== void 0 && typeof v === "object" && !Array.isArray(v);
+}
+function isAssetObject(v) {
+  return isTraitConfigObject(v) && typeof v.url === "string";
+}
+function FieldControl({
+  name,
+  decl,
+  value,
+  onChange,
+  assets
+}) {
+  const { t } = useTranslate();
+  let control;
+  const stringValue = typeof value === "string" ? value : void 0;
+  const effectiveValue = value ?? decl.default;
+  if (decl.type === "icon") {
+    control = /* @__PURE__ */ jsx(IconPicker, { value: stringValue, onChange: (icon) => onChange(name, icon) });
+  } else if (decl.type === "asset") {
+    control = /* @__PURE__ */ jsx(
+      AssetPicker,
+      {
+        assets: assets ?? [],
+        value: stringValue,
+        onChange: (url) => onChange(name, url)
+      }
+    );
+  } else if (decl.type === "Asset") {
+    const assetUrl = isAssetObject(effectiveValue) ? effectiveValue.url : "";
+    const baseAsset = isAssetObject(effectiveValue) ? effectiveValue : {};
+    control = /* @__PURE__ */ jsx(
+      AssetPicker,
+      {
+        assets: assets ?? [],
+        value: assetUrl,
+        onChange: (url) => onChange(name, { ...baseAsset, url })
+      }
+    );
+  } else if (decl.type === "boolean") {
+    control = /* @__PURE__ */ jsx(Switch, { checked: value === true, onChange: (c) => onChange(name, c) });
+  } else if (decl.type === "string" && decl.values !== void 0 && decl.values.length > 0) {
+    control = /* @__PURE__ */ jsx(
+      Select,
+      {
+        options: decl.values.map((v) => ({ value: v, label: v })),
+        value: typeof value === "string" ? value : "",
+        onValueChange: (v) => onChange(name, v)
+      }
+    );
+  } else if (decl.type === "number") {
+    control = /* @__PURE__ */ jsx(TextLikeControl, { field: name, numeric: true, value, onCommit: onChange });
+  } else if (isSecretConfigType(decl.type)) {
+    control = /* @__PURE__ */ jsx(TextLikeControl, { field: name, numeric: false, secret: true, value, onCommit: onChange });
+  } else if (decl.type === "event") {
+    control = /* @__PURE__ */ jsx(TextLikeControl, { field: name, numeric: false, value, onCommit: onChange });
+  } else if (decl.type === "string") {
+    control = /* @__PURE__ */ jsx(TextLikeControl, { field: name, numeric: false, value, onCommit: onChange });
+  } else if (decl.type === "node") {
+    control = /* @__PURE__ */ jsx(NodeSlotEditor, { value: effectiveValue, onChange: (next) => onChange(name, next) });
+  } else if (decl.type.startsWith("[") || Array.isArray(effectiveValue)) {
+    const arr = Array.isArray(effectiveValue) ? effectiveValue : [];
+    control = /* @__PURE__ */ jsx(JsonTreeEditor, { value: arr, onChange: (next) => onChange(name, next) });
+  } else if (decl.type === "object" || decl.type.startsWith("Map ") || !SCALAR_TYPES.has(decl.type) && isTraitConfigObject(effectiveValue)) {
+    const obj = isTraitConfigObject(effectiveValue) ? effectiveValue : {};
+    control = /* @__PURE__ */ jsx(JsonTreeEditor, { value: obj, onChange: (next) => onChange(name, next) });
+  } else {
+    control = /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "muted", children: t("propertyInspector.editInSource", { type: decl.type }) });
+  }
+  return /* @__PURE__ */ jsxs(VStack, { gap: "xs", children: [
+    /* @__PURE__ */ jsx(Typography, { variant: "label", children: decl.label ?? name }),
+    control,
+    decl.description !== void 0 && decl.description !== "" && /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "muted", children: decl.description })
+  ] });
+}
+var PropertyInspector = ({
+  config,
+  values,
+  onChange,
+  onReset,
+  title,
+  className,
+  assets,
+  tiers
+}) => {
+  const { t } = useTranslate();
+  const allowedTiers = tiers ? new Set(tiers) : null;
+  const fields = Object.entries(config).filter(([, decl]) => {
+    if (!allowedTiers) return true;
+    return allowedTiers.has(decl.tier ?? "presentation");
+  });
+  const byTier = /* @__PURE__ */ new Map();
+  for (const [name, decl] of fields) {
+    const tier = decl.tier ?? "presentation";
+    const arr = byTier.get(tier) ?? [];
+    arr.push([name, decl]);
+    byTier.set(tier, arr);
+  }
+  const tierList = [...byTier.keys()].sort((a, b) => {
+    const ia = TIER_ORDER.indexOf(a);
+    const ib = TIER_ORDER.indexOf(b);
+    return (ia === -1 ? 99 : ia) - (ib === -1 ? 99 : ib);
+  });
+  return /* @__PURE__ */ jsxs(VStack, { gap: "sm", className: cn("w-full", className), children: [
+    /* @__PURE__ */ jsxs(HStack, { justify: "between", align: "center", children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "caption", weight: "bold", children: title ?? t("propertyInspector.config") }),
+      onReset !== void 0 && /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", icon: "rotate-ccw", label: t("common.reset"), onClick: onReset })
+    ] }),
+    fields.length === 0 && /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "muted", children: t("propertyInspector.noProperties") }),
+    tierList.map((tier) => /* @__PURE__ */ jsx(FormSection, { title: TIER_LABEL_KEYS[tier] ? t(TIER_LABEL_KEYS[tier]) : tier, collapsible: true, defaultCollapsed: tier !== "presentation", children: /* @__PURE__ */ jsx(VStack, { gap: "sm", children: byTier.get(tier)?.map(([name, decl]) => /* @__PURE__ */ jsx(
+      FieldControl,
+      {
+        name,
+        decl,
+        value: currentValue(decl, values?.[name]),
+        onChange,
+        assets
+      },
+      name
+    )) }) }, tier))
+  ] });
+};
+var isObj = (v) => v !== null && v !== void 0 && typeof v === "object" && !Array.isArray(v);
+function normalize(value) {
+  const wasArray = Array.isArray(value);
+  const pattern = wasArray ? value[0] : value;
+  const type = isObj(pattern) && typeof pattern["type"] === "string" ? pattern["type"] : "";
+  const props = {};
+  if (isObj(pattern)) {
+    for (const [k, v] of Object.entries(pattern)) if (k !== "type") props[k] = v;
+  }
+  return { type, props, wasArray };
+}
+var NodeSlotEditor = ({ value, onChange, className }) => {
+  const { t } = useTranslate();
+  const { type, props, wasArray } = normalize(value);
+  const patterns = React4.useMemo(() => {
+    try {
+      return [...getKnownPatterns()].sort();
+    } catch {
+      return [];
+    }
+  }, []);
+  const options = React4.useMemo(
+    () => [{ value: "", label: t("nodeSlot.none") }, ...patterns.map((p) => ({ value: p, label: p }))],
+    [patterns, t]
+  );
+  const emit = (nextType, nextProps) => {
+    if (!nextType) {
+      onChange(wasArray ? [] : {});
+      return;
+    }
+    const pattern = { type: nextType, ...nextProps };
+    onChange(wasArray || value === void 0 ? [pattern] : pattern);
+  };
+  const schemaEntries = React4.useMemo(() => {
+    if (!type) return [];
+    const def = getPatternDefinition(type);
+    if (!def?.propsSchema) return [];
+    return Object.entries(def.propsSchema).map(([propName, propDef]) => {
+      const decl = {
+        type: propDef.types?.[0] ?? "string",
+        description: propDef.description,
+        label: propName,
+        ...propDef.enumValues && propDef.enumValues.length > 0 ? { values: propDef.enumValues } : {}
+      };
+      return [propName, decl];
+    });
+  }, [type]);
+  const hasSchema = schemaEntries.length > 0;
+  return /* @__PURE__ */ jsxs(VStack, { gap: "xs", className: cn("w-full", className), children: [
+    /* @__PURE__ */ jsx(
+      Select,
+      {
+        options,
+        value: type,
+        onValueChange: (v) => emit(v, props)
+      }
+    ),
+    type !== "" && /* @__PURE__ */ jsxs(VStack, { gap: "none", className: "pl-1", children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "muted", children: t("nodeSlot.props") }),
+      hasSchema ? /* @__PURE__ */ jsx(VStack, { gap: "xs", children: schemaEntries.map(([propName, decl]) => /* @__PURE__ */ jsx(
+        FieldControl,
+        {
+          name: propName,
+          decl,
+          value: props[propName],
+          onChange: (field, val) => emit(type, { ...props, [field]: val })
+        },
+        propName
+      )) }) : /* @__PURE__ */ jsx(JsonTreeEditor, { value: props, onChange: (next) => emit(type, isObj(next) ? next : {}) })
+    ] })
+  ] });
+};
+var GAP = 10;
+var EDGE = 8;
+function resolveAnchorRect(anchor) {
+  if (typeof anchor === "string") {
+    return document.querySelector(anchor)?.getBoundingClientRect() ?? null;
+  }
+  if (anchor instanceof DOMRect) return anchor;
+  return anchor?.current?.getBoundingClientRect() ?? null;
+}
+function useAnchorRect(anchor, active) {
+  const [rect, setRect] = useState(null);
+  const read = useCallback(() => resolveAnchorRect(anchor), [anchor]);
+  useEffect(() => {
+    if (!active || typeof document === "undefined") {
+      setRect(null);
+      return;
+    }
+    const update = () => setRect(read());
+    update();
+    window.addEventListener("scroll", update, true);
+    window.addEventListener("resize", update);
+    let raf = 0;
+    let tries = 0;
+    const poll = () => {
+      const found = read();
+      if (found) {
+        setRect(found);
+      } else if (tries++ < 40) {
+        raf = requestAnimationFrame(poll);
+      }
+    };
+    if (!read()) raf = requestAnimationFrame(poll);
+    return () => {
+      window.removeEventListener("scroll", update, true);
+      window.removeEventListener("resize", update);
+      if (raf) cancelAnimationFrame(raf);
+    };
+  }, [active, read]);
+  return rect;
+}
+function placeCard(placement, rect, size) {
+  const vw = typeof window !== "undefined" ? window.innerWidth : 1024;
+  const vh = typeof window !== "undefined" ? window.innerHeight : 768;
+  let top = 0;
+  let left = 0;
+  switch (placement) {
+    case "top":
+      top = rect.top - size.h - GAP;
+      left = rect.left + rect.width / 2 - size.w / 2;
+      break;
+    case "left":
+      left = rect.left - size.w - GAP;
+      top = rect.top + rect.height / 2 - size.h / 2;
+      break;
+    case "right":
+      left = rect.right + GAP;
+      top = rect.top + rect.height / 2 - size.h / 2;
+      break;
+    case "bottom":
+    default:
+      top = rect.bottom + GAP;
+      left = rect.left + rect.width / 2 - size.w / 2;
+      break;
+  }
+  left = Math.max(EDGE, Math.min(left, vw - size.w - EDGE));
+  top = Math.max(EDGE, Math.min(top, vh - size.h - EDGE));
+  return { top, left };
+}
+var Coachmark = ({
+  open,
+  anchor,
+  placement = "bottom",
+  title,
+  children,
+  onDismiss,
+  onPrimary,
+  primaryLabel,
+  onSecondary,
+  secondaryLabel,
+  showBeacon = false,
+  fallbackCentered = false,
+  className,
+  ...rest
+}) => {
+  const cardRef = useRef(null);
+  const { t } = useTranslate();
+  const rect = useAnchorRect(anchor, open);
+  const [pos, setPos] = useState(null);
+  const centered = open && !rect && fallbackCentered;
+  useLayoutEffect(() => {
+    if (!open || !rect || !cardRef.current) {
+      setPos(null);
+      return;
+    }
+    const size = {
+      w: cardRef.current.offsetWidth,
+      h: cardRef.current.offsetHeight
+    };
+    setPos(placeCard(placement, rect, size));
+  }, [open, rect, placement, children, title]);
+  useEffect(() => {
+    if (!open) return;
+    const onKey = (e) => {
+      if (e.key === "Escape") onDismiss();
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [open, onDismiss]);
+  if (!open || typeof document === "undefined") return null;
+  if (!rect && !centered) return null;
+  const hasFooter = Boolean(onPrimary || onSecondary);
+  const cardStyle = centered ? { top: "50%", left: "50%", transform: "translate(-50%, -50%)" } : pos ? { top: pos.top, left: pos.left } : { top: -9999, left: -9999 };
+  const card = /* @__PURE__ */ jsxs(
+    Box,
+    {
+      ref: cardRef,
+      bg: "surface",
+      border: true,
+      rounded: "lg",
+      padding: "md",
+      ...domPassthrough(rest),
+      role: "dialog",
+      "aria-label": rest["aria-label"] ?? title,
+      className: cn(
+        "shadow-elevation-popover",
+        "fixed z-50 max-w-xs w-72 transition-opacity duration-fast",
+        centered || pos ? "opacity-100" : "opacity-0",
+        className
+      ),
+      style: cardStyle,
+      children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "ghost",
+            size: "sm",
+            icon: "close",
+            "aria-label": t("aria.dismiss"),
+            onClick: onDismiss,
+            className: "absolute top-1 right-1 text-[var(--color-muted-foreground)] hover:text-[var(--color-foreground)]"
+          }
+        ),
+        title && /* @__PURE__ */ jsx(Typography, { variant: "body1", weight: "semibold", className: "pr-6 mb-1", children: title }),
+        /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "muted", as: "div", children }),
+        hasFooter && /* @__PURE__ */ jsxs("div", { className: "mt-3 flex items-center justify-end gap-2", children: [
+          onSecondary && /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: onSecondary, children: secondaryLabel ?? t("coachmark.skip") }),
+          onPrimary && /* @__PURE__ */ jsx(Button, { variant: "primary", size: "sm", onClick: onPrimary, children: primaryLabel ?? t("coachmark.gotIt") })
+        ] })
+      ]
+    }
+  );
+  const beacon = showBeacon && rect ? /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "fixed z-50 pointer-events-none",
+      style: {
+        top: rect.top + rect.height / 2 - 6,
+        left: rect.left + rect.width / 2 - 6
+      },
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsxs("span", { className: "relative flex h-3 w-3", children: [
+        /* @__PURE__ */ jsx("span", { className: "absolute inline-flex h-full w-full animate-ping rounded-full bg-[var(--color-primary)] opacity-75" }),
+        /* @__PURE__ */ jsx("span", { className: "relative inline-flex h-3 w-3 rounded-full bg-[var(--color-primary)]" })
+      ] })
+    }
+  ) : null;
+  return /* @__PURE__ */ jsx(ThemedPortal, { children: /* @__PURE__ */ jsxs(Fragment, { children: [
+    beacon,
+    card
+  ] }) });
+};
+Coachmark.displayName = "Coachmark";
+var DIM = "fixed z-[45] bg-scrim";
+var OnboardingSpotlight = ({
+  steps,
+  stepIndex,
+  onNext,
+  onSkip,
+  onFinish,
+  cutoutPadding = 6
+}) => {
+  const { t } = useTranslate();
+  const step = steps[stepIndex];
+  const rect = useAnchorRect(step?.anchor ?? "", Boolean(step));
+  if (!step || typeof document === "undefined") return null;
+  const isLast = stepIndex >= steps.length - 1;
+  const backdrop = rect ? (() => {
+    const p = cutoutPadding;
+    const top = Math.max(0, rect.top - p);
+    const left = Math.max(0, rect.left - p);
+    const right = rect.right + p;
+    const bottom = rect.bottom + p;
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: DIM, style: { top: 0, left: 0, right: 0, height: top } }),
+      /* @__PURE__ */ jsx("div", { className: DIM, style: { top: bottom, left: 0, right: 0, bottom: 0 } }),
+      /* @__PURE__ */ jsx("div", { className: DIM, style: { top, left: 0, width: left, height: bottom - top } }),
+      /* @__PURE__ */ jsx("div", { className: DIM, style: { top, left: right, right: 0, height: bottom - top } })
+    ] });
+  })() : /* @__PURE__ */ jsx("div", { className: cn(DIM, "inset-0") });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(ThemedPortal, { children: backdrop }),
+    /* @__PURE__ */ jsxs(
+      Coachmark,
+      {
+        open: true,
+        anchor: step.anchor,
+        placement: step.placement ?? "bottom",
+        fallbackCentered: true,
+        title: step.title,
+        onDismiss: onSkip,
+        onSecondary: onSkip,
+        secondaryLabel: t("coachmark.skip"),
+        onPrimary: isLast ? onFinish : onNext,
+        primaryLabel: isLast ? t("common.done") : t("nav.next"),
+        children: [
+          /* @__PURE__ */ jsx("span", { children: step.body }),
+          /* @__PURE__ */ jsx("span", { className: "mt-3 flex items-center gap-1.5", children: steps.map((_, i) => /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "h-1.5 w-1.5 rounded-full",
+                i === stepIndex ? "bg-[var(--color-primary)]" : "bg-[var(--color-border)]"
+              )
+            },
+            i
+          )) })
+        ]
+      }
+    )
+  ] });
+};
+OnboardingSpotlight.displayName = "OnboardingSpotlight";
+
+// components/core/organisms/types.ts
+var EntityDisplayEvents = {
+  SORT: "SORT",
+  PAGINATE: "PAGINATE",
+  SEARCH: "SEARCH",
+  FILTER: "FILTER",
+  CLEAR_FILTERS: "CLEAR_FILTERS",
+  SELECT: "SELECT",
+  DESELECT: "DESELECT"
+};
+
+export { AssetPicker, Coachmark, EntityDisplayEvents, IconPicker, NodeSlotEditor, OnboardingSpotlight, PropertyInspector, useAnchorRect };