@uplynk/lynk-design 1.14.0 → 1.16.0

package/dist/chunks/chunk.ESXOXRZQ.js

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

package/dist/chunks/chunk.ETBV6KBY.js

@@ -0,0 +1,11 @@
+import {
+  LynkGrid
+} from "./chunk.3BPJXY2B.js";
+
+// src/components/grid/grid.ts
+var grid_default = LynkGrid;
+LynkGrid.define("lynk-grid");
+
+export {
+  grid_default
+};

package/dist/chunks/chunk.EXDFICUF.js

@@ -0,0 +1,11 @@
+import {
+  LynkResponsiveMedia
+} from "./chunk.5RN46GEX.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.EXI5FVK4.js

@@ -0,0 +1,11 @@
+import {
+  LynkTag
+} from "./chunk.H4PNCV5I.js";
+
+// src/components/tag/tag.ts
+var tag_default = LynkTag;
+LynkTag.define("lynk-tag");
+
+export {
+  tag_default
+};

package/dist/chunks/chunk.F3DF44UQ.js

@@ -0,0 +1,25 @@
+import {
+  LynkCopyButton
+} from "./chunk.V7IXU2AE.js";
+
+// src/react/copy-button/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "lynk-copy-button";
+LynkCopyButton.define("lynk-copy-button");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: LynkCopyButton,
+  react: React,
+  events: {
+    EvCopy: "ev-copy",
+    EvError: "ev-error"
+  },
+  displayName: "LynkCopyButton"
+});
+var copy_button_default = reactWrapper;
+
+export {
+  copy_button_default
+};

package/dist/chunks/chunk.F4KO3DSX.js

@@ -0,0 +1,11 @@
+import {
+  LynkTabPanel
+} from "./chunk.4EXAGLMP.js";
+
+// src/components/tab-panel/tab-panel.ts
+var tab_panel_default = LynkTabPanel;
+LynkTabPanel.define("lynk-tab-panel");
+
+export {
+  tab_panel_default
+};

package/dist/chunks/chunk.F6WKTCBZ.js

@@ -0,0 +1,24 @@
+import {
+  LynkResizeObserver
+} from "./chunk.3G2V62XQ.js";
+
+// src/react/resize-observer/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "lynk-resize-observer";
+LynkResizeObserver.define("lynk-resize-observer");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: LynkResizeObserver,
+  react: React,
+  events: {
+    EvResize: "ev-resize"
+  },
+  displayName: "LynkResizeObserver"
+});
+var resize_observer_default = reactWrapper;
+
+export {
+  resize_observer_default
+};

package/dist/chunks/chunk.FFKKIIJ3.js

@@ -0,0 +1,21 @@
+import {
+  LynkPageFooter
+} from "./chunk.54MVU2NH.js";
+
+// src/react/page-footer/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+var tagName = "lynk-page-footer";
+LynkPageFooter.define("lynk-page-footer");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: LynkPageFooter,
+  react: React,
+  events: {},
+  displayName: "LynkPageFooter"
+});
+var page_footer_default = reactWrapper;
+
+export {
+  page_footer_default
+};

package/dist/chunks/chunk.FIHETKWW.js

@@ -0,0 +1,21 @@
+import {
+  LynkBreadcrumbItem
+} from "./chunk.4GIBBH35.js";
+
+// src/react/breadcrumb-item/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+var tagName = "lynk-breadcrumb-item";
+LynkBreadcrumbItem.define("lynk-breadcrumb-item");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: LynkBreadcrumbItem,
+  react: React,
+  events: {},
+  displayName: "LynkBreadcrumbItem"
+});
+var breadcrumb_item_default = reactWrapper;
+
+export {
+  breadcrumb_item_default
+};

package/dist/chunks/chunk.FIJ7TBPV.js

@@ -0,0 +1,11 @@
+import {
+  LynkScroller
+} from "./chunk.4JO75XJK.js";
+
+// src/components/scroller/scroller.ts
+var scroller_default = LynkScroller;
+LynkScroller.define("lynk-scroller");
+
+export {
+  scroller_default
+};

package/dist/chunks/chunk.FQHIEHQH.js

@@ -0,0 +1,11 @@
+import {
+  LynkFormatBytes
+} from "./chunk.24QOTLCK.js";
+
+// src/components/format-bytes/format-bytes.ts
+var format_bytes_default = LynkFormatBytes;
+LynkFormatBytes.define("lynk-format-bytes");
+
+export {
+  format_bytes_default
+};

