import { C as l, T as f } from "../chunks/typography.DJC_UXgs.js";
import { n as i, C as y } from "../chunks/lib-cortex-element.CVMmyPMC.js";
import { c as d } from "../chunks/component.styles.CRO4Odto.js";
import { T as g, f as n } from "../chunks/string.DUgD4c9f.js";
import { t as u } from "../chunks/converters.DkDtLstb.js";
import { c as v } from "../chunks/custom-element.L4WJXn1j.js";
import { w as h } from "../chunks/watch.BCJD77bD.js";
import { i as x, E as S, x as b } from "../chunks/lit-element.jLBm65_O.js";
import { r as T } from "../chunks/state.CSDxrqLd.js";
const w = x`:host{white-space:normal;display:inline}:host([is-preview]){background-color:var(--cx-color-primary-50,#e5f1ff);padding-inline:var(--cx-spacing-2x-small,4px)}.time{--color:var(--cx-color-primary);line-height:var(--cx-line-height-medium);margin-block-start:var(--cx-spacing-x-small);display:inline}`;
var C = Object.defineProperty, R = Object.getOwnPropertyDescriptor, e = (c, o, m, a) => {
  for (var r = a > 1 ? void 0 : a ? R(o, m) : o, s = c.length - 1, p; s >= 0; s--)
    (p = c[s]) && (r = (a ? p(o, m, r) : p(r)) || r);
  return a && r && C(o, m, r), r;
};
let t = class extends y {
  constructor() {
    super(...arguments), this.time = [], this.timecodeMode = g.Standard, this.frameRate = 24, this.isPreview = !1, this.typographyVariant = f.Small, this.timeString = "";
  }
  handleTimeChange() {
    if (!this.time?.length) {
      this.timeString = "";
      return;
    }
    if (this.time.length === 1 || this.time[0] === this.time[1]) {
      this.timeString = n(this.time[0], {
        frameRate: this.frameRate,
        mode: this.timecodeMode
      });
      return;
    }
    this.timeString = n(this.time[0], {
      frameRate: this.frameRate,
      mode: this.timecodeMode
    }) + " - " + n(this.time[1], {
      frameRate: this.frameRate,
      mode: this.timecodeMode
    });
  }
  render() {
    return this.time?.length ? b`<cx-typography class="time" variant=${this.typographyVariant}>${this.timeString}</cx-typography>` : S;
  }
};
t.styles = [d, w];
t.dependencies = {
  "cx-typography": l
};
e([
  i({
    attribute: "time",
    converter: u,
    reflect: !0,
    type: String
  })
], t.prototype, "time", 2);
e([
  i({ attribute: "timecode-mode", reflect: !0, type: String })
], t.prototype, "timecodeMode", 2);
e([
  i({ attribute: "frame-rate", reflect: !0, type: Number })
], t.prototype, "frameRate", 2);
e([
  i({ attribute: "is-preview", reflect: !0, type: Boolean })
], t.prototype, "isPreview", 2);
e([
  i({ attribute: "typography-variant", type: String })
], t.prototype, "typographyVariant", 2);
e([
  T()
], t.prototype, "timeString", 2);
e([
  h("time"),
  h("timecodeMode"),
  h("frameRate")
], t.prototype, "handleTimeChange", 1);
t = e([
  v("cx-timecode")
], t);
export {
  t as default
};
