infinity-ui-elements 1.9.5 → 1.9.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js CHANGED
@@ -2899,7 +2899,7 @@ const DateRangePicker = React.forwardRef(({ className, value: controlledValue, d
2899
2899
  ? `${window.innerHeight - position.bottom - gap - 10}px`
2900
2900
  : `${position.top - gap - 10}px`,
2901
2901
  overflowY: "auto",
2902
- }, className: cn("bg-surface-fill-neutral-intense rounded-large shadow-lg border border-surface-outline-neutral-subtle", calendarClassName), onClick: (e) => e.stopPropagation(), children: jsxs("div", { className: "flex", children: [showPresets && presets.length > 0 && (jsx("div", { className: "w-48 border-r border-surface-outline-neutral-subtle p-4 flex flex-col", children: presets.map((preset) => (jsx(ListItem, { title: preset.label, type: "single", showChevron: false, isSelected: selectedPreset === preset.value, onClick: () => handlePresetClick(preset), containerClassName: "mb-1 last:mb-0" }, preset.value))) })), jsxs("div", { className: "p-4", children: [jsxs("div", { className: "flex gap-6", children: [jsxs("div", { className: "flex flex-col gap-3", children: [jsx("div", { className: "flex flex-col px-3", children: jsx("p", { className: "text-body-small-medium", children: "Start Date" }) }), jsxs("div", { className: "flex flex-col p-5 rounded-[8px] bg-surface-fill-neutral-moderate", children: [jsxs("div", { className: "flex items-center justify-between mb-3 px-3", children: [jsx("h3", { className: "text-body-small-medium font-medium text-surface-ink-neutral-normal", children: formatMonthYear(startMonth) }), jsxs("div", { className: "flex items-center gap-2", children: [jsx("button", { onClick: handlePrevStartMonth, className: "p-1 hover:bg-surface-fill-neutral-faded rounded transition-colors", "aria-label": "Previous month", children: jsx(ChevronLeft, { className: "w-4 h-4 text-surface-ink-neutral-normal" }) }), jsx("button", { onClick: handleNextStartMonth, className: "p-1 hover:bg-surface-fill-neutral-faded rounded transition-colors", "aria-label": "Next month", children: jsx(ChevronRight, { className: "w-4 h-4 text-surface-ink-neutral-normal" }) })] })] }), jsx("div", { className: "date-range-calendar-wrapper", children: jsx(Calendar$1, { onChange: handleStartDateChange, value: tempValue.startDate, minDate: minDateParsed ?? undefined, maxDate: tempValue.endDate
2902
+ }, className: cn("bg-surface-fill-neutral-intense rounded-large shadow-lg border-[0.5px] border-surface-outline-neutral-subtle", calendarClassName), onClick: (e) => e.stopPropagation(), children: jsxs("div", { className: "flex flex-col", children: [jsxs("div", { className: "flex flex-row p-7 gap-7", children: [showPresets && presets.length > 0 && (jsx("div", { className: "w-[160px] flex flex-col gap-2", children: presets.map((preset) => (jsx(ListItem, { title: preset.label, type: "single", showChevron: false, isSelected: selectedPreset === preset.value, onClick: () => handlePresetClick(preset), containerClassName: "px-4 py-3" }, preset.value))) })), jsxs("div", { className: "flex gap-7", children: [jsxs("div", { className: "flex flex-col gap-3", children: [jsx("div", { className: "flex flex-col px-3", children: jsx("p", { className: "text-body-small-medium", children: "Start Date" }) }), jsxs("div", { className: "flex flex-col p-5 rounded-[8px] bg-surface-fill-neutral-moderate", children: [jsxs("div", { className: "flex items-center justify-between mb-3 px-3", children: [jsx("h3", { className: "text-body-small-medium font-medium text-surface-ink-neutral-normal", children: formatMonthYear(startMonth) }), jsxs("div", { className: "flex items-center gap-2", children: [jsx("button", { onClick: handlePrevStartMonth, className: "p-1 hover:bg-surface-fill-neutral-faded rounded transition-colors", "aria-label": "Previous month", children: jsx(ChevronLeft, { className: "w-4 h-4 text-surface-ink-neutral-normal" }) }), jsx("button", { onClick: handleNextStartMonth, className: "p-1 hover:bg-surface-fill-neutral-faded rounded transition-colors", "aria-label": "Next month", children: jsx(ChevronRight, { className: "w-4 h-4 text-surface-ink-neutral-normal" }) })] })] }), jsx("div", { className: "date-range-calendar-wrapper", children: jsx(Calendar$1, { onChange: handleStartDateChange, value: tempValue.startDate, minDate: minDateParsed ?? undefined, maxDate: tempValue.endDate
2903
2903
  ? tempValue.endDate
2904
2904
  : maxDateParsed ?? undefined, activeStartDate: startMonth, onActiveStartDateChange: ({ activeStartDate, }) => {
2905
2905
  if (activeStartDate)
@@ -2931,15 +2931,15 @@ const DateRangePicker = React.forwardRef(({ className, value: controlledValue, d
2931
2931
  "SAT",
2932
2932
  ];
2933
2933
  return weekdayNames[date.getDay()];
2934
- } }) })] })] })] }), jsxs("div", { className: "mt-4 pt-4 border-t border-surface-outline-neutral-subtle flex items-center justify-between", children: [jsxs("div", { className: "flex items-center gap-2", children: [jsx("div", { className: "w-2 h-2 rounded-full bg-action-fill-primary-default" }), jsx("span", { className: "text-sm text-surface-ink-neutral-normal", children: tempValue.startDate && tempValue.endDate
2935
- ? isSameDay(tempValue.startDate, tempValue.endDate)
2936
- ? "Today"
2937
- : `${formatDate(tempValue.startDate)} - ${formatDate(tempValue.endDate)}`
2938
- : tempValue.startDate
2939
- ? `From ${formatDate(tempValue.startDate)}`
2940
- : tempValue.endDate
2941
- ? `Until ${formatDate(tempValue.endDate)}`
2942
- : "No selection" })] }), jsxs("div", { className: "flex items-center gap-2", children: [jsx(Button, { variant: "secondary", color: "neutral", size: "small", onClick: handleCancel, children: "Cancel" }), jsx(Button, { variant: "primary", color: "primary", size: "small", onClick: handleApply, children: "Apply date range" })] })] })] })] }) }));
2934
+ } }) })] })] })] })] }), jsxs("div", { className: "border-t-[0.5px] border-surface-outline-neutral-subtle flex px-8 py-5 items-center justify-between", children: [jsxs("div", { className: "flex items-center gap-2", children: [jsx("div", { className: "w-2 h-2 rounded-full bg-action-fill-primary-default" }), jsx("span", { className: "text-sm text-surface-ink-neutral-normal", children: tempValue.startDate && tempValue.endDate
2935
+ ? isSameDay(tempValue.startDate, tempValue.endDate)
2936
+ ? "Today"
2937
+ : `${formatDate(tempValue.startDate)} - ${formatDate(tempValue.endDate)}`
2938
+ : tempValue.startDate
2939
+ ? `From ${formatDate(tempValue.startDate)}`
2940
+ : tempValue.endDate
2941
+ ? `Until ${formatDate(tempValue.endDate)}`
2942
+ : "No selection" })] }), jsxs("div", { className: "flex items-center gap-4", children: [jsx(Button, { variant: "secondary", color: "neutral", size: "small", onClick: handleCancel, children: "Cancel" }), jsx(Button, { variant: "primary", color: "primary", size: "small", onClick: handleApply, children: "Apply date range" })] })] })] }) }));
2943
2943
  return createPortal(calendarPopup, document.body);
