@kdcloudjs/shoelace 1.0.45 → 1.0.46

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

@@ -1,281 +0,0 @@
-import {
-  steps_styles_default
-} from "./chunk.PU6CJLWU.js";
-import {
-  SlIcon
-} from "./chunk.A3LXMVDY.js";
-import {
-  component_styles_default
-} from "./chunk.N6N54SAA.js";
-import {
-  ShoelaceElement,
-  n,
-  r
-} from "./chunk.ZYC5S7ZP.js";
-import {
-  b
-} from "./chunk.OLIQR3OU.js";
-import {
-  __decorateClass
-} from "./chunk.CZCSAYQZ.js";
-
-// src/components/steps/steps.component.ts
-var SlSteps = class extends ShoelaceElement {
-  constructor() {
-    super(...arguments);
-    this.items = [];
-    this.current = 0;
-    this.status = "process";
-    this.initial = 0;
-    this.percent = void 0;
-    this.size = "default";
-    this.type = "default";
-    this.variant = "filled";
-    this.orientation = "horizontal";
-    this.responsive = false;
-    this.titlePlacement = "horizontal";
-    this._isVertical = false;
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    if (this.responsive) {
-      this._resizeObserver = new ResizeObserver((entries) => {
-        var _a, _b;
-        const width = (_b = (_a = entries[0]) == null ? void 0 : _a.contentRect.width) != null ? _b : 0;
-        this._isVertical = width < 532;
-      });
-      this._resizeObserver.observe(this);
-    }
-  }
-  disconnectedCallback() {
-    var _a;
-    super.disconnectedCallback();
-    (_a = this._resizeObserver) == null ? void 0 : _a.disconnect();
-    this._resizeObserver = void 0;
-  }
-  updated(changed) {
-    var _a;
-    if (changed.has("responsive")) {
-      (_a = this._resizeObserver) == null ? void 0 : _a.disconnect();
-      if (this.responsive) {
-        this._resizeObserver = new ResizeObserver((entries) => {
-          var _a2, _b;
-          const width = (_b = (_a2 = entries[0]) == null ? void 0 : _a2.contentRect.width) != null ? _b : 0;
-          this._isVertical = width < 532;
-        });
-        this._resizeObserver.observe(this);
-      } else {
-        this._isVertical = false;
-      }
-    }
-  }
-  get effectiveOrientation() {
-    if (this.responsive && this._isVertical) return "vertical";
-    return this.orientation;
-  }
-  get clickable() {
-    return typeof this.onChange === "function";
-  }
-  handleStepClick(index) {
-    if (!this.clickable) return;
-    const item = this.items[index];
-    if (item == null ? void 0 : item.disabled) return;
-    this.onChange(index);
-  }
-  getStepStatus(index) {
-    const item = this.items[index];
-    if (item.status) return item.status;
-    if (index < this.current) return "finish";
-    if (index === this.current) return this.status;
-    return "wait";
-  }
-  renderIcon(index, stepStatus) {
-    const item = this.items[index];
-    if (item.icon) {
-      return b`<sl-icon name=${item.icon}></sl-icon>`;
-    }
-    if (stepStatus === "finish") {
-      return b`<sl-icon name="check-lg"></sl-icon>`;
-    }
-    if (stepStatus === "error") {
-      return b`<sl-icon name="x-lg"></sl-icon>`;
-    }
-    if (stepStatus === "process" && this.percent !== void 0) {
-      const size = this.size === "small" ? 30 : 38;
-      const stroke = this.size === "small" ? 1.5 : 2;
-      const r2 = (size - stroke) / 2;
-      const cx = size / 2;
-      const circumference = 2 * Math.PI * r2;
-      const offset = circumference - Math.min(100, Math.max(0, this.percent)) / 100 * circumference;
-      return b`
-        <svg class="progress-ring" width="${size}" height="${size}" viewBox="0 0 ${size} ${size}">
-          <circle class="progress-ring-bg" cx="${cx}" cy="${cx}" r="${r2}" stroke-width="${stroke}" />
-          <circle
-            class="progress-ring-fg"
-            cx="${cx}"
-            cy="${cx}"
-            r="${r2}"
-            stroke-width="${stroke}"
-            stroke-dasharray="${circumference}"
-            stroke-dashoffset="${offset}"
-          />
-        </svg>
-        <span>${this.initial + index + 1}</span>
-      `;
-    }
-    return b`<span>${this.initial + index + 1}</span>`;
-  }
-  renderDot(item, index) {
-    const stepStatus = this.getStepStatus(index);
-    return b`
-      <div class="step step-${stepStatus} ${item.disabled ? "step-disabled" : ""}" role="listitem">
-        <div class="step-dot-track">
-          <div class="step-dot-indicator"></div>
-        </div>
-        <div class="step-dot-text">
-          <span class="step-title">${item.title}</span>
-          ${item.subTitle ? b`<span class="step-subtitle">${item.subTitle}</span>` : ""}
-          ${item.content ? b`<div class="step-description">${item.content}</div>` : ""}
-        </div>
-      </div>
-    `;
-  }
-  renderDefault(item, index) {
-    const stepStatus = this.getStepStatus(index);
-    const hasCustomIcon = !!item.icon;
-    return b`
-      <div class="step step-${stepStatus} ${item.disabled ? "step-disabled" : ""}" role="listitem">
-        <div class="step-icon ${hasCustomIcon ? "step-icon-custom" : ""}">${this.renderIcon(index, stepStatus)}</div>
-        <div class="step-main">
-          <div class="step-title-row">
-            <span class="step-title">${item.title}</span>
-            ${item.subTitle ? b`<span class="step-subtitle">${item.subTitle}</span>` : ""}
-            <div class="step-tail"></div>
-          </div>
-          ${item.content ? b`<div class="step-description">${item.content}</div>` : ""}
-        </div>
-      </div>
-    `;
-  }
-  renderNavigation(item, index) {
-    const stepStatus = this.getStepStatus(index);
-    return b`
-      <div class="step step-${stepStatus} ${item.disabled ? "step-disabled" : ""}" role="listitem">
-        <div class="step-nav-content">
-          <div class="step-icon ${item.icon ? "step-icon-custom" : ""}">${this.renderIcon(index, stepStatus)}</div>
-          <div class="step-nav-text">
-            <span class="step-title">${item.title}</span>
-            ${item.subTitle ? b`<span class="step-subtitle">${item.subTitle}</span>` : ""}
-          </div>
-        </div>
-        <div class="step-nav-arrow"></div>
-      </div>
-    `;
-  }
-  renderPanel(item, index) {
-    const stepStatus = this.getStepStatus(index);
-    const hasCustomIcon = !!item.icon;
-    return b`
-      <div class="step step-${stepStatus} ${item.disabled ? "step-disabled" : ""}" role="listitem">
-        <div class="step-panel-content">
-          <div class="step-icon ${hasCustomIcon ? "step-icon-custom" : ""}">${this.renderIcon(index, stepStatus)}</div>
-          <div class="step-panel-text">
-            <span class="step-title">${item.title}</span>
-            ${item.content ? b`<div class="step-description">${item.content}</div>` : ""}
-          </div>
-        </div>
-      </div>
-    `;
-  }
-  renderInline(item, index) {
-    const stepStatus = this.getStepStatus(index);
-    return b`
-      <div class="step step-${stepStatus} ${item.disabled ? "step-disabled" : ""}" role="listitem">
-        <div class="step-inline-dot"></div>
-        <span class="step-title">${item.title}</span>
-        ${item.subTitle ? b`<span class="step-subtitle">${item.subTitle}</span>` : ""}
-      </div>
-    `;
-  }
-  render() {
-    let renderStep;
-    switch (this.type) {
-      case "dot":
-        renderStep = this.renderDot;
-        break;
-      case "navigation":
-        renderStep = this.renderNavigation;
-        break;
-      case "panel":
-        renderStep = this.renderPanel;
-        break;
-      case "inline":
-        renderStep = this.renderInline;
-        break;
-      default:
-        renderStep = this.renderDefault;
-    }
-    return b`
-      <div
-        class="steps steps-${this.size} steps-${this.type} steps-${this.variant} steps-${this.effectiveOrientation} steps-title-${this.titlePlacement} ${this.clickable ? "steps-clickable" : ""}"
-        role="list"
-        @click=${(e) => {
-      if (!this.clickable) return;
-      const stepEl = e.target.closest(".step");
-      if (!stepEl) return;
-      const stepsEl = stepEl.parentElement;
-      if (!stepsEl) return;
-      const index = Array.from(stepsEl.querySelectorAll(":scope > .step")).indexOf(stepEl);
-      if (index >= 0) this.handleStepClick(index);
-    }}
-      >
-        ${this.items.map((item, index) => renderStep.call(this, item, index))}
-      </div>
-    `;
-  }
-};
-SlSteps.styles = [component_styles_default, steps_styles_default];
-SlSteps.dependencies = { "sl-icon": SlIcon };
-__decorateClass([
-  n({ type: Array })
-], SlSteps.prototype, "items", 2);
-__decorateClass([
-  n({ type: Number })
-], SlSteps.prototype, "current", 2);
-__decorateClass([
-  n({ type: String })
-], SlSteps.prototype, "status", 2);
-__decorateClass([
-  n({ type: Number })
-], SlSteps.prototype, "initial", 2);
-__decorateClass([
-  n({ type: Number })
-], SlSteps.prototype, "percent", 2);
-__decorateClass([
-  n({ type: String })
-], SlSteps.prototype, "size", 2);
-__decorateClass([
-  n({ type: String })
-], SlSteps.prototype, "type", 2);
-__decorateClass([
-  n({ type: String })
-], SlSteps.prototype, "variant", 2);
-__decorateClass([
-  n({ type: String })
-], SlSteps.prototype, "orientation", 2);
-__decorateClass([
-  n({ type: Boolean })
-], SlSteps.prototype, "responsive", 2);
-__decorateClass([
-  n({ type: String })
-], SlSteps.prototype, "titlePlacement", 2);
-__decorateClass([
-  n({ attribute: false })
-], SlSteps.prototype, "onChange", 2);
-__decorateClass([
-  r()
-], SlSteps.prototype, "_isVertical", 2);
-
-export {
-  SlSteps
-};

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

