@uwdata/mosaic-inputs 0.16.1 → 0.17.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uwdata/mosaic-inputs",
-  "version": "0.16.1",
+  "version": "0.17.0",
   "description": "Mosaic input components.",
   "keywords": [
     "inputs",
@@ -10,7 +10,7 @@
   "author": "Jeffrey Heer (https://idl.uw.edu)",
   "type": "module",
   "exports": {
-    "types": "./dist/types/index.d.ts",
+    "types": "./dist/src/index.d.ts",
     "default": "./src/index.js"
   },
   "repository": {
@@ -19,16 +19,12 @@
   },
   "scripts": {
     "prebuild": "rimraf dist && mkdir dist",
-    "build": "npm run types",
-    "types": "tsc -p tsconfig.json",
     "lint": "eslint src test",
-    "test": "vitest run && npm run tsc",
-    "tsc": "tsc -p jsconfig.json",
-    "prepublishOnly": "npm run test && npm run lint && npm run build"
+    "test": "vitest run && tsc",
+    "prepublishOnly": "npm run test && npm run lint && tsc"
   },
   "dependencies": {
-    "@uwdata/mosaic-core": "^0.16.1",
-    "@uwdata/mosaic-sql": "^0.16.1"
-  },
-  "gitHead": "e12af9927b0a35a0e3194850ef569d0d24a022ce"
+    "@uwdata/mosaic-core": "^0.17.0",
+    "@uwdata/mosaic-sql": "^0.17.0"
+  }
 }

package/tsconfig.json

@@ -1,11 +1,9 @@
 {
-  "include": ["src/**/*.js", "src/**/*.ts"],
+  "extends": "../../tsconfig.base.json",
+  "include": ["src/**/*"],
   "compilerOptions": {
-    "allowJs": true,
-    "declaration": true,
     "emitDeclarationOnly": true,
-    "outDir": "dist/types",
-    "module": "node16",
-    "skipLibCheck": true
-  }
-}
+    "outDir": "dist"
+  },
+  "references": [{ "path": "../core" }, { "path": "../sql" }]
+}

package/LICENSE

@@ -1,47 +0,0 @@
-BSD 3-Clause License
-
-Copyright (c) 2023, UW Interactive Data Lab
-
-Redistribution and use in source and binary forms, with or without
-modification, are permitted provided that the following conditions are met:
-
-1. Redistributions of source code must retain the above copyright notice, this
-   list of conditions and the following disclaimer.
-
-2. Redistributions in binary form must reproduce the above copyright notice,
-   this list of conditions and the following disclaimer in the documentation
-   and/or other materials provided with the distribution.
-
-3. Neither the name of the copyright holder nor the names of its
-   contributors may be used to endorse or promote products derived from
-   this software without specific prior written permission.
-
-THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
-AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
-IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
-DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
-FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
-DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
-SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
-CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
-OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
-OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-
----
-
-Portions of this software are derived from Observable Plot, which is released
-under the ISC license.
-
-Copyright 2020-2023 Observable, Inc.
-
-Permission to use, copy, modify, and/or distribute this software for any purpose
-with or without fee is hereby granted, provided that the above copyright notice
-and this permission notice appear in all copies.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND
-FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS
-OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER
-TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF
-THIS SOFTWARE.

package/dist/types/Menu.d.ts

