uibee 2.17.4 → 3.0.0

package/dist/src/components/alert/alert.d.ts

@@ -1,8 +0,0 @@
-import { ReactNode } from 'react';
-type AlertProps = {
-    children: ReactNode;
-    variant?: 'warning' | 'info';
-    className?: string;
-};
-export default function Alert({ children, variant, className, }: AlertProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/src/components/alert/alert.js

@@ -1,15 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CircleAlert, TriangleAlert, Info } from 'lucide-react';
-export default function Alert({ children, variant = 'warning', className = '', }) {
-    const color = variant === 'warning' ? 'bg-red-900'
-        : variant === 'info' ? 'bg-blue-600' :
-            'bg-gray-900';
-    const Icon = variant === 'warning' ? CircleAlert
-        : variant === 'info' ? Info :
-            TriangleAlert;
-    return (_jsxs("div", { className: `
-                grid grid-cols-[min-content_auto] rounded-lg
-                p-[0.5em_1em_0.5em_0.8em] items-start w-fit text-white
-                ${color} ${className}
-            `, children: [_jsx(Icon, { className: 'w-8 h-8 mr-[0.3rem] stroke-login-50' }), _jsx("div", { className: 'self-center', children: children })] }));
-}

package/dist/src/components/buttons/button.d.ts

