diff --git a/.babelrc b/.babelrc deleted file mode 100644 index 86a3c4d..0000000 --- a/.babelrc +++ /dev/null @@ -1,17 +0,0 @@ -{ - "presets": [["@babel/preset-env"]], - "ignore": ["node_modules/", "public/"], - "plugins": [ - [ - "module-resolver", - { - "root": ["./"], - "alias": { - "@assets": "./src/assets", - "@components": "./src/components", - "@plugins": "./src/plugins" - } - } - ] - ] -} diff --git a/.browserslistrc b/.browserslistrc deleted file mode 100644 index ba9b28f..0000000 --- a/.browserslistrc +++ /dev/null @@ -1,5 +0,0 @@ -# Browsers that we support - -> 1% -last 2 versions -not dead diff --git a/.editorconfig b/.editorconfig index 808f9e5..ec90d88 100644 --- a/.editorconfig +++ b/.editorconfig @@ -3,20 +3,18 @@ root = true [*] charset = utf-8 end_of_line = lf -insert_final_newline = true -indent_style = tab indent_size = 4 +indent_style = tab +insert_final_newline = true trim_trailing_whitespace = true [*.md] trim_trailing_whitespace = false -indent_size = 2 -indent_style = space [*.{yml,yaml}] indent_size = 2 -[*.{js,vue}] +[*.{js,ts,mts,vue}] indent_size = 2 indent_style = tab diff --git a/.eslintignore b/.eslintignore index 9b1c8b1..0051b4b 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1 +1,4 @@ -/dist +# don't ever lint node_modules +node_modules +# don't lint build output (make sure it's set to your correct build folder name) +dist diff --git a/.eslintrc-auto-import.json b/.eslintrc-auto-import.json new file mode 100644 index 0000000..95f0727 --- /dev/null +++ b/.eslintrc-auto-import.json @@ -0,0 +1,64 @@ +{ + "globals": { + "CSSProperties": true, + "Component": true, + "ComponentPublicInstance": true, + "ComputedRef": true, + "EffectScope": true, + "InjectionKey": true, + "PropType": true, + "Ref": true, + "VNode": true, + "computed": true, + "createApp": true, + "customRef": true, + "defineAsyncComponent": true, + "defineComponent": true, + "effectScope": true, + "getCurrentInstance": true, + "getCurrentScope": true, + "h": true, + "inject": true, + "isProxy": true, + "isReactive": true, + "isReadonly": true, + "isRef": true, + "markRaw": true, + "nextTick": true, + "onActivated": true, + "onBeforeMount": true, + "onBeforeUnmount": true, + "onBeforeUpdate": true, + "onDeactivated": true, + "onErrorCaptured": true, + "onMounted": true, + "onRenderTracked": true, + "onRenderTriggered": true, + "onScopeDispose": true, + "onServerPrefetch": true, + "onUnmounted": true, + "onUpdated": true, + "provide": true, + "reactive": true, + "readonly": true, + "ref": true, + "resolveComponent": true, + "shallowReactive": true, + "shallowReadonly": true, + "shallowRef": true, + "toRaw": true, + "toRef": true, + "toRefs": true, + "triggerRef": true, + "unref": true, + "useAttrs": true, + "useCssModule": true, + "useCssVars": true, + "useSlots": true, + "useTheme": true, + "watch": true, + "watchEffect": true, + "watchPostEffect": true, + "watchSyncEffect": true + } +} \ No newline at end of file diff --git a/.eslintrc.js b/.eslintrc.js index 131568f..49c93cc 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -1,36 +1,65 @@ module.exports = { env: { browser: true, + node: true, }, extends: [ - 'airbnb-base', 'eslint:recommended', - 'plugin:vue/recommended', + 'plugin:vue/essential', + 'plugin:@typescript-eslint/recommended', + '@vue/typescript/recommended', + 'prettier', + './.eslintrc-auto-import.json', ], - parser: 'vue-eslint-parser', - parserOptions: { - ecmaFeatures: { - jsx: true, + ignorePatterns: [ + '.eslintrc.js', + 'stylelint.config.js', + 'vite.build.config.mts', + 'vite.config.mts', + 'vitest.config.mts', + '*.bk.vue', + ], + overrides: [ + { + files: [ + '**/*.spec.{j,t}s?(x)', + ], + env: { + jest: true, + }, }, - ecmaVersion: 12, - parser: '@babel/eslint-parser', - requireConfigFile: false, - sourceType: 'module', + ], + globals: { + Entry: true, + }, + parserOptions: { + parser: '@typescript-eslint/parser', }, plugins: [ + '@typescript-eslint', 'import', + 'prettier', 'vue', - '@babel', ], + root: true, settings: { 'import/resolver': { - 'babel-module': {}, }, }, rules: { - 'arrow-spacing': ['error', { after: true, before: true }], + '@typescript-eslint/ban-ts-comment': 0, + '@typescript-eslint/ban-types': [ + 'error', + { + 'extendDefaults': true, + 'types': { + '{}': false, + } + }, + ], + '@typescript-eslint/no-empty-function': 0, + '@typescript-eslint/no-explicit-any': 0, 'brace-style': ['error', 'stroustrup'], - 'comma-dangle': ['error', 'always-multiline'], 'default-case': [ 'error', { commentPattern: '^skip\\sdefault', @@ -38,44 +67,37 @@ module.exports = { ], 'func-names': ['error', 'never'], 'function-paren-newline': 0, - 'implicit-arrow-linebreak': ['warn', 'beside'], - 'import/no-extraneous-dependencies': [ - 'error', - { - devDependencies: [ - '**/vite.*.js', - ], - }, - ], 'import/no-self-import': 0, - 'import/prefer-default-export': 0, + 'import/no-extraneous-dependencies': 0, + 'implicit-arrow-linebreak': ['warn', 'beside'], indent: [2, 'tab', { SwitchCase: 1 }], + 'no-tabs': [0, { allowIndentationTabs: true }], 'linebreak-style': 0, 'max-len': 0, - - 'no-console': ['warn', { allow: ['warn', 'error'] }], - 'no-debugger': 0, 'no-else-return': ['error', { allowElseIf: true }], - 'no-multiple-empty-lines': ['error', { max: 2, maxEOF: 0 }], + 'no-console': ['warn', { allow: ['warn', 'error', 'info', 'trace'] }], + 'no-const-assign': 'error', + 'no-debugger': 0, 'no-new': 0, + 'no-undef': 0, + 'no-unused-vars': 1, + 'no-use-before-define': 0, + 'no-useless-escape': 0, 'no-param-reassign': [ 'error', { - ignorePropertyModificationsFor: ['Vue', 'field', 'model', 'el', 'item', 'state'], props: true, + ignorePropertyModificationsFor: ['field', 'model', 'el', 'item', 'state', 'Vue', 'vue'], }, ], - 'no-plusplus': [ - 'error', { allowForLoopAfterthoughts: true }, - ], - 'no-tabs': [0, { allowIndentationTabs: true }], 'no-underscore-dangle': [ 'error', { - allow: ['_data', '__dirname', '__filename'], + allow: ['_data'], allowAfterThis: true, }, ], - 'no-unused-vars': 1, - 'no-useless-escape': 0, + 'no-plusplus': [ + 'error', { allowForLoopAfterthoughts: true }, + ], 'object-curly-newline': ['error', { ObjectPattern: { multiline: false }, }], @@ -89,23 +111,14 @@ module.exports = { enforceForRenamedProperties: false, }, ], - quotes: ['error', 'single', { avoidEscape: true }], - semi: ['error', 'always'], - 'sort-imports': ['error', { - allowSeparatedGroups: false, - ignoreCase: true, - ignoreDeclarationSort: true, - ignoreMemberSort: false, - memberSyntaxSortOrder: ['none', 'single', 'all', 'multiple'], - }], 'space-before-function-paren': ['error', { anonymous: 'never', - asyncArrow: 'never', named: 'never', + asyncArrow: 'always', }], 'vue/attributes-order': ['error', { - alphabetical: true, - order: [ + 'alphabetical': true, + 'order': [ 'DEFINITION', 'LIST_RENDERING', 'CONDITIONALS', @@ -119,69 +132,22 @@ module.exports = { 'CONTENT', ], }], - 'vue/component-tags-order': ['error', { - order: ['template', 'script', 'style'], - }], 'vue/html-closing-bracket-newline': 0, - 'vue/html-comment-content-spacing': ['error', - 'always', - ], 'vue/html-indent': 0, 'vue/html-self-closing': 0, 'vue/max-attributes-per-line': 0, - 'vue/multi-word-component-names': 0, + 'vue/no-multiple-template-root': 0, 'vue/no-template-shadow': 0, + 'vue/no-v-for-template-key': 0, 'vue/no-v-html': 0, - 'vue/no-v-text-v-html-on-component': 0, - 'vue/order-in-components': ['error', { - order: [ - 'el', - 'name', - 'key', - 'parent', - 'functional', - ['delimiters', 'comments'], - ['components', 'directives', 'filters'], - 'extends', - 'mixins', - ['provide', 'inject'], - 'ROUTER_GUARDS', - 'layout', - 'middleware', - 'validate', - 'scrollToTop', - 'transition', - 'loading', - 'inheritAttrs', - 'model', - ['props', 'propsData'], - 'emits', - 'setup', - 'asyncData', - 'data', - 'fetch', - 'head', - 'computed', - 'watch', - 'watchQuery', - 'beforeCreate', - 'created', - 'beforeMount', - 'mounted', - 'beforeUpdate', - 'updated', - 'activated', - 'deactivated', - 'beforeDestroy', - 'destroyed', - 'errorCaptured', // for Vue.js 2.5.0+ - 'methods', - ['template', 'render'], - 'renderError', - ], - }], - 'vue/padding-line-between-blocks': 1, - 'vue/require-name-property': 1, 'vue/singleline-html-element-content-newline': 0, + 'vue/sort-keys': ['error', 'asc', { + caseSensitive: true, + ignoreChildrenOf: ['model', 'defineProps'], + ignoreGrandchildrenOf: ['computed', 'directives', 'inject', 'props', 'watch', 'defineProps'], + minKeys: 2, + natural: true, + }], + 'vue/valid-template-root': 0, }, }; diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml index 2400b0d..0f7a7df 100644 --- a/.github/FUNDING.yml +++ b/.github/FUNDING.yml @@ -1,2 +1,3 @@ -custom: ["https://bit.ly/wdns-paypal-veet-plugin"] +buy_me_a_coffee: webdevnerdstuff +custom: ["paypal.me/webdevnerdstuff"] patreon: webdevnerdstuff diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md index dd84ea7..828df55 100644 --- a/.github/ISSUE_TEMPLATE/bug_report.md +++ b/.github/ISSUE_TEMPLATE/bug_report.md @@ -1,38 +1,45 @@ ---- -name: Bug report -about: Create a report to help us improve -title: '' -labels: '' -assignees: '' - ---- - -**Describe the bug** -A clear and concise description of what the bug is. - -**To Reproduce** -Steps to reproduce the behavior: -1. Go to '...' -2. Click on '....' -3. Scroll down to '....' -4. See error - -**Expected behavior** -A clear and concise description of what you expected to happen. - -**Screenshots** -If applicable, add screenshots to help explain your problem. - -**Desktop (please complete the following information):** - - OS: [e.g. iOS] - - Browser [e.g. chrome, safari] - - Version [e.g. 22] - -**Smartphone (please complete the following information):** - - Device: [e.g. iPhone6] - - OS: [e.g. iOS8.1] - - Browser [e.g. stock browser, safari] - - Version [e.g. 22] - -**Additional context** -Add any other context about the problem here. +name: Bug Report +description: File a bug report +title: "[Bug]: " +labels: ["bug", "triage"] +assignees: + - webdevnerdstuff +body: + - type: markdown + attributes: + value: | + Thanks for taking the time to fill out this bug report! + - type: textarea + id: bug-description + attributes: + label: Bug description + description: What happened? + validations: + required: true + - type: textarea + id: steps + attributes: + label: Steps to reproduce + description: Which steps do we need to take to reproduce this error? + placeholder: "Steps to reproduce the behavior:\n1. Go to '...'\n2. Click on '....'\n3. Scroll down to '....'" + validations: + required: true + - type: textarea + id: logs + attributes: + label: Relevant log output + description: If applicable, please copy and paste any relevant log output. This will be automatically formatted into code, so no need for backticks. + render: shell + - type: textarea + id: additional-context + attributes: + label: Additional context + description: Add any other context about the problem here. + - type: checkboxes + id: terms + attributes: + label: Code of Conduct + description: By submitting this issue, you agree to follow our [Code of Conduct](https://github.com/webdevnerdstuff/vue3-easter-egg-trigger/blob/main/CODE_OF_CONDUCT.md) + options: + - label: I agree to follow this project's Code of Conduct + required: true diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml index 94e9fee..2d2fc19 100644 --- a/.github/workflows/main.yml +++ b/.github/workflows/main.yml @@ -18,7 +18,7 @@ jobs: strategy: matrix: - node-version: [19] + node-version: [20] steps: - uses: actions/checkout@v3 diff --git a/.gitignore b/.gitignore index 1c3f854..8e77387 100644 --- a/.gitignore +++ b/.gitignore @@ -1,29 +1,27 @@ -.DS_Store -node_modules -.history -.vscode - -# local env files -.env.local -.env.*.local - -# Log files +# Logs +logs +*.log npm-debug.log* yarn-debug.log* yarn-error.log* pnpm-debug.log* +lerna-debug.log* + +node_modules +dist-ssr +*.local # Editor directories and files +.vscode/* +.history/* +!.vscode/extensions.json .idea -.vscode +.DS_Store *.suo *.ntvs* *.njsproj *.sln *.sw? -*.map -docs -# docs/.vuepress/dist -demo/dist/* -node_modules\n.temp\n.cache + +src/plugin/**/*.bk.* diff --git a/.husky/pre-commit b/.husky/pre-commit new file mode 100755 index 0000000..a16d8b1 --- /dev/null +++ b/.husky/pre-commit @@ -0,0 +1,4 @@ +#!/usr/bin/env sh +. "$(dirname "$0")/_/husky.sh" + +npx lint-staged diff --git a/.npmignore b/.npmignore index 21d5cb8..c9a372c 100755 --- a/.npmignore +++ b/.npmignore @@ -1,2 +1,3 @@ -demo -*.map +node_modules +.github +.history diff --git a/.npmrc b/.npmrc new file mode 100644 index 0000000..1765203 --- /dev/null +++ b/.npmrc @@ -0,0 +1 @@ +node-version=20.9.0 diff --git a/.nvmrc b/.nvmrc new file mode 100644 index 0000000..f3f52b4 --- /dev/null +++ b/.nvmrc @@ -0,0 +1 @@ +20.9.0 diff --git a/.prettierrc.js b/.prettierrc.js index 27ee62f..8d78971 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -1,4 +1,5 @@ module.exports = { + semi: true, singleQuote: true, trailingComma: 'all', }; diff --git a/.vscode/extensions.json b/.vscode/extensions.json new file mode 100644 index 0000000..c0a6e5a --- /dev/null +++ b/.vscode/extensions.json @@ -0,0 +1,3 @@ +{ + "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"] +} diff --git a/CHANGELOG.md b/CHANGELOG.md index b860ede..1e0f66c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,15 +1,30 @@ # Change Log All notable changes to the "vue-easter-egg-trigger" plugin will be documented in this file. +## v3.0.2 +2024-01-19 +[main] (@webdevnerdstuff) +* Fix issue when only using single key press + +## v3.0.1 +2024-01-17 +[main] (@webdevnerdstuff) +* Fix links + +## v3.0.0 +2024-01-17 +[main] (@webdevnerdstuff) +* Updating typescript support +* Refactoring +* Updating packages +* Moving V3 version to this repo + +## v1.0.2 +2023-07-20 +[main] (@webdevnerdstuff) +* Update packages +* Update vite config for build + ## v1.0.0 -April 27, 2021 - -Initial release - -## v2.0.0 -February 11, 2022 - -1. Updating plugin to support both usage as a component as well as an instance method. -2. Removed the `key` option as it was using depreciated key events. -3. Fixed some minor bugs. -4. Added a demo page. +2022-01-26 +[main] Initial release (@webdevnerdstuff) diff --git a/LICENSE.md b/LICENSE.md index cb72d15..8e02d4e 100644 --- a/LICENSE.md +++ b/LICENSE.md @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2020 WebDevNerdStuff +Copyright (c) 2022 WebDevNerdStuff Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index 5c75baf..16645e8 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,5 @@ -
-
+
@@ -8,8 +7,8 @@
-## Description - -The `vue-easter-egg-trigger` component makes it nice and easy to add Easter Egg triggers to your Vue site. Also available for Vue 3 at [vue3-easter-egg-trigger](https://github.com/webdevnerdstuff/vue3-easter-egg-trigger). - -## Installation -#### pnpm -``` -pnpm add vue-easter-egg-trigger -``` -#### npm -``` -npm i vue-easter-egg-trigger -``` - -## Register - - ### Plugin Registration -```javascript -import Vue from 'vue'; -import EasterEggTrigger from 'vue-easter-egg-trigger'; - -Vue.use(EasterEggTrigger); -``` -### Component Registration -```javascript -import { EasterEggComponent } from 'vue-easter-egg-trigger'; -``` - -## Usage - - #### Demo -See it in action on the [Demo Page](https://webdevnerdstuff.github.io/vue-easter-egg-trigger) - -## Options -### Plugin Global Options - -Name | Type | Default | Description -:----- | :------ | :----- | :----- -delay | Integer | 500 | Determines the timeout before the event lister resets. - -##### Overriding the plugin default delay option - -```javascript -import Vue from 'vue'; -import EasterEggTrigger from 'vue-easter-egg-trigger'; - -Vue.use(EasterEggTrigger, { - delay: 1000, -}); -``` - -### Easter Egg Options - -Name | -Type | -Default | -Description | -
---|---|---|---|
callback | -Function | -null | -The callback function. | -
destroyBus | -Boolean | -true | -Determines if a bus $on event is destroyed automatically. | -
name | -String | -easter-egg | -Identifier & used for even bus callback. | -
pattern | -Array | -['ArrowUp', 'ArrowUp', 'ArrowDown', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowLeft', -'ArrowRight', 'b', -'a'] | -The key/click combination a user does to trigger easter egg. The default combination is the -konami code. | -
target | -String | -div | -Use this to target DOM elements, Id's, or Class Names. Used with click events. | -
triggered | -Function | -null | -Same functionality as the callback option. | -
type | -String | -keydown | -The type of action the trigger will be listening for. | -
withBus | -Boolean | -false | -Determines if a bus event is emitted. | -
Name | -Response | -Description | -
---|---|---|
callback | -$event | -The callback event handler. If you use $event it will return the easter egg options object. | -
triggered | -$event | -Same functionality as the callback event handler. | -
= { + [K in keyof Pick
]: K extends keyof D ? __VLS_Prettify
: P[K];
+};
+type __VLS_Prettify by WebDevNerdStuff
+ Available types of Mouse Events:
+ The Easter egg image was created by CutiefulCritters and is licensed under the "My spouse allowed me to use this image" license. The unicorn
+ image was created by Christine Wulf and has been licensed under the Adobe Stock Standard
+ License.
+
- Vue 2 Easter Egg Trigger
- (clicked via component)
-
-
-
-
-
-
-
-
-
-
-
- by WebDevNerdStuff
-
-
+ Vue Easter Egg Trigger
+
+
+ #
+ Installation
+
+
+
+ #
+ {{ sectionTitle }}
+
+
+
+ createVEasterEggTrigger
.
+
+
+ #
+ {{ item.name }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ strong
DOM element clicked
+ {{ code.name }}
+
+ #
+ Dependencies
+
+
+
+ Lodash
+
+
+ #
+ Description
+
+
+ #
+ Events
+
+
+
+
+
+
+ #
+
+ {{ item.name }}
+
+
+
+
+
+
+ #
+ Examples
+
+ Key Event Examples
+ Mouse Event Examples
+ click
, dblclick
, mouseup
, mousedown
. When using dblclick
the
+ pattern will only work with one double click. Ex. pattern: ['dblclick']
.
+
+
+ Mouse events require the target
property to be set.
+
+ #
+ Legal
+
+
+ #
+ License
+
+
+ Licensed under the
+
+ MIT License
+
+
+ #
+ Developer Playground
+
+
+ Setup the Playground
+
+
+ /src/playground/PlaygroundPage.vue
+
+ #
+ Props
+
+
+ #
+ Usage
+
+
+ Global options have a higher precedence and will override local props
+
+ Vue Easter Egg Trigger
+