@hanzo/booker 0.1.0

package/dist/esm/Confirmation.native.js

@@ -0,0 +1,157 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Paragraph, Separator, SizableText, Spinner, XStack, YStack } from "hanzogui";
+import { DEFAULT_API_URL } from "./client.native.js";
+import { useBooking } from "./hooks.native.js";
+import { visitorTimeZone } from "./time.native.js";
+import { formatBookingWhen } from "./time.native.js";
+function Confirmation(param) {
+  var {
+    booking,
+    uid,
+    apiUrl,
+    timeZone,
+    onDone
+  } = param;
+  var _data_attendees;
+  var api = apiUrl !== null && apiUrl !== void 0 ? apiUrl : DEFAULT_API_URL;
+  var tz = timeZone !== null && timeZone !== void 0 ? timeZone : visitorTimeZone();
+  var fetched = useBooking(api, booking ? void 0 : uid);
+  var data = booking !== null && booking !== void 0 ? booking : fetched.data;
+  if (!data && fetched.loading) {
+    return /* @__PURE__ */_jsxs(YStack, {
+      alignItems: "center",
+      justifyContent: "center",
+      padding: "$6",
+      gap: "$3",
+      minHeight: 200,
+      children: [/* @__PURE__ */_jsx(Spinner, {
+        size: "large",
+        color: "$color9"
+      }), /* @__PURE__ */_jsx(SizableText, {
+        size: "$3",
+        color: "$color10",
+        children: "Loading your booking\u2026"
+      })]
+    });
+  }
+  if (!data) {
+    var _fetched_error;
+    return /* @__PURE__ */_jsxs(YStack, {
+      alignItems: "center",
+      justifyContent: "center",
+      padding: "$6",
+      gap: "$2",
+      minHeight: 200,
+      children: [/* @__PURE__ */_jsx(SizableText, {
+        size: "$4",
+        fontWeight: "600",
+        color: "$color12",
+        children: "Booking not found"
+      }), /* @__PURE__ */_jsx(SizableText, {
+        size: "$3",
+        color: "$color10",
+        textAlign: "center",
+        children: (_fetched_error = fetched.error) !== null && _fetched_error !== void 0 ? _fetched_error : "We could not load this booking."
+      })]
+    });
+  }
+  var attendee = (_data_attendees = data.attendees) === null || _data_attendees === void 0 ? void 0 : _data_attendees[0];
+  var location = data.location;
+  var _attendee_email;
+  return /* @__PURE__ */_jsxs(YStack, {
+    gap: "$3",
+    padding: "$1",
+    alignItems: "center",
+    children: [/* @__PURE__ */_jsx(YStack, {
+      width: 52,
+      height: 52,
+      borderRadius: 9999,
+      backgroundColor: "$green4",
+      alignItems: "center",
+      justifyContent: "center",
+      children: /* @__PURE__ */_jsx(SizableText, {
+        size: "$8",
+        color: "$green11",
+        children: "\u2713"
+      })
+    }), /* @__PURE__ */_jsxs(YStack, {
+      gap: "$1",
+      alignItems: "center",
+      children: [/* @__PURE__ */_jsx(SizableText, {
+        size: "$7",
+        fontWeight: "700",
+        color: "$color12",
+        textAlign: "center",
+        children: "You're booked"
+      }), /* @__PURE__ */_jsx(SizableText, {
+        size: "$4",
+        color: "$color11",
+        textAlign: "center",
+        children: data.title
+      })]
+    }), /* @__PURE__ */_jsx(Separator, {
+      width: "100%"
+    }), /* @__PURE__ */_jsxs(YStack, {
+      gap: "$2.5",
+      width: "100%",
+      maxWidth: 420,
+      children: [/* @__PURE__ */_jsx(Row, {
+        label: "When",
+        value: formatBookingWhen(data.start, tz)
+      }), location ? /* @__PURE__ */_jsx(Row, {
+        label: "Where",
+        value: location
+      }) : null, (attendee === null || attendee === void 0 ? void 0 : attendee.email) ? /* @__PURE__ */_jsx(Row, {
+        label: "Guest",
+        value: attendee.email
+      }) : null, /* @__PURE__ */_jsx(Row, {
+        label: "Status",
+        value: titleCase(data.status)
+      }), /* @__PURE__ */_jsx(Row, {
+        label: "Reference",
+        value: data.uid
+      })]
+    }), /* @__PURE__ */_jsxs(Paragraph, {
+      size: "$2",
+      color: "$color10",
+      textAlign: "center",
+      marginTop: "$1",
+      children: ["A calendar invite is on its way to ", (_attendee_email = attendee === null || attendee === void 0 ? void 0 : attendee.email) !== null && _attendee_email !== void 0 ? _attendee_email : "your inbox", "."]
+    }), onDone ? /* @__PURE__ */_jsx(Button, {
+      size: "$3",
+      chromeless: true,
+      onPress: onDone,
+      marginTop: "$1",
+      children: "Book another time"
+    }) : null]
+  });
+}
+function Row(param) {
+  var {
+    label,
+    value
+  } = param;
+  return /* @__PURE__ */_jsxs(XStack, {
+    justifyContent: "space-between",
+    gap: "$3",
+    alignItems: "flex-start",
+    children: [/* @__PURE__ */_jsx(SizableText, {
+      size: "$3",
+      color: "$color10",
+      children: label
+    }), /* @__PURE__ */_jsx(SizableText, {
+      size: "$3",
+      color: "$color12",
+      fontWeight: "500",
+      textAlign: "right",
+      flexShrink: 1,
+      children: value
+    })]
+  });
+}
+function titleCase(s) {
+  if (!s) return "";
+  return s.charAt(0).toUpperCase() + s.slice(1).toLowerCase();
+}
+export { Confirmation };
+//# sourceMappingURL=Confirmation.native.js.map

