@kdcloudjs/shoelace 1.0.13 → 1.0.15

package/cdn/chunks/chunk.3D2AQXDU.js

@@ -0,0 +1,186 @@
+import {
+  l
+} from "./chunk.AZSL5MFU.js";
+import {
+  getIconLibrary,
+  unwatchIcon,
+  watchIcon
+} from "./chunk.ZL53POKZ.js";
+import {
+  icon_styles_default
+} from "./chunk.JY6CSNX6.js";
+import {
+  watch
+} from "./chunk.WID3TCT6.js";
+import {
+  component_styles_default
+} from "./chunk.NDXSHFSW.js";
+import {
+  ShoelaceElement,
+  n,
+  r
+} from "./chunk.VO2B3WZX.js";
+import {
+  b
+} from "./chunk.7WSF3BCU.js";
+import {
+  __decorateClass
+} from "./chunk.CZCSAYQZ.js";
+
+// src/components/icon/icon.component.ts
+var CACHEABLE_ERROR = Symbol();
+var RETRYABLE_ERROR = Symbol();
+var parser;
+var iconCache = /* @__PURE__ */ new Map();
+var SlIcon = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.initialRender = false;
+    this.svg = null;
+    this.label = "";
+    this.library = "default";
+  }
+  /** Given a URL, this function returns the resulting SVG element or an appropriate error symbol. */
+  async resolveIcon(url, library) {
+    var _a;
+    let fileData;
+    if (library == null ? void 0 : library.spriteSheet) {
+      this.svg = b`<svg part="svg">
+        <use part="use" href="${url}"></use>
+      </svg>`;
+      return this.svg;
+    }
+    try {
+      fileData = await fetch(url, { mode: "cors" });
+      if (!fileData.ok) return fileData.status === 410 ? CACHEABLE_ERROR : RETRYABLE_ERROR;
+    } catch (e) {
+      return RETRYABLE_ERROR;
+    }
+    try {
+      const div = document.createElement("div");
+      div.innerHTML = await fileData.text();
+      const svg = div.firstElementChild;
+      if (((_a = svg == null ? void 0 : svg.tagName) == null ? void 0 : _a.toLowerCase()) !== "svg") return CACHEABLE_ERROR;
+      if (!parser) parser = new DOMParser();
+      const doc = parser.parseFromString(svg.outerHTML, "text/html");
+      const svgEl = doc.body.querySelector("svg");
+      if (!svgEl) return CACHEABLE_ERROR;
+      svgEl.part.add("svg");
+      return document.adoptNode(svgEl);
+    } catch (e) {
+      return CACHEABLE_ERROR;
+    }
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    watchIcon(this);
+  }
+  firstUpdated() {
+    this.initialRender = true;
+    this.setIcon();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    unwatchIcon(this);
+  }
+  getIconSource() {
+    const library = getIconLibrary(this.library);
+    if (this.name && library) {
+      return {
+        url: library.resolver(this.name),
+        fromLibrary: true
+      };
+    }
+    return {
+      url: this.src,
+      fromLibrary: false
+    };
+  }
+  handleLabelChange() {
+    const hasLabel = typeof this.label === "string" && this.label.length > 0;
+    if (hasLabel) {
+      this.setAttribute("role", "img");
+      this.setAttribute("aria-label", this.label);
+      this.removeAttribute("aria-hidden");
+    } else {
+      this.removeAttribute("role");
+      this.removeAttribute("aria-label");
+      this.setAttribute("aria-hidden", "true");
+    }
+  }
+  async setIcon() {
+    var _a;
+    const { url, fromLibrary } = this.getIconSource();
+    const library = fromLibrary ? getIconLibrary(this.library) : void 0;
+    if (!url) {
+      this.svg = null;
+      return;
+    }
+    let iconResolver = iconCache.get(url);
+    if (!iconResolver) {
+      iconResolver = this.resolveIcon(url, library);
+      iconCache.set(url, iconResolver);
+    }
+    if (!this.initialRender) {
+      return;
+    }
+    const svg = await iconResolver;
+    if (svg === RETRYABLE_ERROR) {
+      iconCache.delete(url);
+    }
+    if (url !== this.getIconSource().url) {
+      return;
+    }
+    if (l(svg)) {
+      this.svg = svg;
+      if (library) {
+        await this.updateComplete;
+        const shadowSVG = this.shadowRoot.querySelector("[part='svg']");
+        if (typeof library.mutator === "function" && shadowSVG) {
+          library.mutator(shadowSVG);
+        }
+      }
+      return;
+    }
+    switch (svg) {
+      case RETRYABLE_ERROR:
+      case CACHEABLE_ERROR:
+        this.svg = null;
+        this.emit("sl-error");
+        break;
+      default:
+        this.svg = svg.cloneNode(true);
+        (_a = library == null ? void 0 : library.mutator) == null ? void 0 : _a.call(library, this.svg);
+        this.emit("sl-load");
+    }
+  }
+  render() {
+    return this.svg;
+  }
+};
+SlIcon.styles = [component_styles_default, icon_styles_default];
+__decorateClass([
+  r()
+], SlIcon.prototype, "svg", 2);
+__decorateClass([
+  n({ reflect: true })
+], SlIcon.prototype, "name", 2);
+__decorateClass([
+  n()
+], SlIcon.prototype, "src", 2);
+__decorateClass([
+  n()
+], SlIcon.prototype, "label", 2);
+__decorateClass([
+  n({ reflect: true })
+], SlIcon.prototype, "library", 2);
+__decorateClass([
+  watch("label")
+], SlIcon.prototype, "handleLabelChange", 1);
+__decorateClass([
+  watch(["name", "src", "library"])
+], SlIcon.prototype, "setIcon", 1);
+
+export {
+  SlIcon
+};

