@egcs/newui 0.0.0-stage → 0.1.0-alpha.0

package/dist/chunks/solid-TKZTUEHU.jsx

@@ -0,0 +1,55 @@
+import { SidebarToggle } from "./solid-G7GUF6FY.jsx";
+import { SidebarBody, SidebarExpanded, SidebarFooter, SidebarHeader, SidebarLabel, SidebarMain } from "./solid-6IEZVOLF.jsx";
+import { SidebarPanel } from "./solid-2YOCBILJ.jsx";
+import { sidebarRecipe } from "./solid-UEODR2SU.jsx";
+import { SidebarProvider } from "./solid-2EP64KSV.jsx";
+import { SidebarConsumer } from "./solid-4G6UWH64.jsx";
+import { sidebarOptionKeys, useSidebarState } from "./solid-HRGZPXXC.jsx";
+import { Resizable } from "./solid-FXCRBQXL.jsx";
+import { Sheet } from "./solid-AHPGAIIJ.jsx";
+
+// navigation/sidebar/sidebar.tsx
+import { createSignal, mergeProps, splitProps } from "solid-js";
+var styles = sidebarRecipe();
+function SidebarRoot(props) {
+  const [local, rest] = splitProps(mergeProps({
+    defaultWidth: 256,
+    minWidth: 216,
+    maxWidth: 360,
+    compactWidth: 64,
+    resizable: false
+  }, props), sidebarOptionKeys);
+  const state = useSidebarState(local);
+  const [size, setSize] = createSignal([`${local.collapsed ?? local.defaultCollapsed ? local.compactWidth : local.defaultWidth}px`]);
+  return <Sheet.Root open={!state.desktop() && state.mobileOpen()} onOpenChange={details => state.setMobileOpen(details.open)}>
+      <Resizable.Root {...rest} class={styles.root({
+      class: local.class
+    })} data-mobile={!state.desktop() ? "" : void 0} data-resizable={local.resizable ? "" : void 0} panels={[{
+      id: "sidebar",
+      minSize: `${local.resizable ? local.minWidth : local.defaultWidth}px`,
+      maxSize: `${local.resizable ? local.maxWidth : local.defaultWidth}px`,
+      collapsible: true,
+      collapsedSize: `${local.compactWidth}px`
+    }, {
+      id: "main",
+      minSize: 25
+    }]} size={size()} onResize={details => setSize(details.size)} onCollapse={() => local.onCollapsedChange?.(true)} onExpand={() => local.onCollapsedChange?.(false)} onResizeEnd={local.onResizeEnd}>
+        <SidebarProvider options={local} state={state}>
+          {local.children}
+        </SidebarProvider>
+      </Resizable.Root>
+    </Sheet.Root>;
+}
+var Sidebar = {
+  Root: SidebarRoot,
+  Panel: SidebarPanel,
+  Header: SidebarHeader,
+  Body: SidebarBody,
+  Footer: SidebarFooter,
+  Main: SidebarMain,
+  Label: SidebarLabel,
+  Expanded: SidebarExpanded,
+  Toggle: SidebarToggle,
+  Context: SidebarConsumer
+};
+export { SidebarRoot, Sidebar };

package/dist/chunks/solid-TO4YCWFN.jsx

@@ -0,0 +1,46 @@
+import { useNavigationMenuBehavior } from "./solid-H2C6D4BP.jsx";
+import { NavigationMenuContent, NavigationMenuDescription, NavigationMenuGroup, NavigationMenuItem, NavigationMenuLabel, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger } from "./solid-OKRWY3CA.jsx";
+import { NavigationSubmenu, NavigationSubmenuContent, NavigationSubmenuTrigger } from "./solid-G62F75Z7.jsx";
+import { navigationMenuRecipe } from "./solid-7FKR2OF6.jsx";
+import { NavigationMenuCloseContext } from "./solid-4LT7BNWT.jsx";
+
+// navigation/navigation-menu/navigation-menu.tsx
+import { NavigationMenu as Ark } from "@ark-ui/solid/navigation-menu";
+import { mergeProps, splitProps } from "solid-js";
+var styles = navigationMenuRecipe();
+function NavigationMenuRoot(props) {
+  const [local, rest] = splitProps(props, ["class", "children", "onNavigate"]);
+  const behavior = useNavigationMenuBehavior(mergeProps({
+    "aria-label": "Main navigation",
+    disableHoverTrigger: true,
+    disablePointerLeaveClose: true
+  }, rest));
+  return <Ark.RootProvider {...behavior.rest} value={behavior.api} class={styles.root({
+    class: local.class
+  })}>
+      <Ark.Context>
+        {api => <NavigationMenuCloseContext.Provider value={() => {
+        api().setValue("");
+        local.onNavigate?.();
+      }}>
+            {local.children}
+          </NavigationMenuCloseContext.Provider>}
+      </Ark.Context>
+    </Ark.RootProvider>;
+}
+var NavigationMenu = {
+  Root: NavigationMenuRoot,
+  List: NavigationMenuList,
+  Item: NavigationMenuItem,
+  Link: NavigationMenuLink,
+  Trigger: NavigationMenuTrigger,
+  Content: NavigationMenuContent,
+  Group: NavigationMenuGroup,
+  Label: NavigationMenuLabel,
+  Description: NavigationMenuDescription,
+  Submenu: NavigationSubmenu,
+  SubmenuTrigger: NavigationSubmenuTrigger,
+  SubmenuContent: NavigationSubmenuContent,
+  Context: Ark.Context
+};
+export { NavigationMenuRoot, NavigationMenu };

