UNPKG

@wordpress/block-editor

Version:
8 lines (7 loc) 3.41 kB
{ "version": 3, "sources": ["../../../src/components/image-size-control/use-dimension-handler.js"], "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect, useState } from '@wordpress/element';\n\nexport default function useDimensionHandler(\n\tcustomHeight,\n\tcustomWidth,\n\tdefaultHeight,\n\tdefaultWidth,\n\tonChange\n) {\n\tconst [ currentWidth, setCurrentWidth ] = useState(\n\t\tcustomWidth ?? defaultWidth ?? ''\n\t);\n\tconst [ currentHeight, setCurrentHeight ] = useState(\n\t\tcustomHeight ?? defaultHeight ?? ''\n\t);\n\n\t// When an image is first inserted, the default dimensions are initially\n\t// undefined. This effect updates the dimensions when the default values\n\t// come through.\n\tuseEffect( () => {\n\t\tif ( customWidth === undefined && defaultWidth !== undefined ) {\n\t\t\tsetCurrentWidth( defaultWidth );\n\t\t}\n\t\tif ( customHeight === undefined && defaultHeight !== undefined ) {\n\t\t\tsetCurrentHeight( defaultHeight );\n\t\t}\n\t}, [ defaultWidth, defaultHeight ] );\n\n\t// If custom values change, it means an outsider has resized the image using some other method (eg resize box)\n\t// this keeps track of these values too. We need to parse before comparing; custom values can be strings.\n\tuseEffect( () => {\n\t\tif (\n\t\t\tcustomWidth !== undefined &&\n\t\t\tNumber.parseInt( customWidth ) !== Number.parseInt( currentWidth )\n\t\t) {\n\t\t\tsetCurrentWidth( customWidth );\n\t\t}\n\t\tif (\n\t\t\tcustomHeight !== undefined &&\n\t\t\tNumber.parseInt( customHeight ) !== Number.parseInt( currentHeight )\n\t\t) {\n\t\t\tsetCurrentHeight( customHeight );\n\t\t}\n\t}, [ customWidth, customHeight ] );\n\n\tconst updateDimension = ( dimension, value ) => {\n\t\tconst parsedValue = value === '' ? undefined : parseInt( value, 10 );\n\t\tif ( dimension === 'width' ) {\n\t\t\tsetCurrentWidth( parsedValue );\n\t\t} else {\n\t\t\tsetCurrentHeight( parsedValue );\n\t\t}\n\t\tonChange( {\n\t\t\t[ dimension ]: parsedValue,\n\t\t} );\n\t};\n\n\tconst updateDimensions = ( nextHeight, nextWidth ) => {\n\t\tsetCurrentHeight( nextHeight ?? defaultHeight );\n\t\tsetCurrentWidth( nextWidth ?? defaultWidth );\n\t\tonChange( { height: nextHeight, width: nextWidth } );\n\t};\n\n\treturn {\n\t\tcurrentHeight,\n\t\tcurrentWidth,\n\t\tupdateDimension,\n\t\tupdateDimensions,\n\t};\n}\n"], "mappings": ";AAGA,SAAS,WAAW,gBAAgB;AAErB,SAAR,oBACN,cACA,aACA,eACA,cACA,UACC;AACD,QAAM,CAAE,cAAc,eAAgB,IAAI;AAAA,IACzC,eAAe,gBAAgB;AAAA,EAChC;AACA,QAAM,CAAE,eAAe,gBAAiB,IAAI;AAAA,IAC3C,gBAAgB,iBAAiB;AAAA,EAClC;AAKA,YAAW,MAAM;AAChB,QAAK,gBAAgB,UAAa,iBAAiB,QAAY;AAC9D,sBAAiB,YAAa;AAAA,IAC/B;AACA,QAAK,iBAAiB,UAAa,kBAAkB,QAAY;AAChE,uBAAkB,aAAc;AAAA,IACjC;AAAA,EACD,GAAG,CAAE,cAAc,aAAc,CAAE;AAInC,YAAW,MAAM;AAChB,QACC,gBAAgB,UAChB,OAAO,SAAU,WAAY,MAAM,OAAO,SAAU,YAAa,GAChE;AACD,sBAAiB,WAAY;AAAA,IAC9B;AACA,QACC,iBAAiB,UACjB,OAAO,SAAU,YAAa,MAAM,OAAO,SAAU,aAAc,GAClE;AACD,uBAAkB,YAAa;AAAA,IAChC;AAAA,EACD,GAAG,CAAE,aAAa,YAAa,CAAE;AAEjC,QAAM,kBAAkB,CAAE,WAAW,UAAW;AAC/C,UAAM,cAAc,UAAU,KAAK,SAAY,SAAU,OAAO,EAAG;AACnE,QAAK,cAAc,SAAU;AAC5B,sBAAiB,WAAY;AAAA,IAC9B,OAAO;AACN,uBAAkB,WAAY;AAAA,IAC/B;AACA,aAAU;AAAA,MACT,CAAE,SAAU,GAAG;AAAA,IAChB,CAAE;AAAA,EACH;AAEA,QAAM,mBAAmB,CAAE,YAAY,cAAe;AACrD,qBAAkB,cAAc,aAAc;AAC9C,oBAAiB,aAAa,YAAa;AAC3C,aAAU,EAAE,QAAQ,YAAY,OAAO,UAAU,CAAE;AAAA,EACpD;AAEA,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD;AACD;", "names": [] }