@g4rcez/components 0.0.43 → 0.0.45

package/dist/components/floating/modal.js

@@ -1,102 +0,0 @@
-"use client";
-import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { FloatingFocusManager, FloatingOverlay, FloatingPortal, useClick, useDismiss, useFloating, useInteractions, useRole, } from "@floating-ui/react";
-import { Slot } from "@radix-ui/react-slot";
-import { cva } from "class-variance-authority";
-import { AnimatePresence, motion, useMotionValue } from "framer-motion";
-import { XIcon } from "lucide-react";
-import { Fragment, useId } from "react";
-import { useMediaQuery } from "../../hooks/use-media-query";
-import { css } from "../../lib/dom";
-const animationDuration = "600ms";
-const drawerLeft = {
-    initial: { translateX: ["-30%", "0%"], opacity: 0.8, animationDuration },
-    enter: { translateX: ["-30%", "0%"], opacity: 1, animationDuration },
-    exit: { translateX: ["0%", "-30%"], opacity: 0, animationDuration },
-};
-const drawerRight = {
-    initial: { translateX: ["30%", "0%"], opacity: 0.8 },
-    enter: { translateX: "0%", opacity: 1, animationDuration },
-    exit: { translateX: ["0%", "30%"], opacity: 0, animationDuration },
-};
-const animations = {
-    drawer: (type) => (type === "left" ? drawerLeft : drawerRight),
-    sheet: {
-        initial: { opacity: 0.5, translateY: "25%", animationDuration, originY: "bottom" },
-        enter: { opacity: 1, translateY: "0%", animationDuration, originY: "bottom" },
-        exit: { opacity: 0.1, translateY: "50%", animationDuration, originY: "bottom" },
-    },
-    dialog: {
-        initial: { opacity: 0, scale: 0.95, animationDuration },
-        enter: { opacity: 1, scale: [1.05, 1], animationDuration },
-        exit: { opacity: 0, scale: 0.97, animationDuration },
-    },
-};
-const variants = cva("isolate z-floating border border-card-border ring-0 outline-0 appearance-none flex flex-col gap-4 flex-nowrap min-w-xs bg-floating-background", {
-    variants: {
-        type: {
-            drawer: "max-h-screen max-w-[90%] absolute w-fit h-screen min-h-0",
-            dialog: "max-h-[calc(100lvh-10%)] relative container h-min rounded-lg py-4",
-            sheet: "w-screen absolute bottom-0 h-[85vh] max-h-[85vh] max-h-[85svh] pt-6 pb-4 rounded-t-lg",
-        },
-        position: {
-            none: "",
-            right: "py-4 absolute right-0 top-0 rounded-l-lg",
-            left: "py-4 absolute left-0 top-0 rounded-r-lg",
-        },
-    },
-    defaultVariants: { position: "right", type: "dialog" },
-});
-const dragConstraints = { top: 0, left: 0, right: 0, bottom: -1 };
-const calculateClose = (n) => n * 0.62;
-const Draggable = (props) => {
-    const onDrag = (_, info) => {
-        if (props.parent.current) {
-            if (!props.sheet) {
-                const div = props.parent.current;
-                const v = props.value.get() || div.getBoundingClientRect().width;
-                const delta = props.position === "right" ? -info.delta.x : info.delta.x;
-                return props.value.set(Math.abs(v + delta));
-            }
-            const div = props.parent.current;
-            const rect = div.getBoundingClientRect();
-            const v = props.value.get() || rect.height;
-            const result = Math.abs(v - info.delta.y);
-            const screenHeightToClose = calculateClose(window.outerHeight);
-            if (result < screenHeightToClose) {
-                props.onChange(false);
-                return setTimeout(() => props.value.set(window.outerHeight), 350);
-            }
-            return props.value.set(result);
-        }
-    };
-    return (_jsx(motion.div, { draggable: true, dragMomentum: true, dragListener: true, dragPropagation: true, onDrag: onDrag, animate: false, initial: false, dragElastic: 0, dragDirectionLock: true, dragSnapToOrigin: true, drag: props.sheet ? "y" : "x", dragConstraints: dragConstraints, whileDrag: { cursor: "grabbing" }, className: css("absolute rounded-lg", props.sheet ? "cursor-row-resize" : "cursor-col-resize bg-floating-border", props.sheet
-            ? "top-1 flex h-3 w-full justify-center py-2"
-            : props.position === "left"
-                ? "right-5 top-1/2 h-10 w-2"
-                : "left-2 top-1/2 h-10 w-2"), children: props.sheet ? _jsx("div", { className: "h-2 w-1/4 rounded-lg bg-floating-border" }) : null }));
-};
-const positions = { drawer: "right", sheet: "none", dialog: "none" };
-export const Modal = (_a) => {
-    var { type: _type = "dialog", resizer = true, overlayClickClose = false, forceType = false, closable = true } = _a, props = __rest(_a, ["type", "resizer", "overlayClickClose", "forceType", "closable"]);
-    const headingId = useId();
-    const descriptionId = useId();
-    const isDesktop = useMediaQuery("(min-width: 64rem)");
-    const useResizer = _type !== "dialog";
-    const position = isDesktop ? (_type === "drawer" ? props.position : positions[_type]) : forceType ? positions[_type] : positions.sheet;
-    const func = isDesktop ? animations[_type] : forceType ? animations[_type] : animations.sheet;
-    const animation = typeof func === "function" ? func(position) : func;
-    const type = isDesktop ? _type : forceType ? _type : "sheet";
-    const { refs, context } = useFloating({ open: props.open, onOpenChange: props.onChange });
-    const click = useClick(context);
-    const role = useRole(context);
-    const dismiss = useDismiss(context, { escapeKey: true, referencePress: true, outsidePress: overlayClickClose });
-    const { getReferenceProps, getFloatingProps } = useInteractions([click, role, dismiss]);
-    const Trigger = props.trigger;
-    const value = useMotionValue(undefined);
-    const onClose = () => props.onChange(false);
-    return (_jsxs(Fragment, { children: [props.trigger ? (_jsx(Fragment, { children: props.asChild ? (_jsx(Slot, Object.assign({ ref: refs.setReference }, getReferenceProps({
-                    layoutId: props.layoutId,
-                }), { children: Trigger }))) : (_jsx(motion.button, Object.assign({ ref: refs.setReference }, getReferenceProps(), { layoutId: props.layoutId, type: "button", children: Trigger }))) })) : null, _jsx(FloatingPortal, { children: _jsx(AnimatePresence, { presenceAffectsLayout: true, children: props.open ? (_jsx(FloatingOverlay, { lockScroll: true, className: `inset-0 isolate z-overlay h-[100dvh] !overflow-clip bg-floating-overlay/70 ${type === "drawer" ? "" : "grid items-end justify-center lg:items-center"}`, children: _jsx(FloatingFocusManager, { visuallyHiddenDismiss: true, modal: true, closeOnFocusOut: true, context: context, children: _jsxs(motion.div, Object.assign({ animate: "enter", "aria-describedby": descriptionId, "aria-labelledby": headingId, className: variants({ position, type }), exit: "exit", layoutId: props.layoutId, initial: "initial", ref: refs.setFloating, style: type === "drawer" ? { width: value } : { height: value }, variants: animation }, getFloatingProps(), { children: [props.title ? (_jsx("header", { className: "relative w-full", children: props.title ? (_jsx("h2", { className: "border-b border-floating-border px-8 pb-2 text-3xl font-medium leading-relaxed", children: props.title })) : null })) : null, _jsx("section", { className: "flex-1 overflow-y-auto px-8 py-1", children: props.children }), props.footer ? (_jsx("footer", { className: "w-full border-t border-floating-border px-8 pt-4", children: props.footer })) : null, closable ? (_jsx("nav", { className: "absolute right-4 top-1 z-floating", children: _jsx("button", { type: "button", onClick: onClose, className: "p-1 opacity-70 transition-colors hover:text-danger hover:opacity-100 focus:text-danger", children: _jsx(XIcon, {}) }) })) : null, useResizer && resizer ? (_jsx(Draggable, { onChange: props.onChange, parent: refs.floating, position: position, sheet: type === "sheet", value: value })) : null] })) }) })) : null }) })] }));
-};

