pixelize-design-library 2.3.1-beta.12 → 2.3.1-beta.13

package/.claude/settings.local.json

@@ -34,7 +34,8 @@
       "Bash(node -e \"console.log\\(require\\('./node_modules/pixelize-design-library/package.json'\\).version\\)\")",
       "Bash(node -e \"console.log\\(JSON.stringify\\(require\\('./node_modules/pixelize-authenticator/package.json'\\).dependencies\\)\\)\")",
       "Bash(node -e \"console.log\\(require\\('./node_modules/pixelize-authenticator/package.json'\\).version\\)\")",
-      "Bash(node -e \"console.log\\(require\\('./node_modules/pixelize-authenticator/node_modules/pixelize-design-library/package.json'\\).version\\)\")"
+      "Bash(node -e \"console.log\\(require\\('./node_modules/pixelize-authenticator/node_modules/pixelize-design-library/package.json'\\).version\\)\")",
+      "Bash(echo \"tsc exit code: $?\")"
     ],
     "additionalDirectories": [
       "/private/tmp",

package/dist/Components/CopyButton/CopyButton.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+export interface CopyButtonProps {
+    /** Text to write to the clipboard. */
+    value: string;
+    /** "icon" floating icon button, "button" icon + text, "menu-item" full-width row. */
+    variant?: "icon" | "button" | "menu-item";
+    /** Visible label for "button" / "menu-item" variants. */
+    label?: string;
+    /** Label shown briefly after a successful copy. */
+    copiedLabel?: string;
+    /** Tooltip text (icon variant). */
+    tooltip?: string;
+    /** ms to keep the "copied" state. */
+    feedbackDuration?: number;
+    /** Icon px size. */
+    iconSize?: number;
+    size?: "xs" | "sm" | "md";
+    /** Called after a successful copy. */
+    onCopy?: (value: string) => void;
+}
+declare const CopyButton: React.FC<CopyButtonProps>;
+export default CopyButton;

package/dist/Components/CopyButton/CopyButton.js

@@ -0,0 +1,126 @@
+"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;
+    };
+})();
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var react_2 = require("@chakra-ui/react");
+var lucide_react_1 = require("lucide-react");
+var useCustomTheme_1 = require("../../Theme/useCustomTheme");
+var ToolTip_1 = __importDefault(require("../ToolTip/ToolTip"));
+var CopyButton = function (_a) {
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+    var value = _a.value, _o = _a.variant, variant = _o === void 0 ? "icon" : _o, _p = _a.label, label = _p === void 0 ? "Copy" : _p, _q = _a.copiedLabel, copiedLabel = _q === void 0 ? "Copied!" : _q, _r = _a.tooltip, tooltip = _r === void 0 ? "Copy" : _r, _s = _a.feedbackDuration, feedbackDuration = _s === void 0 ? 1500 : _s, _t = _a.iconSize, iconSize = _t === void 0 ? 16 : _t, _u = _a.size, size = _u === void 0 ? "sm" : _u, onCopy = _a.onCopy;
+    var theme = (0, useCustomTheme_1.useCustomTheme)();
+    var _v = (0, react_1.useState)(false), copied = _v[0], setCopied = _v[1];
+    var timer = (0, react_1.useRef)();
+    (0, react_1.useEffect)(function () { return function () { return clearTimeout(timer.current); }; }, []);
+    var handleCopy = function (e) { return __awaiter(void 0, void 0, void 0, function () {
+        var _a;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
+                case 0:
+                    e.stopPropagation();
+                    _b.label = 1;
+                case 1:
+                    _b.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, navigator.clipboard.writeText(value)];
+                case 2:
+                    _b.sent();
+                    setCopied(true);
+                    onCopy === null || onCopy === void 0 ? void 0 : onCopy(value);
+                    clearTimeout(timer.current);
+                    timer.current = setTimeout(function () { return setCopied(false); }, feedbackDuration);
+                    return [3 /*break*/, 4];
+                case 3:
+                    _a = _b.sent();
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    var accent = theme.colors.primary[500];
+    var success = (_d = (_c = (_b = theme.colors.semantic) === null || _b === void 0 ? void 0 : _b.success) === null || _c === void 0 ? void 0 : _c[500]) !== null && _d !== void 0 ? _d : "#16A34A";
+    if (variant === "menu-item") {
+        return (react_1.default.createElement(react_2.Flex, { align: "center", gap: "0.5rem", px: "12px", py: "8px", width: "100%", cursor: "pointer", borderRadius: "6px", transition: "background 0.15s ease", _hover: { bg: (_f = (_e = theme.colors.gray) === null || _e === void 0 ? void 0 : _e[100]) !== null && _f !== void 0 ? _f : "#F1F5F9" }, onClick: handleCopy },
+            copied ? react_1.default.createElement(lucide_react_1.Check, { size: iconSize, color: success }) : react_1.default.createElement(lucide_react_1.Copy, { size: iconSize, color: accent }),
+            react_1.default.createElement(react_2.Box, { fontSize: "14px", fontWeight: 500, color: copied ? success : accent }, copied ? copiedLabel : label)));
+    }
+    if (variant === "button") {
+        return (react_1.default.createElement(react_2.Flex, { as: "button", align: "center", gap: "6px", px: "12px", py: "6px", borderRadius: "8px", border: "1px solid", borderColor: copied ? success : (_h = (_g = theme.colors.gray) === null || _g === void 0 ? void 0 : _g[200]) !== null && _h !== void 0 ? _h : "#E2E8F0", bg: "transparent", color: copied ? success : (_k = (_j = theme.colors.gray) === null || _j === void 0 ? void 0 : _j[700]) !== null && _k !== void 0 ? _k : "#2D3748", fontSize: "14px", fontWeight: 500, transition: "all 0.15s ease", _hover: { borderColor: accent, color: accent }, onClick: handleCopy },
+            copied ? react_1.default.createElement(lucide_react_1.Check, { size: iconSize }) : react_1.default.createElement(lucide_react_1.Copy, { size: iconSize }),
+            react_1.default.createElement(react_2.Text, null, copied ? copiedLabel : label)));
+    }
+    return (react_1.default.createElement(ToolTip_1.default, { label: copied ? copiedLabel : tooltip, placement: "top" },
+        react_1.default.createElement(react_2.IconButton, { "aria-label": tooltip, size: size, variant: "ghost", onClick: handleCopy, color: copied ? success : (_m = (_l = theme.colors.gray) === null || _l === void 0 ? void 0 : _l[500]) !== null && _m !== void 0 ? _m : "#718096", _hover: { color: accent, bg: theme.colors.primary[50] }, icon: copied ? react_1.default.createElement(lucide_react_1.Check, { size: iconSize }) : react_1.default.createElement(lucide_react_1.Copy, { size: iconSize }) })));
+};
+exports.default = CopyButton;

package/dist/Components/EmptyState/EmptyState.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { EmptyStateProps } from "./EmptyStateProps";
+declare const EmptyState: React.FC<EmptyStateProps>;
+export default EmptyState;

package/dist/Components/EmptyState/EmptyState.js

@@ -0,0 +1,65 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var react_2 = require("@chakra-ui/react");
+var lucide_react_1 = require("lucide-react");
+var react_3 = require("@emotion/react");
+var useCustomTheme_1 = require("../../Theme/useCustomTheme");
+var float = (0, react_3.keyframes)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  0%, 100% { transform: translateY(0); }\n  50% { transform: translateY(-8px); }\n"], ["\n  0%, 100% { transform: translateY(0); }\n  50% { transform: translateY(-8px); }\n"])));
+var sizeMap = {
+    sm: { badge: "48px", icon: 20, title: "0.95rem", desc: "0.8rem", gap: 2, pad: 6 },
+    md: { badge: "72px", icon: 30, title: "1.1rem", desc: "0.9rem", gap: 3, pad: 10 },
+    lg: { badge: "96px", icon: 40, title: "1.35rem", desc: "1rem", gap: 4, pad: 14 },
+};
+var EmptyState = function (_a) {
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+    var _m = _a.title, title = _m === void 0 ? "No data found" : _m, description = _a.description, _o = _a.icon, IconComp = _o === void 0 ? lucide_react_1.Inbox : _o, image = _a.image, _p = _a.size, size = _p === void 0 ? "md" : _p, _q = _a.colorScheme, colorScheme = _q === void 0 ? "primary" : _q, _r = _a.variant, variant = _r === void 0 ? "default" : _r, action = _a.action, _s = _a.animate, animate = _s === void 0 ? false : _s, _t = _a.minH, minH = _t === void 0 ? "240px" : _t, sx = _a.sx;
+    var theme = (0, useCustomTheme_1.useCustomTheme)();
+    var s = sizeMap[size];
+    // Resolve accent palette: theme.colors[colorScheme] or theme.colors.semantic[*]
+    var semantic = ["success", "error", "warning", "info"];
+    var palette = semantic.includes(colorScheme)
+        ? theme.colors.semantic[colorScheme]
+        : theme.colors[colorScheme];
+    var accent = (_b = palette === null || palette === void 0 ? void 0 : palette[500]) !== null && _b !== void 0 ? _b : theme.colors.primary[500];
+    var accentSoft = (_c = palette === null || palette === void 0 ? void 0 : palette[50]) !== null && _c !== void 0 ? _c : theme.colors.primary[50];
+    var containerStyles = variant === "subtle"
+        ? { bg: (_e = (_d = theme.colors.gray) === null || _d === void 0 ? void 0 : _d[50]) !== null && _e !== void 0 ? _e : "#F8FAFC", borderRadius: "16px" }
+        : variant === "dashed"
+            ? {
+                border: "2px dashed",
+                borderColor: (_g = (_f = theme.colors.gray) === null || _f === void 0 ? void 0 : _f[200]) !== null && _g !== void 0 ? _g : "#E2E8F0",
+                borderRadius: "16px",
+                bg: "transparent",
+            }
+            : {};
+    return (react_1.default.createElement(react_2.Flex, { direction: "column", align: "center", justify: "center", textAlign: "center", minH: minH, px: s.pad, py: s.pad, gap: s.gap, width: "100%", sx: __assign(__assign({}, containerStyles), sx) },
+        image ? (react_1.default.createElement(react_2.Image, { src: image, alt: title, boxSize: s.badge, objectFit: "contain", animation: animate ? "".concat(float, " 3s ease-in-out infinite") : undefined })) : (react_1.default.createElement(react_2.Flex, { align: "center", justify: "center", boxSize: s.badge, borderRadius: "full", bg: accentSoft, color: accent, animation: animate ? "".concat(float, " 3s ease-in-out infinite") : undefined, sx: {
+                boxShadow: "0 0 0 8px ".concat(accentSoft, "55"),
+            } },
+            react_1.default.createElement(IconComp, { size: s.icon, strokeWidth: 1.75 }))),
+        react_1.default.createElement(react_2.Box, null,
+            react_1.default.createElement(react_2.Text, { fontSize: s.title, fontWeight: 600, color: (_j = (_h = theme.colors.gray) === null || _h === void 0 ? void 0 : _h[800]) !== null && _j !== void 0 ? _j : "#1A202C", mt: 1 }, title),
+            description && (react_1.default.createElement(react_2.Text, { fontSize: s.desc, color: (_l = (_k = theme.colors.gray) === null || _k === void 0 ? void 0 : _k[500]) !== null && _l !== void 0 ? _l : "#718096", mt: 1, maxW: "380px" }, description))),
+        action && (react_1.default.createElement(react_2.Flex, { gap: 3, mt: 2, wrap: "wrap", justify: "center" }, action))));
+};
+exports.default = EmptyState;
+var templateObject_1;

package/dist/Components/EmptyState/EmptyStateProps.d.ts

@@ -0,0 +1,28 @@
+import { ElementType, ReactNode } from "react";
+import { BoxProps } from "@chakra-ui/react";
+export type EmptyStateSize = "sm" | "md" | "lg";
+export type EmptyStateColorScheme = "primary" | "secondary" | "tertiary" | "gray" | "success" | "error" | "warning" | "info";
+export interface EmptyStateProps {
+    /** Heading text. Defaults to "No data found". */
+    title?: string;
+    /** Supporting line under the title. */
+    description?: string;
+    /** A lucide-react (or any) icon component rendered inside the badge. */
+    icon?: ElementType;
+    /** Illustration image URL. When provided it replaces the icon badge. */
+    image?: string;
+    /** Controls spacing, icon and font sizes. */
+    size?: EmptyStateSize;
+    /** Accent color for the icon badge. */
+    colorScheme?: EmptyStateColorScheme;
+    /** "default" plain, "subtle" tinted card, "dashed" dashed-border drop zone. */
+    variant?: "default" | "subtle" | "dashed";
+    /** Action node(s) — usually a Button or a pair of buttons. */
+    action?: ReactNode;
+    /** Float the icon gently to draw attention. */
+    animate?: boolean;
+    /** Minimum height of the container. */
+    minH?: BoxProps["minH"];
+    /** Escape hatch for extra Chakra styles on the outer container. */
+    sx?: BoxProps["sx"];
+}

package/dist/Components/EmptyState/EmptyStateProps.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/FieldSelectModal/FieldSelectModal.d.ts

@@ -0,0 +1,26 @@
+import React from "react";
+export interface SelectableField {
+    /** Unique value committed on confirm. */
+    field_name: string;
+    /** Human-readable label. */
+    field_label: string;
+}
+export interface FieldSelectModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    fields: SelectableField[];
+    /** Called with the chosen field_name values. */
+    onConfirm: (selected: string[]) => void;
+    title?: string;
+    confirmText?: string;
+    loadingText?: string;
+    isLoading?: boolean;
+    /** Pre-selected field_name values. Defaults to all selected. */
+    defaultSelected?: string[];
+    /** Columns in the field grid. */
+    columns?: number;
+    /** Show the search box (auto-hidden under 8 fields by default). */
+    searchable?: boolean;
+}
+declare const FieldSelectModal: React.FC<FieldSelectModalProps>;
+export default FieldSelectModal;

package/dist/Components/FieldSelectModal/FieldSelectModal.js

@@ -0,0 +1,107 @@
+"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;
+    };
+})();
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var react_2 = require("@chakra-ui/react");
+var framer_motion_1 = require("framer-motion");
+var lucide_react_1 = require("lucide-react");
+var useCustomTheme_1 = require("../../Theme/useCustomTheme");
+var MotionModalContent = (0, framer_motion_1.motion)(react_2.ModalContent);
+var FieldSelectModal = function (_a) {
+    var _b, _c, _d, _e, _f, _g;
+    var isOpen = _a.isOpen, onClose = _a.onClose, fields = _a.fields, onConfirm = _a.onConfirm, _h = _a.title, title = _h === void 0 ? "Select Fields" : _h, _j = _a.confirmText, confirmText = _j === void 0 ? "Apply" : _j, _k = _a.loadingText, loadingText = _k === void 0 ? "Applying..." : _k, _l = _a.isLoading, isLoading = _l === void 0 ? false : _l, defaultSelected = _a.defaultSelected, _m = _a.columns, columns = _m === void 0 ? 2 : _m, searchable = _a.searchable;
+    var theme = (0, useCustomTheme_1.useCustomTheme)();
+    var _o = (0, react_1.useState)([]), selected = _o[0], setSelected = _o[1];
+    var _p = (0, react_1.useState)(""), query = _p[0], setQuery = _p[1];
+    (0, react_1.useEffect)(function () {
+        if (isOpen) {
+            setSelected(defaultSelected !== null && defaultSelected !== void 0 ? defaultSelected : fields.map(function (f) { return f.field_name; }));
+            setQuery("");
+        }
+    }, [isOpen, fields, defaultSelected]);
+    var showSearch = searchable !== null && searchable !== void 0 ? searchable : fields.length >= 8;
+    var visibleFields = (0, react_1.useMemo)(function () {
+        if (!query.trim())
+            return fields;
+        var q = query.toLowerCase();
+        return fields.filter(function (f) { return f.field_label.toLowerCase().includes(q); });
+    }, [fields, query]);
+    var toggle = function (name) {
+        return setSelected(function (prev) {
+            return prev.includes(name) ? prev.filter(function (f) { return f !== name; }) : __spreadArray(__spreadArray([], prev, true), [name], false);
+        });
+    };
+    var isAllSelected = selected.length === fields.length && fields.length > 0;
+    var isIndeterminate = selected.length > 0 && selected.length < fields.length;
+    return (react_1.default.createElement(react_2.Modal, { isOpen: isOpen, onClose: onClose, size: "xl", isCentered: true },
+        react_1.default.createElement(react_2.ModalOverlay, { bg: "blackAlpha.400", backdropFilter: "blur(4px)" }),
+        react_1.default.createElement(MotionModalContent, { borderRadius: "16px", overflow: "hidden", maxH: "85vh", initial: { opacity: 0, scale: 0.96, y: 8 }, animate: { opacity: 1, scale: 1, y: 0 }, transition: { duration: 0.2, ease: "easeOut" } },
+            react_1.default.createElement(react_2.ModalHeader, { pb: 2 },
+                react_1.default.createElement(react_2.Text, { fontSize: "lg", fontWeight: 600 }, title),
+                react_1.default.createElement(react_2.Text, { fontSize: "sm", color: (_c = (_b = theme.colors.gray) === null || _b === void 0 ? void 0 : _b[500]) !== null && _c !== void 0 ? _c : "#718096", fontWeight: 400 },
+                    selected.length,
+                    " of ",
+                    fields.length,
+                    " selected")),
+            react_1.default.createElement(react_2.ModalCloseButton, null),
+            react_1.default.createElement(react_2.ModalBody, { overflowY: "auto" },
+                react_1.default.createElement(react_2.Flex, { align: "center", justify: "space-between", mb: 3, gap: 3, wrap: "wrap" },
+                    react_1.default.createElement(react_2.Checkbox, { isChecked: isAllSelected, isIndeterminate: isIndeterminate, onChange: function (e) {
+                            return setSelected(e.target.checked ? fields.map(function (f) { return f.field_name; }) : []);
+                        }, fontWeight: 500 }, "Select all"),
+                    showSearch && (react_1.default.createElement(react_2.InputGroup, { size: "sm", maxW: "220px" },
+                        react_1.default.createElement(react_2.InputLeftElement, { pointerEvents: "none" },
+                            react_1.default.createElement(lucide_react_1.Search, { size: 15, color: (_e = (_d = theme.colors.gray) === null || _d === void 0 ? void 0 : _d[400]) !== null && _e !== void 0 ? _e : "#A0AEC0" })),
+                        react_1.default.createElement(react_2.Input, { placeholder: "Search fields", value: query, onChange: function (e) { return setQuery(e.target.value); }, borderRadius: "8px" })))),
+                react_1.default.createElement(react_2.SimpleGrid, { columns: columns, spacingX: 4, spacingY: 3 }, visibleFields.map(function (field) { return (react_1.default.createElement(react_2.Checkbox, { key: field.field_name, isChecked: selected.includes(field.field_name), onChange: function () { return toggle(field.field_name); } },
+                    react_1.default.createElement(react_2.Text, { fontSize: "sm" }, field.field_label))); })),
+                visibleFields.length === 0 && (react_1.default.createElement(react_2.Text, { fontSize: "sm", color: (_g = (_f = theme.colors.gray) === null || _f === void 0 ? void 0 : _f[500]) !== null && _g !== void 0 ? _g : "#718096", textAlign: "center", py: 6 },
+                    "No fields match \"",
+                    query,
+                    "\""))),
+            react_1.default.createElement(react_2.ModalFooter, { gap: 3 },
+                react_1.default.createElement(react_2.Button, { variant: "outline", colorScheme: "gray", size: "sm", onClick: onClose }, "Cancel"),
+                react_1.default.createElement(react_2.Button, { colorScheme: "primary", size: "sm", isLoading: isLoading, loadingText: loadingText, isDisabled: selected.length === 0, onClick: function () { return onConfirm(selected); } }, confirmText)))));
+};
+exports.default = FieldSelectModal;

