"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _style = require("../../style"); var _internal = require("../../theme/internal"); // ============================== Shared ============================== const genSharedDividerStyle = token => { const { componentCls, sizePaddingEdgeHorizontal, colorSplit, lineWidth, textPaddingInline, orientationMargin, verticalMarginInline } = token; return { [componentCls]: Object.assign(Object.assign({}, (0, _style.resetComponent)(token)), { borderBlockStart: `${lineWidth}px solid ${colorSplit}`, // vertical '&-vertical': { position: 'relative', top: '-0.06em', display: 'inline-block', height: '0.9em', marginInline: verticalMarginInline, marginBlock: 0, verticalAlign: 'middle', borderTop: 0, borderInlineStart: `${lineWidth}px solid ${colorSplit}` }, '&-horizontal': { display: 'flex', clear: 'both', width: '100%', minWidth: '100%', margin: `${token.dividerHorizontalGutterMargin}px 0` }, [`&-horizontal${componentCls}-with-text`]: { display: 'flex', alignItems: 'center', margin: `${token.dividerHorizontalWithTextGutterMargin}px 0`, color: token.colorTextHeading, fontWeight: 500, fontSize: token.fontSizeLG, whiteSpace: 'nowrap', textAlign: 'center', borderBlockStart: `0 ${colorSplit}`, '&::before, &::after': { position: 'relative', width: '50%', borderBlockStart: `${lineWidth}px solid transparent`, // Chrome not accept `inherit` in `border-top` borderBlockStartColor: 'inherit', borderBlockEnd: 0, transform: 'translateY(50%)', content: "''" } }, [`&-horizontal${componentCls}-with-text-left`]: { '&::before': { width: `${orientationMargin * 100}%` }, '&::after': { width: `${100 - orientationMargin * 100}%` } }, [`&-horizontal${componentCls}-with-text-right`]: { '&::before': { width: `${100 - orientationMargin * 100}%` }, '&::after': { width: `${orientationMargin * 100}%` } }, [`${componentCls}-inner-text`]: { display: 'inline-block', paddingBlock: 0, paddingInline: textPaddingInline }, '&-dashed': { background: 'none', borderColor: colorSplit, borderStyle: 'dashed', borderWidth: `${lineWidth}px 0 0` }, [`&-horizontal${componentCls}-with-text${componentCls}-dashed`]: { '&::before, &::after': { borderStyle: 'dashed none none' } }, [`&-vertical${componentCls}-dashed`]: { borderInlineStartWidth: lineWidth, borderInlineEnd: 0, borderBlockStart: 0, borderBlockEnd: 0 }, [`&-plain${componentCls}-with-text`]: { color: token.colorText, fontWeight: 'normal', fontSize: token.fontSize }, [`&-horizontal${componentCls}-with-text-left${componentCls}-no-default-orientation-margin-left`]: { '&::before': { width: 0 }, '&::after': { width: '100%' }, [`${componentCls}-inner-text`]: { paddingInlineStart: sizePaddingEdgeHorizontal } }, [`&-horizontal${componentCls}-with-text-right${componentCls}-no-default-orientation-margin-right`]: { '&::before': { width: '100%' }, '&::after': { width: 0 }, [`${componentCls}-inner-text`]: { paddingInlineEnd: sizePaddingEdgeHorizontal } } }) }; }; // ============================== Export ============================== var _default = exports.default = (0, _internal.genComponentStyleHook)('Divider', token => { const dividerToken = (0, _internal.mergeToken)(token, { dividerHorizontalWithTextGutterMargin: token.margin, dividerHorizontalGutterMargin: token.marginLG, sizePaddingEdgeHorizontal: 0 }); return [genSharedDividerStyle(dividerToken)]; }, token => ({ textPaddingInline: '1em', orientationMargin: 0.05, verticalMarginInline: token.marginXS }));