@appcorp/shadcn 1.0.10

package/components/shadcn-io/table/index.d.ts

@@ -0,0 +1,60 @@
+import type { Cell, Column, ColumnDef, Header, HeaderGroup, Row, Table } from "@tanstack/react-table";
+import type { HTMLAttributes, ReactNode } from "react";
+import React from "react";
+export type { ColumnDef } from "@tanstack/react-table";
+export declare const TableContext: React.Context<{
+    data: unknown[];
+    columns: ColumnDef<unknown, unknown>[];
+    table: Table<unknown> | null;
+}>;
+export type TableProviderProps<TData, TValue> = {
+    columns: ColumnDef<TData, TValue>[];
+    data: TData[];
+    children: ReactNode;
+    className?: string;
+};
+export declare function TableProvider<TData, TValue>({ columns, data, children, className, }: TableProviderProps<TData, TValue>): React.JSX.Element;
+export type TableHeadProps = {
+    header: Header<unknown, unknown>;
+    className?: string;
+};
+export declare const TableHead: React.MemoExoticComponent<({ header, className }: TableHeadProps) => React.JSX.Element>;
+export type TableHeaderGroupProps = {
+    headerGroup: HeaderGroup<unknown>;
+    children: (props: {
+        header: Header<unknown, unknown>;
+    }) => ReactNode;
+};
+export declare const TableHeaderGroup: ({ headerGroup, children, }: TableHeaderGroupProps) => React.JSX.Element;
+export type TableHeaderProps = {
+    className?: string;
+    children: (props: {
+        headerGroup: HeaderGroup<unknown>;
+    }) => ReactNode;
+};
+export declare const TableHeader: ({ className, children }: TableHeaderProps) => React.JSX.Element;
+export interface TableColumnHeaderProps<TData, TValue> extends HTMLAttributes<HTMLDivElement> {
+    column: Column<TData, TValue>;
+    title: string;
+}
+export declare function TableColumnHeader<TData, TValue>({ column, title, className, }: TableColumnHeaderProps<TData, TValue>): React.JSX.Element;
+export type TableCellProps = {
+    cell: Cell<unknown, unknown>;
+    className?: string;
+};
+export declare const TableCell: ({ cell, className }: TableCellProps) => React.JSX.Element;
+export type TableRowProps = {
+    row: Row<unknown>;
+    children: (props: {
+        cell: Cell<unknown, unknown>;
+    }) => ReactNode;
+    className?: string;
+};
+export declare const TableRow: ({ row, children, className }: TableRowProps) => React.JSX.Element;
+export type TableBodyProps = {
+    children: (props: {
+        row: Row<unknown>;
+    }) => ReactNode;
+    className?: string;
+};
+export declare const TableBody: ({ children, className }: TableBodyProps) => React.JSX.Element;

package/components/shadcn-io/table/index.js