package/dist/chunks/solid-TXZ75EIN.jsx

@@ -0,0 +1,23 @@
+import { resizableRecipe } from "./solid-KAEEGL7T.jsx";
+
+// layout/resizable/resizable.handle.tsx
+import { Splitter as ArkSplitter } from "@ark-ui/solid/splitter";
+import { GripVertical } from "lucide-solid";
+import { Show, splitProps } from "solid-js";
+var styles = resizableRecipe();
+function ResizableHandle(props) {
+  const [local, rest] = splitProps(props, ["class", "children", "withHandle", "asChild", "disabled"]);
+  const content = () => local.children ?? <Show when={local.withHandle}>
+        <span aria-hidden="true" class={styles.grip()}>
+          <GripVertical size={12} />
+        </span>
+      </Show>;
+  return <ArkSplitter.ResizeTrigger {...rest} disabled={local.disabled} aria-disabled={local.disabled || void 0} class={styles.handle({
+    class: local.class
+  })} asChild={local.asChild ?? (triggerProps => <button {...triggerProps()} type="button" disabled={local.disabled}>
+            {content()}
+          </button>)}>
+      {content()}
+    </ArkSplitter.ResizeTrigger>;
+}
+export { ResizableHandle };

package/dist/chunks/solid-TYLGWPQH.jsx

@@ -0,0 +1,38 @@
+// navigation/navbar/use-navbar-disclosure.ts
+import { useCollapsible } from "@ark-ui/solid/collapsible";
+import { createMediaQuery } from "@solid-primitives/media";
+import { createSignal, createUniqueId } from "solid-js";
+function useNavbarDisclosure(props) {
+  const desktop = createMediaQuery("(min-width: 48rem)");
+  const [mobileOpen, setMobileOpen] = createSignal(props.defaultOpen ?? false);
+  const triggerId = `${createUniqueId()}-navbar-toggle`;
+  const api = useCollapsible({
+    ids: {
+      trigger: triggerId
+    },
+    get open() {
+      return desktop() || (props.open ?? mobileOpen());
+    },
+    onOpenChange(details) {
+      if (desktop()) return;
+      if (props.open === void 0) setMobileOpen(details.open);
+      props.onOpenChange?.(details);
+    }
+  });
+  function close() {
+    if (!desktop()) api().setOpen(false);
+  }
+  function onKeyDown(event) {
+    if (event.key !== "Escape" || event.defaultPrevented || desktop() || !api().open) return;
+    event.preventDefault();
+    close();
+    event.currentTarget.ownerDocument.getElementById(triggerId)?.focus();
+  }
+  return {
+    api,
+    desktop,
+    close,
+    onKeyDown
+  };
+}
+export { useNavbarDisclosure };

package/dist/chunks/solid-U64Z4B2B.jsx

@@ -0,0 +1,36 @@
+import { useTextControl } from "./solid-O5IKGAYR.jsx";
+import { Loading } from "./solid-6YSLHRDT.jsx";
+
+// forms/input-group/input-group.parts.tsx
+import { mergeProps, Show, splitProps } from "solid-js";
+function InputGroupIcon(props) {
+  const [local, rest] = splitProps(mergeProps({
+    placement: "start"
+  }, props), ["placement", "class"]);
+  return <span {...rest} aria-hidden="true" data-placement={local.placement} class={partClass("nui-input-group-icon", local.class)} />;
+}
+function InputGroupAddon(props) {
+  const [local, rest] = splitProps(mergeProps({
+    placement: "start"
+  }, props), ["placement", "class"]);
+  return <span {...rest} data-placement={local.placement} class={partClass("nui-input-group-addon", local.class)} />;
+}
+function InputGroupAction(props) {
+  const [local, rest] = splitProps(mergeProps({
+    placement: "end"
+  }, props), ["placement", "class"]);
+  return <span {...rest} data-placement={local.placement} class={partClass("nui-input-group-action", local.class)} />;
+}
+function InputGroupLoading(props) {
+  const [local, rest] = splitProps(props, ["label", "class"]);
+  const control = useTextControl({});
+  return <Show when={control.loading()}>
+      <span {...rest} data-placement="end" class={partClass("nui-input-group-icon", local.class)}>
+        <Loading size="sm" tone="neutral" label={local.label ?? "Checking\u2026"} />
+      </span>
+    </Show>;
+}
+function partClass(base, extra) {
+  return [base, extra].filter(Boolean).join(" ");
+}
+export { InputGroupIcon, InputGroupAddon, InputGroupAction, InputGroupLoading };

