@tulip-systems/core 0.8.3 → 0.9.0

package/src/modules/commands/components/{dropdown-command.client.tsx → primitives/dropdown-command.client.tsx}

@@ -19,13 +19,10 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu.client";
 import { cn } from "@/lib/utils/cn";
-import { useCommand } from "../hooks/context.client";
-import { useCommandMutation } from "../hooks/use-command-mutation.client";
+import { useCommand } from "../../hooks/use-command.client";
+import { useCommandMutation } from "../../hooks/use-command-mutation.client";
 import { CommandTrigger } from "./command-trigger.client";
 
-/**
- * CommandDropdownContext
- */
 type CommandDropdownContextValue = {
   open: boolean;
   setOpen: React.Dispatch<React.SetStateAction<boolean>>;
@@ -33,19 +30,16 @@ type CommandDropdownContextValue = {
 
 const CommandDropdownContext = React.createContext({} as CommandDropdownContextValue);
 
-/**
- * CommandDropdown
- */
 export type CommandDropdownProps = {
   children: React.ReactNode;
   className?: string;
 };
 
 export function CommandDropdown({ children, ...props }: CommandDropdownProps) {
+  const { ui } = useCommand();
   const [open, setOpen] = React.useState(false);
-  const { menu } = useCommand();
 
-  if (menu === "inline" || menu === "table") {
+  if (ui === "inline" || ui === "table") {
     return (
       <DropdownMenu {...props} open={open} onOpenChange={setOpen}>
         <CommandDropdownContext.Provider value={{ open, setOpen }}>
@@ -55,7 +49,7 @@ export function CommandDropdown({ children, ...props }: CommandDropdownProps) {
     );
   }
 
-  if (menu === "dropdown") {
+  if (ui === "dropdown") {
     return (
       <DropdownMenuSub {...props} open={open} onOpenChange={setOpen}>
         <CommandDropdownContext.Provider value={{ open, setOpen }}>
@@ -65,7 +59,7 @@ export function CommandDropdown({ children, ...props }: CommandDropdownProps) {
     );
   }
 
-  if (menu === "context") {
+  if (ui === "context") {
     return (
       <ContextMenuSub {...props} open={open} onOpenChange={setOpen}>
         <CommandDropdownContext.Provider value={{ open, setOpen }}>
@@ -75,38 +69,32 @@ export function CommandDropdown({ children, ...props }: CommandDropdownProps) {
     );
   }
 
-  return null;
+  return <>{children}</>;
 }
 
-/**
- * CommandDropdownContent
- */
 type CommandDropdownContentProps = {
   children: React.ReactNode;
   className?: string;
 };
 
 export function CommandDropdownContent({ children, ...props }: CommandDropdownContentProps) {
-  const { menu } = useCommand();
+  const { ui } = useCommand();
 
-  if (menu === "inline" || menu === "table") {
+  if (ui === "inline" || ui === "table") {
     return <DropdownMenuContent {...props}>{children}</DropdownMenuContent>;
   }
 
-  if (menu === "dropdown") {
+  if (ui === "dropdown") {
     return <DropdownMenuSubContent {...props}>{children}</DropdownMenuSubContent>;
   }
 
-  if (menu === "context") {
+  if (ui === "context") {
     return <ContextMenuSubContent {...props}>{children}</ContextMenuSubContent>;
   }
 
-  return null;
+  return <>{children}</>;
 }
 
-/**
- * CommandDropdownTrigger
- */
 type CommandDropdownTriggerProps = {
   children: React.ReactNode;
   className?: string;
@@ -120,11 +108,11 @@ export function CommandDropdownTrigger({
   children,
   ...props
 }: CommandDropdownTriggerProps) {
-  const { menu, status } = useCommand();
+  const { status, ui, disabled: commandDisabled } = useCommand();
 
-  const isDisabled = disabled || status === "pending";
+  const isDisabled = disabled || commandDisabled || status === "pending";
 
-  if (menu === "inline" || menu === "table") {
+  if (ui === "inline" || ui === "table") {
     return (
       <CommandTrigger label={label}>
         <DropdownMenuTrigger
@@ -138,7 +126,7 @@ export function CommandDropdownTrigger({
     );
   }
 
-  if (menu === "dropdown") {
+  if (ui === "dropdown") {
     return (
       <CommandTrigger label={label}>
         <DropdownMenuSubTrigger {...props} disabled={isDisabled}>
@@ -148,7 +136,7 @@ export function CommandDropdownTrigger({
     );
   }
 
-  if (menu === "context") {
+  if (ui === "context") {
     return (
       <CommandTrigger label={label}>
         <ContextMenuSubTrigger {...props} disabled={isDisabled}>
@@ -158,12 +146,9 @@ export function CommandDropdownTrigger({
     );
   }
 
-  return null;
+  return <>{children}</>;
 }
 
-/**
- * CommandDropdownItem
- */
 type CommandDropdownItemProps<
   TData = unknown,
   TError = DefaultError,
@@ -188,22 +173,21 @@ export function CommandDropdownItem<
   ...props
 }: CommandDropdownItemProps<TData, TError, TVariables, TOnMutateResult>) {
   const { setOpen } = React.useContext(CommandDropdownContext);
-  const { menu, status } = useCommand();
+  const { status, ui, disabled: commandDisabled } = useCommand();
 
   const { mutateAsync } = useCommandMutation({
     ...mutation,
     onSuccess: async (...params) => {
       setOpen(false);
-
       return await mutation?.onSuccess?.(...params);
     },
   });
 
-  if (menu === "inline" || menu === "table" || menu === "dropdown") {
+  if (ui === "inline" || ui === "table" || ui === "dropdown") {
     return (
       <DropdownMenuItem
         {...props}
-        disabled={status === "pending"}
+        disabled={commandDisabled || status === "pending"}
         onClick={() => mutateAsync(variables)}
       >
         {children}
@@ -211,11 +195,11 @@ export function CommandDropdownItem<
     );
   }
 
-  if (menu === "context") {
+  if (ui === "context") {
     return (
       <ContextMenuItem
         {...props}
-        disabled={status === "pending"}
+        disabled={commandDisabled || status === "pending"}
         onClick={() => mutateAsync(variables)}
       >
         {children}
@@ -223,5 +207,5 @@ export function CommandDropdownItem<
     );
   }
 
-  return null;
+  return <>{children}</>;
 }

package/src/modules/commands/components/{empty-command.client.tsx → primitives/empty-command.client.tsx}

@@ -4,10 +4,12 @@ import type React from "react";
 import { Button } from "@/components/ui/button";
 import { ContextMenuItem } from "@/components/ui/context-menu.client";
 import { DropdownMenuItem } from "@/components/ui/dropdown-menu.client";
-import { useCommand } from "../hooks/context.client";
+import { useCommand } from "../../hooks/use-command.client";
+import type { CommandUI } from "../../lib/builder";
 import { CommandTrigger } from "./command-trigger.client";
 
 export type CommandEmptyProps = {
+  ui?: CommandUI;
   children: React.ReactNode;
   className?: string;
   disabled?: boolean;
@@ -15,11 +17,11 @@ export type CommandEmptyProps = {
 };
 
 export function CommandEmpty({ label, children, disabled, ...props }: CommandEmptyProps) {
-  const { menu, status } = useCommand();
+  const { status, ui, disabled: commandDisabled } = useCommand();
 
-  const isDisabled = disabled ?? status === "pending";
+  const isDisabled = disabled ?? (commandDisabled || status === "pending");
 
-  if (menu === "inline") {
+  if (ui === "inline" || ui === "table") {
     return (
       <CommandTrigger label={label}>
         <Button {...props} variant="outline" size="sm" disabled={isDisabled}>
@@ -29,7 +31,7 @@ export function CommandEmpty({ label, children, disabled, ...props }: CommandEmp
     );
   }
 
-  if (menu === "dropdown") {
+  if (ui === "dropdown") {
     return (
       <CommandTrigger label={label}>
         <DropdownMenuItem {...props} disabled={isDisabled}>
@@ -39,7 +41,7 @@ export function CommandEmpty({ label, children, disabled, ...props }: CommandEmp
     );
   }
 
-  if (menu === "context") {
+  if (ui === "context") {
     return (
       <CommandTrigger label={label}>
         <ContextMenuItem {...props} disabled={isDisabled}>
@@ -49,15 +51,5 @@ export function CommandEmpty({ label, children, disabled, ...props }: CommandEmp
     );
   }
 
-  if (menu === "table") {
-    return (
-      <CommandTrigger label={label}>
-        <Button {...props} variant="outline" size="sm" disabled={isDisabled}>
-          {children}
-        </Button>
-      </CommandTrigger>
-    );
-  }
-
-  return null;
+  return <>{children}</>;
 }

package/src/modules/commands/components/{form-dialog-command.client.tsx → primitives/form-dialog-command.client.tsx}

@@ -18,13 +18,10 @@ import {
 } from "@/components/ui/dialog.client";
 import { DropdownMenuItem } from "@/components/ui/dropdown-menu.client";
 import { cn } from "@/lib/utils/cn";
-import { useCommandMutation } from "../entry.client";
-import { useCommand } from "../hooks/context.client";
+import { useCommand } from "../../hooks/use-command.client";
+import { useCommandMutation } from "../../hooks/use-command-mutation.client";
 import { CommandTrigger } from "./command-trigger.client";
 
-/**
- * CommandFormDialogContext
- */
 type CommandFormDialogContextValue = {
   open: boolean;
   setOpen: React.Dispatch<React.SetStateAction<boolean>>;
@@ -32,9 +29,6 @@ type CommandFormDialogContextValue = {
 
 const CommandFormDialogContext = React.createContext({} as CommandFormDialogContextValue);
 
-/**
- * CommandFormDialog
- */
 export function CommandFormDialog({ children, ...props }: ComponentProps<typeof Dialog>) {
   const [open, setOpen] = React.useState(false);
 
@@ -47,9 +41,6 @@ export function CommandFormDialog({ children, ...props }: ComponentProps<typeof
   );
 }
 
-/**
- * CommandFormDialogTrigger
- */
 type CommandFormDialogTriggerProps = {
   children: React.ReactNode;
   className?: string;
@@ -65,14 +56,14 @@ export function CommandFormDialogTrigger({
   disabled,
   ...props
 }: CommandFormDialogTriggerProps) {
-  const { menu, status } = useCommand();
+  const { status, ui, disabled: commandDisabled } = useCommand();
   const { setOpen } = React.useContext(CommandFormDialogContext);
 
-  const isDisabled = disabled || status === "pending";
+  const isDisabled = disabled || commandDisabled || status === "pending";
 
   useHotkeys(hotkey ?? "", () => setOpen(true), { enabled: !isDisabled && hotkey !== undefined });
 
-  if (menu === "inline" || menu === "table") {
+  if (ui === "inline" || ui === "table") {
     return (
       <CommandTrigger label={label}>
         <DialogTrigger
@@ -86,7 +77,7 @@ export function CommandFormDialogTrigger({
     );
   }
 
-  if (menu === "dropdown") {
+  if (ui === "dropdown") {
     return (
       <CommandTrigger label={label}>
         <DialogTrigger asChild>
@@ -105,7 +96,7 @@ export function CommandFormDialogTrigger({
     );
   }
 
-  if (menu === "context") {
+  if (ui === "context") {
     return (
       <CommandTrigger label={label}>
         <DialogTrigger asChild>
@@ -123,11 +114,10 @@ export function CommandFormDialogTrigger({
       </CommandTrigger>
     );
   }
+
+  return <>{children}</>;
 }
 
-/**
- * CommandFormDialogHeader
- */
 export function CommandFormDialogHeader({
   children,
   ...props
@@ -135,16 +125,10 @@ export function CommandFormDialogHeader({
   return <DialogHeader {...props}>{children}</DialogHeader>;
 }
 
-/**
- * CommandFormDialogTitle
- */
 export function CommandFormDialogTitle({ children, ...props }: ComponentProps<typeof DialogTitle>) {
   return <DialogTitle {...props}>{children}</DialogTitle>;
 }
 
-/**
- * CommandFormDialogDescription
- */
 export function CommandFormDialogDescription({
   children,
   ...props
@@ -154,9 +138,6 @@ export function CommandFormDialogDescription({
 
 export const CommandFormDialogContentProvider = Form;
 
-/**
- * CommandFormDialogContent
- */
 export type CommandFormDialogContentProps<
   TValues extends FieldValues,
   TData = unknown,
@@ -168,12 +149,6 @@ export type CommandFormDialogContentProps<
   mutation?: MutationOptions<TData, TError, TVariables, TOnMutateResult>;
   children: React.ReactNode;
 };
-// export type CommandFormDialogContentProps<TSchema extends FieldValues> = DialogContentProps & {
-//   action: CommandAction<TSchema>;
-//   mutation?: MutationOptions<TSchema>;
-//   message?: string;
-//   children: React.ReactNode;
-// };
 
 export function CommandFormDialogContent<
   TValues extends FieldValues,
@@ -195,15 +170,10 @@ export function CommandFormDialogContent<
     onSuccess: async (...params) => {
       form.reset();
       setOpen(false);
-
       return await mutation?.onSuccess?.(...params);
     },
   });
 
-  if (Object.keys(form?.formState?.errors || {})?.length > 0) {
-    console.error(form.formState.errors);
-  }
-
   return (
     <DialogContent {...props}>
       <form
@@ -218,9 +188,6 @@ export function CommandFormDialogContent<
   );
 }
 
-/**
- * FormDialogFields
- */
 export function CommandFormDialogFields({ children, className, ...props }: ComponentProps<"div">) {
   return (
     <div {...props} className={cn("space-y-5 py-10", className)}>
@@ -229,9 +196,6 @@ export function CommandFormDialogFields({ children, className, ...props }: Compo
   );
 }
 
-/**
- * CommandFormDialogFooter
- */
 export function CommandFormDialogFooter({
   children,
   ...props
@@ -239,9 +203,6 @@ export function CommandFormDialogFooter({
   return <DialogFooter {...props}>{children}</DialogFooter>;
 }
 
-/**
- * CommandFormDialogCancel
- */
 export function CommandFormDialogCancel({
   children,
   onClick,
@@ -266,17 +227,14 @@ export function CommandFormDialogCancel({
   );
 }
 
-/**
- * CommandFormDialogSubmit
- */
 export function CommandFormDialogSubmit({
   children,
   disabled,
   ...props
 }: Omit<ComponentProps<"button">, "type">) {
-  const { status } = useCommand();
+  const { status, disabled: commandDisabled } = useCommand();
 
-  const isDisabled = disabled || status === "pending";
+  const isDisabled = disabled || commandDisabled || status === "pending";
 
   return (
     <Button {...props} type="submit" disabled={isDisabled}>

package/src/modules/commands/components/render-command.tsx

@@ -1,19 +1,60 @@
-import { Fragment } from "react/jsx-runtime";
+"use client";
+
+import type { ReactNode } from "react";
+import type z from "zod";
 import { Allowed } from "@/modules/auth/components/allowed.client";
-import type { CommandDef } from "../lib/definitions";
+import { type CommandContextLifecycle, CommandContextProvider } from "../hooks/use-command.client";
+import type { CommandDef, CommandUI } from "../lib/builder";
+
+type RenderCommandProps<TSchema extends z.ZodTypeAny, TMeta> = {
+  command: CommandDef<TSchema, TMeta>;
+  data: z.input<TSchema>;
+  meta?: TMeta;
+  fallback?: ReactNode;
+  ui: CommandUI;
+} & CommandContextLifecycle;
+
+/**
+ * Command renderer.
+ *
+ * It validates input data through the command schema, applies optional visibility/disabled rules,
+ * exposes command status via context, and then renders the command content.
+ */
+export function RenderCommand<TSchema extends z.ZodTypeAny, TMeta>(
+  props: RenderCommandProps<TSchema, TMeta>,
+) {
+  const parsedData = props.command.schema.safeParse(props.data);
+  if (!parsedData.success) return <>{props.fallback}</>;
+  const data = parsedData.data;
+
+  const meta = (props.meta ?? {}) as TMeta;
 
-type RenderCommandProps<TData, TMeta> = {
-  command: CommandDef<TData, TMeta>;
-  render: (command: CommandDef<TData, TMeta>) => React.ReactNode;
-};
+  const visibleResult = props.command.visibleWhen?.({ data, meta });
+  const disabledResult = props.command.disabledWhen?.({ data, meta });
 
-export function RenderCommand<TData, TMeta>({ command, render }: RenderCommandProps<TData, TMeta>) {
-  const children = <Fragment key={command.name}>{render(command)}</Fragment>;
+  const isVisible = Array.isArray(visibleResult) ? visibleResult.every(Boolean) : (visibleResult ?? true);
+  if (!isVisible) return <>{props.fallback}</>;
+
+  const isDisabled = Array.isArray(disabledResult)
+    ? disabledResult.every(Boolean)
+    : (disabledResult ?? false);
+
+  const children = (
+    <CommandContextProvider
+      ui={props.ui}
+      disabled={isDisabled}
+      onSuccess={props.onSuccess}
+      onError={props.onError}
+      onSettled={props.onSettled}
+    >
+      {props.command.render({ data, meta, ui: props.ui })}
+    </CommandContextProvider>
+  );
 
-  if (!command.permission) return children;
+  if (!props.command.permission) return children;
 
   return (
-    <Allowed key={command.name} permission={command.permission}>
+    <Allowed permission={props.command.permission} fallback={props.fallback}>
       {children}
     </Allowed>
   );

package/src/modules/commands/{utils → components/utils}/archive-command.client.tsx

@@ -2,8 +2,8 @@
 
 import type { DefaultError, MutationOptions } from "@tanstack/react-query";
 import { Icons } from "@/components/common/icons";
-import { CommandClick } from "../components/click-command.client";
-import { CommandLabel } from "../components/command-trigger.client";
+import { CommandClick } from "../primitives/click-command.client";
+import { CommandLabel } from "../primitives/command-trigger.client";
 
 export type ArchiveCommandProps<
   TData = unknown,
@@ -15,10 +15,6 @@ export type ArchiveCommandProps<
   mutation: MutationOptions<TData, TError, TVariables, TOnMutateResult>;
 };
 
-/**
- * Archive command
- * @description command to archive a resource
- */
 export function ArchiveCommand<
   TData = unknown,
   TError = DefaultError,
@@ -38,10 +34,6 @@ export function ArchiveCommand<
   );
 }
 
-/**
- * Unarchive command
- * @description command to unarchive a resource
- */
 export function RestoreCommand<
   TData = unknown,
   TError = DefaultError,

package/src/modules/commands/{utils → components/utils}/delete-command.client.tsx

@@ -12,8 +12,8 @@ import {
   CommandAlertDialogHeader,
   CommandAlertDialogTitle,
   CommandAlertDialogTrigger,
-} from "../components/alert-dialog-command.client";
-import { CommandLabel } from "../components/command-trigger.client";
+} from "../primitives/alert-dialog-command.client";
+import { CommandLabel } from "../primitives/command-trigger.client";
 
 export type DeleteCommandProps<
   TData = unknown,
@@ -24,10 +24,7 @@ export type DeleteCommandProps<
   variables: TVariables;
   mutation: MutationOptions<TData, TError, TVariables, TOnMutateResult>;
 };
-/**
- * Delete command
- * @description command to delete a resource
- */
+
 export function DeleteCommand<
   TData = unknown,
   TError = DefaultError,
@@ -63,9 +60,6 @@ export function DeleteCommand<
   );
 }
 
-/**
- * Single Delete command
- */
 export function SingleDeleteCommand<
   TData = unknown,
   TError = DefaultError,

package/src/modules/commands/entry.client.ts

@@ -1,31 +1,23 @@
 /**
  * Components
  */
-export * from "./components/alert-dialog-command.client";
-export * from "./components/click-command.client";
-export * from "./components/command-trigger.client";
-export * from "./components/dialog-command.client";
-export * from "./components/dropdown-command.client";
-export * from "./components/empty-command.client";
-export * from "./components/form-dialog-command.client";
+export * from "./components/menus/context-menu.client";
+export * from "./components/menus/dropdown-menu.client";
+export * from "./components/menus/floating-menu.client";
+export * from "./components/menus/inline-menu.client";
+export * from "./components/menus/responsive-menu.client";
+export * from "./components/primitives/alert-dialog-command.client";
+export * from "./components/primitives/click-command.client";
+export * from "./components/primitives/command-trigger.client";
+export * from "./components/primitives/dialog-command.client";
+export * from "./components/primitives/dropdown-command.client";
+export * from "./components/primitives/empty-command.client";
+export * from "./components/primitives/form-dialog-command.client";
+export * from "./components/utils/archive-command.client";
+export * from "./components/utils/delete-command.client";
 
 /**
  * Hooks
  */
+export * from "./hooks/use-command.client";
 export * from "./hooks/use-command-mutation.client";
-
-/**
- * Menus
- */
-export * from "./menus/context-menu.client";
-export * from "./menus/dropdown-menu.client";
-export * from "./menus/floating-menu.client";
-export * from "./menus/inline-menu.client";
-export * from "./menus/responsive-menu.client";
-
-/**
- * Utils
- */
-export * from "./utils/archive-command.client";
-export * from "./utils/delete-command.client";
-export * from "./utils/send-mail-command.client";

package/src/modules/commands/entry.ts

@@ -1,2 +1,5 @@
-export * from "./lib/definitions";
-export * from "./lib/factory";
+/**
+ * Lib
+ */
+export * from "./lib/builder";
+export * from "./lib/registery";