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"
  | "filtersTitle"
  | "resultsTitle"
  | "imageProperty"
  | "titleProperty"
  | "aggregateResults"
  | "subTitleProperty"
  | "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