1 line
29 KiB
JSON
1 line
29 KiB
JSON
|
{"ast":null,"code":"import { unit } from '@ant-design/cssinjs';\nimport { resetIcon } from '../../style';\nimport { mergeToken } from '../../theme/internal';\n/**\n * Get multiple selector needed style. The calculation:\n *\n * ContainerPadding = BasePadding - ItemMargin\n *\n * Border: ╔═══════════════════════════╗ ┬\n * ContainerPadding: ║ ║ │\n * ╟───────────────────────────╢ ┬ │\n * Item Margin: ║ ║ │ │\n * ║ ┌──────────┐ ║ │ │\n * Item(multipleItemHeight): ║ BasePadding │ Item │ ║ Overflow Container(ControlHeight)\n * ║ └──────────┘ ║ │ │\n * Item Margin: ║ ║ │ │\n * ╟───────────────────────────╢ ┴ │\n * ContainerPadding: ║ ║ │\n * Border: ╚═══════════════════════════╝ ┴\n */\nexport const getMultipleSelectorUnit = token => {\n const {\n multipleSelectItemHeight,\n paddingXXS,\n lineWidth,\n INTERNAL_FIXED_ITEM_MARGIN\n } = token;\n const basePadding = token.max(token.calc(paddingXXS).sub(lineWidth).equal(), 0);\n const containerPadding = token.max(token.calc(basePadding).sub(INTERNAL_FIXED_ITEM_MARGIN).equal(), 0);\n return {\n basePadding,\n containerPadding,\n itemHeight: unit(multipleSelectItemHeight),\n itemLineHeight: unit(token.calc(multipleSelectItemHeight).sub(token.calc(token.lineWidth).mul(2)).equal())\n };\n};\nconst getSelectItemStyle = token => {\n const {\n multipleSelectItemHeight,\n selectHeight,\n lineWidth\n } = token;\n const selectItemDist = token.calc(selectHeight).sub(multipleSelectItemHeight).div(2).sub(lineWidth).equal();\n return selectItemDist;\n};\n/**\n * Get the `rc-overflow` needed style.\n * It's a share style which means not affected by `size`.\n */\nexport const genOverflowStyle = token => {\n const {\n componentCls,\n iconCls,\n borderRadiusSM,\n motionDurationSlow,\n paddingXS,\n multipleItemColorDisabled,\n multipleItemBorderColorDisabled,\n colorIcon,\n colorIconHover,\n INTERNAL_FIXED_ITEM_MARGIN\n } = token;\n const selectOverflowPrefixCls = `${componentCls}-selection-overflow`;\n return {\n /**\n * Do not merge `height` & `line-height` under style with `selection` & `search`, since chrome\n * may update to redesign with its align logic.\n */\n // =========================== Overflow ===========================\n [selectOverflowPrefixCls]: {\n position: 'relative',\n display: 'flex',\n flex: 'auto',\n flexWrap: 'wrap',\n maxWidth: '100%',\n '&-item': {\n flex: 'none',\n alignSelf: 'center',\n maxWidth: '100%',\n display: 'inline-flex'\n },\n // ======================== Selections ==========================\n [`${componentCls}-selection-item`]: {\n display: 'flex',\n alignSelf: 'center',\n flex: 'none',\n boxSizing: 'border-box',\n maxWidth: '100%',\n marginBlock: INTERNAL_FIXED_ITEM_MARGIN,\n borderRadius: borderRadiusSM,\n cursor: 'default',\n transition: `font-size ${motionDurationSlow}, line-height ${motionDurationSlow}, height ${motionDurationSlow}`,\n marginInlineEnd: token.calc(INTERNAL_FIXED_ITEM_MARGIN).mul(2).equal(),\n paddingInlineStart: paddingXS,\n paddingInlineEnd: token.calc(paddingXS).div(2).equal(),\n
|