@@ -1,79 +0,0 @@
-export function menu(options?: {
-    element?: HTMLElement;
-    filterBy?: Selection;
-    as?: Param;
-    field?: string;
-    options?: (any | {
-        value: any;
-        label?: string;
-    })[];
-    format?: (value: any) => string;
-    value?: any;
-    from?: string;
-    column?: string;
-    label?: string;
-}): HTMLElement;
-/**
- * A HTML <select>-based dropdown menu input.
- * @extends {Input}
- */
-export class Menu extends Input {
-    /**
-     * Create a new menu input.
-     * @param {object} [options] Options object
-     * @param {HTMLElement} [options.element] The parent DOM element in which to
-     *  place the menu elements. If undefined, a new `div` element is created.
-     * @param {Selection} [options.filterBy] A selection to filter the database
-     *  table indicated by the *from* option.
-     * @param {Param} [options.as] The output param or selection. A selection
-     *  clause is added for the currently selected menu option.
-     * @param {string} [options.field] The database column name to use within
-     *  generated selection clause predicates. Defaults to the *column* option.
-     * @param {(any | { value: any, label?: string })[]} [options.options] An
-     *  array of menu options, as literal values or option objects. Option
-     *  objects have a `value` property and an optional `label` property. If no
-     *  label or *format* function is provided, the string-coerced value is used.
-     * @param {(value: any) => string} [options.format] A format function that
-     *  takes an option value as input and generates a string label. The format
-     *  function is not applied when an explicit label is provided in an option
-     *  object.
-     * @param {*} [options.value] The initial selected menu value.
-     * @param {string} [options.from] The name of a database table to use as a data
-     *  source for this widget. Used in conjunction with the *column* option.
-     * @param {string} [options.column] The name of a database column from which
-     *  to pull menu options. The unique column values are used as menu options.
-     *  Used in conjunction with the *from* option.
-     * @param {string} [options.label] A text label for this input.
-     */
-    constructor({ element, filterBy, as, from, column, label, format, options, value, field }?: {
-        element?: HTMLElement;
-        filterBy?: Selection;
-        as?: Param;
-        field?: string;
-        options?: (any | {
-            value: any;
-            label?: string;
-        })[];
-        format?: (value: any) => string;
-        value?: any;
-        from?: string;
-        column?: string;
-        label?: string;
-    });
-    from: string;
-    column: string;
-    format: (value: any) => string;
-    field: string;
-    selection: Param;
-    select: HTMLSelectElement;
-    data: any[];
-    selectedValue(value: any, ...args: any[]): any;
-    reset(): void;
-    publish(value: any): void;
-    query(filter?: any[]): import("@uwdata/mosaic-sql").SelectQuery;
-    queryResult(data: any): this;
-    update(): this;
-}
-import type { Selection } from '@uwdata/mosaic-core';
-import type { Param } from '@uwdata/mosaic-core';
-import { Input } from './input.js';

package/dist/types/Search.d.ts

@@ -1,69 +0,0 @@
-export function search(options?: {
-    element?: HTMLElement;
-    filterBy?: Selection;
-    as?: Param;
-    field?: string;
-    type?: "contains" | "prefix" | "suffix" | "regexp";
-    from?: string;
-    column?: string;
-    label?: string;
-}): HTMLElement;
-/**
- * A HTML text search input.
- * @extends {Input}
- */
-export class Search extends Input {
-    /**
-     * Create a new text search input.
-     * @param {object} [options] Options object
-     * @param {HTMLElement} [options.element] The parent DOM element in which to
-     *  place the search elements. If undefined, a new `div` element is created.
-     * @param {Selection} [options.filterBy] A selection to filter the database
-     *  table indicated by the *from* option.
-     * @param {Param} [options.as] The output param or selection. A selection
-     *  clause is added based on the current text search query.
-     * @param {string} [options.field] The database column name to use within
-     *  generated selection clause predicates. Defaults to the *column* option.
-     * @param {'contains' | 'prefix' | 'suffix' | 'regexp'} [options.type] The
-     *  type of text search query to perform. One of:
-     *  - `"contains"` (default): the query string may appear anywhere in the text
-     *  - `"prefix"`: the query string must appear at the start of the text
-     *  - `"suffix"`: the query string must appear at the end of the text
-     *  - `"regexp"`: the query string is a regular expression the text must match
-     * @param {string} [options.from] The name of a database table to use as an
-     *  autocomplete data source for this widget. Used in conjunction with the
-     *  *column* option.
-     * @param {string} [options.column] The name of a database column from which
-     *  to pull valid search results. The unique column values are used as search
-     *  autocomplete values. Used in conjunction with the *from* option.
-     * @param {string} [options.label] A text label for this input.
-     */
-    constructor({ element, filterBy, from, column, label, type, field, as }?: {
-        element?: HTMLElement;
-        filterBy?: Selection;
-        as?: Param;
-        field?: string;
-        type?: "contains" | "prefix" | "suffix" | "regexp";
-        from?: string;
-        column?: string;
-        label?: string;
-    });
-    id: string;
-    type: "contains" | "prefix" | "suffix" | "regexp";
-    from: string;
-    column: string;
-    selection: Param;
-    field: string;
-    searchbox: HTMLInputElement;
-    reset(): void;
-    clause(value: any): import("@uwdata/mosaic-core").SelectionClause;
-    publish(value: any): void;
-    query(filter?: any[]): import("@uwdata/mosaic-sql").SelectQuery;
-    queryResult(data: any): this;
-    data: any;
-    update(): this;
-    datalist: HTMLDataListElement;
-}
-import type { Selection } from '@uwdata/mosaic-core';
-import type { Param } from '@uwdata/mosaic-core';
-import { Input } from './input.js';

package/dist/types/Slider.d.ts

