@viasat/beam-web-components 2.0.0

package/Spinner/Spinner.js

@@ -0,0 +1,186 @@
+import { unsafeCSS as D, LitElement as I, html as b, nothing as d } from "lit";
+import { property as g, queryAssignedElements as B } from "lit/decorators.js";
+import $ from "clsx";
+import { g as M } from "../chunks/classNames.Cq_tbDRp.js";
+import "../chunks/constants.jOWREYQE.js";
+import { c as E } from "../chunks/register-custom-element.DHGKOhmA.js";
+const W = 10, H = {
+  xxs: {
+    sideLength: 16,
+    strokeWidth: 2
+  },
+  xs: {
+    sideLength: 20,
+    strokeWidth: 2
+  },
+  sm: {
+    sideLength: 40,
+    strokeWidth: 4
+  },
+  md: {
+    sideLength: 64,
+    strokeWidth: 6
+  },
+  lg: {
+    sideLength: 88,
+    strokeWidth: 8
+  }
+}, { baseClassNamePrefix: w, subElementClassPrefix: c } = M("spinner"), L = ({
+  sideLength: e,
+  strokeWidth: n
+}) => {
+  const r = e - n, p = r / 2, s = Math.PI * r, v = `0 0 ${e} ${e}`;
+  return {
+    sideLength: e,
+    strokeWidth: n,
+    cx: e / 2,
+    cy: e / 2,
+    diameter: r,
+    circumference: s,
+    r: p,
+    viewBox: v
+  };
+}, l = `${w}-wrap`, a = {
+  spinnerWrap: l,
+  spinnerSvgWrap: w,
+  spinnerSvgWrapIndeterminate: `${w}--indeterminate`,
+  spinnerSvgWrapDeterminate: `${w}--determinate`,
+  spinnerContentWrapper: `${c}content-wrapper`,
+  spinnerSvgHeading: `${c}heading`,
+  spinnerSvgLabelPercentageIndicator: `${c}percentage-indicator`,
+  spinnerSvg: `${c}svg`,
+  spinnerSvgCircle: `${c}circle`,
+  spinnerSvgCircleBg: `${c}circle-bg`,
+  spinnerBody: `${c}body`
+}, C = {
+  xxs: `${l}--xxs`,
+  xs: `${l}--xs`,
+  sm: `${l}--sm`,
+  md: `${l}--md`,
+  lg: `${l}--lg`
+}, O = "--bm-spinner-value", T = ({ value: e }) => {
+  const n = typeof e == "number" && Number.isInteger(e) || !1, r = n && e >= 0 && e <= 100;
+  return n && !r && console.warn("The allowed range for the spinner values is 0 to 100"), n && r;
+}, V = '@charset "UTF-8";:root,:host,.bm-light,.bm-dark .bm-inverse,[data-bm-theme~=bm-light]{--bm-comp-spinner-color-heading: var(--bm-sem-color-text-primary, #141d24);--bm-comp-spinner-color-body: var(--bm-sem-color-text-primary, #141d24);--bm-comp-spinner-color-track: var( --bm-sem-color-surface-highlight, rgba(159, 175, 188, .16) );--bm-comp-spinner-color-indicator: var( --bm-utility-color-accent-default, #00768f );--bm-comp-spinner-color-indicator-neutral: var( --bm-sem-color-border-strong, #8697a5 );--bm-comp-spinner-space-xs-gap: var(--bm-sem-space-50, .5rem);--bm-comp-spinner-space-sm-gap: var(--bm-sem-space-100, 1rem);--bm-comp-spinner-space-md-gap: var(--bm-sem-space-150, 1.5rem);--bm-comp-spinner-space-lg-gap: var(--bm-sem-space-150, 1.5rem);--bm-comp-spinner-space-content-gap: var(--bm-sem-space-50, .5rem);--bm-comp-spinner-space-nudge-y: var(--bm-sem-space-12, .125rem);--bm-comp-spinner-size-xxs-track: var(--bm-primitive-dimension-100, 1rem);--bm-comp-spinner-size-xxs-border-width: var( --bm-primitive-dimension-12, .125rem );--bm-comp-spinner-size-xs-track: var(--bm-primitive-dimension-125, 1.25rem);--bm-comp-spinner-size-xs-border-width: var( --bm-primitive-dimension-12, .125rem );--bm-comp-spinner-size-sm-track: var(--bm-primitive-dimension-250, 2.5rem);--bm-comp-spinner-size-sm-border-width: var( --bm-primitive-dimension-25, .25rem );--bm-comp-spinner-size-md-track: var(--bm-primitive-dimension-400, 4rem);--bm-comp-spinner-size-md-border-width: var( --bm-primitive-dimension-37, .375rem );--bm-comp-spinner-size-lg-track: var(--bm-primitive-dimension-550, 5.5rem);--bm-comp-spinner-size-lg-border-width: var( --bm-primitive-dimension-50, .5rem );--bm-comp-spinner-size-width: 27.5rem;--bm-comp-spinner-typo-heading: var( --bm-sem-typo-label-md, 600 1rem/1.5rem "Source Sans Pro" );--bm-comp-spinner-typo-body: var( --bm-sem-typo-body-md, 400 1rem/1.5rem "Source Sans Pro" )}:host,.bm-dark,.bm-light .bm-inverse,[data-bm-theme~=bm-dark]{--bm-comp-spinner-color-heading: var(--bm-sem-color-text-primary, #ffffff);--bm-comp-spinner-color-body: var(--bm-sem-color-text-primary, #ffffff);--bm-comp-spinner-color-track: var( --bm-sem-color-surface-highlight, rgba(134, 151, 165, .16) );--bm-comp-spinner-color-indicator: var( --bm-utility-color-accent-default, #43bfd6 );--bm-comp-spinner-color-indicator-neutral: var( --bm-sem-color-border-strong, #9fafbc );--bm-comp-spinner-space-xs-gap: var(--bm-sem-space-50, .5rem);--bm-comp-spinner-space-sm-gap: var(--bm-sem-space-100, 1rem);--bm-comp-spinner-space-md-gap: var(--bm-sem-space-150, 1.5rem);--bm-comp-spinner-space-lg-gap: var(--bm-sem-space-150, 1.5rem);--bm-comp-spinner-space-content-gap: var(--bm-sem-space-50, .5rem);--bm-comp-spinner-space-nudge-y: var(--bm-sem-space-12, .125rem);--bm-comp-spinner-size-xxs-track: var(--bm-primitive-dimension-100, 1rem);--bm-comp-spinner-size-xxs-border-width: var( --bm-primitive-dimension-12, .125rem );--bm-comp-spinner-size-xs-track: var(--bm-primitive-dimension-125, 1.25rem);--bm-comp-spinner-size-xs-border-width: var( --bm-primitive-dimension-12, .125rem );--bm-comp-spinner-size-sm-track: var(--bm-primitive-dimension-250, 2.5rem);--bm-comp-spinner-size-sm-border-width: var( --bm-primitive-dimension-25, .25rem );--bm-comp-spinner-size-md-track: var(--bm-primitive-dimension-400, 4rem);--bm-comp-spinner-size-md-border-width: var( --bm-primitive-dimension-37, .375rem );--bm-comp-spinner-size-lg-track: var(--bm-primitive-dimension-550, 5.5rem);--bm-comp-spinner-size-lg-border-width: var( --bm-primitive-dimension-50, .5rem );--bm-comp-spinner-size-width: 27.5rem;--bm-comp-spinner-typo-heading: var( --bm-sem-typo-label-md, 600 1rem/1.5rem "Source Sans Pro" );--bm-comp-spinner-typo-body: var( --bm-sem-typo-body-md, 400 1rem/1.5rem "Source Sans Pro" )}.bm-spinner{position:relative;margin:0 auto;width:var(--bm-spinner-side-length);height:var(--bm-spinner-side-length)}.bm-spinner__circle-bg,.bm-spinner__circle{r:calc((var(--bm-spinner-side-length) - var(--bm-spinner-stroke-width)) / 2);stroke-width:var(--bm-spinner-stroke-width)}.bm-spinner__svg{position:relative;transform:rotate(-90deg) translateZ(0);width:calc(var(--bm-spinner-side-length));height:calc(var(--bm-spinner-side-length))}.bm-spinner__circle{stroke:var(--bm-comp-spinner-color-indicator);stroke-linecap:round;transform-origin:center}.bm-spinner__circle-bg{stroke:var(--bm-comp-spinner-color-track)}@keyframes dash{0%{stroke-dashoffset:0;stroke-dasharray:1,calc((var(--bm-spinner-side-length) - var(--bm-spinner-stroke-width)) * 3.1415926536 * 1.6)}50%{stroke-dasharray:calc((var(--bm-spinner-side-length) - var(--bm-spinner-stroke-width)) * 3.1415926536 * .712),500;stroke-dashoffset:calc((var(--bm-spinner-side-length) - var(--bm-spinner-stroke-width)) * 3.1415926536 * -.278)}to{stroke-dasharray:calc((var(--bm-spinner-side-length) - var(--bm-spinner-stroke-width)) * 3.1415926536 * .708),500;stroke-dashoffset:calc((var(--bm-spinner-side-length) - var(--bm-spinner-stroke-width)) * 3.1415926536 * -.992)}}.bm-spinner__content-wrapper{display:flex;flex-direction:column;align-items:center;gap:var(--bm-spinner-label-to-description-spacing)}.bm-spinner__heading{display:inline-flex;color:var(--bm-comp-spinner-color-heading);font:var(--bm-comp-spinner-typo-heading)}.bm-spinner__percentage-indicator:before{content:" "}.bm-spinner__body{margin:0;color:var(--bm-comp-spinner-color-body);font:var(--bm-comp-spinner-typo-body);text-align:center}@keyframes rotation{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}.bm-spinner--indeterminate .bm-spinner__svg{animation:rotation calc(var(--bm-spinner-animation-speed) / 2) linear infinite}.bm-spinner--indeterminate .bm-spinner__circle{animation:dash calc(var(--bm-spinner-animation-speed) / 2) ease infinite}.bm-spinner--determinate .bm-spinner__circle{transition:stroke-dasharray .5s ease;stroke-dasharray:calc((var(--bm-spinner-side-length) - var(--bm-spinner-stroke-width)) * 3.1415926536 * var(--bm-spinner-value) / 100) 300px;stroke-dashoffset:0}.bm-spinner-wrap{--bm-spinner-animation-speed: 3s;max-width:var(--bm-comp-spinner-size-width);margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:var(--bm-spinner-label-to-spinner-spacing)}.bm-spinner-wrap progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;position:absolute;visibility:hidden;width:0}.bm-spinner-wrap ::-moz-progress-bar,.bm-spinner-wrap ::-webkit-progress-bar,.bm-spinner-wrap ::-webkit-progress-value,.bm-spinner-wrap ::-webkit-progress-inner-element{-webkit-appearance:none;-moz-appearance:none;appearance:none}.bm-spinner-wrap--xs,.bm-spinner-wrap--xxs{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;max-width:unset}.bm-spinner-wrap--xs .bm-spinner,.bm-spinner-wrap--xxs .bm-spinner{box-sizing:content-box;margin-bottom:0;padding:var(--bm-comp-spinner-space-nudge-y) 0}.bm-spinner-wrap--xs .bm-spinner__content-wrapper,.bm-spinner-wrap--xxs .bm-spinner__content-wrapper{display:inline-flex;flex-direction:row}.bm-spinner-wrap--xs .bm-spinner__body,.bm-spinner-wrap--xxs .bm-spinner__body{text-align:left}.bm-spinner-wrap--xxs .bm-spinner__heading{font:var(--bm-sem-typo-label-sm)}.bm-spinner-wrap--xxs .bm-spinner__body{font:var(--bm-sem-typo-body-sm)}.bm-spinner-wrap--xxs{--bm-spinner-side-length: var(--bm-comp-spinner-size-xxs-track);--bm-spinner-stroke-width: var(--bm-comp-spinner-size-xxs-border-width);--bm-spinner-label-to-spinner-spacing: var(--bm-comp-spinner-space-xs-gap);--bm-spinner-label-to-description-spacing: var(--bm-comp-spinner-space-content-gap)}.bm-spinner-wrap--xs{--bm-spinner-side-length: var(--bm-comp-spinner-size-xs-track);--bm-spinner-stroke-width: var(--bm-comp-spinner-size-xs-border-width);--bm-spinner-label-to-spinner-spacing: var(--bm-comp-spinner-space-xs-gap);--bm-spinner-label-to-description-spacing: var(--bm-comp-spinner-space-content-gap)}.bm-spinner-wrap--sm{--bm-spinner-side-length: var(--bm-comp-spinner-size-sm-track);--bm-spinner-stroke-width: var(--bm-comp-spinner-size-sm-border-width);--bm-spinner-label-to-spinner-spacing: var(--bm-comp-spinner-space-sm-gap);--bm-spinner-label-to-description-spacing: var(--bm-comp-spinner-space-content-gap)}.bm-spinner-wrap--md{--bm-spinner-side-length: var(--bm-comp-spinner-size-md-track);--bm-spinner-stroke-width: var(--bm-comp-spinner-size-md-border-width);--bm-spinner-label-to-spinner-spacing: var(--bm-comp-spinner-space-md-gap);--bm-spinner-label-to-description-spacing: var(--bm-comp-spinner-space-content-gap)}.bm-spinner-wrap--lg{--bm-spinner-side-length: var(--bm-comp-spinner-size-lg-track);--bm-spinner-stroke-width: var(--bm-comp-spinner-size-lg-border-width);--bm-spinner-label-to-spinner-spacing: var(--bm-comp-spinner-space-lg-gap);--bm-spinner-label-to-description-spacing: var(--bm-comp-spinner-space-content-gap)}';
+var A = Object.defineProperty, F = Object.getOwnPropertyDescriptor, P = (e) => {
+  throw TypeError(e);
+}, o = (e, n, r, p) => {
+  for (var s = p > 1 ? void 0 : p ? F(n, r) : n, v = e.length - 1, x; v >= 0; v--)
+    (x = e[v]) && (s = (p ? x(n, r, s) : x(s)) || s);
+  return p && s && A(n, r, s), s;
+}, q = (e, n, r) => n.has(e) || P("Cannot " + r), i = (e, n, r) => (q(e, n, "read from private field"), r ? r.call(e) : n.get(e)), h = (e, n, r) => n.has(e) ? P("Cannot add the same private member more than once") : n instanceof WeakSet ? n.add(e) : n.set(e, r), m, k, N, y, f, u, _, S, z;
+let t = class extends I {
+  constructor() {
+    super(...arguments), h(this, m), this.size = "md", h(this, u, () => {
+      const e = i(this, m, y), { viewBox: n } = i(this, m, N), r = a[i(this, m, y) ? "spinnerSvgWrapDeterminate" : "spinnerSvgWrapIndeterminate"], p = $(
+        a.spinnerSvgWrap,
+        C[this.size],
+        r,
+        this.className
+      ), s = i(this, m, y) ? `${O}: ${i(this, m, f)}` : "";
+      return b`<div class=${p} style=${s}>
+      <progress
+        ${e ? b`.value=${i(this, m, f)}` : d}
+        max="100"
+      ></progress>
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        class=${a.spinnerSvg}
+        viewBox="${n}"
+      >
+        <circle
+          class=${a.spinnerSvgCircleBg}
+          stroke-miterlimit="${W}"
+          fill="none"
+          cx="50%"
+          cy="50%"
+        ></circle>
+        <circle
+          class=${a.spinnerSvgCircle}
+          stroke-miterlimit="${W}"
+          fill="none"
+          cx="50%"
+          cy="50%"
+        ></circle>
+      </svg>
+    </div>`;
+    }), h(this, _, () => i(this, m, k) ? b`<span class=${a.spinnerSvgLabelPercentageIndicator}
+          >${i(this, m, f)}%</span
+        >` : d), h(this, S, () => {
+      const e = this.headingSlot.length > 0;
+      return !(this.heading || i(this, m, k) || e) ? d : b` <strong class=${a.spinnerSvgHeading}>
+      <slot name="heading"> ${this.heading || d} </slot>
+      ${i(this, _).call(this)}
+    </strong>`;
+    }), h(this, z, () => {
+      const e = this.bodySlot.length > 0;
+      return !!(this.body || e) ? b`<p class=${a.spinnerBody}>
+          <slot name="body"> ${this.body || d} </slot>
+        </p>` : d;
+    });
+  }
+  render() {
+    const e = $(
+      a.spinnerWrap,
+      C[this.size],
+      this.className
+    ), n = i(this, u).call(this), r = i(this, S).call(this), p = i(this, z).call(this);
+    return b`<div class=${e}>
+      ${n}
+      <div class=${a.spinnerContentWrapper}>${r} ${p}</div>
+    </div>`;
+  }
+};
+m = /* @__PURE__ */ new WeakSet();
+k = function() {
+  return !!(Number.isInteger(this.value) && this.showPercentage);
+};
+N = function() {
+  const { sideLength: e, strokeWidth: n } = H[this.size || "md"];
+  return L({
+    sideLength: e,
+    strokeWidth: n
+  });
+};
+y = function() {
+  const { value: e } = this;
+  return T({ value: e });
+};
+f = function() {
+  return typeof this.value == "number" && isFinite(this.value) ? this.value : 0;
+};
+u = /* @__PURE__ */ new WeakMap();
+_ = /* @__PURE__ */ new WeakMap();
+S = /* @__PURE__ */ new WeakMap();
+z = /* @__PURE__ */ new WeakMap();
+t.styles = D(V);
+o([
+  g({ type: String })
+], t.prototype, "size", 2);
+o([
+  g({ type: Number })
+], t.prototype, "value", 2);
+o([
+  g({ type: Boolean })
+], t.prototype, "showPercentage", 2);
+o([
+  g()
+], t.prototype, "heading", 2);
+o([
+  g()
+], t.prototype, "body", 2);
+o([
+  g({ type: String })
+], t.prototype, "theme", 2);
+o([
+  B({ slot: "heading" })
+], t.prototype, "headingSlot", 2);
+o([
+  B({ slot: "body" })
+], t.prototype, "bodySlot", 2);
+t = o([
+  E("bm-spinner")
+], t);
+export {
+  t as BmSpinner
+};

