@dndbuilder.com/react/dist/packages/react/src/components/controls/text-stroke.control.js

Drag and drop builder for React

"use client";
import { jsxs as e, jsx as r } from "react/jsx-runtime";
import { Label as n } from "../shared/label.js";
import { Popover as o } from "../shared/popover.js";
import { CiEdit as s } from "../../../../../node_modules/.pnpm/react-icons@5.5.0_react@19.0.0/node_modules/react-icons/ci/index.js";
import { ColorControl as d } from "./color.control.js";
import { SliderUnitControl as m } from "./slider-unit.control.js";
const C = ({ label: t, type: i, fieldName: l }) => /* @__PURE__ */ e("div", { className: "mt-4 flex items-center justify-between gap-1.5", children: [
  t && /* @__PURE__ */ r(n, { children: t }),
  /* @__PURE__ */ e(o, { children: [
    /* @__PURE__ */ r(
      o.Trigger,
      {
        asChild: !0,
        className: "cursor-pointer rounded-sm border bg-gray-50 px-3 py-1.5 transition-colors duration-200 hover:bg-gray-300",
        children: /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r(s, {}) })
      }
    ),
    /* @__PURE__ */ r(o.Portal, { children: /* @__PURE__ */ e(o.Content, { align: "end", alignOffset: -8, className: "w-[260px]", children: [
      /* @__PURE__ */ r(
        m,
        {
          responsive: !0,
          type: i,
          label: "Stroke Width",
          fieldName: `${l}.width`,
          className: "mt-0"
        }
      ),
      /* @__PURE__ */ r(d, { type: i, label: "Stroke Color", fieldName: `${l}.color` }),
      /* @__PURE__ */ r(o.Arrow, { width: 20, height: 9, fill: "white" })
    ] }) })
  ] })
] });
export {
  C as TextStrokeControl
};
//# sourceMappingURL=text-stroke.control.js.map