@kdcloudjs/shoelace 1.0.41 → 1.0.43

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

@@ -0,0 +1,500 @@
+import {
+  notification_styles_default
+} from "./chunk.OJVEGSQB.js";
+import {
+  blurActiveElement
+} from "./chunk.LD4M4QGE.js";
+import {
+  getAnimation,
+  setDefaultAnimation
+} from "./chunk.KSB7EI3T.js";
+import {
+  waitForEvent
+} from "./chunk.B4BZKR24.js";
+import {
+  animateTo,
+  stopAnimations
+} from "./chunk.RC46L6CZ.js";
+import {
+  SlIconButton
+} from "./chunk.PYMSBUJH.js";
+import {
+  HasSlotController
+} from "./chunk.NYIIDP5N.js";
+import {
+  e
+} from "./chunk.ZLKEMKLZ.js";
+import {
+  LocalizeController
+} from "./chunk.2SU6QBUU.js";
+import {
+  SlIcon
+} from "./chunk.KW4OXJS2.js";
+import {
+  watch
+} from "./chunk.WID3TCT6.js";
+import {
+  component_styles_default
+} from "./chunk.WT5BNBAS.js";
+import {
+  ShoelaceElement,
+  e as e2,
+  n,
+  r
+} from "./chunk.QUQH2EBA.js";
+import {
+  b
+} from "./chunk.7Z2GKZ7U.js";
+import {
+  __decorateClass,
+  __spreadProps,
+  __spreadValues
+} from "./chunk.CZCSAYQZ.js";
+
+// src/components/notification/notification.component.ts
+var _SlNotification = class _SlNotification extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.hasSlotController = new HasSlotController(this, "icon", "title", "actions");
+    this.localize = new LocalizeController(this);
+    this.open = false;
+    this.closable = true;
+    this._closeIcon = void 0;
+    this.type = "info";
+    this._duration = 4500;
+    this.placement = "topRight";
+    this.showProgress = false;
+    this.pauseOnHover = true;
+    this.remainingTime = 0;
+    this.totalDuration = 0;
+  }
+  get closeIcon() {
+    return this._closeIcon;
+  }
+  set closeIcon(value) {
+    const oldValue = this._closeIcon;
+    if (value === null || value === false || value === "null" || value === "false") {
+      this._closeIcon = value === "null" ? null : value === "false" ? false : value;
+    } else {
+      this._closeIcon = value;
+    }
+    this.requestUpdate("closeIcon", oldValue);
+  }
+  get duration() {
+    return this._duration;
+  }
+  set duration(value) {
+    const oldValue = this._duration;
+    if (value === false || value === "false" || value === 0 || value === "0") {
+      this._duration = false;
+    } else {
+      this._duration = typeof value === "string" ? parseInt(value, 10) : value;
+    }
+    this.requestUpdate("duration", oldValue);
+  }
+  /** Open a notification with the given configuration. */
+  static open(config) {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const notification = document.createElement("sl-notification");
+    const mergedConfig = __spreadValues(__spreadValues({}, _SlNotification.globalConfig), config);
+    notification.type = mergedConfig.type || "info";
+    notification.duration = (_b = (_a = mergedConfig.duration) != null ? _a : _SlNotification.globalConfig.duration) != null ? _b : 4500;
+    notification.closable = (_c = mergedConfig.closable) != null ? _c : true;
+    notification.placement = mergedConfig.placement || _SlNotification.globalConfig.placement || "topRight";
+    notification.showProgress = (_e = (_d = mergedConfig.showProgress) != null ? _d : _SlNotification.globalConfig.showProgress) != null ? _e : false;
+    notification.pauseOnHover = (_g = (_f = mergedConfig.pauseOnHover) != null ? _f : _SlNotification.globalConfig.pauseOnHover) != null ? _g : true;
+    notification.key = mergedConfig.key;
+    if (mergedConfig.closeIcon !== void 0) {
+      notification.closeIcon = mergedConfig.closeIcon;
+    } else if (_SlNotification.globalConfig.closeIcon !== void 0) {
+      notification.closeIcon = _SlNotification.globalConfig.closeIcon;
+    }
+    if (mergedConfig.onClose) {
+      notification.addEventListener("sl-after-hide", mergedConfig.onClose, { once: true });
+    }
+    if (mergedConfig.onClick) {
+      notification.addEventListener("click", mergedConfig.onClick);
+    }
+    if (mergedConfig.title) {
+      if (typeof mergedConfig.title === "string") {
+        const titleEl = document.createElement("span");
+        titleEl.slot = "title";
+        titleEl.textContent = mergedConfig.title;
+        notification.appendChild(titleEl);
+      }
+    }
+    if (mergedConfig.description) {
+      if (typeof mergedConfig.description === "string") {
+        const descEl = document.createElement("span");
+        descEl.textContent = mergedConfig.description;
+        notification.appendChild(descEl);
+      }
+    }
+    if (mergedConfig.icon) {
+      if (typeof mergedConfig.icon === "string") {
+        const iconEl = document.createElement("sl-icon");
+        iconEl.slot = "icon";
+        iconEl.setAttribute("name", mergedConfig.icon);
+        notification.appendChild(iconEl);
+      }
+    }
+    requestAnimationFrame(() => {
+      notification.show();
+    });
+    return notification;
+  }
+  /** Shorthand for opening a success notification. */
+  static success(config) {
+    const cfg = typeof config === "string" ? { description: config } : config;
+    return _SlNotification.open(__spreadProps(__spreadValues({}, cfg), { type: "success" }));
+  }
+  /** Shorthand for opening an info notification. */
+  static info(config) {
+    const cfg = typeof config === "string" ? { description: config } : config;
+    return _SlNotification.open(__spreadProps(__spreadValues({}, cfg), { type: "info" }));
+  }
+  /** Shorthand for opening a warning notification. */
+  static warning(config) {
+    const cfg = typeof config === "string" ? { description: config } : config;
+    return _SlNotification.open(__spreadProps(__spreadValues({}, cfg), { type: "warning" }));
+  }
+  /** Shorthand for opening an error notification. */
+  static error(config) {
+    const cfg = typeof config === "string" ? { description: config } : config;
+    return _SlNotification.open(__spreadProps(__spreadValues({}, cfg), { type: "error" }));
+  }
+  /** Destroy a notification by key. */
+  static destroy(key) {
+    if (key === void 0) {
+      _SlNotification.activeNotifications.forEach((list) => {
+        list.forEach((n2) => n2.hide());
+      });
+    } else {
+      _SlNotification.activeNotifications.forEach((list) => {
+        const notification = list.find((n2) => n2.key === key);
+        notification == null ? void 0 : notification.hide();
+      });
+    }
+  }
+  /** Update container positions when global config changes. */
+  static updateContainerPositions() {
+    const { top, bottom } = _SlNotification.globalConfig;
+    _SlNotification.containers.forEach((container, placement) => {
+      if (placement.includes("top")) {
+        container.style.top = `${top}px`;
+        container.style.bottom = "";
+      } else {
+        container.style.bottom = `${bottom}px`;
+        container.style.top = "";
+      }
+    });
+  }
+  /** Configure global notification settings. */
+  static config(config) {
+    const oldTop = _SlNotification.globalConfig.top;
+    const oldBottom = _SlNotification.globalConfig.bottom;
+    _SlNotification.globalConfig = __spreadValues(__spreadValues({}, _SlNotification.globalConfig), config);
+    if (config.top !== void 0 && config.top !== oldTop || config.bottom !== void 0 && config.bottom !== oldBottom) {
+      _SlNotification.updateContainerPositions();
+    }
+  }
+  static getContainer(placement) {
+    let container = _SlNotification.containers.get(placement);
+    if (!container) {
+      container = document.createElement("div");
+      container.className = `sl-notification-container sl-notification-container--${placement}`;
+      const { top, bottom } = _SlNotification.globalConfig;
+      const styles = {
+        position: "fixed",
+        zIndex: "9999",
+        display: "flex",
+        flexDirection: "column",
+        gap: "16px",
+        pointerEvents: "none"
+      };
+      if (placement.includes("top")) {
+        styles.top = `${top}px`;
+      } else {
+        styles.bottom = `${bottom}px`;
+        styles.flexDirection = "column-reverse";
+      }
+      if (placement.includes("Left")) {
+        styles.left = "24px";
+      } else if (placement.includes("Right")) {
+        styles.right = "24px";
+      } else {
+        styles.left = "50%";
+        styles.transform = "translateX(-50%)";
+      }
+      Object.assign(container.style, styles);
+      document.body.appendChild(container);
+      _SlNotification.containers.set(placement, container);
+      _SlNotification.activeNotifications.set(placement, []);
+    }
+    return container;
+  }
+  firstUpdated() {
+    this.base.hidden = !this.open;
+  }
+  getDefaultIcon() {
+    const icons = {
+      success: "check2-circle",
+      info: "info-circle",
+      warning: "exclamation-triangle",
+      error: "exclamation-octagon"
+    };
+    return icons[this.type] || icons.info;
+  }
+  restartAutoHide() {
+    clearTimeout(this.autoHideTimeout);
+    clearInterval(this.remainingTimeInterval);
+    const durationValue = this._duration;
+    if (durationValue !== false && typeof durationValue === "number" && durationValue > 0) {
+      this.totalDuration = durationValue;
+      this.remainingTime = durationValue;
+      this.autoHideTimeout = window.setTimeout(() => {
+        void this.hide();
+      }, durationValue);
+      if (this.showProgress) {
+        this.remainingTimeInterval = window.setInterval(() => {
+          this.remainingTime = Math.max(0, this.remainingTime - 100);
+        }, 100);
+      }
+    }
+  }
+  pauseAutoHide() {
+    if (!this.pauseOnHover) return;
+    clearTimeout(this.autoHideTimeout);
+    clearInterval(this.remainingTimeInterval);
+  }
+  resumeAutoHide() {
+    if (!this.pauseOnHover) return;
+    const durationValue = this._duration;
+    if (durationValue !== false && typeof durationValue === "number" && durationValue > 0 && this.remainingTime > 0) {
+      this.autoHideTimeout = window.setTimeout(() => {
+        void this.hide();
+      }, this.remainingTime);
+      if (this.showProgress) {
+        this.remainingTimeInterval = window.setInterval(() => {
+          this.remainingTime = Math.max(0, this.remainingTime - 100);
+        }, 100);
+      }
+    }
+  }
+  handleCloseClick() {
+    this.hide();
+  }
+  async handleOpenChange() {
+    if (this.open) {
+      this.emit("sl-show");
+      this.restartAutoHide();
+      await stopAnimations(this.base);
+      this.base.hidden = false;
+      const { keyframes, options } = getAnimation(this, "notification.show", { dir: this.localize.dir() });
+      await animateTo(this.base, keyframes, options);
+      this.emit("sl-after-show");
+    } else {
+      blurActiveElement(this);
+      this.emit("sl-hide");
+      clearTimeout(this.autoHideTimeout);
+      clearInterval(this.remainingTimeInterval);
+      await stopAnimations(this.base);
+      const { keyframes, options } = getAnimation(this, "notification.hide", { dir: this.localize.dir() });
+      await animateTo(this.base, keyframes, options);
+      this.base.hidden = true;
+      this.emit("sl-after-hide");
+      const activeList = _SlNotification.activeNotifications.get(this.placement);
+      if (activeList) {
+        const index = activeList.indexOf(this);
+        if (index > -1) {
+          activeList.splice(index, 1);
+        }
+      }
+      this.remove();
+    }
+  }
+  /** Shows the notification. */
+  async show() {
+    if (this.open) {
+      return void 0;
+    }
+    const container = _SlNotification.getContainer(this.placement);
+    if (this.parentElement !== container) {
+      const maxCount = _SlNotification.globalConfig.maxCount;
+      if (maxCount !== void 0) {
+        const activeList2 = _SlNotification.activeNotifications.get(this.placement) || [];
+        while (activeList2.length >= maxCount && activeList2.length > 0) {
+          const oldest = activeList2.shift();
+          oldest == null ? void 0 : oldest.hide();
+        }
+      }
+      container.appendChild(this);
+      const activeList = _SlNotification.activeNotifications.get(this.placement) || [];
+      if (!activeList.includes(this)) {
+        activeList.push(this);
+        _SlNotification.activeNotifications.set(this.placement, activeList);
+      }
+    }
+    await this.updateComplete;
+    this.open = true;
+    return waitForEvent(this, "sl-after-show");
+  }
+  /** Hides the notification. */
+  async hide() {
+    if (!this.open) {
+      return void 0;
+    }
+    this.open = false;
+    return waitForEvent(this, "sl-after-hide");
+  }
+  getProgressWidth() {
+    if (!this.showProgress || this.totalDuration === 0) return "100%";
+    return `${this.remainingTime / this.totalDuration * 100}%`;
+  }
+  render() {
+    const hasIcon = this.hasSlotController.test("icon") || this.type;
+    const hasTitle = this.hasSlotController.test("title");
+    const hasActions = this.hasSlotController.test("actions");
+    return b`
+      <div
+        part="base"
+        class=${e({
+      notification: true,
+      "notification--open": this.open,
+      "notification--closable": this.closable,
+      "notification--has-icon": hasIcon,
+      "notification--has-title": hasTitle,
+      "notification--has-actions": hasActions,
+      "notification--success": this.type === "success",
+      "notification--info": this.type === "info",
+      "notification--warning": this.type === "warning",
+      "notification--error": this.type === "error"
+    })}
+        role="alert"
+        aria-live="assertive"
+        aria-atomic="true"
+        style="pointer-events: auto;"
+        @mouseenter=${this.pauseAutoHide}
+        @mouseleave=${this.resumeAutoHide}
+      >
+        <div part="icon" class="notification__icon">
+          <slot name="icon">
+            <sl-icon name=${this.getDefaultIcon()}></sl-icon>
+          </slot>
+        </div>
+
+        <div part="content" class="notification__content">
+          <div part="title" class="notification__title">
+            <slot name="title"></slot>
+          </div>
+          <div part="description" class="notification__description">
+            <slot></slot>
+          </div>
+          ${hasActions ? b`
+                <div part="actions" class="notification__actions">
+                  <slot name="actions"></slot>
+                </div>
+              ` : ""}
+        </div>
+
+        ${this.closable && this._closeIcon !== null && this._closeIcon !== false ? b`
+              <sl-icon-button
+                part="close-button"
+                class="notification__close-button"
+                name=${typeof this._closeIcon === "string" && this._closeIcon ? this._closeIcon : "x-lg"}
+                library=${typeof this._closeIcon === "string" && this._closeIcon ? "default" : "system"}
+                label=${this.localize.term("close")}
+                @click=${this.handleCloseClick}
+              ></sl-icon-button>
+            ` : ""}
+
+        ${this.showProgress && this._duration !== false ? b`
+              <div part="progress" class="notification__progress">
+                <div
+                  part="progress-bar"
+                  class="notification__progress-bar"
+                  style="width: ${this.getProgressWidth()}"
+                ></div>
+              </div>
+            ` : ""}
+      </div>
+    `;
+  }
+};
+_SlNotification.styles = [component_styles_default, notification_styles_default];
+_SlNotification.dependencies = { "sl-icon": SlIcon, "sl-icon-button": SlIconButton };
+// Global configuration
+_SlNotification.globalConfig = {
+  placement: "topRight",
+  duration: 4500,
+  maxCount: void 0,
+  top: 24,
+  bottom: 24,
+  showProgress: false,
+  pauseOnHover: true
+};
+// Notification containers for different placements
+_SlNotification.containers = /* @__PURE__ */ new Map();
+// Active notifications tracking
+_SlNotification.activeNotifications = /* @__PURE__ */ new Map();
+__decorateClass([
+  e2('[part~="base"]')
+], _SlNotification.prototype, "base", 2);
+__decorateClass([
+  e2(".notification__progress-bar")
+], _SlNotification.prototype, "progressBar", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], _SlNotification.prototype, "open", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], _SlNotification.prototype, "closable", 2);
+__decorateClass([
+  n({ attribute: "close-icon" })
+], _SlNotification.prototype, "closeIcon", 1);
+__decorateClass([
+  n({ reflect: true })
+], _SlNotification.prototype, "type", 2);
+__decorateClass([
+  n({ attribute: "duration" })
+], _SlNotification.prototype, "duration", 1);
+__decorateClass([
+  n({ reflect: true })
+], _SlNotification.prototype, "placement", 2);
+__decorateClass([
+  n({ type: Boolean, attribute: "show-progress" })
+], _SlNotification.prototype, "showProgress", 2);
+__decorateClass([
+  n({ type: Boolean, attribute: "pause-on-hover" })
+], _SlNotification.prototype, "pauseOnHover", 2);
+__decorateClass([
+  n()
+], _SlNotification.prototype, "key", 2);
+__decorateClass([
+  r()
+], _SlNotification.prototype, "remainingTime", 2);
+__decorateClass([
+  r()
+], _SlNotification.prototype, "totalDuration", 2);
+__decorateClass([
+  watch("open", { waitUntilFirstUpdate: true })
+], _SlNotification.prototype, "handleOpenChange", 1);
+var SlNotification = _SlNotification;
+setDefaultAnimation("notification.show", {
+  keyframes: [
+    { opacity: 0, transform: "translateX(100%)" },
+    { opacity: 1, transform: "translateX(0)" }
+  ],
+  options: { duration: 250, easing: "ease-out" }
+});
+setDefaultAnimation("notification.hide", {
+  keyframes: [
+    { opacity: 1, transform: "translateX(0)" },
+    { opacity: 0, transform: "translateX(100%)" }
+  ],
+  options: { duration: 250, easing: "ease-in" }
+});
+
+export {
+  SlNotification
+};

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

