@fluid-topics/ft-filter 2.0.30 → 2.0.32

package/build/ft-filter-level.d.ts

@@ -3,7 +3,20 @@ import { Debouncer, ElementDefinitionsMap, FtLitElement } from "@fluid-topics/ft
 import { FtRadio } from "@fluid-topics/ft-radio";
 import { FtFilterOptionProperties } from "./ft-filter-option.properties";
 import { I18nAttributeValue } from "@fluid-topics/ft-i18n/build/decorators/i18nAttribute";
-declare const FtFilterLevel_base: typeof FtLitElement & import("@fluid-topics/ft-wc-utils").Constructor<import("@fluid-topics/ft-wc-utils").FtLitElementWithAriaNotificationInterface> & import("@fluid-topics/ft-wc-utils").Constructor<import("@fluid-topics/ft-i18n").FtLitElementWithI18nInterface>;
+export declare const analyticsActions: {
+    "more-filters-button-pressed": {
+        label: string;
+        defaultEventName: string;
+        defaultComponentId: string;
+    };
+};
+declare const FtFilterLevel_base: import("@fluid-topics/ft-wc-utils").withAnalyticsType<typeof FtLitElement & import("@fluid-topics/ft-wc-utils").Constructor<import("@fluid-topics/ft-wc-utils").FtLitElementWithAriaNotificationInterface> & import("@fluid-topics/ft-wc-utils").Constructor<import("@fluid-topics/ft-i18n").FtLitElementWithI18nInterface>, {
+    "more-filters-button-pressed": {
+        label: string;
+        defaultEventName: string;
+        defaultComponentId: string;
+    };
+}>;
 export declare class FtFilterLevel extends FtFilterLevel_base {
     static elementDefinitions: ElementDefinitionsMap;
     static styles: import("lit").CSSResult;

package/build/ft-filter-level.js

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { html, nothing, } from "lit";
 import { property, query, state, } from "lit/decorators.js";
 import { repeat } from "lit/directives/repeat.js";
-import { Debouncer, flatDeep, FtLitElement, hasChanged, numberProperty, withAriaNotification, } from "@fluid-topics/ft-wc-utils";
+import { Debouncer, flatDeep, FtLitElement, hasChanged, numberProperty, withAriaNotification, withAnalytics, } from "@fluid-topics/ft-wc-utils";
 import { FtButton } from "@fluid-topics/ft-button";
 import { FtTypography, FtTypographyVariants, } from "@fluid-topics/ft-typography";
 import { FtRipple } from "@fluid-topics/ft-ripple";
@@ -16,7 +16,14 @@ import { FtCheckbox } from "@fluid-topics/ft-checkbox";
 import { FtRadio, } from "@fluid-topics/ft-radio";
 import { levelStyles } from "./ft-filter-level.styles";
 import { withI18n } from "@fluid-topics/ft-i18n";
-export class FtFilterLevel extends withI18n(withAriaNotification(FtLitElement)) {
+export const analyticsActions = {
+    "more-filters-button-pressed": {
+        label: "Revealing more filters",
+        defaultEventName: "filters-click_see_more",
+        defaultComponentId: "ft-filter-level"
+    },
+};
+export class FtFilterLevel extends withAnalytics(withI18n(withAriaNotification(FtLitElement)), analyticsActions) {
     constructor() {
         super(...arguments);
         this.filterId = "";
@@ -126,7 +133,10 @@ export class FtFilterLevel extends withI18n(withAriaNotification(FtLitElement))
                             icon="thin_arrow"
                             dense trailingIcon
                             part="controls display-more"
-                            @click=${this.displayMore}>
+                            @click=${() => {
+            this.emitAnalyticsAction("more-filters-button-pressed", {});
+            this.displayMore();
+        }}>
                             ${this.moreValuesButtonLabel}
                         </ft-button>
                     ` : nothing}

package/build/ft-filter.d.ts

@@ -6,7 +6,14 @@ import { I18nAttributeValue } from "@fluid-topics/ft-i18n/build/decorators/i18nA
 export declare class FtFilterChangeEvent extends CustomEvent<Array<any>> {
     constructor(selectedValues: any[]);
 }
-export declare class FtFilter extends FtLitElement implements FtFilterProperties {
+declare const FtFilter_base: import("@fluid-topics/ft-wc-utils").withAnalyticsType<typeof FtLitElement, {
+    "more-filters-button-pressed": {
+        label: string;
+        defaultEventName: string;
+        defaultComponentId: string;
+    };
+}>;
+export declare class FtFilter extends FtFilter_base implements FtFilterProperties {
     static elementDefinitions: ElementDefinitionsMap;
     static styles: import("lit").CSSResult[];
     id: string;
@@ -58,3 +65,4 @@ export declare class FtFilter extends FtLitElement implements FtFilterProperties
     private onFilterChange;
     private updateScroll;
 }
+export {};

package/build/ft-filter.js

@@ -6,9 +6,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html } from "lit";
 import { property, query, queryAll, state } from "lit/decorators.js";
-import { Debouncer, deepEqual, flatDeep, FtLitElement, jsonProperty, numberProperty, waitUntil } from "@fluid-topics/ft-wc-utils";
+import { Debouncer, deepEqual, flatDeep, withAnalytics, FtLitElement, jsonProperty, numberProperty, waitUntil } from "@fluid-topics/ft-wc-utils";
 import { FtTypography, FtTypographyVariants } from "@fluid-topics/ft-typography";
-import { FtFilterLevel } from "./ft-filter-level";
+import { FtFilterLevel, analyticsActions } from "./ft-filter-level";
 import { FtButton } from "@fluid-topics/ft-button";
 import { FtSnapScroll } from "@fluid-topics/ft-snap-scroll";
 import { styles } from "./ft-filter.styles";
@@ -17,7 +17,7 @@ export class FtFilterChangeEvent extends CustomEvent {
         super("change", { detail: selectedValues });
     }
 }
-export class FtFilter extends FtLitElement {
+export class FtFilter extends withAnalytics(FtLitElement, analyticsActions) {
     constructor() {
         super(...arguments);
         this.id = "";
@@ -188,6 +188,7 @@ export class FtFilter extends FtLitElement {
                 class="${className}"
                 filterId="${this.id}"
                 .filter=${this.filter}
+                .configuredAnalyticsActions="${this.configuredAnalyticsActions}"
                 moreValuesButtonLabel="${this.moreValuesButtonLabel}"
                 ?multivalued=${this.multivalued}
                 ?disabled=${this.disabled || className !== "ft-filter--level-center"}