import { X as l, dw as w, Y as n, a4 as f, a2 as y, aA as x, a3 as c, dx as $, w as C, Z as g, dy as S, az as b, a6 as a, G as h, a7 as i, a8 as o, af as m, a9 as v, F as e, dk as k, dz as V, U as A, aa as p, ac as T, ab as z, av as H, aw as B, ax as E, O as F, ak as P, an as M, ap as O, ao as N } from "./603b75d9.js";
import u, { useContext as s } from "react";
import { MarginControl as W } from "./f64a8554.js";
import { PaddingControl as D } from "./d50792b8.js";
import "react-dom";
const R = [P], j = (t) => H`
    border-radius: ${t.radius ? t.radius : "4px"};
    border: ${t.borderWidth ? t.borderWidth : "0px"} ${t.borderStyle ? t.borderStyle : "solid"} ${t.border};
    color: ${t.text};
    text-transform:${t.textTransform} !important;
    text-decoration:${t.textDecoration} !important;
    background: ${t.background};
    .markdown-body a {
      color: ${t.links};
    }
    .markdown-body {
      margin: ${t.margin} !important;	
      padding: ${t.padding};	
      width: ${B(t.margin)};	
      font-family: ${t.fontFamily} !important;
      font-style:${t.fontStyle} !important;
      font-size: ${t.textSize} !important;
      // height: ${E(t.margin)};
      h1 {
        line-height: 1.5;
      }
      h5 {
        line-height: 2.2;
      }
    }

    .markdown-body {
      &,
      p,
      div,
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        color: ${t.text};
        font-weight: ${t.textWeight} !important;
        line-height:${t.lineHeight};
      }
      img,
      pre {
        background-color: ${t.background};
        code {
          color: #000000;
        }
      }
    }
  `, J = l.div`
  height: 100%;
  overflow: auto;
  margin: 0;
  ${(t) => t.$animationStyle}
  ${(t) => t.$type === "text" && `
    white-space:break-spaces;
    line-height: 1.9;
    font-size: ${t.$styleConfig.textSize};
    font-weight: ${t.$styleConfig.textWeight};
    font-style: ${t.$styleConfig.fontStyle};
    font-family: ${t.$styleConfig.fontFamily};
    margin: ${t.$styleConfig.margin};
    padding: ${t.$styleConfig.padding};
  `};
  ${(t) => t.$styleConfig && j(t.$styleConfig)}
  display: flex;
  ${w};
  overflow-wrap: anywhere;
  .markdown-body {
    overflow-wrap: anywhere;
  }
`, U = l(M)`
  transform: rotate(90deg);
`, I = l(O)`
  transform: rotate(90deg);
`, _ = l(N)`
  transform: rotate(90deg);
`, G = [{
  label: "Markdown",
  value: "markdown"
}, {
  label: n("text"),
  value: "text"
}], X = [{
  label: /* @__PURE__ */ e(U, {}),
  value: "flex-start"
}, {
  label: /* @__PURE__ */ e(_, {}),
  value: "center"
}, {
  label: /* @__PURE__ */ e(I, {}),
  value: "flex-end"
}], Y = {
  text: f("text", n("textShow.text", {
    name: "{{currentUser.name}}"
  })),
  onEvent: y(R),
  autoHeight: x,
  type: c(G, "markdown"),
  horizontalAlignment: $(),
  contentScrollBar: C(F, !0),
  verticalAlignment: c(X, "center"),
  style: g(S, "style"),
  animationStyle: g(b, "animationStyle"),
  margin: W,
  padding: D
}, Z = u.memo((t) => /* @__PURE__ */ a(h, {
  children: [/* @__PURE__ */ a(i, {
    name: o.basic,
    children: [t.children.type.propertyView({
      label: n("value"),
      tooltip: n("textShow.valueTooltip"),
      radioButton: !0
    }), t.children.text.propertyView({})]
  }), ["logic", "both"].includes(s(m).editorModeStatus) && /* @__PURE__ */ a(i, {
    name: o.interaction,
    children: [v(t.children), t.children.onEvent.getPropertyView()]
  }), ["layout", "both"].includes(s(m).editorModeStatus) && /* @__PURE__ */ a(h, {
    children: [/* @__PURE__ */ a(i, {
      name: o.layout,
      children: [t.children.autoHeight.getPropertyView(), !t.children.autoHeight.getView() && t.children.contentScrollBar.propertyView({
        label: n("prop.contentScrollbar")
      }), !t.children.autoHeight.getView() && t.children.verticalAlignment.propertyView({
        label: n("textShow.verticalAlignment"),
        radioButton: !0
      }), t.children.horizontalAlignment.propertyView({
        label: n("textShow.horizontalAlignment"),
        radioButton: !0
      })]
    }), /* @__PURE__ */ e(i, {
      name: o.style,
      children: t.children.style.getPropertyView()
    }), /* @__PURE__ */ e(i, {
      name: o.animationStyle,
      hasTooltip: !0,
      children: t.children.animationStyle.getPropertyView()
    })]
  })]
})), q = u.memo((t) => {
  const r = t.text.value;
  return /* @__PURE__ */ e(J, {
    $animationStyle: t.animationStyle,
    $type: t.type,
    $styleConfig: t.style,
    style: {
      justifyContent: t.horizontalAlignment,
      alignItems: t.autoHeight ? "center" : t.verticalAlignment,
      textAlign: t.horizontalAlignment,
      rotate: t.style.rotation
    },
    onClick: () => t.onEvent("click"),
    children: /* @__PURE__ */ e(k, {
      hideScrollbar: !t.contentScrollBar,
      children: t.type === "markdown" ? /* @__PURE__ */ e(V, {
        children: r
      }) : r
    })
  });
}, (t, r) => JSON.stringify(t) === JSON.stringify(r));
let d = function() {
  return new A(Y, (t) => /* @__PURE__ */ e(q, {
    ...t
  })).setPropertyViewFn((t) => /* @__PURE__ */ e(Z, {
    children: t
  })).build();
}();
d = class extends d {
  autoHeight() {
    return this.children.autoHeight.getView();
  }
};
const nt = p(d, [new T("text", n("textShow.textDesc")), z]);
export {
  nt as TextComp
};
