@uplynk/lynk-design 1.17.0 → 1.17.1

package/dist/chunks/chunk.CO4EITAI.js

@@ -1,26 +0,0 @@
-import {
-  LynkIconButton
-} from "./chunk.FUQRWH4B.js";
-
-// src/react/icon-button/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "lynk-icon-button";
-LynkIconButton.define("lynk-icon-button");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: LynkIconButton,
-  react: React,
-  events: {
-    EvBlur: "ev-blur",
-    EvClick: "ev-click",
-    EvFocus: "ev-focus"
-  },
-  displayName: "LynkIconButton"
-});
-var icon_button_default = reactWrapper;
-
-export {
-  icon_button_default
-};

package/dist/chunks/chunk.CRGPVEIO.js

@@ -1,27 +0,0 @@
-import {
-  LynkNavItem
-} from "./chunk.CUBNGVBO.js";
-
-// src/react/nav-item/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "lynk-nav-item";
-LynkNavItem.define("lynk-nav-item");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: LynkNavItem,
-  react: React,
-  events: {
-    EvExpand: "ev-expand",
-    EvAfterExpand: "ev-after-expand",
-    EvCollapse: "ev-collapse",
-    EvAfterCollapse: "ev-after-collapse"
-  },
-  displayName: "LynkNavItem"
-});
-var nav_item_default = reactWrapper;
-
-export {
-  nav_item_default
-};

package/dist/chunks/chunk.CTBTUVSH.js

@@ -1,11 +0,0 @@
-import {
-  LynkRadioButton
-} from "./chunk.QUWINMIJ.js";
-
-// src/components/radio-button/radio-button.ts
-var radio_button_default = LynkRadioButton;
-LynkRadioButton.define("lynk-radio-button");
-
-export {
-  radio_button_default
-};

package/dist/chunks/chunk.CUBNGVBO.js