@@ -0,0 +1,133 @@
+import {
+  SlMenu
+} from "./chunk.4JHNVBF4.js";
+import {
+  SlMenuItem
+} from "./chunk.6UKHXTZL.js";
+import {
+  SlDropdown
+} from "./chunk.XF5ZKEBA.js";
+import {
+  SlIcon
+} from "./chunk.KW4OXJS2.js";
+import {
+  ShoelaceElement,
+  n,
+  r,
+  t
+} from "./chunk.QUQH2EBA.js";
+import {
+  i
+} from "./chunk.VKO6US6U.js";
+import {
+  b
+} from "./chunk.7Z2GKZ7U.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.3IZ5JZ5A.js

@@ -0,0 +1,11 @@
+import {
+  SlBreadcrumbItem
+} from "./chunk.SJDZI7U6.js";
+
+// src/components/breadcrumb-item/breadcrumb-item.ts
+var breadcrumb_item_default = SlBreadcrumbItem;
+SlBreadcrumbItem.define("sl-breadcrumb-item");
+
+export {
+  breadcrumb_item_default
+};

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

@@ -0,0 +1,11 @@
+import {
+  SlCopyButton
+} from "./chunk.PKDJCEN7.js";
+
+// src/components/copy-button/copy-button.ts
+var copy_button_default = SlCopyButton;
+SlCopyButton.define("sl-copy-button");
+
+export {
+  copy_button_default
+};

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

@@ -0,0 +1,11 @@
+import {
+  SlOption
+} from "./chunk.V7AQHWXZ.js";
+
+// src/components/option/option.ts
+var option_default = SlOption;
+SlOption.define("sl-option");
+
+export {
+  option_default
+};