uibee 2.17.4 → 3.0.0

package/dist/src/components/inputs/shared/colorPickerPopup.js

@@ -1,191 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useEffect, useRef } from 'react';
-function hexToHsv(hex) {
-    hex = hex.replace('#', '');
-    let r = 0, g = 0, b = 0;
-    if (hex.length === 3) {
-        r = parseInt(hex[0] + hex[0], 16);
-        g = parseInt(hex[1] + hex[1], 16);
-        b = parseInt(hex[2] + hex[2], 16);
-    }
-    else if (hex.length === 6) {
-        r = parseInt(hex.substring(0, 2), 16);
-        g = parseInt(hex.substring(2, 4), 16);
-        b = parseInt(hex.substring(4, 6), 16);
-    }
-    r /= 255;
-    g /= 255;
-    b /= 255;
-    const max = Math.max(r, g, b);
-    const min = Math.min(r, g, b);
-    const d = max - min;
-    let h = 0;
-    const s = max === 0 ? 0 : d / max;
-    const v = max;
-    if (max !== min) {
-        switch (max) {
-            case r:
-                h = (g - b) / d + (g < b ? 6 : 0);
-                break;
-            case g:
-                h = (b - r) / d + 2;
-                break;
-            case b:
-                h = (r - g) / d + 4;
-                break;
-        }
-        h /= 6;
-    }
-    return { h: h * 360, s: s * 100, v: v * 100 };
-}
-function hsvToRgb(h, s, v) {
-    let r = 0, g = 0, b = 0;
-    const i = Math.floor(h * 6);
-    const f = h * 6 - i;
-    const p = v * (1 - s);
-    const q = v * (1 - f * s);
-    const t = v * (1 - (1 - f) * s);
-    switch (i % 6) {
-        case 0:
-            r = v;
-            g = t;
-            b = p;
-            break;
-        case 1:
-            r = q;
-            g = v;
-            b = p;
-            break;
-        case 2:
-            r = p;
-            g = v;
-            b = t;
-            break;
-        case 3:
-            r = p;
-            g = q;
-            b = v;
-            break;
-        case 4:
-            r = t;
-            g = p;
-            b = v;
-            break;
-        case 5:
-            r = v;
-            g = p;
-            b = q;
-            break;
-    }
-    return { r: Math.round(r * 255), g: Math.round(g * 255), b: Math.round(b * 255) };
-}
-function hsvToHex(h, s, v) {
-    const { r, g, b } = hsvToRgb(h / 360, s / 100, v / 100);
-    function toHex(x) {
-        const hex = x.toString(16);
-        return hex.length === 1 ? '0' + hex : hex;
-    }
-    return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
-}
-const PRESET_COLORS = [
-    '#f87171', '#fd8738', '#fbbf24', '#facc15', '#a3e635', '#4ade80', '#34d399', '#2dd4bf',
-    '#38bdf8', '#60a5fa', '#818cf8', '#a78bfa', '#c084fc', '#e879f9', '#f472b6', '#fb7185'
-];
-function SaturationPicker({ hsv, onChange }) {
-    const containerRef = useRef(null);
-    function handleMove(e) {
-        if (!containerRef.current)
-            return;
-        const { left, top, width, height } = containerRef.current.getBoundingClientRect();
-        const x = Math.min(Math.max((e.clientX - left) / width, 0), 1);
-        const y = Math.min(Math.max((e.clientY - top) / height, 0), 1);
-        onChange(x * 100, (1 - y) * 100);
-    }
-    function handleMouseDown(e) {
-        handleMove(e);
-        function moveHandler(e) { handleMove(e); }
-        function upHandler() {
-            window.removeEventListener('mousemove', moveHandler);
-            window.removeEventListener('mouseup', upHandler);
-        }
-        window.addEventListener('mousemove', moveHandler);
-        window.addEventListener('mouseup', upHandler);
-    }
-    const bgColor = hsvToHex(hsv.h, 100, 100);
-    return (_jsxs("div", { ref: containerRef, className: 'w-full h-32 relative rounded-md overflow-hidden cursor-crosshair mb-3 select-none', style: { backgroundColor: bgColor }, onMouseDown: handleMouseDown, children: [_jsx("div", { className: 'absolute inset-0 bg-linear-to-r from-white to-transparent' }), _jsx("div", { className: 'absolute inset-0 bg-linear-to-t from-black to-transparent' }), _jsx("div", { className: `
-                    absolute w-3 h-3 border-2 border-white rounded-full
-                    shadow-md -translate-x-1/2 -translate-y-1/2 pointer-events-none
-                `, style: { left: `${hsv.s}%`, top: `${100 - hsv.v}%` } })] }));
-}
-function HuePicker({ hue, onChange }) {
-    const containerRef = useRef(null);
-    function handleMove(e) {
-        if (!containerRef.current)
-            return;
-        const { left, width } = containerRef.current.getBoundingClientRect();
-        const x = Math.min(Math.max((e.clientX - left) / width, 0), 1);
-        onChange(x * 360);
-    }
-    function handleMouseDown(e) {
-        handleMove(e);
-        function moveHandler(e) { handleMove(e); }
-        function upHandler() {
-            window.removeEventListener('mousemove', moveHandler);
-            window.removeEventListener('mouseup', upHandler);
-        }
-        window.addEventListener('mousemove', moveHandler);
-        window.addEventListener('mouseup', upHandler);
-    }
-    return (_jsx("div", { ref: containerRef, className: 'w-full h-3 relative rounded-full cursor-pointer mb-4 select-none', style: { background: 'linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%)' }, onMouseDown: handleMouseDown, children: _jsx("div", { className: `
-                    absolute w-4 h-4 bg-white border border-gray-200
-                    rounded-full shadow-sm -translate-x-1/2 -translate-y-1/2
-                    top-1/2 pointer-events-none
-                `, style: { left: `${(hue / 360) * 100}%` } }) }));
-}
-export default function ColorPickerPopup({ value, onChange, onClose, anchorName }) {
-    const [hsv, setHsv] = useState(() => hexToHsv(value || '#000000'));
-    const [hexInput, setHexInput] = useState(value || '#000000');
-    useEffect(() => {
-        if (value && value !== hexInput) {
-            setHsv(hexToHsv(value));
-            setHexInput(value);
-        }
-    }, [value]);
-    function handleColorChange(newHsv) {
-        setHsv(newHsv);
-        const hex = hsvToHex(newHsv.h, newHsv.s, newHsv.v);
-        setHexInput(hex);
-        onChange(hex);
-    }
-    function handleSaturationChange(s, v) { handleColorChange({ ...hsv, s, v }); }
-    function handleHueChange(h) { handleColorChange({ ...hsv, h }); }
-    function manualHexChange(e) {
-        const val = e.target.value;
-        setHexInput(val);
-        if (/^#[0-9A-F]{6}$/i.test(val)) {
-            const newHsv = hexToHsv(val);
-            setHsv(newHsv);
-            onChange(val);
-        }
-    }
-    return (_jsxs("div", { className: 'fixed z-50 bg-login-600 border border-login-500 rounded-md shadow-lg p-3 w-64 select-none anchor-popup', style: {
-            positionAnchor: anchorName,
-            positionArea: 'bottom span-right',
-            insetArea: 'bottom span-right',
-            positionTryFallbacks: 'flip-block',
-            margin: '0.25rem 0',
-        }, children: [_jsx(SaturationPicker, { hsv: hsv, onChange: handleSaturationChange }), _jsx(HuePicker, { hue: hsv.h, onChange: handleHueChange }), _jsxs("div", { className: 'flex items-center gap-2 mb-3', children: [_jsx("div", { className: 'text-xs text-login-200 font-mono', children: "HEX" }), _jsx("input", { type: 'text', value: hexInput, onChange: manualHexChange, className: `
-                        flex-1 min-w-0 bg-login-500 border border-login-500 rounded
-                        px-2 py-1 text-sm text-login-text focus:outline-none
-                        focus:border-login focus:ring-1 focus:ring-login
-                    `, spellCheck: false }), _jsx("div", { className: 'w-8 h-8 rounded border border-login-500 shrink-0', style: { backgroundColor: hexInput } })] }), _jsx("div", { className: 'grid grid-cols-8 gap-1.5 pt-3 border-t border-login-500', children: PRESET_COLORS.map(color => (_jsx("button", { type: 'button', className: `
-                            w-6 h-6 rounded-sm cursor-pointer hover:scale-110
-                            hover:zIndex-10 transition-transform ring-1 ring-inset ring-black/10
-                        `, style: { backgroundColor: color }, onClick: () => {
-                        const newHsv = hexToHsv(color);
-                        setHsv(newHsv);
-                        setHexInput(color);
-                        onChange(color);
-                        onClose();
-                    }, title: color }, color))) })] }));
-}

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