package/dist/chunks/chunk.FZCDRNPQ.js

@@ -0,0 +1,24 @@
+import {
+  LynkTag
+} from "./chunk.H4PNCV5I.js";
+
+// src/react/tag/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "lynk-tag";
+LynkTag.define("lynk-tag");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: LynkTag,
+  react: React,
+  events: {
+    EvRemove: "ev-remove"
+  },
+  displayName: "LynkTag"
+});
+var tag_default = reactWrapper;
+
+export {
+  tag_default
+};

package/dist/chunks/chunk.G5FPCAXD.js

@@ -0,0 +1,11 @@
+import {
+  LynkRadioButton
+} from "./chunk.R6MW6HJ4.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.G7UU53TA.js

@@ -0,0 +1,11 @@
+import {
+  LynkPageFooter
+} from "./chunk.54MVU2NH.js";
+
+// src/components/page-footer/page-footer.ts
+var page_footer_default = LynkPageFooter;
+LynkPageFooter.define("lynk-page-footer");
+
+export {
+  page_footer_default
+};

package/dist/chunks/chunk.GKHHNNLX.js

@@ -0,0 +1,11 @@
+import {
+  LynkTd
+} from "./chunk.75RLDZNJ.js";
+
+// src/components/td/td.ts
+var td_default = LynkTd;
+LynkTd.define("lynk-td");
+
+export {
+  td_default
+};

package/dist/chunks/chunk.GOSC34OA.js

@@ -0,0 +1,122 @@
+import {
+  card_styles_default
+} from "./chunk.CGCCBBAZ.js";
+import {
+  HasSlotController
+} from "./chunk.OW5NIGGX.js";
+import {
+  LynkElement
+} from "./chunk.ZJ7UNN7B.js";
+import {
+  component_styles_default
+} from "./chunk.Y7724W4D.js";
+import {
+  __decorateClass
+} from "./chunk.Q44EX5TP.js";
+
+// src/components/card/card.component.ts
+import { classMap } from "lit/directives/class-map.js";
+import { html } from "lit";
+import { property } from "lit/decorators.js";
+var LynkCard = class extends LynkElement {
+  constructor() {
+    super(...arguments);
+    this.hasSlotController = new HasSlotController(
+      this,
+      "[default]",
+      "footer",
+      "header",
+      "image",
+      "image-top-start",
+      "image-top-end",
+      "image-bottom-start",
+      "image-bottom-end"
+    );
+    this.appearance = "outlined";
+    this.stealth = false;
+    this.size = "inherit";
+    this.interactive = false;
+    this.active = false;
+    this.pulse = false;
+    this.aspectRatio = "16:9";
+  }
+  render() {
+    const hasAnyImageSlot = this.hasSlotController.test("image") || this.hasSlotController.test("image-top-start") || this.hasSlotController.test("image-top-end") || this.hasSlotController.test("image-bottom-start") || this.hasSlotController.test("image-bottom-end");
+    const hasAnyContentSlot = this.hasSlotController.test("header") || this.hasSlotController.test("[default]") || this.hasSlotController.test("footer");
+    return html`
+      <div
+        part="base"
+        class=${classMap({
+      card: true,
+      // Modifiers
+      "card--interactive": this.interactive,
+      "card--active": this.active,
+      "card--stealth": this.stealth,
+      "card--pulse": this.pulse,
+      // States
+      "card--primary": this.state === "primary",
+      "card--accent": this.state === "accent",
+      "card--danger": this.state === "danger",
+      "card--success": this.state === "success",
+      "card--neutral": this.state === "neutral",
+      "card--warning": this.state === "warning",
+      "card--info": this.state === "info",
+      // Sizes
+      "card--small": this.size === "small",
+      "card--medium": this.size === "medium",
+      "card--large": this.size === "large",
+      // Slots
+      "card--has-footer": this.hasSlotController.test("footer"),
+      "card--has-image": this.hasSlotController.test("image"),
+      "card--has-header": this.hasSlotController.test("header"),
+      "card--image-only": hasAnyImageSlot && !hasAnyContentSlot
+    })}
+      >
+        ${hasAnyImageSlot ? html`
+              <div part="image-block" class="card__image-block ${`aspect--${this.aspectRatio.replace(/[:.]/g, "-")}`}">
+                <div part="image" class="card__image">
+                  <slot name="image"></slot>
+                </div>
+
+                <slot name="image-top-start" part="image-top-start" class="card__image-top-start"></slot>
+                <slot name="image-top-end" part="image-top-end" class="card__image-top-end"></slot>
+                <slot name="image-bottom-start" part="image-bottom-start" class="card__image-bottom-start"></slot>
+                <slot name="image-bottom-end" part="image-bottom-end" class="card__image-bottom-end"></slot>
+              </div>
+            ` : ""}
+        ${this.hasSlotController.test("header") ? html`<slot name="header" part="header" class="card__header"></slot>` : ""}
+        ${this.hasSlotController.test("[default]") ? html`<slot part="body" class="card__body"></slot>` : ""}
+        ${this.hasSlotController.test("footer") ? html`<slot name="footer" part="footer" class="card__footer"></slot>` : ""}
+      </div>
+    `;
+  }
+};
+LynkCard.styles = [component_styles_default, card_styles_default];
+__decorateClass([
+  property({ reflect: true })
+], LynkCard.prototype, "appearance", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], LynkCard.prototype, "stealth", 2);
+__decorateClass([
+  property({ reflect: true })
+], LynkCard.prototype, "size", 2);
+__decorateClass([
+  property({ reflect: true })
+], LynkCard.prototype, "state", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], LynkCard.prototype, "interactive", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], LynkCard.prototype, "active", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], LynkCard.prototype, "pulse", 2);
+__decorateClass([
+  property({ reflect: true, attribute: "aspect-ratio" })
+], LynkCard.prototype, "aspectRatio", 2);
+
+export {
+  LynkCard
+};