package/cdn/chunks/chunk.3GGUIONV.js

@@ -0,0 +1,21 @@
+import {
+  SlSpinner
+} from "./chunk.NCDC3DMC.js";
+
+// src/react/spinner/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+var tagName = "sl-spinner";
+SlSpinner.define("sl-spinner");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: SlSpinner,
+  react: React,
+  events: {},
+  displayName: "SlSpinner"
+});
+var spinner_default = reactWrapper;
+
+export {
+  spinner_default
+};

package/cdn/chunks/chunk.3GGVXIGR.js

@@ -0,0 +1,11 @@
+import {
+  SlAvatar
+} from "./chunk.OT3CHXEA.js";
+
+// src/components/avatar/avatar.ts
+var avatar_default = SlAvatar;
+SlAvatar.define("sl-avatar");
+
+export {
+  avatar_default
+};

package/cdn/chunks/chunk.3ILRPG2P.js

@@ -0,0 +1,11 @@
+import {
+  SlProgressBar
+} from "./chunk.VGGT6PAQ.js";
+
+// src/components/progress-bar/progress-bar.ts
+var progress_bar_default = SlProgressBar;
+SlProgressBar.define("sl-progress-bar");
+
+export {
+  progress_bar_default
+};

package/cdn/chunks/chunk.3MOTOFFL.js

@@ -0,0 +1,24 @@
+import {
+  SlMutationObserver
+} from "./chunk.AO2FHPGJ.js";
+
+// src/react/mutation-observer/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "sl-mutation-observer";
+SlMutationObserver.define("sl-mutation-observer");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: SlMutationObserver,
+  react: React,
+  events: {
+    onSlMutation: "sl-mutation"
+  },
+  displayName: "SlMutationObserver"
+});
+var mutation_observer_default = reactWrapper;
+
+export {
+  mutation_observer_default
+};

package/cdn/chunks/chunk.3PORTQUN.js

@@ -0,0 +1,11 @@
+import {
+  SlDetails
+} from "./chunk.OPELNYKF.js";
+
+// src/components/details/details.ts
+var details_default = SlDetails;
+SlDetails.define("sl-details");
+
+export {
+  details_default
+};

package/cdn/chunks/chunk.3UZBDEZJ.js

@@ -0,0 +1,48 @@
+import {
+  nav_group_styles_default
+} from "./chunk.K2XGWHFS.js";
+import {
+  component_styles_default
+} from "./chunk.NDXSHFSW.js";
+import {
+  ShoelaceElement,
+  n
+} from "./chunk.VO2B3WZX.js";
+import {
+  b
+} from "./chunk.7WSF3BCU.js";
+import {
+  __decorateClass
+} from "./chunk.CZCSAYQZ.js";
+
+// src/components/nav-group/nav-group.component.ts
+var SlNavGroup = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.active = false;
+    this.mode = "vertical";
+  }
+  render() {
+    return b`
+      <div part="base" class="nav-group">
+        <div part="title" class="nav-group__title">
+          <slot name="title"></slot>
+        </div>
+        <div part="body" class="nav-group__body">
+          <slot></slot>
+        </div>
+      </div>
+    `;
+  }
+};
+SlNavGroup.styles = [component_styles_default, nav_group_styles_default];
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], SlNavGroup.prototype, "active", 2);
+__decorateClass([
+  n({ reflect: true })
+], SlNavGroup.prototype, "mode", 2);
+
+export {
+  SlNavGroup
+};

package/cdn/chunks/chunk.42D77UP5.js

