@ds-autonomie/web-components 2.14.0 → 2.14.1

package/dist/chunks/chunk.2IQGSC6O.js

@@ -1,291 +0,0 @@
-import {
-  tooltip_styles_default
-} from "./chunk.UVGAHM33.js";
-import {
-  waitForEvent
-} from "./chunk.B4BZKR24.js";
-import {
-  animateTo,
-  parseDuration,
-  stopAnimations
-} from "./chunk.QBV4OLYE.js";
-import {
-  getAnimation,
-  setDefaultAnimation
-} from "./chunk.LRTTUCZP.js";
-import {
-  a11yWarning
-} from "./chunk.PWL7QCVG.js";
-import {
-  LocalizeController
-} from "./chunk.QY3AIGLE.js";
-import {
-  watch
-} from "./chunk.7627FYPL.js";
-import {
-  ShoelaceElement
-} from "./chunk.KPJCYT4S.js";
-import {
-  __decorateClass
-} from "./chunk.5GB6F3WA.js";
-
-// src/components/tooltip/tooltip.ts
-import { html } from "lit";
-import { customElement, property, query } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-var DSATooltip = class extends ShoelaceElement {
-  constructor() {
-    super(...arguments);
-    this.localize = new LocalizeController(this);
-    this.content = "";
-    this.placement = "top";
-    this.disabled = false;
-    this.distance = 8;
-    this.open = false;
-    this.skidding = 0;
-    this.trigger = "hover focus";
-    this.hoist = false;
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.handleBlur = this.handleBlur.bind(this);
-    this.handleClick = this.handleClick.bind(this);
-    this.handleFocus = this.handleFocus.bind(this);
-    this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);
-    this.handleMouseOver = this.handleMouseOver.bind(this);
-    this.handleMouseOut = this.handleMouseOut.bind(this);
-    this.updateComplete.then(() => {
-      this.addEventListener("blur", this.handleBlur, true);
-      this.addEventListener("focus", this.handleFocus, true);
-      this.addEventListener("click", this.handleClick);
-      this.addEventListener("mouseover", this.handleMouseOver);
-      this.addEventListener("mouseout", this.handleMouseOut);
-    });
-  }
-  firstUpdated() {
-    this.body.hidden = !this.open;
-    if (this.open) {
-      this.popup.active = true;
-      this.popup.reposition();
-    }
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    this.removeEventListener("blur", this.handleBlur, true);
-    this.removeEventListener("focus", this.handleFocus, true);
-    this.removeEventListener("click", this.handleClick);
-    this.removeEventListener("keydown", this.handleDocumentKeyDown);
-    this.removeEventListener("mouseover", this.handleMouseOver);
-    this.removeEventListener("mouseout", this.handleMouseOut);
-  }
-  handleBlur() {
-    if (this.hasTrigger("focus")) {
-      this.hide();
-    }
-  }
-  handleClick() {
-    if (this.hasTrigger("click")) {
-      if (this.open) {
-        this.hide();
-      } else {
-        this.show();
-      }
-    }
-  }
-  handleFocus() {
-    if (this.hasTrigger("focus")) {
-      this.show();
-    }
-  }
-  handleDocumentKeyDown(event) {
-    if (event.key === "Escape") {
-      event.stopPropagation();
-      this.hide();
-    }
-  }
-  handleMouseOver() {
-    if (this.hasTrigger("hover")) {
-      const delay = parseDuration(
-        getComputedStyle(this).getPropertyValue("--show-delay")
-      );
-      clearTimeout(this.hoverTimeout);
-      this.hoverTimeout = window.setTimeout(() => this.show(), delay);
-    }
-  }
-  handleMouseOut() {
-    if (this.hasTrigger("hover")) {
-      const delay = parseDuration(
-        getComputedStyle(this).getPropertyValue("--hide-delay")
-      );
-      clearTimeout(this.hoverTimeout);
-      this.hoverTimeout = window.setTimeout(() => this.hide(), delay);
-    }
-  }
-  hasTrigger(triggerType) {
-    const triggers = this.trigger.split(" ");
-    return triggers.includes(triggerType);
-  }
-  async handleOpenChange() {
-    if (this.open) {
-      if (this.disabled) {
-        return;
-      }
-      this.emit("dsa-show");
-      document.addEventListener("keydown", this.handleDocumentKeyDown);
-      await stopAnimations(this.body);
-      this.body.hidden = false;
-      this.popup.active = true;
-      const { keyframes, options } = getAnimation(this, "tooltip.show", {
-        dir: this.localize.dir()
-      });
-      await animateTo(this.popup.popup, keyframes, options);
-      this.popup.reposition();
-      this.emit("dsa-after-show");
-    } else {
-      this.emit("dsa-hide");
-      document.removeEventListener("keydown", this.handleDocumentKeyDown);
-      await stopAnimations(this.body);
-      const { keyframes, options } = getAnimation(this, "tooltip.hide", {
-        dir: this.localize.dir()
-      });
-      await animateTo(this.popup.popup, keyframes, options);
-      this.popup.active = false;
-      this.body.hidden = true;
-      this.emit("dsa-after-hide");
-    }
-  }
-  async handleOptionsChange() {
-    if (this.hasUpdated) {
-      await this.updateComplete;
-      this.popup.reposition();
-    }
-  }
-  handleDisabledChange() {
-    if (this.disabled && this.open) {
-      this.hide();
-    }
-  }
-  /** Shows the tooltip. */
-  async show() {
-    if (this.open) {
-      return void 0;
-    }
-    this.open = true;
-    return await waitForEvent(this, "dsa-after-show");
-  }
-  /** Hides the tooltip */
-  async hide() {
-    if (!this.open) {
-      return void 0;
-    }
-    this.open = false;
-    return await waitForEvent(this, "dsa-after-hide");
-  }
-  /** Automatically adds an accessible description to the trigger element */
-  handleDefaultSlotChange() {
-    const target = this.querySelector(
-      "dsa-button, dsa-icon-button, .tag__trigger"
-    );
-    target == null ? void 0 : target.setAttribute("description", this.content);
-    if (!target) {
-      a11yWarning(
-        "The target element of the tooltip (in its default slot) must be a dsa-button or dsa-icon-button."
-      );
-    }
-  }
-  render() {
-    return html`
-      <dsa-popup
-        part="base"
-        exportparts="
-          popup:base__popup,
-          arrow:base__arrow
-        "
-        class=${classMap({
-      tooltip: true,
-      "tooltip--open": this.open
-    })}
-        placement=${this.placement}
-        distance=${this.distance}
-        skidding=${this.skidding}
-        strategy=${this.hoist ? "fixed" : "absolute"}
-        flip
-        shift
-        arrow
-        hover-bridge
-      >
-        <slot slot="anchor" @slotchange=${this.handleDefaultSlotChange}></slot>
-
-        <div part="body" id="tooltip" class="tooltip__body" role="tooltip">
-          <slot name="content" aria-live=${this.open ? "polite" : "off"}
-            >${this.content}</slot
-          >
-        </div>
-      </dsa-popup>
-    `;
-  }
-};
-DSATooltip.styles = tooltip_styles_default;
-__decorateClass([
-  query("slot:not([name])")
-], DSATooltip.prototype, "defaultSlot", 2);
-__decorateClass([
-  query(".tooltip__body")
-], DSATooltip.prototype, "body", 2);
-__decorateClass([
-  query("dsa-popup")
-], DSATooltip.prototype, "popup", 2);
-__decorateClass([
-  property()
-], DSATooltip.prototype, "content", 2);
-__decorateClass([
-  property()
-], DSATooltip.prototype, "placement", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], DSATooltip.prototype, "disabled", 2);
-__decorateClass([
-  property({ type: Number })
-], DSATooltip.prototype, "distance", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], DSATooltip.prototype, "open", 2);
-__decorateClass([
-  property({ type: Number })
-], DSATooltip.prototype, "skidding", 2);
-__decorateClass([
-  property()
-], DSATooltip.prototype, "trigger", 2);
-__decorateClass([
-  property({ type: Boolean })
-], DSATooltip.prototype, "hoist", 2);
-__decorateClass([
-  watch("open", { waitUntilFirstUpdate: true })
-], DSATooltip.prototype, "handleOpenChange", 1);
-__decorateClass([
-  watch(["content", "distance", "hoist", "placement", "skidding"])
-], DSATooltip.prototype, "handleOptionsChange", 1);
-__decorateClass([
-  watch("disabled")
-], DSATooltip.prototype, "handleDisabledChange", 1);
-DSATooltip = __decorateClass([
-  customElement("dsa-tooltip")
-], DSATooltip);
-setDefaultAnimation("tooltip.show", {
-  keyframes: [
-    { opacity: 0, scale: 0.8 },
-    { opacity: 1, scale: 1 }
-  ],
-  options: { duration: 150, easing: "ease" }
-});
-setDefaultAnimation("tooltip.hide", {
-  keyframes: [
-    { opacity: 1, scale: 1 },
-    { opacity: 0, scale: 0.8 }
-  ],
-  options: { duration: 150, easing: "ease" }
-});
-
-export {
-  DSATooltip
-};