package/dist/chunks/chunk.GP3EH4PI.js

@@ -0,0 +1,62 @@
+import {
+  stack_styles_default
+} from "./chunk.L4ZUBGGA.js";
+import {
+  LynkElement
+} from "./chunk.ZJ7UNN7B.js";
+import {
+  component_styles_default
+} from "./chunk.Y7724W4D.js";
+import {
+  __decorateClass
+} from "./chunk.Q44EX5TP.js";
+
+// src/components/stack/stack.component.ts
+import { html } from "lit";
+import { property } from "lit/decorators.js";
+var LynkStack = class extends LynkElement {
+  constructor() {
+    super(...arguments);
+    this.row = false;
+    this.reverse = false;
+    this.wrap = false;
+    this.gap = "var(--lynk-spacing-small)";
+  }
+  get horizontal() {
+    return this.row;
+  }
+  set horizontal(value) {
+    this.row = value;
+    this.removeAttribute("horizontal");
+    if (value) this.setAttribute("row", "");
+  }
+  render() {
+    return html`<slot part="base" class="stack" style="--gap: ${this.gap};"></slot>`;
+  }
+};
+LynkStack.styles = [component_styles_default, stack_styles_default];
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], LynkStack.prototype, "row", 2);
+__decorateClass([
+  property({ type: Boolean, attribute: "horizontal" })
+], LynkStack.prototype, "horizontal", 1);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], LynkStack.prototype, "reverse", 2);
+__decorateClass([
+  property({ reflect: true })
+], LynkStack.prototype, "justify", 2);
+__decorateClass([
+  property({ reflect: true })
+], LynkStack.prototype, "align", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], LynkStack.prototype, "wrap", 2);
+__decorateClass([
+  property({ type: String, reflect: true })
+], LynkStack.prototype, "gap", 2);
+
+export {
+  LynkStack
+};

package/dist/chunks/chunk.GWC3JWJK.js

@@ -0,0 +1,26 @@
+import {
+  LynkTimePicker
+} from "./chunk.YOSONO27.js";
+
+// src/react/time-picker/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "lynk-time-picker";
+LynkTimePicker.define("lynk-time-picker");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: LynkTimePicker,
+  react: React,
+  events: {
+    EvChange: "ev-change",
+    EvInput: "ev-input",
+    EvClear: "ev-clear"
+  },
+  displayName: "LynkTimePicker"
+});
+var time_picker_default = reactWrapper;
+
+export {
+  time_picker_default
+};

package/dist/chunks/chunk.GZZLMO2R.js

@@ -0,0 +1,11 @@
+import {
+  LynkResizeObserver
+} from "./chunk.3G2V62XQ.js";
+
+// src/components/resize-observer/resize-observer.ts
+var resize_observer_default = LynkResizeObserver;
+LynkResizeObserver.define("lynk-resize-observer");
+
+export {
+  resize_observer_default
+};

package/dist/chunks/chunk.H3HK5ITQ.js

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

package/dist/chunks/chunk.H4PNCV5I.js