@@ -1,13 +0,0 @@
-import type { JSX } from 'react';
-type ButtonProps = {
-    text: string;
-    className?: string;
-    icon: string | JSX.Element;
-    path?: string;
-    type?: 'button' | 'submit' | 'reset';
-    variant?: 'primary' | 'secondary' | 'warning' | 'danger' | 'success' | 'info';
-    onClick?: (_: object | string) => void;
-    disabled?: boolean;
-};
-export default function Button({ text, className, icon, path, variant, type, onClick, disabled }: ButtonProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/src/components/buttons/button.js

@@ -1,30 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Link from 'next/link';
-const variants = {
-    primary: 'bg-login/70 outline-login hover:bg-login/90',
-    secondary: 'bg-login-500/70 outline-login-500 hover:bg-login-500/90',
-    warning: 'bg-yellow-500/70 outline-yellow-500 hover:bg-yellow-500/90',
-    danger: 'bg-red-600/70 outline-red-600 hover:bg-red-600/90',
-    success: 'bg-green-600/70 outline-green-600 hover:bg-green-600/90',
-    info: 'bg-blue-600/70 outline-blue-600 hover:bg-blue-600/90'
-};
-export default function Button({ text, className, icon, path, variant = 'primary', type, onClick, disabled }) {
-    const bg = variants[variant];
-    if (!path) {
-        return (_jsxs("button", { type: type || 'button', disabled: disabled, onClick: onClick, "aria-label": text, className: `
-                    ${bg} cursor-pointer px-4 rounded-md min-h-8 h-8 flex
-                    justify-evenly items-center gap-2 select-none
-                    focus:outline-none border-0 outline w-fit ${className}
-                `, children: [_jsx("h1", { className: 'font-bold', children: icon || '' }), _jsx("h1", { className: 'min-w-fit w-fit', children: text })] }));
-    }
-    if (disabled) {
-        return (_jsxs("div", { className: `
-                    ${bg} cursor-not-allowed px-4 rounded-md h-8 flex w-fit
-                    justify-evenly items-center gap-2 select-none ${className}
-                `, children: [_jsx("h1", { className: 'font-bold', children: icon || '' }), _jsx("h1", { className: 'min-w-fit w-fit', children: text })] }));
-    }
-    return (_jsxs(Link, { href: path, className: `
-                ${bg} cursor-pointer px-4 rounded-md h-8 flex w-fit
-                justify-evenly items-center gap-2 select-none ${className}
-            `, children: [_jsx("h1", { className: 'font-bold', children: icon || '' }), _jsx("h1", { className: 'min-w-fit w-fit', children: text })] }));
-}

package/dist/src/components/confirm/confirmPopup.d.ts

@@ -1,12 +0,0 @@
-type ConfirmPopupProps = {
-    isOpen: boolean;
-    header: string;
-    description?: string;
-    confirmText?: string;
-    cancelText?: string;
-    onConfirm: () => void;
-    onCancel: () => void;
-    variant?: 'danger' | 'warning' | 'default';
-};
-export default function ConfirmPopup({ isOpen, header, description, confirmText, cancelText, onConfirm, onCancel, variant, }: ConfirmPopupProps): import("react/jsx-runtime").JSX.Element | null;
-export {};

package/dist/src/components/confirm/confirmPopup.js

@@ -1,18 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { TriangleAlert } from 'lucide-react';
-export default function ConfirmPopup({ isOpen, header, description, confirmText = 'Confirm', cancelText = 'Cancel', onConfirm, onCancel, variant = 'default', }) {
-    if (!isOpen)
-        return null;
-    const confirmBg = variant === 'danger'
-        ? 'bg-red-700/80 outline-red-700 hover:bg-red-700'
-        : variant === 'warning'
-            ? 'bg-yellow-600/80 outline-yellow-600 hover:bg-yellow-600'
-            : 'bg-login/70 outline-login hover:bg-login/90';
-    return (_jsxs("div", { role: 'dialog', "aria-modal": 'true', "aria-labelledby": 'confirm-popup-header', className: 'fixed inset-0 z-50 flex items-center justify-center', onClick: onCancel, children: [_jsx("div", { className: 'absolute inset-0 bg-black/60 backdrop-blur-sm' }), _jsxs("div", { className: '\n                    relative z-10 w-full max-w-md mx-4\n                    bg-login-800 border border-login-500/50 rounded-xl\n                    shadow-2xl p-6 flex flex-col gap-4\n                ', onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: 'flex items-center gap-3', children: [variant !== 'default' && (_jsx(TriangleAlert, { className: `w-6 h-6 shrink-0 ${variant === 'danger' ? 'stroke-red-400' : 'stroke-yellow-400'}` })), _jsx("h2", { id: 'confirm-popup-header', className: 'text-login-50 text-lg font-bold leading-snug', children: header })] }), description && (_jsx("p", { className: 'text-login-100 text-sm leading-relaxed', children: description })), _jsxs("div", { className: 'flex justify-end gap-3 mt-1', children: [_jsx("button", { type: 'button', onClick: onCancel, className: '\n                            cursor-pointer px-4 py-1.5 rounded-md text-sm font-medium\n                            bg-login-500/60 text-login-50 outline outline-login-500/60\n                            hover:bg-login-500/90 focus:outline-none select-none\n                            transition-colors duration-150\n                        ', children: cancelText }), _jsx("button", { type: 'button', onClick: onConfirm, className: `
-                            cursor-pointer px-4 py-1.5 rounded-md text-sm font-bold
-                            text-white outline focus:outline-none select-none
-                            transition-colors duration-150
-                            ${confirmBg}
-                        `, children: confirmText })] })] })] }));
-}

package/dist/src/components/container/highlight.d.ts

