@servicetitan/dte-unlayer 0.158.0 → 0.159.0

package/dist/vendor/dte-shared/styles/schedule.css

@@ -0,0 +1,19 @@
+.dte-business-calendar-section {
+    margin-top: var(--spacing-2);
+    padding-top: var(--spacing-2);
+    border-top: 1px solid var(--border-color);
+}
+
+.dte-business-calendar-preview {
+    padding: var(--spacing-1);
+    border: 1px solid var(--border-color);
+    border-radius: 8px;
+}
+
+.dte-business-calendar-preview-header {
+    cursor: pointer;
+}
+
+.dte-business-calendar-preview-content {
+    margin-top: var(--spacing-1);
+}

package/dist/vendor/dte-shared/types.d.ts

@@ -0,0 +1,129 @@
+/** A weekend day excluded by a business-day schedule, as `Date.getUTCDay()` numbers them. */
+export type WeekendDay = 0 | 6;
+/** A known holiday a tenant can exclude, from DTE's catalog (`GET api/holidays/catalog`). */
+export interface KnownHoliday {
+    /** Stable code stored in a schedule's `knownHolidays`, e.g. `JULY4`. */
+    code: string;
+    /** Name to show, e.g. "Independence Day". */
+    displayName: string;
+    /** When it falls, e.g. "July 4" or "4th Thursday of November". */
+    rule: string;
+}
+/** The known holidays a tenant can exclude, for the schedule editor's checklist. */
+export interface HolidayCatalog {
+    /** The jurisdiction the holidays belong to, e.g. "US" or a US state code. */
+    jurisdiction: string;
+    holidays: KnownHoliday[];
+}
+/** The rules of a business-day schedule: which days a date calculation skips. */
+export interface BusinessCalendarRules {
+    weekendDays: WeekendDay[];
+    /** Codes of excluded holidays from the jurisdiction's catalog (`KnownHoliday.code`). */
+    knownHolidays: string[];
+    /** Extra excluded days as `MM-DD`, repeating every year, e.g. `12-24`. */
+    customDates: string[];
+}
+/** A schedule a tenant can pick for a business-day calculation (DTE's `GET api/holidays/schedules`). */
+export interface BusinessDaySchedule {
+    /** Identifier of a tenant schedule; undefined for the read-only default schedule. */
+    id?: number;
+    name: string;
+    /** Whether this is the read-only default schedule of the tenant's jurisdiction. */
+    isDefault: boolean;
+    calendar: BusinessCalendarRules;
+}
+/**
+ * Request to create a tenant business-day schedule (DTE's `POST api/holidays/schedules`). Always
+ * creates a new schedule — editing a selected one does not overwrite it.
+ */
+export interface SaveScheduleRequest extends BusinessCalendarRules {
+    /** Display name, unique per tenant ignoring case, max 255 characters, and not "Default". */
+    name: string;
+}
+/**
+ * A date calculated field whose custom business-day exclusion toggle is on, and the schedule it
+ * uses (DTE's bindings, full-replace via `PUT api/holidays/templates/{id}/bindings`). A field with
+ * no entry has the toggle off; what that means for its date arithmetic is up to the editor.
+ */
+export interface FieldScheduleBinding {
+    /** The field's key: `PdfField.id` in BYOD, the tool's instance id (`values.id`) in Unlayer. */
+    fieldKey: string;
+    /** One of the tenant's schedules, or undefined for the default schedule. */
+    scheduleId?: number;
+}
+/**
+ * The business-day schedule props an editor (`PdfEditor`, `UnlayerEditor`) takes from its host,
+ * with the same names and meaning in every editor. The editor builds each field's
+ * `ScheduleEditorContext` from them (`useFieldScheduleEditorContext`).
+ */
+export interface BusinessCalendarHostProps {
+    /**
+     * Date calculated fields whose custom business-day exclusion toggle is on, and the schedule
+     * each uses. Also drives the toggle/picker of the field being edited.
+     */
+    scheduleBindings?: FieldScheduleBinding[];
+    /** The tenant's known holidays, for the schedule editor's checklist. */
+    holidayCatalog?: HolidayCatalog;
+    holidayCatalogLoading?: boolean;
+    holidayCatalogError?: string;
+    /** The schedules the tenant can pick from the schedule picker. */
+    schedules?: BusinessDaySchedule[];
+    schedulesLoading?: boolean;
+    schedulesError?: string;
+    /**
+     * Called with the complete desired `scheduleBindings` whenever the toggle, the schedule picker
+     * or a schedule delete changes them (full replacement, mirroring DTE's
+     * `PUT api/holidays/templates/{id}/bindings`). The editor does not persist them itself.
+     */
+    onScheduleBindingsChange?(bindings: FieldScheduleBinding[]): void;
+    /**
+     * Creates a tenant schedule from the "Create New Schedule" drawer. Always creates a new
+     * schedule — it never overwrites a selected one. On success the created schedule is selected
+     * in the picker. A rejected promise's `message` is shown as the drawer's error (for example a
+     * duplicate-name conflict).
+     */
+    onCreateSchedule?(request: SaveScheduleRequest): Promise<BusinessDaySchedule>;
+    /**
+     * Replaces a tenant schedule's name and rules in place, from the picker's "Edit" action (DTE's
+     * `PUT api/holidays/schedules/{id}`). On success the updated schedule stays selected.
+     */
+    onUpdateSchedule?(id: number, request: SaveScheduleRequest): Promise<BusinessDaySchedule>;
+    /**
+     * Permanently deletes a tenant schedule, from the picker's "Delete" action (DTE's
+     * `DELETE api/holidays/schedules/{id}`). On success every field bound to it moves to the
+     * default schedule (toggle still on) through `onScheduleBindingsChange`, as DTE falls back to
+     * the default schedule for a deleted one.
+     */
+    onDeleteSchedule?(id: number): Promise<void>;
+}
+/**
+ * Prop bundle for the business-calendar toggle/picker/drawer, built by a host package (currently
+ * `@servicetitan/dte-pdf-editor` and `@servicetitan/dte-unlayer`) from whatever it uses to track
+ * which of its own fields have the toggle on and which schedule each uses — this package has no
+ * opinion on that part, only on the schedule CRUD and the UI built from it.
+ */
+export interface ScheduleEditorContext {
+    /** Whether the current field's custom business-day exclusion toggle is on. */
+    enabled: boolean;
+    /** The current field's bound schedule id, or undefined for the default schedule. */
+    selectedScheduleId?: number;
+    holidayCatalog?: HolidayCatalog;
+    holidayCatalogLoading?: boolean;
+    holidayCatalogError?: string;
+    schedules?: BusinessDaySchedule[];
+    schedulesLoading?: boolean;
+    schedulesError?: string;
+    /**
+     * When set, the schedule form ("Create New Schedule" / "Edit Schedule") is rendered into this
+     * element through a portal instead of opening in a drawer. The host owns the element and decides
+     * how it is shown; leave it unset (or null, before the element exists) for the drawer.
+     */
+    editorContainer?: HTMLElement | null;
+    onToggle(enabled: boolean): void;
+    onSelectSchedule(scheduleId: number | undefined): void;
+    onCreateSchedule?(request: SaveScheduleRequest): Promise<BusinessDaySchedule>;
+    /** Replaces a tenant schedule's name and rules in place (DTE's `PUT api/holidays/schedules/{id}`). */
+    onUpdateSchedule?(id: number, request: SaveScheduleRequest): Promise<BusinessDaySchedule>;
+    /** Permanently deletes a tenant schedule; fields bound to it fall back to the default schedule. */
+    onDeleteSchedule?(id: number): Promise<void>;
+}