package/dist/components/floating/toolbar.d.ts

@@ -1,6 +0,0 @@
-import { PropsWithChildren } from "react";
-export type ToolbarProps = {
-    root?: HTMLElement;
-};
-export declare const Toolbar: (props: PropsWithChildren<ToolbarProps>) => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=toolbar.d.ts.map

package/dist/components/floating/toolbar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"toolbar.d.ts","sourceRoot":"","sources":["../../../src/components/floating/toolbar.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE1C,MAAM,MAAM,YAAY,GAAG;IACvB,IAAI,CAAC,EAAE,WAAW,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,OAAO,UAAW,iBAAiB,CAAC,YAAY,CAAC,4CAI7D,CAAC"}

package/dist/components/floating/toolbar.js

@@ -1,4 +0,0 @@
-"use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { motion } from "framer-motion";
-export const Toolbar = (props) => (_jsx(motion.div, { className: "sticky bottom-4 flex items-center justify-center rounded-lg border border-card-border bg-background p-4", children: props.children }));

package/dist/components/floating/tooltip.d.ts

@@ -1,12 +0,0 @@
-import { type Placement } from "@floating-ui/react";
-import React from "react";
-import { PolymorphicProps } from "../../components/core/polymorph";
-import { ComponentLike, Label, Override } from "../../types";
-export type TooltipProps<T extends ComponentLike = "span"> = Override<PolymorphicProps<React.ComponentProps<T>, T>, {
-    title: Label;
-    enabled?: boolean;
-    placement?: Placement;
-    followCursor?: boolean;
-}>;
-export declare const Tooltip: <T extends ComponentLike = "span">({ children, followCursor, placement, enabled, as, title, ...props }: TooltipProps<T>) => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=tooltip.d.ts.map