package/dist/chunks/chunk.2NY5MPRL.js

@@ -1,300 +0,0 @@
-import {
-  button_styles_default
-} from "./chunk.BIM3HNFI.js";
-import {
-  HasSlotController
-} from "./chunk.YIY5RM53.js";
-import {
-  a11yWarning
-} from "./chunk.PWL7QCVG.js";
-import {
-  watch
-} from "./chunk.7627FYPL.js";
-import {
-  ShoelaceElement
-} from "./chunk.KPJCYT4S.js";
-import {
-  __decorateClass
-} from "./chunk.5GB6F3WA.js";
-
-// src/internal/components/form-toggle-button/form-toggle-button.ts
-import { property, query } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-import { ifDefined } from "lit/directives/if-defined.js";
-import { html } from "lit/static-html.js";
-
-// src/internal/components/form-toggle-button/form-toggle-button.styles.ts
-import { css } from "lit";
-var form_toggle_button_styles_default = css`
-  ${button_styles_default}
-
-  .button__prefix,
-  .button__suffix {
-    display: inline-flex;
-    position: relative;
-    align-items: center;
-  }
-
-  .button--toggle {
-    display: inline-flex;
-    align-items: center;
-    justify-content: start;
-    background-color: var(--dsa-wc-toggle-button-background-color);
-    border-color: var(--dsa-wc-toggle-button-border-color);
-    color: var(--dsa-wc-toggle-button-color);
-    border-width: 1px;
-    border-style: solid;
-    font-weight: 400;
-    height: auto;
-    white-space: normal;
-    text-align: left;
-    line-height: 130%;
-  }
-  .button--toggle.button--small {
-    min-height: var(--dsa-wc-form-input-height-small);
-  }
-  .button--toggle.button--medium {
-    min-height: var(--dsa-wc-form-input-height);
-  }
-  .button--toggle.button--large {
-    min-height: var(--dsa-wc-form-input-height-large);
-  }
-  .button--toggle.button--small .button__label {
-    padding-block: 4px;
-  }
-  .button--toggle.button--medium .button__label {
-    padding-block: 8px;
-  }
-  .button--toggle.button--large .button__label {
-    padding-block: 10px;
-  }
-
-  .button--toggle:hover {
-    background-color: var(--dsa-wc-toggle-button-hover-background-color);
-    border-color: var(--dsa-wc-toggle-button-hover-border-color);
-    color: var(--dsa-wc-toggle-button-hover-color);
-  }
-
-  .button--toggle:active {
-    background-color: var(--dsa-wc-toggle-button-active-background-color);
-    border-color: var(--dsa-wc-toggle-button-active-border-color);
-    color: var(--dsa-wc-toggle-button-active-color);
-  }
-
-  .button--toggle.button--checked {
-    background-color: var(--dsa-wc-toggle-button-checked-background-color);
-    border-color: var(--dsa-wc-toggle-button-checked-border-color);
-    color: var(--dsa-wc-toggle-button-checked-color);
-  }
-  .button--toggle:hover.button--checked {
-    background-color: var(
-      --dsa-wc-toggle-button-checked-hover-background-color
-    );
-    border-color: var(--dsa-wc-toggle-button-checked-hover-border-color);
-    color: var(--dsa-wc-toggle-button-checked-hover-color);
-  }
-  .button--toggle:active.button--checked {
-    background-color: var(
-      --dsa-wc-toggle-button-checked-active-background-color
-    );
-    border-color: var(--dsa-wc-toggle-button-checked-active-border-color);
-    color: var(--dsa-wc-toggle-button-checked-active-color);
-  }
-
-  .button--readonly,
-  .button--disabled {
-    pointer-events: none;
-  }
-
-  .button--toggle.button--readonly {
-    background-color: var(--dsa-wc-toggle-button-read-only-background-color);
-    border-color: var(--dsa-wc-toggle-button-read-only-border-color);
-    color: var(--dsa-wc-toggle-button-read-only-color);
-    padding-left: var(--dsa-wc-toggle-button-icon-padding-x);
-    cursor: not-allowed;
-  }
-  .button--toggle.button--checked.button--readonly {
-    background-color: var(
-      --dsa-wc-toggle-button-read-only-checked-background-color
-    );
-    border-color: var(--dsa-wc-toggle-button-read-only-checked-border-color);
-    color: var(--dsa-wc-toggle-button-read-only-checked-color);
-  }
-
-  .button--toggle.button--disabled {
-    opacity: 0.5;
-    background-color: var(--dsa-wc-toggle-button-disabled-background-color);
-    border-color: var(--dsa-wc-toggle-button-disabled-border-color);
-    color: var(--dsa-wc-toggle-button-disabled-color);
-  }
-
-  .button--toggle .button__icon-readonly {
-    margin-inline-end: var(--dsa-wc-toggle-button-icon-spacing);
-    flex-shrink: 0;
-  }
-
-  .button--error {
-    background-color: var(--dsa-wc-toggle-button-error-background-color);
-    border-color: var(--dsa-wc-toggle-button-error-border-color);
-    color: var(--dsa-wc-toggle-button-error-color);
-  }
-
-  @media (forced-colors: active) {
-    .button--toggle.button--checked {
-      border-style: double;
-      border-width: medium;
-    }
-  }
-
-  /*
-  * Checkbox specifics
-  */
-  .button--toggle.button--checkbox.button--checked {
-    padding-right: var(--dsa-wc-toggle-button-icon-padding-x);
-  }
-  .button--checkbox .button__icon-check {
-    padding-inline-start: var(--dsa-wc-toggle-button-icon-spacing);
-    flex-shrink: 0;
-    margin-inline-start: auto;
-  }
-
-  /* Add padding to keep check icon space if in vertical checkbox-group */
-  .button--checkbox.button--small:not(.button--checked) .button__label {
-    padding-right: 22px;
-  }
-  .button--checkbox.button--medium:not(.button--checked) .button__label {
-    padding-right: 20px;
-  }
-  .button--checkbox.button--large:not(.button--checked) .button__label {
-    padding-right: 24px;
-  }
-`;
-
-// src/internal/components/form-toggle-button/form-toggle-button.ts
-var FormToggleButton = class extends ShoelaceElement {
-  constructor() {
-    super(...arguments);
-    this.hasSlotController = new HasSlotController(this, "[default]");
-    this.checked = false;
-    this.parentDisabled = false;
-    this.disabled = false;
-    this.size = "medium";
-    this.parentReadonly = false;
-    this.readonly = false;
-    this.error = false;
-  }
-  handleClick() {
-  }
-  handleBlur() {
-    this.emit("dsa-blur");
-  }
-  handleFocus() {
-    this.emit("dsa-focus");
-  }
-  handleDeactivatedChange() {
-    if (this.readonly || this.parentReadonly) {
-      this.button.setAttribute("aria-disabled", "true");
-    } else {
-      this.button.removeAttribute("aria-disabled");
-    }
-  }
-  /** Sets focus on the radio button. */
-  focus(options) {
-    this.button.focus(options);
-  }
-  /** Removes focus from the radio button. */
-  blur() {
-    this.button.blur();
-  }
-  render() {
-    const isDisabled = this.disabled || this.parentDisabled;
-    const isReadonly = this.readonly || this.parentReadonly;
-    if (!this.hasSlotController.test("[default]")) {
-      a11yWarning(
-        `<dsa-${this.type}-card> requires an accessible name in the default slot for accessibility`
-      );
-    }
-    return html`
-      <div part="base">
-        <button
-          part="${`button${this.checked ? " button--checked" : ""}`}"
-          role=${this.type}
-          aria-checked="${this.checked}"
-          class=${classMap({
-      button: true,
-      "button--on-base": true,
-      "button--toggle": true,
-      "button--small": this.size === "small",
-      "button--medium": this.size === "medium",
-      "button--large": this.size === "large",
-      "button--checked": this.checked,
-      "button--readonly": isReadonly,
-      "button--disabled": isDisabled,
-      "button--error": this.error,
-      "button--checkbox": this.type === "checkbox"
-    })}
-          ?disabled=${isDisabled}
-          aria-disabled=${ifDefined(isReadonly ? "true" : void 0)}
-          aria-invalid=${ifDefined(
-      this.type === "checkbox" && this.error ? "true" : void 0
-    )}
-          type="button"
-          value=${ifDefined(this.value)}
-          @blur=${this.handleBlur}
-          @focus=${this.handleFocus}
-          @click=${this.handleClick}
-          title="${this.innerText}"
-        >
-          ${isReadonly ? html`<dsa-icon
-                name="lock"
-                library="system"
-                class="button__icon-readonly"
-              ></dsa-icon>` : ""}
-          <slot part="label" class="button__label"></slot>
-          ${this.type === "checkbox" && this.checked ? html`<dsa-icon
-                name="check"
-                library="system"
-                class="button__icon-check"
-              ></dsa-icon>` : ""}
-        </button>
-      </div>
-    `;
-  }
-};
-FormToggleButton.styles = form_toggle_button_styles_default;
-__decorateClass([
-  query(".button")
-], FormToggleButton.prototype, "button", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], FormToggleButton.prototype, "checked", 2);
-__decorateClass([
-  property()
-], FormToggleButton.prototype, "value", 2);
-__decorateClass([
-  property({ type: Boolean })
-], FormToggleButton.prototype, "parentDisabled", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], FormToggleButton.prototype, "disabled", 2);
-__decorateClass([
-  property({ reflect: true })
-], FormToggleButton.prototype, "size", 2);
-__decorateClass([
-  property({ type: Boolean })
-], FormToggleButton.prototype, "parentReadonly", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], FormToggleButton.prototype, "readonly", 2);
-__decorateClass([
-  property({ type: Boolean })
-], FormToggleButton.prototype, "error", 2);
-__decorateClass([
-  watch(["disabled", "readonly", "parentDisabled", "parentReadonly"], {
-    waitUntilFirstUpdate: true
-  })
-], FormToggleButton.prototype, "handleDeactivatedChange", 1);
-
-export {
-  FormToggleButton
-};

