import { X as g, w as r, ct as P, cW as S, Z as d, et as $, az as V, U as x, F as e, aB as D, eu as v, a6 as o, G as u, a7 as n, a8 as i, Y as s, af as m, a9 as E, aa as B, ac as H, ab as k, O as y, dg as z } from "./603b75d9.js";
import { useRef as F, useState as N, useContext as h } from "react";
import { formDataChildren as R, FormDataPropertyView as M } from "./f9847c56.js";
import "react-dom";
const j = g.div`
  background: ${(a) => a.$src && `url(${a.$src})`} no-repeat 50% 50%;
  background-size: contain;
`, A = g.div`
  &,
  .ant-carousel {
    height: 100%;
    background: ${(a) => a.$bg};
    ${(a) => a.$animationStyle}
  }
`;
let c = function() {
  const a = {
    autoPlay: r(y, !0),
    data: r(P, JSON.stringify(["https://temp.im/403x192", "https://temp.im/403x192"])),
    onEvent: S,
    showDots: r(y, !0),
    dotPosition: r(z, "bottom"),
    style: d($, "style"),
    animationStyle: d(V, "animationStyle"),
    ...R
  };
  return new x(a, (t) => {
    const l = F(null), [C, w] = N(0), p = () => {
      l.current && w(l.current.clientHeight);
    };
    return /* @__PURE__ */ e(A, {
      ref: l,
      $bg: t.style.background,
      $animationStyle: t.animationStyle,
      children: /* @__PURE__ */ e(D, {
        onResize: p,
        children: /* @__PURE__ */ e(v, {
          dots: t.showDots,
          dotPosition: t.dotPosition,
          autoplay: t.autoPlay,
          afterChange: () => t.onEvent("change"),
          children: t.data.map((f, b) => /* @__PURE__ */ e("div", {
            children: /* @__PURE__ */ e(j, {
              $src: f,
              style: {
                height: C
              }
            })
          }, b))
        })
      })
    });
  }).setPropertyViewFn((t) => /* @__PURE__ */ o(u, {
    children: [/* @__PURE__ */ e(n, {
      name: i.basic,
      children: t.data.propertyView({
        label: s("data")
      })
    }), ["logic", "both"].includes(h(m).editorModeStatus) && /* @__PURE__ */ o(u, {
      children: [/* @__PURE__ */ e(M, {
        ...t
      }), /* @__PURE__ */ o(n, {
        name: i.interaction,
        children: [t.onEvent.getPropertyView(), E(t), t.autoPlay.propertyView({
          label: s("carousel.autoPlay")
        })]
      })]
    }), ["layout", "both"].includes(h(m).editorModeStatus) && /* @__PURE__ */ o(u, {
      children: [/* @__PURE__ */ o(n, {
        name: i.layout,
        children: [t.showDots.propertyView({
          label: s("carousel.showDots")
        }), t.dotPosition.propertyView({
          label: s("carousel.dotPosition"),
          radioButton: !0
        })]
      }), /* @__PURE__ */ e(n, {
        name: i.style,
        children: t.style.getPropertyView()
      }), /* @__PURE__ */ e(n, {
        name: i.animationStyle,
        hasTooltip: !0,
        children: t.animationStyle.getPropertyView()
      })]
    })]
  })).build();
}();
c = class extends c {
  autoHeight() {
    return !1;
  }
};
const J = B(c, [new H("data", s("data")), k]);
export {
  J as CarouselComp
};