@@ -1,343 +0,0 @@
-import {
-  nav_item_styles_default
-} from "./chunk.UWTQ2ABS.js";
-import {
-  LynkTooltip
-} from "./chunk.POMLEX4E.js";
-import {
-  animateTo,
-  shimKeyframesHeightAuto,
-  stopAnimations
-} from "./chunk.5SGOC3ZM.js";
-import {
-  getAnimation,
-  setDefaultAnimation
-} from "./chunk.SPWJX47D.js";
-import {
-  LocalizeController
-} from "./chunk.NJBJM2FD.js";
-import {
-  LynkIcon
-} from "./chunk.MFQRG6PF.js";
-import {
-  getTextContent
-} from "./chunk.OW5NIGGX.js";
-import {
-  watch
-} from "./chunk.GQZ7EGMM.js";
-import {
-  LynkElement
-} from "./chunk.V4JS4TJ7.js";
-import {
-  component_styles_default
-} from "./chunk.Y7724W4D.js";
-import {
-  __decorateClass
-} from "./chunk.Q44EX5TP.js";
-
-// src/components/nav-item/nav-item.component.ts
-import { classMap } from "lit/directives/class-map.js";
-import { html, literal } from "lit/static-html.js";
-import { ifDefined } from "lit/directives/if-defined.js";
-import { property, query, state } from "lit/decorators.js";
-var _LynkNavItem = class _LynkNavItem extends LynkElement {
-  constructor() {
-    super(...arguments);
-    this.localize = new LocalizeController(this);
-    this.childItems = [];
-    this.isParent = false;
-    this.isChild = false;
-    this.loading = false;
-    this.depth = 0;
-    this.squished = false;
-    this.title = "";
-    this.name = "";
-    this.value = "";
-    this.href = "";
-    this.selected = false;
-    this.expanded = false;
-    this.disabled = false;
-    this.noLabel = false;
-  }
-  static isTreeItem(node) {
-    return node instanceof Element && node.getAttribute("role") === "treeitem";
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.setAttribute("role", "treeitem");
-    this.setAttribute("tabindex", "-1");
-    if (this.isNestedItem()) {
-      this.slot = "children";
-      this.isChild = true;
-      this.depth = this.getDepth();
-    }
-  }
-  firstUpdated() {
-    if (this.childrenContainer) {
-      this.childrenContainer.hidden = !this.expanded;
-      this.childrenContainer.style.height = this.expanded ? "auto" : "0";
-    }
-    this.isParent = this.hasChildren;
-    this.handleExpandedChange();
-    this.handleSquished();
-  }
-  /** Simulates a click on the nav item. */
-  click() {
-    this.navItem.click();
-  }
-  async animateCollapse() {
-    this.emit("ev-collapse");
-    await stopAnimations(this.childrenContainer);
-    const { keyframes, options } = getAnimation(this, "nav-item.collapse", { dir: this.localize.dir() });
-    await animateTo(
-      this.childrenContainer,
-      shimKeyframesHeightAuto(keyframes, this.childrenContainer.scrollHeight),
-      options
-    );
-    this.childrenContainer.hidden = true;
-    this.emit("ev-after-collapse");
-  }
-  async animateExpand() {
-    this.emit("ev-expand");
-    await stopAnimations(this.childrenContainer);
-    this.childrenContainer.hidden = false;
-    const { keyframes, options } = getAnimation(this, "nav-item.expand", { dir: this.localize.dir() });
-    await animateTo(
-      this.childrenContainer,
-      shimKeyframesHeightAuto(keyframes, this.childrenContainer.scrollHeight),
-      options
-    );
-    this.childrenContainer.style.height = "auto";
-    this.emit("ev-after-expand");
-  }
-  // Checks whether the item is nested into an item
-  isNestedItem() {
-    const parent = this.parentElement;
-    return !!parent && _LynkNavItem.isTreeItem(parent);
-  }
-  handleChildrenSlotChange() {
-    this.childItems = this.getChildrenItems();
-    this.isParent = this.childItems.length > 0;
-  }
-  get hasChildren() {
-    return this.childItems.length > 0;
-  }
-  getDepth() {
-    let depth = 0;
-    let element = this.parentElement;
-    while (element instanceof _LynkNavItem) {
-      depth++;
-      element = element.parentElement;
-    }
-    return depth;
-  }
-  /** Returns a text label based on the contents of the menu item's default slot. */
-  getTextLabel() {
-    return getTextContent(this.defaultSlot);
-  }
-  handleDisabledChange() {
-    this.setAttribute("aria-disabled", this.disabled ? "true" : "false");
-  }
-  handleExpandedChange() {
-    if (this.hasChildren) {
-      this.setAttribute("aria-expanded", this.expanded ? "true" : "false");
-    } else {
-      this.removeAttribute("aria-expanded");
-    }
-  }
-  handleExpandAnimation() {
-    if (this.expanded) {
-      this.animateExpand();
-    } else {
-      this.animateCollapse();
-    }
-  }
-  handleSquished() {
-    if (this.squished) {
-      this.setAttribute("squished", this.squished ? "true" : "false");
-    } else {
-      this.removeAttribute("squished");
-    }
-  }
-  handleClick(event) {
-    if (this.disabled) {
-      event.preventDefault();
-      event.stopPropagation();
-      return;
-    }
-    if (this.hasChildren) {
-      this.expanded = !this.expanded;
-      event.stopPropagation();
-    }
-  }
-  handleDefaultSlotChange() {
-    const textLabel = this.getTextLabel();
-    if (typeof this.cachedTextLabel === "undefined") {
-      this.cachedTextLabel = textLabel;
-      return;
-    }
-    if (textLabel !== this.cachedTextLabel) {
-      this.cachedTextLabel = textLabel;
-      this.emit("slotchange", { bubbles: true, composed: false, cancelable: false });
-    }
-  }
-  /** Gets all the nested tree items in this node. */
-  getChildrenItems({ includeDisabled = true } = {}) {
-    return this.childrenSlot ? [...this.childrenSlot.assignedElements({ flatten: true })].filter(
-      (item) => _LynkNavItem.isTreeItem(item) && (includeDisabled || !item.disabled)
-    ) : [];
-  }
-  render() {
-    const isLink = Boolean(this.href);
-    const tag = isLink ? literal`a` : literal`button`;
-    const isRtl = this.localize.dir() === "rtl";
-    return html`
-      <${tag}
-        class=${classMap({
-      "nav-item": true,
-      "nav-item--disabled": this.disabled,
-      "nav-item--selected": this.selected,
-      "nav-item--has-children": this.isParent,
-      "nav-item--expanded": this.expanded,
-      "nav-item--squished": this.squished,
-      "nav-item--rtl": isRtl
-    })}
-        ?disabled=${this.disabled}
-        title=${this.title}
-        part="nav-item"
-        name=${ifDefined(isLink ? void 0 : this.name)}
-        value=${ifDefined(isLink ? void 0 : this.value)}
-        href=${ifDefined(isLink ? this.href : void 0)}
-        target=${ifDefined(isLink ? this.target : void 0)}
-        download=${ifDefined(isLink ? this.download : void 0)}
-        rel=${ifDefined(isLink && this.target ? "noreferrer noopener" : void 0)}
-        data-level=${this.depth}
-        aria-disabled=${this.disabled ? "true" : "false"}
-        @click=${this.handleClick}
-        tabindex="-1"
-        aria-current=${ifDefined(this.selected && this.href ? "page" : void 0)}
-      >
-        <slot name="prefix" part="prefix" class="nav-item__prefix"></slot>
-        <slot part="label" class="nav-item__label" @slotchange=${this.handleDefaultSlotChange}></slot>
-
-        <slot name="suffix" part="suffix" class="nav-item__suffix"></slot>
-
-        ${this.isParent ? html`
-                <span class="nav-item__chevron">
-                  <lynk-icon
-                    library="system"
-                    aria-hidden="true"
-                    name=${this.squished ? "chevron-down" : isRtl ? "chevron-left" : "chevron-right"}
-                  ></lynk-icon>
-                </span>
-              ` : ""}
-
-        ${this.target === "_blank" ? html`
-                <span class="nav-item__external">
-                  <lynk-icon library="system" aria-hidden="true" name="external"></lynk-icon>
-                </span>
-              ` : ""}
-
-      </${tag}>
-
-      <div
-        part="children"
-        class="nav-item__children"
-        role="group"
-        ?inert=${!this.expanded}
-      >
-        <slot name="children" @slotchange="${this.handleChildrenSlotChange}"></slot>
-      </div>
-    `;
-  }
-};
-_LynkNavItem.styles = [component_styles_default, nav_item_styles_default];
-_LynkNavItem.dependencies = { "lynk-icon": LynkIcon, "lynk-tooltip": LynkTooltip };
-__decorateClass([
-  state()
-], _LynkNavItem.prototype, "isParent", 2);
-__decorateClass([
-  state()
-], _LynkNavItem.prototype, "isChild", 2);
-__decorateClass([
-  state()
-], _LynkNavItem.prototype, "loading", 2);
-__decorateClass([
-  state()
-], _LynkNavItem.prototype, "depth", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], _LynkNavItem.prototype, "squished", 2);
-__decorateClass([
-  property()
-], _LynkNavItem.prototype, "title", 2);
-__decorateClass([
-  property()
-], _LynkNavItem.prototype, "name", 2);
-__decorateClass([
-  property()
-], _LynkNavItem.prototype, "value", 2);
-__decorateClass([
-  property()
-], _LynkNavItem.prototype, "href", 2);
-__decorateClass([
-  property()
-], _LynkNavItem.prototype, "target", 2);
-__decorateClass([
-  property()
-], _LynkNavItem.prototype, "download", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], _LynkNavItem.prototype, "selected", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], _LynkNavItem.prototype, "expanded", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], _LynkNavItem.prototype, "disabled", 2);
-__decorateClass([
-  property({ attribute: "no-label", type: Boolean, reflect: true })
-], _LynkNavItem.prototype, "noLabel", 2);
-__decorateClass([
-  query("slot:not([name])")
-], _LynkNavItem.prototype, "defaultSlot", 2);
-__decorateClass([
-  query("slot[name=children]")
-], _LynkNavItem.prototype, "childrenSlot", 2);
-__decorateClass([
-  query(".nav-item")
-], _LynkNavItem.prototype, "navItem", 2);
-__decorateClass([
-  query(".nav-item__children")
-], _LynkNavItem.prototype, "childrenContainer", 2);
-__decorateClass([
-  watch("disabled")
-], _LynkNavItem.prototype, "handleDisabledChange", 1);
-__decorateClass([
-  watch("expanded", { waitUntilFirstUpdate: true })
-], _LynkNavItem.prototype, "handleExpandedChange", 1);
-__decorateClass([
-  watch("expanded", { waitUntilFirstUpdate: true })
-], _LynkNavItem.prototype, "handleExpandAnimation", 1);
-__decorateClass([
-  watch("squished", { waitUntilFirstUpdate: true })
-], _LynkNavItem.prototype, "handleSquished", 1);
-var LynkNavItem = _LynkNavItem;
-setDefaultAnimation("nav-item.expand", {
-  keyframes: [
-    { height: "0", opacity: "0", overflow: "hidden" },
-    { height: "auto", opacity: "1", overflow: "hidden" }
-  ],
-  options: { duration: 250, easing: "cubic-bezier(0.4, 0.0, 0.2, 1)" }
-});
-setDefaultAnimation("nav-item.collapse", {
-  keyframes: [
-    { height: "auto", opacity: "1", overflow: "hidden" },
-    { height: "0", opacity: "0", overflow: "hidden" }
-  ],
-  options: { duration: 200, easing: "cubic-bezier(0.4, 0.0, 0.2, 1)" }
-});
-
-export {
-  LynkNavItem
-};

