@orangelogic/design-system 2.78.0 → 2.79.0

package/library/chunks/iframe.CNEyWhcM.js

@@ -1,160 +0,0 @@
-import { n as r, C as d } from "./lib-cortex-element.CVMmyPMC.js";
-import { c as h } from "./component.styles.DMSLciL5.js";
-import { c as y } from "./custom-element.L4WJXn1j.js";
-import { L as u } from "./i18n.BUW7B9hr.js";
-import { w as g } from "./watch.BCJD77bD.js";
-import { i as v, x as p } from "./lit-element.jLBm65_O.js";
-import { e as b } from "./query.BBf1UFkC.js";
-import { e as x } from "./class-map.BiVq-cVR.js";
-import { o as f } from "./if-defined.BRoBj_Rp.js";
-import { n as w } from "./when.Dr1es41R.js";
-var m = /* @__PURE__ */ ((o) => (o.Eager = "eager", o.Lazy = "lazy", o))(m || {});
-const _ = v`
-  :host {
-    --background-color: #f5f5f5;
-
-    display: block;
-    width: 100%;
-    height: var(--height, 500px);
-    isolation: isolate;
-  }
-
-  .iframe {
-    position: relative;
-    display: block;
-    height: 100%;
-    width: 100%;
-  }
-
-  .iframe--empty::before {
-    align-items: center;
-    background-color: #000000;
-    color: #ffffff;
-    content: attr(data-empty-text);
-    display: flex;
-    font-family: var(--cx-font-sans);
-    font-size: var(--cx-font-size-large);
-    font-weight: var(--cx-font-weight-semibold);
-    height: 100%;
-    justify-content: center;
-    line-height: 1;
-    position: absolute;
-    text-align: center;
-    text-shadow: 0.05em 0.05em 0.1em #000;
-    vertical-align: middle;
-    width: 100%;
-    z-index: 1;
-  }
-
-  .iframe__overlay {
-    background-color: transparent;
-    display: none;
-    height: 100%;
-    left: 0;
-    position: absolute;
-    top: 0;
-    width: 100%;
-    z-index: 1;
-  }
-
-  .iframe__view {
-    background-color: var(--background-color);
-    border-radius: var(--cx-border-radius-small);
-    border: none;
-    display: block;
-    height: 100%;
-    width: 100%;
-  }
-
-  .iframe__spinner {
-    --track-width: 6px;
-
-    font-size: 4rem;
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    z-index: 2;
-  }
-`;
-var z = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, t = (o, a, l, s) => {
-  for (var i = s > 1 ? void 0 : s ? $(a, l) : a, n = o.length - 1, c; n >= 0; n--)
-    (c = o[n]) && (i = (s ? c(a, l, i) : c(i)) || i);
-  return s && i && z(a, l, i), i;
-};
-let e = class extends d {
-  constructor() {
-    super(...arguments), this.localize = new u(this), this.src = "", this.iframeTitle = "Embedded content", this.iframeLoading = m.Lazy, this.allow = "", this.sandbox = "", this.referrerPolicy = "", this.canFullscreen = !1, this.loading = !1;
-  }
-  async handleCanFullscreenChange() {
-    await this.updateComplete, this.iframe && (this.iframe.src = "", this.iframe.src = this.src);
-  }
-  render() {
-    return p`
-      <div
-        part="base"
-        data-empty-text=${this.localize.term("noSourceUrlProvided")}
-        class=${x({
-      iframe: !0,
-      "iframe--empty": !this.src && !this.loading
-    })}
-      >
-        ${w(
-      this.loading,
-      () => p`<cx-spinner class="iframe__spinner"></cx-spinner>`
-    )}
-        <div part="overlay" class="iframe__overlay" aria-hidden="true"></div>
-        <iframe
-          part="view"
-          class="iframe__view"
-          allow=${f(this.allow || void 0)}
-          loading=${this.iframeLoading}
-          referrerpolicy=${f(this.referrerPolicy || void 0)}
-          sandbox=${f(this.sandbox || void 0)}
-          src=${this.src}
-          title=${this.iframeTitle}
-          ?allowfullscreen=${this.canFullscreen}
-        ></iframe>
-      </div>
-    `;
-  }
-};
-e.styles = [h, _];
-e.dependencies = {};
-t([
-  b("iframe")
-], e.prototype, "iframe", 2);
-t([
-  r({ reflect: !0, type: String })
-], e.prototype, "src", 2);
-t([
-  r({ attribute: "iframe-title", reflect: !0, type: String })
-], e.prototype, "iframeTitle", 2);
-t([
-  r({ attribute: "iframe-loading", reflect: !0, type: String })
-], e.prototype, "iframeLoading", 2);
-t([
-  r({ reflect: !0, type: String })
-], e.prototype, "allow", 2);
-t([
-  r({ reflect: !0, type: String })
-], e.prototype, "sandbox", 2);
-t([
-  r({ attribute: "referrer-policy", reflect: !0, type: String })
-], e.prototype, "referrerPolicy", 2);
-t([
-  r({ attribute: "can-fullscreen", reflect: !0, type: Boolean })
-], e.prototype, "canFullscreen", 2);
-t([
-  r({ reflect: !0, type: Boolean })
-], e.prototype, "loading", 2);
-t([
-  g("canFullscreen")
-], e.prototype, "handleCanFullscreenChange", 1);
-e = t([
-  y("cx-iframe")
-], e);
-export {
-  e as C,
-  m as a
-};

