@kdcloudjs/shoelace 1.0.34 → 1.0.35

package/dist/chunks/chunk.AQBDFPTR.js

@@ -0,0 +1,11 @@
+import {
+  SlTooltip
+} from "./chunk.Z3KE6RDB.js";
+
+// src/components/tooltip/tooltip.ts
+var tooltip_default = SlTooltip;
+SlTooltip.define("sl-tooltip");
+
+export {
+  tooltip_default
+};

package/dist/chunks/chunk.ARU6PW2N.js

@@ -0,0 +1,170 @@
+import {
+  nav_item_styles_default
+} from "./chunk.TQURQU66.js";
+import {
+  HasSlotController
+} from "./chunk.NYIIDP5N.js";
+import {
+  component_styles_default
+} from "./chunk.TUVJKY7S.js";
+import {
+  ShoelaceElement
+} from "./chunk.Z7SZHKVL.js";
+import {
+  __decorateClass
+} from "./chunk.W5KB6T3Z.js";
+
+// src/components/nav-item/nav-item.component.ts
+import { classMap } from "lit/directives/class-map.js";
+import { html, nothing } from "lit";
+import { property } from "lit/decorators.js";
+var SlNavItem = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.hasSlotController = new HasSlotController(this, "prefix", "suffix");
+    this.key = "";
+    this.itemKey = "";
+    this.danger = false;
+    this.title = "";
+    this.disabled = false;
+    this.active = false;
+    this.href = "";
+    this.rel = "noreferrer noopener";
+    this.mode = "inline";
+    this.collapsed = false;
+  }
+  handleClick(event) {
+    if (this.disabled) {
+      event.preventDefault();
+      event.stopPropagation();
+      return;
+    }
+    this.emit("sl-nav-select", { detail: { item: this, domEvent: event } });
+  }
+  handleKeyDown(event) {
+    if (this.disabled) {
+      return;
+    }
+    if (event.key === "Enter" || event.key === " ") {
+      event.preventDefault();
+      this.emit("sl-nav-select", { detail: { item: this, domEvent: event } });
+    }
+  }
+  render() {
+    var _a, _b, _c;
+    const isLink = !!this.href;
+    const content = html`
+      <span class="nav-item__content">
+        <slot
+          name="prefix"
+          part="prefix"
+          class="nav-item__prefix"
+          style="display: ${this.hasSlotController.test("prefix") || this.icon !== void 0 ? "flex" : "none"}"
+        >
+          ${(_a = this.icon) != null ? _a : nothing}
+        </slot>
+        <slot part="label" class="nav-item__label">${(_b = this.label) != null ? _b : nothing}</slot>
+        <slot
+          name="suffix"
+          part="suffix"
+          class="nav-item__suffix"
+          style="display: ${this.hasSlotController.test("suffix") || this.extra !== void 0 ? "flex" : "none"}"
+        >
+          ${(_c = this.extra) != null ? _c : nothing}
+        </slot>
+      </span>
+    `;
+    const tag = isLink ? html`
+          <a
+            part="base"
+            class=${classMap({
+      "nav-item": true,
+      "nav-item--disabled": this.disabled,
+      "nav-item--active": this.active,
+      "nav-item--danger": this.danger
+    })}
+            href=${this.href}
+            target=${this.target}
+            download=${this.download}
+            rel=${this.target === "_blank" ? this.rel : void 0}
+            title=${this.title || nothing}
+            @click=${this.handleClick}
+            aria-disabled=${this.disabled ? "true" : "false"}
+            aria-current=${this.active ? "page" : void 0}
+            tabindex=${this.disabled ? "-1" : "0"}
+          >
+            ${content}
+          </a>
+        ` : html`
+          <div
+            part="base"
+            class=${classMap({
+      "nav-item": true,
+      "nav-item--disabled": this.disabled,
+      "nav-item--active": this.active,
+      "nav-item--danger": this.danger
+    })}
+            @click=${this.handleClick}
+            @keydown=${this.handleKeyDown}
+            title=${this.title || nothing}
+            aria-disabled=${this.disabled ? "true" : "false"}
+            aria-current=${this.active ? "page" : void 0}
+            role="menuitem"
+            tabindex=${this.disabled ? "-1" : "0"}
+          >
+            ${content}
+          </div>
+        `;
+    return tag;
+  }
+};
+SlNavItem.styles = [component_styles_default, nav_item_styles_default];
+__decorateClass([
+  property()
+], SlNavItem.prototype, "key", 2);
+__decorateClass([
+  property({ attribute: "item-key" })
+], SlNavItem.prototype, "itemKey", 2);
+__decorateClass([
+  property({ attribute: false })
+], SlNavItem.prototype, "label", 2);
+__decorateClass([
+  property({ attribute: false })
+], SlNavItem.prototype, "icon", 2);
+__decorateClass([
+  property({ attribute: false })
+], SlNavItem.prototype, "extra", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], SlNavItem.prototype, "danger", 2);
+__decorateClass([
+  property()
+], SlNavItem.prototype, "title", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], SlNavItem.prototype, "disabled", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], SlNavItem.prototype, "active", 2);
+__decorateClass([
+  property()
+], SlNavItem.prototype, "href", 2);
+__decorateClass([
+  property()
+], SlNavItem.prototype, "target", 2);
+__decorateClass([
+  property()
+], SlNavItem.prototype, "download", 2);
+__decorateClass([
+  property()
+], SlNavItem.prototype, "rel", 2);
+__decorateClass([
+  property({ reflect: true })
+], SlNavItem.prototype, "mode", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], SlNavItem.prototype, "collapsed", 2);
+
+export {
+  SlNavItem
+};

