@malloydata/render 0.0.22-dev230207180844 → 0.0.22-dev230207183024

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/dist/drill.js +7 -7
  2. package/dist/html/cartesian_chart.js +28 -28
  3. package/dist/html/chart.js +6 -6
  4. package/dist/html/container.js +2 -2
  5. package/dist/html/currency.js +2 -2
  6. package/dist/html/dashboard.js +1 -1
  7. package/dist/html/html_view.d.ts +1 -1
  8. package/dist/html/html_view.js +1 -1
  9. package/dist/html/list.d.ts +1 -1
  10. package/dist/html/list.js +1 -1
  11. package/dist/html/percent.js +1 -1
  12. package/dist/html/point_map.js +64 -64
  13. package/dist/html/segment_map.js +56 -56
  14. package/dist/html/shape_map.js +64 -64
  15. package/dist/html/state_codes.js +96 -96
  16. package/dist/html/table.js +1 -1
  17. package/dist/html/utils.js +10 -10
  18. package/dist/html/vega_spec.js +277 -277
  19. package/package.json +2 -2
package/dist/drill.js CHANGED
@@ -33,13 +33,13 @@ function timestampToDateFilter(key, value, timeframe) {
33
33
  ? malloy_1.TimestampTimeframe.Second
34
34
  : timeframe || malloy_1.TimestampTimeframe.Second;
35
35
  const filterValue = "@" + (0, utils_1.timeToString)(value, adjustedTimeframe);
36
- return { key, value: filterValue };
36
+ return { key, "value": filterValue };
37
37
  }
