Merge pull request #2 from setaman/update-vuepress2

feat: bump vuepress deps
setaman · Aug 1, 2023 · 17e8f97 · 17e8f97
2 parents eea966e + f1f473b
commit 17e8f97
Show file tree

Hide file tree

Showing 45 changed files with 5,523 additions and 7,005 deletions.
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -0,0 +1,27 @@
+name: Build docs
+
+on:
+  pull_request:
+    branches:
+      - "*"
+  workflow_dispatch:
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v1
+        with:
+          node-version: 16.15
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build VuePress site
+        run: yarn docs:build
diff --git a/.github/workflows/docs.yml b/.github/workflows/docs.yml
@@ -11,7 +11,7 @@ on:
   workflow_dispatch:
 
 jobs:
-  docs:
+  build-deploy:
     runs-on: ubuntu-latest
 
     steps:

diff --git a/docs/.vuepress/client.js b/docs/.vuepress/client.js
@@ -1,45 +1,45 @@
 import { defineClientConfig } from "@vuepress/client";
 import Slider from "@vueform/slider";
 import "@vueform/slider/themes/default.css";
-import HomeLayout from "./theme/layouts/HomeLayout";
-import ExampleContainer from "./theme/components/Base/ExampleContainer/ExampleContainer";
-import VEP from "./theme/components/Base/VEP";
-import CardLink from "./theme/components/Base/CardLink";
-import ProgressBasic from "./theme/components/examples/progress/ProgressBasic";
-import LegendBasic from "./theme/components/examples/legend/LegendBasic";
-import LegendAndProgress from "./theme/components/examples/legend/LegendAndProgress";
-import HideLegend from "./theme/components/examples/hideLegend/HideLegend";
-import Reverse from "./theme/components/examples/reverse/Reverse";
-import Half from "./theme/components/examples/half/Half";
-import SizeBasic from "./theme/components/examples/size/SizeBasic";
-import SizeDependencies from "./theme/components/examples/size/SizeDependencies";
-import Thickness from "./theme/components/examples/thickness/Thickness";
-import LineMode from "./theme/components/examples/lineMode/LineMode";
-import Angle from "./theme/components/examples/angle/Angle";
-import LinePosition from "./theme/components/examples/linePosition/LinePosition";
-import EmptyLinePosition from "./theme/components/examples/linePosition/EmptyLinePosition";
-import ColorRandom from "./theme/components/examples/colors/ColorRandom";
-import ColorGradient from "./theme/components/examples/colors/ColorGradient";
-import ColorGradientCrazy from "./theme/components/examples/colors/ColorGradientCrazy";
-import ColorFillGradientCrazy from "./theme/components/examples/colorFill/ColorFillGradientCrazy";
-import ColorFillRandom from "./theme/components/examples/colorFill/ColorFillRandom";
-import ColorFillGradient from "./theme/components/examples/colorFill/ColorFillGradient";
-import EmptyColorFillGradient from "./theme/components/examples/emptyColorFill/EmptyColorFillGradient";
-import EmptyColorFillGradientCrazy from "./theme/components/examples/emptyColorFill/EmptyColorFillGradientCrazy";
-import EmptyColorFillRandom from "./theme/components/examples/emptyColorFill/EmptyColorFillRandom";
-import EmptyColorRandom from "./theme/components/examples/emptyColor/EmptyColorRandom";
-import EmptyColorGradient from "./theme/components/examples/emptyColor/EmptyColorGradient";
-import EmptyColorGradientCrazy from "./theme/components/examples/emptyColor/EmptyColorGradientCrazy";
-import Animation from "./theme/components/examples/animation/Animation";
-import LegendFormatterProps from "./theme/components/examples/legendFormatter/LegendFormatterProps";
-import LegendFormatterHtml from "./theme/components/examples/legendFormatter/LegendFormatterHtml";
-import DefaultSlot from "./theme/components/examples/slots/DefaultSlot";
-import DefaultSlotColored from "./theme/components/examples/slots/DefaultSlotColored";
-import Gap from "./theme/components/examples/gap/Gap";
-import DataExamples from "./theme/components/examples/data/DataExamples";
-import GapAnimation from "./theme/components/examples/gap/GapAnimation";
-import Dash from "./theme/components/examples/dash/Dash";
-import Dot from "./theme/components/examples/dot/Dot";
+import HomeLayout from "./theme/layouts/HomeLayout.vue";
+import ExampleContainer from "./theme/components/Base/ExampleContainer/ExampleContainer.vue";
+import VEP from "./theme/components/Base/VEP.vue";
+import CardLink from "./theme/components/Base/CardLink.vue";
+import ProgressBasic from "./theme/components/examples/progress/ProgressBasic.vue";
+import LegendBasic from "./theme/components/examples/legend/LegendBasic.vue";
+import LegendAndProgress from "./theme/components/examples/legend/LegendAndProgress.vue";
+import HideLegend from "./theme/components/examples/hideLegend/HideLegend.vue";
+import Reverse from "./theme/components/examples/reverse/Reverse.vue";
+import Half from "./theme/components/examples/half/Half.vue";
+import SizeBasic from "./theme/components/examples/size/SizeBasic.vue";
+import SizeDependencies from "./theme/components/examples/size/SizeDependencies.vue";
+import Thickness from "./theme/components/examples/thickness/Thickness.vue";
+import LineMode from "./theme/components/examples/lineMode/LineMode.vue";
+import Angle from "./theme/components/examples/angle/Angle.vue";
+import LinePosition from "./theme/components/examples/linePosition/LinePosition.vue";
+import EmptyLinePosition from "./theme/components/examples/linePosition/EmptyLinePosition.vue";
+import ColorRandom from "./theme/components/examples/colors/ColorRandom.vue";
+import ColorGradient from "./theme/components/examples/colors/ColorGradient.vue";
+import ColorGradientCrazy from "./theme/components/examples/colors/ColorGradientCrazy.vue";
+import ColorFillGradientCrazy from "./theme/components/examples/colorFill/ColorFillGradientCrazy.vue";
+import ColorFillRandom from "./theme/components/examples/colorFill/ColorFillRandom.vue";
+import ColorFillGradient from "./theme/components/examples/colorFill/ColorFillGradient.vue";
+import EmptyColorFillGradient from "./theme/components/examples/emptyColorFill/EmptyColorFillGradient.vue";
+import EmptyColorFillGradientCrazy from "./theme/components/examples/emptyColorFill/EmptyColorFillGradientCrazy.vue";
+import EmptyColorFillRandom from "./theme/components/examples/emptyColorFill/EmptyColorFillRandom.vue";
+import EmptyColorRandom from "./theme/components/examples/emptyColor/EmptyColorRandom.vue";
+import EmptyColorGradient from "./theme/components/examples/emptyColor/EmptyColorGradient.vue";
+import EmptyColorGradientCrazy from "./theme/components/examples/emptyColor/EmptyColorGradientCrazy.vue";
+import Animation from "./theme/components/examples/animation/Animation.vue";
+import LegendFormatterProps from "./theme/components/examples/legendFormatter/LegendFormatterProps.vue";
+import LegendFormatterHtml from "./theme/components/examples/legendFormatter/LegendFormatterHtml.vue";
+import DefaultSlot from "./theme/components/examples/slots/DefaultSlot.vue";
+import DefaultSlotColored from "./theme/components/examples/slots/DefaultSlotColored.vue";
+import Gap from "./theme/components/examples/gap/Gap.vue";
+import DataExamples from "./theme/components/examples/data/DataExamples.vue";
+import GapAnimation from "./theme/components/examples/gap/GapAnimation.vue";
+import Dash from "./theme/components/examples/dash/Dash.vue";
+import Dot from "./theme/components/examples/dot/Dot.vue";
 import "@iconscout/unicons/css/line.css";
 const components = [
   Slider,

diff --git a/docs/.vuepress/config.js b/docs/.vuepress/config.js
@@ -1,23 +1,27 @@
-const { mediumZoomPlugin } = require("@vuepress/plugin-medium-zoom");
-const { webpackBundler } = require("@vuepress/bundler-webpack");
-const { defaultTheme } = require("@vuepress/theme-default");
-const { searchPlugin } = require("@vuepress/plugin-search");
+import { defaultTheme } from "vuepress";
+import { searchPlugin } from "@vuepress/plugin-search";
+import { viteBundler } from "vuepress";
 
 const isDevMode = process.env.NODE_ENV === "development";
+const basePath = process.env.BASE_PATH || "/vue-ellipse-progress-docs/";
 
-module.exports = {
+export default {
   lang: "en-US",
   title: "vue-ellipse-progress",
   description: "This is not my first VuePress site",
-  base: isDevMode ? "/" : "/vue-ellipse-progress-docs/",
-  bundler: webpackBundler({
-    evergreen: true,
-  }),
+  base: isDevMode ? "/" : basePath,
   markdown: {
     code: {
       lineNumbers: false,
     },
   },
+  bundler: viteBundler({
+    viteOptions: {
+      ssr: {
+        noExternal: "@vueform/slider",
+      },
+    },
+  }),
   theme: defaultTheme({
     logo: "https://vuejs.org/images/logo.png",
     repo: "https://github.com/setaman/vue-ellipse-progress/tree/v2-dev",
@@ -180,7 +184,7 @@ module.exports = {
     },
   }),
   plugins: [
-    mediumZoomPlugin({ selector: "img.zoom" }),
+    /*mediumZoomPlugin({ selector: "img.zoom" }),*/
     searchPlugin({
       isSearchable: (page) => page.path !== "/",
     }),

diff --git a/docs/.vuepress/theme/components/Base/ExampleContainer/ExampleContainer.vue b/docs/.vuepress/theme/components/Base/ExampleContainer/ExampleContainer.vue
@@ -8,7 +8,10 @@
     >
       <div class="flex">
         <btn icon @click="toggleCollapse">
-          <icon style="font-size: 1.2rem" :icon="isCollapsed ? 'angle-down' : 'minus'" />
+          <icon
+            style="font-size: 1.2rem"
+            :icon="isCollapsed ? 'angle-down' : 'minus'"
+          />
         </btn>
       </div>
       <div v-if="!isCollapsed" class="flex">
@@ -68,7 +71,10 @@
         </slot>
       </div>
     </div>
-    <div  v-if="!isCollapsed" class="example-container-footer rounded-b-lg lg:flex lg:flex-row">
+    <div
+      v-if="!isCollapsed"
+      class="example-container-footer rounded-b-lg lg:flex lg:flex-row"
+    >
       <div class="example-controls-range flex-1 py-2 px-4">
         <div class="flex flex-wrap h-full content-center" v-if="showProgress">
           <slot name="range">
@@ -105,14 +111,14 @@
 </template>
 
 <script>
-import SwitchSlider from "../SwitchSlider";
-import Icon from "../Icon";
-import LinkIcon from "../LinkIcon";
+import SwitchSlider from "../SwitchSlider.vue";
+import Icon from "../Icon.vue";
+import LinkIcon from "../LinkIcon.vue";
 import "@vueform/slider/themes/default.css";
-import Btn from "../Btn";
-import CodeIcon from "../../SvgIcons/CodeIcon";
-import MonitorIcon from "../../SvgIcons/MonitorIcon";
-import RowsIcon from "../../SvgIcons/RowsIcon";
+import Btn from "../Btn.vue";
+import CodeIcon from "../../SvgIcons/CodeIcon.vue";
+import MonitorIcon from "../../SvgIcons/MonitorIcon.vue";
+import RowsIcon from "../../SvgIcons/RowsIcon.vue";
 
 export default {
   name: "ExampleContainer",

diff --git a/docs/.vuepress/theme/components/Base/SwitchSlider.vue b/docs/.vuepress/theme/components/Base/SwitchSlider.vue
@@ -43,10 +43,10 @@
 </template>
 
 <script>
-import SvgIcon from "./SvgIcon";
-import CodeIcon from "../SvgIcons/CodeIcon";
-import MonitorIcon from "../SvgIcons/MonitorIcon";
-import RowsIcon from "../SvgIcons/RowsIcon";
+import SvgIcon from "./SvgIcon.vue";
+import CodeIcon from "../SvgIcons/CodeIcon.vue";
+import MonitorIcon from "../SvgIcons/MonitorIcon.vue";
+import RowsIcon from "../SvgIcons/RowsIcon.vue";
 export default {
   name: "SwitchSlider",
   components: { RowsIcon, MonitorIcon, CodeIcon, SvgIcon },

diff --git a/docs/.vuepress/theme/components/Base/VEP.vue b/docs/.vuepress/theme/components/Base/VEP.vue
@@ -19,10 +19,12 @@
 <script setup>
 import { shallowRef, onMounted } from "vue";
 
-const component = shallowRef(null)
-onMounted(() => import("vue-ellipse-progress").then((module) => {
-  component.value = module.VeProgress;
-}))
+const component = shallowRef(null);
+onMounted(() =>
+  import("vue-ellipse-progress").then((module) => {
+    component.value = module.VeProgress;
+  })
+);
 </script>
 
 <style scoped></style>
diff --git a/docs/.vuepress/theme/components/examples/angle/Angle.vue b/docs/.vuepress/theme/components/examples/angle/Angle.vue
@@ -26,9 +26,9 @@
 </template>
 
 <script>
-import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer";
-import VEP from "../../Base/VEP";
-import SwitchSlider from "../../Base/SwitchSlider";
+import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer.vue";
+import VEP from "../../Base/VEP.vue";
+import SwitchSlider from "../../Base/SwitchSlider.vue";
 export default {
   name: "Angle",
   components: { SwitchSlider, VEP, ExampleContainer },

diff --git a/docs/.vuepress/theme/components/examples/animation/Animation.vue b/docs/.vuepress/theme/components/examples/animation/Animation.vue
@@ -40,9 +40,9 @@
 </template>
 
 <script>
-import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer";
-import VEP from "../../Base/VEP";
-import SwitchSlider from "../../Base/SwitchSlider";
+import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer.vue";
+import VEP from "../../Base/VEP.vue";
+import SwitchSlider from "../../Base/SwitchSlider.vue";
 export default {
   name: "Animation",
   components: { SwitchSlider, VEP, ExampleContainer },

diff --git a/docs/.vuepress/theme/components/examples/colorFill/ColorFillGradient.vue b/docs/.vuepress/theme/components/examples/colorFill/ColorFillGradient.vue
@@ -46,8 +46,8 @@
 </template>
 
 <script>
-import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer";
-import VEP from "../../Base/VEP";
+import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer.vue";
+import VEP from "../../Base/VEP.vue";
 import randomColor from "../../../../utils/randomColor";
 import IntervalTask from "../../../../utils/intervalTask";
 export default {

diff --git a/docs/.vuepress/theme/components/examples/colorFill/ColorFillGradientCrazy.vue b/docs/.vuepress/theme/components/examples/colorFill/ColorFillGradientCrazy.vue
@@ -79,8 +79,8 @@
 </template>
 
 <script>
-import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer";
-import VEP from "../../Base/VEP";
+import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer.vue";
+import VEP from "../../Base/VEP.vue";
 export default {
   name: "ColorFillGradientCrazy",
   components: { VEP, ExampleContainer },
@@ -250,7 +250,7 @@ export default {
         },
       ],
     },
-    colorGradient:  {
+    colorGradient: {
       radial: true,
       colors: [
         {

diff --git a/docs/.vuepress/theme/components/examples/colorFill/ColorFillRandom.vue b/docs/.vuepress/theme/components/examples/colorFill/ColorFillRandom.vue
@@ -3,8 +3,8 @@
 </template>
 
 <script>
-import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer";
-import VEP from "../../Base/VEP";
+import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer.vue";
+import VEP from "../../Base/VEP.vue";
 import randomColor from "../../../../utils/randomColor";
 import IntervalTask from "../../../../utils/intervalTask";
 

diff --git a/docs/.vuepress/theme/components/examples/colors/ColorGradient.vue b/docs/.vuepress/theme/components/examples/colors/ColorGradient.vue
@@ -49,8 +49,8 @@
 </template>
 
 <script>
-import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer";
-import VEP from "../../Base/VEP";
+import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer.vue";
+import VEP from "../../Base/VEP.vue";
 import randomColor from "../../../../utils/randomColor";
 import IntervalTask from "../../../../utils/intervalTask";
 export default {

diff --git a/docs/.vuepress/theme/components/examples/colors/ColorGradientCrazy.vue b/docs/.vuepress/theme/components/examples/colors/ColorGradientCrazy.vue
@@ -109,8 +109,8 @@
 </template>
 
 <script>
-import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer";
-import VEP from "../../Base/VEP";
+import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer.vue";
+import VEP from "../../Base/VEP.vue";
 export default {
   name: "ColorGradientCrazy",
   components: { VEP, ExampleContainer },

diff --git a/docs/.vuepress/theme/components/examples/colors/ColorRandom.vue b/docs/.vuepress/theme/components/examples/colors/ColorRandom.vue
@@ -3,8 +3,8 @@
 </template>
 
 <script>
-import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer";
-import VEP from "../../Base/VEP";
+import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer.vue";
+import VEP from "../../Base/VEP.vue";
 import randomColor from "../../../../utils/randomColor";
 import IntervalTask from "../../../../utils/intervalTask";
 

diff --git a/docs/.vuepress/theme/components/examples/dash/Dash.vue b/docs/.vuepress/theme/components/examples/dash/Dash.vue
@@ -43,9 +43,9 @@
 </template>
 
 <script>
-import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer";
-import VEP from "../../Base/VEP";
-import SwitchSlider from "../../Base/SwitchSlider";
+import ExampleContainer from "../../Base/ExampleContainer/ExampleContainer.vue";
+import VEP from "../../Base/VEP.vue";
+import SwitchSlider from "../../Base/SwitchSlider.vue";
 export default {
   name: "Dash",
   components: { SwitchSlider, VEP, ExampleContainer },