var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/components/table/Actions/component/GallerySetting/index.tsx
var GallerySetting_exports = {};
__export(GallerySetting_exports, {
  default: () => GallerySetting_default
});
module.exports = __toCommonJS(GallerySetting_exports);
var import_react = __toESM(require("react"));
var import_icons = require("@ant-design/icons");
var import_antd = require("antd");
var import_PopoverContent = __toESM(require("../ColumnsSetting/PopoverContent"));
var import_hooks = require("../../../../../hooks");
var import_model = require("../../../model");
var import_ButtonIcon = __toESM(require("../ButtonIcon"));
var import_index = require("./index.less");
var prefix = "pisell-lowcode-";
var LabelShow = (props) => {
  const { value, onChange } = props;
  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, value ? /* @__PURE__ */ import_react.default.createElement(import_icons.EyeOutlined, { onClick: () => onChange == null ? void 0 : onChange(false) }) : /* @__PURE__ */ import_react.default.createElement(import_icons.EyeInvisibleOutlined, { onClick: () => onChange == null ? void 0 : onChange(true) }));
};
var GallerySetting = (props) => {
  const { setting } = props;
  const { state } = (0, import_hooks.useSharedState)(import_model.Context);
  const { defaultColumns } = state;
  const { cover } = setting;
  const { fields, show } = cover;
  const form = import_antd.Form.useFormInstance();
  const column_setting = import_antd.Form.useWatch("column_setting", {
    form,
    preserve: true
  }) || [];
  const isActive = (0, import_react.useMemo)(() => {
    return column_setting.some((item) => !item.isShow);
  }, [column_setting]);
  const coverFieldOptions = (0, import_react.useMemo)(() => {
    return [
      {
        value: "noCover",
        label: "无封面"
      },
      ...(fields || []).map((field) => {
        const column = defaultColumns.find(
          (col) => col.key === field
        );
        return {
          value: `${column.dataIndex}`,
          label: column.title
        };
      }).filter(Boolean)
    ];
  }, [defaultColumns, fields]);
  const headerContent = (0, import_react.useMemo)(() => {
    return /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}gallery-setting-header` }, /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { direction: "vertical", style: { width: "100%" } }, show && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}gallery-setting-header-item` }, /* @__PURE__ */ import_react.default.createElement("div", null, "封面内容"), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: ["gallery_setting", "coverField"], noStyle: true }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Select,
      {
        options: coverFieldOptions,
        style: { width: 120 }
      }
    )))), /* @__PURE__ */ import_react.default.createElement(
      import_antd.Form.Item,
      {
        noStyle: true,
        shouldUpdate: (prevValues, currentValues) => {
          var _a, _b;
          return ((_a = prevValues.gallery_setting) == null ? void 0 : _a.coverField) !== ((_b = currentValues.gallery_setting) == null ? void 0 : _b.coverField);
        }
      },
      ({ getFieldValue }) => getFieldValue(["gallery_setting", "coverField"]) !== "noCover" ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}gallery-setting-header-item` }, /* @__PURE__ */ import_react.default.createElement("div", null, "封面效果"), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
        import_antd.Form.Item,
        {
          name: ["gallery_setting", "coverObjectFit"],
          noStyle: true
        },
        /* @__PURE__ */ import_react.default.createElement(
          import_antd.Segmented,
          {
            options: [
              { label: "适应", value: "fill" },
              { label: "剪裁", value: "cover" }
            ]
          }
        )
      ))) : null
    ), /* @__PURE__ */ import_react.default.createElement(import_antd.Divider, { style: { margin: "0" } })), /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}gallery-setting-header-item` }, /* @__PURE__ */ import_react.default.createElement("div", null, "展示模式"), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: ["gallery_setting", "compactMode"], noStyle: true }, /* @__PURE__ */ import_react.default.createElement(
      import_antd.Segmented,
      {
        options: [
          { label: "常规", value: "default" },
          { label: "紧凑", value: "compact" }
        ]
      }
    )))), /* @__PURE__ */ import_react.default.createElement(
      import_antd.Form.Item,
      {
        noStyle: true,
        shouldUpdate: (prevValues, currentValues) => {
          var _a, _b;
          return ((_a = prevValues.gallery_setting) == null ? void 0 : _a.compactMode) !== ((_b = currentValues.gallery_setting) == null ? void 0 : _b.compactMode);
        }
      },
      ({ getFieldValue }) => getFieldValue(["gallery_setting", "compactMode"]) === "default" ? /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}gallery-setting-header-item` }, /* @__PURE__ */ import_react.default.createElement("div", null, "展示字段名"), /* @__PURE__ */ import_react.default.createElement(
        "div",
        {
          className: `${prefix}gallery-setting-header-item-icon-wrap`
        },
        /* @__PURE__ */ import_react.default.createElement(
          import_antd.Form.Item,
          {
            name: ["gallery_setting", "isShowLabel"],
            noStyle: true
          },
          /* @__PURE__ */ import_react.default.createElement(LabelShow, null)
        )
      )) : null
    )), /* @__PURE__ */ import_react.default.createElement(import_antd.Divider, { style: { margin: "8px 0 0" } }));
  }, [coverFieldOptions]);
  const content = (0, import_react.useMemo)(() => {
    return /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: ["column_setting"], noStyle: true }, /* @__PURE__ */ import_react.default.createElement(import_PopoverContent.default, { isShowTitle: false, headerContent }));
  }, [headerContent]);
  return /* @__PURE__ */ import_react.default.createElement(
    import_antd.Popover,
    {
      content,
      arrow: false,
      placement: "bottomRight",
      trigger: "click"
    },
    /* @__PURE__ */ import_react.default.createElement(import_ButtonIcon.default, { isActive }, /* @__PURE__ */ import_react.default.createElement(import_icons.EyeOutlined, { style: { cursor: "pointer", fontSize: 18 } }))
  );
};
var GallerySetting_default = GallerySetting;
