@mwater/visualization 5.0.0

package/lib/DateRangeComponent.js

@@ -0,0 +1,190 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const lodash_1 = __importDefault(require("lodash"));
+const react_1 = __importDefault(require("react"));
+const R = react_1.default.createElement;
+const moment_1 = __importDefault(require("moment"));
+const react_onclickout_1 = __importDefault(require("react-onclickout"));
+const react_datepicker_1 = __importDefault(require("react-datepicker"));
+// Allows selection of a date range
+class DateRangeComponent extends react_1.default.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            dropdownOpen: false,
+            custom: false // True when custom dates displayed
+        };
+    }
+    toMoment(value) {
+        if (!value) {
+            return null;
+        }
+        if (this.props.datetime) {
+            return (0, moment_1.default)(value, moment_1.default.ISO_8601);
+        }
+        else {
+            return (0, moment_1.default)(value, "YYYY-MM-DD");
+        }
+    }
+    fromMoment(value) {
+        if (!value) {
+            return null;
+        }
+        if (this.props.datetime) {
+            return value.toISOString();
+        }
+        else {
+            return value.format("YYYY-MM-DD");
+        }
+    }
+    handleClickOut = () => {
+        return this.setState({ dropdownOpen: false });
+    };
+    handleStartChange = (value) => {
+        // Go to start of day if datetime
+        if (this.props.datetime) {
+            value = (0, moment_1.default)(value);
+            value.startOf("day");
+        }
+        // Clear end if after
+        if (this.props.value?.[1] && this.fromMoment(value) > this.props.value[1]) {
+            return this.props.onChange([this.fromMoment(value), null]);
+        }
+        else {
+            return this.props.onChange([this.fromMoment(value), this.props.value?.[1] ?? null]);
+        }
+    };
+    handleEndChange = (value) => {
+        // Go to end of day if datetime
+        if (this.props.datetime) {
+            value = (0, moment_1.default)(value);
+            value.endOf("day");
+        }
+        // Clear start if before
+        if (this.props.value?.[0] && this.fromMoment(value) < this.props.value[0]) {
+            this.props.onChange([null, this.fromMoment(value)]);
+        }
+        else {
+            this.props.onChange([this.props.value?.[0] ?? null, this.fromMoment(value)]);
+        }
+        return this.setState({ dropdownOpen: false });
+    };
+    handlePreset = (preset) => {
+        // Go to start/end of day if datetime
+        let end, start;
+        if (this.props.datetime) {
+            start = (0, moment_1.default)(preset.value[0]);
+            start.startOf("day");
+            end = (0, moment_1.default)(preset.value[1]);
+            end.endOf("day");
+        }
+        else {
+            start = preset.value[0];
+            end = preset.value[1];
+        }
+        this.props.onChange([this.fromMoment(start), this.fromMoment(end)]);
+        return this.setState({ dropdownOpen: false });
+    };
+    getPresets() {
+        const presets = [
+            { label: "Today", value: [(0, moment_1.default)(), (0, moment_1.default)()] },
+            { label: "Yesterday", value: [(0, moment_1.default)().subtract(1, "days"), (0, moment_1.default)().subtract(1, "days")] },
+            { label: "Last 7 Days", value: [(0, moment_1.default)().subtract(6, "days"), (0, moment_1.default)()] },
+            { label: "Last 30 Days", value: [(0, moment_1.default)().subtract(29, "days"), (0, moment_1.default)()] },
+            { label: "This Month", value: [(0, moment_1.default)().startOf("month"), (0, moment_1.default)().endOf("month")] },
+            {
+                label: "Last Month",
+                value: [(0, moment_1.default)().subtract(1, "months").startOf("month"), (0, moment_1.default)().subtract(1, "months").endOf("month")]
+            },
+            { label: "This Year", value: [(0, moment_1.default)().startOf("year"), (0, moment_1.default)().endOf("year")] },
+            {
+                label: "Last Year",
+                value: [(0, moment_1.default)().subtract(1, "years").startOf("year"), (0, moment_1.default)().subtract(1, "years").endOf("year")]
+            }
+        ];
+        return presets;
+    }
+    renderClear = () => {
+        return R("div", {
+            style: { position: "absolute", right: 10, top: 7, color: "#AAA" },
+            onClick: () => this.props.onChange(null)
+        }, R("i", { className: "fa fa-remove" }));
+    };
+    renderSummary() {
+        if (!this.props.value) {
+            return R("span", { className: "text-muted" }, "All Dates");
+        }
+        const startDate = this.toMoment(this.props.value[0]);
+        const endDate = this.toMoment(this.props.value[1]);
+        return (startDate ? startDate.format("ll") : "") + " - " + (endDate ? endDate.format("ll") : "");
+    }
+    renderPresets() {
+        return R("div", {
+            style: {
+                position: "absolute",
+                top: "100%",
+                left: 0,
+                zIndex: 4000,
+                padding: 5,
+                border: "solid 1px #AAA",
+                backgroundColor: "white",
+                borderRadius: 4
+            }
+        }, R("ul", { className: "nav nav-pills flex-column" }, lodash_1.default.map(this.getPresets(), (preset) => {
+            return R("li", { className: "nav-item" }, R("a", { className: "nav-link", style: { padding: 5 }, onClick: this.handlePreset.bind(null, preset) }, preset.label));
+        }), R("li", { className: "nav-item" }, R("a", { className: "nav-link", style: { padding: 5 }, onClick: () => this.setState({ custom: true }) }, "Custom Date Range..."))));
+    }
+    renderCustomDropdown() {
+        const startDate = this.toMoment(this.props.value?.[0]);
+        const endDate = this.toMoment(this.props.value?.[1]);
+        return R("div", {
+            style: {
+                position: "absolute",
+                top: "100%",
+                left: 0,
+                zIndex: 4000,
+                padding: 5,
+                border: "solid 1px #AAA",
+                backgroundColor: "white",
+                borderRadius: 4
+            }
+        }, R("div", { style: { whiteSpace: "nowrap" } }, R("div", { style: { display: "inline-block", verticalAlign: "top" } }, R(react_datepicker_1.default, {
+            inline: true,
+            selectsStart: true,
+            selected: startDate,
+            startDate: startDate ?? undefined,
+            endDate: endDate ?? undefined,
+            showYearDropdown: true,
+            onChange: this.handleStartChange
+        })), R("div", { style: { display: "inline-block", verticalAlign: "top" } }, R(react_datepicker_1.default, {
+            inline: true,
+            selectsEnd: true,
+            selected: endDate,
+            startDate: startDate ?? undefined,
+            endDate: endDate ?? undefined,
+            showYearDropdown: true,
+            onChange: this.handleEndChange
+        }))));
+    }
+    renderDropdown() {
+        if (this.state.custom) {
+            return this.renderCustomDropdown();
+        }
+        else {
+            return this.renderPresets();
+        }
+    }
+    render() {
+        return R(react_onclickout_1.default, { onClickOut: this.handleClickOut }, R("div", { style: { display: "inline-block", position: "relative" } }, R("div", {
+            style: { width: 220 },
+            className: "form-control",
+            onClick: () => this.setState({ dropdownOpen: true, custom: false })
+        }, this.renderSummary()), 
+        // Clear button
+        this.props.value && this.props.onChange != null ? this.renderClear() : undefined, this.state.dropdownOpen ? this.renderDropdown() : undefined));
+    }
+}
+exports.default = DateRangeComponent;