package/dist/chunks/chunk.ATUBEG3E.js

@@ -0,0 +1,127 @@
+// src/components/notification/notification.styles.ts
+import { css } from "lit";
+var notification_styles_default = css`
+  :host {
+    display: contents;
+  }
+
+  .notification {
+    position: relative;
+    display: flex;
+    align-items: flex-start;
+    background-color: var(--sl-color-neutral-0);
+    border-radius: var(--sl-border-radius-medium);
+    box-shadow: var(--sl-shadow-large);
+    font-family: var(--sl-font-sans);
+    font-size: var(--sl-font-size-small);
+    font-weight: var(--sl-font-weight-normal);
+    line-height: 1.6;
+    color: var(--sl-color-neutral-700);
+    margin: 0;
+    padding: var(--sl-spacing-medium);
+    overflow: hidden;
+    min-width: 384px;
+    max-width: 500px;
+  }
+
+  .notification:not(.notification--has-icon) .notification__icon {
+    display: none;
+  }
+
+  .notification:not(.notification--closable) .notification__close-button {
+    display: none;
+  }
+
+  .notification__icon {
+    flex: 0 0 auto;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 24px;
+    padding-inline-end: var(--sl-spacing-medium);
+    padding-block-start: 2px;
+  }
+
+  .notification--success .notification__icon {
+    color: var(--sl-color-success-600);
+  }
+
+  .notification--info .notification__icon {
+    color: var(--sl-color-primary-600);
+  }
+
+  .notification--warning .notification__icon {
+    color: var(--sl-color-warning-600);
+  }
+
+  .notification--error .notification__icon {
+    color: var(--sl-color-danger-600);
+  }
+
+  .notification__content {
+    flex: 1 1 auto;
+    min-width: 0;
+  }
+
+  .notification__title {
+    font-size: var(--sl-font-size-medium);
+    font-weight: var(--sl-font-weight-semibold);
+    color: var(--sl-color-neutral-900);
+    margin: 0;
+    line-height: 1.5;
+  }
+
+  .notification__description {
+    margin-top: var(--sl-spacing-x-small);
+    color: var(--sl-color-neutral-600);
+  }
+
+  .notification__actions {
+    margin-top: var(--sl-spacing-small);
+    display: flex;
+    gap: var(--sl-spacing-x-small);
+  }
+
+  .notification__close-button {
+    flex: 0 0 auto;
+    display: flex;
+    align-items: flex-start;
+    font-size: var(--sl-font-size-medium);
+    padding-inline-start: var(--sl-spacing-medium);
+  }
+
+  .notification__progress {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 3px;
+    background-color: var(--sl-color-neutral-200);
+  }
+
+  .notification__progress-bar {
+    height: 100%;
+    background-color: var(--sl-color-primary-600);
+    transition: width linear;
+  }
+
+  .notification--success .notification__progress-bar {
+    background-color: var(--sl-color-success-600);
+  }
+
+  .notification--info .notification__progress-bar {
+    background-color: var(--sl-color-primary-600);
+  }
+
+  .notification--warning .notification__progress-bar {
+    background-color: var(--sl-color-warning-600);
+  }
+
+  .notification--error .notification__progress-bar {
+    background-color: var(--sl-color-danger-600);
+  }
+`;
+
+export {
+  notification_styles_default
+};