package/dist/components/floating/tooltip.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/floating/tooltip.tsx"],"names":[],"mappings":"AACA,OAAO,EAOH,KAAK,SAAS,EASjB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,KAAqC,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAa,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AAE9E,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE7D,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,aAAa,GAAG,MAAM,IAAI,QAAQ,CACjE,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAC5C;IACI,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;CAC1B,CACJ,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,CAAC,SAAS,aAAa,gFAAwF,YAAY,CAAC,CAAC,CAAC,4CAuCrJ,CAAC"}

package/dist/components/floating/tooltip.js

@@ -1,28 +0,0 @@
-"use client";
-import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { arrow, autoUpdate, flip, FloatingArrow, FloatingPortal, offset, shift, useClientPoint, useDismiss, useFloating, useFocus, useHover, useInteractions, useRole, } from "@floating-ui/react";
-import { Fragment, useRef, useState } from "react";
-import { Polymorph } from "../../components/core/polymorph";
-import { FLOATING_DELAY } from "../../constants";
-export const Tooltip = (_a) => {
-    var { children, followCursor = false, placement, enabled, as, title } = _a, props = __rest(_a, ["children", "followCursor", "placement", "enabled", "as", "title"]);
-    const [open, setOpen] = useState(false);
-    const arrowRef = useRef(null);
-    const Component = as || "span";
-    const { refs, floatingStyles, context } = useFloating({
-        open,
-        placement,
-        transform: true,
-        onOpenChange: setOpen,
-        whileElementsMounted: autoUpdate,
-        middleware: [offset(5), flip({ fallbackAxisSideDirection: "start" }), shift(), arrow({ element: arrowRef, padding: 5 })],
-    });
-    const hover = useHover(context, { move: true, enabled, delay: { open: FLOATING_DELAY } });
-    const focus = useFocus(context, { enabled });
-    const dismiss = useDismiss(context, { enabled });
-    const role = useRole(context, { role: "tooltip", enabled });
-    const clientPoint = useClientPoint(context, { enabled: !!enabled && !!followCursor });
-    const { getReferenceProps, getFloatingProps } = useInteractions([hover, focus, dismiss, role, clientPoint]);
-    return (_jsxs(Fragment, { children: [_jsx(Component, Object.assign({ ref: refs.setReference }, getReferenceProps(props), { children: title })), _jsx(FloatingPortal, { children: open && (_jsxs(Polymorph, Object.assign({}, getFloatingProps(), { ref: refs.setFloating, style: floatingStyles, className: "z-tooltip rounded-lg border border-tooltip-border bg-tooltip-background p-3 text-tooltip-foreground shadow-lg", children: [_jsx(FloatingArrow, { ref: arrowRef, context: context, strokeWidth: 0.1, className: "fill-tooltip-background stroke-tooltip-border" }), children] }))) })] }));
-};

package/dist/components/form/autocomplete.d.ts

@@ -1,17 +0,0 @@
-import React from "react";
-import { InputFieldProps } from "./input-field";
-import { type OptionProps } from "./select";
-type ItemProps = Omit<React.HTMLProps<HTMLLIElement>, "children"> & {
-    selected: boolean;
-    active: boolean;
-    option: OptionProps;
-};
-export declare const Option: React.ForwardRefExoticComponent<Omit<ItemProps, "ref"> & React.RefAttributes<HTMLLIElement>>;
-export type AutocompleteProps = Omit<InputFieldProps<"input">, "value"> & {
-    value?: string;
-    options: OptionProps[];
-    dynamicOption?: boolean;
-};
-export declare const Autocomplete: React.ForwardRefExoticComponent<Omit<AutocompleteProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
-export {};
-//# sourceMappingURL=autocomplete.d.ts.map

package/dist/components/form/autocomplete.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../src/components/form/autocomplete.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAIvE,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,KAAK,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,EAAE,UAAU,CAAC,GAAG;IAChE,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE,WAAW,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,MAAM,8FAmBjB,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,GAAG;IACtE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAaF,eAAO,MAAM,YAAY,yGAmPxB,CAAC"}

package/dist/components/form/autocomplete.js

