monkey-style-guide 21.2.8 → 21.2.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "monkey-style-guide",
-  "version": "21.2.8",
+  "version": "21.2.9",
   "peerDependencies": {
     "@angular/animations": "^21.2.4",
     "@angular/cdk": "^21.2.2",

package/types/monkey-style-guide.d.ts

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { TemplateRef, ComponentRef, InputSignal, OutputEmitterRef, AfterContentInit, AfterContentChecked, OnDestroy, ElementRef, EventEmitter, ChangeDetectorRef, OnChanges, OnInit, InputSignalWithTransform, AfterViewInit, SimpleChanges, Renderer2, QueryList, StaticProvider, Injector, InjectionToken, ViewContainerRef, ApplicationRef } from '@angular/core';
+import { TemplateRef, EventEmitter, ElementRef, ComponentRef, InputSignal, OutputEmitterRef, AfterContentInit, AfterContentChecked, OnDestroy, ChangeDetectorRef, OnChanges, OnInit, InputSignalWithTransform, AfterViewInit, SimpleChanges, Renderer2, QueryList, StaticProvider, Injector, InjectionToken, ViewContainerRef, ApplicationRef } from '@angular/core';
 import { NgControl, AbstractControlDirective, ControlValueAccessor, Validator, AbstractControl, ValidationErrors } from '@angular/forms';
 import * as rxjs from 'rxjs';
 import { Observable, Subject, BehaviorSubject } from 'rxjs';
@@ -130,6 +130,35 @@ interface MonkeyTableScrollConfig {
     y?: string;
 }
 
+/** ************************
+ * Copyright Monkey Exchange. All Rights Reserved
+ * This style guide was developed by Monkey Exchange Team
+ * MIT Licence
+ ************************* */
+
+declare class MonkeyToastComponent {
+    private host;
+    message: string | undefined;
+    icon: string | undefined;
+    type: MonkeyToastType;
+    isClosable: boolean;
+    actionLabel: string | undefined;
+    actionIcon: string | undefined;
+    onActionClick: EventEmitter<string>;
+    onClose: EventEmitter<string>;
+    protected _uid: string;
+    protected _id: string;
+    get id(): string;
+    set id(value: string);
+    get class(): string;
+    constructor(host: ElementRef<HTMLElement>);
+    close(): void;
+    onAnimationEnd(event: AnimationEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MonkeyToastComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeyToastComponent, "monkey-toast", never, { "message": { "alias": "message"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "type": { "alias": "type"; "required": false; }; "isClosable": { "alias": "isClosable"; "required": false; }; "actionLabel": { "alias": "actionLabel"; "required": false; }; "actionIcon": { "alias": "actionIcon"; "required": false; }; "id": { "alias": "id"; "required": false; }; }, { "onActionClick": "onActionClick"; "onClose": "onClose"; }, never, never, true, never>;
+    static ngAcceptInputType_isClosable: unknown;
+}
+
 /** ************************
  * Copyright Monkey Exchange. All Rights Reserved
  * This style guide was developed by Monkey Exchange Team
@@ -885,6 +914,469 @@ declare class MonkeyFilterBarService {
     static ɵprov: i0.ɵɵInjectableDeclaration<MonkeyFilterBarService>;
 }
 
+/** ************************
+ * Copyright Monkey Exchange. All Rights Reserved
+ * This style guide was developed by Monkey Exchange Team
+ * MIT Licence
+ ************************* */
+/**
+ * Has the page painted its first frame?
+ *
+ * Use it to decide whether an `animate.enter` should apply:
+ *
+ *   [animate.enter]="appPainted() ? 'mecx-x--entering' : ''"
+ *
+ * A component already on screen at the first paint comes in without animation;
+ * one the consumer mounts later animates normally.
+ */
+declare function appPainted(): boolean;
+
+/** Which panel of which chip is open. Only one is ever open at a time. */
+interface OpenPanel {
+    readonly key: string;
+    readonly part: 'category' | 'value';
+}
+/** One slot of the row: an active filter, or the one being built. */
+interface MonkeyFilterBarV2Row {
+    readonly key: string;
+    readonly label: string;
+    readonly icon?: string;
+    readonly type: FilterType;
+    /** What the value segment shows. Empty while the answer is pending. */
+    readonly value: string;
+    /** True while the filter is being built and is not in the service yet. */
+    readonly pending: boolean;
+}
+declare class MonkeyFilterBarV2Component {
+    private readonly _service;
+    private readonly _hostEl;
+    private readonly _injector;
+    /** Storage key of this bar's state inside MonkeyFilterBarService. */
+    readonly key: i0.InputSignal<string>;
+    readonly config: i0.InputSignal<FilterBarConfig | undefined>;
+    /** Label of the trigger while the bar is still empty. */
+    readonly addFilterLabel: i0.InputSignal<string>;
+    readonly clearAllLabel: i0.InputSignal<string>;
+    readonly filtersChange: i0.OutputEmitterRef<{
+        search?: string;
+        filters: ActiveFilter[];
+    }>;
+    readonly searchChange: i0.OutputEmitterRef<string>;
+    /** A chip seeded by the consumer does not animate; one the user made does. */
+    readonly appPainted: typeof appPainted;
+    /**
+     * The filter being built — chosen from the trigger, not yet confirmed, so
+     * not yet in the service.
+     *
+     * It exists so the chip can be BORN where the trigger was, which is the
+     * whole point of the row's animation, without the bar reporting a filter
+     * that has no answer. Closing the panel without confirming drops it again:
+     * monkey-filter-bar has no half-filled state and neither does this one.
+     */
+    protected readonly pending: i0.WritableSignal<FilterOption | null>;
+    protected readonly openPanel: i0.WritableSignal<OpenPanel | null>;
+    protected readonly triggerOpen: i0.WritableSignal<boolean>;
+    /**
+     * The filter whose date panel is showing the CALENDAR instead of the
+     * shortcuts, or `null`.
+     *
+     * It is the same panel, anchored to the same segment — "Personalizado" only
+     * swaps its content. No modal: the dialog would be almost all frame around a
+     * calendar, and frame is not an answer to anything.
+     */
+    protected readonly calendarOpen: i0.WritableSignal<string | null>;
+    /** Search of the category panel. */
+    protected readonly categorySearch: i0.WritableSignal<string>;
+    /**
+     * Turns off the fade on the trigger's panel. It is written BEFORE the
+     * mutation on purpose: `animate.leave` is read the instant the node leaves,
+     * and turning it on afterwards would arrive too late.
+     */
+    protected readonly immediateTriggerExit: i0.WritableSignal<boolean>;
+    protected textValue: string;
+    protected currencyValue: number | null;
+    protected currencyMode: 'from' | 'until';
+    protected statusValues: string[];
+    protected dateRange: {
+        startDate: string;
+        endDate: string;
+    };
+    protected readonly serviceConfig: i0.Signal<FilterBarConfig | undefined>;
+    protected readonly activeFilters: i0.Signal<ActiveFilter[]>;
+    protected readonly searchValue: i0.Signal<string>;
+    protected readonly searchPlaceholder: i0.Signal<string>;
+    /** The slots of the row, in order: the confirmed ones, then the draft. */
+    protected readonly rows: i0.Signal<MonkeyFilterBarV2Row[]>;
+    /**
+     * What the TRIGGER offers: only what can still be added.
+     *
+     * This is monkey-filter-bar's rule — a filter already on the row is not on
+     * offer, because the bar holds one filter per key.
+     */
+    protected readonly addOptions: i0.Signal<FilterOption[]>;
+    /**
+     * What a chip's CATEGORY segment offers: the whole list.
+     *
+     * A different list from the trigger's on purpose. Here the question is "what
+     * else could this chip be", so the current category has to be visible — it
+     * is the one carrying the check — and the other filters already on the row
+     * are shown greyed out rather than hidden, which is what tells the user the
+     * category they were looking for is already in use.
+     */
+    protected readonly changeOptions: i0.Signal<FilterOption[]>;
+    /**
+     * While the bar is empty the trigger is the CALL and earns the label. With
+     * filters on screen a 28px square is enough.
+     */
+    protected readonly triggerVariant: i0.Signal<"text" | "icon">;
+    /**
+     * The glyph of the collapsed trigger is a `+`, not the funnel.
+     *
+     * The variant says what the button IS; the glyph says what it DOES. With
+     * filters already on screen the button does not open "the filters", it ADDS
+     * one more — and a funnel there reads as the wrong thing. With the bar empty
+     * the funnel is exact.
+     */
+    protected readonly triggerIcon: i0.Signal<"filter" | "add-plus">;
+    /**
+     * The FLIP identity changes along with the variant, and that is the fix: the
+     * text trigger is REMOVED and the icon one is BORN in its place, instead of
+     * one button sliding to the right. Before this, the button dragged along the
+     * panel that was closing — the list vanished travelling sideways.
+     *
+     * From the second filter on the identity holds, and then the `+` really does
+     * slide: that movement is what says "the row grew".
+     */
+    protected readonly triggerFlipId: i0.Signal<"trigger-text" | "trigger-icon">;
+    constructor();
+    protected isOpen(rowKey: string, part: OpenPanel['part']): boolean;
+    protected isFilterActive(optionKey: string): boolean;
+    /** A divider goes where the type changes relative to the row above. */
+    protected needsDivider(options: readonly FilterOption[], index: number): boolean;
+    protected valuePlaceholder(row: MonkeyFilterBarV2Row): string;
+    protected statusOptionsOf(row: MonkeyFilterBarV2Row): monkey_style_guide.StatusOption[];
+    protected minDateOf(row: MonkeyFilterBarV2Row): Date | string;
+    protected maxDateOf(row: MonkeyFilterBarV2Row): Date | string;
+    /**
+     * `index` is the position in the list the template walked — the one the
+     * search filtered. Indexing the full list would pick the wrong option.
+     */
+    protected onSelectCategory(index: number): void;
+    /**
+     * Swaps the category of a chip that already exists, from its first segment.
+     *
+     * The answer always falls: it belongs to the old category's domain — a list
+     * of statuses means nothing inside a date range — so the chip goes back to
+     * waiting, with its value panel open.
+     */
+    protected onChangeCategory(row: MonkeyFilterBarV2Row, index: number): void;
+    /**
+     * Opening the trigger closes whatever chip panel was open: only one panel is
+     * ever on screen, and a draft chip whose panel was abandoned goes with it.
+     */
+    protected onTriggerOpenChange(open: boolean): void;
+    protected onCategoryOpenChange(row: MonkeyFilterBarV2Row, open: boolean): void;
+    protected onValueOpenChange(row: MonkeyFilterBarV2Row, open: boolean): void;
+    /**
+     * The same shortcuts monkey-filter-bar offers. "Personalizado" is the only
+     * one that does not resolve the interval on its own: it swaps the panel's
+     * content for the calendar, in the same place.
+     */
+    protected onQuickDate(row: MonkeyFilterBarV2Row, preset: string): void;
+    protected onDateChange(row: MonkeyFilterBarV2Row, event: {
+        startDate: string;
+        endDate: string;
+    }): void;
+    /** Cancel inside the calendar goes back to the shortcuts, panel still open. */
+    protected onBackToShortcuts(): void;
+    protected onStatusChange(value: string, checked: boolean): void;
+    protected onToggleStatus(value: string): void;
+    /**
+     * The one place where an answer is written. Same validation as
+     * monkey-filter-bar: an empty answer is not an answer, and the panel stays
+     * open instead of writing a filter with nothing in it.
+     */
+    protected onApply(row: MonkeyFilterBarV2Row): void;
+    protected onRemove(row: MonkeyFilterBarV2Row): void;
+    /** Zeroes the whole bar. The trigger goes back to being the call with a label. */
+    protected onClearAll(): void;
+    protected onSearchChange(value: string): void;
+    /**
+     * Opens a chip's answer panel, pre-filled with the answer it already holds —
+     * this is the edit path the active-filter tag used to be.
+     */
+    private _openValuePanel;
+    /**
+     * Closing the value panel of a chip that was never confirmed drops the chip:
+     * monkey-filter-bar adds nothing until Apply, and a chip left on the row
+     * with no answer would be a state it does not have.
+     *
+     * Closing the panel of a CONFIRMED chip changes no width — the segment shows
+     * the same text it did before — so that path needs no FLIP.
+     */
+    private _closePanel;
+    /** Takes the draft chip off the row, ghost and all. */
+    private _dropPending;
+    private _optionFor;
+    private _matchingSearch;
+    private _resetDraft;
+    private _emit;
+    /**
+     * Takes the slots that are about to leave out of the flow, at the exact
+     * place where they are.
+     *
+     * This is done HERE and not by the `animate.leave` class because of ORDER:
+     * Angular only applies the exit class the instant it removes the node, and
+     * that happens AFTER the `afterNextRender` that runs the FLIP. The FLIP
+     * would then measure a layout that had not collapsed yet, see no
+     * displacement at all, and the neighbours would snap into their new place
+     * with no animation — the chip's exit worked and the neighbours' arrival did
+     * not.
+     *
+     * Released from the flow BEFORE the mutation, the row collapses in the same
+     * pass: the FLIP measures a real before and a real after, and the ghost
+     * fades out on top, in place. Explicit `left`/`top` are mandatory — the
+     * static position of an absolute element inside a flex container is the
+     * container's corner, not where the element was.
+     */
+    private _releaseFromFlow;
+    /**
+     * Takes the row to the end of its travel, so that what has just come in is
+     * not left hidden — and with it the trigger, which is always last in line.
+     *
+     * It runs BEFORE the "after" measurement on purpose. FLIP works in VIEWPORT
+     * coordinates, so scrolling first folds the scroll offset into the same sum:
+     * every piece slides from where the eye saw it to where it ended up, pan
+     * included. One single synchronised movement.
+     *
+     * It is also what makes `scroll-behavior: smooth` unnecessary, which has no
+     * token, guarantees nothing under reduced motion, and stalls in a throttled
+     * tab.
+     *
+     * The sum comes from the LAST SLOT, never from `scrollWidth`. `scrollWidth`
+     * at this instant is a poisoned measurement: the chip that has just been
+     * born brings its answer panel already open, and the panel has not been
+     * anchored yet — it is at its static position, far ahead, and counts as
+     * overflow. The scroll would go hundreds of pixels chasing a ghost, the FLIP
+     * would animate the whole row that distance, and the browser would clamp the
+     * scroll back when the panel got anchored — a hard jump with no animation,
+     * right in the middle of the chip's entrance.
+     *
+     * The slots do not have that problem: they are flow content, already at
+     * their final position on the first render, and none of them is `fixed`.
+     */
+    private _followEnd;
+    /**
+     * Measures, lets the state change, then makes everything slide from its old
+     * position.
+     *
+     * `afterNextRender` and not a `setTimeout`: we need the first instant at
+     * which the DOM ALREADY reflects the new state, and that is exactly what it
+     * delivers.
+     */
+    private _withFlip;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MonkeyFilterBarV2Component, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeyFilterBarV2Component, "monkey-filter-bar-v2", never, { "key": { "alias": "key"; "required": true; "isSignal": true; }; "config": { "alias": "config"; "required": false; "isSignal": true; }; "addFilterLabel": { "alias": "addFilterLabel"; "required": false; "isSignal": true; }; "clearAllLabel": { "alias": "clearAllLabel"; "required": false; "isSignal": true; }; }, { "filtersChange": "filtersChange"; "searchChange": "searchChange"; }, never, ["*"], true, never>;
+}
+
+/**
+ * The segmented row that replaces the trigger once the user has picked a
+ * filter. Two segments and a bin:
+ *
+ *   [ icon  Data de Emissão | 01/01/2025 - 31/01/2025 | 🗑 ]
+ *     category               value                      action
+ *
+ * How many segments there are is the consumer's decision — the value segment
+ * is projected as soon as there is something to answer:
+ *
+ *   <monkey-filter-chip (remove)="drop()">
+ *     <monkey-filter-segment icon="calendar-box" text="Data" readonlySegment />
+ *     <monkey-filter-segment placeholder="Selecione" [(open)]="open" />
+ *   </monkey-filter-chip>
+ *
+ * The chip carries NO `overflow: hidden`. It would clip the panels the
+ * segments open right below themselves; the ends are rounded by radius, not by
+ * clipping.
+ */
+declare class MonkeyFilterChipComponent {
+    /** Icon font name of the remove action, without the `mk-i-` prefix. */
+    readonly removeIcon: i0.InputSignal<string>;
+    readonly removeLabel: i0.InputSignal<string>;
+    readonly remove: i0.OutputEmitterRef<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MonkeyFilterChipComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeyFilterChipComponent, "monkey-filter-chip", never, { "removeIcon": { "alias": "removeIcon"; "required": false; "isSignal": true; }; "removeLabel": { "alias": "removeLabel"; "required": false; "isSignal": true; }; }, { "remove": "remove"; }, never, ["*"], true, never>;
+}
+
+/**
+ * The panel every dropdown of monkey-filter-bar-v2 opens: a surface with an
+ * optional search field on top and the projected rows below it.
+ *
+ * Only the WIDTH changes from one panel to the next, and it is set from the
+ * bar's own stylesheet through a class on this host — the panel component has
+ * no opinion on how wide a company list should be.
+ *
+ * `width` and not `min-width` on those classes: each panel is a fixed-width
+ * frame in the design and a long label ellipsizes inside it. With a floor the
+ * content would win, and the measurement would turn into a suggestion.
+ */
+declare class MonkeyFilterMenuComponent implements OnDestroy {
+    readonly showSearch: i0.InputSignalWithTransform<boolean, unknown>;
+    readonly searchPlaceholder: i0.InputSignal<string>;
+    /** Lets the row list scroll instead of growing past the viewport. */
+    readonly showScroll: i0.InputSignalWithTransform<boolean, unknown>;
+    /** Ceiling of the scrolling list, in px. */
+    readonly maxHeight: i0.InputSignal<number>;
+    readonly searchChange: i0.OutputEmitterRef<string>;
+    protected searchValue: string;
+    private readonly _zone;
+    private readonly _items;
+    /** Is the list actually overflowing right now? */
+    private readonly _overflowing;
+    /**
+     * Draw the track only when the content OVERFLOWS.
+     *
+     * Tied to `showScroll` alone, a three-row panel lost 12px of width to a
+     * track that was never going to appear.
+     */
+    protected readonly scrolling: i0.Signal<boolean>;
+    private _observer?;
+    constructor();
+    ngOnDestroy(): void;
+    protected onSearchInput(value: string): void;
+    private _disconnect;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MonkeyFilterMenuComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeyFilterMenuComponent, "monkey-filter-menu", never, { "showSearch": { "alias": "showSearch"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "showScroll": { "alias": "showScroll"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; }, { "searchChange": "searchChange"; }, never, ["*"], true, never>;
+}
+
+/** `text` is a plain row; `checkbox` puts a box in front of the label. */
+type MonkeyFilterMenuItemProperty = 'text' | 'checkbox';
+/**
+ * One row of a monkey-filter-menu.
+ *
+ * The ROW is the click target, which is why the checkbox inside it does not
+ * grow one of its own: the boxes sit 18px apart inside rows of 32px that touch
+ * each other, so a 40px floor on each would make two targets OVERLAP by 8px —
+ * inside rows that are already clickable end to end.
+ */
+declare class MonkeyFilterMenuItemComponent {
+    readonly property: i0.InputSignal<MonkeyFilterMenuItemProperty>;
+    /** Icon font name, without the `mk-i-` prefix. */
+    readonly leadIcon: i0.InputSignal<string | null>;
+    readonly label: i0.InputSignal<string>;
+    /** Secondary line under the label — a document number, a key. */
+    readonly description: i0.InputSignal<string | null>;
+    readonly checked: i0.InputSignalWithTransform<boolean, unknown>;
+    /** Already answered elsewhere: the row shows a check and stops responding. */
+    readonly selected: i0.InputSignalWithTransform<boolean, unknown>;
+    readonly disabled: i0.InputSignalWithTransform<boolean, unknown>;
+    readonly itemClick: i0.OutputEmitterRef<void>;
+    protected onClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MonkeyFilterMenuItemComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeyFilterMenuItemComponent, "monkey-filter-menu-item", never, { "property": { "alias": "property"; "required": false; "isSignal": true; }; "leadIcon": { "alias": "leadIcon"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "itemClick": "itemClick"; }, never, never, true, never>;
+}
+
+/**
+ * One segment of a monkey-filter-chip.
+ *
+ * ONE component for the two roles the chip has — the category name and the
+ * answer. Both share the same state table, the same padding, the same
+ * typography and the same height; what changes between them is the content
+ * (the first has an icon) and the rounding of the ends, which belongs to the
+ * chip and not to the segment. Two components would be two copies of the same
+ * stylesheet waiting to drift apart.
+ *
+ * `filled` is not an input: it is `text() !== ''`. Letting the consumer
+ * declare "filled" with an empty text would be a state impossible to draw.
+ *
+ * The projected panel is `position: fixed` and anchored by script — see
+ * `anchored-menu.ts` for why an `absolute` one cannot survive inside a row
+ * that scrolls.
+ */
+declare class MonkeyFilterSegmentComponent {
+    /** Category icon — usually only the chip's first segment has one. */
+    readonly icon: i0.InputSignal<string | null>;
+    /** The chosen value. Empty means the segment is still waiting. */
+    readonly text: i0.InputSignal<string>;
+    /** Waiting text, in the complement colour. */
+    readonly placeholder: i0.InputSignal<string>;
+    /** A segment with no panel to open. */
+    readonly readonlySegment: i0.InputSignalWithTransform<boolean, unknown>;
+    readonly open: i0.ModelSignal<boolean>;
+    readonly segmentClick: i0.OutputEmitterRef<void>;
+    readonly filled: i0.Signal<boolean>;
+    /** What is shown: the value when there is one, the waiting text when not. */
+    readonly label: i0.Signal<string>;
+    private readonly _hostEl;
+    private readonly _menuEl;
+    constructor();
+    toggle(): void;
+    /**
+     * A click outside closes. Without it the panel would only close by clicking
+     * the segment again — behaviour no system menu has, and which left two
+     * panels open at once on a row with several chips.
+     */
+    onDocumentPointerdown(event: PointerEvent): void;
+    /**
+     * Escape closes and hands the focus back to the segment's button. Without
+     * the hand-back the focus falls to `<body>` and Tab restarts from the top of
+     * the page: whoever opened the panel from the keyboard loses their place in
+     * the middle of the row.
+     */
+    onEscape(): void;
+    /** Closes and returns the focus. Public for whoever needs to close from outside. */
+    closeAndFocus(): void;
+    private focusButton;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MonkeyFilterSegmentComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeyFilterSegmentComponent, "monkey-filter-segment", never, { "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "readonlySegment": { "alias": "readonlySegment"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "segmentClick": "segmentClick"; }, never, ["*"], true, never>;
+}
+
+/** `text` is the 28px button with a label; `icon` is the 28px square. */
+type MonkeyFilterTriggerVariant = 'text' | 'icon';
+/**
+ * The button that adds a filter, and the panel of categories it opens.
+ *
+ * It is always the LAST slot of the row. While the bar is empty the trigger is
+ * the CALL to action and earns its label; with filters on screen it becomes
+ * the ADDITION, and a 28px square is enough.
+ *
+ * Both are 28px tall — the same as a chip segment — because the button turns
+ * into a chip in place, and 1px of difference would show up as a jump at the
+ * moment of the swap.
+ */
+declare class MonkeyFilterTriggerComponent {
+    readonly variant: i0.InputSignal<MonkeyFilterTriggerVariant>;
+    /** Icon font name, without the `mk-i-` prefix. */
+    readonly icon: i0.InputSignal<string>;
+    readonly text: i0.InputSignal<string>;
+    readonly ariaLabel: i0.InputSignal<string>;
+    readonly disabled: i0.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * The panel leaves with no exit animation.
+     *
+     * It exists for ONE case: when the closing goes along with the trigger
+     * itself changing place. The panel is a child of the button, so it travels
+     * with it — and a fade on an element that has just teleported 160px does not
+     * read as an exit, it reads as a glitch. Closing by Escape or by an outside
+     * click is not that case and keeps its fade.
+     */
+    readonly immediateExit: i0.InputSignalWithTransform<boolean, unknown>;
+    readonly open: i0.ModelSignal<boolean>;
+    /**
+     * `aria-label` only on the variant with no visible label. Where there is a
+     * label, an `aria-label` over it would swap the name the user reads for one
+     * they cannot see — breaking voice control and the "Label in Name" criterion.
+     */
+    readonly ariaLabelAttr: i0.Signal<string | null>;
+    private readonly _hostEl;
+    private readonly _menuEl;
+    constructor();
+    toggle(): void;
+    onDocumentPointerdown(event: PointerEvent): void;
+    onEscape(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MonkeyFilterTriggerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeyFilterTriggerComponent, "monkey-filter-trigger", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "immediateExit": { "alias": "immediateExit"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, never, ["*"], true, never>;
+}
+
 declare class MonkeyIconButtonComponent {
     type: 'primary' | 'secondary' | 'tertiary';
     size: 'sm' | 'md' | 'lg';
@@ -2171,35 +2663,6 @@ declare class MonkeyTabsModule {
     static ɵinj: i0.ɵɵInjectorDeclaration<MonkeyTabsModule>;
 }
 
-/** ************************
- * Copyright Monkey Exchange. All Rights Reserved
- * This style guide was developed by Monkey Exchange Team
- * MIT Licence
- ************************* */
-
-declare class MonkeyToastComponent {
-    private host;
-    message: string | undefined;
-    icon: string | undefined;
-    type: MonkeyToastType;
-    isClosable: boolean;
-    actionLabel: string | undefined;
-    actionIcon: string | undefined;
-    onActionClick: EventEmitter<string>;
-    onClose: EventEmitter<string>;
-    protected _uid: string;
-    protected _id: string;
-    get id(): string;
-    set id(value: string);
-    get class(): string;
-    constructor(host: ElementRef<HTMLElement>);
-    close(): void;
-    onAnimationEnd(event: AnimationEvent): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MonkeyToastComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MonkeyToastComponent, "monkey-toast", never, { "message": { "alias": "message"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "type": { "alias": "type"; "required": false; }; "isClosable": { "alias": "isClosable"; "required": false; }; "actionLabel": { "alias": "actionLabel"; "required": false; }; "actionIcon": { "alias": "actionIcon"; "required": false; }; "id": { "alias": "id"; "required": false; }; }, { "onActionClick": "onActionClick"; "onClose": "onClose"; }, never, never, true, never>;
-    static ngAcceptInputType_isClosable: unknown;
-}
-
 declare class MonkeyToggleComponent {
     disabled: boolean;
     size: 'lg' | 'md' | 'sm';
@@ -2564,5 +3027,5 @@ declare const MECX_COUNTRY_ISO_CODE: InjectionToken<string>;
 declare const MECX_GOOGLE_API_KEY: InjectionToken<string>;
 declare function injectTokenWithWarning<T>(token: InjectionToken<T>, name?: string): T | null;
 
-export { MECX_COUNTRY_ISO_CODE, MECX_GOOGLE_API_KEY, MECX_I18N_WRAPPER, MECX_MODAL_DATA, MECX_MODAL_DEFAULT_CONFIG, MECX_POPOVER_OPTIONS, MonkeyAccordionComponent, MonkeyActionBarComponent, MonkeyAlertComponent, MonkeyAutocompleteAddressComponent, MonkeyAutocompleteComponent, MonkeyAvatarComponent, MonkeyBadgeComponent, MonkeyBadgeDirective, MonkeyBreadcrumbComponent, MonkeyButtonComponent, MonkeyCheckboxComponent, MonkeyComplexFilterBarComponent, MonkeyDateRangeComponent, MonkeyDictionaryService, MonkeyDisplayDirective, MonkeyDividerComponent, MonkeyDownloadButtonComponent, MonkeyEcxAddressService, MonkeyErrorDirective, MonkeyFilterBarComponent, MonkeyFilterBarService, MonkeyFormDirective, MonkeyFormFieldComponent, MonkeyFormFieldControl, MonkeyFormFieldModule, MonkeyHelperDirective, MonkeyIconButtonComponent, MonkeyInfoDirective, MonkeyInputCodeComponent, MonkeyInputCurrencyDirective, MonkeyInputDateRangeComponent, MonkeyInputDirective, MonkeyInputModule, MonkeyInputPhoneComponent, MonkeyInputUploadComponent, MonkeyLabelDirective, MonkeyModalActionsDirective, MonkeyModalComponent, MonkeyModalConfig, MonkeyModalContentDirective, MonkeyModalModule, MonkeyModalRef, MonkeyModalService, MonkeyModalSubtitleDirective, MonkeyModalTitleDirective, MonkeyOptionComponent, MonkeyPaginationActionComponent, MonkeyPaginationLabelComponent, MonkeyPaginationSizeComponent, MonkeyPassNumberComponent, MonkeyPassSecretNumberComponent, MonkeyPopoverContentComponent, MonkeyPopoverDirective, MonkeyPrefixDirective, MonkeyRadioButtonComponent, MonkeyScrollbarComponent, MonkeySecurityLevelComponent, MonkeySelectComponent, MonkeyStatusComponent, MonkeyStepComponent, MonkeyStepperComponent, MonkeyStepperModule, MonkeyStepperService, MonkeySuffixDirective, MonkeyTabComponent, MonkeyTabLinkDirective, MonkeyTableCellDirective, MonkeyTableColumnDirective, MonkeyTableComponent, MonkeyTableEmptyDirective, MonkeyTableHeaderCellDirective, MonkeyTableLoadingDirective, MonkeyTableRowDetailDirective, MonkeyTabsComponent, MonkeyTabsModule, MonkeyToastComponent, MonkeyToastRef, MonkeyToastService, MonkeyToggleComponent, MonkeyToggleLineButtonComponent, MonkeyToggleLineComponent, MonkeyTooltipComponent, MonkeyTooltipDirective, MonkeyUserProfileButtonComponent, MonkeyUserProfileComponent, addKeys, ariaSortOf, getCurrencySymbol, indexAtOffset, injectTokenWithWarning, interpolate, mergeOrder, offsetOfIndex, removeKeys, sameColumnState, selectionState, sortByOrder, toPx, toggleKey, totalHeight };
-export type { ActiveFilter, AutocompleteSuggestion, AutocompleteSuggestionType, ColumnAlign, ColumnPinned, ComplexFilterCondition, ComplexFilterGroup, ComplexFilterOperator, ComplexFilterResult, FilterBarConfig, FilterBarState, FilterOption, FilterType, GoogleApiPlaces, GoogleApiPlacesAddressComponents, GoogleApiPlacesResponse, MonkeyAlertType, MonkeyAutocompleteData, MonkeyAutocompleteResponse, MonkeyBreadcrumb, MonkeyButtonColor, MonkeyButtonType, MonkeyDownloadButtonChangeEvent, MonkeyInputUploadChangeEvent, MonkeyModalConfirmationConfig, MonkeyModalDefaultConfig, MonkeyPopoverDir, MonkeyPopoverOptions, MonkeyScrollbarOrientation, MonkeyScrollbarSize, MonkeySize, MonkeyTableCellContext, MonkeyTableColumnState, MonkeyTableScrollConfig, MonkeyTableSortKind, MonkeyToastPosition, MonkeyToastType, RowMetrics, SelectionState, SortDirection, SortState, StatusOption, ToastConfig };
+export { MECX_COUNTRY_ISO_CODE, MECX_GOOGLE_API_KEY, MECX_I18N_WRAPPER, MECX_MODAL_DATA, MECX_MODAL_DEFAULT_CONFIG, MECX_POPOVER_OPTIONS, MonkeyAccordionComponent, MonkeyActionBarComponent, MonkeyAlertComponent, MonkeyAutocompleteAddressComponent, MonkeyAutocompleteComponent, MonkeyAvatarComponent, MonkeyBadgeComponent, MonkeyBadgeDirective, MonkeyBreadcrumbComponent, MonkeyButtonComponent, MonkeyCheckboxComponent, MonkeyComplexFilterBarComponent, MonkeyDateRangeComponent, MonkeyDictionaryService, MonkeyDisplayDirective, MonkeyDividerComponent, MonkeyDownloadButtonComponent, MonkeyEcxAddressService, MonkeyErrorDirective, MonkeyFilterBarComponent, MonkeyFilterBarService, MonkeyFilterBarV2Component, MonkeyFilterChipComponent, MonkeyFilterMenuComponent, MonkeyFilterMenuItemComponent, MonkeyFilterSegmentComponent, MonkeyFilterTriggerComponent, MonkeyFormDirective, MonkeyFormFieldComponent, MonkeyFormFieldControl, MonkeyFormFieldModule, MonkeyHelperDirective, MonkeyIconButtonComponent, MonkeyInfoDirective, MonkeyInputCodeComponent, MonkeyInputCurrencyDirective, MonkeyInputDateRangeComponent, MonkeyInputDirective, MonkeyInputModule, MonkeyInputPhoneComponent, MonkeyInputUploadComponent, MonkeyLabelDirective, MonkeyModalActionsDirective, MonkeyModalComponent, MonkeyModalConfig, MonkeyModalContentDirective, MonkeyModalModule, MonkeyModalRef, MonkeyModalService, MonkeyModalSubtitleDirective, MonkeyModalTitleDirective, MonkeyOptionComponent, MonkeyPaginationActionComponent, MonkeyPaginationLabelComponent, MonkeyPaginationSizeComponent, MonkeyPassNumberComponent, MonkeyPassSecretNumberComponent, MonkeyPopoverContentComponent, MonkeyPopoverDirective, MonkeyPrefixDirective, MonkeyRadioButtonComponent, MonkeyScrollbarComponent, MonkeySecurityLevelComponent, MonkeySelectComponent, MonkeyStatusComponent, MonkeyStepComponent, MonkeyStepperComponent, MonkeyStepperModule, MonkeyStepperService, MonkeySuffixDirective, MonkeyTabComponent, MonkeyTabLinkDirective, MonkeyTableCellDirective, MonkeyTableColumnDirective, MonkeyTableComponent, MonkeyTableEmptyDirective, MonkeyTableHeaderCellDirective, MonkeyTableLoadingDirective, MonkeyTableRowDetailDirective, MonkeyTabsComponent, MonkeyTabsModule, MonkeyToastComponent, MonkeyToastRef, MonkeyToastService, MonkeyToggleComponent, MonkeyToggleLineButtonComponent, MonkeyToggleLineComponent, MonkeyTooltipComponent, MonkeyTooltipDirective, MonkeyUserProfileButtonComponent, MonkeyUserProfileComponent, addKeys, ariaSortOf, getCurrencySymbol, indexAtOffset, injectTokenWithWarning, interpolate, mergeOrder, offsetOfIndex, removeKeys, sameColumnState, selectionState, sortByOrder, toPx, toggleKey, totalHeight };
+export type { ActiveFilter, AutocompleteSuggestion, AutocompleteSuggestionType, ColumnAlign, ColumnPinned, ComplexFilterCondition, ComplexFilterGroup, ComplexFilterOperator, ComplexFilterResult, FilterBarConfig, FilterBarState, FilterOption, FilterType, GoogleApiPlaces, GoogleApiPlacesAddressComponents, GoogleApiPlacesResponse, MonkeyAlertType, MonkeyAutocompleteData, MonkeyAutocompleteResponse, MonkeyBreadcrumb, MonkeyButtonColor, MonkeyButtonType, MonkeyDownloadButtonChangeEvent, MonkeyFilterBarV2Row, MonkeyFilterMenuItemProperty, MonkeyFilterTriggerVariant, MonkeyInputUploadChangeEvent, MonkeyModalConfirmationConfig, MonkeyModalDefaultConfig, MonkeyPopoverDir, MonkeyPopoverOptions, MonkeyScrollbarOrientation, MonkeyScrollbarSize, MonkeySize, MonkeyTableCellContext, MonkeyTableColumnState, MonkeyTableScrollConfig, MonkeyTableSortKind, MonkeyToastPosition, MonkeyToastType, RowMetrics, SelectionState, SortDirection, SortState, StatusOption, ToastConfig };