package/dist/esm/Confirmation.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","Button","Paragraph","Separator","SizableText","Spinner","XStack","YStack","DEFAULT_API_URL","useBooking","visitorTimeZone","formatBookingWhen","Confirmation","param","booking","uid","apiUrl","timeZone","onDone","_data_attendees","api","tz","fetched","data","loading","alignItems","justifyContent","padding","gap","minHeight","children","size","color","_fetched_error","fontWeight","textAlign","error","attendee","attendees","location","_attendee_email","width","height","borderRadius","backgroundColor","title","maxWidth","Row","label","value","start"],"sources":["../../src/Confirmation.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/EventHeader.mjs

@@ -0,0 +1,87 @@
+import { Paragraph, SizableText, XStack, YStack } from "hanzogui";
+import { jsx, jsxs } from "react/jsx-runtime";
+function EventHeader({
+  event,
+  host,
+  timeZone,
+  compact
+}) {
+  const name = event.profile?.name || host;
+  const initial = (name?.[0] || "H").toUpperCase();
+  return /* @__PURE__ */jsxs(YStack, {
+    gap: "$2",
+    children: [/* @__PURE__ */jsxs(XStack, {
+      alignItems: "center",
+      gap: "$2.5",
+      children: [/* @__PURE__ */jsx(YStack, {
+        width: 28,
+        height: 28,
+        borderRadius: 9999,
+        backgroundColor: "$color5",
+        alignItems: "center",
+        justifyContent: "center",
+        children: /* @__PURE__ */jsx(SizableText, {
+          size: "$2",
+          color: "$color11",
+          fontWeight: "600",
+          children: initial
+        })
+      }), /* @__PURE__ */jsx(SizableText, {
+        size: "$3",
+        color: "$color10",
+        children: name
+      })]
+    }), /* @__PURE__ */jsx(SizableText, {
+      size: compact ? "$6" : "$8",
+      fontWeight: "700",
+      color: "$color12",
+      children: event.title
+    }), /* @__PURE__ */jsxs(XStack, {
+      gap: "$2",
+      alignItems: "center",
+      flexWrap: "wrap",
+      children: [/* @__PURE__ */jsxs(Pill, {
+        children: [event.length, " min"]
+      }), /* @__PURE__ */jsx(Pill, {
+        children: shortZone(timeZone)
+      }), event.locations?.[0]?.type ? /* @__PURE__ */jsx(Pill, {
+        children: prettyLocation(event.locations[0].type)
+      }) : null]
+    }), !compact && event.description ? /* @__PURE__ */jsx(Paragraph, {
+      size: "$3",
+      color: "$color11",
+      marginTop: "$1",
+      children: event.description
+    }) : null]
+  });
+}
+function Pill({
+  children
+}) {
+  return /* @__PURE__ */jsx(XStack, {
+    backgroundColor: "$color3",
+    paddingHorizontal: "$2.5",
+    paddingVertical: "$1",
+    borderRadius: "$10",
+    alignItems: "center",
+    children: /* @__PURE__ */jsx(SizableText, {
+      size: "$1",
+      color: "$color11",
+      children
+    })
+  });
+}
+function shortZone(tz) {
+  const city = tz.split("/").pop() || tz;
+  return city.replace(/_/g, " ");
+}
+function prettyLocation(type) {
+  const t = type.toLowerCase();
+  if (t.includes("google")) return "Google Meet";
+  if (t.includes("zoom")) return "Zoom";
+  if (t.includes("phone")) return "Phone";
+  if (t.includes("person")) return "In person";
+  return "Video call";
+}
+export { EventHeader };
+//# sourceMappingURL=EventHeader.mjs.map

