diff --git a/.browserslistrc b/.browserslistrc deleted file mode 100644 index 9dee646..0000000 --- a/.browserslistrc +++ /dev/null @@ -1,3 +0,0 @@ -> 1% -last 2 versions -not ie <= 8 diff --git a/.eslintrc.js b/.eslintrc.js deleted file mode 100644 index 3f3df4f..0000000 --- a/.eslintrc.js +++ /dev/null @@ -1,14 +0,0 @@ -module.exports = { - root: true, - env: { - node: true - }, - extends: ["plugin:vue/essential", "@vue/prettier"], - rules: { - "no-console": process.env.NODE_ENV === "production" ? "error" : "off", - "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off" - }, - parserOptions: { - parser: "babel-eslint" - } -}; diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml new file mode 100644 index 0000000..72366ab --- /dev/null +++ b/.github/workflows/release.yml @@ -0,0 +1,33 @@ +name: Release + +on: + push: + branches: [ master, next, next-major, beta, alpha ] + +jobs: + release: + name: Release + runs-on: ubuntu-latest + timeout-minutes: 10 + steps: + - name: Checkout + uses: actions/checkout@v2 + - name: Setup Node.js + uses: actions/setup-node@v1 + with: + node-version: 14.x + - name: Install dependencies + run: | + npm i -g pnpm + pnpm i --frozen-lockfile + - name: Lint + run: npm run lint + - name: Test + run: npm run test --if-present + - name: Build + run: npm run build --if-present + - name: Release + env: + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} + NPM_TOKEN: ${{ secrets.NPM_TOKEN }} + run: npx semantic-release diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml new file mode 100644 index 0000000..a45e227 --- /dev/null +++ b/.github/workflows/test.yml @@ -0,0 +1,29 @@ +name: Test +on: + push: + branches: [develop] + pull_request: + branches: [master, develop, next] +jobs: + test: + name: Test + runs-on: ubuntu-latest + timeout-minutes: 10 + strategy: + matrix: + node-version: [10.x, 14.x] + steps: + - name: Checkout + uses: actions/checkout@v2 + - name: Use Node.js ${{ matrix.node-version }} + uses: actions/setup-node@v1 + with: + node-version: ${{ matrix.node-version }} + - name: Install dependencies + run: | + npm i -g pnpm + pnpm i --frozen-lockfile + - name: Lint + run: npm run lint + - name: Test + run: npm run test --if-present diff --git a/.gitignore b/.gitignore index c6e316b..49cd9be 100644 --- a/.gitignore +++ b/.gitignore @@ -1,20 +1,25 @@ +# Mac OS X .DS_Store -node_modules -# local env files -.env.local -.env.*.local - -# Log files +# Logs +logs +*.log npm-debug.log* -yarn-debug.log* -yarn-error.log* -# Editor directories and files -.idea -.vscode -*.suo -*.ntvs* -*.njsproj -*.sln -*.sw* +# Dependency directories +node_modules/ + +# Optional npm cache directory +.npm + +# Optional REPL history +.node_repl_history + +# Output of 'npm pack' +*.tgz + +# Jest coverage data +coverage + +# Distribution files +dist diff --git a/README.md b/README.md index e214062..807ae5f 100644 --- a/README.md +++ b/README.md @@ -1,14 +1,51 @@ -# SplitView +# SplitView [![Latest version](https://badgen.net/npm/v/vue-split-view)](https://npm.im/vue-split-view) [![Monthly downloads](https://badgen.net/npm/dm/vue-split-view)](https://npm.im/vue-split-view) [![Install size](https://packagephobia.now.sh/badge?p=vue-split-view)](https://packagephobia.now.sh/result?p=vue-split-view) [![Bundle size](https://badgen.net/bundlephobia/minzip/vue-split-view)](https://bundlephobia.com/result?p=vue-split-view) -A component that offers two slots with a draggable divider. +Create a resizable split-view to partition the UI. + +👉 [CodePen Demo](https://codepen.io/privatenumber/pen/xxEYxgB) + +## 🚀 Install +```sh +npm i vue-split-view +``` + +## 🚦 Quick Setup + +### Bundler + +#### Vue.js 3 +```js +import VueSplitView from 'vue-split-view' +``` + +#### Vue.js 2 +```js +import VueSplitView from 'vue-split-view/dist/vue2' +``` + +### Browser +- Load the CSS stylesheet: `vue-split-view/dist/style.css` + +#### ESM +```js +import VueSplitView from 'vue-split-view/dist/vue3.esm.js' +``` + +#### UMD +``` +vue-split-view/dist/vue3.umd.js +``` + +## 👨🏻‍🏫 Examples ### Horizontal split ```html -