@vicacha-devs/strapi-plugin-calendar 0.0.0-stage → 1.0.0

package/dist/admin/SettingsPage-7SecVQEi.js

@@ -0,0 +1,2088 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { Box, Typography, Field, Flex, Button, Divider, Checkbox, SingleSelect, SingleSelectOption, TextInput, Badge, NumberInput, Tabs } from "@strapi/design-system";
+import { useFetchClient, Layouts } from "@strapi/strapi/admin";
+import { useState, useEffect, useMemo } from "react";
+import { useIntl } from "react-intl";
+import { w as detectEffectiveColorScheme, x as CALENDAR_COLOR_PALETTES, y as CALENDAR_THEME_PRESETS, z as resolveCalendarTheme, S as SUPPORTED_CALENDAR_LOCALES, A as SUPPORTED_INTL_CALENDARS, P as PLUGIN_ID } from "./index-USqxqyAm.js";
+import { useTheme } from "styled-components";
+const CalendarThemeSection = ({
+  t,
+  settings,
+  onPatchSettings
+}) => {
+  const styledTheme = useTheme();
+  const strapiNeutral0 = styledTheme?.colors?.neutral0;
+  const activeTheme = settings.theme ?? "breeze";
+  const configuredColorScheme = settings.colorScheme ?? "auto";
+  const effectiveColorScheme = detectEffectiveColorScheme(
+    configuredColorScheme,
+    strapiNeutral0
+  );
+  const activePalette = settings.themePalette ?? "default";
+  return /* @__PURE__ */ jsxs(Box, { children: [
+    /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", tag: "h2", children: t("settings.section.theme", "Calendar Theme & Visual Style") }),
+    /* @__PURE__ */ jsx(Box, { paddingTop: 1, paddingBottom: 4, children: /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: t(
+      "settings.themeHint",
+      "Select a modern FullCalendar stock theme (Breezy, Monarch, Forma, Pulse, Classic), design system (Shadcn, MUI), or heritage palette, plus accent swatch and light/dark mode."
+    ) }) }),
+    /* @__PURE__ */ jsx(
+      Box,
+      {
+        padding: 4,
+        background: "neutral100",
+        hasRadius: true,
+        style: {
+          border: "1px solid rgba(128, 128, 128, 0.18)",
+          marginBottom: 20
+        },
+        children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              display: "grid",
+              gridTemplateColumns: "repeat(2, minmax(0, 1fr))",
+              gap: 16,
+              alignItems: "center"
+            },
+            children: [
+              /* @__PURE__ */ jsxs(
+                Field.Root,
+                {
+                  hint: t(
+                    "settings.paletteHint",
+                    "Primary accent swatch applied to event pills, selected dates, and active view buttons."
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx(Field.Label, { children: t("settings.paletteLabel", "Accent Color Palette") }),
+                    /* @__PURE__ */ jsx(Flex, { gap: 2, alignItems: "center", wrap: "wrap", paddingTop: 1, children: Object.values(CALENDAR_COLOR_PALETTES).map((pal) => {
+                      const isSelected = activePalette === pal.id;
+                      const swatchColor = pal.id === "default" ? CALENDAR_THEME_PRESETS[activeTheme]?.primaryColor ?? "#0284C7" : effectiveColorScheme === "dark" ? pal.darkPrimary : pal.lightPrimary;
+                      return /* @__PURE__ */ jsx(
+                        "button",
+                        {
+                          type: "button",
+                          title: pal.label,
+                          "aria-label": pal.label,
+                          onClick: () => onPatchSettings({
+                            themePalette: pal.id,
+                            primaryColor: swatchColor
+                          }),
+                          style: {
+                            width: 26,
+                            height: 26,
+                            borderRadius: "999px",
+                            background: swatchColor,
+                            border: isSelected ? "2px solid #FFFFFF" : "1px solid rgba(128,128,128,0.35)",
+                            boxShadow: isSelected ? `0 0 0 2px ${swatchColor}` : "none",
+                            cursor: "pointer",
+                            padding: 0,
+                            transition: "transform 0.12s ease",
+                            transform: isSelected ? "scale(1.12)" : "scale(1)"
+                          }
+                        },
+                        pal.id
+                      );
+                    }) }),
+                    /* @__PURE__ */ jsx(Field.Hint, {})
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                Field.Root,
+                {
+                  hint: t(
+                    "settings.colorSchemeHint",
+                    "Choose whether the calendar canvas follows Strapi's light/dark theme or forces a specific mode."
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx(Field.Label, { children: t(
+                      "settings.colorSchemeLabel",
+                      "Calendar Appearance (Color Scheme)"
+                    ) }),
+                    /* @__PURE__ */ jsxs(Flex, { gap: 2, alignItems: "center", wrap: "wrap", paddingTop: 1, children: [
+                      /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          size: "S",
+                          variant: configuredColorScheme === "auto" ? "default" : "tertiary",
+                          onClick: () => onPatchSettings({ colorScheme: "auto" }),
+                          children: t("calendar.scheme.auto", "Auto (Match Strapi Theme)")
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          size: "S",
+                          variant: configuredColorScheme === "light" ? "default" : "tertiary",
+                          onClick: () => onPatchSettings({ colorScheme: "light" }),
+                          children: t("calendar.scheme.light", "Light")
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          size: "S",
+                          variant: configuredColorScheme === "dark" ? "default" : "tertiary",
+                          onClick: () => onPatchSettings({ colorScheme: "dark" }),
+                          children: t("calendar.scheme.dark", "Dark")
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ jsx(Field.Hint, {})
+                  ]
+                }
+              )
+            ]
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          display: "grid",
+          gridTemplateColumns: "repeat(3, minmax(0, 1fr))",
+          gap: 14
+        },
+        children: Object.values(CALENDAR_THEME_PRESETS).map((preset) => {
+          const isSelected = activeTheme === preset.id;
+          const preview = resolveCalendarTheme(
+            preset.id,
+            effectiveColorScheme,
+            activePalette,
+            strapiNeutral0
+          );
+          return /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: () => onPatchSettings({
+                theme: preset.id,
+                primaryColor: preview.primaryColor
+              }),
+              style: {
+                textAlign: "left",
+                padding: "14px 16px",
+                borderRadius: preview.containerRadius ?? "8px",
+                cursor: "pointer",
+                background: preview.cellBg,
+                color: preview.cellText,
+                border: isSelected ? `2px solid ${preview.primaryColor}` : `1px solid ${preview.borderColor}`,
+                boxShadow: isSelected ? `0 0 0 2px ${preview.headerBg}` : preview.containerShadow ?? "none",
+                transition: "all 0.15s ease"
+              },
+              children: [
+                /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    style: {
+                      display: "flex",
+                      justifyContent: "space-between",
+                      alignItems: "center",
+                      marginBottom: 8
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        "span",
+                        {
+                          style: {
+                            fontWeight: 700,
+                            fontSize: 13,
+                            color: preview.cellText
+                          },
+                          children: t(`settings.theme.${preset.id}.label`, preset.label)
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        "span",
+                        {
+                          style: {
+                            display: "inline-flex",
+                            alignItems: "center",
+                            gap: 4
+                          },
+                          children: /* @__PURE__ */ jsx(
+                            "span",
+                            {
+                              style: {
+                                width: 20,
+                                height: 20,
+                                borderRadius: preset.id === "forma" ? "3px" : "999px",
+                                background: preview.todayNumberBg,
+                                color: preview.todayNumberText,
+                                fontSize: 10,
+                                fontWeight: 700,
+                                display: "inline-flex",
+                                alignItems: "center",
+                                justifyContent: "center"
+                              },
+                              children: "16"
+                            }
+                          )
+                        }
+                      )
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    style: {
+                      marginBottom: 8,
+                      padding: "4px 8px",
+                      fontSize: 11,
+                      fontWeight: 600,
+                      borderRadius: preset.eventRadius ?? "5px",
+                      background: preset.eventStyle === "solid" ? preview.primaryColor : `${preview.primaryColor}22`,
+                      color: preset.eventStyle === "solid" ? "#FFFFFF" : preview.cellText,
+                      borderLeft: preset.eventStyle === "accent-bar" ? `5px solid ${preview.primaryColor}` : `1px solid ${preview.primaryColor}55`
+                    },
+                    children: t(
+                      "settings.theme.previewSampleEvent",
+                      "09:00 · Community Event"
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    style: {
+                      fontSize: 11,
+                      color: preview.cellMutedText,
+                      lineHeight: 1.4
+                    },
+                    children: t(
+                      `settings.theme.${preset.id}.description`,
+                      preset.description
+                    )
+                  }
+                )
+              ]
+            },
+            preset.id
+          );
+        })
+      }
+    )
+  ] });
+};
+const GRID_3_COL$1 = {
+  display: "grid",
+  gridTemplateColumns: "repeat(3, minmax(0, 1fr))",
+  gap: 16
+};
+const GRID_2_COL$1 = {
+  display: "grid",
+  gridTemplateColumns: "repeat(2, minmax(0, 1fr))",
+  gap: 16
+};
+const SUB_BOX_STYLE$1 = {
+  border: "1px solid rgba(128, 128, 128, 0.18)"
+};
+const VIEW_CHECKBOXES = [
+  ["monthView", "view.month", "Month"],
+  ["weekView", "view.week", "Week"],
+  ["dayView", "view.day", "Day"],
+  ["agendaView", "view.agenda", "Agenda"],
+  ["yearView", "view.year", "Year"]
+];
+const BEHAVIOR_CHECKBOXES = [
+  ["showWeekends", "settings.showWeekends", "Show Weekends"],
+  ["weekNumbers", "settings.weekNumbers", "Show Week Numbers"],
+  ["timeFormat24h", "settings.timeFormat24h", "24-Hour Time Format"],
+  [
+    "showCreateButton",
+    "settings.showCreateButton",
+    "Enable Quick-Create & Slot Selection"
+  ]
+];
+const CalendarViewsSection = ({
+  t,
+  settings,
+  onPatchSettings,
+  mode = "all"
+}) => {
+  const showTheme = mode === "all" || mode === "theme";
+  const showGeneral = mode === "all" || mode === "general";
+  const renderSelect = (label, hint, placeholder, value, options, onChange) => /* @__PURE__ */ jsxs(Field.Root, { hint: t(hint[0], hint[1]), children: [
+    /* @__PURE__ */ jsx(Field.Label, { children: t(label[0], label[1]) }),
+    /* @__PURE__ */ jsx(
+      SingleSelect,
+      {
+        placeholder: t(placeholder[0], placeholder[1]),
+        value,
+        onChange: (val) => onChange(String(val)),
+        children: options.map(([optVal, optIdOrLabel, optDef]) => /* @__PURE__ */ jsx(SingleSelectOption, { value: optVal, children: optDef ? t(optIdOrLabel, optDef) : optIdOrLabel }, optVal))
+      }
+    ),
+    /* @__PURE__ */ jsx(Field.Hint, {})
+  ] });
+  const renderText = (label, hint, placeholder, value, onChange) => /* @__PURE__ */ jsxs(Field.Root, { hint: t(hint[0], hint[1]), children: [
+    /* @__PURE__ */ jsx(Field.Label, { children: t(label[0], label[1]) }),
+    /* @__PURE__ */ jsx(
+      TextInput,
+      {
+        value,
+        onChange: (e) => onChange(e.target.value),
+        placeholder: t(placeholder[0], placeholder[1])
+      }
+    ),
+    /* @__PURE__ */ jsx(Field.Hint, {})
+  ] });
+  const extraLocales = SUPPORTED_CALENDAR_LOCALES.filter(
+    (loc) => !["es", "en", "ar", "tr"].includes(loc.code)
+  ).map((loc) => [
+    loc.code,
+    `${loc.nativeName} — ${loc.label} (${loc.code.toUpperCase()})`
+  ]);
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      padding: 5,
+      background: "neutral0",
+      hasRadius: true,
+      shadow: "tableShadow",
+      style: { border: "1px solid rgba(128, 128, 128, 0.22)" },
+      children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 5, children: [
+        showTheme && /* @__PURE__ */ jsx(
+          CalendarThemeSection,
+          {
+            t,
+            settings,
+            onPatchSettings
+          }
+        ),
+        showTheme && showGeneral && /* @__PURE__ */ jsx(Divider, {}),
+        showGeneral && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs(Box, { children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", tag: "h2", children: t(
+              "settings.section.general",
+              "Language, TimeGrid & Schedule Configuration"
+            ) }),
+            /* @__PURE__ */ jsx(Box, { paddingTop: 1, paddingBottom: 4, children: /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: t(
+              "settings.generalHint",
+              "Configure the primary local language, optional Arabic/Hijri secondary calendar display, timezone, and daily operating hours."
+            ) }) }),
+            /* @__PURE__ */ jsxs("div", { style: GRID_3_COL$1, children: [
+              renderSelect(
+                ["settings.defaultLocale", "Primary Calendar Language"],
+                [
+                  "settings.defaultLocaleHint",
+                  "Language for month names, weekdays, and toolbar buttons."
+                ],
+                [
+                  "settings.defaultLocale.placeholder",
+                  "Select primary language"
+                ],
+                settings.defaultLocale || "auto",
+                [
+                  ["es", "settings.locale.es", "Español — Spanish (ES)"],
+                  ["en", "settings.locale.en", "English (EN)"],
+                  ["ar", "settings.locale.ar", "العربية — Arabic (AR)"],
+                  ["tr", "settings.locale.tr", "Türkçe — Turkish (TR)"],
+                  [
+                    "auto",
+                    "settings.locale.auto",
+                    "Auto (Match Strapi Admin UI)"
+                  ],
+                  ...extraLocales
+                ],
+                (defaultLocale) => onPatchSettings({ defaultLocale })
+              ),
+              renderSelect(
+                [
+                  "settings.secondaryCalendarLanguage",
+                  "Secondary Hijri / Arabic Date Display"
+                ],
+                [
+                  "settings.secondaryCalendarLanguageHint",
+                  "Choose whether Hijri dates appear in local language, Arabic script, or hidden."
+                ],
+                [
+                  "settings.secondaryCalendarLanguage.placeholder",
+                  "Select Hijri display mode"
+                ],
+                settings.secondaryCalendarLanguage || "local",
+                [
+                  [
+                    "local",
+                    "settings.secondaryCalendarLanguage.local",
+                    "Local Language (e.g. 16 Rabiʻ II)"
+                  ],
+                  [
+                    "ar",
+                    "settings.secondaryCalendarLanguage.ar",
+                    "Arabic Script — العربية (e.g. ١٦ ربيع الآخر)"
+                  ],
+                  [
+                    "off",
+                    "settings.secondaryCalendarLanguage.off",
+                    "Off (Gregorian Calendar Only)"
+                  ]
+                ],
+                (val) => onPatchSettings({
+                  secondaryCalendarLanguage: val
+                })
+              ),
+              renderSelect(
+                ["settings.direction", "Layout Direction"],
+                [
+                  "settings.directionHint",
+                  "Grid column order (LTR or RTL for Arabic)."
+                ],
+                ["settings.direction.placeholder", "Select layout direction"],
+                settings.direction || "auto",
+                [
+                  [
+                    "auto",
+                    "settings.direction.auto",
+                    "Auto (LTR / RTL by Language)"
+                  ],
+                  ["ltr", "settings.direction.ltr", "Left-to-Right (LTR)"],
+                  ["rtl", "settings.direction.rtl", "Right-to-Left (RTL)"]
+                ],
+                (val) => onPatchSettings({
+                  direction: val
+                })
+              ),
+              renderSelect(
+                ["settings.defaultView", "Default Calendar View"],
+                [
+                  "settings.defaultViewHint",
+                  "Initial view displayed when opening the calendar."
+                ],
+                ["settings.defaultView.placeholder", "Select default view"],
+                settings.defaultView || "dayGridMonth",
+                [
+                  [
+                    "dayGridMonth",
+                    "settings.defaultView.month",
+                    "Month Grid"
+                  ],
+                  [
+                    "timeGridWeek",
+                    "settings.defaultView.week",
+                    "Week (TimeGrid)"
+                  ],
+                  [
+                    "timeGridDay",
+                    "settings.defaultView.day",
+                    "Day (TimeGrid)"
+                  ],
+                  ["listMonth", "settings.defaultView.agenda", "Agenda List"],
+                  [
+                    "multiMonthYear",
+                    "settings.defaultView.year",
+                    "Full Year (3x4 Grid)"
+                  ],
+                  [
+                    "multiMonthYearStacked",
+                    "settings.defaultView.yearStacked",
+                    "Year (Stacked Months)"
+                  ],
+                  [
+                    "dayGridYear",
+                    "settings.defaultView.dayGridYear",
+                    "Year (Continuous Grid)"
+                  ]
+                ],
+                (val) => onPatchSettings({ defaultView: val })
+              ),
+              renderSelect(
+                ["settings.firstDayOfWeek", "First Day of Week"],
+                [
+                  "settings.firstDayHint",
+                  "Starting weekday column in Month and Week views."
+                ],
+                [
+                  "settings.firstDayOfWeek.placeholder",
+                  "Select first day of week"
+                ],
+                String(settings.firstDayOfWeek ?? 1),
+                [
+                  ["1", "settings.firstDay.monday", "Monday (1)"],
+                  ["0", "settings.firstDay.sunday", "Sunday (0)"],
+                  ["6", "settings.firstDay.saturday", "Saturday (6)"]
+                ],
+                (val) => onPatchSettings({
+                  firstDayOfWeek: Number.parseInt(val, 10)
+                })
+              ),
+              renderSelect(
+                ["settings.weekNumberCalculation", "Week Calculation"],
+                [
+                  "settings.weekCalcHint",
+                  "Standard used when computing week numbers."
+                ],
+                [
+                  "settings.weekNumberCalculation.placeholder",
+                  "Select week calculation mode"
+                ],
+                settings.weekNumberCalculation || "ISO",
+                [
+                  ["ISO", "settings.weekCalc.iso", "ISO 8601 (Monday)"],
+                  ["local", "settings.weekCalc.local", "Locale Default"]
+                ],
+                (val) => onPatchSettings({
+                  weekNumberCalculation: val
+                })
+              ),
+              renderText(
+                ["settings.defaultTimezone", "Default Timezone (IANA)"],
+                [
+                  "settings.timezoneHint",
+                  "IANA timezone identifier (e.g., UTC or America/New_York)."
+                ],
+                ["settings.defaultTimezone.placeholder", "e.g., UTC"],
+                settings.defaultTimezone || "UTC",
+                (defaultTimezone) => onPatchSettings({ defaultTimezone })
+              ),
+              renderText(
+                ["settings.startHour", "Daily Start Hour"],
+                [
+                  "settings.startHourHint",
+                  "Earliest visible time slot in Week/Day TimeGrid (HH:MM:SS)."
+                ],
+                ["settings.startHour.placeholder", "e.g., 07:00:00"],
+                settings.startHour || "07:00:00",
+                (startHour) => onPatchSettings({ startHour })
+              ),
+              renderText(
+                ["settings.endHour", "Daily End Hour"],
+                [
+                  "settings.endHourHint",
+                  "Latest visible time slot in Week/Day TimeGrid (HH:MM:SS)."
+                ],
+                ["settings.endHour.placeholder", "e.g., 21:00:00"],
+                settings.endHour || "21:00:00",
+                (endHour) => onPatchSettings({ endHour })
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { style: { ...GRID_2_COL$1, marginTop: 16 }, children: [
+              renderSelect(
+                ["settings.slotDuration", "TimeGrid Slot Duration"],
+                [
+                  "settings.slotDurationHint",
+                  "Time interval for rows in Week and Day TimeGrid views."
+                ],
+                ["settings.slotDuration.placeholder", "Select slot interval"],
+                settings.slotDuration || "00:30:00",
+                [
+                  [
+                    "00:15:00",
+                    "settings.slotDuration.15m",
+                    "15 min (00:15:00)"
+                  ],
+                  [
+                    "00:30:00",
+                    "settings.slotDuration.30m",
+                    "30 min (00:30:00)"
+                  ],
+                  [
+                    "01:00:00",
+                    "settings.slotDuration.60m",
+                    "60 min (01:00:00)"
+                  ]
+                ],
+                (slotDuration) => onPatchSettings({ slotDuration })
+              ),
+              renderText(
+                ["settings.feedTitle", "Public iCal (.ics) Feed Title"],
+                [
+                  "settings.feedTitleHint",
+                  "Calendar title exported in /api/calendar/feed.ics for Google/Apple/Outlook subscriptions."
+                ],
+                [
+                  "settings.feedTitle.placeholder",
+                  "e.g., Organization — General Calendar"
+                ],
+                settings.feedTitle || t(
+                  "settings.defaultFeedTitle",
+                  "Organization — General Calendar"
+                ),
+                (feedTitle) => onPatchSettings({ feedTitle })
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(Divider, {}),
+          /* @__PURE__ */ jsx("div", { style: GRID_2_COL$1, children: [
+            [
+              "settings.enabledViewsGroup",
+              "Enabled Calendar View Tabs",
+              VIEW_CHECKBOXES
+            ],
+            [
+              "settings.gridBehaviorGroup",
+              "Grid Display & Interaction Options",
+              BEHAVIOR_CHECKBOXES
+            ]
+          ].map(([groupId, groupDef, items]) => /* @__PURE__ */ jsx(
+            Box,
+            {
+              padding: 4,
+              background: "neutral100",
+              hasRadius: true,
+              style: SUB_BOX_STYLE$1,
+              children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "flex-start", gap: 3, children: [
+                /* @__PURE__ */ jsx(Typography, { variant: "sigma", textColor: "neutral700", children: t(groupId, groupDef) }),
+                /* @__PURE__ */ jsx(Flex, { gap: 4, wrap: "wrap", children: items.map(([key, id, def]) => /* @__PURE__ */ jsx(
+                  Checkbox,
+                  {
+                    checked: key === "timeFormat24h" ? settings.timeFormat24h !== false : Boolean(settings[key]),
+                    onCheckedChange: (c) => onPatchSettings({ [key]: Boolean(c) }),
+                    children: t(id, def)
+                  },
+                  key
+                )) })
+              ] })
+            },
+            groupId
+          )) })
+        ] })
+      ] })
+    }
+  );
+};
+const CARD_BORDER_STYLE = {
+  border: "1px solid rgba(128, 128, 128, 0.22)"
+};
+const SUB_CARD_BORDER_STYLE = {
+  border: "1px solid rgba(128, 128, 128, 0.18)"
+};
+const GRID_3_STYLE = {
+  display: "grid",
+  gridTemplateColumns: "repeat(3, minmax(0, 1fr))",
+  gap: 16
+};
+const GRID_2_STYLE = {
+  display: "grid",
+  gridTemplateColumns: "repeat(2, minmax(0, 1fr))",
+  gap: 16
+};
+const TITLE_CANDIDATES = "title,name,customerName,visitorName,headline,subject,fullName,slug".split(
+  ","
+);
+const START_CANDIDATES = "startDate,preferredDate,date,scheduledAt,releasedAt,publishedAt,createdAt,updatedAt".split(
+  ","
+);
+const CollectionSourcesSection = ({
+  t,
+  sources,
+  contentTypes,
+  onAddOrUpdateSource,
+  onToggleSourceEnabled,
+  onRemoveSource
+}) => {
+  const [isFormOpen, setIsFormOpen] = useState(true);
+  const [editingSourceId, setEditingSourceId] = useState(null);
+  const [newSourceUid, setNewSourceUid] = useState("plugin::events.event");
+  const [newSourceLabel, setNewSourceLabel] = useState(
+    () => t("settings.defaultSourceLabel", "Events")
+  );
+  const [newSourceColor, setNewSourceColor] = useState("#0284C7");
+  const [newTitleField, setNewTitleField] = useState("title");
+  const [newStartField, setNewStartField] = useState("startDate");
+  const [newEndField, setNewEndField] = useState("endDate");
+  const [newRRuleField, setNewRRuleField] = useState("recurrence");
+  const selectCollectionDefaults = (ct) => {
+    setEditingSourceId(null);
+    setNewSourceUid(ct.uid);
+    setNewSourceLabel(ct.displayName || ct.uid);
+    const fieldNames = ct.fields.map((f) => f.name);
+    const findMatch = (candidates) => fieldNames.find((n) => candidates.includes(n));
+    const bestTitle = findMatch(TITLE_CANDIDATES) ?? ct.fields.find((f) => ["string", "text", "uid"].includes(f.type))?.name ?? ct.fields[0]?.name ?? "title";
+    const bestStart = findMatch(START_CANDIDATES) ?? ct.fields.find((f) => f.type === "datetime" || f.type === "date")?.name ?? ct.fields[0]?.name ?? "startDate";
+    setNewTitleField(bestTitle);
+    setNewStartField(bestStart);
+    setNewEndField(
+      findMatch(["endDate", "finishDate", "expiresAt"]) ?? "endDate"
+    );
+    setNewRRuleField(
+      findMatch(["recurrence", "rrule", "recurrenceRule"]) ?? "recurrence"
+    );
+  };
+  useEffect(() => {
+    if (contentTypes.length === 0) return;
+    const preferred = contentTypes.find((ct) => ct.uid === newSourceUid) ?? contentTypes.find((ct) => ct.uid === "plugin::events.event") ?? contentTypes.find((ct) => !sources.some((s) => s.uid === ct.uid)) ?? contentTypes[0];
+    if (preferred) selectCollectionDefaults(preferred);
+  }, [contentTypes]);
+  const selectedCtFields = useMemo(() => {
+    const found = contentTypes.find((ct) => ct.uid === newSourceUid);
+    const base = found?.fields ? [...found.fields] : [];
+    const ensureField = (name, fallbackType) => {
+      if (name && !base.some((f) => f.name === name)) {
+        base.push({ name, type: fallbackType });
+      }
+    };
+    ensureField(newTitleField || "title", "string");
+    ensureField(newStartField || "startDate", "datetime");
+    return base;
+  }, [contentTypes, newSourceUid, newTitleField, newStartField]);
+  const handleEditSource = (src) => {
+    setEditingSourceId(src.id);
+    setNewSourceUid(src.uid);
+    setNewSourceLabel(src.label);
+    setNewSourceColor(src.color || "#0284C7");
+    setNewTitleField(src.fields.title || "title");
+    setNewStartField(src.fields.startDate || "startDate");
+    setNewEndField(src.fields.endDate || "");
+    setNewRRuleField(src.fields.rrule || "");
+    setIsFormOpen(true);
+  };
+  const handleSaveSource = () => {
+    if (!newSourceUid || !newTitleField || !newStartField) return;
+    const existing = sources.find(
+      (s) => s.id === editingSourceId || s.uid === newSourceUid
+    );
+    const idSlug = (newSourceLabel || newSourceUid).toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-|-$/g, "");
+    const nextSource = {
+      ...existing,
+      id: existing?.id || idSlug || `source-${Date.now()}`,
+      label: newSourceLabel.trim() || newSourceUid,
+      uid: newSourceUid,
+      color: /^#[0-9a-fA-F]{3,8}$/.test(newSourceColor.trim()) ? newSourceColor.trim() : "#0284C7",
+      enabled: existing?.enabled ?? true,
+      fields: {
+        ...existing?.fields,
+        title: newTitleField,
+        startDate: newStartField,
+        endDate: newEndField.trim() || void 0,
+        rrule: newRRuleField.trim() || void 0
+      }
+    };
+    setEditingSourceId(null);
+    onAddOrUpdateSource(nextSource);
+  };
+  const renderTextField = (label, hint, placeholder, value, onChange) => /* @__PURE__ */ jsxs(Field.Root, { hint: t(hint[0], hint[1]), children: [
+    /* @__PURE__ */ jsx(Field.Label, { children: t(label[0], label[1]) }),
+    /* @__PURE__ */ jsx(
+      TextInput,
+      {
+        value,
+        onChange: (e) => onChange(e.target.value),
+        placeholder: t(placeholder[0], placeholder[1])
+      }
+    ),
+    /* @__PURE__ */ jsx(Field.Hint, {})
+  ] });
+  const renderFieldSelect = (label, hint, placeholder, value, onChange) => /* @__PURE__ */ jsxs(Field.Root, { required: true, hint: t(hint[0], hint[1]), children: [
+    /* @__PURE__ */ jsx(Field.Label, { children: t(label[0], label[1]) }),
+    /* @__PURE__ */ jsx(
+      SingleSelect,
+      {
+        placeholder: t(placeholder[0], placeholder[1]),
+        value,
+        onChange: (val) => onChange(String(val)),
+        children: selectedCtFields.map((f) => /* @__PURE__ */ jsxs(SingleSelectOption, { value: f.name, children: [
+          f.name,
+          " (",
+          f.type,
+          ")"
+        ] }, f.name))
+      }
+    ),
+    /* @__PURE__ */ jsx(Field.Hint, {})
+  ] });
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      padding: 5,
+      background: "neutral0",
+      hasRadius: true,
+      shadow: "tableShadow",
+      style: CARD_BORDER_STYLE,
+      children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 4, children: [
+        /* @__PURE__ */ jsxs(
+          Flex,
+          {
+            justifyContent: "space-between",
+            alignItems: "flex-start",
+            wrap: "wrap",
+            gap: 3,
+            children: [
+              /* @__PURE__ */ jsxs(Box, { style: { flex: 1, minWidth: 280 }, children: [
+                /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", tag: "h2", children: t("settings.section.sources", "Mapped Collection Sources") }),
+                /* @__PURE__ */ jsx(Box, { paddingTop: 1, children: /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: t(
+                  "settings.sourcesHint",
+                  "Connects Strapi Collection Types (such as Events or Bookings) so their records are automatically plotted on the unified calendar. Each mapping defines which fields represent the item title, start/end dates, and optional recurrence rules."
+                ) }) })
+              ] }),
+              /* @__PURE__ */ jsxs(Flex, { gap: 2, alignItems: "center", children: [
+                /* @__PURE__ */ jsxs(Badge, { active: true, children: [
+                  sources.length,
+                  " ",
+                  t("settings.mappedCount", "Mapped")
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: isFormOpen ? "tertiary" : "secondary",
+                    size: "S",
+                    onClick: () => setIsFormOpen((prev) => !prev),
+                    children: isFormOpen ? t("common.hideForm", "Hide Mapping Form") : `+ ${t("settings.addSourceToggle", "Map Collection Type")}`
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        sources.length === 0 ? /* @__PURE__ */ jsx(
+          Box,
+          {
+            padding: 4,
+            background: "neutral100",
+            hasRadius: true,
+            style: SUB_CARD_BORDER_STYLE,
+            children: /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral600", children: t(
+              "settings.noSources",
+              "No collection types are mapped yet. Use the form below to plot Events, Bookings, or Articles on the calendar."
+            ) })
+          }
+        ) : /* @__PURE__ */ jsx(Flex, { direction: "column", alignItems: "stretch", gap: 2, children: sources.map((src) => /* @__PURE__ */ jsx(
+          Box,
+          {
+            padding: 4,
+            background: "neutral100",
+            hasRadius: true,
+            style: {
+              ...SUB_CARD_BORDER_STYLE,
+              borderLeft: `4px solid ${src.color || "#0284C7"}`
+            },
+            children: /* @__PURE__ */ jsxs(
+              Flex,
+              {
+                justifyContent: "space-between",
+                alignItems: "center",
+                wrap: "wrap",
+                gap: 3,
+                children: [
+                  /* @__PURE__ */ jsxs(Flex, { gap: 3, alignItems: "center", wrap: "wrap", children: [
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          display: "inline-block",
+                          width: 14,
+                          height: 14,
+                          borderRadius: "50%",
+                          background: src.color
+                        }
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(Typography, { variant: "omega", fontWeight: "bold", children: src.label }),
+                    /* @__PURE__ */ jsx(Badge, { backgroundColor: "neutral200", textColor: "neutral800", children: src.uid }),
+                    /* @__PURE__ */ jsxs(Badge, { backgroundColor: "primary100", textColor: "primary700", children: [
+                      t("settings.badge.title", "Title"),
+                      ": ",
+                      src.fields.title,
+                      " ·",
+                      " ",
+                      t("settings.badge.start", "Start"),
+                      ":",
+                      " ",
+                      src.fields.startDate,
+                      src.fields.endDate ? ` · ${t("settings.badge.end", "End")}: ${src.fields.endDate}` : ""
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxs(Flex, { gap: 3, alignItems: "center", children: [
+                    /* @__PURE__ */ jsx(
+                      Checkbox,
+                      {
+                        checked: src.enabled,
+                        onCheckedChange: (checked) => onToggleSourceEnabled(src.id, Boolean(checked)),
+                        children: t("settings.sourceEnabled", "Enabled")
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        variant: "tertiary",
+                        size: "S",
+                        onClick: () => handleEditSource(src),
+                        children: t("common.edit", "Edit")
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        variant: "danger-light",
+                        size: "S",
+                        onClick: () => onRemoveSource(src.id),
+                        children: t("common.remove", "Remove")
+                      }
+                    )
+                  ] })
+                ]
+              }
+            )
+          },
+          src.id
+        )) }),
+        isFormOpen && /* @__PURE__ */ jsx(
+          Box,
+          {
+            padding: 5,
+            background: "neutral100",
+            hasRadius: true,
+            style: SUB_CARD_BORDER_STYLE,
+            children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 4, children: [
+              /* @__PURE__ */ jsx(Typography, { variant: "sigma", textColor: "neutral700", children: t(
+                "settings.addSourceTitle",
+                "Configure Collection Type Mapping"
+              ) }),
+              /* @__PURE__ */ jsxs("div", { style: GRID_3_STYLE, children: [
+                /* @__PURE__ */ jsxs(
+                  Field.Root,
+                  {
+                    hint: t(
+                      "settings.collectionTypeHint",
+                      "Select which Strapi Collection Type provides the dated entries."
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsx(Field.Label, { children: t("settings.collectionType", "Strapi Collection Type") }),
+                      contentTypes.length > 0 ? /* @__PURE__ */ jsx(
+                        SingleSelect,
+                        {
+                          placeholder: t(
+                            "settings.collectionType.placeholder",
+                            "Select Strapi Collection Type"
+                          ),
+                          value: newSourceUid || contentTypes[0]?.uid || "plugin::events.event",
+                          onChange: (val) => {
+                            const uid = String(val);
+                            const found = contentTypes.find((c) => c.uid === uid);
+                            if (found) {
+                              selectCollectionDefaults(found);
+                            } else {
+                              setNewSourceUid(uid);
+                            }
+                          },
+                          children: contentTypes.map((ct) => /* @__PURE__ */ jsxs(SingleSelectOption, { value: ct.uid, children: [
+                            ct.displayName,
+                            " (",
+                            ct.uid,
+                            ")"
+                          ] }, ct.uid))
+                        }
+                      ) : /* @__PURE__ */ jsx(
+                        TextInput,
+                        {
+                          value: newSourceUid,
+                          onChange: (e) => setNewSourceUid(e.target.value),
+                          placeholder: t(
+                            "settings.collectionTypeUid.placeholder",
+                            "e.g., plugin::events.event"
+                          )
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(Field.Hint, {})
+                    ]
+                  }
+                ),
+                renderTextField(
+                  ["settings.sourceLabel", "Calendar Filter Label"],
+                  [
+                    "settings.sourceLabelHint",
+                    "Human-readable label shown on calendar filter chips."
+                  ],
+                  ["settings.sourceLabel.placeholder", "e.g., Events"],
+                  newSourceLabel,
+                  setNewSourceLabel
+                ),
+                renderTextField(
+                  ["settings.sourceColor", "Event Badge Color (Hex)"],
+                  [
+                    "settings.sourceColorHint",
+                    "Hex color accent applied to calendar chips for this source."
+                  ],
+                  ["settings.sourceColor.placeholder", "e.g., #0284C7"],
+                  newSourceColor,
+                  setNewSourceColor
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { style: GRID_2_STYLE, children: [
+                renderFieldSelect(
+                  ["settings.field.title", "Title Field"],
+                  [
+                    "settings.field.titleHint",
+                    "Attribute displayed as the calendar event title."
+                  ],
+                  ["settings.field.title.placeholder", "Select title field"],
+                  newTitleField || "title",
+                  setNewTitleField
+                ),
+                renderFieldSelect(
+                  ["settings.field.startDate", "Start Date Field"],
+                  [
+                    "settings.field.startDateHint",
+                    "Date or DateTime field used to place the entry on the grid."
+                  ],
+                  [
+                    "settings.field.startDate.placeholder",
+                    "Select start date field"
+                  ],
+                  newStartField || "startDate",
+                  setNewStartField
+                ),
+                renderTextField(
+                  ["settings.field.endDate", "End Date Field (Optional)"],
+                  [
+                    "settings.field.endDateHint",
+                    "Optional end Date/DateTime attribute for multi-hour or multi-day spans."
+                  ],
+                  ["settings.field.endDate.placeholder", "e.g., endDate"],
+                  newEndField,
+                  setNewEndField
+                ),
+                renderTextField(
+                  ["settings.field.rrule", "Recurrence Field (Optional)"],
+                  [
+                    "settings.field.rruleHint",
+                    "Optional RFC 5545 RRULE field for repeating schedules."
+                  ],
+                  ["settings.field.rrule.placeholder", "e.g., recurrence"],
+                  newRRuleField,
+                  setNewRRuleField
+                )
+              ] }),
+              /* @__PURE__ */ jsx(Flex, { justifyContent: "flex-end", gap: 2, children: /* @__PURE__ */ jsxs(Button, { variant: "default", onClick: handleSaveSource, children: [
+                "+ ",
+                t("settings.addSourceButton", "Save Collection Source")
+              ] }) })
+            ] })
+          }
+        )
+      ] })
+    }
+  );
+};
+const CARD_STYLE = {
+  border: "1px solid rgba(128, 128, 128, 0.22)"
+};
+const SUB_BOX_STYLE = {
+  border: "1px solid rgba(128, 128, 128, 0.18)"
+};
+const GRID_2_COL = {
+  display: "grid",
+  gridTemplateColumns: "repeat(2, minmax(0, 1fr))",
+  gap: 16
+};
+const GRID_3_COL = {
+  display: "grid",
+  gridTemplateColumns: "repeat(3, minmax(0, 1fr))",
+  gap: 16
+};
+const BOOKING_NUMBER_FIELDS = [
+  {
+    key: "defaultSlotDurationMinutes",
+    labelId: "settings.bookingsSlotDuration",
+    labelDefault: "Slot Duration (Minutes)",
+    hintId: "settings.bookingsSlotDurationHint",
+    hintDefault: "Standard length of each bookable appointment slot.",
+    min: 5,
+    fallback: 60
+  },
+  {
+    key: "defaultCapacityPerSlot",
+    labelId: "settings.bookingsCapacityPerSlot",
+    labelDefault: "Default Capacity Per Slot",
+    hintId: "settings.bookingsCapacityPerSlotHint",
+    hintDefault: "Concurrent reservations allowed per time slot.",
+    min: 1,
+    fallback: 1
+  },
+  {
+    key: "defaultBufferBeforeMinutes",
+    labelId: "settings.bookingsBufferBefore",
+    labelDefault: "Buffer Before (Minutes)",
+    hintId: "settings.bookingsBufferBeforeHint",
+    hintDefault: "Preparation gap blocked before each booking starts.",
+    min: 0,
+    fallback: 0
+  },
+  {
+    key: "defaultBufferAfterMinutes",
+    labelId: "settings.bookingsBufferAfter",
+    labelDefault: "Buffer After (Minutes)",
+    hintId: "settings.bookingsBufferAfterHint",
+    hintDefault: "Cooldown gap blocked after each booking ends.",
+    min: 0,
+    fallback: 0
+  },
+  {
+    key: "defaultMinLeadTimeHours",
+    labelId: "settings.bookingsMinLeadHours",
+    labelDefault: "Minimum Lead Time (Hours)",
+    hintId: "settings.bookingsMinLeadHoursHint",
+    hintDefault: "Minimum notice required before a slot can be booked.",
+    min: 0,
+    fallback: 2
+  },
+  {
+    key: "defaultMaxAdvanceDays",
+    labelId: "settings.bookingsMaxAdvanceDays",
+    labelDefault: "Max Advance Horizon (Days)",
+    hintId: "settings.bookingsMaxAdvanceDaysHint",
+    hintDefault: "How far in advance visitors may schedule bookings.",
+    min: 1,
+    fallback: 90
+  }
+];
+const SettingCheckboxCard = ({ checked, onChange, label, hint }) => /* @__PURE__ */ jsxs(Box, { padding: 4, background: "neutral100", hasRadius: true, style: SUB_BOX_STYLE, children: [
+  /* @__PURE__ */ jsx(
+    Checkbox,
+    {
+      checked,
+      onCheckedChange: (c) => onChange(Boolean(c)),
+      children: label
+    }
+  ),
+  /* @__PURE__ */ jsx(Box, { paddingTop: 2, children: /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: hint }) })
+] });
+const CompanionSuiteSettingsSection = ({
+  t,
+  mode,
+  eventsSettings,
+  bookingsSettings,
+  onPatchEvents,
+  onPatchBookings
+}) => {
+  if (mode === "events") {
+    if (!eventsSettings) {
+      return /* @__PURE__ */ jsx(
+        Box,
+        {
+          padding: 5,
+          background: "neutral0",
+          hasRadius: true,
+          shadow: "tableShadow",
+          style: CARD_STYLE,
+          children: /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral600", children: t(
+            "settings.eventsUnavailable",
+            "Events & RSVPs plugin settings are loading or not installed."
+          ) })
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      Box,
+      {
+        padding: 5,
+        background: "neutral0",
+        hasRadius: true,
+        shadow: "tableShadow",
+        style: CARD_STYLE,
+        children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 5, children: [
+          /* @__PURE__ */ jsxs(
+            Flex,
+            {
+              justifyContent: "space-between",
+              alignItems: "center",
+              wrap: "wrap",
+              gap: 2,
+              children: [
+                /* @__PURE__ */ jsxs(Box, { children: [
+                  /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", tag: "h2", children: t(
+                    "settings.eventsHeading",
+                    "Events, RSVP Capacity & Waitlist Automation"
+                  ) }),
+                  /* @__PURE__ */ jsx(Box, { paddingTop: 1, children: /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: t(
+                    "settings.eventsHint",
+                    "Configure default RSVP seat capacity, guest limits per registration, automatic FIFO waitlist promotion, and public Events iCal (.ics) feed."
+                  ) }) })
+                ] }),
+                /* @__PURE__ */ jsxs(Badge, { active: true, children: [
+                  t("settings.badge.timezone", "Timezone"),
+                  ":",
+                  " ",
+                  eventsSettings.defaultTimezone || "UTC"
+                ] })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { style: GRID_2_COL, children: [
+            /* @__PURE__ */ jsxs(
+              Field.Root,
+              {
+                hint: t(
+                  "settings.eventsDefaultCapacityHint",
+                  "Default seat capacity for newly created RSVP events."
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(Field.Label, { children: t("settings.eventsDefaultCapacity", "Default Event Capacity") }),
+                  /* @__PURE__ */ jsx(
+                    NumberInput,
+                    {
+                      value: eventsSettings.defaultCapacity || 100,
+                      onValueChange: (val) => onPatchEvents({
+                        defaultCapacity: val && val >= 1 ? val : 100
+                      })
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(Field.Hint, {})
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              Field.Root,
+              {
+                hint: t(
+                  "settings.eventsMaxGuestsHint",
+                  "Maximum seats a single RSVP submission may reserve."
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(Field.Label, { children: t("settings.eventsMaxGuests", "Max Guests per Registration") }),
+                  /* @__PURE__ */ jsx(
+                    NumberInput,
+                    {
+                      value: eventsSettings.defaultMaxGuestsPerRegistration || 5,
+                      onValueChange: (val) => onPatchEvents({
+                        defaultMaxGuestsPerRegistration: val && val >= 1 ? val : 5
+                      })
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(Field.Hint, {})
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { style: GRID_2_COL, children: [
+            /* @__PURE__ */ jsx(
+              SettingCheckboxCard,
+              {
+                checked: eventsSettings.waitlistEnabledByDefault,
+                onChange: (waitlistEnabledByDefault) => onPatchEvents({ waitlistEnabledByDefault }),
+                label: t(
+                  "settings.eventsWaitlist",
+                  "Enable Waitlist & Automatic Promotion"
+                ),
+                hint: t(
+                  "settings.eventsWaitlistHint",
+                  "Automatically promotes waitlisted attendees in FIFO order when a confirmed attendee cancels."
+                )
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              SettingCheckboxCard,
+              {
+                checked: eventsSettings.sendRsvpEmails,
+                onChange: (sendRsvpEmails) => onPatchEvents({ sendRsvpEmails }),
+                label: t(
+                  "settings.eventsSendEmails",
+                  "Send Confirmation & Waitlist Promotion Emails"
+                ),
+                hint: t(
+                  "settings.eventsSendEmailsHint",
+                  "Dispatches confirmation and waitlist promotion emails via the Strapi Email plugin."
+                )
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx(Divider, {}),
+          /* @__PURE__ */ jsxs("div", { style: GRID_2_COL, children: [
+            /* @__PURE__ */ jsxs(
+              Field.Root,
+              {
+                hint: t(
+                  "settings.defaultTimezoneHint",
+                  "IANA timezone identifier used for event recurrence and iCal exports."
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(Field.Label, { children: t("settings.defaultTimezone", "Events Timezone (IANA)") }),
+                  /* @__PURE__ */ jsx(
+                    TextInput,
+                    {
+                      value: eventsSettings.defaultTimezone || "UTC",
+                      onChange: (e) => onPatchEvents({ defaultTimezone: e.target.value })
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(Field.Hint, {})
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              Field.Root,
+              {
+                hint: t(
+                  "settings.eventsFeedTitleHint",
+                  "Calendar name shown when users subscribe in Google, Apple, or Outlook Calendar."
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(Field.Label, { children: t("settings.eventsFeedTitle", "Events iCal (.ics) Feed Title") }),
+                  /* @__PURE__ */ jsx(
+                    TextInput,
+                    {
+                      value: eventsSettings.feedTitle || "Organization — Events Calendar",
+                      onChange: (e) => onPatchEvents({ feedTitle: e.target.value })
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(Field.Hint, {})
+                ]
+              }
+            )
+          ] })
+        ] })
+      }
+    );
+  }
+  if (!bookingsSettings) {
+    return /* @__PURE__ */ jsx(
+      Box,
+      {
+        padding: 5,
+        background: "neutral0",
+        hasRadius: true,
+        shadow: "tableShadow",
+        style: CARD_STYLE,
+        children: /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral600", children: t(
+          "settings.bookingsUnavailable",
+          "Bookings & Availability plugin settings are loading or not installed."
+        ) })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      padding: 5,
+      background: "neutral0",
+      hasRadius: true,
+      shadow: "tableShadow",
+      style: CARD_STYLE,
+      children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 5, children: [
+        /* @__PURE__ */ jsxs(Box, { children: [
+          /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", tag: "h2", children: t(
+            "settings.bookingsHeading",
+            "Bookings, Slot Duration & Approval Workflow"
+          ) }),
+          /* @__PURE__ */ jsx(Box, { paddingTop: 1, children: /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: t(
+            "settings.bookingsHint",
+            "Configure default appointment slot durations, capacity limits, preparation buffers, lead times, and manual approval rules."
+          ) }) })
+        ] }),
+        /* @__PURE__ */ jsx("div", { style: GRID_3_COL, children: BOOKING_NUMBER_FIELDS.map((field) => /* @__PURE__ */ jsxs(
+          Field.Root,
+          {
+            hint: t(field.hintId, field.hintDefault),
+            children: [
+              /* @__PURE__ */ jsx(Field.Label, { children: t(field.labelId, field.labelDefault) }),
+              /* @__PURE__ */ jsx(
+                NumberInput,
+                {
+                  value: bookingsSettings[field.key],
+                  onValueChange: (v) => onPatchBookings({
+                    [field.key]: Math.max(
+                      field.min,
+                      Number(v ?? field.fallback)
+                    )
+                  })
+                }
+              ),
+              /* @__PURE__ */ jsx(Field.Hint, {})
+            ]
+          },
+          field.key
+        )) }),
+        /* @__PURE__ */ jsx(Divider, {}),
+        /* @__PURE__ */ jsxs("div", { style: GRID_2_COL, children: [
+          /* @__PURE__ */ jsx(
+            SettingCheckboxCard,
+            {
+              checked: bookingsSettings.defaultRequiresApproval,
+              onChange: (defaultRequiresApproval) => onPatchBookings({ defaultRequiresApproval }),
+              label: t(
+                "settings.bookingsRequiresApproval",
+                "Require Manual Admin Approval"
+              ),
+              hint: t(
+                "settings.bookingsRequiresApprovalHint",
+                "Places new visitor reservations in pending status until confirmed by staff."
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            SettingCheckboxCard,
+            {
+              checked: bookingsSettings.sendEmailNotifications,
+              onChange: (sendEmailNotifications) => onPatchBookings({ sendEmailNotifications }),
+              label: t(
+                "settings.bookingsSendEmails",
+                "Send Confirmation & Status Update Emails"
+              ),
+              hint: t(
+                "settings.bookingsSendEmailsHint",
+                "Automatically notifies visitors when their booking is created, approved, or rescheduled."
+              )
+            }
+          )
+        ] })
+      ] })
+    }
+  );
+};
+const SecondaryCalendarsSection = ({
+  t,
+  secondaryCalendars,
+  onAddOrUpdateCalendar,
+  onToggleCalendarEnabled,
+  onRemoveCalendar
+}) => {
+  const [isFormOpen, setIsFormOpen] = useState(true);
+  const [newCalPreset, setNewCalPreset] = useState("islamic-umalqura");
+  const [newCalId, setNewCalId] = useState("hijri");
+  const [newCalLabel, setNewCalLabel] = useState("Hijri (Umm al-Qura)");
+  const [newCalLocale, setNewCalLocale] = useState("local");
+  const [newCalOverrideField, setNewCalOverrideField] = useState("hijriDate");
+  const [newCalDayOffset, setNewCalDayOffset] = useState(0);
+  const handleEditCalendarSystem = (cal) => {
+    setNewCalPreset(cal.intlCalendar || "islamic-umalqura");
+    setNewCalId(cal.id || "hijri");
+    setNewCalLabel(cal.label || "Hijri (Umm al-Qura)");
+    setNewCalLocale(cal.locale || "local");
+    setNewCalOverrideField(cal.overrideField || "hijriDate");
+    setNewCalDayOffset(cal.dayOffset ?? 0);
+    setIsFormOpen(true);
+  };
+  const handleAddCalendarSystem = () => {
+    if (!newCalId.trim() || !newCalPreset) return;
+    const cleanId = newCalId.trim().toLowerCase().replace(/[^a-z0-9-_]/g, "");
+    if (!cleanId) return;
+    const nextEntry = {
+      id: cleanId,
+      label: newCalLabel.trim() || cleanId,
+      intlCalendar: newCalPreset,
+      locale: newCalLocale && newCalLocale !== "local" ? newCalLocale.trim() : void 0,
+      dayOffset: newCalDayOffset || 0,
+      overrideField: newCalOverrideField.trim() || void 0,
+      enabled: true
+    };
+    onAddOrUpdateCalendar(nextEntry);
+  };
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      padding: 5,
+      background: "neutral0",
+      hasRadius: true,
+      shadow: "tableShadow",
+      style: { border: "1px solid rgba(128, 128, 128, 0.22)" },
+      children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 4, children: [
+        /* @__PURE__ */ jsxs(
+          Flex,
+          {
+            justifyContent: "space-between",
+            alignItems: "flex-start",
+            wrap: "wrap",
+            gap: 3,
+            children: [
+              /* @__PURE__ */ jsxs(Box, { style: { flex: 1, minWidth: 280 }, children: [
+                /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", tag: "h2", children: t(
+                  "settings.section.secondaryCalendars",
+                  "Secondary & Alternative Calendar Systems (Intl / Custom)"
+                ) }),
+                /* @__PURE__ */ jsx(Box, { paddingTop: 1, children: /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: t(
+                  "settings.secondaryCalendarsHint",
+                  "Display optional secondary dates (such as Hijri Umm al-Qura) alongside Gregorian dates in day cells. Supports local language or Arabic script and moon-sighting day offsets (-2 to +2 days)."
+                ) }) })
+              ] }),
+              /* @__PURE__ */ jsxs(Flex, { gap: 2, alignItems: "center", children: [
+                /* @__PURE__ */ jsxs(Badge, { active: true, children: [
+                  secondaryCalendars.length,
+                  " ",
+                  t("settings.configuredCount", "Configured")
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: isFormOpen ? "tertiary" : "secondary",
+                    size: "S",
+                    onClick: () => setIsFormOpen((prev) => !prev),
+                    children: isFormOpen ? t("common.hideForm", "Hide Form") : `+ ${t("settings.addCalendar", "Add Calendar System")}`
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        secondaryCalendars.map((cal) => /* @__PURE__ */ jsx(
+          Box,
+          {
+            padding: 4,
+            background: "neutral100",
+            hasRadius: true,
+            style: {
+              border: "1px solid rgba(128, 128, 128, 0.18)",
+              borderLeft: "4px solid #0284C7"
+            },
+            children: /* @__PURE__ */ jsxs(
+              Flex,
+              {
+                justifyContent: "space-between",
+                alignItems: "center",
+                wrap: "wrap",
+                gap: 3,
+                children: [
+                  /* @__PURE__ */ jsxs(Flex, { gap: 2, alignItems: "center", wrap: "wrap", children: [
+                    /* @__PURE__ */ jsx(Typography, { variant: "omega", fontWeight: "bold", children: cal.label }),
+                    /* @__PURE__ */ jsx(Badge, { backgroundColor: "secondary100", textColor: "secondary700", children: cal.intlCalendar }),
+                    /* @__PURE__ */ jsx(Badge, { backgroundColor: "primary100", textColor: "primary700", children: cal.locale === "ar" || cal.locale === "ar-SA" ? t(
+                      "settings.badge.arabicScript",
+                      "Arabic Script (العربية)"
+                    ) : t("settings.badge.localLanguage", "Local Language") }),
+                    cal.overrideField && /* @__PURE__ */ jsxs(Badge, { backgroundColor: "neutral200", textColor: "neutral800", children: [
+                      t("settings.badge.overrideField", "Override field"),
+                      ":",
+                      " ",
+                      cal.overrideField
+                    ] }),
+                    /* @__PURE__ */ jsxs(Badge, { backgroundColor: "warning100", textColor: "warning700", children: [
+                      t("settings.badge.offset", "Offset"),
+                      ":",
+                      " ",
+                      (cal.dayOffset ?? 0) > 0 ? `+${cal.dayOffset}` : cal.dayOffset ?? 0,
+                      "d"
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxs(Flex, { gap: 3, alignItems: "center", children: [
+                    /* @__PURE__ */ jsx(
+                      Checkbox,
+                      {
+                        checked: cal.enabled,
+                        onCheckedChange: (checked) => onToggleCalendarEnabled(cal.id, Boolean(checked)),
+                        children: t("settings.calendarEnabled", "Enabled")
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        variant: "tertiary",
+                        size: "S",
+                        onClick: () => handleEditCalendarSystem(cal),
+                        children: t("common.edit", "Edit")
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        variant: "danger-light",
+                        size: "S",
+                        onClick: () => onRemoveCalendar(cal.id),
+                        children: t("common.remove", "Remove")
+                      }
+                    )
+                  ] })
+                ]
+              }
+            )
+          },
+          cal.id
+        )),
+        isFormOpen && /* @__PURE__ */ jsx(
+          Box,
+          {
+            padding: 5,
+            background: "neutral100",
+            hasRadius: true,
+            style: { border: "1px solid rgba(128, 128, 128, 0.18)" },
+            children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 4, children: [
+              /* @__PURE__ */ jsx(Typography, { variant: "sigma", textColor: "neutral700", children: t(
+                "settings.configureCalendarTitle",
+                "Configure Secondary Calendar System"
+              ) }),
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "grid",
+                    gridTemplateColumns: "repeat(3, minmax(0, 1fr))",
+                    gap: 16
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxs(
+                      Field.Root,
+                      {
+                        hint: t(
+                          "settings.calendarPresetHint",
+                          "Unicode CLDR calendar identifier used by Intl.DateTimeFormat."
+                        ),
+                        children: [
+                          /* @__PURE__ */ jsx(Field.Label, { children: t("settings.calendarPreset", "Calendar System (CLDR)") }),
+                          /* @__PURE__ */ jsx(
+                            SingleSelect,
+                            {
+                              placeholder: t(
+                                "settings.calendarPreset.placeholder",
+                                "Select CLDR calendar system"
+                              ),
+                              value: newCalPreset || "islamic-umalqura",
+                              onChange: (val) => {
+                                const strVal = String(val);
+                                setNewCalPreset(strVal);
+                                const match = SUPPORTED_INTL_CALENDARS.find(
+                                  (c) => c.intlCalendar === strVal
+                                );
+                                if (match) {
+                                  setNewCalId(match.id.split("-")[0]);
+                                  setNewCalLabel(match.defaultLabel);
+                                }
+                              },
+                              children: SUPPORTED_INTL_CALENDARS.filter(
+                                (c) => c.id !== "gregory"
+                              ).map((cal) => /* @__PURE__ */ jsxs(SingleSelectOption, { value: cal.intlCalendar, children: [
+                                cal.defaultLabel,
+                                " (",
+                                cal.intlCalendar,
+                                ")"
+                              ] }, cal.id))
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(Field.Hint, {})
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      Field.Root,
+                      {
+                        hint: t(
+                          "settings.calendarIdHint",
+                          "Unique slug key for this calendar overlay."
+                        ),
+                        children: [
+                          /* @__PURE__ */ jsx(Field.Label, { children: t("settings.calendarId", "ID Key") }),
+                          /* @__PURE__ */ jsx(
+                            TextInput,
+                            {
+                              value: newCalId,
+                              onChange: (e) => setNewCalId(e.target.value),
+                              placeholder: t(
+                                "settings.calendarId.placeholder",
+                                "e.g., hijri"
+                              )
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(Field.Hint, {})
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      Field.Root,
+                      {
+                        hint: t(
+                          "settings.calendarLabelHint",
+                          "Badge label displayed in calendar headers and tooltips."
+                        ),
+                        children: [
+                          /* @__PURE__ */ jsx(Field.Label, { children: t("settings.calendarLabel", "Display Label") }),
+                          /* @__PURE__ */ jsx(
+                            TextInput,
+                            {
+                              value: newCalLabel,
+                              onChange: (e) => setNewCalLabel(e.target.value),
+                              placeholder: t(
+                                "settings.calendarLabel.placeholder",
+                                "e.g., Hijri (Umm al-Qura)"
+                              )
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(Field.Hint, {})
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      Field.Root,
+                      {
+                        hint: t(
+                          "settings.calendarScriptHint",
+                          "Locale used to render month names and numerals."
+                        ),
+                        children: [
+                          /* @__PURE__ */ jsx(Field.Label, { children: t("settings.calendarScript", "Language / Script Override") }),
+                          /* @__PURE__ */ jsxs(
+                            SingleSelect,
+                            {
+                              placeholder: t(
+                                "settings.calendarScript.placeholder",
+                                "Select script override"
+                              ),
+                              value: newCalLocale || "local",
+                              onChange: (val) => {
+                                setNewCalLocale(String(val));
+                              },
+                              children: [
+                                /* @__PURE__ */ jsx(SingleSelectOption, { value: "local", children: t(
+                                  "settings.calendarScript.local",
+                                  "Follow Calendar Language (Local)"
+                                ) }),
+                                /* @__PURE__ */ jsx(SingleSelectOption, { value: "ar-SA", children: t(
+                                  "settings.calendarScript.ar",
+                                  "Arabic Script — العربية (ar-SA)"
+                                ) }),
+                                /* @__PURE__ */ jsx(SingleSelectOption, { value: "es", children: t("settings.calendarScript.es", "Español (es)") }),
+                                /* @__PURE__ */ jsx(SingleSelectOption, { value: "en", children: t("settings.calendarScript.en", "English (en)") })
+                              ]
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(Field.Hint, {})
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      Field.Root,
+                      {
+                        hint: t(
+                          "settings.overrideFieldHint",
+                          "Optional entry field that overrides calculated dates."
+                        ),
+                        children: [
+                          /* @__PURE__ */ jsx(Field.Label, { children: t("settings.overrideField", "Document Override Field") }),
+                          /* @__PURE__ */ jsx(
+                            TextInput,
+                            {
+                              value: newCalOverrideField,
+                              onChange: (e) => setNewCalOverrideField(e.target.value),
+                              placeholder: t(
+                                "settings.overrideField.placeholder",
+                                "e.g., hijriDate"
+                              )
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(Field.Hint, {})
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      Field.Root,
+                      {
+                        hint: t(
+                          "settings.dayOffsetHint",
+                          "Moon-sighting adjustment in days (-2 to +2)."
+                        ),
+                        children: [
+                          /* @__PURE__ */ jsx(Field.Label, { children: t("settings.dayOffset", "Lunar Day Offset (-2 to +2)") }),
+                          /* @__PURE__ */ jsx(
+                            NumberInput,
+                            {
+                              placeholder: t("settings.dayOffset.placeholder", "e.g., 0"),
+                              value: newCalDayOffset,
+                              onValueChange: (val) => setNewCalDayOffset(typeof val === "number" ? val : 0)
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(Field.Hint, {})
+                        ]
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx(Flex, { justifyContent: "flex-end", gap: 2, children: /* @__PURE__ */ jsxs(Button, { variant: "default", onClick: handleAddCalendarSystem, children: [
+                "+ ",
+                t("settings.saveCalendar", "Save Calendar System")
+              ] }) })
+            ] })
+          }
+        )
+      ] })
+    }
+  );
+};
+const SettingsPage = () => {
+  const { formatMessage } = useIntl();
+  const { get, put, post } = useFetchClient();
+  const t = (id, defaultMessage) => formatMessage({ id: `${PLUGIN_ID}.${id}`, defaultMessage });
+  const [settings, setSettings] = useState(null);
+  const [contentTypes, setContentTypes] = useState([]);
+  const [eventsSettings, setEventsSettings] = useState(null);
+  const [bookingsSettings, setBookingsSettings] = useState(null);
+  const [saving, setSaving] = useState(false);
+  const [savedBanner, setSavedBanner] = useState(null);
+  const [bannerIsError, setBannerIsError] = useState(false);
+  useEffect(() => {
+    Promise.all([
+      get(`/${PLUGIN_ID}/settings`),
+      get(`/${PLUGIN_ID}/content-types`),
+      get(
+        "/events/settings"
+      ).catch(() => null),
+      get(
+        "/bookings/settings"
+      ).catch(() => null)
+    ]).then(([settingsRes, ctRes, eventsRes, bookingsRes]) => {
+      if (settingsRes?.data?.data) {
+        setSettings(settingsRes.data.data);
+      }
+      if (Array.isArray(ctRes?.data?.data)) {
+        setContentTypes(ctRes.data.data);
+      }
+      if (eventsRes?.data?.data) {
+        setEventsSettings(eventsRes.data.data);
+      }
+      if (bookingsRes?.data?.data) {
+        setBookingsSettings(bookingsRes.data.data);
+      }
+    }).catch(() => {
+    });
+  }, [get]);
+  const handleSave = async () => {
+    if (!settings) return;
+    setSaving(true);
+    setSavedBanner(null);
+    setBannerIsError(false);
+    try {
+      let companionFailed = false;
+      const [res, eventsRes, bookingsRes] = await Promise.all([
+        put(`/${PLUGIN_ID}/settings`, settings),
+        eventsSettings ? put(
+          "/events/settings",
+          eventsSettings
+        ).catch(() => {
+          companionFailed = true;
+          return null;
+        }) : Promise.resolve(null),
+        bookingsSettings ? put(
+          "/bookings/settings",
+          bookingsSettings
+        ).catch(() => {
+          companionFailed = true;
+          return null;
+        }) : Promise.resolve(null)
+      ]);
+      if (res?.data?.data) {
+        setSettings(res.data.data);
+      }
+      if (eventsRes?.data?.data) {
+        setEventsSettings(eventsRes.data.data);
+      }
+      if (bookingsRes?.data?.data) {
+        setBookingsSettings(bookingsRes.data.data);
+      }
+      if (companionFailed) {
+        setBannerIsError(true);
+        setSavedBanner(
+          t(
+            "settings.savedPartial",
+            "Calendar settings saved, but companion plugin settings could not be updated."
+          )
+        );
+      } else {
+        setSavedBanner(
+          t(
+            "settings.saved",
+            "Calendar, Events, and Bookings settings saved successfully."
+          )
+        );
+      }
+    } catch {
+      setBannerIsError(true);
+      setSavedBanner(t("settings.error", "Could not save settings."));
+    } finally {
+      setSaving(false);
+    }
+  };
+  const handleResetSettings = async () => {
+    setSaving(true);
+    setBannerIsError(false);
+    try {
+      const res = await post(
+        `/${PLUGIN_ID}/clear-settings`,
+        {}
+      );
+      if (res?.data?.data) {
+        setSettings(res.data.data);
+      }
+      setSavedBanner(t("settings.resetSuccess", "Settings reset to defaults."));
+    } catch {
+      setBannerIsError(true);
+      setSavedBanner(t("settings.error", "Could not reset settings."));
+    } finally {
+      setSaving(false);
+    }
+  };
+  const handleAddOrUpdateSource = (nextSource) => {
+    if (!settings) return;
+    const existing = settings.sources ?? [];
+    const updated = existing.some(
+      (s) => s.id === nextSource.id || s.uid === nextSource.uid
+    ) ? existing.map(
+      (s) => s.id === nextSource.id || s.uid === nextSource.uid ? nextSource : s
+    ) : [...existing, nextSource];
+    setSettings({
+      ...settings,
+      sources: updated
+    });
+  };
+  const toggleSourceEnabled = (sourceId, enabled) => {
+    if (!settings) return;
+    setSettings({
+      ...settings,
+      sources: settings.sources.map(
+        (src) => src.id === sourceId ? { ...src, enabled } : src
+      )
+    });
+  };
+  const removeSource = (sourceId) => {
+    if (!settings) return;
+    setSettings({
+      ...settings,
+      sources: settings.sources.filter((src) => src.id !== sourceId)
+    });
+  };
+  const handleAddOrUpdateCalendar = (nextEntry) => {
+    if (!settings) return;
+    const existing = settings.secondaryCalendars ?? [];
+    const nextList = existing.some((c) => c.id === nextEntry.id) ? existing.map((c) => c.id === nextEntry.id ? nextEntry : c) : [...existing, nextEntry];
+    setSettings({
+      ...settings,
+      secondaryCalendars: nextList
+    });
+  };
+  const toggleCalendarEnabled = (calId, enabled) => {
+    if (!settings) return;
+    setSettings({
+      ...settings,
+      secondaryCalendars: (settings.secondaryCalendars ?? []).map(
+        (cal) => cal.id === calId ? { ...cal, enabled } : cal
+      )
+    });
+  };
+  const removeCalendarSystem = (calId) => {
+    if (!settings) return;
+    setSettings({
+      ...settings,
+      secondaryCalendars: (settings.secondaryCalendars ?? []).filter(
+        (cal) => cal.id !== calId
+      )
+    });
+  };
+  if (!settings) {
+    return /* @__PURE__ */ jsx(Layouts.Root, { children: /* @__PURE__ */ jsx(Layouts.Content, { children: /* @__PURE__ */ jsx(Box, { padding: 6, children: /* @__PURE__ */ jsx(Typography, { variant: "omega", children: t("settings.loading", "Loading Calendar settings...") }) }) }) });
+  }
+  return /* @__PURE__ */ jsxs(Layouts.Root, { children: [
+    /* @__PURE__ */ jsx(
+      Layouts.Header,
+      {
+        title: t("settings.title", "Calendar, Events & Bookings Settings"),
+        subtitle: t(
+          "settings.subtitle",
+          "Configure visual themes, primary local language, Arabic/Hijri calendar overlay, collection sources, RSVP event rules, and booking slot policies."
+        ),
+        primaryAction: /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
+          /* @__PURE__ */ jsx(Button, { variant: "tertiary", onClick: handleResetSettings, children: t("settings.reset", "Reset Defaults") }),
+          /* @__PURE__ */ jsx(Button, { variant: "default", loading: saving, onClick: handleSave, children: t("common.save", "Save Settings") })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsx(Layouts.Content, { children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 4, children: [
+      savedBanner && /* @__PURE__ */ jsx(
+        Box,
+        {
+          padding: 3,
+          background: bannerIsError ? "danger100" : "success100",
+          hasRadius: true,
+          children: /* @__PURE__ */ jsx(
+            Typography,
+            {
+              variant: "omega",
+              fontWeight: "bold",
+              textColor: bannerIsError ? "danger700" : "success700",
+              children: savedBanner
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ jsxs(Tabs.Root, { defaultValue: "theme", children: [
+        /* @__PURE__ */ jsxs(
+          Tabs.List,
+          {
+            "aria-label": t(
+              "settings.title",
+              "Calendar, Events & Bookings Settings"
+            ),
+            children: [
+              /* @__PURE__ */ jsx(Tabs.Trigger, { value: "theme", children: t("settings.tab.theme", "Theme & Appearance") }),
+              /* @__PURE__ */ jsx(Tabs.Trigger, { value: "general", children: t("settings.tab.general", "General & Views") }),
+              /* @__PURE__ */ jsxs(Tabs.Trigger, { value: "sources", children: [
+                t("settings.tab.sources", "Collection Sources"),
+                " (",
+                settings.sources?.length ?? 0,
+                ")"
+              ] }),
+              /* @__PURE__ */ jsxs(Tabs.Trigger, { value: "secondary", children: [
+                t("settings.tab.secondaryCalendars", "Secondary Calendars"),
+                " (",
+                settings.secondaryCalendars?.length ?? 0,
+                ")"
+              ] }),
+              /* @__PURE__ */ jsx(Tabs.Trigger, { value: "events", children: t("settings.tab.events", "Events & RSVPs") }),
+              /* @__PURE__ */ jsx(Tabs.Trigger, { value: "bookings", children: t("settings.tab.bookings", "Bookings & Availability") })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(Tabs.Content, { value: "theme", children: /* @__PURE__ */ jsx(
+          CalendarViewsSection,
+          {
+            mode: "theme",
+            t,
+            settings,
+            onPatchSettings: (patch) => setSettings({ ...settings, ...patch })
+          }
+        ) }),
+        /* @__PURE__ */ jsx(Tabs.Content, { value: "general", children: /* @__PURE__ */ jsx(
+          CalendarViewsSection,
+          {
+            mode: "general",
+            t,
+            settings,
+            onPatchSettings: (patch) => setSettings({ ...settings, ...patch })
+          }
+        ) }),
+        /* @__PURE__ */ jsx(Tabs.Content, { value: "sources", children: /* @__PURE__ */ jsx(
+          CollectionSourcesSection,
+          {
+            t,
+            sources: settings.sources,
+            contentTypes,
+            onAddOrUpdateSource: handleAddOrUpdateSource,
+            onToggleSourceEnabled: toggleSourceEnabled,
+            onRemoveSource: removeSource
+          }
+        ) }),
+        /* @__PURE__ */ jsx(Tabs.Content, { value: "secondary", children: /* @__PURE__ */ jsx(
+          SecondaryCalendarsSection,
+          {
+            t,
+            secondaryCalendars: settings.secondaryCalendars ?? [],
+            onAddOrUpdateCalendar: handleAddOrUpdateCalendar,
+            onToggleCalendarEnabled: toggleCalendarEnabled,
+            onRemoveCalendar: removeCalendarSystem
+          }
+        ) }),
+        /* @__PURE__ */ jsx(Tabs.Content, { value: "events", children: /* @__PURE__ */ jsx(
+          CompanionSuiteSettingsSection,
+          {
+            mode: "events",
+            t,
+            eventsSettings,
+            bookingsSettings,
+            onPatchEvents: (patch) => eventsSettings && setEventsSettings({ ...eventsSettings, ...patch }),
+            onPatchBookings: (patch) => bookingsSettings && setBookingsSettings({ ...bookingsSettings, ...patch })
+          }
+        ) }),
+        /* @__PURE__ */ jsx(Tabs.Content, { value: "bookings", children: /* @__PURE__ */ jsx(
+          CompanionSuiteSettingsSection,
+          {
+            mode: "bookings",
+            t,
+            eventsSettings,
+            bookingsSettings,
+            onPatchEvents: (patch) => eventsSettings && setEventsSettings({ ...eventsSettings, ...patch }),
+            onPatchBookings: (patch) => bookingsSettings && setBookingsSettings({ ...bookingsSettings, ...patch })
+          }
+        ) })
+      ] })
+    ] }) })
+  ] });
+};
+export {
+  SettingsPage
+};