package/dist/chunks/solid-U777PUMG.jsx

@@ -0,0 +1,50 @@
+import { InputGroupAction, InputGroupAddon, InputGroupIcon, InputGroupLoading } from "./solid-U64Z4B2B.jsx";
+import { InputGroupContext, useTextControl } from "./solid-O5IKGAYR.jsx";
+import { textControlRecipe } from "./solid-R4UMEUAE.jsx";
+import { ButtonGroupContext, useButtonGroup } from "./solid-3H4FQFP4.jsx";
+
+// forms/input-group/input-group.tsx
+import { mergeProps, splitProps } from "solid-js";
+function InputGroupRoot(props) {
+  const [local, rest] = splitProps(props, ["size", "tone", "rounded", "valid", "invalid", "loading", "disabled", "readOnly", "attached", "class", "children"]);
+  const control = useTextControl(local);
+  const buttons = useButtonGroup();
+  const options = () => ({
+    size: control.size(),
+    tone: control.tone(),
+    rounded: control.rounded(),
+    valid: control.valid(),
+    invalid: control.invalid(),
+    loading: control.loading(),
+    disabled: control.disabled(),
+    readOnly: control.readOnly()
+  });
+  const buttonOptions = mergeProps(buttons, {
+    get size() {
+      return control.size();
+    },
+    get disabled() {
+      return buttons.disabled || control.disabled();
+    }
+  });
+  return <InputGroupContext.Provider value={options}>
+      <ButtonGroupContext.Provider value={buttonOptions}>
+        <div {...rest} data-attached={local.attached ? "" : void 0} data-invalid={control.invalid() ? "" : void 0} data-valid={control.valid() ? "" : void 0} data-disabled={control.disabled() ? "" : void 0} data-readonly={control.readOnly() ? "" : void 0} data-loading={control.loading() ? "" : void 0} aria-busy={control.loading() || void 0} class={textControlRecipe({
+        size: control.size(),
+        tone: control.tone(),
+        rounded: control.rounded(),
+        class: ["nui-input-group", local.class].filter(Boolean).join(" ")
+      })}>
+          {local.children}
+        </div>
+      </ButtonGroupContext.Provider>
+    </InputGroupContext.Provider>;
+}
+var InputGroup = {
+  Root: InputGroupRoot,
+  Icon: InputGroupIcon,
+  Addon: InputGroupAddon,
+  Action: InputGroupAction,
+  Loading: InputGroupLoading
+};
+export { InputGroupRoot, InputGroup };

package/dist/chunks/solid-UEODR2SU.jsx

@@ -0,0 +1,16 @@
+// navigation/sidebar/sidebar.recipe.ts
+import { tv } from "tailwind-variants/lite";
+var sidebarRecipe = tv({
+  slots: {
+    root: "nui-sidebar-root nui:w-full nui:min-h-0 nui:min-w-0 nui:bg-background nui:text-foreground",
+    panel: "nui-sidebar-panel",
+    surface: "nui-sidebar-surface nui:flex nui:h-full nui:min-h-0 nui:min-w-0 nui:flex-col nui:overflow-hidden nui:bg-surface nui:text-foreground",
+    header: "nui:flex nui:shrink-0 nui:items-center nui:gap-2 nui:p-3",
+    body: "nui:min-h-0 nui:flex-1 nui:overflow-y-auto nui:overscroll-contain nui:px-2 nui:py-3",
+    footer: "nui:shrink-0 nui:border-t nui:border-border nui:p-3",
+    main: "nui:relative nui:flex nui:h-full nui:min-h-0 nui:min-w-0 nui:flex-col nui:overflow-auto nui:overscroll-contain",
+    label: "nui-sidebar-label nui:min-w-0 nui:truncate",
+    expanded: "nui-sidebar-expanded nui:min-w-0"
+  }
+});
+export { sidebarRecipe };

package/dist/chunks/solid-UHYUCYLS.jsx

