@wordpress/block-library 6.0.25 → 6.0.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (123) hide show
  1. package/build/gallery/constants.js +5 -1
  2. package/build/gallery/constants.js.map +1 -1
  3. package/build/gallery/transforms.js +8 -2
  4. package/build/gallery/transforms.js.map +1 -1
  5. package/build/gallery/utils.js +4 -3
  6. package/build/gallery/utils.js.map +1 -1
  7. package/build/heading/edit.js +14 -2
  8. package/build/heading/edit.js.map +1 -1
  9. package/build/page-list/edit.js +37 -10
  10. package/build/page-list/edit.js.map +1 -1
  11. package/build/post-featured-image/dimension-controls.js +50 -30
  12. package/build/post-featured-image/dimension-controls.js.map +1 -1
  13. package/build/post-featured-image/edit.js +4 -2
  14. package/build/post-featured-image/edit.js.map +1 -1
  15. package/build/site-logo/edit.js +0 -25
  16. package/build/site-logo/edit.js.map +1 -1
  17. package/build/social-links/deprecated.js +1 -62
  18. package/build/social-links/deprecated.js.map +1 -1
  19. package/build/social-links/edit.js +1 -1
  20. package/build/social-links/edit.js.map +1 -1
  21. package/build/spacer/controls.js +111 -0
  22. package/build/spacer/controls.js.map +1 -0
  23. package/build/spacer/controls.native.js +95 -0
  24. package/build/spacer/controls.native.js.map +1 -0
  25. package/build/spacer/deprecated.js +53 -0
  26. package/build/spacer/deprecated.js.map +1 -0
  27. package/build/spacer/edit.js +111 -82
  28. package/build/spacer/edit.js.map +1 -1
  29. package/build/spacer/edit.native.js +76 -0
  30. package/build/spacer/edit.native.js.map +1 -0
  31. package/build/spacer/index.js +7 -4
  32. package/build/spacer/index.js.map +1 -1
  33. package/build/spacer/save.js +6 -3
  34. package/build/spacer/save.js.map +1 -1
  35. package/build/table/deprecated.js +1 -1
  36. package/build/table/deprecated.js.map +1 -1
  37. package/build-module/gallery/constants.js +2 -0
  38. package/build-module/gallery/constants.js.map +1 -1
  39. package/build-module/gallery/transforms.js +8 -2
  40. package/build-module/gallery/transforms.js.map +1 -1
  41. package/build-module/gallery/utils.js +5 -4
  42. package/build-module/gallery/utils.js.map +1 -1
  43. package/build-module/heading/edit.js +15 -3
  44. package/build-module/heading/edit.js.map +1 -1
  45. package/build-module/page-list/edit.js +38 -11
  46. package/build-module/page-list/edit.js.map +1 -1
  47. package/build-module/post-featured-image/dimension-controls.js +52 -29
  48. package/build-module/post-featured-image/dimension-controls.js.map +1 -1
  49. package/build-module/post-featured-image/edit.js +4 -2
  50. package/build-module/post-featured-image/edit.js.map +1 -1
  51. package/build-module/site-logo/edit.js +0 -25
  52. package/build-module/site-logo/edit.js.map +1 -1
  53. package/build-module/social-links/deprecated.js +1 -62
  54. package/build-module/social-links/deprecated.js.map +1 -1
  55. package/build-module/social-links/edit.js +1 -1
  56. package/build-module/social-links/edit.js.map +1 -1
  57. package/build-module/spacer/controls.js +101 -0
  58. package/build-module/spacer/controls.js.map +1 -0
  59. package/build-module/spacer/controls.native.js +82 -0
  60. package/build-module/spacer/controls.native.js.map +1 -0
  61. package/build-module/spacer/deprecated.js +44 -0
  62. package/build-module/spacer/deprecated.js.map +1 -0
  63. package/build-module/spacer/edit.js +108 -82
  64. package/build-module/spacer/edit.js.map +1 -1
  65. package/build-module/spacer/edit.native.js +61 -0
  66. package/build-module/spacer/edit.native.js.map +1 -0
  67. package/build-module/spacer/index.js +6 -4
  68. package/build-module/spacer/index.js.map +1 -1
  69. package/build-module/spacer/save.js +6 -3
  70. package/build-module/spacer/save.js.map +1 -1
  71. package/build-module/table/deprecated.js +1 -1
  72. package/build-module/table/deprecated.js.map +1 -1
  73. package/build-style/common-rtl.css +8 -0
  74. package/build-style/common.css +8 -0
  75. package/build-style/cover/style-rtl.css +67 -5
  76. package/build-style/cover/style.css +67 -5
  77. package/build-style/editor-rtl.css +8 -7
  78. package/build-style/editor.css +8 -7
  79. package/build-style/gallery/style-rtl.css +2 -1
  80. package/build-style/gallery/style.css +2 -1
  81. package/build-style/page-list/editor-rtl.css +4 -0
  82. package/build-style/page-list/editor.css +4 -0
  83. package/build-style/post-featured-image/editor-rtl.css +0 -7
  84. package/build-style/post-featured-image/editor.css +0 -7
  85. package/build-style/post-template/style-rtl.css +4 -0
  86. package/build-style/post-template/style.css +4 -0
  87. package/build-style/spacer/editor-rtl.css +4 -0
  88. package/build-style/spacer/editor.css +4 -0
  89. package/build-style/style-rtl.css +81 -6
  90. package/build-style/style.css +81 -6
  91. package/package.json +9 -9
  92. package/src/archives/index.php +1 -1
  93. package/src/common.scss +8 -0
  94. package/src/cover/style.scss +19 -3
  95. package/src/gallery/constants.js +2 -0
  96. package/src/gallery/style.scss +4 -1
  97. package/src/gallery/transforms.js +7 -1
  98. package/src/gallery/utils.js +7 -3
  99. package/src/heading/edit.js +18 -5
  100. package/src/navigation/index.php +4 -4
  101. package/src/page-list/edit.js +47 -9
  102. package/src/page-list/editor.scss +4 -0
  103. package/src/page-list/index.php +5 -0
  104. package/src/post-featured-image/dimension-controls.js +75 -50
  105. package/src/post-featured-image/edit.js +6 -4
  106. package/src/post-featured-image/editor.scss +0 -8
  107. package/src/post-template/style.scss +5 -0
  108. package/src/search/index.php +12 -7
  109. package/src/site-logo/edit.js +1 -32
  110. package/src/site-logo/index.php +1 -1
  111. package/src/site-title/index.php +0 -1
  112. package/src/social-links/deprecated.js +0 -59
  113. package/src/social-links/edit.js +1 -1
  114. package/src/spacer/block.json +3 -3
  115. package/src/spacer/controls.js +108 -0
  116. package/src/spacer/controls.native.js +82 -0
  117. package/src/spacer/deprecated.js +41 -0
  118. package/src/spacer/edit.js +127 -113
  119. package/src/spacer/edit.native.js +68 -0
  120. package/src/spacer/editor.scss +6 -0
  121. package/src/spacer/index.js +2 -0
  122. package/src/spacer/save.js +5 -2
  123. package/src/table/deprecated.js +5 -1
