sea-react-components 1.0.2

package/dist/components/file-input/index.d.ts

@@ -0,0 +1,44 @@
+import React from "react";
+export declare enum AcceptedTypes {
+    Image = "image/*",
+    Audio = "audio/*",
+    Video = "video/*",
+    PDF = "application/pdf",
+    TEXT = "text/plain"
+}
+type AcceptedValuesArray = (AcceptedTypes | string)[];
+export declare enum UploadStatuses {
+    Pending = "Pending",
+    Uploading = "Uploading",
+    Uploaded = "Uploaded",
+    Failed = "Failed"
+}
+export type FileState = {
+    id: string;
+    serverId: string | undefined;
+    file?: File | undefined;
+    name: string;
+    size: number;
+    type: string;
+    progress: number;
+    status: UploadStatuses;
+};
+export type Props<T> = {
+    name: string;
+    files: FileState[];
+    setFiles: React.Dispatch<React.SetStateAction<FileState[]>>;
+    acceptedTypes?: AcceptedValuesArray;
+    multiple: boolean;
+    errorMessage?: string | boolean;
+    onUpload: (file: FileState) => Promise<{
+        id: string;
+    } & T>;
+    onDelete: (file: FileState) => Promise<{
+        id: string;
+    } & T>;
+    onUploadSuccess?: (file: T) => void;
+    onDeleteSuccess?: (file: T) => void;
+};
+export default function FileInput<T>({ name, files, setFiles, acceptedTypes, multiple, errorMessage, onUpload, onDelete, onUploadSuccess, onDeleteSuccess, }: Props<T>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/file-input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/file-input/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAOhD,oBAAY,aAAa;IACvB,KAAK,YAAY;IACjB,KAAK,YAAY;IACjB,KAAK,YAAY;IACjB,GAAG,oBAAoB;IACvB,IAAI,eAAe;CACpB;AAED,KAAK,mBAAmB,GAAG,CAAC,aAAa,GAAG,MAAM,CAAC,EAAE,CAAC;AAEtD,oBAAY,cAAc;IACxB,OAAO,YAAY;IACnB,SAAS,cAAc;IACvB,QAAQ,aAAa;IACrB,MAAM,WAAW;CAClB;AAED,MAAM,MAAM,SAAS,GAAG;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,cAAc,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,KAAK,CAAC,CAAC,IAAI;IACrB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;IAC5D,aAAa,CAAC,EAAE,mBAAmB,CAAC;IACpC,QAAQ,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC,QAAQ,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO,CAAC;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,GAAG,CAAC,CAAC,CAAC;IAC3D,QAAQ,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO,CAAC;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,GAAG,CAAC,CAAC,CAAC;IAC3D,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IACpC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;CACrC,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,CAAC,EAAE,EACnC,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,aAAkB,EAClB,QAAQ,EACR,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,eAAe,EACf,eAAe,GAChB,EAAE,KAAK,CAAC,CAAC,CAAC,2CAkIV"}

package/dist/components/file-input/index.js

@@ -0,0 +1,85 @@
+"use client";
+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());
+    });
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useRef } from "react";
+import clsx from "clsx";
+import FileItem from "./components/file-item";
+const generateTempFileId = (type, size, name) => `(${type})-${size}-${name}`;
+export var AcceptedTypes;
+(function (AcceptedTypes) {
+    AcceptedTypes["Image"] = "image/*";
+    AcceptedTypes["Audio"] = "audio/*";
+    AcceptedTypes["Video"] = "video/*";
+    AcceptedTypes["PDF"] = "application/pdf";
+    AcceptedTypes["TEXT"] = "text/plain";
+})(AcceptedTypes || (AcceptedTypes = {}));
+export var UploadStatuses;
+(function (UploadStatuses) {
+    UploadStatuses["Pending"] = "Pending";
+    UploadStatuses["Uploading"] = "Uploading";
+    UploadStatuses["Uploaded"] = "Uploaded";
+    UploadStatuses["Failed"] = "Failed";
+})(UploadStatuses || (UploadStatuses = {}));
+export default function FileInput({ name, files, setFiles, acceptedTypes = [], multiple, errorMessage, onUpload, onDelete, onUploadSuccess, onDeleteSuccess, }) {
+    const currentFileIds = files.map((file) => generateTempFileId(file.type, file.size, file.name));
+    const [isDragging, setIsDragging] = useState(false);
+    const inputRef = useRef(null);
+    const handleFiles = (selectedFiles) => {
+        if (!selectedFiles)
+            return;
+        const selectedFilesArray = Array.from(selectedFiles);
+        const filesToUpload = selectedFilesArray.filter((f) => !currentFileIds.includes(generateTempFileId(f.type, f.size, f.name)));
+        const newFiles = filesToUpload.map((f) => ({
+            id: generateTempFileId(f.type, f.size, f.name),
+            serverId: undefined,
+            file: f,
+            type: f.type,
+            name: f.name,
+            size: f.size,
+            progress: 0,
+            status: UploadStatuses.Pending,
+        }));
+        setFiles((prev) => [...prev, ...newFiles]);
+        for (let i = 0; i < newFiles.length; i++) {
+            handleUploadFile(newFiles[i]);
+        }
+    };
+    const handleUploadFile = (file) => __awaiter(this, void 0, void 0, function* () {
+        try {
+            setFiles((prev) => prev.map((f) => f.id === file.id ? Object.assign(Object.assign({}, f), { status: UploadStatuses.Uploading }) : f));
+            const result = yield onUpload(file);
+            onUploadSuccess(result);
+            setFiles((prev) => prev.map((f) => f.id === file.id
+                ? Object.assign(Object.assign({}, f), { serverId: result.id, status: UploadStatuses.Uploaded, progress: 100 }) : f));
+        }
+        catch (error) {
+            setFiles((prev) => prev.map((f) => f.id === file.id ? Object.assign(Object.assign({}, f), { status: UploadStatuses.Failed }) : f));
+        }
+    });
+    const handleDrop = (event) => {
+        event.preventDefault();
+        event.stopPropagation();
+        setIsDragging(false);
+        handleFiles(event.dataTransfer.files);
+    };
+    const handleDeleteFile = (file) => __awaiter(this, void 0, void 0, function* () {
+        try {
+            const result = yield onDelete(file);
+            onDeleteSuccess(result);
+            setFiles((prev) => prev.filter((file) => file.serverId !== result.id));
+        }
+        catch (error) { }
+    });
+    return (_jsxs("div", { className: "w-full flex flex-col gap-1", children: [(!files.length || multiple) && (_jsxs("div", { className: clsx("border-0.5 px-3 py-2 rounded-xl text-center", "cursor-pointer transition-all duration-200 ease-in-out", "hover:border-primary", errorMessage ? "border-error" : isDragging && "border-primary"), onDragOver: (e) => {
+                    e.preventDefault();
+                    setIsDragging(true);
+                }, onDragLeave: () => setIsDragging(false), onDrop: handleDrop, onClick: () => { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, children: [_jsx("p", { className: "text-text-light", children: "Drag & Drop files here or click to select files" }), _jsx("input", { id: name, name: name, ref: inputRef, type: "file", className: "hidden", accept: acceptedTypes.join(","), multiple: multiple, onChange: (e) => handleFiles(e.target.files) })] })), _jsx("div", { className: "flex flex-nowrap gap-2 overflow-y-auto", children: files.map((f, i) => (_jsx(FileItem, { file: f, handleUploadFile: handleUploadFile, handleDeleteFile: handleDeleteFile }, `file-${name}-${i}`))) }), errorMessage && (_jsx("p", { className: "pl-1 text-sm text-error", children: errorMessage }))] }));
+}

package/dist/components/icon/index.d.ts

@@ -0,0 +1,7 @@
+import { IconifyIcon } from "@iconify/react";
+export type Props = {
+    icon: string | IconifyIcon;
+    className?: string | undefined;
+};
+export default function Icon({ icon, className }: Props): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/icon/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/icon/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAExD,MAAM,MAAM,KAAK,GAAG;IAClB,IAAI,EAAE,MAAM,GAAG,WAAW,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC,CAAC;AACF,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,KAAK,2CAEtD"}

package/dist/components/icon/index.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Icon as I } from "@iconify/react";
+export default function Icon({ icon, className }) {
+    return _jsx(I, { icon: icon, className: className });
+}