@@ -0,0 +1,131 @@
+import {
+  SlMenuItem
+} from "./chunk.HDTB24TW.js";
+import {
+  SlMenu
+} from "./chunk.N2F2KFO6.js";
+import {
+  SlDropdown
+} from "./chunk.EWIZXOIL.js";
+import {
+  SlIcon
+} from "./chunk.3D2AQXDU.js";
+import {
+  ShoelaceElement,
+  n,
+  r,
+  t
+} from "./chunk.VO2B3WZX.js";
+import {
+  b,
+  i
+} from "./chunk.7WSF3BCU.js";
+import {
+  __decorateClass
+} from "./chunk.CZCSAYQZ.js";
+
+// src/components/pagination/custom-select.ts
+var CustomSelect = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.options = [10, 20, 50, 100];
+    this.selected = 20;
+    this.disabled = false;
+    this.open = false;
+  }
+  selectItem(option) {
+    this.selected = option;
+    this.open = false;
+    this.dispatchEvent(
+      new CustomEvent("select-change", {
+        detail: option,
+        bubbles: true,
+        composed: true
+      })
+    );
+  }
+  render() {
+    return b`
+      <sl-dropdown
+        @sl-show=${() => this.open = true}
+        @sl-hide=${() => this.open = false}
+        ?disabled=${this.disabled}
+        placement="bottom-end"
+        hoist
+      >
+        <div class="select-box" slot="trigger">
+          ${this.selected}条/页
+          <sl-icon class="arrow" name="${this.open ? "chevron-up" : "chevron-down"}"></sl-icon>
+        </div>
+        <sl-menu>
+          ${this.options.map(
+      (option) => b`<sl-menu-item @click=${() => this.selectItem(option)} value=${option}>${option}条/页</sl-menu-item>`
+    )}
+        </sl-menu>
+      </sl-dropdown>
+    `;
+  }
+};
+CustomSelect.styles = i`
+    :host {
+      display: inline-block;
+      position: relative;
+      font-family: sans-serif;
+    }
+    .select-box {
+      padding: 2px;
+      border-radius: 4px;
+      position: relative;
+      display: flex;
+      align-items: center;
+      cursor: pointer;
+      color: var(--sl-pagination-page-size-color);
+      font-size: var(--sl-pagination-font-size);
+    }
+    .arrow {
+      margin-left: 2px;
+      &:hover {
+        color: #5582f3;
+      }
+    }
+    span.menu-item__check {
+      width: 0;
+    }
+    sl-menu-item::part(checked-icon) {
+      width: 8px;
+    }
+    sl-menu-item::part(base) {
+      color: var(--sl-pagination-page-size-color);
+      font-size: var(--sl-pagination-font-size);
+    }
+    sl-menu-item::part(base):focus-visible,
+    sl-menu-item::part(base):hover {
+      color: #5582f3;
+      background-color: #f5f7fa;
+    }
+  `;
+CustomSelect.dependencies = {
+  "sl-dropdown": SlDropdown,
+  "sl-menu": SlMenu,
+  "sl-menu-item": SlMenuItem,
+  "sl-icon": SlIcon
+};
+__decorateClass([
+  n({ type: Array })
+], CustomSelect.prototype, "options", 2);
+__decorateClass([
+  n({ type: Number })
+], CustomSelect.prototype, "selected", 2);
+__decorateClass([
+  n({ type: Boolean })
+], CustomSelect.prototype, "disabled", 2);
+__decorateClass([
+  r()
+], CustomSelect.prototype, "open", 2);
+CustomSelect = __decorateClass([
+  t("custom-select")
+], CustomSelect);
+
+export {
+  CustomSelect
+};

package/cdn/chunks/chunk.462YVPZD.js

@@ -0,0 +1,11 @@
+import {
+  SlSelect
+} from "./chunk.JBCINCDW.js";
+
+// src/components/select/select.ts
+var select_default = SlSelect;
+SlSelect.define("sl-select");
+
+export {
+  select_default
+};

package/cdn/chunks/chunk.46UMSVLZ.js

@@ -0,0 +1,11 @@
+import {
+  SlDialog
+} from "./chunk.F7AQJNWT.js";
+
+// src/components/dialog/dialog.ts
+var dialog_default = SlDialog;
+SlDialog.define("sl-dialog");
+
+export {
+  dialog_default
+};

package/cdn/chunks/chunk.4ID4ZSVR.js