@@ -1,84 +0,0 @@
-export function slider(options?: {
-    element?: HTMLElement;
-    filterBy?: Selection;
-    as?: Param;
-    field?: string;
-    select?: "point" | "interval";
-    min?: number;
-    max?: number;
-    step?: number;
-    value?: number;
-    from?: string;
-    column?: string;
-    label?: string;
-    width?: number;
-}): HTMLElement;
-/**
- * A HTML range-based slider input.
- * @extends {Input}
- */
-export class Slider extends Input {
-    /**
-     * Create a new slider input.
-     * @param {object} [options] Options object
-     * @param {HTMLElement} [options.element] The parent DOM element in which to
-     *  place the slider elements. If undefined, a new `div` element is created.
-     * @param {Selection} [options.filterBy] A selection to filter the database
-     *  table indicated by the *from* option.
-     * @param {Param} [options.as] The output param or selection. A selection
-     *  clause is added based on the currently selected slider option.
-     * @param {string} [options.field] The database column name to use within
-     *  generated selection clause predicates. Defaults to the *column* option.
-     * @param {'point' | 'interval'} [options.select] The type of selection clause
-     *  predicate to generate if the **as** option is a Selection.  If `'point'`
-     *  (the default), the selection predicate is an equality check for the slider
-     *  value. If `'interval'`, the predicate checks an interval from the minimum
-     *  to the current slider value.
-     * @param {number} [options.min] The minimum slider value.
-     * @param {number} [options.max] The maximum slider value.
-     * @param {number} [options.step] The slider step, the amount to increment
-     *  between consecutive values.
-     * @param {number} [options.value] The initial slider value.
-     * @param {string} [options.from] The name of a database table to use as a data
-     *  source for this widget. Used in conjunction with the *column* option.
-     *  The minimum and maximum values of the column determine the slider range.
-     * @param {string} [options.column] The name of a database column whose values
-     *  determine the slider range. Used in conjunction with the *from* option.
-     *  The minimum and maximum values of the column determine the slider range.
-     * @param {string} [options.label] A text label for this input.
-     * @param {number} [options.width] The width of the slider in screen pixels.
-     */
-    constructor({ element, filterBy, as, min, max, step, from, column, label, value, select, field, width }?: {
-        element?: HTMLElement;
-        filterBy?: Selection;
-        as?: Param;
-        field?: string;
-        select?: "point" | "interval";
-        min?: number;
-        max?: number;
-        step?: number;
-        value?: number;
-        from?: string;
-        column?: string;
-        label?: string;
-        width?: number;
-    });
-    id: string;
-    from: string;
-    column: string;
-    selection: Param;
-    selectionType: "point" | "interval";
-    field: string;
-    min: number;
-    max: number;
-    step: number;
-    slider: HTMLInputElement;
-    curval: HTMLLabelElement;
-    query(filter?: any[]): import("@uwdata/mosaic-sql").SelectQuery;
-    queryResult(data: any): this;
-    clause(value: any): import("@uwdata/mosaic-core").SelectionClause;
-    publish(value: any): void;
-}
-import type { Selection } from '@uwdata/mosaic-core';
-import type { Param } from '@uwdata/mosaic-core';
-import { Input } from './input.js';

package/dist/types/Table.d.ts