package/dist/chunks/chunk.CZT26PZB.js

@@ -1,28 +0,0 @@
-import {
-  LynkNumberInput
-} from "./chunk.KZ62GUTE.js";
-
-// src/react/number-input/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "lynk-number-input";
-LynkNumberInput.define("lynk-number-input");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: LynkNumberInput,
-  react: React,
-  events: {
-    EvBlur: "ev-blur",
-    EvChange: "ev-change",
-    EvFocus: "ev-focus",
-    EvInput: "ev-input",
-    EvInvalid: "ev-invalid"
-  },
-  displayName: "LynkNumberInput"
-});
-var number_input_default = reactWrapper;
-
-export {
-  number_input_default
-};

package/dist/chunks/chunk.D3FW4IOK.js

@@ -1,75 +0,0 @@
-import {
-  include_styles_default
-} from "./chunk.FY7IKLNL.js";
-import {
-  requestInclude
-} from "./chunk.XNEONNEJ.js";
-import {
-  watch
-} from "./chunk.GQZ7EGMM.js";
-import {
-  LynkElement
-} from "./chunk.V4JS4TJ7.js";
-import {
-  component_styles_default
-} from "./chunk.Y7724W4D.js";
-import {
-  __decorateClass
-} from "./chunk.Q44EX5TP.js";
-
-// src/components/include/include.component.ts
-import { html } from "lit";
-import { property } from "lit/decorators.js";
-var LynkInclude = class extends LynkElement {
-  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("ev-error", { detail: { status: file.status } });
-        return;
-      }
-      this.innerHTML = file.html;
-      if (this.allowScripts) {
-        [...this.querySelectorAll("script")].forEach((script) => this.executeScript(script));
-      }
-      this.emit("ev-load");
-    } catch (e) {
-      this.emit("ev-error", { detail: { status: -1 } });
-    }
-  }
-  render() {
-    return html`<slot></slot>`;
-  }
-};
-LynkInclude.styles = [component_styles_default, include_styles_default];
-__decorateClass([
-  property()
-], LynkInclude.prototype, "src", 2);
-__decorateClass([
-  property()
-], LynkInclude.prototype, "mode", 2);
-__decorateClass([
-  property({ attribute: "allow-scripts", type: Boolean })
-], LynkInclude.prototype, "allowScripts", 2);
-__decorateClass([
-  watch("src")
-], LynkInclude.prototype, "handleSrcChange", 1);
-
-export {
-  LynkInclude
-};