package/dist/chunks/chunk.2OOQ2NCR.js

@@ -1,109 +0,0 @@
-import {
-  breadcrumb_item_styles_default
-} from "./chunk.AKYLOFUZ.js";
-import {
-  HasSlotController
-} from "./chunk.YIY5RM53.js";
-import {
-  LocalizeController
-} from "./chunk.QY3AIGLE.js";
-import {
-  ShoelaceElement
-} from "./chunk.KPJCYT4S.js";
-import {
-  __decorateClass
-} from "./chunk.5GB6F3WA.js";
-
-// src/components/breadcrumb-item/breadcrumb-item.ts
-import { html } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-import { ifDefined } from "lit/directives/if-defined.js";
-var DSABreadcrumbItem = class extends ShoelaceElement {
-  constructor() {
-    super(...arguments);
-    this.localize = new LocalizeController(this);
-    this.hasSlotController = new HasSlotController(
-      this,
-      "prefix",
-      "suffix"
-    );
-    this.rel = "noreferrer noopener";
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    if (!this.hasAttribute("role")) {
-      this.setAttribute("role", "listitem");
-    }
-  }
-  render() {
-    const isLink = this.href ? true : false;
-    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")
-    })}
-      >
-        <slot
-          name="prefix"
-          part="prefix"
-          class="breadcrumb-item__prefix"
-        ></slot>
-
-        ${isLink ? html`
-              <a
-                part="label"
-                class="breadcrumb-item__label"
-                href="${this.href}"
-                target="${ifDefined(this.target ? this.target : void 0)}"
-                rel=${ifDefined(this.target ? this.rel : void 0)}
-              >
-                <slot></slot>
-              </a>
-            ` : html`
-              <button
-                role="link"
-                part="label"
-                type="button"
-                class="breadcrumb-item__label"
-              >
-                <slot></slot>
-              </button>
-            `}
-
-        <slot
-          name="suffix"
-          part="suffix"
-          class="breadcrumb-item__suffix"
-        ></slot>
-
-        <dsa-icon
-          class="breadcrumb-item__separator"
-          aria-hidden="true"
-          name=${this.localize.dir() === "rtl" ? "keyboard_arrow_left" : "keyboard_arrow_right"}
-          library="system"
-        ></dsa-icon>
-      </div>
-    `;
-  }
-};
-DSABreadcrumbItem.styles = breadcrumb_item_styles_default;
-__decorateClass([
-  property()
-], DSABreadcrumbItem.prototype, "href", 2);
-__decorateClass([
-  property()
-], DSABreadcrumbItem.prototype, "target", 2);
-__decorateClass([
-  property()
-], DSABreadcrumbItem.prototype, "rel", 2);
-DSABreadcrumbItem = __decorateClass([
-  customElement("dsa-breadcrumb-item")
-], DSABreadcrumbItem);
-
-export {
-  DSABreadcrumbItem
-};