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

package/dist/tailwind/source/overlays/sheet/sheet.recipe.ts

@@ -0,0 +1,37 @@
+import { tv } from "tailwind-variants/lite";
+
+export const sheetRecipe = tv({
+  slots: {
+    positioner: "nui-sheet-positioner nui:pointer-events-none nui:fixed nui:inset-0 nui:flex",
+    content:
+      "nui-sheet-content nui:pointer-events-auto nui:relative nui:flex nui:min-h-0 nui:min-w-0 nui:flex-col nui:overflow-hidden nui:border-border nui:bg-background nui:text-foreground nui:wrap-anywhere nui:shadow-[var(--nui-overlay-shadow)] nui:outline-none",
+  },
+  variants: {
+    side: {
+      right: {
+        positioner: "nui:items-stretch nui:justify-end",
+        content: "nui:h-dvh nui:w-full nui:max-w-[var(--nui-sheet-size)] nui:border-l",
+      },
+      left: {
+        positioner: "nui:items-stretch nui:justify-start",
+        content: "nui:h-dvh nui:w-full nui:max-w-[var(--nui-sheet-size)] nui:border-r",
+      },
+      top: {
+        positioner: "nui:items-start nui:justify-center",
+        content:
+          "nui:max-h-[min(var(--nui-sheet-size),calc(100dvh-2rem))] nui:w-full nui:rounded-b-xl nui:border-b",
+      },
+      bottom: {
+        positioner: "nui:items-end nui:justify-center",
+        content:
+          "nui:max-h-[min(var(--nui-sheet-size),calc(100dvh-2rem))] nui:w-full nui:rounded-t-xl nui:border-t",
+      },
+    },
+    size: {
+      sm: { content: "nui:[--nui-sheet-size:24rem]" },
+      md: { content: "nui:[--nui-sheet-size:28rem]" },
+      lg: { content: "nui:[--nui-sheet-size:40rem]" },
+    },
+  },
+  defaultVariants: { side: "right", size: "md" },
+});

package/dist/tailwind/source/overlays/sheet/sheet.styles.css

@@ -0,0 +1,5 @@
+@import "../../styles/foundations.css";
+@import "../dialog/dialog.styles.css";
+@import "./sheet.css";
+
+@source "./sheet.recipe.ts";

package/dist/tailwind/source/overlays/tooltip/tooltip.css

