@vizzly/dashboard 0.12.13 → 0.12.14

package/dist/services/src/schemaValidations/dashboard.d.ts

@@ -1,4 +1,6 @@
 import { QueryEngineConfig } from '../../../shared-logic/src/QueryEngineConfig/types';
 import { CreateDashboardParams, UpdateDashboardParams } from '..';
+import { JoiOptions } from '../../../shared-logic/src/validations';
+export declare const validateDashboardJoiOptions: JoiOptions;
 export declare const validateCreateDashboardParams: (params: CreateDashboardParams, queryEngineConfig: QueryEngineConfig | undefined) => void;
 export declare const validateUpdateDashboardParams: (params: UpdateDashboardParams, queryEngineConfig: QueryEngineConfig) => void;

package/dist/shared-logic/src/AdditionalFilter/AdditionalFilter.d.ts

@@ -1,18 +1,21 @@
 import { DataType } from '../Field/types';
-import { AdditionalFilter, TimeRangeOptions, FilterConfig, OptionalFilters, DateFilter, DateAndTimeFilter, LegacyNumericFilterValue, Field } from './types';
+import { AdditionalFilter, OptionalFilters, DateFilter, DateAndTimeFilter, LegacyNumericFilterValue, Field } from './types';
 import { DataSet } from '../DataSet/types';
 import * as Filter from '../Filter';
 import { DateTimeFilterOptions } from '../DateTime/types';
 import { TextOverride } from '../Translations/types';
 import { QueryAttributes } from '../QueryAttributes/types';
+import { QueryEngineConfig } from '../QueryEngineConfig/types';
 export declare const typeToString: (type: AdditionalFilter['type'], textOverride: TextOverride) => string;
 export declare const NULL_VALUE_OPT = "__vizzly_null_value_option";
 export declare const allowedDataTypesForFilter: (type: AdditionalFilter['type']) => Array<DataType>;
+export declare function upcastDateTimeFilter(dumped: AdditionalFilter): import("./types").NumericFilter | import("./types").SingleSelectFilter | DateFilter | import("./types").DateTimeFilter | import("./types").MultiSelectFilter | import("./types").AdvancedFilter;
+export declare function removeBrokenFiltersThenLoad(filters: AdditionalFilter[], componentInterfaceConfig: {
+    queryEngineConfig: QueryEngineConfig;
+} | undefined): AdditionalFilter[];
 export declare const dump: (hydrated: AdditionalFilter) => AdditionalFilter;
 export declare const load: (dumped: AdditionalFilter, componentInterfaceConfig?: import("../ComponentInterface/types").ComponentInterfaceConfig | undefined) => AdditionalFilter;
-export declare const toQueryAttributesFilter: (dataSet: DataSet, filter: AdditionalFilter, customTimeRangeFuncs: TimeRangeOptions) => QueryAttributes.Filter[];
 export declare const toRelativeQueryAttributesFilters: (filters: DateAndTimeFilter | DateFilter, startDate?: Date | undefined) => QueryAttributes.Filter[];
-export declare const fromFilterConfig: (filterConfig: FilterConfig, dataSet: DataSet, timeRangeOptions: TimeRangeOptions) => QueryAttributes.Filter[];
 export declare const hasActiveFilter: (additionalFilters: AdditionalFilter[]) => boolean;
 export declare const getTitle: (additionalFilter: AdditionalFilter, dataSets: DataSet[], textOverride?: TextOverride | undefined) => string;
 export declare const requiredFiltersAreSet: (filter: AdditionalFilter | AdditionalFilter[]) => boolean;