@@ -0,0 +1,138 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableBody = exports.TableRow = exports.TableCell = exports.TableHeader = exports.TableHeaderGroup = exports.TableHead = exports.TableContext = void 0;
+exports.TableProvider = TableProvider;
+exports.TableColumnHeader = TableColumnHeader;
+var react_table_1 = require("@tanstack/react-table");
+var jotai_1 = require("jotai");
+var lucide_react_1 = require("lucide-react");
+var react_1 = __importStar(require("react"));
+var button_1 = require("../../button");
+var dropdown_menu_1 = require("../../dropdown-menu");
+var table_1 = require("../../table");
+var utils_1 = require("../../../lib/utils");
+var sortingAtom = (0, jotai_1.atom)([]);
+exports.TableContext = (0, react_1.createContext)({
+    data: [],
+    columns: [],
+    table: null,
+});
+function TableProvider(_a) {
+    var columns = _a.columns, data = _a.data, children = _a.children, className = _a.className;
+    var _b = (0, jotai_1.useAtom)(sortingAtom), sorting = _b[0], setSorting = _b[1];
+    var table = (0, react_table_1.useReactTable)({
+        data: data,
+        columns: columns,
+        getCoreRowModel: (0, react_table_1.getCoreRowModel)(),
+        getSortedRowModel: (0, react_table_1.getSortedRowModel)(),
+        onSortingChange: function (updater) {
+            // @ts-expect-error updater is a function that returns a sorting object
+            var newSorting = updater(sorting);
+            setSorting(newSorting);
+        },
+        state: {
+            sorting: sorting,
+        },
+    });
+    return (react_1.default.createElement(exports.TableContext.Provider, { value: {
+            data: data,
+            columns: columns,
+            table: table,
+        } },
+        react_1.default.createElement(table_1.Table, { className: className }, children)));
+}
+exports.TableHead = (0, react_1.memo)(function (_a) {
+    var header = _a.header, className = _a.className;
+    return (react_1.default.createElement(table_1.TableHead, { className: className, key: header.id }, header.isPlaceholder
+        ? null
+        : (0, react_table_1.flexRender)(header.column.columnDef.header, header.getContext())));
+});
+exports.TableHead.displayName = "TableHead";
+var TableHeaderGroup = function (_a) {
+    var headerGroup = _a.headerGroup, children = _a.children;
+    return (react_1.default.createElement(table_1.TableRow, { key: headerGroup.id }, headerGroup.headers.map(function (header) { return children({ header: header }); })));
+};
+exports.TableHeaderGroup = TableHeaderGroup;
+var TableHeader = function (_a) {
+    var className = _a.className, children = _a.children;
+    var table = (0, react_1.useContext)(exports.TableContext).table;
+    return (react_1.default.createElement(table_1.TableHeader, { className: className }, table === null || table === void 0 ? void 0 : table.getHeaderGroups().map(function (headerGroup) { return children({ headerGroup: headerGroup }); })));
+};
+exports.TableHeader = TableHeader;
+function TableColumnHeader(_a) {
+    var column = _a.column, title = _a.title, className = _a.className;
+    // Extract inline event handlers to prevent unnecessary re-renders
+    var handleSortAsc = (0, react_1.useCallback)(function () {
+        column.toggleSorting(false);
+    }, [column]);
+    var handleSortDesc = (0, react_1.useCallback)(function () {
+        column.toggleSorting(true);
+    }, [column]);
+    if (!column.getCanSort()) {
+        return react_1.default.createElement("div", { className: (0, utils_1.cn)(className) }, title);
+    }
+    return (react_1.default.createElement("div", { className: (0, utils_1.cn)("flex items-center space-x-2", className) },
+        react_1.default.createElement(dropdown_menu_1.DropdownMenu, null,
+            react_1.default.createElement(dropdown_menu_1.DropdownMenuTrigger, { asChild: true },
+                react_1.default.createElement(button_1.Button, { className: "-ml-3 h-8 data-[state=open]:bg-accent", size: "sm", variant: "ghost" },
+                    react_1.default.createElement("span", null, title),
+                    column.getIsSorted() === "desc" ? (react_1.default.createElement(lucide_react_1.ArrowDownIcon, { className: "ml-2 h-4 w-4" })) : column.getIsSorted() === "asc" ? (react_1.default.createElement(lucide_react_1.ArrowUpIcon, { className: "ml-2 h-4 w-4" })) : (react_1.default.createElement(lucide_react_1.ChevronsUpDownIcon, { className: "ml-2 h-4 w-4" })))),
+            react_1.default.createElement(dropdown_menu_1.DropdownMenuContent, { align: "start" },
+                react_1.default.createElement(dropdown_menu_1.DropdownMenuItem, { onClick: handleSortAsc },
+                    react_1.default.createElement(lucide_react_1.ArrowUpIcon, { className: "mr-2 h-3.5 w-3.5 text-muted-foreground/70" }),
+                    "Asc"),
+                react_1.default.createElement(dropdown_menu_1.DropdownMenuItem, { onClick: handleSortDesc },
+                    react_1.default.createElement(lucide_react_1.ArrowDownIcon, { className: "mr-2 h-3.5 w-3.5 text-muted-foreground/70" }),
+                    "Desc")))));
+}
+var TableCell = function (_a) {
+    var cell = _a.cell, className = _a.className;
+    return (react_1.default.createElement(table_1.TableCell, { className: className }, (0, react_table_1.flexRender)(cell.column.columnDef.cell, cell.getContext())));
+};
+exports.TableCell = TableCell;
+var TableRow = function (_a) {
+    var row = _a.row, children = _a.children, className = _a.className;
+    return (react_1.default.createElement(table_1.TableRow, { className: className, "data-state": row.getIsSelected() && "selected", key: row.id }, row.getVisibleCells().map(function (cell) { return children({ cell: cell }); })));
+};
+exports.TableRow = TableRow;
+var TableBody = function (_a) {
+    var children = _a.children, className = _a.className;
+    var _b = (0, react_1.useContext)(exports.TableContext), columns = _b.columns, table = _b.table;
+    var rows = table === null || table === void 0 ? void 0 : table.getRowModel().rows;
+    return (react_1.default.createElement(table_1.TableBody, { className: className }, (rows === null || rows === void 0 ? void 0 : rows.length) ? (rows.map(function (row) { return children({ row: row }); })) : (react_1.default.createElement(table_1.TableRow, null,
+        react_1.default.createElement(table_1.TableCell, { className: "h-24 text-center", colSpan: columns.length }, "No results.")))));
+};
+exports.TableBody = TableBody;

