@uplynk/lynk-design 1.18.0 → 1.19.0

package/dist/chunks/chunk.FMCFL3TI.js

@@ -0,0 +1,119 @@
+import {
+  radio_styles_default
+} from "./chunk.DVUQCIVL.js";
+import {
+  LynkIcon
+} from "./chunk.6IL753TX.js";
+import {
+  watch
+} from "./chunk.GQZ7EGMM.js";
+import {
+  LynkElement
+} from "./chunk.QIMXY7MI.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.FSPFQ3GR.js

@@ -0,0 +1,11 @@
+import {
+  LynkResponsiveMedia
+} from "./chunk.M7EWHX76.js";
+
+// src/components/responsive-media/responsive-media.ts
+var responsive_media_default = LynkResponsiveMedia;
+LynkResponsiveMedia.define("lynk-responsive-media");
+
+export {
+  responsive_media_default
+};

package/dist/chunks/chunk.FX2ISN6I.js

@@ -0,0 +1,11 @@
+import {
+  LynkIcon
+} from "./chunk.6IL753TX.js";
+
+// src/components/icon/icon.ts
+var icon_default = LynkIcon;
+LynkIcon.define("lynk-icon");
+
+export {
+  icon_default
+};

package/dist/chunks/chunk.GCB3WIBH.js

@@ -0,0 +1,11 @@
+import {
+  LynkInput
+} from "./chunk.6XWHBHNA.js";
+
+// src/components/input/input.ts
+var input_default = LynkInput;
+LynkInput.define("lynk-input");
+
+export {
+  input_default
+};

package/dist/chunks/chunk.GCSYO5GI.js

@@ -0,0 +1,11 @@
+import {
+  LynkDialog
+} from "./chunk.WPSGUOBG.js";
+
+// src/components/dialog/dialog.ts
+var dialog_default = LynkDialog;
+LynkDialog.define("lynk-dialog");
+
+export {
+  dialog_default
+};

package/dist/chunks/chunk.GIPXR2BF.js

@@ -0,0 +1,27 @@
+import {
+  LynkAlert
+} from "./chunk.2MDPQZWP.js";
+
+// src/react/alert/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "lynk-alert";
+LynkAlert.define("lynk-alert");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: LynkAlert,
+  react: React,
+  events: {
+    EvShow: "ev-show",
+    EvAfterShow: "ev-after-show",
+    EvHide: "ev-hide",
+    EvAfterHide: "ev-after-hide"
+  },
+  displayName: "LynkAlert"
+});
+var alert_default = reactWrapper;
+
+export {
+  alert_default
+};

package/dist/chunks/chunk.GR62WYAF.js

@@ -0,0 +1,63 @@
+import {
+  tab_panel_styles_default
+} from "./chunk.BQSEJD7X.js";
+import {
+  watch
+} from "./chunk.GQZ7EGMM.js";
+import {
+  LynkElement
+} from "./chunk.QIMXY7MI.js";
+import {
+  component_styles_default
+} from "./chunk.Y7724W4D.js";
+import {
+  __decorateClass
+} from "./chunk.Q44EX5TP.js";
+
+// src/components/tab-panel/tab-panel.component.ts
+import { classMap } from "lit/directives/class-map.js";
+import { html } from "lit";
+import { property } from "lit/decorators.js";
+var id = 0;
+var LynkTabPanel = class extends LynkElement {
+  constructor() {
+    super(...arguments);
+    this.attrId = ++id;
+    this.componentId = `tab-panel-${this.attrId}`;
+    this.name = "";
+    this.active = false;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.id = this.id.length > 0 ? this.id : this.componentId;
+    this.setAttribute("role", "tabpanel");
+  }
+  handleActiveChange() {
+    this.setAttribute("aria-hidden", this.active ? "false" : "true");
+  }
+  render() {
+    return html`
+      <slot
+        part="base"
+        class=${classMap({
+      "tab-panel": true,
+      "tab-panel--active": this.active
+    })}
+      ></slot>
+    `;
+  }
+};
+LynkTabPanel.styles = [component_styles_default, tab_panel_styles_default];
+__decorateClass([
+  property({ reflect: true })
+], LynkTabPanel.prototype, "name", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], LynkTabPanel.prototype, "active", 2);
+__decorateClass([
+  watch("active")
+], LynkTabPanel.prototype, "handleActiveChange", 1);
+
+export {
+  LynkTabPanel
+};

