@omniviewdev/ui 0.1.0

package/dist/menus.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),x=require("@mui/material/Menu"),z=require("@mui/material/Divider"),k=require("@mui/material/MenuItem"),m=require("@mui/material/ListItemIcon"),M=require("@mui/material/ListItemText"),E=require("react-icons/lu"),W=require("./HotkeyHint-DrTOTrIM.cjs"),q=require("@mui/material/Box"),I=require("@mui/material/Button"),A=require("@mui/material/ButtonGroup"),C=require("./types.cjs");function p({item:r,onClose:i,submenuDirection:s="right"}){const[d,u]=o.useState(!1),h=o.useRef(null),a=()=>u(!0),n=()=>u(!1),t=()=>{r.onClick&&(r.onClick(),i())};return r.children?.length?e.jsxs(e.Fragment,{children:[e.jsxs(k,{ref:h,disabled:r.disabled,onMouseEnter:a,onMouseLeave:n,onClick:a,sx:{fontSize:"var(--ov-text-sm)",color:r.color==="danger"||r.color==="error"?"var(--ov-danger-default)":"var(--ov-fg-default)",display:"flex",justifyContent:"space-between",gap:.5},children:[r.icon&&e.jsx(m,{sx:{color:"inherit",minWidth:24},children:r.icon}),e.jsx(M,{children:r.label}),e.jsx(E.LuChevronRight,{size:14})]}),e.jsx(x,{open:d,anchorEl:h.current,onClose:n,anchorOrigin:{vertical:"top",horizontal:s==="left"?"left":"right"},transformOrigin:{vertical:"top",horizontal:s==="left"?"right":"left"},slotProps:{paper:{sx:{minWidth:160,bgcolor:"var(--ov-bg-surface)",border:"1px solid var(--ov-border-default)",pointerEvents:"auto"},onMouseEnter:a,onMouseLeave:n}},sx:{pointerEvents:"none"},disableAutoFocus:!0,disableEnforceFocus:!0,children:r.children.flatMap(l=>{const v=[e.jsx(p,{item:l,onClose:i,submenuDirection:s},l.key)];return l.dividerAfter&&v.push(e.jsx("hr",{style:{margin:"4px 0",border:"none",borderTop:"1px solid var(--ov-border-muted)"}},`${l.key}-divider`)),v})})]}):e.jsxs(k,{ref:h,disabled:r.disabled,onClick:t,sx:{fontSize:"var(--ov-text-sm)",color:r.color==="danger"||r.color==="error"?"var(--ov-danger-default)":"var(--ov-fg-default)",gap:.5},children:[r.icon&&e.jsx(m,{sx:{color:"inherit",minWidth:24},children:r.icon}),e.jsx(M,{children:r.label}),r.shortcut&&e.jsx(W.HotkeyHint,{keys:r.shortcut})]})}p.displayName="NestedMenuItem";function R({items:r,children:i,onOpenChange:s}){const[d,u]=o.useState(null),h=o.useCallback(n=>{n.preventDefault(),n.stopPropagation(),u({top:n.clientY,left:n.clientX}),s?.(!0)},[s]),a=o.useCallback(()=>{u(null),s?.(!1)},[s]);return e.jsxs(e.Fragment,{children:[e.jsx("span",{onContextMenu:h,style:{display:"contents"},children:i}),e.jsx(x,{open:d!==null,onClose:a,anchorReference:"anchorPosition",anchorPosition:d??void 0,slotProps:{paper:{sx:{minWidth:180,bgcolor:"var(--ov-bg-surface)",border:"1px solid var(--ov-border-default)"}}},children:r.map(n=>e.jsxs(o.Fragment,{children:[e.jsx(p,{item:n,onClose:a}),n.dividerAfter&&e.jsx(z,{})]},n.key))})]})}R.displayName="ContextMenu";const N={"bottom-start":{anchor:{vertical:"bottom",horizontal:"left"},transform:{vertical:"top",horizontal:"left"}},"bottom-end":{anchor:{vertical:"bottom",horizontal:"right"},transform:{vertical:"top",horizontal:"right"}},"top-start":{anchor:{vertical:"top",horizontal:"left"},transform:{vertical:"bottom",horizontal:"left"}},"top-end":{anchor:{vertical:"top",horizontal:"right"},transform:{vertical:"bottom",horizontal:"right"}}};function B({items:r,trigger:i,placement:s="bottom-start",submenuDirection:d,width:u}){const[h,a]=o.useState(!1),n=o.useRef(null),t=o.useCallback(()=>a(!1),[]),l=o.useCallback(()=>a(f=>!f),[]),{anchor:v,transform:g}=N[s],j=d??(s.endsWith("-end")?"left":"right");return e.jsxs(e.Fragment,{children:[e.jsx("span",{ref:n,onClick:l,style:{cursor:"pointer",display:"inline-flex"},children:i}),e.jsx(x,{open:h,anchorEl:n.current,onClose:t,anchorOrigin:v,transformOrigin:g,slotProps:{paper:{sx:{minWidth:u??180,bgcolor:"var(--ov-bg-surface)",border:"1px solid var(--ov-border-default)"}}},children:r.flatMap(f=>{const b=[e.jsx(p,{item:f,onClose:t,submenuDirection:j},f.key)];return f.dividerAfter&&b.push(e.jsx(z,{},`${f.key}-divider`)),b})})]})}B.displayName="DropdownMenu";function F({menus:r,sx:i}){const[s,d]=o.useState(null),u=o.useRef({}),h=o.useCallback(()=>d(null),[]),a=o.useCallback(t=>{d(l=>l===t?null:t)},[]),n=o.useCallback(t=>{s!==null&&d(t)},[s]);return e.jsx(q,{sx:{display:"flex",alignItems:"center",height:32,bgcolor:"var(--ov-bg-surface)",borderBottom:"1px solid var(--ov-border-default)",...typeof i=="object"&&!Array.isArray(i)?i:{}},children:r.map(t=>e.jsxs(o.Fragment,{children:[e.jsx(q,{component:"button",ref:l=>{u.current[t.key]=l},onClick:()=>a(t.key),onMouseEnter:()=>n(t.key),sx:{border:"none",background:s===t.key?"var(--ov-state-hover)":"transparent",color:"var(--ov-fg-default)",fontSize:"var(--ov-text-sm)",fontFamily:"var(--ov-font-ui)",px:1.5,py:.5,cursor:"pointer",borderRadius:"4px","&:hover":{bgcolor:"var(--ov-state-hover)"}},children:t.label}),e.jsx(x,{open:s===t.key,anchorEl:u.current[t.key],onClose:h,anchorOrigin:{vertical:"bottom",horizontal:"left"},transformOrigin:{vertical:"top",horizontal:"left"},slotProps:{paper:{sx:{minWidth:200,bgcolor:"var(--ov-bg-surface)",border:"1px solid var(--ov-border-default)"}}},children:t.items.map(l=>e.jsxs(o.Fragment,{children:[e.jsx(p,{item:l,onClose:h}),l.dividerAfter&&e.jsx(z,{})]},l.key))})]},t.key))})}F.displayName="MenuBar";function O({options:r,onSelect:i,defaultIndex:s=0,color:d="primary",emphasis:u="soft",size:h="sm"}){const[a,n]=o.useState(s),[t,l]=o.useState(!1),v=o.useRef(null),g=C.toMuiColor(d),j=C.toMuiVariant(u),f=C.toMuiSize(h),b=o.useCallback(()=>{const c=r[a];c&&!c.disabled&&i(c)},[r,a,i]),P=o.useCallback(c=>{n(c),l(!1),i(r[c])},[r,i]),y=r[a];return e.jsxs(e.Fragment,{children:[e.jsxs(A,{ref:v,variant:j,color:g,size:f,children:[e.jsx(I,{onClick:b,disabled:y?.disabled,startIcon:y?.icon,children:y?.label}),e.jsx(I,{onClick:()=>l(c=>!c),sx:{px:.5,minWidth:"auto"},"aria-label":"Select option",children:e.jsx(E.LuChevronDown,{size:14})})]}),e.jsx(x,{open:t,anchorEl:v.current,onClose:()=>l(!1),anchorOrigin:{vertical:"bottom",horizontal:"left"},transformOrigin:{vertical:"top",horizontal:"left"},slotProps:{paper:{sx:{minWidth:160,bgcolor:"var(--ov-bg-surface)",border:"1px solid var(--ov-border-default)"}}},children:r.map((c,S)=>e.jsxs(k,{disabled:c.disabled,selected:S===a,onClick:()=>P(S),sx:{fontSize:"var(--ov-text-sm)"},children:[c.icon&&e.jsx(m,{sx:{minWidth:28},children:c.icon}),e.jsx(M,{children:c.label})]},c.key))})]})}O.displayName="SplitButton";exports.ContextMenu=R;exports.DropdownMenu=B;exports.MenuBar=F;exports.NestedMenuItem=p;exports.SplitButton=O;