38
38
  function getTableFilters(table) {
39
39
  const filters = [];
40
40
  for (const f of table.field.filters || []) {
41
41
  if (f.expressionType === "scalar") {
42
- filters.push({ key: f.code, value: undefined });
42
+ filters.push({ "key": f.code, "value": undefined });
43
43
  }
44
44
  }
45
45
  return filters;
@@ -53,13 +53,13 @@ function getRowFilters(row) {
53
53
  const key = dim.isAtomicField() || dim.isQueryField() ? dim.expression : undefined;
54
54
  if (key && !cell.isArray()) {
55
55
  if (cell.isNull()) {
56
- filters.push({ key, value: "null" });
56
+ filters.push({ key, "value": "null" });
57
57
  }
58
58
  else if (cell.isString()) {
59
- filters.push({ key, value: filterQuote(cell.value) });
59
+ filters.push({ key, "value": filterQuote(cell.value) });
60
60
  }
61
61
  else if (cell.isNumber() || cell.isBoolean()) {
62
- filters.push({ key, value: cell.value.toString() });
62
+ filters.push({ key, "value": cell.value.toString() });
63
63
  }
64
64
  else if (cell.isTimestamp() || cell.isDate()) {
65
65
  filters.push(timestampToDateFilter(key, cell.value, cell.field.timeframe));
@@ -97,7 +97,7 @@ function getDrillFilters(data) {
97
97
  // TODO HACK: some filters get duplicated by the language, and this
98
98
  // is a workaround until that is fixed
99
99
  const dedupedFilters = formattedFilters.filter((filter, index) => formattedFilters.find((otherFilter, otherIndex) => otherFilter === filter && index < otherIndex) === undefined);
100
- return { formattedFilters: dedupedFilters, source };
100
+ return { "formattedFilters": dedupedFilters, source };
101
101
  }
102
102
  exports.getDrillFilters = getDrillFilters;
103
103
  function getDrillQuery(data) {
@@ -107,7 +107,7 @@ function getDrillQuery(data) {
107
107
  ret += `{ \n where: \n ${formattedFilters.join(",\n ")}\n \n}\n`;
108
108
  }
109
109
  const drillQuery = ret + "-> ";
110
- return { drillQuery, drillFilters: formattedFilters };
110
+ return { drillQuery, "drillFilters": formattedFilters };
111
111
  }
112
112
  exports.getDrillQuery = getDrillQuery;
113
113
  //# sourceMappingURL=drill.js.map
package/dist/html/cartesian_chart.js CHANGED
@@ -42,55 +42,55 @@ class HTMLCartesianChartRenderer extends chart_1.HTMLChartRenderer {
42
42
  const mark = this.getMark();
43
43
  const colorDef = colorField !== undefined
44
44
  ? {
45
- field: colorField.name,
46
- type: colorType,
47
- axis: { title: colorField.name },
48
- scale: (0, utils_1.getColorScale)(colorType, mark === "bar"),
45
+ "field": colorField.name,
46
+ "type": colorType,
47
+ "axis": { "title": colorField.name },
48
+ "scale": (0, utils_1.getColorScale)(colorType, mark === "bar")
49
49
  }
50
- : { value: "#4285F4" };
50
+ : { "value": "#4285F4" };
51
51
  const sizeDef = sizeField
52
52
  ? {
53
- field: sizeField.name,
54
- type: sizeType,
55
- axis: { title: sizeField.name },
53
+ "field": sizeField.name,
54
+ "type": sizeType,
55
+ "axis": { "title": sizeField.name }
56
56
  }
57
57
  : undefined;
58
58
  const shapeDef = shapeField
59
59
  ? {
60
- field: shapeField.name,
61
- type: shapeType,
62
- axis: { title: shapeField.name },
60
+ "field": shapeField.name,
61
+ "type": shapeType,
62
+ "axis": { "title": shapeField.name }
63
63
  }
64
64
  : undefined;
65
65
  const xSort = xType === "nominal" ? null : undefined;
66
66
  const ySort = yType === "nominal" ? null : undefined;
67
67
  const xDef = {
68
- field: xField.name,
69
- type: xType,
70
- sort: xSort,
71
- axis: { title: xField.name },
68
+ "field": xField.name,
69
+ "type": xType,
70
+ "sort": xSort,
71
+ "axis": { "title": xField.name }
72
72
  };
73
73
  const yDef = {
74
- field: yField.name,
75
- type: yType,
76
- sort: ySort,
77
- axis: { title: yField.name },
74
+ "field": yField.name,
75
+ "type": yType,
76
+ "sort": ySort,
77
+ "axis": { "title": yField.name }
78
78
  };
79
79
  return {
80
80
  ...vega_spec_1.DEFAULT_SPEC,
81
81
  ...this.getSize(),
82
- data: {
83
- values: this.mapData(data),
82
+ "data": {
83
+ "values": this.mapData(data)
84
84
  },
85
85
  mark,
86
- encoding: {
87
- x: xDef,
88
- y: yDef,
89
- size: sizeDef,
90
- color: colorDef,
91
- shape: shapeDef,
86
+ "encoding": {
87
+ "x": xDef,
88
+ "y": yDef,
89
+ "size": sizeDef,
90
+ "color": colorDef,
91
+ "shape": shapeDef
92
92
  },
93
- background: "transparent",
93
+ "background": "transparent"
94
94
  };
95
95
  }
96
96
  }
package/dist/html/chart.js CHANGED
@@ -67,10 +67,10 @@ class HTMLChartRenderer {
67
67
  }
68
68
  getSize() {
69
69
  if (this.size === "large") {
70
- return { height: 350, width: 500 };
70
+ return { "height": 350, "width": 500 };
71
71
  }
72
72
  else {
73
- return { height: 175, width: 250 };
73
+ return { "height": 175, "width": 250 };
74
74
  }
75
75
  }
76
76
  async render(table) {
@@ -79,7 +79,7 @@ class HTMLChartRenderer {
79
79
  }
80
80
  const spec = this.getVegaLiteSpec(table);
81
81
  const vegaspec = lite.compile(spec, {
82
- logger: {
82
+ "logger": {
83
83
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
84
84
  // @ts-ignore
85
85
  level(newLevel) {
@@ -99,11 +99,11 @@ class HTMLChartRenderer {
99
99
  },
100
100
  debug() {
101
101
  return this;
102
- },
103
- },
102
+ }
103
+ }
104
104
  }).spec;
105
105
  const view = new vega.View(vega.parse(vegaspec), {
106
- renderer: "none",
106
+ "renderer": "none"
107
107
  });
108
108
  view.logger().level(-1);
109
109
  const element = this.document.createElement("div");
package/dist/html/container.js CHANGED
@@ -37,8 +37,8 @@ class ContainerRenderer extends renderer_1.RenderTree {
37
37
  // our children.
38
38
  static make(c, document, exploreField, options) {
39
39
  const n = new c(document, {
40
- isDrillingEnabled: options.isDrillingEnabled,
41
- onDrill: options.onDrill,
40
+ "isDrillingEnabled": options.isDrillingEnabled,
41
+ "onDrill": options.onDrill
42
42
  });
43
43
  return n;
44
44
  }
package/dist/html/currency.js CHANGED
@@ -32,8 +32,8 @@ class HTMLCurrencyRenderer extends text_1.HTMLTextRenderer {
32
32
  // TODO get this from renderer options
33
33
  const unitText = "$";
34
34
  const numText = data.number.value.toLocaleString("en-US", {
35
- minimumFractionDigits: 2,
36
- maximumFractionDigits: 2,
35
+ "minimumFractionDigits": 2,
36
+ "maximumFractionDigits": 2
37
37
  });
38
38
  return `${unitText}${numText}`;
39
39
  }
package/dist/html/dashboard.js CHANGED
@@ -31,7 +31,7 @@ class HTMLDashboardRenderer extends container_1.ContainerRenderer {
31
31
  constructor() {
32
32
  super(...arguments);
33
33
  this.childrenStyleDefaults = {
34
- size: "medium",
34
+ "size": "medium"
35
35
  };
36
36
  }
37
37
  async render(table) {
package/dist/html/html_view.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { DataArray, Field, Explore } from "@malloydata/malloy";
1
+ import { DataArray, Explore, Field } from "@malloydata/malloy";
2
2
  import { DataStyles, StyleDefaults } from "../data_styles";
3
3
  import { Renderer } from "../renderer";
4
4
  import { DrillFunction } from "../drill";
package/dist/html/html_view.js CHANGED
@@ -53,7 +53,7 @@ class HTMLView {
53
53
  }
54
54
  async render(table, options) {
55
55
  const renderer = makeRenderer(table.field, this.document, options, {
56
- size: "large",
56
+ "size": "large"
57
57
  });
58
58
  try {
59
59
  // TODO Implement row streaming capability for some renderers: some renderers should be usable
package/dist/html/list.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { DataColumn, Field, Explore } from "@malloydata/malloy";
1
+ import { DataColumn, Explore, Field } from "@malloydata/malloy";
2
2
  import { StyleDefaults } from "../data_styles";
3
3
  import { ContainerRenderer } from "./container";
4
4
  export declare class HTMLListRenderer extends ContainerRenderer {
package/dist/html/list.js CHANGED
@@ -29,7 +29,7 @@ class HTMLListRenderer extends container_1.ContainerRenderer {
29
29
  constructor() {
30
30
  super(...arguments);
31
31
  this.childrenStyleDefaults = {
32
- size: "small",
32
+ "size": "small"
33
33
  };
34
34
  }
35
35
  getValueField(struct) {
package/dist/html/percent.js CHANGED
@@ -29,7 +29,7 @@ class HTMLPercentRenderer extends number_1.HTMLNumberRenderer {
29
29
  const num = this.getNumber(data);
30
30
  return num === null
31
31
  ? num
32
- : (num * 100).toLocaleString("en", { maximumFractionDigits: 2 }) + "%";
32
+ : (num * 100).toLocaleString("en", { "maximumFractionDigits": 2 }) + "%";
33
33
  }
34
34
  }
35
35
  exports.HTMLPercentRenderer = HTMLPercentRenderer;
package/dist/html/point_map.js CHANGED
@@ -66,90 +66,90 @@ class HTMLPointMapRenderer extends chart_1.HTMLChartRenderer {
66
66
  const shapeType = shapeField ? this.getDataType(shapeField) : undefined;
67
67
  const colorDef = colorField !== undefined
68
68
  ? {
69
- field: colorField.name,
70
- type: colorType,
71
- axis: { title: colorField.name },
72
- scale: (0, utils_1.getColorScale)(colorType, false),
69
+ "field": colorField.name,
70
+ "type": colorType,
71
+ "axis": { "title": colorField.name },
72
+ "scale": (0, utils_1.getColorScale)(colorType, false)
73
73
  }
74
74
  : undefined;
75
75
  const sizeDef = sizeField
76
76
  ? {
77
- field: sizeField.name,
78
- type: sizeType,
79
- axis: { title: sizeField.name },
77
+ "field": sizeField.name,
78
+ "type": sizeType,
79
+ "axis": { "title": sizeField.name }
80
80
  }
81
- : { value: 5 };
81
+ : { "value": 5 };
82
82
  const shapeDef = shapeField
83
83
  ? {
84
- field: shapeField.name,
85
- type: shapeType,
86
- axis: { title: shapeField.name },
84
+ "field": shapeField.name,
85
+ "type": shapeType,
86
+ "axis": { "title": shapeField.name }
87
87
  }
88
- : { value: "circle" };
88
+ : { "value": "circle" };
89
89
  return {
90
90
  ...this.getSize(),
91
- data: {
92
- values: this.mapData(data),
91
+ "data": {
92
+ "values": this.mapData(data)
93
93
  },
94
- projection: {
95
- type: "albersUsa",
94
+ "projection": {
95
+ "type": "albersUsa"
96
96
  },
97
- layer: [
97
+ "layer": [
98
98
  {
99
- data: {
100
- values: states_10m_json_1.default,
101
- format: {
102
- type: "topojson",
103
- feature: "states",
104
- },
105
- },
106
- mark: {
107
- type: "geoshape",
108
- fill: "#efefef",
109
- stroke: "white",
99
+ "data": {
100
+ "values": states_10m_json_1.default,
101
+ "format": {
102
+ "type": "topojson",
103
+ "feature": "states"
104
+ }
110
105
  },
106
+ "mark": {
107
+ "type": "geoshape",
108
+ "fill": "#efefef",
109
+ "stroke": "white"
110
+ }
111
111
  },
112
112
  {
113
- mark: "point",
114
- encoding: {
115
- latitude: { field: latField.name, type: "quantitative" },
116
- longitude: { field: lonField.name, type: "quantitative" },
117
- size: sizeDef,
118
- color: colorDef,
119
- shape: shapeDef,
120
- },
121
- },
113
+ "mark": "point",
114
+ "encoding": {
115
+ "latitude": { "field": latField.name, "type": "quantitative" },
116
+ "longitude": { "field": lonField.name, "type": "quantitative" },
117
+ "size": sizeDef,
118
+ "color": colorDef,
119
+ "shape": shapeDef
120
+ }
121
+ }
122
122
  ],
123
- background: "transparent",
124
- config: {
125
- axis: {
126
- labelFont: "var(--malloy-font-family, Roboto)",
127
- titleFont: "var(--malloy-font-family, Roboto)",
128
- titleFontWeight: 500,
129
- titleColor: "var(--malloy-title-color, #505050)",
130
- labelColor: "var(--malloy-label-color, #000000)",
131
- titleFontSize: 12,
123
+ "background": "transparent",
124
+ "config": {
125
+ "axis": {
126
+ "labelFont": "var(--malloy-font-family, Roboto)",
127
+ "titleFont": "var(--malloy-font-family, Roboto)",
128
+ "titleFontWeight": 500,
129
+ "titleColor": "var(--malloy-title-color, #505050)",
130
+ "labelColor": "var(--malloy-label-color, #000000)",
131
+ "titleFontSize": 12
132
132
  },
133
- legend: {
134
- labelFont: "var(--malloy-font-family, Roboto)",
135
- titleFont: "var(--malloy-font-family, Roboto)",
136
- titleFontWeight: 500,
137
- titleColor: "var(--malloy-title-color, #505050)",
138
- labelColor: "var(--malloy-label-color, #000000)",
139
- titleFontSize: 12,
133
+ "legend": {
134
+ "labelFont": "var(--malloy-font-family, Roboto)",
135
+ "titleFont": "var(--malloy-font-family, Roboto)",
136
+ "titleFontWeight": 500,
137
+ "titleColor": "var(--malloy-title-color, #505050)",
138
+ "labelColor": "var(--malloy-label-color, #000000)",
139
+ "titleFontSize": 12
140
140
  },
141
- header: {
142
- labelFont: "var(--malloy-font-family, Roboto)",
143
- titleFont: "var(--malloy-font-family, Roboto)",
144
- titleFontWeight: 500,
141
+ "header": {
142
+ "labelFont": "var(--malloy-font-family, Roboto)",
143
+ "titleFont": "var(--malloy-font-family, Roboto)",
144
+ "titleFontWeight": 500
145
145
  },
146
- mark: { font: "var(--malloy-Roboto" },
147
- title: {
148
- font: "var(--malloy-font-family, Roboto)",
149
- subtitleFont: "var(--malloy-font-family, Roboto)",
150
- fontWeight: 500,
151
- },
152
- },
146
+ "mark": { "font": "var(--malloy-Roboto" },
147
+ "title": {
148
+ "font": "var(--malloy-font-family, Roboto)",
149
+ "subtitleFont": "var(--malloy-font-family, Roboto)",
150
+ "fontWeight": 500
151
+ }
152
+ }
153
153
  };
154
154
  }
155
155
  }
package/dist/html/segment_map.js CHANGED
@@ -61,76 +61,76 @@ class HTMLSegmentMapRenderer extends chart_1.HTMLChartRenderer {
61
61
  const colorType = colorField ? this.getDataType(colorField) : undefined;
62
62
  const colorDef = colorField !== undefined
63
63
  ? {
64
- field: colorField.name,
65
- type: colorType,
66
- axis: { title: colorField.name },
67
- scale: (0, utils_1.getColorScale)(colorType, false),
64
+ "field": colorField.name,
65
+ "type": colorType,
66
+ "axis": { "title": colorField.name },
67
+ "scale": (0, utils_1.getColorScale)(colorType, false)
68
68
  }
69
69
  : undefined;
70
70
  return {
71
71
  ...this.getSize(),
72
- data: {
73
- values: this.mapData(data),
72
+ "data": {
73
+ "values": this.mapData(data)
74
74
  },
75
- projection: {
76
- type: "albersUsa",
75
+ "projection": {
76
+ "type": "albersUsa"
77
77
  },
78
- layer: [
78
+ "layer": [
79
79
  {
80
- data: {
81
- values: states_10m_json_1.default,
82
- format: {
83
- type: "topojson",
84
- feature: "states",
85
- },
86
- },
87
- mark: {
88
- type: "geoshape",
89
- fill: "lightgray",
90
- stroke: "white",
80
+ "data": {
81
+ "values": states_10m_json_1.default,
82
+ "format": {
83
+ "type": "topojson",
84
+ "feature": "states"
85
+ }
91
86
  },
87
+ "mark": {
88
+ "type": "geoshape",
89
+ "fill": "lightgray",
90
+ "stroke": "white"
91
+ }
92
92
  },
93
93
  {
94
- mark: "line",
95
- encoding: {
96
- latitude: { field: lat1Field.name, type: "quantitative" },
97
- longitude: { field: lon1Field.name, type: "quantitative" },
98
- latitude2: { field: lat2Field.name, type: "quantitative" },
99
- longitude2: { field: lon2Field.name, type: "quantitative" },
100
- color: colorDef,
101
- },
102
- },
94
+ "mark": "line",
95
+ "encoding": {
96
+ "latitude": { "field": lat1Field.name, "type": "quantitative" },
97
+ "longitude": { "field": lon1Field.name, "type": "quantitative" },
98
+ "latitude2": { "field": lat2Field.name, "type": "quantitative" },
99
+ "longitude2": { "field": lon2Field.name, "type": "quantitative" },
100
+ "color": colorDef
101
+ }
102
+ }
103
103
  ],
104
- background: "transparent",
105
- config: {
106
- axis: {
107
- labelFont: "var(--malloy-font-family, Roboto)",
108
- titleFont: "var(--malloy-font-family, Roboto)",
109
- titleFontWeight: 500,
110
- titleColor: "var(--malloy-title-color, #505050)",
111
- labelColor: "var(--malloy-label-color, #000000)",
112
- titleFontSize: 12,
104
+ "background": "transparent",
105
+ "config": {
106
+ "axis": {
107
+ "labelFont": "var(--malloy-font-family, Roboto)",
108
+ "titleFont": "var(--malloy-font-family, Roboto)",
109
+ "titleFontWeight": 500,
110
+ "titleColor": "var(--malloy-title-color, #505050)",
111
+ "labelColor": "var(--malloy-label-color, #000000)",
112
+ "titleFontSize": 12
113
113
  },
114
- legend: {
115
- labelFont: "var(--malloy-font-family, Roboto)",
116
- titleFont: "var(--malloy-font-family, Roboto)",
117
- titleFontWeight: 500,
118
- titleColor: "var(--malloy-title-color, #505050)",
119
- labelColor: "var(--malloy-label-color, #000000)",
120
- titleFontSize: 12,
114
+ "legend": {
115
+ "labelFont": "var(--malloy-font-family, Roboto)",
116
+ "titleFont": "var(--malloy-font-family, Roboto)",
117
+ "titleFontWeight": 500,
118
+ "titleColor": "var(--malloy-title-color, #505050)",
119
+ "labelColor": "var(--malloy-label-color, #000000)",
120
+ "titleFontSize": 12
121
121
  },
122
- header: {
123
- labelFont: "var(--malloy-font-family, Roboto)",
124
- titleFont: "var(--malloy-font-family, Roboto)",
125
- titleFontWeight: 500,
122
+ "header": {
123
+ "labelFont": "var(--malloy-font-family, Roboto)",
124
+ "titleFont": "var(--malloy-font-family, Roboto)",
125
+ "titleFontWeight": 500
126
126
  },
127
- mark: { font: "var(--malloy-font-family, Roboto)" },
128
- title: {
129
- font: "var(--malloy-font-family, Roboto)",
130
- subtitleFont: "var(--malloy-font-family, Roboto)",
131
- fontWeight: 500,
132
- },
133
- },
127
+ "mark": { "font": "var(--malloy-font-family, Roboto)" },
128
+ "title": {
129
+ "font": "var(--malloy-font-family, Roboto)",
130
+ "subtitleFont": "var(--malloy-font-family, Roboto)",
131
+ "fontWeight": 500
132
+ }
133
+ }
134
134
  };
135
135
  }
136
136
  }