@bspk/ui 1.1.34 → 1.3.0

package/dist/components/ButtonDock/ButtonDockExample.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const presets = [
+    {
+        label: 'One Button',
+        propState: {
+            mode: 'inline',
+            primaryButton: {
+                children: 'Send',
+                label: 'send',
+            },
+            secondaryButton: undefined,
+        },
+    },
+    {
+        label: 'Two Buttons',
+        propState: {
+            mode: 'inline',
+            arrangement: 'fill',
+            secondaryButton: {
+                children: 'Cancel',
+                label: 'cancel',
+            },
+            primaryButton: {
+                children: 'Send',
+                label: 'send',
+            },
+        },
+    },
+    {
+        label: 'Two Buttons Spread',
+        propState: {
+            mode: 'inline',
+            arrangement: 'spread',
+            secondaryButton: {
+                children: 'Cancel',
+                label: 'cancel',
+            },
+            primaryButton: {
+                children: 'Send',
+                label: 'send',
+            },
+        },
+    },
+];
+export const ButtonDockExample = ({ action }) => ({
+    containerStyle: {
+        height: '200px',
+        width: '100%',
+        padding: '0 0 16px 0',
+        justifyContent: 'end',
+        overflow: 'hidden',
+    },
+    defaultState: presets[1].propState,
+    disableProps: [],
+    presets,
+    render: ({ props, Component }) => {
+        const newProps = { ...props };
+        if (newProps.primaryButton) {
+            newProps.primaryButton = {
+                ...newProps.primaryButton,
+                onClick: () => action('Primary button clicked!'),
+            };
+        }
+        if (newProps.secondaryButton) {
+            newProps.secondaryButton = {
+                ...newProps.secondaryButton,
+                onClick: () => action('Secondary button clicked!'),
+            };
+        }
+        return _jsx(Component, { ...newProps });
+    },
+    sections: [],
+    variants: false,
+});
+//# sourceMappingURL=ButtonDockExample.js.map

package/dist/components/ButtonDock/ButtonDockExample.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonDockExample.js","sourceRoot":"","sources":["../../../src/components/ButtonDock/ButtonDockExample.tsx"],"names":[],"mappings":";AAGA,MAAM,CAAC,MAAM,OAAO,GAA8B;IAC9C;QACI,KAAK,EAAE,YAAY;QACnB,SAAS,EAAE;YACP,IAAI,EAAE,QAAQ;YACd,aAAa,EAAE;gBACX,QAAQ,EAAE,MAAM;gBAChB,KAAK,EAAE,MAAM;aAChB;YACD,eAAe,EAAE,SAAS;SAC7B;KACJ;IACD;QACI,KAAK,EAAE,aAAa;QACpB,SAAS,EAAE;YACP,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,MAAM;YACnB,eAAe,EAAE;gBACb,QAAQ,EAAE,QAAQ;gBAClB,KAAK,EAAE,QAAQ;aAClB;YACD,aAAa,EAAE;gBACX,QAAQ,EAAE,MAAM;gBAChB,KAAK,EAAE,MAAM;aAChB;SACJ;KACJ;IACD;QACI,KAAK,EAAE,oBAAoB;QAC3B,SAAS,EAAE;YACP,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,QAAQ;YACrB,eAAe,EAAE;gBACb,QAAQ,EAAE,QAAQ;gBAClB,KAAK,EAAE,QAAQ;aAClB;YACD,aAAa,EAAE;gBACX,QAAQ,EAAE,MAAM;gBAChB,KAAK,EAAE,MAAM;aAChB;SACJ;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAwC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;IACnF,cAAc,EAAE;QACZ,MAAM,EAAE,OAAO;QACf,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,YAAY;QACrB,cAAc,EAAE,KAAK;QACrB,QAAQ,EAAE,QAAQ;KACrB;IACD,YAAY,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS;IAClC,YAAY,EAAE,EAAE;IAChB,OAAO;IACP,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QAC7B,MAAM,QAAQ,GAAG,EAAE,GAAG,KAAK,EAAE,CAAC;QAC9B,IAAI,QAAQ,CAAC,aAAa,EAAE,CAAC;YACzB,QAAQ,CAAC,aAAa,GAAG;gBACrB,GAAG,QAAQ,CAAC,aAAa;gBACzB,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,yBAAyB,CAAC;aACnD,CAAC;QACN,CAAC;QACD,IAAI,QAAQ,CAAC,eAAe,EAAE,CAAC;YAC3B,QAAQ,CAAC,eAAe,GAAG;gBACvB,GAAG,QAAQ,CAAC,eAAe;gBAC3B,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,2BAA2B,CAAC;aACrD,CAAC;QACN,CAAC;QACD,OAAO,KAAC,SAAS,OAAK,QAAQ,GAAI,CAAC;IACvC,CAAC;IACD,QAAQ,EAAE,EAAE;IACZ,QAAQ,EAAE,KAAK;CAClB,CAAC,CAAC"}

package/dist/components/ButtonDock/button-dock.css