package/lib/FiltersDesignerComponent.d.ts

@@ -0,0 +1,25 @@
+import PropTypes from "prop-types";
+import React from "react";
+import { DataSource, Expr, Schema } from "@mwater/expressions";
+export interface FiltersDesignerComponentProps {
+    /** Schema to use */
+    schema: Schema;
+    /** Data source to use */
+    dataSource: DataSource;
+    /** Tables that can be filtered on. Should only include tables that actually exist */
+    filterableTables?: string[];
+    filters?: {
+        [tableId: string]: Expr;
+    };
+    onFiltersChange: (filters: {
+        [tableId: string]: Expr;
+    }) => void;
+}
+export default class FiltersDesignerComponent extends React.Component<FiltersDesignerComponentProps> {
+    static contextTypes: {
+        locale: PropTypes.Requireable<string>;
+    };
+    handleFilterChange: (table: any, expr: any) => void;
+    renderFilterableTable: (table: any) => React.DetailedReactHTMLElement<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+    render(): React.DetailedReactHTMLElement<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+}

package/lib/FiltersDesignerComponent.js

@@ -0,0 +1,38 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const lodash_1 = __importDefault(require("lodash"));
+const prop_types_1 = __importDefault(require("prop-types"));
+const react_1 = __importDefault(require("react"));
+const R = react_1.default.createElement;
+const expressions_ui_1 = require("@mwater/expressions-ui");
+const expressions_1 = require("@mwater/expressions");
+const expressions_2 = require("@mwater/expressions");
+// Designer for filters of multiple tables. Used for maps and dashboards
+// Filters are in format mwater-expression filter expression indexed by table. e.g. { sometable: logical expression, etc. }
+class FiltersDesignerComponent extends react_1.default.Component {
+    static contextTypes = { locale: prop_types_1.default.string };
+    handleFilterChange = (table, expr) => {
+        // Clean filter
+        expr = new expressions_1.ExprCleaner(this.props.schema).cleanExpr(expr, { table });
+        const filters = lodash_1.default.clone(this.props.filters || {});
+        filters[table] = expr;
+        return this.props.onFiltersChange(filters);
+    };
+    renderFilterableTable = (table) => {
+        const name = expressions_2.ExprUtils.localizeString(this.props.schema.getTable(table).name, this.context.locale);
+        return R("div", { key: table }, R("label", null, name), react_1.default.createElement(expressions_ui_1.FilterExprComponent, {
+            schema: this.props.schema,
+            dataSource: this.props.dataSource,
+            onChange: this.handleFilterChange.bind(null, table),
+            table,
+            value: this.props.filters?.[table]
+        }));
+    };
+    render() {
+        return R("div", null, lodash_1.default.map(this.props.filterableTables || [], this.renderFilterableTable));
+    }
+}
+exports.default = FiltersDesignerComponent;