@@ -0,0 +1,51 @@
+// content/badge/badge.recipe.ts
+import { tv } from "tailwind-variants/lite";
+var badgeAppearanceVariants = {
+  variant: {
+    solid: "nui:[--nui-badge-bg:var(--nui-badge-solid)] nui:[--nui-badge-bg-hover:var(--nui-badge-solid-hover)] nui:[--nui-badge-fg:var(--nui-badge-on-solid)] nui:border-transparent",
+    soft: "nui:[--nui-badge-bg:var(--nui-badge-soft)] nui:[--nui-badge-bg-hover:var(--nui-badge-soft-hover)] nui:[--nui-badge-fg:var(--nui-badge-text)] nui:border-transparent",
+    outline: "nui:[--nui-badge-bg:transparent] nui:[--nui-badge-bg-hover:var(--nui-badge-soft)] nui:[--nui-badge-fg:var(--nui-badge-text)] nui:border-[var(--nui-badge-border)]"
+  },
+  tone: {
+    neutral: "nui:[--nui-badge-solid:var(--nui-neutral)] nui:[--nui-badge-solid-hover:var(--nui-neutral-hover)] nui:[--nui-badge-on-solid:var(--nui-on-neutral)] nui:[--nui-badge-soft:var(--nui-neutral-soft)] nui:[--nui-badge-soft-hover:var(--nui-neutral-soft-hover)] nui:[--nui-badge-text:var(--nui-neutral-text)] nui:[--nui-badge-border:var(--nui-neutral-border)]",
+    primary: "nui:[--nui-badge-solid:var(--nui-primary)] nui:[--nui-badge-solid-hover:var(--nui-primary-hover)] nui:[--nui-badge-on-solid:var(--nui-on-primary)] nui:[--nui-badge-soft:var(--nui-primary-soft)] nui:[--nui-badge-soft-hover:var(--nui-primary-soft-hover)] nui:[--nui-badge-text:var(--nui-primary-text)] nui:[--nui-badge-border:var(--nui-primary-border)]",
+    info: "nui:[--nui-badge-solid:var(--nui-info)] nui:[--nui-badge-solid-hover:var(--nui-info-hover)] nui:[--nui-badge-on-solid:var(--nui-on-info)] nui:[--nui-badge-soft:var(--nui-info-soft)] nui:[--nui-badge-soft-hover:var(--nui-info-soft-hover)] nui:[--nui-badge-text:var(--nui-info-text)] nui:[--nui-badge-border:var(--nui-info-border)]",
+    success: "nui:[--nui-badge-solid:var(--nui-success)] nui:[--nui-badge-solid-hover:var(--nui-success-hover)] nui:[--nui-badge-on-solid:var(--nui-on-success)] nui:[--nui-badge-soft:var(--nui-success-soft)] nui:[--nui-badge-soft-hover:var(--nui-success-soft-hover)] nui:[--nui-badge-text:var(--nui-success-text)] nui:[--nui-badge-border:var(--nui-success-border)]",
+    warning: "nui:[--nui-badge-solid:var(--nui-warning)] nui:[--nui-badge-solid-hover:var(--nui-warning-hover)] nui:[--nui-badge-on-solid:var(--nui-on-warning)] nui:[--nui-badge-soft:var(--nui-warning-soft)] nui:[--nui-badge-soft-hover:var(--nui-warning-soft-hover)] nui:[--nui-badge-text:var(--nui-warning-text)] nui:[--nui-badge-border:var(--nui-warning-border)]",
+    danger: "nui:[--nui-badge-solid:var(--nui-danger)] nui:[--nui-badge-solid-hover:var(--nui-danger-hover)] nui:[--nui-badge-on-solid:var(--nui-on-danger)] nui:[--nui-badge-soft:var(--nui-danger-soft)] nui:[--nui-badge-soft-hover:var(--nui-danger-soft-hover)] nui:[--nui-badge-text:var(--nui-danger-text)] nui:[--nui-badge-border:var(--nui-danger-border)]"
+  }
+};
+var badgeRecipe = tv({
+  base: "nui-badge nui:inline-flex nui:max-w-full nui:min-w-0 nui:items-center nui:justify-center nui:gap-1 nui:border nui:font-medium nui:leading-snug nui:align-middle nui:wrap-anywhere nui:no-underline nui:transition-colors nui:motion-reduce:transition-none nui:focus-visible:outline-[length:var(--nui-focus-width)] nui:focus-visible:outline-offset-[var(--nui-focus-offset)] nui:focus-visible:outline-focus-ring",
+  variants: {
+    ...badgeAppearanceVariants,
+    size: {
+      sm: "nui:min-h-5 nui:px-1.5 nui:py-0.5 nui:text-xs",
+      md: "nui:min-h-6 nui:px-2 nui:py-0.5 nui:text-xs",
+      lg: "nui:min-h-7 nui:px-2.5 nui:py-1 nui:text-sm"
+    },
+    rounded: {
+      true: "nui:rounded-full",
+      false: "nui:rounded-md"
+    }
+  },
+  defaultVariants: {
+    variant: "soft",
+    tone: "neutral",
+    size: "md",
+    rounded: false
+  }
+});
+var badgeGroupRecipe = tv({
+  base: "nui:inline-flex nui:max-w-full nui:items-center nui:align-middle",
+  variants: {
+    attached: {
+      true: "nui:gap-0 nui:[&>*]:rounded-none nui:[&>*+*]:-ml-px nui:[&>*:first-child]:rounded-l-md nui:[&>*:last-child]:rounded-r-md nui:[&>*:focus-visible]:relative nui:[&>*:focus-visible]:z-10",
+      false: "nui:flex-wrap nui:gap-2"
+    }
+  },
+  defaultVariants: {
+    attached: false
+  }
+});
+export { badgeAppearanceVariants, badgeRecipe, badgeGroupRecipe };

