@kdcloudjs/shoelace 1.0.45 → 1.0.47

package/cdn/chunks/chunk.UZFGZGBZ.js

@@ -0,0 +1,26 @@
+import {
+  SlRadioGroup
+} from "./chunk.ORYDBUUV.js";
+
+// src/react/radio-group/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "sl-radio-group";
+SlRadioGroup.define("sl-radio-group");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: SlRadioGroup,
+  react: React,
+  events: {
+    onSlChange: "sl-change",
+    onSlInput: "sl-input",
+    onSlInvalid: "sl-invalid"
+  },
+  displayName: "SlRadioGroup"
+});
+var radio_group_default = reactWrapper;
+
+export {
+  radio_group_default
+};

package/cdn/chunks/chunk.V3UOOI3M.js

@@ -0,0 +1,120 @@
+import {
+  SlIcon
+} from "./chunk.MGETPUIX.js";
+import {
+  watch
+} from "./chunk.WID3TCT6.js";
+import {
+  component_styles_default
+} from "./chunk.N6N54SAA.js";
+import {
+  ShoelaceElement,
+  e,
+  n,
+  r
+} from "./chunk.KKR53ZFE.js";
+import {
+  animated_image_styles_default
+} from "./chunk.44LAWITI.js";
+import {
+  b
+} from "./chunk.OLIQR3OU.js";
+import {
+  __decorateClass
+} from "./chunk.CZCSAYQZ.js";
+
+// src/components/animated-image/animated-image.component.ts
+var SlAnimatedImage = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.isLoaded = false;
+  }
+  handleClick() {
+    this.play = !this.play;
+  }
+  handleLoad() {
+    const canvas = document.createElement("canvas");
+    const { width, height } = this.animatedImage;
+    canvas.width = width;
+    canvas.height = height;
+    canvas.getContext("2d").drawImage(this.animatedImage, 0, 0, width, height);
+    this.frozenFrame = canvas.toDataURL("image/gif");
+    if (!this.isLoaded) {
+      this.emit("sl-load");
+      this.isLoaded = true;
+    }
+  }
+  handleError() {
+    this.emit("sl-error");
+  }
+  handlePlayChange() {
+    if (this.play) {
+      this.animatedImage.src = "";
+      this.animatedImage.src = this.src;
+    }
+  }
+  handleSrcChange() {
+    this.isLoaded = false;
+  }
+  render() {
+    return b`
+      <div class="animated-image">
+        <img
+          class="animated-image__animated"
+          src=${this.src}
+          alt=${this.alt}
+          crossorigin="anonymous"
+          aria-hidden=${this.play ? "false" : "true"}
+          @click=${this.handleClick}
+          @load=${this.handleLoad}
+          @error=${this.handleError}
+        />
+
+        ${this.isLoaded ? b`
+              <img
+                class="animated-image__frozen"
+                src=${this.frozenFrame}
+                alt=${this.alt}
+                aria-hidden=${this.play ? "true" : "false"}
+                @click=${this.handleClick}
+              />
+
+              <div part="control-box" class="animated-image__control-box">
+                <slot name="play-icon"><sl-icon name="play-fill" library="system"></sl-icon></slot>
+                <slot name="pause-icon"><sl-icon name="pause-fill" library="system"></sl-icon></slot>
+              </div>
+            ` : ""}
+      </div>
+    `;
+  }
+};
+SlAnimatedImage.styles = [component_styles_default, animated_image_styles_default];
+SlAnimatedImage.dependencies = { "sl-icon": SlIcon };
+__decorateClass([
+  e(".animated-image__animated")
+], SlAnimatedImage.prototype, "animatedImage", 2);
+__decorateClass([
+  r()
+], SlAnimatedImage.prototype, "frozenFrame", 2);
+__decorateClass([
+  r()
+], SlAnimatedImage.prototype, "isLoaded", 2);
+__decorateClass([
+  n()
+], SlAnimatedImage.prototype, "src", 2);
+__decorateClass([
+  n()
+], SlAnimatedImage.prototype, "alt", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], SlAnimatedImage.prototype, "play", 2);
+__decorateClass([
+  watch("play", { waitUntilFirstUpdate: true })
+], SlAnimatedImage.prototype, "handlePlayChange", 1);
+__decorateClass([
+  watch("src")
+], SlAnimatedImage.prototype, "handleSrcChange", 1);
+
+export {
+  SlAnimatedImage
+};