@@ -1,152 +0,0 @@
-"use client";
-import { __rest } from "tslib";
-import { createElement as _createElement } from "react";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { autoUpdate, FloatingFocusManager, FloatingPortal, offset, size, useDismiss, useFloating, useInteractions, useListNavigation, useRole, useTransitionStyles, } from "@floating-ui/react";
-import Fuzzy from "fuzzy-search";
-import { CheckIcon, ChevronDown } from "lucide-react";
-import { forwardRef, useEffect, useRef, useState } from "react";
-import { useTranslations } from "../../hooks/use-translate-context";
-import { css, dispatchInput, initializeInputDataset } from "../../lib/dom";
-import { safeRegex } from "../../lib/fns";
-import { InputField } from "./input-field";
-export const Option = forwardRef((_a, ref) => {
-    var _b;
-    var { selected, active, onClick, option } = _a, rest = __rest(_a, ["selected", "active", "onClick", "option"]);
-    return (_jsx("li", Object.assign({}, rest, { ref: ref, role: "option", "aria-selected": active, className: "w-full border-b border-tooltip-border last:border-transparent", children: _jsxs("button", { type: "button", "data-value": option.value, onClick: onClick, "aria-selected": active, "aria-checked": active, "aria-current": active, className: `flex w-full cursor-pointer justify-between p-2 text-left ${active ? "bg-primary text-primary-foreground" : ""} ${selected ? "bg-primary/70 text-primary-foreground" : ""}`, children: [(_b = option.label) !== null && _b !== void 0 ? _b : option.value, active ? (_jsx("span", { children: _jsx(CheckIcon, { "aria-hidden": true, className: "text-current", absoluteStrokeWidth: true, strokeWidth: 2, size: 22 }) })) : null] }) })));
-});
-const transitionStyles = {
-    duration: 300,
-    initial: { transform: "scaleY(0)", opacity: 0.4 },
-    open: { transform: "scaleY(1)", opacity: 1 },
-    close: { transform: "scaleY(0)", opacity: 0 },
-};
-const fuzzyOptions = { caseSensitive: false, sort: false };
-const emptyRef = [];
-export const Autocomplete = forwardRef((_a, externalRef) => {
-    var _b, _c, _d, _e;
-    var { options, dynamicOption = false, feedback = null, labelClassName, interactive, rightLabel, optionalText, container, hideLeft = false, right, left, error, required = false } = _a, props = __rest(_a, ["options", "dynamicOption", "feedback", "labelClassName", "interactive", "rightLabel", "optionalText", "container", "hideLeft", "right", "left", "error", "required"]);
-    const translation = useTranslations();
-    const ref = useRef(null);
-    const [open, setOpen] = useState(false);
-    const [shadow, setShadow] = useState("");
-    const [value, setValue] = useState((_c = (_b = props.value) !== null && _b !== void 0 ? _b : props.defaultValue) !== null && _c !== void 0 ? _c : "");
-    const [label, setLabel] = useState((_e = (_d = props.value) !== null && _d !== void 0 ? _d : props.defaultValue) !== null && _e !== void 0 ? _e : "");
-    const [index, setIndex] = useState(null);
-    const listRef = useRef(emptyRef);
-    const innerOptions = dynamicOption && shadow !== "" ? [{ value: shadow, label: shadow, "data-dynamic": "true" }, ...options] : options;
-    const list = new Fuzzy(innerOptions, ["value", "label"], fuzzyOptions).search(shadow);
-    const pattern = dynamicOption
-        ? undefined
-        : `^(${options.map((x) => `${safeRegex(x.value)}${x.label ? "|" + safeRegex(x.label) : ""}`).join("|")})$`;
-    useEffect(() => {
-        const input = refs.reference.current;
-        if (!input)
-            return;
-        return initializeInputDataset(input);
-    }, []);
-    useEffect(() => {
-        var _a;
-        if (props.value) {
-            const item = options.find((x) => x.value === props.value);
-            setValue((_a = item === null || item === void 0 ? void 0 : item.label) !== null && _a !== void 0 ? _a : props.value);
-        }
-    }, [props.value]);
-    const { x, y, strategy, refs, context } = useFloating({
-        open,
-        transform: true,
-        onOpenChange: setOpen,
-        whileElementsMounted: autoUpdate,
-        middleware: [
-            offset(4),
-            size({
-                padding: 10,
-                apply(a) {
-                    Object.assign(a.elements.floating.style, {
-                        width: `${a.rects.reference.width}px`,
-                        maxHeight: `${Math.min(480, a.availableHeight)}px`,
-                    });
-                },
-            }),
-        ],
-    });
-    const transitions = useTransitionStyles(context, transitionStyles);
-    const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions([
-        useRole(context, { role: "listbox" }),
-        useDismiss(context),
-        useListNavigation(context, {
-            activeIndex: index,
-            allowEscape: true,
-            cols: 0,
-            focusItemOnOpen: "auto",
-            listRef,
-            loop: true,
-            openOnArrowKeyDown: true,
-            scrollItemIntoView: true,
-            selectedIndex: index,
-            virtual: true,
-            onNavigate: (n) => setIndex((prev) => n !== null && n !== void 0 ? n : prev),
-        }),
-    ]);
-    const onSelect = (opt, i) => {
-        var _a, _b, _c;
-        setValue(opt.value);
-        (_a = refs.reference.current) === null || _a === void 0 ? void 0 : _a.setAttribute("data-value", opt.value);
-        setLabel((_b = opt.label) !== null && _b !== void 0 ? _b : "");
-        const fakeEvent = dispatchInput(ref.current, opt.value);
-        if (fakeEvent)
-            (_c = props.onChange) === null || _c === void 0 ? void 0 : _c.call(props, fakeEvent);
-        setOpen(false);
-        setShadow("");
-        setIndex(i);
-    };
-    const onChange = (event) => {
-        var _a;
-        const value = event.target.value;
-        setShadow(value);
-        if (!open && value === "")
-            return setOpen(true);
-        event.target.name = props.name || "";
-        return value ? setOpen(true) : (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, event);
-    };
-    const onFocus = () => {
-        setOpen(true);
-        setShadow("");
-    };
-    const onClose = () => {
-        var _a;
-        setShadow("");
-        setValue("");
-        (_a = refs.reference.current) === null || _a === void 0 ? void 0 : _a.setAttribute("data-value", "");
-        setLabel("");
-        dispatchInput(refs.reference.current, "");
-        setOpen(false);
-    };
-    const id = props.id || props.name;
-    return (_jsxs(InputField, Object.assign({}, props, { container: css("group inline-block w-full", container), error: error, feedback: feedback, form: props.form, hideLeft: hideLeft, id: props.name || props.id, interactive: interactive, labelClassName: labelClassName, left: left, name: props.name, optionalText: optionalText, placeholder: props.placeholder, required: required, rightLabel: rightLabel, title: props.title, right: _jsxs("span", { className: "flex items-center gap-0.5", children: [_jsxs("button", { type: "button", className: "transition-colors link:text-primary", children: [_jsx(ChevronDown, { size: 20 }), _jsx("span", { className: "sr-only", children: translation.inputCaretDown })] }), value ? (_jsx("button", { type: "button", onClick: onClose, className: "transition-colors link:text-danger", children: _jsx("svg", { width: "15", height: "15", viewBox: "0 0 15 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z", fill: "currentColor", fillRule: "evenodd", clipRule: "evenodd" }) }) })) : null] }), children: [_jsx("input", Object.assign({}, getReferenceProps(Object.assign(Object.assign({}, props), { onChange,
-                onFocus,
-                pattern, ref: refs.setReference, name: `${id}-shadow`, id: `${id}-shadow`, onClick: (e) => e.currentTarget.focus(), onKeyDown(event) {
-                    if (event.key === "Escape") {
-                        event.currentTarget.blur();
-                        return setOpen(false);
-                    }
-                    if (event.key === "Enter") {
-                        if (index !== null && list[index]) {
-                            event.preventDefault();
-                            return onSelect(list[index], index);
-                        }
-                        if (list.length === 1) {
-                            event.preventDefault();
-                            return onSelect(list[0], 0);
-                        }
-                    }
-                } })), { "data-value": value, "data-error": !!error, "data-name": id, "data-target": id, required: required, value: open ? shadow : label || value, "aria-autocomplete": "list", autoComplete: "off", className: css("input placeholder-input-mask group h-10 w-full flex-1 rounded-md bg-transparent px-2 py-1 text-base text-foreground outline-none transition-colors group-error:text-danger group-error:placeholder-input-mask-error", !!right || shadow ? "pe-12" : "", !!left ? "ps-8" : "", props.className) })), _jsx("input", { id: id, name: id, type: "hidden", "data-origin": id, ref: externalRef, required: required, defaultValue: props.value || value || undefined }), _jsx(FloatingPortal, { preserveTabOrder: true, children: open ? (_jsx(FloatingFocusManager, { guards: true, returnFocus: false, context: context, initialFocus: -1, visuallyHiddenDismiss: true, children: _jsx("ul", Object.assign({}, getFloatingProps({
-                        ref: refs.setFloating,
-                        style: Object.assign({ position: strategy, left: x !== null && x !== void 0 ? x : 0, top: y !== null && y !== void 0 ? y : 0 }, transitions.styles),
-                    }), { "data-floating": "true", className: "z-floating m-0 origin-[top_center] list-none overflow-auto overflow-y-auto rounded-b-lg rounded-t-lg border border-floating-border bg-floating-background p-0 text-foreground shadow-floating", children: list.map((option, i) => (_createElement(Option, Object.assign({}, getItemProps({
-                            onClick: () => onSelect(option, i),
-                            ref: (node) => void (listRef.current[i] = node),
-                            selected: index === i,
-                            active: value === option.value,
-                        }), { key: `${option.value}-option`, option: option, selected: index === i, active: value === option.value })))) })) })) : null })] })));
-});