@@ -1,154 +0,0 @@
-import {
-  float_button_styles_default
-} from "./chunk.O2QQ6S26.js";
-import {
-  SlTooltip
-} from "./chunk.KD2W73R4.js";
-import {
-  o
-} from "./chunk.GYHG7L6Q.js";
-import {
-  HasSlotController
-} from "./chunk.NYIIDP5N.js";
-import {
-  SlIcon
-} from "./chunk.A3LXMVDY.js";
-import {
-  e
-} from "./chunk.2QDPYAHS.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/float-button/float-button.component.ts
-var SlFloatButton = class extends ShoelaceElement {
-  constructor() {
-    super(...arguments);
-    this.hasSlotController = new HasSlotController(this, "[default]", "content");
-    this.type = "default";
-    this.shape = "circle";
-    this.size = "medium";
-    this.icon = "";
-    this.tooltip = "";
-    this.tooltipPlacement = "left";
-    this.disabled = false;
-    this.href = "";
-    this.target = "";
-  }
-  handleClick(event) {
-    if (this.disabled) {
-      event.preventDefault();
-      event.stopPropagation();
-      return;
-    }
-    this.emit("sl-click");
-  }
-  renderBody() {
-    const hasContent = this.hasSlotController.test("content");
-    return b`
-      <span class="float-button__body">
-        <span part="icon" class="float-button__icon">
-          ${this.icon ? b`<sl-icon name=${this.icon}></sl-icon>` : b`<slot></slot>`}
-        </span>
-        ${hasContent ? b`<span part="content" class="float-button__content"><slot name="content"></slot></span>` : ""}
-      </span>
-    `;
-  }
-  renderButton() {
-    const hasContent = this.hasSlotController.test("content");
-    const classes = {
-      "float-button": true,
-      "float-button--default": this.type === "default",
-      "float-button--primary": this.type === "primary",
-      "float-button--circle": this.shape === "circle",
-      "float-button--square": this.shape === "square",
-      "float-button--small": this.size === "small",
-      "float-button--medium": this.size === "medium",
-      "float-button--large": this.size === "large",
-      "float-button--disabled": this.disabled,
-      "float-button--has-content": hasContent
-    };
-    if (this.href) {
-      return b`
-        <a
-          part="base"
-          class=${e(classes)}
-          href=${this.href}
-          target=${o(this.target || void 0)}
-          role="button"
-          aria-disabled=${this.disabled ? "true" : "false"}
-          tabindex=${this.disabled ? "-1" : "0"}
-          @click=${this.handleClick}
-          >${this.renderBody()}</a
-        >
-      `;
-    }
-    return b`
-      <button
-        part="base"
-        class=${e(classes)}
-        ?disabled=${this.disabled}
-        aria-disabled=${this.disabled ? "true" : "false"}
-        @click=${this.handleClick}
-      >
-        ${this.renderBody()}
-      </button>
-    `;
-  }
-  render() {
-    if (this.tooltip) {
-      return b`
-        <sl-tooltip content=${this.tooltip} placement=${this.tooltipPlacement} hoist>
-          ${this.renderButton()}
-        </sl-tooltip>
-      `;
-    }
-    return this.renderButton();
-  }
-};
-SlFloatButton.styles = [component_styles_default, float_button_styles_default];
-SlFloatButton.dependencies = {
-  "sl-icon": SlIcon,
-  "sl-tooltip": SlTooltip
-};
-__decorateClass([
-  n({ reflect: true })
-], SlFloatButton.prototype, "type", 2);
-__decorateClass([
-  n({ reflect: true })
-], SlFloatButton.prototype, "shape", 2);
-__decorateClass([
-  n({ reflect: true })
-], SlFloatButton.prototype, "size", 2);
-__decorateClass([
-  n()
-], SlFloatButton.prototype, "icon", 2);
-__decorateClass([
-  n()
-], SlFloatButton.prototype, "tooltip", 2);
-__decorateClass([
-  n({ attribute: "tooltip-placement" })
-], SlFloatButton.prototype, "tooltipPlacement", 2);
-__decorateClass([
-  n({ type: Boolean, reflect: true })
-], SlFloatButton.prototype, "disabled", 2);
-__decorateClass([
-  n()
-], SlFloatButton.prototype, "href", 2);
-__decorateClass([
-  n()
-], SlFloatButton.prototype, "target", 2);
-
-export {
-  SlFloatButton
-};

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