package/Spinner/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Spinner';
+//# sourceMappingURL=index.d.ts.map

package/Spinner/index.js

@@ -0,0 +1,4 @@
+import { BmSpinner as m } from "./Spinner.js";
+export {
+  m as BmSpinner
+};

package/StateLayer/StateLayer.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Rather than define an element for the StateLayer, it's best that we just give some
+ * shared styles and helper functions for components that define their own state layers.
+ * This is due to the ShadowDom and the border-radius of the state layer not following
+ * the parent element's border-radius inside the shadow dom, because the span is
+ * nested inside the <bm-state-layer> which the component will inherit its border-radius.
+ * This nesting of the tag also makes it difficult for the state layer to listen to states
+ * like hover, active, and focus. We could get around some of these libations using :host
+ * and :host-context but it would make are styles less sharable, between the React and Lit components.
+ * We could also not use the ShadowDom, but this has its own set of problems, and still doesn't.
+ * solve the border-radius issue Thus, it's best we go with a more functional approach and have
+ * each component define its own state layer. This also makes the code more readable and maintainable.
+ *
+ */
+export declare const stateLayerClassName: () => string;
+export declare const stateLayerStyles: import('lit').CSSResult;
+//# sourceMappingURL=StateLayer.d.ts.map

package/StateLayer/StateLayer.js