package/dist/esm/EventHeader.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["Paragraph","SizableText","XStack","YStack","jsx","jsxs","EventHeader","event","host","timeZone","compact","name","profile","initial","toUpperCase","gap","children","alignItems","width","height","borderRadius","backgroundColor","justifyContent","size","color","fontWeight","title","flexWrap","Pill","length","shortZone","locations","type","prettyLocation","description","marginTop","paddingHorizontal","paddingVertical","tz","city","split","pop","replace","t","toLowerCase","includes"],"sources":["../../src/EventHeader.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/EventHeader.native.js

@@ -0,0 +1,90 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Paragraph, SizableText, XStack, YStack } from "hanzogui";
+function EventHeader(param) {
+  var {
+    event,
+    host,
+    timeZone,
+    compact
+  } = param;
+  var _event_profile, _event_locations_, _event_locations;
+  var name = ((_event_profile = event.profile) === null || _event_profile === void 0 ? void 0 : _event_profile.name) || host;
+  var initial = ((name === null || name === void 0 ? void 0 : name[0]) || "H").toUpperCase();
+  return /* @__PURE__ */_jsxs(YStack, {
+    gap: "$2",
+    children: [/* @__PURE__ */_jsxs(XStack, {
+      alignItems: "center",
+      gap: "$2.5",
+      children: [/* @__PURE__ */_jsx(YStack, {
+        width: 28,
+        height: 28,
+        borderRadius: 9999,
+        backgroundColor: "$color5",
+        alignItems: "center",
+        justifyContent: "center",
+        children: /* @__PURE__ */_jsx(SizableText, {
+          size: "$2",
+          color: "$color11",
+          fontWeight: "600",
+          children: initial
+        })
+      }), /* @__PURE__ */_jsx(SizableText, {
+        size: "$3",
+        color: "$color10",
+        children: name
+      })]
+    }), /* @__PURE__ */_jsx(SizableText, {
+      size: compact ? "$6" : "$8",
+      fontWeight: "700",
+      color: "$color12",
+      children: event.title
+    }), /* @__PURE__ */_jsxs(XStack, {
+      gap: "$2",
+      alignItems: "center",
+      flexWrap: "wrap",
+      children: [/* @__PURE__ */_jsxs(Pill, {
+        children: [event.length, " min"]
+      }), /* @__PURE__ */_jsx(Pill, {
+        children: shortZone(timeZone)
+      }), ((_event_locations = event.locations) === null || _event_locations === void 0 ? void 0 : (_event_locations_ = _event_locations[0]) === null || _event_locations_ === void 0 ? void 0 : _event_locations_.type) ? /* @__PURE__ */_jsx(Pill, {
+        children: prettyLocation(event.locations[0].type)
+      }) : null]
+    }), !compact && event.description ? /* @__PURE__ */_jsx(Paragraph, {
+      size: "$3",
+      color: "$color11",
+      marginTop: "$1",
+      children: event.description
+    }) : null]
+  });
+}
+function Pill(param) {
+  var {
+    children
+  } = param;
+  return /* @__PURE__ */_jsx(XStack, {
+    backgroundColor: "$color3",
+    paddingHorizontal: "$2.5",
+    paddingVertical: "$1",
+    borderRadius: "$10",
+    alignItems: "center",
+    children: /* @__PURE__ */_jsx(SizableText, {
+      size: "$1",
+      color: "$color11",
+      children
+    })
+  });
+}
+function shortZone(tz) {
+  var city = tz.split("/").pop() || tz;
+  return city.replace(/_/g, " ");
+}
+function prettyLocation(type) {
+  var t = type.toLowerCase();
+  if (t.includes("google")) return "Google Meet";
+  if (t.includes("zoom")) return "Zoom";
+  if (t.includes("phone")) return "Phone";
+  if (t.includes("person")) return "In person";
+  return "Video call";
+}
+export { EventHeader };
+//# sourceMappingURL=EventHeader.native.js.map

