| @@ -1,5 +1,5 @@ | ||
| 1 | -import { useEffect } from '@wordpress/element'; | |
| 1 | +import { useEffect, useRef } from '@wordpress/element'; | |
| 2 | 2 | import { Theme } from 'shiki'; |
| 3 | 3 | import { useGlobalStore } from '../state/global'; |
| 4 | 4 | import { useThemeStore } from '../state/theme'; |
| 5 | 5 | import { AttributesPropsAndSetter } from '../types'; |
| @@ -7,10 +7,20 @@ | ||
| 7 | 7 | export const useDefaults = ({ |
| 8 | 8 | attributes, |
| 9 | 9 | setAttributes, |
| 10 | 10 | }: AttributesPropsAndSetter) => { |
| 11 | - const { theme, fontSize, fontFamily, lineHeight, copyButton, headerType } = | |
| 12 | - attributes; | |
| 11 | + const { | |
| 12 | + theme, | |
| 13 | + fontSize, | |
| 14 | + fontFamily, | |
| 15 | + lineHeight, | |
| 16 | + copyButton, | |
| 17 | + headerType, | |
| 18 | + footerType, | |
| 19 | + clampFonts, | |
| 20 | + disablePadding, | |
| 21 | + lineNumbers, | |
| 22 | + } = attributes; | |
| 13 | 23 | const { previousSettings } = useGlobalStore(); |
| 14 | 24 | const { |
| 15 | 25 | previousTheme, |
| 16 | 26 | previousFontSize, |
| @@ -16,36 +26,85 @@ | ||
| 16 | 26 | previousFontSize, |
| 17 | 27 | previousFontFamily, |
| 18 | 28 | previousLineHeight, |
| 19 | 29 | previousHeaderType, |
| 30 | + previousFooterType, | |
| 31 | + previousClampFonts, | |
| 32 | + previousDisablePadding, | |
| 33 | + previousLineNumbers, | |
| 20 | 34 | } = useThemeStore(); |
| 35 | + const once = useRef(false); | |
| 21 | 36 | |
| 22 | 37 | useEffect(() => { |
| 23 | - if (copyButton || !previousSettings.copyButton) return; | |
| 38 | + if (once.current) return; | |
| 39 | + if (copyButton !== undefined || !previousSettings.copyButton) return; | |
| 24 | 40 | setAttributes({ copyButton: previousSettings.copyButton }); |
| 25 | 41 | }, [previousSettings, copyButton, setAttributes]); |
| 26 | 42 | |
| 27 | 43 | useEffect(() => { |
| 44 | + if (once.current) return; | |
| 28 | 45 | if (theme || !previousTheme) return; |
| 29 | 46 | setAttributes({ theme: previousTheme as Theme }); |
| 30 | 47 | }, [previousTheme, theme, setAttributes]); |
| 31 | 48 | |
| 32 | 49 | useEffect(() => { |
| 50 | + if (once.current) return; | |
| 33 | 51 | if (fontSize || !previousFontSize) return; |
| 34 | 52 | setAttributes({ fontSize: previousFontSize }); |
| 35 | 53 | }, [previousFontSize, fontSize, setAttributes]); |
| 36 | 54 | |
| 37 | 55 | useEffect(() => { |
| 38 | - if (fontFamily || !previousFontFamily) return; | |
| 56 | + if (once.current) return; | |
| 57 | + if (fontFamily || fontFamily === '' || previousFontFamily === undefined) | |
| 58 | + return; | |
| 39 | 59 | setAttributes({ fontFamily: previousFontFamily }); |
| 40 | 60 | }, [previousFontFamily, fontFamily, setAttributes]); |
| 41 | 61 | |
| 42 | 62 | useEffect(() => { |
| 63 | + if (once.current) return; | |
| 43 | 64 | if (lineHeight || !previousLineHeight) return; |
| 44 | 65 | setAttributes({ lineHeight: previousLineHeight }); |
| 45 | 66 | }, [previousLineHeight, lineHeight, setAttributes]); |
| 46 | 67 | |
| 47 | 68 | useEffect(() => { |
| 69 | + if (once.current) return; | |
| 48 | 70 | if (headerType || !previousHeaderType) return; |
| 49 | 71 | setAttributes({ headerType: previousHeaderType }); |
| 50 | 72 | }, [previousHeaderType, headerType, setAttributes]); |
| 73 | + | |
| 74 | + useEffect(() => { | |
| 75 | + if (once.current) return; | |
| 76 | + if (footerType !== undefined || previousFooterType === undefined) | |
| 77 | + return; | |
| 78 | + setAttributes({ footerType: previousFooterType }); | |
| 79 | + }, [previousFooterType, footerType, setAttributes]); | |
| 80 | + | |
| 81 | + useEffect(() => { | |
| 82 | + if (once.current) return; | |
| 83 | + if (clampFonts !== undefined || previousClampFonts === undefined) | |
| 84 | + return; | |
| 85 | + setAttributes({ clampFonts: previousClampFonts }); | |
| 86 | + }, [previousClampFonts, clampFonts, setAttributes]); | |
| 87 | + | |
| 88 | + useEffect(() => { | |
| 89 | + if (once.current) return; | |
| 90 | + if ( | |
| 91 | + disablePadding !== undefined || | |
| 92 | + previousDisablePadding === undefined | |
| 93 | + ) | |
| 94 | + return; | |
| 95 | + setAttributes({ disablePadding: previousDisablePadding }); | |
| 96 | + }, [previousDisablePadding, disablePadding, setAttributes]); | |
| 97 | + | |
| 98 | + useEffect(() => { | |
| 99 | + if (once.current) return; | |
| 100 | + if (lineNumbers !== undefined || previousLineNumbers === undefined) | |
| 101 | + return; | |
| 102 | + setAttributes({ lineNumbers: previousLineNumbers }); | |
| 103 | + }, [previousLineNumbers, lineNumbers, setAttributes]); | |
| 104 | + | |
| 105 | + useEffect(() => { | |
| 106 | + requestAnimationFrame(() => { | |
| 107 | + once.current = true; | |
| 108 | + }); | |
| 109 | + }, []); | |
| 51 | 110 | }; |