eidos-ui 0.1.0

package/dist/chunk-VFYG7GAH.js

@@ -0,0 +1,327 @@
+import {
+  Kbd
+} from "./chunk-73EKJU4G.js";
+
+// src/components/CommandPalette/CommandPalette.component.tsx
+import { useCallback, useEffect, useId, useMemo, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { ArrowDown, ArrowUp, Command, CornerDownLeft, Search } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var TRANSITION_MS = 200;
+function filterItems(items, query) {
+  const q = query.trim().toLowerCase();
+  if (!q) return items;
+  return items.filter(({ label, description, keywords }) => {
+    return label.toLowerCase().includes(q) || (description?.toLowerCase().includes(q) ?? false) || (keywords?.some((k) => k.toLowerCase().includes(q)) ?? false);
+  });
+}
+function buildGroups(items) {
+  const groups = [];
+  const groupMap = /* @__PURE__ */ new Map();
+  for (const item of items) {
+    const key = item.group ?? "";
+    let group = groupMap.get(key);
+    if (!group) {
+      group = { label: item.group ?? null, items: [] };
+      groups.push(group);
+      groupMap.set(key, group);
+    }
+    group.items.push(item);
+  }
+  return groups;
+}
+var CommandPalette = ({
+  open: openProp,
+  defaultOpen = false,
+  onClose,
+  onOpen,
+  shortcutKey = "k",
+  items,
+  onSelect,
+  placeholder = "Search commands\u2026",
+  emptyText = "No commands found",
+  maxHeight = 360,
+  className = "",
+  footer,
+  trigger,
+  triggerLabel = "Search"
+}) => {
+  const dialogId = useId();
+  const listId = `${dialogId}-list`;
+  const isControlled = openProp !== void 0;
+  const [internalOpen, setInternalOpen] = useState(defaultOpen);
+  const open = isControlled ? openProp : internalOpen;
+  const close = useCallback(() => {
+    if (!isControlled) setInternalOpen(false);
+    onClose?.();
+  }, [isControlled, onClose]);
+  const openPalette = useCallback(() => {
+    if (isControlled) {
+      onOpen?.();
+    } else {
+      setInternalOpen(true);
+    }
+  }, [isControlled, onOpen]);
+  useEffect(() => {
+    if (!shortcutKey) return;
+    const handler = (e) => {
+      if (!(e.metaKey || e.ctrlKey) || e.key.toLowerCase() !== shortcutKey.toLowerCase()) return;
+      e.preventDefault();
+      openPalette();
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, [shortcutKey, openPalette]);
+  const [isMounted, setIsMounted] = useState(open);
+  const [isVisible, setIsVisible] = useState(open);
+  useEffect(() => {
+    let raf1 = 0;
+    let raf2 = 0;
+    let timerId;
+    if (open) {
+      setIsMounted(true);
+      raf1 = requestAnimationFrame(() => {
+        raf2 = requestAnimationFrame(() => setIsVisible(true));
+      });
+    } else {
+      setIsVisible(false);
+      timerId = setTimeout(() => setIsMounted(false), TRANSITION_MS);
+    }
+    return () => {
+      cancelAnimationFrame(raf1);
+      cancelAnimationFrame(raf2);
+      clearTimeout(timerId);
+    };
+  }, [open]);
+  const [query, setQuery] = useState("");
+  const [focusedIndex, setFocusedIndex] = useState(0);
+  const inputRef = useRef(null);
+  const itemRefs = useRef(/* @__PURE__ */ new Map());
+  const filtered = useMemo(() => filterItems(items, query), [items, query]);
+  const navigable = useMemo(() => filtered.filter((item) => !item.disabled), [filtered]);
+  const groups = useMemo(() => buildGroups(filtered), [filtered]);
+  useEffect(() => {
+    if (open) {
+      setQuery("");
+      setFocusedIndex(0);
+    }
+  }, [open]);
+  useEffect(() => {
+    if (isVisible) {
+      inputRef.current?.focus();
+    }
+  }, [isVisible]);
+  useEffect(() => {
+    setFocusedIndex(0);
+  }, [query]);
+  useEffect(() => {
+    const focusedItem = navigable[focusedIndex];
+    if (!focusedItem) return;
+    itemRefs.current.get(focusedItem.id)?.scrollIntoView({ block: "nearest" });
+  }, [focusedIndex, navigable]);
+  useEffect(() => {
+    if (open) {
+      document.body.style.overflow = "hidden";
+    }
+    return () => {
+      document.body.style.overflow = "";
+    };
+  }, [open]);
+  const selectItem = useCallback(
+    (item) => {
+      if (item.disabled) return;
+      item.action?.();
+      onSelect?.(item);
+      close();
+    },
+    [close, onSelect]
+  );
+  const handleKeyDown = useCallback(
+    (e) => {
+      switch (e.key) {
+        case "ArrowDown": {
+          e.preventDefault();
+          if (navigable.length === 0) return;
+          setFocusedIndex((i) => (i + 1) % navigable.length);
+          break;
+        }
+        case "ArrowUp": {
+          e.preventDefault();
+          if (navigable.length === 0) return;
+          setFocusedIndex((i) => (i - 1 + navigable.length) % navigable.length);
+          break;
+        }
+        case "Enter": {
+          e.preventDefault();
+          const item = navigable[focusedIndex];
+          if (item) selectItem(item);
+          break;
+        }
+        case "Escape": {
+          e.preventDefault();
+          close();
+          break;
+        }
+      }
+    },
+    [focusedIndex, navigable, close, selectItem]
+  );
+  const handleBackdropClick = useCallback(
+    (e) => {
+      if (e.target === e.currentTarget) {
+        close();
+      }
+    },
+    [close]
+  );
+  const triggerNode = trigger === true ? /* @__PURE__ */ jsxs("button", { type: "button", className: "eidos-cmd-trigger-default", onClick: openPalette, children: [
+    /* @__PURE__ */ jsx("span", { children: triggerLabel }),
+    shortcutKey && /* @__PURE__ */ jsxs(Kbd, { size: "sm", className: "eidos-cmd-trigger-kbd", children: [
+      /* @__PURE__ */ jsx(Command, { size: 10 }),
+      shortcutKey.toUpperCase()
+    ] })
+  ] }) : trigger ? /* @__PURE__ */ jsx("div", { className: "eidos-cmd-trigger", role: "button", tabIndex: 0, onClick: openPalette, children: trigger }) : null;
+  if (!isMounted) return triggerNode;
+  const maxHeightValue = typeof maxHeight === "number" ? `${maxHeight}px` : maxHeight;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    triggerNode,
+    createPortal(
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: ["eidos-cmd-backdrop", isVisible && "eidos-cmd-backdrop--visible"].filter(Boolean).join(" "),
+          onClick: handleBackdropClick,
+          "aria-hidden": !open,
+          children: /* @__PURE__ */ jsxs(
+            "div",
+            {
+              role: "dialog",
+              "aria-modal": "true",
+              "aria-label": "Command palette",
+              id: dialogId,
+              className: ["eidos-cmd-dialog", isVisible && "eidos-cmd-dialog--visible", className].filter(Boolean).join(" "),
+              onKeyDown: handleKeyDown,
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "eidos-cmd-search", children: [
+                  /* @__PURE__ */ jsx(Search, { className: "eidos-cmd-search-icon", size: 18, "aria-hidden": "true" }),
+                  /* @__PURE__ */ jsx(
+                    "input",
+                    {
+                      ref: inputRef,
+                      type: "text",
+                      role: "combobox",
+                      "aria-expanded": "true",
+                      "aria-controls": listId,
+                      "aria-autocomplete": "list",
+                      "aria-label": placeholder,
+                      className: "eidos-cmd-input",
+                      placeholder,
+                      value: query,
+                      onChange: (e) => setQuery(e.target.value),
+                      spellCheck: false,
+                      autoComplete: "off"
+                    }
+                  ),
+                  shortcutKey && /* @__PURE__ */ jsxs("div", { className: "eidos-cmd-search-badge", "aria-hidden": "true", children: [
+                    /* @__PURE__ */ jsx(Command, { size: 11 }),
+                    /* @__PURE__ */ jsx("span", { children: shortcutKey.toUpperCase() })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    id: listId,
+                    role: "listbox",
+                    "aria-label": "Commands",
+                    className: "eidos-cmd-list",
+                    style: { maxHeight: maxHeightValue },
+                    children: filtered.length === 0 ? /* @__PURE__ */ jsx("p", { className: "eidos-cmd-empty", role: "status", children: emptyText }) : groups.map((group) => /* @__PURE__ */ jsxs(
+                      "div",
+                      {
+                        role: "group",
+                        "aria-label": group.label ?? void 0,
+                        children: [
+                          group.label && /* @__PURE__ */ jsx("div", { className: "eidos-cmd-group-label", "aria-hidden": "true", children: group.label }),
+                          group.items.map((item) => {
+                            const isFocused = navigable[focusedIndex]?.id === item.id;
+                            const Icon = item.icon;
+                            return /* @__PURE__ */ jsxs(
+                              "div",
+                              {
+                                ref: (el) => {
+                                  if (el) {
+                                    itemRefs.current.set(item.id, el);
+                                  } else {
+                                    itemRefs.current.delete(item.id);
+                                  }
+                                },
+                                role: "option",
+                                "aria-selected": isFocused,
+                                "aria-disabled": item.disabled,
+                                className: [
+                                  "eidos-cmd-item",
+                                  isFocused && "eidos-cmd-item--focused",
+                                  item.disabled && "eidos-cmd-item--disabled"
+                                ].filter(Boolean).join(" "),
+                                onClick: () => selectItem(item),
+                                onMouseEnter: () => {
+                                  if (!item.disabled) {
+                                    const idx = navigable.findIndex((n) => n.id === item.id);
+                                    if (idx !== -1) setFocusedIndex(idx);
+                                  }
+                                },
+                                children: [
+                                  Icon && /* @__PURE__ */ jsx("span", { className: "eidos-cmd-item-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx(Icon, { size: 16 }) }),
+                                  /* @__PURE__ */ jsxs("div", { className: "eidos-cmd-item-body", children: [
+                                    /* @__PURE__ */ jsx("div", { className: "eidos-cmd-item-label", children: item.label }),
+                                    item.description && /* @__PURE__ */ jsx("div", { className: "eidos-cmd-item-description", children: item.description })
+                                  ] }),
+                                  item.shortcut && item.shortcut.length > 0 && /* @__PURE__ */ jsx(
+                                    "div",
+                                    {
+                                      className: "eidos-cmd-item-shortcut",
+                                      "aria-label": `Shortcut: ${item.shortcut.join(" ")}`,
+                                      children: item.shortcut.map((key, i) => /* @__PURE__ */ jsx("kbd", { className: "eidos-cmd-kbd", children: key }, i))
+                                    }
+                                  )
+                                ]
+                              },
+                              item.id
+                            );
+                          })
+                        ]
+                      },
+                      group.label ?? "__ungrouped__"
+                    ))
+                  }
+                ),
+                /* @__PURE__ */ jsxs("div", { className: "eidos-cmd-footer", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "eidos-cmd-hints", "aria-hidden": "true", children: [
+                    /* @__PURE__ */ jsxs("span", { children: [
+                      /* @__PURE__ */ jsx(ArrowUp, { size: 11 }),
+                      /* @__PURE__ */ jsx(ArrowDown, { size: 11 }),
+                      " Navigate"
+                    ] }),
+                    /* @__PURE__ */ jsxs("span", { children: [
+                      /* @__PURE__ */ jsx(CornerDownLeft, { size: 11 }),
+                      " Select"
+                    ] }),
+                    /* @__PURE__ */ jsx("span", { children: "Esc Close" })
+                  ] }),
+                  footer && /* @__PURE__ */ jsx("div", { className: "eidos-cmd-footer-slot", children: footer })
+                ] })
+              ]
+            }
+          )
+        }
+      ),
+      document.body
+    )
+  ] });
+};
+CommandPalette.displayName = "CommandPalette";
+
+export {
+  CommandPalette
+};
+//# sourceMappingURL=chunk-VFYG7GAH.js.map