@@ -1,9 +0,0 @@
-type DateTimePickerPopupProps = {
-    value: Date | null;
-    onChange: (date: Date) => void;
-    type: 'date' | 'time' | 'datetime-local';
-    onClose?: () => void;
-    anchorName?: string;
-};
-export default function DateTimePickerPopup({ value, onChange, type, onClose, anchorName, }: DateTimePickerPopupProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/src/components/inputs/shared/dateTimePickerPopup.js

@@ -1,128 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useEffect } from 'react';
-import { ChevronLeft, ChevronRight } from 'lucide-react';
-const DAYS = ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su'];
-const MONTHS = [
-    'January', 'February', 'March', 'April', 'May', 'June',
-    'July', 'August', 'September', 'October', 'November', 'December'
-];
-export default function DateTimePickerPopup({ value, onChange, type, onClose, anchorName, }) {
-    const [currentDate, setCurrentDate] = useState(new Date());
-    const [timeInput, setTimeInput] = useState({
-        hours: value ? value.getHours().toString() : '0',
-        minutes: value ? value.getMinutes().toString() : '0',
-    });
-    useEffect(() => {
-        if (value) {
-            setCurrentDate(value);
-            setTimeInput(prev => ({
-                hours: prev.hours === '' && value.getHours() === 0 ? '' : value.getHours().toString(),
-                minutes: prev.minutes === '' && value.getMinutes() === 0 ? '' : value.getMinutes().toString(),
-            }));
-        }
-    }, [value]);
-    function handleDateSelect(day) {
-        const newDate = new Date(currentDate);
-        newDate.setDate(day);
-        if (value) {
-            newDate.setHours(value.getHours());
-            newDate.setMinutes(value.getMinutes());
-        }
-        else {
-            newDate.setHours(0, 0, 0, 0);
-        }
-        onChange(newDate);
-        if (type === 'date' && onClose) {
-            onClose();
-        }
-    }
-    function handleTimeChange(timeUnit, val) {
-        const newDate = value ? new Date(value) : new Date();
-        if (!value) {
-            newDate.setHours(0, 0, 0, 0);
-        }
-        if (timeUnit === 'hours') {
-            if (val < 0 || val > 23)
-                return;
-            newDate.setHours(val);
-        }
-        if (timeUnit === 'minutes') {
-            if (val < 0 || val > 59)
-                return;
-            newDate.setMinutes(val);
-        }
-        onChange(newDate);
-    }
-    function onTimeInputChange(unit, val) {
-        if (val === '') {
-            setTimeInput(prev => ({ ...prev, [unit]: '' }));
-            handleTimeChange(unit, 0);
-            return;
-        }
-        if (!/^\d+$/.test(val))
-            return;
-        const num = parseInt(val);
-        if (unit === 'hours' && num > 23)
-            return;
-        if (unit === 'minutes' && num > 59)
-            return;
-        setTimeInput(prev => ({ ...prev, [unit]: val }));
-        handleTimeChange(unit, num);
-    }
-    function onTimeInputBlur(unit) {
-        if (timeInput[unit] === '') {
-            const num = unit === 'hours' ? (value?.getHours() ?? 0) : (value?.getMinutes() ?? 0);
-            setTimeInput(prev => ({ ...prev, [unit]: num.toString() }));
-        }
-    }
-    function getDaysInMonth(year, month) {
-        return new Date(year, month + 1, 0).getDate();
-    }
-    function getFirstDayOfMonth(year, month) {
-        return new Date(year, month, 1).getDay();
-    }
-    function renderCalendar() {
-        const year = currentDate.getFullYear();
-        const month = currentDate.getMonth();
-        const daysInMonth = getDaysInMonth(year, month);
-        const firstDay = getFirstDayOfMonth(year, month);
-        const days = [];
-        const adjustedFirstDay = firstDay === 0 ? 6 : firstDay - 1;
-        for (let i = 0; i < adjustedFirstDay; i++) {
-            days.push(_jsx("div", { className: 'w-8 h-8' }, `empty-${i}`));
-        }
-        for (let i = 1; i <= daysInMonth; i++) {
-            const isSelected = value &&
-                value.getDate() === i &&
-                value.getMonth() === month &&
-                value.getFullYear() === year;
-            const isToday = new Date().getDate() === i &&
-                new Date().getMonth() === month &&
-                new Date().getFullYear() === year;
-            days.push(_jsx("button", { type: 'button', onClick: () => handleDateSelect(i), className: `
-                        w-8 h-8 flex items-center justify-center rounded-full text-sm
-                        hover:bg-login-500 transition-colors
-                        ${isSelected ? 'bg-login! text-white! hover:bg-login!' : ''}
-                        ${!isSelected && isToday ? 'text-login! font-bold' : ''}
-                        ${!isSelected && !isToday ? 'text-login-text!' : ''}
-                    `, children: i }, i));
-        }
-        return (_jsxs("div", { className: 'p-2', children: [_jsxs("div", { className: 'flex items-center justify-between mb-2', children: [_jsx("button", { type: 'button', onClick: () => setCurrentDate(new Date(year, month - 1)), className: 'p-1 hover:bg-login-500 rounded-full text-login-text', children: _jsx(ChevronLeft, { className: 'w-4 h-4' }) }), _jsxs("span", { className: 'font-medium text-login-text', children: [MONTHS[month], " ", year] }), _jsx("button", { type: 'button', onClick: () => setCurrentDate(new Date(year, month + 1)), className: 'p-1 hover:bg-login-500 rounded-full text-login-text', children: _jsx(ChevronRight, { className: 'w-4 h-4' }) })] }), _jsx("div", { className: 'grid grid-cols-7 gap-1 mb-1', children: DAYS.map(d => (_jsx("div", { className: 'w-8 text-center text-xs text-login-200 font-medium', children: d }, d))) }), _jsx("div", { className: 'grid grid-cols-7 gap-1', children: days })] }));
-    }
-    function renderTimePicker() {
-        return (_jsxs("div", { className: 'p-2 border-t border-login-500 flex justify-center gap-2', children: [_jsxs("div", { className: 'flex flex-col items-center', children: [_jsx("label", { className: 'text-xs text-login-200 mb-1', children: "Hour" }), _jsx("input", { type: 'text', inputMode: 'numeric', value: timeInput.hours, onChange: (e) => onTimeInputChange('hours', e.target.value), onBlur: () => onTimeInputBlur('hours'), className: `
-                            w-16 p-1 bg-login-500 rounded text-center text-login-text 
-                            border border-login-500 focus:border-login outline-none
-                        ` })] }), _jsx("div", { className: 'flex items-end pb-2 text-login-text', children: ":" }), _jsxs("div", { className: 'flex flex-col items-center', children: [_jsx("label", { className: 'text-xs text-login-200 mb-1', children: "Minute" }), _jsx("input", { type: 'text', inputMode: 'numeric', value: timeInput.minutes, onChange: (e) => onTimeInputChange('minutes', e.target.value), onBlur: () => onTimeInputBlur('minutes'), className: `
-                            w-16 p-1 bg-login-500 rounded text-center text-login-text 
-                            border border-login-500 focus:border-login outline-none
-                        ` })] })] }));
-    }
-    return (_jsxs("div", { className: 'fixed z-50 bg-login-600 border border-login-500 rounded-md shadow-lg p-1 min-w-70 anchor-popup', style: {
-            positionAnchor: anchorName,
-            positionArea: 'bottom span-right',
-            insetArea: 'bottom span-right',
-            positionTryFallbacks: 'flip-block',
-            margin: '0.25rem 0',
-        }, children: [type !== 'time' && renderCalendar(), (type === 'time' || type === 'datetime-local') && renderTimePicker()] }));
-}

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