@@ -0,0 +1,42 @@
+[data-bspk=button-dock] {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  padding: var(--spacing-sizing-02) var(--spacing-sizing-04);
+  gap: var(--spacing-sizing-04);
+}
+[data-bspk=button-dock][data-arrangement=fill] {
+  display: flex;
+}
+[data-bspk=button-dock][data-arrangement=fill] [data-bspk=button] {
+  flex: 1;
+}
+[data-bspk=button-dock][data-arrangement=spread] {
+  display: grid;
+  grid-template-columns: max-content 1fr max-content;
+  align-items: center;
+  width: 100%;
+}
+[data-bspk=button-dock][data-arrangement=spread] [data-bspk=button] {
+  min-width: var(--spacing-sizing-12);
+  justify-self: stretch;
+}
+[data-bspk=button-dock][data-arrangement=spread] [data-bspk=button]:first-child {
+  grid-column: 1;
+}
+[data-bspk=button-dock][data-arrangement=spread] [data-bspk=button]:last-child {
+  grid-column: 3;
+}
+[data-bspk=button-dock][data-mode=fixed] {
+  position: fixed;
+  bottom: 0;
+  right: 0;
+  left: 0;
+  background: var(--surface-neutral-t1-base);
+  box-shadow: var(--drop-shadow-north);
+  z-index: var(--z-index-button-dock);
+}
+
+/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/ButtonDock/button-dock.css.js

@@ -0,0 +1,47 @@
+/** * This file is generated by the build script.
+* Do not edit this file directly. */
+const style = document.createElement('style');
+style.appendChild(document.createTextNode(`[data-bspk=button-dock] {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  padding: var(--spacing-sizing-02) var(--spacing-sizing-04);
+  gap: var(--spacing-sizing-04);
+}
+[data-bspk=button-dock][data-arrangement=fill] {
+  display: flex;
+}
+[data-bspk=button-dock][data-arrangement=fill] [data-bspk=button] {
+  flex: 1;
+}
+[data-bspk=button-dock][data-arrangement=spread] {
+  display: grid;
+  grid-template-columns: max-content 1fr max-content;
+  align-items: center;
+  width: 100%;
+}
+[data-bspk=button-dock][data-arrangement=spread] [data-bspk=button] {
+  min-width: var(--spacing-sizing-12);
+  justify-self: stretch;
+}
+[data-bspk=button-dock][data-arrangement=spread] [data-bspk=button]:first-child {
+  grid-column: 1;
+}
+[data-bspk=button-dock][data-arrangement=spread] [data-bspk=button]:last-child {
+  grid-column: 3;
+}
+[data-bspk=button-dock][data-mode=fixed] {
+  position: fixed;
+  bottom: 0;
+  right: 0;
+  left: 0;
+  background: var(--surface-neutral-t1-base);
+  box-shadow: var(--drop-shadow-north);
+  z-index: var(--z-index-button-dock);
+}
+
+/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
+`));
+document.head.appendChild(style);

package/dist/components/ButtonDock/index.d.ts

@@ -0,0 +1 @@
+export * from './ButtonDock';

package/dist/components/ButtonDock/index.js

@@ -0,0 +1,2 @@
+export * from './ButtonDock';
+//# sourceMappingURL=index.js.map

package/dist/components/ButtonDock/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ButtonDock/index.tsx"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/components/CalendarPicker/CalendarPicker.d.ts

@@ -0,0 +1,32 @@
+import './calendar-picker.scss';
+export type CalendarPickerProps = {
+    /**
+     * The currently selected date
+     *
+     * @type Date
+     */
+    value: Date | undefined;
+    /** Fires when the date changes with the new date */
+    onChange: (newDate: Date) => void;
+    /**
+     * Determines how the CalendarPicker will appear.
+     *
+     * @default flat
+     */
+    variant?: 'elevated' | 'flat';
+};
+/**
+ * A component or widget that allows customers to select the date, month, and year.
+ *
+ * @example
+ *     import { CalendarPicker } from '@bspk/ui/CalendarPicker';
+ *
+ *     function Example() {
+ *         return <CalendarPicker>Example CalendarPicker</CalendarPicker>;
+ *     }
+ *
+ * @name CalendarPicker
+ * @phase Dev
+ */
+export declare function CalendarPicker({ value: valueProp, onChange, variant }: CalendarPickerProps): import("react/jsx-runtime").JSX.Element;
+/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/CalendarPicker/CalendarPicker.js

