@almadar/ui 5.1.4 → 5.1.6

package/dist/avl/index.js

@@ -5909,108 +5909,315 @@ var init_iconFamily = __esm({
     };
     phosphorAliases = {
       // lucide name → phosphor PascalCase name
-      search: "MagnifyingGlass",
+      // Actions
+      plus: "Plus",
+      minus: "Minus",
+      x: "X",
+      check: "Check",
       close: "X",
-      loader: "CircleNotch",
+      edit: "PencilSimple",
+      pencil: "PencilSimple",
+      trash: "Trash",
+      save: "FloppyDisk",
+      copy: "Copy",
+      share: "Share",
+      send: "PaperPlaneRight",
+      download: "DownloadSimple",
+      upload: "UploadSimple",
+      archive: "Archive",
       refresh: "ArrowsClockwise",
-      "sort-asc": "SortAscending",
-      "sort-desc": "SortDescending",
+      loader: "CircleNotch",
+      link: "Link",
+      paperclip: "Paperclip",
+      // Navigation
       "chevron-down": "CaretDown",
       "chevron-up": "CaretUp",
       "chevron-left": "CaretLeft",
       "chevron-right": "CaretRight",
-      "help-circle": "Question",
-      "alert-triangle": "Warning",
+      "arrow-up": "ArrowUp",
+      "arrow-down": "ArrowDown",
+      "arrow-left": "ArrowLeft",
+      "arrow-right": "ArrowRight",
+      menu: "List",
+      more: "DotsThree",
+      "more-vertical": "DotsThreeVertical",
+      "more-horizontal": "DotsThree",
+      external: "ArrowSquareOut",
+      "external-link": "ArrowSquareOut",
+      // Files
+      file: "File",
+      "file-text": "FileText",
+      "file-plus": "FilePlus",
+      "file-minus": "FileMinus",
+      folder: "Folder",
+      "folder-open": "FolderOpen",
+      document: "FileText",
+      // Charts
+      "bar-chart": "ChartBar",
+      "bar-chart-2": "ChartBar",
+      "bar-chart-3": "ChartBar",
+      "line-chart": "ChartLine",
+      "pie-chart": "ChartPie",
+      activity: "Pulse",
+      "trending-up": "TrendUp",
+      "trending-down": "TrendDown",
+      // Messages
+      message: "ChatCircle",
+      "message-circle": "ChatCircle",
+      "message-square": "ChatText",
+      "messages-square": "ChatsCircle",
+      comment: "ChatCircle",
+      comments: "ChatsCircle",
+      inbox: "Tray",
+      mail: "Envelope",
+      envelope: "Envelope",
+      // Status
       "alert-circle": "WarningCircle",
+      "alert-triangle": "Warning",
       "check-circle": "CheckCircle",
       "x-circle": "XCircle",
-      edit: "PencilSimple",
-      pencil: "PencilSimple",
-      trash: "Trash",
-      send: "PaperPlaneRight",
-      external: "ArrowSquareOut",
-      "external-link": "ArrowSquareOut",
-      plus: "Plus",
-      minus: "Minus",
-      x: "X",
-      check: "Check",
-      star: "Star",
-      heart: "Heart",
-      home: "House",
+      info: "Info",
+      "help-circle": "Question",
+      "life-buoy": "Lifebuoy",
+      lifebuoy: "Lifebuoy",
+      warning: "Warning",
+      error: "WarningCircle",
+      // Media
+      image: "Image",
+      video: "VideoCamera",
+      film: "FilmStrip",
+      camera: "Camera",
+      music: "MusicNote",
+      play: "Play",
+      pause: "Pause",
+      stop: "Stop",
+      "skip-forward": "SkipForward",
+      "skip-back": "SkipBack",
+      volume: "SpeakerHigh",
+      "volume-2": "SpeakerHigh",
+      "volume-x": "SpeakerX",
+      mic: "Microphone",
+      "mic-off": "MicrophoneSlash",
+      // People
       user: "User",
       users: "Users",
-      settings: "Gear",
-      menu: "List",
-      "arrow-up": "ArrowUp",
-      "arrow-down": "ArrowDown",
-      "arrow-left": "ArrowLeft",
-      "arrow-right": "ArrowRight",
-      copy: "Copy",
-      download: "DownloadSimple",
-      upload: "UploadSimple",
-      filter: "Funnel",
+      "user-plus": "UserPlus",
+      "user-check": "UserCheck",
+      // Time
       calendar: "Calendar",
       clock: "Clock",
+      timer: "Timer",
+      // Location
+      map: "MapTrifold",
+      "map-pin": "MapPin",
+      navigation: "NavigationArrow",
+      compass: "Compass",
+      globe: "Globe",
+      target: "Target",
+      // Project / layout
+      kanban: "Kanban",
+      list: "List",
+      table: "Table",
+      grid: "GridFour",
+      layout: "Layout",
+      columns: "Columns",
+      rows: "Rows",
+      // Misc
       bell: "Bell",
-      mail: "Envelope",
-      envelope: "Envelope",
-      lock: "Lock",
-      unlock: "LockOpen",
+      bookmark: "Bookmark",
+      briefcase: "Briefcase",
+      flag: "Flag",
+      tag: "Tag",
+      tags: "Tag",
+      star: "Star",
+      heart: "Heart",
+      home: "House",
+      settings: "Gear",
       eye: "Eye",
       "eye-off": "EyeSlash",
-      more: "DotsThree",
-      "more-vertical": "DotsThreeVertical",
-      info: "Info",
-      warning: "Warning",
-      error: "WarningCircle"
+      lock: "Lock",
+      unlock: "LockOpen",
+      key: "Key",
+      shield: "Shield",
+      search: "MagnifyingGlass",
+      filter: "Funnel",
+      "sort-asc": "SortAscending",
+      "sort-desc": "SortDescending",
+      zap: "Lightning",
+      sparkles: "Sparkle",
+      // Code
+      code: "Code",
+      terminal: "Terminal",
+      database: "Database",
+      server: "HardDrives",
+      cloud: "Cloud",
+      wifi: "WifiHigh",
+      package: "Package",
+      box: "Package",
+      // Theme
+      sun: "Sun",
+      moon: "Moon",
+      // Phone
+      phone: "Phone",
+      printer: "Printer",
+      // Hierarchy
+      tree: "Tree",
+      network: "Network"
     };
     tablerAliases = {
       // lucide name → tabler suffix (after the `Icon` prefix)
-      search: "Search",
+      // Actions
+      plus: "Plus",
+      minus: "Minus",
+      x: "X",
+      check: "Check",
       close: "X",
-      loader: "Loader2",
+      edit: "Pencil",
+      pencil: "Pencil",
+      trash: "Trash",
+      save: "DeviceFloppy",
+      copy: "Copy",
+      share: "Share",
+      send: "Send",
+      download: "Download",
+      upload: "Upload",
+      archive: "Archive",
       refresh: "Refresh",
-      "sort-asc": "SortAscending",
-      "sort-desc": "SortDescending",
+      loader: "Loader2",
+      link: "Link",
+      paperclip: "Paperclip",
+      external: "ExternalLink",
+      "external-link": "ExternalLink",
+      // Navigation
       "chevron-down": "ChevronDown",
       "chevron-up": "ChevronUp",
       "chevron-left": "ChevronLeft",
       "chevron-right": "ChevronRight",
-      "help-circle": "HelpCircle",
-      "alert-triangle": "AlertTriangle",
+      "arrow-down": "ArrowDown",
+      "arrow-up": "ArrowUp",
+      "arrow-left": "ArrowLeft",
+      "arrow-right": "ArrowRight",
+      menu: "Menu2",
+      more: "Dots",
+      "more-vertical": "DotsVertical",
+      // Files
+      file: "File",
+      "file-text": "FileText",
+      "file-plus": "FilePlus",
+      "file-check": "FileCheck",
+      "file-minus": "FileMinus",
+      folder: "Folder",
+      "folder-open": "FolderOpen",
+      document: "FileText",
+      // Charts
+      "bar-chart": "ChartBar",
+      "bar-chart-2": "ChartBar",
+      "bar-chart-3": "ChartBar",
+      "line-chart": "ChartLine",
+      "pie-chart": "ChartPie",
+      activity: "Activity",
+      "trending-up": "TrendingUp",
+      "trending-down": "TrendingDown",
+      // Messages
+      message: "Message",
+      "message-circle": "MessageCircle",
+      "message-square": "Message2",
+      "messages-square": "Messages",
+      comment: "Message",
+      comments: "Messages",
+      inbox: "Inbox",
+      mail: "Mail",
+      envelope: "Mail",
+      // Status
       "alert-circle": "AlertCircle",
+      "alert-triangle": "AlertTriangle",
       "check-circle": "CircleCheck",
       "x-circle": "CircleX",
-      edit: "Pencil",
-      trash: "Trash",
-      send: "Send",
-      external: "ExternalLink",
-      plus: "Plus",
-      x: "X",
-      check: "Check",
-      star: "Star",
-      heart: "Heart",
-      home: "Home",
+      info: "InfoCircle",
+      "help-circle": "HelpCircle",
+      "life-buoy": "Lifebuoy",
+      warning: "AlertTriangle",
+      error: "AlertOctagon",
+      // Media
+      image: "Photo",
+      video: "Video",
+      camera: "Camera",
+      music: "Music",
+      play: "PlayerPlay",
+      pause: "PlayerPause",
+      stop: "PlayerStop",
+      "skip-forward": "PlayerSkipForward",
+      "skip-back": "PlayerSkipBack",
+      volume: "Volume",
+      "volume-2": "Volume",
+      "volume-x": "VolumeOff",
+      mic: "Microphone",
+      "mic-off": "MicrophoneOff",
+      // People
       user: "User",
       users: "Users",
-      settings: "Settings",
-      menu: "Menu2",
-      copy: "Copy",
-      download: "Download",
-      upload: "Upload",
-      filter: "Filter",
+      "user-plus": "UserPlus",
+      "user-check": "UserCheck",
+      // Time
       calendar: "Calendar",
       clock: "Clock",
+      timer: "Hourglass",
+      // Location
+      map: "Map",
+      "map-pin": "MapPin",
+      navigation: "Navigation",
+      compass: "Compass",
+      globe: "World",
+      target: "Target",
+      // Project / layout
+      kanban: "LayoutKanban",
+      list: "List",
+      table: "Table",
+      grid: "LayoutGrid",
+      layout: "Layout",
+      columns: "LayoutColumns",
+      rows: "LayoutRows",
+      // Misc
       bell: "Bell",
-      mail: "Mail",
-      envelope: "Mail",
-      lock: "Lock",
-      unlock: "LockOpen",
+      bookmark: "Bookmark",
+      briefcase: "Briefcase",
+      flag: "Flag",
+      tag: "Tag",
+      tags: "Tags",
+      star: "Star",
+      heart: "Heart",
+      home: "Home",
+      settings: "Settings",
       eye: "Eye",
       "eye-off": "EyeOff",
-      more: "Dots",
-      "more-vertical": "DotsVertical",
-      info: "InfoCircle"
+      lock: "Lock",
+      unlock: "LockOpen",
+      key: "Key",
+      shield: "Shield",
+      search: "Search",
+      filter: "Filter",
+      "sort-asc": "SortAscending",
+      "sort-desc": "SortDescending",
+      zap: "Bolt",
+      sparkles: "Sparkles",
+      // Code / data
+      code: "Code",
+      terminal: "Terminal",
+      database: "Database",
+      server: "Server",
+      cloud: "Cloud",
+      wifi: "Wifi",
+      package: "Package",
+      box: "Box",
+      // Theme
+      sun: "Sun",
+      moon: "Moon",
+      // Phone
+      phone: "Phone",
+      printer: "Printer",
+      // Hierarchy
+      tree: "Hierarchy",
+      network: "Network"
     };
     faAliases = {
       // lucide name → fa-solid suffix (after the `Fa` prefix).
@@ -6035,9 +6242,10 @@ var init_iconFamily = __esm({
       "check-circle": "CheckCircle",
       "x-circle": "TimesCircle",
       edit: "Edit",
-      pencil: "Pencil",
+      pencil: "PencilAlt",
       trash: "Trash",
       send: "PaperPlane",
+      share: "ShareAlt",
       external: "ExternalLinkAlt",
       plus: "Plus",
       minus: "Minus",
@@ -6047,6 +6255,8 @@ var init_iconFamily = __esm({
       home: "Home",
       user: "User",
       users: "Users",
+      "user-plus": "UserPlus",
+      "user-check": "UserCheck",
       settings: "Cog",
       menu: "Bars",
       "arrow-up": "ArrowUp",
@@ -6070,6 +6280,9 @@ var init_iconFamily = __esm({
       "more-vertical": "EllipsisV",
       info: "InfoCircle",
       warning: "ExclamationTriangle",
+      error: "ExclamationCircle",
+      // Time
+      timer: "Hourglass",
       // Files (FA renamed FileText → FileAlt)
       file: "File",
       "file-text": "FileAlt",
@@ -6128,6 +6341,7 @@ var init_iconFamily = __esm({
       music: "Music",
       play: "Play",
       pause: "Pause",
+      stop: "Stop",
       "skip-forward": "Forward",
       "skip-back": "Backward",
       volume: "VolumeUp",
@@ -6155,7 +6369,14 @@ var init_iconFamily = __esm({
       flag: "Flag",
       tag: "Tag",
       tags: "Tags",
-      zap: "Bolt"
+      zap: "Bolt",
+      sparkles: "Magic",
+      // Theme
+      sun: "Sun",
+      moon: "Moon",
+      // Hierarchy (FA has no Tree icon for hierarchies; Sitemap is the org-chart icon)
+      tree: "Sitemap",
+      network: "NetworkWired"
     };
     warned = /* @__PURE__ */ new Set();
   }
@@ -58112,9 +58333,25 @@ function detectScreenSize(viewportWidth) {
 }
 
 // components/molecules/avl/avl-preview-converter.ts
-var OVERVIEW_SPACING = 900;
-var EXPANDED_SPACING_X = 900;
-var EXPANDED_SPACING_Y = 600;
+var OVERVIEW_GAP_X = 160;
+var OVERVIEW_GAP_Y = 240;
+var EXPANDED_GAP_X = 160;
+var EXPANDED_GAP_Y = 240;
+var CARD_CHROME_Y = 120;
+function computeSpacing(screenSize = "wide") {
+  const preset = SCREEN_SIZE_PRESETS[screenSize];
+  return {
+    x: preset.width + OVERVIEW_GAP_X,
+    y: preset.minHeight + CARD_CHROME_Y + OVERVIEW_GAP_Y
+  };
+}
+function computeExpandedSpacing(screenSize = "wide") {
+  const preset = SCREEN_SIZE_PRESETS[screenSize];
+  return {
+    x: preset.width + EXPANDED_GAP_X,
+    y: preset.minHeight + CARD_CHROME_Y + EXPANDED_GAP_Y
+  };
+}
 function getOrbitals(schema) {
   return schema.orbitals ?? [];
 }
@@ -58303,12 +58540,13 @@ function extractTraitWires(orbitals, scope) {
 function findCrossLinks(orbitals) {
   return extractTraitWires(orbitals, "cross-orbital");
 }
-function schemaToOverviewGraph(schema, mockData, behaviorMeta, layoutHint, orbitalStatus) {
+function schemaToOverviewGraph(schema, mockData, behaviorMeta, layoutHint, orbitalStatus, screenSize) {
   const orbitals = getOrbitals(schema);
   const nodes = [];
   const edges = [];
   const count = orbitals.length;
   const cols = layoutHint === "pipeline" ? count : Math.ceil(Math.sqrt(count));
+  const spacing = computeSpacing(screenSize);
   for (let i = 0; i < orbitals.length; i++) {
     const orb = orbitals[i];
     const entityInfo = getEntityInfo(orb);
@@ -58368,7 +58606,7 @@ function schemaToOverviewGraph(schema, mockData, behaviorMeta, layoutHint, orbit
     nodes.push({
       id: orb.name,
       type: "preview",
-      position: { x: col * OVERVIEW_SPACING, y: row * OVERVIEW_SPACING },
+      position: { x: col * spacing.x, y: row * spacing.y },
       data: {
         orbitalName: orb.name,
         patterns: initPatterns,
@@ -58432,9 +58670,10 @@ function collectUITransitions(orbital, filter) {
   }
   return out;
 }
-function buildScreenGraph(schema, orbitalName, entityName, transitions, groupedBehaviors, mockData) {
+function buildScreenGraph(schema, orbitalName, entityName, transitions, groupedBehaviors, mockData, screenSize) {
   const nodes = [];
   const edges = [];
+  const spacing = computeExpandedSpacing(screenSize);
   const stateRepresentativeMap = /* @__PURE__ */ new Map();
   for (const entry of transitions) {
     const key = `${entry.traitName}:${entry.transition.to}`;
@@ -58460,7 +58699,7 @@ function buildScreenGraph(schema, orbitalName, entityName, transitions, groupedB
     nodes.push({
       id: nodeId,
       type: "preview",
-      position: { x: col * EXPANDED_SPACING_X, y: row * EXPANDED_SPACING_Y },
+      position: { x: col * spacing.x, y: row * spacing.y },
       data: {
         orbitalName,
         traitName: entry.traitName,
@@ -58488,7 +58727,7 @@ function buildScreenGraph(schema, orbitalName, entityName, transitions, groupedB
     nodes.push({
       id: nodeId,
       type: "preview",
-      position: { x: col * EXPANDED_SPACING_X, y: row * EXPANDED_SPACING_Y },
+      position: { x: col * spacing.x, y: row * spacing.y },
       data: {
         orbitalName,
         traitName: group.representative.traitName,
@@ -58543,7 +58782,7 @@ function buildScreenGraph(schema, orbitalName, entityName, transitions, groupedB
   }
   return { nodes, edges };
 }
-function orbitalToExpandedGraph(schema, orbitalName, mockData) {
+function orbitalToExpandedGraph(schema, orbitalName, mockData, screenSize) {
   const orbital = getOrbitals(schema).find((o) => o.name === orbitalName);
   if (!orbital) return { nodes: [], edges: [] };
   const entityInfo = getEntityInfo(orbital);
@@ -58583,10 +58822,11 @@ function orbitalToExpandedGraph(schema, orbitalName, mockData) {
     entityInfo.name,
     organismTransitions,
     groupedBehaviors,
-    mockData
+    mockData,
+    screenSize
   );
 }
-function orbitalAliasToExpandedGraph(schema, orbitalName, alias, mockData) {
+function orbitalAliasToExpandedGraph(schema, orbitalName, alias, mockData, screenSize) {
   const orbital = getOrbitals(schema).find((o) => o.name === orbitalName);
   if (!orbital) return { nodes: [], edges: [] };
   const entityInfo = getEntityInfo(orbital);
@@ -58600,7 +58840,8 @@ function orbitalAliasToExpandedGraph(schema, orbitalName, alias, mockData) {
     entityInfo.name,
     transitions,
     [],
-    mockData
+    mockData,
+    screenSize
   );
 }
 var TRAIT_CARD_SPACING_X = 480;
@@ -63219,9 +63460,9 @@ function FlowCanvasInner({
   const { composeNodes, composeEdges, overviewNodes, overviewEdges, expandedNodes, expandedEdges, behaviorExpandedNodes, behaviorExpandedEdges, traitExpandedNodes, traitExpandedEdges } = useMemo(() => {
     const t = perfStart("compose-graph");
     const compose = composeLevel === "behavior" && behaviorEntries?.length ? behaviorsToComposeGraph(behaviorEntries, behaviorWires ?? [], layoutHint) : { nodes: [], edges: [] };
-    const overview = schemaToOverviewGraph(parsedSchema, mockData, behaviorMeta, layoutHint, orbitalStatus);
-    const expanded = expandedOrbital ? orbitalToExpandedGraph(parsedSchema, expandedOrbital, mockData) : { nodes: [], edges: [] };
-    const behaviorExpanded = expandedOrbital && expandedBehaviorAlias ? orbitalAliasToExpandedGraph(parsedSchema, expandedOrbital, expandedBehaviorAlias, mockData) : { nodes: [], edges: [] };
+    const overview = schemaToOverviewGraph(parsedSchema, mockData, behaviorMeta, layoutHint, orbitalStatus, screenSize);
+    const expanded = expandedOrbital ? orbitalToExpandedGraph(parsedSchema, expandedOrbital, mockData, screenSize) : { nodes: [], edges: [] };
+    const behaviorExpanded = expandedOrbital && expandedBehaviorAlias ? orbitalAliasToExpandedGraph(parsedSchema, expandedOrbital, expandedBehaviorAlias, mockData, screenSize) : { nodes: [], edges: [] };
     const traitExpanded = expandedOrbital ? orbitalToTraitGraph(parsedSchema, expandedOrbital) : { nodes: [], edges: [] };
     perfEnd("compose-graph", t, {
       composeNodes: compose.nodes.length,
@@ -63243,7 +63484,7 @@ function FlowCanvasInner({
       traitExpandedNodes: traitExpanded.nodes,
       traitExpandedEdges: traitExpanded.edges
     };
-  }, [parsedSchema, expandedOrbital, expandedBehaviorAlias, behaviorMeta, layoutHint, composeLevel, behaviorEntries, behaviorWires, mockData, orbitalStatus]);
+  }, [parsedSchema, expandedOrbital, expandedBehaviorAlias, behaviorMeta, layoutHint, composeLevel, behaviorEntries, behaviorWires, mockData, orbitalStatus, screenSize]);
   const activeNodes = atBehaviorLevel && composeNodes.length > 0 ? composeNodes : level === "overview" ? overviewNodes : level === "behavior-expanded" ? behaviorExpandedNodes : level === "trait-expanded" ? traitExpandedNodes : expandedNodes;
   const activeEdges = atBehaviorLevel && composeEdges.length > 0 ? composeEdges : level === "overview" ? overviewEdges : level === "behavior-expanded" ? behaviorExpandedEdges : level === "trait-expanded" ? traitExpandedEdges : expandedEdges;
   const [nodes, setNodes, onNodesChange] = useNodesState(activeNodes);
@@ -63254,7 +63495,7 @@ function FlowCanvasInner({
     setNodes(activeNodes);
     setEdges(activeEdges);
     requestAnimationFrame(() => {
-      reactFlow.fitView({ duration: 300, padding: 0.15 });
+      reactFlow.fitView({ duration: 300, padding: 0.25 });
     });
   }, [activeNodes, activeEdges, setNodes, setEdges, reactFlow]);
   const visibleEdges = useMemo(() => {
@@ -63435,7 +63676,7 @@ function FlowCanvasInner({
               minZoom: 0.1,
               maxZoom: 2,
               fitView: true,
-              fitViewOptions: { padding: 0.15 },
+              fitViewOptions: { padding: 0.25 },
               nodesDraggable: true,
               elementsSelectable: true,
               proOptions: { hideAttribution: true },
@@ -63492,7 +63733,7 @@ function FlowCanvasInner({
                       onClick: () => {
                         pickScreenSize(size);
                         requestAnimationFrame(() => {
-                          reactFlow.fitView({ duration: 300, padding: 0.15 });
+                          reactFlow.fitView({ duration: 300, padding: 0.25 });
                         });
                       },
                       className: `px-2 py-1 text-[11px] font-medium rounded cursor-pointer border-none transition-colors ${active ? "bg-primary text-primary-foreground" : "bg-transparent text-muted-foreground hover:text-foreground hover:bg-muted/50"}`,