1 line
40 KiB
JSON
1 line
40 KiB
JSON
|
{"ast":null,"code":"import { Keyframes, unit } from '@ant-design/cssinjs';\nimport { getStyle as getCheckboxStyle } from '../../checkbox/style';\nimport { genFocusOutline, resetComponent } from '../../style';\nimport { genCollapseMotion } from '../../style/motion';\nimport { genStyleHooks, mergeToken } from '../../theme/internal';\n// ============================ Keyframes =============================\nconst treeNodeFX = new Keyframes('ant-tree-node-fx-do-not-use', {\n '0%': {\n opacity: 0\n },\n '100%': {\n opacity: 1\n }\n});\n// ============================== Switch ==============================\nconst getSwitchStyle = (prefixCls, token) => ({\n [`.${prefixCls}-switcher-icon`]: {\n display: 'inline-block',\n fontSize: 10,\n verticalAlign: 'baseline',\n svg: {\n transition: `transform ${token.motionDurationSlow}`\n }\n }\n});\n// =============================== Drop ===============================\nconst getDropIndicatorStyle = (prefixCls, token) => ({\n [`.${prefixCls}-drop-indicator`]: {\n position: 'absolute',\n // it should displayed over the following node\n zIndex: 1,\n height: 2,\n backgroundColor: token.colorPrimary,\n borderRadius: 1,\n pointerEvents: 'none',\n '&:after': {\n position: 'absolute',\n top: -3,\n insetInlineStart: -6,\n width: 8,\n height: 8,\n backgroundColor: 'transparent',\n border: `${unit(token.lineWidthBold)} solid ${token.colorPrimary}`,\n borderRadius: '50%',\n content: '\"\"'\n }\n }\n});\nexport const genBaseStyle = (prefixCls, token) => {\n const {\n treeCls,\n treeNodeCls,\n treeNodePadding,\n titleHeight,\n nodeSelectedBg,\n nodeHoverBg\n } = token;\n const treeCheckBoxMarginHorizontal = token.paddingXS;\n return {\n [treeCls]: Object.assign(Object.assign({}, resetComponent(token)), {\n background: token.colorBgContainer,\n borderRadius: token.borderRadius,\n transition: `background-color ${token.motionDurationSlow}`,\n [`&${treeCls}-rtl`]: {\n // >>> Switcher\n [`${treeCls}-switcher`]: {\n '&_close': {\n [`${treeCls}-switcher-icon`]: {\n svg: {\n transform: 'rotate(90deg)'\n }\n }\n }\n }\n },\n [`&-focused:not(:hover):not(${treeCls}-active-focused)`]: Object.assign({}, genFocusOutline(token)),\n // =================== Virtual List ===================\n [`${treeCls}-list-holder-inner`]: {\n alignItems: 'flex-start'\n },\n [`&${treeCls}-block-node`]: {\n [`${treeCls}-list-holder-inner`]: {\n alignItems: 'stretch',\n // >>> Title\n [`${treeCls}-node-content-wrapper`]: {\n flex: 'auto'\n },\n // >>> Drag\n [`${treeNodeCls}.dragging`]: {\n position: 'relative',\n '&:after': {\n position: 'absolute',\n top: 0,\n insetInlineEnd: 0,\n bottom: treeNodePadding,\n insetInlineStart: 0,\n border: `1px solid ${token.colorPrimary}`,\n opacity: 0,\n animationName: treeNodeFX,\n animationDuration: token.motionDurationSlow,\n animationPlayState: 'running',\n animationFillMode: 'forwards',\n content: '\"\"',\n pointerEvents: 'none'\n }\n }\n }\n },\n // ===================== TreeNode =====================\n [treeNodeCls]: {\n display: 'flex',\n alignItems: 'flex-start',\n padding: `0 0 ${unit(treeNodePadding)} 0`,\n outline: 'none',\n '&-rtl': {\n direction: 'rtl'\n },\n // Disabled\n '&-disabled': {\n // >>> Title\n [`${treeCls}-node-content-wrapper`]: {\n color: token.colorTextDisabled,\n cursor: 'not-allowed',\n '&:hover': {\n background: 'transparent'\n }\n }\n
|