package/library/chunks/option.Csqefux_.js

@@ -1,296 +0,0 @@
-import { n as s, C as x } from "./lib-cortex-element.CVMmyPMC.js";
-import { c as m } from "./component.styles.DMSLciL5.js";
-import { c as v } from "./custom-element.L4WJXn1j.js";
-import { L as g } from "./i18n.BUW7B9hr.js";
-import { w as d } from "./watch.BCJD77bD.js";
-import { i as b, x as h } from "./lit-element.jLBm65_O.js";
-import { r as f } from "./state.CSDxrqLd.js";
-import { e as _ } from "./query.BBf1UFkC.js";
-import { e as y } from "./class-map.BiVq-cVR.js";
-import { n as u } from "./when.Dr1es41R.js";
-import k from "../components/icon.js";
-import w from "../components/space.js";
-var r = /* @__PURE__ */ ((t) => (t.Left = "left", t.Right = "right", t))(r || {});
-const C = b`
-  :host {
-    display: block;
-    user-select: none;
-    -webkit-user-select: none;
-  }
-
-  :host(:focus) {
-    outline: none;
-  }
-
-  .option {
-    position: relative;
-    display: flex;
-    align-items: center;
-    font-family: var(--cx-font-sans);
-    font-size: var(--cx-font-size-small);
-    font-weight: var(--option-font-weight, var(--cx-font-weight-regular));
-    line-height: var(--cx-line-height-large);
-    letter-spacing: var(--cx-letter-spacing-normal);
-    color: var(--option-color, var(--cx-color-neutral-700));
-    padding: var(--cx-spacing-x-small) var(--cx-spacing-medium)
-      var(--cx-spacing-x-small) var(--cx-spacing-x-small);
-    transition: var(--cx-transition-fast) fill;
-    cursor: pointer;
-  }
-
-  .option:not(.option--show-check) {
-    padding-inline: var(--cx-spacing-small);
-  }
-
-  .option--hover:not(.option--current):not(.option--disabled) {
-    background-color: var(--cx-menu-item-background-color-hover);
-  }
-
-  .option--current,
-  .option--current.option--disabled {
-    background-color: var(--cx-menu-item-background-color-hover);
-    opacity: 1;
-  }
-
-  .option--selected {
-    color: var(--option-selected-color, var(--cx-color-primary));
-    font-weight: var(
-      --option-selected-font-weight,
-      var(--cx-font-weight-regular)
-    );
-  }
-
-  .option--disabled {
-    outline: none;
-    opacity: 0.5;
-    cursor: default;
-  }
-
-  .option__content {
-    flex: 1;
-  }
-
-  .option__label {
-    flex: 1 1 auto;
-    display: inline-block;
-    line-height: var(--cx-line-height-medium);
-  }
-
-  .option .option__check {
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    visibility: hidden;
-    padding-inline-end: var(--cx-spacing-2x-small);
-    display: none;
-  }
-
-  .option--show-check .option__check {
-    display: block;
-  }
-
-  .option--show-check.option--selected .option__check {
-    visibility: visible;
-  }
-
-  .option__help-text {
-    color: var(--option-help-text-color, var(--cx-color-neutral-600));
-    font-weight: var(
-      --option-help-text-font-weight,
-      var(--cx-font-weight-regular)
-    );
-  }
-
-  .option--selected .option__content .option__help-text {
-    color: var(--option-selected-help-text-color, var(--cx-color-primary));
-    font-weight: var(
-      --option-selected-help-text-font-weight,
-      var(--cx-font-weight-regular)
-    );
-  }
-
-  .option__prefix,
-  .option__suffix {
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-  }
-
-  .option__prefix::slotted(*) {
-    margin-inline-end: var(--cx-spacing-x-small);
-  }
-
-  .option__suffix::slotted(*) {
-    margin-inline-start: var(--cx-spacing-x-small);
-  }
-
-  .option__prefix {
-    align-self: var(--prefix-alignment, center);
-  }
-
-  .option__suffix {
-    align-self: var(--suffix-alignment, center);
-  }
-
-  .option__check {
-    align-self: var(--check-alignment, center);
-  }
-
-  @media (forced-colors: active) {
-    :host(:hover:not([aria-disabled='true'])) .option {
-      outline: dashed 1px SelectedItem;
-      outline-offset: -1px;
-    }
-  }
-`;
-var L = Object.defineProperty, E = Object.getOwnPropertyDescriptor, o = (t, a, i, l) => {
-  for (var n = l > 1 ? void 0 : l ? E(a, i) : a, c = t.length - 1, p; c >= 0; c--)
-    (p = t[c]) && (n = (l ? p(a, i, n) : p(n)) || n);
-  return l && n && L(a, i, n), n;
-};
-let e = class extends x {
-  constructor() {
-    super(...arguments), this.localize = new g(this), this.current = !1, this.selected = !1, this.hasHover = !1, this.value = "", this.disabled = !1, this.showCheck = !1, this.checkPlacement = r.Left;
-  }
-  connectedCallback() {
-    super.connectedCallback(), this.setAttribute("role", "option"), this.setAttribute("aria-selected", "false");
-  }
-  handleDefaultSlotChange() {
-    const t = this.getTextLabel();
-    if (typeof this.cachedTextLabel > "u") {
-      this.cachedTextLabel = t;
-      return;
-    }
-    t !== this.cachedTextLabel && (this.cachedTextLabel = t, this.emit("slotchange", {
-      bubbles: !0,
-      cancelable: !1,
-      composed: !1
-    }));
-  }
-  handleMouseEnter() {
-    this.hasHover = !0;
-  }
-  handleMouseLeave() {
-    this.hasHover = !1;
-  }
-  handleDisabledChange() {
-    this.setAttribute("aria-disabled", this.disabled ? "true" : "false");
-  }
-  handleSelectedChange() {
-    this.setAttribute("aria-selected", this.selected ? "true" : "false");
-  }
-  handleValueChange() {
-    typeof this.value != "string" && (this.value = String(this.value)), this.value.includes(" ") && (console.error(
-      "Option values cannot include a space. All spaces have been replaced with underscores.",
-      this
-    ), this.value = this.value.replace(/ /g, "_"));
-  }
-  /** Returns a plain text label based on the option's content. */
-  getTextLabel() {
-    const t = this.childNodes;
-    let a = "";
-    return [...t].forEach((i) => {
-      i.nodeType === Node.ELEMENT_NODE && (i.hasAttribute("slot") || (a += i.textContent)), i.nodeType === Node.TEXT_NODE && (a += i.textContent);
-    }), a.trim();
-  }
-  render() {
-    return h`
-      <div
-        part="base"
-        class=${y({
-      option: !0,
-      "option--current": this.current,
-      "option--disabled": this.disabled,
-      "option--hover": this.hasHover,
-      "option--selected": this.selected,
-      "option--show-check": this.showCheck
-    })}
-        @mouseenter=${this.handleMouseEnter}
-        @mouseleave=${this.handleMouseLeave}
-      >
-        ${u(
-      this.checkPlacement === r.Left,
-      () => h`<cx-icon
-              part="checked-icon"
-              class="option__check"
-              name="check"
-              library="system"
-              aria-hidden="true"
-            ></cx-icon> `
-    )}
-        <slot part="prefix" name="prefix" class="option__prefix"></slot>
-        <cx-space
-          part="content"
-          class="option__content"
-          direction="vertical"
-          spacing="3x-small"
-        >
-          <slot
-            part="label"
-            class="option__label"
-            @slotchange=${this.handleDefaultSlotChange}
-          ></slot>
-          <slot
-            part="help-text"
-            name="help-text"
-            class="option__help-text"
-          ></slot>
-        </cx-space>
-        <slot part="suffix" name="suffix" class="option__suffix"></slot>
-        ${u(
-      this.checkPlacement === r.Right,
-      () => h`<cx-icon
-              part="checked-icon"
-              class="option__check"
-              name="check"
-              library="system"
-              aria-hidden="true"
-            ></cx-icon> `
-    )}
-      </div>
-    `;
-  }
-};
-e.styles = [m, C];
-e.dependencies = { "cx-icon": k, "cx-space": w };
-o([
-  _(".option__label")
-], e.prototype, "defaultSlot", 2);
-o([
-  f()
-], e.prototype, "current", 2);
-o([
-  f()
-], e.prototype, "selected", 2);
-o([
-  f()
-], e.prototype, "hasHover", 2);
-o([
-  s({ reflect: !0 })
-], e.prototype, "value", 2);
-o([
-  s({ reflect: !0, type: Boolean })
-], e.prototype, "disabled", 2);
-o([
-  s({ attribute: "show-check", reflect: !0, type: Boolean })
-], e.prototype, "showCheck", 2);
-o([
-  s({ attribute: "check-placement", reflect: !0, type: String })
-], e.prototype, "checkPlacement", 2);
-o([
-  d("disabled")
-], e.prototype, "handleDisabledChange", 1);
-o([
-  d("selected")
-], e.prototype, "handleSelectedChange", 1);
-o([
-  d("value")
-], e.prototype, "handleValueChange", 1);
-e = o([
-  v("cx-option")
-], e);
-export {
-  e as C,
-  r as a
-};

