From 02057b6c6c80e2c88f85a41aa918471a83d4799f Mon Sep 17 00:00:00 2001
From: braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Sat, 3 Feb 2024 20:02:32 +0100
Subject: [PATCH] chore(docs): remove horizontal example

---
 docs/examples/horizontal/App.vue             | 32 -----------------
 docs/examples/horizontal/index.ts            |  2 --
 docs/examples/horizontal/initial-elements.js | 38 --------------------
 docs/examples/index.ts                       |  5 ---
 docs/src/.vitepress/config.mts               |  1 -
 docs/src/examples/empty.md                   |  8 -----
 docs/src/examples/horizontal.md              | 10 ------
 7 files changed, 96 deletions(-)
 delete mode 100644 docs/examples/horizontal/App.vue
 delete mode 100644 docs/examples/horizontal/index.ts
 delete mode 100644 docs/examples/horizontal/initial-elements.js
 delete mode 100644 docs/src/examples/empty.md
 delete mode 100644 docs/src/examples/horizontal.md

diff --git a/docs/examples/horizontal/App.vue b/docs/examples/horizontal/App.vue
deleted file mode 100644
index 744d7764..00000000
--- a/docs/examples/horizontal/App.vue
+++ /dev/null
@@ -1,32 +0,0 @@
-<script setup>
-import { VueFlow, useVueFlow } from '@vue-flow/core'
-import { Background } from '@vue-flow/background'
-import { Controls } from '@vue-flow/controls'
-import { MiniMap } from '@vue-flow/minimap'
-import { ref } from 'vue'
-import { initialElements } from './initial-elements.js'
-
-const { onConnect, addEdges } = useVueFlow()
-
-const elements = ref(initialElements)
-
-onConnect((params) => addEdges(params))
-</script>
-
-<template>
-  <VueFlow
-    v-model="elements"
-    class="basicflow"
-    :default-edge-options="{ type: 'smoothstep' }"
-    :default-viewport="{ zoom: 1.5 }"
-    :min-zoom="0.2"
-    :max-zoom="4"
-    fit-view-on-init
-  >
-    <Background pattern-color="#aaa" gap="8" />
-
-    <MiniMap />
-
-    <Controls />
-  </VueFlow>
-</template>
diff --git a/docs/examples/horizontal/index.ts b/docs/examples/horizontal/index.ts
deleted file mode 100644
index a40f7c4c..00000000
--- a/docs/examples/horizontal/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { default as HorizontalApp } from './App.vue?raw'
-export { default as HorizontalElements } from './initial-elements.js?raw'
diff --git a/docs/examples/horizontal/initial-elements.js b/docs/examples/horizontal/initial-elements.js
deleted file mode 100644
index 6474cc35..00000000
--- a/docs/examples/horizontal/initial-elements.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import { MarkerType, Position } from '@vue-flow/core'
-
-export const initialElements = [
-  {
-    id: '1',
-    type: 'input',
-    label: 'Node 1',
-    position: { x: 0, y: 50 },
-    sourcePosition: Position.Right,
-  },
-  {
-    id: '2',
-    type: 'output',
-    label: 'Node 2',
-    position: { x: 250, y: 0 },
-    targetPosition: Position.Left,
-  },
-  { id: '3', label: 'Node 3', position: { x: 250, y: 100 }, sourcePosition: Position.Right, targetPosition: Position.Left },
-  { id: '4', label: 'Node 4', position: { x: 500, y: 150 }, sourcePosition: Position.Right, targetPosition: Position.Left },
-  {
-    id: '5',
-    type: 'output',
-    label: 'Node 5',
-    position: { x: 750, y: 50 },
-    sourcePosition: Position.Right,
-    targetPosition: Position.Left,
-  },
-  { id: 'e1-2', source: '1', target: '2', animated: true },
-  { id: 'e1-3', source: '1', target: '3', markerEnd: MarkerType.Arrow },
-  {
-    id: 'e4-5',
-    source: '4',
-    target: '5',
-    style: { stroke: 'orange' },
-    labelBgStyle: { fill: 'orange' },
-  },
-  { id: 'e3-4', source: '3', target: '4' },
-]
diff --git a/docs/examples/index.ts b/docs/examples/index.ts
index f7e84949..d619cbed 100644
--- a/docs/examples/index.ts
+++ b/docs/examples/index.ts
@@ -12,7 +12,6 @@ import { DndApp, DndBackground, DndCSS, DndScript, DndSidebar } from './dnd'
 import { HiddenApp } from './hidden'
 import { InteractionApp, InteractionCSS, InteractionControls } from './interaction'
 import { MultiApp, MultiCSS, MultiFlow } from './multi'
-import { HorizontalApp, HorizontalElements } from './horizontal'
 import { TeleportApp, TeleportCSS, TeleportSidebar, TeleportableNode, TeleportableUseTransition } from './teleport'
 import { TransitionApp, TransitionCSS, TransitionEdge } from './transition'
 import { IntersectionApp, IntersectionCSS, IntersectionElements } from './intersection'
@@ -91,10 +90,6 @@ export const exampleImports = {
     'Flow.vue': MultiFlow,
     'style.css': MultiCSS,
   },
-  horizontal: {
-    'App.vue': HorizontalApp,
-    'initial-elements.js': HorizontalElements,
-  },
   teleport: {
     'App.vue': TeleportApp,
     'Sidebar.vue': TeleportSidebar,
diff --git a/docs/src/.vitepress/config.mts b/docs/src/.vitepress/config.mts
index 8871f696..15c95283 100644
--- a/docs/src/.vitepress/config.mts
+++ b/docs/src/.vitepress/config.mts
@@ -201,7 +201,6 @@ export default defineConfigWithTheme<DefaultTheme.Config>({
             { text: 'Save & Restore', link: '/examples/save' },
             { text: 'Drag & Drop', link: '/examples/dnd' },
             { text: 'Hide/Show', link: '/examples/hidden' },
-            { text: 'Horizontal Flow', link: '/examples/horizontal' },
             { text: 'Interactions', link: '/examples/interaction' },
             { text: 'Intersection', link: '/examples/intersection' },
             { text: 'Teleport', link: '/examples/teleport' },
diff --git a/docs/src/examples/empty.md b/docs/src/examples/empty.md
deleted file mode 100644
index ab193b79..00000000
--- a/docs/src/examples/empty.md
+++ /dev/null
@@ -1,8 +0,0 @@
-# Empty
-
-Similar to the drag and drop example, we can also add nodes to an empty graph on a button click, 
-which triggers a push into our elements / nodes array.
-
-<div class="mt-6">
-  <Repl example="empty"></Repl>
-</div>
diff --git a/docs/src/examples/horizontal.md b/docs/src/examples/horizontal.md
deleted file mode 100644
index c65fa9b7..00000000
--- a/docs/src/examples/horizontal.md
+++ /dev/null
@@ -1,10 +0,0 @@
-# Horizontal Layout
-
-Vue Flow doesn't require you to use vertical layouts.
-You can use horizontal layouts with the default node types as well.
-
-You can define where source or target handle positions are with the `sourcePosition` or `targetPosition` properties of nodes.
-
-<div class="mt-6">
-  <Repl example="horizontal"></Repl>
-</div>