package/dist/vendor/dte-shared/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@servicetitan/dte-unlayer",
-  "version": "0.158.0",
+  "version": "0.159.0",
   "description": "",
   "main": "./dist/index.js",
   "typings": "./dist/index.d.ts",
@@ -12,9 +12,15 @@
     "access": "public",
     "registry": "https://registry.npmjs.org"
   },
+  "scripts": {
+    "build": "npm run build --prefix ../shared && tsc --build && startup prepare-package && node ../shared/scripts/bundle-shared.mjs"
+  },
   "cli": {
     "webpack": false
   },
+  "devDependencies": {
+    "@servicetitan/dte-shared": "^0.0.1"
+  },
   "peerDependencies": {
     "@servicetitan/anvil2": "^3.7.1"
   }

package/src/__tests__/business-calendar-drawer.test.tsx

@@ -0,0 +1,183 @@
+import type { BusinessCalendarHostProps, BusinessDaySchedule } from '@servicetitan/dte-shared';
+import { act } from 'react';
+import { createRoot, type Root } from 'react-dom/client';
+import { TextDecoder, TextEncoder } from 'util';
+
+// Anvil2 needs these in jsdom: text encoding at import time, the rest when it renders.
+Object.assign(globalThis, { TextDecoder, TextEncoder });
+(globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true;
+globalThis.ResizeObserver ??= class {
+    observe() {}
+    unobserve() {}
+    disconnect() {}
+} as unknown as typeof ResizeObserver;
+window.matchMedia ??= ((query: string) => ({
+    matches: false,
+    media: query,
+    onchange: null,
+    addListener: () => undefined,
+    removeListener: () => undefined,
+    addEventListener: () => undefined,
+    removeEventListener: () => undefined,
+    dispatchEvent: () => false,
+})) as typeof window.matchMedia;
+Object.assign(HTMLElement.prototype, {
+    showPopover() {},
+    hidePopover() {},
+    togglePopover() {},
+});
+Object.assign(HTMLDialogElement.prototype, {
+    showModal(this: HTMLDialogElement) {
+        this.setAttribute('open', '');
+    },
+    close(this: HTMLDialogElement) {
+        this.removeAttribute('open');
+    },
+});
+
+// eslint-disable-next-line @typescript-eslint/no-require-imports
+const { BusinessCalendarDrawer } =
+    require('../business-calendar/BusinessCalendarDrawer') as typeof import('../business-calendar/BusinessCalendarDrawer');
+
+const defaultSchedule: BusinessDaySchedule = {
+    name: 'Weekends and US Federal Holidays',
+    isDefault: true,
+    calendar: { weekendDays: [0, 6], knownHolidays: ['JULY4'], customDates: [] },
+};
+const sundaysOnly: BusinessDaySchedule = {
+    id: 7,
+    name: 'Sundays only',
+    isDefault: false,
+    calendar: { weekendDays: [0], knownHolidays: [], customDates: [] },
+};
+
+describe('BusinessCalendarDrawer (the drawer Unlayer opens from a field)', () => {
+    let container: HTMLDivElement;
+    let root: Root;
+
+    const host = (
+        overrides: Partial<BusinessCalendarHostProps> = {},
+    ): BusinessCalendarHostProps => ({
+        holidayCatalog: {
+            jurisdiction: 'US',
+            holidays: [{ code: 'JULY4', displayName: 'Independence Day', rule: 'July 4' }],
+        },
+        schedules: [defaultSchedule, sundaysOnly],
+        scheduleBindings: [{ fieldKey: 'field-a' }],
+        onScheduleBindingsChange: jest.fn(),
+        onCreateSchedule: jest.fn(async request => ({
+            id: 8,
+            name: request.name,
+            isDefault: false,
+            calendar: request,
+        })),
+        onUpdateSchedule: jest.fn(async (id, request) => ({
+            id,
+            name: request.name,
+            isDefault: false,
+            calendar: request,
+        })),
+        ...overrides,
+    });
+
+    const typeInto = (input: HTMLInputElement, value: string) =>
+        act(() => {
+            Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')!.set!.call(
+                input,
+                value,
+            );
+            input.dispatchEvent(new Event('input', { bubbles: true }));
+        });
+    const button = (text: string) =>
+        Array.from(document.body.querySelectorAll('button')).find(
+            b => b.textContent?.trim() === text,
+        )!;
+
+    beforeEach(() => {
+        container = document.createElement('div');
+        document.body.appendChild(container);
+        root = createRoot(container);
+    });
+
+    afterEach(() => {
+        act(() => root.unmount());
+        document.body.innerHTML = '';
+    });
+
+    test('HD-01 creates a schedule from the default rules and selects it for the field', async () => {
+        const props = host();
+        const onClose = jest.fn();
+        act(() =>
+            root.render(
+                <BusinessCalendarDrawer
+                    request={{ fieldKey: 'field-a' }}
+                    host={props}
+                    onClose={onClose}
+                />,
+            ),
+        );
+
+        expect(document.body.textContent).toContain('Create New Schedule');
+        typeInto(document.body.querySelector<HTMLInputElement>('input')!, 'Sundays and July 4');
+        act(() => button('Saturday').click());
+        await act(async () => {
+            button('Create').click();
+        });
+
+        expect(props.onCreateSchedule).toHaveBeenCalledWith({
+            name: 'Sundays and July 4',
+            weekendDays: [0],
+            knownHolidays: ['JULY4'],
+            customDates: [],
+        });
+        expect(props.onScheduleBindingsChange).toHaveBeenLastCalledWith([
+            { fieldKey: 'field-a', scheduleId: 8 },
+        ]);
+        expect(onClose).toHaveBeenCalled();
+    });
+
+    test('HD-02 edits the requested schedule in place and keeps it selected', async () => {
+        const props = host({ scheduleBindings: [{ fieldKey: 'field-a', scheduleId: 7 }] });
+        act(() =>
+            root.render(
+                <BusinessCalendarDrawer
+                    request={{ fieldKey: 'field-a', scheduleId: 7 }}
+                    host={props}
+                    onClose={jest.fn()}
+                />,
+            ),
+        );
+
+        expect(document.body.textContent).toContain('Edit Schedule');
+        expect(document.body.querySelector<HTMLInputElement>('input')!.value).toBe('Sundays only');
+        await act(async () => {
+            button('Save').click();
+        });
+
+        expect(props.onUpdateSchedule).toHaveBeenCalledWith(7, {
+            name: 'Sundays only',
+            weekendDays: [0],
+            knownHolidays: [],
+            customDates: [],
+        });
+        // Still the field's schedule, so its binding stays as it is: nothing to resend.
+        expect(props.onScheduleBindingsChange).not.toHaveBeenCalled();
+    });
+
+    test('HD-03 closes without showing anything when the schedule to edit was deleted meanwhile', () => {
+        const onClose = jest.fn();
+        act(() =>
+            root.render(
+                <BusinessCalendarDrawer
+                    request={{ fieldKey: 'field-a', scheduleId: 99 }}
+                    host={host()}
+                    onClose={onClose}
+                />,
+            ),
+        );
+
+        expect(document.body.textContent).not.toContain('Create New Schedule');
+        expect(document.body.textContent).not.toContain('Edit Schedule');
+        expect(onClose).toHaveBeenCalledTimes(1);
+    });
+});