@@ -0,0 +1,118 @@
+import {
+  tag_styles_default
+} from "./chunk.CY2VNLLJ.js";
+import {
+  LynkIconButton
+} from "./chunk.RSJMTMRJ.js";
+import {
+  LocalizeController
+} from "./chunk.NJBJM2FD.js";
+import {
+  HasSlotController
+} from "./chunk.OW5NIGGX.js";
+import {
+  LynkElement
+} from "./chunk.ZJ7UNN7B.js";
+import {
+  component_styles_default
+} from "./chunk.Y7724W4D.js";
+import {
+  __decorateClass
+} from "./chunk.Q44EX5TP.js";
+
+// src/components/tag/tag.component.ts
+import { classMap } from "lit/directives/class-map.js";
+import { html } from "lit";
+import { property } from "lit/decorators.js";
+var LynkTag = class extends LynkElement {
+  constructor() {
+    super(...arguments);
+    this.hasSlotController = new HasSlotController(this, "prefix");
+    this.localize = new LocalizeController(this);
+    this.color = "default";
+    this.appearance = "outlined filled";
+    this.size = "medium";
+    this.pill = false;
+    this.removable = false;
+    this.pulse = false;
+  }
+  set type(value) {
+    this.color = value === "text" ? "default" : value;
+  }
+  get type() {
+    return this.color === "default" ? "text" : this.color;
+  }
+  set badge(value) {
+    if (value) {
+      this.appearance = "loud";
+    }
+  }
+  handleRemoveClick() {
+    this.emit("ev-remove");
+  }
+  render() {
+    return html`
+      <span
+        part="base"
+        class=${classMap({
+      tag: true,
+      // Sizes
+      "tag--tiny": this.size === "tiny",
+      "tag--small": this.size === "small",
+      "tag--medium": this.size === "medium",
+      "tag--large": this.size === "large",
+      // Modifiers
+      "tag--pill": this.pill,
+      "tag--pulse": this.pulse,
+      "tag--badge": this.badge,
+      "tag--removable": this.removable
+    })}
+      >
+        ${this.hasSlotController.test("prefix") ? html`<slot name="prefix" part="prefix" class="tag__prefix"></slot>` : ""}
+        <slot part="content" class="tag__content"></slot>
+
+        ${this.removable ? html`
+              <lynk-icon-button
+                part="remove-button"
+                exportparts="base:remove-button__base"
+                name="x"
+                library="system"
+                label=${this.localize.term("remove")}
+                class="tag__remove"
+                @click=${this.handleRemoveClick}
+              ></lynk-icon-button>
+            ` : ""}
+      </span>
+    `;
+  }
+};
+LynkTag.styles = [component_styles_default, tag_styles_default];
+LynkTag.dependencies = { "lynk-icon-button": LynkIconButton };
+__decorateClass([
+  property({ reflect: true })
+], LynkTag.prototype, "color", 2);
+__decorateClass([
+  property()
+], LynkTag.prototype, "type", 1);
+__decorateClass([
+  property({ reflect: true })
+], LynkTag.prototype, "appearance", 2);
+__decorateClass([
+  property({ reflect: true })
+], LynkTag.prototype, "size", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], LynkTag.prototype, "pill", 2);
+__decorateClass([
+  property({ type: Boolean })
+], LynkTag.prototype, "removable", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], LynkTag.prototype, "pulse", 2);
+__decorateClass([
+  property({ type: Boolean })
+], LynkTag.prototype, "badge", 1);
+
+export {
+  LynkTag
+};

package/dist/chunks/chunk.H62GSNEG.js

@@ -0,0 +1,30 @@
+import {
+  LynkInput
+} from "./chunk.IXUYLIDS.js";
+
+// src/react/input/index.ts
+import * as React from "react";
+import { createComponent } from "@lit/react";
+import "@lit/react";
+var tagName = "lynk-input";
+LynkInput.define("lynk-input");
+var reactWrapper = createComponent({
+  tagName,
+  elementClass: LynkInput,
+  react: React,
+  events: {
+    EvBlur: "ev-blur",
+    EvChange: "ev-change",
+    EvClear: "ev-clear",
+    EvEnter: "ev-enter",
+    EvFocus: "ev-focus",
+    EvInput: "ev-input",
+    EvInvalid: "ev-invalid"
+  },
+  displayName: "LynkInput"
+});
+var input_default = reactWrapper;
+
+export {
+  input_default
+};

package/dist/chunks/chunk.HC7DE2VL.js

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