Skip to content

EodashTools ​

A compact toolbar row. It renders an "Select indicator" button that opens a full-screen dialog containing an EodashItemFilter, and an EodashLayoutSwitcher icon. Both elements are individually toggleable. itemFilterConfig is forwarded verbatim as props to the embedded EodashItemFilter, so all filter customization is handled there.

Example ​

Default toolbar with indicator selector and layout switcher:

js
{
  id: "tools",
  title: "Tools",
  type: "internal",
  layout: { x: 0, y: 0, w: 12, h: 1 },
  widget: {
    name: "EodashTools",
    properties: {
      indicatorBtnText: "Select indicator",
      showIndicatorsBtn: true,
      showLayoutSwitcher: true,
      layoutTarget: "lite",
    },
  },
}

Toolbar with a customised filter passed through itemFilterConfig:

js
widget: {
  name: "EodashTools",
  properties: {
    indicatorBtnText: "Add dataset",
    itemFilterConfig: {
      filtersTitle: "Datasets",
      filterProperties: [
        {
          keys: ["title", "description"],
          title: "Search",
          type: "text",
          expanded: true,
        },
      ],
    },
  },
}

Properties ​

indicatorBtnText? ​

ts
optional indicatorBtnText?: string = "Select indicator";

itemFilterConfig? ​

ts
optional itemFilterConfig?: Partial<{
  aggregateResults: string;
  cssVars: string | Record<string, any>;
  enableCompare: boolean;
  enableHighlighting: boolean;
  expandMultipleFilters: boolean;
  expandMultipleResults: boolean;
  filterProperties: object[];
  filtersTitle: string;
  imageProperty: string;
  resultsTitle: string;
  resultType: string;
  styleOverride: string;
  subTitleProperty: string;
  titleProperty: string;
}> & Omit<object & VNodeProps & AllowedComponentProps & ComponentCustomProps,
  | "enableCompare"
  | "titleProperty"
  | "filtersTitle"
  | "resultsTitle"
  | "subTitleProperty"
  | "imageProperty"
  | "aggregateResults"
  | "resultType"
  | "cssVars"
  | "enableHighlighting"
  | "expandMultipleFilters"
  | "expandMultipleResults"
  | "styleOverride"
  | "filterProperties"> = {};

layoutIcon? ​

ts
optional layoutIcon?: string = mdiViewDashboard;

layoutTarget? ​

ts
optional layoutTarget?: string = "lite";

showIndicatorsBtn? ​

ts
optional showIndicatorsBtn?: boolean = true;

showLayoutSwitcher? ​

ts
optional showLayoutSwitcher?: boolean = true;

See also ​