package/src/__tests__/business-calendar-requests.test.ts

@@ -0,0 +1,166 @@
+import type { BusinessCalendarHostProps, FieldScheduleBinding } from '@servicetitan/dte-shared';
+import { TextDecoder, TextEncoder } from 'util';
+import type { BusinessCalendarRequestHandlerDeps } from '../business-calendar/business-calendar-requests';
+
+// `@servicetitan/dte-shared` loads Anvil2, which needs these at import time (jsdom has neither).
+Object.assign(globalThis, { TextDecoder, TextEncoder });
+
+// eslint-disable-next-line @typescript-eslint/no-require-imports
+const { createBusinessCalendarRequestHandler } =
+    require('../business-calendar/business-calendar-requests') as typeof import('../business-calendar/business-calendar-requests');
+
+const SUNDAYS_ONLY = {
+    id: 7,
+    name: 'Sundays only',
+    isDefault: false,
+    calendar: { weekendDays: [0 as const], knownHolidays: [], customDates: [] },
+};
+
+/**
+ * A handler over bindings kept the way a host keeps them, plus what it asked the editor to do.
+ * The host lists schedule 7 unless `host` says otherwise.
+ */
+const setup = (initial: FieldScheduleBinding[], host: BusinessCalendarHostProps = {}) => {
+    let current = initial;
+    const deps: BusinessCalendarRequestHandlerDeps = {
+        getHost: () => ({ schedules: [SUNDAYS_ONLY], ...host, scheduleBindings: current }),
+        bindings: {
+            get: () => current,
+            set: next => {
+                current = next;
+            },
+        },
+        openDrawer: jest.fn(),
+        sendResult: jest.fn(),
+    };
+    return { deps, handle: createBusinessCalendarRequestHandler(deps), current: () => current };
+};
+
+/** Lets the delete's promise callbacks run. */
+const flush = () => new Promise(resolve => setTimeout(resolve, 0));
+
+describe('createBusinessCalendarRequestHandler', () => {
+    test('toggling on and off changes only that field, as in BYOD', () => {
+        const { current, handle } = setup([{ fieldKey: 'other', scheduleId: 3 }]);
+
+        handle({ action: 'toggle', fieldKey: 'field-a', enabled: true });
+        expect(current()).toEqual([{ fieldKey: 'other', scheduleId: 3 }, { fieldKey: 'field-a' }]);
+
+        handle({ action: 'toggle', fieldKey: 'field-a', enabled: false });
+        expect(current()).toEqual([{ fieldKey: 'other', scheduleId: 3 }]);
+    });
+
+    test("selecting a schedule sets the field's binding", () => {
+        const { current, handle } = setup([{ fieldKey: 'field-a' }]);
+
+        handle({ action: 'select', fieldKey: 'field-a', scheduleId: 7 });
+
+        expect(current()).toEqual([{ fieldKey: 'field-a', scheduleId: 7 }]);
+    });
+
+    test('opens the drawer for a new schedule or the one to edit', () => {
+        const { deps, handle } = setup([]);
+
+        handle({ action: 'create', fieldKey: 'field-a' });
+        handle({ action: 'edit', fieldKey: 'field-a', scheduleId: 7 });
+
+        expect(deps.openDrawer).toHaveBeenNthCalledWith(1, { fieldKey: 'field-a' });
+        expect(deps.openDrawer).toHaveBeenNthCalledWith(2, { fieldKey: 'field-a', scheduleId: 7 });
+    });
+
+    test('a delete moves every field on the schedule to the default one and reports success', async () => {
+        const onDeleteSchedule = jest.fn().mockResolvedValue(undefined);
+        const { current, deps, handle } = setup(
+            [
+                { fieldKey: 'field-a', scheduleId: 7 },
+                { fieldKey: 'field-b', scheduleId: 7 },
+            ],
+            { onDeleteSchedule },
+        );
+
+        handle({ action: 'delete', fieldKey: 'field-a', scheduleId: 7, requestId: 'r1' });
+        await flush();
+
+        expect(onDeleteSchedule).toHaveBeenCalledWith(7);
+        expect(current()).toEqual([{ fieldKey: 'field-a' }, { fieldKey: 'field-b' }]);
+        expect(deps.sendResult).toHaveBeenCalledWith({ requestId: 'r1' });
+    });
+
+    test("a field's toggle turned off while its schedule is deleted stays off", async () => {
+        let resolveDelete!: () => void;
+        const onDeleteSchedule = jest.fn(
+            () => new Promise<void>(resolve => (resolveDelete = resolve)),
+        );
+        const { current, deps, handle } = setup([{ fieldKey: 'field-a', scheduleId: 7 }], {
+            onDeleteSchedule,
+        });
+        const set = jest.spyOn(deps.bindings, 'set');
+
+        handle({ action: 'delete', fieldKey: 'field-a', scheduleId: 7, requestId: 'r1' });
+        handle({ action: 'toggle', fieldKey: 'field-a', enabled: false });
+        resolveDelete();
+        await flush();
+
+        expect(current()).toEqual([]);
+        // The toggle's change only: the delete had no field left on the schedule to move.
+        expect(set).toHaveBeenCalledTimes(1);
+        expect(deps.sendResult).toHaveBeenCalledWith({ requestId: 'r1' });
+    });
+
+    test("a failed delete keeps the bindings and reports the host's message", async () => {
+        const onDeleteSchedule = jest.fn().mockRejectedValue(new Error('in use'));
+        const { current, deps, handle } = setup([{ fieldKey: 'field-a', scheduleId: 7 }], {
+            onDeleteSchedule,
+        });
+
+        handle({ action: 'delete', fieldKey: 'field-a', scheduleId: 7, requestId: 'r1' });
+        await flush();
+
+        expect(current()).toEqual([{ fieldKey: 'field-a', scheduleId: 7 }]);
+        expect(deps.sendResult).toHaveBeenCalledWith({ requestId: 'r1', error: 'in use' });
+    });
+
+    test("ignores picking a schedule the host doesn't list, but not the default one", () => {
+        const { current, handle } = setup([{ fieldKey: 'field-a', scheduleId: 7 }]);
+
+        handle({ action: 'select', fieldKey: 'field-a', scheduleId: 99 });
+        expect(current()).toEqual([{ fieldKey: 'field-a', scheduleId: 7 }]);
+
+        handle({ action: 'select', fieldKey: 'field-a' });
+        expect(current()).toEqual([{ fieldKey: 'field-a' }]);
+    });
+
+    test("refuses to delete a schedule the host doesn't list as the tenant's own", async () => {
+        const onDeleteSchedule = jest.fn().mockResolvedValue(undefined);
+        const { current, deps, handle } = setup([{ fieldKey: 'field-a', scheduleId: 7 }], {
+            onDeleteSchedule,
+            schedules: [{ ...SUNDAYS_ONLY, id: 1, isDefault: true }, SUNDAYS_ONLY],
+        });
+
+        handle({ action: 'delete', fieldKey: 'field-a', scheduleId: 99, requestId: 'r1' });
+        handle({ action: 'delete', fieldKey: 'field-a', scheduleId: 1, requestId: 'r2' });
+        await flush();
+
+        expect(onDeleteSchedule).not.toHaveBeenCalled();
+        expect(current()).toEqual([{ fieldKey: 'field-a', scheduleId: 7 }]);
+        expect(deps.sendResult).toHaveBeenCalledWith({
+            requestId: 'r1',
+            error: 'Failed to delete schedule',
+        });
+        expect(deps.sendResult).toHaveBeenCalledWith({
+            requestId: 'r2',
+            error: 'Failed to delete schedule',
+        });
+    });
+
+    test('a delete without a host delete reports a failure', () => {
+        const { deps, handle } = setup([{ fieldKey: 'field-a', scheduleId: 7 }]);
+
+        handle({ action: 'delete', fieldKey: 'field-a', scheduleId: 7, requestId: 'r1' });
+
+        expect(deps.sendResult).toHaveBeenCalledWith({
+            requestId: 'r1',
+            error: 'Failed to delete schedule',
+        });
+    });
+});