@@ -0,0 +1,203 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import './calendar-picker.css.js';
+import { SvgChevronLeft } from '@bspk/icons/ChevronLeft';
+import { SvgChevronRight } from '@bspk/icons/ChevronRight';
+import { SvgKeyboardDoubleArrowLeft } from '@bspk/icons/KeyboardDoubleArrowLeft';
+import { SvgKeyboardDoubleArrowRight } from '@bspk/icons/KeyboardDoubleArrowRight';
+import { addDays, addMonths, addYears, endOfMonth, endOfWeek, format, startOfDecade, startOfMonth, startOfWeek, isValid, isSameDay, isSameMonth, isSameYear, setMonth, endOfDecade, } from 'date-fns';
+import { FocusTrap } from 'focus-trap-react';
+import { useMemo, useState, useEffect } from 'react';
+import { Button } from '../Button';
+import { useId } from '../../hooks/useId';
+import { getElementById } from '../../utils/dom';
+import { handleKeyDown } from '../../utils/handleKeyDown';
+/**
+ * Configuration for each of the calendar picker modes (day, month, year)
+ *
+ * This helps keep the main component cleaner and easier to read and avoid lots of conditionals.
+ */
+const CONFIG = {
+    day: {
+        header: {
+            '<<': { label: 'Previous Year', incrementFn: addYears },
+            '<': { label: 'Previous Month', incrementFn: addMonths },
+            label: (baseDate, setKind) => (_jsxs(_Fragment, { children: [_jsx(Button, { "aria-label": `Change Month, currently ${format(baseDate, 'MMMM')}`, "data-month": true, iconOnly: true, label: format(baseDate, 'MMMM'), onClick: () => setKind('month'), size: "large", variant: "tertiary" }), _jsx(Button, { "aria-label": `Change Year, currently ${baseDate.getFullYear()}`, "data-year": true, iconOnly: true, label: `${baseDate.getFullYear()}`, onClick: () => setKind('year'), size: "large", variant: "tertiary" })] })),
+            '>': { label: 'Next Month', incrementFn: addMonths },
+            '>>': { label: 'Next Year', incrementFn: addYears },
+        },
+        columns: 7,
+        range: {
+            start: (date) => startOfWeek(startOfMonth(date), { weekStartsOn: 0 }),
+            end: (date) => endOfWeek(endOfMonth(date), { weekStartsOn: 0 }),
+        },
+        compare: isSameDay,
+        incrementFn: addDays,
+        optionFormatStr: 'd',
+        listboxLabel: 'Select Date',
+        ariaFormatStr: 'do MMMM yyyy',
+        listBoxHeader: (_jsxs("div", { "data-day-headers": true, children: [_jsx("span", { children: "Sun" }), _jsx("span", { children: "Mon" }), _jsx("span", { children: "Tue" }), _jsx("span", { children: "Wed" }), _jsx("span", { children: "Thu" }), _jsx("span", { children: "Fri" }), _jsx("span", { children: "Sat" })] })),
+        optionProps: ({ date, baseDate, isSelected, setBaseDate, onChange, isActive }) => ({
+            'data-non-month-day': date.getMonth() !== baseDate.getMonth() ? true : undefined,
+            onClick: () => {
+                setBaseDate(date);
+                onChange(date);
+            },
+            variant: isSelected ? 'primary' : isActive ? 'secondary' : 'tertiary',
+        }),
+    },
+    month: {
+        header: {
+            '<': { label: 'Previous Year', incrementFn: addYears },
+            '<<': null,
+            label: (baseDate, setKind) => (_jsx(Button, { "aria-label": `Change Year, currently ${baseDate.getFullYear()}`, iconOnly: true, label: `${baseDate.getFullYear()}`, onClick: () => setKind('year'), size: "large", variant: "tertiary" })),
+            '>>': null,
+            '>': { label: 'Next Year', incrementFn: addYears },
+        },
+        columns: 3,
+        range: {
+            start: (date) => setMonth(date, 0),
+            end: (date) => setMonth(date, 11),
+        },
+        incrementFn: addMonths,
+        compare: isSameMonth,
+        optionFormatStr: 'MMM',
+        listboxLabel: 'Select Month',
+        ariaFormatStr: 'MMMM yyyy',
+        optionProps: ({ date, setBaseDate, setKind, isActive }) => ({
+            onClick: () => {
+                setBaseDate(date);
+                setKind('day');
+            },
+            variant: isActive ? 'secondary' : 'tertiary',
+        }),
+    },
+    year: {
+        header: {
+            '<': { label: 'Earlier Years', incrementFn: (d) => addYears(d, -10) },
+            '<<': null,
+            label: (baseDate, setKind) => (_jsx(Button, { "aria-label": `Change Decade, currently ${startOfDecade(baseDate).getFullYear()} to ${endOfDecade(baseDate).getFullYear()}`, iconOnly: true, label: `${startOfDecade(baseDate).getFullYear() - 1} - ${startOfDecade(baseDate).getFullYear() + 10}`, onClick: () => setKind('year'), size: "large", variant: "tertiary" })),
+            '>>': null,
+            '>': { label: 'Later Years', incrementFn: (d) => addYears(d, 10) },
+        },
+        columns: 4,
+        range: {
+            start: (date) => addYears(startOfDecade(date), -1),
+            end: (date) => addYears(endOfDecade(date), 1),
+        },
+        compare: isSameYear,
+        incrementFn: addYears,
+        optionFormatStr: 'yyyy',
+        listboxLabel: 'Select Year',
+        ariaFormatStr: 'yyyy',
+        optionProps: ({ date, setBaseDate, setKind, isActive }) => ({
+            onClick: () => {
+                setBaseDate(date);
+                setKind('month');
+            },
+            variant: isActive ? 'secondary' : 'tertiary',
+        }),
+    },
+};
+/**
+ * A component or widget that allows customers to select the date, month, and year.
+ *
+ * @example
+ *     import { CalendarPicker } from '@bspk/ui/CalendarPicker';
+ *
+ *     function Example() {
+ *         return <CalendarPicker>Example CalendarPicker</CalendarPicker>;
+ *     }
+ *
+ * @name CalendarPicker
+ * @phase Dev
+ */
+export function CalendarPicker({ value: valueProp, onChange, variant = 'flat' }) {
+    const baseId = useId();
+    const [kind, setKind] = useState('day');
+    const config = useMemo(() => CONFIG[kind], [kind]);
+    const value = useMemo(() => (valueProp && isValid(valueProp) ? valueProp : new Date()), [valueProp]);
+    const [baseDate, setBaseDate] = useState(value);
+    useEffect(() => setBaseDate(value), [value]);
+    const { items } = useItemsAndRange(config, baseDate, baseId);
+    const { handleKeyDownCapture } = useKeyDownCaptures({ config, baseDate, setBaseDate });
+    return (_jsx(FocusTrap, { focusTrapOptions: {
+            fallbackFocus: () => {
+                const idToFocus = items.find(({ value: date }) => config.compare(date, baseDate))?.id;
+                return getElementById(idToFocus);
+            },
+            clickOutsideDeactivates: true,
+        }, children: _jsxs("div", { "data-bspk": "calendar-picker", "data-kind": kind, "data-variant": variant || 'flat', children: [_jsxs("div", { "data-header": true, children: [_jsx(HeaderButton, { baseDate: baseDate, config: config.header['<<'], direction: "<<", setBaseDate: setBaseDate }), _jsx(HeaderButton, { baseDate: baseDate, config: config.header['<'], direction: "<", setBaseDate: setBaseDate }), _jsx("span", { "data-title": true, children: config.header.label(baseDate, setKind) }), _jsx(HeaderButton, { baseDate: baseDate, config: config.header['>'], direction: ">", setBaseDate: setBaseDate }), _jsx(HeaderButton, { baseDate: baseDate, config: config.header['>>'], direction: ">>", setBaseDate: setBaseDate })] }), config.listBoxHeader, _jsx("div", { "aria-label": config.listboxLabel, "data-body": true, onKeyDownCapture: handleKeyDownCapture, ref: (node) => {
+                        const idToFocus = items.find(({ value: date }) => config.compare(date, baseDate))?.id;
+                        node?.querySelector(`[id="${idToFocus}"]`)?.focus();
+                    }, role: "listbox", children: items.map(({ value: date, label, id, 'aria-label': ariaLabel }) => {
+                        const isSelected = config.compare(date, value);
+                        const isActive = config.compare(date, baseDate);
+                        const isFocusable = isActive || (!baseDate && isSelected);
+                        return (_jsx(Button, { "aria-label": ariaLabel, "aria-selected": isSelected || undefined, "data-active": isActive || undefined, id: id, innerRef: (node) => {
+                                if (isFocusable)
+                                    node?.focus();
+                            }, label: label, role: "option", size: "large", tabIndex: isFocusable ? 0 : -1, width: "hug", ...config.optionProps?.({
+                                date,
+                                baseDate,
+                                isSelected,
+                                isActive,
+                                setBaseDate,
+                                onChange,
+                                setKind,
+                            }) }, date.toString()));
+                    }) })] }) }));
+}
+/** Generates the items (days, months, years) to display based on the grid and the range start and end */
+function useItemsAndRange(config, value, baseId) {
+    return useMemo(() => {
+        const start = config.range.start(value);
+        const end = config.range.end(value);
+        const nextItems = [];
+        for (let date = start; date <= end; date = config.incrementFn(date, 1)) {
+            const label = format(date, config.optionFormatStr);
+            nextItems.push({
+                value: date,
+                label,
+                'aria-label': format(date, config.ariaFormatStr),
+                id: `${baseId}-option-${format(date, 'MM-dd-yyyy')}`,
+            });
+        }
+        return { items: nextItems, range: { start, end } };
+    }, [config, value, baseId]);
+}
+const useKeyDownCaptures = ({ config, baseDate, setBaseDate, }) => {
+    const handleItemArrows = (direction) => (event) => {
+        event.preventDefault();
+        event.stopPropagation();
+        // Determine the direction and amount to move the base date
+        // down/right is positive, up/left is negative
+        const multiplier = direction === 'down' || direction === 'right' ? 1 : -1;
+        // Moving left/right moves one increment, moving up/down moves the number of columns
+        // (e.g. in day mode, left/right moves one day, up/down moves 7 days)
+        // In month mode, left/right moves one month, up/down moves 3 months
+        // In year mode, left/right moves one year, up/down moves 4 years
+        // This is determined by the number of columns in the grid for each mode
+        const amount = direction === 'left' || direction === 'right' ? 1 : config.columns;
+        const next = config.incrementFn(baseDate, amount * multiplier);
+        setBaseDate(next);
+    };
+    return {
+        handleKeyDownCapture: handleKeyDown({
+            ArrowDown: handleItemArrows('down'),
+            ArrowUp: handleItemArrows('up'),
+            ArrowLeft: handleItemArrows('left'),
+            ArrowRight: handleItemArrows('right'),
+        }),
+    };
+};
+const HEADER_DIRECTION_ICONS = {
+    '<': _jsx(SvgChevronLeft, {}),
+    '<<': _jsx(SvgKeyboardDoubleArrowLeft, {}),
+    '>': _jsx(SvgChevronRight, {}),
+    '>>': _jsx(SvgKeyboardDoubleArrowRight, {}),
+};
+// eslint-disable-next-line react/no-multi-comp
+function HeaderButton({ direction, config, setBaseDate, baseDate, }) {
+    return (config && (_jsx(Button, { icon: HEADER_DIRECTION_ICONS[direction], iconOnly: true, label: config.label, onClick: () => setBaseDate(config.incrementFn(baseDate, direction.startsWith('<') ? -1 : 1)), size: "large", variant: "tertiary" }, direction)));
+}
+//# sourceMappingURL=CalendarPicker.js.map

