@nexub/react 1.0.0 → 1.2.0

package/dist/chunk-JQDLCN5D.js

@@ -0,0 +1,66 @@
+'use client';
+import {
+  cn
+} from "./chunk-AT6RPKU3.js";
+
+// src/components/Accordion/Accordion.tsx
+import * as React from "react";
+import * as RadixAccordion from "@radix-ui/react-accordion";
+import { ChevronDown } from "@nexub/icons";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Root2 = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    RadixAccordion.Root,
+    {
+      ref,
+      className: cn("divide-y divide-[var(--color-border-default)]", className),
+      ...props
+    }
+  )
+);
+Root2.displayName = "Accordion.Root";
+var Item2 = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(RadixAccordion.Item, { ref, className: cn("", className), ...props })
+);
+Item2.displayName = "Accordion.Item";
+var Trigger2 = React.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(RadixAccordion.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
+    RadixAccordion.Trigger,
+    {
+      ref,
+      className: cn(
+        "flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all",
+        "hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-ring-default)]",
+        "[&[data-state=open]>svg]:rotate-180",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(ChevronDown, { size: "sm", className: "shrink-0 transition-transform duration-200", "aria-hidden": "true" })
+      ]
+    }
+  ) })
+);
+Trigger2.displayName = "Accordion.Trigger";
+var Content2 = React.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
+    RadixAccordion.Content,
+    {
+      ref,
+      className: cn(
+        "overflow-hidden text-sm",
+        "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx("div", { className: "pb-4", children })
+    }
+  )
+);
+Content2.displayName = "Accordion.Content";
+var Accordion = { Root: Root2, Item: Item2, Trigger: Trigger2, Content: Content2 };
+
+export {
+  Accordion
+};

package/dist/chunk-K7CUCLLI.js

@@ -0,0 +1,43 @@
+'use client';
+import {
+  toggleVariants
+} from "./chunk-U3EGB3JL.js";
+import {
+  cn
+} from "./chunk-AT6RPKU3.js";
+
+// src/components/ToggleGroup/ToggleGroup.tsx
+import * as React from "react";
+import * as RadixToggleGroup from "@radix-ui/react-toggle-group";
+import { jsx } from "react/jsx-runtime";
+var ToggleGroupContext = React.createContext({});
+var Root2 = React.forwardRef(
+  ({ className, variant, size, ...props }, ref) => /* @__PURE__ */ jsx(ToggleGroupContext.Provider, { value: { variant, size }, children: /* @__PURE__ */ jsx(
+    RadixToggleGroup.Root,
+    {
+      ref,
+      className: cn("flex items-center gap-1", className),
+      ...props
+    }
+  ) })
+);
+Root2.displayName = "ToggleGroup.Root";
+var Item2 = React.forwardRef(
+  ({ className, variant, size, ...props }, ref) => {
+    const ctx = React.useContext(ToggleGroupContext);
+    return /* @__PURE__ */ jsx(
+      RadixToggleGroup.Item,
+      {
+        ref,
+        className: cn(toggleVariants({ variant: variant ?? ctx.variant, size: size ?? ctx.size }), className),
+        ...props
+      }
+    );
+  }
+);
+Item2.displayName = "ToggleGroup.Item";
+var ToggleGroup = { Root: Root2, Item: Item2 };
+
+export {
+  ToggleGroup
+};

package/dist/chunk-KBB7M6WO.js

@@ -0,0 +1,65 @@
+'use client';
+import {
+  cn
+} from "./chunk-AT6RPKU3.js";
+
+// src/components/Stack/Stack.tsx
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { jsx } from "react/jsx-runtime";
+function injectDividers(children, divider) {
+  const childArray = React.Children.toArray(children);
+  return childArray.reduce((acc, child, index) => {
+    if (index > 0) {
+      acc.push(
+        /* @__PURE__ */ jsx(React.Fragment, { children: divider }, `divider-${index}`)
+      );
+    }
+    acc.push(child);
+    return acc;
+  }, []);
+}
+var Stack = React.forwardRef(
+  ({
+    direction = "column",
+    gap,
+    align,
+    justify,
+    wrap = false,
+    divider,
+    asChild = false,
+    className,
+    style,
+    children,
+    ...rest
+  }, ref) => {
+    const Comp = asChild ? Slot : "div";
+    const inlineStyle = {
+      ...gap !== void 0 ? { gap: typeof gap === "number" ? `${gap * 0.25}rem` : gap } : {},
+      ...align ? { alignItems: align } : {},
+      ...justify ? { justifyContent: justify } : {},
+      ...style
+    };
+    const content = divider ? injectDividers(children, divider) : children;
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        ref,
+        className: cn(
+          "flex",
+          direction === "row" ? "flex-row" : "flex-col",
+          wrap && "flex-wrap",
+          className
+        ),
+        style: inlineStyle,
+        ...rest,
+        children: content
+      }
+    );
+  }
+);
+Stack.displayName = "Stack";
+
+export {
+  Stack
+};

