@kdcloudjs/shoelace 1.0.46 → 1.0.48

package/dist/chunks/chunk.VGDQFK72.js

@@ -0,0 +1,191 @@
+import {
+  segmented_styles_default
+} from "./chunk.C46PSYHF.js";
+import {
+  SlTooltip
+} from "./chunk.CMS726TE.js";
+import {
+  SlIcon
+} from "./chunk.EXDBFSCJ.js";
+import {
+  component_styles_default
+} from "./chunk.TUVJKY7S.js";
+import {
+  ShoelaceElement
+} from "./chunk.3VEO3DSZ.js";
+import {
+  __decorateClass,
+  __spreadProps,
+  __spreadValues
+} from "./chunk.W5KB6T3Z.js";
+
+// src/components/segmented/segmented.component.ts
+import { html, nothing } from "lit";
+import { property, state, query, queryAll } from "lit/decorators.js";
+var SlSegmented = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.options = [];
+    this.disabled = false;
+    this.orientation = "horizontal";
+    this.shape = "default";
+    this.size = "medium";
+    this.block = false;
+    this.name = "segmented";
+    this.thumbStyle = "";
+    this._internalValue = "";
+  }
+  /** 判断是否为受控模式 */
+  get isControlled() {
+    return this.value !== void 0;
+  }
+  /** 获取当前选中值（受控模式用 value，非受控模式用内部值） */
+  get currentValue() {
+    return this.isControlled ? this.value : this._internalValue;
+  }
+  normalizeOption(opt) {
+    var _a;
+    if (typeof opt === "string") return { label: opt, value: opt };
+    if (typeof opt === "number") return { label: String(opt), value: opt };
+    return __spreadProps(__spreadValues({}, opt), { label: (_a = opt.label) != null ? _a : "" });
+  }
+  get normalizedOptions() {
+    return this.options.map((o) => this.normalizeOption(o));
+  }
+  handleChange(opt) {
+    var _a;
+    if (this.disabled || opt.disabled) return;
+    if (opt.value === this.currentValue) return;
+    if (!this.isControlled) {
+      this._internalValue = opt.value;
+    }
+    (_a = this.onChange) == null ? void 0 : _a.call(this, opt.value);
+    if (this.isControlled) {
+      this.requestUpdate();
+    }
+    this.updateComplete.then(() => this.updateThumb());
+  }
+  updateThumb() {
+    var _a;
+    if (!this.container || !((_a = this.itemEls) == null ? void 0 : _a.length)) return;
+    const opts = this.normalizedOptions;
+    const idx = opts.findIndex((o) => o.value === this.currentValue);
+    if (idx < 0) {
+      this.thumbStyle = "display:none";
+      return;
+    }
+    const el = this.itemEls[idx];
+    if (!el) return;
+    if (this.orientation === "vertical") {
+      this.thumbStyle = `top:${el.offsetTop}px;height:${el.offsetHeight}px;left:2px;width:calc(100% - 4px)`;
+    } else {
+      this.thumbStyle = `left:${el.offsetLeft}px;width:${el.offsetWidth}px`;
+    }
+  }
+  firstUpdated() {
+    if (!this.isControlled) {
+      if (this.defaultValue !== void 0) {
+        this._internalValue = this.defaultValue;
+      } else if (this.normalizedOptions.length) {
+        const first = this.normalizedOptions.find((o) => !o.disabled);
+        if (first) this._internalValue = first.value;
+      }
+    }
+    this.updateComplete.then(() => this.updateThumb());
+  }
+  updated(changed) {
+    if (changed.has("value") || changed.has("_internalValue") || changed.has("options") || changed.has("orientation")) {
+      if (changed.has("options") && !this.isControlled) {
+        const opts = this.normalizedOptions;
+        const currentValid = opts.some((o) => o.value === this._internalValue);
+        if (!currentValid && opts.length) {
+          const first = opts.find((o) => !o.disabled);
+          if (first) this._internalValue = first.value;
+        }
+      }
+      this.updateComplete.then(() => this.updateThumb());
+    }
+  }
+  render() {
+    const opts = this.normalizedOptions;
+    const selectedValue = this.currentValue;
+    return html`
+      <div
+        class="segmented segmented-${this.orientation} segmented-${this.size} ${this.shape === "round" ? "segmented-round" : ""} ${this.block ? "segmented-block" : ""}"
+      >
+        <div class="segmented-thumb" style="${this.thumbStyle}"></div>
+        ${opts.map((opt) => {
+      const selected = opt.value === selectedValue;
+      const isDisabled = this.disabled || opt.disabled;
+      const itemContent = html`
+            <label
+              class="segmented-item ${selected ? "segmented-item-selected" : ""} ${isDisabled ? "segmented-item-disabled" : ""}"
+            >
+              <input
+                type="radio"
+                class="segmented-radio"
+                name="${this.name}"
+                .value="${String(opt.value)}"
+                .checked="${selected}"
+                ?disabled="${isDisabled}"
+                @change="${() => this.handleChange(opt)}"
+              />
+              ${opt.icon ? html`<sl-icon name="${opt.icon}" class="segmented-item-icon"></sl-icon>` : nothing}
+              ${opt.label ? typeof opt.label === "string" ? html`<span>${opt.label}</span>` : opt.label : nothing}
+              <slot name="${String(opt.value)}"></slot>
+            </label>
+          `;
+      return opt.tooltip ? html`<sl-tooltip content="${opt.tooltip}">${itemContent}</sl-tooltip>` : itemContent;
+    })}
+      </div>
+    `;
+  }
+};
+SlSegmented.styles = [component_styles_default, segmented_styles_default];
+SlSegmented.dependencies = { "sl-icon": SlIcon, "sl-tooltip": SlTooltip };
+__decorateClass([
+  property({ type: Array })
+], SlSegmented.prototype, "options", 2);
+__decorateClass([
+  property()
+], SlSegmented.prototype, "value", 2);
+__decorateClass([
+  property()
+], SlSegmented.prototype, "defaultValue", 2);
+__decorateClass([
+  property({ attribute: false })
+], SlSegmented.prototype, "onChange", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], SlSegmented.prototype, "disabled", 2);
+__decorateClass([
+  property({ type: String })
+], SlSegmented.prototype, "orientation", 2);
+__decorateClass([
+  property({ type: String })
+], SlSegmented.prototype, "shape", 2);
+__decorateClass([
+  property({ type: String })
+], SlSegmented.prototype, "size", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], SlSegmented.prototype, "block", 2);
+__decorateClass([
+  property({ type: String })
+], SlSegmented.prototype, "name", 2);
+__decorateClass([
+  state()
+], SlSegmented.prototype, "thumbStyle", 2);
+__decorateClass([
+  state()
+], SlSegmented.prototype, "_internalValue", 2);
+__decorateClass([
+  query(".segmented")
+], SlSegmented.prototype, "container", 2);
+__decorateClass([
+  queryAll(".segmented-item")
+], SlSegmented.prototype, "itemEls", 2);
+
+export {
+  SlSegmented
+};

package/dist/chunks/chunk.VGRRYEQK.js

@@ -0,0 +1,25 @@
+import {
+  SlRadioButton
+} from "./chunk.OMJL4YJK.js";
+
+// src/react/radio-button/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "sl-radio-button";
+SlRadioButton.define("sl-radio-button");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: SlRadioButton,
+  react: React,
+  events: {
+    onSlBlur: "sl-blur",
+    onSlFocus: "sl-focus"
+  },
+  displayName: "SlRadioButton"
+});
+var radio_button_default = reactWrapper;
+
+export {
+  radio_button_default
+};

package/dist/chunks/chunk.VHU5DTJX.js

@@ -0,0 +1,24 @@
+import {
+  SlTab
+} from "./chunk.6QE77KTS.js";
+
+// src/react/tab/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "sl-tab";
+SlTab.define("sl-tab");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: SlTab,
+  react: React,
+  events: {
+    onSlClose: "sl-close"
+  },
+  displayName: "SlTab"
+});
+var tab_default = reactWrapper;
+
+export {
+  tab_default
+};

package/dist/chunks/chunk.VJRDXBNJ.js

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