package/dist/components/CalendarPicker/CalendarPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarPicker.js","sourceRoot":"","sources":["../../../src/components/CalendarPicker/CalendarPicker.tsx"],"names":[],"mappings":";AAAA,OAAO,wBAAwB,CAAC;AAChC,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC3D,OAAO,EAAE,0BAA0B,EAAE,MAAM,qCAAqC,CAAC;AACjF,OAAO,EAAE,2BAA2B,EAAE,MAAM,sCAAsC,CAAC;AACnF,OAAO,EACH,OAAO,EACP,SAAS,EACT,QAAQ,EACR,UAAU,EACV,SAAS,EACT,MAAM,EACN,aAAa,EACb,YAAY,EACZ,WAAW,EACX,OAAO,EACP,SAAS,EACT,WAAW,EACX,UAAU,EACV,QAAQ,EACR,WAAW,GACd,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,QAAQ,EAA4B,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/E,OAAO,EAAE,MAAM,EAAe,MAAM,qBAAqB,CAAC;AAE1D,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAqCtD;;;;GAIG;AACH,MAAM,MAAM,GAA6B;IACrC,GAAG,EAAE;QACD,MAAM,EAAE;YACJ,IAAI,EAAE,EAAE,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,QAAQ,EAAE;YACvD,GAAG,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,WAAW,EAAE,SAAS,EAAE;YACxD,KAAK,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,CAAC,CAC1B,8BACI,KAAC,MAAM,kBACS,2BAA2B,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,EAAE,sBAEjE,QAAQ,QACR,KAAK,EAAE,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,EAC/B,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,EAC/B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,GACpB,EACF,KAAC,MAAM,kBACS,0BAA0B,QAAQ,CAAC,WAAW,EAAE,EAAE,qBAE9D,QAAQ,QACR,KAAK,EAAE,GAAG,QAAQ,CAAC,WAAW,EAAE,EAAE,EAClC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,EAC9B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,GACpB,IACH,CACN;YACD,GAAG,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE;YACpD,IAAI,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE;SACtD;QACD,OAAO,EAAE,CAAC;QACV,KAAK,EAAE;YACH,KAAK,EAAE,CAAC,IAAU,EAAE,EAAE,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;YAC3E,GAAG,EAAE,CAAC,IAAU,EAAE,EAAE,CAAC,SAAS,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;SACxE;QACD,OAAO,EAAE,SAAS;QAClB,WAAW,EAAE,OAAO;QACpB,eAAe,EAAE,GAAG;QACpB,YAAY,EAAE,aAAa;QAC3B,aAAa,EAAE,cAAc;QAC7B,aAAa,EAAE,CACX,oDACI,iCAAgB,EAChB,iCAAgB,EAChB,iCAAgB,EAChB,iCAAgB,EAChB,iCAAgB,EAChB,iCAAgB,EAChB,iCAAgB,IACd,CACT;QACD,WAAW,EAAE,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC;YAC/E,oBAAoB,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YAChF,OAAO,EAAE,GAAG,EAAE;gBACV,WAAW,CAAC,IAAI,CAAC,CAAC;gBAClB,QAAQ,CAAC,IAAI,CAAC,CAAC;YACnB,CAAC;YACD,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU;SACxE,CAAC;KACL;IACD,KAAK,EAAE;QACH,MAAM,EAAE;YACJ,GAAG,EAAE,EAAE,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,QAAQ,EAAE;YACtD,IAAI,EAAE,IAAI;YACV,KAAK,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,CAAC,CAC1B,KAAC,MAAM,kBACS,0BAA0B,QAAQ,CAAC,WAAW,EAAE,EAAE,EAC9D,QAAQ,QACR,KAAK,EAAE,GAAG,QAAQ,CAAC,WAAW,EAAE,EAAE,EAClC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,EAC9B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,GACpB,CACL;YACD,IAAI,EAAE,IAAI;YACV,GAAG,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE;SACrD;QACD,OAAO,EAAE,CAAC;QACV,KAAK,EAAE;YACH,KAAK,EAAE,CAAC,IAAU,EAAE,EAAE,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC;YACxC,GAAG,EAAE,CAAC,IAAU,EAAE,EAAE,CAAC,QAAQ,CAAC,IAAI,EAAE,EAAE,CAAC;SAC1C;QACD,WAAW,EAAE,SAAS;QACtB,OAAO,EAAE,WAAW;QACpB,eAAe,EAAE,KAAK;QACtB,YAAY,EAAE,cAAc;QAC5B,aAAa,EAAE,WAAW;QAC1B,WAAW,EAAE,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC;YACxD,OAAO,EAAE,GAAG,EAAE;gBACV,WAAW,CAAC,IAAI,CAAC,CAAC;gBAClB,OAAO,CAAC,KAAK,CAAC,CAAC;YACnB,CAAC;YACD,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU;SAC/C,CAAC;KACL;IACD,IAAI,EAAE;QACF,MAAM,EAAE;YACJ,GAAG,EAAE,EAAE,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;YACrE,IAAI,EAAE,IAAI;YACV,KAAK,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,CAAC,CAC1B,KAAC,MAAM,kBACS,4BAA4B,aAAa,CAAC,QAAQ,CAAC,CAAC,WAAW,EAAE,OAAO,WAAW,CAC3F,QAAQ,CACX,CAAC,WAAW,EAAE,EAAE,EACjB,QAAQ,QACR,KAAK,EAAE,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAC,WAAW,EAAE,GAAG,CAAC,MAAM,aAAa,CAAC,QAAQ,CAAC,CAAC,WAAW,EAAE,GAAG,EAAE,EAAE,EACrG,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,EAC9B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,GACpB,CACL;YACD,IAAI,EAAE,IAAI;YACV,GAAG,EAAE,EAAE,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE;SACrE;QACD,OAAO,EAAE,CAAC;QACV,KAAK,EAAE;YACH,KAAK,EAAE,CAAC,IAAU,EAAE,EAAE,CAAC,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;YACxD,GAAG,EAAE,CAAC,IAAU,EAAE,EAAE,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;SACtD;QACD,OAAO,EAAE,UAAU;QACnB,WAAW,EAAE,QAAQ;QACrB,eAAe,EAAE,MAAM;QACvB,YAAY,EAAE,aAAa;QAC3B,aAAa,EAAE,MAAM;QACrB,WAAW,EAAE,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC;YACxD,OAAO,EAAE,GAAG,EAAE;gBACV,WAAW,CAAC,IAAI,CAAC,CAAC;gBAClB,OAAO,CAAC,OAAO,CAAC,CAAC;YACrB,CAAC;YACD,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU;SAC/C,CAAC;KACL;CACJ,CAAC;AAmBF;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,cAAc,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,GAAG,MAAM,EAAuB;IAChG,MAAM,MAAM,GAAG,KAAK,EAAE,CAAC;IACvB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAO,KAAK,CAAC,CAAC;IAC9C,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IACnD,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,SAAS,IAAI,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAErG,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAO,KAAK,CAAC,CAAC;IACtD,SAAS,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAE7C,MAAM,EAAE,KAAK,EAAE,GAAG,gBAAgB,CAAC,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC;IAE7D,MAAM,EAAE,oBAAoB,EAAE,GAAG,kBAAkB,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,CAAC,CAAC;IAEvF,OAAO,CACH,KAAC,SAAS,IACN,gBAAgB,EAAE;YACd,aAAa,EAAE,GAAG,EAAE;gBAChB,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,EAAE,EAAE,CAAC;gBACtF,OAAO,cAAc,CAAC,SAAS,CAAE,CAAC;YACtC,CAAC;YACD,uBAAuB,EAAE,IAAI;SAChC,YAED,4BAAe,iBAAiB,eAAY,IAAI,kBAAgB,OAAO,IAAI,MAAM,aAC7E,+CACI,KAAC,YAAY,IACT,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,EAC3B,SAAS,EAAC,IAAI,EACd,WAAW,EAAE,WAAW,GAC1B,EACF,KAAC,YAAY,IACT,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,EAC1B,SAAS,EAAC,GAAG,EACb,WAAW,EAAE,WAAW,GAC1B,EACF,6CAAkB,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,OAAO,CAAC,GAAQ,EAChE,KAAC,YAAY,IACT,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,EAC1B,SAAS,EAAC,GAAG,EACb,WAAW,EAAE,WAAW,GAC1B,EACF,KAAC,YAAY,IACT,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,EAC3B,SAAS,EAAC,IAAI,EACd,WAAW,EAAE,WAAW,GAC1B,IACA,EACL,MAAM,CAAC,aAAa,EACrB,4BACgB,MAAM,CAAC,YAAY,qBAE/B,gBAAgB,EAAE,oBAAoB,EACtC,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE;wBACV,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,EAAE,EAAE,CAAC;wBACtF,IAAI,EAAE,aAAa,CAAc,QAAQ,SAAS,IAAI,CAAC,EAAE,KAAK,EAAE,CAAC;oBACrE,CAAC,EACD,IAAI,EAAC,SAAS,YAEb,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,EAAE;wBAC/D,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;wBAC/C,MAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;wBAChD,MAAM,WAAW,GAAG,QAAQ,IAAI,CAAC,CAAC,QAAQ,IAAI,UAAU,CAAC,CAAC;wBAC1D,OAAO,CACH,KAAC,MAAM,kBACS,SAAS,mBACN,UAAU,IAAI,SAAS,iBACzB,QAAQ,IAAI,SAAS,EAClC,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE;gCACf,IAAI,WAAW;oCAAE,IAAI,EAAE,KAAK,EAAE,CAAC;4BACnC,CAAC,EAED,KAAK,EAAE,KAAK,EACZ,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAC9B,KAAK,EAAC,KAAK,KACP,MAAM,CAAC,WAAW,EAAE,CAAC;gCACrB,IAAI;gCACJ,QAAQ;gCACR,UAAU;gCACV,QAAQ;gCACR,WAAW;gCACX,QAAQ;gCACR,OAAO;6BACV,CAAC,IAdG,IAAI,CAAC,QAAQ,EAAE,CAetB,CACL,CAAC;oBACN,CAAC,CAAC,GACA,IACJ,GACE,CACf,CAAC;AACN,CAAC;AAED,yGAAyG;AACzG,SAAS,gBAAgB,CAAC,MAAkB,EAAE,KAAW,EAAE,MAAc;IACrE,OAAO,OAAO,CAAC,GAAG,EAAE;QAChB,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QACxC,MAAM,GAAG,GAAG,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;QACpC,MAAM,SAAS,GAAwC,EAAE,CAAC;QAE1D,KAAK,IAAI,IAAI,GAAG,KAAK,EAAE,IAAI,IAAI,GAAG,EAAE,IAAI,GAAG,MAAM,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC;YACrE,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC;YACnD,SAAS,CAAC,IAAI,CAAC;gBACX,KAAK,EAAE,IAAI;gBACX,KAAK;gBACL,YAAY,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,aAAa,CAAC;gBAChD,EAAE,EAAE,GAAG,MAAM,WAAW,MAAM,CAAC,IAAI,EAAE,YAAY,CAAC,EAAE;aACvD,CAAC,CAAC;QACP,CAAC;QAED,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC;IACvD,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC;AAChC,CAAC;AAED,MAAM,kBAAkB,GAAG,CAAC,EACxB,MAAM,EACN,QAAQ,EACR,WAAW,GAKd,EAAE,EAAE;IACD,MAAM,gBAAgB,GAAG,CAAC,SAA2C,EAAE,EAAE,CAAC,CAAC,KAAoB,EAAE,EAAE;QAC/F,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,2DAA2D;QAC3D,8CAA8C;QAC9C,MAAM,UAAU,GAAG,SAAS,KAAK,MAAM,IAAI,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC1E,oFAAoF;QACpF,qEAAqE;QACrE,oEAAoE;QACpE,iEAAiE;QACjE,wEAAwE;QACxE,MAAM,MAAM,GAAG,SAAS,KAAK,MAAM,IAAI,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;QAClF,MAAM,IAAI,GAAG,MAAM,CAAC,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,UAAU,CAAC,CAAC;QAC/D,WAAW,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,OAAO;QACH,oBAAoB,EAAE,aAAa,CAAC;YAChC,SAAS,EAAE,gBAAgB,CAAC,MAAM,CAAC;YACnC,OAAO,EAAE,gBAAgB,CAAC,IAAI,CAAC;YAC/B,SAAS,EAAE,gBAAgB,CAAC,MAAM,CAAC;YACnC,UAAU,EAAE,gBAAgB,CAAC,OAAO,CAAC;SACxC,CAAC;KACL,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,sBAAsB,GAAiC;IACzD,GAAG,EAAE,KAAC,cAAc,KAAG;IACvB,IAAI,EAAE,KAAC,0BAA0B,KAAG;IACpC,GAAG,EAAE,KAAC,eAAe,KAAG;IACxB,IAAI,EAAE,KAAC,2BAA2B,KAAG;CACxC,CAAC;AAEF,+CAA+C;AAC/C,SAAS,YAAY,CAAC,EAClB,SAAS,EACT,MAAM,EACN,WAAW,EACX,QAAQ,GAMX;IACG,OAAO,CACH,MAAM,IAAI,CACN,KAAC,MAAM,IACH,IAAI,EAAE,sBAAsB,CAAC,SAAS,CAAC,EACvC,QAAQ,EAAE,IAAI,EAEd,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,MAAM,CAAC,WAAW,CAAC,QAAQ,EAAE,SAAS,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAC5F,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,IAJb,SAAS,CAKhB,CACL,CACJ,CAAC;AACN,CAAC"}