@@ -40,5 +43,5 @@ export declare enum DateOp {
 export declare function inclusiveExclusiveCurrent(op: DateOp, filter: DateFilter | DateAndTimeFilter): string;
 export declare function getCascadeOptionsFilters(globalFilters: AdditionalFilter[], dataSets: DataSet[], dateFilterOptions: DateTimeFilterOptions, cascadeFilterSelection?: boolean): OptionalFilters | undefined;
 export declare const updateFilterForOptionalPulledFromOptions: (filter: AdditionalFilter) => AdditionalFilter;
-export declare const buildAdvancedFilters: (filterValue: QueryAttributes.Filter[][], field: Field, dataSetId: string) => never[] | QueryAttributes.Filter;
+export declare const buildAdvancedFilters: (filterValue: QueryAttributes.Filter[][], field: Field, dataSetId: string) => QueryAttributes.Filter[];
 export declare function getFilterDataType(filter: AdditionalFilter, dataSets: DataSet[]): "string" | "number" | "boolean" | "date_time" | "string[]" | undefined;

package/dist/shared-logic/src/AdditionalFilter/FilterConfig.d.ts

@@ -0,0 +1,4 @@
+import { FilterConfig, TimeRangeOptions } from './types';
+import { QueryAttributes } from '../QueryAttributes/types';
+import { DataSet } from '../DataSet/types';
+export declare const fromFilterConfig: (filterConfig: FilterConfig, dataSet: DataSet, timeRangeOptions: TimeRangeOptions) => QueryAttributes.Filter[];

package/dist/shared-logic/src/AdditionalFilter/constants.d.ts

@@ -3,6 +3,9 @@ export declare const DATE_FILTER = "dateFilter";
  * @deprecated The "dateTimeFilter" has been deprecated. Use "dateFilter".
  */
 export declare const DATE_TIME_FILTER = "dateTimeFilter";
+/**
+ * @deprecated The "dateAndTimeFilter" has been deprecated. Use "dateFilter" and set the option "allowTimeSelection" to true.
+ */
 export declare const DATE_AND_TIME_FILTER = "dateAndTimeFilter";
 export declare const SINGLE_SELECT_FILTER = "singleSelectFilter";
 /**

package/dist/shared-logic/src/AdditionalFilter/filterHelpers.d.ts

@@ -0,0 +1 @@
+export declare const getUTCDate: (date: Date | null) => any;

package/dist/shared-logic/src/AdditionalFilter/schema.d.ts

@@ -1,4 +1,6 @@
 import Joi from '@vizzly/joi';
 import { QueryEngineConfig } from '../QueryEngineConfig/types';
+export declare const advancedFilterSchema: (queryEngineConfig: QueryEngineConfig, shouldAlwaysHaveValue?: boolean | undefined) => Joi.Schema;
+export declare const advancedFilterValueSchema: (queryEngineConfig: QueryEngineConfig, shouldAlwaysHaveValue?: boolean | undefined) => Joi.Schema;
 export declare const additionalFilterSchema: (queryEngineConfig: QueryEngineConfig, shouldAlwaysHaveValue?: boolean | undefined) => Joi.Schema;
 export declare function globalFilterSchema(queryEngineConfig: QueryEngineConfig | undefined): Joi.SchemaLike<any> | Joi.SchemaLike<any>[] | undefined;

package/dist/shared-logic/src/AdditionalFilter/toQueryAttributesFilter.d.ts

@@ -0,0 +1,5 @@
+import { DataSet } from '../DataSet/types';
+import { QueryAttributes } from '../QueryAttributes/types';
+import { AdditionalFilter, TimeRangeOptions } from './types';
+import * as Filter from '../Filter';
+export declare const toQueryAttributesFilter: (dataSet: DataSet, filter: AdditionalFilter, customTimeRangeFuncs: TimeRangeOptions) => QueryAttributes.Filter[];

package/dist/shared-logic/src/AdditionalFilter/types.d.ts

@@ -17,6 +17,7 @@ declare type BaseAdditionalFilter<T extends AdditionalFilterType> = {
     /**
      * NOTE:
      * - The "dateTimeFilter" type value has been deprecated. Use "dateFilter".
+     * - The "dateAndTimeFilter" type value has been deprecated. Use "dateFilter".
      * - The "multiSelectFilter" type value has been deprecated. Use "advancedFilter".
      * - The "numericFilter" type value has been deprecated. Use "advancedFilter".
      */
@@ -57,7 +58,11 @@ declare type RelativeValue = {
 export declare type DateFilter = BaseAdditionalFilter<typeof FilterType.DATE_FILTER> & {
     value: FixedRangeValue | RelativeValue | RelativeRangeValue | null;
     inclusiveDate?: boolean;
+    allowTimeSelection?: boolean;
 };
+/**
+ * @deprecated The "dateAndTimeFilter" has been deprecated. Use "dateFilter" and set the option "allowTimeSelection" to true.
+ */
 export declare type DateAndTimeFilter = BaseAdditionalFilter<typeof FilterType.DATE_AND_TIME_FILTER> & {
     value: FixedRangeValue | RelativeValue | RelativeRangeValue | null;
     inclusiveDate?: boolean;

package/dist/shared-logic/src/Component/types.d.ts

@@ -159,6 +159,7 @@ export declare namespace Component {
         labels?: boolean;
         labelFormat: FormatType;
         parameters?: Parameters;
+        drilldownOptions: Array<DrilldownOptions> | undefined;
     };
     export type AreaChartAttributes = BaseAttributes & BaseQueryAttributes & {
         type: 'areaChart';
@@ -322,7 +323,7 @@ export declare namespace Component {
         };
     }
     export interface ChartOnViewClick extends BaseOnViewClick {
-        type: 'barChart' | 'horizontalBarChart';
+        type: 'barChart' | 'horizontalBarChart' | 'pieChart';
         clicked: {
             grouping?: Array<ReturnedField>;
             value?: ReturnedField;

package/dist/shared-logic/src/Dashboard/Dashboard.d.ts

@@ -1,7 +1,7 @@
 import { Component as ComponentType } from '../Component/types';
 import { DataSet } from '../DataSet/types';
 import { CustomField } from '../CustomField/types';
-import { Dashboard, SaveableDashboardDefinition } from './types';
+import { Dashboard, SaveableDashboardDefinition, ImportableDashboard } from './types';
 export * from './saveableDashboardDefinitionSchema';
 export * from './fromRaw';
 export declare const indexOfDataSet: (dashboard: Dashboard, dataSetId: string) => number;
@@ -9,6 +9,11 @@ export declare const getDataSet: (dashboard: Dashboard, dataSetId: string) => Da
 export declare const hasDataSet: (dashboard: Dashboard, dataSetId: string) => boolean;
 export declare const getComponentsUsingDataSet: (dashboard: Dashboard, dataSetId: string) => ComponentType[];
 export declare const toSaveableDefinition: (dashboard: Dashboard) => SaveableDashboardDefinition;
+export declare const prepareDashboardForImport: (dashboardToImport: Dashboard | ImportableDashboard) => ImportableDashboard;
+export declare const mergeDashboardInStateAndDashboardToImport: ({ dashboardToImport, dashboardInState, }: {
+    dashboardToImport: ImportableDashboard;
+    dashboardInState: Dashboard;
+}) => Dashboard;
 export declare const setDataSets: (dashboardWithoutDataSets: Omit<Dashboard, 'dataSets'>, dataSets: DataSet[], customFields: {
     [dataSetId: string]: CustomField[];
 }) => Dashboard;

package/dist/shared-logic/src/Dashboard/types.d.ts

@@ -45,3 +45,4 @@ export declare type SaveableDashboardDefinition = {
     project_id?: string;
     id?: string;
 };
+export declare type ImportableDashboard = Omit<Dashboard, 'id' | 'parentDashboardId' | 'webhookId' | 'createdAt' | 'updatedAt' | 'isProgrammatic' | 'theme' | 'data' | 'permission' | 'protectedByOrganisation' | 'isPlayground'>;

package/dist/shared-logic/src/DateTimeField/DateTimeField.d.ts

@@ -0,0 +1,2 @@
+import { QueryAttributes } from '../QueryAttributes/types';
+export declare const filterIsDate: (filter: QueryAttributes.Filter) => boolean;

package/dist/shared-logic/src/Downloads/downloadToJSON.d.ts

@@ -0,0 +1,4 @@
+export declare const downloadToJSON: ({ data, fileName }: {
+    data: Object;
+    fileName: string;
+}) => "Success" | "Sorry, the data supplied to downloadToJSON was not a valid object";

package/dist/shared-logic/src/Downloads/index.d.ts

@@ -0,0 +1 @@
+export * from './downloadToJSON';

package/dist/shared-logic/src/Drilldown/schema.d.ts

@@ -0,0 +1,3 @@
+import Joi from '@vizzly/joi';
+import { QueryEngineConfig } from '../QueryEngineConfig/types';
+export declare function drilldownSchema(queryEngineConfig: QueryEngineConfig): Joi.SchemaLike<any> | Joi.SchemaLike<any>[] | undefined;

package/dist/shared-logic/src/PDFGenerator/index.d.ts

@@ -1,7 +1,7 @@
 import { Options, TargetElementFinder } from './types';
 import jsPDF from 'jspdf';
 export type { Options };
-export declare const generatePDF: (targetRefOrFunction: TargetElementFinder, customOptions?: (Pick<Partial<import("./types").ConversionOptions>, "filename" | "method" | "resolution"> & {
+export declare const generatePDF: (targetRefOrFunction: TargetElementFinder, customOptions?: (Pick<Partial<import("./types").ConversionOptions>, "method" | "filename" | "resolution"> & {
     page?: Partial<import("./types").PageConversionOptions> | undefined;
     canvas?: Partial<Pick<import("html2canvas").Options, "useCORS" | "logging"> & {
         mimeType: "image/jpeg" | "image/png";

package/dist/shared-logic/src/PieChart/onViewClick.d.ts

@@ -0,0 +1,10 @@
+import { Component } from '../Component/types';
+declare type ClickDatumValues = {
+    datum: {
+        [key: string]: number | string;
+    };
+    index: number;
+    key: string;
+};
+export declare function buildPieOnViewClick(onViewClick: ((data: Component.OnViewClick) => void) | undefined, clickedValue: ClickDatumValues, viewId: string): void;
+export {};

package/dist/shared-logic/src/QueryEngine/types.d.ts

@@ -35,7 +35,7 @@ export declare type QueryEngineDescription = {
         connections: Array<{
             id: string;
             name: string;
-            pingResult: boolean;
+            pingResult: boolean | null;
             client: Client;
         }>;
         dataSets: Array<{

package/dist/shared-logic/src/Theme/types.d.ts

@@ -47,6 +47,7 @@ export declare namespace VizzlyTheming {
         tabs?: Tabs;
         titles?: FontStyle;
         tooltips?: Tooltip;
+        chips?: Chips;
     }
     interface Buttons {
         primary?: ButtonType;
@@ -60,6 +61,10 @@ export declare namespace VizzlyTheming {
     interface ButtonType extends ButtonState {
         padding?: CSSProperties['padding'];
         fontWeight?: CSSProperties['fontWeight'];
+        fontFamily?: CSSProperties['fontFamily'];
+        '-webkitFontSmoothing'?: CSSProperties['WebkitFontSmoothing'];
+        '-mozOsxFontSmoothing'?: CSSProperties['MozOsxFontSmoothing'];
+        textShadow?: CSSProperties['textShadow'];
         boxShadow?: CSSProperties['boxShadow'];
         borderRadius?: CSSProperties['borderRadius'];
         fontSize?: CSSProperties['fontSize'];
@@ -588,5 +593,12 @@ export declare namespace VizzlyTheming {
         lineHeight?: CSSProperties['lineHeight'];
         padding?: CSSProperties['padding'];
     };
+    type Chips = {
+        background?: CSSProperties['background'];
+        borderRadius?: CSSProperties['borderRadius'];
+        color?: CSSProperties['color'];
+        fontSize?: CSSProperties['fontSize'];
+        fontWeight?: CSSProperties['fontWeight'];
+    };
 }
 export declare type ThemeVersion = 1 | 2;

package/dist/shared-ui/src/base/DateTime/DateTimeFilter.d.ts

@@ -20,4 +20,5 @@ export declare const DateTimeFilter: FunctionComponent<{
     queryEngineConfig?: QueryEngineConfig;
     data?: DataSet[];
     fixedWidth?: number;
+    allowTimeSelection: boolean;
 }>;

package/dist/shared-ui/src/base/DateTime/TimePickerCore.d.ts

@@ -3,7 +3,7 @@ import moment from 'moment';
 export declare const TIME_FORMATS: {
     readonly HHmm: "HH:mm";
 };
-export declare type TimeRangeFormat = typeof TIME_FORMATS[keyof typeof TIME_FORMATS];
+export declare type TimeRangeFormat = (typeof TIME_FORMATS)[keyof typeof TIME_FORMATS];
 export declare const TimePickerCore: FunctionComponent<{
     className?: string;
     onChange: (value: moment.Moment) => void;

package/dist/shared-ui/src/base/FileUpload/FileUpload.d.ts

@@ -0,0 +1,20 @@
+import React, { FunctionComponent } from 'react';
+export declare const defaultFilesState: {
+    fileList: null;
+    value: string;
+};
+export declare const FileUpload: FunctionComponent<{
+    label?: string;
+    onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    setFiles: React.Dispatch<React.SetStateAction<{
+        fileList: FileList | null;
+        value: string | number | readonly string[] | undefined;
+    }>>;
+    setError: React.Dispatch<React.SetStateAction<string | null>>;
+    files: FileList | null;
+    accept?: string;
+    allowMultipleFiles?: false;
+    value: string | number | readonly string[] | undefined;
+    uploadButtonTitle?: string;
+    uploadButtonDescription?: string;
+}>;

package/dist/shared-ui/src/base/FileUpload/index.d.ts

@@ -0,0 +1 @@
+export * from './FileUpload';

package/dist/shared-ui/src/base/Icons/SVGs.d.ts

@@ -1,11 +1,11 @@
-import { CSSProperties, SVGProps } from 'react';
+import React, { CSSProperties, SVGProps } from 'react';
 declare type renderSvg<P> = (props: SVGProps<SVGElement> & P) => JSX.Element;
 export declare const Filter: renderSvg<{
     active: boolean;
     size?: 'sm' | 'md' | 'lg';
     fill?: CSSProperties['fill'];
 }>;
-export declare const Close: renderSvg<{}>;
+export declare const Close: ({ fill, width, height, ...props }: React.SVGAttributes<SVGElement>) => JSX.Element;
 export declare const Undo: renderSvg<{}>;
 export declare const Completed: renderSvg<{}>;
 export declare const InProgress: renderSvg<{}>;
@@ -29,10 +29,12 @@ export declare const Accordion: renderSvg<{
     isOpen: boolean;
 }>;
 export declare const Report: renderSvg<{}>;
-export declare const Vizzly: (props?: {
+export declare const Vizzly: ({ fill, gradient, ...props }: {
     width?: number | undefined;
     height?: number | undefined;
-} | undefined) => JSX.Element;
+    fill?: string | undefined;
+    gradient?: boolean | undefined;
+}) => JSX.Element;
 export declare const VizzlyLogoWithName: () => JSX.Element;
 export declare const Parameters: renderSvg<{
     active: boolean;
@@ -96,4 +98,11 @@ export declare const Fullscreen: renderSvg<{
     width?: number;
     height?: number;
 }>;
+export declare const ExternalLink: renderSvg<{
+    width?: number;
+    height?: number;
+    fill?: string;
+}>;
+export declare const Upload: ({ fill, ...props }: React.SVGAttributes<SVGElement>) => JSX.Element;
+export declare const File: ({ fill, ...props }: React.SVGAttributes<SVGElement>) => JSX.Element;
 export {};

package/dist/shared-ui/src/base/ListView/index.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 export declare const List: import("react").FunctionComponent<{
     children: import("react").ReactNode;
-    as?: "symbol" | "object" | "clipPath" | "filter" | "mask" | "marker" | "button" | "meter" | "textarea" | "style" | "progress" | "text" | "ruby" | "table" | "small" | "sub" | "circle" | "embed" | "pre" | "caption" | "menu" | "menuitem" | "legend" | "desc" | "title" | "select" | "input" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "canvas" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "ins" | "kbd" | "keygen" | "label" | "li" | "link" | "main" | "map" | "mark" | "meta" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "q" | "rp" | "rt" | "s" | "samp" | "slot" | "script" | "section" | "source" | "span" | "strong" | "summary" | "sup" | "template" | "tbody" | "td" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "defs" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | undefined;
+    as?: "symbol" | "object" | "clipPath" | "filter" | "mask" | "marker" | "button" | "meter" | "textarea" | "style" | "progress" | "text" | "ruby" | "table" | "small" | "sub" | "circle" | "embed" | "pre" | "caption" | "menu" | "menuitem" | "legend" | "desc" | "title" | "big" | "link" | "sup" | "select" | "input" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "ins" | "kbd" | "keygen" | "label" | "li" | "main" | "map" | "mark" | "meta" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "q" | "rp" | "rt" | "s" | "samp" | "slot" | "script" | "section" | "source" | "span" | "strong" | "summary" | "template" | "tbody" | "td" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "defs" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | undefined;
     paddingRight?: string | number | (string & {}) | undefined;
 }> & {
     Cell: import("react").ForwardRefExoticComponent<{
@@ -25,7 +25,7 @@ export declare const List: import("react").FunctionComponent<{
     Item: any;
     Heading: import("react").FunctionComponent<{
         children: import("react").ReactNode;
-        as?: "symbol" | "object" | "clipPath" | "filter" | "mask" | "marker" | "button" | "meter" | "textarea" | "style" | "progress" | "text" | "ruby" | "table" | "small" | "sub" | "circle" | "embed" | "pre" | "caption" | "menu" | "menuitem" | "legend" | "desc" | "title" | "select" | "input" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "canvas" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "ins" | "kbd" | "keygen" | "label" | "li" | "link" | "main" | "map" | "mark" | "meta" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "q" | "rp" | "rt" | "s" | "samp" | "slot" | "script" | "section" | "source" | "span" | "strong" | "summary" | "sup" | "template" | "tbody" | "td" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "defs" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | undefined;
+        as?: "symbol" | "object" | "clipPath" | "filter" | "mask" | "marker" | "button" | "meter" | "textarea" | "style" | "progress" | "text" | "ruby" | "table" | "small" | "sub" | "circle" | "embed" | "pre" | "caption" | "menu" | "menuitem" | "legend" | "desc" | "title" | "big" | "link" | "sup" | "select" | "input" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "ins" | "kbd" | "keygen" | "label" | "li" | "main" | "map" | "mark" | "meta" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "q" | "rp" | "rt" | "s" | "samp" | "slot" | "script" | "section" | "source" | "span" | "strong" | "summary" | "template" | "tbody" | "td" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "defs" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | undefined;
         themeClassName?: import("../..").VizzlyTheming.FontStyle | undefined;
         className?: string | undefined;
         id?: string | undefined;

package/dist/shared-ui/src/base/Modal/Modal.types.d.ts

@@ -8,6 +8,7 @@ export declare type ModalProps = {
     width: 'sm' | 'xl' | '2xl' | '4xl' | '7xl' | null;
     'data-testid'?: string;
     namespace?: CustomThemeClassNamespaces;
+    disableDnD?: boolean;
     transparentBackground?: boolean;
     hideCloseIcon?: boolean;
     options?: {

package/dist/shared-ui/src/base/Modal.d.ts

@@ -23,12 +23,13 @@ export declare const ModalContent: (props: {
     'data-component'?: string;
 }) => JSX.Element;
 export declare const BaseModal: (props: ModalProps) => JSX.Element;
-export declare const ModalBody: React.FunctionComponent<{
+declare type ModalBodyProps = {
     children?: React.ReactNode;
     vizzlyPrefix: string;
     'data-component'?: string;
     disableDnD?: boolean;
-}>;
+};
+export declare const ModalBody: React.FunctionComponent<ModalBodyProps>;
 export declare const ModalOverlay: React.FunctionComponent<{
     dark?: boolean;
     position?: 'fixed' | 'absolute';
@@ -60,3 +61,4 @@ export declare const Modal: ((props: ModalProps) => JSX.Element) & {
         'data-component'?: string;
     }) => JSX.Element;
 };
+export {};

package/dist/shared-ui/src/base/Panel/Panel.d.ts

@@ -4,7 +4,7 @@ export declare const Panel: React.ForwardRefExoticComponent<{
     testId?: string | undefined;
     vizzlyPrefix?: string | undefined;
     transform?: boolean | undefined;
-    role?: (string & {}) | "grid" | "none" | "button" | "checkbox" | "listbox" | "radio" | "region" | "cell" | "table" | "row" | "menu" | "listitem" | "menubar" | "menuitem" | "progressbar" | "separator" | "tab" | "tabpanel" | "toolbar" | "tooltip" | "treeitem" | "scrollbar" | "heading" | "article" | "dialog" | "figure" | "form" | "img" | "link" | "main" | "option" | "switch" | "alert" | "alertdialog" | "application" | "banner" | "columnheader" | "combobox" | "complementary" | "contentinfo" | "definition" | "directory" | "document" | "feed" | "gridcell" | "group" | "list" | "log" | "marquee" | "math" | "menuitemcheckbox" | "menuitemradio" | "navigation" | "note" | "presentation" | "radiogroup" | "rowgroup" | "rowheader" | "search" | "searchbox" | "slider" | "spinbutton" | "status" | "tablist" | "term" | "textbox" | "timer" | "tree" | "treegrid" | undefined;
+    role?: (string & {}) | "grid" | "none" | "button" | "checkbox" | "listbox" | "radio" | "region" | "cell" | "table" | "row" | "menu" | "listitem" | "menubar" | "menuitem" | "progressbar" | "separator" | "tab" | "tabpanel" | "toolbar" | "tooltip" | "treeitem" | "scrollbar" | "heading" | "search" | "link" | "article" | "dialog" | "figure" | "form" | "img" | "main" | "option" | "switch" | "alert" | "alertdialog" | "application" | "banner" | "columnheader" | "combobox" | "complementary" | "contentinfo" | "definition" | "directory" | "document" | "feed" | "gridcell" | "group" | "list" | "log" | "marquee" | "math" | "menuitemcheckbox" | "menuitemradio" | "navigation" | "note" | "presentation" | "radiogroup" | "rowgroup" | "rowheader" | "searchbox" | "slider" | "spinbutton" | "status" | "tablist" | "term" | "textbox" | "timer" | "tree" | "treegrid" | undefined;
     onHover?: ((active: boolean) => void) | undefined;
     width?: CSSProperties['width'];
     padding?: CSSProperties['padding'];

package/dist/shared-ui/src/base/Section/Section.d.ts

@@ -14,7 +14,7 @@ export declare const Section: React.FunctionComponent<RawSectionProps> & {
     Panel: React.FunctionComponent<{
         title?: string | ReactNode;
         children: ReactNode;
-        as?: "symbol" | "object" | "clipPath" | "filter" | "mask" | "marker" | "button" | "meter" | "textarea" | "style" | "progress" | "text" | "ruby" | "table" | "small" | "sub" | "circle" | "embed" | "pre" | "caption" | "menu" | "menuitem" | "legend" | "desc" | "title" | "select" | "input" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "canvas" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "ins" | "kbd" | "keygen" | "label" | "li" | "link" | "main" | "map" | "mark" | "meta" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "q" | "rp" | "rt" | "s" | "samp" | "slot" | "script" | "section" | "source" | "span" | "strong" | "summary" | "sup" | "template" | "tbody" | "td" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "defs" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | undefined;
+        as?: "symbol" | "object" | "clipPath" | "filter" | "mask" | "marker" | "button" | "meter" | "textarea" | "style" | "progress" | "text" | "ruby" | "table" | "small" | "sub" | "circle" | "embed" | "pre" | "caption" | "menu" | "menuitem" | "legend" | "desc" | "title" | "big" | "link" | "sup" | "select" | "input" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "ins" | "kbd" | "keygen" | "label" | "li" | "main" | "map" | "mark" | "meta" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "q" | "rp" | "rt" | "s" | "samp" | "slot" | "script" | "section" | "source" | "span" | "strong" | "summary" | "template" | "tbody" | "td" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "defs" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | undefined;
     }>;
     Container: React.FunctionComponent<{
         children: ReactNode;

package/dist/shared-ui/src/base/Toolbar/Toolbar.d.ts

@@ -9,35 +9,3 @@ export declare const Toolbar: FunctionComponent<{
     'data-component': string;
     padding?: CSSProperties['padding'];
 }>;
-export declare const divider: {
-    (variantOptions: Object): string;
-    toString: any;
-};
-export declare const toolbarButtonStyle: {
-    background: string;
-    color: string;
-    border: string;
-    padding: string;
-    borderRadius: number;
-    fontFamily: string;
-    '&:hover': {
-        background: string;
-        border: string;
-        color: string;
-    };
-    '&:focus': {
-        background: string;
-        border: string;
-        color: string;
-    };
-    '&:disabled': {
-        background: string;
-        opacity: number;
-    };
-    '&:hover:disabled': {
-        background: string;
-        opacity: number;
-    };
-    fontSize: number;
-    fontWeight: number;
-};

package/dist/shared-ui/src/components/AdditionalFilter/AdvancedPicker/AdvancedDisplayValues.d.ts

@@ -1,6 +1,8 @@
 import { FunctionComponent } from 'react';
 import { TextOverride } from '../../../../../shared-logic/src/Translations/types';
 import { DisplayChipsType } from './displayChips.funcs';
+import { MultiSelectFilter, NumericFilter } from '../../../../../shared-logic/src/AdditionalFilter/types';
+import { DataType } from '../../../../../shared-logic/src/Field/types';
 export declare const AdvancedDisplayValues: FunctionComponent<{
     prefix?: boolean;
     label?: string;
@@ -12,4 +14,6 @@ export declare const AdvancedDisplayValues: FunctionComponent<{
     clearDisabled?: boolean;
     onClick: (open: boolean) => void;
     id: string;
+    filter: MultiSelectFilter | NumericFilter;
+    type: Omit<DataType, 'date_time'>;
 }>;

package/dist/shared-ui/src/components/AdditionalFilter/AdvancedPicker/AdvancedSelectFilter.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { MultiSelectFilter as MultiSelectFilterType, NumericFilter } from '../../../../../shared-logic/src/AdditionalFilter/types';
+export declare const AdvancedSelectFilter: (props: import("react").PropsWithChildren<{
+    filterIndex: number;
+    filter: NumericFilter | MultiSelectFilterType;
+    dataSets: import("../../../../../dashboard/src").DataSet<import("../../../../../dashboard/src").DataSet.Field>[];
+    onChange: (filter: NumericFilter | MultiSelectFilterType) => void;
+    showClearBtn?: boolean | undefined;
+    type: Pick<import("../../../../../shared-logic/src/Field/types").DataType, number | "replace" | "fixed" | "repeat" | "slice" | "small" | "sub" | "bold" | "blink" | "toString" | "charAt" | "charCodeAt" | "concat" | "indexOf" | "lastIndexOf" | "localeCompare" | "match" | "search" | "split" | "substring" | "toLowerCase" | "toLocaleLowerCase" | "toUpperCase" | "toLocaleUpperCase" | "trim" | "length" | "substr" | "valueOf" | "codePointAt" | "includes" | "endsWith" | "normalize" | "startsWith" | "anchor" | "big" | "fontcolor" | "fontsize" | "italics" | "link" | "strike" | "sup" | "padStart" | "padEnd" | "trimEnd" | "trimStart" | "trimLeft" | "trimRight" | "matchAll" | "replaceAll" | "at">;
+}>) => JSX.Element;

package/dist/shared-ui/src/components/AdditionalFilter/AdvancedPicker/advancedFilters.d.ts

@@ -1,5 +1,7 @@
 import { QueryAttributes } from '../../../../../shared-logic/src/QueryAttributes/types';
 import { MultiSelectFilter as MultiSelectFilterType, NumericFilter } from '../../../../../shared-logic/src/AdditionalFilter/types';
 import { DataType } from '../../../../../shared-logic/src/Field/types';
+import { CompletedWipFilter } from '../../../library/DataPanel/FilterInput/types';
 export declare const definingForFilterInput: (filter: MultiSelectFilterType | NumericFilter, type: Omit<DataType, 'date_time'>) => QueryAttributes.Filter[][];
 export declare function buildForEachAppliesToField(completedFilters: QueryAttributes.Filter[][], filter: NumericFilter | MultiSelectFilterType): QueryAttributes.Filter[];
+export declare function changeValueOnWipFilterChange(filter: Partial<CompletedWipFilter>, completedFilters: QueryAttributes.Filter[][], orFilterIndex: number, andFilterIndex: number): Partial<CompletedWipFilter>;

package/dist/shared-ui/src/components/AdditionalFilter/DateFilter/index.d.ts

@@ -1,17 +1,17 @@
-/// <reference types="react" />
 import { DateAndTimeFilter, DateFilter as DateFilterType } from '../../../../../shared-logic/src/AdditionalFilter/types';
 import { DashboardBehaviour } from '../../../contexts/DashboardBehaviour/types';
 import { DataSet } from '../../../../../shared-logic/src/DataSet/types';
 import * as FilterType from '../../../../../shared-logic/src/AdditionalFilter/constants';
+import { FunctionComponent } from 'react';
 /**
  * Used by global and local filters to provide a way of editing
  * date time filters
  */
-export declare const DateFilter: (props: {
+export declare const DateFilter: FunctionComponent<{
     filter: DateFilterType | DateAndTimeFilter;
     onChange: (additionalFilter: DateFilterType | DateAndTimeFilter) => void;
     dateFilterOptions: DashboardBehaviour['dateFilterOptions'];
     dataSets: DataSet[];
-    showClearBtn?: boolean | undefined;
-    type: typeof FilterType.DATE_FILTER | typeof FilterType.DATE_AND_TIME_FILTER;
-}) => JSX.Element | null;
+    showClearBtn?: boolean;
+    type: typeof FilterType.DATE_FILTER;
+}>;

package/dist/shared-ui/src/components/AdditionalFilter/DateFilter/index.func.d.ts

@@ -0,0 +1,6 @@
+import { DateAndTimeFilter, DateFilter as DateFilterType } from '../../../../../shared-logic/src/AdditionalFilter/types';
+import { QueryAttributes } from '../../../../../shared-logic/src/QueryAttributes/types';
+export declare function buildDateTimePayload(type: 'dateFilter' | 'dateAndTimeFilter', filter: DateFilterType | DateAndTimeFilter, value: string | {
+    startDate: Date;
+    endDate: Date;
+} | QueryAttributes.Filter[][] | null): DateFilterType | DateAndTimeFilter;

package/dist/shared-ui/src/components/AdditionalFilter/useBuildDashboardFilter.d.ts

@@ -4,6 +4,7 @@ import { AdditionalFilter } from '../../../../shared-logic/src/AdditionalFilter/
 import { MultiSelectOptions } from '../../base/MultiSelect';
 export declare type AdvancedOptions = {
     inclusiveDate?: boolean;
+    allowTimeSelection?: boolean;
 };
 declare type SetSelectedDataSets = {
     type: 'setSelectedDataSets';

package/dist/shared-ui/src/components/Drilldown/useDrilldownSelection.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { Component } from '../../../../shared-logic/src/Component/types';
+import { DataSet } from '../../../../shared-logic/src/DataSet/types';
+import { Result } from '../../../../shared-logic/src/Result/types';
+import * as Drilldown from '../../../../shared-logic/src/Drilldown/Drilldown';
+export declare type AcceptedDrilldownAttributes = Component.PieChartAttributes | Component.BarChartAttributes | Component.HorizontalBarChartAttributes;
+export declare function useDrilldownSelection(results: (Result | null)[], attributes: AcceptedDrilldownAttributes, setAttributes: (newAttributes: AcceptedDrilldownAttributes) => void, dataSet: DataSet): {
+    onDrilldownChange: ({ existingField, newField }: Drilldown.SelectedDrilldown) => void;
+    setDrilldownSelections: import("react").Dispatch<import("react").SetStateAction<Drilldown.SelectedDrilldown[]>>;
+    drilldownSelections: Drilldown.SelectedDrilldown[];
+};

package/dist/shared-ui/src/components/PieChart/PieChart.d.ts

@@ -16,5 +16,6 @@ export declare type PieChartProps = {
     id: string;
     dashboardBehaviour: DashboardBehaviour;
     library?: boolean;
+    editor?: boolean;
 };
 export declare const PieChart: (props: PieChartProps) => JSX.Element;

package/dist/shared-ui/src/components/PieChart/PieChartView.d.ts

@@ -2,13 +2,18 @@ import React from 'react';
 import { VizzlyComponents } from '../../types';
 import { Component } from '../../../../shared-logic/src/Component/types';
 import { DashboardBehaviour } from '../../contexts/DashboardBehaviour/types';
+import * as Drilldown from '../../../../shared-logic/src/Drilldown/Drilldown';
 export declare type PieChartViewProps = VizzlyComponents.ViewProps<Component.PieChartAttributes> & {
     library?: boolean;
     numberFormatOptions: DashboardBehaviour['numberFormatOptions'];
+    onDrilldownChange: (payload: Drilldown.SelectedDrilldown) => void;
+    drilldownSelections: Drilldown.SelectedDrilldown[];
+    onResetDrilldown: () => void;
+    editor?: boolean;
 };
 export declare const defaultProps: Omit<Component.PieChartAttributes, 'dataSetId'>;
 declare const memoized: React.MemoExoticComponent<{
     (props: PieChartViewProps): JSX.Element;
-    defaultProps: Pick<Component.PieChartAttributes, "filter" | "order" | "offset" | "measure" | "dimension" | "timeDimension" | "limit" | "type" | "viewId" | "displayTitle" | "displaySubject" | "protectedByOrganisation" | "tags" | "conditionalFormattingRules" | "legend" | "parameters" | "labelFormat" | "labelsAsPercentage" | "labels">;
+    defaultProps: Pick<Component.PieChartAttributes, "filter" | "order" | "offset" | "measure" | "dimension" | "timeDimension" | "limit" | "type" | "viewId" | "displayTitle" | "displaySubject" | "protectedByOrganisation" | "tags" | "conditionalFormattingRules" | "legend" | "parameters" | "drilldownOptions" | "labelFormat" | "labelsAsPercentage" | "labels">;
 }>;
 export default memoized;