@kdcloudjs/shoelace 1.0.32 → 1.0.34

package/dist/chunks/chunk.UUNSAJ75.js

@@ -0,0 +1,45 @@
+// src/components/space/space.styles.ts
+import { css } from "lit";
+var space_styles_default = css`
+  :host {
+    display: inline-block;
+  }
+
+  .space {
+    display: inline-flex;
+    gap: var(--gap, var(--sl-spacing-small));
+  }
+
+  .space--horizontal {
+    flex-direction: row;
+    align-items: center;
+  }
+
+  .space--vertical {
+    flex-direction: column;
+  }
+
+  .space--wrap {
+    flex-wrap: wrap;
+  }
+
+  .space--align-start {
+    align-items: flex-start;
+  }
+
+  .space--align-end {
+    align-items: flex-end;
+  }
+
+  .space--align-center {
+    align-items: center;
+  }
+
+  .space--align-baseline {
+    align-items: baseline;
+  }
+`;
+
+export {
+  space_styles_default
+};

package/dist/chunks/chunk.UYXN5UT2.js

@@ -0,0 +1,11 @@
+import {
+  SlThoughtChainItem
+} from "./chunk.G7I6RNZ3.js";
+
+// src/components/thought-chain-item/thought-chain-item.ts
+var thought_chain_item_default = SlThoughtChainItem;
+SlThoughtChainItem.define("sl-thought-chain-item");
+
+export {
+  thought_chain_item_default
+};

package/dist/chunks/chunk.VBBO6NB7.js

@@ -0,0 +1,151 @@
+import {
+  image_comparer_styles_default
+} from "./chunk.RCGFCKTU.js";
+import {
+  drag
+} from "./chunk.ESELY2US.js";
+import {
+  clamp
+} from "./chunk.HF7GESMZ.js";
+import {
+  LocalizeController
+} from "./chunk.6CTB5ZDJ.js";
+import {
+  SlIcon
+} from "./chunk.4HMJR4HD.js";
+import {
+  watch
+} from "./chunk.55S3OOTM.js";
+import {
+  component_styles_default
+} from "./chunk.TUVJKY7S.js";
+import {
+  ShoelaceElement
+} from "./chunk.IAKFV7KT.js";
+import {
+  __decorateClass
+} from "./chunk.W5KB6T3Z.js";
+
+// src/components/image-comparer/image-comparer.component.ts
+import { classMap } from "lit/directives/class-map.js";
+import { html } from "lit";
+import { property, query } from "lit/decorators.js";
+import { styleMap } from "lit/directives/style-map.js";
+var SlImageComparer = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.localize = new LocalizeController(this);
+    this.position = 50;
+  }
+  handleDrag(event) {
+    const { width } = this.base.getBoundingClientRect();
+    const isRtl = this.localize.dir() === "rtl";
+    event.preventDefault();
+    drag(this.base, {
+      onMove: (x) => {
+        this.position = parseFloat(clamp(x / width * 100, 0, 100).toFixed(2));
+        if (isRtl) this.position = 100 - this.position;
+      },
+      initialEvent: event
+    });
+  }
+  handleKeyDown(event) {
+    const isLtr = this.localize.dir() === "ltr";
+    const isRtl = this.localize.dir() === "rtl";
+    if (["ArrowLeft", "ArrowRight", "Home", "End"].includes(event.key)) {
+      const incr = event.shiftKey ? 10 : 1;
+      let newPosition = this.position;
+      event.preventDefault();
+      if (isLtr && event.key === "ArrowLeft" || isRtl && event.key === "ArrowRight") {
+        newPosition -= incr;
+      }
+      if (isLtr && event.key === "ArrowRight" || isRtl && event.key === "ArrowLeft") {
+        newPosition += incr;
+      }
+      if (event.key === "Home") {
+        newPosition = 0;
+      }
+      if (event.key === "End") {
+        newPosition = 100;
+      }
+      newPosition = clamp(newPosition, 0, 100);
+      this.position = newPosition;
+    }
+  }
+  handlePositionChange() {
+    this.emit("sl-change");
+  }
+  render() {
+    const isRtl = this.localize.dir() === "rtl";
+    return html`
+      <div
+        part="base"
+        id="image-comparer"
+        class=${classMap({
+      "image-comparer": true,
+      "image-comparer--rtl": isRtl
+    })}
+        @keydown=${this.handleKeyDown}
+      >
+        <div class="image-comparer__image">
+          <div part="before" class="image-comparer__before">
+            <slot name="before"></slot>
+          </div>
+
+          <div
+            part="after"
+            class="image-comparer__after"
+            style=${styleMap({
+      clipPath: isRtl ? `inset(0 0 0 ${100 - this.position}%)` : `inset(0 ${100 - this.position}% 0 0)`
+    })}
+          >
+            <slot name="after"></slot>
+          </div>
+        </div>
+
+        <div
+          part="divider"
+          class="image-comparer__divider"
+          style=${styleMap({
+      left: isRtl ? `${100 - this.position}%` : `${this.position}%`
+    })}
+          @mousedown=${this.handleDrag}
+          @touchstart=${this.handleDrag}
+        >
+          <div
+            part="handle"
+            class="image-comparer__handle"
+            role="scrollbar"
+            aria-valuenow=${this.position}
+            aria-valuemin="0"
+            aria-valuemax="100"
+            aria-controls="image-comparer"
+            tabindex="0"
+          >
+            <slot name="handle">
+              <sl-icon library="system" name="grip-vertical"></sl-icon>
+            </slot>
+          </div>
+        </div>
+      </div>
+    `;
+  }
+};
+SlImageComparer.styles = [component_styles_default, image_comparer_styles_default];
+SlImageComparer.scopedElement = { "sl-icon": SlIcon };
+__decorateClass([
+  query(".image-comparer")
+], SlImageComparer.prototype, "base", 2);
+__decorateClass([
+  query(".image-comparer__handle")
+], SlImageComparer.prototype, "handle", 2);
+__decorateClass([
+  property({ type: Number, reflect: true })
+], SlImageComparer.prototype, "position", 2);
+__decorateClass([
+  watch("position", { waitUntilFirstUpdate: true })
+], SlImageComparer.prototype, "handlePositionChange", 1);
+
+export {
+  SlImageComparer
+};