package/src/__tests__/business-calendar-state.test.tsx

@@ -0,0 +1,142 @@
+import type { BusinessDaySchedule } from '@servicetitan/dte-shared';
+import { act } from 'react';
+import { createRoot } from 'react-dom/client';
+import {
+    buildBusinessCalendarState,
+    useBusinessCalendarState,
+} from '../business-calendar/business-calendar-state';
+import type { BusinessCalendar } from '../shared/date-calc';
+import type { UnlayerStore } from '../store';
+import type { CreateUnlayerEditorProps } from '../unlayer-interface';
+
+(globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true;
+
+const schedules: BusinessDaySchedule[] = [
+    {
+        name: 'Weekends and US Federal Holidays',
+        isDefault: true,
+        calendar: { weekendDays: [0, 6], knownHolidays: ['JULY4'], customDates: [] },
+    },
+    {
+        id: 7,
+        name: 'Sundays only',
+        isDefault: false,
+        calendar: { weekendDays: [0], knownHolidays: [], customDates: [] },
+    },
+];
+
+const sundaysOnly: BusinessCalendar = {
+    weekendDays: [0],
+    holidays: [],
+    firstYear: 2025,
+    lastYear: 2027,
+};
+
+describe('buildBusinessCalendarState', () => {
+    test('when disabled, passes every calendar through', () => {
+        expect(
+            buildBusinessCalendarState({
+                enabled: false,
+                canDeleteSchedule: false,
+                fieldCalendars: { 'field-a': sundaysOnly },
+                holidays: ['2026-07-03'],
+            }),
+        ).toEqual({
+            enabled: false,
+            bindings: {},
+            schedules: [],
+            canDeleteSchedule: false,
+            fieldCalendars: { 'field-a': sundaysOnly },
+            holidays: ['2026-07-03'],
+        });
+    });
+
+    test('passes the schedules, the holiday catalog and their states through for the inline picker', () => {
+        const catalog = {
+            jurisdiction: 'US',
+            holidays: [{ code: 'JULY4', displayName: 'Independence Day', rule: 'July 4' }],
+        };
+        const state = buildBusinessCalendarState({
+            enabled: true,
+            canDeleteSchedule: true,
+            schedules,
+            schedulesLoading: true,
+            schedulesError: 'schedules failed',
+            holidayCatalog: catalog,
+            holidayCatalogLoading: true,
+            holidayCatalogError: 'catalog failed',
+        });
+
+        expect(state).toMatchObject({
+            schedules,
+            schedulesLoading: true,
+            schedulesError: 'schedules failed',
+            holidayCatalog: catalog,
+            holidayCatalogLoading: true,
+            holidayCatalogError: 'catalog failed',
+            canDeleteSchedule: true,
+        });
+    });
+
+    test('lists each bound field with its schedule, none for the default one', () => {
+        const state = buildBusinessCalendarState({
+            enabled: true,
+            canDeleteSchedule: false,
+            schedules,
+            scheduleBindings: [{ fieldKey: 'field-a', scheduleId: 7 }, { fieldKey: 'field-b' }],
+        });
+
+        expect(state.enabled).toBe(true);
+        expect(state.bindings).toEqual({
+            'field-a': { scheduleId: 7 },
+            'field-b': { scheduleId: undefined },
+        });
+    });
+
+    test('keeps only the calendars of bound fields while schedules are edited', () => {
+        const state = buildBusinessCalendarState({
+            enabled: true,
+            canDeleteSchedule: false,
+            schedules,
+            scheduleBindings: [{ fieldKey: 'field-a', scheduleId: 7 }],
+            // field-b's toggle was just turned off; the host hasn't dropped its calendar yet.
+            fieldCalendars: { 'field-a': sundaysOnly, 'field-b': sundaysOnly },
+            holidays: ['2026-07-03'],
+        });
+
+        expect(state.fieldCalendars).toEqual({ 'field-a': sundaysOnly });
+        expect(state.holidays).toEqual(['2026-07-03']);
+    });
+});
+
+describe('useBusinessCalendarState', () => {
+    test('rebuilds the state only when a schedule prop changes, not on every render', () => {
+        const store = { setBusinessCalendarState: jest.fn() };
+        const Editor = ({ opts }: { opts: CreateUnlayerEditorProps }) => {
+            useBusinessCalendarState(store as unknown as UnlayerStore, opts);
+            return null;
+        };
+        const container = document.createElement('div');
+        const root = createRoot(container);
+        // A host that rebuilds its options, callbacks included, on every render.
+        const opts = (next: Partial<CreateUnlayerEditorProps> = {}): CreateUnlayerEditorProps => ({
+            tools: [],
+            schedules,
+            onScheduleBindingsChange: () => undefined,
+            ...next,
+        });
+
+        act(() => root.render(<Editor opts={opts()} />));
+        act(() => root.render(<Editor opts={opts()} />));
+        expect(store.setBusinessCalendarState).toHaveBeenCalledTimes(1);
+
+        act(() => root.render(<Editor opts={opts({ schedules: [...schedules] })} />));
+        act(() => root.render(<Editor opts={opts({ onDeleteSchedule: async () => undefined })} />));
+        expect(store.setBusinessCalendarState).toHaveBeenCalledTimes(3);
+        expect(store.setBusinessCalendarState).toHaveBeenLastCalledWith(
+            expect.objectContaining({ enabled: true, canDeleteSchedule: true }),
+        );
+
+        act(() => root.unmount());
+    });
+});