package/dist/chunks/solid-UK4MOYZS.jsx

@@ -0,0 +1,50 @@
+import { useFieldVisual } from "./solid-O5IKGAYR.jsx";
+
+// forms/field/field.parts.tsx
+import { Field as ArkField, useFieldContext } from "@ark-ui/solid/field";
+import { createUniqueId, onCleanup, onMount, Show, splitProps } from "solid-js";
+function FieldLabel(props) {
+  const [local, rest] = splitProps(props, ["class"]);
+  return <ArkField.Label {...rest} class={partClass("nui-field-label", local.class)} />;
+}
+function FieldDescription(props) {
+  const [local, rest] = splitProps(props, ["class"]);
+  const field = useFieldContext();
+  const visual = useFieldVisual();
+  const hasFeedback = () => Boolean(visual?.successId() || field?.().invalid && field().ariaDescribedby?.split(" ").includes(field().ids.errorText));
+  return <Show when={!hasFeedback()}>
+      <ArkField.HelperText {...rest} class={partClass("nui-field-description", local.class)} />
+    </Show>;
+}
+function FieldErrorText(props) {
+  const [local, rest] = splitProps(props, ["class"]);
+  return <ArkField.ErrorText {...rest} class={partClass("nui-field-error", local.class)} />;
+}
+function FieldSuccessText(props) {
+  const field = useFieldVisual();
+  return <Show when={field?.options().valid}>
+      <SuccessMessage {...props} />
+    </Show>;
+}
+function SuccessMessage(props) {
+  const [local, rest] = splitProps(props, ["id", "class"]);
+  const field = useFieldVisual();
+  const id = local.id ?? `${createUniqueId()}-success`;
+  onMount(() => {
+    const cleanup = field?.registerSuccess(id);
+    onCleanup(() => cleanup?.());
+  });
+  return <span {...rest} id={id} aria-live="polite" class={partClass("nui-field-success", local.class)} />;
+}
+function FieldContent(props) {
+  const [local, rest] = splitProps(props, ["class"]);
+  return <div {...rest} class={partClass("nui-field-content", local.class)} />;
+}
+function FieldRequiredIndicator(props) {
+  const [local, rest] = splitProps(props, ["class"]);
+  return <ArkField.RequiredIndicator {...rest} class={partClass("nui-field-required", local.class)} />;
+}
+function partClass(base, extra) {
+  return [base, extra].filter(Boolean).join(" ");
+}
+export { FieldLabel, FieldDescription, FieldErrorText, FieldSuccessText, FieldContent, FieldRequiredIndicator };

package/dist/chunks/solid-UU4GO5B3.jsx

@@ -0,0 +1,36 @@
+import { PanelBody, PanelDescription, PanelFooter, PanelHeader, PanelItem, PanelLink, PanelList, PanelTitle, PanelToolbar } from "./solid-MADLLW5O.jsx";
+import { PanelItemActions, PanelItemContent, PanelItemDescription, PanelItemTitle, PanelRow } from "./solid-254M55DX.jsx";
+import { PanelBar, PanelBarActions, PanelBarGroup } from "./solid-AOTLU4LC.jsx";
+import { panelRecipe } from "./solid-VUQ6PMEE.jsx";
+
+// compositions/panel/panel.tsx
+import { splitProps } from "solid-js";
+function PanelRoot(props) {
+  const [local, rest] = splitProps(props, ["tone", "class"]);
+  return <section {...rest} class={panelRecipe({
+    tone: local.tone
+  }).root({
+    class: local.class
+  })} />;
+}
+var Panel = {
+  Root: PanelRoot,
+  Bar: PanelBar,
+  BarGroup: PanelBarGroup,
+  BarActions: PanelBarActions,
+  Header: PanelHeader,
+  Title: PanelTitle,
+  Description: PanelDescription,
+  Toolbar: PanelToolbar,
+  Body: PanelBody,
+  List: PanelList,
+  Item: PanelItem,
+  Row: PanelRow,
+  ItemContent: PanelItemContent,
+  ItemTitle: PanelItemTitle,
+  ItemDescription: PanelItemDescription,
+  ItemActions: PanelItemActions,
+  Link: PanelLink,
+  Footer: PanelFooter
+};
+export { PanelRoot, Panel };

