tweaks

README.md

@@ -150,6 +150,8 @@ native `.dispatchEvent` method,
 
 > returns `true` if either event's `cancelable` attribute value is false or its `preventDefault()` method was not invoked, and `false` otherwise.
 
+That is, it returns true if it was not `preventDetault`ed.
+
 ```ts
 dispatch (type:string, opts:Partial<{
     bubbles,

example/index.ts

@@ -24,7 +24,7 @@ class MyElement extends WebComponent.create('my-element') {
         this.querySelector('button.namespaced')?.addEventListener('click', ev => {
             ev.preventDefault()
             ev.stopPropagation()
-            this.emit('click', { detail: 'some data' })
+            this.emit<string>('click', { detail: 'some data' })
         })
 
         this.querySelector('button.regular')?.addEventListener('click', ev => {
@@ -42,7 +42,7 @@ document.body.innerHTML += `
 `
 
 const el = document.querySelector('my-element')
-debug('the namespaced event....', MyElement.event('aaa'))
+debug('the namespaced event...', MyElement.event('aaa'))
 
 el?.addEventListener('my-element:click', ev => {
     debug('got a namespaced click', ev.detail)

src/index.ts

@@ -21,16 +21,16 @@ export abstract class WebComponent extends HTMLElement {
      * `{ bubbles: true, cancelable: true }`
      * @returns {boolean}
      */
-    emit (
+    emit<T = any> (
         type:string,
         opts:Partial<{
             bubbles:boolean,
             cancelable:boolean,
-            detail:CustomEvent['detail']
+            detail:CustomEvent<T>['detail']
         }> = {}
     ):boolean {
         const namespace = this.NAME
-        const event = new CustomEvent(`${namespace}:${type}`, {
+        const event = new CustomEvent<T>(`${namespace}:${type}`, {
             bubbles: (opts.bubbles === undefined) ? true : opts.bubbles,
             cancelable: (opts.cancelable === undefined) ? true : opts.cancelable,
             detail: opts.detail
@@ -42,10 +42,10 @@ export abstract class WebComponent extends HTMLElement {
     /**
      * Create and emit an event, no namespacing.
      */
-    dispatch (type:string, opts:Partial<{
-        bubbles,
-        cancelable,
-        detail
+    dispatch<T> (type:string, opts:Partial<{
+        bubbles:boolean,
+        cancelable:boolean,
+        detail:CustomEvent<T>['detail']
     }>):boolean {
         const event = new CustomEvent(type, {
             bubbles: (opts.bubbles === undefined) ? true : opts.bubbles,

vite.config.js

@@ -1,5 +1,6 @@
 import { defineConfig } from 'vite'
 import postcssNesting from 'postcss-nesting'
+import cssnanoPlugin from 'cssnano'
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -15,7 +16,8 @@ export default defineConfig({
     css: {
         postcss: {
             plugins: [
-                postcssNesting
+                postcssNesting,
+                cssnanoPlugin
             ],
         },
     },