@@ -0,0 +1,6 @@
+import { unsafeCSS as t } from "lit";
+const e = '.bm-state-layer{--bm-state-layer-offset: 0;--bm-state-layer-opacity: 0;--bm-state-layer-outline-width: var(--bm-sem-border-width-focus);--bm-state-layer-outline-offset: var(--bm-sem-size-focus-offset);--bm-state-layer-outline-color: transparent;--bm-state-layer-outline-style: solid;--bm-state-layer-outline: var(--bm-state-layer-outline-color) var(--bm-state-layer-outline-style) var(--bm-state-layer-outline-width);--bm-state-layer-top: 0;--bm-state-layer-right: 0;--bm-state-layer-bottom: 0;--bm-state-layer-left: 0;position:absolute;top:var(--bm-state-layer-top);right:var(--bm-state-layer-right);bottom:var(--bm-state-layer-bottom);left:var(--bm-state-layer-left);border-radius:inherit;opacity:var(--bm-state-layer-opacity);background:var(--bm-state-layer-background);outline-style:var(--bm-state-layer-outline-style);outline-offset:var(--bm-state-layer-outline-offset);outline-color:var(--bm-state-layer-outline-color);outline-width:var(--bm-state-layer-outline-width)}*:hover>.bm-state-layer:not(.bm-state-layer--without-hover){--bm-state-layer-background: var(--bm-sem-color-state-layer-hover);--bm-state-layer-opacity: 1}*:active>.bm-state-layer:not(.bm-state-layer--without-active){--bm-state-layer-background: var(--bm-sem-color-state-layer-active);--bm-state-layer-opacity: 1}*:focus-within>.bm-state-layer.bm-state-layer--with-focus-within{--bm-state-layer-outline-color: var(--bm-sem-color-border-focus);--bm-state-layer-opacity: 1}*:is(:focus-visible,:has(:focus-visible))>.bm-state-layer:not(.bm-state-layer--without-focus-visible-within){--bm-state-layer-outline-color: var(--bm-sem-color-border-focus);--bm-state-layer-opacity: 1}*:disabled>.bm-state-layer:not(.bm-state-layer--without-disabled){--bm-state-layer-background: "unset";--bm-state-layer-opacity: 0}', r = () => "bm-state-layer", o = t(e);
+export {
+  r as stateLayerClassName,
+  o as stateLayerStyles
+};

