@arbor-education/design-system.components 4.0.0-react19-alpha.0 → 4.1.0

package/dist/components/formField/inputs/singleFile/SingleFileInput.stories.js

@@ -0,0 +1,242 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Controls, Heading as DocHeading, Markdown, Primary as DocPrimary, Stories, Subtitle, Title, } from '@storybook/addon-docs/blocks';
+import { useState } from 'react';
+import { expect, fn, userEvent, within } from 'storybook/test';
+import { FormField } from '../../FormField.js';
+import { SingleFileInput } from './SingleFileInput.js';
+const DESCRIPTION_INTRO = [
+    'The **SingleFileInput** lets a user pick exactly one file for a conventional form POST.',
+    'It shows the chosen file name in a read-only text field, with a button that opens the native file picker.',
+    'The selected file is submitted under the `name` you give it, like any other form control.',
+].join('\n');
+const USAGE_GUIDANCE = [
+    '### When to use',
+    '',
+    '- Attaching one document to a form that is submitted with a normal `<form>` POST: a consent letter, a photo, a CSV import',
+    '- Anywhere a legacy single-file field needs a Design System equivalent',
+    '- Inside `FormField` with `inputType="singleFile"` (the recommended pattern in real forms)',
+    '',
+    '---',
+    '',
+    '### When NOT to use',
+    '',
+    '| Instead of SingleFileInput... | Use... | Why |',
+    '|---|---|---|',
+    '| Several files, drag and drop, upload progress or per-file delete | [`FileUpload`](?path=/docs/components-fileupload--docs) | Async multi-file dropzone |',
+    '| Free-form text | [`TextInput`](?path=/docs/components-formfield-inputs-textinput--docs) | No file is involved |',
+    '',
+    '---',
+    '',
+    '### Design guidance',
+    '',
+    '- **Width is always 100%** of its container: size the wrapper, not the input.',
+    '- **Use FormField in real forms** so the label, description, helper link and error text are wired up for you.',
+    '- **hasError + disabled is an anti-pattern** because a user cannot correct an error on a field they cannot edit.',
+].join('\n');
+const DEVELOPER_NOTES = [
+    '### Critical usage patterns',
+    '',
+    '**1. Reading the selected `File`.** `onChange` receives the native change event from the hidden file input.',
+    'Read `event.currentTarget.files?.[0]` **inside the handler** (React clears `currentTarget` afterwards) to validate',
+    'type or size, then show the result through `FormField`\'s `errorText`.',
+    '',
+    '**2. Form submission.** `name`, `accept` and `required` are applied to the native `<input type="file">`, which is',
+    'the only control that carries a `name`, so only the file itself is submitted.',
+    'The visible read-only field never submits.',
+    '',
+    '**3. `ref`.** The forwarded ref points at the native file input, so `ref.current.files` works as usual.',
+    'To reset the selection, submit a form containing the field or dispatch a DOM `reset` event on that form —',
+    'setting `ref.current.value = ""` clears the native input but leaves the displayed file name stale,',
+    'because a programmatic value change does not fire `change`.',
+    '',
+    '**4. Always provide `id` inside FormField.** The label targets the visible read-only field, which is what',
+    'assistive technology lands on.',
+    '',
+    '**5. Single file only.** `multiple` is not supported.',
+    '',
+    '**6. No focus or key handlers.** `onFocus`, `onBlur` and `onKeyDown` are not accepted: the native input never receives focus.',
+    '',
+    '---',
+    '',
+    '### Accessibility',
+    '',
+    '- Keyboard: `Tab` moves from the read-only field to the **Choose file** button; `Enter` or `Space` opens the picker.',
+    '- The hidden native input is removed from the tab order and the accessibility tree, so the field is not announced twice.',
+    '- The chosen file name is the value of the labelled read-only field, so it is announced on focus.',
+    '- Pair `hasError` with `aria-invalid={true}` when used standalone. `FormField` does this automatically.',
+].join('\n');
+const RELATED_COMPONENTS = [
+    '## Related components',
+    '',
+    '[FormField](?path=/docs/components-formfield--docs) · [FileUpload](?path=/docs/components-fileupload--docs) · [Button](?path=/docs/components-button--docs)',
+].join('\n');
+function SingleFileInputDocsPage() {
+    return (_jsxs(_Fragment, { children: [_jsx(Title, {}), _jsx(Subtitle, {}), _jsx(Markdown, { children: DESCRIPTION_INTRO }), _jsx(DocHeading, { children: "Interactive example" }), _jsx(DocPrimary, {}), _jsx(Controls, {}), _jsx(DocHeading, { children: "Usage guidance" }), _jsx(Markdown, { children: USAGE_GUIDANCE }), _jsx(DocHeading, { children: "Developer notes" }), _jsx(Markdown, { children: DEVELOPER_NOTES }), _jsx(DocHeading, { children: "Examples" }), _jsx(Stories, { title: "" }), _jsx(Markdown, { children: RELATED_COMPONENTS })] }));
+}
+const meta = {
+    title: 'Components/FormField/Inputs/SingleFileInput',
+    component: SingleFileInput,
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'padded',
+        docs: {
+            page: SingleFileInputDocsPage,
+        },
+    },
+    args: {
+        'aria-label': 'Attachment',
+        'onChange': fn(),
+    },
+    argTypes: {
+        'hasError': {
+            description: 'Applies error-state styling. Does not set `aria-invalid`: pair it when used standalone.',
+            control: 'boolean',
+            table: { type: { summary: 'boolean' }, defaultValue: { summary: 'false' } },
+        },
+        'disabled': {
+            description: 'Disables the field, the button and the native file input.',
+            control: 'boolean',
+            table: { type: { summary: 'boolean' }, defaultValue: { summary: 'false' } },
+        },
+        'required': {
+            description: 'Marks the native file input as required for form validation and the visible field as required for assistive technology.',
+            control: 'boolean',
+            table: { type: { summary: 'boolean' } },
+        },
+        'name': {
+            description: 'Name the selected file is submitted under.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        'accept': {
+            description: 'Comma-separated list of accepted file types, passed to the native file input (for example `.pdf,image/*`).',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        'buttonLabel': {
+            description: 'Label of the button that opens the native file picker.',
+            control: 'text',
+            table: { type: { summary: 'string' }, defaultValue: { summary: "'Choose file'" } },
+        },
+        'placeholder': {
+            description: 'Text shown in the read-only field while no file is chosen.',
+            control: 'text',
+            table: { type: { summary: 'string' }, defaultValue: { summary: "'No file chosen'" } },
+        },
+        'id': {
+            description: 'Set on the visible read-only field, so a `<label htmlFor>` targets it. `FormField` passes this automatically.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        'className': {
+            description: 'Extra class name(s) added to the wrapper element, alongside `ds-single-file-input`.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        'aria-label': {
+            description: 'Accessible name for the visible read-only field when there is no visible label.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        'aria-labelledby': {
+            description: 'ID(s) of the element(s) that label the visible read-only field.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        'aria-describedby': {
+            description: 'ID(s) of the element(s) that describe the visible read-only field, such as helper or error text. `FormField` sets this automatically.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        'aria-invalid': {
+            description: 'Marks the visible read-only field as invalid for assistive technology. `FormField` sets this automatically from `errorText`.',
+            control: 'boolean',
+            table: { type: { summary: 'boolean' } },
+        },
+        'onChange': {
+            description: 'Fired with the native change event. Read `event.currentTarget.files?.[0]` to get the selected `File`.',
+            control: false,
+            table: { type: { summary: '(event: ChangeEvent<HTMLInputElement>) => void' } },
+        },
+    },
+};
+export default meta;
+const withDescription = (story, description) => ({
+    ...story,
+    parameters: {
+        ...story.parameters,
+        docs: {
+            ...story.parameters?.docs,
+            description: { story: description },
+        },
+    },
+});
+const sampleFile = () => new File(['%PDF-1.4'], 'consent-letter.pdf', { type: 'application/pdf' });
+const wrap = (node) => (_jsx("div", { style: { maxWidth: '28rem', padding: 'var(--spacing-xlarge)' }, children: node }));
+export const Default = withDescription({
+    render: args => wrap(_jsx(SingleFileInput, { ...args })),
+}, 'No file chosen yet. The read-only field shows its placeholder and the **Choose file** button opens the native picker.');
+export const Selected = withDescription({
+    render: args => wrap(_jsx(SingleFileInput, { ...args })),
+    play: async ({ canvasElement, args }) => {
+        const canvas = within(canvasElement);
+        const nativeInput = canvasElement.querySelector('input[type="file"]');
+        await userEvent.upload(nativeInput, sampleFile());
+        await expect(canvas.getByRole('textbox', { name: 'Attachment' })).toHaveValue('consent-letter.pdf');
+        await expect(args.onChange).toHaveBeenCalled();
+    },
+}, 'After a file is chosen its name replaces the placeholder in the read-only field.');
+export const Disabled = withDescription({
+    args: { disabled: true },
+    render: args => wrap(_jsx(SingleFileInput, { ...args })),
+}, 'The field, button and native input are all disabled.');
+export const WithError = withDescription({
+    render: () => wrap(_jsx(FormField, { id: "attachment-error", label: "Attachment", inputType: "singleFile", errorText: "Attach a file to continue", inputProps: { name: 'attachment', required: true } })),
+    play: async ({ canvasElement }) => {
+        const canvas = within(canvasElement);
+        const field = canvas.getByRole('textbox', { name: 'Attachment' });
+        await expect(field).toBeInvalid();
+        await expect(field).toHaveAccessibleDescription('Attach a file to continue');
+    },
+}, 'Inside `FormField`, `errorText` turns on the error styling, `aria-invalid` and the described-by link to the message.');
+const ValidationTemplate = () => {
+    const [error, setError] = useState();
+    const maxBytes = 1024;
+    return (_jsx(FormField, { id: "attachment-validated", label: "Attachment", inputType: "singleFile", fieldDescription: "PDF, 1KB maximum", errorText: error, inputProps: {
+            name: 'attachment',
+            accept: '.pdf',
+            onChange: (event) => {
+                const file = event.currentTarget.files?.[0];
+                setError(file && file.size > maxBytes ? `${file.name} is larger than 1KB` : undefined);
+            },
+        } }));
+};
+export const WithValidation = withDescription({
+    render: () => wrap(_jsx(ValidationTemplate, {})),
+    play: async ({ canvasElement }) => {
+        const canvas = within(canvasElement);
+        const nativeInput = canvasElement.querySelector('input[type="file"]');
+        const oversized = new File([new Uint8Array(2048)], 'big.pdf', { type: 'application/pdf' });
+        await userEvent.upload(nativeInput, oversized);
+        await expect(canvas.getByText('big.pdf is larger than 1KB')).toBeInTheDocument();
+        await expect(canvas.getByRole('textbox', { name: 'Attachment' })).toBeInvalid();
+    },
+}, 'The consumer reads the selected `File` in `onChange`, validates it, and reports the result through `errorText`.');
+export const InAForm = withDescription({
+    render: () => wrap(_jsx("form", { children: _jsx(FormField, { id: "attachment-form", label: "Consent letter", inputType: "singleFile", fieldDescription: "Attach the signed letter", helperLinkText: "Letter template", helperLinkUrl: "https://example.com/template", inputProps: { name: 'consentLetter', accept: '.pdf' } }) })),
+    play: async ({ canvasElement }) => {
+        const canvas = within(canvasElement);
+        const form = canvasElement.querySelector('form');
+        const nativeInput = form.querySelector('input[type="file"]');
+        // user-event only stubs `files`, so build a real FileList for FormData to read.
+        const transfer = new DataTransfer();
+        transfer.items.add(sampleFile());
+        nativeInput.files = transfer.files;
+        nativeInput.dispatchEvent(new Event('change', { bubbles: true }));
+        const submitted = new FormData(form).get('consentLetter');
+        await expect(submitted).toBeInstanceOf(File);
+        await expect(submitted.name).toBe('consent-letter.pdf');
+        await expect(canvas.getByRole('textbox', { name: 'Consent letter' })).toHaveValue('consent-letter.pdf');
+    },
+}, 'Within a native `<form>`, the chosen file is submitted under the file input\'s `name`.');
+//# sourceMappingURL=SingleFileInput.stories.js.map

