@kdcloudjs/shoelace 1.0.43 → 1.0.45

package/cdn/chunks/chunk.P7VAWFLA.js

@@ -0,0 +1,153 @@
+import {
+  option_styles_default
+} from "./chunk.HG5KCGRG.js";
+import {
+  LocalizeController
+} from "./chunk.VBONVBBW.js";
+import {
+  SlIcon
+} from "./chunk.A3LXMVDY.js";
+import {
+  e
+} from "./chunk.2QDPYAHS.js";
+import {
+  watch
+} from "./chunk.WID3TCT6.js";
+import {
+  component_styles_default
+} from "./chunk.N6N54SAA.js";
+import {
+  ShoelaceElement,
+  e as e2,
+  n,
+  r
+} from "./chunk.ZYC5S7ZP.js";
+import {
+  b
+} from "./chunk.OLIQR3OU.js";
+import {
+  __decorateClass
+} from "./chunk.CZCSAYQZ.js";
+
+// src/components/option/option.component.ts
+var SlOption = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    // @ts-expect-error - Controller is currently unused
+    this.localize = new LocalizeController(this);
+    this.isInitialized = false;
+    this.current = false;
+    this.selected = false;
+    this.hasHover = false;
+    this.value = "";
+    this.disabled = false;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "option");
+    this.setAttribute("aria-selected", "false");
+  }
+  handleDefaultSlotChange() {
+    if (this.isInitialized) {
+      customElements.whenDefined("sl-select").then(() => {
+        const controller = this.closest("sl-select");
+        if (controller) {
+          controller.handleDefaultSlotChange();
+        }
+      });
+    } else {
+      this.isInitialized = true;
+    }
+  }
+  handleMouseEnter() {
+    this.hasHover = true;
+  }
+  handleMouseLeave() {
+    this.hasHover = false;
+  }
+  handleDisabledChange() {
+    this.setAttribute("aria-disabled", this.disabled ? "true" : "false");
+  }
+  handleSelectedChange() {
+    this.setAttribute("aria-selected", this.selected ? "true" : "false");
+  }
+  handleValueChange() {
+    if (typeof this.value !== "string") {
+      this.value = String(this.value);
+    }
+    if (this.value.includes(" ")) {
+      console.error(`Option values cannot include a space. All spaces have been replaced with underscores.`, this);
+      this.value = this.value.replace(/ /g, "_");
+    }
+  }
+  /** Returns a plain text label based on the option's content. */
+  getTextLabel() {
+    const nodes = this.childNodes;
+    let label = "";
+    [...nodes].forEach((node) => {
+      if (node.nodeType === Node.ELEMENT_NODE) {
+        if (!node.hasAttribute("slot")) {
+          label += node.textContent;
+        }
+      }
+      if (node.nodeType === Node.TEXT_NODE) {
+        label += node.textContent;
+      }
+    });
+    return label.trim();
+  }
+  render() {
+    return b`
+      <div
+        part="base"
+        class=${e({
+      option: true,
+      "option--current": this.current,
+      "option--disabled": this.disabled,
+      "option--selected": this.selected,
+      "option--hover": this.hasHover
+    })}
+        @mouseenter=${this.handleMouseEnter}
+        @mouseleave=${this.handleMouseLeave}
+      >
+        <sl-icon part="checked-icon" class="option__check" name="check" library="system" aria-hidden="true"></sl-icon>
+        <slot part="prefix" name="prefix" class="option__prefix"></slot>
+        <slot part="label" class="option__label" @slotchange=${this.handleDefaultSlotChange}></slot>
+        <slot part="suffix" name="suffix" class="option__suffix"></slot>
+      </div>
+    `;
+  }
+};
+SlOption.styles = [component_styles_default, option_styles_default];
+SlOption.dependencies = { "sl-icon": SlIcon };
+__decorateClass([
+  e2(".option__label")
+], SlOption.prototype, "defaultSlot", 2);
+__decorateClass([
+  r()
+], SlOption.prototype, "current", 2);
+__decorateClass([
+  r()
+], SlOption.prototype, "selected", 2);
+__decorateClass([
+  r()
+], SlOption.prototype, "hasHover", 2);
+__decorateClass([
+  n({ reflect: true })
+], SlOption.prototype, "value", 2);
+__decorateClass([
+  n({ type: Boolean, reflect: true })
+], SlOption.prototype, "disabled", 2);
+__decorateClass([
+  watch("disabled")
+], SlOption.prototype, "handleDisabledChange", 1);
+__decorateClass([
+  watch("selected")
+], SlOption.prototype, "handleSelectedChange", 1);
+__decorateClass([
+  watch("value")
+], SlOption.prototype, "handleValueChange", 1);
+
+export {
+  SlOption
+};

package/cdn/chunks/chunk.PF6RYS5J.js