package/dist/components/form/checkbox.d.ts

@@ -1,11 +0,0 @@
-import React from "react";
-import { Override } from "../../types";
-export type CheckboxProps = Override<React.PropsWithChildren<React.ComponentProps<"input">>, {
-    error?: string;
-    asTask?: boolean;
-    container?: string;
-    labelClassName?: string;
-    size?: "medium" | "large";
-}>;
-export declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
-//# sourceMappingURL=checkbox.d.ts.map

package/dist/components/form/checkbox.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/form/checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,MAAM,MAAM,aAAa,GAAG,QAAQ,CAChC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,EACtD;IACI,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;CAC7B,CACJ,CAAC;AAEF,eAAO,MAAM,QAAQ,qGA4BpB,CAAC"}

package/dist/components/form/checkbox.js

@@ -1,8 +0,0 @@
-import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { css } from "../../lib/dom";
-export const Checkbox = forwardRef((_a, ref) => {
-    var { children, asTask = false, labelClassName, error, className = "", size, container } = _a, props = __rest(_a, ["children", "asTask", "labelClassName", "error", "className", "size", "container"]);
-    return (_jsxs("label", { "data-task": asTask, "data-disabled": props.disabled, "aria-disabled": props.disabled, className: css("group flex w-fit flex-wrap items-center font-normal data-[disabled=true]:cursor-not-allowed", asTask ? "group-checkbox-checked:line-through" : "", container), children: [_jsx("input", Object.assign({}, props, { ref: ref, type: "checkbox", "data-task": asTask, className: css("form-checkbox mr-2 inline-block size-4 appearance-none rounded border-card-border bg-origin-border text-primary focus:ring-primary disabled:opacity-70 group-aria-disabled:cursor-not-allowed", className) })), children, _jsx("span", { "data-name": "checkbox-label", className: css("min-w-full flex-1 text-xs text-danger empty:mt-0 empty:hidden", labelClassName), children: error })] }));
-});