package/dist/Components/FilePreview/FilePreview.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { FilePreviewProps, FilePreviewTriggerProps } from "./FilePreviewProps";
+export declare const FilePreview: React.FC<FilePreviewProps>;
+/** Thumbnail with a hover "preview" affordance that opens {@link FilePreview}. */
+export declare const FilePreviewTrigger: React.FC<FilePreviewTriggerProps>;
+export default FilePreview;

package/dist/Components/FilePreview/FilePreview.js

@@ -0,0 +1,190 @@
+"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;
+    };
+})();
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FilePreviewTrigger = exports.FilePreview = void 0;
+var react_1 = __importStar(require("react"));
+var react_2 = require("@chakra-ui/react");
+var framer_motion_1 = require("framer-motion");
+var lucide_react_1 = require("lucide-react");
+var useCustomTheme_1 = require("../../Theme/useCustomTheme");
+var ToolTip_1 = __importDefault(require("../ToolTip/ToolTip"));
+var MotionContent = (0, framer_motion_1.motion)(react_2.ModalContent);
+var inferKind = function (url, fileName) {
+    var src = (fileName || url).split("?")[0].toLowerCase();
+    if (/\.(png|jpe?g|gif|webp|svg|bmp|avif)$/.test(src))
+        return "image";
+    if (/\.pdf$/.test(src))
+        return "pdf";
+    if (/\.(mp4|webm|ogg|mov)$/.test(src))
+        return "video";
+    return "other";
+};
+var downloadFile = function (fileUrl, fileName) { return __awaiter(void 0, void 0, void 0, function () {
+    var res, blob, url, link, _a;
+    return __generator(this, function (_b) {
+        switch (_b.label) {
+            case 0:
+                _b.trys.push([0, 3, , 4]);
+                return [4 /*yield*/, fetch(fileUrl)];
+            case 1:
+                res = _b.sent();
+                return [4 /*yield*/, res.blob()];
+            case 2:
+                blob = _b.sent();
+                url = window.URL.createObjectURL(blob);
+                link = document.createElement("a");
+                link.href = url;
+                link.download = fileName || "file";
+                document.body.appendChild(link);
+                link.click();
+                document.body.removeChild(link);
+                window.URL.revokeObjectURL(url);
+                return [3 /*break*/, 4];
+            case 3:
+                _a = _b.sent();
+                window.open(fileUrl, "_blank", "noopener,noreferrer");
+                return [3 /*break*/, 4];
+            case 4: return [2 /*return*/];
+        }
+    });
+}); };
+var FilePreview = function (_a) {
+    var _b, _c, _d, _e, _f;
+    var isOpen = _a.isOpen, onClose = _a.onClose, fileUrl = _a.fileUrl, fileName = _a.fileName, fileType = _a.fileType, _g = _a.hideDownload, hideDownload = _g === void 0 ? false : _g, _h = _a.size, size = _h === void 0 ? "xl" : _h;
+    var theme = (0, useCustomTheme_1.useCustomTheme)();
+    var _j = (0, react_1.useState)(1), zoom = _j[0], setZoom = _j[1];
+    var _k = (0, react_1.useState)(0), rotation = _k[0], setRotation = _k[1];
+    var kind = fileType || inferKind(fileUrl, fileName);
+    var reset = function () {
+        setZoom(1);
+        setRotation(0);
+    };
+    var handleClose = function () {
+        reset();
+        onClose();
+    };
+    var renderBody = function () {
+        var _a, _b, _c, _d;
+        if (kind === "image") {
+            return (react_1.default.createElement(react_2.Flex, { justify: "center", align: "center", minH: "200px", overflow: "hidden" },
+                react_1.default.createElement(react_2.Image, { src: fileUrl, alt: fileName || "preview", maxW: "100%", transform: "scale(".concat(zoom, ") rotate(").concat(rotation, "deg)"), transition: "transform 0.2s ease", objectFit: "contain" })));
+        }
+        if (kind === "pdf") {
+            return (react_1.default.createElement(react_2.Box, { as: "embed", src: fileUrl, type: "application/pdf", width: "100%", height: "70vh", borderRadius: "8px" }));
+        }
+        if (kind === "video") {
+            return (react_1.default.createElement(react_2.Box, { as: "video", src: fileUrl, controls: true, width: "100%", borderRadius: "8px" }));
+        }
+        return (react_1.default.createElement(react_2.Flex, { direction: "column", align: "center", justify: "center", py: 12, gap: 3 },
+            react_1.default.createElement(lucide_react_1.FileQuestion, { size: 48, color: (_b = (_a = theme.colors.gray) === null || _a === void 0 ? void 0 : _a[400]) !== null && _b !== void 0 ? _b : "#A0AEC0" }),
+            react_1.default.createElement(react_2.Text, { color: (_d = (_c = theme.colors.gray) === null || _c === void 0 ? void 0 : _c[600]) !== null && _d !== void 0 ? _d : "#4A5568", fontSize: "sm" }, "Preview isn't available for this file type."),
+            !hideDownload && (react_1.default.createElement(react_2.Flex, { as: "button", align: "center", gap: 2, px: 4, py: 2, borderRadius: "8px", bg: theme.colors.primary[500], color: theme.colors.white, fontSize: "sm", fontWeight: 500, onClick: function () { return downloadFile(fileUrl, fileName); } },
+                react_1.default.createElement(lucide_react_1.Download, { size: 16 }),
+                " Download file"))));
+    };
+    return (react_1.default.createElement(react_2.Modal, { isOpen: isOpen, onClose: handleClose, size: size, isCentered: true },
+        react_1.default.createElement(react_2.ModalOverlay, { bg: "blackAlpha.600", backdropFilter: "blur(4px)" }),
+        react_1.default.createElement(MotionContent, { borderRadius: "16px", overflow: "hidden", initial: { opacity: 0, scale: 0.96, y: 8 }, animate: { opacity: 1, scale: 1, y: 0 }, transition: { duration: 0.2, ease: "easeOut" } },
+            react_1.default.createElement(react_2.Flex, { align: "center", justify: "space-between", px: 4, py: 3, borderBottom: "1px solid", borderColor: (_c = (_b = theme.colors.gray) === null || _b === void 0 ? void 0 : _b[100]) !== null && _c !== void 0 ? _c : "#EDF2F7" },
+                react_1.default.createElement(ToolTip_1.default, { label: fileName || "File", placement: "bottom" },
+                    react_1.default.createElement(react_2.Text, { fontSize: "sm", fontWeight: 600, maxW: "60%", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, fileName || "Preview")),
+                react_1.default.createElement(react_2.Flex, { align: "center", gap: 1 },
+                    kind === "image" && (react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement(ToolTip_1.default, { label: "Zoom out", placement: "bottom" },
+                            react_1.default.createElement(react_2.IconButton, { "aria-label": "Zoom out", size: "sm", variant: "ghost", icon: react_1.default.createElement(lucide_react_1.Minus, { size: 16 }), onClick: function () { return setZoom(function (z) { return Math.max(0.25, z - 0.25); }); } })),
+                        react_1.default.createElement(ToolTip_1.default, { label: "Zoom in", placement: "bottom" },
+                            react_1.default.createElement(react_2.IconButton, { "aria-label": "Zoom in", size: "sm", variant: "ghost", icon: react_1.default.createElement(lucide_react_1.Plus, { size: 16 }), onClick: function () { return setZoom(function (z) { return Math.min(4, z + 0.25); }); } })),
+                        react_1.default.createElement(ToolTip_1.default, { label: "Rotate", placement: "bottom" },
+                            react_1.default.createElement(react_2.IconButton, { "aria-label": "Rotate", size: "sm", variant: "ghost", icon: react_1.default.createElement(lucide_react_1.RotateCw, { size: 16 }), onClick: function () { return setRotation(function (r) { return (r + 90) % 360; }); } })))),
+                    !hideDownload && (react_1.default.createElement(ToolTip_1.default, { label: "Download", placement: "bottom" },
+                        react_1.default.createElement(react_2.IconButton, { "aria-label": "Download", size: "sm", variant: "ghost", color: (_f = (_e = (_d = theme.colors.semantic) === null || _d === void 0 ? void 0 : _d.success) === null || _e === void 0 ? void 0 : _e[500]) !== null && _f !== void 0 ? _f : "#16A34A", icon: react_1.default.createElement(lucide_react_1.Download, { size: 18 }), onClick: function () { return downloadFile(fileUrl, fileName); } }))),
+                    react_1.default.createElement(react_2.ModalCloseButton, { position: "static" }))),
+            react_1.default.createElement(react_2.ModalBody, { p: 5 }, renderBody()))));
+};
+exports.FilePreview = FilePreview;
+/** Thumbnail with a hover "preview" affordance that opens {@link FilePreview}. */
+var FilePreviewTrigger = function (_a) {
+    var fileUrl = _a.fileUrl, fileName = _a.fileName, fileType = _a.fileType, _b = _a.thumbWidth, thumbWidth = _b === void 0 ? "100px" : _b, _c = _a.thumbHeight, thumbHeight = _c === void 0 ? "60px" : _c, _d = _a.hideDownload, hideDownload = _d === void 0 ? false : _d;
+    var _e = (0, react_2.useDisclosure)(), isOpen = _e.isOpen, onOpen = _e.onOpen, onClose = _e.onClose;
+    var kind = fileType || inferKind(fileUrl, fileName);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(react_2.Box, { position: "relative", display: "inline-flex", alignItems: "center", justifyContent: "center", role: "group", maxW: thumbWidth, minW: "40px", minH: thumbHeight, borderRadius: "8px", overflow: "hidden", cursor: "pointer", onClick: onOpen },
+            kind === "image" ? (react_1.default.createElement(react_2.Image, { src: fileUrl, alt: fileName || "file", maxH: thumbHeight, maxW: thumbWidth, objectFit: "contain", borderRadius: "8px" })) : (react_1.default.createElement(react_2.Flex, { align: "center", justify: "center", boxSize: thumbHeight, bg: "gray.100", borderRadius: "8px" },
+                react_1.default.createElement(lucide_react_1.Eye, { size: 18 }))),
+            react_1.default.createElement(react_2.Flex, { position: "absolute", inset: 0, align: "center", justify: "center", bg: "blackAlpha.500", color: "white", opacity: 0, transition: "opacity 0.15s ease", _groupHover: { opacity: 1 } },
+                react_1.default.createElement(lucide_react_1.Eye, { size: 18 }))),
+        react_1.default.createElement(exports.FilePreview, { isOpen: isOpen, onClose: onClose, fileUrl: fileUrl, fileName: fileName, fileType: fileType, hideDownload: hideDownload })));
+};
+exports.FilePreviewTrigger = FilePreviewTrigger;
+exports.default = exports.FilePreview;