@@ -0,0 +1,27 @@
+import {
+  SlNavSubmenu
+} from "./chunk.LNIZGYDX.js";
+
+// src/react/nav-submenu/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "sl-nav-submenu";
+SlNavSubmenu.define("sl-nav-submenu");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: SlNavSubmenu,
+  react: React,
+  events: {
+    onSlShow: "sl-show",
+    onSlAfterShow: "sl-after-show",
+    onSlHide: "sl-hide",
+    onSlAfterHide: "sl-after-hide"
+  },
+  displayName: "SlNavSubmenu"
+});
+var nav_submenu_default = reactWrapper;
+
+export {
+  nav_submenu_default
+};

package/cdn/chunks/chunk.4MYAAYP2.js

@@ -0,0 +1,27 @@
+import {
+  SlDatePanel
+} from "./chunk.G7AV4DMX.js";
+
+// src/react/date-panel/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "sl-date-panel";
+SlDatePanel.define("sl-date-panel");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: SlDatePanel,
+  react: React,
+  events: {
+    onSlCancel: "sl-cancel",
+    onSlClear: "sl-clear",
+    onSlConfirm: "sl-confirm",
+    onSlDateChange: "sl-date-change"
+  },
+  displayName: "SlDatePanel"
+});
+var date_panel_default = reactWrapper;
+
+export {
+  date_panel_default
+};

package/cdn/chunks/chunk.4SCZ242N.js

@@ -0,0 +1,11 @@
+import {
+  SlNav
+} from "./chunk.RBN5HKBH.js";
+
+// src/components/nav/nav.ts
+var nav_default = SlNav;
+SlNav.define("sl-nav");
+
+export {
+  nav_default
+};

package/cdn/chunks/chunk.4UZFL64W.js

@@ -0,0 +1,24 @@
+import {
+  SlImageComparer
+} from "./chunk.WCVUDAA6.js";
+
+// src/react/image-comparer/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "sl-image-comparer";
+SlImageComparer.define("sl-image-comparer");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: SlImageComparer,
+  react: React,
+  events: {
+    onSlChange: "sl-change"
+  },
+  displayName: "SlImageComparer"
+});
+var image_comparer_default = reactWrapper;
+
+export {
+  image_comparer_default
+};

package/cdn/chunks/chunk.566CHKF3.js

@@ -0,0 +1,25 @@
+import {
+  SlAnimatedImage
+} from "./chunk.7GEDXDOU.js";
+
+// src/react/animated-image/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "sl-animated-image";
+SlAnimatedImage.define("sl-animated-image");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: SlAnimatedImage,
+  react: React,
+  events: {
+    onSlLoad: "sl-load",
+    onSlError: "sl-error"
+  },
+  displayName: "SlAnimatedImage"
+});
+var animated_image_default = reactWrapper;
+
+export {
+  animated_image_default
+};

package/cdn/chunks/chunk.5CMCMWLN.js

@@ -0,0 +1,11 @@
+import {
+  SlButtonGroup
+} from "./chunk.OW6DUYGV.js";
+
+// src/components/button-group/button-group.ts
+var button_group_default = SlButtonGroup;
+SlButtonGroup.define("sl-button-group");
+
+export {
+  button_group_default
+};

package/cdn/chunks/chunk.5CRCDTZB.js

@@ -0,0 +1,24 @@
+import {
+  visually_hidden_styles_default
+} from "./chunk.LFCIQ62U.js";
+import {
+  component_styles_default
+} from "./chunk.NDXSHFSW.js";
+import {
+  ShoelaceElement
+} from "./chunk.VO2B3WZX.js";
+import {
+  b
+} from "./chunk.7WSF3BCU.js";
+
+// src/components/visually-hidden/visually-hidden.component.ts
+var SlVisuallyHidden = class extends ShoelaceElement {
+  render() {
+    return b` <slot></slot> `;
+  }
+};
+SlVisuallyHidden.styles = [component_styles_default, visually_hidden_styles_default];
+
+export {
+  SlVisuallyHidden
+};

package/cdn/chunks/chunk.5CVAATNR.js

@@ -0,0 +1,27 @@
+import {
+  carousel_item_styles_default
+} from "./chunk.FFVGCBGA.js";
+import {
+  component_styles_default
+} from "./chunk.NDXSHFSW.js";
+import {
+  ShoelaceElement
+} from "./chunk.VO2B3WZX.js";
+import {
+  b
+} from "./chunk.7WSF3BCU.js";
+
+// src/components/carousel-item/carousel-item.component.ts
+var SlCarouselItem = class extends ShoelaceElement {
+  connectedCallback() {
+    super.connectedCallback();
+  }
+  render() {
+    return b` <slot></slot> `;
+  }
+};
+SlCarouselItem.styles = [component_styles_default, carousel_item_styles_default];
+
+export {
+  SlCarouselItem
+};