package/dist/components/form/date-picker.d.ts

@@ -1,61 +0,0 @@
-import React from "react";
-import { Override } from "../../types";
-import { CalendarProps } from "../display/calendar";
-import { InputProps } from "./input";
-export type DatePickerProps = Override<InputProps, CalendarProps<"date">>;
-export declare const DatePicker: React.ForwardRefExoticComponent<(Omit<Omit<InputProps, "onChange" | "date" | "locale" | "markToday" | "rangeMode" | "changeOnlyOnClick" | "onChangeMonth" | "onChangeYear" | "RenderOnDay" | "disabledDate" | "styles"> & Partial<{
-    locale: import("the-mask-input").Locales;
-    markToday: boolean;
-    rangeMode: boolean;
-    changeOnlyOnClick: boolean;
-    onChangeMonth: (d: Date) => void;
-    onChangeYear: (d: Date) => void;
-    RenderOnDay: React.FC<{
-        date: Date;
-    }>;
-    disabledDate: (date: Date) => boolean;
-    styles: Partial<{
-        day: string;
-        week: string;
-        weekDay: string;
-        dayFrame: string;
-        calendar: string;
-    }>;
-} & {
-    date: Date;
-    onChange: (d: Date | undefined) => void;
-} & {
-    date: Date;
-    onChange: (d: Date | undefined) => void;
-}>, "ref"> | Omit<Omit<InputProps, "onChange" | "date" | "locale" | "markToday" | "rangeMode" | "changeOnlyOnClick" | "onChangeMonth" | "onChangeYear" | "RenderOnDay" | "disabledDate" | "styles"> & Partial<{
-    locale: import("the-mask-input").Locales;
-    markToday: boolean;
-    rangeMode: boolean;
-    changeOnlyOnClick: boolean;
-    onChangeMonth: (d: Date) => void;
-    onChangeYear: (d: Date) => void;
-    RenderOnDay: React.FC<{
-        date: Date;
-    }>;
-    disabledDate: (date: Date) => boolean;
-    styles: Partial<{
-        day: string;
-        week: string;
-        weekDay: string;
-        dayFrame: string;
-        calendar: string;
-    }>;
-} & {
-    date: Date;
-    onChange: (d: Date | undefined) => void;
-} & {
-    range: {
-        from?: Date;
-        to?: Date;
-    };
-    onChange: (d: {
-        from?: Date;
-        to?: Date;
-    } | undefined) => void;
-}>, "ref">) & React.RefAttributes<HTMLInputElement>>;
-//# sourceMappingURL=date-picker.d.ts.map

package/dist/components/form/date-picker.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../../src/components/form/date-picker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAG9E,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAY,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAE9D,OAAO,EAAS,UAAU,EAAE,MAAM,SAAS,CAAC;AAE5C,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC;AAmC1E,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oDAyGtB,CAAC"}

package/dist/components/form/date-picker.js

