@zauru-sdk/components 1.0.50 → 1.0.52

package/dist/Form/SelectField/index.js

@@ -1,74 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { IdeaIconSVG } from "@zauru-sdk/icons";
-import { useAppSelector } from "@zauru-sdk/redux";
-import { useEffect, useState } from "react";
-import Select, { components } from "react-select";
-import { LoadingInputSkeleton } from "../../Skeletons/index.js";
-const Input = (props) => (_jsx(components.Input, { ...props, readOnly: props.selectProps.isReadOnly }));
-export const SelectFieldWithoutValidation = (props) => {
-    const { id, name, title, defaultValue, defaultValueMulti = [], helpText, hint, options, onChange, onChangeMulti, isClearable = false, error = false, disabled = false, readOnly = false, isMulti = false, loading = false, className = "", onInputChange, } = props;
-    const [value, setValue] = useState(defaultValue || null);
-    const [valueMulti, setValueMulti] = useState(defaultValueMulti);
-    const [inputValue, setInputValue] = useState("");
-    const [showTooltip, setShowTooltip] = useState(false);
-    const [isClient, setIsClient] = useState(typeof window !== "undefined");
-    const menuIsOpen = readOnly ? false : props?.menuIsOpen;
-    const color = error ? "red" : "gray";
-    let documentRef = null;
-    const isReadOnly = disabled || readOnly;
-    const bgColor = isReadOnly ? "bg-gray-200" : `bg-${color}-50`;
-    const textColor = isReadOnly ? "text-gray-500" : `text-${color}-900`;
-    const borderColor = isReadOnly ? "border-gray-300" : `border-${color}-500`;
-    if (typeof window !== "undefined") {
-        documentRef = document;
-    }
-    useEffect(() => {
-        setValue(defaultValue || null);
-    }, [defaultValue]);
-    useEffect(() => {
-        setIsClient(true);
-    }, []);
-    if (!isClient || loading || !documentRef) {
-        return (_jsxs(_Fragment, { children: [title && (_jsx("label", { htmlFor: error ? `${name}-error` : `${name}-success`, className: `block text-sm font-medium text-${color}-700 dark:text-${color}-500`, children: title })), _jsx(LoadingInputSkeleton, {}), helpText && (_jsx("p", { className: `mt-2 italic text-sm text-${color}-500 dark:text-${color}-400`, children: helpText }))] }));
-    }
-    const handleOnChange = (selection) => {
-        // Verificar si el valor de selección es un objeto con propiedades 'value' y 'label'
-        if (typeof selection === "object" &&
-            selection !== null &&
-            "value" in selection &&
-            "label" in selection) {
-            setValue(selection);
-            onChange && onChange(selection);
-        }
-        else {
-            setValue(null);
-            onChange && onChange(null);
-        }
-    };
-    const handleOnChangeMulti = (selection) => {
-        if (Array.isArray(selection)) {
-            setValueMulti(selection);
-            onChangeMulti &&
-                onChangeMulti(selection);
-        }
-        else {
-            setValueMulti([]);
-            onChangeMulti && onChangeMulti([]);
-        }
-    };
-    const selectComponent = (_jsxs(_Fragment, { children: [_jsx(Select, { className: `block w-full rounded-md ${bgColor} ${borderColor} ${textColor} shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm`, id: isMulti ? undefined : id, instanceId: isMulti ? undefined : id, isDisabled: disabled, name: isMulti ? undefined : name, options: options, onChange: isMulti ? handleOnChangeMulti : handleOnChange, defaultValue: isMulti ? valueMulti : value, onInputChange: (newValue, actionMeta) => {
-                    setInputValue(newValue);
-                    onInputChange && onInputChange(newValue, actionMeta);
-                }, inputValue: inputValue, onMenuOpen: () => { }, onMenuClose: () => { }, menuPortalTarget: documentRef?.body, styles: { menuPortal: (base) => ({ ...base, zIndex: 9999 }) }, isClearable: isClearable, isSearchable: true, components: { Input }, menuIsOpen: menuIsOpen, 
-                //windowThreshold={50}
-                isMulti: isMulti }), isMulti && (_jsx("input", { hidden: true, readOnly: true, name: name, value: valueMulti.map((x) => x?.value).join(","), id: id }))] }));
-    return (_jsxs("div", { className: `col-span-6 sm:col-span-3 ${className}`, children: [title && (_jsx("label", { htmlFor: error ? `${name}-error` : `${name}-success`, className: `block text-sm font-medium ${color === "red"
-                    ? "text-red-700 dark:text-red-500"
-                    : "text-gray-700 dark:text-gray-500"}`, children: title })), _jsxs("div", { className: "flex relative items-center", children: [selectComponent, helpText && (_jsx("div", { className: "flex items-center relative ml-3", children: _jsxs("div", { className: "relative cursor-pointer", onMouseEnter: () => setShowTooltip(true), onMouseLeave: () => setShowTooltip(false), children: [_jsx(IdeaIconSVG, {}), showTooltip && (_jsx("div", { className: "absolute -left-48 top-0 mt-8 p-2 bg-white border rounded shadow text-black z-50", children: helpText }))] }) }))] }), error && (_jsxs("p", { className: `mt-2 text-sm text-${color}-600 dark:text-${color}-500`, children: [_jsx("span", { className: "font-medium", children: "Oops!" }), " ", error] })), !error && hint && (_jsx("p", { className: `mt-2 italic text-sm text-${color}-500 dark:text-${color}-400`, children: hint }))] }));
-};
-export const SelectField = (props) => {
-    const { formValidations } = useAppSelector((state) => state.formValidation);
-    const error = formValidations[props.formName ?? "-1"]?.[props.name ?? "-1"];
-    props = { ...props, error };
-    return _jsx(SelectFieldWithoutValidation, { ...props });
-};