package/dist/components/CalendarPicker/CalendarPickerExample.d.ts

@@ -0,0 +1,3 @@
+import { CalendarPickerProps } from '.';
+import { ComponentExampleFn } from '-/utils/demo';
+export declare const CalendarPickerExample: ComponentExampleFn<CalendarPickerProps>;

package/dist/components/CalendarPicker/CalendarPickerExample.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { isValid } from 'date-fns';
+export const CalendarPickerExample = ({ action }) => ({
+    defaultState: {
+        value: new Date(),
+    },
+    containerStyle: { width: '100%' },
+    render: ({ props, Component }) => {
+        const value = isValid(props.value) ? props.value : new Date();
+        return (_jsx(Component, { ...props, onChange: (next) => {
+                props.onChange?.(next);
+                action(`value updated to ${next.toDateString()}`);
+            }, value: value }));
+    },
+    variants: false,
+});
+//# sourceMappingURL=CalendarPickerExample.js.map

package/dist/components/CalendarPicker/CalendarPickerExample.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarPickerExample.js","sourceRoot":"","sources":["../../../src/components/CalendarPicker/CalendarPickerExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAInC,MAAM,CAAC,MAAM,qBAAqB,GAA4C,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;IAC3F,YAAY,EAAE;QACV,KAAK,EAAE,IAAI,IAAI,EAAE;KACpB;IACD,cAAc,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;IACjC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QAC7B,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC;QAC9D,OAAO,CACH,KAAC,SAAS,OACF,KAAK,EACT,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE;gBACf,KAAK,CAAC,QAAQ,EAAE,CAAC,IAAI,CAAC,CAAC;gBACvB,MAAM,CAAC,oBAAoB,IAAI,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;YACtD,CAAC,EACD,KAAK,EAAE,KAAK,GACd,CACL,CAAC;IACN,CAAC;IACD,QAAQ,EAAE,KAAK;CAClB,CAAC,CAAC"}

