@nuralyui/video 0.0.5 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/video.component.d.ts +1 -1
- package/video.component.js +1 -1
- package/video.component.js.map +1 -1
package/package.json
CHANGED
package/video.component.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { LitElement } from "lit";
|
|
2
2
|
import { VideoPreload } from "./video.types.js";
|
|
3
|
-
declare const NrVideoElement_base: (new (...args: any[]) => import("
|
|
3
|
+
declare const NrVideoElement_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & typeof LitElement;
|
|
4
4
|
export declare class NrVideoElement extends NrVideoElement_base {
|
|
5
5
|
static styles: import("lit").CSSResult;
|
|
6
6
|
src: string;
|
package/video.component.js
CHANGED
|
@@ -8,7 +8,7 @@ import { html, LitElement } from "lit";
|
|
|
8
8
|
import { customElement, property, state } from "lit/decorators.js";
|
|
9
9
|
import { classMap } from "lit/directives/class-map.js";
|
|
10
10
|
import { styleMap } from "lit/directives/style-map.js";
|
|
11
|
-
import { NuralyUIBaseMixin } from
|
|
11
|
+
import { NuralyUIBaseMixin } from '@nuralyui/common/mixins';
|
|
12
12
|
import styles from "./video.style.js";
|
|
13
13
|
let NrVideoElement = class NrVideoElement extends NuralyUIBaseMixin(LitElement) {
|
|
14
14
|
constructor() {
|
package/video.component.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"video.component.js","sourceRoot":"","sources":["../../../src/components/video/video.component.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"video.component.js","sourceRoot":"","sources":["../../../src/components/video/video.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { styleMap } from \"lit/directives/style-map.js\";\nimport { NuralyUIBaseMixin } from '@nuralyui/common/mixins';\nimport styles from \"./video.style.js\";\nimport { VideoPreload } from \"./video.types.js\";\n\n@customElement('nr-video')\nexport class NrVideoElement extends NuralyUIBaseMixin(LitElement) {\n static override styles = styles;\n\n @property({ type: String })\n src!: string;\n\n @property({ type: String })\n poster?: string;\n\n @property({ type: String })\n width = 'auto';\n\n @property({ type: String })\n height = 'auto';\n\n @property({ type: Boolean })\n autoplay = false;\n\n @property({ type: Boolean })\n loop = false;\n\n @property({ type: Boolean })\n muted = false;\n\n @property({ type: Boolean })\n controls = true;\n\n @property({ type: String })\n preload: VideoPreload = VideoPreload.Metadata;\n\n @property({ type: Boolean })\n previewable = false;\n\n @property({ type: Boolean, reflect: true })\n block = false;\n\n @state()\n private showPreview = false;\n\n @state()\n private hasError = false;\n\n private readonly defaultFallback = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQwIiBoZWlnaHQ9IjE4MCIgdmlld0JveD0iMCAwIDI0MCAxODAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3Qgd2lkdGg9IjI0MCIgaGVpZ2h0PSIxODAiIGZpbGw9IiNGM0Y0RjYiLz48cGF0aCBkPSJNMTg4IDY5TDE2OCA4OU0xNjggNjlMMTg4IDg5IiBzdHJva2U9IiM5Q0EzQUYiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+PC9zdmc+';\n\n private handleError() {\n this.hasError = true;\n this.dispatchEvent(new CustomEvent('nr-video-error', {\n bubbles: true,\n composed: true,\n detail: { error: `Error loading video: ${this.src}`, src: this.src }\n }));\n }\n\n private handlePlay() {\n this.dispatchEvent(new CustomEvent('nr-video-play', {\n bubbles: true,\n composed: true,\n detail: { src: this.src }\n }));\n }\n\n private handlePause() {\n this.dispatchEvent(new CustomEvent('nr-video-pause', {\n bubbles: true,\n composed: true,\n detail: { src: this.src }\n }));\n }\n\n private handleEnded() {\n this.dispatchEvent(new CustomEvent('nr-video-ended', {\n bubbles: true,\n composed: true,\n detail: { src: this.src }\n }));\n }\n\n private showPreviewModal() {\n if (this.previewable && !this.hasError) {\n this.showPreview = true;\n this.dispatchEvent(new CustomEvent('nr-video-preview-open', {\n bubbles: true,\n composed: true,\n detail: { src: this.src }\n }));\n }\n }\n\n private closePreviewModal() {\n this.showPreview = false;\n this.dispatchEvent(new CustomEvent('nr-video-preview-close', {\n bubbles: true,\n composed: true,\n detail: { src: this.src }\n }));\n }\n\n override render() {\n const containerClasses = {\n 'video-container': true,\n 'video--error': this.hasError\n };\n\n const videoStyles: Record<string, string> = {\n width: typeof this.width === 'number' ? `${this.width}px` : this.width,\n height: typeof this.height === 'number' ? `${this.height}px` : this.height,\n };\n\n if (this.hasError) {\n return html`\n <div class=${classMap(containerClasses)}>\n <div class=\"error-message\">\n <img class=\"error-icon\" src=${this.defaultFallback} alt=\"Video error\" />\n <p>Unable to load video</p>\n </div>\n </div>\n `;\n }\n\n return html`\n <div class=${classMap(containerClasses)}>\n <video\n style=${styleMap(videoStyles)}\n ?autoplay=${this.autoplay}\n ?loop=${this.loop}\n ?muted=${this.muted}\n ?controls=${this.controls}\n preload=${this.preload}\n poster=${this.poster || ''}\n @error=${this.handleError}\n @play=${this.handlePlay}\n @pause=${this.handlePause}\n @ended=${this.handleEnded}\n >\n <source src=${this.src} />\n Your browser does not support the video tag.\n </video>\n ${this.previewable ? html`\n <button class=\"preview-button\" @click=${this.showPreviewModal}>\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"currentColor\">\n <path d=\"M5.5 5.5A.5.5 0 0 1 6 6v3a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v3a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v3a.5.5 0 0 0 1 0V6z\"/>\n <path d=\"M2 1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H2zM1 2a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2z\"/>\n </svg>\n Fullscreen\n </button>\n ` : ''}\n ${this.showPreview ? html`\n <div class=\"preview-modal\" @click=${this.closePreviewModal}>\n <button class=\"preview-close\" @click=${this.closePreviewModal} aria-label=\"Close preview\">×</button>\n <video\n ?autoplay=${true}\n ?loop=${this.loop}\n ?muted=${this.muted}\n controls\n poster=${this.poster || ''}\n >\n <source src=${this.src} />\n </video>\n </div>\n ` : ''}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nr-video': NrVideoElement;\n }\n}\n"]}
|