feat(vue): Initial Vue package commit

Author: Danktuary

packages/vue/.eslintignore

@@ -0,0 +1 @@
+dist/*

packages/vue/.eslintrc.js

@@ -0,0 +1,11 @@
+/* eslint-env node */
+/* eslint-disable @typescript-eslint/no-var-requires */
+const path = require('path')
+
+module.exports = {
+	'extends': [
+		path.join('..', '..', '.eslintrc.js'),
+		'sora/vue-3',
+		'@vue/typescript/recommended',
+	],
+}

packages/vue/.gitignore

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

packages/vue/README.md

@@ -0,0 +1 @@
+# @discord-message-components/vue

packages/vue/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@discord-message-components/vue",
+  "version": "0.0.0",
+  "main": "./dist/vue.umd.js",
+  "module": "./dist/vue.es.js",
+  "files": [
+    "dist"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/vue.es.js",
+      "require": "./dist/vue.umd.js"
+    }
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "serve": "vite preview",
+    "lint": "eslint . --ext js,ts,tsx,vue"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^1.1.4",
+    "@vue/compiler-sfc": "^3.0.6",
+    "@vue/eslint-config-typescript": "^7.0.0",
+    "babel-eslint": "^10.1.0",
+    "eslint-plugin-vue": "^7.6.0",
+    "typescript": "^4.1.3",
+    "vite": "^2.0.1",
+    "vue": "^3.0.6"
+  }
+}

packages/vue/src/components/DiscordMessages.vue

@@ -0,0 +1,34 @@
+<template>
+	<div class="discord-messages" :class="{ 'discord-compact-mode': compactMode, 'discord-light-theme': lightTheme }">
+		<slot></slot>
+	</div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+
+export default defineComponent({
+	name: 'DiscordMessages',
+	props: {
+		compactMode: Boolean,
+		lightTheme: Boolean,
+	},
+})
+</script>
+
+<style>
+.discord-messages {
+	color: #fff;
+	background-color: #36393e;
+	font-size: 16px;
+	font-family: sans-serif;
+	line-height: 170%;
+	border: 1px solid rgba(255, 255, 255, 0.05);
+}
+
+.discord-messages.discord-light-theme {
+	color: #747f8d;
+	background-color: #f7f7f7;
+	border-color: #dedede;
+}
+</style>

packages/vue/src/index.ts

@@ -0,0 +1 @@
+export { default as DiscordMessages } from './components/DiscordMessages.vue'

packages/vue/src/shims-vue.d.ts

@@ -0,0 +1,5 @@
+declare module '*.vue' {
+	import { defineComponent } from 'vue'
+	const component: ReturnType<typeof defineComponent>
+	export default component
+}

packages/vue/tsconfig.json

@@ -0,0 +1,13 @@
+{
+	"extends": "../../tsconfig.json",
+	"compilerOptions": {
+		"resolveJsonModule": true,
+		"types": ["vite/client"],
+	},
+	"include": [
+		"src/**/*.ts",
+		"src/**/*.d.ts",
+		"src/**/*.tsx",
+		"src/**/*.vue"
+	],
+}

packages/vue/vite.config.ts

@@ -0,0 +1,21 @@
+import path from 'path'
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+
+export default defineConfig({
+	plugins: [vue()],
+	build: {
+		lib: {
+			entry: path.join(__dirname, 'src', 'index.ts'),
+			name: 'DiscordMessageComponentsVue',
+		},
+		rollupOptions: {
+			external: ['vue'],
+			output: {
+				globals: {
+					vue: 'Vue',
+				},
+			},
+		},
+	},
+})