@moondreamsdev/dreamer-ui 1.7.10-test.99 → 1.7.12

package/dist/hooks.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./useToast-CraVIawn.cjs");exports.ActionModalContext=o.ActionModalContext;exports.useActionModal=o.useActionModal;exports.useToast=o.useToast;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./useToast-CraVIawn.cjs"),o=require("./useScreenSize-UGyolnfn.cjs");exports.ActionModalContext=e.ActionModalContext;exports.useActionModal=e.useActionModal;exports.useToast=e.useToast;exports.useScreenSize=o.useScreenSize;
 //# sourceMappingURL=hooks.cjs.js.map

package/dist/hooks.esm.js

@@ -1,7 +1,9 @@
-import { A as s, u as t, a as e } from "./useToast-CEKvEJVB.js";
+import { A as a, u as s, a as t } from "./useToast-CEKvEJVB.js";
+import { u } from "./useScreenSize-DiuQZBHb.js";
 export {
-  s as ActionModalContext,
-  t as useActionModal,
-  e as useToast
+  a as ActionModalContext,
+  s as useActionModal,
+  u as useScreenSize,
+  t as useToast
 };
 //# sourceMappingURL=hooks.esm.js.map

package/dist/hooks.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"hooks.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/providers.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),s=require("react"),x=require("./Toast-wRAL8PRi.cjs");require("react-dom");const g=require("./useToast-CraVIawn.cjs"),b=require("./join-BVMUUvyP.cjs");function y({children:d}){const[e,n]=s.useState(null),m=s.useCallback(t=>new Promise(l=>{n({isOpen:!0,type:"confirm",title:t.title,message:t.message,confirmText:t.confirmText,cancelText:t.cancelText,destructive:t.destructive,resolve:l})}),[]),c=s.useCallback(t=>new Promise(l=>{n({isOpen:!0,type:"alert",title:t.title,message:t.message,confirmText:t.confirmText,destructive:t.destructive,resolve:l})}),[]),i=s.useCallback(()=>{e!=null&&e.resolve&&(e.type==="confirm"?e.resolve(!1):e.resolve()),n(null)},[e]),a=s.useCallback(()=>{e!=null&&e.resolve&&(e.type==="confirm"?e.resolve(!0):e.resolve()),n(null)},[e]),f={confirm:m,alert:c};return o.jsxs(g.ActionModalContext.Provider,{value:f,children:[d,e&&e.type==="alert"&&o.jsx(x.ActionModal,{type:"alert",isOpen:e.isOpen,onClose:i,title:e.title,message:e.message,confirmText:e.confirmText,destructive:e.destructive,onConfirm:a,className:"bg-white dark:bg-gray-800 rounded-lg"}),e&&e.type==="confirm"&&o.jsx(x.ActionModal,{type:"confirm",isOpen:e.isOpen,onClose:i,title:e.title,message:e.message,confirmText:e.confirmText,cancelText:e.cancelText,destructive:e.destructive,onConfirm:a,className:"bg-white dark:bg-gray-800 rounded-lg"})]})}const C={"top-right":"top-4 right-4","top-left":"top-4 left-4","bottom-right":"bottom-4 right-4","bottom-left":"bottom-4 left-4","top-center":"top-4 left-1/2 -translate-x-1/2","bottom-center":"bottom-4 left-1/2 -translate-x-1/2"};function h({children:d,customTypes:e,customComponent:n,position:m="top-right",maxToasts:c=5}){const[i,a]=s.useState([]),f=s.useCallback(r=>{const v=`toast-${Date.now()}-${Math.random().toString(36).slice(2,9)}`,u=r.id||v,T={id:u,title:r.title,description:r.description,type:r.type||"info",action:r.action,duration:r.duration??5e3};return a(p=>[T,...p].slice(0,c)),u},[c]),t=s.useCallback(r=>{a(v=>v.filter(u=>u.id!==r))},[]),l={addToast:f,removeToast:t,toasts:i};return o.jsxs(g.ToastContext.Provider,{value:l,children:[d,o.jsx("div",{className:b.join("fixed z-50 pointer-events-none  max-w-sm w-full space-y-2",C[m]),role:"region","aria-label":"Notifications",children:i.map(r=>o.jsx("div",{className:"pointer-events-auto",children:o.jsx(x.Toast,{...r,onRemove:t,customTypes:e,customComponent:n})},r.id))})]})}exports.ActionModalProvider=y;exports.ToastProvider=h;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),s=require("react"),x=require("./Toast-Dj3X8g0Q.cjs"),g=require("./useToast-CraVIawn.cjs");require("react-dom");const b=require("./join-BVMUUvyP.cjs");function y({children:d}){const[e,n]=s.useState(null),m=s.useCallback(t=>new Promise(l=>{n({isOpen:!0,type:"confirm",title:t.title,message:t.message,confirmText:t.confirmText,cancelText:t.cancelText,destructive:t.destructive,resolve:l})}),[]),c=s.useCallback(t=>new Promise(l=>{n({isOpen:!0,type:"alert",title:t.title,message:t.message,confirmText:t.confirmText,destructive:t.destructive,resolve:l})}),[]),i=s.useCallback(()=>{e!=null&&e.resolve&&(e.type==="confirm"?e.resolve(!1):e.resolve()),n(null)},[e]),a=s.useCallback(()=>{e!=null&&e.resolve&&(e.type==="confirm"?e.resolve(!0):e.resolve()),n(null)},[e]),f={confirm:m,alert:c};return o.jsxs(g.ActionModalContext.Provider,{value:f,children:[d,e&&e.type==="alert"&&o.jsx(x.ActionModal,{type:"alert",isOpen:e.isOpen,onClose:i,title:e.title,message:e.message,confirmText:e.confirmText,destructive:e.destructive,onConfirm:a,className:"bg-white dark:bg-gray-800 rounded-lg"}),e&&e.type==="confirm"&&o.jsx(x.ActionModal,{type:"confirm",isOpen:e.isOpen,onClose:i,title:e.title,message:e.message,confirmText:e.confirmText,cancelText:e.cancelText,destructive:e.destructive,onConfirm:a,className:"bg-white dark:bg-gray-800 rounded-lg"})]})}const C={"top-right":"top-4 right-4","top-left":"top-4 left-4","bottom-right":"bottom-4 right-4","bottom-left":"bottom-4 left-4","top-center":"top-4 left-1/2 -translate-x-1/2","bottom-center":"bottom-4 left-1/2 -translate-x-1/2"};function h({children:d,customTypes:e,customComponent:n,position:m="top-right",maxToasts:c=5}){const[i,a]=s.useState([]),f=s.useCallback(r=>{const v=`toast-${Date.now()}-${Math.random().toString(36).slice(2,9)}`,u=r.id||v,T={id:u,title:r.title,description:r.description,type:r.type||"info",action:r.action,duration:r.duration??5e3};return a(p=>[T,...p].slice(0,c)),u},[c]),t=s.useCallback(r=>{a(v=>v.filter(u=>u.id!==r))},[]),l={addToast:f,removeToast:t,toasts:i};return o.jsxs(g.ToastContext.Provider,{value:l,children:[d,o.jsx("div",{className:b.join("fixed z-50 pointer-events-none  max-w-sm w-full space-y-2",C[m]),role:"region","aria-label":"Notifications",children:i.map(r=>o.jsx("div",{className:"pointer-events-auto",children:o.jsx(x.Toast,{...r,onRemove:t,customTypes:e,customComponent:n})},r.id))})]})}exports.ActionModalProvider=y;exports.ToastProvider=h;
 //# sourceMappingURL=providers.cjs.js.map