@@ -1,78 +0,0 @@
-import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { format, isValid, parse, startOfDay } from "date-fns";
-import { CalendarIcon } from "lucide-react";
-import { forwardRef, Fragment, useId, useMemo, useState } from "react";
-import { Is } from "sidekicker";
-import { useTranslations } from "../../hooks/use-translate-context";
-import { Calendar } from "../display/calendar";
-import { Dropdown } from "../floating/dropdown";
-import { Input } from "./input";
-const fixedDate = new Date(1970, 11, 31);
-const parts = {
-    year: () => [/\d/, /\d/, /\d/, /\d/],
-    month: () => [/\d/, /\d/],
-    day: () => [/\d/, /\d/],
-    literal: (str) => str.split(""),
-};
-const placeholders = {
-    year: () => "yyyy",
-    month: () => "MM",
-    day: () => "dd",
-    literal: (str) => str,
-};
-const partValues = {
-    literal: (date, str) => str,
-    year: (date) => date.getFullYear(),
-    day: (date) => date.getDate().toString().padStart(2, "0"),
-    month: (date) => (date.getMonth() + 1).toString().padStart(2, "0"),
-};
-const formatParts = (datetimeFormat, date) => {
-    try {
-        return datetimeFormat.formatToParts(date);
-    }
-    catch (e) {
-        return [];
-    }
-};
-export const DatePicker = forwardRef((_a, externalRef) => {
-    var _b;
-    var { date, locale, disabledDate, onChange, markToday } = _a, props = __rest(_a, ["date", "locale", "disabledDate", "onChange", "markToday"]);
-    const labelId = useId();
-    const translation = useTranslations();
-    const datetimeFormat = useMemo(() => new Intl.DateTimeFormat(locale), [locale]);
-    const [innerDate, setInnerDate] = useState(date || undefined);
-    const [open, setOpen] = useState(false);
-    const mask = formatParts(datetimeFormat, fixedDate).flatMap((x) => (Is.keyof(parts, x.type) ? parts[x.type](x.value) : []));
-    const placeholder = formatParts(datetimeFormat, fixedDate).reduce((acc, x) => acc + (Is.keyof(placeholders, x.type) ? placeholders[x.type](x.value) : ""), "");
-    const [value, setValue] = useState(!innerDate
-        ? ""
-        : formatParts(datetimeFormat, innerDate).reduce((acc, x) => acc + (Is.keyof(parts, x.type) ? partValues[x.type](innerDate, x.value) : ""), ""));
-    const onChangeDateInput = (e) => {
-        const v = e.target.value;
-        setValue(v);
-        if (mask.length === v.length) {
-            const matches = mask.every((x, i) => {
-                const c = v.charAt(i);
-                return typeof x === "string" ? c === x : x.test(c);
-            });
-            if (matches) {
-                const d = startOfDay(parse(v, placeholder, new Date()));
-                setInnerDate(d);
-                return onChange === null || onChange === void 0 ? void 0 : onChange(d);
-            }
-        }
-        setInnerDate(undefined);
-        return onChange === null || onChange === void 0 ? void 0 : onChange(undefined);
-    };
-    const onChangeDate = (d) => {
-        setInnerDate(d);
-        onChange === null || onChange === void 0 ? void 0 : onChange(d);
-        if (d)
-            return setValue(format(d, placeholder));
-        return setValue("");
-    };
-    const validDate = isValid(innerDate);
-    const htmlValue = validDate ? innerDate.toISOString() : undefined;
-    return (_jsx(Input, Object.assign({}, props, { mask: mask, value: value, "data-value": htmlValue, "data-target": props.name, className: "uppercase", formNoValidate: !open, placeholder: placeholder, onChange: onChangeDateInput, required: (_b = props.required) !== null && _b !== void 0 ? _b : true, error: open ? undefined : props.error, name: undefined, id: undefined, right: _jsxs(Fragment, { children: [_jsx("input", { "data-origin": props.name, hidden: true, type: "date", id: props.name, ref: externalRef, name: props.name, defaultValue: htmlValue }), _jsx(Dropdown, { open: open, onChange: setOpen, trigger: _jsxs("span", { "aria-labelledby": labelId, children: [_jsx("span", { id: labelId, className: "sr-only", children: translation.datePickerCalendarButtonLabel }), _jsx(CalendarIcon, {})] }), buttonProps: { "aria-describedby": labelId }, children: _jsx(Calendar, Object.assign({}, props, { locale: locale, changeOnlyOnClick: true, markToday: markToday, onChange: onChangeDate, disabledDate: disabledDate, date: validDate ? innerDate : undefined })) })] }) })));
-});

package/dist/components/form/file-upload.d.ts