package/dist/esm/EventHeader.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","Paragraph","SizableText","XStack","YStack","EventHeader","param","event","host","timeZone","compact","_event_profile","_event_locations_","_event_locations","name","profile","initial","toUpperCase","gap","children","alignItems","width","height","borderRadius","backgroundColor","justifyContent","size","color","fontWeight","title","flexWrap","Pill","length","shortZone","locations","type","prettyLocation"],"sources":["../../src/EventHeader.tsx"],"sourcesContent":[null],"mappings":"AACA,SAASA,GAAA,IAAAC,IAAW,EAAAC,IAAA,IAAAC,KAAa,QAAQ,mBAAc;AAgBjD,SASIC,SATJ,EAAAC,WAAA,EAAAC,MAAA,EAAAC,MAAA;AALC,SAASC,YAAYC,KAAE;EAC5B;IAAMC,KAAA;IAAOC,IAAA;IAAMC,QAAA;IAASC;EAAQ,IAAAJ,KAAA;EACpC,IAAAK,cAAiB,EAAAC,iBAAkB,EAAAC,gBAAY;EAC/C,IAAAC,IACE,KAAAH,cAAA,GAACJ,KAAA,CAAAQ,OAAW,MACV,QAAAJ,cAAA,uBAAAA,cAAA,CAAAG,IAAA,KAAAN,IAAA;EAAA,IAAAQ,OAAA,KAAAF,IAAA,KAAC,QAAOA,IAAA,UAAW,SAAS,IAAIA,IAAA,QAC9B,KAAAG,WAAA;EAAA,sBAAAjB,KAAA,CAAAI,MAAA;IAAAc,GAAA,EAAC;IAAAC,QAAA,kBACQnB,KAAA,CAAAG,MAAA;MAAAiB,UACC;MAAAF,GACR;MAAcC,QACd,GACA,eAAWrB,IAAA,CAAAM,MAAA;QACXiB,KAAA;QAEAC,MAAA;QAEAC,YAAA;QACFC,eAAA;QACAJ,UAAA,UAAC;QAGHK,cAAA;QAEAN,QAAA,iBAACrB,IAAY,CAAAI,WAAM,EAAU;UAI7BwB,IAAA;UACEC,KAAA,YAAC;UAAYC,UAAA;UAAOT,QAAA,EAAAH;QAAI;MACxB,IACC,eAAmBlB,IAAG,CAAAI,WACrB;QAEJwB,IAAA;QAEEC,KAAW,YAAM;QAKrBR,QAAA,EAAAL;MAEJ;IAGE,IACG,eAAAhB,IAAA,CAAAI,WAAA;MAAAwB,IAAA,EAAAhB,OAAA;MACCkB,UAAA,OAAgB;MAChBD,KAAA,YAAkB;MAClBR,QAAA,EAAAZ,KAAgB,CAAAsB;IAChB,IACA,eAAW7B,KAAA,CAAAG,MAAA;MAEXe,GAAA;MAEAE,UAAA;MACFU,QAAA;MAEJX,QAAA,GAES,eAA8BnB,KAAA,CAAA+B,IAAA;QAC/BZ,QAAU,GACJZ,KAAA,CAAAyB,MAAQ,EACtB;MAGQ,EAAI,EACJ,eAAiBlC,IAAG,CAAAiC,IAAO;QAC3BZ,QAAS,EAAAc,SAAS,CAAAxB,QAAO;MACzB,IACA,EAAAI,gBAAoB,GAAAN,KAAO,CAAA2B,SAAA,cAAArB,gBAAA,wBAAAD,iBAAA,GAAAC,gBAAA,iBAAAD,iBAAA,uBAAAA,iBAAA,CAAAuB,IAAA,mBAAArC,IAAA,CAAAiC,IAAA;QAC1BZ,QAAA,EAAAiB,cAAA,CAAA7B,KAAA,CAAA2B,SAAA,IAAAC,IAAA;MACT","ignoreList":[]}