package/dist/chunks/chunk.AUYJ3R5L.js

@@ -0,0 +1,119 @@
+import {
+  breadcrumb_item_styles_default
+} from "./chunk.Q5P7Y2HU.js";
+import {
+  HasSlotController
+} from "./chunk.NYIIDP5N.js";
+import {
+  watch
+} from "./chunk.55S3OOTM.js";
+import {
+  component_styles_default
+} from "./chunk.TUVJKY7S.js";
+import {
+  ShoelaceElement
+} from "./chunk.Z7SZHKVL.js";
+import {
+  __decorateClass
+} from "./chunk.W5KB6T3Z.js";
+
+// src/components/breadcrumb-item/breadcrumb-item.component.ts
+import { classMap } from "lit/directives/class-map.js";
+import { html } from "lit";
+import { ifDefined } from "lit/directives/if-defined.js";
+import { property, query, state } from "lit/decorators.js";
+var SlBreadcrumbItem = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.hasSlotController = new HasSlotController(this, "prefix", "suffix");
+    this.renderType = "button";
+    this.rel = "noreferrer noopener";
+  }
+  setRenderType() {
+    const hasDropdown = this.defaultSlot.assignedElements({ flatten: true }).filter((i) => i.tagName.toLowerCase() === "sl-dropdown").length > 0;
+    if (this.href) {
+      this.renderType = "link";
+      return;
+    }
+    if (hasDropdown) {
+      this.renderType = "dropdown";
+      return;
+    }
+    this.renderType = "button";
+  }
+  hrefChanged() {
+    this.setRenderType();
+  }
+  handleSlotChange() {
+    this.setRenderType();
+  }
+  render() {
+    return html`
+      <div
+        part="base"
+        class=${classMap({
+      "breadcrumb-item": true,
+      "breadcrumb-item--has-prefix": this.hasSlotController.test("prefix"),
+      "breadcrumb-item--has-suffix": this.hasSlotController.test("suffix")
+    })}
+      >
+        <span part="prefix" class="breadcrumb-item__prefix">
+          <slot name="prefix"></slot>
+        </span>
+
+        ${this.renderType === "link" ? html`
+              <a
+                part="label"
+                class="breadcrumb-item__label breadcrumb-item__label--link"
+                href="${this.href}"
+                target="${ifDefined(this.target ? this.target : void 0)}"
+                rel=${ifDefined(this.target ? this.rel : void 0)}
+              >
+                <slot @slotchange=${this.handleSlotChange}></slot>
+              </a>
+            ` : ""}
+        ${this.renderType === "button" ? html`
+              <button part="label" type="button" class="breadcrumb-item__label breadcrumb-item__label--button">
+                <slot @slotchange=${this.handleSlotChange}></slot>
+              </button>
+            ` : ""}
+        ${this.renderType === "dropdown" ? html`
+              <div part="label" class="breadcrumb-item__label breadcrumb-item__label--drop-down">
+                <slot @slotchange=${this.handleSlotChange}></slot>
+              </div>
+            ` : ""}
+
+        <span part="suffix" class="breadcrumb-item__suffix">
+          <slot name="suffix"></slot>
+        </span>
+
+        <span part="separator" class="breadcrumb-item__separator" aria-hidden="true">
+          <slot name="separator"></slot>
+        </span>
+      </div>
+    `;
+  }
+};
+SlBreadcrumbItem.styles = [component_styles_default, breadcrumb_item_styles_default];
+__decorateClass([
+  query("slot:not([name])")
+], SlBreadcrumbItem.prototype, "defaultSlot", 2);
+__decorateClass([
+  state()
+], SlBreadcrumbItem.prototype, "renderType", 2);
+__decorateClass([
+  property()
+], SlBreadcrumbItem.prototype, "href", 2);
+__decorateClass([
+  property()
+], SlBreadcrumbItem.prototype, "target", 2);
+__decorateClass([
+  property()
+], SlBreadcrumbItem.prototype, "rel", 2);
+__decorateClass([
+  watch("href", { waitUntilFirstUpdate: true })
+], SlBreadcrumbItem.prototype, "hrefChanged", 1);
+
+export {
+  SlBreadcrumbItem
+};