package/lib/ImplicitFilterBuilder.d.ts

@@ -0,0 +1,8 @@
+import { Schema } from "@mwater/expressions";
+import { JsonQLFilter } from "./JsonQLFilter";
+export default class ImplicitFilterBuilder {
+    schema: Schema;
+    constructor(schema: Schema);
+    findJoins(filterableTables: any): any;
+    extendFilters(filterableTables: string[], filters: JsonQLFilter[]): JsonQLFilter[];
+}

package/lib/ImplicitFilterBuilder.js

@@ -0,0 +1,114 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const lodash_1 = __importDefault(require("lodash"));
+const expressions_1 = require("@mwater/expressions");
+const expressions_2 = require("@mwater/expressions");
+// Given a series of explicit filters on tables (array of { table: table id, jsonql: JsonQL with {alias} for the table name to filter by })
+// extends the filters to all filterable tables with a single 1-n relationship.
+// For example, a given community has N water points. If communities are filtered, we want to filter water points as well since there is a
+// clear parent-child relationship (specifically, a single n-1 join between water points and communities)
+class ImplicitFilterBuilder {
+    schema;
+    constructor(schema) {
+        this.schema = schema;
+    }
+    // Find joins between parent and child tables that can be used to extend explicit filters.
+    // To be a useable join, must be only n-1 join between child and parent and child must be filterable table
+    // filterableTables: array of table ids of filterable tables
+    // Returns list of { table, column } of joins from child to parent
+    findJoins(filterableTables) {
+        let allJoins = [];
+        // For each filterable table
+        for (var filterableTable of filterableTables) {
+            const table = this.schema.getTable(filterableTable);
+            if (!table) {
+                continue;
+            }
+            // Find n-1 joins to another filterable table that are not self-references
+            let joins = lodash_1.default.filter(this.schema.getColumns(filterableTable), (column) => (column.type === "join" && column.join.type === "n-1" && column.join.toTable !== filterableTable) ||
+                (column.type === "id" && column.idTable !== filterableTable));
+            // Only keep if singular
+            joins = lodash_1.default.flatten(lodash_1.default.filter(lodash_1.default.values(lodash_1.default.groupBy(joins, (join) => (join.type === "id" ? join.idTable : join.join.toTable))), (list) => list.length === 1));
+            allJoins = allJoins.concat(lodash_1.default.map(joins, (join) => ({
+                table: filterableTable,
+                column: join.id
+            })));
+        }
+        return allJoins;
+    }
+    // Extends filters to include implicit filters
+    // filterableTables: array of table ids of filterable tables
+    // filters: array of { table: table id, jsonql: JsonQL with {alias} for the table name to filter by } of explicit filters
+    // returns similar array, but including any extra implicit filters
+    extendFilters(filterableTables, filters) {
+        const implicitFilters = [];
+        // Find joins
+        const joins = this.findJoins(filterableTables);
+        const exprCompiler = new expressions_2.ExprCompiler(this.schema);
+        // For each join, find filters on parent table
+        for (var join of joins) {
+            const parentFilters = lodash_1.default.filter(filters, (f) => {
+                const column = this.schema.getColumn(join.table, join.column);
+                return f.table === (column.type === "join" ? column.join.toTable : column.idTable) && f.jsonql;
+            });
+            if (parentFilters.length === 0) {
+                continue;
+            }
+            const joinColumn = this.schema.getColumn(join.table, join.column);
+            // Create where exists with join to parent table (filtered) OR no parent exists
+            const implicitFilter = {
+                table: join.table,
+                jsonql: {
+                    type: "op",
+                    op: "or",
+                    exprs: [
+                        {
+                            type: "op",
+                            op: "exists",
+                            exprs: [
+                                {
+                                    type: "scalar",
+                                    // select null
+                                    expr: null,
+                                    from: {
+                                        type: "table",
+                                        table: joinColumn.type === "id" ? joinColumn.idTable : joinColumn.join.toTable,
+                                        alias: "explicit"
+                                    },
+                                    where: {
+                                        type: "op",
+                                        op: "and",
+                                        exprs: [
+                                            // Join two tables
+                                            exprCompiler.compileJoin(join.table, joinColumn, "{alias}", "explicit")
+                                        ]
+                                    }
+                                }
+                            ]
+                        },
+                        {
+                            type: "op",
+                            op: "is null",
+                            exprs: [
+                                exprCompiler.compileExpr({
+                                    expr: { type: "field", table: join.table, column: join.column },
+                                    tableAlias: "{alias}"
+                                })
+                            ]
+                        }
+                    ]
+                }
+            };
+            // Add filters
+            for (let parentFilter of parentFilters) {
+                implicitFilter.jsonql.exprs[0].exprs[0].where.exprs.push((0, expressions_1.injectTableAlias)(parentFilter.jsonql, "explicit"));
+            }
+            implicitFilters.push(implicitFilter);
+        }
+        return filters.concat(implicitFilters);
+    }
+}
+exports.default = ImplicitFilterBuilder;