package/dist/Form/TextArea/index.d.ts

@@ -1,23 +0,0 @@
-import React from "react";
-type Props = {
-    id?: string;
-    name: string;
-    formName?: string;
-    title?: string;
-    defaultValue?: string | number;
-    hidden?: boolean;
-    hint?: string;
-    helpText?: string;
-    onChange?: (value: string) => void;
-    onKeyDown?: (event: React.KeyboardEvent) => void;
-    disabled?: boolean;
-    readOnly?: boolean;
-    error?: string | undefined;
-    rows?: number;
-    cols?: number;
-    stopChangeEvents?: boolean;
-    className?: string;
-};
-export declare const TextAreaWithoutValidation: (props: Props) => import("react/jsx-runtime").JSX.Element;
-export declare const TextArea: (props: Props) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/Form/TextArea/index.js

@@ -1,36 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useAppSelector } from "@zauru-sdk/redux";
-import { useEffect, useState } from "react";
-export const TextAreaWithoutValidation = (props) => {
-    const { id, name, title, defaultValue = "", hidden, hint, onChange, onKeyDown, disabled = false, error = false, readOnly = false, rows, cols, stopChangeEvents, className = "", } = props;
-    const [value, setValue] = useState(defaultValue);
-    const color = error ? "red" : "gray";
-    const isReadOnly = disabled || readOnly;
-    const bgColor = isReadOnly ? "bg-gray-200" : `bg-${color}-50`;
-    const textColor = isReadOnly ? "text-gray-500" : `text-${color}-900`;
-    const borderColor = isReadOnly ? "border-gray-300" : `border-${color}-500`;
-    useEffect(() => {
-        setValue(defaultValue);
-    }, [defaultValue]);
-    if (hidden) {
-        return (_jsx("textarea", { id: id ?? name, name: name, value: defaultValue, readOnly: true, hidden: true }));
-    }
-    const handleInputChange = (event) => {
-        if (stopChangeEvents) {
-            event.stopPropagation();
-            event.preventDefault();
-        }
-        setValue(event.target.value);
-        onChange && onChange(event.target.value);
-    };
-    return (_jsxs("div", { className: `col-span-6 sm:col-span-3 ${className}`, children: [title && (_jsx("label", { htmlFor: error ? `${name}-error` : `${name}-success`, className: `block text-sm font-medium text-${color}-700 dark:text-${color}-500`, children: title })), _jsx("textarea", { name: name, readOnly: readOnly, disabled: disabled, id: id ?? name, autoComplete: "given-name", value: value, rows: rows, cols: cols, onChange: handleInputChange, onKeyDown: (event) => {
-                    onKeyDown && onKeyDown(event);
-                }, className: `mt-1 block w-full rounded-md ${bgColor} ${borderColor} ${textColor} shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm` }), error && (_jsxs("p", { className: `mt-2 text-sm text-${color}-600 dark:text-${color}-500`, children: [_jsx("span", { className: "font-medium", children: "Oops!" }), " ", error] })), !error && hint && (_jsx("p", { className: `mt-2 italic text-sm text-${color}-500 dark:text-${color}-400`, children: hint }))] }));
-};
-//<reference> https://tailwindui.com/components/application-ui/forms/form-layouts
-export const TextArea = (props) => {
-    const { formValidations } = useAppSelector((state) => state.formValidation);
-    const error = formValidations[props.formName ?? "-1"]?.[props.name ?? "-1"];
-    props = { ...props, error };
-    return _jsx(TextAreaWithoutValidation, { ...props });
-};