package/dist/components/input/index.d.ts

@@ -0,0 +1,9 @@
+import React, { LegacyRef } from "react";
+export type Props = {
+    ref?: LegacyRef<HTMLInputElement> | undefined;
+    errorMessage?: string | boolean;
+    start?: React.ReactNode | null;
+    end?: React.ReactNode | null;
+} & React.InputHTMLAttributes<HTMLInputElement>;
+export default function Input({ errorMessage, className, start, end, ref, type, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/input/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAEnD,MAAM,MAAM,KAAK,GAAG;IAClB,GAAG,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,GAAG,SAAS,CAAC;IAC9C,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC;IAC/B,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC;CAC9B,GAAG,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;AAChD,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,YAAY,EACZ,SAAS,EACT,KAAY,EACZ,GAAU,EACV,GAAG,EACH,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,KAAK,2CAoDP"}

package/dist/components/input/index.js

@@ -0,0 +1,33 @@
+"use client";
+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;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from "@iconify/react";
+import clsx from "clsx";
+import { useState } from "react";
+export default function Input(_a) {
+    var { errorMessage, className, start = null, end = null, ref, type } = _a, props = __rest(_a, ["errorMessage", "className", "start", "end", "ref", "type"]);
+    const [isFocused, setIsFocused] = useState(false);
+    const [currentType, setCurrentType] = useState(type);
+    if (type === "password") {
+        end = (_jsx("button", { type: "button", onClick: () => {
+                setCurrentType(currentType === "password" ? "text" : "password");
+            }, children: _jsx(Icon, { icon: currentType === "password"
+                    ? "mdi:eye-outline"
+                    : "mdi:eye-off-outline", className: "w-5 h-5 text-primary" }) }));
+    }
+    return (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsxs("div", { className: clsx("flex items-center justify-between gap-2 bg-white px-3 py-2 rounded-xl border-0.5 hover:border-primary", errorMessage
+                    ? "border-error"
+                    : isFocused
+                        ? "border-primary"
+                        : "border-gray-200"), children: [start, _jsx("input", Object.assign({ ref: ref, type: currentType, onFocus: () => setIsFocused(true), onBlur: () => setIsFocused(false), className: clsx("outline-none text-text flex-1", className) }, props)), end] }), errorMessage && (_jsx("p", { className: "pl-1 text-sm text-error", children: errorMessage }))] }));
+}

