@odx/foundation 1.0.0-alpha.4 → 1.0.0-alpha.41

package/dist/components/slider/slider-marks.component.js

@@ -1,61 +0,0 @@
-import { consume } from '@lit/context';
-import { CustomElement, customElement } from '@odx/foundation';
-import { html, nothing } from 'lit';
-import { property } from 'lit/decorators.js';
-import { repeat } from 'lit/directives/repeat.js';
-import styles from './slider-marks.component.css.js';
-import { sliderContext } from './slider.models.js';
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-let OdxSliderMarksComponent = class extends CustomElement {
-  constructor() {
-    super(...arguments);
-    this.context = sliderContext.defaultValue;
-    this.showLabels = false;
-  }
-  async connectedCallback() {
-    super.connectedCallback?.();
-    this.slot = "marks";
-  }
-  render() {
-    const step = this.step ?? this.context.step;
-    const markCount = Math.floor(this.context.range / step);
-    const marks = new Array(markCount).fill(null).map((_, index) => step * index + this.context.min);
-    return html`
-      ${repeat(marks, (value) => this.renderMark(value))}
-      ${this.renderMark(this.context.max, true)}
-    `;
-  }
-  renderMark(value, last = false) {
-    const label = this.showLabels ? html`<odx-text part="mark-label" size="xs" highlight>${value}</odx-text>` : nothing;
-    return html`
-      <div part="mark" ?last=${last}>
-        <span part="mark-tick"></span>
-        ${label}
-      </div>
-    `;
-  }
-};
-__decorateClass([
-  consume({ context: sliderContext.context, subscribe: true })
-], OdxSliderMarksComponent.prototype, "context", 2);
-__decorateClass([
-  property({ type: Number })
-], OdxSliderMarksComponent.prototype, "step", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], OdxSliderMarksComponent.prototype, "showLabels", 2);
-OdxSliderMarksComponent = __decorateClass([
-  customElement("odx-slider-marks", [styles])
-], OdxSliderMarksComponent);
-
-export { OdxSliderMarksComponent };

package/dist/components/slider/slider.component.css.js

@@ -1,3 +0,0 @@
-const styles = ":host{--_track-size: var(--odx-size-25);--_track-color: var(--odx-slider-track-color, var(--odx-color-primary-rest));--_layer-background: 0;--_layer-interactive-disabled: 1;--_layer-interactive: 2;--_layer-foreground: 3;display:flex;flex-direction:column;place-content:center;min-height:var(--odx-size-300);padding-block-start:var(--odx-size-75);padding-block-end:var(--odx-size-50);padding-inline:var(--odx-size-75);cursor:pointer}:host(:active){cursor:grabbing}:host::part(container){block-size:var(--_track-size);position:relative;background-color:var(--odx-palette-coolgray-40);border-radius:var(--odx-border-radius-sm)}";
-
-export { styles as default };

package/dist/components/slider/slider.component.d.ts

@@ -1,27 +0,0 @@
-import { CustomElement } from '@odx/foundation';
-import { DragController } from '@odx/foundation/cdk';
-import { TemplateResult } from 'lit';
-import { OdxSliderHandleComponent } from './slider-handle.component';
-import { SliderLabelVisibility } from './slider.models';
-declare global {
-    interface HTMLElementTagNameMap {
-        'odx-slider': OdxSliderComponent;
-    }
-}
-export declare class OdxSliderComponent extends CustomElement {
-    #private;
-    protected dragController: DragController<OdxSliderHandleComponent>;
-    protected context: import('./slider.models').SliderContext;
-    protected container: HTMLElement;
-    set step(value: number);
-    get step(): number;
-    set minRange(value: number);
-    get minRange(): number;
-    set labelVisibility(value: SliderLabelVisibility);
-    get labelVisibility(): SliderLabelVisibility;
-    set unit(value: string);
-    get unit(): string;
-    constructor();
-    protected render(): TemplateResult;
-}
-//# sourceMappingURL=slider.component.d.ts.map