package/dist/chunk-KLTQJZOX.js

@@ -0,0 +1 @@
+'use client';

package/dist/chunk-KWWV3CM3.js

@@ -0,0 +1,62 @@
+'use client';
+import {
+  cn
+} from "./chunk-AT6RPKU3.js";
+
+// src/components/Separator/Separator.tsx
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+var separatorVariants = cva("", {
+  variants: {
+    orientation: {
+      horizontal: "w-full border-t",
+      vertical: "h-full border-l self-stretch"
+    },
+    tone: {
+      neutral: "border-[var(--color-border-default)]",
+      info: "border-[var(--color-semantic-info-default)]/30",
+      success: "border-[var(--color-semantic-success-default)]/30",
+      warning: "border-[var(--color-semantic-warning-default)]/30",
+      danger: "border-[var(--color-semantic-error-default)]/30",
+      leap: "border-[var(--color-leap-500)]/30",
+      bookub: "border-[var(--color-bookub-500)]/30",
+      payub: "border-[var(--color-payub-500)]/30",
+      founderub: "border-[var(--color-founderub-500)]/30"
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    tone: "neutral"
+  }
+});
+var Separator = React.forwardRef(({ className, orientation = "horizontal", tone = "neutral", ...props }, ref) => {
+  if (orientation === "horizontal") {
+    return /* @__PURE__ */ jsx(
+      "hr",
+      {
+        ref,
+        role: "separator",
+        "aria-orientation": "horizontal",
+        className: cn(separatorVariants({ orientation, tone }), className),
+        ...props
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      role: "separator",
+      "aria-orientation": "vertical",
+      className: cn(separatorVariants({ orientation, tone }), className),
+      ...props
+    }
+  );
+});
+Separator.displayName = "Separator";
+
+export {
+  separatorVariants,
+  Separator
+};

package/dist/chunk-KZW37FQZ.js

@@ -0,0 +1,40 @@
+'use client';
+import {
+  cn
+} from "./chunk-AT6RPKU3.js";
+
+// src/components/AppShell/AppShell.tsx
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+var Root = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn("grid h-screen grid-rows-[auto_1fr] overflow-hidden", className),
+      ...props
+    }
+  )
+);
+Root.displayName = "AppShell.Root";
+var Header = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("col-span-full row-start-1", className), ...props })
+);
+Header.displayName = "AppShell.Header";
+var Body = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("flex overflow-hidden row-start-2", className), ...props })
+);
+Body.displayName = "AppShell.Body";
+var SidebarSlot = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("shrink-0 overflow-y-auto", className), ...props })
+);
+SidebarSlot.displayName = "AppShell.Sidebar";
+var Main = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("main", { ref, className: cn("flex-1 overflow-y-auto p-6", className), ...props })
+);
+Main.displayName = "AppShell.Main";
+var AppShell = { Root, Header, Body, Sidebar: SidebarSlot, Main };
+
+export {
+  AppShell
+};

package/dist/chunk-LAWZQ6R6.js

