var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
import { useStyle as useAntdStyle } from "@antdv/pro-provider";
import { Keyframes } from "ant-design-vue";
const actionsInputAnimal = new Keyframes("actionsInputAnimal", {
  "0%": { width: "0px" },
  "30%": { width: "20px" },
  "100%": { width: "120px" }
});
const genProHelpStyle = (token) => {
  return {
    [`${token.componentCls}-popover-text`]: {
      color: token.colorPrimary,
      cursor: "pointer",
      boxSizing: "border-box"
    },
    [`${token.componentCls}-popover-content`]: {
      maxWidth: 300,
      height: "600px",
      maxHeight: "calc(100vh - 200px)",
      overflow: "auto",
      paddingInline: 20,
      paddingBlockStart: 24,
      paddingBlockEnd: 32,
      boxSizing: "border-box"
    },
    [`${token.componentCls}-left-panel`]: {
      "overflow": "auto",
      "boxSizing": "border-box",
      "borderInlineEnd": `${token == null ? void 0 : token.lineWidth}px solid ${token == null ? void 0 : token.colorBorderSecondary}`,
      "minHeight": "648px",
      "minWidth": 190,
      "maxWidth": 190,
      "&-menu": {
        width: 190,
        boxSizing: "border-box",
        minWidth: 190,
        height: "calc(100% - 40px)",
        marginBlock: 20
      }
    },
    [`${token.componentCls}-content-panel`]: {
      minWidth: "200px",
      overflow: "auto",
      flex: 1,
      display: "flex",
      flexDirection: "column",
      boxSizing: "border-box",
      minHeight: "648px",
      img: {
        width: "100%"
      }
    },
    [`${token.componentCls}-content-render`]: {
      paddingBlock: 20,
      paddingInline: 24,
      flex: 1
    },
    [`${token.componentCls}-content-footer`]: {
      padding: 8
    },
    [`${token.componentCls}-actions`]: {
      "display": "flex",
      "boxSizing": "border-box",
      "gap": token.marginSM,
      "&-item": {
        "display": "flex",
        "boxSizing": "border-box",
        "alignItems": "center",
        "justifyItems": "center",
        "padding": 4,
        "height": 24,
        "minWidth": 24,
        "cursor": "pointer",
        "borderRadius": token.borderRadius,
        "&:hover": {
          backgroundColor: token.colorBgTextHover
        },
        "span.anticon": {
          width: "100%",
          height: "100%",
          justifyContent: "center"
        }
      },
      "&-input": {
        margin: 0,
        maxWidth: 120,
        padding: 0,
        width: "120px",
        boxSizing: "border-box",
        borderRadius: token.borderRadius,
        backgroundColor: token.colorBgTextHover,
        animationName: actionsInputAnimal,
        animationDuration: "0.1s",
        animationTimingFunction: "linear"
      }
    }
  };
};
function useStyle(prefixCls) {
  return useAntdStyle("ProHelp", (token) => {
    const ProLayoutHeaderToken = __spreadProps(__spreadValues({}, token), {
      componentCls: `.${prefixCls.value}`
    });
    return [genProHelpStyle(ProLayoutHeaderToken)];
  });
}
export {
  actionsInputAnimal,
  useStyle
};
