docs: replace vue-resizable-panels with splitpanes

ntnyq · ntnyq · commit a75221143d0d · 2025-05-14T16:39:03.000+08:00
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -36,6 +36,7 @@
     "shikijs",
     "tspan",
     "unplugin",
+    "unrs",
     "vite",
     "vitepress",
     "vitest",
diff --git a/docs/.vitepress/components/DropZone.vue b/docs/.vitepress/components/DropZone.vue
@@ -38,7 +38,9 @@ function onDragOver(evt: DragEvent) {
   evt.preventDefault()
 }
 async function onImportFile(files?: FileList | null) {
-  if (!files) return
+  if (!files) {
+    return
+  }
 
   const file = files[0]
   const fileExt = file.name.split('.').pop()?.toLowerCase()
@@ -56,6 +58,7 @@ async function onImportFile(files?: FileList | null) {
 }
 async function onDrop(evt: DragEvent) {
   evt.preventDefault()
+
   if (!isFileDrag(evt)) {
     return
   }
diff --git a/docs/.vitepress/components/Editor/index.vue b/docs/.vitepress/components/Editor/index.vue
@@ -5,11 +5,11 @@ import { Codemirror } from 'vue-codemirror'
 import { languages } from './language'
 import { githubDark, githubLight } from './theme'
 import type { Extension } from '@codemirror/state'
-import type { SupportLanguage } from './language'
+import type { SupportedLanguage } from './language'
 
 const props = withDefaults(
   defineProps<{
-    language?: SupportLanguage
+    language?: SupportedLanguage
     extensions?: Extension[]
     placeholder?: string
     disabled?: boolean
@@ -32,7 +32,6 @@ const resolvedExtensions = computed(() => {
   const extentions: Extension[] = [
     // External extension
     ...props.extensions,
-
     // Theme extension
     isDark.value ? githubDark : githubLight,
   ]
diff --git a/docs/.vitepress/components/Editor/language.ts b/docs/.vitepress/components/Editor/language.ts
@@ -9,7 +9,7 @@ export interface Language {
   extension: () => LanguageSupport | Extension[]
 }
 
-export type SupportLanguage = 'xml' | 'json'
+export type SupportedLanguage = 'xml' | 'json'
 
 export const languages: Language[] = [
   {
diff --git a/docs/.vitepress/components/Playground/ActionContainer.vue b/docs/.vitepress/components/Playground/ActionContainer.vue
@@ -15,7 +15,9 @@ const {
 const { parseCost, setCode, resetPlayground } = useSharedPlaygroundState()
 
 handleFileDialogChange(files => {
-  if (!files?.length) return
+  if (!files?.length) {
+    return
+  }
   tryLoadFile(files[0])
 })
 
@@ -25,7 +27,9 @@ function tryLoadFile(file: File) {
   reader.addEventListener('load', (event: ProgressEvent<FileReader>) => {
     const content = event.target?.result ?? ''
 
-    if (typeof content !== 'string') return
+    if (typeof content !== 'string') {
+      return
+    }
 
     setCode(content)
     resetSelectedFiles()
diff --git a/docs/.vitepress/components/Playground/index.vue b/docs/.vitepress/components/Playground/index.vue
@@ -1,40 +1,27 @@
 <script lang="ts" setup>
 import './style.css'
-import { Panel, PanelGroup, PanelResizeHandle } from 'vue-resizable-panels'
+import 'splitpanes/dist/splitpanes.css'
+import { Pane, Splitpanes } from 'splitpanes'
 </script>
 
 <template>
   <div class="page-playground-core relative px-4">
     <ClientOnly>
-      <PanelGroup
-        direction="horizontal"
-        class="panel-group"
-      >
-        <Panel
-          class="panel-column"
-          collapsible
-        >
+      <Splitpanes class="default-theme">
+        <Pane :min-size="30">
           <InputContainer />
-        </Panel>
-        <PanelResizeHandle class="panel-resize-handle" />
-        <Panel
-          class="panel-column"
-          collapsible
-        >
+        </Pane>
+        <Pane :min-size="30">
           <OutputContainer />
-        </Panel>
-        <PanelResizeHandle class="panel-resize-handle" />
-        <Panel
+        </Pane>
+        <Pane
           :min-size="12"
           :max-size="24"
-          :default-size="18"
-          class="panel-column"
-          collapsible
+          :size="18"
         >
           <ActionContainer />
-        </Panel>
-      </PanelGroup>
-
+        </Pane>
+      </Splitpanes>
       <DropZone />
     </ClientOnly>
   </div>
diff --git a/docs/.vitepress/components/ast/RenderExpandableObject.vue b/docs/.vitepress/components/ast/RenderExpandableObject.vue
@@ -29,7 +29,9 @@ const isActive = computed(
 )
 
 function handleHoverItem(isHovering: boolean) {
-  if (isNil(props.onHover) || !isFunction(props.onHover)) return
+  if (isNil(props.onHover) || !isFunction(props.onHover)) {
+    return
+  }
 
   if (isHovering) {
     props.onHover?.()
diff --git a/docs/.vitepress/composables/playground.ts b/docs/.vitepress/composables/playground.ts
@@ -15,7 +15,9 @@ export function usePlaygroundState() {
   const error = shallowRef<unknown>()
 
   const astJson = computed(() => {
-    if (!ast.value) return ''
+    if (!ast.value) {
+      return ''
+    }
     try {
       return JSON.stringify(ast.value, null, 2)
     } catch {
diff --git a/docs/components.d.ts b/docs/components.d.ts
@@ -2,6 +2,7 @@
 // @ts-nocheck
 // Generated by unplugin-vue-components
 // Read more: https://github.com/vuejs/core/pull/3399
+// biome-ignore lint: disable
 export {}
 
 /* prettier-ignore */
diff --git a/docs/package.json b/docs/package.json
@@ -6,33 +6,31 @@
     "build": "vitepress build .",
     "dev": "vitepress dev ."
   },
-  "dependencies": {
-    "@codemirror/lang-json": "catalog:",
-    "@codemirror/lang-xml": "catalog:",
-    "@codemirror/language": "catalog:",
-    "@codemirror/state": "catalog:",
-    "@codemirror/view": "catalog:",
-    "@lezer/highlight": "catalog:",
-    "@ntnyq/utils": "catalog:",
-    "@uiw/codemirror-themes": "catalog:",
-    "@vueuse/core": "catalog:",
-    "codemirror": "catalog:",
-    "floating-vue": "catalog:",
-    "svg-eslint-parser": "workspace:*",
-    "vue-codemirror": "catalog:",
-    "vue-resizable-panels": "catalog:"
-  },
   "devDependencies": {
-    "@iconify-json/carbon": "catalog:",
-    "@iconify-json/lucide": "catalog:",
-    "@shikijs/transformers": "catalog:",
-    "@shikijs/vitepress-twoslash": "catalog:",
-    "twoslash": "catalog:",
-    "unocss": "catalog:",
-    "unplugin-vue-components": "catalog:",
-    "vite": "catalog:",
-    "vitepress": "catalog:",
-    "vitepress-plugin-group-icons": "catalog:",
-    "vue": "catalog:"
+    "@codemirror/lang-json": "^6.0.1",
+    "@codemirror/lang-xml": "^6.1.0",
+    "@codemirror/language": "^6.11.0",
+    "@codemirror/state": "^6.5.2",
+    "@codemirror/view": "^6.36.8",
+    "@iconify-json/carbon": "^1.2.8",
+    "@iconify-json/lucide": "^1.2.43",
+    "@lezer/highlight": "^1.2.1",
+    "@ntnyq/utils": "^0.7.0",
+    "@shikijs/transformers": "^3.4.0",
+    "@shikijs/vitepress-twoslash": "^3.4.0",
+    "@uiw/codemirror-themes": "^4.23.12",
+    "@vueuse/core": "^13.2.0",
+    "codemirror": "^6.0.1",
+    "floating-vue": "^5.2.2",
+    "splitpanes": "^4.0.3",
+    "svg-eslint-parser": "workspace:*",
+    "twoslash": "^0.3.1",
+    "unocss": "^66.1.1",
+    "unplugin-vue-components": "^28.5.0",
+    "vite": "^6.3.5",
+    "vitepress": "^1.6.3",
+    "vitepress-plugin-group-icons": "^1.5.3",
+    "vue": "^3.5.13",
+    "vue-codemirror": "^6.1.1"
   }
 }
diff --git a/docs/splitpanes.d.ts b/docs/splitpanes.d.ts
@@ -0,0 +1,19 @@
+declare module 'splitpanes' {
+  import type { DefineComponent } from 'vue'
+
+  export interface SplitpanesProps {
+    firstSplitter?: boolean
+    horizontal?: boolean
+    pushOtherPanes?: boolean
+  }
+
+  export interface PaneProps {
+    maxSize?: number
+    minSize?: number
+    size?: number
+  }
+
+  export declare const Splitpanes: DefineComponent<SplitpanesProps, {}>
+
+  export declare const Pane: DefineComponent<PaneProps, {}>
+}
diff --git a/eslint.config.mjs b/eslint.config.mjs
@@ -3,7 +3,6 @@
 import { defineESLintConfig } from '@ntnyq/eslint-config'
 
 export default defineESLintConfig({
-  pnpm: true,
   svgo: true,
   unocss: true,
   vue: true,
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
   "name": "svg-eslint-parser",
   "type": "module",
   "version": "0.0.4",
-  "packageManager": "pnpm@10.10.0",
+  "packageManager": "pnpm@10.11.0",
   "description": "An SVG parser that produces output compatible with ESLint.",
   "keywords": [
     "eslint-parser",
@@ -50,23 +50,23 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@ntnyq/utils": "catalog:",
-    "eslint-visitor-keys": "catalog:"
+    "@ntnyq/utils": "^0.7.0",
+    "eslint-visitor-keys": "^4.2.0"
   },
   "devDependencies": {
-    "@ntnyq/eslint-config": "catalog:",
-    "@ntnyq/prettier-config": "catalog:",
-    "@types/node": "catalog:",
-    "@vitest/coverage-v8": "catalog:",
-    "bumpp": "catalog:",
-    "eslint": "catalog:",
-    "husky": "catalog:",
-    "nano-staged": "catalog:",
-    "npm-run-all2": "catalog:",
-    "prettier": "catalog:",
-    "typescript": "catalog:",
-    "unbuild": "catalog:",
-    "vitest": "catalog:"
+    "@ntnyq/eslint-config": "^4.3.0",
+    "@ntnyq/prettier-config": "^2.0.0",
+    "@types/node": "^22.15.18",
+    "@vitest/coverage-v8": "^3.1.3",
+    "bumpp": "^10.1.0",
+    "eslint": "^9.26.0",
+    "husky": "^9.1.7",
+    "nano-staged": "^0.8.0",
+    "npm-run-all2": "^8.0.1",
+    "prettier": "^3.5.3",
+    "typescript": "^5.8.3",
+    "unbuild": "^3.5.0",
+    "vitest": "^3.1.3"
   },
   "engines": {
     "node": ">=18.18.0"
diff --git a/patches/vue-resizable-panels.patch b/patches/vue-resizable-panels.patch
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
diff --git a/src/tokenizer/handlers/commentContent.ts b/src/tokenizer/handlers/commentContent.ts

Original file line number	Diff line number	Diff line change
`@@ -38,7 +38,9 @@ function onDragOver(evt: DragEvent) {`
`38`	`38`	`evt.preventDefault()`
`39`	`39`	`}`
`40`	`40`	`async function onImportFile(files?: FileList \| null) {`
`41`		`- if (!files) return`
	`41`	`+ if (!files) {`
	`42`	`+ return`
	`43`	`+ }`
`42`	`44`
`43`	`45`	`const file = files[0]`
`44`	`46`	`const fileExt = file.name.split('.').pop()?.toLowerCase()`
`@@ -56,6 +58,7 @@ async function onImportFile(files?: FileList \| null) {`
`56`	`58`	`}`
`57`	`59`	`async function onDrop(evt: DragEvent) {`
`58`	`60`	`evt.preventDefault()`
	`61`	`+`
`59`	`62`	`if (!isFileDrag(evt)) {`
`60`	`63`	`return`
`61`	`64`	`}`
Original file line number	Diff line number	Diff line change
`@@ -9,7 +9,7 @@ export interface Language {`
`9`	`9`	`extension: () => LanguageSupport \| Extension[]`
`10`	`10`	`}`
`11`	`11`
`12`		`-export type SupportLanguage = 'xml' \| 'json'`
	`12`	`+export type SupportedLanguage = 'xml' \| 'json'`
`13`	`13`
`14`	`14`	`export const languages: Language[] = [`
`15`	`15`	`{`
Original file line number	Diff line number	Diff line change
`@@ -29,7 +29,9 @@ const isActive = computed(`
`29`	`29`	`)`
`30`	`30`
`31`	`31`	`function handleHoverItem(isHovering: boolean) {`
`32`		`- if (isNil(props.onHover) \|\| !isFunction(props.onHover)) return`
	`32`	`+ if (isNil(props.onHover) \|\| !isFunction(props.onHover)) {`
	`33`	`+ return`
	`34`	`+ }`
`33`	`35`
`34`	`36`	`if (isHovering) {`
`35`	`37`	`props.onHover?.()`