aeon-ui-engine 1.0.3 → 1.1.0

package/packages/ui/dist/index.js

@@ -35,26 +35,325 @@ var Button = {
   Icon: Headless.Icon
 };
 
+// src/avatar.tsx
+import { Avatar as Headless2 } from "@aeon-ui/react";
+import { aeonAvatar } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var Avatar = {
+  Root: ({ className, size = "md", ...props }) => {
+    const styles5 = aeonAvatar({ size });
+    return /* @__PURE__ */ jsx2(
+      Headless2.Root,
+      {
+        className: cx(styles5.root, className),
+        "data-aeon-size": size,
+        ...props
+      }
+    );
+  },
+  Image: ({ className, ...props }) => {
+    const styles5 = aeonAvatar();
+    return /* @__PURE__ */ jsx2(Headless2.Image, { className: cx(styles5.image, className), ...props });
+  },
+  Fallback: ({ className, ...props }) => {
+    const styles5 = aeonAvatar();
+    return /* @__PURE__ */ jsx2(Headless2.Fallback, { className: cx(styles5.fallback, className), ...props });
+  },
+  Badge: ({ className, ...props }) => {
+    const styles5 = aeonAvatar();
+    return /* @__PURE__ */ jsx2(Headless2.Badge, { className: cx(styles5.badge, className), ...props });
+  }
+};
+
+// src/identity.tsx
+import { Identity as Headless3 } from "@aeon-ui/react";
+import { aeonIdentity } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Identity = {
+  Root: ({ className, size = "md", ...props }) => {
+    const styles5 = aeonIdentity({ size });
+    return /* @__PURE__ */ jsx3(Headless3.Root, { className: cx(styles5.root, className), size, ...props });
+  },
+  Avatar: ({ className, ...props }) => {
+    const styles5 = aeonIdentity({});
+    return /* @__PURE__ */ jsx3(Headless3.Avatar, { className: cx(styles5.avatar, className), ...props });
+  },
+  Title: ({ className, ...props }) => {
+    const styles5 = aeonIdentity({});
+    return /* @__PURE__ */ jsx3(Headless3.Title, { className: cx(styles5.title, className), ...props });
+  },
+  Subtitle: ({ className, ...props }) => {
+    const styles5 = aeonIdentity({});
+    return /* @__PURE__ */ jsx3(Headless3.Subtitle, { className: cx(styles5.subtitle, className), ...props });
+  },
+  Meta: ({ className, ...props }) => {
+    const styles5 = aeonIdentity({});
+    return /* @__PURE__ */ jsx3(Headless3.Meta, { className: cx(styles5.meta, className), ...props });
+  },
+  Trailing: ({ className, ...props }) => {
+    const styles5 = aeonIdentity({});
+    return /* @__PURE__ */ jsx3(Headless3.Trailing, { className: cx(styles5.trailing, className), ...props });
+  }
+};
+
+// src/metric-strip.tsx
+import { MetricStrip as Headless4 } from "@aeon-ui/react";
+import { aeonMetricStrip } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var MetricStrip = {
+  Root: ({ className, density = "cluster", ...props }) => {
+    const styles5 = aeonMetricStrip({ density });
+    return /* @__PURE__ */ jsx4(Headless4.Root, { className: cx(styles5.root, className), density, ...props });
+  },
+  Chip: ({ className, ...props }) => {
+    const styles5 = aeonMetricStrip({});
+    return /* @__PURE__ */ jsx4(Headless4.Chip, { className: cx(styles5.chip, className), ...props });
+  },
+  Value: ({ className, ...props }) => {
+    const styles5 = aeonMetricStrip({});
+    return /* @__PURE__ */ jsx4(Headless4.Value, { className: cx(styles5.value, className), ...props });
+  },
+  Label: ({ className, ...props }) => {
+    const styles5 = aeonMetricStrip({});
+    return /* @__PURE__ */ jsx4(Headless4.Label, { className: cx(styles5.label, className), ...props });
+  }
+};
+
+// src/list-row.tsx
+import { ListRow as Headless5 } from "@aeon-ui/react";
+import { aeonListRow } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var ListRow = {
+  Root: ({ className, ...props }) => {
+    const styles5 = aeonListRow();
+    return /* @__PURE__ */ jsx5(Headless5.Root, { className: cx(styles5.root, className), ...props });
+  },
+  Leading: ({ className, ...props }) => {
+    const styles5 = aeonListRow();
+    return /* @__PURE__ */ jsx5(Headless5.Leading, { className: cx(styles5.leading, className), ...props });
+  },
+  Label: ({ className, ...props }) => {
+    const styles5 = aeonListRow();
+    return /* @__PURE__ */ jsx5(Headless5.Label, { className: cx(styles5.label, className), ...props });
+  },
+  Description: ({ className, ...props }) => {
+    const styles5 = aeonListRow();
+    return /* @__PURE__ */ jsx5(Headless5.Description, { className: cx(styles5.description, className), ...props });
+  },
+  Trailing: ({ className, ...props }) => {
+    const styles5 = aeonListRow();
+    return /* @__PURE__ */ jsx5(Headless5.Trailing, { className: cx(styles5.trailing, className), ...props });
+  }
+};
+
+// src/entry.tsx
+import { Entry as Headless6 } from "@aeon-ui/react";
+import { aeonEntry } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx6 } from "react/jsx-runtime";
+var Entry = {
+  List: ({ className, density = "compact", layout = "stack", ...props }) => {
+    const styles5 = aeonEntry({ density, layout });
+    return /* @__PURE__ */ jsx6(Headless6.List, { className: cx(styles5.list, className), ...props });
+  },
+  Root: ({ className, density = "compact", layout = "stack", ...props }) => {
+    const styles5 = aeonEntry({ density, layout });
+    return /* @__PURE__ */ jsx6(Headless6.Root, { className: cx(styles5.root, className), ...props });
+  },
+  Header: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Header, { className: cx(styles5.header, className), ...props });
+  },
+  Leading: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Leading, { className: cx(styles5.leading, className), ...props });
+  },
+  Heading: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Heading, { className: cx(styles5.heading, className), ...props });
+  },
+  Title: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Title, { className: cx(styles5.title, className), ...props });
+  },
+  Subtitle: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Subtitle, { className: cx(styles5.subtitle, className), ...props });
+  },
+  Meta: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Meta, { className: cx(styles5.meta, className), ...props });
+  },
+  Media: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Media, { className: cx(styles5.media, className), ...props });
+  },
+  Body: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Body, { className: cx(styles5.body, className), ...props });
+  },
+  Values: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Values, { className: cx(styles5.values, className), ...props });
+  },
+  Value: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Value, { className: cx(styles5.value, className), ...props });
+  },
+  Actions: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Actions, { className: cx(styles5.actions, className), ...props });
+  },
+  Footer: ({ className, ...props }) => {
+    const styles5 = aeonEntry();
+    return /* @__PURE__ */ jsx6(Headless6.Footer, { className: cx(styles5.footer, className), ...props });
+  }
+};
+
+// src/conversation.tsx
+import { Conversation as Headless7 } from "@aeon-ui/react";
+import { aeonConversation } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var Conversation = {
+  Root: ({ className, ...props }) => {
+    const styles5 = aeonConversation();
+    return /* @__PURE__ */ jsx7(Headless7.Root, { className: cx(styles5.root, className), ...props });
+  },
+  Item: ({ className, ...props }) => {
+    const styles5 = aeonConversation();
+    return /* @__PURE__ */ jsx7(Headless7.Item, { className: cx(styles5.item, className), ...props });
+  },
+  Leading: ({ className, ...props }) => {
+    const styles5 = aeonConversation();
+    return /* @__PURE__ */ jsx7(Headless7.Leading, { className: cx(styles5.leading, className), ...props });
+  },
+  Body: ({ className, ...props }) => {
+    const styles5 = aeonConversation();
+    return /* @__PURE__ */ jsx7(Headless7.Body, { className: cx(styles5.body, className), ...props });
+  },
+  Title: ({ className, ...props }) => {
+    const styles5 = aeonConversation();
+    return /* @__PURE__ */ jsx7(Headless7.Title, { className: cx(styles5.title, className), ...props });
+  },
+  Preview: ({ className, ...props }) => {
+    const styles5 = aeonConversation();
+    return /* @__PURE__ */ jsx7(Headless7.Preview, { className: cx(styles5.preview, className), ...props });
+  },
+  Meta: ({ className, ...props }) => {
+    const styles5 = aeonConversation();
+    return /* @__PURE__ */ jsx7(Headless7.Meta, { className: cx(styles5.meta, className), ...props });
+  },
+  Badge: ({ className, ...props }) => {
+    const styles5 = aeonConversation();
+    return /* @__PURE__ */ jsx7(Headless7.Badge, { className: cx(styles5.badge, className), ...props });
+  }
+};
+
+// src/thread.tsx
+import { Thread as Headless8 } from "@aeon-ui/react";
+import { aeonThread } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx8 } from "react/jsx-runtime";
+var Thread = {
+  Root: ({ className, ...props }) => {
+    const styles5 = aeonThread();
+    return /* @__PURE__ */ jsx8(Headless8.Root, { className: cx(styles5.root, className), ...props });
+  },
+  List: ({ className, ...props }) => {
+    const styles5 = aeonThread();
+    return /* @__PURE__ */ jsx8(Headless8.List, { className: cx(styles5.list, className), ...props });
+  },
+  Item: ({ className, ...props }) => {
+    const styles5 = aeonThread();
+    return /* @__PURE__ */ jsx8(Headless8.Item, { className: cx(styles5.item, className), ...props });
+  },
+  Bubble: ({ className, ...props }) => {
+    const styles5 = aeonThread();
+    return /* @__PURE__ */ jsx8(Headless8.Bubble, { className: cx(styles5.bubble, className), ...props });
+  },
+  Meta: ({ className, ...props }) => {
+    const styles5 = aeonThread();
+    return /* @__PURE__ */ jsx8(Headless8.Meta, { className: cx(styles5.meta, className), ...props });
+  },
+  Day: ({ className, ...props }) => {
+    const styles5 = aeonThread();
+    return /* @__PURE__ */ jsx8(Headless8.Day, { className: cx(styles5.day, className), ...props });
+  }
+};
+
+// src/composer.tsx
+import { Composer as Headless9 } from "@aeon-ui/react";
+import { aeonComposer } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx9 } from "react/jsx-runtime";
+var Composer = {
+  Root: ({ className, ...props }) => {
+    const styles5 = aeonComposer();
+    return /* @__PURE__ */ jsx9(Headless9.Root, { className: cx(styles5.root, className), ...props });
+  },
+  Input: ({ className, ...props }) => {
+    const styles5 = aeonComposer();
+    return /* @__PURE__ */ jsx9(Headless9.Input, { className: cx(styles5.input, className), ...props });
+  },
+  Actions: ({ className, ...props }) => {
+    const styles5 = aeonComposer();
+    return /* @__PURE__ */ jsx9(Headless9.Actions, { className: cx(styles5.actions, className), ...props });
+  },
+  Send: ({ className, ...props }) => {
+    const styles5 = aeonComposer();
+    return /* @__PURE__ */ jsx9(Headless9.Send, { className: cx(styles5.send, className), ...props });
+  }
+};
+
+// src/profile-header.tsx
+import { ProfileHeader as Headless10 } from "@aeon-ui/react";
+import { aeonProfileHeader } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx10 } from "react/jsx-runtime";
+var ProfileHeader = {
+  Root: ({ className, align = "start", ...props }) => {
+    const styles5 = aeonProfileHeader({ align });
+    return /* @__PURE__ */ jsx10(Headless10.Root, { className: cx(styles5.root, className), ...props });
+  },
+  Media: ({ className, ...props }) => {
+    const styles5 = aeonProfileHeader();
+    return /* @__PURE__ */ jsx10(Headless10.Media, { className: cx(styles5.media, className), ...props });
+  },
+  Identity: ({ className, ...props }) => {
+    const styles5 = aeonProfileHeader();
+    return /* @__PURE__ */ jsx10(Headless10.Identity, { className: cx(styles5.identity, className), ...props });
+  },
+  Metrics: ({ className, ...props }) => {
+    const styles5 = aeonProfileHeader();
+    return /* @__PURE__ */ jsx10(Headless10.Metrics, { className: cx(styles5.metrics, className), ...props });
+  },
+  Actions: ({ className, ...props }) => {
+    const styles5 = aeonProfileHeader();
+    return /* @__PURE__ */ jsx10(Headless10.Actions, { className: cx(styles5.actions, className), ...props });
+  },
+  Body: ({ className, ...props }) => {
+    const styles5 = aeonProfileHeader();
+    return /* @__PURE__ */ jsx10(Headless10.Body, { className: cx(styles5.body, className), ...props });
+  }
+};
+
 // src/async.tsx