package/dist/components/slider/slider.component.js

@@ -1,119 +0,0 @@
-import { provide } from '@lit/context';
-import { CustomElement, getKeyboardEventInfo, customElement } from '@odx/foundation';
-import { DragController } from '@odx/foundation/cdk';
-import { minBy, maxBy } from 'es-toolkit';
-import { isServer, html } from 'lit';
-import { query, property } from 'lit/decorators.js';
-import { OdxSliderHandleComponent } from './slider-handle.component.js';
-import styles from './slider.component.css.js';
-import { sliderContext } from './slider.models.js';
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __typeError = (msg) => {
-  throw TypeError(msg);
-};
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
-var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
-var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-var _handleKeyboardEvent, _handleSlotChange;
-let OdxSliderComponent = class extends CustomElement {
-  constructor() {
-    super();
-    this.dragController = new DragController(this, {
-      getDraggableElements: () => Array.from(this.querySelectorAll(OdxSliderHandleComponent.selector)),
-      getContainer: () => this.container
-    });
-    this.context = sliderContext.defaultValue;
-    __privateAdd(this, _handleKeyboardEvent, (event) => {
-      const { actions, direction } = getKeyboardEventInfo(event);
-      const target = event.target;
-      if (target.localName !== OdxSliderHandleComponent.selector || actions.tab || actions.backTab || target.disabled) return;
-      event.preventDefault();
-      event.stopPropagation();
-      if (direction.left || direction.down) {
-        target.value -= this.step;
-      } else if (direction.right || direction.up) {
-        target.value += this.step;
-      } else if (actions.start) {
-        target.value = this.context.min;
-      } else if (actions.end) {
-        target.value = this.context.max;
-      }
-    });
-    __privateAdd(this, _handleSlotChange, async () => {
-      const elements = this.dragController.draggableElements;
-      const min = minBy(elements, (elment) => elment.min)?.min ?? 0;
-      const max = maxBy(elements, (element) => element.max)?.max ?? 1;
-      this.context = { ...this.context, min, max, range: Math.abs(max - min) };
-    });
-    if (!isServer) {
-      this.addEventListener("keydown", __privateGet(this, _handleKeyboardEvent));
-    }
-  }
-  set step(value) {
-    this.context = { ...this.context, step: Math.max(1, value) };
-  }
-  get step() {
-    return this.context.step;
-  }
-  set minRange(value) {
-    this.context = { ...this.context, minRange: Math.max(0, value) };
-  }
-  get minRange() {
-    return this.context.minRange;
-  }
-  set labelVisibility(value) {
-    this.context = { ...this.context, labelVisibility: value };
-  }
-  get labelVisibility() {
-    return this.context.labelVisibility;
-  }
-  set unit(value) {
-    this.context = { ...this.context, unit: value.trim() };
-  }
-  get unit() {
-    return this.context.unit;
-  }
-  render() {
-    return html`
-      <div part="container" role="presentation">
-        <slot name="thumbs" @slotchange=${__privateGet(this, _handleSlotChange)}></slot>
-        <slot name="marks"></slot>
-      </div>
-    `;
-  }
-};
-_handleKeyboardEvent = new WeakMap();
-_handleSlotChange = new WeakMap();
-__decorateClass([
-  provide({ context: sliderContext.context })
-], OdxSliderComponent.prototype, "context", 2);
-__decorateClass([
-  query('[part="container"]', true)
-], OdxSliderComponent.prototype, "container", 2);
-__decorateClass([
-  property({ type: Number })
-], OdxSliderComponent.prototype, "step", 1);
-__decorateClass([
-  property({ type: Number })
-], OdxSliderComponent.prototype, "minRange", 1);
-__decorateClass([
-  property()
-], OdxSliderComponent.prototype, "labelVisibility", 1);
-__decorateClass([
-  property()
-], OdxSliderComponent.prototype, "unit", 1);
-OdxSliderComponent = __decorateClass([
-  customElement("odx-slider", [styles])
-], OdxSliderComponent);
-
-export { OdxSliderComponent };