package/dist/chunk-VFYG7GAH.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/CommandPalette/CommandPalette.component.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';\r\nimport { createPortal } from 'react-dom';\r\nimport { ArrowDown, ArrowUp, Command, CornerDownLeft, Search } from 'lucide-react';\r\nimport type { CommandItem, CommandPaletteProps } from './CommandPalette.types';\r\nimport { Kbd } from '../Kbd';\r\nimport './CommandPalette.scss';\r\n\r\n// ── Constants ──────────────────────────────────────────────────────────────────\r\n\r\n/** Must match the CSS transition duration in CommandPalette.scss */\r\nconst TRANSITION_MS = 200;\r\n\r\n// ── Pure helpers ───────────────────────────────────────────────────────────────\r\n\r\nfunction filterItems(items: CommandItem[], query: string): CommandItem[] {\r\n  const q = query.trim().toLowerCase();\r\n  if (!q) return items;\r\n  return items.filter(({ label, description, keywords }) => {\r\n    return (\r\n      label.toLowerCase().includes(q) ||\r\n      (description?.toLowerCase().includes(q) ?? false) ||\r\n      (keywords?.some((k) => k.toLowerCase().includes(q)) ?? false)\r\n    );\r\n  });\r\n}\r\n\r\ninterface Group {\r\n  label: string | null;\r\n  items: CommandItem[];\r\n}\r\n\r\n/**\r\n * Groups items while preserving the order in which groups first appear.\r\n * Items with no `group` property are placed in a leading implicit section\r\n * (label: null) so that labelled groups always follow them.\r\n */\r\nfunction buildGroups(items: CommandItem[]): Group[] {\r\n  const groups: Group[] = [];\r\n  const groupMap = new Map<string, Group>();\r\n\r\n  for (const item of items) {\r\n    const key = item.group ?? '';\r\n    let group = groupMap.get(key);\r\n    if (!group) {\r\n      group = { label: item.group ?? null, items: [] };\r\n      groups.push(group);\r\n      groupMap.set(key, group);\r\n    }\r\n    group.items.push(item);\r\n  }\r\n\r\n  return groups;\r\n}\r\n\r\n// ── Component ──────────────────────────────────────────────────────────────────\r\n\r\nexport const CommandPalette: React.FC<CommandPaletteProps> = ({\r\n  open: openProp,\r\n  defaultOpen = false,\r\n  onClose,\r\n  onOpen,\r\n  shortcutKey = 'k',\r\n  items,\r\n  onSelect,\r\n  placeholder = 'Search commands…',\r\n  emptyText = 'No commands found',\r\n  maxHeight = 360,\r\n  className = '',\r\n  footer,\r\n  trigger,\r\n  triggerLabel = 'Search',\r\n}) => {\r\n  const dialogId = useId();\r\n  const listId = `${dialogId}-list`;\r\n\r\n  // ── Controlled / uncontrolled open state ───────────────────────────────────\r\n  // Omitting `open` lets the palette own its state entirely, which combined\r\n  // with the shortcut listener below means it needs zero external\r\n  // useState/useEffect to work. Passing `open` (+ `onClose`, optionally\r\n  // `onOpen`) keeps full external control for consumers who need it (syncing\r\n  // with a URL, another piece of app state, etc).\r\n  const isControlled = openProp !== undefined;\r\n  const [internalOpen, setInternalOpen] = useState(defaultOpen);\r\n  const open = isControlled ? (openProp as boolean) : internalOpen;\r\n\r\n  const close = useCallback(() => {\r\n    if (!isControlled) setInternalOpen(false);\r\n    onClose?.();\r\n  }, [isControlled, onClose]);\r\n\r\n  // Shared \"open\" path - uncontrolled flips the internal state directly;\r\n  // controlled defers to `onOpen` since the palette can't change `open`\r\n  // itself. Used by both the keyboard shortcut below and the inline\r\n  // `trigger`'s click handler.\r\n  const openPalette = useCallback(() => {\r\n    if (isControlled) {\r\n      onOpen?.();\r\n    } else {\r\n      setInternalOpen(true);\r\n    }\r\n  }, [isControlled, onOpen]);\r\n\r\n  // Global keyboard shortcut - Cmd/Ctrl+<shortcutKey> opens the palette.\r\n  useEffect(() => {\r\n    if (!shortcutKey) return;\r\n\r\n    const handler = (e: KeyboardEvent) => {\r\n      if (!(e.metaKey || e.ctrlKey) || e.key.toLowerCase() !== shortcutKey.toLowerCase()) return;\r\n      e.preventDefault();\r\n      openPalette();\r\n    };\r\n\r\n    window.addEventListener('keydown', handler);\r\n    return () => window.removeEventListener('keydown', handler);\r\n  }, [shortcutKey, openPalette]);\r\n\r\n  // ── Animation state machine (mirrors the Drawer pattern) ─────────────────\r\n  // isMounted → portal exists in the DOM (controls render/null)\r\n  // isVisible → CSS --visible modifier is applied (drives transitions)\r\n  //\r\n  // Opening:  isMounted=true → double rAF → isVisible=true  → CSS transitions fire\r\n  // Closing:  isVisible=false → CSS transitions reverse → after TRANSITION_MS → isMounted=false\r\n  const [isMounted, setIsMounted] = useState(open);\r\n  const [isVisible, setIsVisible] = useState(open);\r\n\r\n  useEffect(() => {\r\n    let raf1 = 0;\r\n    let raf2 = 0;\r\n    let timerId: ReturnType<typeof setTimeout>;\r\n\r\n    if (open) {\r\n      setIsMounted(true);\r\n      // Double rAF: ensures the browser has painted the initial off-screen\r\n      // state before the CSS transition begins (React 18 automatic batching\r\n      // means a single rAF is not always sufficient).\r\n      raf1 = requestAnimationFrame(() => {\r\n        raf2 = requestAnimationFrame(() => setIsVisible(true));\r\n      });\r\n    } else {\r\n      setIsVisible(false);\r\n      timerId = setTimeout(() => setIsMounted(false), TRANSITION_MS);\r\n    }\r\n\r\n    return () => {\r\n      cancelAnimationFrame(raf1);\r\n      cancelAnimationFrame(raf2);\r\n      clearTimeout(timerId);\r\n    };\r\n  }, [open]);\r\n\r\n  // ── Search state ───────────────────────────────────────────────────────────\r\n  const [query, setQuery] = useState('');\r\n  const [focusedIndex, setFocusedIndex] = useState(0);\r\n\r\n  const inputRef = useRef<HTMLInputElement>(null);\r\n  const itemRefs = useRef<Map<string, HTMLDivElement>>(new Map());\r\n\r\n  // Derived lists - memoised to stabilise scroll-effect deps\r\n  const filtered = useMemo(() => filterItems(items, query), [items, query]);\r\n  const navigable = useMemo(() => filtered.filter((item) => !item.disabled), [filtered]);\r\n  const groups = useMemo(() => buildGroups(filtered), [filtered]);\r\n\r\n  // Reset search query and selection when the palette is opened\r\n  useEffect(() => {\r\n    if (open) {\r\n      setQuery('');\r\n      setFocusedIndex(0);\r\n    }\r\n  }, [open]);\r\n\r\n  // Auto-focus the search input after the entry animation begins\r\n  useEffect(() => {\r\n    if (isVisible) {\r\n      inputRef.current?.focus();\r\n    }\r\n  }, [isVisible]);\r\n\r\n  // Reset focused index to 0 whenever the filtered list changes\r\n  useEffect(() => {\r\n    setFocusedIndex(0);\r\n  }, [query]);\r\n\r\n  // Scroll the focused item into view during keyboard navigation\r\n  useEffect(() => {\r\n    const focusedItem = navigable[focusedIndex];\r\n    if (!focusedItem) return;\r\n    itemRefs.current.get(focusedItem.id)?.scrollIntoView({ block: 'nearest' });\r\n  }, [focusedIndex, navigable]);\r\n\r\n  // Body scroll lock (tied to open, not to isMounted, so it releases promptly\r\n  // when the consumer decides to close - even before the exit animation ends)\r\n  useEffect(() => {\r\n    if (open) {\r\n      document.body.style.overflow = 'hidden';\r\n    }\r\n    return () => {\r\n      document.body.style.overflow = '';\r\n    };\r\n  }, [open]);\r\n\r\n  // ── Interaction handlers ───────────────────────────────────────────────────\r\n\r\n  const selectItem = useCallback(\r\n    (item: CommandItem) => {\r\n      if (item.disabled) return;\r\n      item.action?.();\r\n      onSelect?.(item);\r\n      close();\r\n    },\r\n    [close, onSelect],\r\n  );\r\n\r\n  const handleKeyDown = useCallback(\r\n    (e: React.KeyboardEvent) => {\r\n      switch (e.key) {\r\n        case 'ArrowDown': {\r\n          e.preventDefault();\r\n          if (navigable.length === 0) return;\r\n          setFocusedIndex((i) => (i + 1) % navigable.length);\r\n          break;\r\n        }\r\n        case 'ArrowUp': {\r\n          e.preventDefault();\r\n          if (navigable.length === 0) return;\r\n          setFocusedIndex((i) => (i - 1 + navigable.length) % navigable.length);\r\n          break;\r\n        }\r\n        case 'Enter': {\r\n          e.preventDefault();\r\n          const item = navigable[focusedIndex];\r\n          if (item) selectItem(item);\r\n          break;\r\n        }\r\n        case 'Escape': {\r\n          e.preventDefault();\r\n          close();\r\n          break;\r\n        }\r\n      }\r\n    },\r\n    [focusedIndex, navigable, close, selectItem],\r\n  );\r\n\r\n  const handleBackdropClick = useCallback(\r\n    (e: React.MouseEvent<HTMLDivElement>) => {\r\n      // Only fire when the click lands directly on the backdrop element,\r\n      // not on any child (the dialog itself or its contents).\r\n      if (e.target === e.currentTarget) {\r\n        close();\r\n      }\r\n    },\r\n    [close],\r\n  );\r\n\r\n  // ── Render ─────────────────────────────────────────────────────────────────\r\n\r\n  // The inline trigger (if any) must render regardless of `isMounted` - it's\r\n  // what opens the palette in the first place, so it can't be gated behind\r\n  // the portal's own mount state.\r\n  const triggerNode =\r\n    trigger === true ? (\r\n      <button type=\"button\" className=\"eidos-cmd-trigger-default\" onClick={openPalette}>\r\n        <span>{triggerLabel}</span>\r\n        {shortcutKey && (\r\n          <Kbd size=\"sm\" className=\"eidos-cmd-trigger-kbd\">\r\n            <Command size={10} />\r\n            {shortcutKey.toUpperCase()}\r\n          </Kbd>\r\n        )}\r\n      </button>\r\n    ) : trigger ? (\r\n      <div className=\"eidos-cmd-trigger\" role=\"button\" tabIndex={0} onClick={openPalette}>\r\n        {trigger}\r\n      </div>\r\n    ) : null;\r\n\r\n  if (!isMounted) return triggerNode;\r\n\r\n  const maxHeightValue = typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight;\r\n\r\n  return (\r\n    <>\r\n      {triggerNode}\r\n      {createPortal(\r\n        <div\r\n          className={['eidos-cmd-backdrop', isVisible && 'eidos-cmd-backdrop--visible']\r\n            .filter(Boolean)\r\n            .join(' ')}\r\n          onClick={handleBackdropClick}\r\n          aria-hidden={!open}\r\n        >\r\n          <div\r\n            role=\"dialog\"\r\n            aria-modal=\"true\"\r\n            aria-label=\"Command palette\"\r\n            id={dialogId}\r\n            className={['eidos-cmd-dialog', isVisible && 'eidos-cmd-dialog--visible', className]\r\n              .filter(Boolean)\r\n              .join(' ')}\r\n            onKeyDown={handleKeyDown}\r\n          >\r\n            {/* ── Search ──────────────────────────────────────────────────────── */}\r\n            <div className=\"eidos-cmd-search\">\r\n              <Search className=\"eidos-cmd-search-icon\" size={18} aria-hidden=\"true\" />\r\n\r\n              <input\r\n                ref={inputRef}\r\n                type=\"text\"\r\n                role=\"combobox\"\r\n                aria-expanded=\"true\"\r\n                aria-controls={listId}\r\n                aria-autocomplete=\"list\"\r\n                aria-label={placeholder}\r\n                className=\"eidos-cmd-input\"\r\n                placeholder={placeholder}\r\n                value={query}\r\n                onChange={(e) => setQuery(e.target.value)}\r\n                spellCheck={false}\r\n                autoComplete=\"off\"\r\n              />\r\n\r\n              {/* Reminds users of the configured shortcut, if any */}\r\n              {shortcutKey && (\r\n                <div className=\"eidos-cmd-search-badge\" aria-hidden=\"true\">\r\n                  <Command size={11} />\r\n                  <span>{shortcutKey.toUpperCase()}</span>\r\n                </div>\r\n              )}\r\n            </div>\r\n\r\n            {/* ── Results list ─────────────────────────────────────────────────── */}\r\n            <div\r\n              id={listId}\r\n              role=\"listbox\"\r\n              aria-label=\"Commands\"\r\n              className=\"eidos-cmd-list\"\r\n              style={{ maxHeight: maxHeightValue }}\r\n            >\r\n              {filtered.length === 0 ? (\r\n                <p className=\"eidos-cmd-empty\" role=\"status\">\r\n                  {emptyText}\r\n                </p>\r\n              ) : (\r\n                groups.map((group) => (\r\n                  <div\r\n                    key={group.label ?? '__ungrouped__'}\r\n                    role=\"group\"\r\n                    aria-label={group.label ?? undefined}\r\n                  >\r\n                    {group.label && (\r\n                      <div className=\"eidos-cmd-group-label\" aria-hidden=\"true\">\r\n                        {group.label}\r\n                      </div>\r\n                    )}\r\n\r\n                    {group.items.map((item) => {\r\n                      const isFocused = navigable[focusedIndex]?.id === item.id;\r\n                      const Icon = item.icon;\r\n\r\n                      return (\r\n                        <div\r\n                          key={item.id}\r\n                          ref={(el) => {\r\n                            if (el) {\r\n                              itemRefs.current.set(item.id, el);\r\n                            } else {\r\n                              itemRefs.current.delete(item.id);\r\n                            }\r\n                          }}\r\n                          role=\"option\"\r\n                          aria-selected={isFocused}\r\n                          aria-disabled={item.disabled}\r\n                          className={[\r\n                            'eidos-cmd-item',\r\n                            isFocused && 'eidos-cmd-item--focused',\r\n                            item.disabled && 'eidos-cmd-item--disabled',\r\n                          ]\r\n                            .filter(Boolean)\r\n                            .join(' ')}\r\n                          onClick={() => selectItem(item)}\r\n                          onMouseEnter={() => {\r\n                            if (!item.disabled) {\r\n                              const idx = navigable.findIndex((n) => n.id === item.id);\r\n                              if (idx !== -1) setFocusedIndex(idx);\r\n                            }\r\n                          }}\r\n                        >\r\n                          {Icon && (\r\n                            <span className=\"eidos-cmd-item-icon\" aria-hidden=\"true\">\r\n                              <Icon size={16} />\r\n                            </span>\r\n                          )}\r\n\r\n                          <div className=\"eidos-cmd-item-body\">\r\n                            <div className=\"eidos-cmd-item-label\">{item.label}</div>\r\n                            {item.description && (\r\n                              <div className=\"eidos-cmd-item-description\">{item.description}</div>\r\n                            )}\r\n                          </div>\r\n\r\n                          {item.shortcut && item.shortcut.length > 0 && (\r\n                            <div\r\n                              className=\"eidos-cmd-item-shortcut\"\r\n                              aria-label={`Shortcut: ${item.shortcut.join(' ')}`}\r\n                            >\r\n                              {item.shortcut.map((key, i) => (\r\n                                <kbd key={i} className=\"eidos-cmd-kbd\">\r\n                                  {key}\r\n                                </kbd>\r\n                              ))}\r\n                            </div>\r\n                          )}\r\n                        </div>\r\n                      );\r\n                    })}\r\n                  </div>\r\n                ))\r\n              )}\r\n            </div>\r\n\r\n            {/* ── Footer ───────────────────────────────────────────────────────── */}\r\n            <div className=\"eidos-cmd-footer\">\r\n              <div className=\"eidos-cmd-hints\" aria-hidden=\"true\">\r\n                <span>\r\n                  <ArrowUp size={11} />\r\n                  <ArrowDown size={11} /> Navigate\r\n                </span>\r\n                <span>\r\n                  <CornerDownLeft size={11} /> Select\r\n                </span>\r\n                <span>Esc Close</span>\r\n              </div>\r\n\r\n              {footer && <div className=\"eidos-cmd-footer-slot\">{footer}</div>}\r\n            </div>\r\n          </div>\r\n        </div>,\r\n        document.body,\r\n      )}\r\n    </>\r\n  );\r\n};\r\n\r\nCommandPalette.displayName = 'CommandPalette';\r\n"],"mappings":";;;;;AAAA,SAAgB,aAAa,WAAW,OAAO,SAAS,QAAQ,gBAAgB;AAChF,SAAS,oBAAoB;AAC7B,SAAS,WAAW,SAAS,SAAS,gBAAgB,cAAc;AAoQ5D,SAmBJ,UAnBI,KAEE,YAFF;AA5PR,IAAM,gBAAgB;AAItB,SAAS,YAAY,OAAsB,OAA8B;AACvE,QAAM,IAAI,MAAM,KAAK,EAAE,YAAY;AACnC,MAAI,CAAC,EAAG,QAAO;AACf,SAAO,MAAM,OAAO,CAAC,EAAE,OAAO,aAAa,SAAS,MAAM;AACxD,WACE,MAAM,YAAY,EAAE,SAAS,CAAC,MAC7B,aAAa,YAAY,EAAE,SAAS,CAAC,KAAK,WAC1C,UAAU,KAAK,CAAC,MAAM,EAAE,YAAY,EAAE,SAAS,CAAC,CAAC,KAAK;AAAA,EAE3D,CAAC;AACH;AAYA,SAAS,YAAY,OAA+B;AAClD,QAAM,SAAkB,CAAC;AACzB,QAAM,WAAW,oBAAI,IAAmB;AAExC,aAAW,QAAQ,OAAO;AACxB,UAAM,MAAM,KAAK,SAAS;AAC1B,QAAI,QAAQ,SAAS,IAAI,GAAG;AAC5B,QAAI,CAAC,OAAO;AACV,cAAQ,EAAE,OAAO,KAAK,SAAS,MAAM,OAAO,CAAC,EAAE;AAC/C,aAAO,KAAK,KAAK;AACjB,eAAS,IAAI,KAAK,KAAK;AAAA,IACzB;AACA,UAAM,MAAM,KAAK,IAAI;AAAA,EACvB;AAEA,SAAO;AACT;AAIO,IAAM,iBAAgD,CAAC;AAAA,EAC5D,MAAM;AAAA,EACN,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA,eAAe;AACjB,MAAM;AACJ,QAAM,WAAW,MAAM;AACvB,QAAM,SAAS,GAAG,QAAQ;AAQ1B,QAAM,eAAe,aAAa;AAClC,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,WAAW;AAC5D,QAAM,OAAO,eAAgB,WAAuB;AAEpD,QAAM,QAAQ,YAAY,MAAM;AAC9B,QAAI,CAAC,aAAc,iBAAgB,KAAK;AACxC,cAAU;AAAA,EACZ,GAAG,CAAC,cAAc,OAAO,CAAC;AAM1B,QAAM,cAAc,YAAY,MAAM;AACpC,QAAI,cAAc;AAChB,eAAS;AAAA,IACX,OAAO;AACL,sBAAgB,IAAI;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,cAAc,MAAM,CAAC;AAGzB,YAAU,MAAM;AACd,QAAI,CAAC,YAAa;AAElB,UAAM,UAAU,CAAC,MAAqB;AACpC,UAAI,EAAE,EAAE,WAAW,EAAE,YAAY,EAAE,IAAI,YAAY,MAAM,YAAY,YAAY,EAAG;AACpF,QAAE,eAAe;AACjB,kBAAY;AAAA,IACd;AAEA,WAAO,iBAAiB,WAAW,OAAO;AAC1C,WAAO,MAAM,OAAO,oBAAoB,WAAW,OAAO;AAAA,EAC5D,GAAG,CAAC,aAAa,WAAW,CAAC;AAQ7B,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,IAAI;AAC/C,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,IAAI;AAE/C,YAAU,MAAM;AACd,QAAI,OAAO;AACX,QAAI,OAAO;AACX,QAAI;AAEJ,QAAI,MAAM;AACR,mBAAa,IAAI;AAIjB,aAAO,sBAAsB,MAAM;AACjC,eAAO,sBAAsB,MAAM,aAAa,IAAI,CAAC;AAAA,MACvD,CAAC;AAAA,IACH,OAAO;AACL,mBAAa,KAAK;AAClB,gBAAU,WAAW,MAAM,aAAa,KAAK,GAAG,aAAa;AAAA,IAC/D;AAEA,WAAO,MAAM;AACX,2BAAqB,IAAI;AACzB,2BAAqB,IAAI;AACzB,mBAAa,OAAO;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,IAAI,CAAC;AAGT,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,EAAE;AACrC,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,CAAC;AAElD,QAAM,WAAW,OAAyB,IAAI;AAC9C,QAAM,WAAW,OAAoC,oBAAI,IAAI,CAAC;AAG9D,QAAM,WAAW,QAAQ,MAAM,YAAY,OAAO,KAAK,GAAG,CAAC,OAAO,KAAK,CAAC;AACxE,QAAM,YAAY,QAAQ,MAAM,SAAS,OAAO,CAAC,SAAS,CAAC,KAAK,QAAQ,GAAG,CAAC,QAAQ,CAAC;AACrF,QAAM,SAAS,QAAQ,MAAM,YAAY,QAAQ,GAAG,CAAC,QAAQ,CAAC;AAG9D,YAAU,MAAM;AACd,QAAI,MAAM;AACR,eAAS,EAAE;AACX,sBAAgB,CAAC;AAAA,IACnB;AAAA,EACF,GAAG,CAAC,IAAI,CAAC;AAGT,YAAU,MAAM;AACd,QAAI,WAAW;AACb,eAAS,SAAS,MAAM;AAAA,IAC1B;AAAA,EACF,GAAG,CAAC,SAAS,CAAC;AAGd,YAAU,MAAM;AACd,oBAAgB,CAAC;AAAA,EACnB,GAAG,CAAC,KAAK,CAAC;AAGV,YAAU,MAAM;AACd,UAAM,cAAc,UAAU,YAAY;AAC1C,QAAI,CAAC,YAAa;AAClB,aAAS,QAAQ,IAAI,YAAY,EAAE,GAAG,eAAe,EAAE,OAAO,UAAU,CAAC;AAAA,EAC3E,GAAG,CAAC,cAAc,SAAS,CAAC;AAI5B,YAAU,MAAM;AACd,QAAI,MAAM;AACR,eAAS,KAAK,MAAM,WAAW;AAAA,IACjC;AACA,WAAO,MAAM;AACX,eAAS,KAAK,MAAM,WAAW;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,IAAI,CAAC;AAIT,QAAM,aAAa;AAAA,IACjB,CAAC,SAAsB;AACrB,UAAI,KAAK,SAAU;AACnB,WAAK,SAAS;AACd,iBAAW,IAAI;AACf,YAAM;AAAA,IACR;AAAA,IACA,CAAC,OAAO,QAAQ;AAAA,EAClB;AAEA,QAAM,gBAAgB;AAAA,IACpB,CAAC,MAA2B;AAC1B,cAAQ,EAAE,KAAK;AAAA,QACb,KAAK,aAAa;AAChB,YAAE,eAAe;AACjB,cAAI,UAAU,WAAW,EAAG;AAC5B,0BAAgB,CAAC,OAAO,IAAI,KAAK,UAAU,MAAM;AACjD;AAAA,QACF;AAAA,QACA,KAAK,WAAW;AACd,YAAE,eAAe;AACjB,cAAI,UAAU,WAAW,EAAG;AAC5B,0BAAgB,CAAC,OAAO,IAAI,IAAI,UAAU,UAAU,UAAU,MAAM;AACpE;AAAA,QACF;AAAA,QACA,KAAK,SAAS;AACZ,YAAE,eAAe;AACjB,gBAAM,OAAO,UAAU,YAAY;AACnC,cAAI,KAAM,YAAW,IAAI;AACzB;AAAA,QACF;AAAA,QACA,KAAK,UAAU;AACb,YAAE,eAAe;AACjB,gBAAM;AACN;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,cAAc,WAAW,OAAO,UAAU;AAAA,EAC7C;AAEA,QAAM,sBAAsB;AAAA,IAC1B,CAAC,MAAwC;AAGvC,UAAI,EAAE,WAAW,EAAE,eAAe;AAChC,cAAM;AAAA,MACR;AAAA,IACF;AAAA,IACA,CAAC,KAAK;AAAA,EACR;AAOA,QAAM,cACJ,YAAY,OACV,qBAAC,YAAO,MAAK,UAAS,WAAU,6BAA4B,SAAS,aACnE;AAAA,wBAAC,UAAM,wBAAa;AAAA,IACnB,eACC,qBAAC,OAAI,MAAK,MAAK,WAAU,yBACvB;AAAA,0BAAC,WAAQ,MAAM,IAAI;AAAA,MAClB,YAAY,YAAY;AAAA,OAC3B;AAAA,KAEJ,IACE,UACF,oBAAC,SAAI,WAAU,qBAAoB,MAAK,UAAS,UAAU,GAAG,SAAS,aACpE,mBACH,IACE;AAEN,MAAI,CAAC,UAAW,QAAO;AAEvB,QAAM,iBAAiB,OAAO,cAAc,WAAW,GAAG,SAAS,OAAO;AAE1E,SACE,iCACG;AAAA;AAAA,IACA;AAAA,MACC;AAAA,QAAC;AAAA;AAAA,UACC,WAAW,CAAC,sBAAsB,aAAa,6BAA6B,EACzE,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,UACX,SAAS;AAAA,UACT,eAAa,CAAC;AAAA,UAEd;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,cAAW;AAAA,cACX,cAAW;AAAA,cACX,IAAI;AAAA,cACJ,WAAW,CAAC,oBAAoB,aAAa,6BAA6B,SAAS,EAChF,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,cACX,WAAW;AAAA,cAGX;AAAA,qCAAC,SAAI,WAAU,oBACb;AAAA,sCAAC,UAAO,WAAU,yBAAwB,MAAM,IAAI,eAAY,QAAO;AAAA,kBAEvE;AAAA,oBAAC;AAAA;AAAA,sBACC,KAAK;AAAA,sBACL,MAAK;AAAA,sBACL,MAAK;AAAA,sBACL,iBAAc;AAAA,sBACd,iBAAe;AAAA,sBACf,qBAAkB;AAAA,sBAClB,cAAY;AAAA,sBACZ,WAAU;AAAA,sBACV;AAAA,sBACA,OAAO;AAAA,sBACP,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,sBACxC,YAAY;AAAA,sBACZ,cAAa;AAAA;AAAA,kBACf;AAAA,kBAGC,eACC,qBAAC,SAAI,WAAU,0BAAyB,eAAY,QAClD;AAAA,wCAAC,WAAQ,MAAM,IAAI;AAAA,oBACnB,oBAAC,UAAM,sBAAY,YAAY,GAAE;AAAA,qBACnC;AAAA,mBAEJ;AAAA,gBAGA;AAAA,kBAAC;AAAA;AAAA,oBACC,IAAI;AAAA,oBACJ,MAAK;AAAA,oBACL,cAAW;AAAA,oBACX,WAAU;AAAA,oBACV,OAAO,EAAE,WAAW,eAAe;AAAA,oBAElC,mBAAS,WAAW,IACnB,oBAAC,OAAE,WAAU,mBAAkB,MAAK,UACjC,qBACH,IAEA,OAAO,IAAI,CAAC,UACV;AAAA,sBAAC;AAAA;AAAA,wBAEC,MAAK;AAAA,wBACL,cAAY,MAAM,SAAS;AAAA,wBAE1B;AAAA,gCAAM,SACL,oBAAC,SAAI,WAAU,yBAAwB,eAAY,QAChD,gBAAM,OACT;AAAA,0BAGD,MAAM,MAAM,IAAI,CAAC,SAAS;AACzB,kCAAM,YAAY,UAAU,YAAY,GAAG,OAAO,KAAK;AACvD,kCAAM,OAAO,KAAK;AAElB,mCACE;AAAA,8BAAC;AAAA;AAAA,gCAEC,KAAK,CAAC,OAAO;AACX,sCAAI,IAAI;AACN,6CAAS,QAAQ,IAAI,KAAK,IAAI,EAAE;AAAA,kCAClC,OAAO;AACL,6CAAS,QAAQ,OAAO,KAAK,EAAE;AAAA,kCACjC;AAAA,gCACF;AAAA,gCACA,MAAK;AAAA,gCACL,iBAAe;AAAA,gCACf,iBAAe,KAAK;AAAA,gCACpB,WAAW;AAAA,kCACT;AAAA,kCACA,aAAa;AAAA,kCACb,KAAK,YAAY;AAAA,gCACnB,EACG,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,gCACX,SAAS,MAAM,WAAW,IAAI;AAAA,gCAC9B,cAAc,MAAM;AAClB,sCAAI,CAAC,KAAK,UAAU;AAClB,0CAAM,MAAM,UAAU,UAAU,CAAC,MAAM,EAAE,OAAO,KAAK,EAAE;AACvD,wCAAI,QAAQ,GAAI,iBAAgB,GAAG;AAAA,kCACrC;AAAA,gCACF;AAAA,gCAEC;AAAA,0CACC,oBAAC,UAAK,WAAU,uBAAsB,eAAY,QAChD,8BAAC,QAAK,MAAM,IAAI,GAClB;AAAA,kCAGF,qBAAC,SAAI,WAAU,uBACb;AAAA,wDAAC,SAAI,WAAU,wBAAwB,eAAK,OAAM;AAAA,oCACjD,KAAK,eACJ,oBAAC,SAAI,WAAU,8BAA8B,eAAK,aAAY;AAAA,qCAElE;AAAA,kCAEC,KAAK,YAAY,KAAK,SAAS,SAAS,KACvC;AAAA,oCAAC;AAAA;AAAA,sCACC,WAAU;AAAA,sCACV,cAAY,aAAa,KAAK,SAAS,KAAK,GAAG,CAAC;AAAA,sCAE/C,eAAK,SAAS,IAAI,CAAC,KAAK,MACvB,oBAAC,SAAY,WAAU,iBACpB,iBADO,CAEV,CACD;AAAA;AAAA,kCACH;AAAA;AAAA;AAAA,8BAjDG,KAAK;AAAA,4BAmDZ;AAAA,0BAEJ,CAAC;AAAA;AAAA;AAAA,sBArEI,MAAM,SAAS;AAAA,oBAsEtB,CACD;AAAA;AAAA,gBAEL;AAAA,gBAGA,qBAAC,SAAI,WAAU,oBACb;AAAA,uCAAC,SAAI,WAAU,mBAAkB,eAAY,QAC3C;AAAA,yCAAC,UACC;AAAA,0CAAC,WAAQ,MAAM,IAAI;AAAA,sBACnB,oBAAC,aAAU,MAAM,IAAI;AAAA,sBAAE;AAAA,uBACzB;AAAA,oBACA,qBAAC,UACC;AAAA,0CAAC,kBAAe,MAAM,IAAI;AAAA,sBAAE;AAAA,uBAC9B;AAAA,oBACA,oBAAC,UAAK,uBAAS;AAAA,qBACjB;AAAA,kBAEC,UAAU,oBAAC,SAAI,WAAU,yBAAyB,kBAAO;AAAA,mBAC5D;AAAA;AAAA;AAAA,UACF;AAAA;AAAA,MACF;AAAA,MACA,SAAS;AAAA,IACX;AAAA,KACF;AAEJ;AAEA,eAAe,cAAc;","names":[]}