package/dist/chunks/chunk.GSALFGH3.js

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

package/dist/chunks/chunk.GVP7FBL4.js

@@ -0,0 +1,21 @@
+import {
+  LynkFormatBytes
+} from "./chunk.7ZEOL46R.js";
+
+// src/react/format-bytes/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+var tagName = "lynk-format-bytes";
+LynkFormatBytes.define("lynk-format-bytes");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: LynkFormatBytes,
+  react: React,
+  events: {},
+  displayName: "LynkFormatBytes"
+});
+var format_bytes_default = reactWrapper;
+
+export {
+  format_bytes_default
+};

package/dist/chunks/chunk.GYFW2BRF.js

@@ -0,0 +1,11 @@
+import {
+  LynkPopup
+} from "./chunk.LVC7D3AP.js";
+
+// src/components/popup/popup.ts
+var popup_default = LynkPopup;
+LynkPopup.define("lynk-popup");
+
+export {
+  popup_default
+};

package/dist/chunks/chunk.GZT57ME5.js

@@ -0,0 +1,63 @@
+import {
+  th_styles_default
+} from "./chunk.B2F4ADSX.js";
+import {
+  LynkElement
+} from "./chunk.QIMXY7MI.js";
+import {
+  component_styles_default
+} from "./chunk.Y7724W4D.js";
+import {
+  __decorateClass
+} from "./chunk.Q44EX5TP.js";
+
+// src/components/th/th.component.ts
+import { html } from "lit";
+import { property } from "lit/decorators.js";
+var LynkTh = class extends LynkElement {
+  constructor() {
+    super(...arguments);
+    this.sortDirection = 0 /* NONE */;
+    this.sortable = false;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.handleClick);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("click", this.handleClick);
+  }
+  handleClick() {
+    if (this.sortable) {
+      this.emit("ev-table-sort", {
+        detail: {
+          key: this.key
+        }
+      });
+    }
+  }
+  render() {
+    return html`
+      <slot part="base" class="lynk-th__label"></slot>
+      ${this.sortable ? html`<lynk-icon
+              library="system"
+              name="${this.sortDirection === -1 /* ASC */ ? "arrow-up-short" : this.sortDirection === 1 /* DESC */ ? "arrow-down-short" : "arrow-up-down-short"}"
+            ></lynk-icon>` : ``}
+    `;
+  }
+};
+LynkTh.styles = [component_styles_default, th_styles_default];
+__decorateClass([
+  property()
+], LynkTh.prototype, "key", 2);
+__decorateClass([
+  property({ attribute: "sort-direction", reflect: true })
+], LynkTh.prototype, "sortDirection", 2);
+__decorateClass([
+  property({ attribute: "sortable", type: Boolean, reflect: true })
+], LynkTh.prototype, "sortable", 2);
+
+export {
+  LynkTh
+};

package/dist/chunks/chunk.H22OBTBJ.js

@@ -0,0 +1,11 @@
+import {
+  LynkBreadcrumbItem
+} from "./chunk.VCG6Z3P5.js";
+
+// src/components/breadcrumb-item/breadcrumb-item.ts
+var breadcrumb_item_default = LynkBreadcrumbItem;
+LynkBreadcrumbItem.define("lynk-breadcrumb-item");
+
+export {
+  breadcrumb_item_default
+};

package/dist/chunks/chunk.H5W5UA4C.js