package/dist/components/slider/slider.models.js

@@ -1,17 +0,0 @@
-import { createContext } from '@lit/context';
-
-const SliderLabelVisibility = {
-  AUTO: "auto",
-  HIDDEN: "hidden"
-};
-const SliderTrackVisibility = {
-  AUTO: "auto",
-  HIDDEN: "hidden",
-  VISIBLE: "visible"
-};
-const sliderContext = {
-  context: createContext("odx-slider::context"),
-  defaultValue: { step: 1, min: 0, max: 100, minRange: 0, maxRange: 0, range: 100, labelVisibility: SliderLabelVisibility.AUTO, unit: "" }
-};
-
-export { SliderLabelVisibility, SliderTrackVisibility, sliderContext };

package/dist/components/spacer/spacer.component.css.js

@@ -1,3 +0,0 @@
-const styles = ":host{--gap-offset: 0;--size: 0;display:block;inline-size:100%;block-size:var(--size);margin:calc(-1 * var(--gap-offset)) 0}:host([dynamic]){block-size:100%;flex:1 1 auto;max-block-size:var(--size)}:host([horizontal]){block-size:100%;inline-size:var(--size);margin:0 calc(-1 * var(--gap-offset))}:host([dynamic][horizontal]){inline-size:100%;max-inline-size:var(--size)}:host([fill]){min-block-size:var(--size);flex:1 1 var(--size)}:host([fill][horizontal]){min-inline-size:var(--size);flex:1 1 var(--size)}:host([fill][dynamic]){min-block-size:auto;min-inline-size:auto;max-block-size:100%;flex:1 1 auto}:host-context(odx-rail-navigation){--size: var(--odx-size-300);--gap-offset: var(--odx-size-75)}";
-
-export { styles as default };

package/dist/components/spacer/spacer.component.d.ts

@@ -1,13 +0,0 @@
-import { CustomElement } from '@odx/foundation';
-declare global {
-    interface HTMLElementTagNameMap {
-        'odx-spacer': OdxSpacerComponent;
-    }
-}
-export declare class OdxSpacerComponent extends CustomElement {
-    horizontal: boolean;
-    dynamic: boolean;
-    fill: boolean;
-    protected render(): string;
-}
-//# sourceMappingURL=spacer.component.d.ts.map

package/dist/components/spacer/spacer.component.js

@@ -1,39 +0,0 @@
-import { CustomElement, customElement } from '@odx/foundation';
-import { property } from 'lit/decorators.js';
-import styles from './spacer.component.css.js';
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-let OdxSpacerComponent = class extends CustomElement {
-  constructor() {
-    super(...arguments);
-    this.horizontal = false;
-    this.dynamic = false;
-    this.fill = false;
-  }
-  render() {
-    return "";
-  }
-};
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], OdxSpacerComponent.prototype, "horizontal", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], OdxSpacerComponent.prototype, "dynamic", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], OdxSpacerComponent.prototype, "fill", 2);
-OdxSpacerComponent = __decorateClass([
-  customElement("odx-spacer", [styles])
-], OdxSpacerComponent);
-
-export { OdxSpacerComponent };

package/dist/components/spinbox/spinbox.component.css.js

