feat: init vconsole plugin (#1)

* vconsole-plugin-custom-function

* vconsole-plugin

* bump version

* read me

---------

Co-authored-by: Atipat Pankong <[email protected]>

.changeset/tidy-points-sip.md

@@ -0,0 +1,6 @@
+---
+'vconsole-plugin-custom-function': minor
+'vite-vconsole-plugin-icon-size': minor
+---
+
+init plugin

.eslintrc

@@ -1,7 +1,12 @@
 {
-    "extends": ["standard"],
-    "rules": {
-        "no-console": "off",
-        "semi": ["error", "never"]
-    }
-}
+	"parser": "@typescript-eslint/parser",
+	"extends": ["standard"],
+	"rules": {
+		"no-console": "off",
+		"semi": ["error", "never"],
+		"no-tabs": "off",
+		"indent": "off",
+		"comma-dangle": "off",
+		"space-before-function-paren": "off"
+	}
+}

README.md

@@ -1,34 +1,25 @@
 # Promise until tired
 
-[![semantic-release](https://img.shields.io/badge/semantic-release-e10079.svg?logo=semantic-release)](https://github.com/semantic-release/semantic-release)
 [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
 ![ts](https://badgen.net/badge/Built%20With/TypeScript/blue) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
-Too long unresolved promise is tired and I gonna give up.
-
-This is the promise with timeout.
-
 ## Installation
 
 ```
-yarn add promise-until-tired
+yarn add vconsole-plugin-custom-function
 ```
 
 ### Usage
 
 ```ts
-import newPromiseUntilTired, { TiredFromWaitingPromiseResolveTooLongError } from 'promise-until-tired'
-
-try {
-    const value = await newPromiseUntilTired((resolve, reject) => {
-        // logic
-    }, timeout)
-} catch (error) {
-    if (error instanceof TiredFromWaitingPromiseResolveTooLongError) {
-        // handle timeout logic
-    } else {
-        // handle other reject logic
-    }
-}
+import VConsoleFunctionPlugin from 'vconsole-plugin-custom-function'
+
+new VConsoleFunctionPlugin(window.vConsole, [
+	{
+		name: 'log',
+		callback: () => console.log('234'),
+	},
+	// your custom function
+])
 ```

package.json

@@ -2,6 +2,7 @@
 	"name": "vconsole-plugin",
 	"version": "1.0.0",
 	"private": true,
+	"type": "module",
 	"workspaces": [
 		"packages/*"
 	],
@@ -14,16 +15,28 @@
 	},
 	"license": "MIT",
 	"main": "index.js",
+	"dependencies": {},
 	"devDependencies": {
 		"@changesets/cli": "^2.27.12",
 		"@rollup/plugin-commonjs": "^28.0.2",
+		"@rollup/plugin-json": "^6.1.0",
 		"@rollup/plugin-node-resolve": "^16.0.0",
+		"@rollup/plugin-terser": "^0.4.4",
 		"@rollup/plugin-typescript": "^12.1.2",
+		"@typescript-eslint/eslint-plugin": "^8.24.0",
+		"@typescript-eslint/parser": "^8.24.0",
 		"eslint": "8.57.1",
+		"eslint-config-standard": "^17.1.0",
+		"eslint-plugin-import": "^2.31.0",
+		"eslint-plugin-n": "^17.15.1",
+		"eslint-plugin-promise": "^7.2.1",
 		"husky": "^9.1.7",
 		"lint-staged": "^15.4.3",
 		"rollup": "^4.34.7",
+		"rollup-plugin-visualizer": "^5.14.0",
+		"tslib": "^2.8.1",
 		"turbo": "^2.4.2",
 		"typescript": "^5.7.3"
-	}
+	},
+	"packageManager": "[email protected]+sha256.c17d3797fb9a9115bf375e31bfd30058cac6bc9c3b8807a3d8cb2094794b51ca"
 }

packages/vconsole-plugin-custom-function/package.json

@@ -0,0 +1,32 @@
+{
+	"name": "vconsole-plugin-custom-function",
+	"version": "0.0.0",
+	"type": "module",
+	"main": "./dist/index.cjs",
+	"module": "./dist/index.js",
+	"types": "./dist/index.d.ts",
+	"scripts": {
+		"build": "rollup -c && node --experimental-modules ./scripts/prependReferrer.mjs",
+		"type-check": "tsc --noEmit"
+	},
+	"files": [
+		"dist/**/*.js",
+		"dist/**/*.cjs",
+		"dist/**/*.d.ts",
+		"CHANGELOG.md"
+	],
+	"exports": {
+		".": {
+			"import": "./dist/index.js",
+			"require": "./dist/index.cjs"
+		}
+	},
+	"devDependencies": {
+		"fs": "^0.0.1-security",
+		"rollup-plugin-copy": "^3.5.0",
+		"vconsole": "^3.15.1"
+	},
+	"peerDependencies": {
+		"vconsole": ">=3.15.1"
+	}
+}

packages/vconsole-plugin-custom-function/rollup.config.js

@@ -0,0 +1,50 @@
+import path from 'path'
+
+import resolve from '@rollup/plugin-node-resolve'
+import json from '@rollup/plugin-json'
+import commonjs from '@rollup/plugin-commonjs'
+import typescript from '@rollup/plugin-typescript'
+import { visualizer } from 'rollup-plugin-visualizer'
+import terser from '@rollup/plugin-terser'
+import copy from 'rollup-plugin-copy'
+
+export default {
+	input: 'src/index.ts',
+	output: [
+		{
+			file: 'dist/index.cjs',
+			format: 'cjs',
+			compact: true,
+		},
+		{
+			file: 'dist/index.js',
+			format: 'esm',
+			compact: true,
+		},
+	],
+	external: ['vconsole'],
+	plugins: [
+		terser(),
+		resolve({
+			browser: true,
+		}),
+		commonjs(),
+		typescript({
+			declaration: true,
+			declarationDir: 'dist',
+			exclude: 'src/**/*.test.ts',
+		}),
+		json(),
+		visualizer({
+			filename: path.resolve('dist', 'stat.html'),
+		}),
+		copy({
+			targets: [
+				{
+					src: 'src/global.d.ts',
+					dest: 'dist',
+				},
+			],
+		}),
+	],
+}

packages/vconsole-plugin-custom-function/scripts/prependReferrer.mjs

@@ -0,0 +1,18 @@
+import fs from 'node:fs'
+import path from 'node:path'
+
+const filePath = path.resolve('dist', 'index.d.ts')
+const referrer = '/// <reference types="./global.d.ts" />'
+
+const prependReferrer = () => {
+	if (fs.existsSync(filePath)) {
+		const existingContent = fs.readFileSync(filePath, 'utf-8')
+		const updatedContent = `${referrer}\n\n${existingContent}`
+		fs.writeFileSync(filePath, updatedContent, 'utf-8')
+		console.log('Referrer information added to index.d.ts')
+	} else {
+		console.error(`File not found: ${filePath}`)
+	}
+}
+
+prependReferrer()

packages/vconsole-plugin-custom-function/src/global.d.ts

@@ -0,0 +1,12 @@
+import VConsole from 'vconsole'
+import VConsoleFunctionPlugin from '.'
+
+declare global {
+	// eslint-disable-next-line no-unused-vars
+	interface Window {
+		vConsole: VConsole
+		vconsoleFunctionPlugin: VConsoleFunctionPlugin
+	}
+}
+
+export {}

packages/vconsole-plugin-custom-function/src/index.ts

@@ -0,0 +1,50 @@
+import VConsole from 'vconsole'
+import { CustomFunction } from './types'
+
+class VConsoleFunctionPlugin {
+	private vConsole: VConsole
+
+	private functions: CustomFunction[] = []
+
+	constructor(vConsole: VConsole, functions: CustomFunction[]) {
+		this.vConsole = vConsole
+		this.functions = functions
+		this.init()
+	}
+
+	private init() {
+		const plugin = new VConsole.VConsolePlugin('customFunction', 'Function')
+
+		plugin.on('init', () => {
+			console.log('Vconsole customFunction plugin init done.')
+		})
+
+		plugin.on('renderTab', (callback: (html: string) => void) => {
+			let html = '<table style="width: 100%; border-collapse: collapse; text-align: center;">'
+			html +=
+				'<tr><th style="padding: 10px;">Function Name</th><th style="padding: 10px;">Trigger</th></tr>'
+			this.functions.forEach(({ name }, index) => {
+				html += `<tr>
+		      <td style="padding: 10px;">${name}</td>
+		      <td style="padding: 10px;"><button id="fn-trigger-${index}" style="padding: 5px 10px;">Run</button></td>
+		    </tr>`
+			})
+			html += '</table>'
+
+			callback(html)
+
+			this.functions.forEach(({ callback }, index) => {
+				const btn = document.getElementById(`fn-trigger-${index}`)
+				if (btn) {
+					btn.addEventListener('click', callback)
+				}
+			})
+		})
+
+		this.vConsole.addPlugin(plugin)
+
+		return plugin
+	}
+}
+
+export default VConsoleFunctionPlugin

packages/vconsole-plugin-custom-function/src/types.ts

@@ -0,0 +1,4 @@
+export interface CustomFunction {
+	name: string
+	callback: () => void
+}

packages/tsconfig.json → packages/vconsole-plugin-custom-function/tsconfig.json

@@ -6,8 +6,8 @@
 		"module": "ESNext",
 		"moduleResolution": "Bundler",
 		"skipLibCheck": true,
-		"types": ["node", "vitest/globals"],
-		"baseUrl": "src"
+		"types": ["node"],
+		"baseUrl": "vconsole-plugin-custom-function/src"
 	},
 	"exclude": ["node_modules"],
 	"include": ["src/**/*.ts"]

packages/vconsole-plugin-instance-log/package.json

@@ -0,0 +1,32 @@
+{
+	"name": "vconsole-plugin-instance-log",
+	"version": "0.0.0",
+	"type": "module",
+	"main": "./dist/index.cjs",
+	"module": "./dist/index.js",
+	"types": "./dist/index.d.ts",
+	"scripts": {
+		"build": "rollup -c && node --experimental-modules ./scripts/prependReferrer.mjs",
+		"type-check": "tsc --noEmit"
+	},
+	"files": [
+		"dist/**/*.js",
+		"dist/**/*.cjs",
+		"dist/**/*.d.ts",
+		"CHANGELOG.md"
+	],
+	"exports": {
+		".": {
+			"import": "./dist/index.js",
+			"require": "./dist/index.cjs"
+		}
+	},
+	"devDependencies": {
+		"fs": "^0.0.1-security",
+		"rollup-plugin-copy": "^3.5.0",
+		"vconsole": "^3.15.1"
+	},
+	"peerDependencies": {
+		"vconsole": ">=3.15.1"
+	}
+}