@beeq/core 1.12.14-beta.0 → 1.13.0

package/dist/collection/components/date-picker/components/CalendarMonthView.js

@@ -0,0 +1,70 @@
+/*!
+ * Built by Endavans
+ * © https://beeq.design - Apache 2 License.
+ */
+import { h } from "@stencil/core";
+import { isMonthWithinBounds } from "../helper/bounds";
+import { CALENDAR_PARTS } from "../helper/constants";
+import { getMonthNames } from "../helper/intl";
+import { isRangeEnd, isRangeInner, isRangeStart, isSelected } from "../helper/selection";
+/** ISO used to compare a month cell against the internal selection. */
+const monthCellISO = (year, month) => `${year}-${String(month + 1).padStart(2, '0')}-01`;
+const buildMonthParts = (state) => {
+    const parts = [CALENDAR_PARTS.month];
+    if (state.selected)
+        parts.push(CALENDAR_PARTS.monthSelected);
+    if (state.rangeStart)
+        parts.push(CALENDAR_PARTS.rangeStart);
+    if (state.rangeEnd)
+        parts.push(CALENDAR_PARTS.rangeEnd);
+    if (state.rangeInner)
+        parts.push(CALENDAR_PARTS.rangeInner);
+    if (state.disabled)
+        parts.push(CALENDAR_PARTS.disabled);
+    return parts.join(' ');
+};
+const buildMonthCellState = (year, month, focusedMonth, minISO, maxISO, selection, type) => {
+    const iso = monthCellISO(year, month);
+    const disabled = !isMonthWithinBounds(year, month, minISO, maxISO);
+    return {
+        iso,
+        disabled,
+        selected: isSelected(iso, selection, type),
+        rangeStart: isRangeStart(iso, selection, type),
+        rangeEnd: isRangeEnd(iso, selection, type),
+        rangeInner: isRangeInner(iso, selection, type),
+        isFocused: focusedMonth === month,
+    };
+};
+const chunkMonths = (months, columns) => {
+    const rows = [];
+    for (let month = 0; month < months.length; month += columns) {
+        rows.push(months.slice(month, month + columns).map((name, offset) => ({ month: month + offset, name })));
+    }
+    return rows;
+};
+const renderMonthCell = ({ month, name, state, onMonthSelect, onMonthFocus, onMonthHover }) => (
+// biome-ignore lint/a11y/useFocusableInteractive: gridcell is a structural ARIA container; focus is managed by the child <button> via roving tabindex
+h("div", { "aria-selected": state.selected ? 'true' : undefined, class: "bq-date-picker__month-gridcell", role: "gridcell", key: month }, h("button", { "aria-disabled": state.disabled ? 'true' : undefined, class: {
+        'bq-date-picker__month-cell': true,
+        'is-selected': state.selected,
+        'is-range-start': state.rangeStart,
+        'is-range-end': state.rangeEnd,
+        'is-range-inner': state.rangeInner,
+        'is-out-of-bounds': state.disabled,
+    }, "data-month": month, disabled: state.disabled, onClick: (ev) => !state.disabled && onMonthSelect(month, ev), onFocus: () => onMonthFocus(month), onMouseEnter: () => onMonthHover(state.iso), onMouseLeave: () => onMonthHover(undefined), part: `${CALENDAR_PARTS.button} ${buildMonthParts(state)}`, tabIndex: state.isFocused ? 0 : -1, type: "button" }, name)));
+/**
+ * Month picker — 12 buttons in a 3×4 grid.
+ */
+export const CalendarMonthView = ({ year, focusedMonth, locale, minISO, maxISO, selection, tentativeRange, type, onMonthSelect, onMonthFocus, onMonthHover, onGridKeyDown, gridColumns, }) => {
+    const months = getMonthNames(locale, 'short');
+    const effectiveSelection = type === 'range' && tentativeRange.length === 2 ? tentativeRange : selection;
+    const rows = chunkMonths(months, gridColumns);
+    return (h("div", { class: "bq-date-picker__months", "data-grid-columns": String(gridColumns), onKeyDown: onGridKeyDown, part: CALENDAR_PARTS.months, role: "grid", tabIndex: -1 }, rows.map((row) => (
+    // biome-ignore lint/a11y/useFocusableInteractive: gridcell is a structural ARIA container; focus is managed by the child <button> via roving tabindex
+    h("div", { class: "bq-date-picker__month-row", role: "row", key: `month-row-${row.map(({ month }) => month).join('-')}` }, row.map(({ month, name }) => {
+        const state = buildMonthCellState(year, month, focusedMonth, minISO, maxISO, effectiveSelection, type);
+        return renderMonthCell({ month, name, state, onMonthSelect, onMonthFocus, onMonthHover });
+    }))))));
+};
+//# sourceMappingURL=CalendarMonthView.js.map