package/dist/Form/TextField/index.d.ts

@@ -1,25 +0,0 @@
-import React from "react";
-type Props = {
-    id?: string;
-    name?: string;
-    formName?: string;
-    title?: string;
-    defaultValue?: string | number;
-    hidden?: boolean;
-    type?: React.HTMLInputTypeAttribute;
-    helpText?: string;
-    hint?: string;
-    onChange?: (value: string, event: React.ChangeEvent<HTMLInputElement>) => void;
-    onKeyDown?: (event: React.KeyboardEvent) => void;
-    disabled?: boolean;
-    readOnly?: boolean;
-    error?: string;
-    min?: string | number;
-    integer?: boolean;
-    stopChangeEvents?: boolean;
-    style?: React.CSSProperties;
-    className?: string;
-};
-export declare const TextFieldWithoutValidation: (props: Props) => import("react/jsx-runtime").JSX.Element;
-export declare const TextField: (props: Props) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/Form/TextField/index.js

@@ -1,70 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { IdeaIconSVG } from "@zauru-sdk/icons";
-import { useAppSelector } from "@zauru-sdk/redux";
-import { useEffect, useState } from "react";
-export const TextFieldWithoutValidation = (props) => {
-    const { id, name, defaultValue = "", hidden, type = "text", onChange, onKeyDown, disabled = false, readOnly = false, min, integer = false, stopChangeEvents, style, error, title, helpText, className, hint, } = props;
-    const [showTooltip, setShowTooltip] = useState(false);
-    const [value, setValue] = useState(defaultValue);
-    const color = error ? "red" : "gray";
-    const isReadOnly = disabled || readOnly;
-    const bgColor = isReadOnly ? "bg-gray-200" : `bg-${color}-50`;
-    const textColor = isReadOnly ? "text-gray-500" : `text-${color}-900`;
-    const borderColor = isReadOnly ? "border-gray-300" : `border-${color}-500`;
-    useEffect(() => {
-        setValue(defaultValue);
-    }, [defaultValue]);
-    if (hidden) {
-        return (_jsx("input", { type: type, id: id ?? name, name: name, value: defaultValue, readOnly: true, hidden: true }));
-    }
-    const handleInputChange = (event) => {
-        if (stopChangeEvents) {
-            event.stopPropagation();
-            event.preventDefault();
-        }
-        if (integer && type === "number") {
-            const value = event.target.value;
-            const isInteger = /^[0-9]*$/.test(value);
-            if (isInteger || value === "") {
-                setValue(value);
-                onChange && onChange(value, event);
-            }
-        }
-        else {
-            setValue(event.target.value);
-            onChange && onChange(event.target.value, event);
-        }
-    };
-    const handleKeyDown = (event) => {
-        if (integer && type === "number") {
-            // Permitir solo números y teclas de control
-            const allowedKeys = [
-                "Backspace",
-                "ArrowLeft",
-                "ArrowRight",
-                "Delete",
-                "Enter",
-                "Tab",
-            ];
-            if (!allowedKeys.includes(event.key) && !/^[0-9]$/.test(event.key)) {
-                event.preventDefault();
-            }
-        }
-    };
-    const inputComponent = (_jsx("input", { type: type, name: name, readOnly: readOnly, disabled: disabled, id: id ?? name, autoComplete: "given-name", value: value, onWheel: (e) => {
-            e.currentTarget.blur();
-        }, step: type === "number" ? 0.01 : undefined, onChange: handleInputChange, onKeyDown: (event) => {
-            handleKeyDown(event);
-            onKeyDown && onKeyDown(event);
-        }, min: min, style: style, className: `block w-full rounded-md ${bgColor} ${borderColor} ${textColor} shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm` }));
-    if (!error && !title) {
-        return _jsx("div", { className: `${className}`, children: inputComponent });
-    }
-    return (_jsxs("div", { className: `col-span-6 sm:col-span-3 ${className}`, children: [title && (_jsx("label", { htmlFor: error ? `${name}-error` : `${name}-success`, className: `block mb-1 text-sm font-medium text-${color}-700 dark:text-${color}-500`, children: title })), _jsxs("div", { className: "flex relative items-center", children: [inputComponent, helpText && (_jsx("div", { className: "flex items-center relative ml-3", children: _jsxs("div", { className: "relative cursor-pointer", onMouseEnter: () => setShowTooltip(true), onMouseLeave: () => setShowTooltip(false), children: [_jsx(IdeaIconSVG, {}), showTooltip && (_jsx("div", { className: "absolute -left-48 top-0 mt-8 p-2 bg-white border rounded shadow text-black z-50", children: helpText }))] }) }))] }), error && (_jsxs("p", { className: `mt-2 text-sm text-${color}-600 dark:text-${color}-500`, children: [_jsx("span", { className: "font-medium", children: "Oops!" }), " ", error] })), !error && hint && (_jsx("p", { className: `mt-2 italic text-sm text-${color}-500 dark:text-${color}-400`, children: hint }))] }));
-};
-export const TextField = (props) => {
-    const { formValidations } = useAppSelector((state) => state.formValidation);
-    const error = formValidations[props.formName ?? "-1"]?.[props.name ?? "-1"];
-    props = { ...props, error };
-    return _jsx(TextFieldWithoutValidation, { ...props });
-};

