ivt
Version:
Ivt Components Library
245 lines (240 loc) • 11.4 kB
JavaScript
import React__default from 'react';
import { c } from './index.module-Czm-Rcez.mjs';
import { c as cn } from './utils-BDcRwQMd.mjs';
import { X } from './x-B6hDJA_l.mjs';
import { C as ChevronsUpDown } from './chevrons-up-down-CdBVNy4c.mjs';
import { C as Check } from './check-Ds358kZc.mjs';
import { L as Label } from './label-D0iRy8Wj.mjs';
import { P as Popover, a as PopoverTrigger, b as PopoverContent } from './popover-CdZgcLPo.mjs';
import { B as Button } from './button-CZpmCmNo.mjs';
import { c as TooltipProvider, T as Tooltip, a as TooltipTrigger, b as TooltipContent } from './tooltip-njN_ok-r.mjs';
import { S as Separator } from './separator-DYyhdAi6.mjs';
import { C as Command, b as CommandInput, d as CommandEmpty, c as CommandList, e as CommandGroup, f as CommandItem } from './command-o67hOCgH.mjs';
import { t as tryParseDate, p as ptBR } from './date-Dqmv8Nr4.mjs';
import { L as LoaderCircle } from './loader-circle-BMRpEmW6.mjs';
import { C as CalendarDays } from './calendar-days-DnYx8d46.mjs';
import { t as toDate, f as format } from './format-8qs-kXlN.mjs';
import { C as Calendar } from './calendar-CDJv1B--.mjs';
/**
* The {@link isWeekend} function options.
*/ /**
* @name isWeekend
* @category Weekday Helpers
* @summary Does the given date fall on a weekend?
*
* @description
* Does the given date fall on a weekend? A weekend is either Saturday (`6`) or Sunday (`0`).
*
* @param date - The date to check
* @param options - An object with options
*
* @returns The date falls on a weekend
*
* @example
* // Does 5 October 2014 fall on a weekend?
* const result = isWeekend(new Date(2014, 9, 5))
* //=> true
*/ function isWeekend(date, options) {
const day = toDate(date, options?.in).getDay();
return day === 0 || day === 6;
}
function AutoComplete({ value, onChange, placeholder = "Selecione", searchPlaceholder = "Buscar...", open, onOpenChange, disabled, messageEmpty = "Nenhum item encontrado.", fetchOptions, getOptionLabel, getOptionKey, onSelect, className, clearable = false, label, description, id }) {
const [options, setOptions] = React__default.useState([]);
const [loading, setLoading] = React__default.useState(false);
const [searchTerm, setSearchTerm] = React__default.useState("");
const generatedId = React__default.useId();
const inputId = id || generatedId;
const sortedOptions = React__default.useMemo(()=>{
if (!value) return options;
return [
...options
].sort((a, b)=>{
if (getOptionLabel(a) === getOptionLabel(value)) return -1;
if (getOptionLabel(b) === getOptionLabel(value)) return 1;
return getOptionLabel(a).localeCompare(getOptionLabel(b));
});
}, [
options,
value,
getOptionLabel
]);
const debouncedFetch = c(async (term)=>{
try {
const result = await fetchOptions(term);
setOptions(result);
} catch (err) {
console.error("Erro ao buscar opções:", err);
setOptions([]);
} finally{
setLoading(false);
}
}, 500);
const handleInputChange = (val)=>{
setSearchTerm(val);
if (val.trim() === "") {
setOptions([]);
setLoading(false);
return;
}
setLoading(true);
debouncedFetch(val);
};
const handleSelect = (option)=>{
if (onSelect) {
onSelect(option);
} else {
onChange(option);
onOpenChange(false);
}
};
const handleClear = (e)=>{
e.stopPropagation();
onChange(null);
};
return /*#__PURE__*/ React__default.createElement("div", {
className: "font-lato space-y-2"
}, label && /*#__PURE__*/ React__default.createElement(Label, {
htmlFor: inputId,
className: "text-foreground text-sm font-medium gap-0"
}, label), /*#__PURE__*/ React__default.createElement(Popover, {
open: open,
onOpenChange: onOpenChange
}, /*#__PURE__*/ React__default.createElement(PopoverTrigger, {
asChild: true
}, /*#__PURE__*/ React__default.createElement(Button, {
id: inputId,
variant: "outline",
className: cn("flex h-auto min-h-9 w-full items-center justify-between rounded-md border bg-inherit px-3 py-2 hover:bg-inherit [&_svg]:pointer-events-auto", className),
"aria-expanded": open,
disabled: disabled
}, /*#__PURE__*/ React__default.createElement("span", {
className: cn("min-w-0 flex-1 truncate text-muted-foreground text-left", value && "text-foreground")
}, value ? getOptionLabel(value) : placeholder), /*#__PURE__*/ React__default.createElement("div", {
className: "flex items-center justify-between"
}, clearable && value && !disabled ? /*#__PURE__*/ React__default.createElement(React__default.Fragment, null, /*#__PURE__*/ React__default.createElement(TooltipProvider, null, /*#__PURE__*/ React__default.createElement(Tooltip, null, /*#__PURE__*/ React__default.createElement(TooltipTrigger, {
asChild: true
}, /*#__PURE__*/ React__default.createElement("div", {
onClick: (event)=>{
event.stopPropagation();
handleClear(event);
},
className: "cursor-pointer"
}, /*#__PURE__*/ React__default.createElement(X, {
className: "text-muted-foreground h-4"
}))), /*#__PURE__*/ React__default.createElement(TooltipContent, null, /*#__PURE__*/ React__default.createElement("span", {
className: "text-xs"
}, "Limpar seleção")))), /*#__PURE__*/ React__default.createElement(Separator, {
orientation: "vertical",
className: "flex h-full min-h-6"
})) : null, /*#__PURE__*/ React__default.createElement(ChevronsUpDown, {
className: "text-muted-foreground h-4 cursor-pointer"
})))), /*#__PURE__*/ React__default.createElement(PopoverContent, {
className: "max-h-[300px] w-[--radix-popover-trigger-width] overflow-auto p-0",
side: "bottom",
align: "start"
}, /*#__PURE__*/ React__default.createElement(Command, null, /*#__PURE__*/ React__default.createElement(CommandInput, {
placeholder: searchPlaceholder,
className: "h-9",
onValueChange: handleInputChange
}), /*#__PURE__*/ React__default.createElement(CommandEmpty, null, loading ? "Carregando..." : searchTerm.trim() === "" ? "Digite algo para buscar..." : messageEmpty), /*#__PURE__*/ React__default.createElement(CommandList, {
className: "max-h-60 overflow-y-auto"
}, /*#__PURE__*/ React__default.createElement(CommandGroup, null, sortedOptions.map((item)=>{
const label = getOptionLabel(item);
const key = getOptionKey(item);
return /*#__PURE__*/ React__default.createElement(CommandItem, {
key: key,
value: label,
onSelect: ()=>handleSelect(item),
className: "flex items-center gap-2"
}, value && getOptionLabel(value) === label ? /*#__PURE__*/ React__default.createElement(Check, {
className: "h-4 w-4 shrink-0 opacity-100"
}) : /*#__PURE__*/ React__default.createElement("div", {
className: "h-4 w-4 shrink-0"
}), /*#__PURE__*/ React__default.createElement("span", {
className: "min-w-0 flex-1 truncate"
}, label));
})))))), description && /*#__PURE__*/ React__default.createElement("p", {
className: "text-muted-foreground text-sm"
}, description));
}
function normalizeDate(date) {
return format(date, "yyyy-MM-dd");
}
const CalendarPopover = ({ date, setDate, placeholder = "Selecione uma data", id = "calendar-popover", buttonProps, popoverProps, popoverContentClassName, className, disabled, isLoading, disabledDates, isLoadingTable, disableFuture = true, disableWeekends = true, clearable = true, ...props })=>{
const validDate = tryParseDate(date ?? undefined);
const [isOpen, setIsOpen] = React__default.useState(false);
const [month, setMonth] = React__default.useState(validDate || new Date());
React__default.useEffect(()=>{
if (isOpen) {
setMonth(validDate || new Date());
}
}, [
isOpen,
validDate
]);
const handleClear = (e)=>{
e.stopPropagation();
setDate(undefined);
};
return /*#__PURE__*/ React__default.createElement(Popover, {
open: isOpen,
onOpenChange: setIsOpen,
...popoverProps
}, /*#__PURE__*/ React__default.createElement(PopoverTrigger, {
asChild: true
}, /*#__PURE__*/ React__default.createElement(Button, {
id: id,
variant: "outline",
className: cn("hover:text-foreground justify-between text-left font-normal", !validDate && "text-muted-foreground hover:text-muted-foreground", className),
disabled: typeof disabled === "boolean" ? disabled : undefined,
...buttonProps
}, /*#__PURE__*/ React__default.createElement("div", {
className: "flex items-center"
}, isLoading ? /*#__PURE__*/ React__default.createElement(LoaderCircle, {
className: "size-4 animate-spin mr-2"
}) : /*#__PURE__*/ React__default.createElement(CalendarDays, {
className: "size-4 mr-2"
}), isLoading ? /*#__PURE__*/ React__default.createElement("span", null, "carregando...") : validDate ? format(validDate, "P", {
locale: ptBR
}) : /*#__PURE__*/ React__default.createElement("span", null, placeholder)), validDate && !disabled && !isLoading && clearable && // biome-ignore lint/a11y/useKeyWithClickEvents: clear button action
// biome-ignore lint/a11y/noStaticElementInteractions: clear button action
/*#__PURE__*/ React__default.createElement("div", {
onClick: handleClear,
className: "cursor-pointer p-1"
}, /*#__PURE__*/ React__default.createElement(X, {
className: "h-4 w-4 opacity-50 hover:opacity-100"
})))), /*#__PURE__*/ React__default.createElement(PopoverContent, {
className: cn("w-auto p-0", popoverContentClassName),
align: "start"
}, /*#__PURE__*/ React__default.createElement(Calendar, {
autoFocus: true,
captionLayout: "dropdown",
selected: validDate || undefined,
onSelect: (d)=>{
setDate(d);
setIsOpen(false);
},
locale: ptBR,
numberOfMonths: 1,
fromYear: 1900,
toYear: 2100,
disabled: (currentDate)=>{
if (isLoading || isLoadingTable) return true;
// Se disabled for uma função, respeite-a
if (typeof disabled === "function") {
if (disabled(currentDate)) return true;
}
const normalizedCurrentDate = normalizeDate(currentDate);
const isHoliday = disabledDates?.has(normalizedCurrentDate);
const isWeekendDay = disableWeekends && isWeekend(currentDate);
const isFutureDate = disableFuture && currentDate > new Date();
return isHoliday || isWeekendDay || isFutureDate || false;
},
month: month,
onMonthChange: setMonth,
...props,
mode: "single"
})));
};
export { AutoComplete as A, CalendarPopover as C, normalizeDate as n };
//# sourceMappingURL=CalendarPopover-DNS2oszG.mjs.map