@gradio/code 0.10.17 → 0.11.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @gradio/code
 
+## 0.11.0
+
+### Features
+
+- [#10643](https://github.com/gradio-app/gradio/pull/10643) [`f0a920c`](https://github.com/gradio-app/gradio/commit/f0a920c4934880645fbad783077ae9c7519856ce) - added a show_line_numbers to toggle line numbers in gr.Code().  Thanks @lalitx17!
+
+## 0.10.18
+
+### Dependency updates
+
+- @gradio/upload@0.15.2
+- @gradio/statustracker@0.10.4
+- @gradio/atoms@0.13.3
+
 ## 0.10.17
 
 ### Dependency updates

package/Index.svelte

@@ -39,6 +39,7 @@
 	export let scale: number | null = null;
 	export let min_width: number | undefined = undefined;
 	export let wrap_lines = false;
+	export let show_line_numbers = true;
 
 	export let interactive: boolean;
 
@@ -91,6 +92,7 @@
 			{max_lines}
 			{dark_mode}
 			{wrap_lines}
+			{show_line_numbers}
 			readonly={!interactive}
 			on:blur={() => gradio.dispatch("blur")}
 			on:focus={() => gradio.dispatch("focus")}

package/dist/Index.svelte

@@ -26,6 +26,7 @@ export let loading_status;
 export let scale = null;
 export let min_width = void 0;
 export let wrap_lines = false;
+export let show_line_numbers = true;
 export let interactive;
 let dark_mode = gradio.theme === "dark";
 function handle_change() {
@@ -76,6 +77,7 @@ $:
 			{max_lines}
 			{dark_mode}
 			{wrap_lines}
+			{show_line_numbers}
 			readonly={!interactive}
 			on:blur={() => gradio.dispatch("blur")}
 			on:focus={() => gradio.dispatch("focus")}

package/dist/Index.svelte.d.ts

@@ -29,6 +29,7 @@ declare const __propDef: {
         scale?: (number | null) | undefined;
         min_width?: number | undefined;
         wrap_lines?: boolean | undefined;
+        show_line_numbers?: boolean | undefined;
         interactive: boolean;
     };
     events: {

package/dist/shared/Code.svelte

@@ -3,7 +3,8 @@ import {
   EditorView,
   ViewUpdate,
   keymap,
-  placeholder as placeholderExt
+  placeholder as placeholderExt,
+  lineNumbers
 } from "@codemirror/view";
 import { StateEffect, EditorState } from "@codemirror/state";
 import { indentWithTab } from "@codemirror/commands";
@@ -23,6 +24,7 @@ export let use_tab = true;
 export let readonly = false;
 export let placeholder = void 0;
 export let wrap_lines = false;
+export let show_line_numbers = true;
 const dispatch = createEventDispatcher();
 let lang_extension;
 let element;
@@ -114,7 +116,8 @@ function get_extensions() {
       use_tab,
       placeholder,
       readonly,
-      lang_extension
+      lang_extension,
+      show_line_numbers
     ),
     FontTheme,
     ...get_theme(),
@@ -159,7 +162,7 @@ function create_editor_state(_value) {
     extensions: get_extensions()
   });
 }
-function get_base_extensions(basic2, use_tab2, placeholder2, readonly2, lang) {
+function get_base_extensions(basic2, use_tab2, placeholder2, readonly2, lang, show_line_numbers2) {
   const extensions2 = [
     EditorView.editable.of(!readonly2),
     EditorState.readOnly.of(readonly2),
@@ -177,6 +180,9 @@ function get_base_extensions(basic2, use_tab2, placeholder2, readonly2, lang) {
   if (lang) {
     extensions2.push(lang);
   }
+  if (show_line_numbers2) {
+    extensions2.push(lineNumbers());
+  }
   extensions2.push(EditorView.updateListener.of(handle_change));
   if (wrap_lines) {
     extensions2.push(EditorView.lineWrapping);

package/dist/shared/Code.svelte.d.ts

@@ -14,6 +14,7 @@ declare const __propDef: {
         readonly?: boolean | undefined;
         placeholder?: string | HTMLElement | null | undefined;
         wrap_lines?: boolean | undefined;
+        show_line_numbers?: boolean | undefined;
     };
     events: {
         change: CustomEvent<string>;

package/dist/shared/extensions.js

@@ -6,7 +6,6 @@ import { history, defaultKeymap, historyKeymap } from "@codemirror/commands";
 import { closeBrackets, closeBracketsKeymap, completionKeymap } from "@codemirror/autocomplete";
 import { lintKeymap } from "@codemirror/lint";
 export const basicSetup = /*@__PURE__*/ (() => [
-    lineNumbers(),
     highlightSpecialChars(),
     history(),
     foldGutter(),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gradio/code",
-  "version": "0.10.17",
+  "version": "0.11.0",
   "description": "Gradio UI packages",
   "type": "module",
   "author": "",
@@ -27,12 +27,12 @@
     "cm6-theme-basic-dark": "^0.2.0",
     "cm6-theme-basic-light": "^0.2.0",
     "codemirror": "^6.0.1",
-    "@gradio/atoms": "^0.13.2",
-    "@gradio/icons": "^0.10.0",
-    "@gradio/upload": "^0.15.1",
+    "@gradio/atoms": "^0.13.3",
+    "@gradio/statustracker": "^0.10.4",
+    "@gradio/upload": "^0.15.2",
+    "@gradio/wasm": "^0.17.3",
     "@gradio/utils": "^0.10.1",
-    "@gradio/statustracker": "^0.10.3",
-    "@gradio/wasm": "^0.17.3"
+    "@gradio/icons": "^0.10.0"
   },
   "main_changeset": true,
   "main": "./Index.svelte",

package/shared/Code.svelte

@@ -4,7 +4,8 @@
 		EditorView,
 		ViewUpdate,
 		keymap,
-		placeholder as placeholderExt
+		placeholder as placeholderExt,
+		lineNumbers
 	} from "@codemirror/view";
 	import { StateEffect, EditorState, type Extension } from "@codemirror/state";
 	import { indentWithTab } from "@codemirror/commands";
@@ -26,6 +27,7 @@
 	export let readonly = false;
 	export let placeholder: string | HTMLElement | null | undefined = undefined;
 	export let wrap_lines = false;
+	export let show_line_numbers = true;
 
 	const dispatch = createEventDispatcher<{
 		change: string;
@@ -131,7 +133,8 @@
 				use_tab,
 				placeholder,
 				readonly,
-				lang_extension
+				lang_extension,
+				show_line_numbers
 			),
 			FontTheme,
 			...get_theme(),
@@ -184,7 +187,8 @@
 		use_tab: boolean,
 		placeholder: string | HTMLElement | null | undefined,
 		readonly: boolean,
-		lang: Extension | null | undefined
+		lang: Extension | null | undefined,
+		show_line_numbers: boolean
 	): Extension[] {
 		const extensions: Extension[] = [
 			EditorView.editable.of(!readonly),
@@ -205,10 +209,15 @@
 			extensions.push(lang);
 		}
 
+		if (show_line_numbers) {
+			extensions.push(lineNumbers());
+		}
+
 		extensions.push(EditorView.updateListener.of(handle_change));
 		if (wrap_lines) {
 			extensions.push(EditorView.lineWrapping);
 		}
+
 		return extensions;
 	}
 

package/shared/extensions.ts

@@ -25,7 +25,6 @@ import {
 import { lintKeymap } from "@codemirror/lint";
 
 export const basicSetup: Extension = /*@__PURE__*/ ((): Extension[] => [
-	lineNumbers(),
 	highlightSpecialChars(),
 	history(),
 	foldGutter(),