package/dist/Form/TimePicker/index.d.ts

@@ -1,16 +0,0 @@
-type Props = {
-    id?: string;
-    name: string;
-    formName?: string;
-    title?: string;
-    hint?: string;
-    helpText?: string;
-    defaultValue?: string;
-    onChange?: (value: string) => void;
-    tabIndex?: number;
-    error?: string;
-    disabled?: boolean;
-};
-export declare const FormTimePickerWithoutValidation: (props: Props) => import("react/jsx-runtime").JSX.Element;
-export declare const FormTimePicker: (props: Props) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/Form/TimePicker/index.js

@@ -1,31 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { ClockIconSVG, CloseSvgIcon, IdeaIconSVG } from "@zauru-sdk/icons";
-import { useAppSelector } from "@zauru-sdk/redux";
-import { useEffect, useState } from "react";
-export const FormTimePickerWithoutValidation = (props) => {
-    const { id, name, title, defaultValue = "", hint, helpText, onChange, tabIndex, error, disabled = false, } = props;
-    const [value, setValue] = useState(defaultValue);
-    const [showTooltip, setShowTooltip] = useState(false);
-    const color = error ? "red" : "gray";
-    const isReadOnly = disabled;
-    const bgColor = isReadOnly ? "bg-gray-200" : `bg-${color}-50`;
-    const textColor = isReadOnly ? "text-gray-500" : `text-${color}-500`;
-    const borderColor = isReadOnly ? "border-gray-300" : `border-${color}-200`;
-    useEffect(() => {
-        setValue(defaultValue);
-    }, [defaultValue]);
-    const clearValue = () => {
-        setValue("");
-        onChange && onChange("");
-    };
-    return (_jsxs(_Fragment, { children: [title && (_jsx("label", { htmlFor: error ? `${name}-error` : `${name}-success`, className: `block text-sm font-medium ${textColor}`, children: title })), _jsxs("div", { className: "flex relative items-center", children: [_jsx("div", { className: "absolute left-0 flex items-center pl-3 pointer-events-none", children: _jsx(ClockIconSVG, {}) }), _jsx("input", { id: id, name: name, tabIndex: tabIndex, type: "time", onChange: (e) => {
-                            setValue(e.target.value);
-                            onChange && onChange(e.target.value);
-                        }, value: value, pattern: "\\d{2}:\\d{2}", className: `${bgColor} ${borderColor} ${textColor} text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full pl-10 p-2.5` }), value && (_jsx("button", { type: "button", onClick: clearValue, className: "absolute right-0 mr-10", children: _jsx(CloseSvgIcon, {}) })), helpText && (_jsx("div", { className: "flex items-center relative ml-3", children: _jsxs("div", { className: "relative cursor-pointer", onMouseEnter: () => setShowTooltip(true), onMouseLeave: () => setShowTooltip(false), children: [_jsx(IdeaIconSVG, {}), showTooltip && (_jsx("div", { className: "absolute -left-48 top-0 mt-8 p-2 bg-white border rounded shadow text-black", children: helpText }))] }) }))] }), error && (_jsxs("p", { className: `mt-2 text-sm text-${color}-600 dark:text-${color}-500`, children: [_jsx("span", { className: "font-medium", children: "Oops!" }), " ", error] })), !error && hint && (_jsx("p", { className: `mt-2 italic text-sm text-${color}-500 dark:text-${color}-400`, children: hint }))] }));
-};
-export const FormTimePicker = (props) => {
-    const { formValidations } = useAppSelector((state) => state.formValidation);
-    const error = formValidations[props.formName ?? "-1"]?.[props.name ?? "-1"];
-    props = { ...props, error };
-    return _jsx(FormTimePickerWithoutValidation, { ...props });
-};

package/dist/Form/YesNo/index.d.ts