package/components/sonner.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { ToasterProps } from "sonner";
+declare const Toaster: ({ ...props }: ToasterProps) => React.JSX.Element;
+export { Toaster };

package/components/sonner.js

@@ -0,0 +1,54 @@
+"use client";
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Toaster = void 0;
+var react_1 = __importDefault(require("react"));
+var next_themes_1 = require("next-themes");
+var sonner_1 = require("sonner");
+var Toaster = function (_a) {
+    var props = __rest(_a, []);
+    var _b = (0, next_themes_1.useTheme)().theme, theme = _b === void 0 ? "system" : _b;
+    return (react_1.default.createElement(sonner_1.Toaster, __assign({ theme: theme, position: "bottom-right", expand: true, richColors: true, closeButton: true, className: "toaster group", style: {
+            "--normal-bg": "var(--popover)",
+            "--normal-text": "var(--popover-foreground)",
+            "--normal-border": "var(--border)",
+        }, toastOptions: {
+            classNames: {
+                toast: "group toast group-[.toaster]:bg-popover group-[.toaster]:text-popover-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg group-[.toaster]:rounded-lg group-[.toaster]:backdrop-blur-md group-[.toaster]:bg-opacity-95",
+                description: "group-[.toast]:text-muted-foreground group-[.toast]:text-sm",
+                actionButton: "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground group-[.toast]:hover:bg-primary/90",
+                cancelButton: "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground group-[.toast]:hover:bg-muted/90",
+                closeButton: "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground group-[.toast]:border-border group-[.toast]:hover:bg-destructive group-[.toast]:hover:text-destructive-foreground group-[.toast]:hover:border-destructive group-[.toast]:focus:bg-destructive group-[.toast]:focus:text-destructive-foreground group-[.toast]:focus:border-destructive group-[.toast]:focus:outline-none group-[.toast]:focus:ring-2 group-[.toast]:focus:ring-destructive group-[.toast]:focus:ring-offset-2 group-[.toast]:focus:ring-offset-popover group-[.toast]:transition-all group-[.toast]:duration-200 group-[.toast]:ease-in-out group-[.toast]:rounded-md group-[.toast]:border group-[.toast]:shadow-md group-[.toast]:active:scale-95 group-[.toast]:hover:shadow-lg group-[.toast]:backdrop-blur-sm",
+            },
+            style: {
+                minWidth: "320px",
+                maxWidth: "420px",
+            },
+        } }, props)));
+};
+exports.Toaster = Toaster;

package/components/switch.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import * as SwitchPrimitive from "@radix-ui/react-switch";
+interface SwitchProps extends React.ComponentProps<typeof SwitchPrimitive.Root> {
+    error?: string;
+    info?: string;
+    label?: string;
+}
+declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export { Switch };

package/components/switch.js