@@ -0,0 +1,14 @@
+import {
+  i
+} from "./chunk.LXXLDXU7.js";
+
+// src/components/mutation-observer/mutation-observer.styles.ts
+var mutation_observer_styles_default = i`
+  :host {
+    display: contents;
+  }
+`;
+
+export {
+  mutation_observer_styles_default
+};

package/cdn/chunks/chunk.PHLMPS7Z.js

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

package/cdn/chunks/chunk.PL4KGADD.js

@@ -0,0 +1,133 @@
+import {
+  SlMenu
+} from "./chunk.QW3S7RGA.js";
+import {
+  SlMenuItem
+} from "./chunk.WT723SV4.js";
+import {
+  SlDropdown
+} from "./chunk.HEXIDJNP.js";
+import {
+  SlIcon
+} from "./chunk.A3LXMVDY.js";
+import {
+  ShoelaceElement,
+  n,
+  r,
+  t
+} from "./chunk.ZYC5S7ZP.js";
+import {
+  i
+} from "./chunk.LXXLDXU7.js";
+import {
+  b
+} from "./chunk.OLIQR3OU.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.PLM45NZD.js

@@ -0,0 +1,77 @@
+import {
+  include_styles_default
+} from "./chunk.36FIVL52.js";
+import {
+  requestInclude
+} from "./chunk.XNEONNEJ.js";
+import {
+  watch
+} from "./chunk.WID3TCT6.js";
+import {
+  component_styles_default
+} from "./chunk.N6N54SAA.js";
+import {
+  ShoelaceElement,
+  n
+} from "./chunk.ZYC5S7ZP.js";
+import {
+  b
+} from "./chunk.OLIQR3OU.js";
+import {
+  __decorateClass
+} from "./chunk.CZCSAYQZ.js";
+
+// src/components/include/include.component.ts
+var SlInclude = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.mode = "cors";
+    this.allowScripts = false;
+  }
+  executeScript(script) {
+    const newScript = document.createElement("script");
+    [...script.attributes].forEach((attr) => newScript.setAttribute(attr.name, attr.value));
+    newScript.textContent = script.textContent;
+    script.parentNode.replaceChild(newScript, script);
+  }
+  async handleSrcChange() {
+    try {
+      const src = this.src;
+      const file = await requestInclude(src, this.mode);
+      if (src !== this.src) {
+        return;
+      }
+      if (!file.ok) {
+        this.emit("sl-error", { detail: { status: file.status } });
+        return;
+      }
+      this.innerHTML = file.html;
+      if (this.allowScripts) {
+        [...this.querySelectorAll("script")].forEach((script) => this.executeScript(script));
+      }
+      this.emit("sl-load");
+    } catch (e) {
+      this.emit("sl-error", { detail: { status: -1 } });
+    }
+  }
+  render() {
+    return b`<slot></slot>`;
+  }
+};
+SlInclude.styles = [component_styles_default, include_styles_default];
+__decorateClass([
+  n()
+], SlInclude.prototype, "src", 2);
+__decorateClass([
+  n()
+], SlInclude.prototype, "mode", 2);
+__decorateClass([
+  n({ attribute: "allow-scripts", type: Boolean })
+], SlInclude.prototype, "allowScripts", 2);
+__decorateClass([
+  watch("src")
+], SlInclude.prototype, "handleSrcChange", 1);
+
+export {
+  SlInclude
+};

package/cdn/chunks/chunk.PPDUXEQN.js