package/dist/chunks/chunk.D4GBXJDB.js

@@ -1,21 +0,0 @@
-import {
-  LynkTbody
-} from "./chunk.IYFHOK7T.js";
-
-// src/react/tbody/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-var tagName = "lynk-tbody";
-LynkTbody.define("lynk-tbody");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: LynkTbody,
-  react: React,
-  events: {},
-  displayName: "LynkTbody"
-});
-var tbody_default = reactWrapper;
-
-export {
-  tbody_default
-};

package/dist/chunks/chunk.DEWDIEWQ.js

@@ -1,11 +0,0 @@
-import {
-  LynkDropdown
-} from "./chunk.56FN6S3X.js";
-
-// src/components/dropdown/dropdown.ts
-var dropdown_default = LynkDropdown;
-LynkDropdown.define("lynk-dropdown");
-
-export {
-  dropdown_default
-};

package/dist/chunks/chunk.DH45TK4U.js

@@ -1,119 +0,0 @@
-import {
-  radio_styles_default
-} from "./chunk.3K5NR5DK.js";
-import {
-  LynkIcon
-} from "./chunk.MFQRG6PF.js";
-import {
-  watch
-} from "./chunk.GQZ7EGMM.js";
-import {
-  LynkElement
-} from "./chunk.V4JS4TJ7.js";
-import {
-  component_styles_default
-} from "./chunk.Y7724W4D.js";
-import {
-  __decorateClass
-} from "./chunk.Q44EX5TP.js";
-
-// src/components/radio/radio.component.ts
-import { html } from "lit";
-import { property, state } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-var LynkRadio = class extends LynkElement {
-  constructor() {
-    super();
-    this.checked = false;
-    this.hasFocus = false;
-    this.size = "medium";
-    this.disabled = false;
-    this.handleBlur = () => {
-      this.hasFocus = false;
-      this.emit("ev-blur");
-    };
-    this.handleClick = () => {
-      if (!this.disabled) {
-        const radioGroup = this.closest("lynk-radio-group");
-        if (radioGroup == null ? void 0 : radioGroup.readonly) {
-          return;
-        }
-        this.checked = true;
-      }
-    };
-    this.handleFocus = () => {
-      this.hasFocus = true;
-      this.emit("ev-focus");
-    };
-    this.addEventListener("blur", this.handleBlur);
-    this.addEventListener("click", this.handleClick);
-    this.addEventListener("focus", this.handleFocus);
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.setInitialAttributes();
-  }
-  setInitialAttributes() {
-    this.setAttribute("role", "radio");
-    this.setAttribute("tabindex", "-1");
-    this.setAttribute("aria-disabled", this.disabled ? "true" : "false");
-  }
-  handleCheckedChange() {
-    this.setAttribute("aria-checked", this.checked ? "true" : "false");
-    this.setAttribute("tabindex", this.checked ? "0" : "-1");
-  }
-  handleDisabledChange() {
-    this.setAttribute("aria-disabled", this.disabled ? "true" : "false");
-  }
-  render() {
-    return html`
-      <span
-        part="base"
-        class=${classMap({
-      radio: true,
-      "radio--checked": this.checked,
-      "radio--disabled": this.disabled,
-      "radio--focused": this.hasFocus,
-      "radio--small": this.size === "small",
-      "radio--medium": this.size === "medium",
-      "radio--large": this.size === "large"
-    })}
-      >
-        <span part="${`control${this.checked ? " control--checked" : ""}`}" class="radio__control">
-          ${this.checked ? html`
-                <lynk-icon part="checked-icon" class="radio__checked-icon" library="system" name="radio"></lynk-icon>
-              ` : ""}
-        </span>
-
-        <slot part="label" class="radio__label"></slot>
-      </span>
-    `;
-  }
-};
-LynkRadio.styles = [component_styles_default, radio_styles_default];
-LynkRadio.dependencies = { "lynk-icon": LynkIcon };
-__decorateClass([
-  state()
-], LynkRadio.prototype, "checked", 2);
-__decorateClass([
-  state()
-], LynkRadio.prototype, "hasFocus", 2);
-__decorateClass([
-  property()
-], LynkRadio.prototype, "value", 2);
-__decorateClass([
-  property({ reflect: true })
-], LynkRadio.prototype, "size", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], LynkRadio.prototype, "disabled", 2);
-__decorateClass([
-  watch("checked")
-], LynkRadio.prototype, "handleCheckedChange", 1);
-__decorateClass([
-  watch("disabled", { waitUntilFirstUpdate: true })
-], LynkRadio.prototype, "handleDisabledChange", 1);
-
-export {
-  LynkRadio
-};

package/dist/chunks/chunk.DHYXEUPH.js

@@ -1,28 +0,0 @@
-import {
-  LynkCheckbox
-} from "./chunk.X4L5M6UU.js";
-
-// src/react/checkbox/index.ts
-import * as React from "react";
-import { createComponent } from "@lit/react";
-import "@lit/react";
-var tagName = "lynk-checkbox";
-LynkCheckbox.define("lynk-checkbox");
-var reactWrapper = createComponent({
-  tagName,
-  elementClass: LynkCheckbox,
-  react: React,
-  events: {
-    EvBlur: "ev-blur",
-    EvChange: "ev-change",
-    EvFocus: "ev-focus",
-    EvInput: "ev-input",
-    EvInvalid: "ev-invalid"
-  },
-  displayName: "LynkCheckbox"
-});
-var checkbox_default = reactWrapper;
-
-export {
-  checkbox_default
-};