chore: use workspaces

lib/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "@ayo-run/status-indicator",
+  "version": "2.0.3",
+  "type": "module",
+  "description": "Circles with color that can pulse to indicate status",
+  "license": "MIT",
+  "author": "Ayo Ayco",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ayo-run/status-indicator.git",
+    "directory": "lib"
+  },
+  "homepage": "https://status-indicator.webcomponent.io",
+  "module": "./dist/status-indicator.js",
+  "exports": {
+    ".": {
+      "default": "./dist/status-indicator.js",
+      "import": "./dist/status-indicator.js",
+      "require": "./dist/status-indicator.umd.cjs"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE",
+    "screenshot.png"
+  ],
+  "scripts": {
+    "test": "echo \"Warning: no test specified\"",
+    "build": "vite build",
+    "prepare": "husky"
+  },
+  "devDependencies": {
+    "@types/node": "^25.6.2",
+    "eslint": "^10.3.0",
+    "husky": "^9.1.7",
+    "unplugin-dts": "^1.0.0",
+    "vite": "^8.0.11"
+  },
+  "peerDependencies": {
+    "web-component-base": "^4.1.2"
+  }
+}

lib/src/status-indicator.ts

@@ -43,8 +43,8 @@ class StatusIndicator extends WebComponent {
                 marginRight: '0.05rem',
                 ...(this.props.pulse ? this.#pulseAnimationCSSRules : [])
             }}> </div>
-
-            <span class="status-indicator-label"><slot></slot></span>
+            Weeeee
+            <span class="status-indicator-label">Wooooo <slot></slot></span>
 
             ${
             /** if pulse is set, add animation keyframes */

lib/vite.config.ts

@@ -1,6 +1,5 @@
 import { resolve } from 'node:path'
 import { defineConfig } from 'vite'
-import dts from 'unplugin-dts/vite'
 
 export default defineConfig({
     build: {
@@ -8,7 +7,6 @@ export default defineConfig({
             entry: resolve(import.meta.dirname, 'src/status-indicator.js'),
             name: 'StatusIndicator',
             fileName: 'status-indicator',
-            formats: ['es']
         },
         rolldownOptions: {
             external: ['web-component-base'],
@@ -19,6 +17,5 @@ export default defineConfig({
                 }
             }
         }
-    },
-    plugins: [dts()]
+    }
 })

package.json

@@ -1,34 +1,13 @@
 {
-  "name": "@ayo-run/status-indicator",
-  "version": "2.0.3",
+  "name": "status-indicator-monorepo",
+  "version": "1.0.0",
+  "private": true,
   "type": "module",
-  "description": "Circles with color that can pulse to indicate status",
-  "license": "MIT",
-  "author": "Ayo Ayco",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/ayo-run/status-indicator.git"
-  },
-  "homepage": "https://status-indicator.webcomponent.io",
-  "module": "./dist/status-indicator.js",
-  "exports": {
-    ".": {
-      "default": "./dist/status-indicator.js",
-      "import": "./dist/status-indicator.js",
-      "require": "./dist/status-indicator.umd.cjs"
-    }
-  },
-  "files": [
-    "dist",
-    "README.md",
-    "LICENSE",
-    "screenshot.png"
-  ],
   "scripts": {
     "test": "echo \"Warning: no test specified\"",
-    "build": "vite build",
-    "build:lib": "vite build --config vite-lib.config.ts",
-    "dev": "vite",
+    "dev": "pnpm -F site run dev",
+    "build:site": "pnpm -F site run build",
+    "build:lib": "pnpm -F @ayo-run/status-indicator run build",
     "prepare": "husky"
   },
   "devDependencies": {
@@ -37,8 +16,5 @@
     "husky": "^9.1.7",
     "unplugin-dts": "^1.0.0",
     "vite": "^8.0.11"
-  },
-  "peerDependencies": {
-    "web-component-base": "^4.1.2"
   }
 }

pnpm-lock.yaml

@@ -7,6 +7,24 @@ settings:
 importers:
 
   .:
+    devDependencies:
+      '@types/node':
+        specifier: ^25.6.2
+        version: 25.6.2
+      eslint:
+        specifier: ^10.3.0
+        version: 10.3.0
+      husky:
+        specifier: ^9.1.7
+        version: 9.1.7
+      unplugin-dts:
+        specifier: ^1.0.0
+        version: 1.0.0(typescript@6.0.3)(vite@8.0.11(@types/node@25.6.2))
+      vite:
+        specifier: ^8.0.11
+        version: 8.0.11(@types/node@25.6.2)
+
+  lib:
     dependencies:
       web-component-base:
         specifier: ^4.1.2
@@ -28,8 +46,17 @@ importers:
         specifier: ^8.0.11
         version: 8.0.11(@types/node@25.6.2)
 
+  site:
+    dependencies:
+      '@ayo-run/status-indicator':
+        specifier: '*'
+        version: 1.1.1
+
 packages:
 
+  '@ayo-run/status-indicator@1.1.1':
+    resolution: {integrity: sha512-ZxNEiTkrYAEZWbCNLKu7tHoPVWfGTPVRZXpe7Vxsu5s50ZOmu+bmdxQn5xGXljvSUWb8qNB8trCz7trm46/9xQ==}
+
   '@emnapi/core@1.10.0':
     resolution: {integrity: sha512-yq6OkJ4p82CAfPl0u9mQebQHKPJkY7WrIuk205cTYnYe+k2Z8YBh11FrbRG/H6ihirqcacOgl2BIO8oyMQLeXw==}
 
@@ -732,6 +759,10 @@ packages:
 
 snapshots:
 
+  '@ayo-run/status-indicator@1.1.1':
+    dependencies:
+      web-component-base: 4.1.2
+
   '@emnapi/core@1.10.0':
     dependencies:
       '@emnapi/wasi-threads': 1.2.1

pnpm-workspace.yaml

@@ -1,2 +1,5 @@
+packages:
+  - "site"
+  - "lib"
 allowBuilds:
   web-component-base: false

site/index.html

@@ -18,8 +18,12 @@
     <link rel="apple-touch-icon" href="apple-touch-icon.png"/>
     <link rel="shortcut icon" href="/favicon.svg" type="image/svg+xml"/>
 
+
+
     <link rel="stylesheet" href="pico.min.css">
-    <script type="module" src="./src/status-indicator.ts"></script>
+
+    <script type="module" src="./main.ts"></script>
+
     <style>
         html, body {
             height: 100%

site/main.ts

@@ -0,0 +1,3 @@
+import StatusIndicator from "@ayo-run/status-indicator";
+
+console.log(StatusIndicator)

site/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "site",
+  "private": true,
+  "version": "1.0.0",
+  "description": "demo site for the status-indicator web component",
+  "scripts": {
+    "dev": "vite"
+  },
+  "keywords": [
+    "web",
+    "component"
+  ],
+  "author": "Ayo Ayco",
+  "license": "MIT",
+  "dependencies": {
+    "@ayo-run/status-indicator": "*"
+  }
+}