@@ -1,11 +0,0 @@
-import {
-  SlTab
-} from "./chunk.SKXIMFBN.js";
-
-// src/components/tab/tab.ts
-var tab_default = SlTab;
-SlTab.define("sl-tab");
-
-export {
-  tab_default
-};

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

@@ -1,11 +0,0 @@
-import {
-  SlXMarkdown
-} from "./chunk.LCMQ7QMH.js";
-
-// src/components/x-markdown/x-markdown.ts
-var x_markdown_default = SlXMarkdown;
-SlXMarkdown.define("sl-x-markdown");
-
-export {
-  x_markdown_default
-};

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

@@ -1,11 +0,0 @@
-import {
-  SlTreeItem
-} from "./chunk.H6YBBT32.js";
-
-// src/components/tree-item/tree-item.ts
-var tree_item_default = SlTreeItem;
-SlTreeItem.define("sl-tree-item");
-
-export {
-  tree_item_default
-};

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

@@ -1,11 +0,0 @@
-import {
-  SlCalendar
-} from "./chunk.XMK6TU2Z.js";
-
-// src/components/calendar/calendar.ts
-var calendar_default = SlCalendar;
-SlCalendar.define("sl-calendar");
-
-export {
-  calendar_default
-};

package/cdn/chunks/chunk.622NCJ7A.js