package/dist/components/CalendarPicker/calendar-picker.css

@@ -0,0 +1,70 @@
+[data-bspk=calendar-picker] {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  font: var(--labels-base);
+  width: 360px;
+  color: var(--foreground-neutral-on-surface);
+  gap: var(--spacing-sizing-01);
+  background: var(--surface-neutral-t1-base);
+  padding: var(--spacing-sizing-02);
+}
+[data-bspk=calendar-picker][data-variant=elevated] {
+  border-radius: var(--radius-lg);
+  box-shadow: var(--drop-shadow-float);
+}
+[data-bspk=calendar-picker] [data-header] {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0;
+  border-bottom: 1px solid var(--stroke-neutral-low);
+}
+[data-bspk=calendar-picker] [data-header] [data-title] {
+  flex-grow: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+[data-bspk=calendar-picker] [data-header] [data-title] [data-bspk=button] {
+  font: inherit;
+}
+[data-bspk=calendar-picker] [data-header] [data-title] [data-bspk=button][data-month] {
+  padding-right: var(--spacing-sizing-01);
+}
+[data-bspk=calendar-picker] [data-header] [data-title] [data-bspk=button][data-year] {
+  padding-left: var(--spacing-sizing-01);
+}
+[data-bspk=calendar-picker] [data-day-headers] {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  text-align: center;
+  color: var(--foreground-neutral-on-surface-variant-01);
+}
+[data-bspk=calendar-picker] [data-day-headers] span {
+  height: var(--spacing-sizing-12);
+  line-height: var(--spacing-sizing-12);
+}
+[data-bspk=calendar-picker] [data-body] {
+  display: grid;
+}
+[data-bspk=calendar-picker] [data-body] [data-bspk=button] {
+  margin: auto;
+}
+[data-bspk=calendar-picker] [data-body] [data-non-month-day] {
+  color: var(--foreground-neutral-on-surface-variant-02);
+}
+[data-bspk=calendar-picker][data-kind=day] {
+  padding: var(--spacing-sizing-01);
+}
+[data-bspk=calendar-picker][data-kind=day] [data-body] {
+  grid-template-columns: repeat(7, 14.2857142857%);
+}
+[data-bspk=calendar-picker][data-kind=month] [data-body] {
+  grid-template-columns: repeat(3, 33.3333333333%);
+}
+[data-bspk=calendar-picker][data-kind=year] [data-body] {
+  grid-template-columns: repeat(4, 25%);
+}
+
+/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/CalendarPicker/calendar-picker.css.js

@@ -0,0 +1,75 @@
+/** * This file is generated by the build script.
+* Do not edit this file directly. */
+const style = document.createElement('style');
+style.appendChild(document.createTextNode(`[data-bspk=calendar-picker] {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  font: var(--labels-base);
+  width: 360px;
+  color: var(--foreground-neutral-on-surface);
+  gap: var(--spacing-sizing-01);
+  background: var(--surface-neutral-t1-base);
+  padding: var(--spacing-sizing-02);
+}
+[data-bspk=calendar-picker][data-variant=elevated] {
+  border-radius: var(--radius-lg);
+  box-shadow: var(--drop-shadow-float);
+}
+[data-bspk=calendar-picker] [data-header] {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0;
+  border-bottom: 1px solid var(--stroke-neutral-low);
+}
+[data-bspk=calendar-picker] [data-header] [data-title] {
+  flex-grow: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+[data-bspk=calendar-picker] [data-header] [data-title] [data-bspk=button] {
+  font: inherit;
+}
+[data-bspk=calendar-picker] [data-header] [data-title] [data-bspk=button][data-month] {
+  padding-right: var(--spacing-sizing-01);
+}
+[data-bspk=calendar-picker] [data-header] [data-title] [data-bspk=button][data-year] {
+  padding-left: var(--spacing-sizing-01);
+}
+[data-bspk=calendar-picker] [data-day-headers] {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  text-align: center;
+  color: var(--foreground-neutral-on-surface-variant-01);
+}
+[data-bspk=calendar-picker] [data-day-headers] span {
+  height: var(--spacing-sizing-12);
+  line-height: var(--spacing-sizing-12);
+}
+[data-bspk=calendar-picker] [data-body] {
+  display: grid;
+}
+[data-bspk=calendar-picker] [data-body] [data-bspk=button] {
+  margin: auto;
+}
+[data-bspk=calendar-picker] [data-body] [data-non-month-day] {
+  color: var(--foreground-neutral-on-surface-variant-02);
+}
+[data-bspk=calendar-picker][data-kind=day] {
+  padding: var(--spacing-sizing-01);
+}
+[data-bspk=calendar-picker][data-kind=day] [data-body] {
+  grid-template-columns: repeat(7, 14.2857142857%);
+}
+[data-bspk=calendar-picker][data-kind=month] [data-body] {
+  grid-template-columns: repeat(3, 33.3333333333%);
+}
+[data-bspk=calendar-picker][data-kind=year] [data-body] {
+  grid-template-columns: repeat(4, 25%);
+}
+
+/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
+`));
+document.head.appendChild(style);

package/dist/components/CalendarPicker/index.d.ts

@@ -0,0 +1 @@
+export * from './CalendarPicker';

package/dist/components/CalendarPicker/index.js

@@ -0,0 +1,2 @@
+export * from './CalendarPicker';
+//# sourceMappingURL=index.js.map

package/dist/components/CalendarPicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/CalendarPicker/index.tsx"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC"}