"use client";
import { jsxs as i, jsx as t } from "react/jsx-runtime";
import { useAppSelector as g } from "../../hooks/use-app-selector.js";
import { CgPushLeft as l, CgPushRight as n } from "../../../../../node_modules/.pnpm/react-icons@5.5.0_react@19.0.0/node_modules/react-icons/cg/index.js";
import { useSettings as p } from "../../hooks/use-settings.js";
import { getCurrentBreakpoint as f } from "../../../../../store/selectors.js";
import { Unit as o } from "../../types/style.js";
import { SelectControl as c } from "./select.control.js";
import { SliderUnitControl as s } from "./slider-unit.control.js";
import { ToggleGroupControl as a } from "./toggle-group.control.js";
const R = ({ type: e, fieldName: r = "position" }) => {
  const m = g(f), [u] = p(
    `${r}.value.${m}`,
    e
  );
  return /* @__PURE__ */ i("div", { children: [
    /* @__PURE__ */ t(
      c,
      {
        type: e,
        fieldName: `${r}.value`,
        label: "Position",
        responsive: !0,
        options: [
          { content: "Relative", value: "relative" },
          { content: "Absolute", value: "absolute" },
          { content: "Fixed", value: "fixed" }
          // { content: 'Sticky', value: 'sticky' },
        ]
      }
    ),
    u && /* @__PURE__ */ i("div", { children: [
      /* @__PURE__ */ t(
        a,
        {
          type: e,
          fieldName: `${r}.horizontal`,
          responsive: !0,
          label: "Horizontal Position",
          controls: [
            {
              tooltipContent: "Left",
              toggleTrigger: /* @__PURE__ */ t(l, { className: "text-sm" }),
              value: "left"
            },
            {
              tooltipContent: "Right",
              toggleTrigger: /* @__PURE__ */ t(n, { className: "text-sm" }),
              value: "right"
            }
          ]
        }
      ),
      /* @__PURE__ */ t(
        s,
        {
          type: e,
          fieldName: `${r}.horizontalOffset`,
          label: "Offset",
          responsive: !0,
          units: [o.PX, o.REM, o.EM, o.PERCENTAGE]
        }
      ),
      /* @__PURE__ */ t(
        a,
        {
          type: e,
          fieldName: `${r}.vertical`,
          responsive: !0,
          label: "Vertical Position",
          controls: [
            {
              tooltipContent: "Top",
              toggleTrigger: /* @__PURE__ */ t(l, { className: "rotate-90 text-sm" }),
              value: "top"
            },
            {
              tooltipContent: "Bottom",
              toggleTrigger: /* @__PURE__ */ t(n, { className: "rotate-90 text-sm" }),
              value: "bottom"
            }
          ]
        }
      ),
      /* @__PURE__ */ t(
        s,
        {
          type: e,
          fieldName: `${r}.verticalOffset`,
          label: "Offset",
          responsive: !0,
          units: [o.PX, o.REM, o.EM, o.PERCENTAGE]
        }
      )
    ] })
  ] });
};
export {
  R as PositionControl
};
//# sourceMappingURL=position-control.js.map
