@nccirtu/tablefy 0.7.2 → 0.7.4

package/dist/columns/base-column.d.ts

@@ -7,6 +7,8 @@ export declare abstract class BaseColumn<TData, TConfig extends BaseColumnConfig
     sortable(sortable?: boolean): this;
     searchable(searchable?: boolean): this;
     hidden(hidden?: boolean): this;
+    visibleByDefault(visible?: boolean): this;
+    visibilityLabel(label: string): this;
     alignLeft(): this;
     alignCenter(): this;
     alignRight(): this;

package/dist/columns/columns/base-column.d.ts

@@ -7,6 +7,8 @@ export declare abstract class BaseColumn<TData, TConfig extends BaseColumnConfig
     sortable(sortable?: boolean): this;
     searchable(searchable?: boolean): this;
     hidden(hidden?: boolean): this;
+    visibleByDefault(visible?: boolean): this;
+    visibilityLabel(label: string): this;
     alignLeft(): this;
     alignCenter(): this;
     alignRight(): this;

package/dist/columns/columns/enum-column.d.ts

@@ -0,0 +1,52 @@
+import { ColumnDef } from "@tanstack/react-table";
+import { LucideIcon } from "lucide-react";
+import { BaseColumn } from "./base-column";
+import { BaseColumnConfig } from "./types";
+export interface EnumOption<T = string | number> {
+    value: T;
+    label: string;
+    icon?: LucideIcon;
+    color?: "default" | "secondary" | "destructive" | "outline" | "success" | "warning" | "info";
+    className?: string;
+}
+interface EnumColumnConfig<TData> extends BaseColumnConfig<TData> {
+    options: EnumOption[];
+    asBadge?: boolean;
+    showIcon?: boolean;
+    iconPosition?: "left" | "right";
+    placeholder?: string;
+}
+export declare class EnumColumn<TData> extends BaseColumn<TData, EnumColumnConfig<TData>> {
+    constructor(accessor: keyof TData | string);
+    static make<TData>(accessor: keyof TData | string): EnumColumn<TData>;
+    /**
+     * Define the enum options with labels, icons, and colors
+     */
+    options(options: EnumOption[]): this;
+    /**
+     * Display as plain text instead of badge
+     */
+    asText(): this;
+    /**
+     * Display as badge (default)
+     */
+    asBadge(): this;
+    /**
+     * Hide icons
+     */
+    hideIcon(): this;
+    /**
+     * Show icons (default)
+     */
+    showIcon(): this;
+    /**
+     * Set icon position
+     */
+    iconPosition(position: "left" | "right"): this;
+    /**
+     * Placeholder for unknown values
+     */
+    placeholder(placeholder: string): this;
+    build(): ColumnDef<TData, unknown>;
+}
+export {};

package/dist/columns/columns/index.d.ts

@@ -13,4 +13,6 @@ export { ProgressColumn } from "./progress-column";
 export { SelectColumn } from "./select-column";
 export { TextColumn } from "./text-column";
 export { ActionsColumn } from "./actions-column";
+export { EnumColumn } from "./enum-column";
+export type { EnumOption } from "./enum-column";
 export type * from "./types";

package/dist/columns/columns/types.d.ts