package/dist/collection/components/date-picker/components/CalendarMonthView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarMonthView.js","sourceRoot":"","sources":["../../../../../../../packages/beeq/src/components/date-picker/components/CalendarMonthView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA4B,CAAC,EAAE,MAAM,eAAe,CAAC;AAG5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AA+BzF,uEAAuE;AACvE,MAAM,YAAY,GAAG,CAAC,IAAY,EAAE,KAAa,EAAU,EAAE,CAAC,GAAG,IAAI,IAAI,MAAM,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,KAAK,CAAC;AAYjH,MAAM,eAAe,GAAG,CAAC,KAAsB,EAAU,EAAE;IACzD,MAAM,KAAK,GAAa,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAC/C,IAAI,KAAK,CAAC,QAAQ;QAAE,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;IAC7D,IAAI,KAAK,CAAC,UAAU;QAAE,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC;IAC5D,IAAI,KAAK,CAAC,QAAQ;QAAE,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;IACxD,IAAI,KAAK,CAAC,UAAU;QAAE,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC;IAC5D,IAAI,KAAK,CAAC,QAAQ;QAAE,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;IACxD,OAAO,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AACzB,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CAC1B,IAAY,EACZ,KAAa,EACb,YAAoB,EACpB,MAA0B,EAC1B,MAA0B,EAC1B,SAAqB,EACrB,IAAqB,EACJ,EAAE;IACnB,MAAM,GAAG,GAAG,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IACtC,MAAM,QAAQ,GAAG,CAAC,mBAAmB,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;IACnE,OAAO;QACL,GAAG;QACH,QAAQ;QACR,QAAQ,EAAE,UAAU,CAAC,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC;QAC1C,UAAU,EAAE,YAAY,CAAC,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC;QAC9C,QAAQ,EAAE,UAAU,CAAC,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC;QAC1C,UAAU,EAAE,YAAY,CAAC,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC;QAC9C,SAAS,EAAE,YAAY,KAAK,KAAK;KAClC,CAAC;AACJ,CAAC,CAAC;AAWF,MAAM,WAAW,GAAG,CAAC,MAAgB,EAAE,OAAe,EAAiD,EAAE;IACvG,MAAM,IAAI,GAAkD,EAAE,CAAC;IAC/D,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,IAAI,OAAO,EAAE,CAAC;QAC5D,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,GAAG,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,GAAG,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC;IAC3G,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF,MAAM,eAAe,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAAwB,EAAE,EAAE,CAAC;AACnH,sJAAsJ;AACtJ,4BACiB,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAClD,KAAK,EAAC,gCAAgC,EACtC,IAAI,EAAC,UAAU,EACf,GAAG,EAAE,KAAK;IAEV,+BACiB,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAClD,KAAK,EAAE;YACL,4BAA4B,EAAE,IAAI;YAClC,aAAa,EAAE,KAAK,CAAC,QAAQ;YAC7B,gBAAgB,EAAE,KAAK,CAAC,UAAU;YAClC,cAAc,EAAE,KAAK,CAAC,QAAQ;YAC9B,gBAAgB,EAAE,KAAK,CAAC,UAAU;YAClC,kBAAkB,EAAE,KAAK,CAAC,QAAQ;SACnC,gBACW,KAAK,EACjB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ,IAAI,aAAa,CAAC,KAAK,EAAE,EAAE,CAAC,EAC5D,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,EAClC,YAAY,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,GAAG,CAAC,EAC3C,YAAY,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,EAC3C,IAAI,EAAE,GAAG,cAAc,CAAC,MAAM,IAAI,eAAe,CAAC,KAAK,CAAC,EAAE,EAC1D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAClC,IAAI,EAAC,QAAQ,IAEZ,IAAI,CACE,CACL,CACP,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAiD,CAAC,EAC9E,IAAI,EACJ,YAAY,EACZ,MAAM,EACN,MAAM,EACN,MAAM,EACN,SAAS,EACT,cAAc,EACd,IAAI,EACJ,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,WAAW,GACZ,EAAE,EAAE;IACH,MAAM,MAAM,GAAG,aAAa,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,MAAM,kBAAkB,GAAe,IAAI,KAAK,OAAO,IAAI,cAAc,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC;IACpH,MAAM,IAAI,GAAG,WAAW,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IAE9C,OAAO,CACL,WACE,KAAK,EAAC,wBAAwB,uBACX,MAAM,CAAC,WAAW,CAAC,EACtC,SAAS,EAAE,aAAa,EACxB,IAAI,EAAE,cAAc,CAAC,MAAM,EAC3B,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,CAAC,CAAC,IAEX,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC;IACjB,sJAAsJ;IACtJ,WAAK,KAAK,EAAC,2BAA2B,EAAC,IAAI,EAAC,KAAK,EAAC,GAAG,EAAE,aAAa,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,IAC1G,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;QAC3B,MAAM,KAAK,GAAG,mBAAmB,CAAC,IAAI,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,EAAE,kBAAkB,EAAE,IAAI,CAAC,CAAC;QACvG,OAAO,eAAe,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAAE,CAAC,CAAC;IAC5F,CAAC,CAAC,CACE,CACP,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { type FunctionalComponent, h } from '@stencil/core';\n\nimport type { TDatePickerType, TSelection } from '../bq-date-picker.types';\nimport { isMonthWithinBounds } from '../helper/bounds';\nimport { CALENDAR_PARTS } from '../helper/constants';\nimport { getMonthNames } from '../helper/intl';\nimport { isRangeEnd, isRangeInner, isRangeStart, isSelected } from '../helper/selection';\n\nexport type TCalendarMonthViewProps = {\n  /** Year currently shown in the header. */\n  year: number;\n  /** Focused month (0-based), used for the roving tabindex. */\n  focusedMonth: number;\n  /** Locale used for localized month names. */\n  locale: Intl.LocalesArgument;\n  /** Min year/month to keep enabled. */\n  minISO?: string;\n  /** Max year/month to keep enabled. */\n  maxISO?: string;\n  /** Current selection (as stored internally: array of YYYY-MM-DD). */\n  selection: TSelection;\n  /** In-progress range preview while hovering a second endpoint. */\n  tentativeRange: TSelection;\n  /** Selection type — drives multi / range highlighting. */\n  type: TDatePickerType;\n  /** Callback fired when the user picks a month. */\n  onMonthSelect: (month: number, ev: MouseEvent | KeyboardEvent) => void;\n  /** Callback fired when a month button receives focus. */\n  onMonthFocus: (month: number) => void;\n  /** Callback fired when hovering a month cell (range preview). */\n  onMonthHover: (iso: string | undefined) => void;\n  /** Optional keydown handler for the grid (roving tabindex management). */\n  onGridKeyDown: (ev: KeyboardEvent) => void;\n  /** Number of columns rendered by the month grid. */\n  gridColumns: number;\n};\n\n/** ISO used to compare a month cell against the internal selection. */\nconst monthCellISO = (year: number, month: number): string => `${year}-${String(month + 1).padStart(2, '0')}-01`;\n\ntype TMonthCellState = {\n  iso: string;\n  disabled: boolean;\n  selected: boolean;\n  rangeStart: boolean;\n  rangeEnd: boolean;\n  rangeInner: boolean;\n  isFocused: boolean;\n};\n\nconst buildMonthParts = (state: TMonthCellState): string => {\n  const parts: string[] = [CALENDAR_PARTS.month];\n  if (state.selected) parts.push(CALENDAR_PARTS.monthSelected);\n  if (state.rangeStart) parts.push(CALENDAR_PARTS.rangeStart);\n  if (state.rangeEnd) parts.push(CALENDAR_PARTS.rangeEnd);\n  if (state.rangeInner) parts.push(CALENDAR_PARTS.rangeInner);\n  if (state.disabled) parts.push(CALENDAR_PARTS.disabled);\n  return parts.join(' ');\n};\n\nconst buildMonthCellState = (\n  year: number,\n  month: number,\n  focusedMonth: number,\n  minISO: string | undefined,\n  maxISO: string | undefined,\n  selection: TSelection,\n  type: TDatePickerType,\n): TMonthCellState => {\n  const iso = monthCellISO(year, month);\n  const disabled = !isMonthWithinBounds(year, month, minISO, maxISO);\n  return {\n    iso,\n    disabled,\n    selected: isSelected(iso, selection, type),\n    rangeStart: isRangeStart(iso, selection, type),\n    rangeEnd: isRangeEnd(iso, selection, type),\n    rangeInner: isRangeInner(iso, selection, type),\n    isFocused: focusedMonth === month,\n  };\n};\n\ntype TRenderMonthCellArgs = {\n  month: number;\n  name: string;\n  state: TMonthCellState;\n  onMonthSelect: (month: number, ev: MouseEvent | KeyboardEvent) => void;\n  onMonthFocus: (month: number) => void;\n  onMonthHover: (iso: string | undefined) => void;\n};\n\nconst chunkMonths = (months: string[], columns: number): Array<Array<{ month: number; name: string }>> => {\n  const rows: Array<Array<{ month: number; name: string }>> = [];\n  for (let month = 0; month < months.length; month += columns) {\n    rows.push(months.slice(month, month + columns).map((name, offset) => ({ month: month + offset, name })));\n  }\n  return rows;\n};\n\nconst renderMonthCell = ({ month, name, state, onMonthSelect, onMonthFocus, onMonthHover }: TRenderMonthCellArgs) => (\n  // biome-ignore lint/a11y/useFocusableInteractive: gridcell is a structural ARIA container; focus is managed by the child <button> via roving tabindex\n  <div\n    aria-selected={state.selected ? 'true' : undefined}\n    class=\"bq-date-picker__month-gridcell\"\n    role=\"gridcell\"\n    key={month}\n  >\n    <button\n      aria-disabled={state.disabled ? 'true' : undefined}\n      class={{\n        'bq-date-picker__month-cell': true,\n        'is-selected': state.selected,\n        'is-range-start': state.rangeStart,\n        'is-range-end': state.rangeEnd,\n        'is-range-inner': state.rangeInner,\n        'is-out-of-bounds': state.disabled,\n      }}\n      data-month={month}\n      disabled={state.disabled}\n      onClick={(ev) => !state.disabled && onMonthSelect(month, ev)}\n      onFocus={() => onMonthFocus(month)}\n      onMouseEnter={() => onMonthHover(state.iso)}\n      onMouseLeave={() => onMonthHover(undefined)}\n      part={`${CALENDAR_PARTS.button} ${buildMonthParts(state)}`}\n      tabIndex={state.isFocused ? 0 : -1}\n      type=\"button\"\n    >\n      {name}\n    </button>\n  </div>\n);\n\n/**\n * Month picker — 12 buttons in a 3×4 grid.\n */\nexport const CalendarMonthView: FunctionalComponent<TCalendarMonthViewProps> = ({\n  year,\n  focusedMonth,\n  locale,\n  minISO,\n  maxISO,\n  selection,\n  tentativeRange,\n  type,\n  onMonthSelect,\n  onMonthFocus,\n  onMonthHover,\n  onGridKeyDown,\n  gridColumns,\n}) => {\n  const months = getMonthNames(locale, 'short');\n  const effectiveSelection: TSelection = type === 'range' && tentativeRange.length === 2 ? tentativeRange : selection;\n  const rows = chunkMonths(months, gridColumns);\n\n  return (\n    <div\n      class=\"bq-date-picker__months\"\n      data-grid-columns={String(gridColumns)}\n      onKeyDown={onGridKeyDown}\n      part={CALENDAR_PARTS.months}\n      role=\"grid\"\n      tabIndex={-1}\n    >\n      {rows.map((row) => (\n        // biome-ignore lint/a11y/useFocusableInteractive: gridcell is a structural ARIA container; focus is managed by the child <button> via roving tabindex\n        <div class=\"bq-date-picker__month-row\" role=\"row\" key={`month-row-${row.map(({ month }) => month).join('-')}`}>\n          {row.map(({ month, name }) => {\n            const state = buildMonthCellState(year, month, focusedMonth, minISO, maxISO, effectiveSelection, type);\n            return renderMonthCell({ month, name, state, onMonthSelect, onMonthFocus, onMonthHover });\n          })}\n        </div>\n      ))}\n    </div>\n  );\n};\n"]}

package/dist/collection/components/date-picker/components/CalendarYearView.js

@@ -0,0 +1,68 @@
+/*!
+ * Built by Endavans
+ * © https://beeq.design - Apache 2 License.
+ */
+import { h } from "@stencil/core";
+import { isYearWithinBounds } from "../helper/bounds";
+import { CALENDAR_PARTS } from "../helper/constants";
+import { isRangeEnd, isRangeInner, isRangeStart, isSelected } from "../helper/selection";
+/** ISO used to compare a year cell against the internal selection. */
+const yearCellISO = (year) => `${year}-01-01`;
+const buildYearParts = (state) => {
+    const parts = [CALENDAR_PARTS.year];
+    if (state.selected)
+        parts.push(CALENDAR_PARTS.yearSelected);
+    if (state.rangeStart)
+        parts.push(CALENDAR_PARTS.rangeStart);
+    if (state.rangeEnd)
+        parts.push(CALENDAR_PARTS.rangeEnd);
+    if (state.rangeInner)
+        parts.push(CALENDAR_PARTS.rangeInner);
+    if (state.disabled)
+        parts.push(CALENDAR_PARTS.disabled);
+    return parts.join(' ');
+};
+const buildYearCellState = (year, focusedYear, minISO, maxISO, selection, type) => {
+    const iso = yearCellISO(year);
+    const disabled = !isYearWithinBounds(year, minISO, maxISO);
+    return {
+        iso,
+        disabled,
+        selected: isSelected(iso, selection, type),
+        rangeStart: isRangeStart(iso, selection, type),
+        rangeEnd: isRangeEnd(iso, selection, type),
+        rangeInner: isRangeInner(iso, selection, type),
+        isFocused: focusedYear === year,
+    };
+};
+const chunkYears = (years, columns) => {
+    const rows = [];
+    for (let index = 0; index < years.length; index += columns) {
+        rows.push(years.slice(index, index + columns));
+    }
+    return rows;
+};
+const renderYearCell = ({ year, state, onYearSelect, onYearFocus, onYearHover }) => (
+// biome-ignore lint/a11y/useFocusableInteractive: gridcell is a structural ARIA container; focus is managed by the child <button> via roving tabindex
+h("div", { "aria-selected": state.selected ? 'true' : undefined, class: "bq-date-picker__year-gridcell", key: year, role: "gridcell" }, h("button", { "aria-disabled": state.disabled ? 'true' : undefined, class: {
+        'bq-date-picker__year-cell': true,
+        'is-selected': state.selected,
+        'is-range-start': state.rangeStart,
+        'is-range-end': state.rangeEnd,
+        'is-range-inner': state.rangeInner,
+        'is-out-of-bounds': state.disabled,
+    }, "data-year": year, disabled: state.disabled, onClick: (ev) => !state.disabled && onYearSelect(year, ev), onFocus: () => onYearFocus(year), onMouseEnter: () => onYearHover(state.iso), onMouseLeave: () => onYearHover(undefined), part: `${CALENDAR_PARTS.button} ${buildYearParts(state)}`, tabIndex: state.isFocused ? 0 : -1, type: "button" }, year)));
+/**
+ * Year picker — 12 buttons for a decade grid.
+ */
+export const CalendarYearView = ({ years, focusedYear, minISO, maxISO, selection, tentativeRange, type, onYearSelect, onYearFocus, onYearHover, onGridKeyDown, gridColumns, }) => {
+    const effectiveSelection = type === 'range' && tentativeRange.length === 2 ? tentativeRange : selection;
+    const rows = chunkYears(years, gridColumns);
+    return (h("div", { class: "bq-date-picker__years", "data-grid-columns": String(gridColumns), onKeyDown: onGridKeyDown, part: CALENDAR_PARTS.years, role: "grid", tabIndex: -1 }, rows.map((row) => (
+    // biome-ignore lint/a11y/useFocusableInteractive: gridcell is a structural ARIA container; focus is managed by the child <button> via roving tabindex
+    h("div", { class: "bq-date-picker__year-row", key: `year-row-${row.join('-')}`, role: "row" }, row.map((year) => {
+        const state = buildYearCellState(year, focusedYear, minISO, maxISO, effectiveSelection, type);
+        return renderYearCell({ year, state, onYearSelect, onYearFocus, onYearHover });
+    }))))));
+};
+//# sourceMappingURL=CalendarYearView.js.map

package/dist/collection/components/date-picker/components/CalendarYearView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CalendarYearView.js","sourceRoot":"","sources":["../../../../../../../packages/beeq/src/components/date-picker/components/CalendarYearView.tsx"],"names":[],"mappings":"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","sourcesContent":["import { type FunctionalComponent, h } from '@stencil/core';\n\nimport type { TDatePickerType, TSelection } from '../bq-date-picker.types';\nimport { isYearWithinBounds } from '../helper/bounds';\nimport { CALENDAR_PARTS } from '../helper/constants';\nimport { isRangeEnd, isRangeInner, isRangeStart, isSelected } from '../helper/selection';\n\nexport type TCalendarYearViewProps = {\n  /** Years to render (typically 12). */\n  years: number[];\n  /** Focused year (roving tabindex target). */\n  focusedYear: number;\n  /** Optional min bound (any precision — `YYYY`, `YYYY-MM`, `YYYY-MM-DD`). */\n  minISO?: string;\n  /** Optional max bound (any precision). */\n  maxISO?: string;\n  /** Current selection (as stored internally: array of YYYY-MM-DD). */\n  selection: TSelection;\n  /** In-progress range preview while hovering a second endpoint. */\n  tentativeRange: TSelection;\n  /** Selection type — drives multi / range highlighting. */\n  type: TDatePickerType;\n  /** Callback fired when the user picks a year. */\n  onYearSelect: (year: number, ev: MouseEvent | KeyboardEvent) => void;\n  /** Callback fired when a year button receives focus. */\n  onYearFocus: (year: number) => void;\n  /** Callback fired when hovering a year cell (range preview). */\n  onYearHover: (iso: string | undefined) => void;\n  /** Optional keydown handler for the grid (roving tabindex management). */\n  onGridKeyDown: (ev: KeyboardEvent) => void;\n  /** Number of columns rendered by the year grid. */\n  gridColumns: number;\n};\n\n/** ISO used to compare a year cell against the internal selection. */\nconst yearCellISO = (year: number): string => `${year}-01-01`;\n\ntype TYearCellState = {\n  iso: string;\n  disabled: boolean;\n  selected: boolean;\n  rangeStart: boolean;\n  rangeEnd: boolean;\n  rangeInner: boolean;\n  isFocused: boolean;\n};\n\nconst buildYearParts = (state: TYearCellState): string => {\n  const parts: string[] = [CALENDAR_PARTS.year];\n  if (state.selected) parts.push(CALENDAR_PARTS.yearSelected);\n  if (state.rangeStart) parts.push(CALENDAR_PARTS.rangeStart);\n  if (state.rangeEnd) parts.push(CALENDAR_PARTS.rangeEnd);\n  if (state.rangeInner) parts.push(CALENDAR_PARTS.rangeInner);\n  if (state.disabled) parts.push(CALENDAR_PARTS.disabled);\n  return parts.join(' ');\n};\n\nconst buildYearCellState = (\n  year: number,\n  focusedYear: number,\n  minISO: string | undefined,\n  maxISO: string | undefined,\n  selection: TSelection,\n  type: TDatePickerType,\n): TYearCellState => {\n  const iso = yearCellISO(year);\n  const disabled = !isYearWithinBounds(year, minISO, maxISO);\n  return {\n    iso,\n    disabled,\n    selected: isSelected(iso, selection, type),\n    rangeStart: isRangeStart(iso, selection, type),\n    rangeEnd: isRangeEnd(iso, selection, type),\n    rangeInner: isRangeInner(iso, selection, type),\n    isFocused: focusedYear === year,\n  };\n};\n\ntype TRenderYearCellArgs = {\n  year: number;\n  state: TYearCellState;\n  onYearSelect: (year: number, ev: MouseEvent | KeyboardEvent) => void;\n  onYearFocus: (year: number) => void;\n  onYearHover: (iso: string | undefined) => void;\n};\n\nconst chunkYears = (years: number[], columns: number): number[][] => {\n  const rows: number[][] = [];\n  for (let index = 0; index < years.length; index += columns) {\n    rows.push(years.slice(index, index + columns));\n  }\n  return rows;\n};\n\nconst renderYearCell = ({ year, state, onYearSelect, onYearFocus, onYearHover }: TRenderYearCellArgs) => (\n  // biome-ignore lint/a11y/useFocusableInteractive: gridcell is a structural ARIA container; focus is managed by the child <button> via roving tabindex\n  <div\n    aria-selected={state.selected ? 'true' : undefined}\n    class=\"bq-date-picker__year-gridcell\"\n    key={year}\n    role=\"gridcell\"\n  >\n    <button\n      aria-disabled={state.disabled ? 'true' : undefined}\n      class={{\n        'bq-date-picker__year-cell': true,\n        'is-selected': state.selected,\n        'is-range-start': state.rangeStart,\n        'is-range-end': state.rangeEnd,\n        'is-range-inner': state.rangeInner,\n        'is-out-of-bounds': state.disabled,\n      }}\n      data-year={year}\n      disabled={state.disabled}\n      onClick={(ev) => !state.disabled && onYearSelect(year, ev)}\n      onFocus={() => onYearFocus(year)}\n      onMouseEnter={() => onYearHover(state.iso)}\n      onMouseLeave={() => onYearHover(undefined)}\n      part={`${CALENDAR_PARTS.button} ${buildYearParts(state)}`}\n      tabIndex={state.isFocused ? 0 : -1}\n      type=\"button\"\n    >\n      {year}\n    </button>\n  </div>\n);\n\n/**\n * Year picker — 12 buttons for a decade grid.\n */\nexport const CalendarYearView: FunctionalComponent<TCalendarYearViewProps> = ({\n  years,\n  focusedYear,\n  minISO,\n  maxISO,\n  selection,\n  tentativeRange,\n  type,\n  onYearSelect,\n  onYearFocus,\n  onYearHover,\n  onGridKeyDown,\n  gridColumns,\n}) => {\n  const effectiveSelection: TSelection = type === 'range' && tentativeRange.length === 2 ? tentativeRange : selection;\n  const rows = chunkYears(years, gridColumns);\n\n  return (\n    <div\n      class=\"bq-date-picker__years\"\n      data-grid-columns={String(gridColumns)}\n      onKeyDown={onGridKeyDown}\n      part={CALENDAR_PARTS.years}\n      role=\"grid\"\n      tabIndex={-1}\n    >\n      {rows.map((row) => (\n        // biome-ignore lint/a11y/useFocusableInteractive: gridcell is a structural ARIA container; focus is managed by the child <button> via roving tabindex\n        <div class=\"bq-date-picker__year-row\" key={`year-row-${row.join('-')}`} role=\"row\">\n          {row.map((year) => {\n            const state = buildYearCellState(year, focusedYear, minISO, maxISO, effectiveSelection, type);\n            return renderYearCell({ year, state, onYearSelect, onYearFocus, onYearHover });\n          })}\n        </div>\n      ))}\n    </div>\n  );\n};\n"]}

package/dist/collection/components/date-picker/helper/bounds.js

@@ -0,0 +1,114 @@
+/*!
+ * Built by Endavans
+ * © https://beeq.design - Apache 2 License.
+ */
+/**
+ * Bounds predicates for the calendar.
+ *
+ * `min` and `max` may be at any wire precision (`YYYY`, `YYYY-MM`, or
+ * `YYYY-MM-DD`); internal cell values are always full `YYYY-MM-DD` strings.
+ * All predicates are pure and rely on lexicographic comparison, which is
+ * safe for ISO 8601 dates.
+ */
+/**
+ * Extract the `YYYY` prefix (as a number) from a bound string.
+ * Returns `null` if the string does not begin with a 4-digit year.
+ */
+export const boundYear = (iso) => {
+    if (!iso)
+        return null;
+    const match = /^(\d{4})/.exec(iso);
+    return match ? Number(match[1]) : null;
+};
+/**
+ * Extract `{ year, month }` (month is 0-based) from a bound string. Falls
+ * back to `null` when the string doesn't contain a `YYYY-MM` prefix.
+ */
+export const boundYearMonth = (iso) => {
+    if (!iso)
+        return null;
+    const match = /^(\d{4})-(\d{2})/.exec(iso);
+    if (!match)
+        return null;
+    const month = Number(match[2]) - 1;
+    if (month < 0 || month > 11)
+        return null;
+    return { year: Number(match[1]), month };
+};
+/**
+ * Whether a given year is within the (inclusive) `min`/`max` range.
+ * A year cell is considered in-range when any day inside that year is
+ * still selectable — i.e. we compare on the year prefix only, ignoring
+ * the month/day components of `min` / `max`.
+ */
+export const isYearWithinBounds = (year, min, max) => {
+    const minYear = boundYear(min);
+    const maxYear = boundYear(max);
+    if (minYear !== null && year < minYear)
+        return false;
+    if (maxYear !== null && year > maxYear)
+        return false;
+    return true;
+};
+/**
+ * Whether a `(year, month)` pair sits at-or-after the given lower bound.
+ * A `null`/`undefined` bound is treated as "no lower bound".
+ */
+const monthAtOrAfter = (year, month, bound) => {
+    const ym = boundYearMonth(bound);
+    if (ym)
+        return year > ym.year || (year === ym.year && month >= ym.month);
+    const y = boundYear(bound);
+    return y === null || year >= y;
+};
+/** Whether a `(year, month)` pair sits at-or-before the given upper bound. */
+const monthAtOrBefore = (year, month, bound) => {
+    const ym = boundYearMonth(bound);
+    if (ym)
+        return year < ym.year || (year === ym.year && month <= ym.month);
+    const y = boundYear(bound);
+    return y === null || year <= y;
+};
+/**
+ * Whether a given `(year, month)` pair is within the (inclusive) `min`/`max`
+ * range. A month cell is considered in-range when any day inside that month
+ * would still satisfy the bounds — we compare on the year-month prefix and
+ * ignore the day component of `min` / `max`.
+ */
+export const isMonthWithinBounds = (year, month, min, max) => monthAtOrAfter(year, month, min) && monthAtOrBefore(year, month, max);
+/**
+ * Whether a full `YYYY-MM-DD` iso date is within the (inclusive) `min`/`max`
+ * range. Bounds may be at any precision — we pad `min` to the earliest day
+ * (`YYYY-01-01`) and `max` to the latest day (`YYYY-12-31`) before doing a
+ * lexical compare (safe because ISO 8601 sorts by calendar order).
+ */
+export const isDateWithinBounds = (iso, min, max) => {
+    if (!iso)
+        return false;
+    const paddedMin = padBound(min, 'min');
+    const paddedMax = padBound(max, 'max');
+    if (paddedMin !== null && iso < paddedMin)
+        return false;
+    if (paddedMax !== null && iso > paddedMax)
+        return false;
+    return true;
+};
+/**
+ * Pad a bound string up to full `YYYY-MM-DD` length so it can be lexically
+ * compared with a full ISO date. `min` widens down (missing pieces become
+ * `-01`), `max` widens up (missing month → `-12`, missing day → last day of
+ * that month, honoring leap years).
+ */
+export const padBound = (iso, kind) => {
+    if (!iso)
+        return null;
+    const yearMatch = /^(\d{4})(?:-(\d{2}))?(?:-(\d{2}))?$/.exec(iso);
+    if (!yearMatch)
+        return null;
+    const year = yearMatch[1];
+    const month = yearMatch[2] ?? (kind === 'min' ? '01' : '12');
+    const day = yearMatch[3] ??
+        (kind === 'min' ? '01' : String(new Date(Number(year), Number(month), 0).getDate()).padStart(2, '0'));
+    return `${year}-${month}-${day}`;
+};
+//# sourceMappingURL=bounds.js.map

package/dist/collection/components/date-picker/helper/bounds.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bounds.js","sourceRoot":"","sources":["../../../../../../../packages/beeq/src/components/date-picker/helper/bounds.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Bounds predicates for the calendar.\n *\n * `min` and `max` may be at any wire precision (`YYYY`, `YYYY-MM`, or\n * `YYYY-MM-DD`); internal cell values are always full `YYYY-MM-DD` strings.\n * All predicates are pure and rely on lexicographic comparison, which is\n * safe for ISO 8601 dates.\n */\n\n/**\n * Extract the `YYYY` prefix (as a number) from a bound string.\n * Returns `null` if the string does not begin with a 4-digit year.\n */\nexport const boundYear = (iso: string | undefined | null): number | null => {\n  if (!iso) return null;\n  const match = /^(\\d{4})/.exec(iso);\n  return match ? Number(match[1]) : null;\n};\n\n/**\n * Extract `{ year, month }` (month is 0-based) from a bound string. Falls\n * back to `null` when the string doesn't contain a `YYYY-MM` prefix.\n */\nexport const boundYearMonth = (iso: string | undefined | null): { year: number; month: number } | null => {\n  if (!iso) return null;\n  const match = /^(\\d{4})-(\\d{2})/.exec(iso);\n  if (!match) return null;\n  const month = Number(match[2]) - 1;\n  if (month < 0 || month > 11) return null;\n  return { year: Number(match[1]), month };\n};\n\n/**\n * Whether a given year is within the (inclusive) `min`/`max` range.\n * A year cell is considered in-range when any day inside that year is\n * still selectable — i.e. we compare on the year prefix only, ignoring\n * the month/day components of `min` / `max`.\n */\nexport const isYearWithinBounds = (year: number, min?: string | null, max?: string | null): boolean => {\n  const minYear = boundYear(min);\n  const maxYear = boundYear(max);\n  if (minYear !== null && year < minYear) return false;\n  if (maxYear !== null && year > maxYear) return false;\n  return true;\n};\n\n/**\n * Whether a `(year, month)` pair sits at-or-after the given lower bound.\n * A `null`/`undefined` bound is treated as \"no lower bound\".\n */\nconst monthAtOrAfter = (year: number, month: number, bound: string | undefined | null): boolean => {\n  const ym = boundYearMonth(bound);\n  if (ym) return year > ym.year || (year === ym.year && month >= ym.month);\n  const y = boundYear(bound);\n  return y === null || year >= y;\n};\n\n/** Whether a `(year, month)` pair sits at-or-before the given upper bound. */\nconst monthAtOrBefore = (year: number, month: number, bound: string | undefined | null): boolean => {\n  const ym = boundYearMonth(bound);\n  if (ym) return year < ym.year || (year === ym.year && month <= ym.month);\n  const y = boundYear(bound);\n  return y === null || year <= y;\n};\n\n/**\n * Whether a given `(year, month)` pair is within the (inclusive) `min`/`max`\n * range. A month cell is considered in-range when any day inside that month\n * would still satisfy the bounds — we compare on the year-month prefix and\n * ignore the day component of `min` / `max`.\n */\nexport const isMonthWithinBounds = (year: number, month: number, min?: string | null, max?: string | null): boolean =>\n  monthAtOrAfter(year, month, min) && monthAtOrBefore(year, month, max);\n\n/**\n * Whether a full `YYYY-MM-DD` iso date is within the (inclusive) `min`/`max`\n * range. Bounds may be at any precision — we pad `min` to the earliest day\n * (`YYYY-01-01`) and `max` to the latest day (`YYYY-12-31`) before doing a\n * lexical compare (safe because ISO 8601 sorts by calendar order).\n */\nexport const isDateWithinBounds = (iso: string, min?: string | null, max?: string | null): boolean => {\n  if (!iso) return false;\n  const paddedMin = padBound(min, 'min');\n  const paddedMax = padBound(max, 'max');\n  if (paddedMin !== null && iso < paddedMin) return false;\n  if (paddedMax !== null && iso > paddedMax) return false;\n  return true;\n};\n\n/**\n * Pad a bound string up to full `YYYY-MM-DD` length so it can be lexically\n * compared with a full ISO date. `min` widens down (missing pieces become\n * `-01`), `max` widens up (missing month → `-12`, missing day → last day of\n * that month, honoring leap years).\n */\nexport const padBound = (iso: string | undefined | null, kind: 'min' | 'max'): string | null => {\n  if (!iso) return null;\n  const yearMatch = /^(\\d{4})(?:-(\\d{2}))?(?:-(\\d{2}))?$/.exec(iso);\n  if (!yearMatch) return null;\n  const year = yearMatch[1];\n  const month = yearMatch[2] ?? (kind === 'min' ? '01' : '12');\n  const day =\n    yearMatch[3] ??\n    (kind === 'min' ? '01' : String(new Date(Number(year), Number(month), 0).getDate()).padStart(2, '0'));\n  return `${year}-${month}-${day}`;\n};\n"]}

package/dist/collection/components/date-picker/helper/calendar.js

@@ -0,0 +1,156 @@
+/*!
+ * Built by Endavans
+ * © https://beeq.design - Apache 2 License.
+ */
+import { ISO_DATE_LOCALE } from "../../../shared/utils/date";
+import { DECADE_GRID_SIZE } from "./constants";
+/* -------------------------------------------------------------------------- */
+/*                                Date parsing                                */
+/* -------------------------------------------------------------------------- */
+/**
+ * Parse an ISO 8601 date string (`YYYY-MM-DD`) into a local-time `Date`.
+ * Returns `null` when the string is missing or invalid.
+ */
+export const parseISO = (iso) => {
+    if (!iso || !/^\d{4}-\d{2}-\d{2}$/.test(iso))
+        return null;
+    const [y, m, d] = iso.split('-').map(Number);
+    const date = new Date(y, m - 1, d);
+    if (date.getFullYear() !== y || date.getMonth() !== m - 1 || date.getDate() !== d)
+        return null;
+    return date;
+};
+/**
+ * Convert a `Date` to `YYYY-MM-DD` in local time.
+ */
+export const toISO = (date) => date.toLocaleDateString(ISO_DATE_LOCALE);
+/**
+ * Extract the calendar year and 0-based month from an ISO date string.
+ * Returns `null` for missing or malformed input — safer than `Number(iso.slice(...))`
+ * which silently produces `NaN` for invalid bounds.
+ */
+export const getISOYearMonth = (iso) => {
+    const parsed = parseISO(iso);
+    if (!parsed)
+        return null;
+    return { year: parsed.getFullYear(), month: parsed.getMonth() };
+};
+/**
+ * Whether the ISO string is a valid `YYYY-MM-DD` date (round-trips through
+ * `parseISO`). Convenience predicate for input filtering.
+ */
+export const isValidISO = (iso) => parseISO(iso) !== null;
+/* -------------------------------------------------------------------------- */
+/*                                Date builders                               */
+/* -------------------------------------------------------------------------- */
+export const startOfDay = (date) => new Date(date.getFullYear(), date.getMonth(), date.getDate());
+export const startOfMonth = (date) => new Date(date.getFullYear(), date.getMonth(), 1);
+export const endOfMonth = (date) => new Date(date.getFullYear(), date.getMonth() + 1, 0);
+export const addDays = (date, amount) => {
+    const next = new Date(date);
+    next.setDate(next.getDate() + amount);
+    return next;
+};
+export const addMonths = (date, amount) => {
+    const next = new Date(date.getFullYear(), date.getMonth() + amount, 1);
+    // Preserve the day when possible.
+    const day = Math.min(date.getDate(), endOfMonth(next).getDate());
+    next.setDate(day);
+    return next;
+};
+export const addYears = (date, amount) => {
+    const next = new Date(date);
+    next.setFullYear(next.getFullYear() + amount);
+    return next;
+};
+/* -------------------------------------------------------------------------- */
+/*                                Comparators                                 */
+/* -------------------------------------------------------------------------- */
+export const isSameDay = (a, b) => !!a && !!b && a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
+export const isSameMonth = (a, b) => !!a && !!b && a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth();
+export const isSameYear = (a, b) => !!a && !!b && a.getFullYear() === b.getFullYear();
+/** ISO-string based comparison; safe for `YYYY-MM-DD`. */
+export const compareISO = (a, b) => {
+    if (a === b)
+        return 0;
+    return a < b ? -1 : 1;
+};
+/**
+ * Build a 6x7 matrix for the given month starting on `firstDayOfWeek`.
+ * The matrix always has 42 cells so the calendar keeps a stable height.
+ *
+ * @param anchor         Any date within the target month.
+ * @param firstDayOfWeek 0 = Sunday, 1 = Monday, ...
+ */
+export const buildMonthMatrix = (anchor, firstDayOfWeek) => {
+    const start = startOfMonth(anchor);
+    const offset = (start.getDay() - firstDayOfWeek + 7) % 7;
+    const gridStart = addDays(start, -offset);
+    const cells = [];
+    for (let i = 0; i < 42; i++) {
+        const date = addDays(gridStart, i);
+        cells.push({
+            date,
+            iso: toISO(date),
+            outside: date.getMonth() !== anchor.getMonth(),
+        });
+    }
+    const rows = [];
+    for (let r = 0; r < 6; r++)
+        rows.push(cells.slice(r * 7, r * 7 + 7));
+    return rows;
+};
+/* -------------------------------------------------------------------------- */
+/*                                Decade grid                                 */
+/* -------------------------------------------------------------------------- */
+/**
+ * Given any year, return the anchor year of the decade grid.
+ *
+ * The reference image shows a grid like `2016 – 2027` containing the current
+ * year (`2026`). We anchor the grid so the "round" decade start (e.g. 2020,
+ * 2010, ...) appears at index 1 - i.e. one extra year before the decade and
+ * one extra year after, filling the 3x4 grid cleanly.
+ */
+export const getDecadeStart = (year) => Math.floor(year / 10) * 10 - 1;
+/**
+ * Build the 12-year decade grid for the year that contains `anchor`.
+ * Returns `{ start, end, years }` where `years.length === DECADE_GRID_SIZE`.
+ */
+export const buildDecade = (anchor) => {
+    const start = getDecadeStart(anchor.getFullYear());
+    const end = start + DECADE_GRID_SIZE - 1;
+    const years = Array.from({ length: DECADE_GRID_SIZE }, (_, i) => start + i);
+    return { start, end, years };
+};
+/* -------------------------------------------------------------------------- */
+/*                                Range helpers                               */
+/* -------------------------------------------------------------------------- */
+import { padBound } from "./bounds";
+/**
+ * Clamp a `Date` between an optional min and max. Bounds may be at any
+ * ISO precision (`YYYY`, `YYYY-MM`, `YYYY-MM-DD`) and are padded to the
+ * widest matching day before comparing (`min` → first day, `max` → last day).
+ */
+export const clampDate = (date, minISO, maxISO) => {
+    const min = parseISO(padBound(minISO, 'min'));
+    const max = parseISO(padBound(maxISO, 'max'));
+    if (min && date < min)
+        return min;
+    if (max && date > max)
+        return max;
+    return date;
+};
+/** Whether the given `Date` is within `[min, max]` ISO bounds (inclusive). */
+export const isWithinBounds = (date, minISO, maxISO) => {
+    const iso = toISO(date);
+    const minPadded = padBound(minISO, 'min');
+    const maxPadded = padBound(maxISO, 'max');
+    if (minPadded && iso < minPadded)
+        return false;
+    if (maxPadded && iso > maxPadded)
+        return false;
+    return true;
+};
+/** Sort two ISO strings and return `[start, end]`. */
+export const sortRange = (a, b) => (a <= b ? [a, b] : [b, a]);
+//# sourceMappingURL=calendar.js.map

package/dist/collection/components/date-picker/helper/calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.js","sourceRoot":"","sources":["../../../../../../../packages/beeq/src/components/date-picker/helper/calendar.ts"],"names":[],"mappings":"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","sourcesContent":["import { ISO_DATE_LOCALE } from '../../../shared/utils/date';\nimport { DECADE_GRID_SIZE } from './constants';\n\n/* -------------------------------------------------------------------------- */\n/*                                Date parsing                                */\n/* -------------------------------------------------------------------------- */\n\n/**\n * Parse an ISO 8601 date string (`YYYY-MM-DD`) into a local-time `Date`.\n * Returns `null` when the string is missing or invalid.\n */\nexport const parseISO = (iso: string | undefined | null): Date | null => {\n  if (!iso || !/^\\d{4}-\\d{2}-\\d{2}$/.test(iso)) return null;\n  const [y, m, d] = iso.split('-').map(Number);\n  const date = new Date(y, m - 1, d);\n  if (date.getFullYear() !== y || date.getMonth() !== m - 1 || date.getDate() !== d) return null;\n  return date;\n};\n\n/**\n * Convert a `Date` to `YYYY-MM-DD` in local time.\n */\nexport const toISO = (date: Date): string => date.toLocaleDateString(ISO_DATE_LOCALE);\n\n/**\n * Extract the calendar year and 0-based month from an ISO date string.\n * Returns `null` for missing or malformed input — safer than `Number(iso.slice(...))`\n * which silently produces `NaN` for invalid bounds.\n */\nexport const getISOYearMonth = (iso: string | undefined | null): { year: number; month: number } | null => {\n  const parsed = parseISO(iso);\n  if (!parsed) return null;\n  return { year: parsed.getFullYear(), month: parsed.getMonth() };\n};\n\n/**\n * Whether the ISO string is a valid `YYYY-MM-DD` date (round-trips through\n * `parseISO`). Convenience predicate for input filtering.\n */\nexport const isValidISO = (iso: string | undefined | null): boolean => parseISO(iso) !== null;\n\n/* -------------------------------------------------------------------------- */\n/*                                Date builders                               */\n/* -------------------------------------------------------------------------- */\n\nexport const startOfDay = (date: Date): Date => new Date(date.getFullYear(), date.getMonth(), date.getDate());\n\nexport const startOfMonth = (date: Date): Date => new Date(date.getFullYear(), date.getMonth(), 1);\n\nexport const endOfMonth = (date: Date): Date => new Date(date.getFullYear(), date.getMonth() + 1, 0);\n\nexport const addDays = (date: Date, amount: number): Date => {\n  const next = new Date(date);\n  next.setDate(next.getDate() + amount);\n  return next;\n};\n\nexport const addMonths = (date: Date, amount: number): Date => {\n  const next = new Date(date.getFullYear(), date.getMonth() + amount, 1);\n  // Preserve the day when possible.\n  const day = Math.min(date.getDate(), endOfMonth(next).getDate());\n  next.setDate(day);\n  return next;\n};\n\nexport const addYears = (date: Date, amount: number): Date => {\n  const next = new Date(date);\n  next.setFullYear(next.getFullYear() + amount);\n  return next;\n};\n\n/* -------------------------------------------------------------------------- */\n/*                                Comparators                                 */\n/* -------------------------------------------------------------------------- */\n\nexport const isSameDay = (a: Date | null, b: Date | null): boolean =>\n  !!a && !!b && a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();\n\nexport const isSameMonth = (a: Date | null, b: Date | null): boolean =>\n  !!a && !!b && a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth();\n\nexport const isSameYear = (a: Date | null, b: Date | null): boolean =>\n  !!a && !!b && a.getFullYear() === b.getFullYear();\n\n/** ISO-string based comparison; safe for `YYYY-MM-DD`. */\nexport const compareISO = (a: string, b: string): number => {\n  if (a === b) return 0;\n  return a < b ? -1 : 1;\n};\n\n/* -------------------------------------------------------------------------- */\n/*                                Month matrix                                */\n/* -------------------------------------------------------------------------- */\n\nexport type TCalendarCell = {\n  /** The day's `Date`. */\n  date: Date;\n  /** `YYYY-MM-DD` representation. */\n  iso: string;\n  /** `true` when the cell belongs to a month other than the current view. */\n  outside: boolean;\n};\n\n/**\n * Build a 6x7 matrix for the given month starting on `firstDayOfWeek`.\n * The matrix always has 42 cells so the calendar keeps a stable height.\n *\n * @param anchor         Any date within the target month.\n * @param firstDayOfWeek 0 = Sunday, 1 = Monday, ...\n */\nexport const buildMonthMatrix = (anchor: Date, firstDayOfWeek: number): TCalendarCell[][] => {\n  const start = startOfMonth(anchor);\n  const offset = (start.getDay() - firstDayOfWeek + 7) % 7;\n  const gridStart = addDays(start, -offset);\n\n  const cells: TCalendarCell[] = [];\n  for (let i = 0; i < 42; i++) {\n    const date = addDays(gridStart, i);\n    cells.push({\n      date,\n      iso: toISO(date),\n      outside: date.getMonth() !== anchor.getMonth(),\n    });\n  }\n\n  const rows: TCalendarCell[][] = [];\n  for (let r = 0; r < 6; r++) rows.push(cells.slice(r * 7, r * 7 + 7));\n  return rows;\n};\n\n/* -------------------------------------------------------------------------- */\n/*                                Decade grid                                 */\n/* -------------------------------------------------------------------------- */\n\n/**\n * Given any year, return the anchor year of the decade grid.\n *\n * The reference image shows a grid like `2016 – 2027` containing the current\n * year (`2026`). We anchor the grid so the \"round\" decade start (e.g. 2020,\n * 2010, ...) appears at index 1 - i.e. one extra year before the decade and\n * one extra year after, filling the 3x4 grid cleanly.\n */\nexport const getDecadeStart = (year: number): number => Math.floor(year / 10) * 10 - 1;\n\n/**\n * Build the 12-year decade grid for the year that contains `anchor`.\n * Returns `{ start, end, years }` where `years.length === DECADE_GRID_SIZE`.\n */\nexport const buildDecade = (anchor: Date): { start: number; end: number; years: number[] } => {\n  const start = getDecadeStart(anchor.getFullYear());\n  const end = start + DECADE_GRID_SIZE - 1;\n  const years = Array.from({ length: DECADE_GRID_SIZE }, (_, i) => start + i);\n  return { start, end, years };\n};\n\n/* -------------------------------------------------------------------------- */\n/*                                Range helpers                               */\n/* -------------------------------------------------------------------------- */\n\nimport { padBound } from './bounds';\n\n/**\n * Clamp a `Date` between an optional min and max. Bounds may be at any\n * ISO precision (`YYYY`, `YYYY-MM`, `YYYY-MM-DD`) and are padded to the\n * widest matching day before comparing (`min` → first day, `max` → last day).\n */\nexport const clampDate = (date: Date, minISO?: string, maxISO?: string): Date => {\n  const min = parseISO(padBound(minISO, 'min'));\n  const max = parseISO(padBound(maxISO, 'max'));\n  if (min && date < min) return min;\n  if (max && date > max) return max;\n  return date;\n};\n\n/** Whether the given `Date` is within `[min, max]` ISO bounds (inclusive). */\nexport const isWithinBounds = (date: Date, minISO?: string, maxISO?: string): boolean => {\n  const iso = toISO(date);\n  const minPadded = padBound(minISO, 'min');\n  const maxPadded = padBound(maxISO, 'max');\n  if (minPadded && iso < minPadded) return false;\n  if (maxPadded && iso > maxPadded) return false;\n  return true;\n};\n\n/** Sort two ISO strings and return `[start, end]`. */\nexport const sortRange = (a: string, b: string): [string, string] => (a <= b ? [a, b] : [b, a]);\n"]}

package/dist/collection/components/date-picker/helper/constants.js

@@ -2,22 +2,68 @@
  * Built by Endavans
  * © https://beeq.design - Apache 2 License.
  */
-import { ISO_DATE_LOCALE } from "../../../shared/utils/date";
 /** Default fallback input ID */
-const DEFAULT_INPUT_ID = 'date-picker';
-/** Calendar month shadow DOM parts for common elements */
-const CALENDAR_COMMON_EXPORT_PARTS = 'calendar__heading,calendar__table,calendar__tr,calendar__head,calendar__week,calendar__th,calendar__td';
-/** Calendar month shadow DOM parts for button elements */
-const CALENDAR_BUTTON_EXPORT_PARTS = 'calendar__button,calendar__day,calendar__selected,calendar__today,calendar__disallowed,calendar__outside,calendar__range-start,calendar__range-end,calendar__range-inner';
-/** Combined export parts for calendar-month component */
-const CALENDAR_MONTH_EXPORT_PARTS = `${CALENDAR_COMMON_EXPORT_PARTS},${CALENDAR_BUTTON_EXPORT_PARTS}`;
-/** Export parts for the calendar container component (calendar-date, calendar-range, calendar-multi) */
-const CALENDAR_CONTAINER_EXPORT_PARTS = 'container:calendar__container,header:calendar__header,button:calendar__button,previous:calendar__previous,next:calendar__next,disabled:calendar__disabled,heading:calendar__heading';
-/** Maps picker type to Cally component tag name */
-const CALENDAR_TYPE_MAP = {
-    single: 'calendar-date',
-    multi: 'calendar-multi',
-    range: 'calendar-range',
+export const DEFAULT_INPUT_ID = 'date-picker';
+/** Default aria labels used by the calendar navigation */
+export const DEFAULT_ARIA_LABELS = {
+    previousMonth: 'Previous month',
+    nextMonth: 'Next month',
+    previousYear: 'Previous year',
+    nextYear: 'Next year',
+    previousDecade: 'Previous decade',
+    nextDecade: 'Next decade',
+    chooseMonth: 'Choose month',
+    chooseYear: 'Choose year',
+    chooseDate: 'Choose date',
 };
-export { CALENDAR_BUTTON_EXPORT_PARTS, CALENDAR_COMMON_EXPORT_PARTS, CALENDAR_CONTAINER_EXPORT_PARTS, CALENDAR_MONTH_EXPORT_PARTS, CALENDAR_TYPE_MAP, DEFAULT_INPUT_ID, ISO_DATE_LOCALE, };
+/**
+ * Shadow DOM parts exposed by the component.
+ * Kept as a single list so it is easy to audit against the JSDoc @part list.
+ */
+export const CALENDAR_PARTS = {
+    base: 'base',
+    label: 'label',
+    control: 'control',
+    prefix: 'prefix',
+    suffix: 'suffix',
+    input: 'input',
+    clearBtn: 'clear-btn',
+    button: 'button',
+    panel: 'panel',
+    container: 'calendar__container',
+    header: 'calendar__header',
+    heading: 'calendar__heading',
+    previous: 'calendar__previous',
+    next: 'calendar__next',
+    table: 'calendar__table',
+    head: 'calendar__head',
+    tr: 'calendar__tr',
+    th: 'calendar__th',
+    week: 'calendar__week',
+    td: 'calendar__td',
+    day: 'calendar__day',
+    today: 'calendar__today',
+    selected: 'calendar__selected',
+    outside: 'calendar__outside',
+    disallowed: 'calendar__disallowed',
+    disabled: 'calendar__disabled',
+    rangeStart: 'calendar__range-start',
+    rangeEnd: 'calendar__range-end',
+    rangeInner: 'calendar__range-inner',
+    months: 'calendar__months',
+    month: 'calendar__month',
+    monthSelected: 'calendar__month-selected',
+    years: 'calendar__years',
+    year: 'calendar__year',
+    yearSelected: 'calendar__year-selected',
+    calendarTrigger: 'calendar-trigger',
+};
+/** Number of years shown in the decade view grid. Uses 12 to fill a 3x4 grid. */
+export const DECADE_GRID_SIZE = 12;
+/**
+ * Maximum number of month panels rendered side-by-side. Range pickers only
+ * benefit from up to 2 panels — beyond that the popover overflows most
+ * viewports and roving keyboard navigation becomes confusing.
+ */
+export const MAX_MONTHS_PER_VIEW = 2;
 //# sourceMappingURL=constants.js.map

package/dist/collection/components/date-picker/helper/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../../../packages/beeq/src/components/date-picker/helper/constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAE7D,gCAAgC;AAChC,MAAM,gBAAgB,GAAG,aAAa,CAAC;AAEvC,0DAA0D;AAC1D,MAAM,4BAA4B,GAChC,wGAAwG,CAAC;AAE3G,0DAA0D;AAC1D,MAAM,4BAA4B,GAChC,0KAA0K,CAAC;AAE7K,yDAAyD;AACzD,MAAM,2BAA2B,GAAG,GAAG,4BAA4B,IAAI,4BAA4B,EAAE,CAAC;AAEtG,wGAAwG;AACxG,MAAM,+BAA+B,GACnC,qLAAqL,CAAC;AAExL,mDAAmD;AACnD,MAAM,iBAAiB,GAAG;IACxB,MAAM,EAAE,eAAe;IACvB,KAAK,EAAE,gBAAgB;IACvB,KAAK,EAAE,gBAAgB;CACf,CAAC;AAEX,OAAO,EACL,4BAA4B,EAC5B,4BAA4B,EAC5B,+BAA+B,EAC/B,2BAA2B,EAC3B,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,GAChB,CAAC","sourcesContent":["import { ISO_DATE_LOCALE } from '../../../shared/utils/date';\n\n/** Default fallback input ID */\nconst DEFAULT_INPUT_ID = 'date-picker';\n\n/** Calendar month shadow DOM parts for common elements */\nconst CALENDAR_COMMON_EXPORT_PARTS =\n  'calendar__heading,calendar__table,calendar__tr,calendar__head,calendar__week,calendar__th,calendar__td';\n\n/** Calendar month shadow DOM parts for button elements */\nconst CALENDAR_BUTTON_EXPORT_PARTS =\n  'calendar__button,calendar__day,calendar__selected,calendar__today,calendar__disallowed,calendar__outside,calendar__range-start,calendar__range-end,calendar__range-inner';\n\n/** Combined export parts for calendar-month component */\nconst CALENDAR_MONTH_EXPORT_PARTS = `${CALENDAR_COMMON_EXPORT_PARTS},${CALENDAR_BUTTON_EXPORT_PARTS}`;\n\n/** Export parts for the calendar container component (calendar-date, calendar-range, calendar-multi) */\nconst CALENDAR_CONTAINER_EXPORT_PARTS =\n  'container:calendar__container,header:calendar__header,button:calendar__button,previous:calendar__previous,next:calendar__next,disabled:calendar__disabled,heading:calendar__heading';\n\n/** Maps picker type to Cally component tag name */\nconst CALENDAR_TYPE_MAP = {\n  single: 'calendar-date',\n  multi: 'calendar-multi',\n  range: 'calendar-range',\n} as const;\n\nexport {\n  CALENDAR_BUTTON_EXPORT_PARTS,\n  CALENDAR_COMMON_EXPORT_PARTS,\n  CALENDAR_CONTAINER_EXPORT_PARTS,\n  CALENDAR_MONTH_EXPORT_PARTS,\n  CALENDAR_TYPE_MAP,\n  DEFAULT_INPUT_ID,\n  ISO_DATE_LOCALE,\n};\n"]}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../../../packages/beeq/src/components/date-picker/helper/constants.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,MAAM,CAAC,MAAM,gBAAgB,GAAG,aAAa,CAAC;AAE9C,0DAA0D;AAC1D,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,aAAa,EAAE,gBAAgB;IAC/B,SAAS,EAAE,YAAY;IACvB,YAAY,EAAE,eAAe;IAC7B,QAAQ,EAAE,WAAW;IACrB,cAAc,EAAE,iBAAiB;IACjC,UAAU,EAAE,aAAa;IACzB,WAAW,EAAE,cAAc;IAC3B,UAAU,EAAE,aAAa;IACzB,UAAU,EAAE,aAAa;CACjB,CAAC;AAEX;;;GAGG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,SAAS;IAClB,MAAM,EAAE,QAAQ;IAChB,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;IACd,QAAQ,EAAE,WAAW;IACrB,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;IACd,SAAS,EAAE,qBAAqB;IAChC,MAAM,EAAE,kBAAkB;IAC1B,OAAO,EAAE,mBAAmB;IAC5B,QAAQ,EAAE,oBAAoB;IAC9B,IAAI,EAAE,gBAAgB;IACtB,KAAK,EAAE,iBAAiB;IACxB,IAAI,EAAE,gBAAgB;IACtB,EAAE,EAAE,cAAc;IAClB,EAAE,EAAE,cAAc;IAClB,IAAI,EAAE,gBAAgB;IACtB,EAAE,EAAE,cAAc;IAClB,GAAG,EAAE,eAAe;IACpB,KAAK,EAAE,iBAAiB;IACxB,QAAQ,EAAE,oBAAoB;IAC9B,OAAO,EAAE,mBAAmB;IAC5B,UAAU,EAAE,sBAAsB;IAClC,QAAQ,EAAE,oBAAoB;IAC9B,UAAU,EAAE,uBAAuB;IACnC,QAAQ,EAAE,qBAAqB;IAC/B,UAAU,EAAE,uBAAuB;IACnC,MAAM,EAAE,kBAAkB;IAC1B,KAAK,EAAE,iBAAiB;IACxB,aAAa,EAAE,0BAA0B;IACzC,KAAK,EAAE,iBAAiB;IACxB,IAAI,EAAE,gBAAgB;IACtB,YAAY,EAAE,yBAAyB;IACvC,eAAe,EAAE,kBAAkB;CAC3B,CAAC;AAEX,iFAAiF;AACjF,MAAM,CAAC,MAAM,gBAAgB,GAAG,EAAE,CAAC;AAEnC;;;;GAIG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,CAAC","sourcesContent":["/** Default fallback input ID */\nexport const DEFAULT_INPUT_ID = 'date-picker';\n\n/** Default aria labels used by the calendar navigation */\nexport const DEFAULT_ARIA_LABELS = {\n  previousMonth: 'Previous month',\n  nextMonth: 'Next month',\n  previousYear: 'Previous year',\n  nextYear: 'Next year',\n  previousDecade: 'Previous decade',\n  nextDecade: 'Next decade',\n  chooseMonth: 'Choose month',\n  chooseYear: 'Choose year',\n  chooseDate: 'Choose date',\n} as const;\n\n/**\n * Shadow DOM parts exposed by the component.\n * Kept as a single list so it is easy to audit against the JSDoc @part list.\n */\nexport const CALENDAR_PARTS = {\n  base: 'base',\n  label: 'label',\n  control: 'control',\n  prefix: 'prefix',\n  suffix: 'suffix',\n  input: 'input',\n  clearBtn: 'clear-btn',\n  button: 'button',\n  panel: 'panel',\n  container: 'calendar__container',\n  header: 'calendar__header',\n  heading: 'calendar__heading',\n  previous: 'calendar__previous',\n  next: 'calendar__next',\n  table: 'calendar__table',\n  head: 'calendar__head',\n  tr: 'calendar__tr',\n  th: 'calendar__th',\n  week: 'calendar__week',\n  td: 'calendar__td',\n  day: 'calendar__day',\n  today: 'calendar__today',\n  selected: 'calendar__selected',\n  outside: 'calendar__outside',\n  disallowed: 'calendar__disallowed',\n  disabled: 'calendar__disabled',\n  rangeStart: 'calendar__range-start',\n  rangeEnd: 'calendar__range-end',\n  rangeInner: 'calendar__range-inner',\n  months: 'calendar__months',\n  month: 'calendar__month',\n  monthSelected: 'calendar__month-selected',\n  years: 'calendar__years',\n  year: 'calendar__year',\n  yearSelected: 'calendar__year-selected',\n  calendarTrigger: 'calendar-trigger',\n} as const;\n\n/** Number of years shown in the decade view grid. Uses 12 to fill a 3x4 grid. */\nexport const DECADE_GRID_SIZE = 12;\n\n/**\n * Maximum number of month panels rendered side-by-side. Range pickers only\n * benefit from up to 2 panels — beyond that the popover overflows most\n * viewports and roving keyboard navigation becomes confusing.\n */\nexport const MAX_MONTHS_PER_VIEW = 2;\n"]}