@@ -0,0 +1,95 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+
10
+ var _element = require("@wordpress/element");
11
+
12
+ var _components = require("@wordpress/components");
13
+
14
+ var _blockEditor = require("@wordpress/block-editor");
15
+
16
+ var _i18n = require("@wordpress/i18n");
17
+
18
+ var _style = _interopRequireDefault(require("./style.scss"));
19
+
20
+ /**
21
+ * WordPress dependencies
22
+ */
23
+
24
+ /**
25
+ * Internal dependencies
26
+ */
27
+ const DEFAULT_VALUES = {
28
+ px: '100',
29
+ em: '10',
30
+ rem: '10',
31
+ vw: '10',
32
+ vh: '25'
33
+ };
34
+
35
+ function Controls(_ref) {
36
+ let {
37
+ attributes,
38
+ context,
39
+ setAttributes
40
+ } = _ref;
41
+ const {
42
+ orientation
43
+ } = context;
44
+ const label = orientation !== 'horizontal' ? (0, _i18n.__)('Height') : (0, _i18n.__)('Width');
45
+ const {
46
+ height,
47
+ width
48
+ } = attributes;
49
+ const {
50
+ valueToConvert,
51
+ valueUnit: unit
52
+ } = (0, _components.getValueAndUnit)(orientation !== 'horizontal' ? height : width) || {};
53
+ const value = Number(valueToConvert);
54
+
55
+ const setNewDimensions = (nextValue, nextUnit) => {
56
+ const valueWithUnit = `${nextValue}${nextUnit}`;
57
+
58
+ if (orientation === 'horizontal') {
59
+ setAttributes({
60
+ width: valueWithUnit
61
+ });
62
+ } else {
63
+ setAttributes({
64
+ height: valueWithUnit
65
+ });
66
+ }
67
+ };
68
+
69
+ const handleChange = (0, _element.useCallback)(nextValue => {
70
+ setNewDimensions(nextValue, unit);
71
+ }, [height, width]);
72
+ const handleUnitChange = (0, _element.useCallback)(nextUnit => {
73
+ setNewDimensions(value, nextUnit);
74
+ }, [height, width]);
75
+ const units = (0, _components.__experimentalUseCustomUnits)({
76
+ availableUnits: (0, _blockEditor.useSetting)('spacing.units') || ['px', 'em', 'rem', 'vw', 'vh'],
77
+ defaultValues: DEFAULT_VALUES
78
+ });
79
+ return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.PanelBody, {
80
+ title: (0, _i18n.__)('Dimensions')
81
+ }, (0, _element.createElement)(_components.UnitControl, {
82
+ label: label,
83
+ min: 1,
84
+ value: value,
85
+ onChange: handleChange,
86
+ onUnitChange: handleUnitChange,
87
+ units: units,
88
+ unit: unit,
89
+ style: _style.default.rangeCellContainer
90
+ })));
91
+ }
92
+
93
+ var _default = Controls;
94
+ exports.default = _default;
95
+ //# sourceMappingURL=controls.native.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["@wordpress/block-library/src/spacer/controls.native.js"],"names":["DEFAULT_VALUES","px","em","rem","vw","vh","Controls","attributes","context","setAttributes","orientation","label","height","width","valueToConvert","valueUnit","unit","value","Number","setNewDimensions","nextValue","nextUnit","valueWithUnit","handleChange","handleUnitChange","units","availableUnits","defaultValues","styles","rangeCellContainer"],"mappings":";;;;;;;;;AASA;;AANA;;AAOA;;AACA;;AAKA;;AAhBA;AACA;AACA;;AAWA;AACA;AACA;AAGA,MAAMA,cAAc,GAAG;AAAEC,EAAAA,EAAE,EAAE,KAAN;AAAaC,EAAAA,EAAE,EAAE,IAAjB;AAAuBC,EAAAA,GAAG,EAAE,IAA5B;AAAkCC,EAAAA,EAAE,EAAE,IAAtC;AAA4CC,EAAAA,EAAE,EAAE;AAAhD,CAAvB;;AAEA,SAASC,QAAT,OAA4D;AAAA,MAAzC;AAAEC,IAAAA,UAAF;AAAcC,IAAAA,OAAd;AAAuBC,IAAAA;AAAvB,GAAyC;AAC3D,QAAM;AAAEC,IAAAA;AAAF,MAAkBF,OAAxB;AACA,QAAMG,KAAK,GAAGD,WAAW,KAAK,YAAhB,GAA+B,cAAI,QAAJ,CAA/B,GAAgD,cAAI,OAAJ,CAA9D;AAEA,QAAM;AAAEE,IAAAA,MAAF;AAAUC,IAAAA;AAAV,MAAoBN,UAA1B;AACA,QAAM;AAAEO,IAAAA,cAAF;AAAkBC,IAAAA,SAAS,EAAEC;AAA7B,MACL,iCAAiBN,WAAW,KAAK,YAAhB,GAA+BE,MAA/B,GAAwCC,KAAzD,KAAoE,EADrE;AAEA,QAAMI,KAAK,GAAGC,MAAM,CAAEJ,cAAF,CAApB;;AAEA,QAAMK,gBAAgB,GAAG,CAAEC,SAAF,EAAaC,QAAb,KAA2B;AACnD,UAAMC,aAAa,GAAI,GAAGF,SAAW,GAAGC,QAAU,EAAlD;;AACA,QAAKX,WAAW,KAAK,YAArB,EAAoC;AACnCD,MAAAA,aAAa,CAAE;AAAEI,QAAAA,KAAK,EAAES;AAAT,OAAF,CAAb;AACA,KAFD,MAEO;AACNb,MAAAA,aAAa,CAAE;AAAEG,QAAAA,MAAM,EAAEU;AAAV,OAAF,CAAb;AACA;AACD,GAPD;;AASA,QAAMC,YAAY,GAAG,0BAClBH,SAAF,IAAiB;AAChBD,IAAAA,gBAAgB,CAAEC,SAAF,EAAaJ,IAAb,CAAhB;AACA,GAHmB,EAIpB,CAAEJ,MAAF,EAAUC,KAAV,CAJoB,CAArB;AAOA,QAAMW,gBAAgB,GAAG,0BACtBH,QAAF,IAAgB;AACfF,IAAAA,gBAAgB,CAAEF,KAAF,EAASI,QAAT,CAAhB;AACA,GAHuB,EAIxB,CAAET,MAAF,EAAUC,KAAV,CAJwB,CAAzB;AAOA,QAAMY,KAAK,GAAG,8CAAgB;AAC7BC,IAAAA,cAAc,EAAE,6BAAY,eAAZ,KAAiC,CAChD,IADgD,EAEhD,IAFgD,EAGhD,KAHgD,EAIhD,IAJgD,EAKhD,IALgD,CADpB;AAQ7BC,IAAAA,aAAa,EAAE3B;AARc,GAAhB,CAAd;AAWA,SACC,qDACC,4BAAC,qBAAD;AAAW,IAAA,KAAK,EAAG,cAAI,YAAJ;AAAnB,KACC,4BAAC,uBAAD;AACC,IAAA,KAAK,EAAGW,KADT;AAEC,IAAA,GAAG,EAAG,CAFP;AAGC,IAAA,KAAK,EAAGM,KAHT;AAIC,IAAA,QAAQ,EAAGM,YAJZ;AAKC,IAAA,YAAY,EAAGC,gBALhB;AAMC,IAAA,KAAK,EAAGC,KANT;AAOC,IAAA,IAAI,EAAGT,IAPR;AAQC,IAAA,KAAK,EAAGY,eAAOC;AARhB,IADD,CADD,CADD;AAgBA;;eAEcvB,Q","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tPanelBody,\n\tUnitControl,\n\tgetValueAndUnit,\n\t__experimentalUseCustomUnits as useCustomUnits,\n} from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\nimport { useSetting } from '@wordpress/block-editor';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nconst DEFAULT_VALUES = { px: '100', em: '10', rem: '10', vw: '10', vh: '25' };\n\nfunction Controls( { attributes, context, setAttributes } ) {\n\tconst { orientation } = context;\n\tconst label = orientation !== 'horizontal' ? __( 'Height' ) : __( 'Width' );\n\n\tconst { height, width } = attributes;\n\tconst { valueToConvert, valueUnit: unit } =\n\t\tgetValueAndUnit( orientation !== 'horizontal' ? height : width ) || {};\n\tconst value = Number( valueToConvert );\n\n\tconst setNewDimensions = ( nextValue, nextUnit ) => {\n\t\tconst valueWithUnit = `${ nextValue }${ nextUnit }`;\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\tsetAttributes( { width: valueWithUnit } );\n\t\t} else {\n\t\t\tsetAttributes( { height: valueWithUnit } );\n\t\t}\n\t};\n\n\tconst handleChange = useCallback(\n\t\t( nextValue ) => {\n\t\t\tsetNewDimensions( nextValue, unit );\n\t\t},\n\t\t[ height, width ]\n\t);\n\n\tconst handleUnitChange = useCallback(\n\t\t( nextUnit ) => {\n\t\t\tsetNewDimensions( value, nextUnit );\n\t\t},\n\t\t[ height, width ]\n\t);\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: useSetting( 'spacing.units' ) || [\n\t\t\t'px',\n\t\t\t'em',\n\t\t\t'rem',\n\t\t\t'vw',\n\t\t\t'vh',\n\t\t],\n\t\tdefaultValues: DEFAULT_VALUES,\n\t} );\n\n\treturn (\n\t\t<>\n\t\t\t<PanelBody title={ __( 'Dimensions' ) }>\n\t\t\t\t<UnitControl\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tmin={ 1 }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tonChange={ handleChange }\n\t\t\t\t\tonUnitChange={ handleUnitChange }\n\t\t\t\t\tunits={ units }\n\t\t\t\t\tunit={ unit }\n\t\t\t\t\tstyle={ styles.rangeCellContainer }\n\t\t\t\t/>\n\t\t\t</PanelBody>\n\t\t</>\n\t);\n}\n\nexport default Controls;\n"]}
@@ -0,0 +1,53 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+
8
+ var _element = require("@wordpress/element");
9
+
10
+ var _blockEditor = require("@wordpress/block-editor");
11
+
12
+ /**
13
+ * WordPress dependencies
14
+ */
15
+ const deprecated = [{
16
+ attributes: {
17
+ height: {
18
+ type: 'number',
19
+ default: 100
20
+ },
21
+ width: {
22
+ type: 'number'
23
+ }
24
+ },
25
+
26
+ migrate(attributes) {
27
+ const {
28
+ height,
29
+ width
30
+ } = attributes;
31
+ return { ...attributes,
32
+ width: width !== undefined ? `${width}px` : undefined,
33
+ height: height !== undefined ? `${height}px` : undefined
34
+ };
35
+ },
36
+
37
+ save(_ref) {
38
+ let {
39
+ attributes
40
+ } = _ref;
41
+ return (0, _element.createElement)("div", _blockEditor.useBlockProps.save({
42
+ style: {
43
+ height: attributes.height,
44
+ width: attributes.width
45
+ },
46
+ 'aria-hidden': true
47
+ }));
48
+ }
49
+
50
+ }];
51
+ var _default = deprecated;
52
+ exports.default = _default;
53
+ //# sourceMappingURL=deprecated.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["@wordpress/block-library/src/spacer/deprecated.js"],"names":["deprecated","attributes","height","type","default","width","migrate","undefined","save","useBlockProps","style"],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;AAGA,MAAMA,UAAU,GAAG,CAClB;AACCC,EAAAA,UAAU,EAAE;AACXC,IAAAA,MAAM,EAAE;AACPC,MAAAA,IAAI,EAAE,QADC;AAEPC,MAAAA,OAAO,EAAE;AAFF,KADG;AAKXC,IAAAA,KAAK,EAAE;AACNF,MAAAA,IAAI,EAAE;AADA;AALI,GADb;;AAUCG,EAAAA,OAAO,CAAEL,UAAF,EAAe;AACrB,UAAM;AAAEC,MAAAA,MAAF;AAAUG,MAAAA;AAAV,QAAoBJ,UAA1B;AACA,WAAO,EACN,GAAGA,UADG;AAENI,MAAAA,KAAK,EAAEA,KAAK,KAAKE,SAAV,GAAuB,GAAGF,KAAO,IAAjC,GAAuCE,SAFxC;AAGNL,MAAAA,MAAM,EAAEA,MAAM,KAAKK,SAAX,GAAwB,GAAGL,MAAQ,IAAnC,GAAyCK;AAH3C,KAAP;AAKA,GAjBF;;AAkBCC,EAAAA,IAAI,OAAmB;AAAA,QAAjB;AAAEP,MAAAA;AAAF,KAAiB;AACtB,WACC,mCACMQ,2BAAcD,IAAd,CAAoB;AACxBE,MAAAA,KAAK,EAAE;AACNR,QAAAA,MAAM,EAAED,UAAU,CAACC,MADb;AAENG,QAAAA,KAAK,EAAEJ,UAAU,CAACI;AAFZ,OADiB;AAKxB,qBAAe;AALS,KAApB,CADN,CADD;AAWA;;AA9BF,CADkB,CAAnB;eAmCeL,U","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useBlockProps } from '@wordpress/block-editor';\n\nconst deprecated = [\n\t{\n\t\tattributes: {\n\t\t\theight: {\n\t\t\t\ttype: 'number',\n\t\t\t\tdefault: 100,\n\t\t\t},\n\t\t\twidth: {\n\t\t\t\ttype: 'number',\n\t\t\t},\n\t\t},\n\t\tmigrate( attributes ) {\n\t\t\tconst { height, width } = attributes;\n\t\t\treturn {\n\t\t\t\t...attributes,\n\t\t\t\twidth: width !== undefined ? `${ width }px` : undefined,\n\t\t\t\theight: height !== undefined ? `${ height }px` : undefined,\n\t\t\t};\n\t\t},\n\t\tsave( { attributes } ) {\n\t\t\treturn (\n\t\t\t\t<div\n\t\t\t\t\t{ ...useBlockProps.save( {\n\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\theight: attributes.height,\n\t\t\t\t\t\t\twidth: attributes.width,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t'aria-hidden': true,\n\t\t\t\t\t} ) }\n\t\t\t\t/>\n\t\t\t);\n\t\t},\n\t},\n];\n\nexport default deprecated;\n"]}
@@ -5,13 +5,13 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.default = void 0;
8
+ exports.default = exports.MIN_SPACER_SIZE = exports.MAX_SPACER_SIZE = void 0;
9
9
 