@@ -0,0 +1,76 @@
+'use client';
+import {
+  cn
+} from "./chunk-AT6RPKU3.js";
+
+// src/components/Heading/Heading.tsx
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+var headingVariants = cva("", {
+  variants: {
+    size: {
+      display: "text-6xl font-extrabold tracking-tight leading-none",
+      h1: "text-5xl font-bold tracking-tight leading-tight",
+      h2: "text-4xl font-bold tracking-tight leading-tight",
+      h3: "text-3xl font-semibold leading-snug",
+      h4: "text-2xl font-semibold leading-snug",
+      h5: "text-xl font-semibold leading-snug",
+      h6: "text-base font-semibold leading-normal"
+    },
+    weight: {
+      regular: "font-normal",
+      medium: "font-medium",
+      semibold: "font-semibold",
+      bold: "font-bold",
+      extrabold: "font-extrabold"
+    }
+  }
+});
+var levelSizeMap = {
+  1: "h1",
+  2: "h2",
+  3: "h3",
+  4: "h4",
+  5: "h5",
+  6: "h6"
+};
+var Heading = React.forwardRef(
+  ({
+    level = 2,
+    size,
+    tone,
+    weight,
+    asChild = false,
+    className,
+    style,
+    children,
+    ...rest
+  }, ref) => {
+    const resolvedSize = size ?? levelSizeMap[level];
+    const Tag = `h${level}`;
+    const Comp = asChild ? Slot : Tag;
+    const toneStyle = tone && tone !== "default" ? { color: `var(--color-text-${tone})` } : {};
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        ref,
+        className: cn(
+          headingVariants({ size: resolvedSize, weight }),
+          className
+        ),
+        style: { ...toneStyle, ...style },
+        "data-tone": tone,
+        ...rest,
+        children
+      }
+    );
+  }
+);
+Heading.displayName = "Heading";
+
+export {
+  headingVariants,
+  Heading
+};

package/dist/chunk-LOP63AVE.js

@@ -0,0 +1,49 @@
+'use client';
+import {
+  cn
+} from "./chunk-AT6RPKU3.js";
+
+// src/components/Section/Section.tsx
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { jsx } from "react/jsx-runtime";
+var sectionVariants = cva("w-full", {
+  variants: {
+    paddingY: {
+      sm: "py-12",
+      md: "py-20",
+      lg: "py-32"
+    },
+    tone: {
+      default: "bg-[var(--color-bg-default)]",
+      subtle: "bg-[var(--color-bg-subtle)]",
+      muted: "bg-[var(--color-bg-muted)]",
+      inverse: "bg-[var(--color-bg-inverse)] text-[var(--color-text-inverse)]"
+    }
+  },
+  defaultVariants: {
+    paddingY: "md",
+    tone: "default"
+  }
+});
+var Section = React.forwardRef(
+  ({ paddingY, tone, asChild = false, className, children, ...rest }, ref) => {
+    const Comp = asChild ? Slot : "section";
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        ref,
+        className: cn(sectionVariants({ paddingY, tone }), className),
+        ...rest,
+        children
+      }
+    );
+  }
+);
+Section.displayName = "Section";
+
+export {
+  sectionVariants,
+  Section
+};

package/dist/chunk-MY6XUJ5P.js