-import { Async as Headless2, useAsyncContext } from "@aeon-ui/react";
+import { Async as Headless11, useAsyncContext } from "@aeon-ui/react";
 import { aeonAsync } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 var styles = () => aeonAsync();
 var Async = {
   Root: ({ className, ...props }) => {
     const s = styles();
-    return /* @__PURE__ */ jsx2(Headless2.Root, { className: cx(s.root, "machine-console", className), ...props });
+    return /* @__PURE__ */ jsx11(Headless11.Root, { className: cx(s.root, className), ...props });
   },
+  /** Totality / diagram rail — prefer Content faces in product Instant UIs. */
   Track: ({ className, ...props }) => {
     const s = styles();
-    return /* @__PURE__ */ jsx2(Headless2.Track, { className: cx(s.track, "state-track", className), ...props });
+    return /* @__PURE__ */ jsx11(Headless11.Track, { className: cx(s.track, "state-track", className), ...props });
   },
   Readout: ({ className, children, ...props }) => {
     const s = styles();
     const { status } = useAsyncContext();
     const tone = ["idle", "loading", "success", "failure", "empty"].includes(status) ? status : "idle";
-    return /* @__PURE__ */ jsx2(
-      Headless2.Readout,
+    return /* @__PURE__ */ jsx11(
+      Headless11.Readout,
       {
         className: cx(s.readout, "live-status", `live-status--${tone}`, className),
         ...props,
@@ -64,183 +363,192 @@ var Async = {
   },
   Actions: ({ className, ...props }) => {
     const s = styles();
-    return /* @__PURE__ */ jsx2(Headless2.Actions, { className: cx(s.actions, className), ...props });
+    return /* @__PURE__ */ jsx11(Headless11.Actions, { className: cx(s.actions, className), ...props });
   },
-  Provider: Headless2.Provider,
+  Provider: Headless11.Provider,
   useContext: useAsyncContext
 };
 
 // src/field.tsx
-import { Field as Headless3 } from "@aeon-ui/react";
+import { Field as Headless12 } from "@aeon-ui/react";
 import { aeonField } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx3 } from "react/jsx-runtime";
+import { jsx as jsx12 } from "react/jsx-runtime";
 var styles2 = () => aeonField();
 var Field = {
   Root: ({ className, ...props }) => {
     const s = styles2();
-    return /* @__PURE__ */ jsx3(Headless3.Root, { className: cx(s.root, className), ...props });
+    return /* @__PURE__ */ jsx12(Headless12.Root, { className: cx(s.root, className), ...props });
   },
   Label: ({ className, ...props }) => {
     const s = styles2();
-    return /* @__PURE__ */ jsx3(Headless3.Label, { className: cx(s.label, className), ...props });
+    return /* @__PURE__ */ jsx12(Headless12.Label, { className: cx(s.label, className), ...props });
   },
   Control: ({ className, ...props }) => {
     const s = styles2();
-    return /* @__PURE__ */ jsx3(Headless3.Control, { className: cx(s.control, className), ...props });
+    return /* @__PURE__ */ jsx12(Headless12.Control, { className: cx(s.control, className), ...props });
+  },
+  /** Alias for Control — preferred name in app forms. */
+  Input: ({ className, ...props }) => {
+    const s = styles2();
+    return /* @__PURE__ */ jsx12(Headless12.Control, { className: cx(s.control, className), ...props });
   },
   Textarea: ({ className, ...props }) => {
     const s = styles2();
-    return /* @__PURE__ */ jsx3(Headless3.Textarea, { className: cx(s.textarea, className), ...props });
+    return /* @__PURE__ */ jsx12(Headless12.Textarea, { className: cx(s.textarea, className), ...props });
   },
   Message: ({ className, ...props }) => {
     const s = styles2();
-    return /* @__PURE__ */ jsx3(Headless3.Message, { className: cx(s.message, className), ...props });
+    return /* @__PURE__ */ jsx12(Headless12.Message, { className: cx(s.message, className), ...props });
   },
   Hint: ({ className, ...props }) => {
     const s = styles2();
-    return /* @__PURE__ */ jsx3(Headless3.Hint, { className: cx(s.hint, className), ...props });
+    return /* @__PURE__ */ jsx12(Headless12.Hint, { className: cx(s.hint, className), ...props });
   }
 };
 
 // src/switch.tsx
-import { Switch as Headless4 } from "@aeon-ui/react";
+import { Switch as Headless13 } from "@aeon-ui/react";
 import { aeonSwitch } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 var switchStyles = aeonSwitch();
 var Switch = {
-  Root: ({ className, ...props }) => /* @__PURE__ */ jsx4(Headless4.Root, { className: cx(switchStyles.root, className), ...props }),
-  Control: ({ className, ...props }) => /* @__PURE__ */ jsx4(Headless4.Control, { className: cx(switchStyles.control, className), ...props }),
-  Thumb: ({ className, ...props }) => /* @__PURE__ */ jsx4(Headless4.Thumb, { className: cx(switchStyles.thumb, className), ...props }),
-  Label: ({ className, ...props }) => /* @__PURE__ */ jsx4(Headless4.Label, { className: cx(switchStyles.label, className), ...props }),
-  HiddenInput: Headless4.HiddenInput
+  Root: ({ className, children, ...props }) => {
+    const styles5 = switchStyles;
+    const body = children ?? /* @__PURE__ */ jsx13(Headless13.Control, { className: styles5.control, children: /* @__PURE__ */ jsx13(Headless13.Thumb, { className: styles5.thumb }) });
+    return /* @__PURE__ */ jsx13(Headless13.Root, { className: cx(styles5.root, className), ...props, children: body });
+  },
+  Control: ({ className, ...props }) => /* @__PURE__ */ jsx13(Headless13.Control, { className: cx(switchStyles.control, className), ...props }),
+  Thumb: ({ className, ...props }) => /* @__PURE__ */ jsx13(Headless13.Thumb, { className: cx(switchStyles.thumb, className), ...props }),
+  Label: ({ className, ...props }) => /* @__PURE__ */ jsx13(Headless13.Label, { className: cx(switchStyles.label, className), ...props }),
+  HiddenInput: Headless13.HiddenInput
 };
 
 // src/checkbox.tsx
-import { Checkbox as Headless5 } from "@aeon-ui/react";
+import { Checkbox as Headless14 } from "@aeon-ui/react";
 import { aeonCheckbox } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx5 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 var checkbox = aeonCheckbox();
 var Checkbox = {
-  Root: ({ className, ...props }) => /* @__PURE__ */ jsx5(Headless5.Root, { className: cx(checkbox.root, className), ...props }),
-  Control: ({ className, ...props }) => /* @__PURE__ */ jsx5(Headless5.Control, { className: cx(checkbox.control, className), ...props }),
-  Indicator: ({ className, children, ...props }) => /* @__PURE__ */ jsx5(Headless5.Indicator, { className: cx(checkbox.indicator, className), ...props, children: children ?? "\u2713" }),
-  Label: ({ className, ...props }) => /* @__PURE__ */ jsx5(Headless5.Label, { className: cx(checkbox.label, className), ...props }),
-  HiddenInput: Headless5.HiddenInput
+  Root: ({ className, ...props }) => /* @__PURE__ */ jsx14(Headless14.Root, { className: cx(checkbox.root, className), ...props }),
+  Control: ({ className, ...props }) => /* @__PURE__ */ jsx14(Headless14.Control, { className: cx(checkbox.control, className), ...props }),
+  Indicator: ({ className, children, ...props }) => /* @__PURE__ */ jsx14(Headless14.Indicator, { className: cx(checkbox.indicator, className), ...props, children: children ?? "\u2713" }),
+  Label: ({ className, ...props }) => /* @__PURE__ */ jsx14(Headless14.Label, { className: cx(checkbox.label, className), ...props }),
+  HiddenInput: Headless14.HiddenInput
 };
 
 // src/dialog.tsx
-import { Dialog as Headless6 } from "@aeon-ui/react";
+import { Dialog as Headless15 } from "@aeon-ui/react";
 import { aeonDialog } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx6 } from "react/jsx-runtime";
+import { jsx as jsx15 } from "react/jsx-runtime";
 var dialog = aeonDialog();
 var Dialog = {
-  Root: Headless6.Root,
-  Trigger: ({ className, ...props }) => /* @__PURE__ */ jsx6(Headless6.Trigger, { className: cx(dialog.trigger, className), ...props }),
-  Portal: Headless6.Portal,
-  Backdrop: ({ className, ...props }) => /* @__PURE__ */ jsx6(Headless6.Backdrop, { className: cx(dialog.backdrop, className), ...props }),
-  Positioner: ({ className, ...props }) => /* @__PURE__ */ jsx6(Headless6.Positioner, { className: cx(dialog.positioner, className), ...props }),
-  Content: ({ className, ...props }) => /* @__PURE__ */ jsx6(Headless6.Content, { className: cx(dialog.content, className), ...props }),
-  Title: ({ className, ...props }) => /* @__PURE__ */ jsx6(Headless6.Title, { className: cx(dialog.title, className), ...props }),
-  Description: ({ className, ...props }) => /* @__PURE__ */ jsx6(Headless6.Description, { className: cx(dialog.description, className), ...props }),
-  CloseTrigger: ({ className, ...props }) => /* @__PURE__ */ jsx6(Headless6.CloseTrigger, { className: cx(dialog.closeTrigger, className), ...props })
+  Root: Headless15.Root,
+  Trigger: ({ className, ...props }) => /* @__PURE__ */ jsx15(Headless15.Trigger, { className: cx(dialog.trigger, className), ...props }),
+  Portal: Headless15.Portal,
+  Backdrop: ({ className, ...props }) => /* @__PURE__ */ jsx15(Headless15.Backdrop, { className: cx(dialog.backdrop, className), ...props }),
+  Positioner: ({ className, ...props }) => /* @__PURE__ */ jsx15(Headless15.Positioner, { className: cx(dialog.positioner, className), ...props }),
+  Content: ({ className, ...props }) => /* @__PURE__ */ jsx15(Headless15.Content, { className: cx(dialog.content, className), ...props }),
+  Title: ({ className, ...props }) => /* @__PURE__ */ jsx15(Headless15.Title, { className: cx(dialog.title, className), ...props }),
+  Description: ({ className, ...props }) => /* @__PURE__ */ jsx15(Headless15.Description, { className: cx(dialog.description, className), ...props }),
+  CloseTrigger: ({ className, ...props }) => /* @__PURE__ */ jsx15(Headless15.CloseTrigger, { className: cx(dialog.closeTrigger, className), ...props })
 };
 
 // src/tabs.tsx
-import { Tabs as Headless7 } from "@aeon-ui/react";
+import { Tabs as Headless16 } from "@aeon-ui/react";
 import { aeonTabs } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx7 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 var tabs = aeonTabs();
 var Tabs = {
-  Root: ({ className, ...props }) => /* @__PURE__ */ jsx7(Headless7.Root, { className: cx(tabs.root, className), ...props }),
-  List: ({ className, ...props }) => /* @__PURE__ */ jsx7(Headless7.List, { className: cx(tabs.list, className), ...props }),
-  Trigger: ({ className, ...props }) => /* @__PURE__ */ jsx7(Headless7.Trigger, { className: cx(tabs.trigger, className), ...props }),
-  Content: ({ className, ...props }) => /* @__PURE__ */ jsx7(Headless7.Content, { className: cx(tabs.content, className), ...props }),
-  Indicator: Headless7.Indicator
+  Root: ({ className, ...props }) => /* @__PURE__ */ jsx16(Headless16.Root, { className: cx(tabs.root, className), ...props }),
+  List: ({ className, ...props }) => /* @__PURE__ */ jsx16(Headless16.List, { className: cx(tabs.list, className), ...props }),
+  Trigger: ({ className, ...props }) => /* @__PURE__ */ jsx16(Headless16.Trigger, { className: cx(tabs.trigger, className), ...props }),
+  Content: ({ className, ...props }) => /* @__PURE__ */ jsx16(Headless16.Content, { className: cx(tabs.content, className), ...props }),
+  Indicator: Headless16.Indicator
 };
 
 // src/separator.tsx
-import { Separator as Headless8 } from "@aeon-ui/react";
+import { Separator as Headless17 } from "@aeon-ui/react";
 import { aeonSeparator } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx8 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 var Separator = {
   Root: ({ className, orientation = "horizontal", ...props }) => {
     const styles5 = aeonSeparator({ orientation });
-    return /* @__PURE__ */ jsx8(Headless8.Root, { className: cx(styles5.root, className), orientation, ...props });
+    return /* @__PURE__ */ jsx17(Headless17.Root, { className: cx(styles5.root, className), orientation, ...props });
   }
 };
 
 // src/progress.tsx
-import { Progress as Headless9 } from "@aeon-ui/react";
+import { Progress as Headless18 } from "@aeon-ui/react";
 import { aeonProgress } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx9 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 var progress = aeonProgress();
 var Progress = {
-  Root: ({ className, ...props }) => /* @__PURE__ */ jsx9(Headless9.Root, { className: cx(progress.root, className), ...props }),
-  Track: ({ className, ...props }) => /* @__PURE__ */ jsx9(Headless9.Track, { className: cx(progress.track, className), ...props }),
-  Range: ({ className, ...props }) => /* @__PURE__ */ jsx9(Headless9.Range, { className: cx(progress.range, className), ...props }),
-  Label: ({ className, ...props }) => /* @__PURE__ */ jsx9(Headless9.Label, { className: cx(progress.label, className), ...props })
+  Root: ({ className, ...props }) => /* @__PURE__ */ jsx18(Headless18.Root, { className: cx(progress.root, className), ...props }),
+  Track: ({ className, ...props }) => /* @__PURE__ */ jsx18(Headless18.Track, { className: cx(progress.track, className), ...props }),
+  Range: ({ className, ...props }) => /* @__PURE__ */ jsx18(Headless18.Range, { className: cx(progress.range, className), ...props }),
+  Label: ({ className, ...props }) => /* @__PURE__ */ jsx18(Headless18.Label, { className: cx(progress.label, className), ...props })
 };
 
 // src/radio-group.tsx
-import { RadioGroup as Headless10 } from "@aeon-ui/react";
+import { RadioGroup as Headless19 } from "@aeon-ui/react";
 import { aeonRadioGroup } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 var radioGroup = aeonRadioGroup();
 var RadioGroup = {
-  Root: ({ className, ...props }) => /* @__PURE__ */ jsx10(Headless10.Root, { className: cx(radioGroup.root, className), ...props }),
-  Item: ({ className, ...props }) => /* @__PURE__ */ jsx10(Headless10.Item, { className: cx(radioGroup.item, className), ...props }),
-  ItemControl: ({ className, ...props }) => /* @__PURE__ */ jsx10(Headless10.ItemControl, { className: cx(radioGroup.itemControl, className), ...props }),
-  ItemIndicator: ({ className, ...props }) => /* @__PURE__ */ jsx10(Headless10.ItemIndicator, { className: cx(radioGroup.itemIndicator, className), ...props }),
-  ItemLabel: ({ className, ...props }) => /* @__PURE__ */ jsx10(Headless10.ItemLabel, { className: cx(radioGroup.itemLabel, className), ...props })
+  Root: ({ className, ...props }) => /* @__PURE__ */ jsx19(Headless19.Root, { className: cx(radioGroup.root, className), ...props }),
+  Item: ({ className, ...props }) => /* @__PURE__ */ jsx19(Headless19.Item, { className: cx(radioGroup.item, className), ...props }),
+  ItemControl: ({ className, ...props }) => /* @__PURE__ */ jsx19(Headless19.ItemControl, { className: cx(radioGroup.itemControl, className), ...props }),
+  ItemIndicator: ({ className, ...props }) => /* @__PURE__ */ jsx19(Headless19.ItemIndicator, { className: cx(radioGroup.itemIndicator, className), ...props }),
+  ItemLabel: ({ className, ...props }) => /* @__PURE__ */ jsx19(Headless19.ItemLabel, { className: cx(radioGroup.itemLabel, className), ...props })
 };
 
 // src/slider.tsx
-import { Slider as Headless11 } from "@aeon-ui/react";
+import { Slider as Headless20 } from "@aeon-ui/react";
 import { aeonSlider } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx11 } from "react/jsx-runtime";
+import { jsx as jsx20 } from "react/jsx-runtime";
 var slider = aeonSlider();
 var Slider = {
-  Root: ({ className, ...props }) => /* @__PURE__ */ jsx11(Headless11.Root, { className: cx(slider.root, className), ...props }),
-  Track: ({ className, ...props }) => /* @__PURE__ */ jsx11(Headless11.Track, { className: cx(slider.track, className), ...props }),
-  Range: ({ className, ...props }) => /* @__PURE__ */ jsx11(Headless11.Range, { className: cx(slider.range, className), ...props }),
-  Thumb: ({ className, ...props }) => /* @__PURE__ */ jsx11(Headless11.Thumb, { className: cx(slider.thumb, className), ...props }),
-  ValueText: ({ className, ...props }) => /* @__PURE__ */ jsx11(Headless11.ValueText, { className: cx(slider.valueText, className), ...props })
+  Root: ({ className, ...props }) => /* @__PURE__ */ jsx20(Headless20.Root, { className: cx(slider.root, className), ...props }),
+  Track: ({ className, ...props }) => /* @__PURE__ */ jsx20(Headless20.Track, { className: cx(slider.track, className), ...props }),
+  Range: ({ className, ...props }) => /* @__PURE__ */ jsx20(Headless20.Range, { className: cx(slider.range, className), ...props }),
+  Thumb: ({ className, ...props }) => /* @__PURE__ */ jsx20(Headless20.Thumb, { className: cx(slider.thumb, className), ...props }),
+  ValueText: ({ className, ...props }) => /* @__PURE__ */ jsx20(Headless20.ValueText, { className: cx(slider.valueText, className), ...props })
 };
 
 // src/pin-input.tsx
-import { PinInput as Headless12 } from "@aeon-ui/react";
+import { PinInput as Headless21 } from "@aeon-ui/react";
 import { aeonPinInput } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx21 } from "react/jsx-runtime";
 var pinInput = aeonPinInput();
 var PinInput = {
-  Root: ({ className, ...props }) => /* @__PURE__ */ jsx12(Headless12.Root, { className: cx(pinInput.root, className), ...props }),
-  Input: ({ className, ...props }) => /* @__PURE__ */ jsx12(Headless12.Input, { className: cx(pinInput.input, className), ...props }),
-  Group: Headless12.Group
+  Root: ({ className, ...props }) => /* @__PURE__ */ jsx21(Headless21.Root, { className: cx(pinInput.root, className), ...props }),
+  Input: ({ className, ...props }) => /* @__PURE__ */ jsx21(Headless21.Input, { className: cx(pinInput.input, className), ...props }),
+  Group: Headless21.Group
 };
 
 // src/accordion.tsx