package/dist/Components/FilePreview/FilePreviewProps.d.ts

@@ -0,0 +1,26 @@
+export type FilePreviewKind = "image" | "pdf" | "video" | "other";
+export interface FilePreviewProps {
+    isOpen: boolean;
+    onClose: () => void;
+    /** URL of the file to preview. */
+    fileUrl: string;
+    /** Display name (also used as the download filename). */
+    fileName?: string;
+    /** Force a renderer. When omitted it is inferred from the file extension. */
+    fileType?: FilePreviewKind;
+    /** Hide the download action. */
+    hideDownload?: boolean;
+    /** Modal size. */
+    size?: "md" | "lg" | "xl" | "2xl" | "full";
+}
+export interface FilePreviewTriggerProps {
+    /** URL of the file. */
+    fileUrl: string;
+    fileName?: string;
+    fileType?: FilePreviewKind;
+    /** Thumbnail max width. */
+    thumbWidth?: string;
+    /** Thumbnail max height. */
+    thumbHeight?: string;
+    hideDownload?: boolean;
+}

package/dist/Components/FilePreview/FilePreviewProps.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/LazyWrapper/LazyWrapper.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export interface LazyWrapperProps {
+    children: React.ReactNode;
+    /** Custom fallback node. Overrides the default spinner. */
+    fallback?: React.ReactNode;
+    /** Min height of the default fallback container. */
+    minHeight?: string;
+}
+declare const LazyWrapper: React.FC<LazyWrapperProps>;
+export default LazyWrapper;