package/dist/chunks/chunk.AYPMDQP4.js

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

package/dist/chunks/chunk.AYQB67DR.js

@@ -0,0 +1,22 @@
+import {
+  menu_label_styles_default
+} from "./chunk.ORTZCIID.js";
+import {
+  component_styles_default
+} from "./chunk.TUVJKY7S.js";
+import {
+  ShoelaceElement
+} from "./chunk.Z7SZHKVL.js";
+
+// src/components/menu-label/menu-label.component.ts
+import { html } from "lit";
+var SlMenuLabel = class extends ShoelaceElement {
+  render() {
+    return html` <slot part="base" class="menu-label"></slot> `;
+  }
+};
+SlMenuLabel.styles = [component_styles_default, menu_label_styles_default];
+
+export {
+  SlMenuLabel
+};

package/dist/chunks/chunk.B2JZDFUO.js

@@ -0,0 +1,26 @@
+import {
+  SlAnimation
+} from "./chunk.QPWSWTXX.js";
+
+// src/react/animation/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "sl-animation";
+SlAnimation.define("sl-animation");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: SlAnimation,
+  react: React,
+  events: {
+    onSlCancel: "sl-cancel",
+    onSlFinish: "sl-finish",
+    onSlStart: "sl-start"
+  },
+  displayName: "SlAnimation"
+});
+var animation_default = reactWrapper;
+
+export {
+  animation_default
+};

package/dist/chunks/chunk.B3BXABSE.js

@@ -0,0 +1,87 @@
+import {
+  sender_switch_styles_default
+} from "./chunk.XNO7SHK6.js";
+import {
+  SlButton
+} from "./chunk.RLY5M6TS.js";
+import {
+  ShoelaceElement
+} from "./chunk.Z7SZHKVL.js";
+import {
+  __decorateClass
+} from "./chunk.W5KB6T3Z.js";
+
+// src/components/sender-switch/sender-switch.component.ts
+import { html, nothing } from "lit";
+import { property } from "lit/decorators.js";
+import { classMap } from "lit/directives/class-map.js";
+var SlSenderSwitch = class extends ShoelaceElement {
+  constructor() {
+    super(...arguments);
+    this.checked = false;
+    this.defaultChecked = false;
+    this.disabled = false;
+    this.loading = false;
+    this._hasSetChecked = false;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this._hasSetChecked && this.defaultChecked) {
+      this.checked = this.defaultChecked;
+    }
+  }
+  willUpdate(changedProperties) {
+    if (changedProperties.has("checked")) {
+      this._hasSetChecked = true;
+    }
+  }
+  handleClick() {
+    if (this.disabled || this.loading) return;
+    this.checked = !this.checked;
+    this.dispatchEvent(new CustomEvent("sl-change", {
+      detail: { checked: this.checked },
+      bubbles: true,
+      composed: true
+    }));
+  }
+  render() {
+    return html`
+      <sl-button
+        variant="outline"
+        class=${classMap({
+      "sender-switch": true,
+      "switch--checked": this.checked
+    })}
+        ?disabled=${this.disabled}
+        ?loading=${this.loading}
+        @click=${this.handleClick}
+        part="base"
+      >
+        <slot name="icon" slot="prefix"></slot>
+        ${this.checked ? html`<slot name="checked"></slot>` : nothing}
+        ${!this.checked ? html`<slot name="unchecked"></slot>` : nothing}
+        <slot></slot>
+      </sl-button>
+    `;
+  }
+};
+SlSenderSwitch.styles = [sender_switch_styles_default];
+SlSenderSwitch.dependencies = {
+  "sl-button": SlButton
+};
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], SlSenderSwitch.prototype, "checked", 2);
+__decorateClass([
+  property({ type: Boolean, attribute: "default-checked" })
+], SlSenderSwitch.prototype, "defaultChecked", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], SlSenderSwitch.prototype, "disabled", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], SlSenderSwitch.prototype, "loading", 2);
+
+export {
+  SlSenderSwitch
+};

package/dist/chunks/chunk.BEJZYUGC.js

@@ -0,0 +1,27 @@
+import {
+  SlNavSubmenu
+} from "./chunk.EWJJBKLI.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/dist/chunks/chunk.BKSWQESG.js

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

package/dist/chunks/chunk.BR2ESBQC.js

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