feat: added files

Author: kouts

.eslintrc.js

@@ -0,0 +1,54 @@
+/* eslint-env node */
+require('@rushstack/eslint-patch/modern-module-resolution')
+
+module.exports = {
+  root: true,
+  env: {
+    es2021: true,
+    browser: true,
+    node: true
+  },
+  extends: [
+    'plugin:vue/vue3-recommended',
+    'standard',
+    '@vue/eslint-config-typescript/recommended',
+    'plugin:prettier-vue/recommended',
+    'prettier'
+  ],
+  parserOptions: {
+    ecmaVersion: 2021
+  },
+  plugins: ['html'],
+  ignorePatterns: ['**/node_modules/**', '{tmp,temp}/**', '**/*.min.js', 'vendor/**', 'dist/**', 'public/**'],
+  overrides: [
+    {
+      files: ['*.json'],
+      rules: {
+        quotes: [2, 'double']
+      }
+    },
+    {
+      files: ['*.vue'],
+      parser: 'vue-eslint-parser',
+      parserOptions: {
+        parser: '@typescript-eslint/parser'
+      }
+    },
+    {
+      files: ['**/*.spec.{j,t}s?(x)'],
+      env: {
+        jest: true
+      }
+    }
+  ],
+  rules: {
+    // Console and debugger settings depending whether we're on production or not
+    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
+
+    // 'vue/no-export-in-script-setup': 'off',
+
+    // '@typescript-eslint/no-unused-vars': 'off',
+    // 'no-unused-vars': 'off'
+  }
+}

.github/workflows/release.yml

@@ -0,0 +1,35 @@
+name: Release
+
+on:
+  push:
+    branches: [main, beta]
+
+jobs:
+  release:
+    name: Release
+    runs-on: ubuntu-latest
+
+    steps:
+    - name: Checkout
+      uses: actions/checkout@v2
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v1
+      with:
+        node-version: 14.x
+    - name: Install dependencies
+      run: npx ci
+    - name: Install semantic-release extra plugins
+      run: npm install --save-dev @semantic-release/changelog @semantic-release/git      
+    - name: Lint
+      run: npm run lint-fix
+    - name: Typecheck
+      run: npm run typecheck
+    - name: Test
+      run: npm run test:unit-coverage --if-present
+    - name: Build
+      run: npm run build      
+    - name: Release
+      env:
+        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+      run: npx semantic-release

.gitignore

@@ -0,0 +1,5 @@
+node_modules
+.DS_Store
+dist-ssr
+*.local
+.vscode

.husky/.gitignore

@@ -0,0 +1 @@
+_

.husky/commit-msg

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx --no-install commitlint --edit "$1"

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx lint-staged

README.md

@@ -0,0 +1,20 @@
+# vue-search-input <a href="https://npm.im/vue-search-input"><img src="https://badgen.net/npm/v/vue-search-input"></a> ![](https://img.badgesize.io/kouts/vue-search-input/main/dist/vue-search-input.umd.js.svg) ![](https://img.badgesize.io/kouts/vue-search-input/main/dist/vue-search-input.umd.js.svg?compression=gzip) ![](coverage/badge.svg)
+
+A Vue.js 3 search input component, inspired by the global search input of Storybook and GitHub.
+
+ The `SearchInput` component displays a search input with some additional features built-in.  
+ 
+ **Features:**  
+ - Includes default styling but it's completely customizable with `slots`.
+ - Displays an `x` icon on the right side of the search input, used for **clearing** the text when there's a value typed inside.  
+ - **Focus** on the search input at any time by pressing the `/` key on the keyboard.  
+ - The search text gets cleared by pressing the `esc` key when the search input has focus.
+ 
+ ***Important:*** It is advisable that you include the `SearchInput` component **only once** on each page.  
+ In case multiple `SearchInput` components are present, the first one being displayed will take focus precedence upon the `/` keypress.
+
+## Installation
+
+```bash
+npm i vue-search-input
+```

babel.config.js

@@ -0,0 +1,12 @@
+module.exports = {
+  presets: [
+    [
+      '@babel/preset-env',
+      {
+        targets: {
+          node: 'current'
+        }
+      }
+    ]
+  ]
+}

commitlint.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  extends: ['@commitlint/config-conventional'],
+  rules: {
+    'body-max-line-length': [1, 'always', 200]
+  }
+}

index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Playground for vue-search-input</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/playground/main.ts"></script>
+  </body>
+</html>

jest.config.js

@@ -0,0 +1,18 @@
+module.exports = {
+  preset: 'ts-jest',
+  testEnvironment: 'jsdom',
+  transform: {
+    '^.+\\.vue$': '@vue/vue3-jest',
+    '^.+\\js$': 'babel-jest',
+    '^.+\\.ts$': 'ts-jest'
+  },
+  testRegex: '(/__tests__/.*|(\\.|/)(test|spec))\\.(js|ts)$',
+  moduleFileExtensions: ['vue', 'js', 'ts'],
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/src/$1',
+    '^@playground/(.*)$': '<rootDir>/playground/$1',
+    '^@root/(.*)$': '<rootDir>/$1'
+  },
+  coveragePathIgnorePatterns: ['/node_modules/', '/playground/', '/tests/'],
+  coverageReporters: ['text', 'json-summary']
+}

lint-staged.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  '*.{vue,ts,js}': ['npm run lint-fix']
+}