package/dist/components/list-item/components/page-button/index.d.ts

@@ -0,0 +1,8 @@
+type Props = {
+    page: number;
+    currentPage: number;
+    handleChangePage: (newPage: number) => void;
+};
+export default function PageButton({ page, currentPage, handleChangePage, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/list-item/components/page-button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/list-item/components/page-button/index.tsx"],"names":[],"mappings":"AAIA,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,gBAAgB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CAC7C,CAAC;AACF,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,WAAW,EACX,gBAAgB,GACjB,EAAE,KAAK,2CAeP"}

package/dist/components/list-item/components/page-button/index.js

@@ -0,0 +1,8 @@
+"use client";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+export default function PageButton({ page, currentPage, handleChangePage, }) {
+    return (_jsx("button", { type: "button", className: clsx("border-b-2 w-8 h-8 rounded-md flex items-center justify-center bg-opacity-30 overflow-hidden hover:bg-secondary hover:bg-opacity-10 hover:border-b-secondary transition-all duration-300 ease-in-out", page === currentPage
+            ? "border-b-secondary bg-secondary"
+            : "border-b-gray-200 bg-gray-200"), onClick: () => handleChangePage(page), children: _jsxs("p", { className: "truncate text-sm", children: [" ", page] }) }));
+}

package/dist/components/list-item/components/pagination/index.d.ts

@@ -0,0 +1,9 @@
+type Props = {
+    name: string;
+    totalPages: number;
+    page: number;
+    setPage: (newPage: number) => void;
+};
+export default function Pagination({ name, totalPages, page, setPage }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/list-item/components/pagination/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/list-item/components/pagination/index.tsx"],"names":[],"mappings":"AAOA,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC;AACF,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,KAAK,2CAoI5E"}

package/dist/components/list-item/components/pagination/index.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+import PageButton from "../page-button";
+import { Icon } from "@iconify/react";
+const AROUND_BUTTONS_COUNT = 3;
+export default function Pagination({ name, totalPages, page, setPage }) {
+    const handleChangePage = (newPage) => {
+        if (newPage < 1)
+            newPage = 1;
+        else if (newPage > totalPages)
+            newPage = totalPages;
+        setPage(newPage);
+    };
+    const previousDisabled = page === 1 || totalPages === 0;
+    const nextDisabled = page === totalPages || totalPages === 0;
+    const renderPageNumbers = () => {
+        if (totalPages <= AROUND_BUTTONS_COUNT) {
+            // Show all pages if totalPages <= AROUND_BUTTONS_COUNT
+            return Array.from({ length: totalPages }, (_, i) => i + 1).map((p) => (_jsx(PageButton, { currentPage: page, page: p, handleChangePage: handleChangePage }, `table-${name}-page-${p}`)));
+        }
+        const pages = [];
+        const showLeftEllipsis = page > AROUND_BUTTONS_COUNT;
+        const showRightEllipsis = page <= totalPages - AROUND_BUTTONS_COUNT;
+        // Add first page
+        pages.push(_jsx(PageButton, { currentPage: page, page: 1, handleChangePage: handleChangePage }, `table-${name}-page-1`));
+        // Add left ellipsis
+        if (showLeftEllipsis) {
+            pages.push(_jsx("span", { className: "text-gray-400", children: "..." }, `table-${name}-ellipsis-left`));
+        }
+        // Add middle pages
+        const startPage = Math.max(2, page - 1);
+        const endPage = Math.min(totalPages - 1, page + 1);
+        for (let p = startPage; p <= endPage; p++) {
+            pages.push(_jsx(PageButton, { currentPage: page, page: p, handleChangePage: handleChangePage }, `table-${name}-page-${p}`));
+        }
+        // Add right ellipsis
+        if (showRightEllipsis) {
+            pages.push(_jsx("span", { className: "text-gray-400", children: "..." }, `table-${name}-ellipsis-right`));
+        }
+        // Add last page
+        pages.push(_jsx(PageButton, { currentPage: page, page: totalPages, handleChangePage: handleChangePage }, `table-${name}-page-${totalPages}`));
+        return pages;
+    };
+    return (_jsxs("div", { className: "flex items-center justify-end gap-3", children: [_jsx("button", { disabled: previousDisabled, onClick: () => handleChangePage(page - 1), children: _jsx(Icon, { icon: "ooui:next-rtl", className: clsx("transition-all duration-300 ease-in-out", previousDisabled
+                        ? "text-gray-200"
+                        : "text-secondary hover:text-opacity-50") }) }), renderPageNumbers(), _jsx("button", { disabled: nextDisabled, onClick: () => handleChangePage(page + 1), children: _jsx(Icon, { icon: "ooui:next-ltr", className: clsx("transition-all duration-300 ease-in-out", nextDisabled
+                        ? "text-gray-200"
+                        : "text-secondary hover:text-opacity-50") }) })] }));
+}

package/dist/components/list-item/components/search-input/index.d.ts

@@ -0,0 +1,7 @@
+import { Props as InputProps } from "../../../input";
+export type Props = {
+    onDebouncedChange: (newValue: string) => void;
+    QueryDebouncedTime?: number;
+} & InputProps;
+export default function SearchInput({ value, onDebouncedChange, QueryDebouncedTime, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/list-item/components/search-input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/list-item/components/search-input/index.tsx"],"names":[],"mappings":"AAGA,OAAc,EAAE,KAAK,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5D,MAAM,MAAM,KAAK,GAAG;IAClB,iBAAiB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,GAAG,UAAU,CAAC;AACf,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,KAAK,EACL,iBAAiB,EACjB,kBAAwB,EACxB,GAAG,KAAK,EACT,EAAE,KAAK,2CAiCP"}

package/dist/components/list-item/components/search-input/index.js

@@ -0,0 +1,38 @@
+"use client";
+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;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Icon } from "@iconify/react";
+import { useEffect, useState } from "react";
+import Input from "../../../input";
+export default function SearchInput(_a) {
+    var { value, onDebouncedChange, QueryDebouncedTime = 500 } = _a, props = __rest(_a, ["value", "onDebouncedChange", "QueryDebouncedTime"]);
+    const [currentValue, setCurrentValue] = useState(value);
+    const [debouncedQuery, setDebouncedQuery] = useState("");
+    useEffect(() => {
+        setCurrentValue((value || "").toString());
+    }, [value]);
+    useEffect(() => {
+        const handler = setTimeout(() => {
+            setDebouncedQuery(currentValue);
+        }, QueryDebouncedTime);
+        // Cleanup the timeout on every keystroke
+        return () => clearTimeout(handler);
+    }, [currentValue, QueryDebouncedTime]);
+    // Trigger the callback when debouncedQuery changes
+    useEffect(() => {
+        if (onDebouncedChange) {
+            onDebouncedChange(debouncedQuery);
+        }
+    }, [debouncedQuery, onDebouncedChange]);
+    return (_jsx(Input, Object.assign({ value: currentValue, onChange: (e) => setCurrentValue(e.target.value), end: _jsx(Icon, { icon: "material-symbols:search", className: "w-5 h-5 text-primary" }) }, props)));
+}

package/dist/components/list-item/index.d.ts

@@ -0,0 +1,26 @@
+import React from "react";
+import { SelectOption } from "../select";
+import { BulkActionFeature, Filter } from "../../hooks/list-items-hook/types";
+export type Props<K> = {
+    title?: string;
+    name: string;
+    filters?: Filter<K>[];
+    totalPages: number;
+    query: string;
+    setQuery: (newQuery: string) => void;
+    page: number;
+    setPage: (newPage: number) => void;
+    rowsPerPage: number;
+    setRowsPerPage: (newRowsPerPage: number) => void;
+    rowsPerPageOptions: SelectOption<number>[];
+    QueryDebouncedTime?: number;
+    updateParams?: (updates: Record<string, string>) => void;
+    getParam?: (name: string) => string | null | undefined;
+    bulkActionFeature?: BulkActionFeature | undefined;
+    loading?: boolean;
+    showPaginationRow?: boolean;
+    showFiltersRow?: boolean;
+    children?: React.ReactNode;
+};
+export default function ListItem<K>({ title, name, filters, totalPages, query, setQuery, page, setPage, rowsPerPage, setRowsPerPage, updateParams, getParam, rowsPerPageOptions, QueryDebouncedTime, bulkActionFeature, loading, showPaginationRow, showFiltersRow, children, }: Props<K>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/list-item/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/list-item/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAe,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAKjD,OAAO,EACL,iBAAiB,EACjB,MAAM,EAEP,MAAM,mCAAmC,CAAC;AAM3C,MAAM,MAAM,KAAK,CAAC,CAAC,IAAI;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,CAAC,cAAc,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,kBAAkB,EAAE,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC;IAC3C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IACzD,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACvD,iBAAiB,CAAC,EAAE,iBAAiB,GAAG,SAAS,CAAC;IAClD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AACF,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,CAAC,EAAE,EAClC,KAAK,EACL,IAAI,EACJ,OAAY,EACZ,UAAU,EACV,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,WAAW,EACX,cAAc,EACd,YAAY,EACZ,QAAQ,EACR,kBAAkB,EAClB,kBAAwB,EACxB,iBAA6B,EAC7B,OAAe,EACf,iBAAwB,EACxB,cAAqB,EACrB,QAAQ,GACT,EAAE,KAAK,CAAC,CAAC,CAAC,2CAoGV"}

package/dist/components/list-item/index.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import clsx from "clsx";
+import Select from "../select";
+import Button from "../button";
+import SearchInput from "./components/search-input";
+import Pagination from "./components/pagination";
+import { DEFAULT_FILTER_VALUE, } from "../../hooks/list-items-hook/types";
+import { useFilters } from "../..//hooks/list-items-hook/useFilters";
+import { usePagination } from "../../hooks/list-items-hook/usePagination";
+import { useBulkActions } from "../../hooks/list-items-hook/useBulkActions";
+import Loader from "../loader";
+export default function ListItem({ title, name, filters = [], totalPages, query, setQuery, page, setPage, rowsPerPage, setRowsPerPage, updateParams, getParam, rowsPerPageOptions, QueryDebouncedTime = 500, bulkActionFeature = undefined, loading = false, showPaginationRow = true, showFiltersRow = true, children, }) {
+    useFilters(name, filters, updateParams, getParam);
+    usePagination(name, page, setPage, rowsPerPage, setRowsPerPage, updateParams, getParam);
+    useBulkActions(bulkActionFeature, filters, query);
+    return (_jsxs("div", { className: "flex flex-col gap-5", children: [title && (_jsx("h3", { className: "text-2xl font-semibold text-primary", children: title })), _jsxs("div", { className: clsx("flex items-center gap-5 flex-wrap", showFiltersRow && bulkActionFeature
+                    ? "justify-between"
+                    : "justify-end"), children: [showFiltersRow && (_jsxs("div", { className: "flex items-end gap-2 flex-wrap", children: [_jsx(SearchInput, { placeholder: `search about ${name}`, value: query, onDebouncedChange: setQuery, QueryDebouncedTime: QueryDebouncedTime }), filters.map((f, i) => (_jsxs("div", { className: "flex flex-col gap-1", children: [f.label && (_jsx("p", { className: "text-text font-semibold", children: f.label })), _jsx(Select, { name: `table-${name}-filter-${f.label}-${i}`, values: [f.value], setValues: (newValues) => f.setValue(newValues[0]), options: [
+                                            { label: "All", value: DEFAULT_FILTER_VALUE },
+                                            ...f.options,
+                                        ], placeholder: f.label })] }, `table-${name}-filter-${f.label}-${i}`)))] })), bulkActionFeature && (_jsx("div", { className: "flex items-center gap-2 justify-end w-full md:w-fit", children: bulkActionFeature.bulkActions.map((a, i) => (_jsx(Button, Object.assign({}, a, { disabled: bulkActionFeature.selectedRowIds.length === 0 }), `table-${name}-bulk-action-${i}`))) }))] }), _jsx("div", { className: "overflow-x-auto", children: loading ? _jsx(Loader, {}) : _jsx(_Fragment, { children: children }) }), showPaginationRow && (_jsxs("div", { className: "flex items-center justify-end gap-5", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("p", { className: "text-text text-sm", children: "Rows per page" }), _jsx(Select, { name: `${name}-select`, values: [rowsPerPage], setValues: (newValues) => setRowsPerPage(newValues[0]), options: rowsPerPageOptions })] }), totalPages >= 1 && (_jsx(Pagination, { name: name, page: page, setPage: setPage, totalPages: totalPages }))] }))] }));
+}

package/dist/components/loader/index.d.ts

@@ -0,0 +1,6 @@
+type Props = {
+    className?: string;
+};
+export default function Loader({ className, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/loader/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/loader/index.tsx"],"names":[],"mappings":"AAGA,KAAK,KAAK,GAAG;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AACF,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,SAAoC,GACrC,EAAE,KAAK,2CAEP"}

package/dist/components/loader/index.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Icon from "../icon";
+export default function Loader({ className = "text-primary h-10 w-10", }) {
+    return _jsx(Icon, { icon: "codex:loader", className: className });
+}

package/dist/components/menu/index.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { MenuProps } from "@szhsin/react-menu";
+export type Props = {
+    menuButton: React.ReactNode;
+    children: React.ReactNode;
+    className?: string | undefined;
+} & MenuProps;
+export default function Menu({ menuButton, children, className, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/menu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/menu/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAA6B,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAG1E,MAAM,MAAM,KAAK,GAAG;IAClB,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC,GAAG,SAAS,CAAC;AACd,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAC3B,UAAU,EACV,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,2CAQP"}

package/dist/components/menu/index.js

@@ -0,0 +1,19 @@
+"use client";
+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;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Menu as SMenu, MenuButton } from "@szhsin/react-menu";
+import clsx from "clsx";
+export default function Menu(_a) {
+    var { menuButton, children, className } = _a, props = __rest(_a, ["menuButton", "children", "className"]);
+    return (_jsx(SMenu, Object.assign({ menuButton: _jsx(MenuButton, { children: menuButton }) }, props, { children: _jsx("div", { className: clsx("bg-white rounded-xl shadow-lg", className), children: children }) })));
+}

package/dist/components/menu/menu-item/index.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export type Props = {
+    key: string;
+    children: React.ReactNode;
+    className?: string | undefined;
+    selected?: boolean;
+    disabled?: boolean;
+} & React.HTMLAttributes<HTMLDivElement>;
+export default function MenuItem({ children, className, selected, disabled, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/menu/menu-item/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/menu/menu-item/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,KAAK,GAAG;IAClB,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;AACzC,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,QAAgB,EAChB,QAAgB,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,2CAcP"}

package/dist/components/menu/menu-item/index.js

@@ -0,0 +1,19 @@
+"use client";
+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;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import { MenuItem as SMenuItem } from "@szhsin/react-menu";
+export default function MenuItem(_a) {
+    var { children, className, selected = false, disabled = false } = _a, props = __rest(_a, ["children", "className", "selected", "disabled"]);
+    return (_jsx("div", Object.assign({ className: clsx("rounded-md transition-all duration-300 ease-in-out", selected && "bg-primary", !disabled ? "hover:bg-primary hover:bg-opacity-50" : "bg-gray-200", className) }, props, { children: _jsx(SMenuItem, { disabled: disabled, children: children }) })));
+}

package/dist/components/modal/index.d.ts

@@ -0,0 +1,12 @@
+import React, { ReactNode } from "react";
+export type ModalPosition = "center" | "top" | "top-left" | "top-right" | "bottom" | "bottom-left" | "bottom-right" | "left" | "right";
+export type ModalSize = "sm" | "md" | "lg" | "xl";
+export type Props = {
+    isOpen: boolean;
+    onClose: () => void;
+    children: ReactNode;
+    size?: ModalSize;
+    position?: ModalPosition;
+} & React.HTMLAttributes<HTMLDivElement>;
+export default function Modal({ isOpen, onClose, children, position, size, className, onClick, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/modal/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/modal/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzC,MAAM,MAAM,aAAa,GACrB,QAAQ,GACR,KAAK,GACL,UAAU,GACV,WAAW,GACX,QAAQ,GACR,aAAa,GACb,cAAc,GACd,MAAM,GACN,OAAO,CAAC;AAEZ,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAqBlD,MAAM,MAAM,KAAK,GAAG;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,aAAa,CAAC;CAC1B,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;AACzC,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAmB,EACnB,IAAW,EACX,SAAS,EACT,OAAO,EACP,GAAG,KAAK,EACT,EAAE,KAAK,2CAiCP"}

package/dist/components/modal/index.js

@@ -0,0 +1,41 @@
+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;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from "@iconify/react";
+import clsx from "clsx";
+const sizeClasses = {
+    sm: "w-1/2 md:w-1/4 h-auto",
+    md: "w-1/2 md:w-1/3 h-auto",
+    lg: "w-5/6 md:w-1/2 h-auto",
+    xl: "w-5/6 md:w-3/4 h-auto",
+};
+const positionClasses = {
+    center: "top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2",
+    top: "top-5 left-1/2 transform -translate-x-1/2",
+    "top-left": "top-5 left-5",
+    "top-right": "top-5 right-5",
+    bottom: "bottom-5 left-1/2 transform -translate-x-1/2",
+    "bottom-left": "bottom-5 left-5",
+    "bottom-right": "bottom-5 right-5",
+    left: "top-1/2 left-5 transform -translate-y-1/2",
+    right: "top-1/2 right-5 transform -translate-y-1/2",
+};
+export default function Modal(_a) {
+    var { isOpen, onClose, children, position = "center", size = "md", className, onClick } = _a, props = __rest(_a, ["isOpen", "onClose", "children", "position", "size", "className", "onClick"]);
+    if (!isOpen)
+        return null;
+    return (_jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50 z-50 flex justify-center items-center", onClick: onClose, children: _jsxs("div", Object.assign({ className: clsx("absolute bg-white rounded-lg shadow-lg p-6", sizeClasses[size], positionClasses[position], className), onClick: (e) => {
+                e.stopPropagation(); // Prevent closing when clicking inside the modal
+                if (onClick)
+                    onClick(e);
+            } }, props, { children: [_jsx("button", { onClick: onClose, className: "absolute top-2 right-2 text-secondary-dark", children: _jsx(Icon, { icon: "line-md:close-small", className: "h-5 w-5 hover:scale-110 transition-all duration-300 ease-in-out" }) }), children] })) }));
+}

package/dist/components/not-authorized/index.d.ts

@@ -0,0 +1,2 @@
+export default function NotAuthorized(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/not-authorized/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/not-authorized/index.tsx"],"names":[],"mappings":"AAEA,MAAM,CAAC,OAAO,UAAU,aAAa,4CAWpC"}

package/dist/components/not-authorized/index.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Icon from "../icon";
+export default function NotAuthorized() {
+    return (_jsxs("div", { className: "flex flex-col items-center justify-center gap-10", children: [_jsx(Icon, { icon: "fluent-mdl2:protect-restrict", className: "text-warning text-opacity-80 h-56 w-56" }), _jsx("h3", { className: "text-warning text-4xl font-bold", children: "Not Authorized!" })] }));
+}

package/dist/components/otp-input/index.d.ts

@@ -0,0 +1,7 @@
+export type Props = {
+    length: number;
+    onChange: (otpCode: string) => void;
+    errorMessage?: string;
+};
+export default function OTPInput({ length, onChange, errorMessage }: Props): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/otp-input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/otp-input/index.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,KAAK,GAAG;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,YAAY,EAAE,EAAE,KAAK,2CAwDzE"}