Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 | 1x 1x 1x 1x 1x 1414x 1414x 5656x 5656x 5656x 5656x 5381x 5656x 5656x 207x 1402x 5608x 5608x 5608x 844x 211x 5608x 108x | import { directionFormatHandler } from './directionFormatHandler';
import type { FormatHandler } from '../FormatHandler';
import type { DirectionFormat, PaddingFormat } from 'roosterjs-content-model-types';
const PaddingKeys: (keyof PaddingFormat & keyof CSSStyleDeclaration)[] = [
'paddingTop',
'paddingRight',
'paddingBottom',
'paddingLeft',
];
const AlternativeKeyLtr: Partial<Record<
keyof PaddingFormat,
keyof CSSStyleDeclaration | undefined
>> = {
paddingLeft: 'paddingInlineStart',
};
const AlternativeKeyRtl: Partial<Record<
keyof PaddingFormat,
keyof CSSStyleDeclaration | undefined
>> = {
paddingRight: 'paddingInlineStart',
};
/**
* @internal
*/
export const paddingFormatHandler: FormatHandler<PaddingFormat & DirectionFormat> = {
parse: (format, element, context, defaultStyle) => {
directionFormatHandler.parse(format, element, context, defaultStyle);
PaddingKeys.forEach(key => {
let value = element.style[key];
const alterativeKey = (format.direction == 'rtl'
? AlternativeKeyRtl
: AlternativeKeyLtr)[key];
const defaultValue: string =
(defaultStyle[key] ??
(alterativeKey ? defaultStyle[alterativeKey] : undefined) ??
'0px') + '';
if (!value) {
value = defaultValue;
}
Iif (!value || value == '0') {
value = '0px';
}
if (value && value != defaultValue) {
format[key] = value;
}
});
},
apply: (format, element, context) => {
PaddingKeys.forEach(key => {
const value = format[key];
let defaultValue: string | undefined = undefined;
if (element.tagName == 'OL' || element.tagName == 'UL') {
if (
(format.direction == 'rtl' && key == 'paddingRight') ||
(format.direction != 'rtl' && key == 'paddingLeft')
) {
defaultValue = '40px';
}
}
if (value && value != defaultValue) {
element.style[key] = value;
}
});
},
};
|