-import { Accordion as Headless13 } from "@aeon-ui/react";
+import { Accordion as Headless22 } from "@aeon-ui/react";
 import { css } from "@aeon-ui/panda/styled-system/css";
 import { aeonAccordion } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx13, jsxs } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs } from "react/jsx-runtime";
 var accordion = aeonAccordion();
 var triggerLabel = css({ flex: "1", minW: "0", pr: "gapSm" });
 var Accordion = {
-  Root: ({ className, ...props }) => /* @__PURE__ */ jsx13(Headless13.Root, { className: cx(accordion.root, className), ...props }),
-  Item: ({ className, ...props }) => /* @__PURE__ */ jsx13(Headless13.Item, { className: cx(accordion.item, className), ...props }),
-  ItemTrigger: ({ className, children, ...props }) => /* @__PURE__ */ jsxs(Headless13.ItemTrigger, { className: cx(accordion.itemTrigger, className), ...props, children: [
-    /* @__PURE__ */ jsx13("span", { className: triggerLabel, children }),
-    /* @__PURE__ */ jsx13(Headless13.ItemIndicator, { className: accordion.itemIndicator, children: "\u25BE" })
+  Root: ({ className, ...props }) => /* @__PURE__ */ jsx22(Headless22.Root, { className: cx(accordion.root, className), ...props }),
+  Item: ({ className, ...props }) => /* @__PURE__ */ jsx22(Headless22.Item, { className: cx(accordion.item, className), ...props }),
+  ItemTrigger: ({ className, children, ...props }) => /* @__PURE__ */ jsxs(Headless22.ItemTrigger, { className: cx(accordion.itemTrigger, className), ...props, children: [
+    /* @__PURE__ */ jsx22("span", { className: triggerLabel, children }),
+    /* @__PURE__ */ jsx22(Headless22.ItemIndicator, { className: accordion.itemIndicator, children: "\u25BE" })
   ] }),
-  ItemContent: ({ className, ...props }) => /* @__PURE__ */ jsx13(Headless13.ItemContent, { className: cx(accordion.itemContent, className), ...props }),
-  ItemIndicator: Headless13.ItemIndicator
+  ItemContent: ({ className, ...props }) => /* @__PURE__ */ jsx22(Headless22.ItemContent, { className: cx(accordion.itemContent, className), ...props }),
+  ItemIndicator: Headless22.ItemIndicator
 };
 
 // src/badge.tsx
 import { aeonBadge } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 function Badge({ className, variant = "default", ...props }) {
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx23(
     "span",
     {
       "data-aeon-scope": "badge",
@@ -251,11 +559,211 @@ function Badge({ className, variant = "default", ...props }) {
   );
 }
 
+// src/bar.tsx
+import { Bar as Headless23 } from "@aeon-ui/react";
+import { aeonBar } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx24 } from "react/jsx-runtime";
+var Bar = {
+  Root: ({ className, size, sticky, collapse, ...props }) => {
+    const styles5 = aeonBar({ size, sticky, collapse });
+    return /* @__PURE__ */ jsx24(Headless23.Root, { className: cx(styles5.root, className), ...props });
+  },
+  Leading: ({ className, ...props }) => {
+    const styles5 = aeonBar({});
+    return /* @__PURE__ */ jsx24(Headless23.Leading, { className: cx(styles5.leading, className), ...props });
+  },
+  Center: ({ className, ...props }) => {
+    const styles5 = aeonBar({});
+    return /* @__PURE__ */ jsx24(Headless23.Center, { className: cx(styles5.center, className), ...props });
+  },
+  Trailing: ({ className, ...props }) => {
+    const styles5 = aeonBar({});
+    return /* @__PURE__ */ jsx24(Headless23.Trailing, { className: cx(styles5.trailing, className), ...props });
+  }
+};
+
+// src/panel.tsx
+import { Panel as Headless24 } from "@aeon-ui/react";
+import { aeonPanel } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx25 } from "react/jsx-runtime";
+var Panel = {
+  Group: ({ className, ...props }) => {
+    const styles5 = aeonPanel({});
+    return /* @__PURE__ */ jsx25(Headless24.Group, { className: cx(styles5.group, className), ...props });
+  },
+  Root: ({ className, size, ...props }) => {
+    const styles5 = aeonPanel({ size });
+    return /* @__PURE__ */ jsx25(Headless24.Root, { className: cx(styles5.root, className), ...props });
+  },
+  Trigger: ({ className, ...props }) => {
+    const styles5 = aeonPanel({});
+    return /* @__PURE__ */ jsx25(Headless24.Trigger, { className: cx(styles5.trigger, className), ...props });
+  },
+  Label: ({ className, ...props }) => {
+    const styles5 = aeonPanel({});
+    return /* @__PURE__ */ jsx25(Headless24.Label, { className: cx(styles5.label, className), ...props });
+  },
+  Content: ({ className, ...props }) => {
+    const styles5 = aeonPanel({});
+    return /* @__PURE__ */ jsx25(Headless24.Content, { className: cx(styles5.content, className), ...props });
+  }
+};
+
+// src/app-shell.tsx
+import { AppShell as Headless25 } from "@aeon-ui/react";
+import { aeonAppShell } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx26 } from "react/jsx-runtime";
+var AppShell = {
+  Root: ({ className, ...props }) => {
+    const styles5 = aeonAppShell();
+    return /* @__PURE__ */ jsx26(Headless25.Root, { className: cx(styles5.root, className), ...props });
+  },
+  Header: ({ className, ...props }) => {
+    const styles5 = aeonAppShell();
+    return /* @__PURE__ */ jsx26(Headless25.Header, { className: cx(styles5.header, className), ...props });
+  },
+  Subheader: ({ className, ...props }) => {
+    const styles5 = aeonAppShell();
+    return /* @__PURE__ */ jsx26(Headless25.Subheader, { className: cx(styles5.subheader, className), ...props });
+  },
+  Content: ({ className, contentAlign = "start", ...props }) => {
+    const styles5 = aeonAppShell({ contentAlign });
+    return /* @__PURE__ */ jsx26(Headless25.Content, { className: cx(styles5.content, className), ...props });
+  },
+  Aside: ({ className, ...props }) => {
+    const styles5 = aeonAppShell();
+    return /* @__PURE__ */ jsx26(Headless25.Aside, { className: cx(styles5.aside, className), ...props });
+  },
+  Footer: ({ className, ...props }) => {
+    const styles5 = aeonAppShell();
+    return /* @__PURE__ */ jsx26(Headless25.Footer, { className: cx(styles5.footer, className), ...props });
+  },
+  Dock: ({ className, ...props }) => {
+    const styles5 = aeonAppShell();
+    return /* @__PURE__ */ jsx26(Headless25.Dock, { className: cx(styles5.dock, className), ...props });
+  },
+  Scrim: ({ className, ...props }) => {
+    const styles5 = aeonAppShell();
+    return /* @__PURE__ */ jsx26(Headless25.Scrim, { className: cx(styles5.scrim, className), ...props });
+  }
+};
+
+// src/content.tsx
+import { Content as Headless26 } from "@aeon-ui/react";
+import { aeonContent } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx27 } from "react/jsx-runtime";
+var Content = {
+  Root: ({ className, align = "start", ...props }) => {
+    const styles5 = aeonContent({ align });
+    return /* @__PURE__ */ jsx27(Headless26.Root, { className: cx(styles5.root, className), ...props });
+  },
+  Toolbar: ({ className, ...props }) => {
+    const styles5 = aeonContent();
+    return /* @__PURE__ */ jsx27(Headless26.Toolbar, { className: cx(styles5.toolbar, className), ...props });
+  },
+  Body: ({ className, ...props }) => {
+    const styles5 = aeonContent();
+    return /* @__PURE__ */ jsx27(Headless26.Body, { className: cx(styles5.body, className), ...props });
+  },
+  Pending: ({ className, ...props }) => {
+    const styles5 = aeonContent();
+    return /* @__PURE__ */ jsx27(Headless26.Pending, { className: cx(styles5.pending, className), ...props });
+  },
+  Empty: ({ className, ...props }) => {
+    const styles5 = aeonContent();
+    return /* @__PURE__ */ jsx27(Headless26.Empty, { className: cx(styles5.empty, className), ...props });
+  },
+  Error: ({ className, ...props }) => {
+    const styles5 = aeonContent();
+    return /* @__PURE__ */ jsx27(Headless26.Error, { className: cx(styles5.error, className), ...props });
+  },
+  Success: ({ className, ...props }) => {
+    const styles5 = aeonContent();
+    return /* @__PURE__ */ jsx27(Headless26.Success, { className: cx(styles5.success, className), ...props });
+  },
+  Sentinel: ({ className, ...props }) => {
+    const styles5 = aeonContent();
+    return /* @__PURE__ */ jsx27(Headless26.Sentinel, { className: cx(styles5.sentinel, className), ...props });
+  }
+};
+
+// src/nav.tsx
+import { Nav as Headless27 } from "@aeon-ui/react";
+import { aeonNav } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx28 } from "react/jsx-runtime";
+var Nav = {
+  Root: ({ className, size, layout = "inline", ...props }) => {
+    const styles5 = aeonNav({ size, layout });
+    return /* @__PURE__ */ jsx28(
+      Headless27.Root,
+      {
+        className: cx(styles5.root, className),
+        "data-aeon-layout": layout,
+        ...props
+      }
+    );
+  },
+  Item: ({ className, ...props }) => {
+    const styles5 = aeonNav({});
+    return /* @__PURE__ */ jsx28(Headless27.Item, { className: cx(styles5.item, className), ...props });
+  },
+  Indicator: ({ className, ...props }) => {
+    const styles5 = aeonNav({});
+    return /* @__PURE__ */ jsx28(Headless27.Indicator, { className: cx(styles5.indicator, className), ...props });
+  },
+  Label: ({ className, ...props }) => {
+    const styles5 = aeonNav({});
+    return /* @__PURE__ */ jsx28(Headless27.Label, { className: cx(styles5.label, className), ...props });
+  },
+  Icon: ({ className, ...props }) => {
+    const styles5 = aeonNav({});
+    return /* @__PURE__ */ jsx28(Headless27.Icon, { className: cx(styles5.icon, className), ...props });
+  },
+  Badge: ({ className, ...props }) => {
+    const styles5 = aeonNav({});
+    return /* @__PURE__ */ jsx28(Headless27.Badge, { className: cx(styles5.badge, className), ...props });
+  }
+};
+
+// src/sticky-bar.tsx
+import { StickyBar as Headless28 } from "@aeon-ui/react";
+import { aeonBar as aeonBar2 } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx29 } from "react/jsx-runtime";
+var StickyBar = {
+  Root: ({ className, size, placement = "top", ...props }) => {
+    const styles5 = aeonBar2({ size, placement });
+    return /* @__PURE__ */ jsx29(
+      Headless28.Root,
+      {
+        className: cx(styles5.root, className),
+        placement,
+        ...props
+      }
+    );
+  },
+  Leading: ({ className, ...props }) => {
+    const styles5 = aeonBar2({});
+    return /* @__PURE__ */ jsx29(Headless28.Leading, { className: cx(styles5.leading, className), ...props });
+  },
+  Center: ({ className, ...props }) => {
+    const styles5 = aeonBar2({});
+    return /* @__PURE__ */ jsx29(Headless28.Center, { className: cx(styles5.center, className), ...props });
+  },
+  Trailing: ({ className, ...props }) => {
+    const styles5 = aeonBar2({});
+    return /* @__PURE__ */ jsx29(Headless28.Trailing, { className: cx(styles5.trailing, className), ...props });
+  },
+  Seam: ({ className, ...props }) => {
+    const styles5 = aeonBar2({});
+    return /* @__PURE__ */ jsx29(Headless28.Seam, { className: cx(styles5.seam, className), ...props });
+  }
+};
+
 // src/scroll.tsx
