All files / roosterjs-content-model-dom/lib/formatHandlers/block marginFormatHandler.ts

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
1x
 
 
 
1x
 
 
 
 
 
 
 
 
 
1x
 
1425x
5700x
 
5700x
1861x
 
 
1339x
1339x
 
 
 
522x
 
 
 
 
522x
 
 
 
 
 
1143x
4572x
 
4572x
748x
 
 
 
 
 
import { parseValueWithUnit } from '../utils/parseValueWithUnit';
import type { FormatHandler } from '../FormatHandler';
import type { MarginFormat } from 'roosterjs-content-model-types';
 
const MarginKeys: (keyof MarginFormat & keyof CSSStyleDeclaration)[] = [
    'marginTop',
    'marginRight',
    'marginBottom',
    'marginLeft',
];
 
/**
 * @internal
 */
export const marginFormatHandler: FormatHandler<MarginFormat> = {
    parse: (format, element, _, defaultStyle) => {
        MarginKeys.forEach(key => {
            const value = element.style[key] || defaultStyle[key];
 
            if (value) {
                switch (key) {
                    case 'marginTop':
                    case 'marginBottom':
                        format[key] = value;
                        break;
 
                    case 'marginLeft':
                    case 'marginRight':
                        format[key] = format[key]
                            ? parseValueWithUnit(format[key] || '', element) +
                              parseValueWithUnit(value, element) +
                              'px'
                            : value;
                        break;
                }
            }
        });
    },
    apply: (format, element, context) => {
        MarginKeys.forEach(key => {
            const value = format[key];
 
            if (value != context.implicitFormat[key]) {
                element.style[key] = value || '0';
            }
        });
    },
};