@@ -1,21 +0,0 @@
-import {
-  SlVisuallyHidden
-} from "./chunk.4BTRF6TV.js";
-
-// src/react/visually-hidden/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-var tagName = "sl-visually-hidden";
-SlVisuallyHidden.define("sl-visually-hidden");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: SlVisuallyHidden,
-  react: React,
-  events: {},
-  displayName: "SlVisuallyHidden"
-});
-var visually_hidden_default = reactWrapper;
-
-export {
-  visually_hidden_default
-};

package/cdn/chunks/chunk.62U256U7.js

@@ -1,11 +0,0 @@
-import {
-  SlSkeleton
-} from "./chunk.PSZF2LS6.js";
-
-// src/components/skeleton/skeleton.ts
-var skeleton_default = SlSkeleton;
-SlSkeleton.define("sl-skeleton");
-
-export {
-  skeleton_default
-};

package/cdn/chunks/chunk.67C2SWFA.js

@@ -1,161 +0,0 @@
-import {
-  row_styles_default
-} from "./chunk.OOKUQ7XD.js";
-import {
-  o
-} from "./chunk.YWGYT4Y3.js";
-import {
-  e
-} from "./chunk.2QDPYAHS.js";
-import {
-  component_styles_default
-} from "./chunk.N6N54SAA.js";
-import {
-  ShoelaceElement,
-  n,
-  r
-} from "./chunk.ZYC5S7ZP.js";
-import {
-  b
-} from "./chunk.OLIQR3OU.js";
-import {
-  __decorateClass,
-  __spreadProps,
-  __spreadValues
-} from "./chunk.CZCSAYQZ.js";
-
-// src/components/row/row.component.ts
-var breakpoints = {
-  xs: 0,
-  sm: 576,
-  md: 768,
-  lg: 992,
-  xl: 1200,
-  xxl: 1600
-};
-var responsiveArray = ["xxl", "xl", "lg", "md", "sm", "xs"];
-var SlRow = class extends ShoelaceElement {
-  constructor() {
-    super(...arguments);
-    this.mediaQueryLists = /* @__PURE__ */ new Map();
-    this.currentScreens = {};
-    this.gutter = 0;
-    this.align = "top";
-    this.justify = "start";
-    this.wrap = true;
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.setupResponsiveObserver();
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    this.cleanupResponsiveObserver();
-  }
-  setupResponsiveObserver() {
-    Object.entries(breakpoints).forEach(([key, minWidth]) => {
-      const breakpoint = key;
-      const mediaQuery = minWidth === 0 ? "(min-width: 0px)" : `(min-width: ${minWidth}px)`;
-      const mql = window.matchMedia(mediaQuery);
-      const handler = (e2) => {
-        this.currentScreens = __spreadProps(__spreadValues({}, this.currentScreens), {
-          [breakpoint]: e2.matches
-        });
-        this.updateChildrenContext();
-      };
-      mql.addEventListener("change", handler);
-      this.mediaQueryLists.set(breakpoint, mql);
-      handler(mql);
-    });
-  }
-  cleanupResponsiveObserver() {
-    this.mediaQueryLists.forEach((mql) => {
-      mql.removeEventListener("change", () => {
-      });
-    });
-    this.mediaQueryLists.clear();
-  }
-  getGutterValue(gutterProp) {
-    if (typeof gutterProp === "number") {
-      return gutterProp;
-    }
-    if (typeof gutterProp === "object" && gutterProp !== null) {
-      for (const breakpoint of responsiveArray) {
-        if (this.currentScreens[breakpoint] && gutterProp[breakpoint] !== void 0) {
-          return gutterProp[breakpoint];
-        }
-      }
-    }
-    return 0;
-  }
-  getGutters() {
-    const normalizedGutter = Array.isArray(this.gutter) ? this.gutter : [this.gutter, 0];
-    return [
-      this.getGutterValue(normalizedGutter[0]),
-      this.getGutterValue(normalizedGutter[1] || 0)
-    ];
-  }
-  updateChildrenContext() {
-    const [gutterH, gutterV] = this.getGutters();
-    const context = {
-      gutter: [gutterH, gutterV],
-      wrap: this.wrap
-    };
-    const cols = this.querySelectorAll("sl-col");
-    cols.forEach((col) => {
-      col.rowContext = context;
-    });
-    this.requestUpdate();
-  }
-  updated(changedProperties) {
-    super.updated(changedProperties);
-    if (changedProperties.has("gutter") || changedProperties.has("wrap")) {
-      this.updateChildrenContext();
-    }
-  }
-  render() {
-    const [gutterH, gutterV] = this.getGutters();
-    const rowStyles = {};
-    if (gutterH) {
-      rowStyles.marginLeft = `${-gutterH / 2}px`;
-      rowStyles.marginRight = `${-gutterH / 2}px`;
-    }
-    if (gutterV) {
-      rowStyles.rowGap = `${gutterV}px`;
-    }
-    return b`
-      <div
-        part="base"
-        class=${e({
-      row: true,
-      "row--no-wrap": !this.wrap,
-      [`row--${this.justify}`]: true,
-      [`row--${this.align}`]: true
-    })}
-        style=${o(rowStyles)}
-      >
-        <slot @slotchange=${this.updateChildrenContext}></slot>
-      </div>
-    `;
-  }
-};
-SlRow.styles = [component_styles_default, row_styles_default];
-__decorateClass([
-  r()
-], SlRow.prototype, "currentScreens", 2);
-__decorateClass([
-  n({ type: Object })
-], SlRow.prototype, "gutter", 2);
-__decorateClass([
-  n({ reflect: true })
-], SlRow.prototype, "align", 2);
-__decorateClass([
-  n({ reflect: true })
-], SlRow.prototype, "justify", 2);
-__decorateClass([
-  n({ type: Boolean, reflect: true })
-], SlRow.prototype, "wrap", 2);
-
-export {
-  SlRow
-};

package/cdn/chunks/chunk.6AZGQXJK.js

@@ -1,11 +0,0 @@
-import {
-  SlTree
-} from "./chunk.SOAQSD5Y.js";
-
-// src/components/tree/tree.ts
-var tree_default = SlTree;
-SlTree.define("sl-tree");
-
-export {
-  tree_default
-};