@@ -1,12 +0,0 @@
-type Props = {
-    id?: string;
-    name: string;
-    formName?: string;
-    title?: string;
-    defaultValue?: boolean;
-    helpText?: string;
-    onChange?: (value: boolean) => void;
-    disabled?: boolean;
-};
-export declare const YesNo: (props: Props) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/Form/YesNo/index.js

@@ -1,18 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useAppSelector } from "@zauru-sdk/redux";
-import { useState } from "react";
-export const YesNo = (props) => {
-    const { id, name, title, defaultValue = false, helpText, onChange, disabled, } = props;
-    const { formValidations } = useAppSelector((state) => state.formValidation);
-    const error = formValidations[props.formName ?? "-1"]?.[props.name ?? "-1"];
-    const [value, setValue] = useState(defaultValue);
-    const color = error ? "red" : "gray";
-    const handleOnChange = () => {
-        if (disabled)
-            return; // No hacer nada si está deshabilitado
-        const newValue = !value;
-        setValue(newValue);
-        onChange && onChange(newValue);
-    };
-    return (_jsxs(_Fragment, { children: [_jsxs("label", { className: `relative inline-flex items-center cursor-pointer ${disabled ? "opacity-50" : ""}`, children: [_jsx("input", { type: "checkbox", id: id ?? name, name: name, checked: value, value: value.toString(), className: "sr-only peer", onChange: handleOnChange, disabled: disabled }), value.toString() === "false" && (_jsx("input", { type: "hidden", name: name, value: "false" })), _jsx("div", { className: "w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-600" }), _jsx("span", { className: "ml-3 text-sm font-medium text-gray-900", children: title })] }), error && (_jsxs("p", { className: `mt-2 text-sm text-${color}-600 dark:text-${color}-500`, children: [_jsx("span", { className: "font-medium", children: "Oops!" }), " ", error] })), !error && helpText && (_jsx("p", { className: `mt-2 italic text-sm text-${color}-500 dark:text-${color}-400`, children: helpText }))] }));
-};

package/dist/Form/index.d.ts

@@ -1,13 +0,0 @@
-export * from "./Checkbox/index.js";
-export * from "./Checklist/index.js";
-export * from "./DatePicker/index.js";
-export * from "./DynamicBaculoForm/index.js";
-export * from "./FieldContainer/index.js";
-export * from "./FileUpload/index.js";
-export * from "./FormButtons/index.js";
-export * from "./FormLayout/index.js";
-export * from "./SelectField/index.js";
-export * from "./TextArea/index.js";
-export * from "./TextField/index.js";
-export * from "./TimePicker/index.js";
-export * from "./YesNo/index.js";

package/dist/Form/index.js

@@ -1,13 +0,0 @@
-export * from "./Checkbox/index.js";
-export * from "./Checklist/index.js";
-export * from "./DatePicker/index.js";
-export * from "./DynamicBaculoForm/index.js";
-export * from "./FieldContainer/index.js";
-export * from "./FileUpload/index.js";
-export * from "./FormButtons/index.js";
-export * from "./FormLayout/index.js";
-export * from "./SelectField/index.js";
-export * from "./TextArea/index.js";
-export * from "./TextField/index.js";
-export * from "./TimePicker/index.js";
-export * from "./YesNo/index.js";

package/dist/Labels/InfoLabel/index.d.ts

@@ -1,7 +0,0 @@
-type Props = {
-    description: string;
-    title: string;
-    className?: string;
-};
-export declare const InfoLabel: (props: Props) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/Labels/InfoLabel/index.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const InfoLabel = (props) => {
-    const { description, title, className } = props;
-    return (_jsxs("div", { className: `block ${className}`, children: [_jsx("label", { className: "inline text-sm font-medium text-gray-700", children: `${title.toUpperCase()} ` }), _jsx("label", { className: "inline text-sm font-medium text-gray-500", children: description })] }));
-};

package/dist/Labels/index.d.ts

@@ -1 +0,0 @@
-export * from "./InfoLabel/index.js";

package/dist/Labels/index.js

@@ -1 +0,0 @@
-export * from "./InfoLabel/index.js";

package/dist/Layouts/homeLayout/index.d.ts

@@ -1,6 +0,0 @@
-type Props = {
-    title?: string;
-    description?: string;
-};
-export declare const HomeLayout: ({ title, description }: Props) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/Layouts/homeLayout/index.js