package/StateLayer/index.d.ts

@@ -0,0 +1,2 @@
+export * from './StateLayer';
+//# sourceMappingURL=index.d.ts.map

package/StateLayer/index.js

@@ -0,0 +1,5 @@
+import { stateLayerClassName as t, stateLayerStyles as s } from "./StateLayer.js";
+export {
+  t as stateLayerClassName,
+  s as stateLayerStyles
+};

package/Text/Text.d.ts

@@ -0,0 +1,85 @@
+import { LitElement } from 'lit';
+import { TextAlignment, TextWordBreak, TextColor, TextKind } from '@viasat/beam-shared/components/text';
+import { ThemeTypes } from '@viasat/beam-shared/utils/constants';
+/**
+ * `bm-text`
+ * Text component that supports both text content and children, including other web components
+ * @slot default - The text content for the Text component or pass the `text` attribute to set the text content
+ *
+ * @example
+ * // Using with text property
+ * <bm-text text="Hello World"></bm-text>
+ *
+ * // Using with children
+ * <bm-text>Hello World</bm-text>
+ *
+ * // Using with complex children
+ * <bm-text>
+ *   <span>Hello</span> <strong>World</strong>
+ * </bm-text>
+ */
+export declare class BmText extends LitElement {
+    static styles: import('lit').CSSResult;
+    /**
+     * The text content. If provided, will be used instead of slot content.
+     * @type {string}
+     */
+    text?: string;
+    /**
+     * Specify the theme of the Text. By default it inherits the theme from the parent
+     */
+    theme?: ThemeTypes;
+    /**
+     * Specify if Text displays as a heading, body, detail, or label variant
+     * @default 'body-md'
+     */
+    kind: TextKind;
+    /**
+     * Specifies the color of the text
+     */
+    color?: TextColor;
+    /**
+     * Sets the css word-break property
+     */
+    wordBreak?: TextWordBreak;
+    /**
+     * Sets css text-align to either start, center, or end
+     */
+    alignment?: TextAlignment;
+    /**
+     * Specify if Text is bold. This prop only works for body `kinds`
+     */
+    bold: boolean;
+    /**
+     * Changes the css display to block
+     */
+    block: boolean;
+    /**
+     * Truncates css text with ellipsis if it exceeds the container
+     */
+    truncate: boolean;
+    /**
+     * Reduces the line-height of body and label `kind` variants
+     */
+    compact: boolean;
+    /**
+     * Adds a strikethrough to the text
+     */
+    strikethrough: boolean;
+    /**
+     * Underlines the text
+     */
+    underline: boolean;
+    /**
+     * Italicizes the text
+     */
+    italic: boolean;
+    protected getClassNames(): string;
+    render(): import('lit-html').TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'bm-text': BmText;
+    }
+}
+//# sourceMappingURL=Text.d.ts.map

