"use client";
import { jsxs as o, jsx as e } from "react/jsx-runtime";
import { Accordion as t } from "../shared/accordion.js";
import { InfoMessage as d } from "../shared/info-message.js";
import { Label as f } from "../shared/label.js";
import { Separator as n } from "../shared/separator.js";
import { Tabs as i } from "../shared/tabs.js";
import { SettingsType as l } from "../../types/index.js";
import { Unit as a, PseudoClass as r } from "../../types/style.js";
import { MdAlignHorizontalLeft as C, MdOutlineAlignHorizontalCenter as A, MdAlignHorizontalRight as g } from "../../../../../node_modules/.pnpm/react-icons@5.5.0_react@19.0.0/node_modules/react-icons/md/index.js";
import { BackgroundControl as p } from "./background.control.js";
import { BorderControl as c } from "./border.control.js";
import { BoxShadowControl as N } from "./box-shadow.control.js";
import { CustomAttributeControl as D } from "./custom-attributes.control.js";
import { CustomCSSControl as h } from "./custom-css.control.js";
import { FlexOrderControl as E } from "./flex-order.control.js";
import { FlexSizeControl as x } from "./flex-size.control.js";
import { InputControl as m } from "./input.control.js";
import { PositionControl as y } from "./position-control.js";
import { SliderInputControl as b } from "./slider-input.control.js";
import { SpacingControl as u } from "./spacing.control.js";
import { SwitchControl as s } from "./switch.control.js";
import { ToggleGroupControl as V } from "./toggle-group.control.js";
import { DisplayControl as T } from "./display-control.js";
const W = () => /* @__PURE__ */ o(t, { defaultValue: "Layout", type: "single", collapsible: !0, children: [
  /* @__PURE__ */ o(t.Item, { value: "Layout", children: [
    /* @__PURE__ */ e(t.Trigger, { className: "p-4", children: "Layout" }),
    /* @__PURE__ */ o(t.Content, { className: "px-4", children: [
      /* @__PURE__ */ e(
        u,
        {
          type: l.ADVANCED,
          fieldName: "margin",
          label: "Margin",
          responsive: !0,
          className: "mt-0",
          units: [a.PX, a.REM, a.EM, a.PERCENTAGE]
        }
      ),
      /* @__PURE__ */ e(
        u,
        {
          type: l.ADVANCED,
          fieldName: "padding",
          label: "Padding",
          responsive: !0,
          units: [a.PX, a.REM, a.EM, a.PERCENTAGE]
        }
      ),
      /* @__PURE__ */ e(n, { className: "my-3" }),
      /* @__PURE__ */ e(
        V,
        {
          type: l.ADVANCED,
          fieldName: "alignSelf",
          label: "Align Self",
          responsive: !0,
          controls: [
            {
              tooltipContent: "Start",
              toggleTrigger: /* @__PURE__ */ e(C, { className: "text-sm" }),
              value: "start"
            },
            {
              tooltipContent: "Center",
              toggleTrigger: /* @__PURE__ */ e(A, { className: "rotate-90 text-sm" }),
              value: "center"
            },
            {
              tooltipContent: "End",
              toggleTrigger: /* @__PURE__ */ e(g, { className: "text-sm" }),
              value: "end"
            }
          ]
        }
      ),
      /* @__PURE__ */ e(d, { children: "This control will affect contained elements only." }),
      /* @__PURE__ */ e(
        E,
        {
          type: l.ADVANCED,
          fieldName: "order",
          customFieldName: "orderCustom"
        }
      ),
      /* @__PURE__ */ e(
        x,
        {
          type: l.ADVANCED,
          fieldName: "size",
          growFieldName: "grow",
          shrinkFieldName: "shrink"
        }
      ),
      /* @__PURE__ */ e(n, { className: "my-3" }),
      /* @__PURE__ */ e(T, { type: l.ADVANCED, fieldName: "display" }),
      /* @__PURE__ */ e(y, { fieldName: "position", type: l.ADVANCED }),
      /* @__PURE__ */ e(n, { className: "my-3" }),
      /* @__PURE__ */ e(
        m,
        {
          type: l.ADVANCED,
          fieldName: "zIndex",
          label: "Z-Index",
          responsive: !0,
          inputProps: { type: "number", className: "w-14" }
        }
      ),
      /* @__PURE__ */ e(m, { type: l.ADVANCED, fieldName: "cssId", label: "CSS ID" }),
      /* @__PURE__ */ e(m, { type: l.ADVANCED, fieldName: "cssClasses", label: "CSS Classes" })
    ] })
  ] }),
  /* @__PURE__ */ o(t.Item, { value: "Background", children: [
    /* @__PURE__ */ e(t.Trigger, { className: "p-4", children: "Background" }),
    /* @__PURE__ */ e(t.Content, { className: "px-4", children: /* @__PURE__ */ o(i, { defaultValue: r.DEFAULT, children: [
      /* @__PURE__ */ o(i.List, { className: "h-8 w-full rounded-full", children: [
        /* @__PURE__ */ e(
          i.Trigger,
          {
            className: "flex-1 rounded-full p-[3px] text-[13px]",
            value: r.DEFAULT,
            children: "Normal"
          }
        ),
        /* @__PURE__ */ e(
          i.Trigger,
          {
            className: "flex-1 rounded-full p-[3px] text-[13px]",
            value: r.HOVER,
            children: "Hover"
          }
        )
      ] }),
      /* @__PURE__ */ e(i.Content, { value: r.DEFAULT, children: /* @__PURE__ */ e(
        p,
        {
          fieldName: "background",
          mode: r.DEFAULT,
          type: l.ADVANCED
        }
      ) }),
      /* @__PURE__ */ e(i.Content, { value: r.HOVER, children: /* @__PURE__ */ e(
        p,
        {
          fieldName: "background",
          mode: r.HOVER,
          type: l.ADVANCED
        }
      ) })
    ] }) })
  ] }),
  /* @__PURE__ */ o(t.Item, { value: "Border", children: [
    /* @__PURE__ */ e(t.Trigger, { className: "p-4", children: "Border" }),
    /* @__PURE__ */ e(t.Content, { className: "mt-0 px-4", children: /* @__PURE__ */ o(i, { defaultValue: r.DEFAULT, children: [
      /* @__PURE__ */ o(i.List, { className: "h-8 w-full rounded-full", children: [
        /* @__PURE__ */ e(
          i.Trigger,
          {
            className: "flex-1 rounded-full p-[3px] text-[13px]",
            value: r.DEFAULT,
            children: "Normal"
          }
        ),
        /* @__PURE__ */ e(
          i.Trigger,
          {
            className: "flex-1 rounded-full p-[3px] text-[13px]",
            value: r.HOVER,
            children: "Hover"
          }
        )
      ] }),
      /* @__PURE__ */ o(i.Content, { value: r.DEFAULT, children: [
        /* @__PURE__ */ e(
          c,
          {
            fieldName: "border",
            mode: r.DEFAULT,
            type: l.ADVANCED
          }
        ),
        /* @__PURE__ */ e(
          N,
          {
            fieldName: "boxShadow",
            mode: r.DEFAULT,
            type: l.ADVANCED
          }
        )
      ] }),
      /* @__PURE__ */ o(i.Content, { value: r.HOVER, children: [
        /* @__PURE__ */ e(
          c,
          {
            fieldName: "border",
            mode: r.HOVER,
            type: l.ADVANCED
          }
        ),
        /* @__PURE__ */ e(
          N,
          {
            fieldName: "boxShadow",
            mode: r.HOVER,
            type: l.ADVANCED
          }
        ),
        /* @__PURE__ */ e(
          b,
          {
            label: "Transition Duration",
            type: l.ADVANCED,
            fieldName: "border.transitionDuration",
            min: 0,
            max: 1e4
          }
        )
      ] })
    ] }) })
  ] }),
  /* @__PURE__ */ o(t.Item, { value: "Responsive", children: [
    /* @__PURE__ */ e(t.Trigger, { className: "p-4", children: "Responsive" }),
    /* @__PURE__ */ o(t.Content, { className: "px-4", children: [
      /* @__PURE__ */ e(f, { className: "text-xs font-semibold text-gray-800", children: "Visibility" }),
      /* @__PURE__ */ e(d, { children: "Responsive visibility will take effect only on preview mode or live page, and not while editing." }),
      /* @__PURE__ */ e(
        s,
        {
          type: l.ADVANCED,
          fieldName: "hideOnDesktop",
          label: "Hide On Desktop"
        }
      ),
      /* @__PURE__ */ e(
        s,
        {
          type: l.ADVANCED,
          fieldName: "hideOnTablet",
          label: "Hide On Tablet"
        }
      ),
      /* @__PURE__ */ e(
        s,
        {
          type: l.ADVANCED,
          fieldName: "hideOnMobile",
          label: "Hide On Mobile"
        }
      )
    ] })
  ] }),
  /* @__PURE__ */ o(t.Item, { value: "Attributes", children: [
    /* @__PURE__ */ e(t.Trigger, { className: "p-4", children: "Attributes" }),
    /* @__PURE__ */ e(t.Content, { className: "px-4", children: /* @__PURE__ */ e(D, {}) })
  ] }),
  /* @__PURE__ */ o(t.Item, { value: "CustomCSS", children: [
    /* @__PURE__ */ e(t.Trigger, { className: "px-4", children: "Custom CSS" }),
    /* @__PURE__ */ e(t.Content, { className: "px-4", children: /* @__PURE__ */ e(
      h,
      {
        type: l.ADVANCED,
        fieldName: "customCss",
        label: "Add your own custom CSS"
      }
    ) })
  ] })
] });
export {
  W as AdvancedSettingsControl,
  W as default
};
//# sourceMappingURL=advance-settings.control.js.map