@@ -1,10 +0,0 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const HomeLayout = ({ title, description }) => {
-    return (_jsx("div", { className: "bg-cover bg-center h-screen", style: { backgroundImage: 'url("/wallpaper.webp")' }, children: _jsxs("div", { className: "flex flex-col h-screen justify-center items-center", children: [_jsx("h1", { className: "text-6xl md:text-7xl lg:text-8xl text-white font-bold mb-6 text-center", style: {
-                        textShadow: "0.5px 0.5px 1px #000000",
-                        WebkitTextStroke: "2px #000000",
-                    }, children: title ?? _jsx(_Fragment, { children: "Bienvenido, inicie sesi\u00F3n para continuar." }) }), _jsx("p", { className: "text-xl md:text-2xl lg:text-3xl text-white text-center max-w-md mb-12", style: {
-                        textShadow: "0.5px 0.5px 1px #000000",
-                        WebkitTextStroke: "1px #000000",
-                    }, children: description ?? _jsx(_Fragment, { children: "Web app, realizada en Zauru." }) })] }) }));
-};

package/dist/Layouts/index.d.ts

@@ -1 +0,0 @@
-export * from "./homeLayout/index.js";

package/dist/Layouts/index.js

@@ -1 +0,0 @@
-export * from "./homeLayout/index.js";

package/dist/LineSeparator/LineSeparator.d.ts

@@ -1 +0,0 @@
-export declare const LineSeparator: () => import("react/jsx-runtime").JSX.Element;

package/dist/LineSeparator/LineSeparator.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export const LineSeparator = () => {
-    return _jsx("hr", { className: "h-px my-8 bg-gray-200 border-0 dark:bg-gray-400" });
-};

package/dist/LineSeparator/index.d.ts

@@ -1 +0,0 @@
-export * from "./LineSeparator.js";

package/dist/LineSeparator/index.js

@@ -1 +0,0 @@
-export * from "./LineSeparator.js";

package/dist/Modal/Modal.d.ts

@@ -1,10 +0,0 @@
-import React from "react";
-export type ModalOption = "OK" | "CANCEL" | null;
-type ModalParams = {
-    title: string;
-    description: React.ReactNode;
-    okButtonText?: string;
-    showOptions?: boolean;
-};
-export declare const createModal: ({ title, description, okButtonText, showOptions, }: ModalParams) => Promise<ModalOption>;
-export {};

package/dist/Modal/Modal.js

@@ -1,32 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { createRoot } from "react-dom/client";
-export const createModal = ({ title, description, okButtonText, showOptions = true, }) => {
-    return new Promise((resolve) => {
-        const handleClose = () => {
-            resolve(null);
-            removeModal();
-        };
-        const handleOk = () => {
-            resolve("OK");
-            removeModal();
-        };
-        const handleCancel = () => {
-            resolve("CANCEL");
-            removeModal();
-        };
-        const removeModal = () => {
-            document.body.removeChild(modalWrapper);
-            document.body.removeChild(modalOverlay);
-        };
-        const modalWrapper = document.createElement("div");
-        modalWrapper.classList.add("justify-center", "items-center", "flex", "overflow-x-hidden", "overflow-y-auto", "fixed", "inset-0", "z-50", "outline-none", "focus:outline-none");
-        // Crear capa de fondo detrás del modal
-        const modalOverlay = document.createElement("div");
-        modalOverlay.classList.add("fixed", "inset-0", "bg-black", "opacity-50", "z-40");
-        document.body.appendChild(modalOverlay);
-        document.body.appendChild(modalWrapper);
-        const ModalContent = () => (_jsx("div", { className: "relative w-auto my-6 mx-auto max-w-3xl", children: _jsxs("div", { className: "border-0 rounded-lg shadow-lg relative flex flex-col w-full bg-white outline-none focus:outline-none", children: [_jsxs("div", { className: "flex items-start justify-between p-5 border-b border-solid border-slate-200 rounded-t", children: [_jsx("h3", { className: "text-3xl font-semibold", children: title }), _jsx("button", { className: "p-1 ml-auto bg-transparent border-0 text-black float-right text-3xl leading-none font-semibold outline-none focus:outline-none", children: _jsx("span", { className: "close-button", onClick: handleClose, children: "\u00D7" }) })] }), _jsx("div", { className: "relative p-6 flex-auto", children: description }), showOptions && (_jsxs("div", { className: "flex items-center justify-end p-6 border-t border-solid border-slate-200 rounded-b", children: [_jsx("button", { className: "cancel-button text-red-700 background-transparent font-bold uppercase px-6 py-2 text-sm outline-none focus:outline-none mr-1 mb-1 ease-linear transition-all duration-150", type: "button", onClick: handleCancel, children: "Cancelar" }), _jsx("button", { className: "ok-button bg-emerald-700 text-white active:bg-emerald-600 font-bold uppercase text-sm px-6 py-3 rounded shadow hover:shadow-lg outline-none focus:outline-none mr-1 mb-1 ease-linear transition-all duration-150", type: "button", onClick: handleOk, children: okButtonText ?? "Aceptar" })] }))] }) }));
-        const root = createRoot(modalWrapper);
-        root.render(_jsx(ModalContent, {}));
-    });
-};