@@ -1,3 +0,0 @@
-const styles = ":host{--_color-background: var(--odx-color-input-control-fill);--_color-stroke: var(--odx-color-input-control-stroke);--_color-foreground: var(--odx-color-foreground);display:grid;width:min-content;grid-template-columns:auto 1fr auto;grid-template-areas:\"decrement input increment\"}[part~=action],::slotted(input){border:var(--odx-border-width-thin) solid var(--_color-stroke);background-color:var(--_color-background);outline:var(--odx-focus-ring-outline);outline-offset:var(--odx-focus-ring-offset);block-size:var(--odx-size-225);color:var(--_color-foreground);transition:var(--odx-transition-reduced);transition-property:background-color,border-color,color,outline-color}::slotted(input){grid-area:input;min-width:auto;padding:0 var(--odx-size-75)!important;text-align:center;min-inline-size:var(--odx-size-400);appearance:textfield;font-weight:var(--odx-typography-font-weight-medium)!important}[part~=action]{display:flex;place-content:center;place-items:center;inline-size:var(--odx-size-225);cursor:pointer;border-radius:var(--odx-border-radius-controls);font-size:var(--odx-typography-font-size-3)}[part~=action-increment]{grid-area:increment;border-start-start-radius:0;border-end-start-radius:0;border-inline-start:none}[part~=action-decrement]{grid-area:decrement;border-start-end-radius:0;border-end-end-radius:0;border-inline-end:none}[part~=action]:hover,::slotted(input:hover){--_color-background: var(--odx-color-input-control-fill-hover)}::slotted(input:hover){--_color-stroke: var(--odx-color-input-control-stroke-hover)}[part~=action]:focus-visible,::slotted(input:focus-visible){outline-color:var(--odx-focus-ring-color);z-index:1}:host([aria-disabled=\"true\"]) ::slotted(input),[part~=action]:disabled{--_color-background: var(--odx-color-disabled-fill);--_color-foreground: var(--odx-color-disabled-foreground);cursor:not-allowed}:host([compact]:not([compact=\"false\"])){grid-template-columns:1fr auto;grid-template-rows:1fr 1fr;grid-template-areas:\"input increment\" \"input decrement\";[part~=action]{block-size:calc(var(--odx-size-225) / 2);font-size:var(--odx-typography-font-size-1);border-inline-end:var(--odx-border-width-thin) solid var(--odx-color-input-control-stroke);border-inline-start:none;border-radius:var(--odx-border-radius-controls)}[part~=action-increment]{border-block-end:none;border-start-start-radius:0;border-end-start-radius:0;border-end-end-radius:0}[part~=action-decrement]{border-start-start-radius:0;border-end-start-radius:0;border-start-end-radius:0}::slotted(input){border-start-start-radius:var(--odx-border-radius-controls);border-end-start-radius:var(--odx-border-radius-controls)}}";
-
-export { styles as default };

package/dist/components/spinbox/spinbox.component.js

