asheeui 0.6.15 → 1.0.0

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

@@ -1,10 +1,26 @@
-import { ReactNode } from 'react';
+import { ElementType, ReactNode } from 'react';
 import { ButtonConfig } from './button-config';
 /**
  * Visual and behavioural options shared by button-like elements.
  * This type combines the ButtonConfig with native button HTML attributes.
  */
 type BaseButtonProps = ButtonConfig & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "color" | "disabled">;
+/**
+ * Props for the button's link behaviour.
+ * Holds the instance-only link component and its props.
+ */
+export interface ButtonLinkProps {
+    /**
+     * Custom link component (e.g. `next/link`, TanStack Router `Link`).
+     * When provided, this component is used instead of the native `<a>` tag.
+     */
+    component?: ElementType;
+    /**
+     * Additional props to pass to the link component (e.g. `{ prefetch: true }`).
+     * These take precedence over the button's own props.
+     */
+    props?: Record<string, unknown>;
+}
 /**
  * Configuration options for the Button component.
  *
@@ -49,6 +65,16 @@ export interface ButtonProps extends BaseButtonProps {
      * Typically an icon, badge, or adornment.
      */
     endContent?: ReactNode;
+    /**
+     * Renders the button as a link to this URL.
+     * The root element becomes an `<a>`, or `link.component` when provided.
+     */
+    href?: string;
+    /**
+     * Link configuration for the button.
+     * Provides the custom link component and props forwarded to it.
+     */
+    link?: ButtonLinkProps;
 }
 /**
  * A clickable element that triggers an action or event.
@@ -76,6 +102,8 @@ export interface ButtonProps extends BaseButtonProps {
  * @param props.icon - Icon-only compact layout. Defaults to false.
  * @param props.startContent - Content at the start of the button.
  * @param props.endContent - Content at the end of the button.
+ * @param props.href - Renders the button as a link to this URL.
+ * @param props.link - Link configuration (custom component and props).
  * @param props.children - Button label content.
  * @param props.className - Extra CSS classes for the button.
  *

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

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAWA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAiBpE,OAAO,EAAE,KAAK,YAAY,EAA0B,MAAM,iBAAiB,CAAC;AAK5E;;;GAGG;AACH,KAAK,eAAe,GAAG,YAAY,GACjC,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,CAAC;AAE5E;;;;GAIG;AACH,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IAErC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0EG;AACH,eAAO,MAAM,MAAM,2GAoHlB,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAWA,OAAO,EACL,KAAK,WAAW,EAGhB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAiBf,OAAO,EAAE,KAAK,YAAY,EAA0B,MAAM,iBAAiB,CAAC;AAK5E;;;GAGG;AACH,KAAK,eAAe,GAAG,YAAY,GACjC,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,CAAC;AAE5E;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC;IAExB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACjC;AAED;;;;GAIG;AACH,MAAM,WAAW,WAAY,SAAQ,eAAe;IAClD;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IAErC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4EG;AACH,eAAO,MAAM,MAAM,2GA0IlB,CAAC"}

package/dist/components/button/Button.js

@@ -1,109 +1,51 @@
 "use client";
-import { jsxs as j, jsx as u } from "react/jsx-runtime";
-import { forwardRef as F } from "react";
-import { useAsheeConfig as V } from "../../libs/context.js";
-import { resolveCascade as r, resolveRadiusKey as k, resolveClassKey as w } from "../../utils/resolve-token.js";
-import { Spinner as E } from "../spinner/spinner.js";
-import { FALLBACK_BUTTON_CONFIG as s } from "./button-config.js";
-import { BUTTON_ICON_SIZE_CLASS as Z, BUTTON_SIZE_CLASS as G } from "./button-styles.js";
-import { cn as q } from "../../utils/cn.js";
-import { UnderlineRadius as c, RADIUS_CLASS as H } from "../../shared/radius.js";
-import { resolveVariantClass as J } from "../../shared/variant.js";
-const M = F(
-  (f, v) => {
-    var d;
-    const {
-      variant: p,
-      color: b,
-      size: y,
-      radius: h,
-      animate: N,
-      fullWidth: S,
-      isDisabled: A,
-      isLoading: a,
-      icon: _,
-      className: L,
-      children: B,
-      type: C = "button",
-      onClick: i,
-      startContent: I,
-      endContent: K,
-      ...R
-    } = f, t = V(), e = (d = t.components) == null ? void 0 : d.button, o = r(
-      p,
-      e == null ? void 0 : e.variant,
-      t.defaultVariant,
-      s.variant
-    ), T = r(
-      b,
-      e == null ? void 0 : e.color,
-      t.defaultColor,
-      s.color
-    ), n = r(
-      y,
-      e == null ? void 0 : e.size,
-      void 0,
-      s.size
-    ), z = k(
-      h,
-      e == null ? void 0 : e.radius,
-      t.defaultRadius,
-      s.radius
-    ), O = r(
-      N,
-      e == null ? void 0 : e.animate,
-      s.animate,
-      s.animate
-    ), U = r(
-      S,
-      e == null ? void 0 : e.fullWidth,
-      void 0,
-      s.fullWidth
-    ), x = _ ? Z[n] : G[n], l = A || a, D = (m) => {
-      if (l) {
-        m.preventDefault();
-        return;
-      }
-      i == null || i(m);
-    }, W = q(
-      "inline-flex items-center justify-center font-medium transition-colors select-none shrink-0",
-      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2",
-      "disabled:pointer-events-none disabled:opacity-50",
-      "aria-disabled:pointer-events-none aria-disabled:opacity-50",
-      U && "w-full",
-      O && "motion-safe:transition-transform motion-safe:duration-100 motion-safe:active:scale-[0.99]",
-      J(o, T),
-      x,
-      w(
-        c(o, z),
-        H,
-        c(o, s.radius)
-      ),
-      L
-    );
-    return /* @__PURE__ */ j(
-      "button",
-      {
-        ref: v,
-        type: C,
-        disabled: l,
-        "aria-disabled": l,
-        "aria-busy": a,
-        onClick: D,
-        className: W,
-        ...R,
-        children: [
-          a && /* @__PURE__ */ u(E, { className: n }),
-          a && /* @__PURE__ */ u("span", { className: "sr-only", children: "Loading" }),
-          !a && I,
-          !a && B,
-          !a && K
-        ]
-      }
-    );
-  }
-);
-M.displayName = "Button";
-export {
-  M as Button
-};
+"use client";
+import { cn as e } from "../../utils/cn.js";
+import { RADIUS_CLASS as t, UnderlineRadius as n } from "../../shared/radius.js";
+import { resolveVariantClass as r } from "../../shared/variant.js";
+import { useAsheeConfig as i } from "../../libs/context.js";
+import { resolveCascade as a, resolveClassKey as o, resolveRadiusKey as s } from "../../utils/resolve-token.js";
+import { Spinner as c } from "../spinner/spinner.js";
+import { FALLBACK_BUTTON_CONFIG as l } from "./button-config.js";
+import { BUTTON_ICON_SIZE_CLASS as u, BUTTON_SIZE_CLASS as d } from "./button-styles.js";
+import { forwardRef as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/components/button/Button.tsx
+var h = f((f, h) => {
+	let { variant: g, color: _, size: v, radius: y, animate: b, fullWidth: x, isDisabled: S, isLoading: C, icon: w, className: T, children: E, type: D = "button", onClick: O, startContent: k, endContent: A, href: j, link: M, ...N } = f, P = i(), F = P.components?.button, I = a(g, F?.variant, P.defaultVariant, l.variant), L = a(_, F?.color, P.defaultColor, l.color), R = a(v, F?.size, void 0, l.size), z = s(y, F?.radius, P.defaultRadius, l.radius), B = a(b, F?.animate, l.animate, l.animate), V = a(x, F?.fullWidth, void 0, l.fullWidth), H = w ? u[R] : d[R], U = S || C, W = !!(j || M), G = M?.component ?? (W ? "a" : "button"), { onClick: K, ...q } = M?.props ?? {}, J = (e) => {
+		if (U) {
+			e.preventDefault();
+			return;
+		}
+		O?.(e), K?.(e);
+	}, Y = e("inline-flex items-center justify-center font-medium transition-colors select-none shrink-0", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2", "disabled:pointer-events-none disabled:opacity-50", "aria-disabled:pointer-events-none aria-disabled:opacity-50", V && "w-full", B && "motion-safe:transition-transform motion-safe:duration-100 motion-safe:active:scale-[0.99]", r(I, L), H, o(n(I, z), t, n(I, l.radius)), T);
+	return /* @__PURE__ */ m(G, {
+		ref: h,
+		...W ? { href: j } : {
+			type: D,
+			disabled: U
+		},
+		"aria-disabled": U,
+		"aria-busy": C,
+		onClick: J,
+		className: Y,
+		...N,
+		...q,
+		children: [
+			C && /* @__PURE__ */ p(c, { className: R }),
+			C && /* @__PURE__ */ p("span", {
+				className: "sr-only",
+				children: "Loading "
+			}),
+			C ? /* @__PURE__ */ p("span", {
+				className: "sr-only",
+				children: E
+			}) : E,
+			!C && k,
+			!C && A
+		]
+	});
+});
+h.displayName = "Button";
+//#endregion
+export { h as Button };

package/dist/components/button/button-config.js

@@ -1,20 +1,19 @@
 "use client";
-import { registerComponentDefaults as t } from "../../libs/registry.js";
-const e = {
-  size: "md",
-  animate: !0,
-  fullWidth: !1
+import { registerComponentDefaults as e } from "../../libs/registry.js";
+//#region src/components/button/button-config.ts
+var t = {
+	size: "md",
+	animate: !0,
+	fullWidth: !1
 };
-t("button", e);
-const i = {
-  size: "md",
-  variant: "bordered",
-  color: "primary",
-  radius: "md",
-  animate: !0,
-  fullWidth: !1
-};
-export {
-  i as FALLBACK_BUTTON_CONFIG,
-  e as defaultButtonConfig
+e("button", t);
+var n = {
+	size: "md",
+	variant: "bordered",
+	color: "primary",
+	radius: "md",
+	animate: !0,
+	fullWidth: !1
 };
+//#endregion
+export { n as FALLBACK_BUTTON_CONFIG, t as defaultButtonConfig };

package/dist/components/button/button-styles.js

@@ -1,14 +1,13 @@
 "use client";
-const s = {
-  sm: "h-8 px-3 text-xs gap-1.5",
-  md: "h-9 px-3.5 text-xs sm:h-10 sm:px-4 sm:text-sm gap-2",
-  lg: "h-11 px-5 text-sm sm:h-12 sm:px-6 sm:text-base gap-2.5"
+//#region src/components/button/button-styles.ts
+var e = {
+	sm: "h-8 px-3 text-xs gap-1.5",
+	md: "h-9 px-3.5 text-xs sm:h-10 sm:px-4 sm:text-sm gap-2",
+	lg: "h-11 px-5 text-sm sm:h-12 sm:px-6 sm:text-base gap-2.5"
 }, t = {
-  sm: "size-8 p-0 text-xs gap-0",
-  md: "size-9 sm:size-10 p-0 text-xs sm:text-sm gap-0",
-  lg: "size-11 sm:size-12 p-0 text-sm sm:text-base gap-0"
-};
-export {
-  t as BUTTON_ICON_SIZE_CLASS,
-  s as BUTTON_SIZE_CLASS
+	sm: "size-8 p-0 text-xs gap-0",
+	md: "size-9 sm:size-10 p-0 text-xs sm:text-sm gap-0",
+	lg: "size-11 sm:size-12 p-0 text-sm sm:text-base gap-0"
 };
+//#endregion
+export { t as BUTTON_ICON_SIZE_CLASS, e as BUTTON_SIZE_CLASS };

package/dist/components/{date-picker/DatePicker.d.ts → calendar/Calendar.d.ts}

@@ -1,26 +1,26 @@
 import { InputProps } from '../input/Input';
-import { DatePickerConfig, PickerConfig } from './date-picker-config';
+import { CalendarConfig, CalendarPickerConfig } from './calendar-config';
 /**
- * Picker menu configuration that extends PickerConfig with className.
- * Used for styling the calendar popover.
+ * Props for the picker (calendar popover).
+ * Extends CalendarPickerConfig with instance-only props.
  */
-export interface PickerMenu extends PickerConfig {
+export interface CalendarPickerProps extends CalendarPickerConfig {
     /**
      * Extra CSS classes for the calendar popover.
      */
     className?: string;
 }
 /**
- * Base DatePicker props excluding the picker configuration.
- * Combines DatePickerConfig (minus picker) with InputProps (minus value-related props).
+ * Base Calendar props excluding the picker configuration.
+ * Combines CalendarConfig (minus picker) with InputProps (minus value-related props).
  */
-export type BaseDatePickerProps = Omit<DatePickerConfig, "picker"> & Omit<InputProps, "onChange" | "value" | "defaultValue" | "endContent" | "startContent">;
+export type BaseCalendarProps = Omit<CalendarConfig, "picker"> & Omit<InputProps, "onChange" | "value" | "defaultValue" | "endContent" | "startContent">;
 /**
- * Configuration options for the DatePicker component.
+ * Configuration options for the Calendar component.
  * Extends InputProps but omits value-related props that are replaced
  * with date-specific equivalents.
  */
-export interface DatePickerProps extends BaseDatePickerProps {
+export interface CalendarProps extends BaseCalendarProps {
     /**
      * The currently selected date.
      * Pass null for no selection.
@@ -35,7 +35,7 @@ export interface DatePickerProps extends BaseDatePickerProps {
      * Picker configuration overrides including portal, portalTarget, and className.
      * All picker-related props should be passed through this object.
      */
-    picker?: PickerMenu;
+    picker?: CalendarPickerProps;
     /**
      * Whether a clear button is shown in the input.
      * When true, a clear button appears when a date is selected.
@@ -54,7 +54,7 @@ export interface DatePickerProps extends BaseDatePickerProps {
 /**
  * A date/time picker component with calendar popover and time selection.
  *
- * DatePicker renders an input field with a calendar popover that allows
+ * Calendar renders an input field with a calendar popover that allows
  * selecting dates and/or times. It supports date, time, and datetime modes,
  * clearable selection, and future date restrictions. The component integrates
  * with Floating UI for popover positioning and follows the standard AsheeUI
@@ -64,10 +64,10 @@ export interface DatePickerProps extends BaseDatePickerProps {
  * render at the document body level. This ensures the popover escapes CSS
  * containment, overflow clipping, and stacking context issues. The portal
  * can be disabled via the `picker.portal` prop or
- * `components.datePicker.picker.portal` in the config if the popover needs
+ * `components.calendar.picker.portal` in the config if the popover needs
  * to stay within a specific parent container.
  *
- * @param props - DatePicker configuration options.
+ * @param props - Calendar configuration options.
  * @param props.selected - Currently selected date or null.
  * @param props.onChange - Callback fired when the date changes.
  * @param props.mode - Selection mode: "date", "time", or "datetime". Defaults to "date".
@@ -89,17 +89,17 @@ export interface DatePickerProps extends BaseDatePickerProps {
  *
  * @example
  * ```tsx
- * import { DatePicker } from "asheeui";
+ * import { Calendar } from "asheeui";
  * import { useState } from "react";
  *
  * export function Example() {
  *   const [selected, setSelected] = useState<Date | null>(null);
  *
  *   return (
- *     <DatePicker
+ *     <Calendar
  *       selected={selected}
  *       onChange={setSelected}
- *       label="Select Date"
+ *       label="Dropmenu Date"
  *       isClearable
  *     />
  *   );
@@ -109,9 +109,9 @@ export interface DatePickerProps extends BaseDatePickerProps {
  * @example
  * ```tsx
  * // With datetime mode and custom picker configuration
- * <DatePicker
+ * <Calendar
  *   mode="datetime"
- *   label="Select Date and Time"
+ *   label="Dropmenu Date and Time"
  *   isClearable
  *   picker={{
  *     className: "custom-calendar",
@@ -120,9 +120,9 @@ export interface DatePickerProps extends BaseDatePickerProps {
  * />
  * ```
  *
- * @see DatePickerConfig - The configuration type for component defaults.
+ * @see CalendarConfig - The configuration type for component defaults.
  * @see Input - The underlying input component.
- * @see Calendar - The calendar popover component.
+ * @see DateGrid - The calendar popover component.
  */
-export declare const DatePicker: import('react').ForwardRefExoticComponent<DatePickerProps & import('react').RefAttributes<HTMLInputElement>>;
-//# sourceMappingURL=DatePicker.d.ts.map
+export declare const Calendar: import('react').ForwardRefExoticComponent<CalendarProps & import('react').RefAttributes<HTMLInputElement>>;
+//# sourceMappingURL=Calendar.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../../src/components/calendar/Calendar.tsx"],"names":[],"mappings":"AA+BA,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,gBAAgB,CAAC;AASxD,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,oBAAoB,EAE1B,MAAM,mBAAmB,CAAC;AAE3B;;;GAGG;AACH,MAAM,WAAW,mBAAoB,SAAQ,oBAAoB;IAC/D;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,cAAc,EAAE,QAAQ,CAAC,GAC5D,IAAI,CACF,UAAU,EACV,UAAU,GAAG,OAAO,GAAG,cAAc,GAAG,YAAY,GAAG,cAAc,CACtE,CAAC;AAEJ;;;;GAIG;AACH,MAAM,WAAW,aAAc,SAAQ,iBAAiB;IACtD;;;OAGG;IACH,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAEvB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IAEvC;;;OAGG;IACH,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAE7B;;;;;OAKG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwEG;AACH,eAAO,MAAM,QAAQ,4GA+VpB,CAAC"}

package/dist/components/calendar/Calendar.js

@@ -0,0 +1,123 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.js";
+import { ASHEE_LAYER as t } from "../../utils/stacking.js";
+import { RADIUS_CLASS as n } from "../../shared/radius.js";
+import { useAsheeConfig as r } from "../../libs/context.js";
+import { resolveCascade as i, resolveClassKey as a, resolveRadiusKey as o } from "../../utils/resolve-token.js";
+import { Input as s } from "../input/Input.js";
+import { FALLBACK_MENU_CONFIG as c } from "../menu/menu-config.js";
+import { useMenuFloating as l } from "../menu/use-menu-floating.js";
+import { CalendarIcon as u } from "../../icons/CalendarIcon.js";
+import { ClearIcon as d } from "../../icons/ClearIcon.js";
+import { ClockIcon as ee } from "../../icons/ClockIcon.js";
+import { formatDisplay as f, getDefaultPlaceholder as p, getNewCursorPosition as m, parseDateString as h } from "./calendar.helpers.js";
+import { DateGrid as g } from "./DateGrid.js";
+import { FALLBACK_DATE_PICKER_CONFIG as _ } from "./calendar-config.js";
+import { forwardRef as v, useCallback as y, useEffect as b, useId as x, useRef as S, useState as C } from "react";
+import { Fragment as te, jsx as w, jsxs as T } from "react/jsx-runtime";
+import { FloatingFocusManager as E, FloatingPortal as D } from "@floating-ui/react";
+//#region src/components/calendar/Calendar.tsx
+var O = v(({ selected: v, onChange: O, mode: k, isClearable: A = !1, disableFuture: j = !1, placeholder: ne, size: M, radius: N, color: P, disabled: F, picker: I, ...L }, R) => {
+	let z = r(), B = z.components?.calendar, V = x(), H = L.id ?? V, [U, W] = C(!1), [G, K] = C(""), q = S(null), J = i(k, B?.mode, void 0, _.mode), Y = i(I?.portal, B?.picker?.portal, void 0, c.portal), re = i(I?.portalTarget, B?.picker?.portalTarget, void 0, null), X = i(I?.lockScroll, B?.picker?.lockScroll, void 0, !0), ie = i(M, B?.size, void 0, _.size), ae = i(P, B?.color, z.defaultColor, _.color), Z = o(typeof N == "string" ? N : void 0, typeof B?.radius == "string" ? B.radius : void 0, z.defaultRadius, _.radius), oe = a(Z === "full" ? "xl" : Z, n, _.radius), { refs: Q, context: se, floatingStyles: ce, isPositioned: le, getReferenceProps: ue, getFloatingProps: de } = l({
+		isOpen: U,
+		onOpenChange: W,
+		disabled: F,
+		matchReferenceWidth: !1,
+		role: "dialog",
+		zIndex: t.popover
+	});
+	b(() => {
+		if (!U || !X) return;
+		let e = window.scrollY, t = document.body.style.position, n = document.body.style.top, r = document.body.style.left, i = document.body.style.right, a = document.body.style.width, o = document.body.style.overflow;
+		return document.body.style.position = "fixed", document.body.style.top = `-${e}px`, document.body.style.left = "0", document.body.style.right = "0", document.body.style.width = "100%", document.body.style.overflow = "hidden", () => {
+			document.body.style.position = t, document.body.style.top = n, document.body.style.left = r, document.body.style.right = i, document.body.style.width = a, document.body.style.overflow = o, window.scrollTo(0, e);
+		};
+	}, [U, X]), b(() => {
+		K(v ? f(v, J) : "");
+	}, [v, J]);
+	let fe = y((e) => {
+		O?.(e), K(e ? f(e, J) : ""), (J === "date" || e === null) && W(!1);
+	}, [O, J]), pe = y(() => W(!1), []), me = y((e) => {
+		e.stopPropagation(), O?.(null), K(""), W(!1), q.current?.focus();
+	}, [O]), he = y((e) => {
+		let t = e.target, n = t.value, r = G, i = t.selectionStart ?? 0, a = n.replace(/\D/g, "");
+		if (a.length === 0) {
+			K(""), O?.(null);
+			return;
+		}
+		let o = h(a, J, v ?? void 0);
+		if (o) {
+			O?.(o);
+			let e = f(o, J);
+			K(e);
+			let n = m(r, e, i);
+			requestAnimationFrame(() => {
+				t.setSelectionRange(n, n);
+			});
+		} else K(v ? f(v, J) : "");
+	}, [
+		J,
+		v,
+		O,
+		G
+	]), ge = ne ?? p(J), _e = /* @__PURE__ */ T(te, { children: [A && v && !F && /* @__PURE__ */ w("button", {
+		type: "button",
+		onClick: me,
+		"aria-label": "Clear selection",
+		className: "p-0.5 rounded text-foreground/70 hover:text-foreground transition-colors",
+		children: /* @__PURE__ */ w(d, { className: "size-3.5" })
+	}), /* @__PURE__ */ w("span", {
+		className: "text-foreground/70 pointer-events-none",
+		children: w(J === "time" ? ee : u, {})
+	})] }), $ = U ? /* @__PURE__ */ w(E, {
+		context: se,
+		modal: !1,
+		initialFocus: -1,
+		returnFocus: !1,
+		children: /* @__PURE__ */ w("div", {
+			ref: Q.setFloating,
+			style: { ...ce },
+			className: e("outline-none w-max", "transition-none", le ? "animate-in fade-in-0 zoom-in-95 duration-150 ease-out" : "invisible opacity-0 pointer-events-none", I?.className),
+			...de(),
+			children: /* @__PURE__ */ w(g, {
+				selected: v,
+				mode: J,
+				isClearable: A,
+				resolvedSizeKey: ie,
+				onSelect: fe,
+				onClose: pe,
+				disableFuture: j,
+				resolvedColor: ae,
+				radiusClass: oe
+			})
+		})
+	}) : null, ve = re ?? (typeof document < "u" ? document.body : null), ye = y((e) => {
+		e && (Q.setReference(e), q.current = e, typeof R == "function" ? R(e) : R && (R.current = e));
+	}, [Q, R]);
+	return /* @__PURE__ */ T("div", {
+		className: "w-full relative inline-block",
+		children: [/* @__PURE__ */ w(s, {
+			...L,
+			ref: ye,
+			id: H,
+			size: M,
+			radius: N,
+			color: P,
+			placeholder: ge,
+			value: G,
+			onChange: he,
+			endContent: _e,
+			disabled: F,
+			"aria-expanded": U,
+			"aria-haspopup": "dialog",
+			...ue()
+		}), U && (Y ? /* @__PURE__ */ w(D, {
+			root: ve,
+			children: $
+		}) : $)]
+	});
+});
+O.displayName = "Calendar";
+//#endregion
+export { O as Calendar };

package/dist/components/{date-picker/Calendar.d.ts → calendar/DateGrid.d.ts}

@@ -1,7 +1,7 @@
 import { Color } from '../../shared';
 import { FieldSizeKey } from '../field/field-config';
-import { PickerMode } from './date-picker-config';
-interface CalendarProps {
+import { CalendarMode } from './calendar-config';
+interface DateGridProps {
     /**
      * The currently selected date.
      * Used to highlight the selected day and initialize time values.
@@ -11,7 +11,7 @@ interface CalendarProps {
      * Selection mode of the picker.
      * Controls whether the calendar, time spinners, or both are shown.
      */
-    mode: PickerMode;
+    mode: CalendarMode;
     /**
      * Whether a clear button is shown in the footer.
      */
@@ -50,13 +50,13 @@ interface CalendarProps {
     disableFuture?: boolean;
 }
 /**
- * Calendar popover component with month navigation and date selection.
+ * DateGrid popover component with month navigation and date selection.
  *
- * Memoized so parent-driven renders (the DatePicker popover's one-time
+ * Memoized so parent-driven renders (the Calendar popover's one-time
  * `isPositioned` flip, input typing, open/close) do not rebuild the month
  * grid. Every prop is a primitive or a stable callback, so React.memo can
  * skip those renders.
  */
-export declare const Calendar: import('react').NamedExoticComponent<CalendarProps>;
+export declare const DateGrid: import('react').MemoExoticComponent<({ selected, mode, isClearable, resolvedSizeKey, resolvedColor, radiusClass, onSelect, onClose, disableFuture, }: DateGridProps) => import("react").JSX.Element>;
 export {};
-//# sourceMappingURL=Calendar.d.ts.map
+//# sourceMappingURL=DateGrid.d.ts.map

package/dist/components/calendar/DateGrid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateGrid.d.ts","sourceRoot":"","sources":["../../../src/components/calendar/DateGrid.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAKH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAStD,UAAU,aAAa;IACrB;;;OAGG;IACH,QAAQ,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;IAClC;;;OAGG;IACH,IAAI,EAAE,YAAY,CAAC;IACnB;;OAEG;IACH,WAAW,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,eAAe,EAAE,YAAY,CAAC;IAC9B;;;OAGG;IACH,aAAa,EAAE,KAAK,CAAC;IACrB;;;OAGG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACtC;;;OAGG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,QAAQ,wJAUlB,aAAa,iCA4Yd,CAAC"}