@@ -1,4 +0,0 @@
-export default function Highlight({ children, className }: {
-    children: React.ReactNode;
-    className?: string;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/container/highlight.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export default function Highlight({ children, className }) {
-    return _jsx("div", { className: `highlighted-section ${className ?? ''}`, children: children });
-}

package/dist/src/components/container/page.d.ts

@@ -1,8 +0,0 @@
-type PageContainerProps = {
-    title: string;
-    children: React.ReactNode;
-    className?: string;
-    innerClassName?: string;
-};
-export default function PageContainer({ title, children, className, innerClassName }: PageContainerProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/src/components/container/page.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default function PageContainer({ title, children, className, innerClassName }) {
-    return (_jsx("div", { className: `w-full page-container ${className}`, children: _jsxs("div", { className: `flex flex-col col-start-3 ${innerClassName}`, children: [_jsx("h1", { className: 'heading', children: title }), children] }) }));
-}

package/dist/src/components/inputs/checkbox.d.ts

@@ -1,17 +0,0 @@
-export type CheckboxOption = {
-    label: string;
-    value: string | number;
-};
-export type CheckboxProps = Omit<React.ComponentProps<'input'>, 'name' | 'onChange' | 'value'> & {
-    name: string;
-    label?: string;
-    error?: string;
-    info?: string;
-    description?: string;
-    className?: string;
-    options: CheckboxOption[];
-    value?: (string | number)[];
-    onChange?: (value: (string | number)[]) => void;
-    textSize?: 'sm' | 'md';
-};
-export default function Checkbox(props: CheckboxProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/inputs/checkbox.js

@@ -1,37 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Check } from 'lucide-react';
-import { FieldWrapper, InputLabel } from './shared';
-export default function Checkbox(props) {
-    const { options, onChange, value, label, description, error, info, name, className, textSize = 'sm', ...rest } = props;
-    const selectedValues = Array.isArray(value) ? value : [];
-    return (_jsx(FieldWrapper, { label: label, name: name, required: rest.required, info: info, description: description, error: error, textSize: textSize, className: className, children: _jsx("div", { className: 'flex flex-col gap-2', children: options.map((option) => (_jsx(CheckboxItem, { name: name, value: option.value, label: option.label, checked: selectedValues.includes(option.value), disabled: rest.disabled, onChange: (e) => {
-                    if (!onChange)
-                        return;
-                    const isChecked = e.target.checked;
-                    let newValues = [...selectedValues];
-                    if (isChecked) {
-                        newValues.push(option.value);
-                    }
-                    else {
-                        newValues = newValues.filter((v) => v !== option.value);
-                    }
-                    onChange(newValues);
-                }, className: 'mb-0' }, option.value))) }) }));
-}
-function CheckboxItem(props) {
-    const { name, label, error, ...inputProps } = props;
-    const id = inputProps.value ? `${name}-${inputProps.value}` : name;
-    return (_jsxs("div", { className: 'flex items-center gap-2', children: [_jsxs("div", { className: 'relative w-5 h-5 shrink-0', children: [_jsx("input", { ...inputProps, id: id, name: name, type: 'checkbox', className: `
-                        peer appearance-none rounded border border-login-500 bg-login-500/50
-                        checked:bg-login checked:border-login
-                        focus:outline-none focus:ring-2 focus:ring-login/50
-                        disabled:opacity-50 disabled:cursor-not-allowed
-                        cursor-pointer transition-all duration-200
-                        w-5 h-5 absolute inset-0
-                        ${error ? 'border-red-500' : ''}
-                    ` }), _jsx(Check, { className: `
-                        absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2
-                        w-3.5 h-3.5 pointer-events-none text-white opacity-0
-                        peer-checked:opacity-100 transition-opacity duration-200
-                    ` })] }), label && (_jsx(InputLabel, { label: label, name: name, disabled: inputProps.disabled, className: 'select-none cursor-pointer' }))] }));
-}

package/dist/src/components/inputs/input.d.ts

@@ -1,12 +0,0 @@
-import { type JSX } from 'react';
-export type InputProps = Omit<React.ComponentProps<'input'>, 'name'> & {
-    name: string;
-    label?: string;
-    error?: string;
-    className?: string;
-    icon?: JSX.Element;
-    info?: string;
-    description?: string;
-    textSize?: 'sm' | 'md';
-};
-export default function Input(props: InputProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/inputs/input.js

@@ -1,124 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useRef, useState, useId } from 'react';
-import { Calendar, Clock } from 'lucide-react';
-import { FieldWrapper } from './shared';
-import DateTimePickerPopup from './shared/dateTimePickerPopup';
-import ColorPickerPopup from './shared/colorPickerPopup';
-import useClickOutside from '../../hooks/useClickOutside';
-export default function Input(props) {
-    const { name, label, error, className, icon, info, description, textSize = 'sm', ...inputProps } = props;
-    const { type = 'text', value } = inputProps;
-    const localRef = useRef(null);
-    const [isOpen, setIsOpen] = useState(false);
-    const id = useId();
-    const anchorName = `--input-${id.replace(/:/g, '')}`;
-    const containerRef = useClickOutside(() => setIsOpen(false));
-    const isDateType = ['date', 'datetime-local', 'time'].includes(type);
-    const isColorType = type === 'color';
-    const isClickableType = isDateType || isColorType;
-    function handleIconClick() {
-        if (isClickableType && !inputProps.disabled) {
-            setIsOpen(!isOpen);
-        }
-        else if (localRef.current && !inputProps.disabled) {
-            localRef.current.focus();
-        }
-    }
-    function handleDateChange(date) {
-        const onChange = inputProps.onChange;
-        if (!onChange)
-            return;
-        const pad = (n) => n.toString().padStart(2, '0');
-        const yyyy = date.getFullYear();
-        const MM = pad(date.getMonth() + 1);
-        const dd = pad(date.getDate());
-        const hh = pad(date.getHours());
-        const mm = pad(date.getMinutes());
-        let newValue = '';
-        if (type === 'date')
-            newValue = `${yyyy}-${MM}-${dd}`;
-        else if (type === 'time')
-            newValue = `${hh}:${mm}`;
-        else if (type === 'datetime-local')
-            newValue = `${yyyy}-${MM}-${dd}T${hh}:${mm}`;
-        const event = {
-            target: {
-                name,
-                value: newValue,
-                type,
-            },
-        };
-        onChange(event);
-    }
-    function handleColorChange(color) {
-        const onChange = inputProps.onChange;
-        if (!onChange)
-            return;
-        const event = {
-            target: {
-                name,
-                value: color,
-                type,
-            },
-        };
-        onChange(event);
-    }
-    let displayIcon = icon;
-    if (!displayIcon && isDateType) {
-        if (type === 'time') {
-            displayIcon = _jsx(Clock, { className: 'w-4 h-4' });
-        }
-        else {
-            displayIcon = _jsx(Calendar, { className: 'w-4 h-4' });
-        }
-    }
-    else if (!displayIcon && isColorType) {
-        displayIcon = (_jsx("div", { className: 'w-4 h-4 rounded border border-login-200', style: { backgroundColor: value || '#000000' } }));
-    }
-    function getDateValue() {
-        if (!value)
-            return null;
-        if (type === 'time') {
-            const date = new Date(`2000-01-01T${value}`);
-            return isNaN(date.getTime()) ? null : date;
-        }
-        const date = new Date(value);
-        return isNaN(date.getTime()) ? null : date;
-    }
-    function getDateDisplayValue() {
-        if (!value || !isDateType)
-            return value;
-        const date = getDateValue();
-        if (!date)
-            return value;
-        function pad(n) {
-            return n.toString().padStart(2, '0');
-        }
-        const yyyy = date.getFullYear();
-        const MM = pad(date.getMonth() + 1);
-        const dd = pad(date.getDate());
-        const hh = pad(date.getHours());
-        const mm = pad(date.getMinutes());
-        if (type === 'date')
-            return `${dd}.${MM}.${yyyy}`;
-        if (type === 'time')
-            return `${hh}:${mm}`;
-        if (type === 'datetime-local')
-            return `${dd}.${MM}.${yyyy} ${hh}:${mm}`;
-        return value;
-    }
-    return (_jsx(FieldWrapper, { label: label, name: name, required: inputProps.required, info: info, error: error, description: description, textSize: textSize, className: className, children: _jsxs("div", { className: 'relative flex items-center', ref: containerRef, children: [displayIcon && (_jsx("div", { className: `
-                            absolute left-3 text-login-200
-                            ${isClickableType && !inputProps.disabled ? 'cursor-pointer hover:text-login-text' : 'pointer-events-none'}
-                        `, onClick: handleIconClick, children: displayIcon })), _jsx("input", { ...inputProps, ref: localRef, id: name, name: isClickableType ? undefined : name, type: isClickableType ? 'text' : type, value: isDateType ? getDateDisplayValue() : value, readOnly: isClickableType, onClick: () => isClickableType && !inputProps.disabled && setIsOpen(true), "aria-describedby": error ? `${name}-error` : undefined, style: { anchorName }, className: `
-                        w-full rounded-md bg-login-500/50 border border-login-500 
-                        text-login-text placeholder-login-200
-                        focus:outline-none focus:border-login focus:ring-1 focus:ring-login
-                        disabled:opacity-50 disabled:cursor-not-allowed
-                        h-10.5 py-2 ${displayIcon ? 'pl-10 pr-3' : 'px-3'}
-                        transition-all duration-200
-                        input-reset
-                        ${error ? 'border-red-500 focus:border-red-500 focus:ring-red-500' : ''}
-                        ${isClickableType && !inputProps.disabled ? 'cursor-pointer' : ''}
-                    ` }), isClickableType && (_jsx("input", { type: 'hidden', name: name, value: value })), isOpen && isDateType && !inputProps.disabled && (_jsx(DateTimePickerPopup, { value: getDateValue(), onChange: handleDateChange, type: type, onClose: () => setIsOpen(false), anchorName: anchorName })), isOpen && isColorType && !inputProps.disabled && (_jsx(ColorPickerPopup, { value: value || '', onChange: handleColorChange, onClose: () => setIsOpen(false), anchorName: anchorName }))] }) }));
-}

package/dist/src/components/inputs/radio.d.ts

@@ -1,17 +0,0 @@
-export type RadioOption = {
-    label: string;
-    value: string | number;
-};
-export type RadioProps = Omit<React.ComponentProps<'input'>, 'name' | 'onChange' | 'value'> & {
-    name: string;
-    label?: string;
-    error?: string;
-    info?: string;
-    description?: string;
-    className?: string;
-    options: RadioOption[];
-    value?: string | number | null;
-    onChange?: (value: string | number) => void;
-    textSize?: 'sm' | 'md';
-};
-export default function Radio(props: RadioProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/inputs/radio.js

@@ -1,27 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { FieldWrapper, InputLabel } from './shared';
-export default function Radio(props) {
-    const { options, onChange, value, label, description, error, info, name, className, textSize = 'sm', ...rest } = props;
-    return (_jsx(FieldWrapper, { label: label, name: name, required: rest.required, info: info, description: description, error: error, textSize: textSize, className: className, children: _jsx("div", { className: 'flex flex-col gap-2', children: options.map((option) => (_jsx(RadioItem, { name: name, value: option.value, label: option.label, checked: value === option.value, disabled: rest.disabled, onChange: () => {
-                    if (onChange)
-                        onChange(option.value);
-                }, className: 'mb-0' }, option.value))) }) }));
-}
-function RadioItem(props) {
-    const { name, label, error, ...inputProps } = props;
-    const { value } = inputProps;
-    const id = `${name}-${value}`;
-    return (_jsxs("div", { className: 'flex items-center gap-2', children: [_jsxs("div", { className: 'relative w-5 h-5 shrink-0', children: [_jsx("input", { ...inputProps, id: id, name: name, type: 'radio', className: `
-                        peer appearance-none rounded-full border border-login-500 bg-login-500/50
-                        checked:bg-login checked:border-login
-                        focus:outline-none focus:ring-2 focus:ring-login/50
-                        disabled:opacity-50 disabled:cursor-not-allowed
-                        cursor-pointer transition-all duration-200
-                        w-5 h-5 absolute inset-0
-                        ${error ? 'border-red-500' : ''}
-                    ` }), _jsx("div", { className: `
-                    absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2
-                    w-2 h-2 rounded-full bg-white pointer-events-none opacity-0
-                    peer-checked:opacity-100 transition-opacity duration-200
-                ` })] }), label && (_jsx(InputLabel, { label: label, name: name, disabled: inputProps.disabled, className: 'select-none cursor-pointer' }))] }));
-}

package/dist/src/components/inputs/range.d.ts

@@ -1,11 +0,0 @@
-export type RangeProps = Omit<React.ComponentProps<'input'>, 'name'> & {
-    name: string;
-    label?: string;
-    error?: string;
-    className?: string;
-    info?: string;
-    description?: string;
-    showValue?: boolean;
-    textSize?: 'sm' | 'md';
-};
-export default function Range(props: RangeProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/inputs/range.js

@@ -1,22 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { FieldWrapper } from './shared';
-export default function Range(props) {
-    const { name, label, error, className, info, description, showValue = true, textSize = 'sm', ...inputProps } = props;
-    const { min = 0, max = 100, step = 1, value = 0 } = inputProps;
-    return (_jsx(FieldWrapper, { label: label, name: name, required: inputProps.required, info: info, description: description, error: error, textSize: textSize, className: className, children: _jsxs("div", { className: 'flex items-center gap-4', children: [_jsx("input", { ...inputProps, id: name, name: name, type: 'range', min: min, max: max, step: step, value: value, title: label, "aria-invalid": !!error, "aria-describedby": error ? `${name}-error` : undefined, className: `
-                        flex-1 h-2 bg-login-500 rounded-lg appearance-none cursor-pointer
-                        accent-login
-                        [&::-webkit-slider-thumb]:appearance-none
-                        [&::-webkit-slider-thumb]:w-4
-                        [&::-webkit-slider-thumb]:h-4
-                        [&::-webkit-slider-thumb]:rounded-full
-                        [&::-webkit-slider-thumb]:bg-login
-                        [&::-moz-range-thumb]:w-4
-                        [&::-moz-range-thumb]:h-4
-                        [&::-moz-range-thumb]:rounded-full
-                        [&::-moz-range-thumb]:bg-login
-                        [&::-moz-range-thumb]:border-none
-                        disabled:opacity-50 disabled:cursor-not-allowed
-                        ${error ? 'accent-red-500' : ''}
-                    ` }), showValue && (_jsx("span", { className: 'text-login-text text-sm font-medium min-w-10 text-right', children: value }))] }) }));
-}

package/dist/src/components/inputs/searchInput.d.ts

@@ -1,6 +0,0 @@
-interface SearchInputProps {
-    placeholder?: string;
-    variant?: 'default' | 'minimal';
-}
-export default function SearchInput({ placeholder, variant }: SearchInputProps): import("react/jsx-runtime").JSX.Element | undefined;
-export {};

package/dist/src/components/inputs/searchInput.js

@@ -1,42 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useEffect } from 'react';
-import { useRouter, usePathname, useSearchParams } from 'next/navigation';
-import { Search } from 'lucide-react';
-import Input from './input';
-export default function SearchInput({ placeholder = 'Search...', variant = 'default' }) {
-    const router = useRouter();
-    const pathname = usePathname();
-    const searchParams = useSearchParams();
-    const [searchValue, setSearchValue] = useState(searchParams.get('q') || '');
-    useEffect(() => {
-        const currentQ = searchParams.get('q') || '';
-        setSearchValue(currentQ);
-    }, [searchParams]);
-    function handleSearch(value) {
-        setSearchValue(value);
-        const params = new URLSearchParams(searchParams.toString());
-        if (value.trim()) {
-            params.set('q', value.trim());
-        }
-        else {
-            params.delete('q');
-        }
-        params.delete('page');
-        router.push(`${pathname}?${params.toString()}`);
-    }
-    function handleKeyDown(e) {
-        if (e.key === 'Enter') {
-            handleSearch(searchValue);
-        }
-    }
-    function handleChange(e) {
-        setSearchValue(e.target.value);
-    }
-    if (variant === 'minimal') {
-        return (_jsxs("div", { className: 'relative', children: [_jsx(Search, { className: 'absolute left-3 top-1/2 transform -translate-y-1/2 h-5 w-5' }), _jsx("input", { type: 'text', value: searchValue, onChange: (e) => setSearchValue(e.target.value), onKeyDown: handleKeyDown, onBlur: () => handleSearch(searchValue), placeholder: placeholder, className: 'pl-10 pr-4 py-2 border-b outline-none w-64' })] }));
-    }
-    else {
-        _jsx(Input, { name: 'search', icon: _jsx(Search, { className: 'w-5 h-5' }), value: searchValue, onChange: handleChange, onKeyDown: handleKeyDown, onBlur: () => handleSearch(searchValue), placeholder: placeholder });
-    }
-}

package/dist/src/components/inputs/select.d.ts

@@ -1,23 +0,0 @@
-export type Option = {
-    value: string | number;
-    label: string;
-    image?: string;
-};
-export type SelectProps = {
-    label?: string;
-    name: string;
-    value?: string | number | null;
-    onChange?: (value: string | number | null) => void;
-    options: Option[];
-    error?: string;
-    className?: string;
-    disabled?: boolean;
-    required?: boolean;
-    placeholder?: string;
-    info?: string;
-    description?: string;
-    clearable?: boolean;
-    searchable?: boolean;
-    textSize?: 'sm' | 'md';
-};
-export default function Select({ label, name, value, onChange, options, error, className, disabled, required, placeholder, info, description, clearable, searchable, textSize, }: SelectProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/inputs/select.js

@@ -1,70 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useEffect } from 'react';
-import Image from 'next/image';
-import { useClickOutside } from '../../hooks';
-import { ChevronDown, X, Search } from 'lucide-react';
-import { FieldWrapper } from './shared';
-export default function Select({ label, name, value, onChange, options, error, className, disabled, required, placeholder = 'Select an option', info, description, clearable = true, searchable = true, textSize = 'sm', }) {
-    const [isOpen, setIsOpen] = useState(false);
-    const [searchTerm, setSearchTerm] = useState('');
-    const [selectedOption, setSelectedOption] = useState(options.find(opt => opt.value === value));
-    useEffect(() => {
-        if (!isOpen) {
-            setSearchTerm('');
-        }
-    }, [isOpen]);
-    useEffect(() => {
-        setSelectedOption(options.find(opt => opt.value === value));
-    }, [value, options]);
-    const containerRef = useClickOutside(() => setIsOpen(false));
-    function handleSelect(option) {
-        if (disabled)
-            return;
-        setSelectedOption(option);
-        setIsOpen(false);
-        if (onChange) {
-            onChange(option.value);
-        }
-    }
-    function handleClear(e) {
-        e.stopPropagation();
-        if (disabled)
-            return;
-        setSelectedOption(undefined);
-        if (onChange) {
-            onChange(null);
-        }
-    }
-    const filteredOptions = options.filter(option => option.label.toLowerCase().includes(searchTerm.toLowerCase()));
-    return (_jsxs(FieldWrapper, { label: label, name: name, required: required, info: info, description: description, error: error, textSize: textSize, className: className, children: [_jsxs("div", { className: 'relative', ref: containerRef, children: [_jsxs("button", { type: 'button', onClick: () => !disabled && setIsOpen(!isOpen), disabled: disabled, "aria-haspopup": 'listbox', "aria-expanded": isOpen, "aria-labelledby": label ? undefined : name, className: `
-                        w-full rounded-md bg-login-500/50 border border-login-500 
-                        text-login-text text-left
-                        focus:outline-none focus:border-login focus:ring-1 focus:ring-login
-                        disabled:opacity-50 disabled:cursor-not-allowed
-                        h-10.5 py-2 pl-3 pr-10
-                        transition-all duration-200
-                        flex items-center justify-between
-                        ${error ? 'border-red-500 focus:border-red-500 focus:ring-red-500' : ''}
-                        ${!selectedOption ? 'text-login-200' : ''}
-                    `, title: label, children: [_jsxs("div", { className: 'flex items-center gap-2 truncate', children: [selectedOption?.image && (_jsx(Image, { src: selectedOption.image, alt: '', width: 30, height: 20, className: 'rounded-xs object-cover shrink-0' })), _jsx("span", { className: 'truncate', children: selectedOption ? selectedOption.label : placeholder })] }), _jsxs("div", { className: 'absolute inset-y-0 right-0 flex items-center px-2 gap-1', children: [clearable && selectedOption && !disabled && (_jsx("div", { role: 'button', onClick: handleClear, className: `
-                                    p-1 hover:bg-login-500 rounded-full text-login-200
-                                    hover:text-red-400 transition-colors cursor-pointer
-                                `, title: 'Clear selection', children: _jsx(X, { className: 'w-3 h-3' }) })), _jsx("div", { className: `
-                            text-login-200 pointer-events-none
-                            transition-transform duration-200
-                            ${isOpen ? 'rotate-180' : ''}
-                        `, children: _jsx(ChevronDown, { className: 'w-4 h-4' }) })] })] }), isOpen && (_jsxs("div", { className: `
-                        absolute z-50 w-full mt-1 bg-login-600 border border-login-500
-                        rounded-md shadow-lg max-h-60 overflow-hidden flex flex-col
-                    `, children: [searchable && (_jsx("div", { className: 'p-2 sticky top-0 bg-login-600 border-b border-login-500 z-10', children: _jsxs("div", { className: 'relative', children: [_jsx(Search, { className: 'absolute left-2.5 top-1/2 -translate-y-1/2 w-4 h-4 text-login-200' }), _jsx("input", { type: 'text', value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), placeholder: 'Search...', autoFocus: true, className: `
-                                            w-full bg-login-500/50 border border-login-500 rounded-md 
-                                            py-1.5 pl-9 pr-3 text-sm text-login-text 
-                                            focus:outline-none focus:border-login focus:ring-1 focus:ring-login
-                                        ` })] }) })), _jsx("div", { className: 'overflow-auto noscroll', children: filteredOptions.length > 0 ? (_jsx("ul", { className: 'py-1', role: 'listbox', children: filteredOptions.map((option) => (_jsx("li", { role: 'option', "aria-selected": selectedOption?.value === option.value, children: _jsxs("button", { type: 'button', onClick: () => handleSelect(option), className: `
-                                                    w-full text-left px-3 py-2 text-sm
-                                                    hover:bg-login-500 transition-colors duration-150
-                                                    flex items-center gap-2
-                                                    ${selectedOption?.value === option.value ? 'bg-login-500 text-login' : 'text-login-text'}
-                                                `, children: [option.image && (_jsx(Image, { src: option.image, alt: '', width: 75, height: 25, className: 'rounded-md object-cover shrink-0' })), _jsx("span", { className: 'truncate', children: option.label })] }) }, option.value))) })) : (_jsx("div", { className: 'px-3 py-2 text-sm text-login-200', children: searchTerm ? 'No results found' : 'No options available' })) })] }))] }), _jsx("input", { type: 'hidden', name: name, value: selectedOption?.value || '', required: required })] }));
-}

package/dist/src/components/inputs/shared/colorPickerPopup.d.ts

@@ -1,8 +0,0 @@
-import { type JSX } from 'react';
-export type ColorPickerPopupProps = {
-    value: string;
-    onChange: (color: string) => void;
-    onClose: () => void;
-    anchorName?: string;
-};
-export default function ColorPickerPopup({ value, onChange, onClose, anchorName }: ColorPickerPopupProps): JSX.Element;