@@ -1,94 +0,0 @@
-import { CanBeDisabled, CustomElement, customElement } from '@odx/foundation';
-import { html } from 'lit';
-import { queryAssignedElements, property } from 'lit/decorators.js';
-import styles from './spinbox.component.css.js';
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __typeError = (msg) => {
-  throw TypeError(msg);
-};
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
-var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
-var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-var _handleSlotChange, _handleInputFocus;
-let OdxSpinboxComponent = class extends CanBeDisabled(CustomElement) {
-  constructor() {
-    super(...arguments);
-    this.compact = false;
-    __privateAdd(this, _handleSlotChange, () => {
-      this.inputElement?.removeEventListener("focus", __privateGet(this, _handleInputFocus));
-      if (!this.inputElement) return;
-      this.inputElement.type = "number";
-      this.inputElement.value = this.inputElement.value || this.inputElement.min;
-      this.inputElement.addEventListener("focus", __privateGet(this, _handleInputFocus));
-      this.requestUpdate();
-    });
-    __privateAdd(this, _handleInputFocus, () => {
-      this.inputElement?.select();
-    });
-  }
-  get inputElement() {
-    return this.inputElements[0] ?? null;
-  }
-  render() {
-    const min = this.inputElement?.min ? Number(this.inputElement.min) : null;
-    const max = this.inputElement?.max ? Number(this.inputElement.max) : null;
-    const value = this.inputElement?.value ? Number(this.inputElement.value) : null;
-    const canStepDown = min === null || value === null || value > min;
-    const canStepUp = max === null || value === null || value < max;
-    if (this.inputElement) {
-      this.inputElement.disabled = this.disabled;
-    }
-    const decrementAction = html`
-      <button part="action action-decrement" @click=${this.stepDown} ?disabled=${this.disabled || !canStepDown}>
-        <odx-icon name="minus"></odx-icon>
-      </button>
-    `;
-    const incrementAction = html`
-      <button part="action action-increment" @click=${this.stepUp} ?disabled=${this.disabled || !canStepUp}>
-        <odx-icon name="plus"></odx-icon>
-      </button>
-    `;
-    const slot = html`<slot @slotchange=${__privateGet(this, _handleSlotChange)}></slot>`;
-    if (this.compact) {
-      return html`${slot}${incrementAction}${decrementAction}`;
-    }
-    return html`${decrementAction}${slot}${incrementAction}`;
-  }
-  stepUp() {
-    if (!this.inputElement) return;
-    this.inputElement.stepUp();
-    this.requestUpdate();
-  }
-  stepDown() {
-    if (!this.inputElement) return;
-    this.inputElement.stepDown();
-    this.requestUpdate();
-  }
-};
-_handleSlotChange = new WeakMap();
-_handleInputFocus = new WeakMap();
-OdxSpinboxComponent.shadowRootOptions = {
-  mode: "open",
-  delegatesFocus: true
-};
-__decorateClass([
-  queryAssignedElements({ selector: "input", flatten: true })
-], OdxSpinboxComponent.prototype, "inputElements", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], OdxSpinboxComponent.prototype, "compact", 2);
-OdxSpinboxComponent = __decorateClass([
-  customElement("odx-spinbox", [styles])
-], OdxSpinboxComponent);
-
-export { OdxSpinboxComponent };

package/dist/components/stack/stack.component.css.js

@@ -1,3 +0,0 @@
-const styles = ":host{--gap: 0;display:flex;flex-direction:row;max-inline-size:100%;inline-size:100%;gap:var(--gap)}:host([vertical]){flex-direction:column}:host([wrap]){flex-wrap:wrap}:host([gap=\"none\"]){--gap: 0}:host([gap=\"xs\"]){--gap: var(--odx-size-25)}:host([gap=\"sm\"]){--gap: var(--odx-size-50)}:host,:host([gap=\"md\"]){--gap: var(--odx-size-75)}:host([gap=\"lg\"]){--gap: var(--odx-size-150)}:host([gap=\"xl\"]){--gap: var(--odx-size-225)}:host,:host([align=\"start\"]){align-items:flex-start}:host([align=\"end\"]){align-items:end}:host([align=\"center\"]){align-items:center}:host([align=\"stretch\"]){align-items:stretch}:host([justify=\"center\"]){justify-content:center}:host,:host([justify=\"start\"]){justify-content:flex-start}:host([justify=\"end\"]){justify-content:flex-end}:host([justify=\"stretch\"]){justify-content:stretch}:host([justify=\"space-between\"]){justify-content:space-between}:host([justify=\"space-around\"]){justify-content:space-around}:host([justify=\"space-evenly\"]){justify-content:space-evenly}";
-
-export { styles as default };

package/dist/components/stack/stack.component.js

@@ -1,45 +0,0 @@
-import { CustomElement, customElement } from '@odx/foundation';
-import { html } from 'lit';
-import { property } from 'lit/decorators.js';
-import styles from './stack.component.css.js';
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-let OdxStackComponent = class extends CustomElement {
-  constructor() {
-    super(...arguments);
-    this.vertical = false;
-    this.wrap = false;
-  }
-  render() {
-    return html`<slot></slot>`;
-  }
-};
-__decorateClass([
-  property({ attribute: "align-items", reflect: true })
-], OdxStackComponent.prototype, "align", 2);
-__decorateClass([
-  property({ attribute: "justify-content", reflect: true })
-], OdxStackComponent.prototype, "justify", 2);
-__decorateClass([
-  property({ reflect: true })
-], OdxStackComponent.prototype, "gap", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], OdxStackComponent.prototype, "vertical", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], OdxStackComponent.prototype, "wrap", 2);
-OdxStackComponent = __decorateClass([
-  customElement("odx-stack", [styles])
-], OdxStackComponent);
-
-export { OdxStackComponent };

