@devgateway/dvz-wp-commons 1.0.5 → 1.2.0

package/build/ChartLegends.js

@@ -1,65 +1,50 @@
-import React from 'react';
 import { Button, ButtonGroup, PanelBody, PanelRow, RangeControl, TextControl, ToggleControl } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { PanelColorSettings } from '@wordpress/block-editor';
 export const ChartLegends = (props) => {
-    const { setAttributes, legendPosition, attributes } = props;
-    const { showLegends, marginLeft, marginRight, marginBottom, marginTop, legendLabel, useLabelBackground, useCheckBoxBackground, legendLabelColor, reverseLegend } = attributes;
+    const { setAttributes, attributes: { showLegends, legendPosition, marginLeft, marginRight, marginBottom, marginTop, legendLabel, useLabelBackground, useCheckBoxBackground, legendLabelColor, reverseLegend, showLegendsInColumns, numberOfLegendColumns } } = props;
     return [
         React.createElement(PanelBody, { initialOpen: false, title: __("Margins") },
             React.createElement(PanelRow, null,
-                React.createElement(RangeControl, { label: __('Margin Bottom (Space between chart area and bottom border)'), value: marginBottom, onChange: (marginBottom) => {
-                        if (marginBottom) {
-                            setAttributes({ ...attributes, marginBottom });
-                        }
-                    }, min: 0, max: 500 })),
+                React.createElement(RangeControl, { label: __('Margin Bottom (Space between chart area and bottom border)'), value: marginBottom, onChange: (marginBottom) => setAttributes({ marginBottom }), min: 0, max: 500 })),
             React.createElement(PanelRow, null,
-                React.createElement(RangeControl, { label: __('Margin Left (Space between chart area and left border)'), value: marginLeft, initialPosition: 0, onChange: (marginLeft) => {
-                        if (marginLeft) {
-                            setAttributes({ ...attributes, marginLeft });
-                        }
-                    }, step: 1, min: 0, max: 500 })),
+                React.createElement(RangeControl, { label: __('Margin Left (Space between chart area and left border)'), value: marginLeft, initialPosition: 0, onChange: (marginLeft) => setAttributes({ marginLeft }), step: 1, min: 0, max: 500 })),
             React.createElement(PanelRow, null,
-                React.createElement(RangeControl, { label: __('Margin Right'), value: marginRight, onChange: (marginRight) => {
-                        if (marginRight) {
-                            setAttributes({ ...attributes, marginRight });
-                        }
-                    }, min: 0, max: 500 })),
+                React.createElement(RangeControl, { label: __('Margin Right'), value: marginRight, onChange: (marginRight) => setAttributes({ marginRight }), min: 0, max: 500 })),
             React.createElement(PanelRow, null,
-                React.createElement(RangeControl, { label: __('Margin Top'), value: marginTop, onChange: (marginTop) => {
-                        if (marginTop) {
-                            setAttributes({ ...attributes, marginTop });
-                        }
-                    }, min: 0, max: 500 }))),
+                React.createElement(RangeControl, { label: __('Margin Top'), value: marginTop, onChange: (marginTop) => setAttributes({ marginTop }), min: 0, max: 500 }))),
         React.createElement(PanelBody, { initialOpen: false, title: __("Legends") },
             React.createElement(PanelRow, null,
-                React.createElement(ToggleControl, { label: __("Show Legends"), checked: showLegends, onChange: () => setAttributes({ ...attributes, showLegends: !showLegends }) })),
+                React.createElement(ToggleControl, { label: __("Show Legends"), checked: showLegends, onChange: () => setAttributes({ showLegends: !showLegends }) })),
+            showLegends && React.createElement(PanelRow, null,
+                React.createElement(ToggleControl, { label: __("Show Legends in Columns"), checked: showLegendsInColumns, onChange: () => setAttributes({ showLegendsInColumns: !showLegendsInColumns }) })),
+            showLegends && showLegendsInColumns && React.createElement(PanelRow, null,
+                React.createElement(TextControl, { label: __('Number of Legend Columns'), value: numberOfLegendColumns, onChange: (numberOfLegendColumns) => setAttributes({ numberOfLegendColumns }), type: "number", min: 1, max: 10 })),
             showLegends &&
                 React.createElement(PanelRow, null,
-                    React.createElement(ToggleControl, { label: __("Reverse legend order"), checked: reverseLegend, onChange: () => setAttributes({ ...attributes, reverseLegend: !reverseLegend }) })),
+                    React.createElement(ToggleControl, { label: __("Reverse legend order"), checked: reverseLegend, onChange: () => setAttributes({ reverseLegend: !reverseLegend }) })),
             showLegends && React.createElement(PanelRow, null,
-                React.createElement(ToggleControl, { label: __("Use Label Background"), checked: useLabelBackground, onChange: () => setAttributes({ ...attributes, useLabelBackground: !useLabelBackground }) })),
+                React.createElement(ToggleControl, { label: __("Use Label Background"), checked: useLabelBackground, onChange: e => setAttributes({ useLabelBackground: !useLabelBackground }) })),
             showLegends && React.createElement(PanelRow, null,
-                React.createElement(ToggleControl, { label: __("Use Checkbox Background"), checked: useCheckBoxBackground, onChange: () => setAttributes({ ...attributes, useCheckBoxBackground: !useCheckBoxBackground }) })),
+                React.createElement(ToggleControl, { label: __("Use Checkbox Background"), checked: useCheckBoxBackground, onChange: e => setAttributes({ useCheckBoxBackground: !useCheckBoxBackground }) })),
             showLegends && React.createElement(PanelRow, null,
                 React.createElement(ButtonGroup, null,
-                    React.createElement(Button, { variant: legendPosition == 'left' ? 'primary' : 'secondary', onClick: () => setAttributes({ ...attributes, legendPosition: "left" }) }, __("Left")),
-                    React.createElement(Button, { variant: legendPosition == 'top' ? 'primary' : 'secondary', onClick: () => setAttributes({ ...attributes, legendPosition: "top" }) }, __("Top")),
-                    React.createElement(Button, { variant: legendPosition == 'right' ? 'primary' : 'secondary', onClick: () => setAttributes({ ...attributes, legendPosition: "right" }) }, __("Right")),
-                    React.createElement(Button, { variant: legendPosition == 'bottom' ? 'primary' : 'secondary', onClick: () => setAttributes({ ...attributes, legendPosition: "bottom" }) }, __("Bottom")))),
+                    React.createElement(Button, { isPrimary: legendPosition == 'left', isSecondary: legendPosition != 'left', onClick: e => setAttributes({ legendPosition: "left" }) }, __("Left")),
+                    React.createElement(Button, { isPrimary: legendPosition == 'top', isSecondary: legendPosition != 'top', onClick: e => setAttributes({ legendPosition: "top" }) }, __("Top")),
+                    React.createElement(Button, { isPrimary: legendPosition == 'right', isSecondary: legendPosition != 'right', onClick: e => setAttributes({ legendPosition: "right" }) }, __("Right")),
+                    React.createElement(Button, { isPrimary: legendPosition == 'bottom', isSecondary: legendPosition != 'bottom', onClick: e => setAttributes({ legendPosition: "bottom" }) }, __("Bottom")))),
             showLegends && React.createElement(PanelRow, null,
-                React.createElement(TextControl, { label: __('Legends Title'), value: legendLabel, onChange: (legendLabel) => setAttributes({ ...attributes, legendLabel }) })),
+                React.createElement(TextControl, { label: __('Legends Title'), value: legendLabel, onChange: (legendLabel) => setAttributes({ legendLabel }) })),
             showLegends && React.createElement(PanelRow, null,
                 React.createElement(PanelColorSettings, { title: __('Legends text color'), colorSettings: [
                         {
-                            // Ensure legendLabelColor is encoded before decoding to avoid runtime errors.
-                            value: decodeURIComponent(legendLabelColor ? encodeURIComponent(decodeURIComponent(legendLabelColor)) : "#000000"),
+                            value: decodeURIComponent(legendLabelColor ? legendLabelColor : "#000000"),
                             onChange: (color) => {
                                 if (color) {
-                                    setAttributes({ ...attributes, legendLabelColor: encodeURIComponent(color) });
+                                    setAttributes({ legendLabelColor: encodeURIComponent(color) });
                                 }
                                 else {
-                                    setAttributes({ ...attributes, legendLabelColor: null });
+                                    setAttributes({ legendLabelColor: null });
                                 }
                             },
                             label: __("")

package/build/ChartMeasures.d.ts

@@ -1,23 +1,2 @@
-import React from 'react';
-import { Measure } from './types.js';
-export type ChartMeasuresProps = {
-    onMeasuresChange: (measure: string) => void;
-    onFormatChange: (format: string, field: string) => void;
-    onUseCustomAxisFormatChange: (value: boolean) => void;
-    onSetSingleMeasure: (measure: string) => void;
-    onCustomLabelToggleChange: (measure: string) => void;
-    onCustomLabelChange: (measure: string, value: string) => void;
-    allMeasures: any[];
-    setAttributes: (attributes: any) => void;
-    title: string;
-    attributes: {
-        panelStatus: any;
-        measures: Measure[];
-        dimension1: string | null;
-        dimension2: string | null;
-        type: string;
-        app: string;
-    };
-};
-export declare const ChartMeasures: (props: ChartMeasuresProps) => React.JSX.Element;
+export function ChartMeasures(props: any): import("react").JSX.Element;
 export default ChartMeasures;

package/build/ChartMeasures.js

@@ -1,9 +1,8 @@
-import React from 'react';
 import { __ } from '@wordpress/i18n';
 import { CheckboxControl, PanelBody, PanelRow, SelectControl, ToggleControl, TextControl } from '@wordpress/components';
 import Format from './Format';
-import { togglePanel } from "./Util.js";
-import { getTranslation } from "./APIutils.js";
+import { togglePanel } from "./Util";
+import { getTranslation } from "./APIutils";
 const defaultFormat = {
     "style": "percent",
     "minimumFractionDigits": 1,
@@ -88,7 +87,7 @@ export const ChartMeasures = (props) => {
 
         */
             ((type == 'bar' && dimension2 != 'none') || (type == 'pie' && (dimension1 != 'none' || dimension2 != 'none'))) && allMeasures && [...new Set(allMeasures.map(p => getTranslation(p.group)))].map(g => {
-                return (React.createElement(PanelBody, { initialOpen: panelStatus[g], onToggle: e => togglePanel(g, panelStatus, setAttributes), title: `${g} (${countSelected(g)} / ${allMeasures.filter(f => getTranslation(f.group) === g).length} ) ` }, allMeasures.filter(f => getTranslation(f.group) === g)
+                return (React.createElement(PanelBody, { initialOpen: panelStatus[g], onToggle: e => togglePanel(g, panelStatus, setAttributes), title: `${g} (${countSelected(g)} / ${allMeasures.filter(f => f.group === g).length} ) ` }, allMeasures.filter(f => getTranslation(f.group) === g)
                     .map(m => React.createElement(PanelRow, null,
                     React.createElement(MeasureOptions, { single: true, measure: m })))));
             }),

package/build/Constants.d.ts

@@ -1,15 +1,18 @@
-export declare const DEFAULT_FORMAT_SETTINGS: {
-    format: {
-        style: string;
-        minimumFractionDigits: number;
-        maximumFractionDigits: number;
-    };
-    customFormat: {
-        style: string;
-        minimumFractionDigits: number;
-        maximumFractionDigits: number;
-    };
-    useCustomAxisFormat: boolean;
-};
-export declare const BLOCKS_CATEGORY = "wp-react-lib-blocks";
-export declare const BLOCKS_NS = "viz";
+export namespace DEFAULT_FORMAT_SETTINGS {
+    namespace format {
+        let style: string;
+        let minimumFractionDigits: number;
+        let maximumFractionDigits: number;
+    }
+    namespace customFormat {
+        let style_1: string;
+        export { style_1 as style };
+        let minimumFractionDigits_1: number;
+        export { minimumFractionDigits_1 as minimumFractionDigits };
+        let maximumFractionDigits_1: number;
+        export { maximumFractionDigits_1 as maximumFractionDigits };
+    }
+    let useCustomAxisFormat: boolean;
+}
+export const BLOCKS_CATEGORY: "wp-react-lib-blocks";
+export const BLOCKS_NS: "viz";

package/build/DataFilters.d.ts

@@ -1,13 +1,2 @@
-import React from 'react';
-import { Filter } from './types';
-export type DataFiltersProps = {
-    allCategories: any[];
-    allFilters: any[];
-    onChange?: () => void;
-    attributes?: {
-        filters: Filter[];
-    };
-    setAttributes: (attributes: any) => void;
-};
-export declare const DataFilters: (props: DataFiltersProps) => React.JSX.Element;
+export function DataFilters(props: any): import("react").JSX.Element;
 export default DataFilters;

package/build/DataFilters.js

@@ -1,18 +1,15 @@
-import React from 'react';
 import { Button, PanelBody, PanelRow, SelectControl, ToggleControl } from "@wordpress/components";
 import { __ } from '@wordpress/i18n';
 export const DataFilters = (props) => {
     const updateFilterParam = (param, idx) => {
-        const { attributes, setAttributes, allFilters } = props;
-        const filters = attributes?.filters || [];
+        const { attributes: { filters }, setAttributes, allFilters } = props;
         const newFilters = filters.slice();
         const selected = allFilters.filter(f => f.param === param)[0];
         newFilters[idx] = { ...selected, value: [] };
         setAttributes({ filters: newFilters });
     };
     const updateFilterValue = (value, idx) => {
-        const { attributes, setAttributes, onChange } = props;
-        const filters = attributes?.filters || [];
+        const { attributes: { filters }, setAttributes, onChange } = props;
         const selected = filters[idx];
         let values = selected.value;
         if (values.indexOf(value) > -1) {
@@ -24,11 +21,10 @@ export const DataFilters = (props) => {
         const newFilters = filters.slice();
         newFilters[idx].value = values;
         setAttributes({ filters: newFilters });
-        onChange && onChange();
+        onChange();
     };
     const addFilter = () => {
-        const { attributes, setAttributes, allFilters } = props;
-        const filters = attributes?.filters || [];
+        const { attributes: { filters }, setAttributes, allFilters } = props;
         let index = filters.length > allFilters.length ? allFilters.length : filters.length;
         const newFilter = (allFilters && allFilters.length > 0) ? {
             ...allFilters[index],
@@ -39,8 +35,7 @@ export const DataFilters = (props) => {
         setAttributes({ filters: newFilters });
     };
     const removeFilter = (f) => {
-        const { attributes, setAttributes } = props;
-        const filters = attributes?.filters || [];
+        const { attributes: { filters }, setAttributes } = props;
         let newFilters = filters.slice(0, -1);
         setAttributes({ filters: newFilters });
     };
@@ -69,7 +64,7 @@ export const DataFilters = (props) => {
     const CategoricalFilter = ({ value, index, items, onUpdateFilterValue }) => {
         if (items) {
             const sortedItems = items.sort(function (a, b) {
-                if (a.position !== undefined && b.position !== undefined) {
+                if (a.position !== undefined && b.position !== undefined && a.position !== b.position) {
                     return a.position - b.position;
                 }
                 let aValue = a.value ? a.value.toLowerCase() : "";
@@ -77,16 +72,17 @@ export const DataFilters = (props) => {
                 return aValue < bValue ? -1 : aValue > bValue ? 1 : 0;
             });
             return sortedItems.map(v => React.createElement(PanelRow, null,
-                React.createElement(ToggleControl, { label: v.value, checked: value.indexOf(v.id) > -1, onChange: e => { onUpdateFilterValue(v.id, index); } })));
+                React.createElement(ToggleControl, { label: v.value, checked: value.indexOf(v.id) > -1, onChange: e => {
+                        onUpdateFilterValue(v.id, index);
+                    } })));
         }
         else {
             return null;
         }
     };
-    const { allFilters, attributes } = props;
-    const filters = attributes?.filters || [];
+    const { allFilters, attributes: { filters, } } = props;
     return React.createElement(PanelBody, { initialOpen: false, title: __("Filters") },
-        filters.length > 0 && filters.map((f, index) => {
+        filters.map((f, index) => {
             return (React.createElement(PanelBody, { initialOpen: true, title: __(`Filter - ${f.label}`) },
                 React.createElement(FilterSelector, { param: f.param, index: index, options: allFilters, onUpdateFilterParam: updateFilterParam }),
                 React.createElement(CategoricalFilter, { value: f.value, index: index, items: items(f.type), onUpdateFilterValue: updateFilterValue })));

package/build/Format.d.ts

@@ -1,12 +1,10 @@
-import React from 'react';
-export type FormatProps = {
+export function Format({ format, title, onFormatChange, onUseCustomAxisFormatChange, customFormat, hiddenCustomAxisFormat, useCustomAxisFormat }: {
     format: any;
-    title?: string;
-    onFormatChange: (format: any, field: string) => void;
-    onUseCustomAxisFormatChange?: (value: boolean) => void;
-    customFormat?: any;
-    hiddenCustomAxisFormat?: boolean;
-    useCustomAxisFormat?: boolean;
-};
-export declare const Format: ({ format, title, onFormatChange, onUseCustomAxisFormatChange, customFormat, hiddenCustomAxisFormat, useCustomAxisFormat }: FormatProps) => React.JSX.Element[];
+    title: any;
+    onFormatChange: any;
+    onUseCustomAxisFormatChange: any;
+    customFormat: any;
+    hiddenCustomAxisFormat: any;
+    useCustomAxisFormat: any;
+}): import("react").JSX.Element[];
 export default Format;

package/build/Format.js

@@ -1,4 +1,3 @@
-import React from 'react';
 import { PanelRow, SelectControl, TextControl, ToggleControl, PanelBody } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 const styles = [
@@ -354,7 +353,7 @@ export const Format = ({ format, title, onFormatChange, onUseCustomAxisFormatCha
     return [
         React.createElement(PanelBody, { initialOpen: true, title: __("Default Format") },
             React.createElement(PanelRow, null,
-                React.createElement(SelectControl, { multiple: true, label: __('Style', "dg"), value: [format.style], onChange: (value) => {
+                React.createElement(SelectControl, { label: __('Style', "dg"), value: [format.style], onChange: (value) => {
                         onChangeFormat(value, DEFAULT_FORMAT);
                     }, options: styles })),
             React.createElement(React.Fragment, null, format.style === "currency" && React.createElement(PanelRow, null,
@@ -362,14 +361,14 @@ export const Format = ({ format, title, onFormatChange, onUseCustomAxisFormatCha
                         onCurrencyChange(value, DEFAULT_FORMAT);
                     }, value: format.currency, options: currencies }))),
             React.createElement(PanelRow, null,
-                React.createElement(TextControl, { type: "number", label: __("Decimal Points", "dg"), onChange: (value) => {
+                React.createElement(TextControl, { type: "Number", label: __("Decimal Points", "dg"), onChange: (value) => {
                         onDecimalChange(value, DEFAULT_FORMAT);
                     }, value: format.minimumFractionDigits }))),
         React.createElement(React.Fragment, null, !hiddenCustomAxisFormat && React.createElement(PanelRow, null,
-            React.createElement(ToggleControl, { label: __("Use Custom Axis Format", "dg"), checked: useCustomAxisFormat, onChange: (value) => onUseCustomAxisFormatChange?.(value) }))),
+            React.createElement(ToggleControl, { label: __("Use Custom Axis Format", "dg"), checked: useCustomAxisFormat, onChange: (value) => onUseCustomAxisFormatChange(value) }))),
         React.createElement(React.Fragment, null, useCustomAxisFormat && React.createElement(PanelBody, { initialOpen: true, title: __("Custom Axis Format") },
             React.createElement(PanelRow, null,
-                React.createElement(SelectControl, { multiple: true, label: __('Style', "dg"), value: [customFormat.style], onChange: (value) => {
+                React.createElement(SelectControl, { label: __('Style', "dg"), value: [customFormat.style], onChange: (value) => {
                         onChangeFormat(value, CUSTOM_FORMAT);
                     }, options: styles })),
             React.createElement(React.Fragment, null, customFormat.style === "currency" && React.createElement(PanelRow, null,
@@ -377,7 +376,7 @@ export const Format = ({ format, title, onFormatChange, onUseCustomAxisFormatCha
                         onCurrencyChange(value, CUSTOM_FORMAT);
                     }, value: customFormat.currency, options: currencies }))),
             React.createElement(PanelRow, null,
-                React.createElement(TextControl, { type: "number", label: __("Decimal Points", "dg"), onChange: (value) => {
+                React.createElement(TextControl, { type: "Number", label: __("Decimal Points", "dg"), onChange: (value) => {
                         onDecimalChange(value, CUSTOM_FORMAT);
                     }, value: customFormat.minimumFractionDigits }))))
     ];

package/build/MapCSVSourceConfig.d.ts

@@ -1,12 +1,10 @@
-import React from 'react';
-export type MapCSVSourceConfigProps = {
+export function MapCSVSourceConfig({ attributes: { app, csv, hasMultipleMeasures, enableSummaryView }, setAttributes }: {
     attributes: {
-        app: string;
-        csv: string;
-        hasMultipleMeasures: boolean;
-        enableSummaryView: boolean;
+        app: any;
+        csv: any;
+        hasMultipleMeasures: any;
+        enableSummaryView: any;
     };
-    setAttributes: (attributes: any) => void;
-};
-export declare const MapCSVSourceConfig: ({ attributes: { app, csv, hasMultipleMeasures, enableSummaryView }, setAttributes }: MapCSVSourceConfigProps) => React.JSX.Element[];
+    setAttributes: any;
+}): import("react").JSX.Element[];
 export default MapCSVSourceConfig;

package/build/MapCSVSourceConfig.js

@@ -1,5 +1,4 @@
-import React from 'react';
-import { PanelBody, PanelRow, ToggleControl, TextareaControl } from '@wordpress/components';
+import { PanelBody, PanelRow, ToggleControl, TextareaControl, SelectControl } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 export const MapCSVSourceConfig = ({ attributes: { app, csv, hasMultipleMeasures, enableSummaryView }, setAttributes }) => {
     return ([React.createElement(PanelBody, { initialOpen: false, title: __("CSV Configuration") },

package/build/Measures.d.ts

@@ -1,25 +1,2 @@
-import React from 'react';
-import { Measure } from './types';
-export type MeasuresProps = {
-    onMeasuresChange?: (measure: string) => void;
-    onFormatChange: (format: string, field: string) => void;
-    onUseCustomAxisFormatChange?: (value: boolean) => void;
-    onSetSingleMeasure: (measure: string) => void;
-    onCustomLabelToggleChange?: (measure: string) => void;
-    onCustomLabelChange?: (measure: string, value: string) => void;
-    allMeasures: Measure[];
-    setAttributes: (attributes: any) => void;
-    title?: string;
-    format?: any;
-    currentType?: string;
-    attributes: {
-        panelStatus?: any;
-        measures: Measure[];
-        dimension1: string;
-        dimension2?: string;
-        type: string;
-        app: string;
-    };
-};
-export declare const Measures: (props: MeasuresProps) => React.JSX.Element;
+export function Measures(props: any): import("react").JSX.Element;
 export default Measures;

package/build/Measures.js

@@ -1,4 +1,3 @@
-import React from 'react';
 import { __ } from '@wordpress/i18n';
 import { CheckboxControl, PanelBody, PanelRow, SelectControl, ToggleControl, TextControl } from '@wordpress/components';
 import Format from './Format';
@@ -14,7 +13,7 @@ export const Measures = (props) => {
     const { onMeasuresChange, onFormatChange, onUseCustomAxisFormatChange, onSetSingleMeasure, onCustomLabelToggleChange, onCustomLabelChange, allMeasures, setAttributes, title, format, attributes: { panelStatus, measures, dimension1, dimension2, type, app } } = props;
     const MToggle = ({ measure }) => {
         const userMeasure = measures[app] ? measures[app][measure.value] : {};
-        return (React.createElement(ToggleControl, { label: getTranslation(measure), checked: userMeasure ? userMeasure.selected : false, onChange: (value) => onMeasuresChange?.(measure.value) }));
+        return (React.createElement(ToggleControl, { label: getTranslation(measure), checked: userMeasure ? userMeasure.selected : false, onChange: (value) => onMeasuresChange(measure.value) }));
     };
     const MCheckbox = ({ measure }) => {
         const userMeasure = measures[app] ? measures[app][measure.value] : {};
@@ -65,19 +64,17 @@ export const Measures = (props) => {
             /*
              Multiple measures conditions
 
-             Bar:
-             no dimensions selected
-             one dimension is selected
-             -  not available when second dimension gets selected
-
-             Line:
-               - Always multi measure as measures represents line series, one dimension should always be selected
+             Bar & Line:
+                 no dimensions selected
+                 one dimension is selected
+                 -  not available when second dimension gets selected
 
              Pie:
                   no dimensions selected
                    -  not available when any dimension is selected
              */
-            ((type == 'line') || (type == 'radar') ||
+            ((type == 'radar') ||
+                (type == 'line' && dimension2 == 'none') ||
                 (type == 'bar' && dimension2 == 'none') ||
                 (type == 'pie' && dimension1 == 'none' && dimension2 == 'none')) && allMeasures && [...new Set(allMeasures.map(p => getTranslation(p.group)))].map(g => {
                 return (React.createElement(PanelBody, { initialOpen: panelStatus[g], onToggle: e => togglePanel(g, panelStatus, setAttributes), title: `${g} (${countSelected(g)} / ${countTotal(g)} ) ` }, allMeasures.filter(f => getTranslation(f.group) === g)
@@ -86,27 +83,23 @@ export const Measures = (props) => {
             }),
             /*Single measure conditions
 
-        Bar:
-               2 dimensions selected
-         Line:
-                never
-         Pie:
-              any dimensions selected
+            Bar & Lie:
+                2 dimensions selected
+            Pie:
+                any dimensions selected
 
-        */
-            ((type == 'big-number') || (type == 'bar' && dimension2 != 'none') || (type == 'pie' && (dimension1 != 'none' || dimension2 != 'none'))) && allMeasures && [...new Set(allMeasures.map(p => getTranslation(p.group)))].map(g => {
+            */
+            ((type == 'big-number') || (type == 'line' && dimension2 != 'none') || (type == 'bar' && dimension2 != 'none') || (type == 'pie' && (dimension1 != 'none' || dimension2 != 'none'))) && allMeasures && [...new Set(allMeasures.map(p => getTranslation(p.group)))].map(g => {
                 return (React.createElement(PanelBody, { initialOpen: panelStatus[g], onToggle: e => togglePanel(g, panelStatus, setAttributes), title: `${g} (${countSelected(g)} / ${countTotal(g)} ) ` }, allMeasures.filter(f => getTranslation(f.group) === g)
                     .map(m => React.createElement(PanelRow, null,
                     React.createElement(MeasureOptions, { single: true, measure: m })))));
             }),
-            (type == 'overlay') && allMeasures && React.createElement(SelectControl, { label: "Measure", 
-                // @ts-ignore
-                value: selectedMeasures && selectedMeasures[0] ? selectedMeasures[0].value : null, options: [{ value: '', label: 'Select Measure' }, ...allMeasures], onChange: (measure) => onSetSingleMeasure(measure), __nextHasNoMarginBottom: true }),
+            (type == 'overlay') && allMeasures && React.createElement(SelectControl, { label: "Measure", value: selectedMeasures && selectedMeasures[0] ? selectedMeasures[0].value : null, options: [{ value: '', label: 'Select Measure' }, ...allMeasures], onChange: (measure) => onSetSingleMeasure(measure), __nextHasNoMarginBottom: true }),
             (type != 'overlay') && React.createElement(PanelBody, { title: __("Format"), initialOpen: panelStatus["FORMAT"], onToggle: e => togglePanel("FORMAT", panelStatus, setAttributes) },
                 React.createElement(Format, { hiddenCustomAxisFormat: type == 'radar' || type == 'big-number', format: format || (measures[app] && measures[app].format ? measures[app].format : defaultFormat), customFormat: measures[app] && measures[app].customFormat ? measures[app].customFormat : defaultFormat, useCustomAxisFormat: measures[app] ? measures[app].useCustomAxisFormat : false, onFormatChange: (format, field) => {
                         onFormatChange(format, field);
                     }, onUseCustomAxisFormatChange: value => {
-                        onUseCustomAxisFormatChange?.(value);
+                        onUseCustomAxisFormatChange(value);
                     } }))),
         (type != 'overlay') && selectedMeasures && selectedMeasures.length > 0 &&
             React.createElement(PanelBody, { title: __("Measure Label Customization"), initialOpen: panelStatus["MEASURES_LABEL_CUSTOMIZATION"], onToggle: e => togglePanel("MEASURES_LABEL_CUSTOMIZATION", panelStatus, setAttributes) }, selectedMeasures && [...new Set(selectedMeasures.map(p => getTranslation(p.group)))].map(g => {
@@ -115,11 +108,11 @@ export const Measures = (props) => {
                     const userMeasure = measures[app] ? measures[app][m.value] : {};
                     return (React.createElement(React.Fragment, null,
                         React.createElement(PanelRow, null,
-                            React.createElement(ToggleControl, { label: getTranslation(m), checked: userMeasure ? userMeasure.hasCustomLabel : false, onChange: (value) => onCustomLabelToggleChange?.(m.value) }),
+                            React.createElement(ToggleControl, { label: getTranslation(m), checked: userMeasure ? userMeasure.hasCustomLabel : false, onChange: (value) => onCustomLabelToggleChange(m.value) }),
                             " "),
                         userMeasure.hasCustomLabel &&
                             React.createElement(PanelRow, null,
-                                React.createElement(TextControl, { label: __("Custom Label"), value: userMeasure ? userMeasure.customLabel : "", onChange: (value) => onCustomLabelChange?.(m.value, value) }))));
+                                React.createElement(TextControl, { label: __("Custom Label"), value: userMeasure ? userMeasure.customLabel : "", onChange: (value) => onCustomLabelChange(m.value, value) }))));
                 })));
             })));
 };

package/build/MobileConfigUtils.d.ts

@@ -1,6 +1,6 @@
-export declare function extractAxisValues(csvData: string): string[];
-export declare function transformDataToAppObject(data: any[], appName: string, existingObject?: any): any;
-export declare function getSelectedItemsForApp(config: Record<string, any>, appName: string): {};
-export declare function getSelectedLabelsForApp(data: any, appName: string): any[];
-export declare function updateMeasureLabels(data: any, measures: any, app: string): void;
-export declare function getStoredOrSetItem(key: any, fallback: any, overwrite?: boolean): any;
+export function extractAxisValues(csvData: any): any;
+export function transformDataToAppObject(data: any, appName: any, existingObject?: {}): {};
+export function getSelectedItemsForApp(config: any, appName: any): {};
+export function getSelectedLabelsForApp(data: any, appName: any): any[];
+export function updateMeasureLabels(data: any, measures: any, app: any): void;
+export function getStoredOrSetItem(key: any, fallback: any, overwrite?: boolean): any;

package/build/MobileConfigUtils.js

@@ -1,4 +1,4 @@
-import isEmpty from 'lodash.isempty';
+import _ from 'lodash';
 import { getTranslatedOptions } from "./APIutils";
 export function extractAxisValues(csvData) {
     const lines = csvData.split("\n");
@@ -12,20 +12,22 @@ export function transformDataToAppObject(data, appName, existingObject = {}) {
         return existingObject;
     }
     existingObject[appName] = {};
-    data?.forEach((item) => {
-        const key = item.value;
-        existingObject[appName][key] = {
-            selected: false,
-            format: {
-                style: "percent",
-                minimumFractionDigits: 1,
-                maximumFractionDigits: 1,
-                currency: "USD",
-            },
-            hasCustomLabel: false,
-            customLabel: item.label || key,
-        };
-    });
+    if (data) {
+        data.forEach((item) => {
+            const key = item.value;
+            existingObject[appName][key] = {
+                selected: false,
+                format: {
+                    style: "percent",
+                    minimumFractionDigits: 1,
+                    maximumFractionDigits: 1,
+                    currency: "USD",
+                },
+                hasCustomLabel: false,
+                customLabel: item.label || key,
+            };
+        });
+    }
     return existingObject;
 }
 export function getSelectedItemsForApp(config, appName) {
@@ -42,7 +44,7 @@ export function getSelectedItemsForApp(config, appName) {
     return selectedEntries;
 }
 export function getSelectedLabelsForApp(data, appName) {
-    const appData = data[appName];
+    const appData = data;
     if (!appData) {
         return [];
     }
@@ -66,20 +68,14 @@ export function updateMeasureLabels(data, measures, app) {
         }
     });
 }
-;
 export function getStoredOrSetItem(key, fallback, overwrite = false) {
     const fallbackValue = fallback || [];
-    if (overwrite && !isEmpty(fallbackValue)) {
+    if (overwrite && !_.isEmpty(fallbackValue)) {
         sessionStorage
             .setItem(key, JSON.stringify(fallbackValue));
         return fallbackValue;
     }
-    const storedItem = sessionStorage.getItem(key);
-    if (storedItem === null) {
-        sessionStorage.setItem(key, JSON.stringify(fallbackValue));
-        return fallbackValue;
-    }
-    const stored = JSON.parse(storedItem);
+    const stored = JSON.parse(sessionStorage.getItem(key));
     if (!stored) {
         sessionStorage.setItem(key, JSON.stringify(fallbackValue));
         return fallbackValue;

package/build/Tooltip.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-export declare const Tooltip: (props: any) => React.JSX.Element[];
+export function Tooltip(props: any): React.JSX.Element[];
 export default Tooltip;
+import React from 'react';

package/build/Util.d.ts

@@ -1,7 +1,6 @@
-export declare const togglePanel: <T extends Record<string, any> = Record<string, any>>(name: string, panelStatus: Record<string, boolean>, setAttributes: (attributes: T) => void) => void;
-export declare const panelFocus: <T extends Record<string, any> = Record<string, any>>(name: string, panelStatus: Record<string, boolean>, setAttributes: (attributes: T) => void) => void;
-declare const _default: {
-    togglePanel: <T extends Record<string, any> = Record<string, any>>(name: string, panelStatus: Record<string, boolean>, setAttributes: (attributes: T) => void) => void;
-    panelFocus: <T extends Record<string, any> = Record<string, any>>(name: string, panelStatus: Record<string, boolean>, setAttributes: (attributes: T) => void) => void;
-};
+export function togglePanel(name: any, panelStatus: any, setAttributes: any): void;
+export function panelFocus(name: any): void;
+declare namespace _default {
+    export { togglePanel };
+}
 export default _default;

package/build/Util.js

@@ -3,9 +3,9 @@ export const togglePanel = (name, panelStatus, setAttributes) => {
     newStatus[name] = newStatus[name] == true ? false : true;
     setAttributes({ panelStatus: newStatus });
 };
-export const panelFocus = (name, panelStatus, setAttributes) => {
+export const panelFocus = (name) => {
     const newStatus = { ...panelStatus };
     newStatus[name] = newStatus[name] == true ? false : true;
     setAttributes({ panelFocus: newStatus });
 };
-export default { togglePanel, panelFocus };
+export default { togglePanel };

package/build/icons/Chart.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-export declare const ChartIcon: () => React.JSX.Element;
+export function ChartIcon(): React.JSX.Element;
 export default ChartIcon;
+import React from 'react';

package/build/icons/Generic.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-export declare const GenericIcon: () => React.JSX.Element;
+export function GenericIcon(): React.JSX.Element;
 export default GenericIcon;
+import React from 'react';

package/build/icons/index.d.ts

@@ -1,2 +1,2 @@
-export { GenericIcon } from './Generic';
-export { ChartIcon } from './Chart';
+export { GenericIcon } from "./Generic";
+export { ChartIcon } from "./Chart";