package/dist/chunks/solid-UVHOODF3.jsx

@@ -0,0 +1,40 @@
+import { FieldContent, FieldDescription, FieldErrorText, FieldLabel, FieldRequiredIndicator, FieldSuccessText } from "./solid-UK4MOYZS.jsx";
+import { FieldVisualContext } from "./solid-O5IKGAYR.jsx";
+
+// forms/field/field.tsx
+import { Field as ArkField } from "@ark-ui/solid/field";
+import { createSignal, splitProps } from "solid-js";
+function FieldRoot(props) {
+  const [local, rest] = splitProps(props, ["size", "tone", "rounded", "valid", "loading", "orientation", "class", "children"]);
+  const [successId, setSuccessId] = createSignal();
+  const options = () => ({
+    size: local.size ?? "md",
+    tone: local.tone ?? "neutral",
+    rounded: local.rounded ?? false,
+    valid: Boolean(local.valid && !props.invalid),
+    loading: local.loading ?? false
+  });
+  const registerSuccess = id => {
+    setSuccessId(id);
+    return () => setSuccessId(current => current === id ? void 0 : current);
+  };
+  return <FieldVisualContext.Provider value={{
+    options,
+    successId,
+    registerSuccess
+  }}>
+      <ArkField.Root {...rest} data-size={local.size ?? "md"} data-orientation={local.orientation ?? "vertical"} data-valid={options().valid ? "" : void 0} data-loading={local.loading ? "" : void 0} class={["nui-field", local.class].filter(Boolean).join(" ")}>
+        {local.children}
+      </ArkField.Root>
+    </FieldVisualContext.Provider>;
+}
+var Field = {
+  Root: FieldRoot,
+  Label: FieldLabel,
+  Content: FieldContent,
+  Description: FieldDescription,
+  ErrorText: FieldErrorText,
+  SuccessText: FieldSuccessText,
+  RequiredIndicator: FieldRequiredIndicator
+};
+export { FieldRoot, Field };

package/dist/chunks/solid-VDYGPZZK.jsx

@@ -0,0 +1,18 @@
+// navigation/steps/steps.recipe.ts
+import { tv } from "tailwind-variants/lite";
+var stepsRecipe = tv({
+  slots: {
+    root: "nui-steps nui:grid nui:w-full nui:min-w-0 nui:gap-6 nui:text-foreground",
+    list: "nui-steps-list nui:min-w-0 nui:overflow-x-auto nui:overscroll-x-contain nui:pb-2",
+    item: "nui-steps-item nui:relative nui:min-w-0",
+    trigger: "nui-steps-trigger nui:relative nui:min-w-0 nui:max-w-full nui:rounded-md nui:text-start nui:cursor-pointer nui:outline-none nui:focus-visible:outline-[length:var(--nui-focus-width)] nui:focus-visible:outline-offset-[var(--nui-focus-offset)] nui:focus-visible:outline-focus-ring nui:disabled:cursor-not-allowed nui:disabled:text-[var(--nui-neutral-8)]",
+    indicator: "nui:relative nui:z-1 nui:flex nui:size-8 nui:shrink-0 nui:items-center nui:justify-center nui:rounded-full nui:border nui:border-border nui:bg-surface nui:text-sm nui:font-medium nui:tabular-nums nui:text-muted-foreground nui:data-current:border-[var(--nui-primary-focus)] nui:data-current:bg-[var(--nui-primary-soft)] nui:data-current:text-[var(--nui-primary-text)] nui:data-complete:border-[var(--nui-success-border)] nui:data-complete:bg-[var(--nui-success-soft)] nui:data-complete:text-[var(--nui-success-text)] nui:[&>svg]:size-4",
+    label: "nui:grid nui:min-w-0 nui:gap-y-[var(--nui-header-gap)] nui:wrap-anywhere",
+    title: "nui:text-sm nui:font-medium nui:leading-snug",
+    description: "nui:text-sm nui:leading-relaxed nui:text-muted-foreground",
+    separator: "nui-steps-separator nui:absolute nui:bg-border nui:data-complete:bg-[var(--nui-success-border)]",
+    content: "nui-steps-content nui:min-w-0 nui:wrap-anywhere nui:focus-visible:outline-[length:var(--nui-focus-width)] nui:focus-visible:outline-offset-[var(--nui-focus-offset)] nui:focus-visible:outline-focus-ring",
+    actions: "nui-steps-actions nui:flex nui:min-w-0 nui:flex-wrap nui:items-center nui:gap-2"
+  }
+});
+export { stepsRecipe };