package/dist/components/stack/stack.models.js

@@ -1,23 +0,0 @@
-const StackAlign = {
-  START: "start",
-  END: "end",
-  CENTER: "center"
-};
-const StackGap = {
-  NONE: "none",
-  XS: "xs",
-  SM: "sm",
-  MD: "md",
-  LG: "lg",
-  XL: "xl"
-};
-const StackJustify = {
-  START: "start",
-  END: "end",
-  CENTER: "center",
-  SPACE_BETWEEN: "space-between",
-  SPACE_AROUND: "space-around",
-  SPACE_EVENLY: "space-evenly"
-};
-
-export { StackAlign, StackGap, StackJustify };

package/dist/components/switch/switch.component.css.js

@@ -1,3 +0,0 @@
-const styles = "*{box-sizing:border-box}:host{--_indicator-space: var(--odx-size-12);--_indicator-size: calc(var(--odx-size-150) - var(--_indicator-space) * 2);--_indicator-color-background: var(--odx-color-selection-control-fill);--_indicator-color-stroke: var(--odx-color-selection-control-stroke);--_indicator-track-color-background: var(--odx-color-selection-control-fill);--_label-color-foreground: var(--odx-color-foreground);cursor:pointer;display:inline-flex;margin:var(--odx-size-37) var(--odx-size-75);user-select:none;border-radius:var(--odx-border-radius-controls);outline:var(--odx-focus-ring-outline);transition-property:background-color border-color outline-color}:host,.indicator,.content{transition:var(--odx-transition-reduced)}.indicator{display:flex;place-items:center;block-size:var(--odx-size-150);position:relative}.indicator:before,.indicator:after{content:\"\";display:block;border-radius:var(--odx-size-225);box-sizing:border-box;transition:inherit;border-radius:var(--odx-border-radius-circle);border:var(--odx-border-width-thin) solid var(--_indicator-color-stroke)}.indicator:before{background-color:var(--_indicator-track-color-background);block-size:var(--odx-size-37);inline-size:var(--odx-size-225)}.indicator:after{display:flex;place-content:center;place-items:center;block-size:var(--_indicator-size);inline-size:var(--_indicator-size);flex-shrink:0;background-color:var(--_indicator-color-background);color:var(--_indicator-color-foreground);transition-property:background-color,border-color,transform;position:absolute;inset-inline-start:0;box-shadow:var(--odx-shadow-level-0)}.label{display:inline-block;cursor:inherit}.content{margin-inline-start:var(--odx-size-75);padding-inline-end:var(--odx-size-25);color:var(--_label-color-foreground);transition-property:color}:host(:empty) .content{display:none}:host(:hover){--_indicator-color-stroke: var(--odx-color-selection-control-stroke-hover);--_indicator-color-background: var(--odx-color-selection-control-fill-hover)}:host(:focus-visible){outline-color:var(--odx-focus-ring-color)}:host([aria-checked=\"true\"]){--_indicator-color-background: var(--odx-color-selection-control-fill-selected);--_indicator-color-stroke: var(--odx-color-selection-control-stroke-selected);--_indicator-track-color-background: var(--odx-color-selection-control-fill-selected);.indicator:after{transform:translate(var(--odx-size-225)) translate(-100%)}}:host([aria-checked=\"true\"]:not([aria-disabled]):hover){--_indicator-color-background: var(--odx-color-selection-control-fill-selected-hover)}:host([aria-disabled=\"true\"]){--_indicator-color-background: var(--odx-color-disabled-fill);--_indicator-color-stroke: var(--odx-color-disabled-stroke);--_indicator-track-color-background: var(--odx-color-disabled-fill);--_label-color-foreground: var(--odx-color-disabled-foreground);cursor:not-allowed}:host([aria-disabled=\"true\"][aria-checked=\"true\"]){--_indicator-color-background: var(--odx-color-disabled-fill-selected);--_indicator-color-stroke: var(--_indicator-color-background);--_indicator-track-color-background: var(--odx-color-disabled-fill-selected)}";
-
-export { styles as default };