package/lib/JsonQLFilter.d.ts

@@ -0,0 +1,7 @@
+import { JsonQLExpr } from "@mwater/jsonql";
+/** Filter on a table, defined in JsonQL */
+export interface JsonQLFilter {
+    table: string;
+    /** jsonql condition with {alias} for tableAlias. Use injectAlias to correct */
+    jsonql: JsonQLExpr;
+}

package/lib/JsonQLFilter.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/LocaleContextInjector.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import PropTypes from "prop-types";
+/** Adds the locale to the context */
+export default class LocaleContextInjector extends React.Component<{
+    locale: string;
+}> {
+    static childContextTypes: {
+        locale: PropTypes.Requireable<string>;
+    };
+    getChildContext(): {
+        locale: string;
+    };
+    render(): React.ReactNode;
+}

package/lib/LocaleContextInjector.js

@@ -0,0 +1,20 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const prop_types_1 = __importDefault(require("prop-types"));
+/** Adds the locale to the context */
+class LocaleContextInjector extends react_1.default.Component {
+    static childContextTypes = {
+        locale: prop_types_1.default.string
+    };
+    getChildContext() {
+        return { locale: this.props.locale };
+    }
+    render() {
+        return this.props.children;
+    }
+}
+exports.default = LocaleContextInjector;