10
10
  var _element = require("@wordpress/element");
11
11
 
12
- var _classnames = _interopRequireDefault(require("classnames"));
12
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
13
 
14
- var _i18n = require("@wordpress/i18n");
14
+ var _classnames = _interopRequireDefault(require("classnames"));
15
15
 
16
16
  var _blockEditor = require("@wordpress/block-editor");
17
17
 
@@ -23,6 +23,8 @@ var _data = require("@wordpress/data");
23
23
 
24
24
  var _primitives = require("@wordpress/primitives");
25
25
 
26
+ var _controls = _interopRequireDefault(require("./controls"));
27
+
26
28
  /**
27
29
  * External dependencies
28
30
  */
@@ -30,12 +32,69 @@ var _primitives = require("@wordpress/primitives");
30
32
  /**
31
33
  * WordPress dependencies
32
34
  */
33
- const MIN_SPACER_HEIGHT = 1;
34
- const MAX_SPACER_HEIGHT = 500;
35
- const MIN_SPACER_WIDTH = 1;
36
- const MAX_SPACER_WIDTH = 500;
37
35
 
38
- const SpacerEdit = _ref => {
36
+ /**
37
+ * Internal dependencies
38
+ */
39
+ const MIN_SPACER_SIZE = 1;
40
+ exports.MIN_SPACER_SIZE = MIN_SPACER_SIZE;
41
+ const MAX_SPACER_SIZE = 500;
42
+ exports.MAX_SPACER_SIZE = MAX_SPACER_SIZE;
43
+
44
+ const ResizableSpacer = _ref => {
45
+ let {
46
+ orientation,
47
+ onResizeStart,
48
+ onResize,
49
+ onResizeStop,
50
+ isSelected,
51
+ isResizing,
52
+ setIsResizing,
53
+ ...props
54
+ } = _ref;
55
+
56
+ const getCurrentSize = elt => {
57
+ return orientation === 'horizontal' ? elt.clientWidth : elt.clientHeight;
58
+ };
59
+
60
+ const getNextVal = elt => {
61
+ return `${getCurrentSize(elt)}px`;
62
+ };
63
+
64
+ return (0, _element.createElement)(_components.ResizableBox, (0, _extends2.default)({
65
+ className: (0, _classnames.default)('block-library-spacer__resize-container', {
66
+ 'resize-horizontal': orientation === 'horizontal',
67
+ 'is-resizing': isResizing,
68
+ 'is-selected': isSelected
69
+ }),
70
+ onResizeStart: (_event, _direction, elt) => {
71
+ const nextVal = getNextVal(elt);
72
+ onResizeStart(nextVal);
73
+ onResize(nextVal);
74
+ },
75
+ onResize: (_event, _direction, elt) => {
76
+ onResize(getNextVal(elt));
77
+
78
+ if (!isResizing) {
79
+ setIsResizing(true);
80
+ }
81
+ },
82
+ onResizeStop: (_event, _direction, elt) => {
83
+ const nextVal = Math.min(MAX_SPACER_SIZE, getCurrentSize(elt));
84
+ onResizeStop(`${nextVal}px`);
85
+ setIsResizing(false);
86
+ },
87
+ __experimentalShowTooltip: true,
88
+ __experimentalTooltipProps: {
89
+ axis: orientation === 'horizontal' ? 'x' : 'y',
90
+ position: 'corner',
91
+ isVisible: isResizing
92
+ },
93
+ showHandle: isSelected
94
+ }, props));
95
+ };
96
+
97
+ const SpacerEdit = _ref2 => {
39
98
  let {
40
99
  attributes,
41
100
  isSelected,
@@ -43,58 +102,43 @@ const SpacerEdit = _ref => {
43
102
  onResizeStart,
44
103
  onResizeStop,
45
104
  context
46
- } = _ref;
105
+ } = _ref2;
47
106
  const {
48
107
  orientation
49
108
  } = context;
50
- const [isResizing, setIsResizing] = (0, _element.useState)(false);
51
109
  const {
52
110
  height,
53
111
  width
54
112
  } = attributes;
113
+ const [isResizing, setIsResizing] = (0, _element.useState)(false);
114
+ const [temporaryHeight, setTemporaryHeight] = (0, _element.useState)(null);
115
+ const [temporaryWidth, setTemporaryWidth] = (0, _element.useState)(null);
55
116
 
56
- const updateHeight = value => {
117
+ const handleOnVerticalResizeStop = newHeight => {
118
+ onResizeStop();
57
119
  setAttributes({
58
- height: value
120
+ height: newHeight
59
121
  });
122
+ setTemporaryHeight(null);
60
123
  };
61
124
 
62
- const updateWidth = value => {
125
+ const handleOnHorizontalResizeStop = newWidth => {
126
+ onResizeStop();
63
127
  setAttributes({
64
- width: value
128
+ width: newWidth
65
129
  });
130
+ setTemporaryWidth(null);
66
131
  };
67
132
 
68
- const handleOnResizeStart = function () {
69
- onResizeStart(...arguments);
70
- setIsResizing(true);
71
- };
72
-
73
- const handleOnVerticalResizeStop = (event, direction, elt, delta) => {
74
- onResizeStop();
75
- const spacerHeight = Math.min(parseInt(height + delta.height, 10), MAX_SPACER_HEIGHT);
76
- updateHeight(spacerHeight);
77
- setIsResizing(false);
78
- };
79
-
80
- const handleOnHorizontalResizeStop = (event, direction, elt, delta) => {
81
- onResizeStop();
82
- const spacerWidth = Math.min(parseInt(width + delta.width, 10), MAX_SPACER_WIDTH);
83
- updateWidth(spacerWidth);
84
- setIsResizing(false);
133
+ const style = {
134
+ height: orientation === 'horizontal' ? 24 : temporaryHeight || height || undefined,
135
+ width: orientation === 'horizontal' ? temporaryWidth || width || undefined : undefined
85
136
  };
86
137
 
87
138
  const resizableBoxWithOrientation = blockOrientation => {
88
139
  if (blockOrientation === 'horizontal') {
89
- return (0, _element.createElement)(_components.ResizableBox, {
90
- className: (0, _classnames.default)('block-library-spacer__resize-container', 'resize-horizontal', {
91
- 'is-selected': isSelected
92
- }),
93
- size: {
94
- width,
95
- height: 24
96
- },
97
- minWidth: MIN_SPACER_WIDTH,
140
+ return (0, _element.createElement)(ResizableSpacer, {
141
+ minWidth: MIN_SPACER_SIZE,
98
142
  enable: {
99
143
  top: false,
100
144
  right: true,
@@ -105,26 +149,17 @@ const SpacerEdit = _ref => {
105
149
  bottomLeft: false,
106
150
  topLeft: false
107
151
  },
108
- onResizeStart: handleOnResizeStart,
152
+ orientation: blockOrientation,
153
+ onResizeStart: onResizeStart,
154
+ onResize: setTemporaryWidth,
109
155
  onResizeStop: handleOnHorizontalResizeStop,
110
- showHandle: isSelected,
111
- __experimentalShowTooltip: true,
112
- __experimentalTooltipProps: {
113
- axis: 'x',
114
- position: 'corner',
115
- isVisible: isResizing
116
- }
156
+ isSelected: isSelected,
157
+ isResizing: isResizing,
158
+ setIsResizing: setIsResizing
117
159
  });
118
160
  }
119
161
 
120
- return (0, _element.createElement)(_components.ResizableBox, {
121
- className: (0, _classnames.default)('block-library-spacer__resize-container', {
122
- 'is-selected': isSelected
123
- }),
124
- size: {
125
- height
126
- },
127
- minHeight: MIN_SPACER_HEIGHT,
162
+ return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(ResizableSpacer, {
128
163
  enable: {
129
164
  top: false,
130
165
  right: false,
@@ -135,39 +170,33 @@ const SpacerEdit = _ref => {
135
170
  bottomLeft: false,
136
171
  topLeft: false
137
172
  },
138
- onResizeStart: handleOnResizeStart,
173
+ orientation: blockOrientation,
174
+ onResizeStart: onResizeStart,
175
+ onResize: setTemporaryHeight,
139
176
  onResizeStop: handleOnVerticalResizeStop,
140
- showHandle: isSelected,
141
- __experimentalShowTooltip: true,
142
- __experimentalTooltipProps: {
143
- axis: 'y',
144
- position: 'bottom',
145
- isVisible: isResizing
146
- }
147
- });
177
+ isSelected: isSelected,
178
+ isResizing: isResizing,
179
+ setIsResizing: setIsResizing
180
+ }));
148
181
  };
149
182
 
150
183
  (0, _element.useEffect)(() => {
151
184
  if (orientation === 'horizontal' && !width) {
152
- updateWidth(72);
153
- updateHeight(0);
185
+ setAttributes({
186
+ height: '0px',
187
+ width: '72px'
188
+ });
154
189
  }
155
190
  }, []);
156
- return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_primitives.View, (0, _blockEditor.useBlockProps)(), resizableBoxWithOrientation(orientation)), (0, _element.createElement)(_blockEditor.InspectorControls, null, (0, _element.createElement)(_components.PanelBody, {
157
- title: (0, _i18n.__)('Spacer settings')
158
- }, orientation === 'horizontal' && (0, _element.createElement)(_components.RangeControl, {
159
- label: (0, _i18n.__)('Width in pixels'),
160
- min: MIN_SPACER_WIDTH,
161
- max: Math.max(MAX_SPACER_WIDTH, width),
162
- value: width,
163
- onChange: updateWidth
164
- }), orientation !== 'horizontal' && (0, _element.createElement)(_components.RangeControl, {
165
- label: (0, _i18n.__)('Height in pixels'),
166
- min: MIN_SPACER_HEIGHT,
167
- max: Math.max(MAX_SPACER_HEIGHT, height),
168
- value: height,
169
- onChange: updateHeight
170
- }))));
191
+ return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_primitives.View, (0, _blockEditor.useBlockProps)({
192
+ style
193
+ }), resizableBoxWithOrientation(orientation)), (0, _element.createElement)(_controls.default, {
194
+ setAttributes: setAttributes,
195
+ height: temporaryHeight || height,
196
+ width: temporaryWidth || width,
197
+ orientation: orientation,
198
+ isResizing: isResizing
199
+ }));
171
200
  };
172
201
 
173
202
  var _default = (0, _compose.compose)([(0, _data.withDispatch)(dispatch => {
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/block-library/src/spacer/edit.js"],"names":["MIN_SPACER_HEIGHT","MAX_SPACER_HEIGHT","MIN_SPACER_WIDTH","MAX_SPACER_WIDTH","SpacerEdit","attributes","isSelected","setAttributes","onResizeStart","onResizeStop","context","orientation","isResizing","setIsResizing","height","width","updateHeight","value","updateWidth","handleOnResizeStart","handleOnVerticalResizeStop","event","direction","elt","delta","spacerHeight","Math","min","parseInt","handleOnHorizontalResizeStop","spacerWidth","resizableBoxWithOrientation","blockOrientation","top","right","bottom","left","topRight","bottomRight","bottomLeft","topLeft","axis","position","isVisible","max","dispatch","toggleSelection","blockEditorStore","withInstanceId"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tInspectorControls,\n\tuseBlockProps,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { PanelBody, ResizableBox, RangeControl } from '@wordpress/components';\nimport { compose, withInstanceId } from '@wordpress/compose';\nimport { withDispatch } from '@wordpress/data';\nimport { useState, useEffect } from '@wordpress/element';\nimport { View } from '@wordpress/primitives';\n\nconst MIN_SPACER_HEIGHT = 1;\nconst MAX_SPACER_HEIGHT = 500;\n\nconst MIN_SPACER_WIDTH = 1;\nconst MAX_SPACER_WIDTH = 500;\n\nconst SpacerEdit = ( {\n\tattributes,\n\tisSelected,\n\tsetAttributes,\n\tonResizeStart,\n\tonResizeStop,\n\tcontext,\n} ) => {\n\tconst { orientation } = context;\n\tconst [ isResizing, setIsResizing ] = useState( false );\n\tconst { height, width } = attributes;\n\tconst updateHeight = ( value ) => {\n\t\tsetAttributes( {\n\t\t\theight: value,\n\t\t} );\n\t};\n\tconst updateWidth = ( value ) => {\n\t\tsetAttributes( {\n\t\t\twidth: value,\n\t\t} );\n\t};\n\n\tconst handleOnResizeStart = ( ...args ) => {\n\t\tonResizeStart( ...args );\n\t\tsetIsResizing( true );\n\t};\n\n\tconst handleOnVerticalResizeStop = ( event, direction, elt, delta ) => {\n\t\tonResizeStop();\n\t\tconst spacerHeight = Math.min(\n\t\t\tparseInt( height + delta.height, 10 ),\n\t\t\tMAX_SPACER_HEIGHT\n\t\t);\n\t\tupdateHeight( spacerHeight );\n\t\tsetIsResizing( false );\n\t};\n\n\tconst handleOnHorizontalResizeStop = ( event, direction, elt, delta ) => {\n\t\tonResizeStop();\n\t\tconst spacerWidth = Math.min(\n\t\t\tparseInt( width + delta.width, 10 ),\n\t\t\tMAX_SPACER_WIDTH\n\t\t);\n\t\tupdateWidth( spacerWidth );\n\t\tsetIsResizing( false );\n\t};\n\n\tconst resizableBoxWithOrientation = ( blockOrientation ) => {\n\t\tif ( blockOrientation === 'horizontal' ) {\n\t\t\treturn (\n\t\t\t\t<ResizableBox\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'block-library-spacer__resize-container',\n\t\t\t\t\t\t'resize-horizontal',\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-selected': isSelected,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tsize={ {\n\t\t\t\t\t\twidth,\n\t\t\t\t\t\theight: 24,\n\t\t\t\t\t} }\n\t\t\t\t\tminWidth={ MIN_SPACER_WIDTH }\n\t\t\t\t\tenable={ {\n\t\t\t\t\t\ttop: false,\n\t\t\t\t\t\tright: true,\n\t\t\t\t\t\tbottom: false,\n\t\t\t\t\t\tleft: false,\n\t\t\t\t\t\ttopRight: false,\n\t\t\t\t\t\tbottomRight: false,\n\t\t\t\t\t\tbottomLeft: false,\n\t\t\t\t\t\ttopLeft: false,\n\t\t\t\t\t} }\n\t\t\t\t\tonResizeStart={ handleOnResizeStart }\n\t\t\t\t\tonResizeStop={ handleOnHorizontalResizeStop }\n\t\t\t\t\tshowHandle={ isSelected }\n\t\t\t\t\t__experimentalShowTooltip={ true }\n\t\t\t\t\t__experimentalTooltipProps={ {\n\t\t\t\t\t\taxis: 'x',\n\t\t\t\t\t\tposition: 'corner',\n\t\t\t\t\t\tisVisible: isResizing,\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<ResizableBox\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'block-library-spacer__resize-container',\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-selected': isSelected,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t\tsize={ {\n\t\t\t\t\theight,\n\t\t\t\t} }\n\t\t\t\tminHeight={ MIN_SPACER_HEIGHT }\n\t\t\t\tenable={ {\n\t\t\t\t\ttop: false,\n\t\t\t\t\tright: false,\n\t\t\t\t\tbottom: true,\n\t\t\t\t\tleft: false,\n\t\t\t\t\ttopRight: false,\n\t\t\t\t\tbottomRight: false,\n\t\t\t\t\tbottomLeft: false,\n\t\t\t\t\ttopLeft: false,\n\t\t\t\t} }\n\t\t\t\tonResizeStart={ handleOnResizeStart }\n\t\t\t\tonResizeStop={ handleOnVerticalResizeStop }\n\t\t\t\tshowHandle={ isSelected }\n\t\t\t\t__experimentalShowTooltip={ true }\n\t\t\t\t__experimentalTooltipProps={ {\n\t\t\t\t\taxis: 'y',\n\t\t\t\t\tposition: 'bottom',\n\t\t\t\t\tisVisible: isResizing,\n\t\t\t\t} }\n\t\t\t/>\n\t\t);\n\t};\n\n\tuseEffect( () => {\n\t\tif ( orientation === 'horizontal' && ! width ) {\n\t\t\tupdateWidth( 72 );\n\t\t\tupdateHeight( 0 );\n\t\t}\n\t}, [] );\n\n\treturn (\n\t\t<>\n\t\t\t<View { ...useBlockProps() }>\n\t\t\t\t{ resizableBoxWithOrientation( orientation ) }\n\t\t\t</View>\n\t\t\t<InspectorControls>\n\t\t\t\t<PanelBody title={ __( 'Spacer settings' ) }>\n\t\t\t\t\t{ orientation === 'horizontal' && (\n\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\tlabel={ __( 'Width in pixels' ) }\n\t\t\t\t\t\t\tmin={ MIN_SPACER_WIDTH }\n\t\t\t\t\t\t\tmax={ Math.max( MAX_SPACER_WIDTH, width ) }\n\t\t\t\t\t\t\tvalue={ width }\n\t\t\t\t\t\t\tonChange={ updateWidth }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ orientation !== 'horizontal' && (\n\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\tlabel={ __( 'Height in pixels' ) }\n\t\t\t\t\t\t\tmin={ MIN_SPACER_HEIGHT }\n\t\t\t\t\t\t\tmax={ Math.max( MAX_SPACER_HEIGHT, height ) }\n\t\t\t\t\t\t\tvalue={ height }\n\t\t\t\t\t\t\tonChange={ updateHeight }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</PanelBody>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n};\n\nexport default compose( [\n\twithDispatch( ( dispatch ) => {\n\t\tconst { toggleSelection } = dispatch( blockEditorStore );\n\n\t\treturn {\n\t\t\tonResizeStart: () => toggleSelection( false ),\n\t\t\tonResizeStop: () => toggleSelection( true ),\n\t\t};\n\t} ),\n\twithInstanceId,\n] )( SpacerEdit );\n"]}
1
+ {"version":3,"sources":["@wordpress/block-library/src/spacer/edit.js"],"names":["MIN_SPACER_SIZE","MAX_SPACER_SIZE","ResizableSpacer","orientation","onResizeStart","onResize","onResizeStop","isSelected","isResizing","setIsResizing","props","getCurrentSize","elt","clientWidth","clientHeight","getNextVal","_event","_direction","nextVal","Math","min","axis","position","isVisible","SpacerEdit","attributes","setAttributes","context","height","width","temporaryHeight","setTemporaryHeight","temporaryWidth","setTemporaryWidth","handleOnVerticalResizeStop","newHeight","handleOnHorizontalResizeStop","newWidth","style","undefined","resizableBoxWithOrientation","blockOrientation","top","right","bottom","left","topRight","bottomRight","bottomLeft","topLeft","dispatch","toggleSelection","blockEditorStore","withInstanceId"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseBlockProps,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { ResizableBox } from '@wordpress/components';\nimport { compose, withInstanceId } from '@wordpress/compose';\nimport { withDispatch } from '@wordpress/data';\nimport { useState, useEffect } from '@wordpress/element';\nimport { View } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport SpacerControls from './controls';\n\nexport const MIN_SPACER_SIZE = 1;\nexport const MAX_SPACER_SIZE = 500;\n\nconst ResizableSpacer = ( {\n\torientation,\n\tonResizeStart,\n\tonResize,\n\tonResizeStop,\n\tisSelected,\n\tisResizing,\n\tsetIsResizing,\n\t...props\n} ) => {\n\tconst getCurrentSize = ( elt ) => {\n\t\treturn orientation === 'horizontal'\n\t\t\t? elt.clientWidth\n\t\t\t: elt.clientHeight;\n\t};\n\n\tconst getNextVal = ( elt ) => {\n\t\treturn `${ getCurrentSize( elt ) }px`;\n\t};\n\n\treturn (\n\t\t<ResizableBox\n\t\t\tclassName={ classnames( 'block-library-spacer__resize-container', {\n\t\t\t\t'resize-horizontal': orientation === 'horizontal',\n\t\t\t\t'is-resizing': isResizing,\n\t\t\t\t'is-selected': isSelected,\n\t\t\t} ) }\n\t\t\tonResizeStart={ ( _event, _direction, elt ) => {\n\t\t\t\tconst nextVal = getNextVal( elt );\n\t\t\t\tonResizeStart( nextVal );\n\t\t\t\tonResize( nextVal );\n\t\t\t} }\n\t\t\tonResize={ ( _event, _direction, elt ) => {\n\t\t\t\tonResize( getNextVal( elt ) );\n\t\t\t\tif ( ! isResizing ) {\n\t\t\t\t\tsetIsResizing( true );\n\t\t\t\t}\n\t\t\t} }\n\t\t\tonResizeStop={ ( _event, _direction, elt ) => {\n\t\t\t\tconst nextVal = Math.min(\n\t\t\t\t\tMAX_SPACER_SIZE,\n\t\t\t\t\tgetCurrentSize( elt )\n\t\t\t\t);\n\t\t\t\tonResizeStop( `${ nextVal }px` );\n\t\t\t\tsetIsResizing( false );\n\t\t\t} }\n\t\t\t__experimentalShowTooltip={ true }\n\t\t\t__experimentalTooltipProps={ {\n\t\t\t\taxis: orientation === 'horizontal' ? 'x' : 'y',\n\t\t\t\tposition: 'corner',\n\t\t\t\tisVisible: isResizing,\n\t\t\t} }\n\t\t\tshowHandle={ isSelected }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n};\n\nconst SpacerEdit = ( {\n\tattributes,\n\tisSelected,\n\tsetAttributes,\n\tonResizeStart,\n\tonResizeStop,\n\tcontext,\n} ) => {\n\tconst { orientation } = context;\n\tconst { height, width } = attributes;\n\n\tconst [ isResizing, setIsResizing ] = useState( false );\n\tconst [ temporaryHeight, setTemporaryHeight ] = useState( null );\n\tconst [ temporaryWidth, setTemporaryWidth ] = useState( null );\n\n\tconst handleOnVerticalResizeStop = ( newHeight ) => {\n\t\tonResizeStop();\n\n\t\tsetAttributes( { height: newHeight } );\n\t\tsetTemporaryHeight( null );\n\t};\n\n\tconst handleOnHorizontalResizeStop = ( newWidth ) => {\n\t\tonResizeStop();\n\t\tsetAttributes( { width: newWidth } );\n\t\tsetTemporaryWidth( null );\n\t};\n\n\tconst style = {\n\t\theight:\n\t\t\torientation === 'horizontal'\n\t\t\t\t? 24\n\t\t\t\t: temporaryHeight || height || undefined,\n\t\twidth:\n\t\t\torientation === 'horizontal'\n\t\t\t\t? temporaryWidth || width || undefined\n\t\t\t\t: undefined,\n\t};\n\n\tconst resizableBoxWithOrientation = ( blockOrientation ) => {\n\t\tif ( blockOrientation === 'horizontal' ) {\n\t\t\treturn (\n\t\t\t\t<ResizableSpacer\n\t\t\t\t\tminWidth={ MIN_SPACER_SIZE }\n\t\t\t\t\tenable={ {\n\t\t\t\t\t\ttop: false,\n\t\t\t\t\t\tright: true,\n\t\t\t\t\t\tbottom: false,\n\t\t\t\t\t\tleft: false,\n\t\t\t\t\t\ttopRight: false,\n\t\t\t\t\t\tbottomRight: false,\n\t\t\t\t\t\tbottomLeft: false,\n\t\t\t\t\t\ttopLeft: false,\n\t\t\t\t\t} }\n\t\t\t\t\torientation={ blockOrientation }\n\t\t\t\t\tonResizeStart={ onResizeStart }\n\t\t\t\t\tonResize={ setTemporaryWidth }\n\t\t\t\t\tonResizeStop={ handleOnHorizontalResizeStop }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tisResizing={ isResizing }\n\t\t\t\t\tsetIsResizing={ setIsResizing }\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<ResizableSpacer\n\t\t\t\t\tenable={ {\n\t\t\t\t\t\ttop: false,\n\t\t\t\t\t\tright: false,\n\t\t\t\t\t\tbottom: true,\n\t\t\t\t\t\tleft: false,\n\t\t\t\t\t\ttopRight: false,\n\t\t\t\t\t\tbottomRight: false,\n\t\t\t\t\t\tbottomLeft: false,\n\t\t\t\t\t\ttopLeft: false,\n\t\t\t\t\t} }\n\t\t\t\t\torientation={ blockOrientation }\n\t\t\t\t\tonResizeStart={ onResizeStart }\n\t\t\t\t\tonResize={ setTemporaryHeight }\n\t\t\t\t\tonResizeStop={ handleOnVerticalResizeStop }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tisResizing={ isResizing }\n\t\t\t\t\tsetIsResizing={ setIsResizing }\n\t\t\t\t/>\n\t\t\t</>\n\t\t);\n\t};\n\n\tuseEffect( () => {\n\t\tif ( orientation === 'horizontal' && ! width ) {\n\t\t\tsetAttributes( {\n\t\t\t\theight: '0px',\n\t\t\t\twidth: '72px',\n\t\t\t} );\n\t\t}\n\t}, [] );\n\n\treturn (\n\t\t<>\n\t\t\t<View { ...useBlockProps( { style } ) }>\n\t\t\t\t{ resizableBoxWithOrientation( orientation ) }\n\t\t\t</View>\n\t\t\t<SpacerControls\n\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\theight={ temporaryHeight || height }\n\t\t\t\twidth={ temporaryWidth || width }\n\t\t\t\torientation={ orientation }\n\t\t\t\tisResizing={ isResizing }\n\t\t\t/>\n\t\t</>\n\t);\n};\n\nexport default compose( [\n\twithDispatch( ( dispatch ) => {\n\t\tconst { toggleSelection } = dispatch( blockEditorStore );\n\n\t\treturn {\n\t\t\tonResizeStart: () => toggleSelection( false ),\n\t\t\tonResizeStop: () => toggleSelection( true ),\n\t\t};\n\t} ),\n\twithInstanceId,\n] )( SpacerEdit );\n"]}
@@ -0,0 +1,76 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+
10
+ var _element = require("@wordpress/element");
11
+
12
+ var _reactNative = require("react-native");
13
+
14
+ var _components = require("@wordpress/components");
15
+
16
+ var _compose = require("@wordpress/compose");
17
+
18
+ var _blockEditor = require("@wordpress/block-editor");
19
+
20
+ var _controls = _interopRequireDefault(require("./controls"));
21
+
22
+ var _editorNative = _interopRequireDefault(require("./editor.native.scss"));
23
+
24
+ /**
25
+ * External dependencies
26
+ */
27
+
28
+ /**
29
+ * WordPress dependencies
30
+ */
31
+
32
+ /**
33
+ * Internal dependencies
34
+ */
35
+ const Spacer = _ref => {
36
+ let {
37
+ attributes,
38
+ context,
39
+ setAttributes,
40
+ isSelected,
41
+ getStylesFromColorScheme
42
+ } = _ref;
43
+ const {
44
+ height,
45
+ width
46
+ } = attributes;
47
+ const {
48
+ orientation
49
+ } = context;
50
+ const defaultStyle = getStylesFromColorScheme(_editorNative.default.staticSpacer, _editorNative.default.staticDarkSpacer);
51
+ (0, _element.useEffect)(() => {
52
+ if (orientation === 'horizontal' && !width) {
53
+ setAttributes({
54
+ height: '0px',
55
+ width: '72px'
56
+ });
57
+ }
58
+ }, []);
59
+ const convertedHeight = (0, _components.useConvertUnitToMobile)(height);
60
+ const convertedWidth = (0, _components.useConvertUnitToMobile)(width);
61
+ return (0, _element.createElement)(_reactNative.View, {
62
+ style: [defaultStyle, isSelected && _editorNative.default.selectedSpacer, {
63
+ height: convertedHeight,
64
+ width: convertedWidth
65
+ }]
66
+ }, isSelected && (0, _element.createElement)(_blockEditor.InspectorControls, null, (0, _element.createElement)(_controls.default, {
67
+ attributes: attributes,
68
+ context: context,
69
+ setAttributes: setAttributes
70
+ })));
71
+ };
72
+
73
+ var _default = (0, _compose.withPreferredColorScheme)(Spacer);
74
+
75
+ exports.default = _default;
76
+ //# sourceMappingURL=edit.native.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["@wordpress/block-library/src/spacer/edit.native.js"],"names":["Spacer","attributes","context","setAttributes","isSelected","getStylesFromColorScheme","height","width","orientation","defaultStyle","styles","staticSpacer","staticDarkSpacer","convertedHeight","convertedWidth","selectedSpacer"],"mappings":";;;;;;;;;AAWA;;AARA;;AAKA;;AACA;;AACA;;AAMA;;AACA;;AAjBA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AAIA,MAAMA,MAAM,GAAG,QAMR;AAAA,MANU;AAChBC,IAAAA,UADgB;AAEhBC,IAAAA,OAFgB;AAGhBC,IAAAA,aAHgB;AAIhBC,IAAAA,UAJgB;AAKhBC,IAAAA;AALgB,GAMV;AACN,QAAM;AAAEC,IAAAA,MAAF;AAAUC,IAAAA;AAAV,MAAoBN,UAA1B;AAEA,QAAM;AAAEO,IAAAA;AAAF,MAAkBN,OAAxB;AACA,QAAMO,YAAY,GAAGJ,wBAAwB,CAC5CK,sBAAOC,YADqC,EAE5CD,sBAAOE,gBAFqC,CAA7C;AAKA,0BAAW,MAAM;AAChB,QAAKJ,WAAW,KAAK,YAAhB,IAAgC,CAAED,KAAvC,EAA+C;AAC9CJ,MAAAA,aAAa,CAAE;AACdG,QAAAA,MAAM,EAAE,KADM;AAEdC,QAAAA,KAAK,EAAE;AAFO,OAAF,CAAb;AAIA;AACD,GAPD,EAOG,EAPH;AASA,QAAMM,eAAe,GAAG,wCAAwBP,MAAxB,CAAxB;AACA,QAAMQ,cAAc,GAAG,wCAAwBP,KAAxB,CAAvB;AAEA,SACC,4BAAC,iBAAD;AACC,IAAA,KAAK,EAAG,CACPE,YADO,EAEPL,UAAU,IAAIM,sBAAOK,cAFd,EAGP;AAAET,MAAAA,MAAM,EAAEO,eAAV;AAA2BN,MAAAA,KAAK,EAAEO;AAAlC,KAHO;AADT,KAOGV,UAAU,IACX,4BAAC,8BAAD,QACC,4BAAC,iBAAD;AACC,IAAA,UAAU,EAAGH,UADd;AAEC,IAAA,OAAO,EAAGC,OAFX;AAGC,IAAA,aAAa,EAAGC;AAHjB,IADD,CARF,CADD;AAmBA,CA9CD;;eAgDe,uCAA0BH,MAA1B,C","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { useConvertUnitToMobile } from '@wordpress/components';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { InspectorControls } from '@wordpress/block-editor';\nimport { useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Controls from './controls';\nimport styles from './editor.native.scss';\n\nconst Spacer = ( {\n\tattributes,\n\tcontext,\n\tsetAttributes,\n\tisSelected,\n\tgetStylesFromColorScheme,\n} ) => {\n\tconst { height, width } = attributes;\n\n\tconst { orientation } = context;\n\tconst defaultStyle = getStylesFromColorScheme(\n\t\tstyles.staticSpacer,\n\t\tstyles.staticDarkSpacer\n\t);\n\n\tuseEffect( () => {\n\t\tif ( orientation === 'horizontal' && ! width ) {\n\t\t\tsetAttributes( {\n\t\t\t\theight: '0px',\n\t\t\t\twidth: '72px',\n\t\t\t} );\n\t\t}\n\t}, [] );\n\n\tconst convertedHeight = useConvertUnitToMobile( height );\n\tconst convertedWidth = useConvertUnitToMobile( width );\n\n\treturn (\n\t\t<View\n\t\t\tstyle={ [\n\t\t\t\tdefaultStyle,\n\t\t\t\tisSelected && styles.selectedSpacer,\n\t\t\t\t{ height: convertedHeight, width: convertedWidth },\n\t\t\t] }\n\t\t>\n\t\t\t{ isSelected && (\n\t\t\t\t<InspectorControls>\n\t\t\t\t\t<Controls\n\t\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\t\tcontext={ context }\n\t\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\t/>\n\t\t\t\t</InspectorControls>\n\t\t\t) }\n\t\t</View>\n\t);\n};\n\nexport default withPreferredColorScheme( Spacer );\n"]}
@@ -9,6 +9,8 @@ exports.settings = exports.name = exports.metadata = void 0;
9
9
 
10
10
  var _icons = require("@wordpress/icons");
11
11
 
12
+ var _deprecated = _interopRequireDefault(require("./deprecated"));
13
+
12
14
  var _edit = _interopRequireDefault(require("./edit"));
13
15
 
14
16
  var _save = _interopRequireDefault(require("./save"));
@@ -29,11 +31,11 @@ const metadata = {
29
31
  textdomain: "default",
30
32
  attributes: {
31
33
  height: {
32
- type: "number",
33
- "default": 100
34
+ type: "string",
35
+ "default": "100px"
34
36
  },
35
37
  width: {
36
- type: "number"
38
+ type: "string"
37
39
  }
38
40
  },
39
41
  usesContext: ["orientation"],
@@ -51,7 +53,8 @@ exports.name = name;
51
53
  const settings = {
52
54
  icon: _icons.resizeCornerNE,
53
55
  edit: _edit.default,
54
- save: _save.default
56
+ save: _save.default,
57
+ deprecated: _deprecated.default
55
58
  };
56
59
  exports.settings = settings;
57
60
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/block-library/src/spacer/index.js"],"names":["name","metadata","settings","icon","edit","save"],"mappings":";;;;;;;;;AAGA;;AAKA;;AAEA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,MAAM;AAAEA,EAAAA;AAAF,IAAWC,QAAjB;;AAIO,MAAMC,QAAQ,GAAG;AACvBC,EAAAA,IAAI,EAAJA,qBADuB;AAEvBC,EAAAA,IAAI,EAAJA,aAFuB;AAGvBC,EAAAA,IAAI,EAAJA;AAHuB,CAAjB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { resizeCornerNE as icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport edit from './edit';\nimport metadata from './block.json';\nimport save from './save';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\tedit,\n\tsave,\n};\n"]}
1
+ {"version":3,"sources":["@wordpress/block-library/src/spacer/index.js"],"names":["name","metadata","settings","icon","edit","save","deprecated"],"mappings":";;;;;;;;;AAGA;;AAKA;;AACA;;AAEA;;AAXA;AACA;AACA;;AAGA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,MAAM;AAAEA,EAAAA;AAAF,IAAWC,QAAjB;;AAIO,MAAMC,QAAQ,GAAG;AACvBC,EAAAA,IAAI,EAAJA,qBADuB;AAEvBC,EAAAA,IAAI,EAAJA,aAFuB;AAGvBC,EAAAA,IAAI,EAAJA,aAHuB;AAIvBC,EAAAA,UAAU,EAAVA;AAJuB,CAAjB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { resizeCornerNE as icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport deprecated from './deprecated';\nimport edit from './edit';\nimport metadata from './block.json';\nimport save from './save';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\tedit,\n\tsave,\n\tdeprecated,\n};\n"]}
@@ -14,12 +14,15 @@ var _blockEditor = require("@wordpress/block-editor");
14
14
  */
15
15
  function save(_ref) {
16
16
  let {
17
- attributes
17
+ attributes: {
18
+ height,
19
+ width
20
+ }
18
21
  } = _ref;
19
22
  return (0, _element.createElement)("div", _blockEditor.useBlockProps.save({
20
23
  style: {
21
- height: attributes.height,
22
- width: attributes.width
24
+ height,
25
+ width
23
26
  },
24
27
  'aria-hidden': true
25
28
  }));
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/block-library/src/spacer/save.js"],"names":["save","attributes","useBlockProps","style","height","width"],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;AAGe,SAASA,IAAT,OAAgC;AAAA,MAAjB;AAAEC,IAAAA;AAAF,GAAiB;AAC9C,SACC,mCACMC,2BAAcF,IAAd,CAAoB;AACxBG,IAAAA,KAAK,EAAE;AAAEC,MAAAA,MAAM,EAAEH,UAAU,CAACG,MAArB;AAA6BC,MAAAA,KAAK,EAAEJ,UAAU,CAACI;AAA/C,KADiB;AAExB,mBAAe;AAFS,GAApB,CADN,CADD;AAQA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useBlockProps } from '@wordpress/block-editor';\n\nexport default function save( { attributes } ) {\n\treturn (\n\t\t<div\n\t\t\t{ ...useBlockProps.save( {\n\t\t\t\tstyle: { height: attributes.height, width: attributes.width },\n\t\t\t\t'aria-hidden': true,\n\t\t\t} ) }\n\t\t/>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/block-library/src/spacer/save.js"],"names":["save","attributes","height","width","useBlockProps","style"],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;AAGe,SAASA,IAAT,OAAmD;AAAA,MAApC;AAAEC,IAAAA,UAAU,EAAE;AAAEC,MAAAA,MAAF;AAAUC,MAAAA;AAAV;AAAd,GAAoC;AACjE,SACC,mCACMC,2BAAcJ,IAAd,CAAoB;AACxBK,IAAAA,KAAK,EAAE;AACNH,MAAAA,MADM;AAENC,MAAAA;AAFM,KADiB;AAKxB,mBAAe;AALS,GAApB,CADN,CADD;AAWA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useBlockProps } from '@wordpress/block-editor';\n\nexport default function save( { attributes: { height, width } } ) {\n\treturn (\n\t\t<div\n\t\t\t{ ...useBlockProps.save( {\n\t\t\t\tstyle: {\n\t\t\t\t\theight,\n\t\t\t\t\twidth,\n\t\t\t\t},\n\t\t\t\t'aria-hidden': true,\n\t\t\t} ) }\n\t\t/>\n\t);\n}\n"]}
@@ -240,7 +240,7 @@ const deprecated = [// Deprecation migrating table block to use colors block sup
240
240
  }));
241
241
  },
242
242
  isEligible: attributes => {
243
- return attributes.backgroundColor && !attributes.style;
243
+ return attributes.backgroundColor && attributes.backgroundColor in oldColors && !attributes.style;
244
244
  },
245
245
  // This version is the first to introduce the style attribute to the
246
246
  // table block. As a result, we'll explicitly override that.