@wordpress/block-editor 12.6.0 → 12.8.0

package/build-module/components/line-height-control/index.js

@@ -1,63 +1,56 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * WordPress dependencies
  */
 import deprecated from '@wordpress/deprecated';
 import { __ } from '@wordpress/i18n';
 import { __experimentalNumberControl as NumberControl } from '@wordpress/components';
+
 /**
  * Internal dependencies
  */
-
-import { BASE_DEFAULT_VALUE, RESET_VALUE, STEP, isLineHeightDefined } from './utils';
-
+import { BASE_DEFAULT_VALUE, RESET_VALUE, STEP, SPIN_FACTOR, isLineHeightDefined } from './utils';
 const LineHeightControl = ({
   value: lineHeight,
   onChange,
-
   /** Start opting into the new margin-free styles that will become the default in a future version. */
   __nextHasNoMarginBottom = false,
   __unstableInputWidth = '60px',
   ...otherProps
 }) => {
   const isDefined = isLineHeightDefined(lineHeight);
-
   const adjustNextValue = (nextValue, wasTypedOrPasted) => {
     // Set the next value without modification if lineHeight has been defined.
     if (isDefined) return nextValue;
+
     /**
-     * The following logic handles the initial step up/down action
+     * The following logic handles the initial spin up/down action
      * (from an undefined value state) so that the next values are better suited for
-     * line-height rendering. For example, the first step up should immediately
+     * line-height rendering. For example, the first spin up should immediately
      * go to 1.6, rather than the normally expected 0.1.
      *
-     * Step up/down actions can be triggered by keydowns of the up/down arrow keys,
-     * or by clicking the spin buttons.
+     * Spin up/down actions can be triggered by keydowns of the up/down arrow keys,
+     * dragging the input or by clicking the spin buttons.
      */
-
+    const spin = STEP * SPIN_FACTOR;
     switch (`${nextValue}`) {
-      case `${STEP}`:
-        // Increment by step value.
-        return BASE_DEFAULT_VALUE + STEP;
-
+      case `${spin}`:
+        // Increment by spin value.
+        return BASE_DEFAULT_VALUE + spin;
       case '0':
         {
-          // This means the user explicitly input '0', rather than stepped down
-          // from an undefined value state.
-          if (wasTypedOrPasted) return nextValue; // Decrement by step value.
-
-          return BASE_DEFAULT_VALUE - STEP;
+          // This means the user explicitly input '0', rather than using the
+          // spin down action from an undefined value state.
+          if (wasTypedOrPasted) return nextValue;
+          // Decrement by spin value.
+          return BASE_DEFAULT_VALUE - spin;
         }
-
       case '':
         return BASE_DEFAULT_VALUE;
-
       default:
         return nextValue;
     }
   };
-
   const stateReducer = (state, action) => {
     // Be careful when changing this — cross-browser behavior of the
     // `inputType` field in `input` events are inconsistent.
@@ -65,13 +58,12 @@ const LineHeightControl = ({
     // on spin button clicks, while other browsers do not even emit an input event.
     const wasTypedOrPasted = ['insertText', 'insertFromPaste'].includes(action.payload.event.nativeEvent?.inputType);
     const value = adjustNextValue(state.value, wasTypedOrPasted);
-    return { ...state,
+    return {
+      ...state,
       value
     };
   };
-
   const value = isDefined ? lineHeight : RESET_VALUE;
-
   if (!__nextHasNoMarginBottom) {
     deprecated('Bottom margin styles for wp.blockEditor.LineHeightControl', {
       since: '6.0',
@@ -79,11 +71,9 @@ const LineHeightControl = ({
       hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version'
     });
   }
-
   const deprecatedStyles = __nextHasNoMarginBottom ? undefined : {
     marginBottom: 24
   };
-
   const handleOnChange = (nextValue, {
     event
   }) => {
@@ -91,34 +81,32 @@ const LineHeightControl = ({
       onChange();
       return;
     }
-
     if (event.type === 'click') {
       onChange(adjustNextValue(`${nextValue}`, false));
       return;
     }
-
     onChange(`${nextValue}`);
   };
-
   return createElement("div", {
     className: "block-editor-line-height-control",
     style: deprecatedStyles
-  }, createElement(NumberControl, { ...otherProps,
+  }, createElement(NumberControl, {
+    ...otherProps,
     __unstableInputWidth: __unstableInputWidth,
     __unstableStateReducer: stateReducer,
     onChange: handleOnChange,
     label: __('Line height'),
     placeholder: BASE_DEFAULT_VALUE,
     step: STEP,
+    spinFactor: SPIN_FACTOR,
     value: value,
     min: 0,
     spinControls: "custom"
   }));
 };
+
 /**
  * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/line-height-control/README.md
  */
-
-
 export default LineHeightControl;
 //# sourceMappingURL=index.js.map

package/build-module/components/line-height-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/line-height-control/index.js"],"names":["deprecated","__","__experimentalNumberControl","NumberControl","BASE_DEFAULT_VALUE","RESET_VALUE","STEP","isLineHeightDefined","LineHeightControl","value","lineHeight","onChange","__nextHasNoMarginBottom","__unstableInputWidth","otherProps","isDefined","adjustNextValue","nextValue","wasTypedOrPasted","stateReducer","state","action","includes","payload","event","nativeEvent","inputType","since","version","hint","deprecatedStyles","undefined","marginBottom","handleOnChange","type"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { __ } from '@wordpress/i18n';\nimport { __experimentalNumberControl as NumberControl } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport {\n\tBASE_DEFAULT_VALUE,\n\tRESET_VALUE,\n\tSTEP,\n\tisLineHeightDefined,\n} from './utils';\n\nconst LineHeightControl = ( {\n\tvalue: lineHeight,\n\tonChange,\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMarginBottom = false,\n\t__unstableInputWidth = '60px',\n\t...otherProps\n} ) => {\n\tconst isDefined = isLineHeightDefined( lineHeight );\n\n\tconst adjustNextValue = ( nextValue, wasTypedOrPasted ) => {\n\t\t// Set the next value without modification if lineHeight has been defined.\n\t\tif ( isDefined ) return nextValue;\n\n\t\t/**\n\t\t * The following logic handles the initial step up/down action\n\t\t * (from an undefined value state) so that the next values are better suited for\n\t\t * line-height rendering. For example, the first step up should immediately\n\t\t * go to 1.6, rather than the normally expected 0.1.\n\t\t *\n\t\t * Step up/down actions can be triggered by keydowns of the up/down arrow keys,\n\t\t * or by clicking the spin buttons.\n\t\t */\n\t\tswitch ( `${ nextValue }` ) {\n\t\t\tcase `${ STEP }`:\n\t\t\t\t// Increment by step value.\n\t\t\t\treturn BASE_DEFAULT_VALUE + STEP;\n\t\t\tcase '0': {\n\t\t\t\t// This means the user explicitly input '0', rather than stepped down\n\t\t\t\t// from an undefined value state.\n\t\t\t\tif ( wasTypedOrPasted ) return nextValue;\n\t\t\t\t// Decrement by step value.\n\t\t\t\treturn BASE_DEFAULT_VALUE - STEP;\n\t\t\t}\n\t\t\tcase '':\n\t\t\t\treturn BASE_DEFAULT_VALUE;\n\t\t\tdefault:\n\t\t\t\treturn nextValue;\n\t\t}\n\t};\n\n\tconst stateReducer = ( state, action ) => {\n\t\t// Be careful when changing this — cross-browser behavior of the\n\t\t// `inputType` field in `input` events are inconsistent.\n\t\t// For example, Firefox emits an input event with inputType=\"insertReplacementText\"\n\t\t// on spin button clicks, while other browsers do not even emit an input event.\n\t\tconst wasTypedOrPasted = [ 'insertText', 'insertFromPaste' ].includes(\n\t\t\taction.payload.event.nativeEvent?.inputType\n\t\t);\n\t\tconst value = adjustNextValue( state.value, wasTypedOrPasted );\n\t\treturn { ...state, value };\n\t};\n\n\tconst value = isDefined ? lineHeight : RESET_VALUE;\n\n\tif ( ! __nextHasNoMarginBottom ) {\n\t\tdeprecated(\n\t\t\t'Bottom margin styles for wp.blockEditor.LineHeightControl',\n\t\t\t{\n\t\t\t\tsince: '6.0',\n\t\t\t\tversion: '6.4',\n\t\t\t\thint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version',\n\t\t\t}\n\t\t);\n\t}\n\tconst deprecatedStyles = __nextHasNoMarginBottom\n\t\t? undefined\n\t\t: { marginBottom: 24 };\n\n\tconst handleOnChange = ( nextValue, { event } ) => {\n\t\tif ( nextValue === '' ) {\n\t\t\tonChange();\n\t\t\treturn;\n\t\t}\n\n\t\tif ( event.type === 'click' ) {\n\t\t\tonChange( adjustNextValue( `${ nextValue }`, false ) );\n\t\t\treturn;\n\t\t}\n\n\t\tonChange( `${ nextValue }` );\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"block-editor-line-height-control\"\n\t\t\tstyle={ deprecatedStyles }\n\t\t>\n\t\t\t<NumberControl\n\t\t\t\t{ ...otherProps }\n\t\t\t\t__unstableInputWidth={ __unstableInputWidth }\n\t\t\t\t__unstableStateReducer={ stateReducer }\n\t\t\t\tonChange={ handleOnChange }\n\t\t\t\tlabel={ __( 'Line height' ) }\n\t\t\t\tplaceholder={ BASE_DEFAULT_VALUE }\n\t\t\t\tstep={ STEP }\n\t\t\t\tvalue={ value }\n\t\t\t\tmin={ 0 }\n\t\t\t\tspinControls=\"custom\"\n\t\t\t/>\n\t\t</div>\n\t);\n};\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/line-height-control/README.md\n */\nexport default LineHeightControl;\n"]}
+{"version":3,"names":["deprecated","__","__experimentalNumberControl","NumberControl","BASE_DEFAULT_VALUE","RESET_VALUE","STEP","SPIN_FACTOR","isLineHeightDefined","LineHeightControl","value","lineHeight","onChange","__nextHasNoMarginBottom","__unstableInputWidth","otherProps","isDefined","adjustNextValue","nextValue","wasTypedOrPasted","spin","stateReducer","state","action","includes","payload","event","nativeEvent","inputType","since","version","hint","deprecatedStyles","undefined","marginBottom","handleOnChange","type","createElement","className","style","__unstableStateReducer","label","placeholder","step","spinFactor","min","spinControls"],"sources":["@wordpress/block-editor/src/components/line-height-control/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { __ } from '@wordpress/i18n';\nimport { __experimentalNumberControl as NumberControl } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport {\n\tBASE_DEFAULT_VALUE,\n\tRESET_VALUE,\n\tSTEP,\n\tSPIN_FACTOR,\n\tisLineHeightDefined,\n} from './utils';\n\nconst LineHeightControl = ( {\n\tvalue: lineHeight,\n\tonChange,\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMarginBottom = false,\n\t__unstableInputWidth = '60px',\n\t...otherProps\n} ) => {\n\tconst isDefined = isLineHeightDefined( lineHeight );\n\n\tconst adjustNextValue = ( nextValue, wasTypedOrPasted ) => {\n\t\t// Set the next value without modification if lineHeight has been defined.\n\t\tif ( isDefined ) return nextValue;\n\n\t\t/**\n\t\t * The following logic handles the initial spin up/down action\n\t\t * (from an undefined value state) so that the next values are better suited for\n\t\t * line-height rendering. For example, the first spin up should immediately\n\t\t * go to 1.6, rather than the normally expected 0.1.\n\t\t *\n\t\t * Spin up/down actions can be triggered by keydowns of the up/down arrow keys,\n\t\t * dragging the input or by clicking the spin buttons.\n\t\t */\n\t\tconst spin = STEP * SPIN_FACTOR;\n\t\tswitch ( `${ nextValue }` ) {\n\t\t\tcase `${ spin }`:\n\t\t\t\t// Increment by spin value.\n\t\t\t\treturn BASE_DEFAULT_VALUE + spin;\n\t\t\tcase '0': {\n\t\t\t\t// This means the user explicitly input '0', rather than using the\n\t\t\t\t// spin down action from an undefined value state.\n\t\t\t\tif ( wasTypedOrPasted ) return nextValue;\n\t\t\t\t// Decrement by spin value.\n\t\t\t\treturn BASE_DEFAULT_VALUE - spin;\n\t\t\t}\n\t\t\tcase '':\n\t\t\t\treturn BASE_DEFAULT_VALUE;\n\t\t\tdefault:\n\t\t\t\treturn nextValue;\n\t\t}\n\t};\n\n\tconst stateReducer = ( state, action ) => {\n\t\t// Be careful when changing this — cross-browser behavior of the\n\t\t// `inputType` field in `input` events are inconsistent.\n\t\t// For example, Firefox emits an input event with inputType=\"insertReplacementText\"\n\t\t// on spin button clicks, while other browsers do not even emit an input event.\n\t\tconst wasTypedOrPasted = [ 'insertText', 'insertFromPaste' ].includes(\n\t\t\taction.payload.event.nativeEvent?.inputType\n\t\t);\n\t\tconst value = adjustNextValue( state.value, wasTypedOrPasted );\n\t\treturn { ...state, value };\n\t};\n\n\tconst value = isDefined ? lineHeight : RESET_VALUE;\n\n\tif ( ! __nextHasNoMarginBottom ) {\n\t\tdeprecated(\n\t\t\t'Bottom margin styles for wp.blockEditor.LineHeightControl',\n\t\t\t{\n\t\t\t\tsince: '6.0',\n\t\t\t\tversion: '6.4',\n\t\t\t\thint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version',\n\t\t\t}\n\t\t);\n\t}\n\tconst deprecatedStyles = __nextHasNoMarginBottom\n\t\t? undefined\n\t\t: { marginBottom: 24 };\n\n\tconst handleOnChange = ( nextValue, { event } ) => {\n\t\tif ( nextValue === '' ) {\n\t\t\tonChange();\n\t\t\treturn;\n\t\t}\n\n\t\tif ( event.type === 'click' ) {\n\t\t\tonChange( adjustNextValue( `${ nextValue }`, false ) );\n\t\t\treturn;\n\t\t}\n\n\t\tonChange( `${ nextValue }` );\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"block-editor-line-height-control\"\n\t\t\tstyle={ deprecatedStyles }\n\t\t>\n\t\t\t<NumberControl\n\t\t\t\t{ ...otherProps }\n\t\t\t\t__unstableInputWidth={ __unstableInputWidth }\n\t\t\t\t__unstableStateReducer={ stateReducer }\n\t\t\t\tonChange={ handleOnChange }\n\t\t\t\tlabel={ __( 'Line height' ) }\n\t\t\t\tplaceholder={ BASE_DEFAULT_VALUE }\n\t\t\t\tstep={ STEP }\n\t\t\t\tspinFactor={ SPIN_FACTOR }\n\t\t\t\tvalue={ value }\n\t\t\t\tmin={ 0 }\n\t\t\t\tspinControls=\"custom\"\n\t\t\t/>\n\t\t</div>\n\t);\n};\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/line-height-control/README.md\n */\nexport default LineHeightControl;\n"],"mappings":"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"}

package/build-module/components/line-height-control/index.native.js

@@ -1,5 +1,4 @@
 import { createElement } from "@wordpress/element";
-
 /**
  * WordPress dependencies
  */
@@ -8,7 +7,6 @@ import { UnitControl } from '@wordpress/components';
 /**
  * Internal dependencies
  */
-
 import { BASE_DEFAULT_VALUE, STEP, isLineHeightDefined } from './utils';
 export default function LineHeightControl({
   value: lineHeight,
@@ -17,13 +15,15 @@ export default function LineHeightControl({
   const isDefined = isLineHeightDefined(lineHeight);
   const value = isDefined ? lineHeight : BASE_DEFAULT_VALUE;
   return createElement(UnitControl, {
-    label: __('Line Height') // Set minimun value of 1 since lower values break on Android
+    label: __('Line Height')
+    // Set minimun value of 1 since lower values break on Android
     ,
     min: 1,
     max: 5,
     step: STEP,
     value: value,
-    onChange: onChange // TODO: should be updated to avoid using `false`, in order to
+    onChange: onChange
+    // TODO: should be updated to avoid using `false`, in order to
     // align with the web version of `UnitControl`
     ,
     units: false

package/build-module/components/line-height-control/index.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/line-height-control/index.native.js"],"names":["__","UnitControl","BASE_DEFAULT_VALUE","STEP","isLineHeightDefined","LineHeightControl","value","lineHeight","onChange","isDefined"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,WAAT,QAA4B,uBAA5B;AACA;AACA;AACA;;AACA,SAASC,kBAAT,EAA6BC,IAA7B,EAAmCC,mBAAnC,QAA8D,SAA9D;AAEA,eAAe,SAASC,iBAAT,CAA4B;AAAEC,EAAAA,KAAK,EAAEC,UAAT;AAAqBC,EAAAA;AAArB,CAA5B,EAA8D;AAC5E,QAAMC,SAAS,GAAGL,mBAAmB,CAAEG,UAAF,CAArC;AACA,QAAMD,KAAK,GAAGG,SAAS,GAAGF,UAAH,GAAgBL,kBAAvC;AACA,SACC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGF,EAAE,CAAE,aAAF,CADX,CAEC;AAFD;AAGC,IAAA,GAAG,EAAG,CAHP;AAIC,IAAA,GAAG,EAAG,CAJP;AAKC,IAAA,IAAI,EAAGG,IALR;AAMC,IAAA,KAAK,EAAGG,KANT;AAOC,IAAA,QAAQ,EAAGE,QAPZ,CAQC;AACA;AATD;AAUC,IAAA,KAAK,EAAG;AAVT,IADD;AAcA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { UnitControl } from '@wordpress/components';\n/**\n * Internal dependencies\n */\nimport { BASE_DEFAULT_VALUE, STEP, isLineHeightDefined } from './utils';\n\nexport default function LineHeightControl( { value: lineHeight, onChange } ) {\n\tconst isDefined = isLineHeightDefined( lineHeight );\n\tconst value = isDefined ? lineHeight : BASE_DEFAULT_VALUE;\n\treturn (\n\t\t<UnitControl\n\t\t\tlabel={ __( 'Line Height' ) }\n\t\t\t// Set minimun value of 1 since lower values break on Android\n\t\t\tmin={ 1 }\n\t\t\tmax={ 5 }\n\t\t\tstep={ STEP }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\t// TODO: should be updated to avoid using `false`, in order to\n\t\t\t// align with the web version of `UnitControl`\n\t\t\tunits={ false }\n\t\t/>\n\t);\n}\n"]}
+{"version":3,"names":["__","UnitControl","BASE_DEFAULT_VALUE","STEP","isLineHeightDefined","LineHeightControl","value","lineHeight","onChange","isDefined","createElement","label","min","max","step","units"],"sources":["@wordpress/block-editor/src/components/line-height-control/index.native.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { UnitControl } from '@wordpress/components';\n/**\n * Internal dependencies\n */\nimport { BASE_DEFAULT_VALUE, STEP, isLineHeightDefined } from './utils';\n\nexport default function LineHeightControl( { value: lineHeight, onChange } ) {\n\tconst isDefined = isLineHeightDefined( lineHeight );\n\tconst value = isDefined ? lineHeight : BASE_DEFAULT_VALUE;\n\treturn (\n\t\t<UnitControl\n\t\t\tlabel={ __( 'Line Height' ) }\n\t\t\t// Set minimun value of 1 since lower values break on Android\n\t\t\tmin={ 1 }\n\t\t\tmax={ 5 }\n\t\t\tstep={ STEP }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\t// TODO: should be updated to avoid using `false`, in order to\n\t\t\t// align with the web version of `UnitControl`\n\t\t\tunits={ false }\n\t\t/>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,WAAW,QAAQ,uBAAuB;AACnD;AACA;AACA;AACA,SAASC,kBAAkB,EAAEC,IAAI,EAAEC,mBAAmB,QAAQ,SAAS;AAEvE,eAAe,SAASC,iBAAiBA,CAAE;EAAEC,KAAK,EAAEC,UAAU;EAAEC;AAAS,CAAC,EAAG;EAC5E,MAAMC,SAAS,GAAGL,mBAAmB,CAAEG,UAAW,CAAC;EACnD,MAAMD,KAAK,GAAGG,SAAS,GAAGF,UAAU,GAAGL,kBAAkB;EACzD,OACCQ,aAAA,CAACT,WAAW;IACXU,KAAK,EAAGX,EAAE,CAAE,aAAc;IAC1B;IAAA;IACAY,GAAG,EAAG,CAAG;IACTC,GAAG,EAAG,CAAG;IACTC,IAAI,EAAGX,IAAM;IACbG,KAAK,EAAGA,KAAO;IACfE,QAAQ,EAAGA;IACX;IACA;IAAA;IACAO,KAAK,EAAG;EAAO,CACf,CAAC;AAEJ"}

package/build-module/components/line-height-control/utils.js

@@ -1,5 +1,10 @@
 export const BASE_DEFAULT_VALUE = 1.5;
-export const STEP = 0.1;
+export const STEP = 0.01;
+/**
+ * A spin factor of 10 allows the spin controls to increment/decrement by 0.1.
+ * e.g. A line-height value of 1.55 will increment to 1.65.
+ */
+export const SPIN_FACTOR = 10;
 /**
  * There are varying value types within LineHeightControl:
  *
@@ -10,8 +15,8 @@ export const STEP = 0.1;
  * Note: If the value is undefined, the input requires it to be an empty string ('')
  * in order to be considered "controlled" by props (rather than internal state).
  */
-
 export const RESET_VALUE = '';
+
 /**
  * Determines if the lineHeight attribute has been properly defined.
  *
@@ -19,7 +24,6 @@ export const RESET_VALUE = '';
  *
  * @return {boolean} Whether the lineHeight attribute is valid.
  */
-
 export function isLineHeightDefined(lineHeight) {
   return lineHeight !== undefined && lineHeight !== RESET_VALUE;
 }

package/build-module/components/line-height-control/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/line-height-control/utils.js"],"names":["BASE_DEFAULT_VALUE","STEP","RESET_VALUE","isLineHeightDefined","lineHeight","undefined"],"mappings":"AAAA,OAAO,MAAMA,kBAAkB,GAAG,GAA3B;AACP,OAAO,MAAMC,IAAI,GAAG,GAAb;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,WAAW,GAAG,EAApB;AAEP;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,mBAAT,CAA8BC,UAA9B,EAA2C;AACjD,SAAOA,UAAU,KAAKC,SAAf,IAA4BD,UAAU,KAAKF,WAAlD;AACA","sourcesContent":["export const BASE_DEFAULT_VALUE = 1.5;\nexport const STEP = 0.1;\n/**\n * There are varying value types within LineHeightControl:\n *\n * {undefined} Initial value. No changes from the user.\n * {string} Input value. Value consumed/outputted by the input. Empty would be ''.\n * {number} Block attribute type. Input value needs to be converted for attribute setting.\n *\n * Note: If the value is undefined, the input requires it to be an empty string ('')\n * in order to be considered \"controlled\" by props (rather than internal state).\n */\nexport const RESET_VALUE = '';\n\n/**\n * Determines if the lineHeight attribute has been properly defined.\n *\n * @param {any} lineHeight The value to check.\n *\n * @return {boolean} Whether the lineHeight attribute is valid.\n */\nexport function isLineHeightDefined( lineHeight ) {\n\treturn lineHeight !== undefined && lineHeight !== RESET_VALUE;\n}\n"]}
+{"version":3,"names":["BASE_DEFAULT_VALUE","STEP","SPIN_FACTOR","RESET_VALUE","isLineHeightDefined","lineHeight","undefined"],"sources":["@wordpress/block-editor/src/components/line-height-control/utils.js"],"sourcesContent":["export const BASE_DEFAULT_VALUE = 1.5;\nexport const STEP = 0.01;\n/**\n * A spin factor of 10 allows the spin controls to increment/decrement by 0.1.\n * e.g. A line-height value of 1.55 will increment to 1.65.\n */\nexport const SPIN_FACTOR = 10;\n/**\n * There are varying value types within LineHeightControl:\n *\n * {undefined} Initial value. No changes from the user.\n * {string} Input value. Value consumed/outputted by the input. Empty would be ''.\n * {number} Block attribute type. Input value needs to be converted for attribute setting.\n *\n * Note: If the value is undefined, the input requires it to be an empty string ('')\n * in order to be considered \"controlled\" by props (rather than internal state).\n */\nexport const RESET_VALUE = '';\n\n/**\n * Determines if the lineHeight attribute has been properly defined.\n *\n * @param {any} lineHeight The value to check.\n *\n * @return {boolean} Whether the lineHeight attribute is valid.\n */\nexport function isLineHeightDefined( lineHeight ) {\n\treturn lineHeight !== undefined && lineHeight !== RESET_VALUE;\n}\n"],"mappings":"AAAA,OAAO,MAAMA,kBAAkB,GAAG,GAAG;AACrC,OAAO,MAAMC,IAAI,GAAG,IAAI;AACxB;AACA;AACA;AACA;AACA,OAAO,MAAMC,WAAW,GAAG,EAAE;AAC7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,WAAW,GAAG,EAAE;;AAE7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,mBAAmBA,CAAEC,UAAU,EAAG;EACjD,OAAOA,UAAU,KAAKC,SAAS,IAAID,UAAU,KAAKF,WAAW;AAC9D"}

package/build-module/components/link-control/constants.js

@@ -1,10 +1,11 @@
 /**
  * WordPress dependencies
  */
-import { __ } from '@wordpress/i18n'; // Used as a unique identifier for the "Create" option within search results.
+import { __ } from '@wordpress/i18n';
+
+// Used as a unique identifier for the "Create" option within search results.
 // Used to help distinguish the "Create" suggestion within the search results in
 // order to handle it as a unique case.
-
 export const CREATE_TYPE = '__CREATE__';
 export const TEL_TYPE = 'tel';
 export const URL_TYPE = 'link';

package/build-module/components/link-control/constants.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/link-control/constants.js"],"names":["__","CREATE_TYPE","TEL_TYPE","URL_TYPE","MAILTO_TYPE","INTERNAL_TYPE","LINK_ENTRY_TYPES","DEFAULT_LINK_SETTINGS","id","title"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB,C,CAEA;AACA;AACA;;AACA,OAAO,MAAMC,WAAW,GAAG,YAApB;AACP,OAAO,MAAMC,QAAQ,GAAG,KAAjB;AACP,OAAO,MAAMC,QAAQ,GAAG,MAAjB;AACP,OAAO,MAAMC,WAAW,GAAG,QAApB;AACP,OAAO,MAAMC,aAAa,GAAG,UAAtB;AAEP,OAAO,MAAMC,gBAAgB,GAAG,CAC/BH,QAD+B,EAE/BC,WAF+B,EAG/BF,QAH+B,EAI/BG,aAJ+B,CAAzB;AAOP,OAAO,MAAME,qBAAqB,GAAG,CACpC;AACCC,EAAAA,EAAE,EAAE,eADL;AAECC,EAAAA,KAAK,EAAET,EAAE,CAAE,iBAAF;AAFV,CADoC,CAA9B","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n// Used as a unique identifier for the \"Create\" option within search results.\n// Used to help distinguish the \"Create\" suggestion within the search results in\n// order to handle it as a unique case.\nexport const CREATE_TYPE = '__CREATE__';\nexport const TEL_TYPE = 'tel';\nexport const URL_TYPE = 'link';\nexport const MAILTO_TYPE = 'mailto';\nexport const INTERNAL_TYPE = 'internal';\n\nexport const LINK_ENTRY_TYPES = [\n\tURL_TYPE,\n\tMAILTO_TYPE,\n\tTEL_TYPE,\n\tINTERNAL_TYPE,\n];\n\nexport const DEFAULT_LINK_SETTINGS = [\n\t{\n\t\tid: 'opensInNewTab',\n\t\ttitle: __( 'Open in new tab' ),\n\t},\n];\n"]}
+{"version":3,"names":["__","CREATE_TYPE","TEL_TYPE","URL_TYPE","MAILTO_TYPE","INTERNAL_TYPE","LINK_ENTRY_TYPES","DEFAULT_LINK_SETTINGS","id","title"],"sources":["@wordpress/block-editor/src/components/link-control/constants.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n// Used as a unique identifier for the \"Create\" option within search results.\n// Used to help distinguish the \"Create\" suggestion within the search results in\n// order to handle it as a unique case.\nexport const CREATE_TYPE = '__CREATE__';\nexport const TEL_TYPE = 'tel';\nexport const URL_TYPE = 'link';\nexport const MAILTO_TYPE = 'mailto';\nexport const INTERNAL_TYPE = 'internal';\n\nexport const LINK_ENTRY_TYPES = [\n\tURL_TYPE,\n\tMAILTO_TYPE,\n\tTEL_TYPE,\n\tINTERNAL_TYPE,\n];\n\nexport const DEFAULT_LINK_SETTINGS = [\n\t{\n\t\tid: 'opensInNewTab',\n\t\ttitle: __( 'Open in new tab' ),\n\t},\n];\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAO,MAAMC,WAAW,GAAG,YAAY;AACvC,OAAO,MAAMC,QAAQ,GAAG,KAAK;AAC7B,OAAO,MAAMC,QAAQ,GAAG,MAAM;AAC9B,OAAO,MAAMC,WAAW,GAAG,QAAQ;AACnC,OAAO,MAAMC,aAAa,GAAG,UAAU;AAEvC,OAAO,MAAMC,gBAAgB,GAAG,CAC/BH,QAAQ,EACRC,WAAW,EACXF,QAAQ,EACRG,aAAa,CACb;AAED,OAAO,MAAME,qBAAqB,GAAG,CACpC;EACCC,EAAE,EAAE,eAAe;EACnBC,KAAK,EAAET,EAAE,CAAE,iBAAkB;AAC9B,CAAC,CACD"}

package/build-module/components/link-control/index.js

@@ -1,23 +1,24 @@
 import { createElement, Fragment } from "@wordpress/element";
-
 /**
  * External dependencies
  */
 import classnames from 'classnames';
+
 /**
  * WordPress dependencies
  */
-
 import { Button, Spinner, Notice, TextControl } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { useRef, useState, useEffect } from '@wordpress/element';
 import { focus } from '@wordpress/dom';
 import { ENTER } from '@wordpress/keycodes';
 import { isShallowEqualObjects } from '@wordpress/is-shallow-equal';
+import { useSelect, useDispatch } from '@wordpress/data';
+import { store as preferencesStore } from '@wordpress/preferences';
+
 /**
  * Internal dependencies
  */
-
 import LinkControlSettingsDrawer from './settings-drawer';
 import LinkControlSearchInput from './search-input';
 import LinkPreview from './link-preview';
@@ -26,6 +27,7 @@ import useCreatePage from './use-create-page';
 import useInternalValue from './use-internal-value';
 import { ViewerFill } from './viewer-slot';
 import { DEFAULT_LINK_SETTINGS } from './constants';
+
 /**
  * Default properties associated with a link control value.
  *
@@ -39,13 +41,11 @@ import { DEFAULT_LINK_SETTINGS } from './constants';
  */
 
 /* eslint-disable jsdoc/valid-types */
-
 /**
  * Custom settings values associated with a link.
  *
  * @typedef {{[setting:string]:any}} WPLinkControlSettingsValue
  */
-
 /* eslint-enable */
 
 /**
@@ -103,6 +103,9 @@ import { DEFAULT_LINK_SETTINGS } from './constants';
  */
 
 const noop = () => {};
+const PREFERENCE_SCOPE = 'core/block-editor';
+const PREFERENCE_KEY = 'linkControlSettingsDrawer';
+
 /**
  * Renders a link control. A link control is a controlled input which maintains
  * a value associated with a link (HTML anchor element) and relevant settings
@@ -110,8 +113,6 @@ const noop = () => {};
  *
  * @param {WPLinkControlProps} props Component props.
  */
-
-
 function LinkControl({
   searchInputPlaceholder,
   value,
@@ -136,7 +137,41 @@ function LinkControl({
   if (withCreateSuggestion === undefined && createSuggestion) {
     withCreateSuggestion = true;
   }
+  const [settingsOpen, setSettingsOpen] = useState(false);
+  const {
+    advancedSettingsPreference
+  } = useSelect(select => {
+    var _prefsStore$get;
+    const prefsStore = select(preferencesStore);
+    return {
+      advancedSettingsPreference: (_prefsStore$get = prefsStore.get(PREFERENCE_SCOPE, PREFERENCE_KEY)) !== null && _prefsStore$get !== void 0 ? _prefsStore$get : false
+    };
+  }, []);
+  const {
+    set: setPreference
+  } = useDispatch(preferencesStore);
 
+  /**
+   * Sets the open/closed state of the Advanced Settings Drawer,
+   * optionlly persisting the state to the user's preferences.
+   *
+   * Note that Block Editor components can be consumed by non-WordPress
+   * environments which may not have preferences setup.
+   * Therefore a local state is also  used as a fallback.
+   *
+   * @param {boolean} prefVal the open/closed state of the Advanced Settings Drawer.
+   */
+  const setSettingsOpenWithPreference = prefVal => {
+    if (setPreference) {
+      setPreference(PREFERENCE_SCOPE, PREFERENCE_KEY, prefVal);
+    }
+    setSettingsOpen(prefVal);
+  };
+
+  // Block Editor components can be consumed by non-WordPress environments
+  // which may not have these preferences setup.
+  // Therefore a local state is used as a fallback.
+  const isSettingsOpen = advancedSettingsPreference || settingsOpen;
   const isMounting = useRef(true);
   const wrapperNode = useRef();
   const textInputRef = useRef();
@@ -144,7 +179,6 @@ function LinkControl({
   const settingsKeys = settings.map(({
     id
   }) => id);
-  const [settingsOpen, setSettingsOpen] = useState(false);
   const [internalControlValue, setInternalControlValue, setInternalURLInputValue, setInternalTextInputValue, createSetInternalSettingValueHandler] = useInternalValue(value);
   const valueHasChanges = value && !isShallowEqualObjects(internalControlValue, value);
   const [isEditingLink, setIsEditingLink] = useState(forceIsEditingLink !== undefined ? forceIsEditingLink : !value || !value.url);
@@ -154,11 +188,10 @@ function LinkControl({
     errorMessage
   } = useCreatePage(createSuggestion);
   useEffect(() => {
-    if (forceIsEditingLink !== undefined && forceIsEditingLink !== isEditingLink) {
-      setIsEditingLink(forceIsEditingLink);
-    } // Todo: bug if the missing dep is introduced. Will need a fix.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-
+    if (forceIsEditingLink === undefined) {
+      return;
+    }
+    setIsEditingLink(forceIsEditingLink);
   }, [forceIsEditingLink]);
   useEffect(() => {
     // We don't auto focus into the Link UI on mount
@@ -167,29 +200,27 @@ function LinkControl({
     if (isMounting.current) {
       isMounting.current = false;
       return;
-    } // Scenario - when:
+    }
+
+    // Scenario - when:
     // - switching between editable and non editable LinkControl
     // - clicking on a link
     // ...then move focus to the *first* element to avoid focus loss
     // and to ensure focus is *within* the Link UI.
-
-
     const nextFocusTarget = focus.focusable.find(wrapperNode.current)[0] || wrapperNode.current;
     nextFocusTarget.focus();
     isEndingEditWithFocus.current = false;
   }, [isEditingLink, isCreatingPage]);
   const hasLinkValue = value?.url?.trim()?.length > 0;
+
   /**
    * Cancels editing state and marks that focus may need to be restored after
    * the next render, if focus was within the wrapper when editing finished.
    */
-
   const stopEditing = () => {
     isEndingEditWithFocus.current = !!wrapperNode.current?.contains(wrapperNode.current.ownerDocument.activeElement);
-    setSettingsOpen(false);
     setIsEditingLink(false);
   };
-
   const handleSelectSuggestion = updatedValue => {
     // Suggestions may contains "settings" values (e.g. `opensInNewTab`)
     // which should not overide any existing settings values set by the
@@ -198,10 +229,10 @@ function LinkControl({
       if (!settingsKeys.includes(key)) {
         acc[key] = updatedValue[key];
       }
-
       return acc;
     }, {});
-    onChange({ ...internalControlValue,
+    onChange({
+      ...internalControlValue,
       ...nonSettingsChanges,
       // As title is not a setting, it must be manually applied
       // in such a way as to preserve the users changes over
@@ -210,42 +241,37 @@ function LinkControl({
     });
     stopEditing();
   };
-
   const handleSubmit = () => {
     if (valueHasChanges) {
       // Submit the original value with new stored values applied
       // on top. URL is a special case as it may also be a prop.
-      onChange({ ...value,
+      onChange({
+        ...value,
         ...internalControlValue,
         url: currentUrlInputValue
       });
     }
-
     stopEditing();
   };
-
   const handleSubmitWithEnter = event => {
     const {
       keyCode
     } = event;
-
     if (keyCode === ENTER && !currentInputIsEmpty // Disallow submitting empty values.
     ) {
       event.preventDefault();
       handleSubmit();
     }
   };
-
   const resetInternalValues = () => {
     setInternalControlValue(value);
   };
-
   const handleCancel = event => {
     event.preventDefault();
-    event.stopPropagation(); // Ensure that any unsubmitted input changes are reset.
+    event.stopPropagation();
 
+    // Ensure that any unsubmitted input changes are reset.
     resetInternalValues();
-
     if (hasLinkValue) {
       // If there is a link then exist editing mode and show preview.
       stopEditing();
@@ -253,21 +279,20 @@ function LinkControl({
       // If there is no link value, then remove the link entirely.
       onRemove?.();
     }
-
     onCancel?.();
   };
-
   const currentUrlInputValue = propInputValue || internalControlValue?.url || '';
   const currentInputIsEmpty = !currentUrlInputValue?.trim()?.length;
   const shownUnlinkControl = onRemove && value && !isEditingLink && !isCreatingPage;
-  const showSettings = !!settings?.length && isEditingLink && hasLinkValue;
-  const showActions = isEditingLink && hasLinkValue; // Only show text control once a URL value has been committed
+  const showActions = isEditingLink && hasLinkValue;
+
+  // Only show text control once a URL value has been committed
   // and it isn't just empty whitespace.
   // See https://github.com/WordPress/gutenberg/pull/33849/#issuecomment-932194927.
-
   const showTextControl = hasLinkValue && hasTextControl;
   const isEditing = (isEditingLink || !value) && !isCreatingPage;
   const isDisabled = !valueHasChanges || currentInputIsEmpty;
+  const showSettings = !!settings?.length && isEditingLink && hasLinkValue;
   return createElement("div", {
     tabIndex: -1,
     ref: wrapperNode,
@@ -315,6 +340,25 @@ function LinkControl({
     onEditClick: () => setIsEditingLink(true),
     hasRichPreviews: hasRichPreviews,
     hasUnlinkControl: shownUnlinkControl,
+    additionalControls: () => {
+      // Expose the "Opens in new tab" settings in the preview
+      // as it is the most common setting to change.
+      if (settings?.find(setting => setting.id === 'opensInNewTab')) {
+        return createElement(LinkSettings, {
+          value: internalControlValue,
+          settings: settings?.filter(({
+            id
+          }) => id === 'opensInNewTab'),
+          onChange: ({
+            opensInNewTab
+          }) => {
+            onChange({
+              opensInNewTab
+            });
+          }
+        });
+      }
+    },
     onRemove: () => {
       onRemove();
       setIsEditingLink(true);
@@ -322,8 +366,8 @@ function LinkControl({
   }), showSettings && createElement("div", {
     className: "block-editor-link-control__tools"
   }, !currentInputIsEmpty && createElement(LinkControlSettingsDrawer, {
-    settingsOpen: settingsOpen,
-    setSettingsOpen: setSettingsOpen
+    settingsOpen: isSettingsOpen,
+    setSettingsOpen: setSettingsOpenWithPreference
   }, createElement(LinkSettings, {
     value: internalControlValue,
     settings: settings,
@@ -340,7 +384,6 @@ function LinkControl({
     onClick: handleCancel
   }, __('Cancel'))), renderControlBottom && renderControlBottom());
 }
-
 LinkControl.ViewerFill = ViewerFill;
 export default LinkControl;
 //# sourceMappingURL=index.js.map