import "../../../../@ant-design/cssinjs/es/extractStyle.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useCacheToken.mjs";
import "react";
import "../../../../@ant-design/cssinjs/es/StyleContext.mjs";
import { unit as n } from "../../../../@ant-design/cssinjs/es/util/index.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useCompatibleInsertionEffect.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useEffectCleanupRegister.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useHMR.mjs";
import "../../../../rc-util/es/warning.mjs";
import g from "../../../../@ant-design/cssinjs/es/Keyframes.mjs";
import "../../../../@ant-design/cssinjs/es/theme/createTheme.mjs";
import "../../../../@ant-design/cssinjs/es/theme/ThemeCache.mjs";
import "../../../../@ant-design/cssinjs/es/transformers/legacyLogicalProperties.mjs";
import { getStyle as p } from "../../checkbox/style/index.mjs";
import { resetComponent as b, genFocusOutline as l } from "../../style/index.mjs";
import u from "../../style/motion/collapse.mjs";
import { genStyleHooks as m } from "../../theme/util/genComponentStyleHook.mjs";
import { merge as h } from "../../theme/util/statistic.mjs";
const $ = new g("ant-tree-node-fx-do-not-use", {
  "0%": {
    opacity: 0
  },
  "100%": {
    opacity: 1
  }
}), f = (t, e) => ({
  [`.${t}-switcher-icon`]: {
    display: "inline-block",
    fontSize: 10,
    verticalAlign: "baseline",
    svg: {
      transition: `transform ${e.motionDurationSlow}`
    }
  }
}), v = (t, e) => ({
  [`.${t}-drop-indicator`]: {
    position: "absolute",
    // it should displayed over the following node
    zIndex: 1,
    height: 2,
    backgroundColor: e.colorPrimary,
    borderRadius: 1,
    pointerEvents: "none",
    "&:after": {
      position: "absolute",
      top: -3,
      insetInlineStart: -6,
      width: 8,
      height: 8,
      backgroundColor: "transparent",
      border: `${n(e.lineWidthBold)} solid ${e.colorPrimary}`,
      borderRadius: "50%",
      content: '""'
    }
  }
}), S = (t, e) => {
  const {
    treeCls: o,
    treeNodeCls: i,
    treeNodePadding: a,
    titleHeight: r,
    nodeSelectedBg: c,
    nodeHoverBg: d
  } = e, s = e.paddingXS;
  return {
    [o]: Object.assign(Object.assign({}, b(e)), {
      background: e.colorBgContainer,
      borderRadius: e.borderRadius,
      transition: `background-color ${e.motionDurationSlow}`,
      [`&${o}-rtl`]: {
        // >>> Switcher
        [`${o}-switcher`]: {
          "&_close": {
            [`${o}-switcher-icon`]: {
              svg: {
                transform: "rotate(90deg)"
              }
            }
          }
        }
      },
      [`&-focused:not(:hover):not(${o}-active-focused)`]: Object.assign({}, l(e)),
      // =================== Virtual List ===================
      [`${o}-list-holder-inner`]: {
        alignItems: "flex-start"
      },
      [`&${o}-block-node`]: {
        [`${o}-list-holder-inner`]: {
          alignItems: "stretch",
          // >>> Title
          [`${o}-node-content-wrapper`]: {
            flex: "auto"
          },
          // >>> Drag
          [`${i}.dragging`]: {
            position: "relative",
            "&:after": {
              position: "absolute",
              top: 0,
              insetInlineEnd: 0,
              bottom: a,
              insetInlineStart: 0,
              border: `1px solid ${e.colorPrimary}`,
              opacity: 0,
              animationName: $,
              animationDuration: e.motionDurationSlow,
              animationPlayState: "running",
              animationFillMode: "forwards",
              content: '""',
              pointerEvents: "none"
            }
          }
        }
      },
      // ===================== TreeNode =====================
      [`${i}`]: {
        display: "flex",
        alignItems: "flex-start",
        padding: `0 0 ${n(a)} 0`,
        outline: "none",
        "&-rtl": {
          direction: "rtl"
        },
        // Disabled
        "&-disabled": {
          // >>> Title
          [`${o}-node-content-wrapper`]: {
            color: e.colorTextDisabled,
            cursor: "not-allowed",
            "&:hover": {
              background: "transparent"
            }
          }
        },
        [`&-active ${o}-node-content-wrapper`]: Object.assign({}, l(e)),
        [`&:not(${i}-disabled).filter-node ${o}-title`]: {
          color: "inherit",
          fontWeight: 500
        },
        "&-draggable": {
          [`${o}-draggable-icon`]: {
            // https://github.com/ant-design/ant-design/issues/41915
            flexShrink: 0,
            width: r,
            lineHeight: `${n(r)}`,
            textAlign: "center",
            visibility: "visible",
            opacity: 0.2,
            transition: `opacity ${e.motionDurationSlow}`,
            [`${i}:hover &`]: {
              opacity: 0.45
            }
          },
          [`&${i}-disabled`]: {
            [`${o}-draggable-icon`]: {
              visibility: "hidden"
            }
          }
        }
      },
      // >>> Indent
      [`${o}-indent`]: {
        alignSelf: "stretch",
        whiteSpace: "nowrap",
        userSelect: "none",
        "&-unit": {
          display: "inline-block",
          width: r
        }
      },
      // >>> Drag Handler
      [`${o}-draggable-icon`]: {
        visibility: "hidden"
      },
      // >>> Switcher
      [`${o}-switcher`]: Object.assign(Object.assign({}, f(t, e)), {
        position: "relative",
        flex: "none",
        alignSelf: "stretch",
        width: r,
        margin: 0,
        lineHeight: `${n(r)}`,
        textAlign: "center",
        cursor: "pointer",
        userSelect: "none",
        "&-noop": {
          cursor: "default"
        },
        "&_close": {
          [`${o}-switcher-icon`]: {
            svg: {
              transform: "rotate(-90deg)"
            }
          }
        },
        "&-loading-icon": {
          color: e.colorPrimary
        },
        "&-leaf-line": {
          position: "relative",
          zIndex: 1,
          display: "inline-block",
          width: "100%",
          height: "100%",
          // https://github.com/ant-design/ant-design/issues/31884
          "&:before": {
            position: "absolute",
            top: 0,
            insetInlineEnd: e.calc(r).div(2).equal(),
            bottom: e.calc(a).mul(-1).equal(),
            marginInlineStart: -1,
            borderInlineEnd: `1px solid ${e.colorBorder}`,
            content: '""'
          },
          "&:after": {
            position: "absolute",
            width: e.calc(e.calc(r).div(2).equal()).mul(0.8).equal(),
            height: e.calc(r).div(2).equal(),
            borderBottom: `1px solid ${e.colorBorder}`,
            content: '""'
          }
        }
      }),
      // >>> Checkbox
      [`${o}-checkbox`]: {
        top: "initial",
        marginInlineEnd: s,
        alignSelf: "flex-start",
        marginTop: e.marginXXS
      },
      // >>> Title
      // add `${treeCls}-checkbox + span` to cover checkbox `${checkboxCls} + span`
      [`${o}-node-content-wrapper, ${o}-checkbox + span`]: {
        position: "relative",
        zIndex: "auto",
        minHeight: r,
        margin: 0,
        padding: `0 ${n(e.calc(e.paddingXS).div(2).equal())}`,
        color: "inherit",
        lineHeight: `${n(r)}`,
        background: "transparent",
        borderRadius: e.borderRadius,
        cursor: "pointer",
        transition: `all ${e.motionDurationMid}, border 0s, line-height 0s, box-shadow 0s`,
        "&:hover": {
          backgroundColor: d
        },
        [`&${o}-node-selected`]: {
          backgroundColor: c
        },
        // Icon
        [`${o}-iconEle`]: {
          display: "inline-block",
          width: r,
          height: r,
          lineHeight: `${n(r)}`,
          textAlign: "center",
          verticalAlign: "top",
          "&:empty": {
            display: "none"
          }
        }
      },
      // https://github.com/ant-design/ant-design/issues/28217
      [`${o}-unselectable ${o}-node-content-wrapper:hover`]: {
        backgroundColor: "transparent"
      },
      // ==================== Draggable =====================
      [`${o}-node-content-wrapper`]: Object.assign({
        lineHeight: `${n(r)}`,
        userSelect: "none"
      }, v(t, e)),
      [`${i}.drop-container`]: {
        "> [draggable]": {
          boxShadow: `0 0 0 2px ${e.colorPrimary}`
        }
      },
      // ==================== Show Line =====================
      "&-show-line": {
        // ================ Indent lines ================
        [`${o}-indent`]: {
          "&-unit": {
            position: "relative",
            height: "100%",
            "&:before": {
              position: "absolute",
              top: 0,
              insetInlineEnd: e.calc(r).div(2).equal(),
              bottom: e.calc(a).mul(-1).equal(),
              borderInlineEnd: `1px solid ${e.colorBorder}`,
              content: '""'
            },
            "&-end": {
              "&:before": {
                display: "none"
              }
            }
          }
        },
        // ============== Cover Background ==============
        [`${o}-switcher`]: {
          background: "transparent",
          "&-line-icon": {
            // https://github.com/ant-design/ant-design/issues/32813
            verticalAlign: "-0.15em"
          }
        }
      },
      [`${i}-leaf-last`]: {
        [`${o}-switcher`]: {
          "&-leaf-line": {
            "&:before": {
              top: "auto !important",
              bottom: "auto !important",
              height: `${n(e.calc(r).div(2).equal())} !important`
            }
          }
        }
      }
    })
  };
}, y = (t) => {
  const {
    treeCls: e,
    treeNodeCls: o,
    treeNodePadding: i,
    directoryNodeSelectedBg: a,
    directoryNodeSelectedColor: r
  } = t;
  return {
    [`${e}${e}-directory`]: {
      // ================== TreeNode ==================
      [o]: {
        position: "relative",
        // Hover color
        "&:before": {
          position: "absolute",
          top: 0,
          insetInlineEnd: 0,
          bottom: i,
          insetInlineStart: 0,
          transition: `background-color ${t.motionDurationMid}`,
          content: '""',
          pointerEvents: "none"
        },
        "&:hover": {
          "&:before": {
            background: t.controlItemBgHover
          }
        },
        // Elements
        "> *": {
          zIndex: 1
        },
        // >>> Switcher
        [`${e}-switcher`]: {
          transition: `color ${t.motionDurationMid}`
        },
        // >>> Title
        [`${e}-node-content-wrapper`]: {
          borderRadius: 0,
          userSelect: "none",
          "&:hover": {
            background: "transparent"
          },
          [`&${e}-node-selected`]: {
            color: r,
            background: "transparent"
          }
        },
        // ============= Selected =============
        "&-selected": {
          "\n            &:hover::before,\n            &::before\n          ": {
            background: a
          },
          // >>> Switcher
          [`${e}-switcher`]: {
            color: r
          },
          // >>> Title
          [`${e}-node-content-wrapper`]: {
            color: r,
            background: "transparent"
          }
        }
      }
    }
  };
}, w = (t, e) => {
  const o = `.${t}`, i = `${o}-treenode`, a = e.calc(e.paddingXS).div(2).equal(), r = h(e, {
    treeCls: o,
    treeNodeCls: i,
    treeNodePadding: a
  });
  return [
    // Basic
    S(t, r),
    // Directory
    y(r)
  ];
}, x = (t) => {
  const {
    controlHeightSM: e
  } = t;
  return {
    titleHeight: e,
    nodeHoverBg: t.controlItemBgHover,
    nodeSelectedBg: t.controlItemBgActive
  };
}, I = (t) => {
  const {
    colorTextLightSolid: e,
    colorPrimary: o
  } = t;
  return Object.assign(Object.assign({}, x(t)), {
    directoryNodeSelectedColor: e,
    directoryNodeSelectedBg: o
  });
}, _ = m("Tree", (t, e) => {
  let {
    prefixCls: o
  } = e;
  return [{
    [t.componentCls]: p(`${o}-checkbox`, t)
  }, w(o, t), u(t)];
}, I);
export {
  _ as default,
  S as genBaseStyle,
  y as genDirectoryStyle,
  w as genTreeStyle,
  x as initComponentToken,
  I as prepareComponentToken
};