-import { Scroll as Headless14, useScrollContext } from "@aeon-ui/react";
+import { Scroll as Headless29, useScrollContext } from "@aeon-ui/react";
 import { aeonScroll } from "@aeon-ui/panda/styled-system/recipes";
 import { createContext, useContext } from "react";
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx30 } from "react/jsx-runtime";
 var ScrollStyleCtx = createContext(null);
 function useScrollStyles() {
   const s = useContext(ScrollStyleCtx);
@@ -265,163 +773,206 @@ function useScrollStyles() {
 var Scroll = {
   Root: ({ className, axis = "both", maxH = "md", children, ...props }) => {
     const s = aeonScroll({ axis, maxH });
-    return /* @__PURE__ */ jsx15(ScrollStyleCtx.Provider, { value: s, children: /* @__PURE__ */ jsx15(Headless14.Root, { className: cx(s.root, className), ...props, children }) });
+    return /* @__PURE__ */ jsx30(ScrollStyleCtx.Provider, { value: s, children: /* @__PURE__ */ jsx30(Headless29.Root, { className: cx(s.root, className), ...props, children }) });
   },
   Viewport: ({ className, ...props }) => {
     const s = useScrollStyles();
-    return /* @__PURE__ */ jsx15(Headless14.Viewport, { className: cx(s.viewport, className), ...props });
+    return /* @__PURE__ */ jsx30(Headless29.Viewport, { className: cx(s.viewport, className), ...props });
   },
   Content: ({ className, ...props }) => {
     const s = useScrollStyles();
-    return /* @__PURE__ */ jsx15(Headless14.Content, { className: cx(s.content, className), ...props });
+    return /* @__PURE__ */ jsx30(Headless29.Content, { className: cx(s.content, className), ...props });
   },
   StateReadout: ({ className }) => {
     const { stateAttr } = useScrollContext();
-    return /* @__PURE__ */ jsx15("code", { className, "data-aeon-part": "state-readout", children: stateAttr });
+    return /* @__PURE__ */ jsx30("code", { className, "data-aeon-part": "state-readout", children: stateAttr });
   }
 };
 
 // src/select.tsx
-import { Select as Headless15 } from "@aeon-ui/react";
+import { Select as Headless30 } from "@aeon-ui/react";
 import { aeonSelect } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx31 } from "react/jsx-runtime";
 var styles3 = () => aeonSelect();
 var Select = {
   Root: ({ className, ...props }) => {
     const s = styles3();
-    return /* @__PURE__ */ jsx16(Headless15.Root, { className: cx(s.root, className), ...props });
+    return /* @__PURE__ */ jsx31(Headless30.Root, { className: cx(s.root, className), ...props });
   },
   Trigger: ({ className, ...props }) => {
     const s = styles3();
-    return /* @__PURE__ */ jsx16(Headless15.Trigger, { className: cx(s.trigger, className), ...props });
+    return /* @__PURE__ */ jsx31(Headless30.Trigger, { className: cx(s.trigger, className), ...props });
   },
   Content: ({ className, ...props }) => {
     const s = styles3();
-    return /* @__PURE__ */ jsx16(Headless15.Content, { className: cx(s.content, className), ...props });
+    return /* @__PURE__ */ jsx31(Headless30.Content, { className: cx(s.content, className), ...props });
   },
   ValueText: ({ className, ...props }) => {
     const s = styles3();
-    return /* @__PURE__ */ jsx16(Headless15.ValueText, { className: cx(s.value, className), ...props });
+    return /* @__PURE__ */ jsx31(Headless30.ValueText, { className: cx(s.value, className), ...props });
   },
-  Positioner: ({ className, ...props }) => /* @__PURE__ */ jsx16(Headless15.Positioner, { className, ...props }),
+  Positioner: ({ className, ...props }) => /* @__PURE__ */ jsx31(Headless30.Positioner, { className, ...props }),
   Item: ({ className, ...props }) => {
     const s = styles3();
-    return /* @__PURE__ */ jsx16(Headless15.Item, { className: cx(s.item, className), ...props });
+    return /* @__PURE__ */ jsx31(Headless30.Item, { className: cx(s.item, className), ...props });
   }
 };
 
 // src/combobox.tsx
-import { Combobox as Headless16 } from "@aeon-ui/react";
+import { Combobox as Headless31 } from "@aeon-ui/react";
 import { aeonCombobox } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx32 } from "react/jsx-runtime";
 var styles4 = () => aeonCombobox();
 var Combobox = {
   Root: ({ className, ...props }) => {
     const s = styles4();
-    return /* @__PURE__ */ jsx17(Headless16.Root, { className: cx(s.root, className), ...props });
+    return /* @__PURE__ */ jsx32(Headless31.Root, { className: cx(s.root, className), ...props });
   },
   Input: ({ className, ...props }) => {
     const s = styles4();
-    return /* @__PURE__ */ jsx17(Headless16.Input, { className: cx(s.input, className), ...props });
+    return /* @__PURE__ */ jsx32(Headless31.Input, { className: cx(s.input, className), ...props });
   },
   Content: ({ className, ...props }) => {
     const s = styles4();
-    return /* @__PURE__ */ jsx17(Headless16.Content, { className: cx(s.content, className), ...props });
+    return /* @__PURE__ */ jsx32(Headless31.Content, { className: cx(s.content, className), ...props });
   },
   Item: ({ className, ...props }) => {
     const s = styles4();
-    return /* @__PURE__ */ jsx17(Headless16.Item, { className: cx(s.item, className), ...props });
+    return /* @__PURE__ */ jsx32(Headless31.Item, { className: cx(s.item, className), ...props });
   },
   Empty: ({ className, ...props }) => {
     const s = styles4();
-    return /* @__PURE__ */ jsx17(Headless16.Empty, { className: cx(s.empty, className), ...props });
+    return /* @__PURE__ */ jsx32(Headless31.Empty, { className: cx(s.empty, className), ...props });
   }
 };
 
 // src/menu.tsx