package/dist/components/switch/switch.component.d.ts

@@ -1,12 +0,0 @@
-import { CheckboxFormControl } from '@odx/foundation';
-import { TemplateResult } from 'lit';
-declare global {
-    interface HTMLElementTagNameMap {
-        'odx-switch': OdxSwitchComponent;
-    }
-}
-export declare class OdxSwitchComponent extends CheckboxFormControl {
-    connectedCallback(): void;
-    protected render(): TemplateResult;
-}
-//# sourceMappingURL=switch.component.d.ts.map

package/dist/components/switch/switch.component.js

@@ -1,36 +0,0 @@
-import { CheckboxFormControl, customElement } from '@odx/foundation';
-import { html } from 'lit';
-import styles from './switch.component.css.js';
-
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (decorator(result)) || result;
-  return result;
-};
-let OdxSwitchComponent = class extends CheckboxFormControl {
-  connectedCallback() {
-    super.connectedCallback();
-    this.role = "switch";
-  }
-  render() {
-    return html`
-      <div class="indicator"></div>
-      <div class="content">
-        <div class="label">
-          <slot></slot>
-        </div>
-        <div class="description">
-          <slot name="description"></slot>
-        </div>
-      </div>
-    `;
-  }
-};
-OdxSwitchComponent = __decorateClass([
-  customElement("odx-switch", [styles])
-], OdxSwitchComponent);
-
-export { OdxSwitchComponent };

package/dist/components/text/text.component.css.js

@@ -1,3 +0,0 @@
-const styles = ":host{display:block;text-decoration:inherit;color:var(--_color, inherit);font-size:var(--_font-size, inherit);line-height:var(--_line-height, inherit);font-weight:var(--_font-weight, inherit)}:host([inline]){display:inline-block}:host([emphasized]:not([emphasized=\"false\"])){--_font-weight: var(--odx-typography-font-weight-medium)}:host([size=\"xs\"]){--_font-size: var(--odx-typography-font-size-1);--_line-height: var(--odx-typography-line-height-1)}:host([size=\"sm\"]){--_font-size: var(--odx-typography-font-size-2);--_line-height: var(--odx-typography-line-height-2)}:host([size=\"md\"]){--_font-size: var(--odx-typography-font-size-3);--_line-height: var(--odx-typography-line-height-3)}";
-
-export { styles as default };

package/dist/components/text/text.component.d.ts

@@ -1,13 +0,0 @@
-import { CustomElement } from '@odx/foundation';
-import { TextSize, TextVariant } from './text.models';
-declare global {
-    interface HTMLElementTagNameMap {
-        'odx-text': OdxTextComponent;
-    }
-}
-export declare class OdxTextComponent extends CustomElement {
-    emphasized: boolean;
-    size?: TextSize;
-    variant?: TextVariant;
-}
-//# sourceMappingURL=text.component.d.ts.map

package/dist/components/text/text.component.js