@@ -1,12 +0,0 @@
-import React from "react";
-import { DropzoneProps } from "react-dropzone";
-import { Override } from "sidekicker";
-type Props = Override<React.ComponentProps<"input">, DropzoneProps> & {
-    onDeleteFile?: (file: File) => void;
-    files?: File[];
-    idle?: React.ReactElement;
-    onDrop?: (file: File[]) => void;
-};
-export declare const FileUpload: ({ idle, onDeleteFile, onDrop, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=file-upload.d.ts.map

package/dist/components/form/file-upload.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"file-upload.d.ts","sourceRoot":"","sources":["../../../src/components/form/file-upload.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAe,MAAM,gBAAgB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAGtC,KAAK,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,aAAa,CAAC,GAAG;IAClE,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACpC,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;IACf,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;CACnC,CAAC;AAmGF,eAAO,MAAM,UAAU,6CAA4D,KAAK,4CAiBvF,CAAC"}

package/dist/components/form/file-upload.js

@@ -1,62 +0,0 @@
-"use client";
-import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { FileIcon, Trash2Icon, UploadIcon } from "lucide-react";
-import prettyBytes from "pretty-bytes";
-import { Fragment, useEffect, useState } from "react";
-import { useDropzone } from "react-dropzone";
-import { Button } from "../core/button";
-const mime = {
-    isImage: (file) => file.type.includes("image"),
-};
-const FileViewer = (props) => {
-    const [info, setInfo] = useState({ url: "", type: "", size: "" });
-    useEffect(() => {
-        if (mime.isImage(props.file)) {
-            const url = URL.createObjectURL(props.file);
-            setInfo({ url, type: "img", size: prettyBytes(props.file.size) });
-            return () => {
-                URL.revokeObjectURL(url);
-            };
-        }
-        setInfo({ url: "", type: props.file.type, size: prettyBytes(props.file.size) });
-    }, [props.file]);
-    if (info.type === "img") {
-        return (_jsxs("div", { className: "flex flex-row gap-jade-200 items-center justify-between w-full", children: [_jsxs("header", { className: "flex flex-row gap-jade-200 items-center", children: [_jsx("img", { src: info.url, className: "size-jade-500 rounded-jade-xsmall", alt: `Miniatura do arquivo ${props.file.name}` }), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { children: props.file.name }), _jsx("span", { children: info.size })] })] }), _jsx(Button, { className: "isolate", type: "button", theme: "raw", onClick: (e) => {
-                        var _a;
-                        e.stopPropagation();
-                        (_a = props.onDeleteFile) === null || _a === void 0 ? void 0 : _a.call(props, props.file);
-                    }, children: _jsx(Trash2Icon, {}) })] }));
-    }
-    return (_jsxs("div", { className: "flex flex-row gap-jade-200 items-center justify-between w-full", children: [_jsxs("header", { className: "flex flex-row gap-4 items-center", children: [_jsx(FileIcon, { size: 48 }), _jsxs("div", { className: "flex flex-col text-left justify-start items-start", children: [_jsx("span", { children: props.file.name }), _jsx("span", { children: info.size })] })] }), _jsx(Button, { className: "isolate", type: "button", theme: "raw", onClick: (e) => {
-                    var _a;
-                    e.stopPropagation();
-                    (_a = props.onDeleteFile) === null || _a === void 0 ? void 0 : _a.call(props, props.file);
-                }, children: _jsx(Trash2Icon, { className: "text-danger" }) })] }));
-};
-const DefaultViewer = (props) => {
-    return (_jsx("ul", { className: "w-full space-y-jade-200", children: props.files.map((file) => {
-            return _jsx(FileViewer, { onDeleteFile: props.onDeleteFile, file: file }, file.name);
-        }) }));
-};
-const InteractiveArea = (props) => {
-    if (props.isDragActive) {
-        return _jsx("p", { children: "Solte os arquivos selecionados" });
-    }
-    if (props.files.length > 0) {
-        return _jsx(DefaultViewer, { onDeleteFile: props.onDeleteFile, files: props.files });
-    }
-    return _jsx(Fragment, { children: props.idle });
-};
-const DefaultIdle = (_jsxs("div", { className: "flex flex-col gap-4 justify-center items-center", children: [_jsx(UploadIcon, { size: 64 }), _jsxs("p", { children: ["You can drag your files or", " ", _jsx("button", { className: "text-primary underline", type: "button", children: "drag to here" })] })] }));
-export const FileUpload = (_a) => {
-    var _b, _c;
-    var { idle = DefaultIdle, onDeleteFile, onDrop } = _a, props = __rest(_a, ["idle", "onDeleteFile", "onDrop"]);
-    const [files, setFiles] = useState([]);
-    const drop = (x) => {
-        onDrop === null || onDrop === void 0 ? void 0 : onDrop(x);
-        setFiles(x);
-    };
-    const { getRootProps, getInputProps, isDragActive } = useDropzone({ onDrop: drop });
-    return (_jsxs("div", Object.assign({}, getRootProps(), { "data-active": ((_b = props.files) === null || _b === void 0 ? void 0 : _b.length) ? props.files.length > 0 : false, className: "flex text-foreground flex-col items-center justify-center border-2 rounded-lg p-6 border-card-border data-[active=true]:bg-card-background data-[active=true]:border-solid data-[active=false]:border-dashed", children: [_jsx("input", Object.assign({}, getInputProps(props), { name: props.name, id: props.name })), _jsx(InteractiveArea, { onDeleteFile: onDeleteFile, isDragActive: isDragActive, idle: idle, files: (_c = props.files) !== null && _c !== void 0 ? _c : files })] })));
-};

package/dist/components/form/form.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-export declare const formReset: (form?: HTMLFormElement | null) => void;
-export declare const Form: (props: React.ComponentProps<"form">) => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=form.d.ts.map

package/dist/components/form/form.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../../src/components/form/form.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,eAAO,MAAM,SAAS,UAAW,eAAe,GAAG,IAAI,SAatD,CAAC;AAEF,eAAO,MAAM,IAAI,UAAW,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,4CAOvD,CAAC"}