package/dist/chunk-VGYJ4VKX.cjs

@@ -0,0 +1,62 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+var _chunk3KAR5KCScjs = require('./chunk-3KAR5KCS.cjs');
+
+
+var _chunkMSQXPGODcjs = require('./chunk-MSQXPGOD.cjs');
+
+
+var _chunkQP2A5ZMKcjs = require('./chunk-QP2A5ZMK.cjs');
+
+
+var _chunkSOGUWOSQcjs = require('./chunk-SOGUWOSQ.cjs');
+
+// src/components/PageLayout/PageLayout.component.tsx
+var _jsxruntime = require('react/jsx-runtime');
+var defaultFooter = { copyright: `\xA9 ${(/* @__PURE__ */ new Date()).getFullYear()} Eidos UI` };
+var PageLayout = ({
+  toolbar,
+  navigation,
+  header,
+  footer,
+  children,
+  className = "",
+  ...rest
+}) => {
+  const classes = ["eidos-pagelayout", className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: classes, ...rest, children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunk3KAR5KCScjs.Toolbar,
+      {
+        breadcrumbs: _optionalChain([toolbar, 'optionalAccess', _ => _.breadcrumbs]) || { items: [], separator: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, {}) },
+        cmdPaletteItems: _optionalChain([toolbar, 'optionalAccess', _2 => _2.cmdPaletteItems]) || [],
+        actions: _optionalChain([toolbar, 'optionalAccess', _3 => _3.actions]) || [],
+        userMenu: _optionalChain([toolbar, 'optionalAccess', _4 => _4.userMenu]) || [],
+        className: "eidos-pagelayout__toolbar"
+      }
+    ),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "eidos-pagelayout__navigation", children: navigation && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkMSQXPGODcjs.Navigation, { ...navigation }) }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "main", { className: "eidos-pagelayout__content", children: [
+      header && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkSOGUWOSQcjs.Header,
+        {
+          ...header,
+          className: ["eidos-pagelayout__header", header.className].filter(Boolean).join(" ")
+        }
+      ),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "eidos-pagelayout__body", children }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkQP2A5ZMKcjs.Footer,
+        {
+          ..._nullishCoalesce(footer, () => ( defaultFooter)),
+          className: ["eidos-pagelayout__footer", _optionalChain([footer, 'optionalAccess', _5 => _5.className])].filter(Boolean).join(" ")
+        }
+      )
+    ] })
+  ] });
+};
+
+
+
+exports.PageLayout = PageLayout;
+//# sourceMappingURL=chunk-VGYJ4VKX.cjs.map

