@nccirtu/tablefy 0.8.2 → 0.8.4

package/dist/index.js

@@ -601,8 +601,18 @@ class BadgeColumn extends BaseColumn {
         this.config.variants = variants;
         return this;
     }
+    // Dynamische Variante basierend auf Row-Daten
+    variantFn(fn) {
+        this.config.variantFn = fn;
+        return this;
+    }
+    // Dynamische className basierend auf Row-Daten
+    classNameFn(fn) {
+        this.config.classNameFn = fn;
+        return this;
+    }
     build() {
-        const { accessor, label, sortable, variants } = this.config;
+        const { accessor, label, sortable, variants, variantFn, classNameFn } = this.config;
         return {
             accessorKey: accessor,
             header: ({ column }) => {
@@ -612,18 +622,31 @@ class BadgeColumn extends BaseColumn {
                 }
                 return (jsxRuntime.jsxs(button.Button, { variant: "table_header", size: "table_header", onClick: () => column.toggleSorting(column.getIsSorted() === "asc"), className: utils.cn("text-muted-foreground font-medium", this.getAlignmentClass(), this.config.headerClassName), children: [displayLabel, jsxRuntime.jsx(lucideReact.ArrowUpDown, { className: "ml-2 h-4 w-4" })] }));
             },
-            cell: ({ getValue }) => {
-                const value = String(getValue());
-                const variantConfig = variants?.[value];
-                if (!variantConfig) {
-                    return (jsxRuntime.jsx(badge.Badge, { variant: "outline", className: this.config.cellClassName, children: value }));
+            cell: ({ getValue, row }) => {
+                const value = getValue();
+                const stringValue = String(value);
+                // Priority 1: Dynamic variantFn (highest priority)
+                if (variantFn) {
+                    const dynamicConfig = variantFn(value, row.original);
+                    return (jsxRuntime.jsxs(badge.Badge, { variant: dynamicConfig.variant === "success" ||
+                            dynamicConfig.variant === "warning" ||
+                            dynamicConfig.variant === "info" ||
+                            dynamicConfig.variant === "muted"
+                            ? "default"
+                            : dynamicConfig.variant || "default", className: utils.cn(dynamicConfig.className, classNameFn?.(value, row.original), this.config.cellClassName), children: [dynamicConfig.icon, dynamicConfig.label || stringValue] }));
+                }
+                // Priority 2: Static variants lookup
+                const variantConfig = variants?.[stringValue];
+                if (variantConfig) {
+                    return (jsxRuntime.jsxs(badge.Badge, { variant: variantConfig.variant === "success" ||
+                            variantConfig.variant === "warning" ||
+                            variantConfig.variant === "info" ||
+                            variantConfig.variant === "muted"
+                            ? "default"
+                            : variantConfig.variant || "default", className: utils.cn(variantConfig.className, classNameFn?.(value, row.original), this.config.cellClassName), children: [variantConfig.icon, variantConfig.label || stringValue] }));
                 }
-                return (jsxRuntime.jsxs(badge.Badge, { variant: variantConfig.variant === "success" ||
-                        variantConfig.variant === "warning" ||
-                        variantConfig.variant === "info" ||
-                        variantConfig.variant === "muted"
-                        ? "default"
-                        : variantConfig.variant || "default", className: utils.cn(variantConfig.className, this.config.cellClassName), children: [variantConfig.icon, variantConfig.label || value] }));
+                // Priority 3: Default badge with optional dynamic className
+                return (jsxRuntime.jsx(badge.Badge, { variant: "outline", className: utils.cn(classNameFn?.(value, row.original), this.config.cellClassName), children: stringValue }));
             },
         };
     }
@@ -1544,6 +1567,164 @@ class SelectColumn extends BaseColumn {
     }
 }
 
+class TextColumn extends BaseColumn {
+    static make(accessor) {
+        return new TextColumn(accessor);
+    }
+    formatter(fn) {
+        this.config.formatter = fn;
+        return this;
+    }
+    prefix(prefix) {
+        this.config.prefix = prefix;
+        return this;
+    }
+    suffix(suffix) {
+        this.config.suffix = suffix;
+        return this;
+    }
+    placeholder(placeholder) {
+        this.config.placeholder = placeholder;
+        return this;
+    }
+    // Shortcuts für gängige Formatierungen
+    uppercase() {
+        const existingFormatter = this.config.formatter;
+        this.config.formatter = (value, row) => {
+            const result = existingFormatter ? existingFormatter(value, row) : value;
+            return typeof result === "string"
+                ? result.toUpperCase()
+                : result;
+        };
+        return this;
+    }
+    lowercase() {
+        const existingFormatter = this.config.formatter;
+        this.config.formatter = (value, row) => {
+            const result = existingFormatter ? existingFormatter(value, row) : value;
+            return typeof result === "string"
+                ? result.toLowerCase()
+                : result;
+        };
+        return this;
+    }
+    limit(chars) {
+        const existingFormatter = this.config.formatter;
+        this.config.formatter = (value, row) => {
+            const result = existingFormatter ? existingFormatter(value, row) : value;
+            if (typeof result === "string" && result.length > chars) {
+                return result.slice(0, chars) + "...";
+            }
+            return result;
+        };
+        return this;
+    }
+    build() {
+        const { accessor, label, sortable, prefix, suffix, placeholder, formatter, visibleByDefault, visibilityLabel, } = this.config;
+        return {
+            accessorKey: accessor,
+            meta: {
+                visibleByDefault,
+                visibilityLabel: visibilityLabel || label || String(accessor),
+            },
+            header: ({ column }) => {
+                const displayLabel = label || String(accessor);
+                if (!sortable) {
+                    return (jsxRuntime.jsx("span", { className: utils.cn("text-muted-foreground font-medium", this.getAlignmentClass(), this.config.headerClassName), children: displayLabel }));
+                }
+                return (jsxRuntime.jsxs(button.Button, { variant: "table_header", size: "table_header", onClick: () => column.toggleSorting(column.getIsSorted() === "asc"), className: utils.cn("text-muted-foreground font-medium", this.getAlignmentClass(), this.config.headerClassName), children: [displayLabel, jsxRuntime.jsx(lucideReact.ArrowUpDown, { className: "ml-2 h-4 w-4" })] }));
+            },
+            cell: ({ row, getValue }) => {
+                let value = getValue();
+                // Custom Formatter anwenden
+                if (formatter) {
+                    value = formatter(value, row);
+                }
+                // Placeholder wenn leer
+                if (value === null || value === undefined || value === "") {
+                    return (jsxRuntime.jsx("span", { className: utils.cn("text-muted-foreground", this.getAlignmentClass(), this.config.cellClassName), children: placeholder || "—" }));
+                }
+                // Prefix/Suffix hinzufügen
+                const displayValue = `${prefix || ""}${value}${suffix || ""}`;
+                return (jsxRuntime.jsx("span", { className: utils.cn(this.getAlignmentClass(), this.config.cellClassName), children: displayValue }));
+            },
+        };
+    }
+}
+
+class ActionsColumn {
+    config = {
+        actions: [],
+        label: "Aktionen",
+    };
+    static make() {
+        return new ActionsColumn();
+    }
+    label(label) {
+        this.config.label = label;
+        return this;
+    }
+    triggerIcon(icon) {
+        this.config.triggerIcon = icon;
+        return this;
+    }
+    // Action hinzufügen
+    action(action) {
+        this.config.actions.push(action);
+        return this;
+    }
+    // Shortcuts für gängige Actions
+    view(onClick) {
+        return this.action({ label: "Anzeigen", onClick });
+    }
+    edit(onClick) {
+        return this.action({ label: "Bearbeiten", onClick });
+    }
+    delete(onClick) {
+        return this.action({
+            label: "Löschen",
+            onClick,
+            variant: "destructive",
+            separator: true,
+        });
+    }
+    link(label, href) {
+        return this.action({ label, href });
+    }
+    separator() {
+        if (this.config.actions.length > 0) {
+            this.config.actions[this.config.actions.length - 1].separator = true;
+        }
+        return this;
+    }
+    build() {
+        const { actions, label, triggerIcon } = this.config;
+        return {
+            id: "actions",
+            header: () => jsxRuntime.jsx("span", { className: "sr-only", children: label }),
+            cell: ({ row }) => {
+                const data = row.original;
+                const visibleActions = actions.filter((action) => !action.hidden || !action.hidden(data));
+                if (visibleActions.length === 0)
+                    return null;
+                return (jsxRuntime.jsxs(dropdownMenu.DropdownMenu, { children: [jsxRuntime.jsx(dropdownMenu.DropdownMenuTrigger, { asChild: true, children: jsxRuntime.jsxs(button.Button, { variant: "ghost", className: "h-10 w-10 p-0", children: [jsxRuntime.jsx("span", { className: "sr-only", children: label }), triggerIcon || jsxRuntime.jsx(lucideReact.MoreHorizontal, { className: "h-8 w-8" })] }) }), jsxRuntime.jsx(dropdownMenu.DropdownMenuContent, { align: "end", children: visibleActions.map((action, index) => (jsxRuntime.jsxs("div", { children: [action.render ? (
+                                    // Custom render function takes priority
+                                    action.render(data)) : (
+                                    // Standard menu item
+                                    jsxRuntime.jsxs(dropdownMenu.DropdownMenuItem, { disabled: action.disabled?.(data), className: utils.cn(action.variant === "destructive" &&
+                                            "text-destructive focus:text-destructive"), onClick: () => {
+                                            if (action.href) {
+                                                window.location.href = action.href(data);
+                                            }
+                                            else if (action.onClick) {
+                                                action.onClick(data);
+                                            }
+                                        }, children: [action.icon && (jsxRuntime.jsx("span", { className: "mr-2", children: action.icon })), action.label] })), action.separator && index < visibleActions.length - 1 && (jsxRuntime.jsx(dropdownMenu.DropdownMenuSeparator, {}))] }, index))) })] }));
+            },
+        };
+    }
+}
+
 class EnumColumn extends BaseColumn {
     constructor(accessor) {
         super(accessor);
@@ -1678,6 +1859,7 @@ function ConfirmProvider({ children }) {
     return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [children, jsxRuntime.jsx(alertDialog.AlertDialog, { open: !!currentRequest, onOpenChange: (open) => !open && handleCancel(), children: jsxRuntime.jsxs(alertDialog.AlertDialogContent, { className: "max-w-md", children: [jsxRuntime.jsxs(alertDialog.AlertDialogHeader, { children: [jsxRuntime.jsx(alertDialog.AlertDialogTitle, { className: "text-center", children: title || "Bestätigung erforderlich" }), description && (jsxRuntime.jsx(alertDialog.AlertDialogDescription, { className: "text-center", children: description }))] }), image && (jsxRuntime.jsx("div", { className: "flex justify-center py-4", children: jsxRuntime.jsx("img", { src: image, alt: "Confirmation", className: "h-24 w-24 object-contain" }) })), icon && !image && (jsxRuntime.jsx("div", { className: "flex justify-center py-4 text-6xl", children: icon })), jsxRuntime.jsxs(alertDialog.AlertDialogFooter, { className: "flex flex-row !justify-between w-full", children: [jsxRuntime.jsx(alertDialog.AlertDialogCancel, { onClick: handleCancel, className: "mt-0", children: cancelLabel || "Abbrechen" }), jsxRuntime.jsx(alertDialog.AlertDialogAction, { onClick: handleConfirm, variant: variant === "destructive" ? "destructive" : "default", children: confirmLabel || "Bestätigen" })] })] }) })] }));
 }
 
+exports.ActionsColumn = ActionsColumn;
 exports.AvatarGroupColumn = AvatarGroupColumn;
 exports.BadgeColumn = BadgeColumn;
 exports.ButtonColumn = ButtonColumn;
@@ -1697,6 +1879,8 @@ exports.NumberColumn = NumberColumn;
 exports.ProgressColumn = ProgressColumn;
 exports.SelectColumn = SelectColumn;
 exports.TableSchema = TableSchema;
+exports.TextColumn = TextColumn;
+exports.actionsColumn = ActionsColumn;
 exports.avatarGroupColumn = AvatarGroupColumn;
 exports.badgeColumn = BadgeColumn;
 exports.buttonColumn = ButtonColumn;
@@ -1707,4 +1891,5 @@ exports.dropdownColumn = DropdownColumn;
 exports.enumColumn = EnumColumn;
 exports.iconColumn = IconColumn;
 exports.inputColumn = InputColumn;
+exports.textColumn = TextColumn;
 //# sourceMappingURL=index.js.map