package/Text/Text.js

@@ -0,0 +1,103 @@
+import { unsafeCSS as v, LitElement as l } from "lit";
+import { property as r } from "lit/decorators.js";
+import { html as x } from "lit/static-html.js";
+import d from "clsx";
+import { p as g, t as y } from "../chunks/constants.jOWREYQE.js";
+import { g as f } from "../chunks/classNames.Cq_tbDRp.js";
+import { c as h } from "../chunks/register-custom-element.DHGKOhmA.js";
+const c = `${g}sem-typo-`, u = "compact-", w = ".bm-sem-typo-heading-6xl{font:var(--bm-sem-typo-heading-6xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-5xl{font:var(--bm-sem-typo-heading-5xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-4xl{font:var(--bm-sem-typo-heading-4xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-3xl{font:var(--bm-sem-typo-heading-3xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-2xl{font:var(--bm-sem-typo-heading-2xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-alt-6xl{font:var(--bm-sem-typo-heading-alt-6xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-alt-5xl{font:var(--bm-sem-typo-heading-alt-5xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-alt-4xl{font:var(--bm-sem-typo-heading-alt-4xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-alt-3xl{font:var(--bm-sem-typo-heading-alt-3xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-alt-2xl{font:var(--bm-sem-typo-heading-alt-2xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-xl{font:var(--bm-sem-typo-heading-xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-lg{font:var(--bm-sem-typo-heading-lg);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-md{font:var(--bm-sem-typo-heading-md);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-sm{font:var(--bm-sem-typo-heading-sm);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-xs{font:var(--bm-sem-typo-heading-xs);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-alt-xl{font:var(--bm-sem-typo-heading-alt-xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-alt-lg{font:var(--bm-sem-typo-heading-alt-lg);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-alt-md{font:var(--bm-sem-typo-heading-alt-md);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-alt-sm{font:var(--bm-sem-typo-heading-alt-sm);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-heading-alt-xs{font:var(--bm-sem-typo-heading-alt-xs);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-body-xs{font:var(--bm-sem-typo-body-xs);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-body-sm{font:var(--bm-sem-typo-body-sm);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-body-md{font:var(--bm-sem-typo-body-md);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-body-lg{font:var(--bm-sem-typo-body-lg);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-body-xl{font:var(--bm-sem-typo-body-xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-body-2xl{font:var(--bm-sem-typo-body-2xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-detail-xs{font:var(--bm-sem-typo-detail-xs);text-transform:var(--bm-primitive-text-case-uppercase);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-detail-sm{font:var(--bm-sem-typo-detail-sm);text-transform:var(--bm-primitive-text-case-uppercase);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-detail-md{font:var(--bm-sem-typo-detail-md);text-transform:var(--bm-primitive-text-case-uppercase);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-detail-lg{font:var(--bm-sem-typo-detail-lg);text-transform:var(--bm-primitive-text-case-uppercase);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-detail-xl{font:var(--bm-sem-typo-detail-xl);text-transform:var(--bm-primitive-text-case-uppercase);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-heading)}.bm-sem-typo-label-xs{font:var(--bm-sem-typo-label-xs);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-label-sm{font:var(--bm-sem-typo-label-sm);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-label-md{font:var(--bm-sem-typo-label-md);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-label-lg{font:var(--bm-sem-typo-label-lg);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-label-xl{font:var(--bm-sem-typo-label-xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-label-2xl{font:var(--bm-sem-typo-label-2xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-body-xs{font:var(--bm-sem-typo-compact-body-xs);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-body-sm{font:var(--bm-sem-typo-compact-body-sm);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-body-md{font:var(--bm-sem-typo-compact-body-md);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-body-lg{font:var(--bm-sem-typo-compact-body-lg);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-body-xl{font:var(--bm-sem-typo-compact-body-xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-body-2xl{font:var(--bm-sem-typo-compact-body-2xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-label-xs{font:var(--bm-sem-typo-compact-label-xs);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-label-sm{font:var(--bm-sem-typo-compact-label-sm);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-label-md{font:var(--bm-sem-typo-compact-label-md);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-label-lg{font:var(--bm-sem-typo-compact-label-lg);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-label-xl{font:var(--bm-sem-typo-compact-label-xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-sem-typo-compact-label-2xl{font:var(--bm-sem-typo-compact-label-2xl);text-transform:var(--bm-primitive-text-case-none);text-decoration:var(--bm-primitive-text-decoration-none);letter-spacing:var(--bm-primitive-letter-spacing-body)}.bm-text{padding:var(--bm-sem-space-0);margin:var(--bm-sem-space-0)}.bm-text--normal{word-break:normal}.bm-text--breakAll{word-break:break-all}.bm-text--breakWord{word-break:break-word}.bm-text--start{text-align:start}.bm-text--center{text-align:center}.bm-text--end{text-align:end}.bm-text--block{display:block}.bm-text--truncate{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bm-text--truncate ::slotted(*){display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bm-text--italic{font-style:italic}.bm-text--underline.bm-text--strikethrough{text-decoration:underline line-through}.bm-text--underline{text-decoration:underline}.bm-text--strikethrough{text-decoration:line-through}.bm-text--heading-regular{font-weight:var(--bm-sem-font-weight-heading)}.bm-text--heading-bold{font-weight:var(--bm-sem-font-weight-heading-alt)}.bm-text--body-regular{font-weight:var(--bm-sem-font-weight-body)}.bm-text--body-bold{font-weight:var(--bm-sem-font-weight-body-bold)}.bm-text--primary{color:var(--bm-sem-color-text-primary)}.bm-text--secondary{color:var(--bm-sem-color-text-secondary)}.bm-text--positive{color:var(--bm-sem-color-text-positive)}.bm-text--warning{color:var(--bm-sem-color-text-warning)}.bm-text--negative{color:var(--bm-sem-color-text-negative)}.bm-text--infoPrimary{color:var(--bm-sem-color-text-info-primary)}.bm-text--infoSecondary{color:var(--bm-sem-color-text-info-secondary)}.bm-text--selected{color:var(--bm-sem-color-text-selected)}.bm-text--disabled{color:var(--bm-sem-color-text-disabled)}.bm-text--primaryInverse{color:var(--bm-sem-color-text-primary-inverse)}.bm-text--secondaryInverse{color:var(--bm-sem-color-text-secondary-inverse)}.bm-text--expressive{color:var(--bm-expressive-color-fg)}.bm-text--expressiveStronger{color:var(--bm-expressive-color-fg-stronger)}.bm-text--expressiveInverse{color:var(--bm-expressive-color-inverse-fg)}.bm-text--expressiveInverseStronger{color:var(--bm-expressive-color-inverse-fg-stronger)}";
+var k = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, e = (m, a, n, s) => {
+  for (var o = s > 1 ? void 0 : s ? $(a, n) : a, p = m.length - 1, b; p >= 0; p--)
+    (b = m[p]) && (o = (s ? b(a, n, o) : b(o)) || o);
+  return s && o && k(a, n, o), o;
+};
+const { baseClassNamePrefix: S, classModifierPrefix: i } = f("text");
+let t = class extends l {
+  constructor() {
+    super(...arguments), this.kind = "body-md", this.bold = !1, this.block = !1, this.truncate = !1, this.compact = !1, this.strikethrough = !1, this.underline = !1, this.italic = !1;
+  }
+  getClassNames() {
+    const m = !this.kind.includes("body");
+    this.bold && m && console.warn(
+      "The `bold` prop is not supported for heading, label or detail `kind` variants. Use the `bold` for body `kind` variants."
+    );
+    const a = this.kind || "body-md";
+    return d(
+      S,
+      this.theme && y(this.theme),
+      `${c}${a}`,
+      this.compact && `${c}${u}${this.kind}`,
+      this.color && `${i}${this.color}`,
+      this.bold && !m && `${i}body-bold`,
+      this.wordBreak && `${i}${this.wordBreak}`,
+      this.alignment && `${i}${this.alignment}`,
+      this.block && `${i}block`,
+      this.truncate && `${i}truncate`,
+      this.compact && `${i}compact`,
+      this.strikethrough && `${i}strikethrough`,
+      this.underline && `${i}underline`,
+      this.italic && `${i}italic`
+    );
+  }
+  render() {
+    return x`
+      <span class="${this.getClassNames()}">
+        <slot>${this.text}</slot>
+      </span>
+    `;
+  }
+};
+t.styles = v(w);
+e([
+  r()
+], t.prototype, "text", 2);
+e([
+  r({ type: String })
+], t.prototype, "theme", 2);
+e([
+  r({
+    type: String
+  })
+], t.prototype, "kind", 2);
+e([
+  r({
+    type: String
+  })
+], t.prototype, "color", 2);
+e([
+  r({
+    type: String
+  })
+], t.prototype, "wordBreak", 2);
+e([
+  r({
+    type: String
+  })
+], t.prototype, "alignment", 2);
+e([
+  r({ type: Boolean })
+], t.prototype, "bold", 2);
+e([
+  r({ type: Boolean })
+], t.prototype, "block", 2);
+e([
+  r({ type: Boolean })
+], t.prototype, "truncate", 2);
+e([
+  r({ type: Boolean })
+], t.prototype, "compact", 2);
+e([
+  r({ type: Boolean })
+], t.prototype, "strikethrough", 2);
+e([
+  r({ type: Boolean })
+], t.prototype, "underline", 2);
+e([
+  r({ type: Boolean })
+], t.prototype, "italic", 2);
+t = e([
+  h("bm-text")
+], t);
+export {
+  t as BmText
+};