package/library/chunks/typography.oDzoLbZS.js

@@ -1,149 +0,0 @@
-import { n as f, C as v } from "./lib-cortex-element.CVMmyPMC.js";
-import { c } from "./component.styles.DMSLciL5.js";
-import { c as d } from "./custom-element.L4WJXn1j.js";
-import { i as m, x as i } from "./lit-element.jLBm65_O.js";
-var t = /* @__PURE__ */ ((e) => (e.Body1 = "body1", e.Body2 = "body2", e.Body3 = "body3", e.H1 = "h1", e.H2 = "h2", e.H3 = "h3", e.H4 = "h4", e.H5 = "h5", e.H6 = "h6", e.Small = "small", e))(t || {});
-const x = m`
-  :host {
-    --color: inherit;
-    --font-family: var(--cx-font-sans);
-    --font-style: normal;
-
-    line-height: var(--cx-line-height-large);
-    display: block;
-  }
-
-  :host::part(base) {
-    -webkit-font-smoothing: antialiased;
-  }
-
-  .heading,
-  .body,
-  .small {
-    color: var(--color);
-    font-weight: var(--cx-font-weight);
-    font-family: var(--font-family);
-    font-style: var(--font-style);
-    letter-spacing: var(--letter-spacing, var(--cx-letter-spacing-normal));
-    margin-block-start: 0;
-    margin-block-end: 0;
-  }
-
-  .heading-1 {
-    font-size: var(--font-size, var(--cx-font-size-3x-large));
-    font-weight: var(--font-weight, var(--cx-font-weight-semibold));
-    line-height: var(--line-height, var(--cx-line-height-3x-large));
-  }
-
-  .heading-2 {
-    font-size: var(--font-size, var(--cx-font-size-2x-large));
-    font-weight: var(--font-weight, var(--cx-font-weight-semibold));
-    line-height: var(--line-height, var(--cx-line-height-3x-large));
-  }
-
-  .heading-3 {
-    font-size: var(--font-size, var(--cx-font-size-x-large));
-    font-weight: var(--font-weight, var(--cx-font-weight-semibold));
-    line-height: var(--line-height, var(--cx-line-height-2x-large));
-  }
-
-  .heading-4 {
-    font-size: var(--font-size, var(--cx-font-size-large));
-    font-weight: var(--font-weight, var(--cx-font-weight-semibold));
-    line-height: var(--line-height, var(--cx-line-height-x-large));
-  }
-
-  .heading-5 {
-    font-size: var(--font-size, var(--cx-font-size-medium));
-    font-weight: var(--font-weight, var(--cx-font-weight-semibold));
-    line-height: var(--line-height, var(--cx-line-height-large));
-  }
-
-  .heading-6 {
-    font-size: var(--font-size, var(--cx-font-size-small));
-    font-weight: var(--font-weight, var(--cx-font-weight-semibold));
-    line-height: var(--line-height, var(--cx-line-height-medium));
-  }
-
-  .body-1 {
-    font-size: var(--font-size, var(--cx-font-size-medium-large));
-    font-weight: var(--font-weight, var(--cx-font-weight-regular));
-    line-height: var(--line-height, var(--cx-line-height-x-large));
-  }
-
-  .body-2 {
-    font-size: var(--font-size, var(--cx-font-size-medium));
-    font-weight: var(--font-weight, var(--cx-font-weight-regular));
-    line-height: var(--line-height, var(--cx-line-height-large));
-  }
-
-  .body-3 {
-    font-size: var(--font-size, var(--cx-font-size-small));
-    font-weight: var(--font-weight, var(--cx-font-weight-regular));
-    line-height: var(--line-height, var(--cx-line-height-medium));
-  }
-
-  .small {
-    font-size: var(--font-size, var(--cx-font-size-x-small));
-    font-weight: var(--font-weight, var(--cx-font-weight-regular));
-    line-height: var(--line-height, var(--cx-line-height-small));
-  }
-`;
-var b = Object.defineProperty, w = Object.getOwnPropertyDescriptor, g = (e, n, o, r) => {
-  for (var a = r > 1 ? void 0 : r ? w(n, o) : n, l = e.length - 1, h; l >= 0; l--)
-    (h = e[l]) && (a = (r ? h(n, o, a) : h(a)) || a);
-  return r && a && b(n, o, a), a;
-};
-let s = class extends v {
-  constructor() {
-    super(...arguments), this.variant = t.Body1;
-  }
-  render() {
-    switch (this.variant) {
-      case t.Body1:
-        return i`<p part="base" class="body body-1"><slot></slot></p>`;
-      case t.Body2:
-        return i`<p part="base" class="body body-2"><slot></slot></p>`;
-      case t.Body3:
-        return i`<p part="base" class="body body-3"><slot></slot></p>`;
-      case t.Small:
-        return i`<small part="base" class="small"><slot></slot></small>`;
-      case t.H1:
-        return i`<h1 part="base" class="heading heading-1">
-          <slot></slot>
-        </h1>`;
-      case t.H2:
-        return i`<h2 part="base" class="heading heading-2">
-          <slot></slot>
-        </h2>`;
-      case t.H3:
-        return i`<h3 part="base" class="heading heading-3">
-          <slot></slot>
-        </h3>`;
-      case t.H4:
-        return i`<h4 part="base" class="heading heading-4">
-          <slot></slot>
-        </h4>`;
-      case t.H5:
-        return i`<h5 part="base" class="heading heading-5">
-          <slot></slot>
-        </h5>`;
-      case t.H6:
-        return i`<h6 part="base" class="heading heading-6">
-          <slot></slot>
-        </h6>`;
-    }
-    return i`<p part="base" class="body body-2"><slot></slot></p>`;
-  }
-};
-s.styles = [c, x];
-g([
-  f({ type: String })
-], s.prototype, "variant", 2);
-s = g([
-  d("cx-typography")
-], s);
-export {
-  s as C,
-  t as T
-};