@gradio/dataframe 0.3.0-beta.6 → 0.3.0

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 (6) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/Dataframe.stories.svelte +3 -2
  3. package/Index.svelte +7 -2
  4. package/README.md +42 -0
  5. package/package.json +8 -7
  6. package/shared/EditableCell.svelte +11 -6
package/CHANGELOG.md CHANGED
@@ -1,5 +1,29 @@
1
1
  # @gradio/dataframe
2
2
 
3
+ ## 0.3.0
4
+
5
+ ### Features
6
+
7
+ - [#5498](https://github.com/gradio-app/gradio/pull/5498) [`287fe6782`](https://github.com/gradio-app/gradio/commit/287fe6782825479513e79a5cf0ba0fbfe51443d7) - Publish all components to npm. Thanks [@pngwn](https://github.com/pngwn)!
8
+ - [#5498](https://github.com/gradio-app/gradio/pull/5498) [`287fe6782`](https://github.com/gradio-app/gradio/commit/287fe6782825479513e79a5cf0ba0fbfe51443d7) - Custom components. Thanks [@pngwn](https://github.com/pngwn)!
9
+
10
+ ## 0.3.0-beta.8
11
+
12
+ ### Features
13
+
14
+ - [#6136](https://github.com/gradio-app/gradio/pull/6136) [`667802a6c`](https://github.com/gradio-app/gradio/commit/667802a6cdbfb2ce454a3be5a78e0990b194548a) - JS Component Documentation. Thanks [@freddyaboulton](https://github.com/freddyaboulton)!
15
+ - [#6149](https://github.com/gradio-app/gradio/pull/6149) [`90318b1dd`](https://github.com/gradio-app/gradio/commit/90318b1dd118ae08a695a50e7c556226234ab6dc) - swap `mode` on the frontned to `interactive` to match the backend. Thanks [@pngwn](https://github.com/pngwn)!
16
+
17
+ ## 0.3.0-beta.7
18
+
19
+ ### Features
20
+
21
+ - [#6016](https://github.com/gradio-app/gradio/pull/6016) [`83e947676`](https://github.com/gradio-app/gradio/commit/83e947676d327ca2ab6ae2a2d710c78961c771a0) - Format js in v4 branch. Thanks [@freddyaboulton](https://github.com/freddyaboulton)!
22
+
23
+ ### Fixes
24
+
25
+ - [#6046](https://github.com/gradio-app/gradio/pull/6046) [`dbb7de5e0`](https://github.com/gradio-app/gradio/commit/dbb7de5e02c53fee05889d696d764d212cb96c74) - fix tests. Thanks [@pngwn](https://github.com/pngwn)!
26
+
3
27
  ## 0.3.0-beta.6
4
28
 
5
29
  ### Features
package/Dataframe.stories.svelte CHANGED
@@ -1,5 +1,6 @@
1
- <script>
1
+ <script lang="ts">
2
2
  import { Meta, Template, Story } from "@storybook/addon-svelte-csf";
3
+ import { Gradio } from "../app/src/gradio_helper";
3
4
  import Table from "./shared/Table.svelte";
4
5
  </script>
5
6
 
@@ -17,7 +18,7 @@
17
18
  />
18
19
 
19
20
  <Template let:args>
20
- <Table {...args} />
21
+ <Table {...args} i18n={(s) => s} />
21
22
  </Template>
22
23
 
23
24
  <Story
package/Index.svelte CHANGED
@@ -1,3 +1,8 @@
1
+ <script context="module" lang="ts">
2
+ export { default as BaseDataFrame } from "./shared/Table.svelte";
3
+ export { default as BaseExample } from "./Example.svelte";
4
+ </script>
5
+
1
6
  <script lang="ts">
2
7
  import { afterUpdate } from "svelte";
3
8
  import type { Gradio, SelectData } from "@gradio/utils";
@@ -41,7 +46,7 @@
41
46
  export let height: number | undefined = undefined;
42
47
 
43
48
  export let loading_status: LoadingStatus;
44
- export let mode: "static" | "interactive";
49
+ export let interactive: boolean;
45
50
 
46
51
  function handle_change(): void {
47
52
  gradio.dispatch("change");
@@ -98,7 +103,7 @@
98
103
  {wrap}
99
104
  {datatype}
100
105
  {latex_delimiters}
101
- editable={mode === "interactive"}
106
+ editable={interactive}
102
107
  {height}
103
108
  i18n={gradio.i18n}
104
109
  {line_breaks}
package/README.md ADDED
@@ -0,0 +1,42 @@
1
+ # `@gradio/dataframe`
2
+
3
+ ```html
4
+ <script>
5
+ import { BaseDataFrame, BaseExample } from "@gradio/dataframe";
6
+ </script>
7
+ ```
8
+
9
+ BaseDataFrame
10
+ ```javascript
11
+ export let datatype: Datatype | Datatype[];
12
+ export let label: string | null = null;
13
+ export let headers: Headers = [];
14
+ let values: (string | number)[][];
15
+ export let value: { data: Data; headers: Headers; metadata: Metadata } | null;
16
+ export let col_count: [number, "fixed" | "dynamic"];
17
+ export let row_count: [number, "fixed" | "dynamic"];
18
+ export let latex_delimiters: {
19
+ left: string;
20
+ right: string;
21
+ display: boolean;
22
+ }[];
23
+
24
+ export let editable = true;
25
+ export let wrap = false;
26
+ export let root: string;
27
+ export let i18n: I18nFormatter;
28
+
29
+ export let height = 500;
30
+ export let line_breaks = true;
31
+ export let column_widths: string[] = [];
32
+ ```
33
+
34
+ BaseExample
35
+ ```javascript
36
+ export let gradio: Gradio;
37
+ export let value: (string | number)[][] | string;
38
+ export let samples_dir: string;
39
+ export let type: "gallery" | "table";
40
+ export let selected = false;
41
+ export let index: number;
42
+ ```
package/package.json CHANGED
@@ -1,12 +1,13 @@
1
1
  {
2
2
  "name": "@gradio/dataframe",
3
- "version": "0.3.0-beta.6",
3
+ "version": "0.3.0",
4
4
  "description": "Gradio UI packages",
5
5
  "type": "module",
6
6
  "author": "",
7
7
  "license": "ISC",
8
8
  "private": false,
9
9
  "main_changeset": true,
10
+ "main": "./Index.svelte",
10
11
  "dependencies": {
11
12
  "@types/d3-dsv": "^3.0.0",
12
13
  "@types/dompurify": "^3.0.2",
@@ -16,12 +17,12 @@
16
17
  "dompurify": "^3.0.3",
17
18
  "katex": "^0.16.7",
18
19
  "marked": "^7.0.0",
19
- "@gradio/atoms": "^0.2.0-beta.4",
20
- "@gradio/button": "^0.2.0-beta.5",
21
- "@gradio/markdown": "^0.3.0-beta.6",
22
- "@gradio/statustracker": "^0.3.0-beta.6",
23
- "@gradio/upload": "^0.3.0-beta.4",
24
- "@gradio/utils": "^0.2.0-beta.4"
20
+ "@gradio/atoms": "^0.2.0",
21
+ "@gradio/button": "^0.2.0",
22
+ "@gradio/markdown": "^0.3.0",
23
+ "@gradio/statustracker": "^0.3.0",
24
+ "@gradio/upload": "^0.3.0",
25
+ "@gradio/utils": "^0.2.0"
25
26
  },
26
27
  "exports": {
27
28
  ".": "./Index.svelte",
package/shared/EditableCell.svelte CHANGED
@@ -1,6 +1,5 @@
1
1
  <script lang="ts">
2
2
  import { createEventDispatcher } from "svelte";
3
- import type { ActionReturn } from "svelte/action";
4
3
  import { MarkdownCode } from "@gradio/markdown";
5
4
 
6
5
  export let edit: boolean;
@@ -30,7 +29,7 @@
30
29
  export let el: HTMLInputElement | null;
31
30
  $: _value = value;
32
31
 
33
- function use_focus(node: HTMLInputElement): ActionReturn {
32
+ function use_focus(node: HTMLInputElement): any {
34
33
  if (clear_on_focus) {
35
34
  _value = "";
36
35
  }
@@ -42,6 +41,15 @@
42
41
 
43
42
  return {};
44
43
  }
44
+
45
+ function handle_blur({
46
+ currentTarget
47
+ }: {
48
+ currentTarget: HTMLInputElement;
49
+ }): void {
50
+ value = currentTarget.value;
51
+ dispatch("blur");
52
+ }
45
53
  </script>
46
54
 
47
55
  {#if edit}
@@ -50,10 +58,7 @@
50
58
  bind:value={_value}
51
59
  class:header
52
60
  tabindex="-1"
53
- on:blur={({ currentTarget }) => {
54
- value = currentTarget.value;
55
- dispatch("blur");
56
- }}
61
+ on:blur={handle_blur}
57
62
  use:use_focus
58
63
  on:keydown
59
64
  />