@zcomponent/html 1.3.0-beta → 1.3.0

package/README.md

@@ -0,0 +1 @@
+# @zcomponent/html

package/index.js

@@ -1,2 +1,4 @@
-/* eslint-disable node/no-unsupported-features/es-syntax */
+/* eslint-disable n/no-unsupported-features/es-syntax */
+/* eslint-disable n/no-missing-import */
+
 export * from './lib';

package/lib/CSS.js

@@ -1,4 +1,5 @@
 import { Component, isDesignTime, registerLoadable } from '@zcomponent/core';
+import { HTMLContext } from './context';
 const alreadyAdded = new Map();
 /**
  * The CSS component will ensure that the CSS file referenced by its `source` constructor prop is added to your page and loaded by the browser.
@@ -20,7 +21,10 @@ export class CSS extends Component {
         else {
             this._elm = [1, document.createElement('link')];
             registerLoadable(contextManager, new Promise((resolve, reject) => {
-                this._elm[1].addEventListener('load', resolve);
+                this._elm[1].addEventListener('load', () => {
+                    contextManager.get(HTMLContext).onCSSChanged.emit();
+                    resolve();
+                });
                 this._elm[1].addEventListener('error', reject);
             }));
             this._elm[1].setAttribute('rel', 'stylesheet');

package/lib/HTMLElement.js

@@ -128,7 +128,8 @@ export class ZHTMLElement extends Component {
     }
     _attachEvent(evt, evtName) {
         const handler = (e) => {
-            evt.emit(e);
+            if (this.enabledResolved.value)
+                evt.emit(e);
         };
         evt.hasListeners.addListener(b => {
             if (b)

package/lib/context.d.ts

@@ -2,6 +2,7 @@ import { Event, ContextManager, Context } from '@zcomponent/core';
 export declare class HTMLContext extends Context {
     onNodeConstructed: Event<[Node]>;
     onNodeDisposed: Event<[Node]>;
+    onCSSChanged: Event<[]>;
 }
 export declare function useOnNodeConstructed(mgr: ContextManager): Event<[Node]>;
 export declare function useOnNodeDisposed(mgr: ContextManager): Event<[Node]>;

package/lib/context.js

@@ -4,6 +4,7 @@ export class HTMLContext extends Context {
         super(...arguments);
         this.onNodeConstructed = new Event();
         this.onNodeDisposed = new Event();
+        this.onCSSChanged = new Event();
     }
 }
 export function useOnNodeConstructed(mgr) {

package/package.json

@@ -1,29 +1,76 @@
 {
   "name": "@zcomponent/html",
-  "version": "1.3.0-beta",
-  "description": "",
+  "version": "1.3.0",
+  "description": "Mattercraft support for HTML",
+  "author": "Zappar Limited",
+  "license": "Proprietary",
   "main": "index.js",
   "types": "index.d.ts",
+  "zexports": [
+    "./lib/**/*"
+  ],
   "directories": {
     "lib": "lib"
   },
-  "scripts": {
-    "build": "tsc"
-  },
   "files": [
     "index.js",
     "index.d.ts",
-    "lib/**/*"
+    "lib/**/*",
+    "public/**/*"
   ],
-  "author": "Zappar Limited",
-  "license": "Proprietary",
-  "dependencies": {
-    "@zcomponent/core": "^1.2.0-beta"
+  "scripts": {
+    "build": "rm -rf lib && tsc && tsc-alias",
+    "watch": "tsc -w",
+    "prepack": "npm run build",
+    "docs": "typedoc --out docs"
   },
+  "dependencies": {},
   "devDependencies": {
-    "typescript": "^4.9.4"
+    "@zcomponent/core": "1.x"
   },
-  "zexports": [
-    "./lib/**/*"
-  ]
+  "peerDependencies": {
+    "@zcomponent/core": "1.x"
+  },
+  "keywords": [],
+  "release": {
+    "extends": "semantic-release-commit-filter",
+    "ci": true,
+    "branches": [
+      "main",
+      {
+        "name": "beta",
+        "channel": "beta",
+        "prerelease": "beta"
+      },
+      {
+        "name": "alpha",
+        "channel": "alpha",
+        "prerelease": "alpha"
+      }
+    ],
+    "plugins": [
+      "@semantic-release/commit-analyzer",
+      "@semantic-release/release-notes-generator",
+      "@semantic-release/changelog",
+      "@semantic-release/npm",
+      "@semantic-release/gitlab",
+      "@semantic-release/git",
+      [
+        "@rimac-technology/semantic-release-s3",
+        {
+          "s3Bucket": {
+            "main": "mattercraft-api-docs/prod",
+            "beta": "mattercraft-api-docs/beta",
+            "alpha": "mattercraft-api-docs/alpha"
+          },
+          "directoryPath": "../../docs/**/*",
+          "objectACL": "",
+          "removeDirectoryRoot": true,
+          "awsAccessKeyName": "DOCS_AWS_ACCESS_KEY_ID",
+          "awsSecretAccessKeyName": "DOCS_AWS_SECRET_ACCESS_KEY"
+        }
+      ]
+    ],
+    "tagFormat": "@zcomponent/html@${version}"
+  }
 }