package/dist/Modal/index.d.ts

@@ -1 +0,0 @@
-export * from "./Modal.js";

package/dist/Modal/index.js

@@ -1 +0,0 @@
-export * from "./Modal.js";

package/dist/NavBar/NavBar.d.ts

@@ -1,2 +0,0 @@
-import type { NavBarProps } from "./NavBar.types.js";
-export declare const NavBar: ({ title, loggedIn, items, selectedColor, }: NavBarProps) => import("react/jsx-runtime").JSX.Element;

package/dist/NavBar/NavBar.js

@@ -1,32 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState } from "react";
-import { DropDownArrowSvgIcon, LogoutDropDownSvgIcon, MenuAlt4Svg, OpcionButtonSvgIcon, } from "@zauru-sdk/icons";
-import { COLORS } from "./NavBar.utils.js";
-import { Link } from "@remix-run/react";
-const DropDownLinkButton = ({ text, path, icon, buttonHover, }) => (_jsx(Link, { className: `block px-4 py-3 text-sm text-gray-600 capitalize transition-colors duration-200 transform dark:text-gray-300 ${buttonHover ?? ""} dark:hover:bg-gray-700 dark:hover:text-white`, to: path, prefetch: "none", children: _jsxs("div", { className: "mx-auto pt-2", children: [icon, _jsx("span", { children: text })] }) }));
-const OptionsDropDownButton = ({ color, options, name }) => {
-    const [showOptionsMenu, setShowOptionsMenu] = useState(true);
-    return (_jsx("div", { className: "nav-item ml-auto", children: _jsx("div", { className: "flex justify-center", children: _jsxs("div", { className: "relative inline-block", children: [_jsxs("button", { onClick: () => setShowOptionsMenu(!showOptionsMenu), className: `relative flex items-center p-2 text-xs text-white ${color.bg700} active:${color.bg900} border border-transparent rounded-full uppercase focus:ring-opacity-40 focus:outline-none`, children: [name ?? _jsx(OpcionButtonSvgIcon, {}), _jsx(DropDownArrowSvgIcon, {})] }), _jsx("div", { className: "absolute right-0 z-20 w-56 py-2 mt-2 overflow-hidden bg-white rounded-md shadow-xl dark:bg-gray-800", hidden: showOptionsMenu, onMouseLeave: () => setShowOptionsMenu(true), children: options.map((option) => option) })] }) }) }));
-};
-const NavItem = ({ name, link, icon, color, specialColor, childrens = [], }) => (_jsx("li", { className: "nav-item", children: childrens.length > 0 ? (_jsx(OptionsDropDownButton, { name: name, color: color, options: childrens.map((x, index) => (_jsx(DropDownLinkButton, { text: x.name, path: x.link, buttonHover: "hover:bg-red-100" }, index))) })) : (_jsx("div", { className: `${specialColor ? specialColor.bg700 : color.bg700} container text-white w-56 sm:w-auto h-10 text-sm py-1 uppercase rounded shadow hover:shadow-lg outline-none rounded-full focus:outline-none my-auto sm:my-0 sm:mr-1 mb-1 ease-linear transition-all duration-150 `, children: _jsx(Link, { className: "px-3 flex items-center text-xs leading-snug text-white uppercase hover:opacity-75", to: link, prefetch: "none", children: _jsxs("div", { className: "mx-auto pt-2", children: [icon, _jsx("span", { children: name })] }) }) })) }));
-export const NavBar = ({ title, loggedIn, items, selectedColor, }) => {
-    const color = COLORS[selectedColor];
-    const [NavBarOpen, setNavBarOpen] = useState(false);
-    const options = (_jsxs(_Fragment, { children: [_jsx("ul", { children: loggedIn && (_jsx("div", { className: "flex flex-col sm:flex-row ", children: items
-                        .filter((item) => item.loggedIn)
-                        .map((item, index) => {
-                        const specialColor = item.color
-                            ? COLORS[item.color]
-                            : undefined;
-                        return (_jsx(NavItem, { name: item.name, link: item.link, icon: item.icon, specialColor: specialColor, color: color, childrens: item.childrens?.map((x) => {
-                                return { ...x };
-                            }) }, index));
-                    }) })) }), _jsx("ul", { className: "sm:flex sm:flex-col ml-auto lg:flex-row", children: loggedIn ? (_jsx(OptionsDropDownButton, { color: color, options: [
-                        _jsx(DropDownLinkButton, { text: "Cerrar Sesi\u00F3n", path: "/logout", icon: _jsx(LogoutDropDownSvgIcon, {}), buttonHover: "hover:bg-red-100" }, 0),
-                    ] })) : (items
-                    .filter((item) => !item.loggedIn)
-                    .map((item, index) => {
-                    return (_jsx(NavItem, { name: item.name, link: item.link, icon: item.icon, color: color }, index));
-                })) })] }));
-    return (_jsx("nav", { className: `py-3 ${color.bg600}`, children: _jsxs("div", { className: "flex items-center justify-between ml-5 mr-5", children: [_jsxs("div", { className: "flex justify-between w-full lg:w-auto", children: [_jsx(Link, { className: "text-sm font-bold leading-relaxed inline-block mr-4 py-2 whitespace-nowrap uppercase text-white", to: "/home", prefetch: "none", children: _jsxs(_Fragment, { children: [_jsx("div", { className: "inline-block mr-2 mb-2 align-middle", children: _jsx("img", { className: "w-auto h-7", src: "/logo.png", alt: "logo-zauru" }) }), title] }) }), _jsx("button", { className: `rounded lg:hidden focus:outline-none focus:ring focus:${color.ring600} focus:ring-opacity-50`, "aria-label": "Toggle mobile menu", type: "button", onClick: () => setNavBarOpen(!NavBarOpen), children: _jsx(MenuAlt4Svg, { open: NavBarOpen }) })] }), _jsx("div", { className: `lg:hidden absolute top-0 left-0 z-50 w-64 h-full ${color.bg700} shadow-lg transform ${NavBarOpen ? "translate-x-0" : "-translate-x-full"} transition-transform duration-300 ease-in-out`, children: options }), _jsx("div", { className: "hidden lg:flex w-full lg:w-auto", children: options })] }) }));
-};