2944
2944
  })()] }));
2945
2945
  });
@@ -3260,7 +3260,7 @@ const Modal = React.forwardRef(({ isOpen, onClose, title, description, footer, c
3260
3260
  if (!isOpen)
3261
3261
  return null;
3262
3262
  const hasHeader = title || description;
3263
- return (jsxs("div", { className: cn("fixed inset-0 z-9999 flex items-center justify-center p-4", className), role: "dialog", "aria-modal": "true", "aria-label": ariaLabel || title, "aria-describedby": ariaDescribedBy, children: [jsx("div", { className: cn("absolute inset-0 z-0 bg-black/50 backdrop-blur-sm transition-opacity", overlayClassName), onClick: handleOverlayClick, "aria-hidden": "true" }), jsxs("div", { ref: contentRef, className: cn("relative transition-all z-10", "flex flex-col max-h-[90vh]", variant === "default" && "w-full bg-white rounded-large shadow-xl", variant === "default" && sizeConfig[size], contentClassName), children: [hasHeader && (jsxs("div", { className: cn("flex items-start justify-between gap-4", variant === "default" && "px-6 pt-6", variant === "default" && !description && "pb-4", variant === "default" && description && "pb-2", headerClassName), children: [jsxs("div", { className: "flex-1", children: [title && (jsx(Text, { as: "h2", variant: "body", size: "large", weight: "semibold", color: "default", children: title })), description && (jsx(Text, { as: "p", variant: "body", size: "small", weight: "regular", color: "subtle", className: "mt-1", children: description }))] }), showCloseButton && onClose && (jsx(IconButton, { icon: "close", onClick: onClose, color: "neutral", size: "small", "aria-label": "Close modal", className: "shrink-0" }))] })), !hasHeader && showCloseButton && onClose && (jsx("div", { className: cn("absolute z-10", variant === "default" && "top-4 right-4"), children: jsx(IconButton, { icon: "close", onClick: onClose, color: "neutral", size: "small", "aria-label": "Close modal" }) })), jsx("div", { className: cn("flex-1 overflow-y-auto", variant === "default" && "px-6", variant === "default" && hasHeader && "py-4", variant === "default" && !hasHeader && "pt-6 pb-4", variant === "default" && !footer && "pb-6", bodyClassName), children: children }), footer && (jsxs("div", { className: "flex flex-col", children: [variant === "default" && (jsx(Divider, { thickness: "thin", variant: "muted" })), jsx("div", { className: cn("flex items-center justify-end gap-3", variant === "default" && "px-6 py-4", footerClassName), children: footer })] }))] })] }));
3263
+ return (jsxs("div", { className: cn("fixed inset-0 z-9999 flex items-center justify-center p-4", className), role: "dialog", "aria-modal": "true", "aria-label": ariaLabel || title, "aria-describedby": ariaDescribedBy, children: [jsx("div", { className: cn("absolute inset-0 z-0 bg-black/50 backdrop-blur-sm transition-opacity", overlayClassName), onClick: handleOverlayClick, "aria-hidden": "true" }), jsxs("div", { ref: contentRef, className: cn("relative transition-all z-10", "flex flex-col max-h-[90vh]", variant === "default" && "w-full bg-white rounded-large shadow-xl", variant === "default" && sizeConfig[size], contentClassName), children: [hasHeader && (jsxs("div", { className: cn("flex items-start justify-between gap-4 px-6 pt-6", !description && "pb-4", description && "pb-2", headerClassName), children: [jsxs("div", { className: "flex-1", children: [title && (jsx(Text, { as: "h2", variant: "body", size: "large", weight: "semibold", color: "default", children: title })), description && (jsx(Text, { as: "p", variant: "body", size: "small", weight: "regular", color: "subtle", className: "mt-1", children: description }))] }), showCloseButton && onClose && (jsx(IconButton, { icon: "close", onClick: onClose, color: "neutral", size: "small", "aria-label": "Close modal", className: "shrink-0" }))] })), !hasHeader && showCloseButton && onClose && (jsx("div", { className: "absolute top-4 right-4 z-10", children: jsx(IconButton, { icon: "close", onClick: onClose, color: "neutral", size: "small", "aria-label": "Close modal" }) })), jsx("div", { className: cn("flex-1 overflow-y-auto", variant === "default" && "px-6", variant === "default" && hasHeader && "py-4", variant === "default" && !hasHeader && "pt-6 pb-4", variant === "default" && !footer && "pb-6", bodyClassName), children: children }), footer && (jsxs("div", { className: "flex flex-col", children: [variant === "default" && (jsx(Divider, { thickness: "thin", variant: "muted" })), jsx("div", { className: cn("flex items-center justify-end gap-3 px-6 pt-5 pb-6", footerClassName), children: footer })] }))] })] }));
3264
3264
  });
3265
3265
  Modal.displayName = "Modal";
3266
3266