-import { Menu as Headless17 } from "@aeon-ui/react";
+import { Menu as Headless32 } from "@aeon-ui/react";
 import { aeonMenu } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx33 } from "react/jsx-runtime";
 var menu = aeonMenu();
 var Menu = {
-  Root: Headless17.Root,
-  Trigger: ({ className, ...props }) => /* @__PURE__ */ jsx18(Headless17.Trigger, { className: cx(menu.trigger, className), ...props }),
-  Positioner: ({ className, ...props }) => /* @__PURE__ */ jsx18(Headless17.Positioner, { className: cx(menu.positioner, className), ...props }),
-  Content: ({ className, ...props }) => /* @__PURE__ */ jsx18(Headless17.Content, { className: cx(menu.content, className), ...props }),
-  Item: ({ className, ...props }) => /* @__PURE__ */ jsx18(Headless17.Item, { className: cx(menu.item, className), ...props }),
-  Separator: ({ className, ...props }) => /* @__PURE__ */ jsx18(Headless17.Separator, { className: cx(menu.separator, className), ...props })
+  Root: Headless32.Root,
+  Trigger: ({ className, ...props }) => /* @__PURE__ */ jsx33(Headless32.Trigger, { className: cx(menu.trigger, className), ...props }),
+  Positioner: ({ className, ...props }) => /* @__PURE__ */ jsx33(Headless32.Positioner, { className: cx(menu.positioner, className), ...props }),
+  Content: ({ className, ...props }) => /* @__PURE__ */ jsx33(Headless32.Content, { className: cx(menu.content, className), ...props }),
+  Item: ({ className, ...props }) => /* @__PURE__ */ jsx33(Headless32.Item, { className: cx(menu.item, className), ...props }),
+  Separator: ({ className, ...props }) => /* @__PURE__ */ jsx33(Headless32.Separator, { className: cx(menu.separator, className), ...props })
 };
 
 // src/popover.tsx