@@ -1,14 +0,0 @@
-import { ReactNode } from 'react';
-interface FieldWrapperProps {
-    label?: string;
-    name: string;
-    required?: boolean;
-    info?: string;
-    error?: string;
-    description?: string;
-    textSize?: 'sm' | 'md';
-    children: ReactNode;
-    className?: string;
-}
-export default function FieldWrapper({ label, name, required, info, error, description, textSize, children, className, }: FieldWrapperProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/src/components/inputs/shared/fieldWrapper.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import InputLabel from './inputLabel';
-import InputInfo from './inputInfo';
-import InputError from './inputError';
-import MarkdownRender from '../../markdownrender/markdownRender';
-export default function FieldWrapper({ label, name, required, info, error, description, textSize = 'sm', children, className, }) {
-    return (_jsxs("div", { className: `flex flex-col gap-1 w-full relative ${className || ''}`, children: [(label || info) && (_jsxs("div", { className: 'flex items-center justify-between mb-1', children: [label && (_jsx(InputLabel, { label: label, name: name, required: required, className: `ml-1 ${textSize === 'sm' ? 'text-sm!' : 'text-base!'}` })), info && _jsx(InputInfo, { info: info })] })), description && (_jsx("div", { className: 'text-login-100 **:text-xs! ml-1 mb-1', children: _jsx(MarkdownRender, { MDstr: String(description || '') }) })), children, _jsx(InputError, { error: error, id: `${name}-error` })] }));
-}

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

@@ -1,5 +0,0 @@
-export { default as FieldWrapper } from './fieldWrapper';
-export { default as InputLabel } from './inputLabel';
-export { default as InputInfo } from './inputInfo';
-export { default as InputError } from './inputError';
-export { default as ColorPickerPopup } from './colorPickerPopup';

package/dist/src/components/inputs/shared/index.js

@@ -1,5 +0,0 @@
-export { default as FieldWrapper } from './fieldWrapper';
-export { default as InputLabel } from './inputLabel';
-export { default as InputInfo } from './inputInfo';
-export { default as InputError } from './inputError';
-export { default as ColorPickerPopup } from './colorPickerPopup';

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

@@ -1,6 +0,0 @@
-interface InputErrorProps {
-    error?: string;
-    id?: string;
-}
-export default function InputError({ error, id }: InputErrorProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/src/components/inputs/shared/inputError.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export default function InputError({ error, id }) {
-    if (!error)
-        return _jsx("div", { className: 'h-4' });
-    return (_jsx("div", { className: 'h-4', children: _jsx("span", { id: id, className: 'text-xs text-red-500 ml-1 truncate block', role: 'alert', title: error, children: error }) }));
-}

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

@@ -1,5 +0,0 @@
-interface InputInfoProps {
-    info: string;
-}
-export default function InputInfo({ info }: InputInfoProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/src/components/inputs/shared/inputInfo.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { CircleHelp } from 'lucide-react';
-export default function InputInfo({ info }) {
-    return (_jsx("div", { className: 'text-login-200 hover:text-login-text transition-colors', "aria-label": info, title: info, children: _jsx(CircleHelp, { className: 'w-4 h-4' }) }));
-}

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

@@ -1,9 +0,0 @@
-interface InputLabelProps {
-    label: string;
-    name: string;
-    required?: boolean;
-    disabled?: boolean;
-    className?: string;
-}
-export default function InputLabel({ label, name, required, disabled, className }: InputLabelProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/src/components/inputs/shared/inputLabel.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default function InputLabel({ label, name, required, disabled, className }) {
-    return (_jsxs("label", { htmlFor: name, className: `text-sm font-medium text-login-text ${disabled ? 'opacity-50 cursor-not-allowed' : ''} ${className || ''}`, title: label, children: [label, " ", required && _jsx("span", { className: 'text-red-500', children: "*" })] }));
-}

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

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

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

@@ -1,14 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { FieldWrapper } from './shared';
-export default function Switch(props) {
-    const { name, label, error, info, description, className, switchOnly, textSize = 'sm', ...inputProps } = props;
-    return (_jsx(FieldWrapper, { label: label, name: name, required: inputProps.required, info: info, error: error, description: description, textSize: textSize, className: className, children: _jsxs("label", { className: `relative inline-flex items-center cursor-pointer ${switchOnly ? 'h-fit' : 'h-10.5'}`, children: [_jsx("input", { ...inputProps, type: 'checkbox', id: name, name: name, className: 'sr-only peer' }), _jsx("div", { className: `
-                    w-11 h-6 bg-login-500/50 rounded-full peer 
-                    peer-checked:after:translate-x-full peer-checked:after:border-white 
-                    after:content-[''] after:absolute ${switchOnly ? 'after:top-0.5' : 'after:top-2.75'} after:left-0.5 
-                    after:bg-white after:border-gray-300 after:border after:rounded-full 
-                    after:h-5 after:w-5 after:transition-all peer-checked:bg-login
-                    ${inputProps.disabled ? 'opacity-50 cursor-not-allowed' : ''}
-                    ${error ? 'ring-1 ring-red-500' : ''}
-                ` })] }) }));
-}

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

@@ -1,15 +0,0 @@
-export type TagInputProps = {
-    label?: string;
-    name: string;
-    value?: string[];
-    onChange?: (value: string[]) => void;
-    placeholder?: string;
-    error?: string;
-    className?: string;
-    disabled?: boolean;
-    required?: boolean;
-    info?: string;
-    description?: string;
-    textSize?: 'sm' | 'md';
-};
-export default function TagInput({ label, name, value, onChange, placeholder, error, className, disabled, required, info, description, textSize, }: TagInputProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,40 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import { X } from 'lucide-react';
-import { FieldWrapper } from './shared';
-export default function TagInput({ label, name, value = [], onChange, placeholder = 'Add...', error, className, disabled, required, info, description, textSize = 'sm', }) {
-    const [inputValue, setInputValue] = useState('');
-    function handleKeyDown(e) {
-        if ((e.key === 'Enter' || e.key === ',') && inputValue.trim()) {
-            e.preventDefault();
-            const val = inputValue.trim().replace(/,$/, '');
-            if (val && !value.includes(val)) {
-                const newValue = [...value, val];
-                if (onChange)
-                    onChange(newValue);
-            }
-            setInputValue('');
-        }
-        else if (e.key === 'Backspace' && !inputValue && value.length > 0) {
-            const newValue = value.slice(0, -1);
-            if (onChange)
-                onChange(newValue);
-        }
-    }
-    function removeTag(index) {
-        if (disabled)
-            return;
-        const newValue = value.filter((_, i) => i !== index);
-        if (onChange)
-            onChange(newValue);
-    }
-    return (_jsxs(FieldWrapper, { label: label, name: name, required: required, info: info, description: description, error: error, className: className, textSize: textSize, children: [_jsxs("div", { className: `
-                    flex flex-wrap gap-2 p-2 rounded-md bg-login-500/50 border border-login-500 
-                    text-login-text min-h-10.5
-                    focus-within:border-login focus-within:ring-1 focus-within:ring-login
-                    disabled:opacity-50 disabled:cursor-not-allowed
-                    transition-all duration-200
-                    ${error ? 'border-red-500 focus-within:border-red-500 focus-within:ring-red-500' : ''}
-                `, children: [value.map((tag, index) => (_jsxs("span", { className: 'flex items-center gap-1 px-2 py-1 bg-login rounded text-sm text-white', children: [tag, !disabled && (_jsx("button", { type: 'button', onClick: () => removeTag(index), className: 'hover:text-red-200 transition-colors', children: _jsx(X, { size: 14 }) }))] }, index))), _jsx("input", { type: 'text', value: inputValue, required: required && value.length === 0, onChange: (e) => setInputValue(e.target.value), onKeyDown: handleKeyDown, disabled: disabled, placeholder: value.length === 0 ? placeholder : '', className: 'flex-1 bg-transparent outline-none min-w-30 text-login-text placeholder:text-login-200' })] }), _jsx("input", { type: 'hidden', name: name, value: value.join(',') })] }));
-}

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

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

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

@@ -1,36 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import { Eye, Pencil } from 'lucide-react';
-import { FieldWrapper } from './shared';
-import MarkdownRender from '../markdownrender/markdownRender';
-function isValidJson(str) {
-    try {
-        JSON.parse(str);
-        return null;
-    }
-    catch (error) {
-        return error.message;
-    }
-}
-export default function Textarea(props) {
-    const { name, label, error, className, info, description, type = 'text', rows = 4, textSize = 'sm', ...textareaProps } = props;
-    const { value } = textareaProps;
-    const [preview, setPreview] = useState(false);
-    const jsonError = type === 'json' && value ? isValidJson(value) : undefined;
-    const displayError = jsonError || error;
-    console.log(value);
-    return (_jsx(FieldWrapper, { label: label, name: name, required: textareaProps.required, info: info, description: description, error: displayError, textSize: textSize, className: className, children: _jsxs("div", { className: 'relative', children: [type === 'markdown' && (_jsx("div", { className: 'absolute right-2 top-2 z-10 flex gap-2', children: _jsx("button", { type: 'button', onClick: () => setPreview(!preview), className: 'p-1 rounded hover:bg-login-500/50 text-login-text transition-colors', title: preview ? 'Edit' : 'Preview', children: preview ? _jsx(Pencil, { size: 16 }) : _jsx(Eye, { size: 16 }) }) })), type === 'markdown' && preview && (_jsx("div", { className: `
-                            w-full rounded-md bg-login-500/50 border border-login-500 
-                            p-3 overflow-y-auto ${error ? 'border-red-500' : ''}
-                        `, children: _jsx(MarkdownRender, { MDstr: String(value || '') }) })), _jsx("textarea", { ...textareaProps, id: name, name: name, rows: rows, title: label, "aria-invalid": !!error, "aria-describedby": error ? `${name}-error` : undefined, className: `
-                        ${type === 'markdown' && preview ? 'hidden' : ''}
-                        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
-                        p-3 pr-10
-                        transition-all duration-200
-                        resize-y
-                        ${error ? 'border-red-500 focus:border-red-500 focus:ring-red-500' : ''}
-                    ` })] }) }));
-}

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

@@ -1,14 +0,0 @@
-type ToggleOption<T> = {
-    value: T;
-    label?: string;
-    text?: string;
-    icon?: React.ReactNode;
-};
-type ToggleProps<T> = {
-    value: T;
-    onChange: (value: T) => void;
-    left: ToggleOption<T>;
-    right: ToggleOption<T>;
-};
-export default function Toggle<T>({ value, onChange, left, right, }: ToggleProps<T>): import("react/jsx-runtime").JSX.Element;
-export {};

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

@@ -1,12 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-export default function Toggle({ value, onChange, left, right, }) {
-    const active = 'bg-login-200 text-login-950 shadow';
-    const idle = 'text-login-200 hover:bg-login-50/10 hover:text-login-50';
-    const base = 'flex items-center justify-center rounded-lg transition gap-1';
-    function renderContent(opt) {
-        return (_jsxs(_Fragment, { children: [opt.icon, opt.text && _jsx("span", { children: opt.text })] }));
-    }
-    const isLeftActive = value === left.value;
-    const isRightActive = value === right.value;
-    return (_jsxs("div", { className: 'flex items-center border rounded-lg border-login-100/10 bg-login-50/5 p-1', children: [_jsx("button", { type: 'button', onClick: () => onChange(left.value), "aria-label": left.label ?? left.text, "aria-pressed": isLeftActive, className: `${base} px-2 h-7 ${isLeftActive ? active : idle}`, children: renderContent(left) }), _jsx("button", { type: 'button', onClick: () => onChange(right.value), "aria-label": right.label ?? right.text, "aria-pressed": isRightActive, className: `${base} px-2 h-7 ${isRightActive ? active : idle}`, children: renderContent(right) })] }));
-}

package/dist/src/components/login/loginPage.d.ts

@@ -1,2 +0,0 @@
-import { LoginPageProps } from 'uibee/components';
-export default function LoginPage({ title, description, redirectPath, version, btg, handleSubmit, guestRedirectPath, guestText }: LoginPageProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/login/loginPage.js

@@ -1,18 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { LogIn } from 'lucide-react';
-import Logo from '../logo/logo';
-import Link from 'next/link';
-export default function LoginPage({ title, description, redirectPath, version, btg, handleSubmit, guestRedirectPath, guestText }) {
-    return (_jsx("main", { className: 'w-full h-full flex items-center justify-center bg-login-800 p-8', children: _jsxs("div", { className: 'flex flex-col justify-center items-center bg-login-600 px-4 py-12 rounded-xl w-full max-w-md gap-4 md:gap-6', children: [_jsx("div", { className: 'relative aspect-3/1 w-full', children: _jsx(Logo, { className: 'object-contain px-6 sm:px-12' }) }), _jsxs("h1", { className: 'text-3xl font-extrabold text-login text-center tracking-tight', children: [title, " ", btg ? ' - Break the Glass' : ''] }), description && (_jsx("p", { className: 'text-center font-medium text-lg mb-2 max-w-xs', children: description })), btg ? (_jsxs("form", { className: 'w-full flex flex-col gap-3 max-w-xs', onSubmit: e => {
-                        e.preventDefault();
-                        handleSubmit?.(new FormData(e.currentTarget));
-                        e.currentTarget.reset();
-                    }, children: [_jsx("input", { type: 'text', name: 'name', placeholder: 'Name', className: 'py-2 px-3 rounded bg-login-900 font-medium focus:outline-none', required: true }), _jsx("input", { type: 'password', name: 'token', placeholder: 'Token', className: 'py-2 px-3 rounded bg-login-900 font-medium focus:outline-none', required: true }), _jsx("button", { type: 'submit', className: 'py-2 px-4 rounded-xl bg-login font-bold text-lg ' +
-                                'hover:bg-login/80 transition-all duration-200 mt-2', children: "Login" })] })) : (_jsxs(Link, { href: redirectPath, className: `
-                            flex items-center justify-center gap-2 w-full
-                            max-w-xs py-3 px-6 rounded-xl bg-login font-bold
-                            text-lg hover:bg-login/80 transition-all
-                            duration-200 mb-2 mt-2 cursor-pointer
-                        `, children: ["Login", _jsx(LogIn, { className: 'w-6 h-6' })] })), guestRedirectPath &&
-                    _jsx(Link, { href: guestRedirectPath, className: 'text-sm font-semibold cursor-pointer opacity-50', children: guestText || 'Continue as guest' }), _jsxs("span", { className: 'text-sm mt-2', children: ["v", version] })] }) }));
-}

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

@@ -1,5 +0,0 @@
-interface LogoProps {
-    className?: string;
-}
-export default function Logo({ className }: LogoProps): import("react/jsx-runtime").JSX.Element;
-export {};