@dmsi/wedgekit-react 0.0.2

package/dist/components/CalendarRange.cjs

@@ -0,0 +1,520 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/CalendarRange.tsx
+var CalendarRange_exports = {};
+__export(CalendarRange_exports, {
+  CalendarRange: () => CalendarRange,
+  default: () => CalendarRange_default,
+  isWeekend: () => isWeekend
+});
+module.exports = __toCommonJS(CalendarRange_exports);
+var import_clsx3 = __toESM(require("clsx"), 1);
+
+// src/classNames.ts
+var import_clsx = __toESM(require("clsx"), 1);
+var typography = {
+  display1: (0, import_clsx.default)(
+    "font-sans font-semibold",
+    "text-display-1-mobile desktop:text-display-1-desktop compact:text-display-1-desktop-compact",
+    "leading-display-1-mobile desktop:leading-display-1-desktop"
+  ),
+  display2: (0, import_clsx.default)(
+    "font-sans font-bold",
+    "text-display-2-mobile desktop:text-display-2-desktop compact:text-display-2-desktop-compact",
+    "leading-display-2-mobile desktop:leading-display-2-desktop"
+  ),
+  heading1: (0, import_clsx.default)(
+    "font-sans font-semibold",
+    "text-heading-1-mobile desktop:text-heading-1-desktop compact:text-heading-1-desktop-compact",
+    "leading-heading-1-mobile desktop:leading-heading-1-desktop"
+  ),
+  heading2: (0, import_clsx.default)(
+    "font-sans font-normal",
+    "text-heading-2-mobile desktop:text-heading-2-desktop compact:text-heading-2-desktop-compact",
+    "leading-heading-2-mobile desktop:leading-heading-2-desktop"
+  ),
+  heading3: (0, import_clsx.default)(
+    "font-sans font-semibold",
+    "text-heading-3-mobile desktop:text-heading-3-desktop compact:text-heading-3-desktop-compact",
+    "leading-heading-3-mobile desktop:leading-heading-3-desktop"
+  ),
+  subheader: (0, import_clsx.default)(
+    "font-sans font-semibold",
+    "text-subheader-mobile desktop:text-subheader-desktop compact:text-subheader-desktop-compact",
+    "leading-subheader-mobile desktop:leading-subheader-desktop"
+  ),
+  link: (0, import_clsx.default)(
+    "font-sans font-normal",
+    "text-link-mobile desktop:text-link-desktop compact:text-link-desktop-compact",
+    "leading-link-mobile desktop:leading-link-desktop"
+  ),
+  buttonLabel: (0, import_clsx.default)(
+    "font-sans font-semibold",
+    "text-label-mobile desktop:text-label-desktop compact:text-label-desktop-compact",
+    "leading-label-mobile desktop:leading-label-desktop"
+  ),
+  label: (0, import_clsx.default)(
+    "font-sans font-semibold",
+    "text-label-mobile desktop:text-label-desktop compact:text-label-desktop-compact",
+    "leading-label-mobile desktop:leading-label-desktop"
+  ),
+  paragraph: (0, import_clsx.default)(
+    "font-sans font-normal",
+    "text-paragraph-mobile desktop:text-paragraph-desktop compact:text-paragraph-desktop-compact",
+    "leading-paragraph-mobile desktop:leading-paragraph-desktop"
+  ),
+  caption: (0, import_clsx.default)(
+    "font-sans font-normal",
+    "text-caption-mobile desktop:text-caption-desktop compact:text-caption-desktop-compact",
+    "leading-caption-mobile desktop:leading-caption-desktop"
+  )
+};
+var baseTransition = (0, import_clsx.default)(
+  "transition-colors duration-100 ease-in-out"
+);
+var componentGap = (0, import_clsx.default)(
+  "gap-mobile-component-gap desktop:gap-desktop-component-gap compact:gap-desktop-compact-component-gap"
+);
+var paddingUsingComponentGap = (0, import_clsx.default)(
+  "p-mobile-component-gap desktop:p-desktop-component-gap compact:p-desktop-compact-component-gap"
+);
+var paddingYUsingLayoutGroupGap = (0, import_clsx.default)(
+  "py-mobile-layout-group-gap desktop:py-desktop-layout-group-gap compact:py-desktop-compact-layout-group-gap"
+);
+var componentPadding = (0, import_clsx.default)(
+  "p-mobile-component-padding desktop:p-desktop-component-padding compact:p-desktop-compact-component-padding"
+);
+var componentPaddingBottom = (0, import_clsx.default)(
+  "pb-mobile-component-padding desktop:pb-desktop-component-padding compact:pb-desktop-compact-component-padding"
+);
+var componentPaddingY = (0, import_clsx.default)(
+  "py-mobile-component-padding desktop:py-desktop-component-padding compact:py-desktop-compact-component-padding"
+);
+var componentPaddingXUsingComponentGap = (0, import_clsx.default)(
+  "px-mobile-component-gap desktop:px-desktop-component-gap compact:px-desktop-compact-component-gap"
+);
+var componentPaddingYUsingComponentGap = (0, import_clsx.default)(
+  "py-mobile-component-gap desktop:py-desktop-component-gap compact:py-desktop-compact-component-gap"
+);
+var componentPaddingMinusBorder = (0, import_clsx.default)(
+  "p-[calc(var(--spacing-mobile-component-padding)_-_1px)] desktop:p-[calc(var(--spacing-desktop-component-padding)_-_1px)] compact:p-[calc(var(--spacing-desktop-compact-component-padding)_-_1px)]"
+);
+var componentPaddingMinus2pxBorder = (0, import_clsx.default)(
+  "p-[calc(var(--spacing-mobile-component-padding)_-_2px)] desktop:p-[calc(var(--spacing-desktop-component-padding)_-_2px)] compact:p-[calc(var(--spacing-desktop-compact-component-padding)_-_2px)]"
+);
+var layoutPaddingBottom = (0, import_clsx.default)(
+  "pb-mobile-layout-padding desktop:pb-desktop-layout-padding compact:pb-desktop-compact-layout-padding"
+);
+var layoutPaddingY = (0, import_clsx.default)(
+  "py-mobile-layout-padding desktop:py-desktop-layout-padding compact:py-desktop-compact-layout-padding"
+);
+var containerPaddingX = (0, import_clsx.default)(
+  "px-mobile-container-padding desktop:px-desktop-container-padding compact:px-desktop-compact-container-padding"
+);
+var containerPaddingY = (0, import_clsx.default)(
+  "py-mobile-container-padding desktop:py-desktop-container-padding compact:py-desktop-compact-container-padding"
+);
+var layoutGroupGapPaddingY = (0, import_clsx.default)(
+  "py-mobile-layout-group-gap desktop:py-desktop-layout-group-gap compact:py-desktop-compact-layout-group-gap"
+);
+var layoutGroupGap = (0, import_clsx.default)(
+  "gap-mobile-layout-group-gap desktop:gap-desktop-layout-group-gap compact:gap-desktop-compact-layout-group-gap"
+);
+var layoutGap = (0, import_clsx.default)(
+  "gap-mobile-layout-gap desktop:gap-desktop-layout-gap compact:gap-desktop-compact-layout-gap"
+);
+var gapUsingContainerPadding = (0, import_clsx.default)(
+  "gap-mobile-container-padding desktop:gap-desktop-container-padding compact:gap-desktop-compact-container-padding"
+);
+
+// src/components/Icon.tsx
+var import_clsx2 = __toESM(require("clsx"), 1);
+var import_jsx_runtime = require("react/jsx-runtime");
+function Icon(_a) {
+  var _b = _a, {
+    name,
+    size = 24,
+    variant = "outline"
+  } = _b, props = __objRest(_b, [
+    "name",
+    "size",
+    "variant"
+  ]);
+  const variantStyle = variant === "filled" ? '"FILL" 1' : '"FILL" 0';
+  const weightStyle = size === 16 ? '"wght" 400' : '"wght" 300';
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "span",
+    __spreadProps(__spreadValues({}, props), {
+      className: (0, import_clsx2.default)(
+        "icon",
+        `icon-${size}`,
+        // size === 16 ? "font-normal" : "font-light", // size 16 font weight is not working as normal from before
+        props.className
+      ),
+      style: __spreadValues({
+        fontVariationSettings: variantStyle + `, ${weightStyle}`
+      }, props.style),
+      children: name
+    })
+  );
+}
+
+// src/components/CalendarRange.tsx
+var import_react = __toESM(require("react"), 1);
+var import_polyfill = require("@js-temporal/polyfill");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function isWeekend(date) {
+  return date.dayOfWeek === 6 || date.dayOfWeek === 7;
+}
+function DateCell(_a) {
+  var _b = _a, {
+    date,
+    isInMonth,
+    isToday,
+    isSelected,
+    inRange,
+    isDisabled,
+    isRangeStart,
+    isRangeEnd,
+    onClick,
+    onMouseEnter,
+    onMouseLeave,
+    cellPadding = "",
+    isRangeDisabled = false
+  } = _b, props = __objRest(_b, [
+    "date",
+    "isInMonth",
+    "isToday",
+    "isSelected",
+    "inRange",
+    "isDisabled",
+    "isRangeStart",
+    "isRangeEnd",
+    "onClick",
+    "onMouseEnter",
+    "onMouseLeave",
+    "cellPadding",
+    "isRangeDisabled"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "span",
+    __spreadProps(__spreadValues({}, props), {
+      className: (0, import_clsx3.default)(
+        "flex items-center justify-center aspect-square select-none transition-colors border duration-100 font-medium",
+        typography.caption,
+        cellPadding,
+        !isToday && !isSelected && !inRange && !isDisabled && !isRangeStart && !isRangeEnd && "border-transparent",
+        !isInMonth && "border-transparent",
+        // Today: subtle border ring
+        isToday && !isSelected && !inRange && "rounded-full border-border-primary-normal ",
+        // Selected: Figma blue, white text, strong shadow
+        isSelected && "bg-action-400 text-white border-action-400 z-10",
+        !isSelected && !inRange && "rounded-base",
+        // When range is disabled OR when only 'from' is selected (no range yet), apply rounded corners
+        (isRangeDisabled || !inRange && isSelected) && "rounded-base",
+        inRange && isSelected && "hover:border-action-500",
+        // In range: Figma light blue background
+        inRange && !isSelected && "bg-action-100 text-text-primary-normal border-y-action-400 border-x-0  ",
+        // Disabled: Figma gray, no pointer, no hover
+        isDisabled && !inRange ? "text-text-primary-disabled bg-transparent pointer-events-none opacity-40 border-transparent" : [
+          "text-text-primary-normal cursor-pointer",
+          // Figma hover: blue bg, blue text (or red text if selected)
+          isSelected ? "hover:bg-background-action-primary-hover hover:text-white" : "hover:bg-action-100 hover:text-text-action-primary-hover",
+          // Figma active: darker blue bg, white text
+          "active:bg-action-300 active:text-white",
+          // Figma focus: ring
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-action-400"
+        ],
+        isRangeStart && "rounded-l",
+        isRangeEnd && "rounded-r"
+      ),
+      tabIndex: isDisabled ? -1 : 0,
+      "aria-disabled": isDisabled,
+      onClick: () => !isDisabled && isInMonth && onClick(),
+      onMouseEnter: () => isInMonth && onMouseEnter(),
+      onMouseLeave: () => isInMonth && onMouseLeave(),
+      children: isInMonth ? date.day : ""
+    })
+  );
+}
+function CalendarRange({
+  from,
+  to,
+  onChange,
+  isDateAvailable,
+  mode = "double",
+  cardStyle = false,
+  disableRange = false
+}) {
+  const weekDays = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
+  const parseDate = (d) => {
+    if (!d) return void 0;
+    if (typeof d === "number")
+      return import_polyfill.Temporal.PlainDate.from(new Date(d).toISOString().slice(0, 10));
+    if (typeof d === "string") return import_polyfill.Temporal.PlainDate.from(d);
+    return void 0;
+  };
+  const fromDate = parseDate(from);
+  const toDate = parseDate(to);
+  const today = import_polyfill.Temporal.Now.plainDateISO();
+  const [baseMonth, setBaseMonth] = (0, import_react.useState)(
+    fromDate != null ? fromDate : today.with({ day: 1 })
+  );
+  const [selecting, setSelecting] = (0, import_react.useState)("from");
+  const [pendingFrom, setPendingFrom] = (0, import_react.useState)(void 0);
+  const [hoveredDate, setHoveredDate] = (0, import_react.useState)(void 0);
+  function getMonthData(monthOffset) {
+    const monthDate = baseMonth.add({ months: monthOffset }).with({ day: 1 });
+    const days = monthDate.daysInMonth;
+    const firstDayOffset = monthDate.dayOfWeek % 7;
+    return {
+      name: monthDate.toLocaleString("en-US", { month: "long" }),
+      year: monthDate.year,
+      days,
+      firstDayOffset,
+      date: monthDate
+    };
+  }
+  function handleDayClick(date) {
+    if (isDateAvailable && !isDateAvailable(date)) return;
+    if (mode === "single" && disableRange) {
+      if (onChange) {
+        onChange(date.toString(), date.toString());
+      }
+      return;
+    }
+    if (selecting === "from") {
+      setPendingFrom(date);
+      setSelecting("to");
+      setHoveredDate(void 0);
+    } else if (pendingFrom) {
+      if (onChange) {
+        const [start, end] = import_polyfill.Temporal.PlainDate.compare(date, pendingFrom) < 0 ? [date, pendingFrom] : [pendingFrom, date];
+        onChange(start.toString(), end.toString());
+      }
+      setPendingFrom(void 0);
+      setSelecting("from");
+      setHoveredDate(void 0);
+    }
+  }
+  function isInRange(date) {
+    if (mode === "single" && disableRange) {
+      return false;
+    }
+    if (pendingFrom && selecting === "to" && hoveredDate) {
+      const [start, end] = import_polyfill.Temporal.PlainDate.compare(hoveredDate, pendingFrom) < 0 ? [hoveredDate, pendingFrom] : [pendingFrom, hoveredDate];
+      return import_polyfill.Temporal.PlainDate.compare(date, start) >= 0 && import_polyfill.Temporal.PlainDate.compare(date, end) <= 0;
+    }
+    if (!pendingFrom && fromDate && toDate) {
+      return import_polyfill.Temporal.PlainDate.compare(date, fromDate) >= 0 && import_polyfill.Temporal.PlainDate.compare(date, toDate) <= 0;
+    }
+    return false;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "div",
+    {
+      className: (0, import_clsx3.default)(
+        "relative bg-background-grouped-primary-normal rounded-base w-fit",
+        componentPadding,
+        componentGap,
+        cardStyle && "shadow-4",
+        // baseTransition,
+        "overflow-hidden"
+      ),
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+        "div",
+        {
+          className: (0, import_clsx3.default)(
+            "flex flex-row items-start justify-start bg-background-primary-normal overflow-clip",
+            componentGap,
+            paddingUsingComponentGap
+          ),
+          children: (mode === "double" ? [0, 1] : [0]).map((offset, idx) => {
+            const month = getMonthData(offset);
+            const totalCells = 42;
+            const emptyCells = month.firstDayOffset;
+            return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_react.default.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                "div",
+                {
+                  className: (0, import_clsx3.default)(
+                    "flex flex-col",
+                    componentGap,
+                    componentPadding
+                  ),
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+                      "div",
+                      {
+                        className: (0, import_clsx3.default)(
+                          "flex flex-row items-center justify-between",
+                          componentGap,
+                          componentPaddingXUsingComponentGap,
+                          componentPaddingYUsingComponentGap,
+                          "mb-3",
+                          typography.label,
+                          "text-text-action-primary-normal"
+                        ),
+                        children: [
+                          idx === 0 ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                            "button",
+                            {
+                              type: "button",
+                              className: (0, import_clsx3.default)(
+                                "flex items-center justify-center rounded-base hover:bg-action-100 active:bg-action-300 text-icon-primary-normal",
+                                componentPadding,
+                                "mr-1"
+                              ),
+                              "aria-label": "Previous month",
+                              onClick: () => setBaseMonth(baseMonth.subtract({ months: 1 })),
+                              children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Icon, { name: "chevron_left", size: 24 })
+                            }
+                          ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: (0, import_clsx3.default)(componentPadding, "mr-1") }),
+                          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex gap-desktop-compact-component-padding", children: [
+                            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "font-semibold text-text-action-primary-normal text-[14px] leading-[1] truncate", children: month.name }),
+                            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "font-semibold text-text-action-primary-normal text-[14px] leading-[1] px-1 truncate", children: month.year })
+                          ] }),
+                          (mode === "double" ? idx === 1 : true) ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                            "button",
+                            {
+                              type: "button",
+                              className: (0, import_clsx3.default)(
+                                "flex items-center justify-center rounded-base hover:bg-action-100 active:bg-action-300 text-icon-primary-normal",
+                                componentPadding,
+                                "ml-1"
+                              ),
+                              "aria-label": "Next month",
+                              onClick: () => setBaseMonth(baseMonth.add({ months: 1 })),
+                              children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Icon, { name: "chevron_right", size: 24 })
+                            }
+                          ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: (0, import_clsx3.default)(componentPadding, "ml-1") })
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: (0, import_clsx3.default)("grid grid-cols-7 mb-1", componentGap), children: weekDays.map((d) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                      "span",
+                      {
+                        className: (0, import_clsx3.default)(
+                          typography.caption,
+                          "text-text-secondary-normal text-center"
+                        ),
+                        children: d
+                      },
+                      d
+                    )) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: (0, import_clsx3.default)("grid grid-cols-7"), children: Array.from({ length: totalCells }).map((_, i) => {
+                      const day = i - emptyCells + 1;
+                      const date = month.date.with({ day: 1 }).add({
+                        days: i - emptyCells
+                      });
+                      const isInMonth = day > 0 && day <= month.days;
+                      const isToday = isInMonth && date.equals(today);
+                      const isSelected = isInMonth && (!pendingFrom && fromDate && date.equals(fromDate) || !pendingFrom && toDate && date.equals(toDate) || pendingFrom && date.equals(pendingFrom));
+                      const inRange = isInMonth && isInRange(date);
+                      const isDisabled = !isInMonth || (isDateAvailable ? !isDateAvailable(date) : false);
+                      const hoverDateIsBeforePendingFrom = hoveredDate && pendingFrom && import_polyfill.Temporal.PlainDate.compare(hoveredDate, pendingFrom) < 0;
+                      const hoverDateIsAfterPendingFrom = hoveredDate && pendingFrom && import_polyfill.Temporal.PlainDate.compare(hoveredDate, pendingFrom) >= 0;
+                      const isRangeStart = mode === "single" && disableRange ? false : !pendingFrom && isInMonth && fromDate && date.equals(fromDate) || hoverDateIsAfterPendingFrom && date.equals(pendingFrom);
+                      const isRangeEnd = mode === "single" && disableRange ? false : !pendingFrom && isInMonth && toDate && date.equals(toDate) || hoverDateIsBeforePendingFrom && date.equals(pendingFrom);
+                      return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                        DateCell,
+                        {
+                          date,
+                          isInMonth: !!isInMonth,
+                          isToday: !!isToday,
+                          isSelected: !!isSelected,
+                          inRange: !!inRange,
+                          isDisabled: !!isDisabled,
+                          onClick: () => handleDayClick(date),
+                          onMouseEnter: () => setHoveredDate(date),
+                          onMouseLeave: () => setHoveredDate(void 0),
+                          isRangeStart: !!isRangeStart,
+                          isRangeEnd: !!isRangeEnd,
+                          isRangeDisabled: mode === "single" && disableRange,
+                          cellPadding: "p-1.5 md:p-2 lg:p-2.5"
+                        },
+                        i
+                      );
+                    }) })
+                  ]
+                }
+              ),
+              mode === "double" && idx === 0 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                "div",
+                {
+                  className: (0, import_clsx3.default)(
+                    "self-stretch bg-border-primary-normal rounded-base mx-mobile-component-padding desktop:mx-desktop-component-padding compact:mx-desktop-compact-component-padding",
+                    // 1px width, full height, matches Figma divider
+                    "w-px"
+                  )
+                }
+              )
+            ] }, month.name + month.year);
+          })
+        }
+      )
+    }
+  );
+}
+var CalendarRange_default = CalendarRange;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CalendarRange,
+  isWeekend
+});

package/dist/components/CalendarRange.js

@@ -0,0 +1,13 @@
+import {
+  CalendarRange,
+  CalendarRange_default,
+  isWeekend
+} from "../chunk-FY7PTP6E.js";
+import "../chunk-IGQVA7SC.js";
+import "../chunk-KX3O6GJ6.js";
+import "../chunk-ORMEWXMH.js";
+export {
+  CalendarRange,
+  CalendarRange_default as default,
+  isWeekend
+};