@nccirtu/tablefy 0.8.2 → 0.8.3

package/dist/columns/index.d.ts

@@ -13,6 +13,9 @@ export { InputColumn, InputColumn as inputColumn, } from "./columns/input-column
 export { LinkColumn } from "./columns/link-column";
 export { NumberColumn } from "./columns/number-column";
 export { ProgressColumn, SelectColumn } from "./columns";
+export { ActionsColumn, ActionsColumn as actionsColumn, } from "./columns/actions-column";
+export type { ActionItem } from "./columns/actions-column";
+export { TextColumn, TextColumn as textColumn } from "./columns/text-column";
 export { EnumColumn, EnumColumn as enumColumn } from "./columns/enum-column";
 export type { EnumOption } from "./columns/enum-column";
 export { ConfirmProvider, confirm } from "./confirm";

package/dist/index.d.ts

@@ -13,6 +13,9 @@ export { InputColumn, InputColumn as inputColumn, } from "./columns/input-column
 export { LinkColumn } from "./columns/link-column";
 export { NumberColumn } from "./columns/number-column";
 export { ProgressColumn, SelectColumn } from "./columns";
+export { ActionsColumn, ActionsColumn as actionsColumn, } from "./columns/actions-column";
+export type { ActionItem } from "./columns/actions-column";
+export { TextColumn, TextColumn as textColumn } from "./columns/text-column";
 export { EnumColumn, EnumColumn as enumColumn } from "./columns/enum-column";
 export type { EnumOption } from "./columns/enum-column";
 export { ConfirmProvider, confirm } from "./confirm";

package/dist/index.esm.js

@@ -6,7 +6,7 @@ import { cn } from '@/lib/utils';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuCheckboxItem, DropdownMenuItem } from '@/components/ui/dropdown-menu';
-import { Search, X, Columns, ChevronDown, ChevronsLeft, ChevronLeft, ChevronRight, ChevronsRight, ArrowUpDown, Calendar, ExternalLink } from 'lucide-react';
+import { Search, X, Columns, ChevronDown, ChevronsLeft, ChevronLeft, ChevronRight, ChevronsRight, ArrowUpDown, Calendar, ExternalLink, MoreHorizontal } from 'lucide-react';
 import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '@/components/ui/select';
 import { Badge } from '@/components/ui/badge';
 import { Checkbox } from '@/components/ui/checkbox';
@@ -1542,6 +1542,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 (jsx("span", { className: cn("text-muted-foreground font-medium", this.getAlignmentClass(), this.config.headerClassName), children: displayLabel }));
+                }
+                return (jsxs(Button, { variant: "table_header", size: "table_header", onClick: () => column.toggleSorting(column.getIsSorted() === "asc"), className: cn("text-muted-foreground font-medium", this.getAlignmentClass(), this.config.headerClassName), children: [displayLabel, jsx(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 (jsx("span", { className: cn("text-muted-foreground", this.getAlignmentClass(), this.config.cellClassName), children: placeholder || "—" }));
+                }
+                // Prefix/Suffix hinzufügen
+                const displayValue = `${prefix || ""}${value}${suffix || ""}`;
+                return (jsx("span", { className: 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: () => 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 (jsxs(DropdownMenu, { children: [jsx(DropdownMenuTrigger, { asChild: true, children: jsxs(Button, { variant: "ghost", className: "h-10 w-10 p-0", children: [jsx("span", { className: "sr-only", children: label }), triggerIcon || jsx(MoreHorizontal, { className: "h-8 w-8" })] }) }), jsx(DropdownMenuContent, { align: "end", children: visibleActions.map((action, index) => (jsxs("div", { children: [action.render ? (
+                                    // Custom render function takes priority
+                                    action.render(data)) : (
+                                    // Standard menu item
+                                    jsxs(DropdownMenuItem, { disabled: action.disabled?.(data), className: 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 && (jsx("span", { className: "mr-2", children: action.icon })), action.label] })), action.separator && index < visibleActions.length - 1 && (jsx(DropdownMenuSeparator, {}))] }, index))) })] }));
+            },
+        };
+    }
+}
+
 class EnumColumn extends BaseColumn {
     constructor(accessor) {
         super(accessor);
@@ -1676,5 +1834,5 @@ function ConfirmProvider({ children }) {
     return (jsxs(Fragment, { children: [children, jsx(AlertDialog, { open: !!currentRequest, onOpenChange: (open) => !open && handleCancel(), children: jsxs(AlertDialogContent, { className: "max-w-md", children: [jsxs(AlertDialogHeader, { children: [jsx(AlertDialogTitle, { className: "text-center", children: title || "Bestätigung erforderlich" }), description && (jsx(AlertDialogDescription, { className: "text-center", children: description }))] }), image && (jsx("div", { className: "flex justify-center py-4", children: jsx("img", { src: image, alt: "Confirmation", className: "h-24 w-24 object-contain" }) })), icon && !image && (jsx("div", { className: "flex justify-center py-4 text-6xl", children: icon })), jsxs(AlertDialogFooter, { className: "flex flex-row !justify-between w-full", children: [jsx(AlertDialogCancel, { onClick: handleCancel, className: "mt-0", children: cancelLabel || "Abbrechen" }), jsx(AlertDialogAction, { onClick: handleConfirm, variant: variant === "destructive" ? "destructive" : "default", children: confirmLabel || "Bestätigen" })] })] }) })] }));
 }
 
-export { AvatarGroupColumn, BadgeColumn, ButtonColumn, CheckboxColumn, ConfirmProvider, DataTable, DataTableSchema, DateColumn, DropdownColumn, EmptyStateBuilder, EnumColumn, IconColumn, ImageColumn, InputColumn, LinkColumn, NumberColumn, ProgressColumn, SelectColumn, TableSchema, AvatarGroupColumn as avatarGroupColumn, BadgeColumn as badgeColumn, ButtonColumn as buttonColumn, CheckboxColumn as checkboxColumn, confirm, DateColumn as dateColumn, DropdownColumn as dropdownColumn, EnumColumn as enumColumn, IconColumn as iconColumn, InputColumn as inputColumn };
+export { ActionsColumn, AvatarGroupColumn, BadgeColumn, ButtonColumn, CheckboxColumn, ConfirmProvider, DataTable, DataTableSchema, DateColumn, DropdownColumn, EmptyStateBuilder, EnumColumn, IconColumn, ImageColumn, InputColumn, LinkColumn, NumberColumn, ProgressColumn, SelectColumn, TableSchema, TextColumn, ActionsColumn as actionsColumn, AvatarGroupColumn as avatarGroupColumn, BadgeColumn as badgeColumn, ButtonColumn as buttonColumn, CheckboxColumn as checkboxColumn, confirm, DateColumn as dateColumn, DropdownColumn as dropdownColumn, EnumColumn as enumColumn, IconColumn as iconColumn, InputColumn as inputColumn, TextColumn as textColumn };
 //# sourceMappingURL=index.esm.js.map