package/dist/chunk-VGYJ4VKX.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/pedromealha/Documents/Repositories/Personal/eidos-ui/dist/chunk-VGYJ4VKX.cjs","../src/components/PageLayout/PageLayout.component.tsx"],"names":[],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACYqE,+CAAA;AAhBrE,IAAM,cAAA,EAA6B,EAAE,SAAA,EAAW,CAAA,KAAA,EAAA,iBAAK,IAAI,IAAA,CAAK,CAAA,CAAA,CAAE,WAAA,CAAY,CAAC,CAAA,SAAA,EAAY,CAAA;AAElF,IAAM,WAAA,EAAwC,CAAC;AAAA,EACpD,OAAA;AAAA,EACA,UAAA;AAAA,EACA,MAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,UAAA,EAAY,EAAA;AAAA,EACZ,GAAG;AACL,CAAA,EAAA,GAAM;AACJ,EAAA,MAAM,QAAA,EAAU,CAAC,kBAAA,EAAoB,SAAS,CAAA,CAAE,MAAA,CAAO,OAAO,CAAA,CAAE,IAAA,CAAK,GAAG,CAAA;AAExE,EAAA,uBACE,8BAAA,KAAC,EAAA,EAAI,SAAA,EAAW,OAAA,EAAU,GAAG,IAAA,EAC3B,QAAA,EAAA;AAAA,oBAAA,6BAAA;AAAA,MAAC,yBAAA;AAAA,MAAA;AAAA,QACC,WAAA,kBAAa,OAAA,2BAAS,cAAA,GAAe,EAAE,KAAA,EAAO,CAAC,CAAA,EAAG,SAAA,kBAAW,6BAAA,oBAAA,EAAA,CAAA,CAAE,EAAI,CAAA;AAAA,QACnE,eAAA,kBAAiB,OAAA,6BAAS,kBAAA,GAAmB,CAAC,CAAA;AAAA,QAC9C,OAAA,kBAAS,OAAA,6BAAS,UAAA,GAAW,CAAC,CAAA;AAAA,QAC9B,QAAA,kBAAU,OAAA,6BAAS,WAAA,GAAY,CAAC,CAAA;AAAA,QAChC,SAAA,EAAU;AAAA,MAAA;AAAA,IACZ,CAAA;AAAA,oBACA,6BAAA,KAAC,EAAA,EAAI,SAAA,EAAU,8BAAA,EACZ,QAAA,EAAA,WAAA,mBAAc,6BAAA,4BAAC,EAAA,EAAY,GAAG,WAAA,CAAY,EAAA,CAC7C,CAAA;AAAA,oBACA,8BAAA,MAAC,EAAA,EAAK,SAAA,EAAU,2BAAA,EACb,QAAA,EAAA;AAAA,MAAA,OAAA,mBACC,6BAAA;AAAA,QAAC,wBAAA;AAAA,QAAA;AAAA,UACE,GAAG,MAAA;AAAA,UACJ,SAAA,EAAW,CAAC,0BAAA,EAA4B,MAAA,CAAO,SAAS,CAAA,CAAE,MAAA,CAAO,OAAO,CAAA,CAAE,IAAA,CAAK,GAAG;AAAA,QAAA;AAAA,MACpF,CAAA;AAAA,sBAEF,6BAAA,KAAC,EAAA,EAAI,SAAA,EAAU,wBAAA,EAA0B,SAAA,CAAS,CAAA;AAAA,sBAClD,6BAAA;AAAA,QAAC,wBAAA;AAAA,QAAA;AAAA,UACE,oBAAI,MAAA,UAAU,eAAA;AAAA,UACf,SAAA,EAAW,CAAC,0BAAA,kBAA4B,MAAA,6BAAQ,WAAS,CAAA,CAAE,MAAA,CAAO,OAAO,CAAA,CAAE,IAAA,CAAK,GAAG;AAAA,QAAA;AAAA,MACrF;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,EAAA,CACF,CAAA;AAEJ,CAAA;ADQA;AACA;AACE;AACF,gCAAC","file":"/Users/pedromealha/Documents/Repositories/Personal/eidos-ui/dist/chunk-VGYJ4VKX.cjs","sourcesContent":[null,"import React from 'react';\r\nimport type { PageLayoutProps } from './PageLayout.types';\r\nimport './PageLayout.scss';\r\nimport { Toolbar } from '../Toolbar';\r\nimport { Header } from '../Header';\r\nimport { Footer } from '../Footer';\r\nimport type { FooterProps } from '../Footer';\r\nimport { Navigation } from '../Navigation';\r\n\r\nconst defaultFooter: FooterProps = { copyright: `© ${new Date().getFullYear()} Eidos UI` };\r\n\r\nexport const PageLayout: React.FC<PageLayoutProps> = ({\r\n  toolbar,\r\n  navigation,\r\n  header,\r\n  footer,\r\n  children,\r\n  className = '',\r\n  ...rest\r\n}) => {\r\n  const classes = ['eidos-pagelayout', className].filter(Boolean).join(' ');\r\n\r\n  return (\r\n    <div className={classes} {...rest}>\r\n      <Toolbar\r\n        breadcrumbs={toolbar?.breadcrumbs || { items: [], separator: <></> }}\r\n        cmdPaletteItems={toolbar?.cmdPaletteItems || []}\r\n        actions={toolbar?.actions || []}\r\n        userMenu={toolbar?.userMenu || []}\r\n        className=\"eidos-pagelayout__toolbar\"\r\n      />\r\n      <div className=\"eidos-pagelayout__navigation\">\r\n        {navigation && <Navigation {...navigation} />}\r\n      </div>\r\n      <main className=\"eidos-pagelayout__content\">\r\n        {header && (\r\n          <Header\r\n            {...header}\r\n            className={['eidos-pagelayout__header', header.className].filter(Boolean).join(' ')}\r\n          />\r\n        )}\r\n        <div className=\"eidos-pagelayout__body\">{children}</div>\r\n        <Footer\r\n          {...(footer ?? defaultFooter)}\r\n          className={['eidos-pagelayout__footer', footer?.className].filter(Boolean).join(' ')}\r\n        />\r\n      </main>\r\n    </div>\r\n  );\r\n};\r\n"]}

