@getmicdrop/svelte-components 2.6.0 → 2.6.3

package/dist/components/Calendar/{MiniMonthCalendar.svelte.d.ts → Calendar.svelte.d.ts}

@@ -1,42 +1,43 @@
-export default MiniMonthCalendar;
-type MiniMonthCalendar = SvelteComponent<{
+export default Calendar;
+type Calendar = SvelteComponent<{
     variant?: string | undefined;
-    selectedDates?: any[] | undefined;
+    view?: string | undefined;
     events?: any[] | undefined;
-    saveStatus?: string | undefined;
-    showLegend?: boolean | undefined;
+    selectedDates?: any[] | undefined;
+    showMonths?: number | undefined;
+    compact?: boolean | undefined;
     showNavigation?: boolean | undefined;
-    showTodayButton?: boolean | undefined;
+    showViewSwitcher?: boolean | undefined;
     readOnly?: boolean | undefined;
-    showPartialPreview?: boolean | undefined;
-    disablePastNavigation?: boolean | undefined;
+    saveStatus?: string | undefined;
+    showLegend?: boolean | undefined;
 }, {
     dateSelect: CustomEvent<any>;
-    dayClick: CustomEvent<any>;
-    monthChange: CustomEvent<any>;
+    eventClick: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
 }, {}> & {
     $$bindings?: string | undefined;
 };
-declare const MiniMonthCalendar: $$__sveltets_2_IsomorphicComponent<{
+declare const Calendar: $$__sveltets_2_IsomorphicComponent<{
     variant?: string | undefined;
-    selectedDates?: any[] | undefined;
+    view?: string | undefined;
     events?: any[] | undefined;
-    saveStatus?: string | undefined;
-    showLegend?: boolean | undefined;
+    selectedDates?: any[] | undefined;
+    showMonths?: number | undefined;
+    compact?: boolean | undefined;
     showNavigation?: boolean | undefined;
-    showTodayButton?: boolean | undefined;
+    showViewSwitcher?: boolean | undefined;
     readOnly?: boolean | undefined;
-    showPartialPreview?: boolean | undefined;
-    disablePastNavigation?: boolean | undefined;
+    saveStatus?: string | undefined;
+    showLegend?: boolean | undefined;
 }, {
     dateSelect: CustomEvent<any>;
-    dayClick: CustomEvent<any>;
-    monthChange: CustomEvent<any>;
+    eventClick: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, string>;
+import { Calendar } from '@fullcalendar/core';
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
@@ -50,4 +51,4 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-//# sourceMappingURL=MiniMonthCalendar.svelte.d.ts.map
+//# sourceMappingURL=Calendar.svelte.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Calendar/Calendar.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AA6qBA;;;;;;;;;;;;;;;;;mBAAiQ;yBAxqBxO,oBAAoB;6CA+pBA,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,eAAe,QAAQ,CAAC"}

package/dist/components/Calendar/QuarterView.spec.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=QuarterView.spec.d.ts.map

package/dist/components/Calendar/QuarterView.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"QuarterView.spec.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Calendar/QuarterView.spec.js"],"names":[],"mappings":""}

package/dist/components/Calendar/QuarterView.spec.js

@@ -0,0 +1,394 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import { render, fireEvent } from '@testing-library/svelte';
+import { writable, get } from 'svelte/store';
+import QuarterView from './QuarterView.svelte';
+
+// Mock date-fns functions
+vi.mock('date-fns', () => ({
+  getDay: vi.fn((date) => date.getDay()),
+  getDaysInMonth: vi.fn((date) => {
+    return new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate();
+  }),
+  startOfMonth: vi.fn((date) => new Date(date.getFullYear(), date.getMonth(), 1)),
+}));
+
+describe('QuarterView Component', () => {
+  let selectedDates;
+
+  beforeEach(() => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date(2024, 5, 15)); // June 15, 2024
+
+    selectedDates = writable([]);
+
+    // Mock navigator.vibrate for haptic feedback tests
+    Object.defineProperty(navigator, 'vibrate', {
+      value: vi.fn(),
+      writable: true,
+    });
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  it('renders calendar container', () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+    const calendarContainer = container.querySelector('.calendar-container');
+    expect(calendarContainer).toBeTruthy();
+  });
+
+  it('renders day headers', () => {
+    const { getByText } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+    expect(getByText('Sun')).toBeTruthy();
+    expect(getByText('Mon')).toBeTruthy();
+    expect(getByText('Tue')).toBeTruthy();
+    expect(getByText('Wed')).toBeTruthy();
+    expect(getByText('Thu')).toBeTruthy();
+    expect(getByText('Fri')).toBeTruthy();
+    expect(getByText('Sat')).toBeTruthy();
+  });
+
+  it('renders current month name', () => {
+    const { getByText } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+    expect(getByText('June')).toBeTruthy();
+  });
+
+  it('renders current year', () => {
+    const { getByText } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+    expect(getByText('2024')).toBeTruthy();
+  });
+
+  it('renders navigation buttons', () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+    const navButtons = container.querySelectorAll('.nav-btn');
+    expect(navButtons.length).toBe(2);
+  });
+
+  it('renders Today button', () => {
+    const { getByText } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+    expect(getByText('Today')).toBeTruthy();
+  });
+
+  it('renders day cells', () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+    const dayCells = container.querySelectorAll('.day-cell');
+    // June 2024 has 30 days
+    expect(dayCells.length).toBe(30);
+  });
+
+  it('previous button has aria-label', () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+    const prevButton = container.querySelector('[aria-label="Previous month"]');
+    expect(prevButton).toBeTruthy();
+  });
+
+  it('next button has aria-label', () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+    const nextButton = container.querySelector('[aria-label="Next month"]');
+    expect(nextButton).toBeTruthy();
+  });
+
+  it('clicking next navigates to next month', async () => {
+    const { container, getByText } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+
+    const nextButton = container.querySelector('[aria-label="Next month"]');
+    await fireEvent.click(nextButton);
+
+    vi.advanceTimersByTime(300);
+
+    expect(getByText('July')).toBeTruthy();
+  });
+
+  it('clicking previous navigates to previous month', async () => {
+    const { container, getByText } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+
+    const prevButton = container.querySelector('[aria-label="Previous month"]');
+    await fireEvent.click(prevButton);
+
+    vi.advanceTimersByTime(300);
+
+    expect(getByText('May')).toBeTruthy();
+  });
+
+  it('shows save status when provided', () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+        saveStatus: 'saving',
+      },
+    });
+    const saveIndicator = container.querySelector('.save-indicator-overlay');
+    expect(saveIndicator).toBeTruthy();
+  });
+
+  it('shows saved indicator', () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+        saveStatus: 'saved',
+      },
+    });
+    const saveIndicator = container.querySelector('.save-indicator-overlay');
+    expect(saveIndicator).toBeTruthy();
+  });
+
+  it('disables non-event days', () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+    const disabledCells = container.querySelectorAll('.day-cell.disabled');
+    // All days should be disabled when no events
+    expect(disabledCells.length).toBe(30);
+  });
+
+  it('enables event days', () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [{ date: '2024-06-20' }],
+        selectedDates,
+      },
+    });
+
+    const dayCells = container.querySelectorAll('.day-cell');
+    // Find the cell for day 20
+    const day20Cell = Array.from(dayCells).find(
+      (cell) => cell.querySelector('.day-number')?.textContent === '20'
+    );
+
+    // Day 20 (future event) should not be disabled
+    expect(day20Cell.classList.contains('disabled')).toBe(false);
+  });
+
+  it('marks selected dates', async () => {
+    selectedDates.set(['2024-06-20']);
+
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [{ date: '2024-06-20' }],
+        selectedDates,
+      },
+    });
+
+    const dayCells = container.querySelectorAll('.day-cell');
+    const day20Cell = Array.from(dayCells).find(
+      (cell) => cell.querySelector('.day-number')?.textContent === '20'
+    );
+
+    expect(day20Cell.classList.contains('selected')).toBe(true);
+  });
+
+  it('toggles date selection on click', async () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [{ date: '2024-06-20' }],
+        selectedDates,
+      },
+    });
+
+    const dayCells = container.querySelectorAll('.day-cell');
+    const day20Cell = Array.from(dayCells).find(
+      (cell) => cell.querySelector('.day-number')?.textContent === '20'
+    );
+
+    await fireEvent.click(day20Cell);
+
+    // Check that selectedDates store was updated
+    const dates = get(selectedDates);
+    expect(dates).toContain('2024-06-20');
+  });
+
+  it('removes date from selection on second click', async () => {
+    selectedDates.set(['2024-06-20']);
+
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [{ date: '2024-06-20' }],
+        selectedDates,
+      },
+    });
+
+    const dayCells = container.querySelectorAll('.day-cell');
+    const day20Cell = Array.from(dayCells).find(
+      (cell) => cell.querySelector('.day-number')?.textContent === '20'
+    );
+
+    await fireEvent.click(day20Cell);
+
+    const dates = get(selectedDates);
+    expect(dates).not.toContain('2024-06-20');
+  });
+
+  it('has aria-pressed attribute on day buttons', () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+
+    const dayCell = container.querySelector('.day-cell');
+    expect(dayCell.hasAttribute('aria-pressed')).toBe(true);
+  });
+
+  it('has aria-label for day buttons', () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+
+    const dayCell = container.querySelector('.day-cell');
+    expect(dayCell.getAttribute('aria-label')).toMatch(/Day \d+/);
+  });
+
+  it('handles touch swipe events', async () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+
+    const grid = container.querySelector('.calendar-grid');
+
+    // Simulate touch swipe
+    await fireEvent.touchStart(grid, {
+      touches: [{ clientX: 200, clientY: 100 }],
+    });
+
+    await fireEvent.touchMove(grid, {
+      touches: [{ clientX: 100, clientY: 100 }],
+    });
+
+    await fireEvent.touchEnd(grid, {
+      changedTouches: [{ clientX: 50, clientY: 100 }],
+    });
+
+    vi.advanceTimersByTime(300);
+  });
+
+  it('calls haptic feedback via vibration API', async () => {
+    const { container } = render(QuarterView, {
+      props: {
+        currentevents: [{ date: '2024-06-20' }],
+        selectedDates,
+      },
+    });
+
+    const dayCells = container.querySelectorAll('.day-cell');
+    const day20Cell = Array.from(dayCells).find(
+      (cell) => cell.querySelector('.day-number')?.textContent === '20'
+    );
+
+    await fireEvent.click(day20Cell);
+
+    // vibrate should have been called
+    expect(navigator.vibrate).toHaveBeenCalled();
+  });
+
+  it('navigates months correctly across year boundary (December to January)', async () => {
+    vi.setSystemTime(new Date(2024, 11, 15)); // December 15, 2024
+
+    const { container, getByText } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+
+    expect(getByText('December')).toBeTruthy();
+    expect(getByText('2024')).toBeTruthy();
+
+    const nextButton = container.querySelector('[aria-label="Next month"]');
+    await fireEvent.click(nextButton);
+
+    vi.advanceTimersByTime(300);
+
+    expect(getByText('January')).toBeTruthy();
+    expect(getByText('2025')).toBeTruthy();
+  });
+
+  it('navigates months correctly across year boundary (January to December)', async () => {
+    vi.setSystemTime(new Date(2024, 0, 15)); // January 15, 2024
+
+    const { container, getByText } = render(QuarterView, {
+      props: {
+        currentevents: [],
+        selectedDates,
+      },
+    });
+
+    expect(getByText('January')).toBeTruthy();
+    expect(getByText('2024')).toBeTruthy();
+
+    const prevButton = container.querySelector('[aria-label="Previous month"]');
+    await fireEvent.click(prevButton);
+
+    vi.advanceTimersByTime(300);
+
+    expect(getByText('December')).toBeTruthy();
+    expect(getByText('2023')).toBeTruthy();
+  });
+});

