@mwater/visualization 5.4.0 → 5.4.2

package/lib/quickfilter/QuickfiltersDesignComponent.js

@@ -102,7 +102,7 @@ class QuickfiltersDesignComponent extends react_1.default.Component {
     };
     render() {
         return R("div", null, react_1.default.createElement(ListEditorComponent_1.ListEditorComponent, { items: this.props.design, onItemsChange: this.handleDesignChange, renderItem: this.renderQuickfilter, getReorderableKey: (item, index) => index }), this.props.tables.length > 0
-            ? R("button", { type: "button", className: "btn btn-sm btn-link", onClick: this.handleAdd }, R("span", { className: "fas fa-plus" }), T `Add Quick Filter`)
+            ? R("button", { type: "button", className: "btn btn-sm btn-link", onClick: this.handleAdd }, R("span", { className: "fas fa-plus me-1" }), T `Add Quick Filter`)
             : undefined);
     }
 }
@@ -138,39 +138,23 @@ class QuickfilterDesignComponent extends react_1.default.Component {
     render() {
         // Determine type of expression
         const exprType = new expressions_1.ExprUtils(this.props.schema).getExprType(this.props.design.expr);
-        return R("div", {}, R("div", { className: "mb-3 mt-1", key: "table" }, R("label", { className: "text-muted" }, T `Data Source`), R(ui.Select, {
-            value: this.state.table,
-            options: lodash_1.default.map(this.props.tables, (table) => ({
-                value: table,
-                label: expressions_1.ExprUtils.localizeString(this.props.schema.getTable(table).name)
-            })),
-            onChange: this.handleTableChange,
-            nullLabel: T `Select...`
-        })), R("div", { className: "mb-3", key: "expr" }, R("label", { className: "text-muted" }, T `Filter By`), R("div", null, R(expressions_ui_1.ExprComponent, {
-            schema: this.props.schema,
-            dataSource: this.props.dataSource,
-            table: this.state.table,
-            value: this.props.design.expr,
-            onChange: this.handleExprChange,
-            types: ["enum", "text", "enumset", "date", "datetime", "id[]", "text[]"],
-        }))), this.props.design.expr
-            ? R("div", { className: "mb-3", key: "label" }, R("label", { className: "text-muted" }, T `Label`), R("input", {
-                type: "text",
-                className: "form-control form-control-sm",
-                value: this.props.design.label || "",
-                onChange: this.handleLabelChange,
-                placeholder: T `Optional Label`
-            }))
-            : undefined, this.props.mergeable
-            ? R(ui.Checkbox, {
-                value: this.props.design.merged,
-                onChange: this.handleMergedChange
-            }, T `Merge with previous quickfilter `, R("span", { className: "text-muted" }, T `- displays as one single control that filters both`))
-            : undefined, ["enum", "text", "enumset", "id[]", "text[]"].includes(exprType)
-            ? R(ui.Checkbox, {
-                value: this.props.design.multi,
-                onChange: this.handleMultiChange
-            }, T `Allow multiple selections`)
-            : undefined);
+        return (react_1.default.createElement("div", null,
+            react_1.default.createElement("div", { className: "mb-3 mt-1", key: "table" },
+                react_1.default.createElement("label", { className: "text-muted" }, T `Data Source`),
+                react_1.default.createElement(ui.Select, { value: this.state.table, options: lodash_1.default.map(this.props.tables, (table) => ({
+                        value: table,
+                        label: expressions_1.ExprUtils.localizeString(this.props.schema.getTable(table).name)
+                    })), onChange: this.handleTableChange, nullLabel: T `Select...` })),
+            react_1.default.createElement("div", { className: "mb-3", key: "expr" },
+                react_1.default.createElement("label", { className: "text-muted" }, T `Filter By`),
+                react_1.default.createElement("div", null,
+                    react_1.default.createElement(expressions_ui_1.ExprComponent, { schema: this.props.schema, dataSource: this.props.dataSource, table: this.state.table, value: this.props.design.expr, onChange: this.handleExprChange, types: ["enum", "text", "enumset", "date", "datetime", "id[]", "text[]"] }))),
+            this.props.design.expr ? (react_1.default.createElement("div", { className: "mb-3", key: "label" },
+                react_1.default.createElement("label", { className: "text-muted" }, T `Label`),
+                react_1.default.createElement("input", { type: "text", className: "form-control form-control-sm", value: this.props.design.label || "", onChange: this.handleLabelChange, placeholder: T `Optional Label` }))) : undefined,
+            this.props.mergeable ? (react_1.default.createElement(ui.Checkbox, { value: this.props.design.merged, onChange: this.handleMergedChange },
+                T `Merge with previous quickfilter `,
+                react_1.default.createElement("span", { className: "text-muted" }, `- ${T `displays as one single control that filters both`}`))) : undefined,
+            ["enum", "text", "enumset", "id[]", "text[]"].includes(exprType) ? (react_1.default.createElement(ui.Checkbox, { value: this.props.design.multi, onChange: this.handleMultiChange }, T `Allow multiple selections`)) : undefined));
     }
 }