package/dist/menus.js

@@ -0,0 +1,355 @@
+import { jsxs as h, jsx as r, Fragment as y } from "react/jsx-runtime";
+import E, { useState as b, useRef as C, useCallback as u } from "react";
+import m from "@mui/material/Menu";
+import P from "@mui/material/Divider";
+import I from "@mui/material/MenuItem";
+import W from "@mui/material/ListItemIcon";
+import O from "@mui/material/ListItemText";
+import { LuChevronRight as N, LuChevronDown as R } from "react-icons/lu";
+import { H as L } from "./HotkeyHint-6SOi-MaU.js";
+import A from "@mui/material/Box";
+import B from "@mui/material/Button";
+import D from "@mui/material/ButtonGroup";
+import { toMuiColor as j, toMuiVariant as w, toMuiSize as H } from "./types.js";
+function g({ item: o, onClose: i, submenuDirection: n = "right" }) {
+  const [c, d] = b(!1), f = C(null), a = () => d(!0), t = () => d(!1), e = () => {
+    o.onClick && (o.onClick(), i());
+  };
+  return o.children?.length ? /* @__PURE__ */ h(y, { children: [
+    /* @__PURE__ */ h(
+      I,
+      {
+        ref: f,
+        disabled: o.disabled,
+        onMouseEnter: a,
+        onMouseLeave: t,
+        onClick: a,
+        sx: {
+          fontSize: "var(--ov-text-sm)",
+          color: o.color === "danger" || o.color === "error" ? "var(--ov-danger-default)" : "var(--ov-fg-default)",
+          display: "flex",
+          justifyContent: "space-between",
+          gap: 0.5
+        },
+        children: [
+          o.icon && /* @__PURE__ */ r(W, { sx: { color: "inherit", minWidth: 24 }, children: o.icon }),
+          /* @__PURE__ */ r(O, { children: o.label }),
+          /* @__PURE__ */ r(N, { size: 14 })
+        ]
+      }
+    ),
+    /* @__PURE__ */ r(
+      m,
+      {
+        open: c,
+        anchorEl: f.current,
+        onClose: t,
+        anchorOrigin: {
+          vertical: "top",
+          horizontal: n === "left" ? "left" : "right"
+        },
+        transformOrigin: {
+          vertical: "top",
+          horizontal: n === "left" ? "right" : "left"
+        },
+        slotProps: {
+          paper: {
+            sx: {
+              minWidth: 160,
+              bgcolor: "var(--ov-bg-surface)",
+              border: "1px solid var(--ov-border-default)",
+              pointerEvents: "auto"
+            },
+            onMouseEnter: a,
+            onMouseLeave: t
+          }
+        },
+        sx: { pointerEvents: "none" },
+        disableAutoFocus: !0,
+        disableEnforceFocus: !0,
+        children: o.children.flatMap((l) => {
+          const v = [
+            /* @__PURE__ */ r(g, { item: l, onClose: i, submenuDirection: n }, l.key)
+          ];
+          return l.dividerAfter && v.push(
+            /* @__PURE__ */ r(
+              "hr",
+              {
+                style: {
+                  margin: "4px 0",
+                  border: "none",
+                  borderTop: "1px solid var(--ov-border-muted)"
+                }
+              },
+              `${l.key}-divider`
+            )
+          ), v;
+        })
+      }
+    )
+  ] }) : /* @__PURE__ */ h(
+    I,
+    {
+      ref: f,
+      disabled: o.disabled,
+      onClick: e,
+      sx: {
+        fontSize: "var(--ov-text-sm)",
+        color: o.color === "danger" || o.color === "error" ? "var(--ov-danger-default)" : "var(--ov-fg-default)",
+        gap: 0.5
+      },
+      children: [
+        o.icon && /* @__PURE__ */ r(W, { sx: { color: "inherit", minWidth: 24 }, children: o.icon }),
+        /* @__PURE__ */ r(O, { children: o.label }),
+        o.shortcut && /* @__PURE__ */ r(L, { keys: o.shortcut })
+      ]
+    }
+  );
+}
+g.displayName = "NestedMenuItem";
+function T({
+  items: o,
+  children: i,
+  onOpenChange: n
+}) {
+  const [c, d] = b(null), f = u((t) => {
+    t.preventDefault(), t.stopPropagation(), d({ top: t.clientY, left: t.clientX }), n?.(!0);
+  }, [n]), a = u(() => {
+    d(null), n?.(!1);
+  }, [n]);
+  return /* @__PURE__ */ h(y, { children: [
+    /* @__PURE__ */ r("span", { onContextMenu: f, style: { display: "contents" }, children: i }),
+    /* @__PURE__ */ r(
+      m,
+      {
+        open: c !== null,
+        onClose: a,
+        anchorReference: "anchorPosition",
+        anchorPosition: c ?? void 0,
+        slotProps: {
+          paper: {
+            sx: {
+              minWidth: 180,
+              bgcolor: "var(--ov-bg-surface)",
+              border: "1px solid var(--ov-border-default)"
+            }
+          }
+        },
+        children: o.map((t) => /* @__PURE__ */ h(E.Fragment, { children: [
+          /* @__PURE__ */ r(g, { item: t, onClose: a }),
+          t.dividerAfter && /* @__PURE__ */ r(P, {})
+        ] }, t.key))
+      }
+    )
+  ] });
+}
+T.displayName = "ContextMenu";
+const K = {
+  "bottom-start": { anchor: { vertical: "bottom", horizontal: "left" }, transform: { vertical: "top", horizontal: "left" } },
+  "bottom-end": { anchor: { vertical: "bottom", horizontal: "right" }, transform: { vertical: "top", horizontal: "right" } },
+  "top-start": { anchor: { vertical: "top", horizontal: "left" }, transform: { vertical: "bottom", horizontal: "left" } },
+  "top-end": { anchor: { vertical: "top", horizontal: "right" }, transform: { vertical: "bottom", horizontal: "right" } }
+};
+function V({
+  items: o,
+  trigger: i,
+  placement: n = "bottom-start",
+  submenuDirection: c,
+  width: d
+}) {
+  const [f, a] = b(!1), t = C(null), e = u(() => a(!1), []), l = u(() => a((p) => !p), []), { anchor: v, transform: k } = K[n], M = c ?? (n.endsWith("-end") ? "left" : "right");
+  return /* @__PURE__ */ h(y, { children: [
+    /* @__PURE__ */ r(
+      "span",
+      {
+        ref: t,
+        onClick: l,
+        style: { cursor: "pointer", display: "inline-flex" },
+        children: i
+      }
+    ),
+    /* @__PURE__ */ r(
+      m,
+      {
+        open: f,
+        anchorEl: t.current,
+        onClose: e,
+        anchorOrigin: v,
+        transformOrigin: k,
+        slotProps: {
+          paper: {
+            sx: {
+              minWidth: d ?? 180,
+              bgcolor: "var(--ov-bg-surface)",
+              border: "1px solid var(--ov-border-default)"
+            }
+          }
+        },
+        children: o.flatMap((p) => {
+          const x = [
+            /* @__PURE__ */ r(g, { item: p, onClose: e, submenuDirection: M }, p.key)
+          ];
+          return p.dividerAfter && x.push(/* @__PURE__ */ r(P, {}, `${p.key}-divider`)), x;
+        })
+      }
+    )
+  ] });
+}
+V.displayName = "DropdownMenu";
+function _({ menus: o, sx: i }) {
+  const [n, c] = b(null), d = C({}), f = u(() => c(null), []), a = u((e) => {
+    c((l) => l === e ? null : e);
+  }, []), t = u((e) => {
+    n !== null && c(e);
+  }, [n]);
+  return /* @__PURE__ */ r(
+    A,
+    {
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        height: 32,
+        bgcolor: "var(--ov-bg-surface)",
+        borderBottom: "1px solid var(--ov-border-default)",
+        ...typeof i == "object" && !Array.isArray(i) ? i : {}
+      },
+      children: o.map((e) => /* @__PURE__ */ h(E.Fragment, { children: [
+        /* @__PURE__ */ r(
+          A,
+          {
+            component: "button",
+            ref: (l) => {
+              d.current[e.key] = l;
+            },
+            onClick: () => a(e.key),
+            onMouseEnter: () => t(e.key),
+            sx: {
+              border: "none",
+              background: n === e.key ? "var(--ov-state-hover)" : "transparent",
+              color: "var(--ov-fg-default)",
+              fontSize: "var(--ov-text-sm)",
+              fontFamily: "var(--ov-font-ui)",
+              px: 1.5,
+              py: 0.5,
+              cursor: "pointer",
+              borderRadius: "4px",
+              "&:hover": { bgcolor: "var(--ov-state-hover)" }
+            },
+            children: e.label
+          }
+        ),
+        /* @__PURE__ */ r(
+          m,
+          {
+            open: n === e.key,
+            anchorEl: d.current[e.key],
+            onClose: f,
+            anchorOrigin: { vertical: "bottom", horizontal: "left" },
+            transformOrigin: { vertical: "top", horizontal: "left" },
+            slotProps: {
+              paper: {
+                sx: {
+                  minWidth: 200,
+                  bgcolor: "var(--ov-bg-surface)",
+                  border: "1px solid var(--ov-border-default)"
+                }
+              }
+            },
+            children: e.items.map((l) => /* @__PURE__ */ h(E.Fragment, { children: [
+              /* @__PURE__ */ r(g, { item: l, onClose: f }),
+              l.dividerAfter && /* @__PURE__ */ r(P, {})
+            ] }, l.key))
+          }
+        )
+      ] }, e.key))
+    }
+  );
+}
+_.displayName = "MenuBar";
+function $({
+  options: o,
+  onSelect: i,
+  defaultIndex: n = 0,
+  color: c = "primary",
+  emphasis: d = "soft",
+  size: f = "sm"
+}) {
+  const [a, t] = b(n), [e, l] = b(!1), v = C(null), k = j(c), M = w(d), p = H(f), x = u(() => {
+    const s = o[a];
+    s && !s.disabled && i(s);
+  }, [o, a, i]), F = u((s) => {
+    t(s), l(!1), i(o[s]);
+  }, [o, i]), z = o[a];
+  return /* @__PURE__ */ h(y, { children: [
+    /* @__PURE__ */ h(
+      D,
+      {
+        ref: v,
+        variant: M,
+        color: k,
+        size: p,
+        children: [
+          /* @__PURE__ */ r(
+            B,
+            {
+              onClick: x,
+              disabled: z?.disabled,
+              startIcon: z?.icon,
+              children: z?.label
+            }
+          ),
+          /* @__PURE__ */ r(
+            B,
+            {
+              onClick: () => l((s) => !s),
+              sx: { px: 0.5, minWidth: "auto" },
+              "aria-label": "Select option",
+              children: /* @__PURE__ */ r(R, { size: 14 })
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ r(
+      m,
+      {
+        open: e,
+        anchorEl: v.current,
+        onClose: () => l(!1),
+        anchorOrigin: { vertical: "bottom", horizontal: "left" },
+        transformOrigin: { vertical: "top", horizontal: "left" },
+        slotProps: {
+          paper: {
+            sx: {
+              minWidth: 160,
+              bgcolor: "var(--ov-bg-surface)",
+              border: "1px solid var(--ov-border-default)"
+            }
+          }
+        },
+        children: o.map((s, S) => /* @__PURE__ */ h(
+          I,
+          {
+            disabled: s.disabled,
+            selected: S === a,
+            onClick: () => F(S),
+            sx: { fontSize: "var(--ov-text-sm)" },
+            children: [
+              s.icon && /* @__PURE__ */ r(W, { sx: { minWidth: 28 }, children: s.icon }),
+              /* @__PURE__ */ r(O, { children: s.label })
+            ]
+          },
+          s.key
+        ))
+      }
+    )
+  ] });
+}
+$.displayName = "SplitButton";
+export {
+  T as ContextMenu,
+  V as DropdownMenu,
+  _ as MenuBar,
+  g as NestedMenuItem,
+  $ as SplitButton
+};

package/dist/navigation/Breadcrumbs.d.ts

@@ -0,0 +1,18 @@
+import { SxProps, Theme } from '@mui/material/styles';
+export interface BreadcrumbItem {
+    label: string;
+    href?: string;
+    icon?: React.ReactNode;
+    onClick?: () => void;
+}
+export interface BreadcrumbsProps {
+    items: BreadcrumbItem[];
+    separator?: React.ReactNode;
+    maxItems?: number;
+    sx?: SxProps<Theme>;
+}
+declare function Breadcrumbs({ items, separator, maxItems, sx, }: BreadcrumbsProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Breadcrumbs {
+    var displayName: string;
+}
+export default Breadcrumbs;

package/dist/navigation/DraggableTabs.d.ts

@@ -0,0 +1,24 @@
+import { default as React } from 'react';
+import { SxProps, Theme } from '@mui/material/styles';
+export interface DraggableTab {
+    id: string;
+    label: string;
+    icon?: React.ReactNode;
+    closable?: boolean;
+}
+export interface DraggableTabsProps {
+    tabs: DraggableTab[];
+    activeId: string;
+    onSelect: (id: string) => void;
+    onClose?: (id: string) => void;
+    onReorder?: (tabs: DraggableTab[]) => void;
+    onAdd?: () => void;
+    onContextMenu?: (id: string, event: React.MouseEvent) => void;
+    maxTabWidth?: number;
+    sx?: SxProps<Theme>;
+}
+declare function DraggableTabs({ tabs, activeId, onSelect, onClose, onReorder, onAdd, onContextMenu, maxTabWidth, sx, }: DraggableTabsProps): import("react/jsx-runtime").JSX.Element;
+declare namespace DraggableTabs {
+    var displayName: string;
+}
+export default DraggableTabs;

package/dist/navigation/Pagination.d.ts

@@ -0,0 +1,15 @@
+import { SxProps, Theme } from '@mui/material/styles';
+import { ComponentSize } from '../types';
+export interface PaginationProps {
+    count: number;
+    page: number;
+    onChange: (page: number) => void;
+    variant?: 'compact' | 'full';
+    size?: ComponentSize;
+    sx?: SxProps<Theme>;
+}
+declare function Pagination({ count, page, onChange, variant, size, sx, }: PaginationProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Pagination {
+    var displayName: string;
+}
+export default Pagination;

package/dist/navigation/PersistentTabPanel.d.ts

@@ -0,0 +1,13 @@
+import { default as React } from 'react';
+import { SxProps, Theme } from '@mui/material/styles';
+export interface PersistentTabPanelProps {
+    children: React.ReactNode;
+    value: string;
+    activeValue: string;
+    sx?: SxProps<Theme>;
+}
+declare function PersistentTabPanel({ children, value, activeValue, sx, }: PersistentTabPanelProps): import("react/jsx-runtime").JSX.Element;
+declare namespace PersistentTabPanel {
+    var displayName: string;
+}
+export default PersistentTabPanel;

package/dist/navigation/Stepper.d.ts

@@ -0,0 +1,19 @@
+import { SxProps, Theme } from '@mui/material/styles';
+export interface StepItem {
+    label: string;
+    description?: string;
+    icon?: React.ReactNode;
+    optional?: boolean;
+}
+export interface StepperProps {
+    steps: StepItem[];
+    activeStep: number;
+    orientation?: 'horizontal' | 'vertical';
+    variant?: 'linear' | 'nonLinear';
+    sx?: SxProps<Theme>;
+}
+declare function Stepper({ steps, activeStep, orientation, variant, sx, }: StepperProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Stepper {
+    var displayName: string;
+}
+export default Stepper;

package/dist/navigation/TabPanel.d.ts

@@ -0,0 +1,11 @@
+export interface TabPanelProps {
+    value: string;
+    activeValue: string;
+    children: React.ReactNode;
+    keepMounted?: boolean;
+}
+declare function TabPanel({ value, activeValue, children, keepMounted, }: TabPanelProps): import("react/jsx-runtime").JSX.Element | null;
+declare namespace TabPanel {
+    var displayName: string;
+}
+export default TabPanel;

package/dist/navigation/Tabs.d.ts

@@ -0,0 +1,26 @@
+import { SxProps, Theme } from '@mui/material/styles';
+import { ComponentSize } from '../types';
+export interface TabItem {
+    key: string;
+    label: string;
+    icon?: React.ReactNode;
+    disabled?: boolean;
+}
+export interface TabsProps {
+    tabs: TabItem[];
+    value: string;
+    onChange: (key: string) => void;
+    variant?: 'line' | 'pill' | 'segmented';
+    size?: ComponentSize;
+    closable?: boolean;
+    onClose?: (key: string) => void;
+    scrollable?: boolean;
+    addButton?: boolean;
+    onAdd?: () => void;
+    sx?: SxProps<Theme>;
+}
+declare function Tabs({ tabs, value, onChange, variant, size, closable, onClose, scrollable, addButton, onAdd, sx, }: TabsProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Tabs {
+    var displayName: string;
+}
+export default Tabs;

package/dist/navigation/TreeView.d.ts

@@ -0,0 +1,27 @@
+import { SxProps, Theme } from '@mui/material/styles';
+export interface TreeNode {
+    id: string;
+    label: string;
+    icon?: React.ReactNode;
+    children?: TreeNode[];
+    badge?: React.ReactNode;
+    disabled?: boolean;
+}
+export interface TreeViewProps {
+    nodes: TreeNode[];
+    selected?: string;
+    onSelect?: (id: string) => void;
+    expanded?: string[];
+    onToggle?: (id: string) => void;
+    multiSelect?: boolean;
+    checkboxes?: boolean;
+    lazyLoad?: boolean;
+    onLoadChildren?: (id: string) => Promise<TreeNode[]>;
+    contextMenu?: (node: TreeNode) => React.ReactNode;
+    sx?: SxProps<Theme>;
+}
+declare function TreeView({ nodes, selected, onSelect, expanded: controlledExpanded, onToggle: controlledOnToggle, checkboxes, lazyLoad, onLoadChildren, sx, }: TreeViewProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TreeView {
+    var displayName: string;
+}
+export default TreeView;

package/dist/navigation/index.d.ts

@@ -0,0 +1,16 @@
+export { default as Tabs } from './Tabs';
+export type { TabsProps, TabItem } from './Tabs';
+export { default as TabPanel } from './TabPanel';
+export type { TabPanelProps } from './TabPanel';
+export { default as TreeView } from './TreeView';
+export type { TreeViewProps, TreeNode } from './TreeView';
+export { default as Breadcrumbs } from './Breadcrumbs';
+export type { BreadcrumbsProps, BreadcrumbItem } from './Breadcrumbs';
+export { default as Stepper } from './Stepper';
+export type { StepperProps, StepItem } from './Stepper';
+export { default as Pagination } from './Pagination';
+export type { PaginationProps } from './Pagination';
+export { default as DraggableTabs } from './DraggableTabs';
+export type { DraggableTabsProps, DraggableTab } from './DraggableTabs';
+export { default as PersistentTabPanel } from './PersistentTabPanel';
+export type { PersistentTabPanelProps } from './PersistentTabPanel';

package/dist/navigation.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("./TabPanel-CkUSl6Bt.cjs"),e=require("react/jsx-runtime"),j=require("react"),x=require("@mui/material/Box"),W=require("@mui/material/Collapse"),S=require("@mui/material/Typography"),E=require("@mui/material/Checkbox"),O=require("@mui/material/CircularProgress"),k=require("react-icons/lu"),V=require("@mui/material/Breadcrumbs"),P=require("@mui/material/Link"),R=require("@mui/material/Stepper"),X=require("@mui/material/Step"),_=require("@mui/material/StepLabel"),F=require("@mui/material/Pagination"),T=require("@mui/material/IconButton"),C=require("./types.cjs");function D({node:r,depth:s,selected:d,onSelect:a,expanded:i,onToggle:t,checkboxes:u,lazyLoad:p,onLoadChildren:f,loadingNodes:m,setLoadingNodes:g,dynamicChildren:b,setDynamicChildren:n}){const h=i.has(r.id),l=d===r.id,o=b.get(r.id)??r.children,y=o&&o.length>0||p&&!b.has(r.id),v=m.has(r.id),w=async()=>{if(p&&!b.has(r.id)&&f){g(c=>new Set(c).add(r.id));try{const c=await f(r.id);n(z=>new Map(z).set(r.id,c))}finally{g(c=>{const z=new Set(c);return z.delete(r.id),z})}}t(r.id)};return e.jsxs(x,{children:[e.jsxs(x,{onClick:()=>{r.disabled||a?.(r.id)},sx:{display:"flex",alignItems:"center",gap:.5,py:.25,px:1,pl:s*2+1,cursor:r.disabled?"default":"pointer",opacity:r.disabled?.5:1,borderRadius:"4px",bgcolor:l?"var(--ov-accent-subtle)":"transparent",color:l?"var(--ov-accent-fg)":"var(--ov-fg-default)","&:hover":{bgcolor:l?"var(--ov-accent-subtle)":"var(--ov-state-hover)"},fontSize:"0.8125rem"},children:[y?e.jsx(x,{onClick:c=>{c.stopPropagation(),w()},sx:{display:"flex",alignItems:"center",cursor:"pointer",flexShrink:0},children:v?e.jsx(O,{size:12}):h?e.jsx(k.LuChevronDown,{size:14}):e.jsx(k.LuChevronRight,{size:14})}):e.jsx(x,{sx:{width:14,flexShrink:0}}),u&&e.jsx(E,{size:"small",checked:l,disabled:r.disabled,onClick:c=>c.stopPropagation(),onChange:()=>a?.(r.id),sx:{p:0}}),r.icon&&e.jsx(x,{sx:{display:"flex",alignItems:"center",flexShrink:0},children:r.icon}),e.jsx(S,{variant:"body2",sx:{flex:1,fontSize:"inherit",color:"inherit"},noWrap:!0,children:r.label}),r.badge]}),y&&o&&e.jsx(W,{in:h,unmountOnExit:!0,children:o.map(c=>e.jsx(D,{node:c,depth:s+1,selected:d,onSelect:a,expanded:i,onToggle:t,checkboxes:u,lazyLoad:p,onLoadChildren:f,loadingNodes:m,setLoadingNodes:g,dynamicChildren:b,setDynamicChildren:n},c.id))})]})}function M({nodes:r,selected:s,onSelect:d,expanded:a,onToggle:i,checkboxes:t=!1,lazyLoad:u=!1,onLoadChildren:p,sx:f}){const[m,g]=j.useState(new Set),[b,n]=j.useState(new Set),[h,l]=j.useState(new Map),o=a?new Set(a):m,y=j.useCallback(v=>{i?i(v):g(w=>{const c=new Set(w);return c.has(v)?c.delete(v):c.add(v),c})},[i]);return e.jsx(x,{sx:f,children:r.map(v=>e.jsx(D,{node:v,depth:0,selected:s,onSelect:d,expanded:o,onToggle:y,checkboxes:t,lazyLoad:u,onLoadChildren:p,loadingNodes:b,setLoadingNodes:n,dynamicChildren:h,setDynamicChildren:l},v.id))})}M.displayName="TreeView";function I({items:r,separator:s,maxItems:d,sx:a}){return e.jsx(V,{separator:s??"/",maxItems:d,sx:{fontSize:"0.8125rem",color:"var(--ov-fg-muted)",...typeof a=="object"&&!Array.isArray(a)?a:{}},children:r.map((i,t)=>{const u=t===r.length-1,p=e.jsxs(x,{sx:{display:"inline-flex",alignItems:"center",gap:.5},children:[i.icon,e.jsx("span",{children:i.label})]});return u?e.jsx(S,{variant:"body2",sx:{fontSize:"inherit",color:"var(--ov-fg-base)",fontWeight:500},children:p},t):i.onClick?e.jsx(P,{component:"button",variant:"body2",onClick:i.onClick,underline:"hover",sx:{fontSize:"inherit",cursor:"pointer",color:"inherit"},children:p},t):i.href?e.jsx(P,{href:i.href,variant:"body2",underline:"hover",sx:{fontSize:"inherit",color:"inherit"},children:p},t):e.jsx(S,{variant:"body2",sx:{fontSize:"inherit",color:"inherit"},children:p},t)})})}I.displayName="Breadcrumbs";function A({steps:r,activeStep:s,orientation:d="horizontal",variant:a="linear",sx:i}){return e.jsx(R,{activeStep:s,orientation:d,nonLinear:a==="nonLinear",sx:i,children:r.map((t,u)=>e.jsx(X,{children:e.jsx(_,{icon:t.icon,optional:t.optional?e.jsx(S,{variant:"caption",sx:{color:"var(--ov-fg-muted)"},children:"Optional"}):t.description?e.jsx(S,{variant:"caption",sx:{color:"var(--ov-fg-muted)"},children:t.description}):void 0,children:t.label})},u))})}A.displayName="Stepper";function L({count:r,page:s,onChange:d,variant:a="full",size:i="md",sx:t}){if(a==="compact"){const u=C.toMuiSize(i);return e.jsxs(x,{sx:{display:"flex",alignItems:"center",gap:1,...typeof t=="object"&&!Array.isArray(t)?t:{}},children:[e.jsx(T,{size:u,disabled:s<=1,onClick:()=>d(s-1),children:e.jsx(k.LuChevronLeft,{})}),e.jsxs(x,{sx:{fontSize:"0.8125rem",color:"var(--ov-fg-default)"},children:[s," / ",r]}),e.jsx(T,{size:u,disabled:s>=r,onClick:()=>d(s+1),children:e.jsx(k.LuChevronRight,{})})]})}return e.jsx(F,{count:r,page:s,onChange:(u,p)=>d(p),size:C.toMuiSize(i),sx:t})}L.displayName="Pagination";function B({tabs:r,activeId:s,onSelect:d,onClose:a,onReorder:i,onAdd:t,onContextMenu:u,maxTabWidth:p=180,sx:f}){const m=j.useCallback((n,h)=>{n.dataTransfer.setData("text/plain",String(h)),n.dataTransfer.effectAllowed="move"},[]),g=j.useCallback((n,h)=>{n.preventDefault();const l=parseInt(n.dataTransfer.getData("text/plain"),10);if(isNaN(l)||l===h||!i)return;const o=[...r],[y]=o.splice(l,1);o.splice(h,0,y),i(o)},[r,i]),b=j.useCallback(n=>{n.preventDefault(),n.dataTransfer.dropEffect="move"},[]);return e.jsxs(x,{sx:{display:"flex",alignItems:"end",height:36,overflow:"auto",bgcolor:"var(--ov-bg-surface)",borderBottom:"1px solid var(--ov-border-default)",scrollbarWidth:"none","&::-webkit-scrollbar":{display:"none"},...typeof f=="object"&&!Array.isArray(f)?f:{}},children:[r.map((n,h)=>{const l=n.id===s;return e.jsxs(x,{draggable:!!i,onDragStart:o=>m(o,h),onDragOver:b,onDrop:o=>g(o,h),onContextMenu:o=>{u&&(o.preventDefault(),u(n.id,o))},onClick:()=>d(n.id),sx:{display:"flex",alignItems:"center",gap:.75,maxWidth:p,height:l?35:32,px:1.5,cursor:"pointer",flexShrink:0,borderBottom:l?"2px solid var(--ov-accent)":"2px solid transparent",bgcolor:l?"var(--ov-bg-base)":"transparent",color:l?"var(--ov-fg-base)":"var(--ov-fg-muted)","&:hover":{bgcolor:l?"var(--ov-bg-base)":"var(--ov-state-hover)","& .tab-close":{opacity:1}}},children:[n.icon&&e.jsx(x,{sx:{display:"flex",flexShrink:0,fontSize:14},children:n.icon}),e.jsx(S,{noWrap:!0,sx:{fontSize:"var(--ov-text-xs)",fontWeight:l?500:400,flex:1,minWidth:0},children:n.label}),n.closable!==!1&&a&&e.jsx(T,{className:"tab-close",size:"small",onClick:o=>{o.stopPropagation(),a(n.id)},sx:{p:"1px",opacity:l?.7:0,color:"inherit","&:hover":{opacity:1,bgcolor:"var(--ov-state-hover)"}},children:e.jsx(k.LuX,{size:12})})]},n.id)}),t&&e.jsx(T,{size:"small",onClick:t,sx:{mx:.5,p:"4px",color:"var(--ov-fg-muted)","&:hover":{bgcolor:"var(--ov-state-hover)"}},children:e.jsx(k.LuPlus,{size:14})})]})}B.displayName="DraggableTabs";function N({children:r,value:s,activeValue:d,sx:a}){const i=s===d;return e.jsx(x,{role:"tabpanel",hidden:!i,sx:{display:i?"block":"none",flex:1,overflow:"auto",...typeof a=="object"&&!Array.isArray(a)?a:{}},children:r})}N.displayName="PersistentTabPanel";exports.TabPanel=q.TabPanel;exports.Tabs=q.Tabs;exports.Breadcrumbs=I;exports.DraggableTabs=B;exports.Pagination=L;exports.PersistentTabPanel=N;exports.Stepper=A;exports.TreeView=M;