@graphenedata/cli 0.0.4 → 0.0.5
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.
- package/cli.ts +7 -43
- package/dist/cli/cli.js +529 -293
- package/dist/docs/graphene.md +924 -63
- package/dist/ui/component-utilities/echarts.js +3 -1
- package/dist/ui/component-utilities/themeStores.ts +35 -7
- package/dist/ui/components/AreaChart.svelte +2 -1
- package/dist/ui/components/BarChart.svelte +2 -1
- package/dist/ui/components/BigValue.svelte +1 -1
- package/dist/ui/components/Chart.svelte +10 -1
- package/dist/ui/components/ECharts.svelte +2 -0
- package/dist/ui/components/LineChart.svelte +2 -1
- package/dist/ui/components/PieChart.svelte +1 -1
- package/dist/ui/components/QueryLoad.svelte +5 -6
- package/dist/ui/components/TableRow.svelte +1 -1
- package/dist/ui/components/_Table.svelte +2 -0
- package/dist/ui/internal/queryEngine.ts +16 -13
- package/dist/ui/internal/telemetry.ts +5 -3
- package/dist/ui/web.js +26 -11
- package/package.json +2 -1
- package/dist/docs/data_apps/components/charts/annotations.md +0 -673
- package/dist/docs/data_apps/components/charts/area-chart.md +0 -202
- package/dist/docs/data_apps/components/charts/bar-chart.md +0 -317
- package/dist/docs/data_apps/components/charts/box-plot.md +0 -190
- package/dist/docs/data_apps/components/charts/bubble-chart.md +0 -151
- package/dist/docs/data_apps/components/charts/calendar-heatmap.md +0 -112
- package/dist/docs/data_apps/components/charts/custom-echarts.md +0 -308
- package/dist/docs/data_apps/components/charts/echarts-options.md +0 -217
- package/dist/docs/data_apps/components/charts/funnel-chart.md +0 -106
- package/dist/docs/data_apps/components/charts/heatmap.md +0 -180
- package/dist/docs/data_apps/components/charts/histogram.md +0 -107
- package/dist/docs/data_apps/components/charts/line-chart.md +0 -265
- package/dist/docs/data_apps/components/charts/mixed-type-charts.md +0 -240
- package/dist/docs/data_apps/components/charts/sankey-diagram.md +0 -301
- package/dist/docs/data_apps/components/charts/scatter-plot.md +0 -134
- package/dist/docs/data_apps/components/charts/sparkline.md +0 -68
- package/dist/docs/data_apps/components/data/big-value.md +0 -153
- package/dist/docs/data_apps/components/data/delta.md +0 -89
- package/dist/docs/data_apps/components/data/table.md +0 -470
- package/dist/docs/data_apps/components/data/value.md +0 -97
- package/dist/docs/data_apps/components/inputs/button-group.md +0 -154
- package/dist/docs/data_apps/components/inputs/checkbox.md +0 -52
- package/dist/docs/data_apps/components/inputs/date-input.md +0 -131
- package/dist/docs/data_apps/components/inputs/date-range.md +0 -124
- package/dist/docs/data_apps/components/inputs/dimension-grid.md +0 -67
- package/dist/docs/data_apps/components/inputs/dropdown.md +0 -199
- package/dist/docs/data_apps/components/inputs/index.md +0 -3
- package/dist/docs/data_apps/components/inputs/slider.md +0 -126
- package/dist/docs/data_apps/components/inputs/text-input.md +0 -86
- package/dist/docs/data_apps/components/maps/area-map.md +0 -397
- package/dist/docs/data_apps/components/maps/base-map.md +0 -269
- package/dist/docs/data_apps/components/maps/bubble-map.md +0 -361
- package/dist/docs/data_apps/components/maps/point-map.md +0 -326
- package/dist/docs/data_apps/components/maps/us-map.md +0 -167
- package/dist/docs/data_apps/components/ui/accordion.md +0 -116
- package/dist/docs/data_apps/components/ui/alert.md +0 -37
- package/dist/docs/data_apps/components/ui/big-link.md +0 -19
- package/dist/docs/data_apps/components/ui/details.md +0 -58
- package/dist/docs/data_apps/components/ui/download-data.md +0 -41
- package/dist/docs/data_apps/components/ui/embed.md +0 -47
- package/dist/docs/data_apps/components/ui/grid.md +0 -45
- package/dist/docs/data_apps/components/ui/image.md +0 -61
- package/dist/docs/data_apps/components/ui/info.md +0 -47
- package/dist/docs/data_apps/components/ui/last-refreshed.md +0 -28
- package/dist/docs/data_apps/components/ui/link-button.md +0 -20
- package/dist/docs/data_apps/components/ui/link.md +0 -40
- package/dist/docs/data_apps/components/ui/modal.md +0 -57
- package/dist/docs/data_apps/components/ui/note.md +0 -32
- package/dist/docs/data_apps/components/ui/print-format-components.md +0 -85
- package/dist/docs/data_apps/components/ui/tabs.md +0 -122
|
@@ -1,199 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: Dropdown
|
|
3
|
-
description: Display a dropdown menu with a options from a query or hardcoded options.
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
Creates a dropdown menu with a list of options that can be selected. The selected option can be used to filter queries or in markdown.
|
|
7
|
-
|
|
8
|
-
To see how to filter a query using a dropdown, see [Filters](/core-concepts/filters).
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
````markdown
|
|
12
|
-
<Dropdown
|
|
13
|
-
data="categories"
|
|
14
|
-
name=category1
|
|
15
|
-
value=category_name
|
|
16
|
-
title="Select a Category"
|
|
17
|
-
defaultValue="Sinister Toys"
|
|
18
|
-
/>
|
|
19
|
-
|
|
20
|
-
Selected: {inputs.category1.value}
|
|
21
|
-
````
|
|
22
|
-
|
|
23
|
-
## Examples
|
|
24
|
-
|
|
25
|
-
### Dropdown using Options from a Query
|
|
26
|
-
|
|
27
|
-
````markdown
|
|
28
|
-
<Dropdown
|
|
29
|
-
data="categories"
|
|
30
|
-
name=category2
|
|
31
|
-
value=category_name
|
|
32
|
-
/>
|
|
33
|
-
````
|
|
34
|
-
|
|
35
|
-
Selected: {inputs.category2.value}
|
|
36
|
-
|
|
37
|
-
### With a Title
|
|
38
|
-
|
|
39
|
-
````markdown
|
|
40
|
-
<Dropdown
|
|
41
|
-
data="categories"
|
|
42
|
-
name=category3
|
|
43
|
-
value=category_name
|
|
44
|
-
title="Select a Category"
|
|
45
|
-
defaultValue="Sinister Toys"
|
|
46
|
-
/>
|
|
47
|
-
|
|
48
|
-
Selected: {inputs.category3.value}
|
|
49
|
-
````
|
|
50
|
-
|
|
51
|
-
### With a Default Value
|
|
52
|
-
|
|
53
|
-
````markdown
|
|
54
|
-
<Dropdown
|
|
55
|
-
data="categories"
|
|
56
|
-
name=category4
|
|
57
|
-
value=category_name
|
|
58
|
-
title="Select a Category"
|
|
59
|
-
defaultValue="Odd Equipment"
|
|
60
|
-
/>
|
|
61
|
-
|
|
62
|
-
Selected: {inputs.category4.value}
|
|
63
|
-
````
|
|
64
|
-
|
|
65
|
-
### With Hardcoded Options
|
|
66
|
-
|
|
67
|
-
````markdown
|
|
68
|
-
<Dropdown name=hardcoded>
|
|
69
|
-
<DropdownOption valueLabel="Option One" value="1" />
|
|
70
|
-
<DropdownOption valueLabel="Option Two" value="2" />
|
|
71
|
-
<DropdownOption valueLabel="Option Three" value="3" />
|
|
72
|
-
</Dropdown>
|
|
73
|
-
|
|
74
|
-
Selected: {inputs.hardcoded.value}
|
|
75
|
-
````
|
|
76
|
-
|
|
77
|
-
### Alternative Labels
|
|
78
|
-
|
|
79
|
-
This example uses a column called `abbrev`, which contains an alternate label for each category
|
|
80
|
-
|
|
81
|
-
````markdown
|
|
82
|
-
<Dropdown
|
|
83
|
-
data="categories"
|
|
84
|
-
name=category_abbrev
|
|
85
|
-
value=category_name
|
|
86
|
-
label=abbrev
|
|
87
|
-
/>
|
|
88
|
-
````
|
|
89
|
-
|
|
90
|
-
Selected: {inputs.category_abbrev.value}
|
|
91
|
-
|
|
92
|
-
### Multi-Select
|
|
93
|
-
|
|
94
|
-
When using multi-select dropdowns, you need to use an alternative SQL expression:
|
|
95
|
-
|
|
96
|
-
`where column_name IN ${inputs.my_input.value}`
|
|
97
|
-
|
|
98
|
-
Note:
|
|
99
|
-
- The use of the IN operator
|
|
100
|
-
- No single quotes used around the `${}`
|
|
101
|
-
|
|
102
|
-
````markdown
|
|
103
|
-
<Dropdown
|
|
104
|
-
data="categories"
|
|
105
|
-
name=category_multi
|
|
106
|
-
value=category_name
|
|
107
|
-
multiple=true
|
|
108
|
-
/>
|
|
109
|
-
|
|
110
|
-
Selected: {inputs.category_multi.value}
|
|
111
|
-
````
|
|
112
|
-
|
|
113
|
-
### Filtering a Query
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
Starting with this table of orders:
|
|
117
|
-
|
|
118
|
-
````markdown
|
|
119
|
-
<DataTable data="order_history"/>
|
|
120
|
-
````
|
|
121
|
-
|
|
122
|
-
Use this input to filter the results:
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
````markdown
|
|
126
|
-
<Dropdown
|
|
127
|
-
data="query_name"
|
|
128
|
-
name=name_of_dropdown
|
|
129
|
-
value=column_name
|
|
130
|
-
/>
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
Filtered Row Count: {orders_filtered.length}
|
|
134
|
-
|
|
135
|
-
<DataTable data="orders_filtered"/>
|
|
136
|
-
````
|
|
137
|
-
|
|
138
|
-
### Multiple defaultValues
|
|
139
|
-
|
|
140
|
-
````svelte
|
|
141
|
-
<Dropdown
|
|
142
|
-
data="query_name"
|
|
143
|
-
name=name_of_dropdown
|
|
144
|
-
value=column_name
|
|
145
|
-
multiple=true
|
|
146
|
-
defaultValue={['Sinister Toys', 'Mysterious Apparel']}
|
|
147
|
-
/>
|
|
148
|
-
|
|
149
|
-
Selected: {inputs.category_multi_default.value}
|
|
150
|
-
````
|
|
151
|
-
|
|
152
|
-
### Select all by Default Value with Multiple
|
|
153
|
-
|
|
154
|
-
Select and return all values in the dropdown list, requires "multiple" prop.
|
|
155
|
-
|
|
156
|
-
````markdown
|
|
157
|
-
<Dropdown
|
|
158
|
-
data="categories"
|
|
159
|
-
name=category_multi_selectAllByDefault
|
|
160
|
-
value=category_name
|
|
161
|
-
title="Select a Category"
|
|
162
|
-
multiple=true
|
|
163
|
-
selectAllByDefault=true
|
|
164
|
-
/>
|
|
165
|
-
|
|
166
|
-
Selected: {inputs.category_multi_selectAllByDefault.value}
|
|
167
|
-
````
|
|
168
|
-
|
|
169
|
-
# Dropdown
|
|
170
|
-
|
|
171
|
-
## Options
|
|
172
|
-
|
|
173
|
-
| Name | Description | Required | Options | Default |
|
|
174
|
-
|------|-------------|----------|---------|---------|
|
|
175
|
-
| name | Name of the dropdown, used to reference the selected value elsewhere as `{inputs.name.value}` | true | - | - |
|
|
176
|
-
| data | Query name, wrapped in curly braces | false | query name | - |
|
|
177
|
-
| value | Column name from the query containing values to pick from | false | column name | - |
|
|
178
|
-
| multiple | Enables multi-select which returns a list | false | ['true', 'false'] | "false" |
|
|
179
|
-
| defaultValue | Value to use when the dropdown is first loaded. Must be one of the options in the dropdown. Arrays supported for multi-select. | false | value from dropdown \| array of values e.g. `{['Value 1', 'Value 2']}` | - |
|
|
180
|
-
| selectAllByDefault | Selects and returns all values, multiple property required | false | ['true', 'false'] | "false" |
|
|
181
|
-
| noDefault | Stops any default from being selected. Overrides any set `defaultValue`. | false | boolean | "false" |
|
|
182
|
-
| disableSelectAll | Removes the `Select all` button. Recommended for large datasets. | false | boolean | "false" |
|
|
183
|
-
| label | Column name from the query containing labels to display instead of the values (e.g., you may want to have the drop-down use `customer_id` as the value, but show `customer_name` to your users) | false | column name | Uses the column in value |
|
|
184
|
-
| title | Title to display above the dropdown | false | string | - |
|
|
185
|
-
| order | Column to sort options by, with optional ordering keyword | false | column name [ asc \| desc ] | Ascending based on dropdown value (or label, if specified) |
|
|
186
|
-
| where | SQL where fragment to filter options by (e.g., where sales > 40000) | false | SQL where clause | - |
|
|
187
|
-
| hideDuringPrint | Hide the component when the report is printed | false | ["true", "false"] | "true" |
|
|
188
|
-
| description | Adds an info icon with description tooltip on hover | false | string | - |
|
|
189
|
-
|
|
190
|
-
# DropdownOption
|
|
191
|
-
|
|
192
|
-
## Options
|
|
193
|
-
|
|
194
|
-
The DropdownOption component can be used to manually add options to a dropdown. This is useful to add a default option, or to add options that are not in a query.
|
|
195
|
-
|
|
196
|
-
| Name | Description | Required | Options | Default |
|
|
197
|
-
|------|-------------|----------|---------|---------|
|
|
198
|
-
| value | Value to use when the option is selected | true | - | - |
|
|
199
|
-
| valueLabel | Label to display for the option in the dropdown | false | - | Uses the value |
|
|
@@ -1,126 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: Slider
|
|
3
|
-
description: Display a linear input to select a value from a range.
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
Creates a Slider input with default min, max and step values
|
|
7
|
-
|
|
8
|
-
````markdown
|
|
9
|
-
<Slider
|
|
10
|
-
title="sales"
|
|
11
|
-
name=sales
|
|
12
|
-
defaultValue=50
|
|
13
|
-
fmt="usd0"
|
|
14
|
-
/>
|
|
15
|
-
````
|
|
16
|
-
|
|
17
|
-
Min and Max values can be defined, the step property and define the incremental value of the slider
|
|
18
|
-
|
|
19
|
-
````markdown
|
|
20
|
-
<Slider
|
|
21
|
-
title="Months"
|
|
22
|
-
name=monthsWithSteps
|
|
23
|
-
min=0
|
|
24
|
-
max=36
|
|
25
|
-
step=12
|
|
26
|
-
/>
|
|
27
|
-
````
|
|
28
|
-
|
|
29
|
-
showMaxMin property can hide the Max and Min values with false, by default showMaxMin is true
|
|
30
|
-
|
|
31
|
-
````markdown
|
|
32
|
-
<Slider
|
|
33
|
-
title="Months"
|
|
34
|
-
name=monthsWithoutMinMax
|
|
35
|
-
min=0
|
|
36
|
-
max=36
|
|
37
|
-
showMaxMin=false
|
|
38
|
-
/>
|
|
39
|
-
````
|
|
40
|
-
|
|
41
|
-
The default size of the slider can be altered with the size property using; medium, large or full
|
|
42
|
-
|
|
43
|
-
````markdown
|
|
44
|
-
<Slider
|
|
45
|
-
title="Months Medium"
|
|
46
|
-
name=monthsMedium
|
|
47
|
-
defaultValue=4
|
|
48
|
-
min=0
|
|
49
|
-
max=36
|
|
50
|
-
size=medium
|
|
51
|
-
/>
|
|
52
|
-
````
|
|
53
|
-
|
|
54
|
-
````markdown
|
|
55
|
-
<Slider
|
|
56
|
-
title="Months Large"
|
|
57
|
-
name=monthsLarge
|
|
58
|
-
defaultValue=18
|
|
59
|
-
min=0
|
|
60
|
-
max=36
|
|
61
|
-
size=large
|
|
62
|
-
/>
|
|
63
|
-
````
|
|
64
|
-
|
|
65
|
-
````markdown
|
|
66
|
-
<Slider
|
|
67
|
-
title="Months Full"
|
|
68
|
-
name=monthsFull
|
|
69
|
-
defaultValue=26
|
|
70
|
-
min=0
|
|
71
|
-
max=36
|
|
72
|
-
size=full
|
|
73
|
-
/>
|
|
74
|
-
````
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
## Specifying Dynamic Columns
|
|
78
|
-
|
|
79
|
-
Supply data with a specified column name to define the slider's min and max values. The slider's range will be calculated based on the column's minimum and maximum values.
|
|
80
|
-
|
|
81
|
-
````markdown
|
|
82
|
-
<Slider
|
|
83
|
-
title='data slider'
|
|
84
|
-
name='RangeSlider'
|
|
85
|
-
size=large
|
|
86
|
-
step=100
|
|
87
|
-
data="flight_data"
|
|
88
|
-
range=fare
|
|
89
|
-
/>
|
|
90
|
-
````
|
|
91
|
-
|
|
92
|
-
Supply data with specified column names for minColumn, maxColumn, and/or defaultValue. The first row's value in each of these columns will determine the minimum, maximum, or default value, respectively.
|
|
93
|
-
|
|
94
|
-
````markdown
|
|
95
|
-
<Slider
|
|
96
|
-
title='data slider'
|
|
97
|
-
name='MaxColSlider'
|
|
98
|
-
size=large
|
|
99
|
-
step=100
|
|
100
|
-
data="flight_data"
|
|
101
|
-
maxColumn=max_fare
|
|
102
|
-
min=0
|
|
103
|
-
defaultValue=max_fare
|
|
104
|
-
/>
|
|
105
|
-
````
|
|
106
|
-
|
|
107
|
-
# Slider
|
|
108
|
-
|
|
109
|
-
## Options
|
|
110
|
-
|
|
111
|
-
| Name | Description | Required | Options | Default |
|
|
112
|
-
|------|-------------|----------|---------|---------|
|
|
113
|
-
| name | name of the slider, used to reference the selected value elsewhere as `{inputs.name}` | true | - | - |
|
|
114
|
-
| defaultValue | Sets the initial value of the silder | false | - | - |
|
|
115
|
-
| min | Sets the minimum value on the slider. Negative Values accepted. | false | number | 0 |
|
|
116
|
-
| max | Sets the maximum value on the slider. This value must be larger than the min. | false | number | 100 |
|
|
117
|
-
| data | Query name, wrapped in curly braces | false | query name | - |
|
|
118
|
-
| range | Required for data - Take and sets the max and min values of a column | false | string - column name | - |
|
|
119
|
-
| maxColumn | Takes the first value of a column and assigns it to the max value | false | string - column name | - |
|
|
120
|
-
| minColumn | Takes the first value of a column and assigns it to the min value | false | string - column name | - |
|
|
121
|
-
| step | Defines the incremental value of the slider | false | number | 1 |
|
|
122
|
-
| showMinMax | Hides or shows min and max value markers on slider. | false | boolean | "true" |
|
|
123
|
-
| size | Sets the length of the slider | false | ["small", "medium", "large", "full"] | "small" |
|
|
124
|
-
| fmt | Sets format for the value ([see available formats](/core-concepts/formatting)) | false | Excel-style format \| built-in format \| custom format | - |
|
|
125
|
-
| description | Adds an info icon with description tooltip on hover | false | string | - |
|
|
126
|
-
| hideDuringPrint | Hide the component when the report is printed | false | ["true", "false"] | "true" |
|
|
@@ -1,86 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: Text Input
|
|
3
|
-
description: Display a text box for freeform text input, useful for searching or filtering.
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
Creates a text input that can be used to filter or search
|
|
7
|
-
|
|
8
|
-
To see how to filter a query using a text input, see [Filters](/core-concepts/filters).
|
|
9
|
-
|
|
10
|
-
````markdown
|
|
11
|
-
<TextInput
|
|
12
|
-
name=name_of_input
|
|
13
|
-
title="Search"
|
|
14
|
-
/>
|
|
15
|
-
|
|
16
|
-
Selected: {inputs.text_input_name}
|
|
17
|
-
````
|
|
18
|
-
|
|
19
|
-
## Examples
|
|
20
|
-
|
|
21
|
-
### Basic Text Input
|
|
22
|
-
|
|
23
|
-
````markdown
|
|
24
|
-
<TextInput
|
|
25
|
-
name=name_of_input
|
|
26
|
-
/>
|
|
27
|
-
|
|
28
|
-
Selected: {inputs.name_of_input}
|
|
29
|
-
````
|
|
30
|
-
|
|
31
|
-
### With Title
|
|
32
|
-
|
|
33
|
-
````markdown
|
|
34
|
-
<TextInput
|
|
35
|
-
name=name_of_input
|
|
36
|
-
title="Search"
|
|
37
|
-
/>
|
|
38
|
-
|
|
39
|
-
Selected: {inputs.text_input2}
|
|
40
|
-
````
|
|
41
|
-
|
|
42
|
-
### With Placeholder
|
|
43
|
-
|
|
44
|
-
````markdown
|
|
45
|
-
<TextInput
|
|
46
|
-
name=name_of_input
|
|
47
|
-
title="Freetext Search"
|
|
48
|
-
placeholder="Start typing"
|
|
49
|
-
/>
|
|
50
|
-
|
|
51
|
-
Selected: {inputs.text_input3}
|
|
52
|
-
````
|
|
53
|
-
|
|
54
|
-
### With Default Text Prefilled
|
|
55
|
-
|
|
56
|
-
````markdown
|
|
57
|
-
<TextInput
|
|
58
|
-
name=name_of_input
|
|
59
|
-
title="Default Selected"
|
|
60
|
-
defaultValue="Sporting"
|
|
61
|
-
/>
|
|
62
|
-
|
|
63
|
-
Selected: {inputs.text_input4}
|
|
64
|
-
````
|
|
65
|
-
|
|
66
|
-
### Fuzzy Finding (Searching)
|
|
67
|
-
|
|
68
|
-
`TextInput` provides an easy-to-use shortcut for [fuzzy finding](https://duckdb.org/docs/sql/functions/char#text-similarity-functions). Note that this is different than `LIKE`, as it does not require a direct substring, and is useful in situtations where spelling may be unknown, like names.
|
|
69
|
-
|
|
70
|
-
You can reference it by using the syntax `{inputs.your_input_name.search('column_name')}`, and it returns a number between 0 and 1.
|
|
71
|
-
|
|
72
|
-
## Usage
|
|
73
|
-
|
|
74
|
-
Assuming you had some TextInput `first_name_search`:
|
|
75
|
-
|
|
76
|
-
becomes
|
|
77
|
-
|
|
78
|
-
## Options
|
|
79
|
-
|
|
80
|
-
| Name | Description | Required | Options | Default |
|
|
81
|
-
|------|-------------|----------|---------|---------|
|
|
82
|
-
| name | Name of the text input, used to reference the selected value elsewhere as `{inputs.name.value}` | true | string | - |
|
|
83
|
-
| title | Title displayed above the text input | false | string | - |
|
|
84
|
-
| placeholder | Alternative placeholder text displayed in the text input | false | string | "Type to search" |
|
|
85
|
-
| hideDuringPrint | Hide the component when the report is printed | false | ['true', 'false'] | "true" |
|
|
86
|
-
| description | Adds an info icon with description tooltip on hover | false | string | - |
|