package/dist/NavBar/NavBar.types.d.ts

@@ -1,50 +0,0 @@
-export type NavBarItemsSchema = {
-    name: string;
-    link: string;
-    loggedIn: boolean;
-    icon?: any;
-    color?: "green";
-    childrens?: Exclude<NavBarItemsSchema, "loggedIn">[];
-};
-export type NavBarProps = {
-    title: string;
-    loggedIn: boolean;
-    items: Array<NavBarItemsSchema>;
-    selectedColor: "pink" | "purple" | "slate" | "green" | "yellow" | "red" | "sky";
-    LinkComponent?: any;
-};
-export type NavBarStateProps = {
-    NavBarOpen: boolean;
-    setNavBarOpen?: any;
-};
-export type ColorInterface = {
-    bg900: string;
-    bg700: string;
-    bg600: string;
-    bg500: string;
-    ring600: string;
-    ring500: string;
-};
-export type NavItemProps = {
-    name: string;
-    link: string;
-    icon?: any;
-    color: ColorInterface;
-    specialColor?: ColorInterface;
-    childrens?: Exclude<NavItemProps, "index" | "color">[];
-};
-export type EntityNameType = {
-    entityName: string;
-};
-export type EntityProps = {
-    name?: string;
-    color: ColorInterface;
-    options: any[];
-};
-export type DropDownLinkButtonType = {
-    text: string;
-    path: string;
-    icon?: any;
-    buttonHover?: string;
-    LinkComponent?: any;
-};

package/dist/NavBar/NavBar.types.js

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

package/dist/NavBar/NavBar.utils.d.ts

@@ -1,58 +0,0 @@
-export declare const COLORS: {
-    sky: {
-        bg900: string;
-        bg700: string;
-        bg600: string;
-        bg500: string;
-        ring600: string;
-        ring500: string;
-    };
-    purple: {
-        bg900: string;
-        bg700: string;
-        bg600: string;
-        bg500: string;
-        ring600: string;
-        ring500: string;
-    };
-    pink: {
-        bg900: string;
-        bg700: string;
-        bg600: string;
-        bg500: string;
-        ring600: string;
-        ring500: string;
-    };
-    slate: {
-        bg900: string;
-        bg700: string;
-        bg600: string;
-        bg500: string;
-        ring600: string;
-        ring500: string;
-    };
-    green: {
-        bg900: string;
-        bg700: string;
-        bg600: string;
-        bg500: string;
-        ring600: string;
-        ring500: string;
-    };
-    yellow: {
-        bg900: string;
-        bg700: string;
-        bg600: string;
-        bg500: string;
-        ring600: string;
-        ring500: string;
-    };
-    red: {
-        bg900: string;
-        bg700: string;
-        bg600: string;
-        bg500: string;
-        ring600: string;
-        ring500: string;
-    };
-};