package/dist/chunk-VLC2OZV3.cjs

@@ -0,0 +1,50 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/components/Breadcrumb/Breadcrumb.component.tsx
+var _jsxruntime = require('react/jsx-runtime');
+var Breadcrumb = ({
+  items,
+  separator = "/",
+  className = ""
+}) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  "nav",
+  {
+    "aria-label": "Breadcrumb",
+    className: ["eidos-breadcrumb-nav", className].filter(Boolean).join(" "),
+    children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "ol", { className: "eidos-breadcrumb", children: items.map((item, index) => {
+      const isLast = index === items.length - 1;
+      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        "li",
+        {
+          className: ["eidos-breadcrumb-item", isLast && "eidos-breadcrumb-item--current"].filter(Boolean).join(" "),
+          children: [
+            isLast ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { "aria-current": "page", className: "eidos-breadcrumb-current", children: [
+              item.icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "eidos-breadcrumb-icon", children: item.icon }),
+              item.label
+            ] }) : item.href ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "a", { href: item.href, onClick: item.onClick, className: "eidos-breadcrumb-link", children: [
+              item.icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "eidos-breadcrumb-icon", children: item.icon }),
+              item.label
+            ] }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+              "button",
+              {
+                type: "button",
+                onClick: item.onClick,
+                className: "eidos-breadcrumb-link eidos-breadcrumb-link--button",
+                children: [
+                  item.icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "eidos-breadcrumb-icon", children: item.icon }),
+                  item.label
+                ]
+              }
+            ),
+            !isLast && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "aria-hidden": "true", className: "eidos-breadcrumb-separator", children: separator })
+          ]
+        },
+        index
+      );
+    }) })
+  }
+);
+Breadcrumb.displayName = "Breadcrumb";
+
+
+
+exports.Breadcrumb = Breadcrumb;
+//# sourceMappingURL=chunk-VLC2OZV3.cjs.map