package/dist/providers.esm.js

@@ -1,8 +1,8 @@
 import { jsxs as g, jsx as l } from "react/jsx-runtime";
 import { useState as x, useCallback as s } from "react";
-import { A as v, T as y } from "./Toast-CRG3g8vr.js";
-import "react-dom";
+import { A as v, T as y } from "./Toast-DUpf_XxS.js";
 import { A as b, T as C } from "./useToast-CEKvEJVB.js";
+import "react-dom";
 import { j as w } from "./join-BmgR_f4v.js";
 function $({ children: d }) {
   const [e, o] = x(null), f = s((t) => new Promise((a) => {

package/dist/src/components/accordion/Accordion.d.ts

@@ -1,21 +1,57 @@
 import React from 'react';
 import { AccordionItemProps } from './AccordionItem';
 export interface AccordionOption {
+    /** Unique identifier for the accordion item. */
     id?: string;
+    /** The title/header content for the accordion item. */
     title: React.ReactNode;
+    /** The main content that will be shown when the item is expanded. */
     content: React.ReactNode;
+    /** Whether the accordion item is disabled and cannot be toggled. */
     disabled?: boolean;
+    /** Whether the accordion item should be open by default. */
     defaultOpen?: boolean;
 }
 export interface AccordionProps {
+    /** Unique identifier for the accordion container. */
     id?: string;
+    /** Array of accordion items with id, title, content, and optional disabled state. */
     items?: AccordionOption[];
+    /** AccordionItem components when using the component approach. */
     children?: React.ReactElement<AccordionItemProps>[] | React.ReactElement<AccordionItemProps>;
+    /** Additional CSS classes to apply to the accordion container. */
     className?: string;
+    /** Additional CSS classes to apply to individual accordion items. */
     itemClassName?: string;
+    /** Whether multiple items can be open simultaneously. */
     allowMultiple?: boolean;
+    /** Array of item IDs that should be open by default. */
     defaultOpenItems?: string[];
+    /** Additional CSS classes to apply to all trigger buttons. */
     triggersClassName?: string;
+    /** Additional CSS classes to apply to all content bodies. */
     bodiesClassName?: string;
 }
+/**
+ * A flexible accordion component that supports expandable/collapsible content sections.
+ * Can be used either with an items array or with AccordionItem child components.
+ *
+ * @example
+ * ```tsx
+ * // Using items prop
+ * <Accordion
+ *   items={[
+ *     { id: "1", title: "Section 1", content: "Content here" },
+ *     { id: "2", title: "Section 2", content: "More content" }
+ *   ]}
+ *   allowMultiple={false}
+ * />
+ *
+ * // Using children
+ * <Accordion allowMultiple>
+ *   <AccordionItem title="Custom Section" content="Custom content" />
+ *   <AccordionItem title="Another Section" content="Another content" />
+ * </Accordion>
+ * ```
+ */
 export declare function Accordion({ id, items, children, className, itemClassName, allowMultiple, defaultOpenItems, triggersClassName, bodiesClassName, }: AccordionProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/accordion/AccordionItem.d.ts

@@ -1,11 +1,31 @@
 /// <reference types="react" />
 import { AccordionOption } from './Accordion';
 export interface AccordionItemProps extends Omit<AccordionOption, 'defaultOpen'> {
+    /** Content to render inside the accordion item. */
     children?: React.ReactNode;
+    /** Additional CSS classes to apply to the accordion item. */
     className?: string;
+    /** Whether the accordion item is currently open. */
     isOpen?: boolean;
+    /** Callback function called when the accordion item is toggled. */
     onToggle?: () => void;
+    /** Additional CSS classes to apply to the trigger button. */
     triggerClassName?: string;
+    /** Additional CSS classes to apply to the content body. */
     bodyClassName?: string;
 }
+/**
+ * Individual accordion item component with expandable content.
+ * Provides keyboard navigation and accessibility features.
+ *
+ * @example
+ * ```tsx
+ * <AccordionItem
+ *   title="FAQ Question"
+ *   content="This is the answer to the question"
+ *   isOpen={false}
+ *   onToggle={() => console.log('toggled')}
+ * />
+ * ```
+ */
 export declare function AccordionItem({ id, title, content, children, className, disabled, isOpen, onToggle, triggerClassName, bodyClassName, }: AccordionItemProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/actionmodal/ActionModal.d.ts

@@ -1,21 +1,55 @@
 import { ModalProps } from '@moondreamsdev/dreamer-ui/components';
 import React from 'react';
 interface BaseActionModalProps extends Omit<ModalProps, 'children' | 'actions'> {
+    /** The main content/message to display in the modal. */
     message: React.ReactNode;
+    /** Whether to style the confirm button with destructive/danger styling. */
     destructive?: boolean;
 }
 interface AlertModalProps extends BaseActionModalProps {
+    /** The type of action modal - alert shows only OK, confirm shows OK and Cancel. */
     type: 'alert';
+    /** Custom text for the confirm/OK button. */
     confirmText?: string;
+    /** Callback fired when the confirm/OK button is clicked. */
     onConfirm?: () => void;
     cancelText?: never;
 }
 interface ConfirmModalProps extends BaseActionModalProps {
+    /** The type of action modal - alert shows only OK, confirm shows OK and Cancel. */
     type: 'confirm';
+    /** Custom text for the confirm/OK button. */
     confirmText?: string;
+    /** Custom text for the cancel button (only for confirm type). */
     cancelText?: string;
+    /** Callback fired when the confirm/OK button is clicked. */
     onConfirm?: () => void;
 }
 export type ActionModalProps = AlertModalProps | ConfirmModalProps;
+/**
+ * A modal dialog for user confirmation or alerts with predefined action buttons.
+ * Supports both alert (single OK button) and confirm (OK + Cancel buttons) modes.
+ *
+ * @example
+ * ```tsx
+ * // Alert modal
+ * <ActionModal
+ *   type="alert"
+ *   message="Operation completed successfully!"
+ *   onClose={() => setShowModal(false)}
+ *   isOpen={showModal}
+ * />
+ *
+ * // Confirmation modal
+ * <ActionModal
+ *   type="confirm"
+ *   message="Are you sure you want to delete this item?"
+ *   destructive
+ *   onConfirm={() => deleteItem()}
+ *   onClose={() => setShowModal(false)}
+ *   isOpen={showModal}
+ * />
+ * ```
+ */
 export declare function ActionModal({ type, message, cancelText, confirmText, onConfirm, onClose, destructive, title, ...modalProps }: ActionModalProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/components/avatar/Avatar.d.ts

@@ -1,23 +1,39 @@
 import React from 'react';
 import { AvatarPreset, AvatarShape, AvatarSize } from './variants';
 export interface AvatarProps extends React.HTMLAttributes<HTMLDivElement> {
-    /** Unique identifier for the avatar */
+    /** The HTML id attribute for the avatar */
     id?: string;
     /** Reference to the avatar element */
     ref?: React.Ref<HTMLDivElement>;
-    /** Size of the avatar */
+    /** The size of the avatar */
     size?: AvatarSize;
-    /** Shape of the avatar */
+    /** The shape of the avatar */
     shape?: AvatarShape;
-    /** Pre-defined avatar preset */
+    /** Pre-defined cartoon-like avatar to display */
     preset?: AvatarPreset;
-    /** Alt text for accessibility */
+    /** Alternative text for the avatar image */
     alt?: string;
-    /** Additional CSS classes */
+    /** Additional CSS classes to apply to the avatar */
     className?: string;
-    /** Custom image source (overrides preset) */
+    /** Custom image source URL */
     src?: string;
-    /** Initials to display (overrides preset if no src) */
+    /** Initials to display when no preset or src is provided */
     initials?: string;
 }
+/**
+ * Displays user avatars with support for images, preset icons, or initials.
+ * Provides various size and shape options with built-in fallback handling.
+ *
+ * @example
+ * ```tsx
+ * // With custom image
+ * <Avatar src="/user-photo.jpg" alt="John Doe" size="lg" />
+ *
+ * // With preset character
+ * <Avatar preset="astronaut" size="md" shape="circle" />
+ *
+ * // With initials fallback
+ * <Avatar initials="JD" size="sm" />
+ * ```
+ */
 export declare function Avatar({ id, ref, size, shape, preset, alt, className, src, initials, ...props }: AvatarProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/badge/Badge.d.ts

@@ -1,15 +1,37 @@
 import React from 'react';
 import { BadgeSize, BadgeUse, BadgeVariant } from './variants';
 export interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** The HTML id attribute for the badge */
     id?: string;
+    /** Reference to the badge element */
     ref?: React.Ref<HTMLSpanElement>;
+    /** The visual style variant of the badge */
     variant?: BadgeVariant;
+    /** Whether to render the badge with an outline style */
     outline?: boolean;
+    /** The content to display inside the badge */
     children?: React.ReactNode;
+    /** The aspect ratio of the badge - square for equal padding, video for horizontal padding */
     aspect?: 'square' | 'video';
-    /** Used for accessibility purposes to define the aria attributes of the badge. */
+    /** The semantic use of the badge for accessibility purposes */
     use?: BadgeUse;
-    /** Size of the badge. `md` uses `text-base` */
+    /** The size of the badge */
     size?: BadgeSize;
 }
+/**
+ * A small UI element for displaying status, labels, or categories.
+ * Supports various colors, sizes, and semantic accessibility attributes.
+ *
+ * @example
+ * ```tsx
+ * // Status badge
+ * <Badge variant="success" use="status">Active</Badge>
+ *
+ * // Notification count
+ * <Badge variant="destructive" aspect="square" use="status">5</Badge>
+ *
+ * // Category tag
+ * <Badge variant="muted" outline>JavaScript</Badge>
+ * ```
+ */
 export declare function Badge({ id, ref, variant, outline, children, className, aspect, use, size, ...props }: BadgeProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,16 +1,37 @@
-import { ButtonHTMLAttributes, Ref } from 'react';
+import React, { ButtonHTMLAttributes, Ref } from 'react';
 import { ButtonVariants } from './variants';
 interface ButtonButtonProps extends Partial<ButtonVariants>, ButtonHTMLAttributes<HTMLButtonElement> {
     href?: never;
+    /** Reference to the button element. */
     ref?: Ref<HTMLButtonElement>;
+    /** Whether the button is in a loading state. */
     loading?: boolean;
 }
 interface ButtonLinkProps extends Partial<ButtonVariants>, Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href' | 'role'> {
+    /** When provided, renders the button as a link. */
     href: string;
+    /** Reference to the anchor element. */
     ref?: Ref<HTMLAnchorElement>;
     loading?: never;
+    /** Whether the button is disabled. */
     disabled?: boolean;
 }
 export type ButtonProps = ButtonButtonProps | ButtonLinkProps;
+/**
+ * A versatile button component that can render as either a button or anchor element.
+ * Supports loading states, various visual variants, and accessibility features.
+ *
+ * @example
+ * ```tsx
+ * // Regular button
+ * <Button variant="primary" onClick={() => save()}>Save</Button>
+ *
+ * // Loading state
+ * <Button loading variant="primary">Processing...</Button>
+ *
+ * // Link button
+ * <Button href="/dashboard" variant="secondary">Go to Dashboard</Button>
+ * ```
+ */
 export declare function Button({ variant, size, rounded, loading, className, ...rest }: ButtonProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1 +1,10 @@
+/**
+ * An animated loading indicator with three bouncing dots.
+ * Used internally by Button component to show loading state.
+ *
+ * @example
+ * ```tsx
+ * <LoadingDots />
+ * ```
+ */
 export declare function LoadingDots(): import("react/jsx-runtime").JSX.Element;

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

@@ -10,7 +10,7 @@ export declare const buttonVariants: {
 export type ButtonVariant = keyof typeof buttonVariants;
 export declare const sizeVariants: {
     readonly stripped: "";
-    readonly fitted: "size-fit";
+    readonly fitted: "size-fit leading-0";
     readonly sm: "px-2 py-1 text-sm";
     readonly md: "px-4 py-2 text-base";
     readonly lg: "px-6 py-3 text-lg";
@@ -27,8 +27,11 @@ export declare const roundedVariants: {
 };
 export type ButtonRounded = keyof typeof roundedVariants;
 export interface ButtonVariants {
+    /** The visual style variant of the button. */
     variant: ButtonVariant;
+    /** The size of the button. */
     size: ButtonSize;
+    /** The border radius of the button. */
     rounded: ButtonRounded;
 }
 export declare const buttonDefaults: ButtonVariants;

package/dist/src/components/calendar/Calendar.d.ts

@@ -0,0 +1,105 @@
+import { ReactNode, Ref } from 'react';
+import { CalendarDateRange, UseCalendarOptions } from './hooks';
+import { CalendarSize } from './variants';
+export interface CalendarCustomStyles {
+    /** Custom CSS classes for the main calendar container. */
+    containerClassName?: string;
+    /** Custom CSS classes for the calendar header. */
+    headerClassName?: string;
+    /** Custom CSS classes for the navigation button container. */
+    navigationClassName?: string;
+    /** Custom CSS classes for the previous navigation button. */
+    prevButtonClassName?: string;
+    /** Custom CSS classes for the next navigation button. */
+    nextButtonClassName?: string;
+    /** Custom CSS classes for the calendar title. */
+    titleClassName?: string;
+    /** Custom CSS classes for the view selector buttons. */
+    viewSelectorClassName?: string;
+    /** Custom CSS classes for the month and year dropdown selectors. */
+    monthYearSelectorsClassName?: string;
+    /** Custom CSS classes for the today button. */
+    todayButtonClassName?: string;
+    /** Custom CSS classes for the weekdays header row. */
+    weekdaysClassName?: string;
+    /** Custom CSS classes for individual weekday cells. */
+    weekdayClassName?: string;
+    /** Custom CSS classes for the month view grid. */
+    monthGridClassName?: string;
+    /** Custom CSS classes for the week view grid. */
+    weekGridClassName?: string;
+    /** Custom CSS classes for the day view grid. */
+    dayGridClassName?: string;
+    /** Custom CSS classes for date cells. */
+    cellClassName?: string;
+    /** Custom CSS classes for selected date cells. */
+    selectedCellClassName?: string;
+    /** Custom CSS classes for today's date cell. */
+    todayCellClassName?: string;
+    /** Custom CSS classes for disabled date cells. */
+    disabledCellClassName?: string;
+    /** Custom CSS classes for date cells within a selected range. */
+    rangeCellClassName?: string;
+    /** Custom CSS classes for the start date of a selected range. */
+    rangeStartCellClassName?: string;
+    /** Custom CSS classes for the end date of a selected range. */
+    rangeEndCellClassName?: string;
+}
+export interface CalendarProps extends Omit<UseCalendarOptions, 'onDateSelect' | 'onRangeSelect'> {
+    /** The HTML id attribute for the calendar. */
+    id?: string;
+    /** Reference to the calendar container element. */
+    ref?: Ref<HTMLDivElement>;
+    /** Additional CSS classes to apply to the calendar container. */
+    className?: string;
+    /** The size of the calendar component. */
+    size?: CalendarSize;
+    /** Object containing custom CSS classes for different calendar elements. */
+    customStyles?: CalendarCustomStyles;
+    /** Custom render function for date cells. */
+    renderCell?: (date: Date, isSelected: boolean, isDisabled: boolean, isToday: boolean) => ReactNode;
+    /** Whether to show the view selector buttons. */
+    showViewSelector?: boolean;
+    /** Whether to show the navigation buttons. */
+    showNavigation?: boolean;
+    /** Layout of navigation buttons - adjacent (both on left) or around (on sides of title). */
+    navigationLayout?: 'adjacent' | 'around';
+    /** Whether to show month and year as dropdown selectors for easier navigation. */
+    useMonthYearSelector?: boolean;
+    /** Whether to show a button to quickly jump to the current date. */
+    showTodayButton?: boolean;
+    /** Callback fired when a date is selected in single mode. */
+    onDateSelect?: (date: Date) => void;
+    /** Callback fired when a date range is selected in range mode. */
+    onRangeSelect?: (range: CalendarDateRange) => void;
+}
+/**
+ * A full-featured calendar component supporting single date selection, date ranges,
+ * and multiple view modes (month/week/day). Includes navigation, accessibility features,
+ * and extensive customization options.
+ *
+ * @example
+ * ```tsx
+ * // Basic date picker
+ * <Calendar
+ *   mode="single"
+ *   onDateSelect={(date) => setSelectedDate(date)}
+ *   initialDate={new Date()}
+ * />
+ *
+ * // Date range picker
+ * <Calendar
+ *   mode="range"
+ *   onRangeSelect={(range) => setDateRange(range)}
+ *   showTodayButton
+ * />
+ *
+ * // Multi-view calendar
+ * <Calendar
+ *   showViewSelector
+ *   useMonthYearSelector
+ *   navigationLayout="adjacent"
+ * />
+ * ```
+ */
+export declare function Calendar({ id, ref, className, size, customStyles, view, mode, initialDate, minDate, maxDate, renderCell, showViewSelector, showNavigation, navigationLayout, useMonthYearSelector, showTodayButton, onDateSelect, onRangeSelect, ...rest }: CalendarProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/calendar/hooks.d.ts

@@ -0,0 +1,40 @@
+export interface CalendarDateRange {
+    /** The start date of the range, or null if not selected. */
+    start: Date | null;
+    /** The end date of the range, or null if not selected. */
+    end: Date | null;
+}
+export interface UseCalendarOptions {
+    /** The initial date to display and optionally select. */
+    initialDate?: Date;
+    /** The selection mode - single date or date range selection. */
+    mode?: 'single' | 'range';
+    /** The minimum selectable date (dates before this will be disabled). */
+    minDate?: Date;
+    /** The maximum selectable date (dates after this will be disabled). */
+    maxDate?: Date;
+    /** The calendar view to display. */
+    view?: 'month' | 'week' | 'day';
+    /** Callback fired when a date is selected in single mode. */
+    onDateSelect?: (date: Date) => void;
+    /** Callback fired when a date range is selected in range mode. */
+    onRangeSelect?: (range: CalendarDateRange) => void;
+}
+export declare function useCalendar(options?: UseCalendarOptions): {
+    currentDate: Date;
+    selectedDate: Date | null;
+    selectedRange: CalendarDateRange | null;
+    view: "month" | "week" | "day";
+    daysInView: Date[];
+    selectDate: (date: Date) => void;
+    navigate: (direction: 'prev' | 'next') => void;
+    changeView: (newView: 'month' | 'week' | 'day') => void;
+    goToDate: (date: Date) => void;
+    changeMonth: (month: number) => void;
+    changeYear: (year: number) => void;
+    isDateSelected: (date: Date) => boolean | null;
+    isDateDisabled: (date: Date) => boolean;
+    isDateInRange: (date: Date) => boolean;
+    isDateRangeStart: (date: Date) => boolean;
+    isDateRangeEnd: (date: Date) => boolean;
+};

package/dist/src/components/calendar/index.d.ts

@@ -0,0 +1,2 @@
+export { Calendar, type CalendarProps, type CalendarCustomStyles } from './Calendar';
+export { type CalendarDateRange } from './hooks';

package/dist/src/components/calendar/variants.d.ts

@@ -0,0 +1,41 @@
+export declare const calendarSizeVariants: {
+    readonly small: {
+        readonly container: "text-xs";
+        readonly cell: "w-7 h-7 text-xs";
+        readonly header: "text-sm px-2 py-1";
+        readonly navigation: "p-1";
+        readonly weekdays: "text-xs px-1 py-1";
+    };
+    readonly medium: {
+        readonly container: "text-sm";
+        readonly cell: "w-9 h-9 text-sm";
+        readonly header: "text-base px-3 py-2";
+        readonly navigation: "p-2";
+        readonly weekdays: "text-sm px-2 py-2";
+    };
+    readonly large: {
+        readonly container: "text-base";
+        readonly cell: "w-12 h-12 text-base";
+        readonly header: "text-lg px-4 py-3";
+        readonly navigation: "p-3";
+        readonly weekdays: "text-base px-3 py-2";
+    };
+    readonly auto: {
+        readonly container: "w-full h-full";
+        readonly cell: "flex-1 min-h-[2rem] text-sm";
+        readonly header: "text-base px-3 py-2";
+        readonly navigation: "p-2";
+        readonly weekdays: "text-sm px-2 py-2";
+    };
+};
+export type CalendarSize = keyof typeof calendarSizeVariants;
+export declare const calendarViewVariants: {
+    readonly month: "grid-cols-7";
+    readonly week: "grid-cols-7";
+    readonly day: "grid-cols-1";
+};
+export type CalendarView = keyof typeof calendarViewVariants;
+export declare const calendarDefaults: {
+    readonly size: "small" | "auto" | "medium" | "large";
+    readonly view: "month" | "week" | "day";
+};

package/dist/src/components/callout/Callout.d.ts

@@ -1,23 +1,44 @@
 import React from 'react';
 import { CalloutVariants } from './variants';
 export interface CalloutProps {
-    /**The id of the Callout. */
+    /** The id of the callout element */
     id?: string;
-    /**The ref for the Callout. */
+    /** Reference to the callout element */
     ref?: React.Ref<HTMLDivElement>;
-    /**The variant of the Callout. */
+    /** The visual style variant of the callout */
     variant?: CalloutVariants;
-    /** The icon to display in the top-left corner of the Callout.*/
-    icon?: 'default' | React.ReactElement;
-    /** The title of the Callout. */
+    /** Custom icon to display. Will use default icon if not provided. Pass null to hide the icon */
+    icon?: string | React.ReactElement | null;
+    /** Optional title for the callout */
     title?: React.ReactNode;
-    /** The description of the Callout. */
+    /** The main content to display inside the callout */
     description?: React.ReactNode;
-    /** Additional classes to apply to the Callout. */
+    /** Additional CSS classes to apply to the callout */
     className?: string;
-    /** Whether the Callout can be dismissed. */
+    /** Whether the callout can be dismissed */
     dismissible?: boolean;
-    /** Callback function when the Callout is dismissed. */
+    /** Callback fired when the dismiss button is clicked */
     onDismiss?: () => void;
 }
+/**
+ * A prominent notice component for displaying important information, alerts, or status messages.
+ * Supports different visual variants with appropriate icons and dismissible functionality.
+ *
+ * @example
+ * ```tsx
+ * // Info callout
+ * <Callout variant="info" title="Tip" description="Save your work frequently" />
+ *
+ * // Warning with custom content
+ * <Callout
+ *   variant="warning"
+ *   title="Unsaved Changes"
+ *   description={<>You have <strong>3 unsaved</strong> documents.</>}
+ *   dismissible
+ * />
+ *
+ * // Success notification
+ * <Callout variant="success" description="Profile updated successfully!" />
+ * ```
+ */
 export declare function Callout({ id, ref, variant, icon, title, description, className, dismissible, onDismiss, }: CalloutProps): import("react/jsx-runtime").JSX.Element | null;