package/lib/MWaterAddRelatedFormComponent.d.ts

@@ -0,0 +1,25 @@
+import React from "react";
+import { Schema } from "@mwater/expressions";
+export interface MWaterAddRelatedFormComponentProps {
+    /** Entities or assets table id */
+    table: string;
+    apiUrl: string;
+    client?: string;
+    /** User id */
+    user?: string;
+    /** Called with table id e.g. responses:someid */
+    onSelect: (tableId: string) => void;
+    schema: Schema;
+}
+interface MWaterAddRelatedFormComponentState {
+    waitingForTable: any;
+    open: boolean;
+}
+export default class MWaterAddRelatedFormComponent extends React.Component<MWaterAddRelatedFormComponentProps, MWaterAddRelatedFormComponentState> {
+    constructor(props: MWaterAddRelatedFormComponentProps);
+    componentWillReceiveProps(nextProps: any): void;
+    handleOpen: () => void;
+    handleSelect: (table: any) => void;
+    render(): React.DetailedReactHTMLElement<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+}
+export {};

package/lib/MWaterAddRelatedFormComponent.js

@@ -0,0 +1,155 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jquery_1 = __importDefault(require("jquery"));
+const prop_types_1 = __importDefault(require("prop-types"));
+const lodash_1 = __importDefault(require("lodash"));
+const react_1 = __importDefault(require("react"));
+const R = react_1.default.createElement;
+const moment_1 = __importDefault(require("moment"));
+const ModalPopupComponent_1 = __importDefault(require("@mwater/react-library/lib/ModalPopupComponent"));
+const querystring_1 = __importDefault(require("querystring"));
+const expressions_1 = require("@mwater/expressions");
+const ui = __importStar(require("./UIComponents"));
+const formUtils = __importStar(require("@mwater/forms/lib/formUtils")); // TODO requireing this directly because of bizarre backbone issue
+// Link that when clicked popup up a modal window allowing user to select a form
+// with an Entity/Site question to the extraTables
+class MWaterAddRelatedFormComponent extends react_1.default.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            open: false,
+            waitingForTable: null // Set to table id that is being waited for as the result of being selected
+        };
+    }
+    componentWillReceiveProps(nextProps) {
+        // If waiting and table has arrived, cancel waiting
+        if (this.state.waitingForTable && nextProps.schema.getTable(this.state.waitingForTable)) {
+            return this.setState({ waitingForTable: null });
+        }
+    }
+    handleOpen = () => {
+        return this.setState({ open: true });
+    };
+    handleSelect = (table) => {
+        this.setState({ open: false });
+        // Wait for table if not in schema
+        if (!this.props.schema.getTable(table)) {
+            this.setState({ waitingForTable: table });
+        }
+        return this.props.onSelect(table);
+    };
+    render() {
+        return R("div", null, this.state.waitingForTable
+            ? R("div", null, R("i", { className: "fa fa-spin fa-spinner" }), " Adding...")
+            : R("a", { className: "btn btn-link", onClick: this.handleOpen }, "+ Add Related Survey"), this.state.open
+            ? R(AddRelatedFormModalComponent, {
+                table: this.props.table,
+                apiUrl: this.props.apiUrl,
+                client: this.props.client,
+                user: this.props.user,
+                onSelect: this.handleSelect,
+                onCancel: () => this.setState({ open: false })
+            })
+            : undefined);
+    }
+}
+exports.default = MWaterAddRelatedFormComponent;
+/** Actual modal that displays the list of forms */
+class AddRelatedFormModalComponent extends react_1.default.Component {
+    static contextTypes = { locale: prop_types_1.default.string };
+    constructor(props) {
+        super(props);
+        this.state = {
+            items: null,
+            search: ""
+        };
+    }
+    componentDidMount() {
+        // Get all forms visible to user
+        const query = {};
+        query.selector = JSON.stringify({ state: { $ne: "deleted" } });
+        if (this.props.client) {
+            query.client = this.props.client;
+        }
+        // Get list of all form names
+        return jquery_1.default.getJSON(this.props.apiUrl + "forms?" + querystring_1.default.stringify(query), (forms) => {
+            // Sort by modified.on desc but first by user
+            forms = lodash_1.default.sortByOrder(forms, [(form) => (form.created.by === this.props.user ? 1 : 0), (form) => form.modified.on], ["desc", "desc"]);
+            // Filter by Entity and Site questions of tableId type
+            if (this.props.table.startsWith("entities.")) {
+                forms = lodash_1.default.filter(forms, (form) => formUtils.findEntityQuestion(form.design, this.props.table.split(".")[1]));
+            }
+            else if (this.props.table.startsWith("assets:")) {
+                const assetSystemId = parseInt(this.props.table.split(":")[1]);
+                forms = forms.filter((form) => {
+                    return formUtils.findAssetQuestion(form.design, assetSystemId) != null;
+                });
+            }
+            // Get _id, name, and description
+            const items = lodash_1.default.map(forms, (form) => ({
+                name: expressions_1.ExprUtils.localizeString(form.design.name, this.context.locale),
+                desc: `Modified ${(0, moment_1.default)(form.modified.on, moment_1.default.ISO_8601).format("ll")}`,
+                onClick: this.props.onSelect.bind(null, "responses:" + form._id)
+            }));
+            return this.setState({ items });
+        }).fail((xhr) => {
+            return this.setState({ error: xhr.responseText });
+        });
+    }
+    renderContents() {
+        if (!this.state.items) {
+            return R("div", { className: "alert alert-info" }, R("i", { className: "fa fa-spin fa-spinner" }), " Loading...");
+        }
+        let { items } = this.state;
+        // Filter by search
+        if (this.state.search) {
+            const searchStringRegExp = new RegExp(escapeRegex(this.state.search), "i");
+            items = lodash_1.default.filter(items, (item) => item.name.match(searchStringRegExp));
+        }
+        return R("div", null, R("input", {
+            type: "text",
+            className: "form-control",
+            placeholder: "Search...",
+            key: "search",
+            style: { marginBottom: 10 },
+            value: this.state.search,
+            onChange: (ev) => this.setState({ search: ev.target.value })
+        }), R(ui.OptionListComponent, { items }));
+    }
+    render() {
+        return R(ModalPopupComponent_1.default, {
+            showCloseX: true,
+            onClose: this.props.onCancel,
+            header: "Add Related Survey"
+        }, this.renderContents());
+    }
+}
+function escapeRegex(s) {
+    return s.replace(/[-\/\\^$*+?.()|[\]{}]/g, "\\$&");
+}

package/lib/MWaterAddRelatedIndicatorComponent.d.ts

@@ -0,0 +1,31 @@
+/// <reference types="jquery" />
+import PropTypes from "prop-types";
+import React from "react";
+import { Schema } from "@mwater/expressions";
+export interface MWaterAddRelatedIndicatorComponentProps {
+    table: string;
+    apiUrl: string;
+    client?: string;
+    /** User id */
+    user?: string;
+    /** Called with table id e.g. indicator_values:someid */
+    onSelect: any;
+    schema: Schema;
+    /** String filter */
+    filter?: string;
+}
+interface MWaterAddRelatedIndicatorComponentState {
+    addingTables: any;
+    indicators: any;
+}
+export default class MWaterAddRelatedIndicatorComponent extends React.Component<MWaterAddRelatedIndicatorComponentProps, MWaterAddRelatedIndicatorComponentState> {
+    static contextTypes: {
+        locale: PropTypes.Requireable<string>;
+    };
+    constructor(props: any);
+    componentDidMount(): JQuery.jqXHR<any>;
+    doesIndicatorReferenceTable(indicator: any, table: any): boolean;
+    handleSelect: (table: any) => any;
+    render(): React.DetailedReactHTMLElement<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+}
+export {};