@@ -0,0 +1,216 @@
+'use client';
+import {
+  cn
+} from "./chunk-AT6RPKU3.js";
+
+// src/components/Menubar/Menubar.tsx
+import * as React from "react";
+import * as RadixMenubar from "@radix-ui/react-menubar";
+import { Check, ChevronRight } from "@nexub/icons";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Menu2 = RadixMenubar.Menu;
+var Portal2 = RadixMenubar.Portal;
+var Group2 = RadixMenubar.Group;
+var RadioGroup2 = RadixMenubar.RadioGroup;
+var Sub2 = RadixMenubar.Sub;
+var Root2 = React.forwardRef(
+  function MenubarRoot({ className, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      RadixMenubar.Root,
+      {
+        ref,
+        className: cn(
+          "flex h-9 items-center gap-1 rounded-md border border-[var(--color-border-default)]",
+          "bg-[var(--color-bg-default)] px-3",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+Root2.displayName = "Menubar.Root";
+var Trigger2 = React.forwardRef(
+  function MenubarTrigger({ className, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      RadixMenubar.Trigger,
+      {
+        ref,
+        className: cn(
+          "relative flex cursor-default select-none items-center rounded-sm px-3 py-1 text-sm font-medium",
+          "outline-none focus:bg-[var(--color-bg-subtle)]",
+          "data-[state=open]:bg-[var(--color-bg-subtle)]",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+Trigger2.displayName = "Menubar.Trigger";
+var contentBaseClasses = cn(
+  "z-[var(--z-popover)] min-w-48 rounded-lg border border-[var(--color-border-default)]",
+  "bg-[var(--color-bg-default)] p-1 shadow-md outline-none",
+  "data-[state=open]:animate-in data-[state=closed]:animate-out",
+  "data-[state=open]:fade-in-0 data-[state=closed]:fade-out-0",
+  "data-[state=open]:zoom-in-95 data-[state=closed]:zoom-out-95",
+  "data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2",
+  "data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2"
+);
+var Content2 = React.forwardRef(
+  function MenubarContent({ className, sideOffset = 8, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      RadixMenubar.Content,
+      {
+        ref,
+        sideOffset,
+        className: cn(contentBaseClasses, className),
+        ...props
+      }
+    );
+  }
+);
+Content2.displayName = "Menubar.Content";
+var itemBaseClasses = cn(
+  "relative flex cursor-default select-none items-center rounded-md px-2 py-1.5 text-sm outline-none",
+  "transition-colors hover:bg-[var(--color-bg-subtle)] focus:bg-[var(--color-bg-subtle)]",
+  "data-[disabled]:pointer-events-none data-[disabled]:opacity-50"
+);
+var Item2 = React.forwardRef(
+  function MenubarItem({ className, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      RadixMenubar.Item,
+      {
+        ref,
+        className: cn(itemBaseClasses, className),
+        ...props
+      }
+    );
+  }
+);
+Item2.displayName = "Menubar.Item";
+var Label2 = React.forwardRef(
+  function MenubarLabel({ className, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      RadixMenubar.Label,
+      {
+        ref,
+        className: cn(
+          "px-2 py-1 text-xs font-semibold text-[var(--color-text-muted)]",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+Label2.displayName = "Menubar.Label";
+var Separator2 = React.forwardRef(
+  function MenubarSeparator({ className, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      RadixMenubar.Separator,
+      {
+        ref,
+        className: cn("-mx-1 my-1 h-px bg-[var(--color-border-default)]", className),
+        ...props
+      }
+    );
+  }
+);
+Separator2.displayName = "Menubar.Separator";
+var CheckboxItem2 = React.forwardRef(function MenubarCheckboxItem({ className, children, checked, ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    RadixMenubar.CheckboxItem,
+    {
+      ref,
+      className: cn(itemBaseClasses, "pl-8", className),
+      checked,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-4 w-4 items-center justify-center", children: /* @__PURE__ */ jsx(RadixMenubar.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }) }),
+        children
+      ]
+    }
+  );
+});
+CheckboxItem2.displayName = "Menubar.CheckboxItem";
+var RadioItem2 = React.forwardRef(function MenubarRadioItem({ className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    RadixMenubar.RadioItem,
+    {
+      ref,
+      className: cn(itemBaseClasses, "pl-8", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-4 w-4 items-center justify-center", children: /* @__PURE__ */ jsx(RadixMenubar.ItemIndicator, { children: /* @__PURE__ */ jsx("svg", { className: "h-2 w-2 fill-current", viewBox: "0 0 8 8", "aria-hidden": "true", children: /* @__PURE__ */ jsx("circle", { cx: "4", cy: "4", r: "4" }) }) }) }),
+        children
+      ]
+    }
+  );
+});
+RadioItem2.displayName = "Menubar.RadioItem";
+var SubTrigger2 = React.forwardRef(function MenubarSubTrigger({ className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    RadixMenubar.SubTrigger,
+    {
+      ref,
+      className: cn(
+        itemBaseClasses,
+        "data-[state=open]:bg-[var(--color-bg-subtle)]",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(ChevronRight, { className: "ml-auto h-4 w-4" })
+      ]
+    }
+  );
+});
+SubTrigger2.displayName = "Menubar.SubTrigger";
+var SubContent2 = React.forwardRef(function MenubarSubContent({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    RadixMenubar.SubContent,
+    {
+      ref,
+      className: cn(contentBaseClasses, className),
+      ...props
+    }
+  );
+});
+SubContent2.displayName = "Menubar.SubContent";
+var Arrow2 = React.forwardRef(
+  function MenubarArrow({ className, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      RadixMenubar.Arrow,
+      {
+        ref,
+        className: cn("fill-[var(--color-border-default)]", className),
+        ...props
+      }
+    );
+  }
+);
+Arrow2.displayName = "Menubar.Arrow";
+var Menubar = {
+  Root: Root2,
+  Menu: Menu2,
+  Trigger: Trigger2,
+  Portal: Portal2,
+  Content: Content2,
+  Item: Item2,
+  Group: Group2,
+  Label: Label2,
+  Separator: Separator2,
+  CheckboxItem: CheckboxItem2,
+  RadioGroup: RadioGroup2,
+  RadioItem: RadioItem2,
+  Sub: Sub2,
+  SubTrigger: SubTrigger2,
+  SubContent: SubContent2,
+  Arrow: Arrow2
+};
+
+export {
+  Menubar
+};