@@ -0,0 +1,42 @@
+.nui-tooltip-positioner {
+  z-index: var(--nui-z-tooltip);
+}
+.nui-tooltip-content {
+  z-index: var(--nui-z-tooltip);
+  transform-origin: var(--transform-origin);
+}
+.nui-tooltip-content[data-state="open"] {
+  animation: nui-tooltip-enter 120ms ease-out;
+}
+.nui-tooltip-content[data-state="closed"] {
+  animation: nui-tooltip-exit 80ms ease-in;
+}
+.nui-tooltip-content[data-instant] {
+  animation: none;
+}
+@keyframes nui-tooltip-enter {
+  from {
+    opacity: 0;
+    transform: scale(0.96);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+@keyframes nui-tooltip-exit {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+@media (prefers-reduced-motion: reduce) {
+  .nui-tooltip-content {
+    animation: none;
+  }
+}
+[data-nui-overlay-root][data-motion="reduced"] .nui-tooltip-content {
+  animation: none;
+}

package/dist/tailwind/source/overlays/tooltip/tooltip.recipe.ts

@@ -0,0 +1,10 @@
+import { tv } from "tailwind-variants/lite";
+
+export const tooltipRecipe = tv({
+  slots: {
+    positioner:
+      "nui-tooltip-positioner nui:[--arrow-size:8px] nui:[--arrow-background:var(--nui-tooltip-background)]",
+    content:
+      "nui-tooltip-content nui:w-max nui:max-w-[min(20rem,calc(100vw-2rem))] nui:rounded-md nui:bg-[var(--nui-tooltip-background)] nui:px-3 nui:py-2 nui:text-sm nui:leading-snug nui:font-normal nui:text-[var(--nui-tooltip-foreground)] nui:wrap-anywhere nui:shadow-[var(--nui-tooltip-shadow)]",
+  },
+});

package/dist/tailwind/source/overlays/tooltip/tooltip.styles.css

@@ -0,0 +1,4 @@
+@import "../../styles/foundations.css";
+@import "./tooltip.css";
+
+@source "./tooltip.recipe.ts";

package/dist/tailwind/source/styles/actions.css

@@ -0,0 +1,5 @@
+@import "../actions/button/button.styles.css";
+@import "../actions/button-group/button-group.styles.css";
+@import "../actions/dropdown-menu/dropdown-menu.styles.css";
+@import "../actions/context-menu/context-menu.styles.css";
+@import "../actions/menubar/menubar.styles.css";

package/dist/tailwind/source/styles/charts.css

@@ -0,0 +1 @@
+@import "../data/chart/chart.styles.css";

package/dist/tailwind/source/styles/compositions.css

@@ -0,0 +1,5 @@
+@import "../compositions/action-bar/action-bar.styles.css";
+@import "../compositions/footer/footer.styles.css";
+@import "../compositions/hero/hero.styles.css";
+@import "../compositions/media-object/media-object.styles.css";
+@import "../compositions/panel/panel.styles.css";

package/dist/tailwind/source/styles/content.css

@@ -0,0 +1,11 @@
+@import "../content/text/text.styles.css";
+@import "../content/heading/heading.styles.css";
+@import "../content/avatar/avatar.styles.css";
+@import "../content/badge/badge.styles.css";
+@import "../content/separator/separator.styles.css";
+@import "../content/prose/prose.styles.css";
+@import "../content/card/card.styles.css";
+@import "../content/accordion/accordion.styles.css";
+@import "../content/collapsible/collapsible.styles.css";
+@import "../content/counter/counter.styles.css";
+@import "../content/timeline/timeline.styles.css";

package/dist/tailwind/source/styles/data.css

@@ -0,0 +1,4 @@
+@import "../data/table/table.styles.css";
+@import "../data/bar-list/bar-list.styles.css";
+@import "../data/delta-bar/delta-bar.styles.css";
+@import "../data/badge-delta/badge-delta.styles.css";

package/dist/tailwind/source/styles/feedback.css

@@ -0,0 +1,7 @@
+@import "../feedback/loading/loading.styles.css";
+@import "../feedback/page-loading/page-loading.styles.css";
+@import "../feedback/callout/callout.styles.css";
+@import "../feedback/empty/empty.styles.css";
+@import "../feedback/progress/progress.styles.css";
+@import "../feedback/progress-circle/progress-circle.styles.css";
+@import "../feedback/toast/toast.styles.css";

package/dist/tailwind/source/styles/forms.css

@@ -0,0 +1,4 @@
+@import "../forms/field/field.styles.css";
+@import "../forms/input/input.styles.css";
+@import "../forms/textarea/textarea.styles.css";
+@import "../forms/input-group/input-group.styles.css";

package/dist/tailwind/source/styles/foundations.css

@@ -0,0 +1 @@
+@import "../foundations/base.css";

package/dist/tailwind/source/styles/index.css

@@ -0,0 +1,10 @@
+@import "./layout.css";
+@import "./actions.css";
+@import "./content.css";
+@import "./navigation.css";
+@import "./overlays.css";
+@import "./feedback.css";
+@import "./data.css";
+@import "./forms.css";
+@import "./compositions.css";
+@import "./charts.css";

package/dist/tailwind/source/styles/layout.css

@@ -0,0 +1,3 @@
+@import "../layout/container/container.styles.css";
+@import "../layout/section/section.styles.css";
+@import "../layout/resizable/resizable.styles.css";

package/dist/tailwind/source/styles/navigation.css

@@ -0,0 +1,8 @@
+@import "../navigation/breadcrumb/breadcrumb.styles.css";
+@import "../navigation/tabs/tabs.styles.css";
+@import "../navigation/pagination/pagination.styles.css";
+@import "../navigation/navigation-menu/navigation-menu.styles.css";
+@import "../navigation/navbar/navbar.styles.css";
+@import "../navigation/vertical-menu/vertical-menu.styles.css";
+@import "../navigation/sidebar/sidebar.styles.css";
+@import "../navigation/steps/steps.styles.css";

package/dist/tailwind/source/styles/overlays.css

@@ -0,0 +1,6 @@
+@import "../overlays/dialog/dialog.styles.css";
+@import "../overlays/alert-dialog/alert-dialog.styles.css";
+@import "../overlays/tooltip/tooltip.styles.css";
+@import "../overlays/popover/popover.styles.css";
+@import "../overlays/hover-card/hover-card.styles.css";
+@import "../overlays/sheet/sheet.styles.css";

package/dist/types/actions/button/button.d.ts

@@ -0,0 +1,9 @@
+import type { JSX } from "solid-js";
+import type { VariantProps } from "tailwind-variants/lite";
+import { buttonRecipe } from "./button.recipe";
+export type ButtonProps = JSX.ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<typeof buttonRecipe> & {
+    loading?: boolean;
+    startIcon?: JSX.Element;
+    endIcon?: JSX.Element;
+};
+export declare function Button(props: ButtonProps): JSX.Element;

package/dist/types/actions/button/button.recipe.d.ts

@@ -0,0 +1,106 @@
+export declare const buttonRecipe: import("tailwind-variants/lite").TVReturnType<{
+    variant: {
+        solid: "nui:border-transparent nui:bg-[var(--nui-button-color)] nui:text-[var(--nui-button-on-color)] nui:enabled:hover:bg-[var(--nui-button-hover)] nui:enabled:active:bg-[var(--nui-button-hover)] nui:aria-pressed:bg-[var(--nui-button-hover)] nui:aria-pressed:border-[var(--nui-button-border-hover)]";
+        outline: "nui:border-[var(--nui-button-border)] nui:bg-transparent nui:text-[var(--nui-button-text)] nui:enabled:hover:border-[var(--nui-button-border-hover)] nui:enabled:hover:bg-[var(--nui-button-soft)] nui:enabled:active:bg-[var(--nui-button-soft-active)] nui:aria-pressed:bg-[var(--nui-button-soft-active)] nui:aria-pressed:border-[var(--nui-button-border-hover)]";
+        soft: "nui:border-transparent nui:bg-[var(--nui-button-soft)] nui:text-[var(--nui-button-text)] nui:enabled:hover:bg-[var(--nui-button-soft-hover)] nui:enabled:active:bg-[var(--nui-button-soft-active)] nui:aria-pressed:bg-[var(--nui-button-soft-active)]";
+        ghost: "nui:border-transparent nui:bg-transparent nui:text-[var(--nui-button-text)] nui:enabled:hover:bg-[var(--nui-button-soft)] nui:enabled:active:bg-[var(--nui-button-soft-active)] nui:aria-pressed:bg-[var(--nui-button-soft-active)]";
+        link: "nui:border-transparent nui:bg-transparent nui:text-[var(--nui-button-text)] nui:underline nui:underline-offset-4 nui:enabled:hover:text-[var(--nui-button-text-strong)] nui:enabled:active:text-[var(--nui-button-text-strong)] nui:aria-pressed:text-[var(--nui-button-text-strong)]";
+    };
+    tone: {
+        primary: "nui:[--nui-button-color:var(--nui-primary)] nui:[--nui-button-hover:var(--nui-primary-hover)] nui:[--nui-button-on-color:var(--nui-on-primary)] nui:[--nui-button-soft:var(--nui-primary-soft)] nui:[--nui-button-soft-hover:var(--nui-primary-soft-hover)] nui:[--nui-button-soft-active:var(--nui-primary-soft-active)] nui:[--nui-button-border:var(--nui-primary-border)] nui:[--nui-button-border-hover:var(--nui-primary-border-hover)] nui:[--nui-button-text:var(--nui-primary-text)] nui:[--nui-button-text-strong:var(--nui-primary-text-strong)] nui:[--nui-button-focus:var(--nui-primary-focus)]";
+        neutral: "nui:[--nui-button-color:var(--nui-neutral)] nui:[--nui-button-hover:var(--nui-neutral-hover)] nui:[--nui-button-on-color:var(--nui-on-neutral)] nui:[--nui-button-soft:var(--nui-neutral-soft)] nui:[--nui-button-soft-hover:var(--nui-neutral-soft-hover)] nui:[--nui-button-soft-active:var(--nui-neutral-soft-active)] nui:[--nui-button-border:var(--nui-neutral-border)] nui:[--nui-button-border-hover:var(--nui-neutral-border-hover)] nui:[--nui-button-text:var(--nui-neutral-text)] nui:[--nui-button-text-strong:var(--nui-neutral-text-strong)] nui:[--nui-button-focus:var(--nui-neutral-focus)]";
+        info: "nui:[--nui-button-color:var(--nui-info)] nui:[--nui-button-hover:var(--nui-info-hover)] nui:[--nui-button-on-color:var(--nui-on-info)] nui:[--nui-button-soft:var(--nui-info-soft)] nui:[--nui-button-soft-hover:var(--nui-info-soft-hover)] nui:[--nui-button-soft-active:var(--nui-info-soft-active)] nui:[--nui-button-border:var(--nui-info-border)] nui:[--nui-button-border-hover:var(--nui-info-border-hover)] nui:[--nui-button-text:var(--nui-info-text)] nui:[--nui-button-text-strong:var(--nui-info-text-strong)] nui:[--nui-button-focus:var(--nui-info-focus)]";
+        success: "nui:[--nui-button-color:var(--nui-success)] nui:[--nui-button-hover:var(--nui-success-hover)] nui:[--nui-button-on-color:var(--nui-on-success)] nui:[--nui-button-soft:var(--nui-success-soft)] nui:[--nui-button-soft-hover:var(--nui-success-soft-hover)] nui:[--nui-button-soft-active:var(--nui-success-soft-active)] nui:[--nui-button-border:var(--nui-success-border)] nui:[--nui-button-border-hover:var(--nui-success-border-hover)] nui:[--nui-button-text:var(--nui-success-text)] nui:[--nui-button-text-strong:var(--nui-success-text-strong)] nui:[--nui-button-focus:var(--nui-success-focus)]";
+        warning: "nui:[--nui-button-color:var(--nui-warning)] nui:[--nui-button-hover:var(--nui-warning-hover)] nui:[--nui-button-on-color:var(--nui-on-warning)] nui:[--nui-button-soft:var(--nui-warning-soft)] nui:[--nui-button-soft-hover:var(--nui-warning-soft-hover)] nui:[--nui-button-soft-active:var(--nui-warning-soft-active)] nui:[--nui-button-border:var(--nui-warning-border)] nui:[--nui-button-border-hover:var(--nui-warning-border-hover)] nui:[--nui-button-text:var(--nui-warning-text)] nui:[--nui-button-text-strong:var(--nui-warning-text-strong)] nui:[--nui-button-focus:var(--nui-warning-focus)]";
+        danger: "nui:[--nui-button-color:var(--nui-danger)] nui:[--nui-button-hover:var(--nui-danger-hover)] nui:[--nui-button-on-color:var(--nui-on-danger)] nui:[--nui-button-soft:var(--nui-danger-soft)] nui:[--nui-button-soft-hover:var(--nui-danger-soft-hover)] nui:[--nui-button-soft-active:var(--nui-danger-soft-active)] nui:[--nui-button-border:var(--nui-danger-border)] nui:[--nui-button-border-hover:var(--nui-danger-border-hover)] nui:[--nui-button-text:var(--nui-danger-text)] nui:[--nui-button-text-strong:var(--nui-danger-text-strong)] nui:[--nui-button-focus:var(--nui-danger-focus)]";
+    };
+    size: {
+        xs: "nui:h-[var(--nui-control-height-xs)] nui:px-2 nui:text-xs nui:[--nui-button-icon-size:0.75rem]";
+        sm: "nui:h-[var(--nui-control-height-sm)] nui:px-3 nui:text-sm nui:[--nui-button-icon-size:1rem]";
+        md: "nui:h-[var(--nui-control-height-md)] nui:px-4 nui:text-base nui:[--nui-button-icon-size:1.25rem]";
+        lg: "nui:h-[var(--nui-control-height-lg)] nui:px-6 nui:text-lg nui:[--nui-button-icon-size:1.5rem]";
+    };
+    rounded: {
+        true: "nui:rounded-full";
+        false: "nui:rounded-md";
+    };
+    fullWidth: {
+        true: "nui:w-full";
+    };
+    responsive: {
+        true: "";
+    };
+    iconOnly: {
+        true: "nui:aspect-square";
+    };
+}, undefined, "nui-button nui:relative nui:inline-flex nui:shrink-0 nui:items-center nui:justify-center nui:gap-2 nui:border nui:font-medium nui:leading-none nui:cursor-pointer nui:select-none nui:transition-colors nui:motion-reduce:transition-none nui:focus-visible:z-10 nui:focus-visible:outline-[length:var(--nui-focus-width)] nui:focus-visible:outline-offset-[var(--nui-focus-offset)] nui:focus-visible:outline-[var(--nui-button-focus)] nui:disabled:cursor-not-allowed", {
+    variant: {
+        solid: "nui:border-transparent nui:bg-[var(--nui-button-color)] nui:text-[var(--nui-button-on-color)] nui:enabled:hover:bg-[var(--nui-button-hover)] nui:enabled:active:bg-[var(--nui-button-hover)] nui:aria-pressed:bg-[var(--nui-button-hover)] nui:aria-pressed:border-[var(--nui-button-border-hover)]";
+        outline: "nui:border-[var(--nui-button-border)] nui:bg-transparent nui:text-[var(--nui-button-text)] nui:enabled:hover:border-[var(--nui-button-border-hover)] nui:enabled:hover:bg-[var(--nui-button-soft)] nui:enabled:active:bg-[var(--nui-button-soft-active)] nui:aria-pressed:bg-[var(--nui-button-soft-active)] nui:aria-pressed:border-[var(--nui-button-border-hover)]";
+        soft: "nui:border-transparent nui:bg-[var(--nui-button-soft)] nui:text-[var(--nui-button-text)] nui:enabled:hover:bg-[var(--nui-button-soft-hover)] nui:enabled:active:bg-[var(--nui-button-soft-active)] nui:aria-pressed:bg-[var(--nui-button-soft-active)]";
+        ghost: "nui:border-transparent nui:bg-transparent nui:text-[var(--nui-button-text)] nui:enabled:hover:bg-[var(--nui-button-soft)] nui:enabled:active:bg-[var(--nui-button-soft-active)] nui:aria-pressed:bg-[var(--nui-button-soft-active)]";
+        link: "nui:border-transparent nui:bg-transparent nui:text-[var(--nui-button-text)] nui:underline nui:underline-offset-4 nui:enabled:hover:text-[var(--nui-button-text-strong)] nui:enabled:active:text-[var(--nui-button-text-strong)] nui:aria-pressed:text-[var(--nui-button-text-strong)]";
+    };
+    tone: {
+        primary: "nui:[--nui-button-color:var(--nui-primary)] nui:[--nui-button-hover:var(--nui-primary-hover)] nui:[--nui-button-on-color:var(--nui-on-primary)] nui:[--nui-button-soft:var(--nui-primary-soft)] nui:[--nui-button-soft-hover:var(--nui-primary-soft-hover)] nui:[--nui-button-soft-active:var(--nui-primary-soft-active)] nui:[--nui-button-border:var(--nui-primary-border)] nui:[--nui-button-border-hover:var(--nui-primary-border-hover)] nui:[--nui-button-text:var(--nui-primary-text)] nui:[--nui-button-text-strong:var(--nui-primary-text-strong)] nui:[--nui-button-focus:var(--nui-primary-focus)]";
+        neutral: "nui:[--nui-button-color:var(--nui-neutral)] nui:[--nui-button-hover:var(--nui-neutral-hover)] nui:[--nui-button-on-color:var(--nui-on-neutral)] nui:[--nui-button-soft:var(--nui-neutral-soft)] nui:[--nui-button-soft-hover:var(--nui-neutral-soft-hover)] nui:[--nui-button-soft-active:var(--nui-neutral-soft-active)] nui:[--nui-button-border:var(--nui-neutral-border)] nui:[--nui-button-border-hover:var(--nui-neutral-border-hover)] nui:[--nui-button-text:var(--nui-neutral-text)] nui:[--nui-button-text-strong:var(--nui-neutral-text-strong)] nui:[--nui-button-focus:var(--nui-neutral-focus)]";
+        info: "nui:[--nui-button-color:var(--nui-info)] nui:[--nui-button-hover:var(--nui-info-hover)] nui:[--nui-button-on-color:var(--nui-on-info)] nui:[--nui-button-soft:var(--nui-info-soft)] nui:[--nui-button-soft-hover:var(--nui-info-soft-hover)] nui:[--nui-button-soft-active:var(--nui-info-soft-active)] nui:[--nui-button-border:var(--nui-info-border)] nui:[--nui-button-border-hover:var(--nui-info-border-hover)] nui:[--nui-button-text:var(--nui-info-text)] nui:[--nui-button-text-strong:var(--nui-info-text-strong)] nui:[--nui-button-focus:var(--nui-info-focus)]";
+        success: "nui:[--nui-button-color:var(--nui-success)] nui:[--nui-button-hover:var(--nui-success-hover)] nui:[--nui-button-on-color:var(--nui-on-success)] nui:[--nui-button-soft:var(--nui-success-soft)] nui:[--nui-button-soft-hover:var(--nui-success-soft-hover)] nui:[--nui-button-soft-active:var(--nui-success-soft-active)] nui:[--nui-button-border:var(--nui-success-border)] nui:[--nui-button-border-hover:var(--nui-success-border-hover)] nui:[--nui-button-text:var(--nui-success-text)] nui:[--nui-button-text-strong:var(--nui-success-text-strong)] nui:[--nui-button-focus:var(--nui-success-focus)]";
+        warning: "nui:[--nui-button-color:var(--nui-warning)] nui:[--nui-button-hover:var(--nui-warning-hover)] nui:[--nui-button-on-color:var(--nui-on-warning)] nui:[--nui-button-soft:var(--nui-warning-soft)] nui:[--nui-button-soft-hover:var(--nui-warning-soft-hover)] nui:[--nui-button-soft-active:var(--nui-warning-soft-active)] nui:[--nui-button-border:var(--nui-warning-border)] nui:[--nui-button-border-hover:var(--nui-warning-border-hover)] nui:[--nui-button-text:var(--nui-warning-text)] nui:[--nui-button-text-strong:var(--nui-warning-text-strong)] nui:[--nui-button-focus:var(--nui-warning-focus)]";
+        danger: "nui:[--nui-button-color:var(--nui-danger)] nui:[--nui-button-hover:var(--nui-danger-hover)] nui:[--nui-button-on-color:var(--nui-on-danger)] nui:[--nui-button-soft:var(--nui-danger-soft)] nui:[--nui-button-soft-hover:var(--nui-danger-soft-hover)] nui:[--nui-button-soft-active:var(--nui-danger-soft-active)] nui:[--nui-button-border:var(--nui-danger-border)] nui:[--nui-button-border-hover:var(--nui-danger-border-hover)] nui:[--nui-button-text:var(--nui-danger-text)] nui:[--nui-button-text-strong:var(--nui-danger-text-strong)] nui:[--nui-button-focus:var(--nui-danger-focus)]";
+    };
+    size: {
+        xs: "nui:h-[var(--nui-control-height-xs)] nui:px-2 nui:text-xs nui:[--nui-button-icon-size:0.75rem]";
+        sm: "nui:h-[var(--nui-control-height-sm)] nui:px-3 nui:text-sm nui:[--nui-button-icon-size:1rem]";
+        md: "nui:h-[var(--nui-control-height-md)] nui:px-4 nui:text-base nui:[--nui-button-icon-size:1.25rem]";
+        lg: "nui:h-[var(--nui-control-height-lg)] nui:px-6 nui:text-lg nui:[--nui-button-icon-size:1.5rem]";
+    };
+    rounded: {
+        true: "nui:rounded-full";
+        false: "nui:rounded-md";
+    };
+    fullWidth: {
+        true: "nui:w-full";
+    };
+    responsive: {
+        true: "";
+    };
+    iconOnly: {
+        true: "nui:aspect-square";
+    };
+}, undefined, import("tailwind-variants/lite").TVReturnTypeLike<{
+    variant: {
+        solid: "nui:border-transparent nui:bg-[var(--nui-button-color)] nui:text-[var(--nui-button-on-color)] nui:enabled:hover:bg-[var(--nui-button-hover)] nui:enabled:active:bg-[var(--nui-button-hover)] nui:aria-pressed:bg-[var(--nui-button-hover)] nui:aria-pressed:border-[var(--nui-button-border-hover)]";
+        outline: "nui:border-[var(--nui-button-border)] nui:bg-transparent nui:text-[var(--nui-button-text)] nui:enabled:hover:border-[var(--nui-button-border-hover)] nui:enabled:hover:bg-[var(--nui-button-soft)] nui:enabled:active:bg-[var(--nui-button-soft-active)] nui:aria-pressed:bg-[var(--nui-button-soft-active)] nui:aria-pressed:border-[var(--nui-button-border-hover)]";
+        soft: "nui:border-transparent nui:bg-[var(--nui-button-soft)] nui:text-[var(--nui-button-text)] nui:enabled:hover:bg-[var(--nui-button-soft-hover)] nui:enabled:active:bg-[var(--nui-button-soft-active)] nui:aria-pressed:bg-[var(--nui-button-soft-active)]";
+        ghost: "nui:border-transparent nui:bg-transparent nui:text-[var(--nui-button-text)] nui:enabled:hover:bg-[var(--nui-button-soft)] nui:enabled:active:bg-[var(--nui-button-soft-active)] nui:aria-pressed:bg-[var(--nui-button-soft-active)]";
+        link: "nui:border-transparent nui:bg-transparent nui:text-[var(--nui-button-text)] nui:underline nui:underline-offset-4 nui:enabled:hover:text-[var(--nui-button-text-strong)] nui:enabled:active:text-[var(--nui-button-text-strong)] nui:aria-pressed:text-[var(--nui-button-text-strong)]";
+    };
+    tone: {
+        primary: "nui:[--nui-button-color:var(--nui-primary)] nui:[--nui-button-hover:var(--nui-primary-hover)] nui:[--nui-button-on-color:var(--nui-on-primary)] nui:[--nui-button-soft:var(--nui-primary-soft)] nui:[--nui-button-soft-hover:var(--nui-primary-soft-hover)] nui:[--nui-button-soft-active:var(--nui-primary-soft-active)] nui:[--nui-button-border:var(--nui-primary-border)] nui:[--nui-button-border-hover:var(--nui-primary-border-hover)] nui:[--nui-button-text:var(--nui-primary-text)] nui:[--nui-button-text-strong:var(--nui-primary-text-strong)] nui:[--nui-button-focus:var(--nui-primary-focus)]";
+        neutral: "nui:[--nui-button-color:var(--nui-neutral)] nui:[--nui-button-hover:var(--nui-neutral-hover)] nui:[--nui-button-on-color:var(--nui-on-neutral)] nui:[--nui-button-soft:var(--nui-neutral-soft)] nui:[--nui-button-soft-hover:var(--nui-neutral-soft-hover)] nui:[--nui-button-soft-active:var(--nui-neutral-soft-active)] nui:[--nui-button-border:var(--nui-neutral-border)] nui:[--nui-button-border-hover:var(--nui-neutral-border-hover)] nui:[--nui-button-text:var(--nui-neutral-text)] nui:[--nui-button-text-strong:var(--nui-neutral-text-strong)] nui:[--nui-button-focus:var(--nui-neutral-focus)]";
+        info: "nui:[--nui-button-color:var(--nui-info)] nui:[--nui-button-hover:var(--nui-info-hover)] nui:[--nui-button-on-color:var(--nui-on-info)] nui:[--nui-button-soft:var(--nui-info-soft)] nui:[--nui-button-soft-hover:var(--nui-info-soft-hover)] nui:[--nui-button-soft-active:var(--nui-info-soft-active)] nui:[--nui-button-border:var(--nui-info-border)] nui:[--nui-button-border-hover:var(--nui-info-border-hover)] nui:[--nui-button-text:var(--nui-info-text)] nui:[--nui-button-text-strong:var(--nui-info-text-strong)] nui:[--nui-button-focus:var(--nui-info-focus)]";
+        success: "nui:[--nui-button-color:var(--nui-success)] nui:[--nui-button-hover:var(--nui-success-hover)] nui:[--nui-button-on-color:var(--nui-on-success)] nui:[--nui-button-soft:var(--nui-success-soft)] nui:[--nui-button-soft-hover:var(--nui-success-soft-hover)] nui:[--nui-button-soft-active:var(--nui-success-soft-active)] nui:[--nui-button-border:var(--nui-success-border)] nui:[--nui-button-border-hover:var(--nui-success-border-hover)] nui:[--nui-button-text:var(--nui-success-text)] nui:[--nui-button-text-strong:var(--nui-success-text-strong)] nui:[--nui-button-focus:var(--nui-success-focus)]";
+        warning: "nui:[--nui-button-color:var(--nui-warning)] nui:[--nui-button-hover:var(--nui-warning-hover)] nui:[--nui-button-on-color:var(--nui-on-warning)] nui:[--nui-button-soft:var(--nui-warning-soft)] nui:[--nui-button-soft-hover:var(--nui-warning-soft-hover)] nui:[--nui-button-soft-active:var(--nui-warning-soft-active)] nui:[--nui-button-border:var(--nui-warning-border)] nui:[--nui-button-border-hover:var(--nui-warning-border-hover)] nui:[--nui-button-text:var(--nui-warning-text)] nui:[--nui-button-text-strong:var(--nui-warning-text-strong)] nui:[--nui-button-focus:var(--nui-warning-focus)]";
+        danger: "nui:[--nui-button-color:var(--nui-danger)] nui:[--nui-button-hover:var(--nui-danger-hover)] nui:[--nui-button-on-color:var(--nui-on-danger)] nui:[--nui-button-soft:var(--nui-danger-soft)] nui:[--nui-button-soft-hover:var(--nui-danger-soft-hover)] nui:[--nui-button-soft-active:var(--nui-danger-soft-active)] nui:[--nui-button-border:var(--nui-danger-border)] nui:[--nui-button-border-hover:var(--nui-danger-border-hover)] nui:[--nui-button-text:var(--nui-danger-text)] nui:[--nui-button-text-strong:var(--nui-danger-text-strong)] nui:[--nui-button-focus:var(--nui-danger-focus)]";
+    };
+    size: {
+        xs: "nui:h-[var(--nui-control-height-xs)] nui:px-2 nui:text-xs nui:[--nui-button-icon-size:0.75rem]";
+        sm: "nui:h-[var(--nui-control-height-sm)] nui:px-3 nui:text-sm nui:[--nui-button-icon-size:1rem]";
+        md: "nui:h-[var(--nui-control-height-md)] nui:px-4 nui:text-base nui:[--nui-button-icon-size:1.25rem]";
+        lg: "nui:h-[var(--nui-control-height-lg)] nui:px-6 nui:text-lg nui:[--nui-button-icon-size:1.5rem]";
+    };
+    rounded: {
+        true: "nui:rounded-full";
+        false: "nui:rounded-md";
+    };
+    fullWidth: {
+        true: "nui:w-full";
+    };
+    responsive: {
+        true: "";
+    };
+    iconOnly: {
+        true: "nui:aspect-square";
+    };
+}, undefined>>;

package/dist/types/actions/button-group/button-group.context.d.ts

@@ -0,0 +1,6 @@
+import { type JSX } from "solid-js";
+import type { VariantProps } from "tailwind-variants/lite";
+import type { buttonRecipe } from "../button/button.recipe";
+export type ButtonGroupOptions = Pick<VariantProps<typeof buttonRecipe>, "size" | "variant" | "tone"> & Pick<JSX.ButtonHTMLAttributes<HTMLButtonElement>, "disabled">;
+export declare const ButtonGroupContext: import("solid-js").Context<ButtonGroupOptions>;
+export declare const useButtonGroup: () => ButtonGroupOptions;

package/dist/types/actions/button-group/button-group.d.ts

@@ -0,0 +1,6 @@
+import type { JSX } from "solid-js";
+import type { VariantProps } from "tailwind-variants/lite";
+import type { ButtonGroupOptions } from "./button-group.context";
+import { buttonGroupRecipe } from "./button-group.recipe";
+export type ButtonGroupProps = JSX.HTMLAttributes<HTMLDivElement> & VariantProps<typeof buttonGroupRecipe> & ButtonGroupOptions;
+export declare function ButtonGroup(props: ButtonGroupProps): JSX.Element;

package/dist/types/actions/button-group/button-group.recipe.d.ts

@@ -0,0 +1,52 @@
+export declare const buttonGroupRecipe: import("tailwind-variants/lite").TVReturnType<{
+    orientation: {
+        horizontal: "nui:flex-row nui:items-center";
+        vertical: "nui:w-fit nui:flex-col nui:items-stretch";
+    };
+    align: {
+        start: "nui:justify-start";
+        center: "nui:justify-center";
+        end: "nui:justify-end";
+    };
+    attached: {
+        true: "nui:gap-0 nui:flex-nowrap";
+        false: "nui:gap-2";
+    };
+    fullWidth: {
+        true: "nui:w-full nui:[&>[data-nui-button]]:min-w-0 nui:[&>[data-nui-button]]:flex-1";
+    };
+}, undefined, "nui-button-group nui:flex nui:min-w-0", {
+    orientation: {
+        horizontal: "nui:flex-row nui:items-center";
+        vertical: "nui:w-fit nui:flex-col nui:items-stretch";
+    };
+    align: {
+        start: "nui:justify-start";
+        center: "nui:justify-center";
+        end: "nui:justify-end";
+    };
+    attached: {
+        true: "nui:gap-0 nui:flex-nowrap";
+        false: "nui:gap-2";
+    };
+    fullWidth: {
+        true: "nui:w-full nui:[&>[data-nui-button]]:min-w-0 nui:[&>[data-nui-button]]:flex-1";
+    };
+}, undefined, import("tailwind-variants/lite").TVReturnTypeLike<{
+    orientation: {
+        horizontal: "nui:flex-row nui:items-center";
+        vertical: "nui:w-fit nui:flex-col nui:items-stretch";
+    };
+    align: {
+        start: "nui:justify-start";
+        center: "nui:justify-center";
+        end: "nui:justify-end";
+    };
+    attached: {
+        true: "nui:gap-0 nui:flex-nowrap";
+        false: "nui:gap-2";
+    };
+    fullWidth: {
+        true: "nui:w-full nui:[&>[data-nui-button]]:min-w-0 nui:[&>[data-nui-button]]:flex-1";
+    };
+}, undefined>>;

package/dist/types/actions/context-menu/context-menu.d.ts

@@ -0,0 +1,17 @@
+import { Menu as ArkMenu } from "@ark-ui/solid/menu";
+import { MenuContent } from "../menu/menu.content";
+import { MenuGroup, MenuGroupLabel, MenuItem, MenuSeparator, MenuSubTrigger } from "../menu/menu.parts";
+import { MenuRoot } from "../menu/menu.root";
+export type ContextMenuRootProps = ArkMenu.RootProps;
+export type ContextMenuTriggerProps = ArkMenu.ContextTriggerProps;
+export declare const ContextMenu: {
+    Root: typeof MenuRoot;
+    Trigger: (props: ArkMenu.ContextTriggerProps) => import("solid-js").JSX.Element;
+    SubRoot: typeof MenuRoot;
+    SubTrigger: typeof MenuSubTrigger;
+    Content: typeof MenuContent;
+    Item: typeof MenuItem;
+    Group: typeof MenuGroup;
+    GroupLabel: typeof MenuGroupLabel;
+    Separator: typeof MenuSeparator;
+};

package/dist/types/actions/dropdown-menu/dropdown-menu.d.ts

@@ -0,0 +1,18 @@
+import type { Menu as ArkMenu } from "@ark-ui/solid/menu";
+import { MenuContent } from "../menu/menu.content";
+import { MenuGroup, MenuGroupLabel, MenuItem, MenuSeparator, MenuSubTrigger } from "../menu/menu.parts";
+import { MenuRoot } from "../menu/menu.root";
+import { MenuTrigger } from "../menu/menu.trigger";
+export type DropdownMenuRootProps = ArkMenu.RootProps;
+export type DropdownMenuTriggerProps = ArkMenu.TriggerProps;
+export declare const DropdownMenu: {
+    Root: typeof MenuRoot;
+    Trigger: typeof MenuTrigger;
+    SubRoot: typeof MenuRoot;
+    SubTrigger: typeof MenuSubTrigger;
+    Content: typeof MenuContent;
+    Item: typeof MenuItem;
+    Group: typeof MenuGroup;
+    GroupLabel: typeof MenuGroupLabel;
+    Separator: typeof MenuSeparator;
+};

package/dist/types/actions/index.d.ts

@@ -0,0 +1,13 @@
+export type { ButtonProps } from "./button/button";
+export { Button } from "./button/button";
+export type { ButtonGroupProps } from "./button-group/button-group";
+export { ButtonGroup } from "./button-group/button-group";
+export type { ContextMenuRootProps, ContextMenuTriggerProps, } from "./context-menu/context-menu";
+export { ContextMenu } from "./context-menu/context-menu";
+export type { DropdownMenuRootProps, DropdownMenuTriggerProps, } from "./dropdown-menu/dropdown-menu";
+export { DropdownMenu } from "./dropdown-menu/dropdown-menu";
+export type { MenuContentProps } from "./menu/menu.content";
+export type { MenuGroupLabelProps, MenuGroupProps, MenuItemProps, MenuSeparatorProps, MenuSubTriggerProps, } from "./menu/menu.parts";
+export type { MenubarRootProps } from "./menubar/menubar";
+export { Menubar } from "./menubar/menubar";
+export type { MenubarContentProps, MenubarMenuProps, MenubarTriggerProps, } from "./menubar/menubar.parts";

package/dist/types/actions/menu/menu.content.d.ts

@@ -0,0 +1,5 @@
+import { Menu as ArkMenu } from "@ark-ui/solid/menu";
+export type MenuContentProps = ArkMenu.ContentProps & {
+    mount?: HTMLElement;
+};
+export declare function MenuContent(props: MenuContentProps): import("solid-js").JSX.Element;

package/dist/types/actions/menu/menu.parts.d.ts

@@ -0,0 +1,17 @@
+import { Menu as ArkMenu } from "@ark-ui/solid/menu";
+import { type JSX } from "solid-js";
+export type MenuItemProps = ArkMenu.ItemProps & {
+    destructive?: boolean;
+    icon?: JSX.Element;
+};
+export type MenuSubTriggerProps = ArkMenu.TriggerItemProps & {
+    icon?: JSX.Element;
+};
+export type MenuGroupProps = ArkMenu.ItemGroupProps;
+export type MenuGroupLabelProps = ArkMenu.ItemGroupLabelProps;
+export type MenuSeparatorProps = ArkMenu.SeparatorProps;
+export declare function MenuItem(props: MenuItemProps): JSX.Element;
+export declare function MenuSubTrigger(props: MenuSubTriggerProps): JSX.Element;
+export declare function MenuGroup(props: MenuGroupProps): JSX.Element;
+export declare function MenuGroupLabel(props: MenuGroupLabelProps): JSX.Element;
+export declare function MenuSeparator(props: MenuSeparatorProps): JSX.Element;

package/dist/types/actions/menu/menu.recipe.d.ts

@@ -0,0 +1,67 @@
+export declare const menuRecipe: import("tailwind-variants/lite").TVReturnType<{
+    [key: string]: {
+        [key: string]: import("tailwind-variants/lite").ClassValue | {
+            separator?: import("tailwind-variants/lite").ClassValue;
+            label?: import("tailwind-variants/lite").ClassValue;
+            trigger?: import("tailwind-variants/lite").ClassValue;
+            positioner?: import("tailwind-variants/lite").ClassValue;
+            content?: import("tailwind-variants/lite").ClassValue;
+            item?: import("tailwind-variants/lite").ClassValue;
+            groupLabel?: import("tailwind-variants/lite").ClassValue;
+            icon?: import("tailwind-variants/lite").ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: import("tailwind-variants/lite").ClassValue | {
+            separator?: import("tailwind-variants/lite").ClassValue;
+            label?: import("tailwind-variants/lite").ClassValue;
+            trigger?: import("tailwind-variants/lite").ClassValue;
+            positioner?: import("tailwind-variants/lite").ClassValue;
+            content?: import("tailwind-variants/lite").ClassValue;
+            item?: import("tailwind-variants/lite").ClassValue;
+            groupLabel?: import("tailwind-variants/lite").ClassValue;
+            icon?: import("tailwind-variants/lite").ClassValue;
+        };
+    };
+} | {}, {
+    trigger: string;
+    positioner: string;
+    content: string;
+    item: string;
+    separator: string;
+    groupLabel: string;
+    icon: string;
+    label: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: import("tailwind-variants/lite").ClassValue | {
+            separator?: import("tailwind-variants/lite").ClassValue;
+            label?: import("tailwind-variants/lite").ClassValue;
+            trigger?: import("tailwind-variants/lite").ClassValue;
+            positioner?: import("tailwind-variants/lite").ClassValue;
+            content?: import("tailwind-variants/lite").ClassValue;
+            item?: import("tailwind-variants/lite").ClassValue;
+            groupLabel?: import("tailwind-variants/lite").ClassValue;
+            icon?: import("tailwind-variants/lite").ClassValue;
+        };
+    };
+} | {}, {
+    trigger: string;
+    positioner: string;
+    content: string;
+    item: string;
+    separator: string;
+    groupLabel: string;
+    icon: string;
+    label: string;
+}, import("tailwind-variants/lite").TVReturnTypeLike<unknown, {
+    trigger: string;
+    positioner: string;
+    content: string;
+    item: string;
+    separator: string;
+    groupLabel: string;
+    icon: string;
+    label: string;
+}>>;

package/dist/types/actions/menu/menu.root.d.ts

@@ -0,0 +1,3 @@
+import { Menu as ArkMenu } from "@ark-ui/solid/menu";
+export type MenuRootProps = ArkMenu.RootProps;
+export declare function MenuRoot(props: MenuRootProps): import("solid-js").JSX.Element;

package/dist/types/actions/menu/menu.trigger.d.ts

@@ -0,0 +1,2 @@
+import { Menu as ArkMenu } from "@ark-ui/solid/menu";
+export declare function MenuTrigger(props: ArkMenu.TriggerProps): import("solid-js").JSX.Element;

package/dist/types/actions/menubar/menubar.context.d.ts

@@ -0,0 +1,15 @@
+import type { UseMenuContext } from "@ark-ui/solid/menu";
+import type { Accessor } from "solid-js";
+import type { MenuContentProps } from "../menu/menu.content";
+export interface MenubarController {
+    api: UseMenuContext;
+    active: Accessor<string>;
+    activate: (value: string) => void;
+    move: (key: string, current: string, open: boolean) => void;
+    panels: Accessor<ReadonlyMap<string, MenuContentProps>>;
+    register: (value: string, props: MenuContentProps) => () => void;
+}
+export declare const MenubarContext: import("solid-js").Context<MenubarController | undefined>;
+export declare const MenubarMenuContext: import("solid-js").Context<string | undefined>;
+export declare function useMenubar(): MenubarController;
+export declare function useMenubarMenu(): string;

package/dist/types/actions/menubar/menubar.d.ts

@@ -0,0 +1,26 @@
+import { Menu as Ark } from "@ark-ui/solid/menu";
+import { type JSX } from "solid-js";
+import { MenuContent } from "../menu/menu.content";
+import { MenuGroup, MenuGroupLabel, MenuItem, MenuSeparator, MenuSubTrigger } from "../menu/menu.parts";
+import { MenuRoot, type MenuRootProps } from "../menu/menu.root";
+import { MenubarContent, MenubarMenu, MenubarTrigger } from "./menubar.parts";
+export type MenubarRootProps = MenuRootProps & {
+    "aria-label": string;
+    class?: string;
+    style?: JSX.CSSProperties;
+};
+export declare function MenubarRoot(props: MenubarRootProps): JSX.Element;
+export declare const Menubar: {
+    Root: typeof MenubarRoot;
+    Menu: typeof MenubarMenu;
+    Trigger: typeof MenubarTrigger;
+    Content: typeof MenubarContent;
+    Item: typeof MenuItem;
+    Group: typeof MenuGroup;
+    GroupLabel: typeof MenuGroupLabel;
+    Separator: typeof MenuSeparator;
+    SubRoot: typeof MenuRoot;
+    SubTrigger: typeof MenuSubTrigger;
+    SubContent: typeof MenuContent;
+    Context: (props: Ark.ContextProps) => JSX.Element;
+};

package/dist/types/actions/menubar/menubar.parts.d.ts

@@ -0,0 +1,12 @@
+import { Menu as Ark } from "@ark-ui/solid/menu";
+import { type JSX } from "solid-js";
+import type { MenuContentProps } from "../menu/menu.content";
+export type MenubarMenuProps = {
+    value: string;
+    children?: JSX.Element;
+};
+export type MenubarTriggerProps = Omit<Ark.TriggerProps, "value" | "role" | "tabIndex">;
+export type MenubarContentProps = MenuContentProps;
+export declare function MenubarMenu(props: MenubarMenuProps): JSX.Element;
+export declare function MenubarTrigger(props: MenubarTriggerProps): JSX.Element;
+export declare function MenubarContent(props: MenubarContentProps): null;

package/dist/types/actions/menubar/menubar.recipe.d.ts

@@ -0,0 +1 @@
+export declare const menubarRecipe: import("tailwind-variants/lite").TVReturnType<{} | {} | {}, undefined, "nui:flex nui:w-fit nui:max-w-full nui:self-start nui:items-center nui:gap-1 nui:rounded-md nui:border nui:border-border nui:bg-background nui:p-1", {} | {}, undefined, import("tailwind-variants/lite").TVReturnTypeLike<unknown, undefined>>;

package/dist/types/actions/menubar/menubar.surface.d.ts

@@ -0,0 +1 @@
+export declare function MenubarSurface(): import("solid-js").JSX.Element;

package/dist/types/actions/menubar/use-menubar.d.ts

@@ -0,0 +1,3 @@
+import type { UseMenuContext } from "@ark-ui/solid/menu";
+import type { MenubarController } from "./menubar.context";
+export declare function createMenubarController(api: UseMenuContext, element: () => HTMLDivElement | undefined): MenubarController;