-import { Popover as Headless18 } from "@aeon-ui/react";
+import { Popover as Headless33 } from "@aeon-ui/react";
 import { aeonPopover } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx34 } from "react/jsx-runtime";
 var popover = aeonPopover();
 var Popover = {
-  Root: Headless18.Root,
-  Trigger: ({ className, ...props }) => /* @__PURE__ */ jsx19(Headless18.Trigger, { className: cx(popover.trigger, className), ...props }),
-  Positioner: ({ className, ...props }) => /* @__PURE__ */ jsx19(Headless18.Positioner, { className: cx(popover.positioner, className), ...props }),
-  Content: ({ className, ...props }) => /* @__PURE__ */ jsx19(Headless18.Content, { className: cx(popover.content, className), ...props }),
-  CloseTrigger: ({ className, ...props }) => /* @__PURE__ */ jsx19(Headless18.CloseTrigger, { className: cx(popover.closeTrigger, className), ...props })
+  Root: Headless33.Root,
+  Trigger: ({ className, ...props }) => /* @__PURE__ */ jsx34(Headless33.Trigger, { className: cx(popover.trigger, className), ...props }),
+  Positioner: ({ className, ...props }) => /* @__PURE__ */ jsx34(Headless33.Positioner, { className: cx(popover.positioner, className), ...props }),
+  Content: ({ className, ...props }) => /* @__PURE__ */ jsx34(Headless33.Content, { className: cx(popover.content, className), ...props }),
+  CloseTrigger: ({ className, ...props }) => /* @__PURE__ */ jsx34(Headless33.CloseTrigger, { className: cx(popover.closeTrigger, className), ...props })
 };
 
 // src/tooltip.tsx