package/dist/chunks/solid-VMJEY3L4.jsx

@@ -0,0 +1,15 @@
+// layout/section/section.recipe.ts
+import { tv } from "tailwind-variants/lite";
+var sectionRecipe = tv({
+  variants: {
+    spacing: {
+      sm: "nui:py-6 nui:md:py-8",
+      md: "nui:py-10 nui:md:py-16",
+      lg: "nui:py-16 nui:md:py-24"
+    }
+  },
+  defaultVariants: {
+    spacing: "md"
+  }
+});
+export { sectionRecipe };

package/dist/chunks/solid-VUQ6PMEE.jsx

@@ -0,0 +1,35 @@
+// compositions/panel/panel.recipe.ts
+import { tv } from "tailwind-variants/lite";
+var panelRecipe = tv({
+  slots: {
+    root: "nui:min-w-0 nui:overflow-hidden nui:rounded-xl nui:border nui:border-border nui:text-foreground",
+    bar: "nui:flex nui:min-w-0 nui:flex-wrap nui:items-center nui:justify-between nui:gap-2 nui:bg-surface nui:px-3 nui:py-2 nui:[--nui-tabs-track:var(--nui-background)] nui:[--nui-tabs-selected-bg:var(--nui-neutral-soft-active)] nui:[--nui-tabs-selected-fg:var(--nui-foreground)]",
+    barGroup: "nui:flex nui:min-w-0 nui:flex-auto nui:flex-wrap nui:items-center nui:gap-x-3 nui:gap-y-2",
+    barActions: "nui:ml-auto nui:flex nui:shrink-0 nui:items-center nui:gap-1",
+    toolbar: "nui:border-t nui:border-border nui:px-5 nui:py-4",
+    body: "nui:border-t nui:border-border nui:p-5",
+    list: "nui:m-0 nui:list-none nui:p-0",
+    item: "nui:border-t nui:border-border",
+    row: "nui:flex nui:min-w-0 nui:items-center nui:justify-between nui:gap-4 nui:px-4 nui:py-3",
+    itemContent: "nui:grid nui:min-w-0 nui:flex-1 nui:gap-y-[var(--nui-header-gap)]",
+    itemTitle: "nui:m-0 nui:text-sm nui:leading-snug nui:font-semibold nui:text-foreground nui:wrap-anywhere",
+    itemDescription: "nui:m-0 nui:text-sm nui:leading-snug nui:text-muted-foreground nui:wrap-anywhere",
+    itemActions: "nui:flex nui:shrink-0 nui:items-center nui:gap-2",
+    link: "nui:flex nui:min-w-0 nui:flex-wrap nui:items-center nui:justify-between nui:gap-3 nui:px-5 nui:py-4 nui:text-[var(--nui-primary-text)] nui:no-underline nui:hover:bg-[var(--nui-neutral-soft)] nui:active:bg-[var(--nui-neutral-soft-active)] nui:aria-[current=page]:bg-[var(--nui-primary-soft-active)] nui:focus-visible:outline-[length:var(--nui-focus-width)] nui:focus-visible:-outline-offset-[var(--nui-focus-offset)] nui:focus-visible:outline-focus-ring",
+    footer: "nui:flex nui:flex-wrap nui:items-center nui:justify-between nui:gap-3 nui:border-t nui:border-border nui:px-5 nui:py-4"
+  },
+  variants: {
+    tone: {
+      default: {
+        root: "nui:bg-background"
+      },
+      subtle: {
+        root: "nui:bg-surface"
+      }
+    }
+  },
+  defaultVariants: {
+    tone: "default"
+  }
+});
+export { panelRecipe };

package/dist/chunks/solid-VVMLR3JX.jsx