@@ -0,0 +1,89 @@
+"use client";
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Switch = void 0;
+var React = __importStar(require("react"));
+var SwitchPrimitive = __importStar(require("@radix-ui/react-switch"));
+var utils_1 = require("../lib/utils");
+var label_1 = require("./label");
+var Switch = React.forwardRef(function (_a, ref) {
+    var className = _a.className, error = _a.error, info = _a.info, label = _a.label, required = _a.required, id = _a.id, props = __rest(_a, ["className", "error", "info", "label", "required", "id"]);
+    // Determine if there's an error (for aria-invalid and styling)
+    var hasError = Boolean(error);
+    var switchElement = (React.createElement(SwitchPrimitive.Root, __assign({ ref: ref, id: id, "data-slot": "switch", "aria-invalid": hasError, required: required, className: (0, utils_1.cn)("peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50", 
+        // Error state styling
+        hasError &&
+            "data-[state=checked]:bg-destructive data-[state=unchecked]:bg-destructive/20 border-destructive focus-visible:border-destructive focus-visible:ring-destructive/20", className) }, props),
+        React.createElement(SwitchPrimitive.Thumb, { "data-slot": "switch-thumb", className: (0, utils_1.cn)("bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0", 
+            // Error state thumb styling
+            hasError && "dark:data-[state=checked]:bg-destructive-foreground") })));
+    // If label is provided, render the complete switch with label structure
+    if (label) {
+        return (React.createElement("div", { className: "w-full space-y-2" },
+            React.createElement("div", { className: "flex items-center justify-between space-x-2" },
+                React.createElement(label_1.Label, { htmlFor: id, required: required }, label),
+                switchElement),
+            (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
+    }
+    // If no label, render just the switch with messages (backward compatibility)
+    return (React.createElement("div", { className: "w-full" },
+        switchElement,
+        (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
+});
+exports.Switch = Switch;
+Switch.displayName = SwitchPrimitive.Root.displayName;

package/components/table.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+declare function Table({ className, ...props }: React.ComponentProps<"table">): React.JSX.Element;
+declare function TableHeader({ className, ...props }: React.ComponentProps<"thead">): React.JSX.Element;
+declare function TableBody({ className, ...props }: React.ComponentProps<"tbody">): React.JSX.Element;
+declare function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">): React.JSX.Element;
+declare function TableRow({ className, ...props }: React.ComponentProps<"tr">): React.JSX.Element;
+declare function TableHead({ className, ...props }: React.ComponentProps<"th">): React.JSX.Element;
+declare function TableCell({ className, ...props }: React.ComponentProps<"td">): React.JSX.Element;
+declare function TableCaption({ className, ...props }: React.ComponentProps<"caption">): React.JSX.Element;
+export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption, };

package/components/table.js

@@ -0,0 +1,101 @@
+"use client";
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Table = Table;
+exports.TableHeader = TableHeader;
+exports.TableBody = TableBody;
+exports.TableFooter = TableFooter;
+exports.TableHead = TableHead;
+exports.TableRow = TableRow;
+exports.TableCell = TableCell;
+exports.TableCaption = TableCaption;
+var React = __importStar(require("react"));
+var utils_1 = require("../lib/utils");
+function Table(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (React.createElement("div", { "data-slot": "table-container", className: "relative w-full overflow-x-auto" },
+        React.createElement("table", __assign({ "data-slot": "table", className: (0, utils_1.cn)("w-full caption-bottom text-sm", className) }, props))));
+}
+function TableHeader(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (React.createElement("thead", __assign({ "data-slot": "table-header", className: (0, utils_1.cn)("[&_tr]:border-b", className) }, props)));
+}
+function TableBody(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (React.createElement("tbody", __assign({ "data-slot": "table-body", className: (0, utils_1.cn)("[&_tr:last-child]:border-0", className) }, props)));
+}
+function TableFooter(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (React.createElement("tfoot", __assign({ "data-slot": "table-footer", className: (0, utils_1.cn)("bg-muted/50 border-t font-medium [&>tr]:last:border-b-0", className) }, props)));
+}
+function TableRow(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (React.createElement("tr", __assign({ "data-slot": "table-row", className: (0, utils_1.cn)("hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors", className) }, props)));
+}
+function TableHead(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (React.createElement("th", __assign({ "data-slot": "table-head", className: (0, utils_1.cn)("text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className) }, props)));
+}
+function TableCell(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (React.createElement("td", __assign({ "data-slot": "table-cell", className: (0, utils_1.cn)("p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]", className) }, props)));
+}
+function TableCaption(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (React.createElement("caption", __assign({ "data-slot": "table-caption", className: (0, utils_1.cn)("text-muted-foreground mt-4 text-sm", className) }, props)));
+}

package/components/textarea.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+interface TextareaProps extends React.ComponentProps<"textarea"> {
+    error?: string;
+    info?: string;
+    label?: string;
+}
+declare const Textarea: React.ForwardRefExoticComponent<Omit<TextareaProps, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
+export { Textarea };

package/components/textarea.js

@@ -0,0 +1,86 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Textarea = void 0;
+var React = __importStar(require("react"));
+var utils_1 = require("../lib/utils");
+var label_1 = require("./label");
+var Textarea = React.forwardRef(function (_a, ref) {
+    var className = _a.className, error = _a.error, info = _a.info, label = _a.label, required = _a.required, id = _a.id, props = __rest(_a, ["className", "error", "info", "label", "required", "id"]);
+    // Determine if there's an error (for aria-invalid and styling)
+    var hasError = Boolean(error);
+    var textareaElement = (React.createElement("textarea", __assign({ ref: ref, id: id, "data-slot": "textarea", "aria-invalid": hasError, required: required, className: (0, utils_1.cn)("placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input min-h-[80px] w-full min-w-0 rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none resize-vertical disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", 
+        // Error state styling
+        hasError &&
+            "border-destructive focus-visible:border-destructive focus-visible:ring-destructive/20", 
+        // Normal state when no error
+        !hasError &&
+            "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", className) }, props)));
+    // If label is provided, render the complete textarea with label structure
+    if (label) {
+        return (React.createElement("div", { className: "w-full space-y-2" },
+            React.createElement(label_1.Label, { htmlFor: id, required: required }, label),
+            textareaElement,
+            (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
+    }
+    // If no label, render just the textarea with messages (backward compatibility)
+    return (React.createElement("div", { className: "w-full" },
+        textareaElement,
+        (error || info) && (React.createElement("div", null, error ? (React.createElement("p", { className: "text-xs text-destructive" }, error)) : info ? (React.createElement("p", { className: "text-xs text-blue-600 dark:text-blue-400" }, info)) : null))));
+});
+exports.Textarea = Textarea;
+Textarea.displayName = "Textarea";