package/dist/chunk-VLC2OZV3.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/pedromealha/Documents/Repositories/Personal/eidos-ui/dist/chunk-VLC2OZV3.cjs","../src/components/Breadcrumb/Breadcrumb.component.tsx"],"names":[],"mappings":"AAAA;ACwBc,+CAAA;AArBP,IAAM,WAAA,EAAwC,CAAC;AAAA,EACpD,KAAA;AAAA,EACA,UAAA,EAAY,GAAA;AAAA,EACZ,UAAA,EAAY;AACd,CAAA,EAAA,mBACE,6BAAA;AAAA,EAAC,KAAA;AAAA,EAAA;AAAA,IACC,YAAA,EAAW,YAAA;AAAA,IACX,SAAA,EAAW,CAAC,sBAAA,EAAwB,SAAS,CAAA,CAAE,MAAA,CAAO,OAAO,CAAA,CAAE,IAAA,CAAK,GAAG,CAAA;AAAA,IAEvE,QAAA,kBAAA,6BAAA,IAAC,EAAA,EAAG,SAAA,EAAU,kBAAA,EACX,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,EAAM,KAAA,EAAA,GAAU;AAC1B,MAAA,MAAM,OAAA,EAAS,MAAA,IAAU,KAAA,CAAM,OAAA,EAAS,CAAA;AAExC,MAAA,uBACE,8BAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UAEC,SAAA,EAAW,CAAC,uBAAA,EAAyB,OAAA,GAAU,gCAAgC,CAAA,CAC5E,MAAA,CAAO,OAAO,CAAA,CACd,IAAA,CAAK,GAAG,CAAA;AAAA,UAEV,QAAA,EAAA;AAAA,YAAA,OAAA,kBACC,8BAAA,MAAC,EAAA,EAAK,cAAA,EAAa,MAAA,EAAO,SAAA,EAAU,0BAAA,EACjC,QAAA,EAAA;AAAA,cAAA,IAAA,CAAK,KAAA,mBAAQ,6BAAA,MAAC,EAAA,EAAK,SAAA,EAAU,uBAAA,EAAyB,QAAA,EAAA,IAAA,CAAK,KAAA,CAAK,CAAA;AAAA,cAChE,IAAA,CAAK;AAAA,YAAA,EAAA,CACR,EAAA,EACE,IAAA,CAAK,KAAA,kBACP,8BAAA,GAAC,EAAA,EAAE,IAAA,EAAM,IAAA,CAAK,IAAA,EAAM,OAAA,EAAS,IAAA,CAAK,OAAA,EAAS,SAAA,EAAU,uBAAA,EAClD,QAAA,EAAA;AAAA,cAAA,IAAA,CAAK,KAAA,mBAAQ,6BAAA,MAAC,EAAA,EAAK,SAAA,EAAU,uBAAA,EAAyB,QAAA,EAAA,IAAA,CAAK,KAAA,CAAK,CAAA;AAAA,cAChE,IAAA,CAAK;AAAA,YAAA,EAAA,CACR,EAAA,kBAEA,8BAAA;AAAA,cAAC,QAAA;AAAA,cAAA;AAAA,gBACC,IAAA,EAAK,QAAA;AAAA,gBACL,OAAA,EAAS,IAAA,CAAK,OAAA;AAAA,gBACd,SAAA,EAAU,qDAAA;AAAA,gBAET,QAAA,EAAA;AAAA,kBAAA,IAAA,CAAK,KAAA,mBAAQ,6BAAA,MAAC,EAAA,EAAK,SAAA,EAAU,uBAAA,EAAyB,QAAA,EAAA,IAAA,CAAK,KAAA,CAAK,CAAA;AAAA,kBAChE,IAAA,CAAK;AAAA,gBAAA;AAAA,cAAA;AAAA,YACR,CAAA;AAAA,YAGD,CAAC,OAAA,mBACA,6BAAA,MAAC,EAAA,EAAK,aAAA,EAAY,MAAA,EAAO,SAAA,EAAU,4BAAA,EAChC,QAAA,EAAA,UAAA,CACH;AAAA,UAAA;AAAA,QAAA,CAAA;AAAA,QA7BG;AAAA,MA+BP,CAAA;AAAA,IAEJ,CAAC,EAAA,CACH;AAAA,EAAA;AACF,CAAA;AAGF,UAAA,CAAW,YAAA,EAAc,YAAA;ADXzB;AACA;AACE;AACF,gCAAC","file":"/Users/pedromealha/Documents/Repositories/Personal/eidos-ui/dist/chunk-VLC2OZV3.cjs","sourcesContent":[null,"import React from 'react';\r\nimport type { BreadcrumbProps } from './Breadcrumb.types';\r\n\r\nexport const Breadcrumb: React.FC<BreadcrumbProps> = ({\r\n  items,\r\n  separator = '/',\r\n  className = '',\r\n}) => (\r\n  <nav\r\n    aria-label=\"Breadcrumb\"\r\n    className={['eidos-breadcrumb-nav', className].filter(Boolean).join(' ')}\r\n  >\r\n    <ol className=\"eidos-breadcrumb\">\r\n      {items.map((item, index) => {\r\n        const isLast = index === items.length - 1;\r\n\r\n        return (\r\n          <li\r\n            key={index}\r\n            className={['eidos-breadcrumb-item', isLast && 'eidos-breadcrumb-item--current']\r\n              .filter(Boolean)\r\n              .join(' ')}\r\n          >\r\n            {isLast ? (\r\n              <span aria-current=\"page\" className=\"eidos-breadcrumb-current\">\r\n                {item.icon && <span className=\"eidos-breadcrumb-icon\">{item.icon}</span>}\r\n                {item.label}\r\n              </span>\r\n            ) : item.href ? (\r\n              <a href={item.href} onClick={item.onClick} className=\"eidos-breadcrumb-link\">\r\n                {item.icon && <span className=\"eidos-breadcrumb-icon\">{item.icon}</span>}\r\n                {item.label}\r\n              </a>\r\n            ) : (\r\n              <button\r\n                type=\"button\"\r\n                onClick={item.onClick}\r\n                className=\"eidos-breadcrumb-link eidos-breadcrumb-link--button\"\r\n              >\r\n                {item.icon && <span className=\"eidos-breadcrumb-icon\">{item.icon}</span>}\r\n                {item.label}\r\n              </button>\r\n            )}\r\n\r\n            {!isLast && (\r\n              <span aria-hidden=\"true\" className=\"eidos-breadcrumb-separator\">\r\n                {separator}\r\n              </span>\r\n            )}\r\n          </li>\r\n        );\r\n      })}\r\n    </ol>\r\n  </nav>\r\n);\r\n\r\nBreadcrumb.displayName = 'Breadcrumb';\r\n"]}