package/dist/chunks/chunk.VE3NTK6V.js

@@ -0,0 +1,213 @@
+import {
+  animation_styles_default
+} from "./chunk.XVVDUPMB.js";
+import {
+  animations
+} from "./chunk.TJOP7HQP.js";
+import {
+  watch
+} from "./chunk.55S3OOTM.js";
+import {
+  component_styles_default
+} from "./chunk.TUVJKY7S.js";
+import {
+  ShoelaceElement
+} from "./chunk.IAKFV7KT.js";
+import {
+  __decorateClass
+} from "./chunk.W5KB6T3Z.js";
+
+// src/components/animation/animation.component.ts
+import { html } from "lit";
+import { property, queryAsync } from "lit/decorators.js";
+var SlAnimation = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.hasStarted = false;
+    this.name = "none";
+    this.play = false;
+    this.delay = 0;
+    this.direction = "normal";
+    this.duration = 1e3;
+    this.easing = "linear";
+    this.endDelay = 0;
+    this.fill = "auto";
+    this.iterations = Infinity;
+    this.iterationStart = 0;
+    this.playbackRate = 1;
+    this.handleAnimationFinish = () => {
+      this.play = false;
+      this.hasStarted = false;
+      this.emit("sl-finish");
+    };
+    this.handleAnimationCancel = () => {
+      this.play = false;
+      this.hasStarted = false;
+      this.emit("sl-cancel");
+    };
+  }
+  /** Gets and sets the current animation time. */
+  get currentTime() {
+    var _a, _b;
+    return (_b = (_a = this.animation) == null ? void 0 : _a.currentTime) != null ? _b : 0;
+  }
+  set currentTime(time) {
+    if (this.animation) {
+      this.animation.currentTime = time;
+    }
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.createAnimation();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.destroyAnimation();
+  }
+  handleSlotChange() {
+    this.destroyAnimation();
+    this.createAnimation();
+  }
+  async createAnimation() {
+    var _a, _b;
+    const easing = (_a = animations.easings[this.easing]) != null ? _a : this.easing;
+    const keyframes = (_b = this.keyframes) != null ? _b : animations[this.name];
+    const slot = await this.defaultSlot;
+    const element = slot.assignedElements()[0];
+    if (!element || !keyframes) {
+      return false;
+    }
+    this.destroyAnimation();
+    this.animation = element.animate(keyframes, {
+      delay: this.delay,
+      direction: this.direction,
+      duration: this.duration,
+      easing,
+      endDelay: this.endDelay,
+      fill: this.fill,
+      iterationStart: this.iterationStart,
+      iterations: this.iterations
+    });
+    this.animation.playbackRate = this.playbackRate;
+    this.animation.addEventListener("cancel", this.handleAnimationCancel);
+    this.animation.addEventListener("finish", this.handleAnimationFinish);
+    if (this.play) {
+      this.hasStarted = true;
+      this.emit("sl-start");
+    } else {
+      this.animation.pause();
+    }
+    return true;
+  }
+  destroyAnimation() {
+    if (this.animation) {
+      this.animation.cancel();
+      this.animation.removeEventListener("cancel", this.handleAnimationCancel);
+      this.animation.removeEventListener("finish", this.handleAnimationFinish);
+      this.hasStarted = false;
+    }
+  }
+  handleAnimationChange() {
+    if (!this.hasUpdated) {
+      return;
+    }
+    this.createAnimation();
+  }
+  handlePlayChange() {
+    if (this.animation) {
+      if (this.play && !this.hasStarted) {
+        this.hasStarted = true;
+        this.emit("sl-start");
+      }
+      if (this.play) {
+        this.animation.play();
+      } else {
+        this.animation.pause();
+      }
+      return true;
+    }
+    return false;
+  }
+  handlePlaybackRateChange() {
+    if (this.animation) {
+      this.animation.playbackRate = this.playbackRate;
+    }
+  }
+  /** Clears all keyframe effects caused by this animation and aborts its playback. */
+  cancel() {
+    var _a;
+    (_a = this.animation) == null ? void 0 : _a.cancel();
+  }
+  /** Sets the playback time to the end of the animation corresponding to the current playback direction. */
+  finish() {
+    var _a;
+    (_a = this.animation) == null ? void 0 : _a.finish();
+  }
+  render() {
+    return html` <slot @slotchange=${this.handleSlotChange}></slot> `;
+  }
+};
+SlAnimation.styles = [component_styles_default, animation_styles_default];
+__decorateClass([
+  queryAsync("slot")
+], SlAnimation.prototype, "defaultSlot", 2);
+__decorateClass([
+  property()
+], SlAnimation.prototype, "name", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], SlAnimation.prototype, "play", 2);
+__decorateClass([
+  property({ type: Number })
+], SlAnimation.prototype, "delay", 2);
+__decorateClass([
+  property()
+], SlAnimation.prototype, "direction", 2);
+__decorateClass([
+  property({ type: Number })
+], SlAnimation.prototype, "duration", 2);
+__decorateClass([
+  property()
+], SlAnimation.prototype, "easing", 2);
+__decorateClass([
+  property({ attribute: "end-delay", type: Number })
+], SlAnimation.prototype, "endDelay", 2);
+__decorateClass([
+  property()
+], SlAnimation.prototype, "fill", 2);
+__decorateClass([
+  property({ type: Number })
+], SlAnimation.prototype, "iterations", 2);
+__decorateClass([
+  property({ attribute: "iteration-start", type: Number })
+], SlAnimation.prototype, "iterationStart", 2);
+__decorateClass([
+  property({ attribute: false })
+], SlAnimation.prototype, "keyframes", 2);
+__decorateClass([
+  property({ attribute: "playback-rate", type: Number })
+], SlAnimation.prototype, "playbackRate", 2);
+__decorateClass([
+  watch([
+    "name",
+    "delay",
+    "direction",
+    "duration",
+    "easing",
+    "endDelay",
+    "fill",
+    "iterations",
+    "iterationsStart",
+    "keyframes"
+  ])
+], SlAnimation.prototype, "handleAnimationChange", 1);
+__decorateClass([
+  watch("play")
+], SlAnimation.prototype, "handlePlayChange", 1);
+__decorateClass([
+  watch("playbackRate")
+], SlAnimation.prototype, "handlePlaybackRateChange", 1);
+
+export {
+  SlAnimation
+};

package/dist/chunks/chunk.VP6PXFTQ.js

@@ -0,0 +1,25 @@
+import {
+  SlFloatButtonGroup
+} from "./chunk.676ZT5MF.js";
+
+// src/react/float-button-group/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "sl-float-button-group";
+SlFloatButtonGroup.define("sl-float-button-group");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: SlFloatButtonGroup,
+  react: React,
+  events: {
+    onSlShow: "sl-show",
+    onSlHide: "sl-hide"
+  },
+  displayName: "SlFloatButtonGroup"
+});
+var float_button_group_default = reactWrapper;
+
+export {
+  float_button_group_default
+};