package/dist/esm/MonthCalendar.mjs

@@ -0,0 +1,152 @@
+import { SizableText, Spinner, XStack, YStack } from "hanzogui";
+import { formatMonthLabel, isBeforeToday, monthMatrix, weekdayLabels } from "./time.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+function MonthCalendar({
+  viewDate,
+  availableKeys,
+  selectedDay,
+  onSelectDay,
+  onPrev,
+  onNext,
+  atFirstMonth,
+  weekStartsOn = 0,
+  loading
+}) {
+  const cells = monthMatrix(viewDate, weekStartsOn);
+  const rows = [];
+  for (let i = 0; i < cells.length; i += 7) rows.push(cells.slice(i, i + 7));
+  const labels = weekdayLabels(weekStartsOn);
+  return /* @__PURE__ */jsxs(YStack, {
+    gap: "$2",
+    flex: 1,
+    minWidth: 260,
+    children: [/* @__PURE__ */jsxs(XStack, {
+      alignItems: "center",
+      justifyContent: "space-between",
+      paddingVertical: "$1",
+      children: [/* @__PURE__ */jsx(NavArrow, {
+        label: "Previous month",
+        disabled: atFirstMonth,
+        onPress: onPrev,
+        children: "\u2039"
+      }), /* @__PURE__ */jsxs(XStack, {
+        alignItems: "center",
+        gap: "$2",
+        children: [/* @__PURE__ */jsx(SizableText, {
+          size: "$5",
+          fontWeight: "700",
+          color: "$color12",
+          children: formatMonthLabel(viewDate)
+        }), loading ? /* @__PURE__ */jsx(Spinner, {
+          size: "small",
+          color: "$color9"
+        }) : null]
+      }), /* @__PURE__ */jsx(NavArrow, {
+        label: "Next month",
+        onPress: onNext,
+        children: "\u203A"
+      })]
+    }), /* @__PURE__ */jsx(XStack, {
+      children: labels.map(l => /* @__PURE__ */jsx(YStack, {
+        flexBasis: 0,
+        flexGrow: 1,
+        alignItems: "center",
+        paddingVertical: "$1",
+        children: /* @__PURE__ */jsx(SizableText, {
+          size: "$1",
+          color: "$color10",
+          children: l
+        })
+      }, l))
+    }), /* @__PURE__ */jsx(YStack, {
+      gap: "$1.5",
+      children: rows.map((row, r) => /* @__PURE__ */jsx(XStack, {
+        gap: "$1.5",
+        children: row.map(cell => /* @__PURE__ */jsx(DayCell, {
+          cell,
+          available: availableKeys.has(cell.key),
+          past: isBeforeToday(cell.key),
+          selected: selectedDay === cell.key,
+          onSelectDay
+        }, cell.key))
+      }, r))
+    })]
+  });
+}
+function DayCell({
+  cell,
+  available,
+  past,
+  selected,
+  onSelectDay
+}) {
+  const selectable = cell.inMonth && available && !past;
+  const dayNum = cell.date.getDate();
+  return /* @__PURE__ */jsxs(YStack, {
+    flexBasis: 0,
+    flexGrow: 1,
+    aspectRatio: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: "$4",
+    borderWidth: 1,
+    borderColor: selected ? "$color12" : selectable ? "$color5" : "transparent",
+    backgroundColor: selected ? "$color12" : selectable ? "$color2" : "transparent",
+    opacity: cell.inMonth ? 1 : 0,
+    cursor: selectable ? "pointer" : "default",
+    hoverStyle: selectable && !selected ? {
+      backgroundColor: "$color4"
+    } : void 0,
+    pressStyle: selectable ? {
+      backgroundColor: "$color6"
+    } : void 0,
+    onPress: selectable ? () => onSelectDay(cell.key) : void 0,
+    "aria-label": selectable ? `Select ${cell.key}` : void 0,
+    role: selectable ? "button" : void 0,
+    children: [/* @__PURE__ */jsx(SizableText, {
+      size: "$3",
+      fontWeight: selectable ? "600" : "400",
+      color: selected ? "$color1" : selectable ? "$color12" : "$color8",
+      children: dayNum
+    }), selectable && !selected ? /* @__PURE__ */jsx(YStack, {
+      position: "absolute",
+      bottom: 4,
+      width: 4,
+      height: 4,
+      borderRadius: 9999,
+      backgroundColor: "$color10"
+    }) : null]
+  });
+}
+function NavArrow({
+  children,
+  onPress,
+  disabled,
+  label
+}) {
+  return /* @__PURE__ */jsx(YStack, {
+    width: 34,
+    height: 34,
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: "$4",
+    opacity: disabled ? 0.35 : 1,
+    cursor: disabled ? "default" : "pointer",
+    hoverStyle: disabled ? void 0 : {
+      backgroundColor: "$color4"
+    },
+    pressStyle: disabled ? void 0 : {
+      backgroundColor: "$color6"
+    },
+    onPress: disabled ? void 0 : onPress,
+    "aria-label": label,
+    role: "button",
+    children: /* @__PURE__ */jsx(SizableText, {
+      size: "$6",
+      color: "$color11",
+      children
+    })
+  });
+}
+export { MonthCalendar };
+//# sourceMappingURL=MonthCalendar.mjs.map

