@bluevolt-tech/lumen 2.2.0 → 2.3.0

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");
@@ -1303,9 +1310,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-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-search-picker/bv-search-picker.d.ts

@@ -0,0 +1,222 @@
+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-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 _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;
+}