@@ -0,0 +1,45 @@
+import {
+  splitter_pane_styles_default
+} from "./chunk.34TPN4FZ.js";
+import {
+  LynkElement
+} from "./chunk.QIMXY7MI.js";
+import {
+  component_styles_default
+} from "./chunk.Y7724W4D.js";
+import {
+  __decorateClass
+} from "./chunk.Q44EX5TP.js";
+
+// src/components/splitter-pane/splitter-pane.component.ts
+import { html } from "lit";
+import { property } from "lit/decorators.js";
+var LynkSplitterPane = class extends LynkElement {
+  /** Shows the pane by removing the hidden attribute. */
+  show() {
+    this.hidden = false;
+    this.emit("ev-show");
+  }
+  /** Hides the pane by setting the hidden attribute. */
+  hide() {
+    this.hidden = true;
+    this.emit("ev-hide");
+  }
+  render() {
+    return html` <slot part="base"></slot> `;
+  }
+};
+LynkSplitterPane.styles = [component_styles_default, splitter_pane_styles_default];
+__decorateClass([
+  property({ attribute: "min-size", reflect: true })
+], LynkSplitterPane.prototype, "minSize", 2);
+__decorateClass([
+  property({ attribute: "max-size", reflect: true })
+], LynkSplitterPane.prototype, "maxSize", 2);
+__decorateClass([
+  property({ reflect: true })
+], LynkSplitterPane.prototype, "size", 2);
+
+export {
+  LynkSplitterPane
+};

package/dist/chunks/chunk.H6SIRQOK.js

@@ -0,0 +1,28 @@
+import {
+  LynkCheckbox
+} from "./chunk.B2E7VS4E.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
+};

package/dist/chunks/chunk.H7JNPTTG.js

@@ -0,0 +1,75 @@
+import {
+  include_styles_default
+} from "./chunk.FY7IKLNL.js";
+import {
+  requestInclude
+} from "./chunk.XNEONNEJ.js";
+import {
+  watch
+} from "./chunk.GQZ7EGMM.js";
+import {
+  LynkElement
+} from "./chunk.QIMXY7MI.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.H7NBYMTD.js

@@ -0,0 +1,11 @@
+import {
+  LynkPopover
+} from "./chunk.UMBIVNN4.js";
+
+// src/components/popover/popover.ts
+var popover_default = LynkPopover;
+LynkPopover.define("lynk-popover");
+
+export {
+  popover_default
+};

package/dist/chunks/chunk.HDW3GDM7.js

@@ -0,0 +1,11 @@
+import {
+  LynkDatePicker
+} from "./chunk.BPSK6APF.js";
+
+// src/components/date-picker/date-picker.ts
+var date_picker_default = LynkDatePicker;
+LynkDatePicker.define("lynk-date-picker");
+
+export {
+  date_picker_default
+};

package/dist/chunks/chunk.HG4Y3RUF.js

@@ -0,0 +1,36 @@
+import {
+  td_styles_default
+} from "./chunk.UFMIOYLT.js";
+import {
+  LynkElement
+} from "./chunk.QIMXY7MI.js";
+import {
+  component_styles_default
+} from "./chunk.Y7724W4D.js";
+import {
+  __decorateClass
+} from "./chunk.Q44EX5TP.js";
+
+// src/components/td/td.component.ts
+import { html } from "lit";
+import { property } from "lit/decorators.js";
+var LynkTd = class extends LynkElement {
+  constructor() {
+    super(...arguments);
+    this.barberpole = false;
+  }
+  render() {
+    return html` <slot part="base"></slot> `;
+  }
+};
+LynkTd.styles = [component_styles_default, td_styles_default];
+__decorateClass([
+  property({ reflect: true })
+], LynkTd.prototype, "state", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], LynkTd.prototype, "barberpole", 2);
+
+export {
+  LynkTd
+};

package/dist/chunks/chunk.HIRM3O4M.js

@@ -0,0 +1,11 @@
+import {
+  LynkAnimation
+} from "./chunk.ZJROHF4A.js";
+
+// src/components/animation/animation.ts
+var animation_default = LynkAnimation;
+LynkAnimation.define("lynk-animation");
+
+export {
+  animation_default
+};

package/dist/chunks/chunk.HV5E25P4.js

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

package/dist/chunks/chunk.HWZPRQQV.js

@@ -0,0 +1,11 @@
+import {
+  LynkButtonGroup
+} from "./chunk.F6QKB32J.js";
+
+// src/components/button-group/button-group.ts
+var button_group_default = LynkButtonGroup;
+LynkButtonGroup.define("lynk-button-group");
+
+export {
+  button_group_default
+};

package/dist/chunks/chunk.I2XGQTLK.js

@@ -0,0 +1,11 @@
+import {
+  LynkFlank
+} from "./chunk.KQANV7X2.js";
+
+// src/components/flank/flank.ts
+var flank_default = LynkFlank;
+LynkFlank.define("lynk-flank");
+
+export {
+  flank_default
+};