package/dist/components/formField/inputs/singleFile/SingleFileInput.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleFileInput.stories.js","sourceRoot":"","sources":["../../../../../src/components/formField/inputs/singleFile/SingleFileInput.stories.tsx"],"names":[],"mappings":"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"}

package/dist/components/formField/inputs/singleFile/SingleFileInput.test.d.ts

@@ -0,0 +1,2 @@
+import '@testing-library/jest-dom/vitest';
+//# sourceMappingURL=SingleFileInput.test.d.ts.map

package/dist/components/formField/inputs/singleFile/SingleFileInput.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleFileInput.test.d.ts","sourceRoot":"","sources":["../../../../../src/components/formField/inputs/singleFile/SingleFileInput.test.tsx"],"names":[],"mappings":"AAAA,OAAO,kCAAkC,CAAC"}

package/dist/components/formField/inputs/singleFile/SingleFileInput.test.js

@@ -0,0 +1,135 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import '@testing-library/jest-dom/vitest';
+import { act, render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { createRef } from 'react';
+import { afterEach, describe, expect, test, vi } from 'vitest';
+import { SingleFileInput } from './SingleFileInput.js';
+const pdf = new File(['pdf'], 'report.pdf', { type: 'application/pdf' });
+describe('SingleFileInput', () => {
+    afterEach(() => {
+        vi.restoreAllMocks();
+    });
+    test('renders an empty read-only field with the default placeholder and a choose button', () => {
+        render(_jsx(SingleFileInput, { "aria-label": "Attachment" }));
+        const field = screen.getByLabelText('Attachment');
+        expect(field).toHaveAttribute('readonly');
+        expect(field).toHaveValue('');
+        expect(field).toHaveAttribute('placeholder', 'No file chosen');
+        expect(screen.getByRole('button', { name: 'Choose file' })).toBeInTheDocument();
+    });
+    test('uses a custom placeholder', () => {
+        render(_jsx(SingleFileInput, { "aria-label": "Attachment", placeholder: "Pick a PDF" }));
+        expect(screen.getByLabelText('Attachment')).toHaveAttribute('placeholder', 'Pick a PDF');
+    });
+    test('clicking the button opens the native file picker', async () => {
+        const user = userEvent.setup();
+        const click = vi.spyOn(HTMLInputElement.prototype, 'click');
+        const ref = createRef();
+        render(_jsx(SingleFileInput, { ref: ref, "aria-label": "Attachment" }));
+        await user.click(screen.getByRole('button', { name: 'Choose file' }));
+        expect(click).toHaveBeenCalledWith();
+        expect(click.mock.contexts).toContain(ref.current);
+    });
+    test('shows the chosen file name in the labelled read-only field', async () => {
+        const user = userEvent.setup();
+        const ref = createRef();
+        render(_jsx(SingleFileInput, { ref: ref, "aria-label": "Attachment" }));
+        await user.upload(ref.current, pdf);
+        expect(screen.getByRole('textbox', { name: 'Attachment' })).toHaveValue('report.pdf');
+    });
+    test('clears the file name when the selection is cleared', async () => {
+        const user = userEvent.setup();
+        const ref = createRef();
+        render(_jsx(SingleFileInput, { ref: ref, "aria-label": "Attachment" }));
+        await user.upload(ref.current, pdf);
+        await user.upload(ref.current, []);
+        expect(screen.getByLabelText('Attachment')).toHaveValue('');
+    });
+    test('clears the file name when the surrounding form is reset', async () => {
+        const user = userEvent.setup();
+        const ref = createRef();
+        render(_jsx("form", { "aria-label": "Upload", children: _jsx(SingleFileInput, { ref: ref, "aria-label": "Attachment" }) }));
+        await user.upload(ref.current, pdf);
+        expect(screen.getByLabelText('Attachment')).toHaveValue('report.pdf');
+        act(() => {
+            screen.getByRole('form', { name: 'Upload' }).dispatchEvent(new Event('reset'));
+        });
+        expect(screen.getByLabelText('Attachment')).toHaveValue('');
+    });
+    test('calls onChange with the native event so the consumer can read the File', async () => {
+        const user = userEvent.setup();
+        let selectedFile;
+        const onChange = vi.fn((event) => {
+            selectedFile = event.currentTarget.files?.[0];
+        });
+        const ref = createRef();
+        render(_jsx(SingleFileInput, { ref: ref, "aria-label": "Attachment", onChange: onChange }));
+        await user.upload(ref.current, pdf);
+        expect(onChange).toHaveBeenCalledTimes(1);
+        expect(selectedFile).toBe(pdf);
+    });
+    test('passes name, accept and required to the native file input', () => {
+        const ref = createRef();
+        render(_jsx(SingleFileInput, { ref: ref, "aria-label": "Attachment", name: "attachment", accept: ".pdf", required: true }));
+        expect(ref.current).toHaveAttribute('type', 'file');
+        expect(ref.current).toHaveAttribute('name', 'attachment');
+        expect(ref.current).toHaveAttribute('accept', '.pdf');
+        expect(ref.current).toBeRequired();
+        expect(ref.current).not.toHaveAttribute('multiple');
+    });
+    test('exposes required to assistive technology on the visible field', () => {
+        render(_jsx(SingleFileInput, { "aria-label": "Attachment", required: true }));
+        expect(screen.getByLabelText('Attachment')).toBeRequired();
+    });
+    test('does not submit the visible read-only field', () => {
+        const { container } = render(_jsx("form", { children: _jsx(SingleFileInput, { "aria-label": "Attachment", name: "attachment" }) }));
+        const namedControls = container.querySelectorAll('[name]');
+        expect(namedControls).toHaveLength(1);
+        expect(namedControls[0]).toHaveAttribute('type', 'file');
+    });
+    test('disables the field, button and native input', () => {
+        const ref = createRef();
+        render(_jsx(SingleFileInput, { ref: ref, "aria-label": "Attachment", disabled: true }));
+        expect(screen.getByLabelText('Attachment')).toBeDisabled();
+        expect(screen.getByRole('button', { name: 'Choose file' })).toBeDisabled();
+        expect(ref.current).toBeDisabled();
+    });
+    test('applies error styling to the field and the button', () => {
+        render(_jsx(SingleFileInput, { "aria-label": "Attachment", hasError: true }));
+        expect(screen.getByLabelText('Attachment')).toHaveClass('ds-input--error');
+        expect(screen.getByRole('button', { name: 'Choose file' })).toHaveClass('ds-button--error');
+    });
+    test('forwards id and aria attributes to the visible field', () => {
+        render(_jsx(SingleFileInput, { id: "attachment", "aria-label": "Attachment", "aria-describedby": "hint", "aria-invalid": true }));
+        const field = screen.getByLabelText('Attachment');
+        expect(field).toHaveAttribute('id', 'attachment');
+        expect(field).toHaveAttribute('aria-describedby', 'hint');
+        expect(field).toBeInvalid();
+    });
+    test('tabs from the read-only field to the button and skips the hidden native input', async () => {
+        const user = userEvent.setup();
+        render(_jsx(SingleFileInput, { "aria-label": "Attachment" }));
+        await user.tab();
+        expect(screen.getByLabelText('Attachment')).toHaveFocus();
+        await user.tab();
+        expect(screen.getByRole('button', { name: 'Choose file' })).toHaveFocus();
+    });
+    test('opens the file picker from the keyboard with Enter and Space', async () => {
+        const user = userEvent.setup();
+        const click = vi.spyOn(HTMLInputElement.prototype, 'click');
+        render(_jsx(SingleFileInput, { "aria-label": "Attachment" }));
+        await user.tab();
+        await user.tab();
+        await user.keyboard('{Enter}');
+        expect(click).toHaveBeenCalledTimes(1);
+        await user.keyboard(' ');
+        expect(click).toHaveBeenCalledTimes(2);
+    });
+    test('uses a custom button label', () => {
+        render(_jsx(SingleFileInput, { "aria-label": "Attachment", buttonLabel: "Browse" }));
+        expect(screen.getByRole('button', { name: 'Browse' })).toBeInTheDocument();
+        expect(screen.queryByRole('button', { name: 'Choose file' })).not.toBeInTheDocument();
+    });
+});
+//# sourceMappingURL=SingleFileInput.test.js.map

package/dist/components/formField/inputs/singleFile/SingleFileInput.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleFileInput.test.js","sourceRoot":"","sources":["../../../../../src/components/formField/inputs/singleFile/SingleFileInput.test.tsx"],"names":[],"mappings":"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"}

package/dist/components/widget/types.d.ts

@@ -39,5 +39,14 @@ export type WidgetStaticProps = WidgetBaseProps & {
     collapsible?: false;
 };
 export type WidgetProps = WidgetLinkedProps | WidgetCollapsibleProps | WidgetStaticProps;
+export type WidgetHeadingLinkProps = {
+    headingHref: string;
+    renderLink?: WidgetLinkedProps['renderLink'];
+    linkProps?: WidgetLinkedProps['linkProps'];
+} | {
+    headingHref?: undefined;
+    renderLink?: never;
+    linkProps?: never;
+};
 export {};
 //# sourceMappingURL=types.d.ts.map

package/dist/components/widget/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/widget/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAElD,MAAM,MAAM,oBAAoB,GAAG;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,SAAS,CAAC,EAAE,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,UAAU,CAAC,CAAC;CAC9F,CAAC;AAEF,KAAK,eAAe,GAAG;IACrB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,eAAe,GAAG;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,KAAK,CAAC,YAAY,CAAC;IAChE,SAAS,CAAC,EAAE,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,UAAU,CAAC,CAAC;IAC7F,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,eAAe,GAAG;IACrD,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,WAAW,EAAE,IAAI,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,eAAe,GAAG;IAChD,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,iBAAiB,GAAG,sBAAsB,GAAG,iBAAiB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/widget/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAElD,MAAM,MAAM,oBAAoB,GAAG;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,SAAS,CAAC,EAAE,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,UAAU,CAAC,CAAC;CAC9F,CAAC;AAEF,KAAK,eAAe,GAAG;IACrB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,eAAe,GAAG;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,KAAK,CAAC,YAAY,CAAC;IAChE,SAAS,CAAC,EAAE,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,UAAU,CAAC,CAAC;IAC7F,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,eAAe,GAAG;IACrD,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,WAAW,EAAE,IAAI,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,eAAe,GAAG;IAChD,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,iBAAiB,GAAG,sBAAsB,GAAG,iBAAiB,CAAC;AAGzF,MAAM,MAAM,sBAAsB,GAC5B;IACF,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,iBAAiB,CAAC,YAAY,CAAC,CAAC;IAC7C,SAAS,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;CAC5C,GACC;IACA,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,SAAS,CAAC,EAAE,KAAK,CAAC;CACnB,CAAC"}

package/dist/components/widgetCalendar/WidgetCalendar.d.ts

@@ -1,3 +1,4 @@
+import type { WidgetHeadingLinkProps } from '../widget/types.js';
 import type { WidgetCalendarEventType, WidgetCalendarItemProps } from './WidgetCalendarItem.js';
 type WidgetCalendarItemData = {
     id: string;
@@ -10,16 +11,18 @@ type WidgetCalendarItemData = {
     eventLocation?: string;
     eventSecondaryDefinition?: React.ReactNode;
     buttonA11yText?: string;
+    tooltip?: string;
+    group?: string;
 };
-type WidgetCalendarProps = {
+type WidgetCalendarProps = WidgetHeadingLinkProps & {
     heading: React.ReactNode;
     tooltip?: string;
-    headingHref?: string;
     items: WidgetCalendarItemData[];
     isFloating?: boolean;
     onItemClick?: (id: string) => void;
     emptyState?: React.ReactNode;
     className?: string;
+    groupItems?: boolean;
 };
 export declare const WidgetCalendar: {
     (props: WidgetCalendarProps): React.JSX.Element;

package/dist/components/widgetCalendar/WidgetCalendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WidgetCalendar.d.ts","sourceRoot":"","sources":["../../../src/components/widgetCalendar/WidgetCalendar.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,uBAAuB,EAAE,uBAAuB,EAAE,MAAM,yBAAyB,CAAC;AAGhG,KAAK,sBAAsB,GAAG;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,CAAC,EAAE,uBAAuB,CAAC;IACpC,gBAAgB,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,sBAAsB,EAAE,KAAK,CAAC,SAAS,CAAC;IACxC,kBAAkB,EAAE,KAAK,CAAC,SAAS,CAAC;IACpC,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,wBAAwB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3C,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,KAAK,mBAAmB,GAAG;IACzB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,sBAAsB,EAAE,CAAC;IAChC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAWF,eAAO,MAAM,cAAc;YAAW,mBAAmB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;CAwD5E,CAAC;AAIF,yBAAiB,cAAc,CAAC;IAC9B,KAAY,KAAK,GAAG,mBAAmB,CAAC;IACxC,KAAY,SAAS,GAAG,uBAAuB,CAAC;IAChD,KAAY,QAAQ,GAAG,sBAAsB,CAAC;IAC9C,KAAY,SAAS,GAAG,uBAAuB,CAAC;CACjD"}
+{"version":3,"file":"WidgetCalendar.d.ts","sourceRoot":"","sources":["../../../src/components/widgetCalendar/WidgetCalendar.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,KAAK,EAAE,uBAAuB,EAAE,uBAAuB,EAAE,MAAM,yBAAyB,CAAC;AAIhG,KAAK,sBAAsB,GAAG;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,CAAC,EAAE,uBAAuB,CAAC;IACpC,gBAAgB,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,sBAAsB,EAAE,KAAK,CAAC,SAAS,CAAC;IACxC,kBAAkB,EAAE,KAAK,CAAC,SAAS,CAAC;IACpC,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,wBAAwB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,KAAK,mBAAmB,GAAG,sBAAsB,GAAG;IAClD,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,sBAAsB,EAAE,CAAC;IAChC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAWF,eAAO,MAAM,cAAc;YAAW,mBAAmB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;CAkG5E,CAAC;AAIF,yBAAiB,cAAc,CAAC;IAC9B,KAAY,KAAK,GAAG,mBAAmB,CAAC;IACxC,KAAY,SAAS,GAAG,uBAAuB,CAAC;IAChD,KAAY,QAAQ,GAAG,sBAAsB,CAAC;IAC9C,KAAY,SAAS,GAAG,uBAAuB,CAAC;CACjD"}

package/dist/components/widgetCalendar/WidgetCalendar.js

@@ -1,22 +1,47 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { EmptyState } from '../emptyState/EmptyState.js';
 import { Icon } from '../icon/Icon.js';
 import { Widget } from '../widget/Widget.js';
 import { WidgetCalendarItem } from './WidgetCalendarItem.js';
+import { Fragment } from 'react/jsx-runtime';
 const defaultEmptyState = (_jsx(EmptyState, { padding: "md", illustration: _jsx(Icon, { name: "date", size: 24 }), heading: "Nothing scheduled", subHeading: "There are no upcoming events." }));
 export const WidgetCalendar = (props) => {
-    const { heading, tooltip, headingHref, items, isFloating = false, onItemClick, emptyState = defaultEmptyState, className, } = props;
+    const { heading, tooltip, headingHref, renderLink, linkProps, items, isFloating = false, onItemClick, emptyState = defaultEmptyState, className, groupItems, } = props;
     const isEmpty = items.length === 0;
-    const body = (_jsxs(_Fragment, { children: [_jsx(Widget.Header, { children: heading }), _jsx(Widget.Body, { children: !isEmpty && (_jsx("ul", { className: "ds-widget-calendar__list", children: items.map(item => (_jsx(WidgetCalendarItem, { id: item.id, eventType: item.eventType, eventPrimaryTerm: item.eventPrimaryTerm, eventPrimaryDefinition: item.eventPrimaryDefinition, eventSecondaryTerm: item.eventSecondaryTerm, eventDateTime: item.eventDateTime, eventTimeLabel: item.eventTimeLabel, eventLocation: item.eventLocation, eventSecondaryDefinition: item.eventSecondaryDefinition, buttonA11yText: item.buttonA11yText, onItemClick: onItemClick ? () => onItemClick(item.id) : undefined }, item.id))) })) })] }));
+    const groups = ['_ungrouped'];
+    const groupMap = {
+        _ungrouped: [],
+    };
+    if (groupItems) {
+        items.forEach((item) => {
+            if (item.group) {
+                if (!groups.includes(item.group)) {
+                    groupMap[item.group] = [];
+                    groups.push(item.group);
+                }
+                groupMap[item.group]?.push(item);
+            }
+            else {
+                groupMap._ungrouped.push(item);
+            }
+        });
+    }
+    else {
+        groupMap._ungrouped = [...items];
+    }
     const widgetProps = {
         tooltip,
         isFloating,
         isEmpty,
         emptyState,
         className,
-        ...(headingHref ? { href: headingHref } : {}),
+        ...(headingHref ? { href: headingHref, renderLink, linkProps } : {}),
     };
-    return (_jsx(Widget, { ...widgetProps, children: body }));
+    return (_jsxs(Widget, { ...widgetProps, children: [_jsx(Widget.Header, { children: heading }), _jsx(Widget.Body, { children: !isEmpty && (groups.map((group) => {
+                    const label = group;
+                    const eventItems = groupMap[group];
+                    return (_jsxs(Fragment, { children: [label !== '_ungrouped' && (_jsx("span", { className: "ds-widget-calendar__group-heading", children: label }, `groupLabel_${label}`)), eventItems.length > 0 && (_jsx("ul", { className: "ds-widget-calendar__list", children: eventItems.map(item => (_jsx(WidgetCalendarItem, { id: item.id, eventType: item.eventType, eventPrimaryTerm: item.eventPrimaryTerm, eventPrimaryDefinition: item.eventPrimaryDefinition, eventSecondaryTerm: item.eventSecondaryTerm, eventDateTime: item.eventDateTime, eventTimeLabel: item.eventTimeLabel, eventLocation: item.eventLocation, eventSecondaryDefinition: item.eventSecondaryDefinition, buttonA11yText: item.buttonA11yText, onItemClick: onItemClick ? () => onItemClick(item.id) : undefined, tooltip: item.tooltip }, item.id))) }, label))] }, `widgetCalendarGroup_${group}`));
+                })) })] }));
 };
 WidgetCalendar.Item = WidgetCalendarItem;
 //# sourceMappingURL=WidgetCalendar.js.map

package/dist/components/widgetCalendar/WidgetCalendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"WidgetCalendar.js","sourceRoot":"","sources":["../../../src/components/widgetCalendar/WidgetCalendar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,kCAAkC,CAAC;AAC9D,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AA0B7D,MAAM,iBAAiB,GAAG,CACxB,KAAC,UAAU,IACT,OAAO,EAAC,IAAI,EACZ,YAAY,EAAE,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAE,EAAE,GAAI,EAC5C,OAAO,EAAC,mBAAmB,EAC3B,UAAU,EAAC,+BAA+B,GAC1C,CACH,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,KAA0B,EAAqB,EAAE;IAC9E,MAAM,EACJ,OAAO,EACP,OAAO,EACP,WAAW,EACX,KAAK,EACL,UAAU,GAAG,KAAK,EAClB,WAAW,EACX,UAAU,GAAG,iBAAiB,EAC9B,SAAS,GACV,GAAG,KAAK,CAAC;IAEV,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,KAAK,CAAC,CAAC;IAEnC,MAAM,IAAI,GAAG,CACX,8BACE,KAAC,MAAM,CAAC,MAAM,cAAE,OAAO,GAAiB,EACxC,KAAC,MAAM,CAAC,IAAI,cACT,CAAC,OAAO,IAAI,CACX,aAAI,SAAS,EAAC,0BAA0B,YACrC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACjB,KAAC,kBAAkB,IAEjB,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,gBAAgB,EAAE,IAAI,CAAC,gBAAgB,EACvC,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,EACnD,kBAAkB,EAAE,IAAI,CAAC,kBAAkB,EAC3C,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,wBAAwB,EAAE,IAAI,CAAC,wBAAwB,EACvD,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,WAAW,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,IAX5D,IAAI,CAAC,EAAE,CAYZ,CACH,CAAC,GACC,CACN,GACW,IACb,CACJ,CAAC;IAEF,MAAM,WAAW,GAAG;QAClB,OAAO;QACP,UAAU;QACV,OAAO;QACP,UAAU;QACV,SAAS;QACT,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;KAC9B,CAAC;IAElB,OAAO,CACL,KAAC,MAAM,OAAK,WAAW,YACpB,IAAI,GACE,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,cAAc,CAAC,IAAI,GAAG,kBAAkB,CAAC"}
+{"version":3,"file":"WidgetCalendar.js","sourceRoot":"","sources":["../../../src/components/widgetCalendar/WidgetCalendar.tsx"],"names":[],"mappings":"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"}

package/dist/components/widgetCalendar/WidgetCalendar.stories.d.ts

@@ -4,10 +4,9 @@ declare function WidgetCalendarDocsPage(): import("react").JSX.Element;
 declare const meta: {
     title: string;
     component: {
-        (props: {
+        (props: import("../widget/types.js").WidgetHeadingLinkProps & {
             heading: React.ReactNode;
             tooltip?: string;
-            headingHref?: string;
             items: {
                 id: string;
                 eventType?: import("./WidgetCalendarItem.js").WidgetCalendarEventType;
@@ -19,11 +18,14 @@ declare const meta: {
                 eventLocation?: string;
                 eventSecondaryDefinition?: React.ReactNode;
                 buttonA11yText?: string;
+                tooltip?: string;
+                group?: string;
             }[];
             isFloating?: boolean;
             onItemClick?: (id: string) => void;
             emptyState?: React.ReactNode;
             className?: string;
+            groupItems?: boolean;
         }): React.JSX.Element;
         Item: (props: import("./WidgetCalendarItem.js").WidgetCalendarItemProps) => React.JSX.Element;
     };
@@ -113,20 +115,36 @@ declare const meta: {
                 };
             };
         };
+        groupItems: {
+            control: "boolean";
+            description: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
     };
 };
 export default meta;
 type Story = StoryObj<typeof WidgetCalendar>;
 export declare const Default: Story;
 export declare const Interactive: Story;
+export declare const WithHeadingLinkProps: Story;
 export declare const PrimaryEventType: Story;
 export declare const SecondaryEventType: Story;
 export declare const NonInteractiveItems: Story;
 export declare const WithoutLocation: Story;
 export declare const CustomSecondaryContent: Story;
 export declare const WithTooltip: Story;
+export declare const WithItemTooltips: Story;
 export declare const Empty: Story;
 export declare const CustomEmptyState: Story;
 export declare const FixedHeightOverflow: Story;
 export declare const Composable: Story;
+export declare const Grouped: Story;
+export declare const Ungrouped: Story;
 //# sourceMappingURL=WidgetCalendar.stories.d.ts.map

package/dist/components/widgetCalendar/WidgetCalendar.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WidgetCalendar.stories.d.ts","sourceRoot":"","sources":["../../../src/components/widgetCalendar/WidgetCalendar.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAa5D,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AA0JrD,iBAAS,sBAAsB,gCAmB9B;AAMD,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiF6B,CAAC;AAExC,eAAe,IAAI,CAAC;AAGpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,cAAc,CAAC,CAAC;AA0G7C,eAAO,MAAM,OAAO,EAAE,KAgBrB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAsCzB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KA6B9B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KA6BhC,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KA6BjC,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAwB7B,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KA0BpC,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAoBzB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAUnB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAiB9B,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAmBjC,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAkDxB,CAAC"}
+{"version":3,"file":"WidgetCalendar.stories.d.ts","sourceRoot":"","sources":["../../../src/components/widgetCalendar/WidgetCalendar.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAa5D,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAwOrD,iBAAS,sBAAsB,gCAmB9B;AAMD,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiG6B,CAAC;AAExC,eAAe,IAAI,CAAC;AAGpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,cAAc,CAAC,CAAC;AAoJ7C,eAAO,MAAM,OAAO,EAAE,KAgBrB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAsCzB,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAgDlC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KA6B9B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KA6BhC,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KA6BjC,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAwB7B,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KA0BpC,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAoBzB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAwC9B,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAUnB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAiB9B,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAmBjC,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAkDxB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAwCrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAoCvB,CAAC"}