@wordpress/format-library 4.19.2 → 4.20.0

package/build-module/text-color/inline.js.map

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useMemo","useSelect","applyFormat","removeFormat","getActiveFormat","useAnchor","ColorPalette","getColorClassName","getColorObjectByColorValue","getColorObjectByAttributeValues","store","blockEditorStore","useCachedTruthy","Popover","TabPanel","__","textColor","settings","transparentValue","parseCSS","css","split","reduce","accumulator","rule","property","value","color","backgroundColor","parseClassName","className","colorSettings","name","startsWith","endsWith","colorSlug","replace","colorObject","getActiveColors","activeColorFormat","attributes","style","class","setColors","colors","styles","classNames","push","join","slug","length","type","ColorPicker","onChange","select","_getSettings$colors","getSettings","onColorChange","activeColors","createElement","InlineColorUI","onClose","contentRef","popoverAnchor","editableContentElement","current","anchor","tabs","title","tab"],"sources":["@wordpress/format-library/src/text-color/inline.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport {\n\tapplyFormat,\n\tremoveFormat,\n\tgetActiveFormat,\n\tuseAnchor,\n} from '@wordpress/rich-text';\nimport {\n\tColorPalette,\n\tgetColorClassName,\n\tgetColorObjectByColorValue,\n\tgetColorObjectByAttributeValues,\n\tstore as blockEditorStore,\n\tuseCachedTruthy,\n} from '@wordpress/block-editor';\nimport { Popover, TabPanel } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { textColor as settings, transparentValue } from './index';\n\nfunction parseCSS( css = '' ) {\n\treturn css.split( ';' ).reduce( ( accumulator, rule ) => {\n\t\tif ( rule ) {\n\t\t\tconst [ property, value ] = rule.split( ':' );\n\t\t\tif ( property === 'color' ) accumulator.color = value;\n\t\t\tif ( property === 'background-color' && value !== transparentValue )\n\t\t\t\taccumulator.backgroundColor = value;\n\t\t}\n\t\treturn accumulator;\n\t}, {} );\n}\n\nexport function parseClassName( className = '', colorSettings ) {\n\treturn className.split( ' ' ).reduce( ( accumulator, name ) => {\n\t\t// `colorSlug` could contain dashes, so simply match the start and end.\n\t\tif ( name.startsWith( 'has-' ) && name.endsWith( '-color' ) ) {\n\t\t\tconst colorSlug = name\n\t\t\t\t.replace( /^has-/, '' )\n\t\t\t\t.replace( /-color$/, '' );\n\t\t\tconst colorObject = getColorObjectByAttributeValues(\n\t\t\t\tcolorSettings,\n\t\t\t\tcolorSlug\n\t\t\t);\n\t\t\taccumulator.color = colorObject.color;\n\t\t}\n\t\treturn accumulator;\n\t}, {} );\n}\n\nexport function getActiveColors( value, name, colorSettings ) {\n\tconst activeColorFormat = getActiveFormat( value, name );\n\n\tif ( ! activeColorFormat ) {\n\t\treturn {};\n\t}\n\n\treturn {\n\t\t...parseCSS( activeColorFormat.attributes.style ),\n\t\t...parseClassName( activeColorFormat.attributes.class, colorSettings ),\n\t};\n}\n\nfunction setColors( value, name, colorSettings, colors ) {\n\tconst { color, backgroundColor } = {\n\t\t...getActiveColors( value, name, colorSettings ),\n\t\t...colors,\n\t};\n\n\tif ( ! color && ! backgroundColor ) {\n\t\treturn removeFormat( value, name );\n\t}\n\n\tconst styles = [];\n\tconst classNames = [];\n\tconst attributes = {};\n\n\tif ( backgroundColor ) {\n\t\tstyles.push( [ 'background-color', backgroundColor ].join( ':' ) );\n\t} else {\n\t\t// Override default browser color for mark element.\n\t\tstyles.push( [ 'background-color', transparentValue ].join( ':' ) );\n\t}\n\n\tif ( color ) {\n\t\tconst colorObject = getColorObjectByColorValue( colorSettings, color );\n\n\t\tif ( colorObject ) {\n\t\t\tclassNames.push( getColorClassName( 'color', colorObject.slug ) );\n\t\t} else {\n\t\t\tstyles.push( [ 'color', color ].join( ':' ) );\n\t\t}\n\t}\n\n\tif ( styles.length ) attributes.style = styles.join( ';' );\n\tif ( classNames.length ) attributes.class = classNames.join( ' ' );\n\n\treturn applyFormat( value, { type: name, attributes } );\n}\n\nfunction ColorPicker( { name, property, value, onChange } ) {\n\tconst colors = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\treturn getSettings().colors ?? [];\n\t}, [] );\n\tconst onColorChange = useCallback(\n\t\t( color ) => {\n\t\t\tonChange(\n\t\t\t\tsetColors( value, name, colors, { [ property ]: color } )\n\t\t\t);\n\t\t},\n\t\t[ colors, onChange, property ]\n\t);\n\tconst activeColors = useMemo(\n\t\t() => getActiveColors( value, name, colors ),\n\t\t[ name, value, colors ]\n\t);\n\n\treturn (\n\t\t<ColorPalette\n\t\t\tvalue={ activeColors[ property ] }\n\t\t\tonChange={ onColorChange }\n\t\t/>\n\t);\n}\n\nexport default function InlineColorUI( {\n\tname,\n\tvalue,\n\tonChange,\n\tonClose,\n\tcontentRef,\n} ) {\n\t/*\n\t As you change the text color by typing a HEX value into a field,\n\t the return value of document.getSelection jumps to the field you're editing,\n\t not the highlighted text. Given that useAnchor uses document.getSelection,\n\t it will return null, since it can't find the <mark> element within the HEX input.\n\t This caches the last truthy value of the selection anchor reference.\n\t */\n\tconst popoverAnchor = useCachedTruthy(\n\t\tuseAnchor( {\n\t\t\teditableContentElement: contentRef.current,\n\t\t\tsettings,\n\t\t} )\n\t);\n\n\treturn (\n\t\t<Popover\n\t\t\tonClose={ onClose }\n\t\t\tclassName=\"components-inline-color-popover\"\n\t\t\tanchor={ popoverAnchor }\n\t\t>\n\t\t\t<TabPanel\n\t\t\t\ttabs={ [\n\t\t\t\t\t{\n\t\t\t\t\t\tname: 'color',\n\t\t\t\t\t\ttitle: __( 'Text' ),\n\t\t\t\t\t},\n\t\t\t\t\t{\n\t\t\t\t\t\tname: 'backgroundColor',\n\t\t\t\t\t\ttitle: __( 'Background' ),\n\t\t\t\t\t},\n\t\t\t\t] }\n\t\t\t>\n\t\t\t\t{ ( tab ) => (\n\t\t\t\t\t<ColorPicker\n\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\tproperty={ tab.name }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</TabPanel>\n\t\t</Popover>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["useCallback","useMemo","useSelect","applyFormat","removeFormat","getActiveFormat","useAnchor","ColorPalette","getColorClassName","getColorObjectByColorValue","getColorObjectByAttributeValues","store","blockEditorStore","useCachedTruthy","Popover","TabPanel","__","textColor","settings","transparentValue","parseCSS","css","split","reduce","accumulator","rule","property","value","color","backgroundColor","parseClassName","className","colorSettings","name","startsWith","endsWith","colorSlug","replace","colorObject","getActiveColors","activeColorFormat","attributes","style","class","setColors","colors","styles","classNames","push","join","slug","length","type","ColorPicker","onChange","select","_getSettings$colors","getSettings","onColorChange","activeColors","createElement","InlineColorUI","onClose","contentRef","popoverAnchor","editableContentElement","current","cachedRect","getBoundingClientRect","anchor","tabs","title","tab"],"sources":["@wordpress/format-library/src/text-color/inline.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport {\n\tapplyFormat,\n\tremoveFormat,\n\tgetActiveFormat,\n\tuseAnchor,\n} from '@wordpress/rich-text';\nimport {\n\tColorPalette,\n\tgetColorClassName,\n\tgetColorObjectByColorValue,\n\tgetColorObjectByAttributeValues,\n\tstore as blockEditorStore,\n\tuseCachedTruthy,\n} from '@wordpress/block-editor';\nimport { Popover, TabPanel } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { textColor as settings, transparentValue } from './index';\n\nfunction parseCSS( css = '' ) {\n\treturn css.split( ';' ).reduce( ( accumulator, rule ) => {\n\t\tif ( rule ) {\n\t\t\tconst [ property, value ] = rule.split( ':' );\n\t\t\tif ( property === 'color' ) accumulator.color = value;\n\t\t\tif ( property === 'background-color' && value !== transparentValue )\n\t\t\t\taccumulator.backgroundColor = value;\n\t\t}\n\t\treturn accumulator;\n\t}, {} );\n}\n\nexport function parseClassName( className = '', colorSettings ) {\n\treturn className.split( ' ' ).reduce( ( accumulator, name ) => {\n\t\t// `colorSlug` could contain dashes, so simply match the start and end.\n\t\tif ( name.startsWith( 'has-' ) && name.endsWith( '-color' ) ) {\n\t\t\tconst colorSlug = name\n\t\t\t\t.replace( /^has-/, '' )\n\t\t\t\t.replace( /-color$/, '' );\n\t\t\tconst colorObject = getColorObjectByAttributeValues(\n\t\t\t\tcolorSettings,\n\t\t\t\tcolorSlug\n\t\t\t);\n\t\t\taccumulator.color = colorObject.color;\n\t\t}\n\t\treturn accumulator;\n\t}, {} );\n}\n\nexport function getActiveColors( value, name, colorSettings ) {\n\tconst activeColorFormat = getActiveFormat( value, name );\n\n\tif ( ! activeColorFormat ) {\n\t\treturn {};\n\t}\n\n\treturn {\n\t\t...parseCSS( activeColorFormat.attributes.style ),\n\t\t...parseClassName( activeColorFormat.attributes.class, colorSettings ),\n\t};\n}\n\nfunction setColors( value, name, colorSettings, colors ) {\n\tconst { color, backgroundColor } = {\n\t\t...getActiveColors( value, name, colorSettings ),\n\t\t...colors,\n\t};\n\n\tif ( ! color && ! backgroundColor ) {\n\t\treturn removeFormat( value, name );\n\t}\n\n\tconst styles = [];\n\tconst classNames = [];\n\tconst attributes = {};\n\n\tif ( backgroundColor ) {\n\t\tstyles.push( [ 'background-color', backgroundColor ].join( ':' ) );\n\t} else {\n\t\t// Override default browser color for mark element.\n\t\tstyles.push( [ 'background-color', transparentValue ].join( ':' ) );\n\t}\n\n\tif ( color ) {\n\t\tconst colorObject = getColorObjectByColorValue( colorSettings, color );\n\n\t\tif ( colorObject ) {\n\t\t\tclassNames.push( getColorClassName( 'color', colorObject.slug ) );\n\t\t} else {\n\t\t\tstyles.push( [ 'color', color ].join( ':' ) );\n\t\t}\n\t}\n\n\tif ( styles.length ) attributes.style = styles.join( ';' );\n\tif ( classNames.length ) attributes.class = classNames.join( ' ' );\n\n\treturn applyFormat( value, { type: name, attributes } );\n}\n\nfunction ColorPicker( { name, property, value, onChange } ) {\n\tconst colors = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\treturn getSettings().colors ?? [];\n\t}, [] );\n\tconst onColorChange = useCallback(\n\t\t( color ) => {\n\t\t\tonChange(\n\t\t\t\tsetColors( value, name, colors, { [ property ]: color } )\n\t\t\t);\n\t\t},\n\t\t[ colors, onChange, property ]\n\t);\n\tconst activeColors = useMemo(\n\t\t() => getActiveColors( value, name, colors ),\n\t\t[ name, value, colors ]\n\t);\n\n\treturn (\n\t\t<ColorPalette\n\t\t\tvalue={ activeColors[ property ] }\n\t\t\tonChange={ onColorChange }\n\t\t/>\n\t);\n}\n\nexport default function InlineColorUI( {\n\tname,\n\tvalue,\n\tonChange,\n\tonClose,\n\tcontentRef,\n} ) {\n\tconst popoverAnchor = useAnchor( {\n\t\teditableContentElement: contentRef.current,\n\t\tsettings,\n\t} );\n\n\t/*\n\t As you change the text color by typing a HEX value into a field,\n\t the return value of document.getSelection jumps to the field you're editing,\n\t not the highlighted text. Given that useAnchor uses document.getSelection,\n\t it will return null, since it can't find the <mark> element within the HEX input.\n\t This caches the last truthy value of the selection anchor reference.\n\t */\n\tconst cachedRect = useCachedTruthy( popoverAnchor.getBoundingClientRect() );\n\tpopoverAnchor.getBoundingClientRect = () => cachedRect;\n\n\treturn (\n\t\t<Popover\n\t\t\tonClose={ onClose }\n\t\t\tclassName=\"components-inline-color-popover\"\n\t\t\tanchor={ popoverAnchor }\n\t\t>\n\t\t\t<TabPanel\n\t\t\t\ttabs={ [\n\t\t\t\t\t{\n\t\t\t\t\t\tname: 'color',\n\t\t\t\t\t\ttitle: __( 'Text' ),\n\t\t\t\t\t},\n\t\t\t\t\t{\n\t\t\t\t\t\tname: 'backgroundColor',\n\t\t\t\t\t\ttitle: __( 'Background' ),\n\t\t\t\t\t},\n\t\t\t\t] }\n\t\t\t>\n\t\t\t\t{ ( tab ) => (\n\t\t\t\t\t<ColorPicker\n\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\tproperty={ tab.name }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</TabPanel>\n\t\t</Popover>\n\t);\n}\n"],"mappings":"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"}

package/build-module/text-color/inline.native.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * WordPress dependencies
  */

package/build-module/underline/index.js

@@ -1,4 +1,4 @@
-import { createElement, Fragment } from "@wordpress/element";
+import { createElement, Fragment } from "react";
 /**
  * WordPress dependencies
  */

package/build-module/unknown/index.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * WordPress dependencies
  */

package/build-style/style-rtl.css

@@ -97,7 +97,7 @@
   --wp-block-synced-color: #7a00df;
   --wp-block-synced-color--rgb: 122, 0, 223;
 }
-@media (min-resolution: 192dpi) {
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   :root {
     --wp-admin-border-width-focus: 1.5px;
   }

package/build-style/style.css

@@ -97,7 +97,7 @@
   --wp-block-synced-color: #7a00df;
   --wp-block-synced-color--rgb: 122, 0, 223;
 }
-@media (min-resolution: 192dpi) {
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   :root {
     --wp-admin-border-width-focus: 1.5px;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/format-library",
-	"version": "4.19.2",
+	"version": "4.20.0",
 	"description": "Format library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -26,17 +26,17 @@
 	"react-native": "src/index",
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^3.42.2",
-		"@wordpress/block-editor": "^12.10.2",
-		"@wordpress/components": "^25.8.2",
-		"@wordpress/compose": "^6.19.2",
-		"@wordpress/data": "^9.12.2",
-		"@wordpress/element": "^5.19.2",
-		"@wordpress/html-entities": "^3.42.2",
-		"@wordpress/i18n": "^4.42.2",
-		"@wordpress/icons": "^9.33.2",
-		"@wordpress/rich-text": "^6.19.2",
-		"@wordpress/url": "^3.43.2"
+		"@wordpress/a11y": "^3.43.0",
+		"@wordpress/block-editor": "^12.11.0",
+		"@wordpress/components": "^25.9.0",
+		"@wordpress/compose": "^6.20.0",
+		"@wordpress/data": "^9.13.0",
+		"@wordpress/element": "^5.20.0",
+		"@wordpress/html-entities": "^3.43.0",
+		"@wordpress/i18n": "^4.43.0",
+		"@wordpress/icons": "^9.34.0",
+		"@wordpress/rich-text": "^6.20.0",
+		"@wordpress/url": "^3.44.0"
 	},
 	"peerDependencies": {
 		"react": "^18.0.0",
@@ -45,5 +45,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "5d2e3d07cc97af8090fc32c1e5d5013a2967e752"
+	"gitHead": "9b8e598c5418d38fe72197c24ef1d3dd6c712151"
 }

package/src/link/index.js

@@ -130,6 +130,7 @@ export const link = {
 		url: 'href',
 		type: 'data-type',
 		id: 'data-id',
+		_id: 'id',
 		target: 'target',
 		rel: 'rel',
 	},

package/src/text-color/inline.js

@@ -137,6 +137,11 @@ export default function InlineColorUI( {
 	onClose,
 	contentRef,
 } ) {
+	const popoverAnchor = useAnchor( {
+		editableContentElement: contentRef.current,
+		settings,
+	} );
+
 	/*
 	 As you change the text color by typing a HEX value into a field,
 	 the return value of document.getSelection jumps to the field you're editing,
@@ -144,12 +149,8 @@ export default function InlineColorUI( {
 	 it will return null, since it can't find the <mark> element within the HEX input.
 	 This caches the last truthy value of the selection anchor reference.
 	 */
-	const popoverAnchor = useCachedTruthy(
-		useAnchor( {
-			editableContentElement: contentRef.current,
-			settings,
-		} )
-	);
+	const cachedRect = useCachedTruthy( popoverAnchor.getBoundingClientRect() );
+	popoverAnchor.getBoundingClientRect = () => cachedRect;
 
 	return (
 		<Popover