-import { Tooltip as Headless19 } from "@aeon-ui/react";
+import { Tooltip as Headless34 } from "@aeon-ui/react";
 import { aeonTooltip } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx35 } from "react/jsx-runtime";
 var tooltip = aeonTooltip();
 var Tooltip = {
-  Root: Headless19.Root,
-  Trigger: ({ className, ...props }) => /* @__PURE__ */ jsx20(Headless19.Trigger, { className: cx(tooltip.trigger, className), ...props }),
-  Positioner: ({ className, ...props }) => /* @__PURE__ */ jsx20(Headless19.Positioner, { className: cx(tooltip.positioner, className), ...props }),
-  Content: ({ className, ...props }) => /* @__PURE__ */ jsx20(Headless19.Content, { className: cx(tooltip.content, className), ...props })
+  Root: Headless34.Root,
+  Trigger: ({ className, ...props }) => /* @__PURE__ */ jsx35(Headless34.Trigger, { className: cx(tooltip.trigger, className), ...props }),
+  Positioner: ({ className, ...props }) => /* @__PURE__ */ jsx35(Headless34.Positioner, { className: cx(tooltip.positioner, className), ...props }),
+  Content: ({ className, ...props }) => /* @__PURE__ */ jsx35(Headless34.Content, { className: cx(tooltip.content, className), ...props })
 };
 
 // src/toast.tsx