@@ -1,34 +0,0 @@
-import { CustomElement, customElement } from '@odx/foundation';
-import { property } from 'lit/decorators.js';
-import styles from './text.component.css.js';
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-let OdxTextComponent = class extends CustomElement {
-  constructor() {
-    super(...arguments);
-    this.emphasized = false;
-  }
-};
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], OdxTextComponent.prototype, "emphasized", 2);
-__decorateClass([
-  property({ reflect: true })
-], OdxTextComponent.prototype, "size", 2);
-__decorateClass([
-  property({ reflect: true })
-], OdxTextComponent.prototype, "variant", 2);
-OdxTextComponent = __decorateClass([
-  customElement("odx-text", [styles])
-], OdxTextComponent);
-
-export { OdxTextComponent };

package/dist/components/text/text.models.js

@@ -1,12 +0,0 @@
-const TextSize = {
-  XS: "xs",
-  SM: "sm",
-  MD: "md"
-};
-const TextVariant = {
-  HINT: "hint",
-  ACCENT: "info",
-  DANGER: "danger"
-};
-
-export { TextSize, TextVariant };

package/dist/components/title/title.component.css.js

@@ -1,3 +0,0 @@
-const styles = ":host{display:block;font-family:var(--odx-typography-font-family-brand);font-size:var(--_font-size);font-weight:var(--_font-weight);line-height:var(--_line-height);color:inherit}:host,:host([size=\"xs\"]){--_font-size: var(--odx-breakpoint-font-size-heading-6);--_font-weight: var(--odx-typography-font-weight-semibold);--_line-height: var(--odx-breakpoint-line-height-heading-6)}:host([size=\"sm\"]){--_font-size: var(--odx-breakpoint-font-size-heading-5);--_font-weight: var(--odx-typography-font-weight-semibold);--_line-height: var(--odx-breakpoint-line-height-heading-5)}:host([size=\"md\"]){--_font-size: var(--odx-breakpoint-font-size-heading-4);--_font-weight: var(--odx-typography-font-weight-semibold);--_line-height: var(--odx-breakpoint-line-height-heading-4)}:host([size=\"lg\"]){--_font-size: var(--odx-breakpoint-font-size-heading-3);--_font-weight: var(--odx-typography-font-weight-semibold);--_line-height: var(--odx-breakpoint-line-height-heading-3)}:host([size=\"xl\"]){--_font-size: var(--odx-breakpoint-font-size-heading-2);--_font-weight: var(--odx-typography-font-weight-semibold);--_line-height: var(--odx-breakpoint-line-height-heading-2)}:host([size=\"xxl\"]){--_font-size: var(--odx-breakpoint-font-size-heading-1);--_font-weight: var(--odx-typography-font-weight-semibold);--_line-height: var(--odx-breakpoint-line-height-heading-1)}";
-
-export { styles as default };

package/dist/components/title/title.component.d.ts

@@ -1,13 +0,0 @@
-import { CustomElement } from '@odx/foundation';
-import { PropertyValueMap } from 'lit';
-import { TitleSize } from './title.models';
-declare global {
-    interface HTMLElementTagNameMap {
-        'odx-title': OdxTitleComponent;
-    }
-}
-export declare class OdxTitleComponent extends CustomElement {
-    size?: TitleSize | null;
-    protected willUpdate(props: PropertyValueMap<this>): void;
-}
-//# sourceMappingURL=title.component.d.ts.map

package/dist/components/title/title.component.js

@@ -1,31 +0,0 @@
-import { CustomElement, requestUpdateOnAriaChange, customElement } from '@odx/foundation';
-import { property } from 'lit/decorators.js';
-import styles from './title.component.css.js';
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-let OdxTitleComponent = class extends CustomElement {
-  willUpdate(props) {
-    super.willUpdate(props);
-    if (props.has("ariaLevel")) {
-      this.role = this.ariaLevel !== null ? "heading" : null;
-    }
-  }
-};
-__decorateClass([
-  property({ reflect: true })
-], OdxTitleComponent.prototype, "size", 2);
-OdxTitleComponent = __decorateClass([
-  requestUpdateOnAriaChange(["ariaLevel"]),
-  customElement("odx-title", [styles])
-], OdxTitleComponent);
-
-export { OdxTitleComponent };