package/dist/components/Calendar/QuarterView.stories.svelte

@@ -0,0 +1,134 @@
+<script context="module">
+  import { Story, Template } from "@storybook/addon-svelte-csf";
+  import QuarterView from "./QuarterView.svelte";
+  import { writable } from "svelte/store";
+
+  export const meta = {
+    title: "Components/Calendar/QuarterView",
+    component: QuarterView,
+    argTypes: {
+      currentevents: { control: "object" },
+      selectedDates: { control: "object" },
+    },
+  };
+
+  // Helper to generate dates for the current month
+  function generateEventDates(count = 10) {
+    const events = [];
+    const today = new Date();
+    const year = today.getFullYear();
+    const month = today.getMonth();
+
+    for (let i = 0; i < count; i++) {
+      const day = Math.floor(Math.random() * 28) + 1;
+      events.push({
+        date: new Date(year, month, day).toISOString(),
+        title: `Event ${i + 1}`
+      });
+    }
+    return events;
+  }
+
+  // Generate future event dates for next month
+  function generateFutureEventDates(count = 8) {
+    const events = [];
+    const today = new Date();
+    const year = today.getFullYear();
+    const month = today.getMonth() + 1;
+
+    for (let i = 0; i < count; i++) {
+      const day = Math.floor(Math.random() * 28) + 1;
+      events.push({
+        date: new Date(year, month, day).toISOString(),
+        title: `Future Event ${i + 1}`
+      });
+    }
+    return events;
+  }
+
+  // Generate specific dates
+  function generateSpecificDates() {
+    const today = new Date();
+    const year = today.getFullYear();
+    const month = today.getMonth();
+
+    return [
+      { date: new Date(year, month, 5).toISOString(), title: "Comedy Night" },
+      { date: new Date(year, month, 12).toISOString(), title: "Jazz Evening" },
+      { date: new Date(year, month, 18).toISOString(), title: "Rock Concert" },
+      { date: new Date(year, month, 25).toISOString(), title: "Open Mic" },
+    ];
+  }
+</script>
+
+<Template let:args>
+  <div style="max-width: 600px; margin: 0 auto;">
+    <QuarterView {...args} />
+  </div>
+</Template>
+
+<Story
+  name="With Random Events"
+  args={{
+    currentevents: generateEventDates(10),
+    selectedDates: writable([])
+  }}
+/>
+
+<Story name="With Specific Events">
+  <div style="max-width: 600px; margin: 0 auto;">
+    <QuarterView
+      currentevents={generateSpecificDates()}
+      selectedDates={writable([])}
+    />
+  </div>
+</Story>
+
+<Story name="With Pre-selected Dates">
+  <div style="max-width: 600px; margin: 0 auto;">
+    <QuarterView
+      currentevents={generateEventDates(12)}
+      selectedDates={writable([
+        `${new Date().getFullYear()}-${String(new Date().getMonth() + 1).padStart(2, '0')}-05`,
+        `${new Date().getFullYear()}-${String(new Date().getMonth() + 1).padStart(2, '0')}-12`,
+        `${new Date().getFullYear()}-${String(new Date().getMonth() + 1).padStart(2, '0')}-18`,
+      ])}
+    />
+  </div>
+</Story>
+
+<Story name="With Many Events">
+  <div style="max-width: 600px; margin: 0 auto;">
+    <QuarterView
+      currentevents={generateEventDates(20)}
+      selectedDates={writable([])}
+    />
+  </div>
+</Story>
+
+<Story name="With Few Events">
+  <div style="max-width: 600px; margin: 0 auto;">
+    <QuarterView
+      currentevents={generateSpecificDates().slice(0, 2)}
+      selectedDates={writable([])}
+    />
+  </div>
+</Story>
+
+<Story name="Empty Calendar">
+  <div style="max-width: 600px; margin: 0 auto;">
+    <QuarterView
+      currentevents={[]}
+      selectedDates={writable([])}
+    />
+  </div>
+</Story>
+
+<Story name="Next Month Events">
+  <div style="max-width: 600px; margin: 0 auto;">
+    <QuarterView
+      currentevents={generateFutureEventDates(8)}
+      selectedDates={writable([])}
+    />
+  </div>
+</Story>

