@tulip-systems/core 0.6.0 → 0.7.0

package/dist/modules/commands/menus/context-menu.client.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"context-menu.client.mjs","names":[],"sources":["../../../../src/modules/commands/menus/context-menu.client.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ContextMenuContentProps } from \"@radix-ui/react-context-menu\";\nimport { useState } from \"react\";\nimport {\n  ContextMenu,\n  ContextMenuContent,\n  ContextMenuItem,\n  ContextMenuTrigger,\n} from \"@/components/ui/context-menu\";\nimport { cn } from \"@/lib/entry\";\nimport { RenderCommand } from \"../components/render-command\";\nimport { CommandContextProvider } from \"../hooks/context.client\";\nimport {\n  type SingleCommandMenuProps,\n  useSingleCommandMenu,\n} from \"../hooks/use-command-menu.client\";\n\n/**\n * ContextCommandMenu\n */\nexport const ContextCommandMenu = ContextMenu;\n\n/**\n * ContextCommandMenuTrigger\n */\nexport const ContextCommandMenuTrigger = ContextMenuTrigger;\n\n/**\n * ContextCommandMenuContent\n */\nexport function ContextCommandMenuContent<TData, TMeta>({\n  data,\n  commands,\n  meta,\n  className,\n  ...props\n}: SingleCommandMenuProps<TData, TMeta> & ContextMenuContentProps) {\n  const [hasCommands, setHasCommands] = useState(true);\n\n  const [validCommands, renderCommand] = useSingleCommandMenu({ data, commands, meta });\n\n  if (!hasCommands) {\n    return (\n      <CommandContextProvider value={{ menu: \"context\" }}>\n        <ContextMenuContent {...props} className={cn(\"min-w-40\", className)}>\n          <ContextMenuItem className=\"font-medium\" disabled>\n            Geen acties beschikbaar\n          </ContextMenuItem>\n        </ContextMenuContent>\n      </CommandContextProvider>\n    );\n  }\n\n  return (\n    <CommandContextProvider value={{ menu: \"context\" }}>\n      <ContextMenuContent\n        {...props}\n        className={cn(\"min-w-40\", className)}\n        ref={(ref) => {\n          if (ref?.childNodes.length === 0) setHasCommands(false);\n        }}\n      >\n        {validCommands.map((command) => (\n          <RenderCommand key={command.name} command={command} render={renderCommand} />\n        ))}\n      </ContextMenuContent>\n    </CommandContextProvider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;AAqBA,MAAa,qBAAqB;;;;AAKlC,MAAa,4BAA4B;;;;AAKzC,SAAgB,0BAAwC,EACtD,MACA,UACA,MACA,WACA,GAAG,SAC8D;CACjE,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CAEpD,MAAM,CAAC,eAAe,iBAAiB,qBAAqB;EAAE;EAAM;EAAU;EAAM,CAAC;AAErF,KAAI,CAAC,YACH,QACE,oBAAC;EAAuB,OAAO,EAAE,MAAM,WAAW;YAChD,oBAAC;GAAmB,GAAI;GAAO,WAAW,GAAG,YAAY,UAAU;aACjE,oBAAC;IAAgB,WAAU;IAAc;cAAS;KAEhC;IACC;GACE;AAI7B,QACE,oBAAC;EAAuB,OAAO,EAAE,MAAM,WAAW;YAChD,oBAAC;GACC,GAAI;GACJ,WAAW,GAAG,YAAY,UAAU;GACpC,MAAM,QAAQ;AACZ,QAAI,KAAK,WAAW,WAAW,EAAG,gBAAe,MAAM;;aAGxD,cAAc,KAAK,YAClB,oBAAC;IAA0C;IAAS,QAAQ;MAAxC,QAAQ,KAAiD,CAC7E;IACiB;GACE"}
+{"version":3,"file":"context-menu.client.mjs","names":[],"sources":["../../../../src/modules/commands/menus/context-menu.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ComponentProps, useState } from \"react\";\nimport {\n  ContextMenu,\n  ContextMenuContent,\n  ContextMenuItem,\n  ContextMenuTrigger,\n} from \"@/components/ui/context-menu.client\";\nimport { cn } from \"@/lib/entry\";\nimport { RenderCommand } from \"../components/render-command\";\nimport { CommandContextProvider } from \"../hooks/context.client\";\nimport {\n  type SingleCommandMenuProps,\n  useSingleCommandMenu,\n} from \"../hooks/use-command-menu.client\";\n\n/**\n * ContextCommandMenu\n */\nexport const ContextCommandMenu = ContextMenu;\n\n/**\n * ContextCommandMenuTrigger\n */\nexport const ContextCommandMenuTrigger = ContextMenuTrigger;\n\n/**\n * ContextCommandMenuContent\n */\nexport function ContextCommandMenuContent<TData, TMeta>({\n  data,\n  commands,\n  meta,\n  className,\n  ...props\n}: SingleCommandMenuProps<TData, TMeta> & ComponentProps<typeof ContextMenuContent>) {\n  const [hasCommands, setHasCommands] = useState(true);\n\n  const [validCommands, renderCommand] = useSingleCommandMenu({ data, commands, meta });\n\n  if (!hasCommands) {\n    return (\n      <CommandContextProvider value={{ menu: \"context\" }}>\n        <ContextMenuContent {...props} className={cn(\"min-w-40\", className)}>\n          <ContextMenuItem className=\"font-medium\" disabled>\n            Geen acties beschikbaar\n          </ContextMenuItem>\n        </ContextMenuContent>\n      </CommandContextProvider>\n    );\n  }\n\n  return (\n    <CommandContextProvider value={{ menu: \"context\" }}>\n      <ContextMenuContent\n        {...props}\n        className={cn(\"min-w-40\", className)}\n        ref={(ref) => {\n          if (ref?.childNodes.length === 0) setHasCommands(false);\n        }}\n      >\n        {validCommands.map((command) => (\n          <RenderCommand key={command.name} command={command} render={renderCommand} />\n        ))}\n      </ContextMenuContent>\n    </CommandContextProvider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;AAoBA,MAAa,qBAAqB;;;;AAKlC,MAAa,4BAA4B;;;;AAKzC,SAAgB,0BAAwC,EACtD,MACA,UACA,MACA,WACA,GAAG,SACgF;CACnF,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CAEpD,MAAM,CAAC,eAAe,iBAAiB,qBAAqB;EAAE;EAAM;EAAU;EAAM,CAAC;AAErF,KAAI,CAAC,YACH,QACE,oBAAC;EAAuB,OAAO,EAAE,MAAM,WAAW;YAChD,oBAAC;GAAmB,GAAI;GAAO,WAAW,GAAG,YAAY,UAAU;aACjE,oBAAC;IAAgB,WAAU;IAAc;cAAS;KAEhC;IACC;GACE;AAI7B,QACE,oBAAC;EAAuB,OAAO,EAAE,MAAM,WAAW;YAChD,oBAAC;GACC,GAAI;GACJ,WAAW,GAAG,YAAY,UAAU;GACpC,MAAM,QAAQ;AACZ,QAAI,KAAK,WAAW,WAAW,EAAG,gBAAe,MAAM;;aAGxD,cAAc,KAAK,YAClB,oBAAC;IAA0C;IAAS,QAAQ;MAAxC,QAAQ,KAAiD,CAC7E;IACiB;GACE"}

package/dist/modules/commands/menus/dropdown-menu.client.mjs

@@ -2,7 +2,7 @@
 
 import { cn } from "../../../lib/utils/cn.mjs";
 import { Button } from "../../../components/ui/button.mjs";
-import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger } from "../../../components/ui/dropdown-menu.mjs";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger } from "../../../components/ui/dropdown-menu.client.mjs";
 import { Skeleton } from "../../../components/ui/skeleton.mjs";
 import { CommandContextProvider } from "../hooks/context.client.mjs";
 import { RenderCommand } from "../components/render-command.mjs";