package/dist/esm/MonthCalendar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["SizableText","Spinner","XStack","YStack","formatMonthLabel","isBeforeToday","monthMatrix","weekdayLabels","jsx","jsxs","MonthCalendar","viewDate","availableKeys","selectedDay","onSelectDay","onPrev","onNext","atFirstMonth","weekStartsOn","loading","cells","rows","i","length","push","slice","labels","gap","flex","minWidth","children","alignItems","justifyContent","paddingVertical","NavArrow","label","disabled","onPress","size","fontWeight","color","map","l","flexBasis","flexGrow","row","r","cell","DayCell","available","has","key","past","selected","selectable","inMonth","dayNum","date","getDate","aspectRatio","borderRadius","borderWidth","borderColor","backgroundColor","opacity","cursor","hoverStyle","pressStyle","role","position","bottom","width","height"],"sources":["../../src/MonthCalendar.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/MonthCalendar.native.js

@@ -0,0 +1,163 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { SizableText, Spinner, XStack, YStack } from "hanzogui";
+import { formatMonthLabel, isBeforeToday, monthMatrix, weekdayLabels } from "./time.native.js";
+function MonthCalendar(param) {
+  var {
+    viewDate,
+    availableKeys,
+    selectedDay,
+    onSelectDay,
+    onPrev,
+    onNext,
+    atFirstMonth,
+    weekStartsOn = 0,
+    loading
+  } = param;
+  var cells = monthMatrix(viewDate, weekStartsOn);
+  var rows = [];
+  for (var i = 0; i < cells.length; i += 7) rows.push(cells.slice(i, i + 7));
+  var labels = weekdayLabels(weekStartsOn);
+  return /* @__PURE__ */_jsxs(YStack, {
+    gap: "$2",
+    flex: 1,
+    minWidth: 260,
+    children: [/* @__PURE__ */_jsxs(XStack, {
+      alignItems: "center",
+      justifyContent: "space-between",
+      paddingVertical: "$1",
+      children: [/* @__PURE__ */_jsx(NavArrow, {
+        label: "Previous month",
+        disabled: atFirstMonth,
+        onPress: onPrev,
+        children: "\u2039"
+      }), /* @__PURE__ */_jsxs(XStack, {
+        alignItems: "center",
+        gap: "$2",
+        children: [/* @__PURE__ */_jsx(SizableText, {
+          size: "$5",
+          fontWeight: "700",
+          color: "$color12",
+          children: formatMonthLabel(viewDate)
+        }), loading ? /* @__PURE__ */_jsx(Spinner, {
+          size: "small",
+          color: "$color9"
+        }) : null]
+      }), /* @__PURE__ */_jsx(NavArrow, {
+        label: "Next month",
+        onPress: onNext,
+        children: "\u203A"
+      })]
+    }), /* @__PURE__ */_jsx(XStack, {
+      children: labels.map(function (l) {
+        return /* @__PURE__ */_jsx(YStack, {
+          flexBasis: 0,
+          flexGrow: 1,
+          alignItems: "center",
+          paddingVertical: "$1",
+          children: /* @__PURE__ */_jsx(SizableText, {
+            size: "$1",
+            color: "$color10",
+            children: l
+          })
+        }, l);
+      })
+    }), /* @__PURE__ */_jsx(YStack, {
+      gap: "$1.5",
+      children: rows.map(function (row, r) {
+        return /* @__PURE__ */_jsx(XStack, {
+          gap: "$1.5",
+          children: row.map(function (cell) {
+            return /* @__PURE__ */_jsx(DayCell, {
+              cell,
+              available: availableKeys.has(cell.key),
+              past: isBeforeToday(cell.key),
+              selected: selectedDay === cell.key,
+              onSelectDay
+            }, cell.key);
+          })
+        }, r);
+      })
+    })]
+  });
+}
+function DayCell(param) {
+  var {
+    cell,
+    available,
+    past,
+    selected,
+    onSelectDay
+  } = param;
+  var selectable = cell.inMonth && available && !past;
+  var dayNum = cell.date.getDate();
+  return /* @__PURE__ */_jsxs(YStack, {
+    flexBasis: 0,
+    flexGrow: 1,
+    aspectRatio: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: "$4",
+    borderWidth: 1,
+    borderColor: selected ? "$color12" : selectable ? "$color5" : "transparent",
+    backgroundColor: selected ? "$color12" : selectable ? "$color2" : "transparent",
+    opacity: cell.inMonth ? 1 : 0,
+    cursor: selectable ? "pointer" : "default",
+    hoverStyle: selectable && !selected ? {
+      backgroundColor: "$color4"
+    } : void 0,
+    pressStyle: selectable ? {
+      backgroundColor: "$color6"
+    } : void 0,
+    onPress: selectable ? function () {
+      return onSelectDay(cell.key);
+    } : void 0,
+    "aria-label": selectable ? `Select ${cell.key}` : void 0,
+    role: selectable ? "button" : void 0,
+    children: [/* @__PURE__ */_jsx(SizableText, {
+      size: "$3",
+      fontWeight: selectable ? "600" : "400",
+      color: selected ? "$color1" : selectable ? "$color12" : "$color8",
+      children: dayNum
+    }), selectable && !selected ? /* @__PURE__ */_jsx(YStack, {
+      position: "absolute",
+      bottom: 4,
+      width: 4,
+      height: 4,
+      borderRadius: 9999,
+      backgroundColor: "$color10"
+    }) : null]
+  });
+}
+function NavArrow(param) {
+  var {
+    children,
+    onPress,
+    disabled,
+    label
+  } = param;
+  return /* @__PURE__ */_jsx(YStack, {
+    width: 34,
+    height: 34,
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: "$4",
+    opacity: disabled ? 0.35 : 1,
+    cursor: disabled ? "default" : "pointer",
+    hoverStyle: disabled ? void 0 : {
+      backgroundColor: "$color4"
+    },
+    pressStyle: disabled ? void 0 : {
+      backgroundColor: "$color6"
+    },
+    onPress: disabled ? void 0 : onPress,
+    "aria-label": label,
+    role: "button",
+    children: /* @__PURE__ */_jsx(SizableText, {
+      size: "$6",
+      color: "$color11",
+      children
+    })
+  });
+}
+export { MonthCalendar };
+//# sourceMappingURL=MonthCalendar.native.js.map