@@ -0,0 +1,244 @@
+import {
+  i
+} from "./chunk.LXXLDXU7.js";
+
+// src/components/tab-group/tab-group.styles.ts
+var tab_group_styles_default = i`
+  :host {
+    --indicator-color: var(--sl-color-primary-600);
+    --track-color: var(--sl-color-neutral-200);
+    --track-width: 1px;
+
+    display: block;
+  }
+
+  .tab-group {
+    display: flex;
+    border-radius: 0;
+  }
+
+  .tab-group__tabs {
+    display: flex;
+    position: relative;
+  }
+
+  .tab-group__indicator {
+    position: absolute;
+    transition:
+      var(--sl-transition-fast) translate ease,
+      var(--sl-transition-fast) width ease;
+  }
+
+  .tab-group--has-scroll-controls .tab-group__nav-container {
+    position: relative;
+    padding: 0 var(--sl-spacing-x-large);
+  }
+
+  .tab-group--has-scroll-controls .tab-group__scroll-button--start--hidden,
+  .tab-group--has-scroll-controls .tab-group__scroll-button--end--hidden {
+    visibility: hidden;
+  }
+
+  .tab-group__body {
+    display: block;
+    overflow: auto;
+  }
+
+  .tab-group__scroll-button {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    width: var(--sl-spacing-x-large);
+  }
+
+  .tab-group__scroll-button--start {
+    left: 0;
+  }
+
+  .tab-group__scroll-button--end {
+    right: 0;
+  }
+
+  .tab-group--rtl .tab-group__scroll-button--start {
+    left: auto;
+    right: 0;
+  }
+
+  .tab-group--rtl .tab-group__scroll-button--end {
+    left: 0;
+    right: auto;
+  }
+
+  /*
+   * Top
+   */
+
+  .tab-group--top {
+    flex-direction: column;
+  }
+
+  .tab-group--top .tab-group__nav-container {
+    order: 1;
+  }
+
+  .tab-group--top .tab-group__nav {
+    display: flex;
+    overflow-x: auto;
+
+    /* Hide scrollbar in Firefox */
+    scrollbar-width: none;
+  }
+
+  /* Hide scrollbar in Chrome/Safari */
+  .tab-group--top .tab-group__nav::-webkit-scrollbar {
+    width: 0;
+    height: 0;
+  }
+
+  .tab-group--top .tab-group__tabs {
+    flex: 1 1 auto;
+    position: relative;
+    flex-direction: row;
+    border-bottom: solid var(--track-width) var(--track-color);
+  }
+
+  .tab-group--top .tab-group__indicator {
+    bottom: calc(-1 * var(--track-width));
+    border-bottom: solid 2px var(--indicator-color);
+  }
+
+  .tab-group--top .tab-group__body {
+    order: 2;
+  }
+
+  .tab-group--top ::slotted(sl-tab-panel) {
+    --padding: var(--sl-spacing-medium) 0;
+  }
+
+  /*
+   * Bottom
+   */
+
+  .tab-group--bottom {
+    flex-direction: column;
+  }
+
+  .tab-group--bottom .tab-group__nav-container {
+    order: 2;
+  }
+
+  .tab-group--bottom .tab-group__nav {
+    display: flex;
+    overflow-x: auto;
+
+    /* Hide scrollbar in Firefox */
+    scrollbar-width: none;
+  }
+
+  /* Hide scrollbar in Chrome/Safari */
+  .tab-group--bottom .tab-group__nav::-webkit-scrollbar {
+    width: 0;
+    height: 0;
+  }
+
+  .tab-group--bottom .tab-group__tabs {
+    flex: 1 1 auto;
+    position: relative;
+    flex-direction: row;
+    border-top: solid var(--track-width) var(--track-color);
+  }
+
+  .tab-group--bottom .tab-group__indicator {
+    top: calc(-1 * var(--track-width));
+    border-top: solid 2px var(--indicator-color);
+  }
+
+  .tab-group--bottom .tab-group__body {
+    order: 1;
+  }
+
+  .tab-group--bottom ::slotted(sl-tab-panel) {
+    --padding: var(--sl-spacing-medium) 0;
+  }
+
+  /*
+   * Start
+   */
+
+  .tab-group--start {
+    flex-direction: row;
+  }
+
+  .tab-group--start .tab-group__nav-container {
+    order: 1;
+  }
+
+  .tab-group--start .tab-group__tabs {
+    flex: 0 0 auto;
+    flex-direction: column;
+    border-inline-end: solid var(--track-width) var(--track-color);
+  }
+
+  .tab-group--start .tab-group__indicator {
+    right: calc(-1 * var(--track-width));
+    border-right: solid 2px var(--indicator-color);
+  }
+
+  .tab-group--start.tab-group--rtl .tab-group__indicator {
+    right: auto;
+    left: calc(-1 * var(--track-width));
+  }
+
+  .tab-group--start .tab-group__body {
+    flex: 1 1 auto;
+    order: 2;
+  }
+
+  .tab-group--start ::slotted(sl-tab-panel) {
+    --padding: 0 var(--sl-spacing-medium);
+  }
+
+  /*
+   * End
+   */
+
+  .tab-group--end {
+    flex-direction: row;
+  }
+
+  .tab-group--end .tab-group__nav-container {
+    order: 2;
+  }
+
+  .tab-group--end .tab-group__tabs {
+    flex: 0 0 auto;
+    flex-direction: column;
+    border-left: solid var(--track-width) var(--track-color);
+  }
+
+  .tab-group--end .tab-group__indicator {
+    left: calc(-1 * var(--track-width));
+    border-inline-start: solid 2px var(--indicator-color);
+  }
+
+  .tab-group--end.tab-group--rtl .tab-group__indicator {
+    right: calc(-1 * var(--track-width));
+    left: auto;
+  }
+
+  .tab-group--end .tab-group__body {
+    flex: 1 1 auto;
+    order: 1;
+  }
+
+  .tab-group--end ::slotted(sl-tab-panel) {
+    --padding: 0 var(--sl-spacing-medium);
+  }
+`;
+
+export {
+  tab_group_styles_default
+};