package/lib/richtext/ExprItemsHtmlConverter.d.ts

@@ -1,5 +1,6 @@
-import ItemsHtmlConverter, { HtmlItemBase } from "./ItemsHtmlConverter";
+import ItemsHtmlConverter, { HtmlItem, HtmlItemBase } from "./ItemsHtmlConverter";
 import { Expr, Schema } from "@mwater/expressions";
+/** Html item that is an expression */
 export interface HtmlItemExpr extends HtmlItemBase {
     type: "expr";
     /** unique id */
@@ -13,6 +14,8 @@ export interface HtmlItemExpr extends HtmlItemBase {
     /** d3 format if number */
     format?: string;
 }
+/** Html item that is an expression or a normal item */
+export type HtmlItemOrExpr = HtmlItem | HtmlItemExpr;
 /**
  * ItemsHtmlConverter that supports embedded mwater expressions
  * Converts items (JSON contents of rich text) to HTML and back to allow editing
@@ -35,5 +38,5 @@ export default class ExprItemsHtmlConverter extends ItemsHtmlConverter {
         [key: string]: string;
     }, locale?: string);
     convertSpecialItemToHtml(item: HtmlItemBase): string;
-    convertElemToItems(elem: HTMLElement): import("./ItemsHtmlConverter").HtmlItem[];
+    convertElemToItems(elem: HTMLElement): HtmlItem[];
 }

package/lib/richtext/ExprItemsHtmlConverter.js

@@ -46,7 +46,7 @@ class ExprItemsHtmlConverter extends ItemsHtmlConverter_1.default {
             if (this.summarizeExprs) {
                 text = new expressions_1.ExprUtils(this.schema).summarizeExpr(exprItem.expr, this.locale);
                 if (text.length > 30) {
-                    text = text.substr(0, 30) + T `...`;
+                    text = text.substr(0, 30) + `...`;
                 }
                 exprHtml = lodash_1.default.escape(text);
             }
@@ -67,7 +67,7 @@ class ExprItemsHtmlConverter extends ItemsHtmlConverter_1.default {
                     exprHtml = lodash_1.default.escape(text);
                 }
                 else {
-                    exprHtml = `<span style="color: #DDD">${T `---`}</span>`;
+                    exprHtml = `<span style="color: #DDD">${`---`}</span>`;
                 }
             }
             else {
@@ -76,13 +76,13 @@ class ExprItemsHtmlConverter extends ItemsHtmlConverter_1.default {
             }
             // Add label
             if (exprItem.includeLabel) {
-                const label = exprItem.labelText || new expressions_1.ExprUtils(this.schema).summarizeExpr(exprItem.expr, this.locale) + T `:\u00A0`;
+                const label = exprItem.labelText || new expressions_1.ExprUtils(this.schema).summarizeExpr(exprItem.expr, this.locale) + `:\u00A0`;
                 exprHtml = `<span class="text-muted">${lodash_1.default.escape(label)}</span>` + exprHtml;
             }
             if (this.designMode) {
                 html +=
                     `\u2060<span data-embed="${lodash_1.default.escape(JSON.stringify(item))}" class="mwater-visualization-text-widget-expr">` +
-                        (exprHtml || T `\u00A0`) +
+                        (exprHtml || `\u00A0`) +
                         `</span>\u2060`;
             }
             else {

package/lib/richtext/ExprItemsTranslator.d.ts

@@ -0,0 +1,5 @@
+import { HtmlItemOrExpr } from "./ExprItemsHtmlConverter";
+/** Gets all unique strings from html items */
+export declare function getHtmlItemsStrings(items: HtmlItemOrExpr[]): string[];
+/** Translates items in an html items list with expressions */
+export declare function translateHtmlItems(items: HtmlItemOrExpr[], translate: (input: string) => string): HtmlItemOrExpr[];

package/lib/richtext/ExprItemsTranslator.js

@@ -0,0 +1,149 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getHtmlItemsStrings = getHtmlItemsStrings;
+exports.translateHtmlItems = translateHtmlItems;
+const lodash_1 = __importDefault(require("lodash"));
+const immer_1 = require("immer");
+const ItemsHtmlConverter_1 = __importDefault(require("./ItemsHtmlConverter"));
+/** Gets all unique strings from html items */
+function getHtmlItemsStrings(items) {
+    const strings = new Set();
+    // Create collector function that just saves strings and returns them unchanged
+    const collectStrings = (str) => {
+        // Only collect non-empty strings
+        if (str) {
+            strings.add(str);
+        }
+        return str;
+    };
+    // Use existing translation function but with collector
+    translateHtmlItems(items, collectStrings);
+    return Array.from(strings);
+}
+/** Translates items in an html items list with expressions */
+function translateHtmlItems(items, translate) {
+    return (0, immer_1.produce)(items, draft => {
+        function translateItems(itemList) {
+            // Accumulate simple items
+            let simpleItems = [];
+            let simpleItemStartIndex = null;
+            /** Process accumulated simple nodes which are simple inline elements */
+            function processSimpleNodes() {
+                if (simpleItems.length === 0) {
+                    return;
+                }
+                // Create html string with {0}, {1}, etc. for expressions and html for other items
+                const expressions = [];
+                const converter = new TranslationItemsHtmlConverter(item => {
+                    if (item.type === "expr") {
+                        const expr = item;
+                        if (expr.labelText) {
+                            expr.labelText = translate(expr.labelText);
+                        }
+                        expressions.push(expr);
+                        return `{${expressions.length - 1}}`;
+                    }
+                    return "";
+                });
+                // Convert items to html which has the side effect of translating expressions
+                let html = converter.convertItemsToHtml(simpleItems);
+                // If there was no text, do nothing except translate expressions
+                if (!simpleItems.some(doesItemContainText)) {
+                    return;
+                }
+                // Remove leading and trailing whitespace from the HTML
+                const leftWhitespace = html.slice(0, html.length - html.trimStart().length);
+                const rightWhitespace = html.slice(html.trimEnd().length);
+                html = html.trim();
+                if (!html) {
+                    return;
+                }
+                let translatedHtml = leftWhitespace + translate(html) + rightWhitespace;
+                // Parse translatedHtml into items by first replacing {0}, {1}, etc. with html that can be converted to items
+                for (let i = 0; i < expressions.length; i++) {
+                    const expr = expressions[i];
+                    translatedHtml = translatedHtml.replace(new RegExp(`\\{${i}\\}`, "g"), `<span data-embed="${lodash_1.default.escape(JSON.stringify(expr))}"></span>`);
+                }
+                // Wrap in a div to prevent whitespace from being trimmed.
+                const translatedItems = (converter.convertElemToItems(new DOMParser().parseFromString("<div>" + translatedHtml + "</div>", "text/html").body.firstChild));
+                // Replace the simple items with the translated items
+                itemList.splice(simpleItemStartIndex, simpleItems.length, ...translatedItems);
+                simpleItems = [];
+                simpleItemStartIndex = null;
+            }
+            for (let i = 0; i < itemList.length; i++) {
+                const item = itemList[i];
+                // If the child is a simple node, add it to the list
+                if (isItemSimple(item)) {
+                    simpleItems.push(item);
+                    if (simpleItemStartIndex == null) {
+                        simpleItemStartIndex = i;
+                    }
+                }
+                else {
+                    // If we have gathered simple nodes, we need to return/replace them
+                    processSimpleNodes();
+                    simpleItemStartIndex = null;
+                    simpleItems = [];
+                    // Handle the current node
+                    if (typeof item !== "string" && item.type === "element" && item.items) {
+                        translateItems(item.items);
+                    }
+                }
+            }
+            if (simpleItems.length > 0) {
+                processSimpleNodes();
+                simpleItemStartIndex = null;
+                simpleItems = [];
+            }
+        }
+        translateItems(draft);
+    });
+}
+/** ItemsHtmlConverter that has a callback for handling special items */
+class TranslationItemsHtmlConverter extends ItemsHtmlConverter_1.default {
+    handleSpecialItem;
+    constructor(handleSpecialItem) {
+        super();
+        this.handleSpecialItem = handleSpecialItem;
+    }
+    convertSpecialItemToHtml(item) {
+        return this.handleSpecialItem(item);
+    }
+}
+/**
+ * Check if an html item is simple.
+ * A node is simple if it is:
+ *  - a string
+ *  - a tag that is a "b", "i", "u", "a", "strong", "em" tag with no children or only simple children
+ * Only sequences of simple nodes are exported to translation entries as HTML.
+ */
+function isItemSimple(node) {
+    if (typeof node === "string") {
+        return true;
+    }
+    if (node.type === "expr") {
+        return true;
+    }
+    if (node.type === "element") {
+        const element = node;
+        if (["b", "i", "u", "a", "strong", "em"].indexOf(element.tag) === -1) {
+            return false;
+        }
+        return (element.items || []).every(child => isItemSimple(child));
+    }
+    return false;
+}
+/** Determines if an item contains any non-empty text strings */
+function doesItemContainText(item) {
+    if (typeof item === "string") {
+        return item.trim().length > 0;
+    }
+    if (item.type === "element") {
+        return (item.items || []).some(child => doesItemContainText(child));
+    }
+    return false;
+}

package/lib/richtext/ItemsHtmlConverter.d.ts

@@ -25,7 +25,7 @@ export default class ItemsHtmlConverter {
     constructor(namedStrings?: {
         [key: string]: string;
     });
-    convertItemsToHtml(items: any): string;
+    convertItemsToHtml(items: HtmlItem[]): string;
     convertSpecialItemToHtml(item: HtmlItemBase): string;
     convertElemToItems(elem: HTMLElement): HtmlItem[];
 }

package/lib/richtext/ItemsHtmlConverter.js

@@ -50,18 +50,19 @@ class ItemsHtmlConverter {
                 html += lodash_1.default.escape(itemStr);
             }
             else if (item.type === "element") {
-                if (!allowedTags[item.tag]) {
+                const element = item;
+                if (!allowedTags[element.tag]) {
                     // Ignore and do contents
-                    html += this.convertItemsToHtml(item.items);
+                    html += this.convertItemsToHtml(element.items || []);
                     continue;
                 }
                 let attrs = "";
                 // Add style
-                if (item.style) {
+                if (element.style) {
                     attrs += ' style="';
                     let first = true;
-                    for (let key in item.style) {
-                        const value = item.style[key];
+                    for (let key in element.style) {
+                        const value = element.style[key];
                         if (!allowedStyles[key]) {
                             continue;
                         }
@@ -77,19 +78,19 @@ class ItemsHtmlConverter {
                     attrs += '"';
                 }
                 // Add href
-                if (item.href) {
-                    attrs += ' href="' + item.href + '"';
+                if (element.href) {
+                    attrs += ' href="' + element.href + '"';
                 }
                 // Add target
-                if (item.target) {
-                    attrs += ' target="' + lodash_1.default.escape(item.target) + '"';
+                if (element.target) {
+                    attrs += ' target="' + lodash_1.default.escape(element.target) + '"';
                 }
                 // Special case for self-closing tags
-                if (["br"].includes(item.tag)) {
-                    html += `<${item.tag}${attrs}>`;
+                if (["br"].includes(element.tag)) {
+                    html += `<${element.tag}${attrs}>`;
                 }
                 else {
-                    html += `<${item.tag}${attrs}>` + this.convertItemsToHtml(item.items) + `</${item.tag}>`;
+                    html += `<${element.tag}${attrs}>` + this.convertItemsToHtml(element.items || []) + `</${element.tag}>`;
                 }
             }
             else {
@@ -101,6 +102,8 @@ class ItemsHtmlConverter {
             html = "\u2060";
         }
         // console.log "createHtml: #{html}"
+        // console.log("convertItemsToHtml: " + JSON.stringify(items, null, 2))
+        // console.log("convertItemsToHtml: " + html)
         return html;
     }
     // Converts an item that is not an element to html. Override in subclass.
@@ -138,14 +141,19 @@ class ItemsHtmlConverter {
                 const nodeElement = node;
                 if (nodeElement.style != null) {
                     const styleDeclaration = nodeElement.style;
-                    for (const style of styleDeclaration) {
+                    for (let i = 0; i < styleDeclaration.length; i++) {
+                        const style = styleDeclaration[i];
                         if (!allowedStyles[style]) {
                             continue;
                         }
-                        const value = styleDeclaration[style];
+                        const value = styleDeclaration.getPropertyValue(style);
                         if (value == null || value === "") {
                             continue;
                         }
+                        // Ignore bootstrap variables in style values
+                        if (value.startsWith("var(--bs-")) {
+                            continue;
+                        }
                         item.style = item.style || {};
                         item.style[style] = value;
                     }
@@ -168,7 +176,13 @@ class ItemsHtmlConverter {
                 if (node.target) {
                     item.target = node.target;
                 }
-                items.push(item);
+                // Unwrap pointless span elements that have no style and one child
+                if (tag === "span" && item.style == null && item.items?.length === 1) {
+                    items.push(item.items[0]);
+                }
+                else {
+                    items.push(item);
+                }
                 // Handle text
             }
             else if (node.nodeType === 3) {
@@ -181,6 +195,8 @@ class ItemsHtmlConverter {
             }
         }
         // console.log JSON.stringify(items, null, 2)
+        // console.log("convertElemToItems: " + elem.outerHTML)
+        // console.log("convertElemToItems: " + JSON.stringify(items, null, 2))
         return items;
     }
 }

package/lib/wellknown.js

@@ -23,7 +23,7 @@ exports.parse = parse;
 exports.stringify = stringify;
 const numberRegexp = /[-+]?([0-9]*\.[0-9]+|[0-9]+)([eE][-+]?[0-9]+)?/;
 // Matches sequences like '100 100' or '100 100 100'.
-const tuples = new RegExp('^' + numberRegexp.source + '(\\s' + numberRegexp.source + '){1,}');
+const tuples = new RegExp('^' + numberRegexp.source + '(\\s' + numberRegexp.source + '){1,3}');
 /*
  * Parse WKT and return GeoJSON.
  *
@@ -91,7 +91,9 @@ function parse(input) {
                 stack[stack.length - 1].push(pointer);
             }
             else if (!elem.split(/\s/g).some(s => isNaN(s))) {
-                Array.prototype.push.apply(pointer, elem.split(/\s/g).map(parseFloat));
+                // Split into values and only take first 3 if there are 4 (ZM coordinates)
+                const values = elem.split(/\s/g).map(parseFloat);
+                Array.prototype.push.apply(pointer, values.length === 4 ? values.slice(0, 3) : values);
             }
             else {
                 return null;
@@ -116,7 +118,8 @@ function parse(input) {
             else if (!pt.split(/\s/g).some(s => isNaN(s))) {
                 if (!item)
                     item = [];
-                Array.prototype.push.apply(item, pt.split(/\s/g).map(parseFloat));
+                const values = pt.split(/\s/g).map(parseFloat);
+                Array.prototype.push.apply(item, values.length === 4 ? values.slice(0, 3) : values);
             }
             white();
         }
@@ -127,7 +130,7 @@ function parse(input) {
         return list.length ? list : null;
     }
     function point() {
-        if (!$(/^(point(\sz)?)/i))
+        if (!$(/^(point(\s+zm|\s+z)?)/i))
             return null;
         white();
         if (!$(/^(\()/))
@@ -144,7 +147,7 @@ function parse(input) {
         };
     }
     function multipoint() {
-        if (!$(/^(multipoint(\sz)?)/i))
+        if (!$(/^(multipoint(\s+zm|\s+z)?)/i))
             return null;
         white();
         let newCoordsFormat = _
@@ -162,7 +165,7 @@ function parse(input) {
         };
     }
     function multilinestring() {
-        if (!$(/^(multilinestring(\sz)?)/i))
+        if (!$(/^(multilinestring(\s+zm|\s+z)?)/i))
             return null;
         white();
         let c = multicoords();
@@ -175,7 +178,7 @@ function parse(input) {
         };
     }
     function linestring() {
-        if (!$(/^(linestring(\sz)?)/i))
+        if (!$(/^(linestring(\s+zm|\s+z)?)/i))
             return null;
         white();
         if (!$(/^(\()/))
@@ -191,7 +194,7 @@ function parse(input) {
         };
     }
     function polygon() {
-        if (!$(/^(polygon(\sz)?)/i))
+        if (!$(/^(polygon(\s+zm|\s+z)?)/i))
             return null;
         white();
         let c = multicoords();
@@ -203,7 +206,7 @@ function parse(input) {
         };
     }
     function multipolygon() {
-        if (!$(/^(multipolygon(\sz)?)/i))
+        if (!$(/^(multipolygon(\s+zm|\s+z)?)/i))
             return null;
         white();
         let c = multicoords();

package/lib/widgets/IFrameWidget.d.ts

@@ -2,13 +2,13 @@ import React from "react";
 import Widget, { CreateViewElementOptions } from "./Widget";
 export default class IFrameWidget extends Widget {
     createViewElement(options: CreateViewElementOptions): React.CElement<{
-        design: object;
-        onDesignChange: ((design: object) => void) | null | undefined;
+        design: any;
+        onDesignChange: ((design: any) => void) | null | undefined;
         width: number | undefined;
         height: number | undefined;
     }, React.Component<{
-        design: object;
-        onDesignChange: ((design: object) => void) | null | undefined;
+        design: any;
+        onDesignChange: ((design: any) => void) | null | undefined;
         width: number | undefined;
         height: number | undefined;
     }, any, any>>;

package/lib/widgets/ImageWidget.d.ts

@@ -27,23 +27,26 @@ export default class ImageWidget extends Widget {
         dataSource: DataSource;
         widgetDataSource: import("./WidgetDataSource").WidgetDataSource;
         filters: JsonQLFilter[];
-        design: object;
-        onDesignChange: ((design: object) => void) | null | undefined;
+        design: any;
+        onDesignChange: ((design: any) => void) | null | undefined;
         width: number | undefined;
         height: number | undefined;
         singleRowTable: string | undefined;
+        translate: (input: string) => string;
     }, React.Component<{
         schema: Schema;
         dataSource: DataSource;
         widgetDataSource: import("./WidgetDataSource").WidgetDataSource;
         filters: JsonQLFilter[];
-        design: object;
-        onDesignChange: ((design: object) => void) | null | undefined;
+        design: any;
+        onDesignChange: ((design: any) => void) | null | undefined;
         width: number | undefined;
         height: number | undefined;
         singleRowTable: string | undefined;
+        translate: (input: string) => string;
     }, any, any>>;
     getData(design: ImageWidgetDesign, schema: Schema, dataSource: DataSource, filters: JsonQLFilter[], callback: any): any;
     isAutoHeight(): boolean;
     getFilterableTables(design: any, schema: Schema): any[];
+    getTranslatableStrings(design: ImageWidgetDesign, schema: Schema): string[];
 }

package/lib/widgets/ImageWidget.js

@@ -35,7 +35,8 @@ class ImageWidget extends Widget_1.default {
             onDesignChange: options.onDesignChange,
             width: options.width,
             height: options.height,
-            singleRowTable: options.singleRowTable
+            singleRowTable: options.singleRowTable,
+            translate: options.translate
         });
     }
     // Get the data that the widget needs. This will be called on the server, typically.
@@ -108,5 +109,12 @@ class ImageWidget extends Widget_1.default {
         }
         return [];
     }
+    getTranslatableStrings(design, schema) {
+        const strings = [];
+        if (design.caption) {
+            strings.push(design.caption);
+        }
+        return strings;
+    }
 }
 exports.default = ImageWidget;

package/lib/widgets/ImageWidgetComponent.d.ts

@@ -17,6 +17,7 @@ export interface ImageWidgetComponentProps {
     width: number;
     height: number;
     singleRowTable?: string;
+    translate: (input: string) => string;
 }
 export default class ImageWidgetComponent extends AsyncLoadComponent<ImageWidgetComponentProps, {
     data: any;

package/lib/widgets/ImageWidgetComponent.js

@@ -143,7 +143,7 @@ class ImageWidgetComponent extends AsyncLoadComponent_1.default {
             : R("div", {
                 className: "mwater-visualization-image-widget",
                 style: { position: "relative", width: this.props.width, height: this.props.height }
-            }, captionPosition === "top" ? R("div", { className: "caption" }, this.props.design.caption) : undefined, R("div", { className: "image" }, this.renderContent()), captionPosition === "bottom" ? R("div", { className: "caption" }, this.props.design.caption) : undefined));
+            }, captionPosition === "top" && this.props.design.caption ? R("div", { className: "caption" }, this.props.translate(this.props.design.caption)) : undefined, R("div", { className: "image" }, this.renderContent()), captionPosition === "bottom" && this.props.design.caption ? R("div", { className: "caption" }, this.props.translate(this.props.design.caption)) : undefined));
     }
 }
 exports.default = ImageWidgetComponent;

package/lib/widgets/MapWidget.d.ts

@@ -1,52 +1,9 @@
 import React from "react";
 import Widget, { CreateViewElementOptions } from "./Widget";
-import ModalWindowComponent from "@mwater/react-library/lib/ModalWindowComponent";
-import { DataSource, Schema } from "@mwater/expressions";
-import { WidgetDataSource } from "./WidgetDataSource";
+import { Schema } from "@mwater/expressions";
+import { MapDesign } from "../maps/MapDesign";
 export default class MapWidget extends Widget {
-    createViewElement(options: CreateViewElementOptions): React.CElement<any, MapWidgetComponent>;
-    getFilterableTables(design: any, schema: Schema): string[];
+    createViewElement(options: CreateViewElementOptions): React.JSX.Element;
+    getFilterableTables(design: MapDesign, schema: Schema): string[];
+    getTranslatableStrings(design: MapDesign, schema: Schema): string[];
 }
-interface MapWidgetComponentProps {
-    /** Schema to use */
-    schema: Schema;
-    /** Data source to use */
-    dataSource: DataSource;
-    widgetDataSource: WidgetDataSource;
-    /** See Map Design.md */
-    design: any;
-    /** Called with new design.  null/undefined for readonly */
-    onDesignChange?: any;
-    width?: number;
-    height?: number;
-    /** scope of the widget (when the widget self-selects a particular scope) */
-    scope?: any;
-    /** array of filters to apply. Each is { table: table id, jsonql: jsonql condition with {alias} for tableAlias. Use injectAlias to correct */
-    filters?: any;
-    /** called with (scope) as a scope to apply to self and filter to apply to other widgets. See WidgetScoper for details */
-    onScopeChange?: any;
-    onRowClick?: any;
-    /** TODO: implement refreshing */
-    refreshKey?: any;
-}
-interface MapWidgetComponentState {
-    editDesign: any;
-    transientDesign: any;
-}
-declare class MapWidgetComponent extends React.Component<MapWidgetComponentProps, MapWidgetComponentState> {
-    constructor(props: any);
-    componentDidUpdate(prevProps: any): void;
-    handleStartEditing: () => void;
-    handleEndEditing: () => void;
-    handleEditDesignChange: (design: any) => void;
-    renderEditor(): React.CElement<import("@mwater/react-library/lib/ModalWindowComponent").ModalWindowComponentProps, ModalWindowComponent> | null;
-    renderContent(design: any, onDesignChange: any, width: any, height: any): React.DetailedReactHTMLElement<{
-        style: {
-            width: any;
-            height: any;
-            padding: number;
-        };
-    }, HTMLElement>;
-    render(): React.DetailedReactHTMLElement<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-}
-export {};