@@ -0,0 +1,32 @@
+import { HoverCardContent } from "./solid-C2NMJHAL.jsx";
+import { HoverCardArrow, HoverCardBody, HoverCardPositioner, HoverCardSurface, HoverCardTrigger } from "./solid-2534JFEJ.jsx";
+import { OverlayPortal } from "./solid-FBI7HGP3.jsx";
+
+// overlays/hover-card/hover-card.tsx
+import { HoverCard as ArkHoverCard } from "@ark-ui/solid/hover-card";
+import { mergeProps, splitProps } from "solid-js";
+function HoverCardRoot(props) {
+  const [local, rest] = splitProps(props, ["positioning"]);
+  return <ArkHoverCard.Root {...mergeProps({
+    lazyMount: true,
+    unmountOnExit: true
+  }, rest)} positioning={mergeProps({
+    placement: "bottom-start",
+    gutter: 8,
+    strategy: "fixed",
+    overflowPadding: 16
+  }, local.positioning ?? {})} />;
+}
+var HoverCard = {
+  Root: HoverCardRoot,
+  Trigger: HoverCardTrigger,
+  Content: HoverCardContent,
+  Portal: OverlayPortal,
+  Positioner: HoverCardPositioner,
+  Surface: HoverCardSurface,
+  Body: HoverCardBody,
+  Arrow: HoverCardArrow,
+  ArrowTip: ArkHoverCard.ArrowTip,
+  Context: ArkHoverCard.Context
+};
+export { HoverCardRoot, HoverCard };

package/dist/chunks/solid-VZEZ7MZB.jsx

@@ -0,0 +1,30 @@
+// compositions/panel/panel-header.recipe.ts
+import { tv } from "tailwind-variants/lite";
+var panelHeaderRecipe = tv({
+  base: "nui:grid nui:min-w-0 nui:gap-y-[var(--nui-header-gap)]",
+  variants: {
+    density: {
+      default: "nui:p-5",
+      compact: "nui:px-4 nui:py-2.5"
+    },
+    variant: {
+      plain: "",
+      soft: "nui:bg-[var(--nui-neutral-soft)]",
+      solid: "nui:bg-[var(--nui-panel-header-bg)] nui:[--nui-foreground:var(--nui-panel-header-fg)] nui:[--nui-muted-foreground:var(--nui-panel-header-fg)] nui:text-foreground nui:[--nui-focus-ring:var(--nui-panel-header-fg)]"
+    },
+    tone: {
+      neutral: "nui:[--nui-panel-header-bg:var(--nui-neutral)] nui:[--nui-panel-header-fg:var(--nui-on-neutral)]",
+      primary: "nui:[--nui-panel-header-bg:var(--nui-primary)] nui:[--nui-panel-header-fg:var(--nui-on-primary)]",
+      info: "nui:[--nui-panel-header-bg:var(--nui-info)] nui:[--nui-panel-header-fg:var(--nui-on-info)]",
+      success: "nui:[--nui-panel-header-bg:var(--nui-success)] nui:[--nui-panel-header-fg:var(--nui-on-success)]",
+      warning: "nui:[--nui-panel-header-bg:var(--nui-warning)] nui:[--nui-panel-header-fg:var(--nui-on-warning)]",
+      danger: "nui:[--nui-panel-header-bg:var(--nui-danger)] nui:[--nui-panel-header-fg:var(--nui-on-danger)]"
+    }
+  },
+  defaultVariants: {
+    variant: "plain",
+    tone: "neutral",
+    density: "default"
+  }
+});
+export { panelHeaderRecipe };

package/dist/chunks/solid-W4A4I2RI.jsx

@@ -0,0 +1,34 @@
+import { NavigationChevron } from "./solid-JRU5VQZA.jsx";
+import { useVerticalMenuStyles } from "./solid-2AUDPT6J.jsx";
+
+// navigation/vertical-menu/vertical-menu.branch.tsx
+import { Collapsible, useCollapsibleContext } from "@ark-ui/solid/collapsible";
+import { splitProps } from "solid-js";
+function VerticalMenuBranch(props) {
+  const [local, rest] = splitProps(props, ["class", "ref"]);
+  const styles = useVerticalMenuStyles();
+  return <Collapsible.Root {...rest} class={styles().branch({
+    class: local.class
+  })} asChild={branchProps => <li {...branchProps()} ref={local.ref} />} />;
+}
+function VerticalMenuBranchTrigger(props) {
+  const collapsible = useCollapsibleContext();
+  const [local, rest] = splitProps(props, ["class", "children", "disabled"]);
+  const styles = useVerticalMenuStyles();
+  return <Collapsible.Trigger {...rest} disabled={collapsible().disabled || local.disabled} class={styles().branchTrigger({
+    class: local.class
+  })}>
+      {local.children}
+      <Collapsible.Indicator class={styles().branchIndicator()} asChild={indicatorProps => <span {...indicatorProps()}>
+            <NavigationChevron />
+          </span>} />
+    </Collapsible.Trigger>;
+}
+function VerticalMenuBranchContent(props) {
+  const [local, rest] = splitProps(props, ["class"]);
+  const styles = useVerticalMenuStyles();
+  return <Collapsible.Content {...rest} class={styles().branchContent({
+    class: local.class
+  })} />;
+}
+export { VerticalMenuBranch, VerticalMenuBranchTrigger, VerticalMenuBranchContent };