@@ -1,111 +0,0 @@
-export function table(options: {
-    element?: HTMLElement;
-    filterBy?: Selection;
-    as?: Selection;
-    align?: {
-        [name: string]: "left" | "right" | "center";
-    };
-    format?: {
-        [name: string]: (value: any) => string;
-    };
-    from?: string;
-    columns?: string[];
-    width?: number | {
-        [name: string]: number;
-    };
-    maxWidth?: number;
-    height?: number;
-    rowBatch?: number;
-}): HTMLElement;
-/**
- * A HTML table based table component.
- * @extends {Input}
- */
-export class Table extends Input {
-    /**
-     * Create a new Table instance.
-     * @param {object} options Options object
-     * @param {HTMLElement} [options.element] The parent DOM element in which to
-     *  place the table element. If undefined, a new `div` element is created.
-     * @param {Selection} [options.filterBy] A selection to filter the database
-     *  table indicated by the *from* option.
-     * @param {Selection} [options.as] The output selection. A selection
-     *  clause is added for the currently selected table row.
-     * @param {{ [name: string]: 'left' | 'right' | 'center' }} [options.align]
-     *  An object that maps column names to horiztonal text alignment values. If
-     *  unspecified, alignment is determined based on the column data type.
-     * @param {{ [name: string]: (value: any) => string }} [options.format] An
-     *  object that maps column names to format functions to use for that
-     *  column's data. Each format function takes a value as input and generates
-     *  formatted text to show in the table.
-     * @param {string} [options.from] The name of a database table to use as a data
-     *  source for this widget. Used in conjunction with the *columns* option.
-     * @param {string[]} [options.columns] The name of database columns to include
-     *  in the table component. If unspecified, all columns are included.
-     *  Used in conjunction with the *from* option.
-     * @param {number | { [name: string]: number }} [options.width] If a number,
-     *  sets the desired width of the table, in pixels. If an object, is used to
-     *  set explicit pixel widts for each named column included in the object.
-     * @param {number} [options.maxWidth] The maximum width of the table, in pixels.
-     * @param {number} [options.height] The desired height of the table, in pixels.
-     * @param {number} [options.rowBatch] The number of rows to request per query
-     *  batch. The batch size will be used to prefetch data beyond the currently
-     *  visible range.
-     */
-    constructor({ element, filterBy, from, columns, align, format, width, maxWidth, height, rowBatch, as }?: {
-        element?: HTMLElement;
-        filterBy?: Selection;
-        as?: Selection;
-        align?: {
-            [name: string]: "left" | "right" | "center";
-        };
-        format?: {
-            [name: string]: (value: any) => string;
-        };
-        from?: string;
-        columns?: string[];
-        width?: number | {
-            [name: string]: number;
-        };
-        maxWidth?: number;
-        height?: number;
-        rowBatch?: number;
-    });
-    id: string;
-    from: string;
-    columns: string[];
-    format: {
-        [name: string]: (value: any) => string;
-    };
-    align: {
-        [name: string]: "left" | "right" | "center";
-    };
-    widths: {
-        [name: string]: number;
-    };
-    offset: number;
-    limit: number;
-    isPending: boolean;
-    selection: Selection;
-    currentRow: number;
-    sortHeader: any;
-    sortColumn: any;
-    sortDesc: boolean;
-    tbl: HTMLTableElement;
-    head: HTMLTableSectionElement;
-    body: HTMLTableSectionElement;
-    style: HTMLStyleElement;
-    sourceTable(): any;
-    clause(rows?: any[]): import("@uwdata/mosaic-core").SelectionClause;
-    requestData(offset?: number): void;
-    schema: import("@uwdata/mosaic-core").FieldInfo[];
-    formats: any;
-    query(filter?: any[]): import("@uwdata/mosaic-sql").SelectQuery;
-    queryResult(data: any): this;
-    loaded: boolean;
-    data: any[];
-    update(): this;
-    sort(event: any, column: any): void;
-}
-import type { Selection } from '@uwdata/mosaic-core';
-import { Input } from './input.js';

package/dist/types/index.d.ts

@@ -1,4 +0,0 @@
-export { Menu, menu } from "./Menu.js";
-export { Search, search } from "./Search.js";
-export { Slider, slider } from "./Slider.js";
-export { Table, table } from "./Table.js";

package/dist/types/input.d.ts

@@ -1,28 +0,0 @@
-/**
- * Instantiate an input, register it with the coordinator, and
- * return the corresponding HTML element.
- * @template {new (...args: any) => Input} T
- * @param {T} InputClass
- * @param {ConstructorParameters<T>} params
- * @returns {HTMLElement} The container element of the input.
- */
-export function input<T extends new (...args: any) => Input>(InputClass: T, ...params: ConstructorParameters<T>): HTMLElement;
-/**
- * Base class for input components.
- * @import {Activatable} from '@uwdata/mosaic-core'
- * @implements {Activatable}
- */
-export class Input extends MosaicClient implements Activatable {
-    /**
-     * Create a new input instance.
-     * @param {import('@uwdata/mosaic-core').Selection} [filterBy] A selection
-     *  with which to filter backing data that parameterizes this input.
-     * @param {HTMLElement} [element] Optional container HTML element to use.
-     * @param {string} [className] A class name to set on the container element.
-     */
-    constructor(filterBy?: import("@uwdata/mosaic-core").Selection, element?: HTMLElement, className?: string);
-    element: HTMLElement;
-    activate(): void;
-}
-import type { Activatable } from '@uwdata/mosaic-core';
-import { MosaicClient } from '@uwdata/mosaic-core';

package/dist/types/util/format.d.ts

@@ -1,8 +0,0 @@
-export function stringify(x: any): string;
-export function formatTrim(value: any): any;
-export function formatDate(date: any): string;
-export function localize(f: any): (locale?: string) => any;
-export function formatLocaleAuto(locale?: string): any;
-export function formatLocaleNumber(locale?: string): any;
-export const formatAuto: any;
-export const formatNumber: any;

package/jsconfig.json

@@ -1,11 +0,0 @@
-{
-  "include": ["src/**/*"],
-  "compilerOptions": {
-    "checkJs": true,
-    "noEmit": true,
-    "noImplicitAny": false,
-    "module": "node16",
-    "skipLibCheck": true,
-    "types": []
-  }
-}