@@ -6,6 +6,8 @@ export interface BaseColumnConfig<TData> {
     sortable?: boolean;
     searchable?: boolean;
     hidden?: boolean;
+    visibleByDefault?: boolean;
+    visibilityLabel?: string;
     align?: "left" | "center" | "right";
     width?: string | number;
     className?: string;

package/dist/columns/enum-column.d.ts

@@ -0,0 +1,52 @@
+import { ColumnDef } from "@tanstack/react-table";
+import { LucideIcon } from "lucide-react";
+import { BaseColumn } from "./base-column";
+import { BaseColumnConfig } from "./types";
+export interface EnumOption<T = string | number> {
+    value: T;
+    label: string;
+    icon?: LucideIcon;
+    color?: "default" | "secondary" | "destructive" | "outline" | "success" | "warning" | "info";
+    className?: string;
+}
+interface EnumColumnConfig<TData> extends BaseColumnConfig<TData> {
+    options: EnumOption[];
+    asBadge?: boolean;
+    showIcon?: boolean;
+    iconPosition?: "left" | "right";
+    placeholder?: string;
+}
+export declare class EnumColumn<TData> extends BaseColumn<TData, EnumColumnConfig<TData>> {
+    constructor(accessor: keyof TData | string);
+    static make<TData>(accessor: keyof TData | string): EnumColumn<TData>;
+    /**
+     * Define the enum options with labels, icons, and colors
+     */
+    options(options: EnumOption[]): this;
+    /**
+     * Display as plain text instead of badge
+     */
+    asText(): this;
+    /**
+     * Display as badge (default)
+     */
+    asBadge(): this;
+    /**
+     * Hide icons
+     */
+    hideIcon(): this;
+    /**
+     * Show icons (default)
+     */
+    showIcon(): this;
+    /**
+     * Set icon position
+     */
+    iconPosition(position: "left" | "right"): this;
+    /**
+     * Placeholder for unknown values
+     */
+    placeholder(placeholder: string): this;
+    build(): ColumnDef<TData, unknown>;
+}
+export {};

package/dist/columns/index.d.ts

@@ -12,11 +12,9 @@ export { ImageColumn } from "./columns/image-column";
 export { InputColumn, InputColumn as inputColumn, } from "./columns/input-column";
 export { LinkColumn } from "./columns/link-column";
 export { NumberColumn } from "./columns/number-column";
-export { ProgressColumn, ProgressColumn as progressColumn, } from "./columns/progress-column";
-export { SelectColumn, SelectColumn as selectColumn, } from "./columns/select-column";
-export { TextColumn, TextColumn as textColumn } from "./columns/text-column";
-export { ActionsColumn } from "./columns/actions-column";
-export type { ActionItem } from "./columns/actions-column";
+export { ProgressColumn, SelectColumn } from "./columns";
+export { EnumColumn, EnumColumn as enumColumn } from "./columns/enum-column";
+export type { EnumOption } from "./columns/enum-column";
 export { ConfirmProvider, confirm } from "./confirm";
 export type { ConfirmOptions } from "./confirm";
 export type { DataTableConfig, EmptyStateConfig, FilterConfig, HeaderAction, PaginationConfig, SearchConfig, } from "./types";

package/dist/columns/index.esm.js

@@ -44,6 +44,14 @@ class BaseColumn {
         this.config.hidden = hidden;
         return this;
     }
+    visibleByDefault(visible = true) {
+        this.config.visibleByDefault = visible;
+        return this;
+    }
+    visibilityLabel(label) {
+        this.config.visibilityLabel = label;
+        return this;
+    }
     alignLeft() {
         this.config.align = "left";
         return this;
@@ -1229,9 +1237,13 @@ class TextColumn extends BaseColumn {
         return this;
     }
     build() {
-        const { accessor, label, sortable, prefix, suffix, placeholder, formatter, } = this.config;
+        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) {
@@ -1330,5 +1342,99 @@ class ActionsColumn {
     }
 }
 
-export { ActionsColumn, AvatarGroupColumn, BadgeColumn, ButtonColumn, CheckboxColumn, DateColumn, DropdownColumn, IconColumn, ImageColumn, InputColumn, LinkColumn, NumberColumn, ProgressColumn, SelectColumn, TextColumn };
+class EnumColumn extends BaseColumn {
+    constructor(accessor) {
+        super(accessor);
+        this.config.asBadge = true;
+        this.config.showIcon = true;
+        this.config.iconPosition = "left";
+    }
+    static make(accessor) {
+        return new EnumColumn(accessor);
+    }
+    /**
+     * Define the enum options with labels, icons, and colors
+     */
+    options(options) {
+        this.config.options = options;
+        return this;
+    }
+    /**
+     * Display as plain text instead of badge
+     */
+    asText() {
+        this.config.asBadge = false;
+        return this;
+    }
+    /**
+     * Display as badge (default)
+     */
+    asBadge() {
+        this.config.asBadge = true;
+        return this;
+    }
+    /**
+     * Hide icons
+     */
+    hideIcon() {
+        this.config.showIcon = false;
+        return this;
+    }
+    /**
+     * Show icons (default)
+     */
+    showIcon() {
+        this.config.showIcon = true;
+        return this;
+    }
+    /**
+     * Set icon position
+     */
+    iconPosition(position) {
+        this.config.iconPosition = position;
+        return this;
+    }
+    /**
+     * Placeholder for unknown values
+     */
+    placeholder(placeholder) {
+        this.config.placeholder = placeholder;
+        return this;
+    }
+    build() {
+        const { accessor, label, sortable, options, asBadge, showIcon, iconPosition, placeholder, } = this.config;
+        if (!options || options.length === 0) {
+            throw new Error(`EnumColumn "${String(accessor)}" requires options to be defined`);
+        }
+        return {
+            accessorKey: 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: ({ getValue }) => {
+                const value = getValue();
+                // Find matching option
+                const option = options.find((opt) => opt.value === value);
+                // Handle unknown values
+                if (!option) {
+                    return (jsx("span", { className: cn("text-muted-foreground", this.getAlignmentClass(), this.config.cellClassName), children: placeholder || "—" }));
+                }
+                const Icon = option.icon;
+                const iconElement = showIcon && Icon ? jsx(Icon, { className: "h-4 w-4" }) : null;
+                // Render as Badge
+                if (asBadge) {
+                    return (jsx("div", { className: cn(this.getAlignmentClass(), this.config.cellClassName), children: jsxs(Badge, { variant: option.color || "default", className: cn("inline-flex items-center gap-1.5", option.className), children: [iconPosition === "left" && iconElement, option.label, iconPosition === "right" && iconElement] }) }));
+                }
+                // Render as plain text with icon
+                return (jsxs("div", { className: cn("inline-flex items-center gap-2", this.getAlignmentClass(), this.config.cellClassName, option.className), children: [iconPosition === "left" && iconElement, jsx("span", { children: option.label }), iconPosition === "right" && iconElement] }));
+            },
+        };
+    }
+}
+
+export { ActionsColumn, AvatarGroupColumn, BadgeColumn, ButtonColumn, CheckboxColumn, DateColumn, DropdownColumn, EnumColumn, IconColumn, ImageColumn, InputColumn, LinkColumn, NumberColumn, ProgressColumn, SelectColumn, TextColumn };
 //# sourceMappingURL=index.esm.js.map