package/dist/Components/LazyWrapper/LazyWrapper.js

@@ -0,0 +1,50 @@
+"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 });
+var react_1 = __importStar(require("react"));
+var react_2 = require("@chakra-ui/react");
+var useCustomTheme_1 = require("../../Theme/useCustomTheme");
+var DefaultFallback = function (_a) {
+    var _b, _c;
+    var minHeight = _a.minHeight;
+    var theme = (0, useCustomTheme_1.useCustomTheme)();
+    return (react_1.default.createElement(react_2.Box, { display: "flex", alignItems: "center", justifyContent: "center", minHeight: minHeight, width: "100%", p: "2rem" },
+        react_1.default.createElement(react_2.Spinner, { thickness: "3px", speed: "0.65s", size: "lg", emptyColor: (_c = (_b = theme.colors.gray) === null || _b === void 0 ? void 0 : _b[100]) !== null && _c !== void 0 ? _c : "#EDF2F7", color: theme.colors.primary[500] })));
+};
+var LazyWrapper = function (_a) {
+    var children = _a.children, fallback = _a.fallback, _b = _a.minHeight, minHeight = _b === void 0 ? "400px" : _b;
+    return (react_1.default.createElement(react_1.Suspense, { fallback: fallback !== null && fallback !== void 0 ? fallback : react_1.default.createElement(DefaultFallback, { minHeight: minHeight }) }, children));
+};
+exports.default = LazyWrapper;

