forma-ui 0.0.5 → 0.0.7

package/dist/components/ui/Accordion.d.ts

@@ -9,6 +9,7 @@ export type AccordionProps = {
     title: string;
     title_classname?: string;
     open?: boolean;
+    onToggle?: () => void;
     sliding?: boolean;
     animation?: "scale" | "fade" | "slide" | "bounce";
 };

package/dist/components/ui/Accordion.js

@@ -1,12 +1,21 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { cn } from "../../lib/utils";
-const Accordion = ({ parentClassName, className, circleLocation, secoundCircleLocation, children, icon, title, title_classname, open = false, sliding = true, animation = "slide", }) => {
-    const [isOpen, setIsOpen] = useState(open);
+import { useState, useEffect } from "react";
+import { cn } from "../../libs/utils";
+const Accordion = ({ parentClassName, className, circleLocation, secoundCircleLocation, children, icon, title, title_classname, open, onToggle, sliding = true, animation = "slide", }) => {
+    const [isOpen, setIsOpen] = useState(open !== null && open !== void 0 ? open : false);
+    // sync with controlled open
+    useEffect(() => {
+        if (open !== undefined)
+            setIsOpen(open);
+    }, [open]);
     const toggleOpen = () => {
-        if (sliding)
-            setIsOpen(!isOpen);
+        if (onToggle) {
+            onToggle(); // parent کنترل می‌کند
+        }
+        else if (sliding) {
+            setIsOpen(!isOpen); // internal state
+        }
     };
     const getAnimationClasses = () => {
         switch (animation) {

package/dist/components/ui/Button.js

@@ -12,7 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // components/ui/Button.tsx
 import { forwardRef } from "react";
-import { cn } from "../../lib/utils";
+import { cn } from "../../libs/utils";
 const Button = forwardRef((_a, ref) => {
     var { className, variant = "primary", size = "md", loading = false, icon, iconPosition = "left", fullWidth = false, clickAnimation = "none", children, disabled } = _a, props = __rest(_a, ["className", "variant", "size", "loading", "icon", "iconPosition", "fullWidth", "clickAnimation", "children", "disabled"]);
     const isDisabled = disabled || loading;

package/dist/components/ui/Input.d.ts

@@ -1,10 +1,11 @@
-import React from "react";
-type InputProps = {
-    label?: string;
-    type?: string;
-    placeholder?: string;
-    value?: string;
-    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
-};
-export default function Input({ label, type, placeholder, value, onChange, }: InputProps): import("react/jsx-runtime").JSX.Element;
-export {};
+import type { InputTextProps, InputEmailProps, InputMobileProps, InputPasswordProps, InputRePasswordProps, InputTextAreaProps, InputSearchProps, InputRadioButtonProps, InputToggleProps, InputDarkLightProps } from "./Input.types";
+export declare function InputText({ label, className, id, disabled, value, onChange, onClear, ...props }: InputTextProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputEmail({ label, className, id, variant, error, disabled, placeholder, value, onChange, onClear, ...props }: InputEmailProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputMobile({ label, className, id, error, disabled, placeholder, value, onChange, onClear, ...props }: InputMobileProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputTextArea({ label, className, id, value, onChange, ...props }: InputTextAreaProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputSearch({ className, id, inputSearchRef, classNameParent, searchClassname, param, value, onChange, ...props }: InputSearchProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputPassword({ label, className, id, variant, error, buttonFirstId, buttonSecondId, value, onChange, onClear, ...props }: InputPasswordProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputRePassword({ label, id, buttonId, passwordFieldId, ...props }: InputRePasswordProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputDarkLight({ className }: InputDarkLightProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputRadioButton({ className, id, index, name, useIndex, onSortChange, ...props }: InputRadioButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputToggle({ className, checked, onStatusChange, ...props }: InputToggleProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/Input.js

@@ -1,4 +1,176 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default function Input({ label, type = "text", placeholder, value, onChange, }) {
-    return (_jsxs("div", { className: "flex flex-col gap-1", children: [label && _jsx("label", { className: "text-sm font-medium", children: label }), _jsx("input", { type: type, placeholder: placeholder, value: value, onChange: onChange, className: "border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none" })] }));
+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, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from "react";
+import { CloseSquareIcon, EmailIcon, MobielIcon, SunIcon, HideIcon, LockIcon, SearchIcon, ShowIcon, MoonIcon, } from "../icon/icon";
+import { cn } from "@/libs/utils";
+// Simple translation function replacement (no external library)
+const translate = (key) => {
+    const translations = {
+        error_invalid_email: "Please enter a valid email address",
+        error_invalid_mobile: "Please enter a valid mobile number",
+        error_min_length_password: "Password must be at least 5 characters",
+        error_re_password: "Passwords do not match",
+    };
+    return translations[key] || key;
+};
+// InputText Component
+export function InputText(_a) {
+    var { label, className, id, disabled, value, onChange, onClear } = _a, props = __rest(_a, ["label", "className", "id", "disabled", "value", "onChange", "onClear"]);
+    const inputRef = useRef(null);
+    const handleClear = () => {
+        if (inputRef.current) {
+            inputRef.current.value = "";
+            const event = new Event("input", { bubbles: true });
+            inputRef.current.dispatchEvent(event);
+        }
+        onClear === null || onClear === void 0 ? void 0 : onClear();
+    };
+    return (_jsxs("div", { className: "flex flex-col w-full", children: [label && (_jsx("label", { htmlFor: id, className: "text-Neutral-300 text-[10px] font-medium px-3 mb-1", children: label })), _jsxs("div", { className: "relative", children: [_jsx("input", Object.assign({ ref: inputRef, id: id, type: "text", disabled: disabled, value: value, onChange: onChange, className: cn("autofill-input placeholder-Neutral-200 w-full px-[1rem] rtl:pl-[2.5rem] ltr:pr-[2.5rem] py-3 rounded-2xl bg-background-light border border-secondary-100 focus:outline-none focus:ring-0 focus:border-secondary-400 justify-between items-center relative", className) }, props)), !disabled && (_jsx("button", { type: "button", onClick: handleClear, className: "absolute inset-y-0 rtl:left-0 ltr:right-0 flex items-center p-2", children: _jsx(CloseSquareIcon, { className: "text-Nutral-500" }) }))] })] }));
+}
+// InputEmail Component
+export function InputEmail(_a) {
+    var { label, className, id, variant = "default", error, disabled, placeholder, value, onChange, onClear } = _a, props = __rest(_a, ["label", "className", "id", "variant", "error", "disabled", "placeholder", "value", "onChange", "onClear"]);
+    const inputRef = useRef(null);
+    const [showError, setShowError] = useState(false);
+    const handleClear = () => {
+        if (inputRef.current) {
+            inputRef.current.value = "";
+            const event = new Event("input", { bubbles: true });
+            inputRef.current.dispatchEvent(event);
+        }
+        onClear === null || onClear === void 0 ? void 0 : onClear();
+    };
+    const emailPattern = "[\\-a-zA-Z0-9~!$%^&*_=+\\}\\{'?]+(\\.[-a-zA-Z0-9~!$%^&*_=+\\}\\{'?]+)*@[a-zA-Z0-9_][-a-zA-Z0-9_]*(\\.[-a-zA-Z0-9_]+)*\\.[a-zA-Z]{2,}(:[0-9]{1,5})?";
+    if (variant === "auth") {
+        return (_jsxs(_Fragment, { children: [label && (_jsx("label", { htmlFor: id, className: "text-Neutral-300 text-[10px] font-medium px-3 mb-1", children: label })), _jsxs("div", { className: "relative", children: [_jsx("input", Object.assign({ ref: inputRef, id: id, type: "email", pattern: emailPattern, placeholder: placeholder, disabled: disabled, value: value, onChange: onChange, onBlur: () => setShowError(false), onFocus: () => setShowError(false), className: cn("autofill-input peer placeholder-Neutral-200 w-full px-[2.7rem] py-3 rounded-2xl bg-secondary-50 dark:bg-background-light border border-secondary-100 focus:outline-none focus:ring-0 focus:border-secondary-400 justify-between items-center text-Neutral-500 dark:text-white relative", className) }, props)), !disabled && (_jsx("button", { type: "button", onClick: handleClear, className: "absolute inset-y-0 rtl:left-0 ltr:right-0 flex items-center p-2", children: _jsx(CloseSquareIcon, {}) })), _jsx("div", { className: "absolute inset-y-0 rtl:right-0 ltr:left-0 rtl:pr-3 ltr:pl-3 flex items-center pointer-events-none", children: _jsx(EmailIcon, {}) }), error && !showError && (_jsx("div", { className: "peer-focus:hidden absolute inset-x-0 mt-2 mx-3", children: _jsx("div", { className: "text-Error-400 text-xs font-medium", children: translate(error) }) })), _jsx("div", { className: "hidden peer-invalid:flex absolute mt-2 mx-3", children: _jsx("div", { className: "text-Error-400 text-xs font-medium", children: translate("error_invalid_email") }) })] })] }));
+    }
+    return (_jsxs(_Fragment, { children: [label && (_jsx("label", { htmlFor: id, className: "text-Neutral-300 text-[10px] font-medium px-3 mb-1", children: label })), _jsxs("div", { className: "flex flex-col relative", children: [_jsx("input", Object.assign({ ref: inputRef, id: id, type: "email", disabled: disabled, value: value, onChange: onChange, className: cn("autofill-input rounded-2xl px-[2.7rem] h-12 py-6 border-2 border-Neutral-50 focus:outline-none focus:ring-0 focus:border-secondary-400", className) }, props)), _jsx("div", { className: "absolute inset-y-0 rtl:right-0 ltr:left-0 rtl:pr-3 ltr:pl-3 flex items-center pointer-events-none", children: _jsx(EmailIcon, { className: "text-Nutral-500" }) }), !disabled && (_jsx("button", { type: "button", onClick: handleClear, className: "absolute inset-y-0 rtl:left-0 ltr:right-0 flex items-center p-2", children: _jsx(CloseSquareIcon, { className: "text-Nutral-500" }) }))] })] }));
+}
+// InputMobile Component
+export function InputMobile(_a) {
+    var { label, className, id, error, disabled, placeholder, value, onChange, onClear } = _a, props = __rest(_a, ["label", "className", "id", "error", "disabled", "placeholder", "value", "onChange", "onClear"]);
+    const inputRef = useRef(null);
+    const [showError, setShowError] = useState(false);
+    const handleClear = () => {
+        if (inputRef.current) {
+            inputRef.current.value = "";
+            const event = new Event("input", { bubbles: true });
+            inputRef.current.dispatchEvent(event);
+        }
+        onClear === null || onClear === void 0 ? void 0 : onClear();
+    };
+    return (_jsxs(_Fragment, { children: [label && (_jsx("label", { htmlFor: id, className: "text-base font-medium text-Neutral-300 px-3 mb-1", children: label })), _jsxs("div", { className: "relative", children: [_jsx("input", Object.assign({ ref: inputRef, id: id, type: "tel", inputMode: "numeric", pattern: "^09[0-9]{9}$", maxLength: 11, placeholder: placeholder, disabled: disabled, value: value, onChange: onChange, onBlur: () => setShowError(false), onFocus: () => setShowError(false), className: cn("autofill-input peer placeholder-Neutral-200 w-full px-[2.7rem] py-3 rounded-2xl bg-secondary-50 dark:bg-background-light border border-secondary-100 focus:outline-none focus:ring-0 focus:border-secondary-400 justify-between items-center text-Neutral-500 dark:text-white relative", className) }, props)), !disabled && (_jsx("button", { type: "button", onClick: handleClear, className: "absolute inset-y-0 rtl:left-0 ltr:right-0 flex items-center p-2", children: _jsx(CloseSquareIcon, {}) })), _jsx("div", { className: "absolute inset-y-0 rtl:right-0 ltr:left-0 rtl:pr-3 ltr:pl-3 flex items-center pointer-events-none", children: _jsx(MobielIcon, {}) }), error && !showError && (_jsx("div", { className: "peer-focus:hidden absolute inset-x-0 mt-2 mx-3", children: _jsx("div", { className: "text-Error-400 text-xs font-medium", children: translate(error) }) })), _jsx("div", { className: "hidden peer-invalid:flex absolute mt-2 mx-3", children: _jsx("div", { className: "text-Error-400 text-xs font-medium", children: translate("error_invalid_mobile") }) })] })] }));
+}
+// InputTextArea Component
+export function InputTextArea(_a) {
+    var { label, className, id, value, onChange } = _a, props = __rest(_a, ["label", "className", "id", "value", "onChange"]);
+    return (_jsxs("div", { className: "flex flex-col", children: [label && (_jsx("label", { htmlFor: id, className: "text-Neutral-300 text-[10px] font-medium px-3 mb-1", children: label })), _jsx("textarea", Object.assign({ id: id, value: value, onChange: onChange, className: cn("p-4 rounded-[20px] border-2 border-Neutral-50 focus:outline-none focus:ring-0 focus:border-secondary-400", className) }, props))] }));
+}
+// InputSearch Component
+export function InputSearch(_a) {
+    var { className, id, inputSearchRef, classNameParent, searchClassname, param, value, onChange } = _a, props = __rest(_a, ["className", "id", "inputSearchRef", "classNameParent", "searchClassname", "param", "value", "onChange"]);
+    return (_jsxs("div", { ref: inputSearchRef, className: cn("relative", classNameParent), children: [_jsx("div", { className: "absolute rtl:right-3 ltr:left-3 h-full inline-flex items-center", children: _jsx(SearchIcon, { className: searchClassname }) }), param && (_jsx("div", { className: "absolute rtl:left-4 ltr:right-4 h-full inline-flex flex-row-reverse items-center", children: _jsx("span", { className: "text-Neutral-300 dark:text-Neutral-100 text-sm font-semibold leading-tight tracking-tight", children: param }) })), _jsx("input", Object.assign({ id: id, type: "text", value: value, onChange: onChange, className: cn(`autofill-input w-full bg-secondary-50 dark:bg-background-light text-Neutral-400 dark:text-Neutral-100 rounded-2xl ${param
+                    ? "rtl:pr-11 rtl:pl-12 ltr:pl-11 ltr:pr-12"
+                    : "rtl:pr-11 ltr:pl-11"} h-11 border-2 border-Neutral-50 dark:border-background-light focus-visible:outline focus-visible:outline-white`, className) }, props))] }));
+}
+// InputPassword Component
+export function InputPassword(_a) {
+    var { label, className, id, variant = "password", error, buttonFirstId, buttonSecondId, value, onChange, onClear } = _a, props = __rest(_a, ["label", "className", "id", "variant", "error", "buttonFirstId", "buttonSecondId", "value", "onChange", "onClear"]);
+    const [showPassword, setShowPassword] = useState(false);
+    const inputRef = useRef(null);
+    const handleTogglePassword = () => {
+        setShowPassword(!showPassword);
+    };
+    const handleClear = () => {
+        if (inputRef.current) {
+            inputRef.current.value = "";
+            const event = new Event("input", { bubbles: true });
+            inputRef.current.dispatchEvent(event);
+        }
+        onClear === null || onClear === void 0 ? void 0 : onClear();
+    };
+    return (_jsxs(_Fragment, { children: [label && (_jsx("label", { htmlFor: id, className: "text-base font-medium text-Neutral-300 px-3", children: label })), _jsxs("div", { className: "w-full relative mt-1", children: [_jsx("input", Object.assign({ ref: inputRef, id: id, type: showPassword ? "text" : "password", minLength: 5, placeholder: "xxxx xxxx xxxx xxxx", value: value, onChange: onChange, className: cn("autofill-input peer placeholder-Neutral-200 w-full px-[2.7rem] py-3 rounded-2xl bg-secondary-50 dark:bg-background-light border border-secondary-100 focus:outline-none focus:ring-0 focus:border-secondary-400 justify-between items-center text-Neutral-500 dark:text-white relative", variant === "change_password" &&
+                            "invalid:focus:border-Error-400 invalid:border-Error-400", className) }, props)), _jsx("div", { className: "absolute inset-y-0 rtl:right-0 ltr:left-0 rtl:pr-3 ltr:pl-3 flex items-center pointer-events-none", children: _jsx(LockIcon, {}) }), _jsx("div", { className: "absolute inset-y-0 rtl:left-0 ltr:right-0 px-3 flex items-center", children: variant === "password" ? (_jsx("button", { type: "button", onClick: handleClear, children: _jsx(CloseSquareIcon, {}) })) : (_jsx("button", { type: "button", onClick: handleTogglePassword, children: showPassword ? _jsx(HideIcon, {}) : _jsx(ShowIcon, {}) })) }), error && (_jsx("div", { className: "peer-focus:hidden absolute mt-2 mx-3", children: _jsx("div", { className: "text-Error-400 text-xs font-medium", children: translate(error) }) })), _jsx("div", { className: "hidden peer-invalid:flex absolute my-2 mx-3", children: _jsx("div", { className: "text-Error-400 text-xs font-medium", children: translate("error_min_length_password") }) })] })] }));
+}
+// InputRePassword Component
+export function InputRePassword(_a) {
+    var { label, id, buttonId, passwordFieldId = "ch_password" } = _a, props = __rest(_a, ["label", "id", "buttonId", "passwordFieldId"]);
+    const [showPassword, setShowPassword] = useState(false);
+    const [error, setError] = useState("");
+    const [value, setValue] = useState("");
+    const handleTogglePassword = () => {
+        setShowPassword(!showPassword);
+    };
+    const handleChange = (e) => {
+        const newValue = e.target.value;
+        setValue(newValue);
+        const passwordField = document.getElementById(passwordFieldId);
+        if (passwordField && passwordField.value !== newValue) {
+            setError("error_re_password");
+        }
+        else {
+            setError("");
+        }
+    };
+    return (_jsxs(_Fragment, { children: [label && (_jsx("label", { htmlFor: id, className: "text-base font-medium text-Neutral-300 px-3", children: label })), _jsxs("div", { className: "w-full relative mt-1", children: [_jsx("input", Object.assign({ id: id, type: showPassword ? "text" : "password", placeholder: "xxxx xxxx xxxx xxxx", value: value, onChange: handleChange, className: cn("autofill-input placeholder-Neutral-200 w-full px-[2.7rem] py-3 rounded-2xl bg-secondary-50 dark:bg-background-light border border-secondary-100 focus:outline-none focus:ring-0 focus:border-secondary-400 justify-between items-center text-Neutral-500 dark:text-white relative", error && "!border-Error-400 !focus:border-Error-400") }, props)), _jsx("button", { type: "button", onClick: handleTogglePassword, className: "absolute inset-y-0 rtl:left-0 ltr:right-0 px-3 flex items-center cursor-pointer", children: showPassword ? _jsx(HideIcon, {}) : _jsx(ShowIcon, {}) }), _jsx("div", { className: "absolute inset-y-0 rtl:right-0 ltr:left-0 rtl:pr-3 ltr:pl-3 flex items-center pointer-events-none", children: _jsx(LockIcon, {}) }), error && (_jsx("div", { className: "absolute mt-2 mx-3", children: _jsx("div", { className: "text-Error-400 text-xs font-medium", children: translate(error) }) }))] })] }));
+}
+// InputDarkLight Component
+export function InputDarkLight({ className }) {
+    const [isDark, setIsDark] = useState(() => {
+        return document.documentElement.classList.contains("dark");
+    });
+    const toggleTheme = () => {
+        const newTheme = !isDark;
+        setIsDark(newTheme);
+        if (newTheme) {
+            document.documentElement.classList.add("dark");
+            localStorage.setItem("theme", "dark");
+        }
+        else {
+            document.documentElement.classList.remove("dark");
+            localStorage.setItem("theme", "light");
+        }
+        const themeColorMeta = document.querySelector('meta[name="theme-color"]');
+        if (themeColorMeta) {
+            themeColorMeta.setAttribute("content", "#e57c43");
+        }
+    };
+    return (_jsxs("div", { className: "inline-flex items-center relative cursor-pointer", onClick: toggleTheme, children: [_jsx("input", { className: "peer hidden", id: "toggle", type: "checkbox", checked: !isDark, onChange: () => { } }), _jsx("div", { className: "relative w-[4rem] h-[2rem] peer-checked:bg-white bg-background rounded-full after:absolute after:content-[''] after:w-[1.5rem] after:h-[1.5rem] after:rounded-full after:top-[0.25rem] after:left-[0.25rem] after:bg-[linear-gradient(to_right,_#444350,_#444350)] peer-checked:after:bg-[linear-gradient(to_right,_#f97316,_#facc15)] active:after:w-[1.875rem] peer-checked:after:left-[3.75rem] peer-checked:after:translate-x-[-100%] shadow-sm duration-500 after:duration-500 after:shadow-md" }), _jsx(MoonIcon, { width: "1.25rem", height: "1.25rem", color: "white", className: "peer-checked:fill-black opacity-60 peer-checked:opacity-70 fill-white absolute w-4 h-4 left-[0.5rem]" }), _jsx(SunIcon, { width: "1.25rem", height: "1.25rem", color: "white", className: "fill-white peer-checked:opacity-60 absolute w-4 h-4 right-[0.5rem]" })] }));
+}
+// InputRadioButton Component
+export function InputRadioButton(_a) {
+    var { className, id, index = 0, name, useIndex = true, onSortChange } = _a, props = __rest(_a, ["className", "id", "index", "name", "useIndex", "onSortChange"]);
+    const handleClick = () => {
+        if (useIndex && onSortChange) {
+            onSortChange(index);
+        }
+    };
+    return (_jsxs("div", { className: "relative", children: [_jsx("input", Object.assign({ type: "radio", id: `${id}_RadioDropDownItem_${index}`, name: `RadioInput${name}`, onClick: handleClick, className: cn("peer appearance-none absolute top-[-0.5rem] ltr:right-0 rtl:left-0 w-5 h-5 transition-all !bg-transparent dark:bg-transparent border-2 border-Neutral-300 rounded-sm cursor-pointer checked:!bg-primary-400 checked:!border-primary-400 focus:ring-0 focus:ring-offset-0 after:content-[''] after:absolute after:inset-0 after:bg-[url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwb2x5bGluZSBwb2ludHM9IjIwIDYgOSAxNyA0IDEyIj48L3BvbHlsaW5lPjwvc3ZnPg==')] after:bg-no-repeat after:bg-center after:opacity-0 checked:after:opacity-100 z-30", className) }, props)), _jsx("label", { htmlFor: `${id}_RadioDropDownItem_${index}`, className: "absolute top-[-1.15rem] ltr:right-[-0.525rem] rtl:left-[-0.625rem] rounded-full h-[2.5rem] w-[2.5rem] flex justify-center items-center peer-checked:bg-white dark:peer-checked:bg-background z-10" })] }));
+}
+// InputToggle Component
+export function InputToggle(_a) {
+    var { className, checked = false, onStatusChange } = _a, props = __rest(_a, ["className", "checked", "onStatusChange"]);
+    const [isChecked, setIsChecked] = useState(() => {
+        return typeof checked === "string" ? checked === "true" : Boolean(checked);
+    });
+    useEffect(() => {
+        const newChecked = typeof checked === "string" ? checked === "true" : Boolean(checked);
+        setIsChecked(newChecked);
+    }, [checked]);
+    const handleToggle = (e) => {
+        const newValue = e.target.checked;
+        setIsChecked(newValue);
+        onStatusChange === null || onStatusChange === void 0 ? void 0 : onStatusChange(newValue);
+    };
+    return (_jsxs("label", { className: cn("inline-flex items-center cursor-pointer", className), children: [_jsx("input", Object.assign({ type: "checkbox", className: "sr-only peer", checked: isChecked, onChange: handleToggle }, props)), _jsx("div", { className: "relative w-11 h-6 bg-gray-200 rounded-full peer peer-focus:ring-2 peer-focus:ring-primary-300 dark:peer-focus:ring-primary-300 dark:bg-gray-700 peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-primary-400 dark:peer-checked:bg-primary-400" })] }));
 }

package/dist/components/ui/Input.types.d.ts

@@ -0,0 +1,45 @@
+import { InputHTMLAttributes, TextareaHTMLAttributes } from "react";
+export type BaseInputProps = InputHTMLAttributes<HTMLInputElement> & {
+    label?: string;
+    error?: string;
+};
+export type InputTextProps = BaseInputProps & {
+    onClear?: () => void;
+};
+export type InputEmailProps = BaseInputProps & {
+    variant?: "auth" | "default";
+    onClear?: () => void;
+};
+export type InputMobileProps = BaseInputProps & {
+    onClear?: () => void;
+};
+export type InputPasswordProps = BaseInputProps & {
+    variant?: "password" | "change_password";
+    buttonFirstId?: string;
+    buttonSecondId?: string;
+    onClear?: () => void;
+};
+export type InputRePasswordProps = BaseInputProps & {
+    buttonId?: string;
+    passwordFieldId?: string;
+};
+export type InputTextAreaProps = TextareaHTMLAttributes<HTMLTextAreaElement> & {
+    label?: string;
+};
+export type InputSearchProps = BaseInputProps & {
+    inputSearchRef?: React.RefObject<HTMLDivElement>;
+    classNameParent?: string;
+    searchClassname?: string;
+    param?: string;
+};
+export type InputRadioButtonProps = InputHTMLAttributes<HTMLInputElement> & {
+    index?: number;
+    useIndex?: boolean;
+    onSortChange?: (index: number) => void;
+};
+export type InputToggleProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'onChange'> & {
+    onStatusChange?: (value: boolean) => void;
+};
+export type InputDarkLightProps = {
+    className?: string;
+};

package/dist/components/ui/Input.types.js

@@ -0,0 +1 @@
+export {};

package/dist/components/ui/Modal.d.ts

@@ -1,9 +1,9 @@
-import { ReactNode } from "react";
-type ModalProps = {
-    isOpen: boolean;
-    onClose: () => void;
-    title?: string;
-    children: ReactNode;
-};
-export default function Modal({ isOpen, onClose, title, children }: ModalProps): import("react/jsx-runtime").JSX.Element | null;
-export {};
+import React, { HTMLAttributes } from "react";
+interface ModalProps extends HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    action?: (id?: string) => void;
+    className?: string;
+    id?: string;
+}
+declare const Modal: React.FC<ModalProps>;
+export default Modal;

package/dist/components/ui/Modal.js

@@ -1,7 +1,52 @@
-"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";
-export default function Modal({ isOpen, onClose, title, children }) {
-    if (!isOpen)
-        return null;
-    return (_jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", onClick: onClose, children: _jsxs("div", { className: "bg-white rounded-lg shadow-lg max-w-lg w-full p-6 relative", onClick: (e) => e.stopPropagation(), children: [title && _jsx("h2", { className: "text-xl font-bold mb-4", children: title }), _jsx("div", { children: children }), _jsx("button", { onClick: onClose, className: "absolute top-2 right-2 text-gray-500 hover:text-gray-800 transition-colors", children: "\u2715" })] }) }));
-}
+/*
+ * @Author: Mohammad Felfelani
+ * @Email: mfelfelani72@gmail.com
+ * @Team:
+ * @Date: 2025-10-26 15:32:12
+ * @Description:
+ */
+import { useEffect } from "react";
+// Components
+import { CloseSquareIcon } from "../icon/icon";
+// Functions
+import { cn } from "../../libs/cn";
+import { CloseModal } from "@/libs/modal/Modal";
+const Modal = (_a) => {
+    var { children, action, className, id } = _a, props = __rest(_a, ["children", "action", "className", "id"]);
+    // functions
+    useEffect(() => {
+        const handleKeyDown = (event) => {
+            if (event.key === "Escape" && id) {
+                CloseModal(id);
+            }
+        };
+        window.addEventListener("keydown", handleKeyDown);
+        return () => {
+            window.removeEventListener("keydown", handleKeyDown);
+        };
+    }, [id]);
+    const handleOverlayClick = () => {
+        if (action && id) {
+            action(id);
+        }
+    };
+    const handleCloseClick = () => {
+        if (id) {
+            CloseModal(id);
+        }
+    };
+    return (_jsxs("div", Object.assign({}, props, { id: id, className: "hidden fixed inset-0 items-center justify-center z-[999] p-4", children: [_jsx("div", { onClick: handleOverlayClick, className: "absolute inset-0 bg-black opacity-30" }), _jsx("div", { className: cn("relative max-w-2xl w-full max-h-[90vh] overflow-auto bg-white dark:bg-background-light rounded-2xl shadow-xl", className), children: _jsxs("div", { className: "p-4", children: [_jsx("div", { onClick: handleCloseClick, className: "w-full flex justify-end cursor-pointer", children: _jsx(CloseSquareIcon, { className: "mt-4 mx-4" }) }), children] }) })] })));
+};
+export default Modal;

package/dist/configs/language.d.ts

@@ -0,0 +1,39 @@
+/**
+ * @Author: Mohammad Felfelani
+ * @Email: mfelfelani72@gmail.com
+ * @Team:
+ * @Date: 2025-10-26 09:29:58
+ * @Description:
+ */
+/**
+ * @Author: Mohammad Felfelani
+ * @Email: mfelfelani72@gmail.com
+ * @Team:
+ * @Date: 2025-10-04 07:17:02
+ * @Description:
+ */
+export declare const languages: {
+    readonly en: {
+        readonly dir: "ltr";
+        readonly locale: "en_US";
+        readonly schemaLocale: "en-US";
+        readonly name: "English";
+        readonly flag: "🇺🇸";
+        readonly nativeName: "English";
+    };
+    readonly fa: {
+        readonly dir: "rtl";
+        readonly locale: "fa_IR";
+        readonly schemaLocale: "fa-IR";
+        readonly name: "Persian";
+        readonly flag: "🇮🇷";
+        readonly nativeName: "فارسی";
+    };
+};
+export type Lang = keyof typeof languages;
+export declare function getLocale(lang: Lang): string;
+export declare function getSchemaLocale(lang: Lang): string;
+export declare function getDirection(lang: Lang): "ltr" | "rtl";
+export declare function getName(lang: Lang): string;
+export declare function getNativeName(lang: Lang): string;
+export declare function getFlag(lang: Lang): string;

package/dist/configs/language.js

@@ -0,0 +1,50 @@
+/**
+ * @Author: Mohammad Felfelani
+ * @Email: mfelfelani72@gmail.com
+ * @Team:
+ * @Date: 2025-10-26 09:29:58
+ * @Description:
+ */
+/**
+ * @Author: Mohammad Felfelani
+ * @Email: mfelfelani72@gmail.com
+ * @Team:
+ * @Date: 2025-10-04 07:17:02
+ * @Description:
+ */
+export const languages = {
+    en: {
+        dir: "ltr",
+        locale: "en_US",
+        schemaLocale: "en-US",
+        name: "English",
+        flag: "🇺🇸",
+        nativeName: "English",
+    },
+    fa: {
+        dir: "rtl",
+        locale: "fa_IR",
+        schemaLocale: "fa-IR",
+        name: "Persian",
+        flag: "🇮🇷",
+        nativeName: "فارسی",
+    },
+};
+export function getLocale(lang) {
+    return languages[lang].locale;
+}
+export function getSchemaLocale(lang) {
+    return languages[lang].schemaLocale;
+}
+export function getDirection(lang) {
+    return languages[lang].dir;
+}
+export function getName(lang) {
+    return languages[lang].name;
+}
+export function getNativeName(lang) {
+    return languages[lang].nativeName;
+}
+export function getFlag(lang) {
+    return languages[lang].flag;
+}

package/dist/configs/metadata.d.ts

@@ -0,0 +1,69 @@
+import type { Metadata } from "next";
+import type { Lang } from "@/configs/language";
+import { PageMeta } from "@/Interfaces/meta";
+export declare function generatePageMetadata(lang?: Lang, pageKey?: string, customMeta?: Partial<PageMeta>): Promise<Metadata>;
+export declare function generateWebsiteSchema(lang: Lang): {
+    "@context": string;
+    "@type": string;
+    name: string;
+    url: string;
+    inLanguage: string;
+    potentialAction: {
+        "@type": string;
+        target: string;
+        "query-input": string;
+    };
+};
+export declare function generateOrganizationSchema(lang: Lang): {
+    "@context": string;
+    "@type": string;
+    name: string;
+    url: string;
+    logo: string;
+    inLanguage: string;
+    sameAs: string[];
+};
+export declare function generateArticleSchema(lang: Lang, article: {
+    title: string;
+    description: string;
+    image: string;
+    datePublished: string;
+    dateModified: string;
+    authorName: string;
+    authorUrl?: string;
+}): {
+    "@context": string;
+    "@type": string;
+    headline: string;
+    description: string;
+    image: string;
+    datePublished: string;
+    dateModified: string;
+    author: {
+        url?: string | undefined;
+        "@type": string;
+        name: string;
+    };
+    publisher: {
+        "@type": string;
+        name: string;
+        logo: {
+            "@type": string;
+            url: string;
+        };
+    };
+    inLanguage: string;
+};
+export declare function generateBreadcrumbSchema(items: {
+    name: string;
+    url: string;
+}[]): {
+    "@context": string;
+    "@type": string;
+    itemListElement: {
+        "@type": string;
+        position: number;
+        name: string;
+        item: string;
+    }[];
+};