-import { Toast as Headless20, useToast } from "@aeon-ui/react";
+import { Toast as Headless35, useToast } from "@aeon-ui/react";
 import { aeonToast } from "@aeon-ui/panda/styled-system/recipes";
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { jsx as jsx36 } from "react/jsx-runtime";
 var toast = aeonToast();
 var Toast = {
-  Provider: Headless20.Provider,
+  Provider: Headless35.Provider,
   Viewport: ({
     className,
     placement = "bottom-end",
     ...props
-  }) => /* @__PURE__ */ jsx21(
-    Headless20.Viewport,
+  }) => /* @__PURE__ */ jsx36(
+    Headless35.Viewport,
     {
       className: cx(toast.viewport, className),
       placement,
       ...props
     }
   ),
-  Root: ({ className, ...props }) => /* @__PURE__ */ jsx21(Headless20.Root, { className: cx(toast.root, className), ...props }),
-  Title: ({ className, ...props }) => /* @__PURE__ */ jsx21(Headless20.Title, { className: cx(toast.title, className), ...props }),
-  Description: ({ className, ...props }) => /* @__PURE__ */ jsx21(Headless20.Description, { className: cx(toast.description, className), ...props }),
-  CloseTrigger: ({ className, ...props }) => /* @__PURE__ */ jsx21(Headless20.CloseTrigger, { className: cx(toast.closeTrigger, className), ...props }),
-  Show: Headless20.Show
+  Root: ({ className, ...props }) => /* @__PURE__ */ jsx36(Headless35.Root, { className: cx(toast.root, className), ...props }),
+  Title: ({ className, ...props }) => /* @__PURE__ */ jsx36(Headless35.Title, { className: cx(toast.title, className), ...props }),
+  Description: ({ className, ...props }) => /* @__PURE__ */ jsx36(Headless35.Description, { className: cx(toast.description, className), ...props }),
+  CloseTrigger: ({ className, ...props }) => /* @__PURE__ */ jsx36(Headless35.CloseTrigger, { className: cx(toast.closeTrigger, className), ...props }),
+  Show: Headless35.Show
+};
+
+// src/theme-switcher.tsx
+import { ThemeSwitcher as Headless36 } from "@aeon-ui/react";
+import { aeonThemeSwitcher } from "@aeon-ui/panda/styled-system/recipes";
+import { jsx as jsx37 } from "react/jsx-runtime";
+var ThemeSwitcher = {
+  Root: ({ className, size, ...props }) => {
+    const styles5 = aeonThemeSwitcher({ size });
+    return /* @__PURE__ */ jsx37(Headless36.Root, { className: cx(styles5.root, className), ...props });
+  },
+  Modes: ({ className, ...props }) => {
+    const styles5 = aeonThemeSwitcher({});
+    return /* @__PURE__ */ jsx37(Headless36.Modes, { className: cx(styles5.modes, className), ...props });
+  },
+  ModeBtn: ({ className, ...props }) => {
+    const styles5 = aeonThemeSwitcher({});
+    return /* @__PURE__ */ jsx37(Headless36.ModeBtn, { className: cx(styles5.modeBtn, className), ...props });
+  },
+  ThemeSelect: ({ className, ...props }) => {
+    const styles5 = aeonThemeSwitcher({});
+    return /* @__PURE__ */ jsx37(Headless36.ThemeSelect, { className: cx(styles5.themeSelect, className), ...props });
+  },
+  ThemeTrigger: ({ className, ...props }) => {
+    const styles5 = aeonThemeSwitcher({});
+    return /* @__PURE__ */ jsx37(Headless36.ThemeTrigger, { className: cx(styles5.themeTrigger, className), ...props });
+  }
 };
 export {
   Accordion,
+  AppShell,
   Async,
+  Avatar,
   Badge,
+  Bar,
   Button,
   Checkbox,
   Combobox,
+  Composer,
+  Content,
+  Conversation,
   Dialog,
+  Entry,
   Field,
+  Identity,
+  ListRow,
   Menu,
+  MetricStrip,
+  Nav,
+  Panel,
   PinInput,
   Popover,
+  ProfileHeader,
   Progress,
   RadioGroup,
   Scroll,
   Select,
   Separator,
   Slider,
+  StickyBar,
   Switch,
   Tabs,
+  ThemeSwitcher,
+  Thread,
   Toast,
   Tooltip,
   cx as cn,