package/dist/Components/MoreItems/MoreItems.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { MoreItemsProps } from "./MoreItemsProps";
+declare const MoreItems: React.FC<MoreItemsProps>;
+export default MoreItems;

package/dist/Components/MoreItems/MoreItems.js

@@ -0,0 +1,35 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var react_2 = require("@chakra-ui/react");
+var useCustomTheme_1 = require("../../Theme/useCustomTheme");
+var MoreItems = function (_a) {
+    var _b, _c;
+    var items = _a.items, moreCount = _a.moreCount, triggerText = _a.triggerText, colorResolver = _a.colorResolver, _d = _a.hideDots, hideDots = _d === void 0 ? false : _d, _e = _a.columns, columns = _e === void 0 ? 2 : _e, _f = _a.minWidth, minWidth = _f === void 0 ? "260px" : _f, _g = _a.triggerMaxWidth, triggerMaxWidth = _g === void 0 ? "250px" : _g, _h = _a.trigger, trigger = _h === void 0 ? "hover" : _h, _j = _a.placement, placement = _j === void 0 ? "bottom-start" : _j;
+    var theme = (0, useCustomTheme_1.useCustomTheme)();
+    var count = moreCount !== null && moreCount !== void 0 ? moreCount : items.length;
+    if (count <= 0)
+        return triggerText ? react_1.default.createElement(react_1.default.Fragment, null, triggerText) : null;
+    return (react_1.default.createElement(react_2.Popover, { trigger: trigger, placement: placement, isLazy: true },
+        react_1.default.createElement(react_2.PopoverTrigger, null,
+            react_1.default.createElement(react_2.Box, { display: "inline-flex", alignItems: "center", maxW: triggerMaxWidth, cursor: "pointer" },
+                triggerText !== undefined && (react_1.default.createElement(react_2.Box, { as: "span", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, triggerText)),
+                react_1.default.createElement(react_2.Box, { as: "span", ml: "6px", px: "8px", py: "1px", fontSize: "12px", fontWeight: 600, lineHeight: "1.4", borderRadius: "full", color: (_b = theme.colors.primary[600]) !== null && _b !== void 0 ? _b : theme.colors.primary[500], bg: theme.colors.primary[50], transition: "all 0.15s ease", _hover: { bg: (_c = theme.colors.primary[100]) !== null && _c !== void 0 ? _c : theme.colors.primary[50] } },
+                    "+",
+                    count,
+                    " more"))),
+        react_1.default.createElement(react_2.PopoverContent, { width: "auto", minWidth: minWidth, maxH: "280px", overflowY: "auto", borderRadius: "12px", boxShadow: "0 8px 24px rgba(0,0,0,0.12)", _focus: { outline: "none", boxShadow: "0 8px 24px rgba(0,0,0,0.12)" } },
+            react_1.default.createElement(react_2.PopoverArrow, null),
+            react_1.default.createElement(react_2.PopoverBody, { p: 3 },
+                react_1.default.createElement(react_2.SimpleGrid, { columns: columns, spacingX: 4, spacingY: 2 }, items === null || items === void 0 ? void 0 : items.map(function (item, index) {
+                    var _a, _b, _c, _d, _e, _f, _g;
+                    var color = (_b = (_a = item.color) !== null && _a !== void 0 ? _a : colorResolver === null || colorResolver === void 0 ? void 0 : colorResolver(item)) !== null && _b !== void 0 ? _b : ((_d = (_c = theme.colors.gray) === null || _c === void 0 ? void 0 : _c[400]) !== null && _d !== void 0 ? _d : "#A0AEC0");
+                    return (react_1.default.createElement(react_2.Box, { key: (_e = item.id) !== null && _e !== void 0 ? _e : index, display: "flex", alignItems: "center", gap: "8px", minW: 0 },
+                        !hideDots && (react_1.default.createElement(react_2.Box, { flexShrink: 0, width: "8px", height: "8px", borderRadius: "full", bg: color })),
+                        react_1.default.createElement(react_2.Text, { fontSize: "13px", color: (_g = (_f = theme.colors.gray) === null || _f === void 0 ? void 0 : _f[700]) !== null && _g !== void 0 ? _g : "#2D3748", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, item.label)));
+                }))))));
+};
+exports.default = MoreItems;

package/dist/Components/MoreItems/MoreItemsProps.d.ts

@@ -0,0 +1,29 @@
+import { ReactNode } from "react";
+export interface MoreItem {
+    id: string | number;
+    label: string;
+    /** Optional leading dot color. Falls back to colorResolver or a neutral gray. */
+    color?: string;
+}
+export interface MoreItemsProps {
+    /** Items shown inside the popover. */
+    items: MoreItem[];
+    /** Number rendered in the "+N more" trigger. Defaults to items.length. */
+    moreCount?: number;
+    /** Text shown before the "+N more" pill (e.g. the first visible value). */
+    triggerText?: ReactNode;
+    /** Derive a dot color per item; takes precedence is given to item.color. */
+    colorResolver?: (item: MoreItem) => string | undefined;
+    /** Hide the colored leading dot entirely. */
+    hideDots?: boolean;
+    /** Columns inside the popover grid. */
+    columns?: number;
+    /** Min width of the popover panel. */
+    minWidth?: string;
+    /** Max width of the trigger before truncation. */
+    triggerMaxWidth?: string;
+    /** Open on "hover" (default) or "click". */
+    trigger?: "hover" | "click";
+    /** Popover placement. */
+    placement?: "bottom-start" | "bottom-end" | "bottom" | "top" | "right" | "left";
+}

package/dist/Components/MoreItems/MoreItemsProps.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Components/PdfViewer/PdfViewer.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+export interface PdfViewerProps {
+    /** URL of the PDF to embed. */
+    pdfUrl: string;
+    /** File name shown in the toolbar. */
+    fileName?: string;
+    /** Height of the embed. */
+    height?: string;
+    /** Show the toolbar (name + open + download). */
+    showToolbar?: boolean;
+    /** Border radius of the frame. */
+    borderRadius?: string;
+}
+declare const PdfViewer: React.FC<PdfViewerProps>;
+export default PdfViewer;

package/dist/Components/PdfViewer/PdfViewer.js

@@ -0,0 +1,29 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var react_2 = require("@chakra-ui/react");
+var lucide_react_1 = require("lucide-react");
+var useCustomTheme_1 = require("../../Theme/useCustomTheme");
+var ToolTip_1 = __importDefault(require("../ToolTip/ToolTip"));
+var PdfViewer = function (_a) {
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+    var pdfUrl = _a.pdfUrl, _p = _a.fileName, fileName = _p === void 0 ? "Document.pdf" : _p, _q = _a.height, height = _q === void 0 ? "480px" : _q, _r = _a.showToolbar, showToolbar = _r === void 0 ? true : _r, _s = _a.borderRadius, borderRadius = _s === void 0 ? "12px" : _s;
+    var theme = (0, useCustomTheme_1.useCustomTheme)();
+    return (react_1.default.createElement(react_2.Box, { border: "1px solid", borderColor: (_c = (_b = theme.colors.gray) === null || _b === void 0 ? void 0 : _b[200]) !== null && _c !== void 0 ? _c : "#E2E8F0", borderRadius: borderRadius, overflow: "hidden", bg: theme.colors.white },
+        showToolbar && (react_1.default.createElement(react_2.Flex, { align: "center", justify: "space-between", px: 4, py: 2.5, borderBottom: "1px solid", borderColor: (_e = (_d = theme.colors.gray) === null || _d === void 0 ? void 0 : _d[100]) !== null && _e !== void 0 ? _e : "#EDF2F7", bg: (_g = (_f = theme.colors.gray) === null || _f === void 0 ? void 0 : _f[50]) !== null && _g !== void 0 ? _g : "#F8FAFC" },
+            react_1.default.createElement(react_2.Flex, { align: "center", gap: 2, minW: 0 },
+                react_1.default.createElement(lucide_react_1.FileText, { size: 18, color: theme.colors.primary[500] }),
+                react_1.default.createElement(react_2.Text, { fontSize: "sm", fontWeight: 500, color: (_j = (_h = theme.colors.gray) === null || _h === void 0 ? void 0 : _h[700]) !== null && _j !== void 0 ? _j : "#2D3748", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, fileName)),
+            react_1.default.createElement(react_2.Flex, { align: "center", gap: 1 },
+                react_1.default.createElement(ToolTip_1.default, { label: "Open in new tab", placement: "top" },
+                    react_1.default.createElement(react_2.Box, { as: "a", href: pdfUrl, target: "_blank", rel: "noopener noreferrer", p: 2, borderRadius: "8px", color: (_l = (_k = theme.colors.gray) === null || _k === void 0 ? void 0 : _k[600]) !== null && _l !== void 0 ? _l : "#4A5568", _hover: { bg: theme.colors.primary[50], color: theme.colors.primary[500] } },
+                        react_1.default.createElement(lucide_react_1.ExternalLink, { size: 16 }))),
+                react_1.default.createElement(ToolTip_1.default, { label: "Download", placement: "top" },
+                    react_1.default.createElement(react_2.Box, { as: "a", href: pdfUrl, download: fileName, p: 2, borderRadius: "8px", color: (_o = (_m = theme.colors.gray) === null || _m === void 0 ? void 0 : _m[600]) !== null && _o !== void 0 ? _o : "#4A5568", _hover: { bg: theme.colors.primary[50], color: theme.colors.primary[500] } },
+                        react_1.default.createElement(lucide_react_1.Download, { size: 16 })))))),
+        react_1.default.createElement(react_2.Box, { as: "embed", src: pdfUrl, type: "application/pdf", width: "100%", height: height, display: "block" })));
+};
+exports.default = PdfViewer;

package/dist/Components/ScrollToTop/ScrollToTop.d.ts

@@ -0,0 +1,19 @@
+import React from "react";
+export interface ScrollToTopProps {
+    /** Content to wrap. The button watches the nearest scrollable ancestor. */
+    children: React.ReactNode;
+    /** Tooltip label on the button. */
+    tooltipLabel?: string;
+    /** Scroll distance (px) after which the button appears. */
+    threshold?: number;
+    /** Smooth-scroll duration in ms. */
+    duration?: number;
+    /** Pin to a window-level scroll instead of the wrapped parent. */
+    useWindow?: boolean;
+    /** Distance from the bottom edge. */
+    bottom?: string;
+    /** Distance from the right edge. */
+    right?: string;
+}
+declare const ScrollToTop: React.FC<ScrollToTopProps>;
+export default ScrollToTop;

package/dist/Components/ScrollToTop/ScrollToTop.js

@@ -0,0 +1,104 @@
+"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;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var react_2 = require("@chakra-ui/react");
+var lucide_react_1 = require("lucide-react");
+var useCustomTheme_1 = require("../../Theme/useCustomTheme");
+var ToolTip_1 = __importDefault(require("../ToolTip/ToolTip"));
+var ScrollToTop = function (_a) {
+    var _b;
+    var children = _a.children, _c = _a.tooltipLabel, tooltipLabel = _c === void 0 ? "Scroll to top" : _c, _d = _a.threshold, threshold = _d === void 0 ? 300 : _d, _e = _a.duration, duration = _e === void 0 ? 600 : _e, _f = _a.useWindow, useWindow = _f === void 0 ? false : _f, _g = _a.bottom, bottom = _g === void 0 ? "2rem" : _g, _h = _a.right, right = _h === void 0 ? "2rem" : _h;
+    var _j = (0, react_1.useState)(false), visible = _j[0], setVisible = _j[1];
+    var anchorRef = (0, react_1.useRef)(null);
+    var theme = (0, useCustomTheme_1.useCustomTheme)();
+    var getScroller = function () {
+        var _a, _b;
+        if (useWindow)
+            return window;
+        return (_b = (_a = anchorRef.current) === null || _a === void 0 ? void 0 : _a.parentElement) !== null && _b !== void 0 ? _b : null;
+    };
+    var handleScroll = function () {
+        var _a;
+        var scroller = getScroller();
+        var top = scroller === window
+            ? window.scrollY
+            : (_a = scroller === null || scroller === void 0 ? void 0 : scroller.scrollTop) !== null && _a !== void 0 ? _a : 0;
+        setVisible(top >= threshold);
+    };
+    var scrollToTop = function () {
+        var scroller = getScroller();
+        if (!scroller)
+            return;
+        var start = scroller === window ? window.scrollY : scroller.scrollTop;
+        var startTime = performance.now();
+        var step = function (now) {
+            var progress = Math.min((now - startTime) / duration, 1);
+            var eased = progress < 0.5
+                ? 2 * progress * progress
+                : -1 + (4 - 2 * progress) * progress;
+            var next = start * (1 - eased);
+            if (scroller === window)
+                window.scrollTo(0, next);
+            else
+                scroller.scrollTop = next;
+            if (progress < 1)
+                requestAnimationFrame(step);
+        };
+        requestAnimationFrame(step);
+    };
+    (0, react_1.useEffect)(function () {
+        var scroller = getScroller();
+        if (!scroller)
+            return;
+        scroller.addEventListener("scroll", handleScroll);
+        handleScroll();
+        return function () { return scroller.removeEventListener("scroll", handleScroll); };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [useWindow, threshold]);
+    return (react_1.default.createElement(react_2.Box, { ref: anchorRef, position: "relative" },
+        children,
+        react_1.default.createElement(ToolTip_1.default, { label: tooltipLabel, placement: "left" },
+            react_1.default.createElement(react_2.Box, { onClick: scrollToTop, role: "button", "aria-label": tooltipLabel, position: "fixed", bottom: bottom, right: right, zIndex: 1000, display: "flex", alignItems: "center", justifyContent: "center", boxSize: "44px", borderRadius: "full", cursor: "pointer", bg: theme.colors.primary[500], color: theme.colors.white, boxShadow: "0 4px 14px rgba(0,0,0,0.25)", opacity: visible ? 1 : 0, transform: visible ? "translateY(0) scale(1)" : "translateY(16px) scale(0.85)", pointerEvents: visible ? "auto" : "none", transition: "all 0.25s cubic-bezier(0.16, 1, 0.3, 1)", _hover: {
+                    bg: (_b = theme.colors.primary[600]) !== null && _b !== void 0 ? _b : theme.colors.primary[500],
+                    transform: "translateY(-2px) scale(1.05)",
+                    boxShadow: "0 6px 20px rgba(0,0,0,0.3)",
+                }, _active: { transform: "scale(0.95)" } },
+                react_1.default.createElement(lucide_react_1.ChevronUp, { size: 24, strokeWidth: 2.5 })))));
+};
+exports.default = ScrollToTop;

package/dist/Components/Table/components/TableHeader.js

@@ -71,8 +71,8 @@ var TableHeader = function (_a) {
         theme.colors,
     ]);
     var RenderConent = (0, react_2.useCallback)(function () {
-        var _a, _b, _c;
-        return (react_2.default.createElement(react_1.Th, { w: 6, minW: "35px", p: 0, backgroundColor: (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.secondary) === null || _b === void 0 ? void 0 : _b[50], borderBottom: noBorders ? "none" : "0.063rem solid ".concat((_c = theme.colors) === null || _c === void 0 ? void 0 : _c.gray[300]), position: "sticky", className: "columns sticky-columns", left: "0px", zIndex: 1 }));
+        var _a, _b, _c, _d, _e, _f, _g;
+        return (react_2.default.createElement(react_1.Th, { w: 6, minW: "35px", p: 0, backgroundColor: (_d = (_c = (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.table) === null || _b === void 0 ? void 0 : _b.hover) === null || _c === void 0 ? void 0 : _c[200]) !== null && _d !== void 0 ? _d : (_f = (_e = theme.colors) === null || _e === void 0 ? void 0 : _e.secondary) === null || _f === void 0 ? void 0 : _f[50], borderBottom: noBorders ? "none" : "0.063rem solid ".concat((_g = theme.colors) === null || _g === void 0 ? void 0 : _g.gray[300]), position: "sticky", className: "columns sticky-columns", left: "0px", zIndex: 1 }));
     }, [noBorders, theme.colors]);
     var RenderView = (0, react_2.useCallback)(function () {
         var _a, _b, _c, _d, _e, _f, _g;

package/dist/index.d.ts

@@ -60,5 +60,13 @@ import ApexLineChart from "./Components/Apexcharts/ApexLineChart/ApexLineChart";
 import Notification from "./Components/Notification/Notification";
 import DatePicker from "./Components/DatePicker/ThemeDatePicker";
 import FilterSidebar from "./Components/FilterSidebar/FilterSidebar";
-export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexPolarChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, ContactForm, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, FileUpload, FileUploader, FilterSidebar, FormWrapper, Header, HeaderActions, InputTextArea, InputSwitch, KanbanBoard, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, Notification, NoteTextArea, MultiSelect, NumberInput, PaymentCard, PhoneNumberInput, PinInput, ProductCard, ProductDetails, ProfileCard, ProfileCardHeader, ProfileCardBody, ProfileCardFooter, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Reorder, Search, Select, SearchSelect, SelectSearch, SideBar, Slider, Skeletons, Switch, Table, TableToggle, Tag, TextInput, Timeline, Toaster, ToolTip, useToaster, VerifyEmailOtp, useCustomTheme, ThemesList, debounce, };
+import EmptyState from "./Components/EmptyState/EmptyState";
+import MoreItems from "./Components/MoreItems/MoreItems";
+import ScrollToTop from "./Components/ScrollToTop/ScrollToTop";
+import CopyButton from "./Components/CopyButton/CopyButton";
+import FieldSelectModal from "./Components/FieldSelectModal/FieldSelectModal";
+import PdfViewer from "./Components/PdfViewer/PdfViewer";
+import LazyWrapper from "./Components/LazyWrapper/LazyWrapper";
+import FilePreview, { FilePreviewTrigger } from "./Components/FilePreview/FilePreview";
+export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexPolarChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, ContactForm, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, EmptyState, FieldSelectModal, FilePreview, FilePreviewTrigger, FileUpload, FileUploader, FilterSidebar, FormWrapper, LazyWrapper, MoreItems, PdfViewer, ScrollToTop, CopyButton, Header, HeaderActions, InputTextArea, InputSwitch, KanbanBoard, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, Notification, NoteTextArea, MultiSelect, NumberInput, PaymentCard, PhoneNumberInput, PinInput, ProductCard, ProductDetails, ProfileCard, ProfileCardHeader, ProfileCardBody, ProfileCardFooter, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Reorder, Search, Select, SearchSelect, SelectSearch, SideBar, Slider, Skeletons, Switch, Table, TableToggle, Tag, TextInput, Timeline, Toaster, ToolTip, useToaster, VerifyEmailOtp, useCustomTheme, ThemesList, debounce, };
 export default withTheme;

package/dist/index.js

@@ -37,8 +37,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.RadioButton = exports.ProgressBar = exports.ProfilePhotoViewer = exports.ProfileCardFooter = exports.ProfileCardBody = exports.ProfileCardHeader = exports.ProfileCard = exports.ProductDetails = exports.ProductCard = exports.PinInput = exports.PhoneNumberInput = exports.PaymentCard = exports.NumberInput = exports.MultiSelect = exports.NoteTextArea = exports.Notification = exports.NavigationBar = exports.ModalFooter = exports.ModalBody = exports.ModalHeader = exports.Modal = exports.Loading = exports.KanbanBoard = exports.InputSwitch = exports.InputTextArea = exports.HeaderActions = exports.Header = exports.FormWrapper = exports.FilterSidebar = exports.FileUploader = exports.FileUpload = exports.Editor = exports.Dropdown = exports.DrawerFooter = exports.DrawerBody = exports.DrawerHeader = exports.Drawer = exports.DatePicker = exports.ContactForm = exports.Checkbox = exports.Card = exports.ButtonGroupIcon = exports.Button = exports.Breadcrumbs = exports.ApexLineChart = exports.ApexPolarChart = exports.ApexPieChart = exports.ApexBarChart = exports.AlertDialog = exports.Accordian = void 0;
-exports.debounce = exports.ThemesList = exports.useCustomTheme = exports.VerifyEmailOtp = exports.useToaster = exports.ToolTip = exports.Toaster = exports.Timeline = exports.TextInput = exports.Tag = exports.TableToggle = exports.Table = exports.Switch = exports.Skeletons = exports.Slider = exports.SideBar = exports.SelectSearch = exports.SearchSelect = exports.Select = exports.Search = exports.Reorder = exports.RadioButtonGroup = void 0;
+exports.PinInput = exports.PhoneNumberInput = exports.PaymentCard = exports.NumberInput = exports.MultiSelect = exports.NoteTextArea = exports.Notification = exports.NavigationBar = exports.ModalFooter = exports.ModalBody = exports.ModalHeader = exports.Modal = exports.Loading = exports.KanbanBoard = exports.InputSwitch = exports.InputTextArea = exports.HeaderActions = exports.Header = exports.CopyButton = exports.ScrollToTop = exports.PdfViewer = exports.MoreItems = exports.LazyWrapper = exports.FormWrapper = exports.FilterSidebar = exports.FileUploader = exports.FileUpload = exports.FilePreviewTrigger = exports.FilePreview = exports.FieldSelectModal = exports.EmptyState = exports.Editor = exports.Dropdown = exports.DrawerFooter = exports.DrawerBody = exports.DrawerHeader = exports.Drawer = exports.DatePicker = exports.ContactForm = exports.Checkbox = exports.Card = exports.ButtonGroupIcon = exports.Button = exports.Breadcrumbs = exports.ApexLineChart = exports.ApexPolarChart = exports.ApexPieChart = exports.ApexBarChart = exports.AlertDialog = exports.Accordian = void 0;
+exports.debounce = exports.ThemesList = exports.useCustomTheme = exports.VerifyEmailOtp = exports.useToaster = exports.ToolTip = exports.Toaster = exports.Timeline = exports.TextInput = exports.Tag = exports.TableToggle = exports.Table = exports.Switch = exports.Skeletons = exports.Slider = exports.SideBar = exports.SelectSearch = exports.SearchSelect = exports.Select = exports.Search = exports.Reorder = exports.RadioButtonGroup = exports.RadioButton = exports.ProgressBar = exports.ProfilePhotoViewer = exports.ProfileCardFooter = exports.ProfileCardBody = exports.ProfileCardHeader = exports.ProfileCard = exports.ProductDetails = exports.ProductCard = void 0;
 var Accordion_1 = __importDefault(require("./Components/Accordion/Accordion"));
 exports.Accordian = Accordion_1.default;
 var AlertDialog_1 = __importDefault(require("./Components/AlertDialog/AlertDialog"));
@@ -174,4 +174,21 @@ var ThemeDatePicker_1 = __importDefault(require("./Components/DatePicker/ThemeDa
 exports.DatePicker = ThemeDatePicker_1.default;
 var FilterSidebar_1 = __importDefault(require("./Components/FilterSidebar/FilterSidebar"));
 exports.FilterSidebar = FilterSidebar_1.default;
+var EmptyState_1 = __importDefault(require("./Components/EmptyState/EmptyState"));
+exports.EmptyState = EmptyState_1.default;
+var MoreItems_1 = __importDefault(require("./Components/MoreItems/MoreItems"));
+exports.MoreItems = MoreItems_1.default;
+var ScrollToTop_1 = __importDefault(require("./Components/ScrollToTop/ScrollToTop"));
+exports.ScrollToTop = ScrollToTop_1.default;
+var CopyButton_1 = __importDefault(require("./Components/CopyButton/CopyButton"));
+exports.CopyButton = CopyButton_1.default;
+var FieldSelectModal_1 = __importDefault(require("./Components/FieldSelectModal/FieldSelectModal"));
+exports.FieldSelectModal = FieldSelectModal_1.default;
+var PdfViewer_1 = __importDefault(require("./Components/PdfViewer/PdfViewer"));
+exports.PdfViewer = PdfViewer_1.default;
+var LazyWrapper_1 = __importDefault(require("./Components/LazyWrapper/LazyWrapper"));
+exports.LazyWrapper = LazyWrapper_1.default;
+var FilePreview_1 = __importStar(require("./Components/FilePreview/FilePreview"));
+exports.FilePreview = FilePreview_1.default;
+Object.defineProperty(exports, "FilePreviewTrigger", { enumerable: true, get: function () { return FilePreview_1.FilePreviewTrigger; } });
 exports.default = withTheme_1.default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixelize-design-library",
-  "version": "2.3.1-beta.12",
+  "version": "2.3.1-beta.13",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.js",