@bluevolt-tech/lumen 2.2.0 → 2.3.1

package/dist/components/_shared/dropdown-controller.d.ts

@@ -50,6 +50,22 @@ export interface DropdownController {
  *   the state. The controller is the single source of truth; consuming
  *   components must NOT duplicate this sync in their own attributeChangedCallback.
  * - `bv-open` is dispatched from the host when opening via `open()`/`toggle()`.
+ * - `bv-dropdown-close` is dispatched from the host on every successful close,
+ *   with `detail: { reason }` matching the `CloseReason` union — consumers can
+ *   use it to close sibling dropdowns or release focus/scroll locks. The name
+ *   is prefixed to avoid colliding with `bv-modal` / `bv-course-detail-modal`,
+ *   which dispatch a bare `bv-close` on dismissal — a plain `bv-close` here
+ *   would bubble into ancestor `bv-close` listeners (e.g. a modal that
+ *   contains a dropdown) and fire spuriously on every dropdown dismissal.
+ *
+ * **Consumers MUST NOT call `e.stopPropagation()` on the trigger click**
+ * (BTN-10408). The outside-click listener attached here on `document` uses
+ * `composedPath().includes(host)` to skip clicks that originated inside its
+ * own host — so it already ignores the trigger click without needing the
+ * event to be swallowed. Stopping propagation on the trigger prevents the
+ * `document`-level listeners attached by *sibling* controllers from
+ * receiving the click at all, which is why opening one dropdown while
+ * another is open used to leave both visible.
  *
  * The controller mutates the `open` attribute on the host. Consumers should
  * drive their visual state (`.panel` visibility, focus management) from that

package/dist/components/bv-date-range-input/bv-date-range-input.js

@@ -42,6 +42,13 @@ function bindDropdownController(host, options = {}) {
     if (options.canClose && !options.canClose(reason)) return;
     host.removeAttribute("open");
     syncExpanded();
+    host.dispatchEvent(
+      new CustomEvent("bv-dropdown-close", {
+        bubbles: true,
+        composed: true,
+        detail: { reason }
+      })
+    );
     (_a = options.onAfterClose) == null ? void 0 : _a.call(options);
   };
   const close = () => closeWithReason("programmatic");
@@ -549,12 +556,43 @@ var BvDateRangePicker = class extends HTMLElement {
     if (name === "preset") this._preset = val ?? "";
     if (!this._rendered) return;
     if (name === "start" || name === "end" || name === "preset") {
+      this._maybeRepositionView();
       this._syncCalendars();
       this._syncInputs();
       this._syncPresets();
     }
     this._syncValidity();
   }
+  // Hoist the left panel to the anchor's month, but ONLY when *neither*
+  // endpoint of the current start/end pair is already in the visible pair.
+  // Checking both endpoints matters after manual navigation: if the user
+  // scrolled far from `_start` and the consumer only touches `_end`, the
+  // change may land inside the visible pair even though `_start` is well
+  // out of view — the guard must keep the user's navigation intact in
+  // that case. The anchor for the actual reposition still prefers
+  // `_start` (fallback to `_end`) so common consumer updates that write
+  // both fields converge to the start's month. See BTN-10755 in
+  // `attributeChangedCallback` for the flow context. Returns silently on
+  // empty / malformed values — the sync pass afterwards can still render
+  // the cleared selection over the current view without a jump.
+  _maybeRepositionView() {
+    const anchor = this._start || this._end;
+    if (!anchor) return;
+    const parseYearMonth = (s2) => {
+      const dt = parseIso(s2);
+      if (!dt) return null;
+      return { y: dt.getFullYear(), m: dt.getMonth() };
+    };
+    const right = this._getRightMonth();
+    const isVisible = (y, m) => y === this._leftYear && m === this._leftMonth || y === right.year && m === right.month;
+    const s = this._start ? parseYearMonth(this._start) : null;
+    const e = this._end ? parseYearMonth(this._end) : null;
+    if (s && isVisible(s.y, s.m) || e && isVisible(e.y, e.m)) return;
+    const target = parseYearMonth(anchor);
+    if (!target) return;
+    this._leftYear = target.y;
+    this._leftMonth = target.m;
+  }
   /**
    * BTN-10312 — public reset of the picker's internal draft state to the
    * currently committed `start` / `end` / `preset` attributes. Called by
@@ -1303,9 +1341,8 @@ var BvDateRangeInput = class extends HTMLElement {
     icon.className = "trigger-icon";
     icon.innerHTML = CALENDAR_ICON;
     trigger.append(display, icon);
-    trigger.addEventListener("click", (e) => {
+    trigger.addEventListener("click", () => {
       var _a;
-      e.stopPropagation();
       (_a = this._dropdown) == null ? void 0 : _a.toggle();
     });
     const popup = document.createElement("div");

package/dist/components/bv-date-range-picker/bv-date-range-picker.d.ts

@@ -51,6 +51,7 @@ export declare class BvDateRangePicker extends HTMLElement {
     set preset(v: string);
     connectedCallback(): void;
     attributeChangedCallback(name: string, _old: string | null, val: string | null): void;
+    private _maybeRepositionView;
     /**
      * BTN-10312 — public reset of the picker's internal draft state to the
      * currently committed `start` / `end` / `preset` attributes. Called by

package/dist/components/bv-date-range-picker/bv-date-range-picker.js

@@ -495,12 +495,43 @@ var BvDateRangePicker = class extends HTMLElement {
     if (name === "preset") this._preset = val ?? "";
     if (!this._rendered) return;
     if (name === "start" || name === "end" || name === "preset") {
+      this._maybeRepositionView();
       this._syncCalendars();
       this._syncInputs();
       this._syncPresets();
     }
     this._syncValidity();
   }
+  // Hoist the left panel to the anchor's month, but ONLY when *neither*
+  // endpoint of the current start/end pair is already in the visible pair.
+  // Checking both endpoints matters after manual navigation: if the user
+  // scrolled far from `_start` and the consumer only touches `_end`, the
+  // change may land inside the visible pair even though `_start` is well
+  // out of view — the guard must keep the user's navigation intact in
+  // that case. The anchor for the actual reposition still prefers
+  // `_start` (fallback to `_end`) so common consumer updates that write
+  // both fields converge to the start's month. See BTN-10755 in
+  // `attributeChangedCallback` for the flow context. Returns silently on
+  // empty / malformed values — the sync pass afterwards can still render
+  // the cleared selection over the current view without a jump.
+  _maybeRepositionView() {
+    const anchor = this._start || this._end;
+    if (!anchor) return;
+    const parseYearMonth = (s2) => {
+      const dt = parseIso(s2);
+      if (!dt) return null;
+      return { y: dt.getFullYear(), m: dt.getMonth() };
+    };
+    const right = this._getRightMonth();
+    const isVisible = (y, m) => y === this._leftYear && m === this._leftMonth || y === right.year && m === right.month;
+    const s = this._start ? parseYearMonth(this._start) : null;
+    const e = this._end ? parseYearMonth(this._end) : null;
+    if (s && isVisible(s.y, s.m) || e && isVisible(e.y, e.m)) return;
+    const target = parseYearMonth(anchor);
+    if (!target) return;
+    this._leftYear = target.y;
+    this._leftMonth = target.m;
+  }
   /**
    * BTN-10312 — public reset of the picker's internal draft state to the
    * currently committed `start` / `end` / `preset` attributes. Called by

package/dist/components/bv-filter-dropdown/bv-filter-dropdown.js

@@ -42,6 +42,13 @@ function bindDropdownController(host, options = {}) {
     if (options.canClose && !options.canClose(reason)) return;
     host.removeAttribute("open");
     syncExpanded();
+    host.dispatchEvent(
+      new CustomEvent("bv-dropdown-close", {
+        bubbles: true,
+        composed: true,
+        detail: { reason }
+      })
+    );
     (_a = options.onAfterClose) == null ? void 0 : _a.call(options);
   };
   const close = () => closeWithReason("programmatic");
@@ -187,9 +194,8 @@ var BvFilterDropdown = class extends HTMLElement {
     chevron.className = "trigger-chevron";
     chevron.innerHTML = CHEVRON_DOWN;
     trigger.append(label, chevron);
-    trigger.addEventListener("click", (e) => {
+    trigger.addEventListener("click", () => {
       var _a;
-      e.stopPropagation();
       if (this.disabled) return;
       (_a = this._dropdown) == null ? void 0 : _a.toggle();
     });

package/dist/components/bv-input-dropdown/bv-input-dropdown.js

@@ -42,6 +42,13 @@ function bindDropdownController(host, options = {}) {
     if (options.canClose && !options.canClose(reason)) return;
     host.removeAttribute("open");
     syncExpanded();
+    host.dispatchEvent(
+      new CustomEvent("bv-dropdown-close", {
+        bubbles: true,
+        composed: true,
+        detail: { reason }
+      })
+    );
     (_a = options.onAfterClose) == null ? void 0 : _a.call(options);
   };
   const close = () => closeWithReason("programmatic");
@@ -343,9 +350,8 @@ var BvInputDropdown = class extends HTMLElement {
     trigger.setAttribute("aria-haspopup", "listbox");
     trigger.setAttribute("aria-expanded", "false");
     trigger.setAttribute("part", "trigger");
-    trigger.addEventListener("click", (e) => {
+    trigger.addEventListener("click", () => {
       var _a;
-      e.stopPropagation();
       if (!this.disabled) (_a = this._dropdown) == null ? void 0 : _a.toggle();
     });
     const triggerLabel = document.createElement("span");

package/dist/components/bv-pagination/bv-pagination.d.ts

@@ -1,5 +1,5 @@
 export declare class BvPagination extends HTMLElement {
-    static readonly observedAttributes: readonly ["page", "total-pages", "total", "page-size", "siblings", "show-results", "show-page-size", "page-size-options", "compact"];
+    static readonly observedAttributes: readonly ["page", "total-pages", "total", "page-size", "siblings", "show-results", "show-page-size", "page-size-options", "compact", "hide-range"];
     private _rendered;
     private _metaEl;
     private _pagesEl;
@@ -24,6 +24,8 @@ export declare class BvPagination extends HTMLElement {
     set showPageSize(v: boolean);
     get compact(): boolean;
     set compact(v: boolean);
+    get hideRange(): boolean;
+    set hideRange(v: boolean);
     get pageSizeOptions(): number[];
     private _go;
     private _render;

package/dist/components/bv-pagination/bv-pagination.js

@@ -32,7 +32,8 @@ var BvPagination = class extends HTMLElement {
     "show-results",
     "show-page-size",
     "page-size-options",
-    "compact"
+    "compact",
+    "hide-range"
   ];
   _rendered = false;
   _metaEl = null;
@@ -90,6 +91,13 @@ var BvPagination = class extends HTMLElement {
     if (v) this.setAttribute("compact", "");
     else this.removeAttribute("compact");
   }
+  get hideRange() {
+    return this.hasAttribute("hide-range");
+  }
+  set hideRange(v) {
+    if (v) this.setAttribute("hide-range", "");
+    else this.removeAttribute("hide-range");
+  }
   get pageSizeOptions() {
     const raw = this.getAttribute("page-size-options") ?? "10,25,50,100";
     return raw.split(",").map((v) => parseInt(v.trim(), 10)).filter((v) => !isNaN(v));
@@ -169,7 +177,7 @@ var BvPagination = class extends HTMLElement {
     this._update();
   }
   _update() {
-    const { page, totalPages, total, pageSize, siblings, compact } = this;
+    const { page, totalPages, total, pageSize, siblings, compact, hideRange } = this;
     if (this._prevBtn) this._prevBtn.disabled = page <= 1;
     if (this._nextBtn) this._nextBtn.disabled = page >= totalPages;
     if (this._pageLabelEl) {
@@ -180,7 +188,7 @@ var BvPagination = class extends HTMLElement {
       this._pagesEl.hidden = compact;
     }
     if (this._rangeEl) {
-      if (compact) {
+      if (compact || hideRange) {
         this._rangeEl.hidden = true;
       } else if (total > 0) {
         const start = (page - 1) * pageSize + 1;

package/dist/components/bv-search-picker/bv-search-picker.d.ts

@@ -0,0 +1,231 @@
+import '../bv-searchbox/bv-searchbox.ts';
+import '../bv-segmented-control/bv-segmented-control.ts';
+import '../bv-toggle/bv-toggle.ts';
+import '../bv-button/bv-button.ts';
+export type SearchPickerMode = 'include' | 'exclude';
+export interface SearchPickerItem {
+    id: string;
+    name: string;
+    inactive?: boolean;
+}
+/**
+ * Detail on the `bv-search` event.
+ *
+ * Note: `showInactive` is intentionally NOT on this payload — read it directly
+ * off the picker (`picker.showInactive`) inside the handler. It changes via its
+ * own event (`bv-show-inactive-change`), so mixing it into `bv-search` would
+ * emit an update on every keystroke rather than only when it actually changes.
+ */
+export interface SearchPickerSearchDetail {
+    /** Trimmed user query. Only emitted past `min-query-length`. */
+    query: string;
+    /** Monotonic id the consumer echoes back via `results-request-id` so the picker can drop stale responses. */
+    requestId: number;
+}
+export interface SearchPickerBasketChangeDetail {
+    /** Staged mode at the moment of the change (before Apply). */
+    mode: SearchPickerMode;
+    /** Staged basket at the moment of the change (before Apply). Consumer sees every add/remove/clear. */
+    basket: SearchPickerItem[];
+}
+export interface SearchPickerModeChangeDetail {
+    /** Staged mode after the toggle (before Apply). */
+    mode: SearchPickerMode;
+}
+export interface SearchPickerShowInactiveChangeDetail {
+    showInactive: boolean;
+}
+export interface SearchPickerApplyDetail {
+    /** Committed mode. */
+    mode: SearchPickerMode;
+    /** Committed basket. */
+    basket: SearchPickerItem[];
+}
+export interface SearchPickerClearedDetail {
+    /** Consumer-supplied string identifying why the basket was cleared (e.g. `'category-changed'`, `'group-changed'`). */
+    reason: string;
+}
+export declare class BvSearchPicker extends HTMLElement {
+    static readonly observedAttributes: readonly ["label", "entity-label", "search-placeholder", "inactive-toggle-label", "mode", "min-query-length", "debounce-ms", "disabled", "loading", "show-inactive", "open", "results", "results-total", "results-request-id", "basket", "label-all", "label-count", "label-except", "label-only-these", "label-all-except", "label-empty-basket", "label-clear-all", "label-min-chars", "label-no-results", "label-results-cap", "label-cleared"];
+    private _rendered;
+    private _query;
+    /**
+     * BTN-10322 — staged basket edited inside the panel. Kept separate from the
+     * committed `basket` attribute so the trigger pill doesn't flicker mid-edit
+     * (add/remove doesn't touch it) and so a cascade reset (`reset()`) has a
+     * clean staged copy to reseed from. Committed on Apply, AND automatically
+     * whenever the panel closes any other way (Escape / outside-click / trigger
+     * toggle) — see `onAfterClose` in `_render()`. Closing is what "confirms"
+     * the edit; Apply is just the explicit, no-need-to-move-your-mouse way to
+     * do the same thing.
+     */
+    private _stagedBasket;
+    /** BTN-10322 — staged mode edited inside the panel. Committed on close, same as `_stagedBasket`. */
+    private _stagedMode;
+    /** BTN-10322 — monotonic id emitted with `bv-search`. The consumer echoes it via `results-request-id`; stale responses drop silently. */
+    private _searchRequestId;
+    /** BTN-10322 — timer handle for the internal debounce on `bv-search`. */
+    private _searchDebounceHandle;
+    /**
+     * BTN-10755 — set synchronously the moment a keystroke enters over-threshold
+     * territory and the debounce is armed; cleared when the debounce fires (or
+     * on any reset / clear path). `_syncResultsEmptyText` treats it the same as
+     * `loading`, so the "No X found." copy can't flash in the ~300ms gap
+     * between the keystroke and the dispatched `bv-search`.
+     */
+    private _searchPending;
+    /**
+     * BTN-10322 — the reason to display in the cascade cleared affordance,
+     * or `null` when the banner is hidden. Set by `reset({ reason })`,
+     * cleared when the user next opens the panel or explicitly dismisses.
+     */
+    private _clearedReason;
+    private _labelEl;
+    private _triggerEl;
+    private _panelEl;
+    private _pillEl;
+    private _pillTextEl;
+    private _pillClearEl;
+    private _modeControlEl;
+    private _inactiveToggleEl;
+    private _searchEl;
+    private _resultsRowsEl;
+    private _resultsEmptyEl;
+    private _resultsLimitNoteEl;
+    private _basketHeaderLabelEl;
+    private _basketClearAllEl;
+    private _basketListEl;
+    private _basketEmptyEl;
+    private _resultsListEl;
+    private _clearedAffordanceEl;
+    private _clearedAffordanceMsgEl;
+    private _dropdown;
+    constructor();
+    get mode(): SearchPickerMode;
+    /**
+     * Setting `mode` from outside is treated as a commit — it aligns the staged
+     * mode inside the panel with the new committed value. Useful for initialising
+     * from URL params or reverting from a saved report configuration. If the panel
+     * is currently open, the segmented control snaps to the new mode immediately;
+     * the user is expected to see this as an intentional external change, not an
+     * accidental override of their in-flight edit.
+     */
+    set mode(v: SearchPickerMode);
+    get entityLabel(): string;
+    set entityLabel(v: string);
+    get minQueryLength(): number;
+    set minQueryLength(v: number);
+    get disabled(): boolean;
+    set disabled(v: boolean);
+    get loading(): boolean;
+    set loading(v: boolean);
+    get showInactive(): boolean;
+    set showInactive(v: boolean);
+    get results(): SearchPickerItem[];
+    set results(v: SearchPickerItem[]);
+    get resultsTotal(): number | null;
+    set resultsTotal(v: number | null);
+    get debounceMs(): number;
+    set debounceMs(v: number);
+    get basket(): SearchPickerItem[];
+    set basket(v: SearchPickerItem[]);
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, _old: string | null, _val: string | null): void;
+    /**
+     * BTN-10322 — request-id guard. When `results` (or friends) are set from
+     * the consumer's async search, `results-request-id` must match the most
+     * recent id emitted by our own `bv-search`. Any mismatch means the
+     * response arrived out of order (user typed faster than the network) and
+     * we drop it silently to avoid rendering stale rows.
+     *
+     * `results-request-id` unset entirely is fine — consumers that don't
+     * bother with the guard behave as before (no correlation).
+     */
+    private _syncResultsWithGuard;
+    private _render;
+    private _positionPanel;
+    private _syncLabel;
+    private _syncModeOptions;
+    private _syncSearchPlaceholder;
+    private _syncInactiveToggleLabel;
+    private _syncMode;
+    private _syncDisabled;
+    private _syncShowInactive;
+    private _syncResults;
+    private _effectiveQueryLength;
+    private _syncResultsEmptyText;
+    private _syncResultsLimitNote;
+    private _syncBasket;
+    private _syncBasketHeaderLabel;
+    private _syncBasketRowColors;
+    private _syncBasketEmptyText;
+    private _syncTriggerSummary;
+    private _interp;
+    private _addBasket;
+    private _removeBasket;
+    private _clearAllStaged;
+    /**
+     * The trigger's pill-clear (`x`) is an explicit user action that means "back
+     * to the neutral state". Unlike the basket's "Clear all" (which only touches
+     * staged), this commits immediately — the pill lives on the trigger, which
+     * only reflects committed state. Dispatches `bv-apply` because a commit
+     * happened.
+     */
+    private _clearCommitted;
+    private _stagedDiffersFromCommitted;
+    private _commitStaged;
+    private _apply;
+    private _dispatchBasketChange;
+    private _dispatchModeChange;
+    private _dispatchShowInactiveChange;
+    private _dispatchApply;
+    private _dispatchSearch;
+    private _scheduleSearchDispatch;
+    /**
+     * BTN-10322 — Arrow Up/Down navigation between result rows; Enter or Space
+     * adds the currently-focused row to the staged basket. Home/End jump to
+     * first/last. Escape delegates to the shared dropdown-controller (already
+     * wired on the host).
+     *
+     * `role="option"` rows use `aria-selected` only to communicate focus
+     * position to assistive tech — clicking / Enter also fires the add flow,
+     * which then removes the row from the results list.
+     */
+    private _onResultsKeyDown;
+    /**
+     * BTN-10322 — count of the currently committed basket. Consumers can read
+     * this to render an external counter badge without duplicating state.
+     */
+    get count(): number;
+    /**
+     * BTN-10322 — cascade reset from outside the panel. This is THE canonical
+     * way for a consumer to clear the picker in response to an upstream filter
+     * change (e.g. CET Report when Categories or Groups change). It:
+     *
+     * - clears the committed `basket` and the staged edit,
+     * - clears `results` + `resultsTotal` (post-cascade the last search's
+     *   rows are stale — leaving them visible next to the cleared banner
+     *   is confusing),
+     * - clears the internal search query,
+     * - surfaces the "cleared" affordance banner with `{ reason }` interpolated
+     *   into the copy,
+     * - dispatches `bv-cleared` with `{ reason }`.
+     *
+     * Does NOT dispatch `bv-apply` — this is not a user commit, it's an
+     * out-of-band cascade. The consumer that triggered it already knows the
+     * basket was cleared.
+     *
+     * The affordance auto-hides the next time the user opens the panel or
+     * dismisses it explicitly via the banner's close button.
+     *
+     * **Prefer this over `element.basket = []`** — the setter is silent (no
+     * bv-cleared, no visible affordance) and is intended for state restoration
+     * from URL/deep-link, not for cascade reset.
+     */
+    reset({ reason }: {
+        reason: string;
+    }): void;
+    private _syncClearedAffordance;
+    private _dismissClearedAffordance;
+}