package/dist/chunk-VTAABT55.js

@@ -0,0 +1,47 @@
+import {
+  CommandPalette
+} from "./chunk-VFYG7GAH.js";
+import {
+  Menu
+} from "./chunk-O6B4KB4D.js";
+import {
+  Avatar
+} from "./chunk-TCX3QKF3.js";
+import {
+  Breadcrumb
+} from "./chunk-S25WB7KJ.js";
+import {
+  IconButton
+} from "./chunk-FO5FNTJX.js";
+
+// src/components/Toolbar/Toolbar.component.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var Toolbar = ({
+  breadcrumbs,
+  actions,
+  userMenu,
+  cmdPaletteItems,
+  className = ""
+}) => {
+  const classes = ["eidos-toolbar", className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs("div", { className: classes, children: [
+    breadcrumbs && /* @__PURE__ */ jsx(Breadcrumb, { ...breadcrumbs }),
+    /* @__PURE__ */ jsxs("div", { className: "eidos-toolbar__content", children: [
+      cmdPaletteItems && cmdPaletteItems.length > 0 && /* @__PURE__ */ jsx(CommandPalette, { trigger: true, triggerLabel: "Search", items: cmdPaletteItems }),
+      actions && actions.length > 0 && /* @__PURE__ */ jsx("div", { className: "eidos-toolbar__actions", children: actions.map((action, index) => /* @__PURE__ */ jsx(IconButton, { variant: "text", size: "sm", ...action }, index)) }),
+      /* @__PURE__ */ jsx(
+        Menu,
+        {
+          trigger: /* @__PURE__ */ jsx(Avatar, { name: "John Doe", size: "sm", color: "primary" }),
+          items: userMenu,
+          minWidth: 220
+        }
+      )
+    ] })
+  ] });
+};
+
+export {
+  Toolbar
+};
+//# sourceMappingURL=chunk-VTAABT55.js.map

package/dist/chunk-VTAABT55.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Toolbar/Toolbar.component.tsx"],"sourcesContent":["import React from 'react';\r\nimport type { ToolbarProps } from './Toolbar.types';\r\nimport './Toolbar.scss';\r\nimport { IconButton } from '../Button';\r\nimport { Breadcrumb } from '../Breadcrumb';\r\nimport { Avatar } from '../Avatar';\r\nimport { Menu } from '../Menu';\r\nimport { CommandPalette } from '../CommandPalette';\r\n\r\nexport const Toolbar: React.FC<ToolbarProps> = ({\r\n  breadcrumbs,\r\n  actions,\r\n  userMenu,\r\n  cmdPaletteItems,\r\n  className = '',\r\n}) => {\r\n  const classes = ['eidos-toolbar', className].filter(Boolean).join(' ');\r\n\r\n  return (\r\n    <div className={classes}>\r\n      {breadcrumbs && <Breadcrumb {...breadcrumbs} />}\r\n      <div className=\"eidos-toolbar__content\">\r\n        {cmdPaletteItems && cmdPaletteItems.length > 0 && (\r\n          <CommandPalette trigger triggerLabel=\"Search\" items={cmdPaletteItems} />\r\n        )}\r\n        {actions && actions.length > 0 && (\r\n          <div className=\"eidos-toolbar__actions\">\r\n            {actions.map((action, index) => (\r\n              <IconButton key={index} variant=\"text\" size=\"sm\" {...action} />\r\n            ))}\r\n          </div>\r\n        )}\r\n        <Menu\r\n          trigger={<Avatar name=\"John Doe\" size=\"sm\" color=\"primary\" />}\r\n          items={userMenu}\r\n          minWidth={220}\r\n        />\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n"],"mappings":";;;;;;;;;;;;;;;;;AAoBsB,cAChB,YADgB;AAXf,IAAM,UAAkC,CAAC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AACd,MAAM;AACJ,QAAM,UAAU,CAAC,iBAAiB,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAErE,SACE,qBAAC,SAAI,WAAW,SACb;AAAA,mBAAe,oBAAC,cAAY,GAAG,aAAa;AAAA,IAC7C,qBAAC,SAAI,WAAU,0BACZ;AAAA,yBAAmB,gBAAgB,SAAS,KAC3C,oBAAC,kBAAe,SAAO,MAAC,cAAa,UAAS,OAAO,iBAAiB;AAAA,MAEvE,WAAW,QAAQ,SAAS,KAC3B,oBAAC,SAAI,WAAU,0BACZ,kBAAQ,IAAI,CAAC,QAAQ,UACpB,oBAAC,cAAuB,SAAQ,QAAO,MAAK,MAAM,GAAG,UAApC,KAA4C,CAC9D,GACH;AAAA,MAEF;AAAA,QAAC;AAAA;AAAA,UACC,SAAS,oBAAC,UAAO,MAAK,YAAW,MAAK,MAAK,OAAM,WAAU;AAAA,UAC3D,OAAO;AAAA,UACP,UAAU;AAAA;AAAA,MACZ;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/chunk-VW32UTUE.cjs

@@ -0,0 +1 @@
+"use strict";//# sourceMappingURL=chunk-VW32UTUE.cjs.map

package/dist/chunk-VW32UTUE.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/pedromealha/Documents/Repositories/Personal/eidos-ui/dist/chunk-VW32UTUE.cjs"],"names":[],"mappings":"AAAA","file":"/Users/pedromealha/Documents/Repositories/Personal/eidos-ui/dist/chunk-VW32UTUE.cjs"}