package/Text/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Text';
+//# sourceMappingURL=index.d.ts.map

package/Text/index.js

@@ -0,0 +1,4 @@
+import { BmText as o } from "./Text.js";
+export {
+  o as BmText
+};

package/Tooltip/Tooltip.d.ts

@@ -0,0 +1,139 @@
+import { CSSResultGroup, LitElement, PropertyValues } from 'lit';
+import { AutoPlacementOptions, FlipOptions, ShiftOptions } from '@floating-ui/dom';
+import { Placement } from '@floating-ui/utils';
+import { MiddlewareModifier } from '@viasat/beam-shared/components/floatingui';
+import { TooltipTriggerSize } from '@viasat/beam-shared/components/tooltip';
+import { ThemeTypes } from '@viasat/beam-shared/utils/constants';
+export { type ChangeEvent } from '../../utils/mixins/ControlledToggle';
+declare const BmTooltip_base: import('../../utils/mixins/types').Constructor<import('../../utils/mixins/FloatingUI').FloatingInterface> & typeof LitElement;
+/**
+ * `bm-tooltip`
+ *
+ * @slot text - The content of Tooltip
+ * @slot trigger - The element that triggers Tooltip
+ *
+ * @fires bm-toggle - Dispatched when the Tooltip is toggled
+ *
+ */
+export declare class BmTooltip extends BmTooltip_base {
+    static styles: CSSResultGroup;
+    /**
+     * Specify the theme of Tooltip. By default it inherits the theme from the parent
+     */
+    theme: ThemeTypes | undefined;
+    /**
+     * Control the visibility of Tooltip
+     */
+    open?: boolean;
+    /**
+     * Open state of the element
+     */
+    _isOpen?: boolean;
+    /**
+     * Whether the arrow is visible
+     *
+     * @default false
+     */
+    hideArrow: boolean;
+    /**
+     * Specify the placement of Tooltip relative to the anchor
+     *
+     * @default 'top'
+     */
+    placement?: Placement;
+    /**
+     * Specify if Tooltip should automatically choose the placement that has the most space.
+     * <a href="https://floating-ui.com/docs/autoplacement#options" target="_blank" rel="noopener noreferrer">AutoPlacementOptions</a>
+     *
+     */
+    autoPlacement?: boolean | AutoPlacementOptions;
+    /**
+     * Specify if Tooltip should flip to the opposite side if there is not enough space.
+     * Cannot be used with `autoPlacement`.
+     * <a href="https://floating-ui.com/docs/flip#options" target="_blank" rel="noopener noreferrer">FlipOptions</a>
+     *
+     * @default true
+     */
+    flip?: boolean | FlipOptions;
+    /**
+     * Specify if Tooltip should shift to keep itself in view.
+     * <a href="https://floating-ui.com/docs/shift#options" target="_blank" rel="noopener noreferrer">ShiftOptions</a>
+     *
+     * @default true
+     */
+    shift: boolean | ShiftOptions;
+    /**
+     * Specify if Tooltip should hide when the anchor is not in view.
+     * <a href="https://floating-ui.com/docs/hide#options" target="_blank" rel="noopener noreferrer">HideOptions</a>
+     *
+     *  @default true
+     */
+    autoHiding: boolean | Record<string, unknown>;
+    /**
+     * Pass an array to override the floating-ui middleware
+     * or a function to modify the Beam-default middleware array.
+     * <a href="https://floating-ui.com/docs/middleware" target="_blank" rel="noopener noreferrer">Middleware</a>
+     */
+    middleware?: MiddlewareModifier;
+    /**
+     * Control the default visibility of Tooltip
+     *
+     * @default false
+     */
+    defaultOpen: boolean;
+    /**
+     * Specify the delay in milliseconds before Tooltip appears
+     * when the anchor is hovered
+     *
+     * @default 0
+     */
+    showDelay: number;
+    /**
+     * Enable the Popover API internally on supported browsers
+     *
+     * @default true
+     */
+    popoverAPI: boolean;
+    /**
+     * Disable aria-describedby and id attributes on the floating and anchor content
+     *
+     * @default false
+     */
+    disableAutoAria: boolean;
+    /**
+     * Override the auto-generated id attached to the trigger for aria-describedby
+     *
+     * @default automatic
+     */
+    autoDescribedById: string;
+    /**
+     * Prevent Tooltip from appearing
+     */
+    disabled: boolean;
+    /**
+     * Specify the size of the Tooltip trigger. `none` to leave uncontrolled.
+     */
+    triggerSize: TooltipTriggerSize;
+    constructor();
+    willUpdate(changedProperties: PropertyValues<this>): void;
+    render(): import('lit-html').TemplateResult<1>;
+}
+export declare class BmTooltipIconTrigger extends LitElement {
+    static styles: CSSResultGroup;
+    /**
+     * Specify the size of the Tooltip trigger. `none` to leave uncontrolled.
+     */
+    size: TooltipTriggerSize;
+    /**
+     * Prevent the trigger from being interacted with
+     */
+    disabled: boolean;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'bm-tooltip': BmTooltip;
+        'bm-tooltip-icon-trigger': BmTooltipIconTrigger;
+    }
+}
+//# sourceMappingURL=Tooltip.d.ts.map