@gradio/code 0.9.1 → 0.10.0-beta.3

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 (8) hide show
  1. package/CHANGELOG.md +33 -1
  2. package/Index.svelte +3 -4
  3. package/dist/Index.svelte +3 -3
  4. package/dist/Index.svelte.d.ts +1 -0
  5. package/dist/shared/Code.svelte +12 -11
  6. package/dist/shared/Code.svelte.d.ts +1 -0
  7. package/package.json +7 -7
  8. package/shared/Code.svelte +13 -11
package/CHANGELOG.md CHANGED
@@ -1,11 +1,43 @@
1
1
  # @gradio/code
2
2
 
3
- ## 0.9.1
3
+ ## 0.10.0-beta.3
4
+
5
+ ### Dependency updates
6
+
7
+ - @gradio/upload@0.13.0-beta.3
8
+
9
+ ## 0.10.0-beta.2
10
+
11
+ ### Features
12
+
13
+ - [#9311](https://github.com/gradio-app/gradio/pull/9311) [`c4afdcd`](https://github.com/gradio-app/gradio/commit/c4afdcdb1f1f80c5f95ab45d527236e9364ace82) - Added max lines and overflow scrollbar for `gr.Code`. Thanks @micpst!
14
+
15
+ ### Dependency updates
16
+
17
+ - @gradio/atoms@0.9.0-beta.2
18
+ - @gradio/upload@0.13.0-beta.2
19
+ - @gradio/wasm@0.14.0-beta.2
20
+ - @gradio/icons@0.8.0-beta.2
21
+ - @gradio/statustracker@0.8.0-beta.2
22
+ - @gradio/utils@0.7.0-beta.2
23
+
24
+ ## 0.9.1-beta.1
4
25
 
5
26
  ### Features
6
27
 
7
28
  - [#9187](https://github.com/gradio-app/gradio/pull/9187) [`5bf00b7`](https://github.com/gradio-app/gradio/commit/5bf00b7524ebf399b48719120a49d15bb21bd65c) - make all component SSR compatible. Thanks @pngwn!
8
29
 
30
+ ### Dependency updates
31
+
32
+ - @gradio/atoms@0.8.1-beta.1
33
+ - @gradio/icons@0.8.0-beta.1
34
+ - @gradio/statustracker@0.8.0-beta.1
35
+ - @gradio/utils@0.7.0-beta.1
36
+ - @gradio/upload@0.12.4-beta.1
37
+ - @gradio/wasm@0.13.1-beta.1
38
+
39
+ ## 0.9.1-beta.0
40
+
9
41
  ### Fixes
10
42
 
11
43
  - [#9163](https://github.com/gradio-app/gradio/pull/9163) [`2b6cbf2`](https://github.com/gradio-app/gradio/commit/2b6cbf25908e42cf027324e54ef2cc0baad11a91) - fix exports and generate types. Thanks @pngwn!
package/Index.svelte CHANGED
@@ -29,6 +29,7 @@
29
29
  export let value_is_output = false;
30
30
  export let language = "";
31
31
  export let lines = 5;
32
+ export let max_lines = 20;
32
33
  export let elem_id = "";
33
34
  export let elem_classes: string[] = [];
34
35
  export let visible = true;
@@ -51,13 +52,10 @@
51
52
  value_is_output = false;
52
53
  });
53
54
  $: value, handle_change();
54
-
55
- const is_browser = typeof window !== "undefined";
56
- const default_lines = interactive ? lines : 10.35;
57
55
  </script>
58
56
 
59
57
  <Block
60
- height={is_browser ? undefined : default_lines * 25 + 4}
58
+ height={"fit-content"}
61
59
  variant={"solid"}
62
60
  padding={false}
63
61
  {elem_id}
@@ -85,6 +83,7 @@
85
83
  bind:value
86
84
  {language}
87
85
  {lines}
86
+ {max_lines}
88
87
  {dark_mode}
89
88
  readonly={!interactive}
90
89
  on:blur={() => gradio.dispatch("blur")}
package/dist/Index.svelte CHANGED
@@ -16,6 +16,7 @@ export let value = "";
16
16
  export let value_is_output = false;
17
17
  export let language = "";
18
18
  export let lines = 5;
19
+ export let max_lines = 20;
19
20
  export let elem_id = "";
20
21
  export let elem_classes = [];
21
22
  export let visible = true;
@@ -36,12 +37,10 @@ afterUpdate(() => {
36
37
  });
37
38
  $:
38
39
  value, handle_change();
39
- const is_browser = typeof window !== "undefined";
40
- const default_lines = interactive ? lines : 10.35;
41
40
  </script>
42
41
 
43
42
  <Block
44
- height={is_browser ? undefined : default_lines * 25 + 4}
43
+ height={"fit-content"}
45
44
  variant={"solid"}
46
45
  padding={false}
47
46
  {elem_id}
@@ -69,6 +68,7 @@ const default_lines = interactive ? lines : 10.35;
69
68
  bind:value
70
69
  {language}
71
70
  {lines}
71
+ {max_lines}
72
72
  {dark_mode}
73
73
  readonly={!interactive}
74
74
  on:blur={() => gradio.dispatch("blur")}
package/dist/Index.svelte.d.ts CHANGED
@@ -19,6 +19,7 @@ declare const __propDef: {
19
19
  value_is_output?: boolean | undefined;
20
20
  language?: string | undefined;
21
21
  lines?: number | undefined;
22
+ max_lines?: number | undefined;
22
23
  elem_id?: string | undefined;
23
24
  elem_classes?: string[] | undefined;
24
25
  visible?: boolean | undefined;
package/dist/shared/Code.svelte CHANGED
@@ -17,6 +17,7 @@ export let dark_mode;
17
17
  export let basic = true;
18
18
  export let language;
19
19
  export let lines = 5;
20
+ export let max_lines = 20;
20
21
  export let extensions = [];
21
22
  export let use_tab = true;
22
23
  export let readonly = false;
@@ -50,7 +51,7 @@ function set_doc(new_doc) {
50
51
  }
51
52
  function update_lines() {
52
53
  if (view) {
53
- view.requestMeasure({ read: update_gutters });
54
+ view.requestMeasure({ read: resize });
54
55
  }
55
56
  }
56
57
  function create_editor_view() {
@@ -82,18 +83,18 @@ function getGutterLineHeight(_view) {
82
83
  }
83
84
  return null;
84
85
  }
85
- function update_gutters(_view) {
86
- let gutters = _view.dom.querySelectorAll(".cm-gutter");
87
- let _lines = lines + 1;
88
- let lineHeight = getGutterLineHeight(_view);
89
- if (!lineHeight) {
86
+ function resize(_view) {
87
+ let scroller = _view.dom.querySelector(".cm-scroller");
88
+ if (!scroller) {
90
89
  return null;
91
90
  }
92
- for (var i = 0; i < gutters.length; i++) {
93
- let node = gutters[i];
94
- node.style.minHeight = `calc(${lineHeight} * ${_lines})`;
91
+ const lineHeight = getGutterLineHeight(_view);
92
+ if (!lineHeight) {
93
+ return null;
95
94
  }
96
- return null;
95
+ const minLines = lines == 1 ? 1 : lines + 1;
96
+ scroller.style.minHeight = `calc(${lineHeight} * ${minLines})`;
97
+ scroller.style.maxHeight = `calc(${lineHeight} * ${max_lines + 1})`;
97
98
  }
98
99
  function handle_change(vu) {
99
100
  if (vu.docChanged) {
@@ -102,7 +103,7 @@ function handle_change(vu) {
102
103
  value = text;
103
104
  dispatch("change", text);
104
105
  }
105
- view.requestMeasure({ read: update_gutters });
106
+ view.requestMeasure({ read: resize });
106
107
  }
107
108
  function get_extensions() {
108
109
  const stateExtensions = [
package/dist/shared/Code.svelte.d.ts CHANGED
@@ -8,6 +8,7 @@ declare const __propDef: {
8
8
  basic?: boolean | undefined;
9
9
  language: string;
10
10
  lines?: number | undefined;
11
+ max_lines?: number | undefined;
11
12
  extensions?: Extension[] | undefined;
12
13
  use_tab?: boolean | undefined;
13
14
  readonly?: boolean | undefined;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gradio/code",
3
- "version": "0.9.1",
3
+ "version": "0.10.0-beta.3",
4
4
  "description": "Gradio UI packages",
5
5
  "type": "module",
6
6
  "author": "",
@@ -27,12 +27,12 @@
27
27
  "cm6-theme-basic-dark": "^0.2.0",
28
28
  "cm6-theme-basic-light": "^0.2.0",
29
29
  "codemirror": "^6.0.1",
30
- "@gradio/atoms": "^0.8.1",
31
- "@gradio/icons": "^0.7.2",
32
- "@gradio/statustracker": "^0.7.6",
33
- "@gradio/upload": "^0.12.4",
34
- "@gradio/utils": "^0.6.1",
35
- "@gradio/wasm": "^0.13.1"
30
+ "@gradio/atoms": "^0.9.0-beta.2",
31
+ "@gradio/icons": "^0.8.0-beta.2",
32
+ "@gradio/statustracker": "^0.8.0-beta.2",
33
+ "@gradio/upload": "^0.13.0-beta.3",
34
+ "@gradio/utils": "^0.7.0-beta.2",
35
+ "@gradio/wasm": "^0.14.0-beta.2"
36
36
  },
37
37
  "main_changeset": true,
38
38
  "main": "./Index.svelte",
package/shared/Code.svelte CHANGED
@@ -20,6 +20,7 @@
20
20
  export let basic = true;
21
21
  export let language: string;
22
22
  export let lines = 5;
23
+ export let max_lines = 20;
23
24
  export let extensions: Extension[] = [];
24
25
  export let use_tab = true;
25
26
  export let readonly = false;
@@ -59,7 +60,7 @@
59
60
 
60
61
  function update_lines(): void {
61
62
  if (view) {
62
- view.requestMeasure({ read: update_gutters });
63
+ view.requestMeasure({ read: resize });
63
64
  }
64
65
  }
65
66
 
@@ -96,18 +97,19 @@
96
97
  return null;
97
98
  }
98
99
 
99
- function update_gutters(_view: EditorView): any {
100
- let gutters = _view.dom.querySelectorAll<HTMLElement>(".cm-gutter");
101
- let _lines = lines + 1;
102
- let lineHeight = getGutterLineHeight(_view);
103
- if (!lineHeight) {
100
+ function resize(_view: EditorView): any {
101
+ let scroller = _view.dom.querySelector<HTMLElement>(".cm-scroller");
102
+ if (!scroller) {
104
103
  return null;
105
104
  }
106
- for (var i = 0; i < gutters.length; i++) {
107
- let node = gutters[i];
108
- node.style.minHeight = `calc(${lineHeight} * ${_lines})`;
105
+ const lineHeight = getGutterLineHeight(_view);
106
+ if (!lineHeight) {
107
+ return null;
109
108
  }
110
- return null;
109
+
110
+ const minLines = lines == 1 ? 1 : lines + 1;
111
+ scroller.style.minHeight = `calc(${lineHeight} * ${minLines})`;
112
+ scroller.style.maxHeight = `calc(${lineHeight} * ${max_lines + 1})`;
111
113
  }
112
114
 
113
115
  function handle_change(vu: ViewUpdate): void {
@@ -117,7 +119,7 @@
117
119
  value = text;
118
120
  dispatch("change", text);
119
121
  }
120
- view.requestMeasure({ read: update_gutters });
122
+ view.requestMeasure({ read: resize });
121
123
  }
122
124
 
123
125
  function get_extensions(): Extension[] {