package/lib/audio.d.ts

@@ -1,40 +0,0 @@
-import { ContextManager, Observable, PlayOptions, Stream } from '@zcomponent/core';
-import { HTMLElementProps, ZHTMLElement } from './HTMLElement';
-export interface AudioConstructorProps extends HTMLElementProps {
-    /** @zprop
-     * @zvalues files *.+(mp3|wav)
-     */
-    source: string;
-    /** @zprop
-     * @zdefault false
-     */
-    autoplay: boolean;
-}
-/**
- * @zcomponent
- * @ztag html/element/audio
- * @zgroup Media
- * @zicon music_note
- * @zstream
- */
-export declare class Audio extends ZHTMLElement<HTMLAudioElement> implements Stream {
-    private _hadUserEvent;
-    /** @zprop
-     * @zdefault false
-     * @zgroup Audio
-     * @zgrouppriority 20
-     */
-    muted: Observable<boolean, never>;
-    constructor(mgr: ContextManager, props: AudioConstructorProps);
-    private _updateMute;
-    /** @zprop */
-    play(opts?: PlayOptions): void;
-    /** @zprop */
-    pause(): void;
-    /** @zprop */
-    stop(): void;
-    /** @zprop */
-    seek(t: number): void;
-    length(): number | undefined;
-    dispose(): never;
-}

package/lib/audio.js

@@ -1,67 +0,0 @@
-import { isDesignTime, nextUserEvent, Observable, registerLoadable, started } from '@zcomponent/core';
-import { ZHTMLElement } from './HTMLElement';
-/**
- * @zcomponent
- * @ztag html/element/audio
- * @zgroup Media
- * @zicon music_note
- * @zstream
- */
-export class Audio extends ZHTMLElement {
-    constructor(mgr, props) {
-        const elm = document.createElement('audio');
-        elm.muted = true;
-        registerLoadable(mgr, new Promise((resolve, reject) => {
-            elm.src = props.source;
-            elm.addEventListener('canplaythrough', () => resolve());
-            elm.addEventListener('error', () => reject());
-        }));
-        super(mgr, props, elm);
-        this._hadUserEvent = false;
-        /** @zprop
-         * @zdefault false
-         * @zgroup Audio
-         * @zgrouppriority 20
-         */
-        this.muted = new Observable(false);
-        this._updateMute = () => {
-            if (!this.element || !this._hadUserEvent)
-                return;
-            this.element.muted = this.muted.value;
-        };
-        this.register(this.muted, this._updateMute);
-        nextUserEvent(mgr).then(() => {
-            this._hadUserEvent = true;
-            this._updateMute();
-        });
-        if (!isDesignTime(this.contextManager) && props.autoplay)
-            started(mgr).then(() => this.play());
-        elm.load();
-    }
-    /** @zprop */
-    play(opts) {
-        this.element.playbackRate = opts?.speed ?? 1;
-        this.element.play();
-    }
-    /** @zprop */
-    pause() {
-        this.element.pause();
-    }
-    /** @zprop */
-    stop() {
-        this.element.pause();
-        this.element.currentTime = 0;
-    }
-    /** @zprop */
-    seek(t) {
-        this.element.currentTime = t / 1000;
-    }
-    length() {
-        return isNaN(this.element.duration) ? undefined : this.element.duration * 1000;
-    }
-    dispose() {
-        this.element.pause();
-        this.element.src = '';
-        return super.dispose();
-    }
-}