package/dist/components/{ShowTimeCard/ShowTimeCard.svelte.d.ts → Calendar/QuarterView.stories.svelte.d.ts}

@@ -1,31 +1,35 @@
-export default ShowTimeCard;
-type ShowTimeCard = SvelteComponent<{
-    time?: string | undefined;
-    day?: string | undefined;
-    date?: string | undefined;
-    isSelected?: boolean | undefined;
+export namespace meta {
+    export let title: string;
+    export { QuarterView as component };
+    export namespace argTypes {
+        namespace currentevents {
+            let control: string;
+        }
+        namespace selectedDates {
+            let control_1: string;
+            export { control_1 as control };
+        }
+    }
+}
+export default QuarterView;
+type QuarterView = SvelteComponent<{
+    [x: string]: never;
 }, {
-    select: CustomEvent<any>;
-} & {
     [evt: string]: CustomEvent<any>;
 }, {}> & {
     $$bindings?: string | undefined;
 };
-declare const ShowTimeCard: $$__sveltets_2_IsomorphicComponent<{
-    time?: string | undefined;
-    day?: string | undefined;
-    date?: string | undefined;
-    isSelected?: boolean | undefined;
+declare const QuarterView: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: never;
 }, {
-    select: CustomEvent<any>;
-} & {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, string>;
+import QuarterView from "./QuarterView.svelte";
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
         $$bindings?: Bindings;
     } & Exports;
-    (internal: unknown, props: Props & {
+    (internal: unknown, props: {
         $$events?: Events;
         $$slots?: Slots;
     }): Exports & {
@@ -34,4 +38,4 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-//# sourceMappingURL=ShowTimeCard.svelte.d.ts.map
+//# sourceMappingURL=QuarterView.stories.svelte.d.ts.map

package/dist/components/Calendar/QuarterView.stories.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"QuarterView.stories.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Calendar/QuarterView.stories.svelte.js"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AA+HA;;;;mBAAuH;wBA3H7F,sBAAsB;6CAkHH,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,eAAe,QAAQ,CAAC"}