@@ -28,7 +28,7 @@ function DropdownCommandMenu({ data, commands, meta, className, ...props }) {
 			children: /* @__PURE__ */ jsxs(Button, {
 				...props,
 				variant: "ghost",
-				className: cn("data-[state=open]:bg-secondary size-8 p-0", className),
+				className: cn("size-8 p-0 data-[state=open]:bg-secondary", className),
 				children: [/* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4" }), /* @__PURE__ */ jsx("span", {
 					className: "sr-only",
 					children: "Open menu"

package/dist/modules/commands/menus/dropdown-menu.client.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu.client.mjs","names":[],"sources":["../../../../src/modules/commands/menus/dropdown-menu.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { MoreHorizontal } from \"lucide-react\";\nimport React, { type ComponentProps } from \"react\";\nimport { Skeleton } from \"@/components/entry\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport { cn } from \"@/lib/utils/cn\";\nimport { RenderCommand } from \"../components/render-command\";\nimport { CommandContextProvider } from \"../hooks/context.client\";\nimport {\n  type SingleCommandMenuProps,\n  useSingleCommandMenu,\n} from \"../hooks/use-command-menu.client\";\n\nexport function DropdownCommandMenu<TData, TMeta>({\n  data,\n  commands,\n  meta,\n  className,\n  ...props\n}: SingleCommandMenuProps<TData, TMeta> & React.HTMLAttributes<HTMLElement>) {\n  const [open, setOpen] = React.useState(false);\n  const [validCommands, renderCommand] = useSingleCommandMenu({ data, commands, meta });\n\n  if (!validCommands.length) return null;\n\n  return (\n    <DropdownMenu open={open} onOpenChange={setOpen}>\n      <DropdownMenuTrigger asChild>\n        <Button\n          {...props}\n          variant=\"ghost\"\n          className={cn(\"data-[state=open]:bg-secondary size-8 p-0\", className)}\n        >\n          <MoreHorizontal className=\"h-4 w-4\" />\n          <span className=\"sr-only\">Open menu</span>\n        </Button>\n      </DropdownMenuTrigger>\n\n      <DropdownMenuContent align=\"end\" className=\"min-w-[10rem]\">\n        <CommandContextProvider value={{ menu: \"dropdown\", onSuccess: () => setOpen(false) }}>\n          {validCommands.map((command) => (\n            <RenderCommand key={command.name} command={command} render={renderCommand} />\n          ))}\n        </CommandContextProvider>\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n}\n\nexport function DropdownCommandMenuLoading({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div {...props} className={cn(\"flex w-fit items-center\", className)}>\n      <Skeleton className=\"h-8 w-8\" />\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;AAmBA,SAAgB,oBAAkC,EAChD,MACA,UACA,MACA,WACA,GAAG,SACwE;CAC3E,MAAM,CAAC,MAAM,WAAW,MAAM,SAAS,MAAM;CAC7C,MAAM,CAAC,eAAe,iBAAiB,qBAAqB;EAAE;EAAM;EAAU;EAAM,CAAC;AAErF,KAAI,CAAC,cAAc,OAAQ,QAAO;AAElC,QACE,qBAAC;EAAmB;EAAM,cAAc;aACtC,oBAAC;GAAoB;aACnB,qBAAC;IACC,GAAI;IACJ,SAAQ;IACR,WAAW,GAAG,6CAA6C,UAAU;eAErE,oBAAC,kBAAe,WAAU,YAAY,EACtC,oBAAC;KAAK,WAAU;eAAU;MAAgB;KACnC;IACW,EAEtB,oBAAC;GAAoB,OAAM;GAAM,WAAU;aACzC,oBAAC;IAAuB,OAAO;KAAE,MAAM;KAAY,iBAAiB,QAAQ,MAAM;KAAE;cACjF,cAAc,KAAK,YAClB,oBAAC;KAA0C;KAAS,QAAQ;OAAxC,QAAQ,KAAiD,CAC7E;KACqB;IACL;GACT;;AAInB,SAAgB,2BAA2B,EAAE,WAAW,GAAG,SAAgC;AACzF,QACE,oBAAC;EAAI,GAAI;EAAO,WAAW,GAAG,2BAA2B,UAAU;YACjE,oBAAC,YAAS,WAAU,YAAY;GAC5B"}
+{"version":3,"file":"dropdown-menu.client.mjs","names":[],"sources":["../../../../src/modules/commands/menus/dropdown-menu.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { MoreHorizontal } from \"lucide-react\";\nimport React, { type ComponentProps } from \"react\";\nimport { Skeleton } from \"@/components/entry\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu.client\";\nimport { cn } from \"@/lib/utils/cn\";\nimport { RenderCommand } from \"../components/render-command\";\nimport { CommandContextProvider } from \"../hooks/context.client\";\nimport {\n  type SingleCommandMenuProps,\n  useSingleCommandMenu,\n} from \"../hooks/use-command-menu.client\";\n\nexport function DropdownCommandMenu<TData, TMeta>({\n  data,\n  commands,\n  meta,\n  className,\n  ...props\n}: SingleCommandMenuProps<TData, TMeta> & React.HTMLAttributes<HTMLElement>) {\n  const [open, setOpen] = React.useState(false);\n  const [validCommands, renderCommand] = useSingleCommandMenu({ data, commands, meta });\n\n  if (!validCommands.length) return null;\n\n  return (\n    <DropdownMenu open={open} onOpenChange={setOpen}>\n      <DropdownMenuTrigger asChild>\n        <Button\n          {...props}\n          variant=\"ghost\"\n          className={cn(\"size-8 p-0 data-[state=open]:bg-secondary\", className)}\n        >\n          <MoreHorizontal className=\"h-4 w-4\" />\n          <span className=\"sr-only\">Open menu</span>\n        </Button>\n      </DropdownMenuTrigger>\n\n      <DropdownMenuContent align=\"end\" className=\"min-w-[10rem]\">\n        <CommandContextProvider value={{ menu: \"dropdown\", onSuccess: () => setOpen(false) }}>\n          {validCommands.map((command) => (\n            <RenderCommand key={command.name} command={command} render={renderCommand} />\n          ))}\n        </CommandContextProvider>\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n}\n\nexport function DropdownCommandMenuLoading({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div {...props} className={cn(\"flex w-fit items-center\", className)}>\n      <Skeleton className=\"h-8 w-8\" />\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;AAmBA,SAAgB,oBAAkC,EAChD,MACA,UACA,MACA,WACA,GAAG,SACwE;CAC3E,MAAM,CAAC,MAAM,WAAW,MAAM,SAAS,MAAM;CAC7C,MAAM,CAAC,eAAe,iBAAiB,qBAAqB;EAAE;EAAM;EAAU;EAAM,CAAC;AAErF,KAAI,CAAC,cAAc,OAAQ,QAAO;AAElC,QACE,qBAAC;EAAmB;EAAM,cAAc;aACtC,oBAAC;GAAoB;aACnB,qBAAC;IACC,GAAI;IACJ,SAAQ;IACR,WAAW,GAAG,6CAA6C,UAAU;eAErE,oBAAC,kBAAe,WAAU,YAAY,EACtC,oBAAC;KAAK,WAAU;eAAU;MAAgB;KACnC;IACW,EAEtB,oBAAC;GAAoB,OAAM;GAAM,WAAU;aACzC,oBAAC;IAAuB,OAAO;KAAE,MAAM;KAAY,iBAAiB,QAAQ,MAAM;KAAE;cACjF,cAAc,KAAK,YAClB,oBAAC;KAA0C;KAAS,QAAQ;OAAxC,QAAQ,KAAiD,CAC7E;KACqB;IACL;GACT;;AAInB,SAAgB,2BAA2B,EAAE,WAAW,GAAG,SAAgC;AACzF,QACE,oBAAC;EAAI,GAAI;EAAO,WAAW,GAAG,2BAA2B,UAAU;YACjE,oBAAC,YAAS,WAAU,YAAY;GAC5B"}

package/dist/modules/commands/menus/floating-menu.client.d.mts

@@ -0,0 +1,19 @@
+import { BulkCommandMenuProps } from "../hooks/use-command-menu.client.mjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/modules/commands/menus/floating-menu.client.d.ts
+type FloatingCommandMenuProps<TData, TMeta> = BulkCommandMenuProps<TData, TMeta> & React.HTMLAttributes<HTMLElement> & {
+  state: "open" | "closed";
+};
+declare function FloatingCommandMenu<TData, TMeta>({
+  data,
+  commands,
+  meta,
+  state,
+  onSuccess,
+  className,
+  ...props
+}: FloatingCommandMenuProps<TData, TMeta>): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { FloatingCommandMenu };
+//# sourceMappingURL=floating-menu.client.d.mts.map

package/dist/modules/commands/menus/floating-menu.client.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"floating-menu.client.d.mts","names":[],"sources":["../../../../src/modules/commands/menus/floating-menu.client.tsx"],"mappings":";;;;KAQK,wBAAA,iBAAyC,oBAAA,CAAqB,KAAA,EAAO,KAAA,IACxE,KAAA,CAAM,cAAA,CAAe,WAAA;EACnB,KAAA;AAAA;AAAA,iBAGY,mBAAA,cAAA,CAAA;EACd,IAAA;EACA,QAAA;EACA,IAAA;EACA,KAAA;EACA,SAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,wBAAA,CAAyB,KAAA,EAAO,KAAA,IAAM,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/modules/commands/menus/{data-table-menu.client.mjs → floating-menu.client.mjs}

@@ -1,24 +1,24 @@
 "use client";
 
+import { cn } from "../../../lib/utils/cn.mjs";
 import { CommandContextProvider } from "../hooks/context.client.mjs";
 import { RenderCommand } from "../components/render-command.mjs";
 import { useBulkCommandMenu } from "../hooks/use-command-menu.client.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useRef } from "react";
 
-//#region src/modules/commands/menus/data-table-menu.client.tsx
-function TableCommandMenu({ table }) {
-	const meta = table.options.meta;
+//#region src/modules/commands/menus/floating-menu.client.tsx
+function FloatingCommandMenu({ data, commands, meta, state, onSuccess, className, ...props }) {
 	const hasCommands = useRef(true);
-	const onSuccess = () => table.resetRowSelection();
 	const [validCommands, renderCommand] = useBulkCommandMenu({
-		data: meta.selectedData ?? [],
-		commands: meta.commands ?? [],
+		data,
+		commands,
 		meta
 	});
 	return /* @__PURE__ */ jsx("div", {
-		"data-state": meta.selectedData?.length ? "open" : "closed",
-		className: "bg-muted/80 fixed bottom-12 left-0 right-0 z-50 mx-auto flex w-fit items-center rounded-xl border px-3 py-2 shadow-xl backdrop-blur-2xl data-[state=open]:flex data-[state=closed]:hidden",
+		...props,
+		"data-state": state,
+		className: cn("fixed right-0 bottom-12 left-0 z-50 mx-auto flex w-fit items-center rounded-xl border bg-muted/80 px-3 py-2 shadow-xl backdrop-blur-2xl data-[state=open]:flex data-[state=closed]:hidden", className),
 		children: /* @__PURE__ */ jsxs(CommandContextProvider, {
 			value: {
 				menu: "table",
@@ -34,7 +34,7 @@ function TableCommandMenu({ table }) {
 					render: renderCommand
 				}, command.name))
 			}), !hasCommands.current && /* @__PURE__ */ jsx("span", {
-				className: "text-sm font-medium",
+				className: "font-medium text-sm",
 				children: "Geen acties beschikbaar"
 			})]
 		})
@@ -42,5 +42,5 @@ function TableCommandMenu({ table }) {
 }
 
 //#endregion
-export { TableCommandMenu };
-//# sourceMappingURL=data-table-menu.client.mjs.map
+export { FloatingCommandMenu };
+//# sourceMappingURL=floating-menu.client.mjs.map

package/dist/modules/commands/menus/floating-menu.client.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"floating-menu.client.mjs","names":[],"sources":["../../../../src/modules/commands/menus/floating-menu.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRef } from \"react\";\nimport { cn } from \"@/lib/utils/cn\";\nimport { RenderCommand } from \"../components/render-command\";\nimport { CommandContextProvider } from \"../hooks/context.client\";\nimport { type BulkCommandMenuProps, useBulkCommandMenu } from \"../hooks/use-command-menu.client\";\n\ntype FloatingCommandMenuProps<TData, TMeta> = BulkCommandMenuProps<TData, TMeta> &\n  React.HTMLAttributes<HTMLElement> & {\n    state: \"open\" | \"closed\";\n  };\n\nexport function FloatingCommandMenu<TData, TMeta>({\n  data,\n  commands,\n  meta,\n  state,\n  onSuccess,\n  className,\n  ...props\n}: FloatingCommandMenuProps<TData, TMeta>) {\n  const hasCommands = useRef(true);\n\n  const [validCommands, renderCommand] = useBulkCommandMenu({ data, commands, meta });\n\n  return (\n    <div\n      {...props}\n      data-state={state}\n      className={cn(\n        \"fixed right-0 bottom-12 left-0 z-50 mx-auto flex w-fit items-center rounded-xl border bg-muted/80 px-3 py-2 shadow-xl backdrop-blur-2xl data-[state=open]:flex data-[state=closed]:hidden\",\n        className,\n      )}\n    >\n      <CommandContextProvider value={{ menu: \"table\", onSuccess }}>\n        <div\n          className=\"flex gap-2\"\n          ref={(ref) => {\n            if (ref?.childNodes.length === 0) hasCommands.current = false;\n          }}\n        >\n          {validCommands.map((command) => (\n            <RenderCommand key={command.name} command={command} render={renderCommand} />\n          ))}\n        </div>\n\n        {!hasCommands.current && (\n          <span className=\"font-medium text-sm\">Geen acties beschikbaar</span>\n        )}\n      </CommandContextProvider>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;AAaA,SAAgB,oBAAkC,EAChD,MACA,UACA,MACA,OACA,WACA,WACA,GAAG,SACsC;CACzC,MAAM,cAAc,OAAO,KAAK;CAEhC,MAAM,CAAC,eAAe,iBAAiB,mBAAmB;EAAE;EAAM;EAAU;EAAM,CAAC;AAEnF,QACE,oBAAC;EACC,GAAI;EACJ,cAAY;EACZ,WAAW,GACT,6LACA,UACD;YAED,qBAAC;GAAuB,OAAO;IAAE,MAAM;IAAS;IAAW;cACzD,oBAAC;IACC,WAAU;IACV,MAAM,QAAQ;AACZ,SAAI,KAAK,WAAW,WAAW,EAAG,aAAY,UAAU;;cAGzD,cAAc,KAAK,YAClB,oBAAC;KAA0C;KAAS,QAAQ;OAAxC,QAAQ,KAAiD,CAC7E;KACE,EAEL,CAAC,YAAY,WACZ,oBAAC;IAAK,WAAU;cAAsB;KAA8B;IAE/C;GACrB"}

package/dist/modules/commands/utils/archive-command.client.mjs

@@ -16,7 +16,7 @@ function ArchiveCommand({ variables, mutation }) {
 		mutation,
 		className: "text-destructive",
 		label: "Archiveren",
-		children: [/* @__PURE__ */ jsx(Icons.archive, { className: "text-destructive w-4" }), /* @__PURE__ */ jsx(CommandLabel, {})]
+		children: [/* @__PURE__ */ jsx(Icons.archive, { className: "w-4 text-destructive" }), /* @__PURE__ */ jsx(CommandLabel, {})]
 	});
 }
 /**

package/dist/modules/commands/utils/archive-command.client.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"archive-command.client.mjs","names":[],"sources":["../../../../src/modules/commands/utils/archive-command.client.tsx"],"sourcesContent":["\"use client\";\n\nimport type { DefaultError, MutationOptions } from \"@tanstack/react-query\";\nimport { Icons } from \"@/components/common/icons\";\nimport { CommandClick } from \"../components/click-command.client\";\nimport { CommandLabel } from \"../components/command-trigger.client\";\n\nexport type ArchiveCommandProps<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = { ids: string[] },\n  TOnMutateResult = unknown,\n> = {\n  variables: TVariables;\n  mutation: MutationOptions<TData, TError, TVariables, TOnMutateResult>;\n};\n\n/**\n * Archive command\n * @description command to archive a resource\n */\nexport function ArchiveCommand<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = { ids: string[] },\n  TOnMutateResult = unknown,\n>({ variables, mutation }: ArchiveCommandProps<TData, TError, TVariables, TOnMutateResult>) {\n  return (\n    <CommandClick\n      variables={variables}\n      mutation={mutation}\n      className=\"text-destructive\"\n      label=\"Archiveren\"\n    >\n      <Icons.archive className=\"text-destructive w-4\" />\n      <CommandLabel />\n    </CommandClick>\n  );\n}\n\n/**\n * Unarchive command\n * @description command to unarchive a resource\n */\nexport function RestoreCommand<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = { ids: string[] },\n  TOnMutateResult = unknown,\n>({ variables, mutation }: ArchiveCommandProps<TData, TError, TVariables, TOnMutateResult>) {\n  return (\n    <CommandClick\n      className=\"flex gap-2\"\n      variables={variables}\n      mutation={mutation}\n      label=\"Terugzetten\"\n    >\n      <Icons.restore className=\"w-4\" />\n      <CommandLabel />\n    </CommandClick>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AAqBA,SAAgB,eAKd,EAAE,WAAW,YAA6E;AAC1F,QACE,qBAAC;EACY;EACD;EACV,WAAU;EACV,OAAM;aAEN,oBAAC,MAAM,WAAQ,WAAU,yBAAyB,EAClD,oBAAC,iBAAe;GACH;;;;;;AAQnB,SAAgB,eAKd,EAAE,WAAW,YAA6E;AAC1F,QACE,qBAAC;EACC,WAAU;EACC;EACD;EACV,OAAM;aAEN,oBAAC,MAAM,WAAQ,WAAU,QAAQ,EACjC,oBAAC,iBAAe;GACH"}
+{"version":3,"file":"archive-command.client.mjs","names":[],"sources":["../../../../src/modules/commands/utils/archive-command.client.tsx"],"sourcesContent":["\"use client\";\n\nimport type { DefaultError, MutationOptions } from \"@tanstack/react-query\";\nimport { Icons } from \"@/components/common/icons\";\nimport { CommandClick } from \"../components/click-command.client\";\nimport { CommandLabel } from \"../components/command-trigger.client\";\n\nexport type ArchiveCommandProps<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = { ids: string[] },\n  TOnMutateResult = unknown,\n> = {\n  variables: TVariables;\n  mutation: MutationOptions<TData, TError, TVariables, TOnMutateResult>;\n};\n\n/**\n * Archive command\n * @description command to archive a resource\n */\nexport function ArchiveCommand<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = { ids: string[] },\n  TOnMutateResult = unknown,\n>({ variables, mutation }: ArchiveCommandProps<TData, TError, TVariables, TOnMutateResult>) {\n  return (\n    <CommandClick\n      variables={variables}\n      mutation={mutation}\n      className=\"text-destructive\"\n      label=\"Archiveren\"\n    >\n      <Icons.archive className=\"w-4 text-destructive\" />\n      <CommandLabel />\n    </CommandClick>\n  );\n}\n\n/**\n * Unarchive command\n * @description command to unarchive a resource\n */\nexport function RestoreCommand<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = { ids: string[] },\n  TOnMutateResult = unknown,\n>({ variables, mutation }: ArchiveCommandProps<TData, TError, TVariables, TOnMutateResult>) {\n  return (\n    <CommandClick\n      className=\"flex gap-2\"\n      variables={variables}\n      mutation={mutation}\n      label=\"Terugzetten\"\n    >\n      <Icons.restore className=\"w-4\" />\n      <CommandLabel />\n    </CommandClick>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AAqBA,SAAgB,eAKd,EAAE,WAAW,YAA6E;AAC1F,QACE,qBAAC;EACY;EACD;EACV,WAAU;EACV,OAAM;aAEN,oBAAC,MAAM,WAAQ,WAAU,yBAAyB,EAClD,oBAAC,iBAAe;GACH;;;;;;AAQnB,SAAgB,eAKd,EAAE,WAAW,YAA6E;AAC1F,QACE,qBAAC;EACC,WAAU;EACC;EACD;EACV,OAAM;aAEN,oBAAC,MAAM,WAAQ,WAAU,QAAQ,EACjC,oBAAC,iBAAe;GACH"}

package/dist/modules/commands/utils/delete-command.client.mjs

@@ -14,7 +14,7 @@ function DeleteCommand({ variables, mutation }) {
 	return /* @__PURE__ */ jsxs(CommandAlertDialog, { children: [/* @__PURE__ */ jsxs(CommandAlertDialogTrigger, {
 		className: "text-destructive",
 		label: "Verwijderen",
-		children: [/* @__PURE__ */ jsx(Icons.trash, { className: "text-destructive w-4" }), /* @__PURE__ */ jsx(CommandLabel, {})]
+		children: [/* @__PURE__ */ jsx(Icons.trash, { className: "w-4 text-destructive" }), /* @__PURE__ */ jsx(CommandLabel, {})]
 	}), /* @__PURE__ */ jsxs(CommandAlertDialogContent, { children: [/* @__PURE__ */ jsxs(CommandAlertDialogHeader, { children: [/* @__PURE__ */ jsx(CommandAlertDialogTitle, { children: "Weet je zeker dat je dit wilt verwijderen?" }), /* @__PURE__ */ jsx(CommandAlertDialogDescription, { children: "Dit kan niet ongedaan gemaakt worden en alle gegevens zullen verloren gaan." })] }), /* @__PURE__ */ jsxs(CommandAlertDialogFooter, { children: [/* @__PURE__ */ jsx(CommandAlertDialogCancel, { children: "Annuleren" }), /* @__PURE__ */ jsx(CommandAlertDialogAction, {
 		mutation,
 		variables,

package/dist/modules/commands/utils/delete-command.client.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"delete-command.client.mjs","names":[],"sources":["../../../../src/modules/commands/utils/delete-command.client.tsx"],"sourcesContent":["\"use client\";\n\nimport type { DefaultError, MutationOptions } from \"@tanstack/react-query\";\nimport { Icons } from \"@/components/common/icons\";\nimport {\n  CommandAlertDialog,\n  CommandAlertDialogAction,\n  CommandAlertDialogCancel,\n  CommandAlertDialogContent,\n  CommandAlertDialogDescription,\n  CommandAlertDialogFooter,\n  CommandAlertDialogHeader,\n  CommandAlertDialogTitle,\n  CommandAlertDialogTrigger,\n} from \"../components/alert-dialog-command.client\";\nimport { CommandLabel } from \"../components/command-trigger.client\";\n\nexport type DeleteCommandProps<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = unknown,\n  TOnMutateResult = unknown,\n> = {\n  variables: TVariables;\n  mutation: MutationOptions<TData, TError, TVariables, TOnMutateResult>;\n};\n/**\n * Delete command\n * @description command to delete a resource\n */\nexport function DeleteCommand<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = unknown,\n  TOnMutateResult = unknown,\n>({ variables, mutation }: DeleteCommandProps<TData, TError, TVariables, TOnMutateResult>) {\n  return (\n    <CommandAlertDialog>\n      <CommandAlertDialogTrigger className=\"text-destructive\" label=\"Verwijderen\">\n        <Icons.trash className=\"text-destructive w-4\" />\n        <CommandLabel />\n      </CommandAlertDialogTrigger>\n\n      <CommandAlertDialogContent>\n        <CommandAlertDialogHeader>\n          <CommandAlertDialogTitle>\n            Weet je zeker dat je dit wilt verwijderen?\n          </CommandAlertDialogTitle>\n\n          <CommandAlertDialogDescription>\n            Dit kan niet ongedaan gemaakt worden en alle gegevens zullen verloren gaan.\n          </CommandAlertDialogDescription>\n        </CommandAlertDialogHeader>\n\n        <CommandAlertDialogFooter>\n          <CommandAlertDialogCancel>Annuleren</CommandAlertDialogCancel>\n          <CommandAlertDialogAction mutation={mutation} variables={variables}>\n            Verwijderen\n          </CommandAlertDialogAction>\n        </CommandAlertDialogFooter>\n      </CommandAlertDialogContent>\n    </CommandAlertDialog>\n  );\n}\n\n/**\n * Single Delete command\n */\nexport function SingleDeleteCommand<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = { id: string },\n  TOnMutateResult = unknown,\n>({ variables, mutation }: DeleteCommandProps<TData, TError, TVariables, TOnMutateResult>) {\n  return <DeleteCommand variables={variables} mutation={mutation} />;\n}\n"],"mappings":";;;;;;;;;;;;AA8BA,SAAgB,cAKd,EAAE,WAAW,YAA4E;AACzF,QACE,qBAAC,iCACC,qBAAC;EAA0B,WAAU;EAAmB,OAAM;aAC5D,oBAAC,MAAM,SAAM,WAAU,yBAAyB,EAChD,oBAAC,iBAAe;GACU,EAE5B,qBAAC,wCACC,qBAAC,uCACC,oBAAC,qCAAwB,+CAEC,EAE1B,oBAAC,2CAA8B,gFAEC,IACP,EAE3B,qBAAC,uCACC,oBAAC,sCAAyB,cAAoC,EAC9D,oBAAC;EAAmC;EAAqB;YAAW;GAEzC,IACF,IACD,IACT;;;;;AAOzB,SAAgB,oBAKd,EAAE,WAAW,YAA4E;AACzF,QAAO,oBAAC;EAAyB;EAAqB;GAAY"}
+{"version":3,"file":"delete-command.client.mjs","names":[],"sources":["../../../../src/modules/commands/utils/delete-command.client.tsx"],"sourcesContent":["\"use client\";\n\nimport type { DefaultError, MutationOptions } from \"@tanstack/react-query\";\nimport { Icons } from \"@/components/common/icons\";\nimport {\n  CommandAlertDialog,\n  CommandAlertDialogAction,\n  CommandAlertDialogCancel,\n  CommandAlertDialogContent,\n  CommandAlertDialogDescription,\n  CommandAlertDialogFooter,\n  CommandAlertDialogHeader,\n  CommandAlertDialogTitle,\n  CommandAlertDialogTrigger,\n} from \"../components/alert-dialog-command.client\";\nimport { CommandLabel } from \"../components/command-trigger.client\";\n\nexport type DeleteCommandProps<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = unknown,\n  TOnMutateResult = unknown,\n> = {\n  variables: TVariables;\n  mutation: MutationOptions<TData, TError, TVariables, TOnMutateResult>;\n};\n/**\n * Delete command\n * @description command to delete a resource\n */\nexport function DeleteCommand<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = unknown,\n  TOnMutateResult = unknown,\n>({ variables, mutation }: DeleteCommandProps<TData, TError, TVariables, TOnMutateResult>) {\n  return (\n    <CommandAlertDialog>\n      <CommandAlertDialogTrigger className=\"text-destructive\" label=\"Verwijderen\">\n        <Icons.trash className=\"w-4 text-destructive\" />\n        <CommandLabel />\n      </CommandAlertDialogTrigger>\n\n      <CommandAlertDialogContent>\n        <CommandAlertDialogHeader>\n          <CommandAlertDialogTitle>\n            Weet je zeker dat je dit wilt verwijderen?\n          </CommandAlertDialogTitle>\n\n          <CommandAlertDialogDescription>\n            Dit kan niet ongedaan gemaakt worden en alle gegevens zullen verloren gaan.\n          </CommandAlertDialogDescription>\n        </CommandAlertDialogHeader>\n\n        <CommandAlertDialogFooter>\n          <CommandAlertDialogCancel>Annuleren</CommandAlertDialogCancel>\n          <CommandAlertDialogAction mutation={mutation} variables={variables}>\n            Verwijderen\n          </CommandAlertDialogAction>\n        </CommandAlertDialogFooter>\n      </CommandAlertDialogContent>\n    </CommandAlertDialog>\n  );\n}\n\n/**\n * Single Delete command\n */\nexport function SingleDeleteCommand<\n  TData = unknown,\n  TError = DefaultError,\n  TVariables = { id: string },\n  TOnMutateResult = unknown,\n>({ variables, mutation }: DeleteCommandProps<TData, TError, TVariables, TOnMutateResult>) {\n  return <DeleteCommand variables={variables} mutation={mutation} />;\n}\n"],"mappings":";;;;;;;;;;;;AA8BA,SAAgB,cAKd,EAAE,WAAW,YAA4E;AACzF,QACE,qBAAC,iCACC,qBAAC;EAA0B,WAAU;EAAmB,OAAM;aAC5D,oBAAC,MAAM,SAAM,WAAU,yBAAyB,EAChD,oBAAC,iBAAe;GACU,EAE5B,qBAAC,wCACC,qBAAC,uCACC,oBAAC,qCAAwB,+CAEC,EAE1B,oBAAC,2CAA8B,gFAEC,IACP,EAE3B,qBAAC,uCACC,oBAAC,sCAAyB,cAAoC,EAC9D,oBAAC;EAAmC;EAAqB;YAAW;GAEzC,IACF,IACD,IACT;;;;;AAOzB,SAAgB,oBAKd,EAAE,WAAW,YAA4E;AACzF,QAAO,oBAAC;EAAyB;EAAqB;GAAY"}

package/dist/modules/data-tables/components/cell/select.client.mjs

@@ -1,4 +1,4 @@
-import { Checkbox } from "../../../../components/ui/checkbox.mjs";
+import { Checkbox } from "../../../../components/ui/checkbox.client.mjs";
 import { TableCell } from "../table.mjs";
 import { createTableCell } from "../../lib/helpers/create-column.mjs";
 import { jsx } from "react/jsx-runtime";

package/dist/modules/data-tables/components/cell/select.client.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"select.client.mjs","names":[],"sources":["../../../../../src/modules/data-tables/components/cell/select.client.tsx"],"sourcesContent":["import { Checkbox } from \"@/components/ui/checkbox\";\nimport { TableCell } from \"@/modules/data-tables/components/table\";\nimport { createTableCell } from \"../../lib/helpers/create-column\";\n\n/**\n * Create a new column with the select checkbox\n */\nexport const createTableSelectCell = createTableCell({\n  id: \"select\",\n  header: ({ table }) => (\n    <div className=\"flex w-full items-center justify-center\">\n      <Checkbox\n        checked={table.getIsAllPageRowsSelected()}\n        onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}\n        aria-label=\"Select all\"\n      />\n    </div>\n  ),\n  cell: ({ row }) => (\n    <TableCell className=\"w-8\">\n      <div className=\"flex w-full items-center justify-center\">\n        <Checkbox\n          checked={row.getIsSelected()}\n          onCheckedChange={(value) => row.toggleSelected(!!value)}\n          aria-label=\"Select row\"\n        />\n      </div>\n    </TableCell>\n  ),\n  enableHiding: false,\n  enableSorting: false,\n});\n"],"mappings":";;;;;;;;;AAOA,MAAa,wBAAwB,gBAAgB;CACnD,IAAI;CACJ,SAAS,EAAE,YACT,oBAAC;EAAI,WAAU;YACb,oBAAC;GACC,SAAS,MAAM,0BAA0B;GACzC,kBAAkB,UAAU,MAAM,0BAA0B,CAAC,CAAC,MAAM;GACpE,cAAW;IACX;GACE;CAER,OAAO,EAAE,UACP,oBAAC;EAAU,WAAU;YACnB,oBAAC;GAAI,WAAU;aACb,oBAAC;IACC,SAAS,IAAI,eAAe;IAC5B,kBAAkB,UAAU,IAAI,eAAe,CAAC,CAAC,MAAM;IACvD,cAAW;KACX;IACE;GACI;CAEd,cAAc;CACd,eAAe;CAChB,CAAC"}
+{"version":3,"file":"select.client.mjs","names":[],"sources":["../../../../../src/modules/data-tables/components/cell/select.client.tsx"],"sourcesContent":["import { Checkbox } from \"@/components/ui/checkbox.client\";\nimport { TableCell } from \"@/modules/data-tables/components/table\";\nimport { createTableCell } from \"../../lib/helpers/create-column\";\n\n/**\n * Create a new column with the select checkbox\n */\nexport const createTableSelectCell = createTableCell({\n  id: \"select\",\n  header: ({ table }) => (\n    <div className=\"flex w-full items-center justify-center\">\n      <Checkbox\n        checked={table.getIsAllPageRowsSelected()}\n        onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}\n        aria-label=\"Select all\"\n      />\n    </div>\n  ),\n  cell: ({ row }) => (\n    <TableCell className=\"w-8\">\n      <div className=\"flex w-full items-center justify-center\">\n        <Checkbox\n          checked={row.getIsSelected()}\n          onCheckedChange={(value) => row.toggleSelected(!!value)}\n          aria-label=\"Select row\"\n        />\n      </div>\n    </TableCell>\n  ),\n  enableHiding: false,\n  enableSorting: false,\n});\n"],"mappings":";;;;;;;;;AAOA,MAAa,wBAAwB,gBAAgB;CACnD,IAAI;CACJ,SAAS,EAAE,YACT,oBAAC;EAAI,WAAU;YACb,oBAAC;GACC,SAAS,MAAM,0BAA0B;GACzC,kBAAkB,UAAU,MAAM,0BAA0B,CAAC,CAAC,MAAM;GACpE,cAAW;IACX;GACE;CAER,OAAO,EAAE,UACP,oBAAC;EAAU,WAAU;YACnB,oBAAC;GAAI,WAAU;aACb,oBAAC;IACC,SAAS,IAAI,eAAe;IAC5B,kBAAkB,UAAU,IAAI,eAAe,CAAC,CAAC,MAAM;IACvD,cAAW;KACX;IACE;GACI;CAEd,cAAc;CACd,eAAe;CAChB,CAAC"}

package/dist/modules/data-tables/components/column-header.mjs

@@ -1,6 +1,6 @@
 import { cn } from "../../../lib/utils/cn.mjs";
 import { Button } from "../../../components/ui/button.mjs";
-import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from "../../../components/ui/dropdown-menu.mjs";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from "../../../components/ui/dropdown-menu.client.mjs";
 import { ChevronsUpDown, RotateCcwIcon, SortAsc, SortDesc } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 
@@ -18,7 +18,7 @@ function TableColumnHeader({ column, title, className }) {
 				size: "sm",
 				type: "button",
 				variant: "ghost",
-				className: "data-[state=open]:bg-accent -ml-3 h-8",
+				className: "-ml-3 h-8 data-[state=open]:bg-accent",
 				children: [/* @__PURE__ */ jsx("span", { children: title }), column.getIsSorted() === "desc" ? /* @__PURE__ */ jsx(SortDesc, { className: "ml-2 h-4 w-4" }) : column.getIsSorted() === "asc" ? /* @__PURE__ */ jsx(SortAsc, { className: "ml-2 h-4 w-4" }) : /* @__PURE__ */ jsx(ChevronsUpDown, { className: "ml-2 h-4 w-4" })]
 			})
 		}), /* @__PURE__ */ jsxs(DropdownMenuContent, {
@@ -26,16 +26,16 @@ function TableColumnHeader({ column, title, className }) {
 			children: [
 				/* @__PURE__ */ jsxs(DropdownMenuItem, {
 					onClick: () => column.toggleSorting(false),
-					children: [/* @__PURE__ */ jsx(SortAsc, { className: "text-muted-foreground/70 mr-2 h-3.5 w-3.5" }), "Asc"]
+					children: [/* @__PURE__ */ jsx(SortAsc, { className: "mr-2 h-3.5 w-3.5 text-muted-foreground/70" }), "Asc"]
 				}),
 				/* @__PURE__ */ jsxs(DropdownMenuItem, {
 					onClick: () => column.toggleSorting(true),
-					children: [/* @__PURE__ */ jsx(SortDesc, { className: "text-muted-foreground/70 mr-2 h-3.5 w-3.5" }), "Desc"]
+					children: [/* @__PURE__ */ jsx(SortDesc, { className: "mr-2 h-3.5 w-3.5 text-muted-foreground/70" }), "Desc"]
 				}),
 				/* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
 				/* @__PURE__ */ jsxs(DropdownMenuItem, {
 					onClick: () => column.clearSorting(),
-					children: [/* @__PURE__ */ jsx(RotateCcwIcon, { className: "text-muted-foreground/70 mr-2 h-3.5 w-3.5" }), "Clear"]
+					children: [/* @__PURE__ */ jsx(RotateCcwIcon, { className: "mr-2 h-3.5 w-3.5 text-muted-foreground/70" }), "Clear"]
 				})
 			]
 		})] })

package/dist/modules/data-tables/components/column-header.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"column-header.mjs","names":[],"sources":["../../../../src/modules/data-tables/components/column-header.tsx"],"sourcesContent":["import type { Column } from \"@tanstack/react-table\";\nimport { ChevronsUpDown, RotateCcwIcon, SortAsc, SortDesc } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport { cn } from \"@/lib/utils/cn\";\n\ninterface TableColumnHeaderProps<TData, TValue> extends React.HTMLAttributes<HTMLDivElement> {\n  column: Column<TData, TValue>;\n  title: string;\n}\n\nexport function TableColumnHeader<TData, TValue>({\n  column,\n  title,\n  className,\n}: TableColumnHeaderProps<TData, TValue>) {\n  if (!column.getCanSort()) {\n    return <div className={cn(className)}>{title}</div>;\n  }\n\n  return (\n    <div className={cn(\"flex items-center space-x-2\", className)}>\n      <DropdownMenu>\n        <DropdownMenuTrigger asChild>\n          <Button\n            size=\"sm\"\n            type=\"button\"\n            variant=\"ghost\"\n            className=\"data-[state=open]:bg-accent -ml-3 h-8\"\n          >\n            <span>{title}</span>\n            {column.getIsSorted() === \"desc\" ? (\n              <SortDesc className=\"ml-2 h-4 w-4\" />\n            ) : column.getIsSorted() === \"asc\" ? (\n              <SortAsc className=\"ml-2 h-4 w-4\" />\n            ) : (\n              <ChevronsUpDown className=\"ml-2 h-4 w-4\" />\n            )}\n          </Button>\n        </DropdownMenuTrigger>\n        <DropdownMenuContent align=\"start\">\n          <DropdownMenuItem onClick={() => column.toggleSorting(false)}>\n            <SortAsc className=\"text-muted-foreground/70 mr-2 h-3.5 w-3.5\" />\n            Asc\n          </DropdownMenuItem>\n          <DropdownMenuItem onClick={() => column.toggleSorting(true)}>\n            <SortDesc className=\"text-muted-foreground/70 mr-2 h-3.5 w-3.5\" />\n            Desc\n          </DropdownMenuItem>\n          <DropdownMenuSeparator />\n          <DropdownMenuItem onClick={() => column.clearSorting()}>\n            <RotateCcwIcon className=\"text-muted-foreground/70 mr-2 h-3.5 w-3.5\" />\n            Clear\n          </DropdownMenuItem>\n        </DropdownMenuContent>\n      </DropdownMenu>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAiBA,SAAgB,kBAAiC,EAC/C,QACA,OACA,aACwC;AACxC,KAAI,CAAC,OAAO,YAAY,CACtB,QAAO,oBAAC;EAAI,WAAW,GAAG,UAAU;YAAG;GAAY;AAGrD,QACE,oBAAC;EAAI,WAAW,GAAG,+BAA+B,UAAU;YAC1D,qBAAC,2BACC,oBAAC;GAAoB;aACnB,qBAAC;IACC,MAAK;IACL,MAAK;IACL,SAAQ;IACR,WAAU;eAEV,oBAAC,oBAAM,QAAa,EACnB,OAAO,aAAa,KAAK,SACxB,oBAAC,YAAS,WAAU,iBAAiB,GACnC,OAAO,aAAa,KAAK,QAC3B,oBAAC,WAAQ,WAAU,iBAAiB,GAEpC,oBAAC,kBAAe,WAAU,iBAAiB;KAEtC;IACW,EACtB,qBAAC;GAAoB,OAAM;;IACzB,qBAAC;KAAiB,eAAe,OAAO,cAAc,MAAM;gBAC1D,oBAAC,WAAQ,WAAU,8CAA8C;MAEhD;IACnB,qBAAC;KAAiB,eAAe,OAAO,cAAc,KAAK;gBACzD,oBAAC,YAAS,WAAU,8CAA8C;MAEjD;IACnB,oBAAC,0BAAwB;IACzB,qBAAC;KAAiB,eAAe,OAAO,cAAc;gBACpD,oBAAC,iBAAc,WAAU,8CAA8C;MAEtD;;IACC,IACT;GACX"}
+{"version":3,"file":"column-header.mjs","names":[],"sources":["../../../../src/modules/data-tables/components/column-header.tsx"],"sourcesContent":["import type { Column } from \"@tanstack/react-table\";\nimport { ChevronsUpDown, RotateCcwIcon, SortAsc, SortDesc } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu.client\";\nimport { cn } from \"@/lib/utils/cn\";\n\ninterface TableColumnHeaderProps<TData, TValue> extends React.HTMLAttributes<HTMLDivElement> {\n  column: Column<TData, TValue>;\n  title: string;\n}\n\nexport function TableColumnHeader<TData, TValue>({\n  column,\n  title,\n  className,\n}: TableColumnHeaderProps<TData, TValue>) {\n  if (!column.getCanSort()) {\n    return <div className={cn(className)}>{title}</div>;\n  }\n\n  return (\n    <div className={cn(\"flex items-center space-x-2\", className)}>\n      <DropdownMenu>\n        <DropdownMenuTrigger asChild>\n          <Button\n            size=\"sm\"\n            type=\"button\"\n            variant=\"ghost\"\n            className=\"-ml-3 h-8 data-[state=open]:bg-accent\"\n          >\n            <span>{title}</span>\n            {column.getIsSorted() === \"desc\" ? (\n              <SortDesc className=\"ml-2 h-4 w-4\" />\n            ) : column.getIsSorted() === \"asc\" ? (\n              <SortAsc className=\"ml-2 h-4 w-4\" />\n            ) : (\n              <ChevronsUpDown className=\"ml-2 h-4 w-4\" />\n            )}\n          </Button>\n        </DropdownMenuTrigger>\n        <DropdownMenuContent align=\"start\">\n          <DropdownMenuItem onClick={() => column.toggleSorting(false)}>\n            <SortAsc className=\"mr-2 h-3.5 w-3.5 text-muted-foreground/70\" />\n            Asc\n          </DropdownMenuItem>\n          <DropdownMenuItem onClick={() => column.toggleSorting(true)}>\n            <SortDesc className=\"mr-2 h-3.5 w-3.5 text-muted-foreground/70\" />\n            Desc\n          </DropdownMenuItem>\n          <DropdownMenuSeparator />\n          <DropdownMenuItem onClick={() => column.clearSorting()}>\n            <RotateCcwIcon className=\"mr-2 h-3.5 w-3.5 text-muted-foreground/70\" />\n            Clear\n          </DropdownMenuItem>\n        </DropdownMenuContent>\n      </DropdownMenu>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAiBA,SAAgB,kBAAiC,EAC/C,QACA,OACA,aACwC;AACxC,KAAI,CAAC,OAAO,YAAY,CACtB,QAAO,oBAAC;EAAI,WAAW,GAAG,UAAU;YAAG;GAAY;AAGrD,QACE,oBAAC;EAAI,WAAW,GAAG,+BAA+B,UAAU;YAC1D,qBAAC,2BACC,oBAAC;GAAoB;aACnB,qBAAC;IACC,MAAK;IACL,MAAK;IACL,SAAQ;IACR,WAAU;eAEV,oBAAC,oBAAM,QAAa,EACnB,OAAO,aAAa,KAAK,SACxB,oBAAC,YAAS,WAAU,iBAAiB,GACnC,OAAO,aAAa,KAAK,QAC3B,oBAAC,WAAQ,WAAU,iBAAiB,GAEpC,oBAAC,kBAAe,WAAU,iBAAiB;KAEtC;IACW,EACtB,qBAAC;GAAoB,OAAM;;IACzB,qBAAC;KAAiB,eAAe,OAAO,cAAc,MAAM;gBAC1D,oBAAC,WAAQ,WAAU,8CAA8C;MAEhD;IACnB,qBAAC;KAAiB,eAAe,OAAO,cAAc,KAAK;gBACzD,oBAAC,YAAS,WAAU,8CAA8C;MAEjD;IACnB,oBAAC,0BAAwB;IACzB,qBAAC;KAAiB,eAAe,OAAO,cAAc;gBACpD,oBAAC,iBAAc,WAAU,8CAA8C;MAEtD;;IACC,IACT;GACX"}

package/dist/modules/data-tables/components/filters/combobox.client.mjs

@@ -3,9 +3,9 @@
 import { cn } from "../../../../lib/utils/cn.mjs";
 import { Badge } from "../../../../components/ui/badge.mjs";
 import { Button } from "../../../../components/ui/button.mjs";
-import { Popover, PopoverContent, PopoverTrigger } from "../../../../components/ui/popover.mjs";
+import { Popover, PopoverContent, PopoverTrigger } from "../../../../components/ui/popover.client.mjs";
 import { Separator } from "../../../../components/ui/separator.mjs";
-import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator } from "../../../../components/ui/command.mjs";
+import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator } from "../../../../components/ui/command.client.mjs";
 import { Check, PlusCircle } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { startTransition, useOptimistic } from "react";
@@ -23,7 +23,7 @@ function TableFilterCombobox({ title, filter, options }) {
 			size: "sm",
 			className: "h-8 border-dashed",
 			children: [
-				/* @__PURE__ */ jsx(PlusCircle, { className: "mr-2 h-4 w-4" }),
+				/* @__PURE__ */ jsx(PlusCircle, { className: "h-4 w-4" }),
 				title,
 				selectedValues?.size > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
 					/* @__PURE__ */ jsx(Separator, {
@@ -69,8 +69,8 @@ function TableFilterCombobox({ title, filter, options }) {
 					children: [
 						/* @__PURE__ */ jsx("div", {
 							"data-active": selectedValues.has(option.value),
-							className: cn("border-primary data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:[&>svg]:text-primary-foreground mr-2 flex h-4 w-4 items-center justify-center rounded-sm border opacity-50 data-[active=true]:opacity-100 [&>svg]:invisible data-[active=true]:[&>svg]:visible"),
-							children: /* @__PURE__ */ jsx(Check, { className: "text-foreground h-4 w-4" })
+							className: cn("mr-2 flex h-4 w-4 items-center justify-center rounded-sm border border-primary opacity-50 data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:opacity-100 [&>svg]:invisible data-[active=true]:[&>svg]:visible data-[active=true]:[&>svg]:text-primary-foreground"),
+							children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 text-foreground" })
 						}),
 						/* @__PURE__ */ jsxs("div", {
 							className: "flex flex-1 items-center gap-2",
@@ -80,7 +80,7 @@ function TableFilterCombobox({ title, filter, options }) {
 							})]
 						}),
 						option.total !== void 0 && /* @__PURE__ */ jsx("span", {
-							className: "text-muted-foreground/50 size-4 justify-self-end font-mono text-xs",
+							className: "size-4 justify-self-end font-mono text-muted-foreground/50 text-xs",
 							children: option.total
 						})
 					]

package/dist/modules/data-tables/components/filters/combobox.client.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.client.mjs","names":[],"sources":["../../../../../src/modules/data-tables/components/filters/combobox.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { Check, type LucideIcon, PlusCircle } from \"lucide-react\";\nimport { type ParserBuilder, useQueryState } from \"nuqs\";\nimport { startTransition, useOptimistic } from \"react\";\nimport { Badge } from \"@/components/ui/badge\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  CommandSeparator,\n} from \"@/components/ui/command\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"@/components/ui/popover\";\nimport { Separator } from \"@/components/ui/separator\";\nimport { cn } from \"@/lib/utils/cn\";\n\nexport type TableFilterComboboxOption = {\n  label: string;\n  value: string;\n  className?: string;\n  icon?: LucideIcon;\n  total?: number;\n};\n\nexport type TableFilterComboboxProps<TValue extends string = string> = {\n  title?: string;\n  filter: { name: string; parser: ParserBuilder<TValue[] | null> };\n  options: TableFilterComboboxOption[];\n};\n\nexport function TableFilterCombobox<TValue extends string>({\n  title,\n  filter,\n  options,\n}: TableFilterComboboxProps<TValue>) {\n  const [query, setQuery] = useQueryState(filter.name, filter.parser);\n\n  const [selectedValues, setSelectedValues] = useOptimistic(\n    new Set<string>(Array.isArray(query) ? query : []),\n  );\n\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <Button type=\"button\" variant=\"outline\" size=\"sm\" className=\"h-8 border-dashed\">\n          <PlusCircle className=\"mr-2 h-4 w-4\" />\n          {title}\n          {selectedValues?.size > 0 && (\n            <>\n              <Separator orientation=\"vertical\" className=\"mx-2 h-4\" />\n              <Badge variant=\"secondary\" className=\"rounded-sm px-1 font-normal lg:hidden\">\n                {selectedValues.size}\n              </Badge>\n              <div className=\"hidden space-x-1 lg:flex\">\n                {selectedValues.size > 2 ? (\n                  <Badge variant=\"secondary\" className=\"rounded-sm px-1 font-normal\">\n                    {selectedValues.size} selected\n                  </Badge>\n                ) : (\n                  options\n                    .filter((option) => selectedValues.has(option.value))\n                    .map((option) => (\n                      <Badge\n                        variant=\"secondary\"\n                        key={option.value}\n                        className=\"rounded-sm px-1 font-normal\"\n                      >\n                        {option.label}\n                      </Badge>\n                    ))\n                )}\n              </div>\n            </>\n          )}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-[20rem] p-0\" align=\"start\">\n        <Command>\n          <CommandInput placeholder={title} />\n          <CommandList>\n            <CommandEmpty>No results found.</CommandEmpty>\n            <CommandGroup>\n              {options.map((option) => {\n                const Icon = option.icon;\n\n                return (\n                  <CommandItem\n                    key={option.value}\n                    onSelect={() =>\n                      startTransition(() => {\n                        const newSelectedValues = new Set(selectedValues);\n\n                        const isSelected = newSelectedValues.has(option.value);\n\n                        if (isSelected) newSelectedValues.delete(option.value);\n                        else newSelectedValues.add(option.value);\n                        setSelectedValues(newSelectedValues);\n\n                        const filterValues = Array.from(newSelectedValues) as TValue[];\n                        setQuery(filterValues.length ? filterValues : null);\n                      })\n                    }\n                  >\n                    <div\n                      data-active={selectedValues.has(option.value)}\n                      className={cn(\n                        \"border-primary data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:[&>svg]:text-primary-foreground mr-2 flex h-4 w-4 items-center justify-center rounded-sm border opacity-50 data-[active=true]:opacity-100 [&>svg]:invisible data-[active=true]:[&>svg]:visible\",\n                      )}\n                    >\n                      <Check className=\"text-foreground h-4 w-4\" />\n                    </div>\n\n                    <div className=\"flex flex-1 items-center gap-2\">\n                      {Icon && <Icon className={cn(\"size-4\", option.className)} />}\n                      <span className={cn(option.className)}>{option.label}</span>\n                    </div>\n\n                    {option.total !== undefined && (\n                      <span className=\"text-muted-foreground/50 size-4 justify-self-end font-mono text-xs\">\n                        {option.total}\n                      </span>\n                    )}\n                  </CommandItem>\n                );\n              })}\n            </CommandGroup>\n\n            {selectedValues.size > 0 && (\n              <>\n                <CommandSeparator />\n                <CommandGroup>\n                  <CommandItem\n                    onSelect={() => setQuery(null)}\n                    className=\"justify-center text-center\"\n                  >\n                    Clear filters\n                  </CommandItem>\n                </CommandGroup>\n              </>\n            )}\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;AAkCA,SAAgB,oBAA2C,EACzD,OACA,QACA,WACmC;CACnC,MAAM,CAAC,OAAO,YAAY,cAAc,OAAO,MAAM,OAAO,OAAO;CAEnE,MAAM,CAAC,gBAAgB,qBAAqB,cAC1C,IAAI,IAAY,MAAM,QAAQ,MAAM,GAAG,QAAQ,EAAE,CAAC,CACnD;AAED,QACE,qBAAC,sBACC,oBAAC;EAAe;YACd,qBAAC;GAAO,MAAK;GAAS,SAAQ;GAAU,MAAK;GAAK,WAAU;;IAC1D,oBAAC,cAAW,WAAU,iBAAiB;IACtC;IACA,gBAAgB,OAAO,KACtB;KACE,oBAAC;MAAU,aAAY;MAAW,WAAU;OAAa;KACzD,oBAAC;MAAM,SAAQ;MAAY,WAAU;gBAClC,eAAe;OACV;KACR,oBAAC;MAAI,WAAU;gBACZ,eAAe,OAAO,IACrB,qBAAC;OAAM,SAAQ;OAAY,WAAU;kBAClC,eAAe,MAAK;QACf,GAER,QACG,QAAQ,WAAW,eAAe,IAAI,OAAO,MAAM,CAAC,CACpD,KAAK,WACJ,oBAAC;OACC,SAAQ;OAER,WAAU;iBAET,OAAO;SAHH,OAAO,MAIN,CACR;OAEF;QACL;;IAEE;GACM,EACjB,oBAAC;EAAe,WAAU;EAAgB,OAAM;YAC9C,qBAAC,sBACC,oBAAC,gBAAa,aAAa,QAAS,EACpC,qBAAC;GACC,oBAAC,0BAAa,sBAAgC;GAC9C,oBAAC,0BACE,QAAQ,KAAK,WAAW;IACvB,MAAM,OAAO,OAAO;AAEpB,WACE,qBAAC;KAEC,gBACE,sBAAsB;MACpB,MAAM,oBAAoB,IAAI,IAAI,eAAe;AAIjD,UAFmB,kBAAkB,IAAI,OAAO,MAAM,CAEtC,mBAAkB,OAAO,OAAO,MAAM;UACjD,mBAAkB,IAAI,OAAO,MAAM;AACxC,wBAAkB,kBAAkB;MAEpC,MAAM,eAAe,MAAM,KAAK,kBAAkB;AAClD,eAAS,aAAa,SAAS,eAAe,KAAK;OACnD;;MAGJ,oBAAC;OACC,eAAa,eAAe,IAAI,OAAO,MAAM;OAC7C,WAAW,GACT,4SACD;iBAED,oBAAC,SAAM,WAAU,4BAA4B;QACzC;MAEN,qBAAC;OAAI,WAAU;kBACZ,QAAQ,oBAAC,QAAK,WAAW,GAAG,UAAU,OAAO,UAAU,GAAI,EAC5D,oBAAC;QAAK,WAAW,GAAG,OAAO,UAAU;kBAAG,OAAO;SAAa;QACxD;MAEL,OAAO,UAAU,UAChB,oBAAC;OAAK,WAAU;iBACb,OAAO;QACH;;OAjCJ,OAAO,MAmCA;KAEhB,GACW;GAEd,eAAe,OAAO,KACrB,4CACE,oBAAC,qBAAmB,EACpB,oBAAC,0BACC,oBAAC;IACC,gBAAgB,SAAS,KAAK;IAC9B,WAAU;cACX;KAEa,GACD,IACd;MAEO,IACN;GACK,IACT"}
+{"version":3,"file":"combobox.client.mjs","names":[],"sources":["../../../../../src/modules/data-tables/components/filters/combobox.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { Check, type LucideIcon, PlusCircle } from \"lucide-react\";\nimport { type ParserBuilder, useQueryState } from \"nuqs\";\nimport { startTransition, useOptimistic } from \"react\";\nimport { Badge } from \"@/components/ui/badge\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  CommandSeparator,\n} from \"@/components/ui/command.client\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"@/components/ui/popover.client\";\nimport { Separator } from \"@/components/ui/separator\";\nimport { cn } from \"@/lib/utils/cn\";\n\nexport type TableFilterComboboxOption = {\n  label: string;\n  value: string;\n  className?: string;\n  icon?: LucideIcon;\n  total?: number;\n};\n\nexport type TableFilterComboboxProps<TValue extends string = string> = {\n  title?: string;\n  filter: { name: string; parser: ParserBuilder<TValue[] | null> };\n  options: TableFilterComboboxOption[];\n};\n\nexport function TableFilterCombobox<TValue extends string>({\n  title,\n  filter,\n  options,\n}: TableFilterComboboxProps<TValue>) {\n  const [query, setQuery] = useQueryState(filter.name, filter.parser);\n\n  const [selectedValues, setSelectedValues] = useOptimistic(\n    new Set<string>(Array.isArray(query) ? query : []),\n  );\n\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <Button type=\"button\" variant=\"outline\" size=\"sm\" className=\"h-8 border-dashed\">\n          <PlusCircle className=\"h-4 w-4\" />\n          {title}\n          {selectedValues?.size > 0 && (\n            <>\n              <Separator orientation=\"vertical\" className=\"mx-2 h-4\" />\n              <Badge variant=\"secondary\" className=\"rounded-sm px-1 font-normal lg:hidden\">\n                {selectedValues.size}\n              </Badge>\n              <div className=\"hidden space-x-1 lg:flex\">\n                {selectedValues.size > 2 ? (\n                  <Badge variant=\"secondary\" className=\"rounded-sm px-1 font-normal\">\n                    {selectedValues.size} selected\n                  </Badge>\n                ) : (\n                  options\n                    .filter((option) => selectedValues.has(option.value))\n                    .map((option) => (\n                      <Badge\n                        variant=\"secondary\"\n                        key={option.value}\n                        className=\"rounded-sm px-1 font-normal\"\n                      >\n                        {option.label}\n                      </Badge>\n                    ))\n                )}\n              </div>\n            </>\n          )}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-[20rem] p-0\" align=\"start\">\n        <Command>\n          <CommandInput placeholder={title} />\n          <CommandList>\n            <CommandEmpty>No results found.</CommandEmpty>\n            <CommandGroup>\n              {options.map((option) => {\n                const Icon = option.icon;\n\n                return (\n                  <CommandItem\n                    key={option.value}\n                    onSelect={() =>\n                      startTransition(() => {\n                        const newSelectedValues = new Set(selectedValues);\n\n                        const isSelected = newSelectedValues.has(option.value);\n\n                        if (isSelected) newSelectedValues.delete(option.value);\n                        else newSelectedValues.add(option.value);\n                        setSelectedValues(newSelectedValues);\n\n                        const filterValues = Array.from(newSelectedValues) as TValue[];\n                        setQuery(filterValues.length ? filterValues : null);\n                      })\n                    }\n                  >\n                    <div\n                      data-active={selectedValues.has(option.value)}\n                      className={cn(\n                        \"mr-2 flex h-4 w-4 items-center justify-center rounded-sm border border-primary opacity-50 data-[active=true]:bg-primary data-[active=true]:text-primary-foreground data-[active=true]:opacity-100 [&>svg]:invisible data-[active=true]:[&>svg]:visible data-[active=true]:[&>svg]:text-primary-foreground\",\n                      )}\n                    >\n                      <Check className=\"h-4 w-4 text-foreground\" />\n                    </div>\n\n                    <div className=\"flex flex-1 items-center gap-2\">\n                      {Icon && <Icon className={cn(\"size-4\", option.className)} />}\n                      <span className={cn(option.className)}>{option.label}</span>\n                    </div>\n\n                    {option.total !== undefined && (\n                      <span className=\"size-4 justify-self-end font-mono text-muted-foreground/50 text-xs\">\n                        {option.total}\n                      </span>\n                    )}\n                  </CommandItem>\n                );\n              })}\n            </CommandGroup>\n\n            {selectedValues.size > 0 && (\n              <>\n                <CommandSeparator />\n                <CommandGroup>\n                  <CommandItem\n                    onSelect={() => setQuery(null)}\n                    className=\"justify-center text-center\"\n                  >\n                    Clear filters\n                  </CommandItem>\n                </CommandGroup>\n              </>\n            )}\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;AAkCA,SAAgB,oBAA2C,EACzD,OACA,QACA,WACmC;CACnC,MAAM,CAAC,OAAO,YAAY,cAAc,OAAO,MAAM,OAAO,OAAO;CAEnE,MAAM,CAAC,gBAAgB,qBAAqB,cAC1C,IAAI,IAAY,MAAM,QAAQ,MAAM,GAAG,QAAQ,EAAE,CAAC,CACnD;AAED,QACE,qBAAC,sBACC,oBAAC;EAAe;YACd,qBAAC;GAAO,MAAK;GAAS,SAAQ;GAAU,MAAK;GAAK,WAAU;;IAC1D,oBAAC,cAAW,WAAU,YAAY;IACjC;IACA,gBAAgB,OAAO,KACtB;KACE,oBAAC;MAAU,aAAY;MAAW,WAAU;OAAa;KACzD,oBAAC;MAAM,SAAQ;MAAY,WAAU;gBAClC,eAAe;OACV;KACR,oBAAC;MAAI,WAAU;gBACZ,eAAe,OAAO,IACrB,qBAAC;OAAM,SAAQ;OAAY,WAAU;kBAClC,eAAe,MAAK;QACf,GAER,QACG,QAAQ,WAAW,eAAe,IAAI,OAAO,MAAM,CAAC,CACpD,KAAK,WACJ,oBAAC;OACC,SAAQ;OAER,WAAU;iBAET,OAAO;SAHH,OAAO,MAIN,CACR;OAEF;QACL;;IAEE;GACM,EACjB,oBAAC;EAAe,WAAU;EAAgB,OAAM;YAC9C,qBAAC,sBACC,oBAAC,gBAAa,aAAa,QAAS,EACpC,qBAAC;GACC,oBAAC,0BAAa,sBAAgC;GAC9C,oBAAC,0BACE,QAAQ,KAAK,WAAW;IACvB,MAAM,OAAO,OAAO;AAEpB,WACE,qBAAC;KAEC,gBACE,sBAAsB;MACpB,MAAM,oBAAoB,IAAI,IAAI,eAAe;AAIjD,UAFmB,kBAAkB,IAAI,OAAO,MAAM,CAEtC,mBAAkB,OAAO,OAAO,MAAM;UACjD,mBAAkB,IAAI,OAAO,MAAM;AACxC,wBAAkB,kBAAkB;MAEpC,MAAM,eAAe,MAAM,KAAK,kBAAkB;AAClD,eAAS,aAAa,SAAS,eAAe,KAAK;OACnD;;MAGJ,oBAAC;OACC,eAAa,eAAe,IAAI,OAAO,MAAM;OAC7C,WAAW,GACT,4SACD;iBAED,oBAAC,SAAM,WAAU,4BAA4B;QACzC;MAEN,qBAAC;OAAI,WAAU;kBACZ,QAAQ,oBAAC,QAAK,WAAW,GAAG,UAAU,OAAO,UAAU,GAAI,EAC5D,oBAAC;QAAK,WAAW,GAAG,OAAO,UAAU;kBAAG,OAAO;SAAa;QACxD;MAEL,OAAO,UAAU,UAChB,oBAAC;OAAK,WAAU;iBACb,OAAO;QACH;;OAjCJ,OAAO,MAmCA;KAEhB,GACW;GAEd,eAAe,OAAO,KACrB,4CACE,oBAAC,qBAAmB,EACpB,oBAAC,0BACC,oBAAC;IACC,gBAAgB,SAAS,KAAK;IAC9B,WAAU;cACX;KAEa,GACD,IACd;MAEO,IACN;GACK,IACT"}

package/dist/modules/data-tables/components/filters/slider.client.mjs

@@ -2,7 +2,7 @@
 
 import { Badge } from "../../../../components/ui/badge.mjs";
 import { Button } from "../../../../components/ui/button.mjs";
-import { Popover, PopoverContent, PopoverTrigger } from "../../../../components/ui/popover.mjs";
+import { Popover, PopoverContent, PopoverTrigger } from "../../../../components/ui/popover.client.mjs";
 import { Input } from "../../../../components/ui/input.mjs";
 import { Separator } from "../../../../components/ui/separator.mjs";
 import { Slider } from "../../../../components/ui/slider.mjs";
@@ -101,7 +101,7 @@ function TableFilterSlider({ title, filter, options = {
 						min,
 						max
 					}), /* @__PURE__ */ jsxs("div", {
-						className: "text-muted-foreground flex justify-between text-xs",
+						className: "flex justify-between text-muted-foreground text-xs",
 						children: [/* @__PURE__ */ jsx("span", { children: min }), /* @__PURE__ */ jsx("span", { children: max })]
 					})]
 				})]

package/dist/modules/data-tables/components/filters/slider.client.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"slider.client.mjs","names":[],"sources":["../../../../../src/modules/data-tables/components/filters/slider.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { PlusCircle } from \"lucide-react\";\nimport { type ParserBuilder, useQueryState } from \"nuqs\";\nimport { startTransition, useState } from \"react\";\nimport { useDebouncedCallback } from \"use-debounce\";\nimport { Badge } from \"@/components/ui/badge\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"@/components/ui/popover\";\nimport { Separator } from \"@/components/ui/separator\";\nimport { Slider } from \"@/components/ui/slider\";\n\nexport type TableFilterSliderProps = {\n  title?: string;\n  filter: { name: string; parser: ParserBuilder<[number, number] | null> };\n  options?: { min: number; max: number };\n};\n\nexport function TableFilterSlider({\n  title,\n  filter,\n  options = { min: 0, max: 100 },\n}: TableFilterSliderProps) {\n  const [open, setOpen] = useState(false);\n  const [query, setQuery] = useQueryState(filter.name, filter.parser);\n\n  const [selectedValues, setSelectedValues] = useState(query);\n\n  const handleSliderChange = useDebouncedCallback(\n    (values: [number, number] | null) => setQuery(values, { startTransition }),\n    300,\n  );\n\n  const { min, max } = options;\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button type=\"button\" variant=\"outline\" size=\"sm\" className=\"h-8 border-dashed\">\n          <PlusCircle className=\"mr-2 h-4 w-4\" />\n          {title}\n          {selectedValues && selectedValues?.length > 0 && (\n            <>\n              <Separator orientation=\"vertical\" className=\"mx-2 h-4\" />\n              <Badge variant=\"secondary\" className=\"rounded-sm px-1 font-normal lg:hidden\">\n                {selectedValues?.length}\n              </Badge>\n\n              <div className=\"hidden space-x-1 lg:flex\">\n                <Badge variant=\"secondary\" className=\"rounded-sm px-1 font-normal\">\n                  {query?.[0]} tot {query?.[1]}\n                </Badge>\n              </div>\n            </>\n          )}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-[20rem] p-0\" align=\"start\">\n        <div className=\"space-y-8 p-4\">\n          <div className=\"flex items-center gap-2\">\n            <Input\n              type=\"number\"\n              value={selectedValues?.[0] ?? undefined}\n              placeholder=\"Min\"\n              onChange={(e) => {\n                startTransition(() => {\n                  const newValues = e.target.value\n                    ? ([Number(e.target.value), selectedValues?.[1] ?? max] as [number, number])\n                    : null;\n\n                  setSelectedValues(newValues);\n                });\n              }}\n              onBlur={() => handleSliderChange(selectedValues)}\n            />\n            <Input\n              type=\"number\"\n              value={selectedValues?.[1] ?? undefined}\n              placeholder=\"Max\"\n              max={max}\n              onChange={(e) => {\n                startTransition(() => {\n                  const newValues = e.target.value\n                    ? ([selectedValues?.[0] ?? min, Number(e.target.value)] as [number, number])\n                    : null;\n\n                  setSelectedValues(newValues);\n                });\n              }}\n              onBlur={() => handleSliderChange(selectedValues)}\n            />\n          </div>\n\n          <div className=\"space-y-3\">\n            <Slider\n              value={selectedValues ?? [min, max]}\n              onValueChange={(values: [number, number]) =>\n                startTransition(() => {\n                  setSelectedValues(values);\n                  handleSliderChange(values);\n                })\n              }\n              step={1}\n              min={min}\n              max={max}\n            />\n\n            <div className=\"text-muted-foreground flex justify-between text-xs\">\n              <span>{min}</span>\n              <span>{max}</span>\n            </div>\n          </div>\n        </div>\n\n        {selectedValues && selectedValues.length > 0 && (\n          <div className=\"w-full space-y-2 p-1.5\">\n            <Separator />\n\n            <Button\n              size=\"sm\"\n              type=\"button\"\n              variant=\"ghost\"\n              onClick={() => {\n                setOpen(false);\n                setSelectedValues(null);\n                handleSliderChange(null);\n              }}\n              className=\"w-full text-center\"\n            >\n              Clear filters\n            </Button>\n          </div>\n        )}\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;AAmBA,SAAgB,kBAAkB,EAChC,OACA,QACA,UAAU;CAAE,KAAK;CAAG,KAAK;CAAK,IACL;CACzB,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CACvC,MAAM,CAAC,OAAO,YAAY,cAAc,OAAO,MAAM,OAAO,OAAO;CAEnE,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,MAAM;CAE3D,MAAM,qBAAqB,sBACxB,WAAoC,SAAS,QAAQ,EAAE,iBAAiB,CAAC,EAC1E,IACD;CAED,MAAM,EAAE,KAAK,QAAQ;AAErB,QACE,qBAAC;EAAc;EAAM,cAAc;aACjC,oBAAC;GAAe;aACd,qBAAC;IAAO,MAAK;IAAS,SAAQ;IAAU,MAAK;IAAK,WAAU;;KAC1D,oBAAC,cAAW,WAAU,iBAAiB;KACtC;KACA,kBAAkB,gBAAgB,SAAS,KAC1C;MACE,oBAAC;OAAU,aAAY;OAAW,WAAU;QAAa;MACzD,oBAAC;OAAM,SAAQ;OAAY,WAAU;iBAClC,gBAAgB;QACX;MAER,oBAAC;OAAI,WAAU;iBACb,qBAAC;QAAM,SAAQ;QAAY,WAAU;;SAClC,QAAQ;SAAG;SAAM,QAAQ;;SACpB;QACJ;SACL;;KAEE;IACM,EACjB,qBAAC;GAAe,WAAU;GAAgB,OAAM;cAC9C,qBAAC;IAAI,WAAU;eACb,qBAAC;KAAI,WAAU;gBACb,oBAAC;MACC,MAAK;MACL,OAAO,iBAAiB,MAAM;MAC9B,aAAY;MACZ,WAAW,MAAM;AACf,6BAAsB;AAKpB,0BAJkB,EAAE,OAAO,QACtB,CAAC,OAAO,EAAE,OAAO,MAAM,EAAE,iBAAiB,MAAM,IAAI,GACrD,KAEwB;SAC5B;;MAEJ,cAAc,mBAAmB,eAAe;OAChD,EACF,oBAAC;MACC,MAAK;MACL,OAAO,iBAAiB,MAAM;MAC9B,aAAY;MACP;MACL,WAAW,MAAM;AACf,6BAAsB;AAKpB,0BAJkB,EAAE,OAAO,QACtB,CAAC,iBAAiB,MAAM,KAAK,OAAO,EAAE,OAAO,MAAM,CAAC,GACrD,KAEwB;SAC5B;;MAEJ,cAAc,mBAAmB,eAAe;OAChD;MACE,EAEN,qBAAC;KAAI,WAAU;gBACb,oBAAC;MACC,OAAO,kBAAkB,CAAC,KAAK,IAAI;MACnC,gBAAgB,WACd,sBAAsB;AACpB,yBAAkB,OAAO;AACzB,0BAAmB,OAAO;QAC1B;MAEJ,MAAM;MACD;MACA;OACL,EAEF,qBAAC;MAAI,WAAU;iBACb,oBAAC,oBAAM,MAAW,EAClB,oBAAC,oBAAM,MAAW;OACd;MACF;KACF,EAEL,kBAAkB,eAAe,SAAS,KACzC,qBAAC;IAAI,WAAU;eACb,oBAAC,cAAY,EAEb,oBAAC;KACC,MAAK;KACL,MAAK;KACL,SAAQ;KACR,eAAe;AACb,cAAQ,MAAM;AACd,wBAAkB,KAAK;AACvB,yBAAmB,KAAK;;KAE1B,WAAU;eACX;MAEQ;KACL;IAEO;GACT"}
+{"version":3,"file":"slider.client.mjs","names":[],"sources":["../../../../../src/modules/data-tables/components/filters/slider.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { PlusCircle } from \"lucide-react\";\nimport { type ParserBuilder, useQueryState } from \"nuqs\";\nimport { startTransition, useState } from \"react\";\nimport { useDebouncedCallback } from \"use-debounce\";\nimport { Badge } from \"@/components/ui/badge\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"@/components/ui/popover.client\";\nimport { Separator } from \"@/components/ui/separator\";\nimport { Slider } from \"@/components/ui/slider\";\n\nexport type TableFilterSliderProps = {\n  title?: string;\n  filter: { name: string; parser: ParserBuilder<[number, number] | null> };\n  options?: { min: number; max: number };\n};\n\nexport function TableFilterSlider({\n  title,\n  filter,\n  options = { min: 0, max: 100 },\n}: TableFilterSliderProps) {\n  const [open, setOpen] = useState(false);\n  const [query, setQuery] = useQueryState(filter.name, filter.parser);\n\n  const [selectedValues, setSelectedValues] = useState(query);\n\n  const handleSliderChange = useDebouncedCallback(\n    (values: [number, number] | null) => setQuery(values, { startTransition }),\n    300,\n  );\n\n  const { min, max } = options;\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button type=\"button\" variant=\"outline\" size=\"sm\" className=\"h-8 border-dashed\">\n          <PlusCircle className=\"mr-2 h-4 w-4\" />\n          {title}\n          {selectedValues && selectedValues?.length > 0 && (\n            <>\n              <Separator orientation=\"vertical\" className=\"mx-2 h-4\" />\n              <Badge variant=\"secondary\" className=\"rounded-sm px-1 font-normal lg:hidden\">\n                {selectedValues?.length}\n              </Badge>\n\n              <div className=\"hidden space-x-1 lg:flex\">\n                <Badge variant=\"secondary\" className=\"rounded-sm px-1 font-normal\">\n                  {query?.[0]} tot {query?.[1]}\n                </Badge>\n              </div>\n            </>\n          )}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-[20rem] p-0\" align=\"start\">\n        <div className=\"space-y-8 p-4\">\n          <div className=\"flex items-center gap-2\">\n            <Input\n              type=\"number\"\n              value={selectedValues?.[0] ?? undefined}\n              placeholder=\"Min\"\n              onChange={(e) => {\n                startTransition(() => {\n                  const newValues = e.target.value\n                    ? ([Number(e.target.value), selectedValues?.[1] ?? max] as [number, number])\n                    : null;\n\n                  setSelectedValues(newValues);\n                });\n              }}\n              onBlur={() => handleSliderChange(selectedValues)}\n            />\n            <Input\n              type=\"number\"\n              value={selectedValues?.[1] ?? undefined}\n              placeholder=\"Max\"\n              max={max}\n              onChange={(e) => {\n                startTransition(() => {\n                  const newValues = e.target.value\n                    ? ([selectedValues?.[0] ?? min, Number(e.target.value)] as [number, number])\n                    : null;\n\n                  setSelectedValues(newValues);\n                });\n              }}\n              onBlur={() => handleSliderChange(selectedValues)}\n            />\n          </div>\n\n          <div className=\"space-y-3\">\n            <Slider\n              value={selectedValues ?? [min, max]}\n              onValueChange={(values: [number, number]) =>\n                startTransition(() => {\n                  setSelectedValues(values);\n                  handleSliderChange(values);\n                })\n              }\n              step={1}\n              min={min}\n              max={max}\n            />\n\n            <div className=\"flex justify-between text-muted-foreground text-xs\">\n              <span>{min}</span>\n              <span>{max}</span>\n            </div>\n          </div>\n        </div>\n\n        {selectedValues && selectedValues.length > 0 && (\n          <div className=\"w-full space-y-2 p-1.5\">\n            <Separator />\n\n            <Button\n              size=\"sm\"\n              type=\"button\"\n              variant=\"ghost\"\n              onClick={() => {\n                setOpen(false);\n                setSelectedValues(null);\n                handleSliderChange(null);\n              }}\n              className=\"w-full text-center\"\n            >\n              Clear filters\n            </Button>\n          </div>\n        )}\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;AAmBA,SAAgB,kBAAkB,EAChC,OACA,QACA,UAAU;CAAE,KAAK;CAAG,KAAK;CAAK,IACL;CACzB,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CACvC,MAAM,CAAC,OAAO,YAAY,cAAc,OAAO,MAAM,OAAO,OAAO;CAEnE,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,MAAM;CAE3D,MAAM,qBAAqB,sBACxB,WAAoC,SAAS,QAAQ,EAAE,iBAAiB,CAAC,EAC1E,IACD;CAED,MAAM,EAAE,KAAK,QAAQ;AAErB,QACE,qBAAC;EAAc;EAAM,cAAc;aACjC,oBAAC;GAAe;aACd,qBAAC;IAAO,MAAK;IAAS,SAAQ;IAAU,MAAK;IAAK,WAAU;;KAC1D,oBAAC,cAAW,WAAU,iBAAiB;KACtC;KACA,kBAAkB,gBAAgB,SAAS,KAC1C;MACE,oBAAC;OAAU,aAAY;OAAW,WAAU;QAAa;MACzD,oBAAC;OAAM,SAAQ;OAAY,WAAU;iBAClC,gBAAgB;QACX;MAER,oBAAC;OAAI,WAAU;iBACb,qBAAC;QAAM,SAAQ;QAAY,WAAU;;SAClC,QAAQ;SAAG;SAAM,QAAQ;;SACpB;QACJ;SACL;;KAEE;IACM,EACjB,qBAAC;GAAe,WAAU;GAAgB,OAAM;cAC9C,qBAAC;IAAI,WAAU;eACb,qBAAC;KAAI,WAAU;gBACb,oBAAC;MACC,MAAK;MACL,OAAO,iBAAiB,MAAM;MAC9B,aAAY;MACZ,WAAW,MAAM;AACf,6BAAsB;AAKpB,0BAJkB,EAAE,OAAO,QACtB,CAAC,OAAO,EAAE,OAAO,MAAM,EAAE,iBAAiB,MAAM,IAAI,GACrD,KAEwB;SAC5B;;MAEJ,cAAc,mBAAmB,eAAe;OAChD,EACF,oBAAC;MACC,MAAK;MACL,OAAO,iBAAiB,MAAM;MAC9B,aAAY;MACP;MACL,WAAW,MAAM;AACf,6BAAsB;AAKpB,0BAJkB,EAAE,OAAO,QACtB,CAAC,iBAAiB,MAAM,KAAK,OAAO,EAAE,OAAO,MAAM,CAAC,GACrD,KAEwB;SAC5B;;MAEJ,cAAc,mBAAmB,eAAe;OAChD;MACE,EAEN,qBAAC;KAAI,WAAU;gBACb,oBAAC;MACC,OAAO,kBAAkB,CAAC,KAAK,IAAI;MACnC,gBAAgB,WACd,sBAAsB;AACpB,yBAAkB,OAAO;AACzB,0BAAmB,OAAO;QAC1B;MAEJ,MAAM;MACD;MACA;OACL,EAEF,qBAAC;MAAI,WAAU;iBACb,oBAAC,oBAAM,MAAW,EAClB,oBAAC,oBAAM,MAAW;OACd;MACF;KACF,EAEL,kBAAkB,eAAe,SAAS,KACzC,qBAAC;IAAI,WAAU;eACb,oBAAC,cAAY,EAEb,oBAAC;KACC,MAAK;KACL,MAAK;KACL,SAAQ;KACR,eAAe;AACb,cAAQ,MAAM;AACd,wBAAkB,KAAK;AACvB,yBAAmB,KAAK;;KAE1B,WAAU;eACX;MAEQ;KACL;IAEO;GACT"}

package/dist/modules/data-tables/components/header.mjs

@@ -25,7 +25,7 @@ const TableHeaderRow = TableRow;
 function TableHead({ className, ...props }) {
 	return /* @__PURE__ */ jsx("th", {
 		"data-slot": "table-head",
-		className: cn("text-muted-foreground bg-muted/70 h-10 whitespace-nowrap px-2 text-left align-middle font-medium", className),
+		className: cn("h-10 whitespace-nowrap bg-muted/70 px-2 text-left align-middle font-medium text-muted-foreground", className),
 		...props
 	});
 }

package/dist/modules/data-tables/components/header.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"header.mjs","names":[],"sources":["../../../../src/modules/data-tables/components/header.tsx"],"sourcesContent":["import { flexRender, type Header, type Table } from \"@tanstack/react-table\";\nimport { cn } from \"@/lib/utils/cn\";\nimport { Allowed } from \"@/modules/auth/components/allowed.client\";\nimport { TableRow } from \"@/modules/data-tables/components/table\";\nimport type { TableColumnDef } from \"../lib/types\";\n\n/**\n * TableHeaderProps\n */\nexport type TableHeaderProps<TData> = {\n  table: Table<TData>;\n};\n\n/**\n * DataTableHeader\n */\nexport function TableHeader({ className, ...props }: React.ComponentProps<\"thead\">) {\n  return <thead data-slot=\"table-header\" className={cn(\"[&_tr]:border-b\", className)} {...props} />;\n}\n\n/**\n * DataTableHeaderRow\n */\nexport const TableHeaderRow = TableRow;\n\n/**\n * TableHead\n */\nexport function TableHead({ className, ...props }: React.ComponentProps<\"th\">) {\n  return (\n    <th\n      data-slot=\"table-head\"\n      className={cn(\n        \"text-muted-foreground bg-muted/70 h-10 whitespace-nowrap px-2 text-left align-middle font-medium\", //[&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * DataTableHeaderCell\n */\ntype DataTableHeaderCellProps<TData> = {\n  header: Header<TData, unknown>;\n};\n\nexport function TableHeaderCell<TData>({ header }: DataTableHeaderCellProps<TData>) {\n  const columnDef = header.column.columnDef as TableColumnDef<TData>;\n\n  const children = (\n    <TableHead key={header.id}>\n      {header.isPlaceholder\n        ? null\n        : flexRender(header.column.columnDef.header, header.getContext())}\n    </TableHead>\n  );\n\n  if (!columnDef.permissions) return children;\n\n  return (\n    <Allowed key={header.id} permission={columnDef.permissions}>\n      {children}\n    </Allowed>\n  );\n}\n"],"mappings":";;;;;;;;;;AAgBA,SAAgB,YAAY,EAAE,WAAW,GAAG,SAAwC;AAClF,QAAO,oBAAC;EAAM,aAAU;EAAe,WAAW,GAAG,mBAAmB,UAAU;EAAE,GAAI;GAAS;;;;;AAMnG,MAAa,iBAAiB;;;;AAK9B,SAAgB,UAAU,EAAE,WAAW,GAAG,SAAqC;AAC7E,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,oGACA,UACD;EACD,GAAI;GACJ;;AAWN,SAAgB,gBAAuB,EAAE,UAA2C;CAClF,MAAM,YAAY,OAAO,OAAO;CAEhC,MAAM,WACJ,oBAAC,uBACE,OAAO,gBACJ,OACA,WAAW,OAAO,OAAO,UAAU,QAAQ,OAAO,YAAY,CAAC,IAHrD,OAAO,GAIX;AAGd,KAAI,CAAC,UAAU,YAAa,QAAO;AAEnC,QACE,oBAAC;EAAwB,YAAY,UAAU;EAC5C;IADW,OAAO,GAEX"}
+{"version":3,"file":"header.mjs","names":[],"sources":["../../../../src/modules/data-tables/components/header.tsx"],"sourcesContent":["import { flexRender, type Header, type Table } from \"@tanstack/react-table\";\nimport { cn } from \"@/lib/utils/cn\";\nimport { Allowed } from \"@/modules/auth/components/allowed.client\";\nimport { TableRow } from \"@/modules/data-tables/components/table\";\nimport type { TableColumnDef } from \"../lib/types\";\n\n/**\n * TableHeaderProps\n */\nexport type TableHeaderProps<TData> = {\n  table: Table<TData>;\n};\n\n/**\n * DataTableHeader\n */\nexport function TableHeader({ className, ...props }: React.ComponentProps<\"thead\">) {\n  return <thead data-slot=\"table-header\" className={cn(\"[&_tr]:border-b\", className)} {...props} />;\n}\n\n/**\n * DataTableHeaderRow\n */\nexport const TableHeaderRow = TableRow;\n\n/**\n * TableHead\n */\nexport function TableHead({ className, ...props }: React.ComponentProps<\"th\">) {\n  return (\n    <th\n      data-slot=\"table-head\"\n      className={cn(\n        \"h-10 whitespace-nowrap bg-muted/70 px-2 text-left align-middle font-medium text-muted-foreground\", //[&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * DataTableHeaderCell\n */\ntype DataTableHeaderCellProps<TData> = {\n  header: Header<TData, unknown>;\n};\n\nexport function TableHeaderCell<TData>({ header }: DataTableHeaderCellProps<TData>) {\n  const columnDef = header.column.columnDef as TableColumnDef<TData>;\n\n  const children = (\n    <TableHead key={header.id}>\n      {header.isPlaceholder\n        ? null\n        : flexRender(header.column.columnDef.header, header.getContext())}\n    </TableHead>\n  );\n\n  if (!columnDef.permissions) return children;\n\n  return (\n    <Allowed key={header.id} permission={columnDef.permissions}>\n      {children}\n    </Allowed>\n  );\n}\n"],"mappings":";;;;;;;;;;AAgBA,SAAgB,YAAY,EAAE,WAAW,GAAG,SAAwC;AAClF,QAAO,oBAAC;EAAM,aAAU;EAAe,WAAW,GAAG,mBAAmB,UAAU;EAAE,GAAI;GAAS;;;;;AAMnG,MAAa,iBAAiB;;;;AAK9B,SAAgB,UAAU,EAAE,WAAW,GAAG,SAAqC;AAC7E,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,oGACA,UACD;EACD,GAAI;GACJ;;AAWN,SAAgB,gBAAuB,EAAE,UAA2C;CAClF,MAAM,YAAY,OAAO,OAAO;CAEhC,MAAM,WACJ,oBAAC,uBACE,OAAO,gBACJ,OACA,WAAW,OAAO,OAAO,UAAU,QAAQ,OAAO,YAAY,CAAC,IAHrD,OAAO,GAIX;AAGd,KAAI,CAAC,UAAU,YAAa,QAAO;AAEnC,QACE,oBAAC;EAAwB,YAAY,UAAU;EAC5C;IADW,OAAO,GAEX"}

package/dist/modules/data-tables/components/skeleton.mjs

@@ -8,8 +8,8 @@ function TableSkeleton() {
 	return /* @__PURE__ */ jsx("div", {
 		className: "rounded-md border",
 		children: /* @__PURE__ */ jsxs(Table, { children: [/* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsx(TableRow, {
-			className: "bg-muted relative",
-			children: Array.from({ length: 15 }).map((_, index) => /* @__PURE__ */ jsx(TableHead, { children: /* @__PURE__ */ jsx(Skeleton, { className: "bg-background my-2 h-2 w-full rounded-full" }) }, index))
+			className: "relative bg-muted",
+			children: Array.from({ length: 15 }).map((_, index) => /* @__PURE__ */ jsx(TableHead, { children: /* @__PURE__ */ jsx(Skeleton, { className: "my-2 h-2 w-full rounded-full bg-background" }) }, index))
 		}) }), /* @__PURE__ */ jsx(TableBody, { children: Array.from({ length: 15 }).map((_, index) => /* @__PURE__ */ jsx(TableRow, {
 			className: "relative",
 			children: Array.from({ length: 15 }).map((_, index) => /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Skeleton, { className: "my-2 h-2 w-full rounded-full" }) }, index))

package/dist/modules/data-tables/components/skeleton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.mjs","names":[],"sources":["../../../../src/modules/data-tables/components/skeleton.tsx"],"sourcesContent":["import { Skeleton } from \"@/components/ui/skeleton\";\nimport { Table, TableBody, TableCell, TableRow } from \"@/modules/data-tables/components/table\";\nimport { TableHead, TableHeader } from \"./header\";\n\nexport function TableSkeleton() {\n  return (\n    <div className=\"rounded-md border\">\n      <Table>\n        <TableHeader>\n          <TableRow className=\"bg-muted relative\">\n            {Array.from({ length: 15 }).map((_, index) => (\n              <TableHead key={index}>\n                <Skeleton className=\"bg-background my-2 h-2 w-full rounded-full\" />\n              </TableHead>\n            ))}\n          </TableRow>\n        </TableHeader>\n        <TableBody>\n          {Array.from({ length: 15 }).map((_, index) => (\n            <TableRow key={index} className=\"relative\">\n              {Array.from({ length: 15 }).map((_, index) => (\n                <TableCell key={index}>\n                  <Skeleton className=\"my-2 h-2 w-full rounded-full\" />\n                </TableCell>\n              ))}\n            </TableRow>\n          ))}\n        </TableBody>\n      </Table>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAIA,SAAgB,gBAAgB;AAC9B,QACE,oBAAC;EAAI,WAAU;YACb,qBAAC,oBACC,oBAAC,yBACC,oBAAC;GAAS,WAAU;aACjB,MAAM,KAAK,EAAE,QAAQ,IAAI,CAAC,CAAC,KAAK,GAAG,UAClC,oBAAC,uBACC,oBAAC,YAAS,WAAU,+CAA+C,IADrD,MAEJ,CACZ;IACO,GACC,EACd,oBAAC,uBACE,MAAM,KAAK,EAAE,QAAQ,IAAI,CAAC,CAAC,KAAK,GAAG,UAClC,oBAAC;GAAqB,WAAU;aAC7B,MAAM,KAAK,EAAE,QAAQ,IAAI,CAAC,CAAC,KAAK,GAAG,UAClC,oBAAC,uBACC,oBAAC,YAAS,WAAU,iCAAiC,IADvC,MAEJ,CACZ;KALW,MAMJ,CACX,GACQ,IACN;GACJ"}
+{"version":3,"file":"skeleton.mjs","names":[],"sources":["../../../../src/modules/data-tables/components/skeleton.tsx"],"sourcesContent":["import { Skeleton } from \"@/components/ui/skeleton\";\nimport { Table, TableBody, TableCell, TableRow } from \"@/modules/data-tables/components/table\";\nimport { TableHead, TableHeader } from \"./header\";\n\nexport function TableSkeleton() {\n  return (\n    <div className=\"rounded-md border\">\n      <Table>\n        <TableHeader>\n          <TableRow className=\"relative bg-muted\">\n            {Array.from({ length: 15 }).map((_, index) => (\n              <TableHead key={index}>\n                <Skeleton className=\"my-2 h-2 w-full rounded-full bg-background\" />\n              </TableHead>\n            ))}\n          </TableRow>\n        </TableHeader>\n        <TableBody>\n          {Array.from({ length: 15 }).map((_, index) => (\n            <TableRow key={index} className=\"relative\">\n              {Array.from({ length: 15 }).map((_, index) => (\n                <TableCell key={index}>\n                  <Skeleton className=\"my-2 h-2 w-full rounded-full\" />\n                </TableCell>\n              ))}\n            </TableRow>\n          ))}\n        </TableBody>\n      </Table>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAIA,SAAgB,gBAAgB;AAC9B,QACE,oBAAC;EAAI,WAAU;YACb,qBAAC,oBACC,oBAAC,yBACC,oBAAC;GAAS,WAAU;aACjB,MAAM,KAAK,EAAE,QAAQ,IAAI,CAAC,CAAC,KAAK,GAAG,UAClC,oBAAC,uBACC,oBAAC,YAAS,WAAU,+CAA+C,IADrD,MAEJ,CACZ;IACO,GACC,EACd,oBAAC,uBACE,MAAM,KAAK,EAAE,QAAQ,IAAI,CAAC,CAAC,KAAK,GAAG,UAClC,oBAAC;GAAqB,WAAU;aAC7B,MAAM,KAAK,EAAE,QAAQ,IAAI,CAAC,CAAC,KAAK,GAAG,UAClC,oBAAC,uBACC,oBAAC,YAAS,WAAU,iCAAiC,IADvC,MAEJ,CACZ;KALW,MAMJ,CACX,GACQ,IACN;GACJ"}

package/dist/modules/data-tables/components/table.mjs

@@ -25,14 +25,14 @@ function TableBody({ className, ...props }) {
 function TableFooter({ className, ...props }) {
 	return /* @__PURE__ */ jsx("tfoot", {
 		"data-slot": "table-footer",
-		className: cn("bg-muted/50 border-t font-medium [&>tr]:last:border-b-0", className),
+		className: cn("border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", className),
 		...props
 	});
 }
 function TableRow({ className, ...props }) {
 	return /* @__PURE__ */ jsx("tr", {
 		"data-slot": "table-row",
-		className: cn("hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors", className),
+		className: cn("border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted", className),
 		...props
 	});
 }
@@ -46,7 +46,7 @@ function TableCell({ readonly, className, ...props }) {
 function TableCaption({ className, ...props }) {
 	return /* @__PURE__ */ jsx("caption", {
 		"data-slot": "table-caption",
-		className: cn("text-muted-foreground mt-4 text-sm", className),
+		className: cn("mt-4 text-muted-foreground text-sm", className),
 		...props
 	});
 }

package/dist/modules/data-tables/components/table.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"table.mjs","names":[],"sources":["../../../../src/modules/data-tables/components/table.tsx"],"sourcesContent":["\"use client\";\n\nimport type * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nfunction Table({ className, ...props }: React.ComponentProps<\"table\">) {\n  return (\n    <div data-slot=\"table-container\" className=\"relative w-full overflow-x-auto\">\n      <table\n        data-slot=\"table\"\n        className={cn(\"w-full caption-bottom text-sm\", className)}\n        {...props}\n      />\n    </div>\n  );\n}\n\nfunction TableBody({ className, ...props }: React.ComponentProps<\"tbody\">) {\n  return (\n    <tbody\n      data-slot=\"table-body\"\n      className={cn(\"[&_tr:last-child]:border-0\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction TableFooter({ className, ...props }: React.ComponentProps<\"tfoot\">) {\n  return (\n    <tfoot\n      data-slot=\"table-footer\"\n      className={cn(\"bg-muted/50 border-t font-medium [&>tr]:last:border-b-0\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction TableRow({ className, ...props }: React.ComponentProps<\"tr\">) {\n  return (\n    <tr\n      data-slot=\"table-row\"\n      className={cn(\n        \"hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction TableCell({\n  readonly,\n  className,\n  ...props\n}: React.ComponentProps<\"td\"> & { readonly?: boolean }) {\n  return (\n    <td\n      data-slot=\"table-cell\"\n      className={cn(\n        \"whitespace-nowrap p-2 align-middle\", //[&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]\n        readonly && \"bg-muted/50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction TableCaption({ className, ...props }: React.ComponentProps<\"caption\">) {\n  return (\n    <caption\n      data-slot=\"table-caption\"\n      className={cn(\"text-muted-foreground mt-4 text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\nexport { Table, TableBody, TableCaption, TableCell, TableFooter, TableRow };\n"],"mappings":";;;;;;AAMA,SAAS,MAAM,EAAE,WAAW,GAAG,SAAwC;AACrE,QACE,oBAAC;EAAI,aAAU;EAAkB,WAAU;YACzC,oBAAC;GACC,aAAU;GACV,WAAW,GAAG,iCAAiC,UAAU;GACzD,GAAI;IACJ;GACE;;AAIV,SAAS,UAAU,EAAE,WAAW,GAAG,SAAwC;AACzE,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GAAG,8BAA8B,UAAU;EACtD,GAAI;GACJ;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAAwC;AAC3E,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GAAG,2DAA2D,UAAU;EACnF,GAAI;GACJ;;AAIN,SAAS,SAAS,EAAE,WAAW,GAAG,SAAqC;AACrE,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,+EACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,UAAU,EACjB,UACA,WACA,GAAG,SACmD;AACtD,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,sCACA,YAAY,eACZ,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,aAAa,EAAE,WAAW,GAAG,SAA0C;AAC9E,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GAAG,sCAAsC,UAAU;EAC9D,GAAI;GACJ"}
+{"version":3,"file":"table.mjs","names":[],"sources":["../../../../src/modules/data-tables/components/table.tsx"],"sourcesContent":["\"use client\";\n\nimport type * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nfunction Table({ className, ...props }: React.ComponentProps<\"table\">) {\n  return (\n    <div data-slot=\"table-container\" className=\"relative w-full overflow-x-auto\">\n      <table\n        data-slot=\"table\"\n        className={cn(\"w-full caption-bottom text-sm\", className)}\n        {...props}\n      />\n    </div>\n  );\n}\n\nfunction TableBody({ className, ...props }: React.ComponentProps<\"tbody\">) {\n  return (\n    <tbody\n      data-slot=\"table-body\"\n      className={cn(\"[&_tr:last-child]:border-0\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction TableFooter({ className, ...props }: React.ComponentProps<\"tfoot\">) {\n  return (\n    <tfoot\n      data-slot=\"table-footer\"\n      className={cn(\"border-t bg-muted/50 font-medium [&>tr]:last:border-b-0\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction TableRow({ className, ...props }: React.ComponentProps<\"tr\">) {\n  return (\n    <tr\n      data-slot=\"table-row\"\n      className={cn(\n        \"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction TableCell({\n  readonly,\n  className,\n  ...props\n}: React.ComponentProps<\"td\"> & { readonly?: boolean }) {\n  return (\n    <td\n      data-slot=\"table-cell\"\n      className={cn(\n        \"whitespace-nowrap p-2 align-middle\", //[&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]\n        readonly && \"bg-muted/50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction TableCaption({ className, ...props }: React.ComponentProps<\"caption\">) {\n  return (\n    <caption\n      data-slot=\"table-caption\"\n      className={cn(\"mt-4 text-muted-foreground text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\nexport { Table, TableBody, TableCaption, TableCell, TableFooter, TableRow };\n"],"mappings":";;;;;;AAMA,SAAS,MAAM,EAAE,WAAW,GAAG,SAAwC;AACrE,QACE,oBAAC;EAAI,aAAU;EAAkB,WAAU;YACzC,oBAAC;GACC,aAAU;GACV,WAAW,GAAG,iCAAiC,UAAU;GACzD,GAAI;IACJ;GACE;;AAIV,SAAS,UAAU,EAAE,WAAW,GAAG,SAAwC;AACzE,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GAAG,8BAA8B,UAAU;EACtD,GAAI;GACJ;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAAwC;AAC3E,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GAAG,2DAA2D,UAAU;EACnF,GAAI;GACJ;;AAIN,SAAS,SAAS,EAAE,WAAW,GAAG,SAAqC;AACrE,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,+EACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,UAAU,EACjB,UACA,WACA,GAAG,SACmD;AACtD,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,sCACA,YAAY,eACZ,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,aAAa,EAAE,WAAW,GAAG,SAA0C;AAC9E,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GAAG,sCAAsC,UAAU;EAC9D,GAAI;GACJ"}

package/dist/modules/data-tables/components/toolbar.mjs

@@ -5,7 +5,7 @@ import { jsx } from "react/jsx-runtime";
 function TableToolbar({ children, className, ...props }) {
 	return /* @__PURE__ */ jsx("div", {
 		...props,
-		className: cn("flex max-w-full justify-between gap-5 overflow-x-auto p-1", className),
+		className: cn("flex max-w-full justify-between gap-5 overflow-x-auto py-1", className),
 		children
 	});
 }

package/dist/modules/data-tables/components/toolbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"toolbar.mjs","names":[],"sources":["../../../../src/modules/data-tables/components/toolbar.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport { cn } from \"@/lib/utils/cn\";\n\ntype TableToolbarProps = HTMLAttributes<HTMLDivElement> & {\n  children: React.ReactNode;\n};\n\nexport function TableToolbar({ children, className, ...props }: TableToolbarProps) {\n  return (\n    <div\n      {...props}\n      className={cn(\"flex max-w-full justify-between gap-5 overflow-x-auto p-1\", className)}\n    >\n      {children}\n    </div>\n  );\n}\n\ntype TableToolbarListProps = HTMLAttributes<HTMLDivElement> & {\n  children: React.ReactNode;\n};\n\nexport function TableToolbarList({ children, className, ...props }: TableToolbarListProps) {\n  return (\n    <div {...props} className={cn(\"flex flex-row gap-5\", className)}>\n      {children}\n    </div>\n  );\n}\n"],"mappings":";;;;AAOA,SAAgB,aAAa,EAAE,UAAU,WAAW,GAAG,SAA4B;AACjF,QACE,oBAAC;EACC,GAAI;EACJ,WAAW,GAAG,6DAA6D,UAAU;EAEpF;GACG;;AAQV,SAAgB,iBAAiB,EAAE,UAAU,WAAW,GAAG,SAAgC;AACzF,QACE,oBAAC;EAAI,GAAI;EAAO,WAAW,GAAG,uBAAuB,UAAU;EAC5D;GACG"}
+{"version":3,"file":"toolbar.mjs","names":[],"sources":["../../../../src/modules/data-tables/components/toolbar.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport { cn } from \"@/lib/utils/cn\";\n\ntype TableToolbarProps = HTMLAttributes<HTMLDivElement> & {\n  children: React.ReactNode;\n};\n\nexport function TableToolbar({ children, className, ...props }: TableToolbarProps) {\n  return (\n    <div\n      {...props}\n      className={cn(\"flex max-w-full justify-between gap-5 overflow-x-auto py-1\", className)}\n    >\n      {children}\n    </div>\n  );\n}\n\ntype TableToolbarListProps = HTMLAttributes<HTMLDivElement> & {\n  children: React.ReactNode;\n};\n\nexport function TableToolbarList({ children, className, ...props }: TableToolbarListProps) {\n  return (\n    <div {...props} className={cn(\"flex flex-row gap-5\", className)}>\n      {children}\n    </div>\n  );\n}\n"],"mappings":";;;;AAOA,SAAgB,aAAa,EAAE,UAAU,WAAW,GAAG,SAA4B;AACjF,QACE,oBAAC;EACC,GAAI;EACJ,WAAW,GAAG,8DAA8D,UAAU;EAErF;GACG;;AAQV,SAAgB,iBAAiB,EAAE,UAAU,WAAW,GAAG,SAAgC;AACzF,QACE,oBAAC;EAAI,GAAI;EAAO,WAAW,GAAG,uBAAuB,UAAU;EAC5D;GACG"}

package/dist/modules/data-tables/strategies/pagination/components.mjs

@@ -21,7 +21,7 @@ function PaginationTableFooter({ table }) {
 				onClick: () => table.resetRowSelection(),
 				children: /* @__PURE__ */ jsx(XIcon, { className: "h-2 w-2" })
 			}), /* @__PURE__ */ jsxs("div", {
-				className: "text-muted-foreground flex-1 text-sm",
+				className: "flex-1 text-muted-foreground text-sm",
 				children: [
 					selected ?? table.getFilteredSelectedRowModel().rows.length,
 					" of",
@@ -36,7 +36,7 @@ function PaginationTableFooter({ table }) {
 				/* @__PURE__ */ jsxs("div", {
 					className: "hidden items-center space-x-2 md:flex",
 					children: [/* @__PURE__ */ jsx("p", {
-						className: "text-sm font-medium",
+						className: "font-medium text-sm",
 						children: "Rows per page"
 					}), /* @__PURE__ */ jsxs(Select, {
 						value: `${table.getState().pagination.pageSize}`,
@@ -65,7 +65,7 @@ function PaginationTableFooter({ table }) {
 					})]
 				}),
 				/* @__PURE__ */ jsxs("div", {
-					className: "flex items-center justify-center text-sm font-medium",
+					className: "flex items-center justify-center font-medium text-sm",
 					children: [
 						"Page ",
 						table.getState().pagination.pageIndex + 1,