lightswind
Version:
A collection of beautifully crafted React Components, Blocks & Templates for Modern Developers. Create stunning web applications effortlessly by using our 160+ professional and animated react components.
81 lines • 5.26 kB
JavaScript
;
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.TableCaption = exports.TableCell = exports.TableRow = exports.TableHead = exports.TableFooter = exports.TableBody = exports.TableHeader = exports.Table = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const React = __importStar(require("react"));
const utils_1 = require("@/components/lib/utils");
const Table = React.forwardRef(({ className, noScroll, ...props }, ref) => {
const table = ((0, jsx_runtime_1.jsx)("table", { ref: ref, className: (0, utils_1.cn)(`w-full text-sm text-left border-collapse`, className), ...props }));
if (noScroll)
return table;
return ((0, jsx_runtime_1.jsx)("div", { className: "relative w-full rounded-lg border border-gray-200 dark:border-zinc-800 bg-white dark:bg-black shadow-sm overflow-hidden", children: (0, jsx_runtime_1.jsx)("div", { className: "w-full overflow-auto max-h-[calc(80vh-70px)] custom-scrollbar", "data-lenis-prevent": true, children: table }) }));
});
exports.Table = Table;
Table.displayName = "Table";
const TableHeader = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("thead", { ref: ref, className: (0, utils_1.cn)(`sticky top-0 z-10 bg-white dark:bg-black`, // Explicit dark:bg-black for header
className), ...props })));
exports.TableHeader = TableHeader;
TableHeader.displayName = "TableHeader";
const TableBody = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("tbody", { ref: ref, className: (0, utils_1.cn)(`divide-y divide-gray-100 dark:divide-zinc-900`, className), ...props })));
exports.TableBody = TableBody;
TableBody.displayName = "TableBody";
const TableFooter = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("tfoot", { ref: ref, className: (0, utils_1.cn)(`border-t border-gray-200 dark:border-zinc-800 bg-gray-50 dark:bg-zinc-950 font-medium`, // Very dark gray for footer
className), ...props })));
exports.TableFooter = TableFooter;
TableFooter.displayName = "TableFooter";
const TableRow = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("tr", { ref: ref, className: (0, utils_1.cn)(`transition-colors hover:bg-gray-50/50 dark:hover:bg-zinc-900
data-[state=selected]:bg-gray-100 dark:data-[state=selected]:bg-zinc-800`, // Solid hover/selected background
className), ...props })));
exports.TableRow = TableRow;
TableRow.displayName = "TableRow";
const TableHead = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("th", { ref: ref, className: (0, utils_1.cn)(`h-12 px-6 text-left align-middle font-semibold
text-white bg-gradient-to-b from-zinc-800 to-zinc-950
dark:from-zinc-900 dark:to-zinc-950 dark:text-zinc-100
border-t border-t-white/10 dark:border-t-white/20
border-b border-b-zinc-900/50 dark:border-b-zinc-950
shadow-[inset_0_1px_0_0_rgba(255,255,255,0.15),0_1px_2px_0_rgba(0,0,0,0.05)]
dark:shadow-[inset_0_1px_0_0_rgba(255,255,255,0.2),0_1px_2px_0_rgba(0,0,0,0.05)]
[&:first-child]:rounded-tl-lg [&:last-child]:rounded-tr-lg`, className), ...props })));
exports.TableHead = TableHead;
TableHead.displayName = "TableHead";
const TableCell = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("td", { ref: ref, className: (0, utils_1.cn)(`p-4 align-middle text-gray-800 dark:text-gray-100`, // Slightly off-white for cell text
className), ...props })));
exports.TableCell = TableCell;
TableCell.displayName = "TableCell";
const TableCaption = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("caption", { ref: ref, className: (0, utils_1.cn)("mt-4 text-sm text-gray-500 dark:text-gray-400", className), ...props })));
exports.TableCaption = TableCaption;
TableCaption.displayName = "TableCaption";
//# sourceMappingURL=table.js.map