npm - @wordpress/block-editor - Versions diffs - 17.0.0 → 17.1.1-next.v.202609031004.0 - Mend

@wordpress/block-editor 17.0.0 → 17.1.1-next.v.202609031004.0

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 (1802) hide show

package/build-module/components/global-styles/typography-panel.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/global-styles/typography-panel.js"],
+  "sources": ["../../../src/components/global-styles/typography-panel.jsx"],
   "sourcesContent": ["import {\n\tFontSizePicker,\n\t__experimentalNumberControl as NumberControl,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n\tNotice,\n\tToggleControl,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport FontFamilyControl from '../font-family';\nimport FontAppearanceControl from '../font-appearance-control';\nimport LineHeightControl from '../line-height-control';\nimport LetterSpacingControl from '../letter-spacing-control';\nimport TextAlignmentControl from '../text-alignment-control';\nimport TextTransformControl from '../text-transform-control';\nimport TextDecorationControl from '../text-decoration-control';\nimport TextIndentControl from '../text-indent-control';\nimport WritingModeControl from '../writing-mode-control';\nimport ColorGradientDropdownItem from './color-gradient-dropdown-item';\nimport { useHasTextPanel } from './color-panel';\nimport { useColorGradientSettings } from './hooks';\nimport { useToolsPanelDropdownMenuProps } from './utils';\nimport { setImmutably } from '../../utils/object';\nimport {\n\textractPresetSlug,\n\tencodeColorValueWithPalette,\n} from '../../utils/color-values';\nimport {\n\tgetMergedFontFamiliesAndFontFamilyFaces,\n\tfindNearestStyleAndWeight,\n} from './typography-utils';\nimport { getFontStylesAndWeights } from '../../utils/get-font-styles-and-weights';\nimport {\n\tgetInheritanceProps,\n\tInheritanceToolsPanelItem,\n\tisGlobalStylesInheritanceEnabled,\n} from './inheritance';\n\nconst MIN_TEXT_COLUMNS = 1;\nconst MAX_TEXT_COLUMNS = 6;\n\n/**\n * Whether a link color should follow a text color change.\n *\n * A link color tracks the text color (e.g. a Button's) unless it was set\n * deliberately. Raw preset refs are compared rather than decoded hex, since\n * distinct slots can share a hex (`dark-background`/`dark-text` both `#000`).\n *\n * @param {Object} value          Local block styles.\n * @param {Object} inheritedValue Styles inherited from Global Styles.\n * @return {boolean} Whether to sync the link color to the text color.\n */\nfunction shouldSyncLinkColor( value, inheritedValue ) {\n\tconst localLinkColor = value?.elements?.link?.color?.text;\n\t// A local link color keeps tracking only while it matches the text color;\n\t// once it differs it was set deliberately and is left alone.\n\tif ( localLinkColor !== undefined ) {\n\t\treturn localLinkColor === value?.color?.text;\n\t}\n\t// With none set, defer to the inherited values.\n\tconst inheritedLinkColor = inheritedValue?.elements?.link?.color?.text;\n\treturn (\n\t\tinheritedLinkColor === undefined ||\n\t\tinheritedValue?.color?.text === inheritedLinkColor\n\t);\n}\n\nexport function useHasTypographyPanel( settings ) {\n\tconst hasFontFamily = useHasFontFamilyControl( settings );\n\tconst hasLineHeight = useHasLineHeightControl( settings );\n\tconst hasFontAppearance = useHasAppearanceControl( settings );\n\tconst hasLetterSpacing = useHasLetterSpacingControl( settings );\n\tconst hasTextAlign = useHasTextAlignmentControl( settings );\n\tconst hasTextTransform = useHasTextTransformControl( settings );\n\tconst hasTextDecoration = useHasTextDecorationControl( settings );\n\tconst hasTextIndent = useHasTextIndentControl( settings );\n\tconst hasWritingMode = useHasWritingModeControl( settings );\n\tconst hasTextColumns = useHasTextColumnsControl( settings );\n\tconst hasFontSize = useHasFontSizeControl( settings );\n\tconst hasTextColor = useHasTextPanel( settings );\n\n\treturn (\n\t\thasFontFamily ||\n\t\thasLineHeight ||\n\t\thasFontAppearance ||\n\t\thasLetterSpacing ||\n\t\thasTextAlign ||\n\t\thasTextTransform ||\n\t\thasFontSize ||\n\t\thasTextDecoration ||\n\t\thasTextIndent ||\n\t\thasWritingMode ||\n\t\thasTextColumns ||\n\t\thasTextColor\n\t);\n}\n\nfunction useHasFontSizeControl( settings ) {\n\treturn (\n\t\t( settings?.typography?.defaultFontSizes !== false &&\n\t\t\tsettings?.typography?.fontSizes?.default?.length ) ||\n\t\tsettings?.typography?.fontSizes?.theme?.length ||\n\t\tsettings?.typography?.fontSizes?.custom?.length ||\n\t\tsettings?.typography?.customFontSize\n\t);\n}\n\nfunction useHasFontFamilyControl( settings ) {\n\treturn [ 'default', 'theme', 'custom' ].some(\n\t\t( key ) => settings?.typography?.fontFamilies?.[ key ]?.length\n\t);\n}\n\nfunction useHasLineHeightControl( settings ) {\n\treturn settings?.typography?.lineHeight;\n}\n\nfunction useHasAppearanceControl( settings ) {\n\treturn settings?.typography?.fontStyle || settings?.typography?.fontWeight;\n}\n\nfunction useAppearanceControlLabel( settings ) {\n\tif ( ! settings?.typography?.fontStyle ) {\n\t\treturn __( 'Font weight' );\n\t}\n\tif ( ! settings?.typography?.fontWeight ) {\n\t\treturn __( 'Font style' );\n\t}\n\treturn __( 'Appearance' );\n}\n\nfunction useHasLetterSpacingControl( settings ) {\n\treturn settings?.typography?.letterSpacing;\n}\n\nfunction useHasTextTransformControl( settings ) {\n\treturn settings?.typography?.textTransform;\n}\n\nfunction useHasTextAlignmentControl( settings ) {\n\treturn settings?.typography?.textAlign;\n}\n\nfunction useHasTextDecorationControl( settings ) {\n\treturn settings?.typography?.textDecoration;\n}\n\nfunction useHasWritingModeControl( settings ) {\n\treturn settings?.typography?.writingMode;\n}\n\nfunction useHasTextColumnsControl( settings ) {\n\treturn settings?.typography?.textColumns;\n}\n\nfunction useHasTextIndentControl( settings ) {\n\treturn settings?.typography?.textIndent;\n}\n\n/**\n * Concatenate all the font sizes into a single list for the font size picker.\n *\n * @param {Object} settings The global styles settings.\n *\n * @return {Array} The merged font sizes.\n */\nfunction getMergedFontSizes( settings ) {\n\tconst fontSizes = settings?.typography?.fontSizes;\n\tconst defaultFontSizesEnabled = !! settings?.typography?.defaultFontSizes;\n\treturn [\n\t\t...( fontSizes?.custom ?? [] ),\n\t\t...( fontSizes?.theme ?? [] ),\n\t\t...( defaultFontSizesEnabled ? fontSizes?.default ?? [] : [] ),\n\t];\n}\n\nexport function TypographyToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n} ) {\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ __( 'Typography' ) }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t\t__experimentalFirstVisibleItemClass=\"first\"\n\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanel>\n\t);\n}\n\nconst DEFAULT_CONTROLS = {\n\ttextColor: true,\n\tfontFamily: true,\n\tfontSize: true,\n\tfontAppearance: true,\n\tlineHeight: true,\n\tletterSpacing: true,\n\ttextAlign: true,\n\ttextTransform: true,\n\ttextDecoration: true,\n\ttextIndent: true,\n\twritingMode: true,\n\ttextColumns: true,\n};\n\nconst EMPTY_VALUES = [ undefined, null, '' ];\n\nfunction hasValue( value ) {\n\treturn ! EMPTY_VALUES.includes( value );\n}\n\n/**\n * Extracts the numeric quantity from a raw CSS value so it can be used as a\n * unit-control placeholder. The control's unit selector already reflects the\n * inherited unit, so the placeholder must contain only the number (e.g.\n * `1.5em` -> `1.5`) rather than the full unit string.\n *\n * @param {string|number|undefined} rawValue Inherited value to parse.\n * @return {number|undefined} The numeric quantity, or `undefined` when absent.\n */\nfunction getNumericPlaceholder( rawValue ) {\n\tif ( ! hasValue( rawValue ) ) {\n\t\treturn undefined;\n\t}\n\tconst [ quantity ] = parseQuantityAndUnitFromRawValue( rawValue );\n\treturn quantity;\n}\n\nexport default function TypographyPanel( {\n\tas: Wrapper = TypographyToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n\tisGlobalStyles = false,\n\tshowInheritanceLabelIndicators = isGlobalStylesInheritanceEnabled(),\n\tcontrastWarning,\n} ) {\n\tconst { colors, allColors, areCustomSolidsEnabled, decodeValue } =\n\t\tuseColorGradientSettings( settings );\n\t// Always keep the layout className (e.g. `single-column`); only the\n\t// inheritance treatment is gated on `showInheritanceLabelIndicators`.\n\tconst inheritanceProps = ( isInherited, hasLocalOverride, className ) =>\n\t\tgetInheritanceProps(\n\t\t\tshowInheritanceLabelIndicators && isInherited,\n\t\t\tshowInheritanceLabelIndicators && hasLocalOverride,\n\t\t\tclassName\n\t\t);\n\n\t// Text color. Writes to `color.text` (unchanged storage path). The\n\t// control is rendered here instead of the Color panel because text\n\t// color is a typographic concern.\n\tconst hasTextColorEnabled = useHasTextPanel( settings );\n\tconst textColor = decodeValue( inheritedValue?.color?.text );\n\tconst userTextColor = decodeValue( value?.color?.text );\n\tconst hasTextColorValue = () => !! value?.color?.text;\n\tconst setTextColor = ( newColor, newSlug ) => {\n\t\tconst encoded = encodeColorValueWithPalette(\n\t\t\tallColors,\n\t\t\tnewColor,\n\t\t\tnewSlug\n\t\t);\n\t\tlet changedObject = setImmutably( value, [ 'color', 'text' ], encoded );\n\t\t// With the experiment off, keep the pre-inheritance comparison on\n\t\t// `inheritedValue`.\n\t\tconst syncLinkColor = isGlobalStylesInheritanceEnabled()\n\t\t\t? shouldSyncLinkColor( value, inheritedValue )\n\t\t\t: inheritedValue?.color?.text ===\n\t\t\t  inheritedValue?.elements?.link?.color?.text;\n\t\tif ( syncLinkColor ) {\n\t\t\tchangedObject = setImmutably(\n\t\t\t\tchangedObject,\n\t\t\t\t[ 'elements', 'link', 'color', 'text' ],\n\t\t\t\tencoded\n\t\t\t);\n\t\t}\n\t\tonChange( changedObject );\n\t};\n\tconst resetTextColor = () => setTextColor( undefined );\n\n\t// Font Family\n\tconst hasFontFamilyEnabled = useHasFontFamilyControl( settings );\n\t// Render the local value when set, otherwise the inherited value\n\t// as the at-rest preselection. The placeholder boolean is computed\n\t// from `value` directly (not from the merged `fontFamily`) so a\n\t// locally-set value never trips the at-rest visual treatment, even\n\t// when it equals the inherited value.\n\tconst inheritedFontFamily = decodeValue(\n\t\tinheritedValue?.typography?.fontFamily\n\t);\n\tconst fontFamily =\n\t\tdecodeValue( value?.typography?.fontFamily ) ?? inheritedFontFamily;\n\tconst isFontFamilyPlaceholder =\n\t\t! hasValue( value?.typography?.fontFamily ) &&\n\t\thasValue( inheritedFontFamily );\n\tconst { fontFamilies, fontFamilyFaces } = useMemo( () => {\n\t\treturn getMergedFontFamiliesAndFontFamilyFaces( settings, fontFamily );\n\t}, [ settings, fontFamily ] );\n\n\tconst setFontFamily = ( newValue ) => {\n\t\tconst slug = fontFamilies?.find(\n\t\t\t( { fontFamily: f } ) => f === newValue\n\t\t)?.slug;\n\t\tconst nextFontFamily = slug\n\t\t\t? `var:preset|font-family|${ slug }`\n\t\t\t: newValue;\n\t\tlet updatedValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'typography', 'fontFamily' ],\n\t\t\thasValue( nextFontFamily ) ? nextFontFamily : undefined\n\t\t);\n\n\t\t// Check if current font style/weight are available in the new font family.\n\t\tconst newFontFamilyFaces =\n\t\t\tfontFamilies?.find( ( { fontFamily: f } ) => f === newValue )\n\t\t\t\t?.fontFace ?? [];\n\t\tconst { fontStyles, fontWeights } =\n\t\t\tgetFontStylesAndWeights( newFontFamilyFaces );\n\t\tconst hasFontStyle = fontStyles?.some(\n\t\t\t( { value: fs } ) => fs === fontStyle\n\t\t);\n\t\tconst hasFontWeight = fontWeights?.some(\n\t\t\t( { value: fw } ) => fw?.toString() === fontWeight?.toString()\n\t\t);\n\n\t\t// Find the nearest available font style/weight if not available.\n\t\tif ( ! hasFontStyle || ! hasFontWeight ) {\n\t\t\tconst { nearestFontStyle, nearestFontWeight } =\n\t\t\t\tfindNearestStyleAndWeight(\n\t\t\t\t\tnewFontFamilyFaces,\n\t\t\t\t\tfontStyle,\n\t\t\t\t\tfontWeight\n\t\t\t\t);\n\t\t\tif ( nearestFontStyle || nearestFontWeight ) {\n\t\t\t\t// Update to the nearest available font style/weight in the new font family.\n\t\t\t\tupdatedValue = {\n\t\t\t\t\t...updatedValue,\n\t\t\t\t\ttypography: {\n\t\t\t\t\t\t...updatedValue?.typography,\n\t\t\t\t\t\tfontStyle: hasValue( nearestFontStyle )\n\t\t\t\t\t\t\t? nearestFontStyle\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\tfontWeight: hasValue( nearestFontWeight )\n\t\t\t\t\t\t\t? nearestFontWeight\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t} else if ( fontStyle || fontWeight ) {\n\t\t\t\t// Reset if no available styles/weights found.\n\t\t\t\tupdatedValue = {\n\t\t\t\t\t...updatedValue,\n\t\t\t\t\ttypography: {\n\t\t\t\t\t\t...updatedValue?.typography,\n\t\t\t\t\t\tfontStyle: undefined,\n\t\t\t\t\t\tfontWeight: undefined,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t}\n\t\t}\n\n\t\tonChange( updatedValue );\n\t};\n\tconst hasFontFamily = () => hasValue( value?.typography?.fontFamily );\n\tconst resetFontFamily = () => setFontFamily( undefined );\n\n\t// Font Size\n\tconst hasFontSizeEnabled = useHasFontSizeControl( settings );\n\tconst disableCustomFontSizes = ! settings?.typography?.customFontSize;\n\tconst mergedFontSizes = getMergedFontSizes( settings );\n\n\t// Local-then-inherited resolution for the rendered value. The slug\n\t// extraction reads the same composite raw value so an inherited\n\t// preset preselects its chip at rest while a local literal value\n\t// renders as a literal in the custom-size input.\n\tconst rawLocalFontSize = value?.typography?.fontSize;\n\tconst rawInheritedFontSize = inheritedValue?.typography?.fontSize;\n\tconst rawFontSizeForDisplay = rawLocalFontSize ?? rawInheritedFontSize;\n\tconst fontSize = decodeValue( rawFontSizeForDisplay );\n\tconst inheritedFontSizeDecoded = decodeValue( rawInheritedFontSize );\n\tconst isFontSizePlaceholder =\n\t\t! hasValue( rawLocalFontSize ) && hasValue( rawInheritedFontSize );\n\n\t// Extract the slug from the CSS custom property if it exists.\n\tconst extractSlug = ( rawValue ) => {\n\t\tif ( ! rawValue || typeof rawValue !== 'string' ) {\n\t\t\treturn undefined;\n\t\t}\n\t\t// Block supports use `var:preset` format.\n\t\tif ( rawValue.startsWith( 'var:preset|font-size|' ) ) {\n\t\t\treturn rawValue.replace( 'var:preset|font-size|', '' );\n\t\t}\n\t\t// Global styles data uses `var(--wp--preset)` format.\n\t\tconst cssVarMatch = rawValue.match(\n\t\t\t/^var\\(--wp--preset--font-size--([^)]+)\\)$/\n\t\t);\n\t\tif ( cssVarMatch ) {\n\t\t\treturn cssVarMatch[ 1 ];\n\t\t}\n\t\treturn undefined;\n\t};\n\tconst currentFontSizeSlug = extractSlug( rawFontSizeForDisplay );\n\tconst inheritedFontSizeSlug = extractSlug( rawInheritedFontSize );\n\n\tconst setFontSize = ( newValue, metadata ) => {\n\t\tconst actualValue = !! metadata?.slug\n\t\t\t? `var:preset|font-size|${ metadata?.slug }`\n\t\t\t: newValue;\n\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'fontSize' ],\n\t\t\t\thasValue( actualValue ) ? actualValue : undefined\n\t\t\t)\n\t\t);\n\t};\n\t// Display-without-commit interceptor: at-rest, the inner\n\t// `FontSizePickerToggleGroup` fires `onChange( undefined )` when the\n\t// user activates the already-preselected (inherited) chip. Treat\n\t// that as the user's \"accept this inherited value\" affordance and\n\t// commit the inherited value to local. Once committed (no longer\n\t// at-rest), the same `undefined` payload represents a normal\n\t// deselect, so we let it pass through unchanged. The custom-size\n\t// input does not emit `undefined` on focus or activation, so this\n\t// hook is correctly scoped to the ToggleGroup activation path.\n\tconst setFontSizeWithInheritedCommit = ( newValue, metadata ) => {\n\t\tif ( isFontSizePlaceholder && newValue === undefined && ! metadata ) {\n\t\t\tif ( inheritedFontSizeSlug ) {\n\t\t\t\tsetFontSize( undefined, { slug: inheritedFontSizeSlug } );\n\t\t\t} else {\n\t\t\t\tsetFontSize( inheritedFontSizeDecoded );\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\t\tsetFontSize( newValue, metadata );\n\t};\n\tconst hasFontSize = () => hasValue( value?.typography?.fontSize );\n\tconst resetFontSize = () => setFontSize( undefined );\n\n\t// Appearance\n\tconst hasAppearanceControl = useHasAppearanceControl( settings );\n\tconst appearanceControlLabel = useAppearanceControlLabel( settings );\n\tconst hasFontStyles = settings?.typography?.fontStyle;\n\tconst hasFontWeights = settings?.typography?.fontWeight;\n\t// Render local-then-inherited; placeholder fires only when both\n\t// local leaves are unset and at least one inherited leaf exists.\n\tconst inheritedFontStyle = decodeValue(\n\t\tinheritedValue?.typography?.fontStyle\n\t);\n\tconst inheritedFontWeight = decodeValue(\n\t\tinheritedValue?.typography?.fontWeight\n\t);\n\tconst fontStyle =\n\t\tdecodeValue( value?.typography?.fontStyle ) ?? inheritedFontStyle;\n\tconst fontWeight =\n\t\tdecodeValue( value?.typography?.fontWeight ) ?? inheritedFontWeight;\n\tconst isFontAppearancePlaceholder =\n\t\t! hasValue( value?.typography?.fontStyle ) &&\n\t\t! hasValue( value?.typography?.fontWeight ) &&\n\t\t( hasValue( inheritedFontStyle ) || hasValue( inheritedFontWeight ) );\n\tconst setFontAppearance = useCallback(\n\t\t( { fontStyle: newFontStyle, fontWeight: newFontWeight } ) => {\n\t\t\t// Only update the font style and weight if they have changed.\n\t\t\tif ( newFontStyle !== fontStyle || newFontWeight !== fontWeight ) {\n\t\t\t\tonChange( {\n\t\t\t\t\t...value,\n\t\t\t\t\ttypography: {\n\t\t\t\t\t\t...value?.typography,\n\t\t\t\t\t\tfontStyle: hasValue( newFontStyle )\n\t\t\t\t\t\t\t? newFontStyle\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\tfontWeight: hasValue( newFontWeight )\n\t\t\t\t\t\t\t? newFontWeight\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t},\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\t\t[ fontStyle, fontWeight, onChange, value ]\n\t);\n\t// Display-without-commit interceptor for FontAppearance: when the\n\t// control is at rest (no local override, displaying the inherited\n\t// font style/weight), activating the already-preselected option\n\t// would otherwise be swallowed by the equality short-circuit in\n\t// `setFontAppearance`. Treat that activation as the user's\n\t// \"accept this inherited value\" affordance and commit the\n\t// inherited values to local explicitly.\n\tconst setFontAppearanceWithInheritedCommit = useCallback(\n\t\t( next ) => {\n\t\t\tif (\n\t\t\t\tisFontAppearancePlaceholder &&\n\t\t\t\tnext.fontStyle === fontStyle &&\n\t\t\t\tnext.fontWeight === fontWeight\n\t\t\t) {\n\t\t\t\tonChange( {\n\t\t\t\t\t...value,\n\t\t\t\t\ttypography: {\n\t\t\t\t\t\t...value?.typography,\n\t\t\t\t\t\tfontStyle: hasValue( fontStyle )\n\t\t\t\t\t\t\t? fontStyle\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\tfontWeight: hasValue( fontWeight )\n\t\t\t\t\t\t\t? fontWeight\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t},\n\t\t\t\t} );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetFontAppearance( next );\n\t\t},\n\t\t[\n\t\t\tisFontAppearancePlaceholder,\n\t\t\tfontStyle,\n\t\t\tfontWeight,\n\t\t\tonChange,\n\t\t\tvalue,\n\t\t\tsetFontAppearance,\n\t\t]\n\t);\n\tconst hasFontAppearance = () =>\n\t\thasValue( value?.typography?.fontStyle ) ||\n\t\thasValue( value?.typography?.fontWeight );\n\tconst resetFontAppearance = useCallback( () => {\n\t\tsetFontAppearance( {} );\n\t}, [ setFontAppearance ] );\n\n\t// Line Height\n\tconst hasLineHeightEnabled = useHasLineHeightControl( settings );\n\tconst localLineHeight = decodeValue( value?.typography?.lineHeight );\n\tconst inheritedLineHeight = decodeValue(\n\t\tinheritedValue?.typography?.lineHeight\n\t);\n\tconst isLineHeightPlaceholder =\n\t\t! hasValue( value?.typography?.lineHeight ) &&\n\t\thasValue( inheritedLineHeight );\n\tconst setLineHeight = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'lineHeight' ],\n\t\t\t\thasValue( newValue ) ? newValue : undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasLineHeight = () => hasValue( value?.typography?.lineHeight );\n\tconst resetLineHeight = () => setLineHeight( undefined );\n\n\t// Letter Spacing\n\tconst hasLetterSpacingControl = useHasLetterSpacingControl( settings );\n\tconst localLetterSpacing = decodeValue( value?.typography?.letterSpacing );\n\tconst inheritedLetterSpacing = decodeValue(\n\t\tinheritedValue?.typography?.letterSpacing\n\t);\n\tconst isLetterSpacingPlaceholder =\n\t\t! hasValue( value?.typography?.letterSpacing ) &&\n\t\thasValue( inheritedLetterSpacing );\n\tconst setLetterSpacing = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'letterSpacing' ],\n\t\t\t\thasValue( newValue ) ? newValue : undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasLetterSpacing = () => hasValue( value?.typography?.letterSpacing );\n\tconst resetLetterSpacing = () => setLetterSpacing( undefined );\n\n\t// Text Indent\n\tconst hasTextIndentControl = useHasTextIndentControl( settings );\n\tconst localTextIndent = decodeValue( value?.typography?.textIndent );\n\tconst inheritedTextIndent = decodeValue(\n\t\tinheritedValue?.typography?.textIndent\n\t);\n\tconst isTextIndentPlaceholder =\n\t\t! hasValue( value?.typography?.textIndent ) &&\n\t\thasValue( inheritedTextIndent );\n\n\t// Get the setting value - can be 'subsequent' (default), 'all', or false.\n\t// The setting determines which CSS selector is used for the text-indent style.\n\tconst textIndentSetting = settings?.typography?.textIndent ?? 'subsequent';\n\tconst isTextIndentAll = textIndentSetting === 'all';\n\n\tconst setTextIndentValue = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textIndent' ],\n\t\t\t\thasValue( newValue ) ? newValue : undefined\n\t\t\t)\n\t\t);\n\t};\n\n\tconst onToggleTextIndentAll = ( newValue ) => {\n\t\t// Toggle between 'all' and 'subsequent' for the setting.\n\t\t// Include the settings change so it can be handled atomically by the parent.\n\t\tonChange( {\n\t\t\t...value,\n\t\t\tsettings: {\n\t\t\t\ttypography: {\n\t\t\t\t\ttextIndent: newValue ? 'all' : 'subsequent',\n\t\t\t\t},\n\t\t\t},\n\t\t} );\n\t};\n\n\tconst hasTextIndent = () => hasValue( value?.typography?.textIndent );\n\tconst resetTextIndent = () => {\n\t\tonChange(\n\t\t\tsetImmutably( value, [ 'typography', 'textIndent' ], undefined )\n\t\t);\n\t};\n\tconst textIndentHelp = isTextIndentAll\n\t\t? __( 'Indents the first line of all paragraphs.' )\n\t\t: __( 'Indents the first line of each paragraph after the first one.' );\n\n\t// Text Columns\n\tconst hasTextColumnsControl = useHasTextColumnsControl( settings );\n\tconst localTextColumns = decodeValue( value?.typography?.textColumns );\n\tconst inheritedTextColumns = decodeValue(\n\t\tinheritedValue?.typography?.textColumns\n\t);\n\tconst isTextColumnsPlaceholder =\n\t\t! hasValue( value?.typography?.textColumns ) &&\n\t\thasValue( inheritedTextColumns );\n\tconst setTextColumns = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textColumns' ],\n\t\t\t\thasValue( newValue ) ? newValue : undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst hasTextColumns = () => hasValue( value?.typography?.textColumns );\n\tconst resetTextColumns = () => setTextColumns( undefined );\n\n\t// Text Transform\n\tconst hasTextTransformControl = useHasTextTransformControl( settings );\n\tconst inheritedTextTransform = decodeValue(\n\t\tinheritedValue?.typography?.textTransform\n\t);\n\tconst textTransform =\n\t\tdecodeValue( value?.typography?.textTransform ) ??\n\t\tinheritedTextTransform;\n\tconst isTextTransformPlaceholder =\n\t\t! hasValue( value?.typography?.textTransform ) &&\n\t\thasValue( inheritedTextTransform );\n\tconst setTextTransform = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textTransform' ],\n\t\t\t\thasValue( newValue ) ? newValue : undefined\n\t\t\t)\n\t\t);\n\t};\n\t// Display-without-commit interceptor: when at-rest, the inner\n\t// `ToggleGroupControl` fires `onChange( undefined )` if the user\n\t// activates the already-preselected (inherited) option. We treat\n\t// that activation as the user's \"accept this inherited value\"\n\t// affordance and commit the inherited value to local. When\n\t// committed (no longer at-rest), the same `undefined` payload\n\t// represents a normal `isDeselectable` deselect, so we let it pass\n\t// through unchanged.\n\tconst setTextTransformWithInheritedCommit = ( newValue ) => {\n\t\tif ( isTextTransformPlaceholder && newValue === undefined ) {\n\t\t\tsetTextTransform( inheritedTextTransform );\n\t\t\treturn;\n\t\t}\n\t\tsetTextTransform( newValue );\n\t};\n\tconst hasTextTransform = () => hasValue( value?.typography?.textTransform );\n\tconst resetTextTransform = () => setTextTransform( undefined );\n\n\t// Text Decoration\n\tconst hasTextDecorationControl = useHasTextDecorationControl( settings );\n\tconst inheritedTextDecoration = decodeValue(\n\t\tinheritedValue?.typography?.textDecoration\n\t);\n\tconst textDecoration =\n\t\tdecodeValue( value?.typography?.textDecoration ) ??\n\t\tinheritedTextDecoration;\n\tconst isTextDecorationPlaceholder =\n\t\t! hasValue( value?.typography?.textDecoration ) &&\n\t\thasValue( inheritedTextDecoration );\n\tconst setTextDecoration = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textDecoration' ],\n\t\t\t\thasValue( newValue ) ? newValue : undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst setTextDecorationWithInheritedCommit = ( newValue ) => {\n\t\tif ( isTextDecorationPlaceholder && newValue === undefined ) {\n\t\t\tsetTextDecoration( inheritedTextDecoration );\n\t\t\treturn;\n\t\t}\n\t\tsetTextDecoration( newValue );\n\t};\n\tconst hasTextDecoration = () =>\n\t\thasValue( value?.typography?.textDecoration );\n\tconst resetTextDecoration = () => setTextDecoration( undefined );\n\n\t// Text Orientation\n\tconst hasWritingModeControl = useHasWritingModeControl( settings );\n\tconst inheritedWritingMode = decodeValue(\n\t\tinheritedValue?.typography?.writingMode\n\t);\n\tconst writingMode =\n\t\tdecodeValue( value?.typography?.writingMode ) ?? inheritedWritingMode;\n\tconst isWritingModePlaceholder =\n\t\t! hasValue( value?.typography?.writingMode ) &&\n\t\thasValue( inheritedWritingMode );\n\tconst setWritingMode = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'writingMode' ],\n\t\t\t\thasValue( newValue ) ? newValue : undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst setWritingModeWithInheritedCommit = ( newValue ) => {\n\t\tif ( isWritingModePlaceholder && newValue === undefined ) {\n\t\t\tsetWritingMode( inheritedWritingMode );\n\t\t\treturn;\n\t\t}\n\t\tsetWritingMode( newValue );\n\t};\n\tconst hasWritingMode = () => hasValue( value?.typography?.writingMode );\n\tconst resetWritingMode = () => setWritingMode( undefined );\n\n\t// Text Alignment\n\tconst hasTextAlignmentControl = useHasTextAlignmentControl( settings );\n\n\tconst inheritedTextAlign = decodeValue(\n\t\tinheritedValue?.typography?.textAlign\n\t);\n\tconst textAlign =\n\t\tdecodeValue( value?.typography?.textAlign ) ?? inheritedTextAlign;\n\tconst isTextAlignPlaceholder =\n\t\t! hasValue( value?.typography?.textAlign ) &&\n\t\thasValue( inheritedTextAlign );\n\tconst setTextAlign = ( newValue ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'typography', 'textAlign' ],\n\t\t\t\thasValue( newValue ) ? newValue : undefined\n\t\t\t)\n\t\t);\n\t};\n\tconst setTextAlignWithInheritedCommit = ( newValue ) => {\n\t\tif ( isTextAlignPlaceholder && newValue === undefined ) {\n\t\t\tsetTextAlign( inheritedTextAlign );\n\t\t\treturn;\n\t\t}\n\t\tsetTextAlign( newValue );\n\t};\n\tconst hasTextAlign = () => hasValue( value?.typography?.textAlign );\n\tconst resetTextAlign = () => setTextAlign( undefined );\n\n\tconst resetAllFilter = useCallback(\n\t\t( previousValue ) => {\n\t\t\tif ( ! hasTextColorEnabled ) {\n\t\t\t\treturn {\n\t\t\t\t\t...previousValue,\n\t\t\t\t\ttypography: {},\n\t\t\t\t};\n\t\t\t}\n\t\t\treturn {\n\t\t\t\t...previousValue,\n\t\t\t\ttypography: {},\n\t\t\t\tcolor: {\n\t\t\t\t\t...previousValue?.color,\n\t\t\t\t\ttext: undefined,\n\t\t\t\t},\n\t\t\t};\n\t\t},\n\t\t[ hasTextColorEnabled ]\n\t);\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t>\n\t\t\t{ hasTextColorEnabled && (\n\t\t\t\t<ColorGradientDropdownItem\n\t\t\t\t\tlabel={ __( 'Color' ) }\n\t\t\t\t\thasValue={ hasTextColorValue }\n\t\t\t\t\tresetValue={ resetTextColor }\n\t\t\t\t\tisShownByDefault={ defaultControls.textColor }\n\t\t\t\t\tindicators={ [ userTextColor ?? textColor ] }\n\t\t\t\t\tcontrastWarning={ contrastWarning }\n\t\t\t\t\tshowInheritanceLabelIndicators={\n\t\t\t\t\t\tshowInheritanceLabelIndicators\n\t\t\t\t\t}\n\t\t\t\t\tisPlaceholder={\n\t\t\t\t\t\tuserTextColor === undefined && textColor !== undefined\n\t\t\t\t\t}\n\t\t\t\t\thasInheritedValue={ textColor !== undefined }\n\t\t\t\t\ttabs={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tkey: 'text',\n\t\t\t\t\t\t\tlabel: __( 'Color' ),\n\t\t\t\t\t\t\tinheritedValue: textColor,\n\t\t\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tinheritedValue?.color?.text,\n\t\t\t\t\t\t\t\t'color'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\t\t\tvalue?.color?.text,\n\t\t\t\t\t\t\t\t'color'\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tsetValue: setTextColor,\n\t\t\t\t\t\t\tuserValue: userTextColor,\n\t\t\t\t\t\t\tisPlaceholder:\n\t\t\t\t\t\t\t\tuserTextColor === undefined &&\n\t\t\t\t\t\t\t\ttextColor !== undefined,\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t\tcolorGradientControlSettings={ {\n\t\t\t\t\t\tcolors,\n\t\t\t\t\t\tdisableCustomColors: ! areCustomSolidsEnabled,\n\t\t\t\t\t} }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ hasFontFamilyEnabled && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisFontFamilyPlaceholder,\n\t\t\t\t\t\thasFontFamily() && inheritedFontFamily !== undefined\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Font' ) }\n\t\t\t\t\thasValue={ hasFontFamily }\n\t\t\t\t\tonDeselect={ resetFontFamily }\n\t\t\t\t\tisShownByDefault={ defaultControls.fontFamily }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<FontFamilyControl\n\t\t\t\t\t\tfontFamilies={ fontFamilies }\n\t\t\t\t\t\tvalue={ fontFamily }\n\t\t\t\t\t\tonChange={ setFontFamily }\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasFontSizeEnabled && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisFontSizePlaceholder,\n\t\t\t\t\t\thasFontSize() && rawInheritedFontSize !== undefined\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Size' ) }\n\t\t\t\t\thasValue={ hasFontSize }\n\t\t\t\t\thasInlineEndToggle\n\t\t\t\t\tonDeselect={ resetFontSize }\n\t\t\t\t\tisShownByDefault={ defaultControls.fontSize }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<FontSizePicker\n\t\t\t\t\t\tvalue={ currentFontSizeSlug || fontSize }\n\t\t\t\t\t\tvalueMode={ currentFontSizeSlug ? 'slug' : 'literal' }\n\t\t\t\t\t\tonChange={ setFontSizeWithInheritedCommit }\n\t\t\t\t\t\tfontSizes={ mergedFontSizes }\n\t\t\t\t\t\tdisableCustomFontSizes={ disableCustomFontSizes }\n\t\t\t\t\t\twithReset={ false }\n\t\t\t\t\t\twithSlider\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasAppearanceControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisFontAppearancePlaceholder,\n\t\t\t\t\t\thasFontAppearance() &&\n\t\t\t\t\t\t\t( inheritedFontStyle !== undefined ||\n\t\t\t\t\t\t\t\tinheritedFontWeight !== undefined )\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ appearanceControlLabel }\n\t\t\t\t\thasValue={ hasFontAppearance }\n\t\t\t\t\tonDeselect={ resetFontAppearance }\n\t\t\t\t\tisShownByDefault={ defaultControls.fontAppearance }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<FontAppearanceControl\n\t\t\t\t\t\tvalue={ {\n\t\t\t\t\t\t\tfontStyle,\n\t\t\t\t\t\t\tfontWeight,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonChange={ setFontAppearanceWithInheritedCommit }\n\t\t\t\t\t\thasFontStyles={ hasFontStyles }\n\t\t\t\t\t\thasFontWeights={ hasFontWeights }\n\t\t\t\t\t\tfontFamilyFaces={ fontFamilyFaces }\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasLineHeightEnabled && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisLineHeightPlaceholder,\n\t\t\t\t\t\thasLineHeight() && inheritedLineHeight !== undefined,\n\t\t\t\t\t\t'single-column'\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Line height' ) }\n\t\t\t\t\thasValue={ hasLineHeight }\n\t\t\t\t\tonDeselect={ resetLineHeight }\n\t\t\t\t\tisShownByDefault={ defaultControls.lineHeight }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<LineHeightControl\n\t\t\t\t\t\t__unstableInputWidth=\"auto\"\n\t\t\t\t\t\tvalue={ localLineHeight ?? inheritedLineHeight }\n\t\t\t\t\t\tonChange={ setLineHeight }\n\t\t\t\t\t\t// Only override the placeholder when there is an\n\t\t\t\t\t\t// inherited value to surface. Passing `undefined` would\n\t\t\t\t\t\t// clobber `LineHeightControl`'s own `BASE_DEFAULT_VALUE`\n\t\t\t\t\t\t// (1.5) placeholder.\n\t\t\t\t\t\t{ ...( isLineHeightPlaceholder\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tplaceholder:\n\t\t\t\t\t\t\t\t\t\tgetNumericPlaceholder(\n\t\t\t\t\t\t\t\t\t\t\tinheritedLineHeight\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t: {} ) }\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasLetterSpacingControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisLetterSpacingPlaceholder,\n\t\t\t\t\t\thasLetterSpacing() &&\n\t\t\t\t\t\t\tinheritedLetterSpacing !== undefined,\n\t\t\t\t\t\t'single-column'\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Letter spacing' ) }\n\t\t\t\t\thasValue={ hasLetterSpacing }\n\t\t\t\t\tonDeselect={ resetLetterSpacing }\n\t\t\t\t\tisShownByDefault={ defaultControls.letterSpacing }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<LetterSpacingControl\n\t\t\t\t\t\t// Local-then-inherited: render the inherited value as\n\t\t\t\t\t\t// the control's value at rest so the unit parses from\n\t\t\t\t\t\t// it (e.g. \"0.02em\" keeps the em unit rather than the\n\t\t\t\t\t\t// value string sitting behind a default px unit). It is\n\t\t\t\t\t\t// only written to local on user change. Matches the\n\t\t\t\t\t\t// ToggleGroup/FontSize controls rather than the\n\t\t\t\t\t\t// native-placeholder pattern.\n\t\t\t\t\t\tvalue={ localLetterSpacing ?? inheritedLetterSpacing }\n\t\t\t\t\t\tonChange={ setLetterSpacing }\n\t\t\t\t\t\t__unstableInputWidth=\"auto\"\n\t\t\t\t\t\tplaceholder={\n\t\t\t\t\t\t\tisLetterSpacingPlaceholder\n\t\t\t\t\t\t\t\t? getNumericPlaceholder(\n\t\t\t\t\t\t\t\t\t\tinheritedLetterSpacing\n\t\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextIndentControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisTextIndentPlaceholder,\n\t\t\t\t\t\thasTextIndent() && inheritedTextIndent !== undefined\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Line indent' ) }\n\t\t\t\t\thasValue={ hasTextIndent }\n\t\t\t\t\tonDeselect={ resetTextIndent }\n\t\t\t\t\tisShownByDefault={ defaultControls.textIndent }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<TextIndentControl\n\t\t\t\t\t\t// Local-then-inherited: render the inherited value as\n\t\t\t\t\t\t// the control's value at rest so the UnitControl parses\n\t\t\t\t\t\t// and shows the inherited unit (e.g. `1.5em` selects the\n\t\t\t\t\t\t// `em` unit) instead of a raw string in the placeholder\n\t\t\t\t\t\t// while the unit stays at the default `px`. Written to\n\t\t\t\t\t\t// local only on user change.\n\t\t\t\t\t\tvalue={ localTextIndent ?? inheritedTextIndent }\n\t\t\t\t\t\tonChange={ setTextIndentValue }\n\t\t\t\t\t\t__unstableInputWidth=\"auto\"\n\t\t\t\t\t\twithSlider\n\t\t\t\t\t\thasBottomMargin={ isGlobalStyles }\n\t\t\t\t\t\tplaceholder={\n\t\t\t\t\t\t\tisTextIndentPlaceholder\n\t\t\t\t\t\t\t\t? getNumericPlaceholder( inheritedTextIndent )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t\t{ isGlobalStyles && (\n\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\tlabel={ __( 'Indent all paragraphs' ) }\n\t\t\t\t\t\t\tchecked={ isTextIndentAll }\n\t\t\t\t\t\t\tonChange={ onToggleTextIndentAll }\n\t\t\t\t\t\t\thelp={ textIndentHelp }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextColumnsControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisTextColumnsPlaceholder,\n\t\t\t\t\t\thasTextColumns() && inheritedTextColumns !== undefined,\n\t\t\t\t\t\t'single-column'\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Columns' ) }\n\t\t\t\t\thasValue={ hasTextColumns }\n\t\t\t\t\tonDeselect={ resetTextColumns }\n\t\t\t\t\tisShownByDefault={ defaultControls.textColumns }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<NumberControl\n\t\t\t\t\t\tlabel={ __( 'Columns' ) }\n\t\t\t\t\t\tmax={ MAX_TEXT_COLUMNS }\n\t\t\t\t\t\tmin={ MIN_TEXT_COLUMNS }\n\t\t\t\t\t\tonChange={ setTextColumns }\n\t\t\t\t\t\tplaceholder={\n\t\t\t\t\t\t\tisTextColumnsPlaceholder\n\t\t\t\t\t\t\t\t? inheritedTextColumns\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\tspinControls=\"custom\"\n\t\t\t\t\t\tvalue={ localTextColumns }\n\t\t\t\t\t\tinitialPosition={ 1 }\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextDecorationControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisTextDecorationPlaceholder,\n\t\t\t\t\t\thasTextDecoration() &&\n\t\t\t\t\t\t\tinheritedTextDecoration !== undefined,\n\t\t\t\t\t\t'single-column'\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Decoration' ) }\n\t\t\t\t\thasValue={ hasTextDecoration }\n\t\t\t\t\tonDeselect={ resetTextDecoration }\n\t\t\t\t\tisShownByDefault={ defaultControls.textDecoration }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<TextDecorationControl\n\t\t\t\t\t\tvalue={ textDecoration }\n\t\t\t\t\t\tonChange={ setTextDecorationWithInheritedCommit }\n\t\t\t\t\t\t__unstableInputWidth=\"auto\"\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasWritingModeControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisWritingModePlaceholder,\n\t\t\t\t\t\thasWritingMode() && inheritedWritingMode !== undefined,\n\t\t\t\t\t\t'single-column'\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Orientation' ) }\n\t\t\t\t\thasValue={ hasWritingMode }\n\t\t\t\t\tonDeselect={ resetWritingMode }\n\t\t\t\t\tisShownByDefault={ defaultControls.writingMode }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<WritingModeControl\n\t\t\t\t\t\tvalue={ writingMode }\n\t\t\t\t\t\tonChange={ setWritingModeWithInheritedCommit }\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextTransformControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisTextTransformPlaceholder,\n\t\t\t\t\t\thasTextTransform() &&\n\t\t\t\t\t\t\tinheritedTextTransform !== undefined\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Letter case' ) }\n\t\t\t\t\thasValue={ hasTextTransform }\n\t\t\t\t\tonDeselect={ resetTextTransform }\n\t\t\t\t\tisShownByDefault={ defaultControls.textTransform }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<TextTransformControl\n\t\t\t\t\t\tvalue={ textTransform }\n\t\t\t\t\t\tonChange={ setTextTransformWithInheritedCommit }\n\t\t\t\t\t\tshowNone\n\t\t\t\t\t\tisBlock\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasTextAlignmentControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisTextAlignPlaceholder,\n\t\t\t\t\t\thasTextAlign() && inheritedTextAlign !== undefined\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Text alignment' ) }\n\t\t\t\t\thasValue={ hasTextAlign }\n\t\t\t\t\tonDeselect={ resetTextAlign }\n\t\t\t\t\tisShownByDefault={ defaultControls.textAlign }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<TextAlignmentControl\n\t\t\t\t\t\tvalue={ textAlign }\n\t\t\t\t\t\tonChange={ setTextAlignWithInheritedCommit }\n\t\t\t\t\t\toptions={ [ 'left', 'center', 'right', 'justify' ] }\n\t\t\t\t\t/>\n\n\t\t\t\t\t{ textAlign === 'justify' && (\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<Notice status=\"warning\" isDismissible={ false }>\n\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t'Justified text can reduce readability. For better accessibility, use left-aligned text instead.'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</Notice>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n}\n"],
   "mappings": "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",
   "names": []

package/build-module/components/grid/grid-item-movers.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/grid/grid-item-movers.js
+// packages/block-editor/src/components/grid/grid-item-movers.jsx
 import clsx from "clsx";
 import { __, isRTL } from "@wordpress/i18n";
 import { ToolbarButton, ToolbarGroup } from "@wordpress/components";

package/build-module/components/grid/grid-item-movers.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/grid/grid-item-movers.js"],
+  "sources": ["../../../src/components/grid/grid-item-movers.jsx"],
   "sourcesContent": ["import clsx from 'clsx';\nimport { __, isRTL } from '@wordpress/i18n';\nimport { ToolbarButton, ToolbarGroup } from '@wordpress/components';\nimport { VisuallyHidden } from '@wordpress/ui';\nimport {\n\tchevronLeft,\n\tchevronUp,\n\tchevronDown,\n\tchevronRight,\n} from '@wordpress/icons';\nimport { useDispatch } from '@wordpress/data';\nimport { useInstanceId } from '@wordpress/compose';\nimport BlockControls from '../block-controls';\nimport { useGetNumberOfBlocksBeforeCell } from './use-get-number-of-blocks-before-cell';\nimport { store as blockEditorStore } from '../../store';\n\nexport function GridItemMovers( {\n\tlayout,\n\tparentLayout,\n\tonChange,\n\tgridClientId,\n\tblockClientId,\n} ) {\n\tconst { moveBlocksToPosition, __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\n\tconst columnStart = layout?.columnStart ?? 1;\n\tconst rowStart = layout?.rowStart ?? 1;\n\tconst columnSpan = layout?.columnSpan ?? 1;\n\tconst rowSpan = layout?.rowSpan ?? 1;\n\tconst columnEnd = columnStart + columnSpan - 1;\n\tconst rowEnd = rowStart + rowSpan - 1;\n\tconst columnCount = parentLayout?.columnCount;\n\tconst rowCount = parentLayout?.rowCount;\n\n\tconst getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(\n\t\tgridClientId,\n\t\tcolumnCount\n\t);\n\n\treturn (\n\t\t<BlockControls group=\"parent\">\n\t\t\t<ToolbarGroup className=\"block-editor-grid-item-mover__move-button-container\">\n\t\t\t\t<div className=\"block-editor-grid-item-mover__move-horizontal-button-container is-left\">\n\t\t\t\t\t<GridItemMover\n\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\tlabel={ __( 'Move left' ) }\n\t\t\t\t\t\tdescription={ __( 'Move left' ) }\n\t\t\t\t\t\tisDisabled={ columnStart <= 1 }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\tcolumnStart: columnStart - 1,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\t\t\t\t[ blockClientId ],\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgetNumberOfBlocksBeforeCell(\n\t\t\t\t\t\t\t\t\tcolumnStart - 1,\n\t\t\t\t\t\t\t\t\trowStart\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"block-editor-grid-item-mover__move-vertical-button-container\">\n\t\t\t\t\t<GridItemMover\n\t\t\t\t\t\tclassName=\"is-up-button\"\n\t\t\t\t\t\ticon={ chevronUp }\n\t\t\t\t\t\tlabel={ __( 'Move up' ) }\n\t\t\t\t\t\tdescription={ __( 'Move up' ) }\n\t\t\t\t\t\tisDisabled={ rowStart <= 1 }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\trowStart: rowStart - 1,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\t\t\t\t[ blockClientId ],\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgetNumberOfBlocksBeforeCell(\n\t\t\t\t\t\t\t\t\tcolumnStart,\n\t\t\t\t\t\t\t\t\trowStart - 1\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t<GridItemMover\n\t\t\t\t\t\tclassName=\"is-down-button\"\n\t\t\t\t\t\ticon={ chevronDown }\n\t\t\t\t\t\tlabel={ __( 'Move down' ) }\n\t\t\t\t\t\tdescription={ __( 'Move down' ) }\n\t\t\t\t\t\tisDisabled={ rowCount && rowEnd >= rowCount }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\trowStart: rowStart + 1,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\t\t\t\t[ blockClientId ],\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgetNumberOfBlocksBeforeCell(\n\t\t\t\t\t\t\t\t\tcolumnStart,\n\t\t\t\t\t\t\t\t\trowStart + 1\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"block-editor-grid-item-mover__move-horizontal-button-container is-right\">\n\t\t\t\t\t<GridItemMover\n\t\t\t\t\t\ticon={ isRTL() ? chevronLeft : chevronRight }\n\t\t\t\t\t\tlabel={ __( 'Move right' ) }\n\t\t\t\t\t\tdescription={ __( 'Move right' ) }\n\t\t\t\t\t\tisDisabled={ columnCount && columnEnd >= columnCount }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\tcolumnStart: columnStart + 1,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\t\t\t\t[ blockClientId ],\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgridClientId,\n\t\t\t\t\t\t\t\tgetNumberOfBlocksBeforeCell(\n\t\t\t\t\t\t\t\t\tcolumnStart + 1,\n\t\t\t\t\t\t\t\t\trowStart\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</ToolbarGroup>\n\t\t</BlockControls>\n\t);\n}\n\nfunction GridItemMover( {\n\tclassName,\n\ticon,\n\tlabel,\n\tisDisabled,\n\tonClick,\n\tdescription,\n} ) {\n\tconst instanceId = useInstanceId( GridItemMover );\n\tconst descriptionId = `block-editor-grid-item-mover-button__description-${ instanceId }`;\n\treturn (\n\t\t<>\n\t\t\t<ToolbarButton\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'block-editor-grid-item-mover-button',\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t\ticon={ icon }\n\t\t\t\tlabel={ label }\n\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\tonClick={ isDisabled ? null : onClick }\n\t\t\t\tdisabled={ isDisabled }\n\t\t\t\taccessibleWhenDisabled\n\t\t\t/>\n\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t{ description }\n\t\t\t</VisuallyHidden>\n\t\t</>\n\t);\n}\n"],
   "mappings": "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",
   "names": []

package/build-module/components/grid/grid-item-resizer.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/grid/grid-item-resizer.js
+// packages/block-editor/src/components/grid/grid-item-resizer.jsx
 import { ResizableBox } from "@wordpress/components";
 import { useState, useEffect } from "@wordpress/element";
 import { useBlockElement } from "../block-list/use-block-props/use-block-refs.mjs";

package/build-module/components/grid/grid-item-resizer.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/grid/grid-item-resizer.js"],
+  "sources": ["../../../src/components/grid/grid-item-resizer.jsx"],
   "sourcesContent": ["import { ResizableBox } from '@wordpress/components';\nimport { useState, useEffect } from '@wordpress/element';\nimport { useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport BlockPopoverCover from '../block-popover/cover';\nimport { getComputedCSS, getGridTracks, getClosestTrack } from './utils';\n\nexport function GridItemResizer( {\n\tclientId,\n\tbounds,\n\tonChange,\n\tparentLayout,\n} ) {\n\tconst blockElement = useBlockElement( clientId );\n\tconst rootBlockElement = blockElement?.parentElement;\n\tconst { isManualPlacement } = parentLayout;\n\n\tif ( ! blockElement || ! rootBlockElement ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<GridItemResizerInner\n\t\t\tclientId={ clientId }\n\t\t\tbounds={ bounds }\n\t\t\tblockElement={ blockElement }\n\t\t\trootBlockElement={ rootBlockElement }\n\t\t\tonChange={ onChange }\n\t\t\tisManualGrid={\n\t\t\t\tisManualPlacement &&\n\t\t\t\twindow.__experimentalEnableGridInteractivity\n\t\t\t}\n\t\t/>\n\t);\n}\n\nfunction GridItemResizerInner( {\n\tclientId,\n\tbounds,\n\tblockElement,\n\trootBlockElement,\n\tonChange,\n\tisManualGrid,\n} ) {\n\tconst [ resizeDirection, setResizeDirection ] = useState( null );\n\tconst [ enableSide, setEnableSide ] = useState( {\n\t\ttop: false,\n\t\tbottom: false,\n\t\tleft: false,\n\t\tright: false,\n\t} );\n\n\tuseEffect( () => {\n\t\tconst observer = new window.ResizeObserver( () => {\n\t\t\tconst blockClientRect = blockElement.getBoundingClientRect();\n\t\t\tconst rootBlockClientRect =\n\t\t\t\trootBlockElement.getBoundingClientRect();\n\n\t\t\tconst topAvailable = blockClientRect.top > rootBlockClientRect.top;\n\t\t\tconst bottomAvailable =\n\t\t\t\tblockClientRect.bottom < rootBlockClientRect.bottom;\n\t\t\tconst leftAvailable =\n\t\t\t\tblockClientRect.left > rootBlockClientRect.left;\n\t\t\tconst rightAvailable =\n\t\t\t\tblockClientRect.right < rootBlockClientRect.right;\n\n\t\t\tsetEnableSide( {\n\t\t\t\ttop: !! isManualGrid\n\t\t\t\t\t? topAvailable\n\t\t\t\t\t: ! bottomAvailable && topAvailable,\n\t\t\t\tbottom: bottomAvailable,\n\t\t\t\tleft: !! isManualGrid\n\t\t\t\t\t? leftAvailable\n\t\t\t\t\t: ! rightAvailable && leftAvailable,\n\t\t\t\tright: rightAvailable,\n\t\t\t} );\n\t\t} );\n\t\tobserver.observe( blockElement );\n\t\treturn () => observer.disconnect();\n\t}, [ blockElement, rootBlockElement, isManualGrid ] );\n\n\tconst justification = {\n\t\tright: 'left',\n\t\tleft: 'right',\n\t};\n\n\tconst alignment = {\n\t\ttop: 'flex-end',\n\t\tbottom: 'flex-start',\n\t};\n\n\tconst styles = {\n\t\tdisplay: 'flex',\n\t\tjustifyContent: 'center',\n\t\talignItems: 'center',\n\t\t...( justification[ resizeDirection ] && {\n\t\t\tjustifyContent: justification[ resizeDirection ],\n\t\t} ),\n\t\t...( alignment[ resizeDirection ] && {\n\t\t\talignItems: alignment[ resizeDirection ],\n\t\t} ),\n\t};\n\n\treturn (\n\t\t<BlockPopoverCover\n\t\t\tclassName=\"block-editor-grid-item-resizer\"\n\t\t\tclientId={ clientId }\n\t\t\t__unstablePopoverSlot=\"__unstable-block-tools-after\"\n\t\t\tadditionalStyles={ styles }\n\t\t>\n\t\t\t<ResizableBox\n\t\t\t\tclassName=\"block-editor-grid-item-resizer__box\"\n\t\t\t\tsize={ {\n\t\t\t\t\twidth: '100%',\n\t\t\t\t\theight: '100%',\n\t\t\t\t} }\n\t\t\t\tenable={ {\n\t\t\t\t\tbottom: enableSide.bottom,\n\t\t\t\t\tbottomLeft: false,\n\t\t\t\t\tbottomRight: false,\n\t\t\t\t\tleft: enableSide.left,\n\t\t\t\t\tright: enableSide.right,\n\t\t\t\t\ttop: enableSide.top,\n\t\t\t\t\ttopLeft: false,\n\t\t\t\t\ttopRight: false,\n\t\t\t\t} }\n\t\t\t\tbounds={ bounds }\n\t\t\t\tboundsByDirection\n\t\t\t\tonPointerDown={ ( { target, pointerId } ) => {\n\t\t\t\t\t/*\n\t\t\t\t\t * Captures the pointer to avoid hiccups while dragging over objects\n\t\t\t\t\t * like iframes and ensures that the event to end the drag is\n\t\t\t\t\t * captured by the target (resize handle) whether or not it’s under\n\t\t\t\t\t * the pointer.\n\t\t\t\t\t */\n\t\t\t\t\ttarget.setPointerCapture( pointerId );\n\t\t\t\t} }\n\t\t\t\tonResizeStart={ ( event, direction ) => {\n\t\t\t\t\t/*\n\t\t\t\t\t * The container justification and alignment need to be set\n\t\t\t\t\t * according to the direction the resizer is being dragged in,\n\t\t\t\t\t * so that it resizes in the right direction.\n\t\t\t\t\t */\n\t\t\t\t\tsetResizeDirection( direction );\n\t\t\t\t} }\n\t\t\t\tonResizeStop={ ( event, direction, boxElement ) => {\n\t\t\t\t\tconst columnGap = parseFloat(\n\t\t\t\t\t\tgetComputedCSS( rootBlockElement, 'column-gap' )\n\t\t\t\t\t);\n\t\t\t\t\tconst rowGap = parseFloat(\n\t\t\t\t\t\tgetComputedCSS( rootBlockElement, 'row-gap' )\n\t\t\t\t\t);\n\t\t\t\t\tconst gridColumnTracks = getGridTracks(\n\t\t\t\t\t\tgetComputedCSS(\n\t\t\t\t\t\t\trootBlockElement,\n\t\t\t\t\t\t\t'grid-template-columns'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tcolumnGap\n\t\t\t\t\t);\n\t\t\t\t\tconst gridRowTracks = getGridTracks(\n\t\t\t\t\t\tgetComputedCSS(\n\t\t\t\t\t\t\trootBlockElement,\n\t\t\t\t\t\t\t'grid-template-rows'\n\t\t\t\t\t\t),\n\t\t\t\t\t\trowGap\n\t\t\t\t\t);\n\t\t\t\t\tconst rect = new window.DOMRect(\n\t\t\t\t\t\tblockElement.offsetLeft + boxElement.offsetLeft,\n\t\t\t\t\t\tblockElement.offsetTop + boxElement.offsetTop,\n\t\t\t\t\t\tboxElement.offsetWidth,\n\t\t\t\t\t\tboxElement.offsetHeight\n\t\t\t\t\t);\n\t\t\t\t\tconst columnStart =\n\t\t\t\t\t\tgetClosestTrack( gridColumnTracks, rect.left ) + 1;\n\t\t\t\t\tconst rowStart =\n\t\t\t\t\t\tgetClosestTrack( gridRowTracks, rect.top ) + 1;\n\t\t\t\t\tconst columnEnd =\n\t\t\t\t\t\tgetClosestTrack( gridColumnTracks, rect.right, 'end' ) +\n\t\t\t\t\t\t1;\n\t\t\t\t\tconst rowEnd =\n\t\t\t\t\t\tgetClosestTrack( gridRowTracks, rect.bottom, 'end' ) +\n\t\t\t\t\t\t1;\n\t\t\t\t\tonChange( {\n\t\t\t\t\t\tcolumnSpan: columnEnd - columnStart + 1,\n\t\t\t\t\t\trowSpan: rowEnd - rowStart + 1,\n\t\t\t\t\t\tcolumnStart: isManualGrid ? columnStart : undefined,\n\t\t\t\t\t\trowStart: isManualGrid ? rowStart : undefined,\n\t\t\t\t\t} );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</BlockPopoverCover>\n\t);\n}\n"],
   "mappings": "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",
   "names": []

package/build-module/components/grid/grid-visualizer.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/grid/grid-visualizer.js
+// packages/block-editor/src/components/grid/grid-visualizer.jsx
 import clsx from "clsx";
 import { useState, useEffect, forwardRef, useMemo } from "@wordpress/element";
 import { useSelect, useDispatch } from "@wordpress/data";

package/build-module/components/grid/grid-visualizer.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/grid/grid-visualizer.js"],
+  "sources": ["../../../src/components/grid/grid-visualizer.jsx"],
   "sourcesContent": ["import clsx from 'clsx';\nimport { useState, useEffect, forwardRef, useMemo } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { __experimentalUseDropZone as useDropZone } from '@wordpress/compose';\nimport { useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport BlockPopoverCover from '../block-popover/cover';\nimport { range, GridRect, getGridInfo, getGridItemRect } from './utils';\nimport { store as blockEditorStore } from '../../store';\nimport { useGetNumberOfBlocksBeforeCell } from './use-get-number-of-blocks-before-cell';\nimport ButtonBlockAppender from '../button-block-appender';\nimport { unlock } from '../../lock-unlock';\n\nexport function GridVisualizer( {\n\tclientId,\n\tcontentRef,\n\tparentLayout,\n\tchildGridClientId,\n} ) {\n\tconst isDistractionFree = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().isDistractionFree,\n\t\t[]\n\t);\n\tconst gridElement = useBlockElement( clientId );\n\n\tif ( isDistractionFree || ! gridElement ) {\n\t\treturn null;\n\t}\n\n\tconst isManualGrid =\n\t\tparentLayout?.isManualPlacement &&\n\t\twindow.__experimentalEnableGridInteractivity;\n\treturn (\n\t\t<GridVisualizerGrid\n\t\t\tgridClientId={ clientId }\n\t\t\tgridElement={ gridElement }\n\t\t\tisManualGrid={ isManualGrid }\n\t\t\tref={ contentRef }\n\t\t\tchildGridClientId={ childGridClientId }\n\t\t/>\n\t);\n}\n\nconst GridVisualizerGrid = forwardRef(\n\t( { gridClientId, gridElement, isManualGrid, childGridClientId }, ref ) => {\n\t\tconst [ gridInfo, setGridInfo ] = useState( () =>\n\t\t\tgetGridInfo( gridElement )\n\t\t);\n\t\tconst [ isDroppingAllowed, setIsDroppingAllowed ] = useState( false );\n\n\t\t// Get the element for the child grid block so we can\n\t\t// compute its position and hide overlapping visualizer cells.\n\t\tconst childGridElement = useBlockElement( childGridClientId );\n\n\t\t// Compute the child grid block's rect from its position in the grid.\n\t\t// This works for both manual and non-manual grids.\n\t\tconst childGridRect = useMemo( () => {\n\t\t\tif ( ! childGridElement ) {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t\treturn getGridItemRect( childGridElement );\n\t\t}, [ childGridElement ] );\n\n\t\tuseEffect( () => {\n\t\t\tconst resizeCallback = () =>\n\t\t\t\tsetGridInfo( getGridInfo( gridElement ) );\n\t\t\t// Both border-box and content-box are observed as they may change\n\t\t\t// independently. This requires two observers because a single one\n\t\t\t// can’t be made to monitor both on the same element.\n\t\t\tconst borderBoxSpy = new window.ResizeObserver( resizeCallback );\n\t\t\tborderBoxSpy.observe( gridElement, { box: 'border-box' } );\n\t\t\tconst contentBoxSpy = new window.ResizeObserver( resizeCallback );\n\t\t\tcontentBoxSpy.observe( gridElement );\n\t\t\tfor ( const element of gridElement.children ) {\n\t\t\t\tcontentBoxSpy.observe( element );\n\t\t\t}\n\t\t\treturn () => {\n\t\t\t\tborderBoxSpy.disconnect();\n\t\t\t\tcontentBoxSpy.disconnect();\n\t\t\t};\n\t\t}, [ gridElement ] );\n\n\t\tuseEffect( () => {\n\t\t\tfunction onGlobalDrag() {\n\t\t\t\tsetIsDroppingAllowed( true );\n\t\t\t}\n\t\t\tfunction onGlobalDragEnd() {\n\t\t\t\tsetIsDroppingAllowed( false );\n\t\t\t}\n\t\t\tdocument.addEventListener( 'drag', onGlobalDrag );\n\t\t\tdocument.addEventListener( 'dragend', onGlobalDragEnd );\n\t\t\treturn () => {\n\t\t\t\tdocument.removeEventListener( 'drag', onGlobalDrag );\n\t\t\t\tdocument.removeEventListener( 'dragend', onGlobalDragEnd );\n\t\t\t};\n\t\t}, [] );\n\n\t\treturn (\n\t\t\t<BlockPopoverCover\n\t\t\t\tclassName={ clsx( 'block-editor-grid-visualizer', {\n\t\t\t\t\t'is-dropping-allowed': isDroppingAllowed,\n\t\t\t\t} ) }\n\t\t\t\tclientId={ gridClientId }\n\t\t\t\t__unstablePopoverSlot=\"__unstable-block-tools-after\"\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tclassName=\"block-editor-grid-visualizer__grid\"\n\t\t\t\t\tstyle={ gridInfo.style }\n\t\t\t\t>\n\t\t\t\t\t{ isManualGrid ? (\n\t\t\t\t\t\t<ManualGridVisualizer\n\t\t\t\t\t\t\tgridClientId={ gridClientId }\n\t\t\t\t\t\t\tgridInfo={ gridInfo }\n\t\t\t\t\t\t\tchildGridRect={ childGridRect }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<AutoGridVisualizer\n\t\t\t\t\t\t\tgridInfo={ gridInfo }\n\t\t\t\t\t\t\tchildGridRect={ childGridRect }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</BlockPopoverCover>\n\t\t);\n\t}\n);\n\nfunction AutoGridVisualizer( { gridInfo, childGridRect } ) {\n\treturn range( 1, gridInfo.numRows ).map( ( row ) =>\n\t\trange( 1, gridInfo.numColumns ).map( ( column ) => {\n\t\t\t// Don't render visualizer cells for a selected child block\n\t\t\t// that is itself a grid, so that only the child's grid\n\t\t\t// visualizer is visible.\n\t\t\tlet color = gridInfo.currentColor;\n\t\t\tif ( childGridRect?.contains( column, row ) ) {\n\t\t\t\tcolor = 'transparent';\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<GridVisualizerCell\n\t\t\t\t\tkey={ `${ row }-${ column }` }\n\t\t\t\t\tcolor={ color }\n\t\t\t\t/>\n\t\t\t);\n\t\t} )\n\t);\n}\n\nfunction ManualGridVisualizer( { gridClientId, gridInfo, childGridRect } ) {\n\tconst [ highlightedRect, setHighlightedRect ] = useState( null );\n\n\tconst gridItemStyles = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockOrder, getBlockStyles } = unlock(\n\t\t\t\tselect( blockEditorStore )\n\t\t\t);\n\t\t\tconst blockOrder = getBlockOrder( gridClientId );\n\t\t\treturn getBlockStyles( blockOrder );\n\t\t},\n\t\t[ gridClientId ]\n\t);\n\tconst occupiedRects = useMemo( () => {\n\t\tconst rects = [];\n\t\tfor ( const style of Object.values( gridItemStyles ) ) {\n\t\t\tconst {\n\t\t\t\tcolumnStart,\n\t\t\t\trowStart,\n\t\t\t\tcolumnSpan = 1,\n\t\t\t\trowSpan = 1,\n\t\t\t} = style?.layout ?? {};\n\t\t\tif ( ! columnStart || ! rowStart ) {\n\t\t\t\tcontinue;\n\t\t\t}\n\t\t\trects.push(\n\t\t\t\tnew GridRect( {\n\t\t\t\t\tcolumnStart,\n\t\t\t\t\trowStart,\n\t\t\t\t\tcolumnSpan,\n\t\t\t\t\trowSpan,\n\t\t\t\t} )\n\t\t\t);\n\t\t}\n\t\treturn rects;\n\t}, [ gridItemStyles ] );\n\n\treturn range( 1, gridInfo.numRows ).map( ( row ) =>\n\t\trange( 1, gridInfo.numColumns ).map( ( column ) => {\n\t\t\t// Don't render visualizer cells for a selected child block\n\t\t\t// that is itself a grid, so that only the child's grid\n\t\t\t// visualizer is visible.\n\t\t\tconst isChildGridCell = childGridRect?.contains( column, row );\n\t\t\tlet color = gridInfo.currentColor;\n\t\t\tif ( isChildGridCell ) {\n\t\t\t\tcolor = 'transparent';\n\t\t\t}\n\t\t\tconst isCellOccupied = occupiedRects.some( ( rect ) =>\n\t\t\t\trect.contains( column, row )\n\t\t\t);\n\t\t\tconst isHighlighted =\n\t\t\t\thighlightedRect?.contains( column, row ) ?? false;\n\t\t\treturn (\n\t\t\t\t<GridVisualizerCell\n\t\t\t\t\tkey={ `${ row }-${ column }` }\n\t\t\t\t\tcolor={ color }\n\t\t\t\t\tclassName={ isHighlighted && 'is-highlighted' }\n\t\t\t\t>\n\t\t\t\t\t{ isCellOccupied && ! isChildGridCell ? (\n\t\t\t\t\t\t<GridVisualizerDropZone\n\t\t\t\t\t\t\tcolumn={ column }\n\t\t\t\t\t\t\trow={ row }\n\t\t\t\t\t\t\tgridClientId={ gridClientId }\n\t\t\t\t\t\t\tgridInfo={ gridInfo }\n\t\t\t\t\t\t\tsetHighlightedRect={ setHighlightedRect }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<GridVisualizerAppender\n\t\t\t\t\t\t\tcolumn={ column }\n\t\t\t\t\t\t\trow={ row }\n\t\t\t\t\t\t\tgridClientId={ gridClientId }\n\t\t\t\t\t\t\tgridInfo={ gridInfo }\n\t\t\t\t\t\t\tsetHighlightedRect={ setHighlightedRect }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</GridVisualizerCell>\n\t\t\t);\n\t\t} )\n\t);\n}\n\nfunction GridVisualizerCell( { color, children, className } ) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-grid-visualizer__cell',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tstyle={ {\n\t\t\t\tboxShadow: `inset 0 0 0 1px color-mix(in srgb, ${ color } 20%, #0000)`,\n\t\t\t\tcolor,\n\t\t\t} }\n\t\t>\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\nfunction useGridVisualizerDropZone(\n\tcolumn,\n\trow,\n\tgridClientId,\n\tgridInfo,\n\tsetHighlightedRect\n) {\n\tconst {\n\t\tgetBlockAttributes,\n\t\tgetBlockRootClientId,\n\t\tcanInsertBlockType,\n\t\tgetBlockName,\n\t} = useSelect( blockEditorStore );\n\tconst {\n\t\tupdateBlockAttributes,\n\t\tmoveBlocksToPosition,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t} = useDispatch( blockEditorStore );\n\n\tconst getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(\n\t\tgridClientId,\n\t\tgridInfo.numColumns\n\t);\n\n\treturn useDropZoneWithValidation( {\n\t\tvalidateDrag( srcClientId ) {\n\t\t\tconst blockName = getBlockName( srcClientId );\n\t\t\tif ( ! canInsertBlockType( blockName, gridClientId ) ) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\tconst attributes = getBlockAttributes( srcClientId );\n\t\t\tconst rect = new GridRect( {\n\t\t\t\tcolumnStart: column,\n\t\t\t\trowStart: row,\n\t\t\t\tcolumnSpan: attributes.style?.layout?.columnSpan,\n\t\t\t\trowSpan: attributes.style?.layout?.rowSpan,\n\t\t\t} );\n\t\t\tconst isInBounds = new GridRect( {\n\t\t\t\tcolumnSpan: gridInfo.numColumns,\n\t\t\t\trowSpan: gridInfo.numRows,\n\t\t\t} ).containsRect( rect );\n\t\t\treturn isInBounds;\n\t\t},\n\t\tonDragEnter( srcClientId ) {\n\t\t\tconst attributes = getBlockAttributes( srcClientId );\n\t\t\tsetHighlightedRect(\n\t\t\t\tnew GridRect( {\n\t\t\t\t\tcolumnStart: column,\n\t\t\t\t\trowStart: row,\n\t\t\t\t\tcolumnSpan: attributes.style?.layout?.columnSpan,\n\t\t\t\t\trowSpan: attributes.style?.layout?.rowSpan,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\tonDragLeave() {\n\t\t\t// onDragEnter can be called before onDragLeave if the user moves\n\t\t\t// their mouse quickly, so only clear the highlight if it was set\n\t\t\t// by this cell.\n\t\t\tsetHighlightedRect( ( prevHighlightedRect ) =>\n\t\t\t\tprevHighlightedRect?.columnStart === column &&\n\t\t\t\tprevHighlightedRect?.rowStart === row\n\t\t\t\t\t? null\n\t\t\t\t\t: prevHighlightedRect\n\t\t\t);\n\t\t},\n\t\tonDrop( srcClientId ) {\n\t\t\tsetHighlightedRect( null );\n\t\t\tconst attributes = getBlockAttributes( srcClientId );\n\t\t\tupdateBlockAttributes( srcClientId, {\n\t\t\t\tstyle: {\n\t\t\t\t\t...attributes.style,\n\t\t\t\t\tlayout: {\n\t\t\t\t\t\t...attributes.style?.layout,\n\t\t\t\t\t\tcolumnStart: column,\n\t\t\t\t\t\trowStart: row,\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t} );\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tmoveBlocksToPosition(\n\t\t\t\t[ srcClientId ],\n\t\t\t\tgetBlockRootClientId( srcClientId ),\n\t\t\t\tgridClientId,\n\t\t\t\tgetNumberOfBlocksBeforeCell( column, row )\n\t\t\t);\n\t\t},\n\t} );\n}\n\nfunction GridVisualizerDropZone( {\n\tcolumn,\n\trow,\n\tgridClientId,\n\tgridInfo,\n\tsetHighlightedRect,\n} ) {\n\treturn (\n\t\t<div\n\t\t\tclassName=\"block-editor-grid-visualizer__drop-zone\"\n\t\t\tref={ useGridVisualizerDropZone(\n\t\t\t\tcolumn,\n\t\t\t\trow,\n\t\t\t\tgridClientId,\n\t\t\t\tgridInfo,\n\t\t\t\tsetHighlightedRect\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction GridVisualizerAppender( {\n\tcolumn,\n\trow,\n\tgridClientId,\n\tgridInfo,\n\tsetHighlightedRect,\n} ) {\n\tconst {\n\t\tupdateBlockAttributes,\n\t\tmoveBlocksToPosition,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t} = useDispatch( blockEditorStore );\n\n\tconst getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(\n\t\tgridClientId,\n\t\tgridInfo.numColumns\n\t);\n\n\treturn (\n\t\t<ButtonBlockAppender\n\t\t\trootClientId={ gridClientId }\n\t\t\tclassName=\"block-editor-grid-visualizer__appender\"\n\t\t\tref={ useGridVisualizerDropZone(\n\t\t\t\tcolumn,\n\t\t\t\trow,\n\t\t\t\tgridClientId,\n\t\t\t\tgridInfo,\n\t\t\t\tsetHighlightedRect\n\t\t\t) }\n\t\t\tstyle={ {\n\t\t\t\tcolor: gridInfo.currentColor,\n\t\t\t} }\n\t\t\tonSelect={ ( block ) => {\n\t\t\t\tif ( ! block ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tupdateBlockAttributes( block.clientId, {\n\t\t\t\t\tstyle: {\n\t\t\t\t\t\tlayout: {\n\t\t\t\t\t\t\tcolumnStart: column,\n\t\t\t\t\t\t\trowStart: row,\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t} );\n\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\t[ block.clientId ],\n\t\t\t\t\tgridClientId,\n\t\t\t\t\tgridClientId,\n\t\t\t\t\tgetNumberOfBlocksBeforeCell( column, row )\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nfunction useDropZoneWithValidation( {\n\tvalidateDrag,\n\tonDragEnter,\n\tonDragLeave,\n\tonDrop,\n} ) {\n\tconst { getDraggedBlockClientIds } = useSelect( blockEditorStore );\n\treturn useDropZone( {\n\t\tonDragEnter() {\n\t\t\tconst [ srcClientId ] = getDraggedBlockClientIds();\n\t\t\tif ( srcClientId && validateDrag( srcClientId ) ) {\n\t\t\t\tonDragEnter( srcClientId );\n\t\t\t}\n\t\t},\n\t\tonDragLeave() {\n\t\t\tonDragLeave();\n\t\t},\n\t\tonDrop() {\n\t\t\tconst [ srcClientId ] = getDraggedBlockClientIds();\n\t\t\tif ( srcClientId && validateDrag( srcClientId ) ) {\n\t\t\t\tonDrop( srcClientId );\n\t\t\t}\n\t\t},\n\t} );\n}\n"],
   "mappings": "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",
   "names": []

package/build-module/components/height-control/index.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/height-control/index.js
+// packages/block-editor/src/components/height-control/index.jsx
 import { useMemo } from "@wordpress/element";
 import {
   BaseControl,

package/build-module/components/height-control/index.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/height-control/index.js"],
+  "sources": ["../../../src/components/height-control/index.jsx"],
   "sourcesContent": ["import { useMemo } from '@wordpress/element';\nimport {\n\tBaseControl,\n\tRangeControl,\n\tFlex,\n\tFlexItem,\n\t__experimentalSpacer as Spacer,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport deprecated from '@wordpress/deprecated';\nimport { useSettings } from '../use-settings';\n\nconst RANGE_CONTROL_CUSTOM_SETTINGS = {\n\tpx: { max: 1000, step: 1 },\n\t'%': { max: 100, step: 1 },\n\tvw: { max: 100, step: 1 },\n\tvh: { max: 100, step: 1 },\n\tem: { max: 50, step: 0.1 },\n\trem: { max: 50, step: 0.1 },\n\tsvw: { max: 100, step: 1 },\n\tlvw: { max: 100, step: 1 },\n\tdvw: { max: 100, step: 1 },\n\tsvh: { max: 100, step: 1 },\n\tlvh: { max: 100, step: 1 },\n\tdvh: { max: 100, step: 1 },\n\tvi: { max: 100, step: 1 },\n\tsvi: { max: 100, step: 1 },\n\tlvi: { max: 100, step: 1 },\n\tdvi: { max: 100, step: 1 },\n\tvb: { max: 100, step: 1 },\n\tsvb: { max: 100, step: 1 },\n\tlvb: { max: 100, step: 1 },\n\tdvb: { max: 100, step: 1 },\n\tvmin: { max: 100, step: 1 },\n\tsvmin: { max: 100, step: 1 },\n\tlvmin: { max: 100, step: 1 },\n\tdvmin: { max: 100, step: 1 },\n\tvmax: { max: 100, step: 1 },\n\tsvmax: { max: 100, step: 1 },\n\tlvmax: { max: 100, step: 1 },\n\tdvmax: { max: 100, step: 1 },\n};\n\n/**\n * HeightControl renders a linked unit control and range control for adjusting the height of a block.\n *\n * @deprecated Use DimensionControl instead.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/height-control/README.md\n *\n * @param {Object}                     props\n * @param {?string}                    props.label    A label for the control.\n * @param {( value: string ) => void } props.onChange Called when the height changes.\n * @param {string}                     props.value    The current height value.\n *\n * @return {Component} The component to be rendered.\n */\nexport default function HeightControl( {\n\tlabel = __( 'Height' ),\n\tonChange,\n\tvalue,\n} ) {\n\tdeprecated( 'wp.blockEditor.HeightControl', {\n\t\tsince: '7.0',\n\t\tversion: '7.2',\n\t\talternative: 'wp.blockEditor.DimensionControl',\n\t} );\n\tconst customRangeValue = parseFloat( value );\n\n\tconst [ availableUnits ] = useSettings( 'spacing.units' );\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: availableUnits || [\n\t\t\t'%',\n\t\t\t'px',\n\t\t\t'em',\n\t\t\t'rem',\n\t\t\t'vh',\n\t\t\t'vw',\n\t\t],\n\t} );\n\n\tconst selectedUnit =\n\t\tuseMemo(\n\t\t\t() => parseQuantityAndUnitFromRawValue( value ),\n\t\t\t[ value ]\n\t\t)[ 1 ] ||\n\t\tunits[ 0 ]?.value ||\n\t\t'px';\n\n\tconst handleSliderChange = ( next ) => {\n\t\tonChange( [ next, selectedUnit ].join( '' ) );\n\t};\n\n\tconst handleUnitChange = ( newUnit ) => {\n\t\t// Attempt to smooth over differences between currentUnit and newUnit.\n\t\t// This should slightly improve the experience of switching between unit types.\n\t\tconst [ currentValue, currentUnit ] =\n\t\t\tparseQuantityAndUnitFromRawValue( value );\n\n\t\tif ( [ 'em', 'rem' ].includes( newUnit ) && currentUnit === 'px' ) {\n\t\t\t// Convert pixel value to an approximate of the new unit, assuming a root size of 16px.\n\t\t\tonChange( ( currentValue / 16 ).toFixed( 2 ) + newUnit );\n\t\t} else if (\n\t\t\t[ 'em', 'rem' ].includes( currentUnit ) &&\n\t\t\tnewUnit === 'px'\n\t\t) {\n\t\t\t// Convert to pixel value assuming a root size of 16px.\n\t\t\tonChange( Math.round( currentValue * 16 ) + newUnit );\n\t\t} else if (\n\t\t\t[\n\t\t\t\t'%',\n\t\t\t\t'vw',\n\t\t\t\t'svw',\n\t\t\t\t'lvw',\n\t\t\t\t'dvw',\n\t\t\t\t'vh',\n\t\t\t\t'svh',\n\t\t\t\t'lvh',\n\t\t\t\t'dvh',\n\t\t\t\t'vi',\n\t\t\t\t'svi',\n\t\t\t\t'lvi',\n\t\t\t\t'dvi',\n\t\t\t\t'vb',\n\t\t\t\t'svb',\n\t\t\t\t'lvb',\n\t\t\t\t'dvb',\n\t\t\t\t'vmin',\n\t\t\t\t'svmin',\n\t\t\t\t'lvmin',\n\t\t\t\t'dvmin',\n\t\t\t\t'vmax',\n\t\t\t\t'svmax',\n\t\t\t\t'lvmax',\n\t\t\t\t'dvmax',\n\t\t\t].includes( newUnit ) &&\n\t\t\tcurrentValue > 100\n\t\t) {\n\t\t\t// When converting to `%` or viewport-relative units, cap the new value at 100.\n\t\t\tonChange( 100 + newUnit );\n\t\t}\n\t};\n\n\treturn (\n\t\t<fieldset className=\"block-editor-height-control\">\n\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t{ label }\n\t\t\t</BaseControl.VisualLabel>\n\t\t\t<Flex>\n\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t<UnitControl\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\tonUnitChange={ handleUnitChange }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t/>\n\t\t\t\t</FlexItem>\n\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t<Spacer marginX={ 2 } marginBottom={ 0 }>\n\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\tvalue={ customRangeValue }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={\n\t\t\t\t\t\t\t\tRANGE_CONTROL_CUSTOM_SETTINGS[ selectedUnit ]\n\t\t\t\t\t\t\t\t\t?.max ?? 100\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tstep={\n\t\t\t\t\t\t\t\tRANGE_CONTROL_CUSTOM_SETTINGS[ selectedUnit ]\n\t\t\t\t\t\t\t\t\t?.step ?? 0.1\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t\tonChange={ handleSliderChange }\n\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Spacer>\n\t\t\t\t</FlexItem>\n\t\t\t</Flex>\n\t\t</fieldset>\n\t);\n}\n"],
   "mappings": "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",
   "names": []

package/build-module/components/html-element-control/index.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/html-element-control/index.js
+// packages/block-editor/src/components/html-element-control/index.jsx
 import { __, sprintf } from "@wordpress/i18n";
 import {
   SelectControl,

package/build-module/components/html-element-control/index.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/html-element-control/index.js"],
+  "sources": ["../../../src/components/html-element-control/index.jsx"],
   "sourcesContent": ["import { __, sprintf } from '@wordpress/i18n';\nimport {\n\tSelectControl,\n\tNotice,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { store as blockEditorStore } from '../../store';\nimport { htmlElementMessages } from './messages';\n\n/**\n * Renders a SelectControl for choosing HTML elements with validation\n * to prevent duplicate <main> elements.\n *\n * @param {Object}   props          Component props.\n * @param {string}   props.tagName  The current HTML tag name.\n * @param {Function} props.onChange Function to call when the tag is changed.\n * @param {string}   props.clientId Optional. The client ID of the block. Used to check for existing <main> elements.\n * @param {Array}    props.options  SelectControl options (optional).\n *\n * @return {Component} The HTML element select control with validation.\n */\nexport default function HTMLElementControl( {\n\ttagName,\n\tonChange,\n\tclientId,\n\toptions = [\n\t\t{ label: __( 'Default (<div>)' ), value: 'div' },\n\t\t{ label: '<header>', value: 'header' },\n\t\t{ label: '<main>', value: 'main' },\n\t\t{ label: '<section>', value: 'section' },\n\t\t{ label: '<article>', value: 'article' },\n\t\t{ label: '<aside>', value: 'aside' },\n\t\t{ label: '<footer>', value: 'footer' },\n\t],\n} ) {\n\tconst checkForMainTag =\n\t\t!! clientId && options.some( ( option ) => option.value === 'main' );\n\n\tconst hasMainElementElsewhere = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! checkForMainTag ) {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\tconst { getClientIdsWithDescendants, getBlockAttributes } =\n\t\t\t\tselect( blockEditorStore );\n\n\t\t\treturn getClientIdsWithDescendants().some( ( id ) => {\n\t\t\t\t// Skip the current block.\n\t\t\t\tif ( id === clientId ) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\treturn getBlockAttributes( id )?.tagName === 'main';\n\t\t\t} );\n\t\t},\n\t\t[ clientId, checkForMainTag ]\n\t);\n\n\t// Create a modified options array that disables the main option if needed.\n\tconst modifiedOptions = options.map( ( option ) => {\n\t\tif (\n\t\t\toption.value === 'main' &&\n\t\t\thasMainElementElsewhere &&\n\t\t\ttagName !== 'main'\n\t\t) {\n\t\t\treturn {\n\t\t\t\t...option,\n\t\t\t\tdisabled: true,\n\t\t\t\tlabel: sprintf(\n\t\t\t\t\t/* translators: %s: HTML element name */\n\t\t\t\t\t__( '%s (Already in use)' ),\n\t\t\t\t\toption.label\n\t\t\t\t),\n\t\t\t};\n\t\t}\n\t\treturn option;\n\t} );\n\n\treturn (\n\t\t<VStack spacing={ 2 } className=\"block-editor-html-element-control\">\n\t\t\t<SelectControl\n\t\t\t\tlabel={ __( 'HTML element' ) }\n\t\t\t\toptions={ modifiedOptions }\n\t\t\t\tvalue={ tagName }\n\t\t\t\tonChange={ onChange }\n\t\t\t\thelp={ htmlElementMessages[ tagName ] }\n\t\t\t/>\n\n\t\t\t{ tagName === 'main' && hasMainElementElsewhere && (\n\t\t\t\t<Notice status=\"warning\" isDismissible={ false }>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Multiple <main> elements detected. The duplicate may be in your content or template. This is not valid HTML and may cause accessibility issues. Please change this HTML element.'\n\t\t\t\t\t) }\n\t\t\t\t</Notice>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n"],
   "mappings": ";AAAA,SAAS,IAAI,eAAe;AAC5B;AAAA,EACC;AAAA,EACA;AAAA,EACA,wBAAwB;AAAA,OAClB;AACP,SAAS,iBAAiB;AAC1B,SAAS,SAAS,wBAAwB;AAC1C,SAAS,2BAA2B;AAyElC,SACC,KADD;AA3Da,SAAR,mBAAqC;AAAA,EAC3C;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,IACT,EAAE,OAAO,GAAI,iBAAkB,GAAG,OAAO,MAAM;AAAA,IAC/C,EAAE,OAAO,YAAY,OAAO,SAAS;AAAA,IACrC,EAAE,OAAO,UAAU,OAAO,OAAO;AAAA,IACjC,EAAE,OAAO,aAAa,OAAO,UAAU;AAAA,IACvC,EAAE,OAAO,aAAa,OAAO,UAAU;AAAA,IACvC,EAAE,OAAO,WAAW,OAAO,QAAQ;AAAA,IACnC,EAAE,OAAO,YAAY,OAAO,SAAS;AAAA,EACtC;AACD,GAAI;AACH,QAAM,kBACL,CAAC,CAAE,YAAY,QAAQ,KAAM,CAAE,WAAY,OAAO,UAAU,MAAO;AAEpE,QAAM,0BAA0B;AAAA,IAC/B,CAAE,WAAY;AACb,UAAK,CAAE,iBAAkB;AACxB,eAAO;AAAA,MACR;AAEA,YAAM,EAAE,6BAA6B,mBAAmB,IACvD,OAAQ,gBAAiB;AAE1B,aAAO,4BAA4B,EAAE,KAAM,CAAE,OAAQ;AAEpD,YAAK,OAAO,UAAW;AACtB,iBAAO;AAAA,QACR;AAEA,eAAO,mBAAoB,EAAG,GAAG,YAAY;AAAA,MAC9C,CAAE;AAAA,IACH;AAAA,IACA,CAAE,UAAU,eAAgB;AAAA,EAC7B;AAGA,QAAM,kBAAkB,QAAQ,IAAK,CAAE,WAAY;AAClD,QACC,OAAO,UAAU,UACjB,2BACA,YAAY,QACX;AACD,aAAO;AAAA,QACN,GAAG;AAAA,QACH,UAAU;AAAA,QACV,OAAO;AAAA;AAAA,UAEN,GAAI,qBAAsB;AAAA,UAC1B,OAAO;AAAA,QACR;AAAA,MACD;AAAA,IACD;AACA,WAAO;AAAA,EACR,CAAE;AAEF,SACC,qBAAC,UAAO,SAAU,GAAI,WAAU,qCAC/B;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,GAAI,cAAe;AAAA,QAC3B,SAAU;AAAA,QACV,OAAQ;AAAA,QACR;AAAA,QACA,MAAO,oBAAqB,OAAQ;AAAA;AAAA,IACrC;AAAA,IAEE,YAAY,UAAU,2BACvB,oBAAC,UAAO,QAAO,WAAU,eAAgB,OACtC;AAAA,MACD;AAAA,IACD,GACD;AAAA,KAEF;AAEF;",
   "names": []

package/build-module/components/iframe/index.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/iframe/index.js
+// packages/block-editor/src/components/iframe/index.jsx
 import clsx from "clsx";
 import { version as reactVersion } from "react";
 import { useState, createPortal, forwardRef } from "@wordpress/element";

package/build-module/components/iframe/index.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/iframe/index.js"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport { version as reactVersion } from 'react';\nimport { useState, createPortal, forwardRef } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { useMergeRefs, useRefEffect, useDisabled } from '@wordpress/compose';\nimport { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { useWritingFlow } from '../writing-flow';\nimport { getCompatibilityStyles } from './get-compatibility-styles';\nimport { useScaleCanvas } from './use-scale-canvas';\nimport { store as blockEditorStore } from '../../store';\n\nfunction bubbleEvent( event, Constructor, frame ) {\n\tconst init = {};\n\n\tfor ( const key in event ) {\n\t\tinit[ key ] = event[ key ];\n\t}\n\n\t// Check if the event is a MouseEvent generated within the iframe.\n\t// If so, adjust the coordinates to be relative to the position of\n\t// the iframe. This ensures that components such as Draggable\n\t// receive coordinates relative to the window, instead of relative\n\t// to the iframe. Without this, the Draggable event handler would\n\t// result in components \"jumping\" position as soon as the user\n\t// drags over the iframe.\n\tif ( event instanceof frame.contentDocument.defaultView.MouseEvent ) {\n\t\tconst rect = frame.getBoundingClientRect();\n\t\tinit.clientX += rect.left;\n\t\tinit.clientY += rect.top;\n\t}\n\n\tconst newEvent = new Constructor( event.type, init );\n\tif ( init.defaultPrevented ) {\n\t\tnewEvent.preventDefault();\n\t}\n\tconst cancelled = ! frame.dispatchEvent( newEvent );\n\n\tif ( cancelled ) {\n\t\tevent.preventDefault();\n\t}\n}\n\n/**\n * Bubbles some event types (keydown, keypress, and dragover) to parent document\n * document to ensure that the keyboard shortcuts and drag and drop work.\n *\n * Ideally, we should remove event bubbling in the future. Keyboard shortcuts\n * should be context dependent, e.g. actions on blocks like Cmd+A should not\n * work globally outside the block editor.\n *\n * @param {Document} iframeDocument Document to attach listeners to.\n */\nfunction useBubbleEvents( iframeDocument ) {\n\treturn useRefEffect( () => {\n\t\tconst { defaultView } = iframeDocument;\n\t\tif ( ! defaultView ) {\n\t\t\treturn;\n\t\t}\n\t\tconst { frameElement } = defaultView;\n\t\tconst html = iframeDocument.documentElement;\n\t\tconst eventTypes = [ 'dragover', 'mousemove' ];\n\t\tconst handlers = {};\n\t\tfor ( const name of eventTypes ) {\n\t\t\thandlers[ name ] = ( event ) => {\n\t\t\t\tconst prototype = Object.getPrototypeOf( event );\n\t\t\t\tconst constructorName = prototype.constructor.name;\n\t\t\t\tconst Constructor = window[ constructorName ];\n\t\t\t\tbubbleEvent( event, Constructor, frameElement );\n\t\t\t};\n\t\t\thtml.addEventListener( name, handlers[ name ] );\n\t\t}\n\n\t\treturn () => {\n\t\t\tfor ( const name of eventTypes ) {\n\t\t\t\thtml.removeEventListener( name, handlers[ name ] );\n\t\t\t}\n\t\t};\n\t} );\n}\n\nconst iframeSrcCache = new WeakMap();\nconst iframeSrcCleanup = globalThis.FinalizationRegistry\n\t? new globalThis.FinalizationRegistry( ( url ) =>\n\t\t\tURL.revokeObjectURL( url )\n\t  )\n\t: undefined;\n\nfunction getIframeSrc( resolvedAssets ) {\n\tlet src = iframeSrcCache.get( resolvedAssets );\n\tif ( src ) {\n\t\treturn src;\n\t}\n\n\tlet body = '';\n\tif ( reactVersion.split( '.' )[ 0 ] === '18' ) {\n\t\tbody =\n\t\t\t'<body><script>document.currentScript.parentElement.remove()</script></body>';\n\t}\n\n\t// Correct doctype is required to enable rendering in standards mode.\n\t// Also preload the styles to avoid a flash of unstyled content.\n\tconst html = `<!doctype html>\n<html>\n\t<head>\n\t\t<meta charset=\"utf-8\">\n\t\t<base href=\"${ window.location.href }\">\n\t\t<style>\n\t\t\thtml{\n\t\t\t\theight: auto !important;\n\t\t\t\tmin-height: 100%;\n\t\t\t}\n\t\t\t/* Lowest specificity to not override global styles */\n\t\t\t:where(body) {\n\t\t\t\tmargin: 0;\n\t\t\t\t/* Default background color in case zoom out mode background\n\t\t\t\tcolors the html element */\n\t\t\t\tbackground-color: white;\n\t\t\t}\n\t\t</style>\n\t\t${ resolvedAssets.styles ?? '' }\n\t\t${ resolvedAssets.scripts ?? '' }\n\t</head>\n\t${ body }\n</html>`;\n\n\tsrc = URL.createObjectURL( new Blob( [ html ], { type: 'text/html' } ) );\n\tiframeSrcCache.set( resolvedAssets, src );\n\tiframeSrcCleanup?.register( resolvedAssets, src );\n\treturn src;\n}\n\nfunction Iframe( {\n\tcontentRef,\n\tchildren,\n\ttabIndex = 0,\n\tscale = 1,\n\tframeSize = 0,\n\treadonly,\n\tforwardedRef: ref,\n\ttitle = __( 'Editor canvas' ),\n\t...props\n} ) {\n\tconst { resolvedAssets, isPreviewMode } = useSelect( ( select ) => {\n\t\tconst settings = select( blockEditorStore ).getSettings();\n\t\treturn {\n\t\t\tresolvedAssets: settings.__unstableResolvedAssets,\n\t\t\tisPreviewMode: settings.isPreviewMode,\n\t\t};\n\t}, [] );\n\t/** @type {[Document, React.Dispatch<Document>]} */\n\tconst [ iframeDocument, setIframeDocument ] = useState();\n\tconst [ bodyClasses, setBodyClasses ] = useState( [] );\n\tconst [ before, writingFlowRef, after ] = useWritingFlow();\n\n\tconst setRef = useRefEffect( ( node ) => {\n\t\tlet iFrameDocument;\n\t\t// Prevent the default browser action for files dropped outside of dropzones.\n\t\tfunction preventFileDropDefault( event ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t\t// Prevent clicks on link fragments from navigating away. Note that links\n\t\t// inside `contenteditable` are already disabled by the browser, so\n\t\t// this is for links in blocks outside of `contenteditable`.\n\t\tfunction interceptLinkClicks( event ) {\n\t\t\tif (\n\t\t\t\tevent.target.tagName === 'A' &&\n\t\t\t\tevent.target.getAttribute( 'href' )?.startsWith( '#' )\n\t\t\t) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\t// Manually handle link fragment navigation within the iframe. The iframe's\n\t\t\t\t// location is a blob URL, which can't be used to resolve relative links like\n\t\t\t\t// `#hash`. The relative link would be resolved against the iframe's base URL\n\t\t\t\t// or the parent frame's URL, causing the iframe to navigate to a completely\n\t\t\t\t// different page. Setting the `location.hash` works because it really sets the\n\t\t\t\t// blob URL's hash.\n\t\t\t\t//\n\t\t\t\t// Links with fragments are used for example with footnotes. Clicking on these\n\t\t\t\t// links will scroll smoothly to the anchors in the editor canvas.\n\t\t\t\tiFrameDocument.defaultView.location.hash = event.target\n\t\t\t\t\t.getAttribute( 'href' )\n\t\t\t\t\t.slice( 1 );\n\t\t\t}\n\t\t}\n\n\t\tconst { ownerDocument } = node;\n\n\t\t// Ideally ALL classes that are added through get_body_class should\n\t\t// be added in the editor too, which we'll somehow have to get from\n\t\t// the server in the future (which will run the PHP filters).\n\t\tsetBodyClasses(\n\t\t\tArray.from( ownerDocument.body.classList ).filter(\n\t\t\t\t( name ) =>\n\t\t\t\t\tname.startsWith( 'admin-color-' ) ||\n\t\t\t\t\tname.startsWith( 'post-type-' ) ||\n\t\t\t\t\tname === 'wp-embed-responsive'\n\t\t\t)\n\t\t);\n\n\t\tfunction onLoad() {\n\t\t\tconst { contentDocument } = node;\n\t\t\tconst { documentElement } = contentDocument;\n\t\t\tiFrameDocument = contentDocument;\n\t\t\tsetIframeDocument( contentDocument );\n\n\t\t\tdocumentElement.classList.add( 'block-editor-iframe__html' );\n\n\t\t\tcontentDocument.dir = ownerDocument.dir;\n\n\t\t\tfor ( const compatStyle of getCompatibilityStyles() ) {\n\t\t\t\tif ( contentDocument.getElementById( compatStyle.id ) ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tcontentDocument.head.appendChild(\n\t\t\t\t\tcompatStyle.cloneNode( true )\n\t\t\t\t);\n\n\t\t\t\tif ( ! isPreviewMode ) {\n\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t`${ compatStyle.id } was added to the iframe incorrectly. Please use block.json or enqueue_block_assets to add styles to the iframe.`,\n\t\t\t\t\t\tcompatStyle\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tiFrameDocument.addEventListener( 'click', interceptLinkClicks );\n\t\t}\n\n\t\tnode.addEventListener( 'load', onLoad );\n\n\t\treturn () => {\n\t\t\tsetIframeDocument( undefined );\n\t\t\tnode.removeEventListener( 'load', onLoad );\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t\tiFrameDocument?.removeEventListener( 'click', interceptLinkClicks );\n\t\t};\n\t}, [] );\n\n\tconst {\n\t\tcontentRef: scaleContentRef,\n\t\tcontainerRef,\n\t\tisZoomedOut,\n\t\tscaleContainerWidth,\n\t} = useScaleCanvas( {\n\t\tscale,\n\t\tframeSize: parseInt( frameSize ),\n\t\tiframeDocument,\n\t} );\n\n\tconst disabledRef = useDisabled( { isDisabled: ! readonly } );\n\n\tconst unguardedBodyRef = useMergeRefs( [\n\t\tuseBubbleEvents( iframeDocument ),\n\t\tcontentRef,\n\t\twritingFlowRef,\n\t\tdisabledRef,\n\t\tscaleContentRef,\n\t] );\n\n\t// Attach the body ref only when the iframe document and window are available.\n\t// When an iframe element is moved in the DOM, like when reordering a list,\n\t// its `window` object is destroyed and recreated, and the `defaultView` field is\n\t// briefly `null`. We need to guard for such calls of the ref callbacks.\n\tconst bodyRef = useRefEffect(\n\t\t( node ) => {\n\t\t\tif ( node.ownerDocument.defaultView ) {\n\t\t\t\tunguardedBodyRef( node );\n\t\t\t\treturn () => unguardedBodyRef( null );\n\t\t\t}\n\t\t\treturn () => {};\n\t\t},\n\t\t[ unguardedBodyRef ]\n\t);\n\n\tconst src = getIframeSrc( resolvedAssets );\n\n\t// Make sure to not render the before and after focusable div elements in view\n\t// mode. They're only needed to capture focus in edit mode.\n\tconst shouldRenderFocusCaptureElements = tabIndex >= 0 && ! isPreviewMode;\n\n\tconst iframe = (\n\t\t<>\n\t\t\t{ shouldRenderFocusCaptureElements && before }\n\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<iframe\n\t\t\t\t{ ...props }\n\t\t\t\tstyle={ {\n\t\t\t\t\t...props.style,\n\t\t\t\t\theight: props.style?.height,\n\t\t\t\t\tborder: 0,\n\t\t\t\t} }\n\t\t\t\tref={ useMergeRefs( [ ref, setRef ] ) }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\tsrc={ src }\n\t\t\t\ttitle={ title }\n\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\tif ( props.onKeyDown ) {\n\t\t\t\t\t\tprops.onKeyDown( event );\n\t\t\t\t\t}\n\t\t\t\t\t// If the event originates from inside the iframe, it means\n\t\t\t\t\t// it bubbled through the portal, but only with React\n\t\t\t\t\t// events. We need to to bubble native events as well,\n\t\t\t\t\t// though by doing so we also trigger another React event,\n\t\t\t\t\t// so we need to stop the propagation of this event to avoid\n\t\t\t\t\t// duplication.\n\t\t\t\t\tif (\n\t\t\t\t\t\tevent.currentTarget.ownerDocument !==\n\t\t\t\t\t\tevent.target.ownerDocument\n\t\t\t\t\t) {\n\t\t\t\t\t\t// We should only stop propagation of the React event,\n\t\t\t\t\t\t// the native event should further bubble inside the\n\t\t\t\t\t\t// iframe to the document and window.\n\t\t\t\t\t\t// Alternatively, we could consider redispatching the\n\t\t\t\t\t\t// native event in the iframe.\n\t\t\t\t\t\tconst { stopPropagation } = event.nativeEvent;\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = () => {};\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = stopPropagation;\n\t\t\t\t\t\tbubbleEvent(\n\t\t\t\t\t\t\tevent,\n\t\t\t\t\t\t\twindow.KeyboardEvent,\n\t\t\t\t\t\t\tevent.currentTarget\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframeDocument &&\n\t\t\t\t\tcreatePortal(\n\t\t\t\t\t\t<body\n\t\t\t\t\t\t\tref={ bodyRef }\n\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t'block-editor-iframe__body',\n\t\t\t\t\t\t\t\t'editor-styles-wrapper',\n\t\t\t\t\t\t\t\t...bodyClasses\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<StyleProvider document={ iframeDocument }>\n\t\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t\t</StyleProvider>\n\t\t\t\t\t\t</body>,\n\t\t\t\t\t\tiframeDocument.documentElement\n\t\t\t\t\t) }\n\t\t\t</iframe>\n\t\t\t{ shouldRenderFocusCaptureElements && after }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<div className=\"block-editor-iframe__container\" ref={ containerRef }>\n\t\t\t<div\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'block-editor-iframe__scale-container',\n\t\t\t\t\tisZoomedOut && 'is-zoomed-out'\n\t\t\t\t) }\n\t\t\t\tstyle={ {\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width':\n\t\t\t\t\t\tisZoomedOut && `${ scaleContainerWidth }px`,\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframe }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nfunction IframeIfReady( props, ref ) {\n\tconst isInitialised = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().__internalIsInitialized,\n\t\t[]\n\t);\n\n\t// We shouldn't render the iframe until the editor settings are initialised.\n\t// The initial settings are needed to get the styles for the srcDoc, which\n\t// cannot be changed after the iframe is mounted. srcDoc is used to to set\n\t// the initial iframe HTML, which is required to avoid a flash of unstyled\n\t// content.\n\tif ( ! isInitialised ) {\n\t\treturn null;\n\t}\n\n\treturn <Iframe { ...props } forwardedRef={ ref } />;\n}\n\nexport default forwardRef( IframeIfReady );\n"],
+  "sources": ["../../../src/components/iframe/index.jsx"],
+  "sourcesContent": ["import clsx from 'clsx';\nimport { version as reactVersion } from 'react';\nimport { useState, createPortal, forwardRef } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { useMergeRefs, useRefEffect, useDisabled } from '@wordpress/compose';\nimport { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { useWritingFlow } from '../writing-flow';\nimport { getCompatibilityStyles } from './get-compatibility-styles';\nimport { useScaleCanvas } from './use-scale-canvas';\nimport { store as blockEditorStore } from '../../store';\n\nfunction bubbleEvent( event, Constructor, frame ) {\n\tconst init = {};\n\n\tfor ( const key in event ) {\n\t\tinit[ key ] = event[ key ];\n\t}\n\n\t// Check if the event is a MouseEvent generated within the iframe.\n\t// If so, adjust the coordinates to be relative to the position of\n\t// the iframe. This ensures that components such as Draggable\n\t// receive coordinates relative to the window, instead of relative\n\t// to the iframe. Without this, the Draggable event handler would\n\t// result in components \"jumping\" position as soon as the user\n\t// drags over the iframe.\n\tif ( event instanceof frame.contentDocument.defaultView.MouseEvent ) {\n\t\tconst rect = frame.getBoundingClientRect();\n\t\tinit.clientX += rect.left;\n\t\tinit.clientY += rect.top;\n\t}\n\n\tconst newEvent = new Constructor( event.type, init );\n\tif ( init.defaultPrevented ) {\n\t\tnewEvent.preventDefault();\n\t}\n\tconst cancelled = ! frame.dispatchEvent( newEvent );\n\n\tif ( cancelled ) {\n\t\tevent.preventDefault();\n\t}\n}\n\n/**\n * Bubbles some event types (keydown, keypress, and dragover) to parent document\n * document to ensure that the keyboard shortcuts and drag and drop work.\n *\n * Ideally, we should remove event bubbling in the future. Keyboard shortcuts\n * should be context dependent, e.g. actions on blocks like Cmd+A should not\n * work globally outside the block editor.\n *\n * @param {Document} iframeDocument Document to attach listeners to.\n */\nfunction useBubbleEvents( iframeDocument ) {\n\treturn useRefEffect( () => {\n\t\tconst { defaultView } = iframeDocument;\n\t\tif ( ! defaultView ) {\n\t\t\treturn;\n\t\t}\n\t\tconst { frameElement } = defaultView;\n\t\tconst html = iframeDocument.documentElement;\n\t\tconst eventTypes = [ 'dragover', 'mousemove' ];\n\t\tconst handlers = {};\n\t\tfor ( const name of eventTypes ) {\n\t\t\thandlers[ name ] = ( event ) => {\n\t\t\t\tconst prototype = Object.getPrototypeOf( event );\n\t\t\t\tconst constructorName = prototype.constructor.name;\n\t\t\t\tconst Constructor = window[ constructorName ];\n\t\t\t\tbubbleEvent( event, Constructor, frameElement );\n\t\t\t};\n\t\t\thtml.addEventListener( name, handlers[ name ] );\n\t\t}\n\n\t\treturn () => {\n\t\t\tfor ( const name of eventTypes ) {\n\t\t\t\thtml.removeEventListener( name, handlers[ name ] );\n\t\t\t}\n\t\t};\n\t} );\n}\n\nconst iframeSrcCache = new WeakMap();\nconst iframeSrcCleanup = globalThis.FinalizationRegistry\n\t? new globalThis.FinalizationRegistry( ( url ) =>\n\t\t\tURL.revokeObjectURL( url )\n\t  )\n\t: undefined;\n\nfunction getIframeSrc( resolvedAssets ) {\n\tlet src = iframeSrcCache.get( resolvedAssets );\n\tif ( src ) {\n\t\treturn src;\n\t}\n\n\tlet body = '';\n\tif ( reactVersion.split( '.' )[ 0 ] === '18' ) {\n\t\tbody =\n\t\t\t'<body><script>document.currentScript.parentElement.remove()</script></body>';\n\t}\n\n\t// Correct doctype is required to enable rendering in standards mode.\n\t// Also preload the styles to avoid a flash of unstyled content.\n\tconst html = `<!doctype html>\n<html>\n\t<head>\n\t\t<meta charset=\"utf-8\">\n\t\t<base href=\"${ window.location.href }\">\n\t\t<style>\n\t\t\thtml{\n\t\t\t\theight: auto !important;\n\t\t\t\tmin-height: 100%;\n\t\t\t}\n\t\t\t/* Lowest specificity to not override global styles */\n\t\t\t:where(body) {\n\t\t\t\tmargin: 0;\n\t\t\t\t/* Default background color in case zoom out mode background\n\t\t\t\tcolors the html element */\n\t\t\t\tbackground-color: white;\n\t\t\t}\n\t\t</style>\n\t\t${ resolvedAssets.styles ?? '' }\n\t\t${ resolvedAssets.scripts ?? '' }\n\t</head>\n\t${ body }\n</html>`;\n\n\tsrc = URL.createObjectURL( new Blob( [ html ], { type: 'text/html' } ) );\n\tiframeSrcCache.set( resolvedAssets, src );\n\tiframeSrcCleanup?.register( resolvedAssets, src );\n\treturn src;\n}\n\nfunction Iframe( {\n\tcontentRef,\n\tchildren,\n\ttabIndex = 0,\n\tscale = 1,\n\tframeSize = 0,\n\treadonly,\n\tforwardedRef: ref,\n\ttitle = __( 'Editor canvas' ),\n\t...props\n} ) {\n\tconst { resolvedAssets, isPreviewMode } = useSelect( ( select ) => {\n\t\tconst settings = select( blockEditorStore ).getSettings();\n\t\treturn {\n\t\t\tresolvedAssets: settings.__unstableResolvedAssets,\n\t\t\tisPreviewMode: settings.isPreviewMode,\n\t\t};\n\t}, [] );\n\t/** @type {[Document, React.Dispatch<Document>]} */\n\tconst [ iframeDocument, setIframeDocument ] = useState();\n\tconst [ bodyClasses, setBodyClasses ] = useState( [] );\n\tconst [ before, writingFlowRef, after ] = useWritingFlow();\n\n\tconst setRef = useRefEffect( ( node ) => {\n\t\tlet iFrameDocument;\n\t\t// Prevent the default browser action for files dropped outside of dropzones.\n\t\tfunction preventFileDropDefault( event ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t\t// Prevent clicks on link fragments from navigating away. Note that links\n\t\t// inside `contenteditable` are already disabled by the browser, so\n\t\t// this is for links in blocks outside of `contenteditable`.\n\t\tfunction interceptLinkClicks( event ) {\n\t\t\tif (\n\t\t\t\tevent.target.tagName === 'A' &&\n\t\t\t\tevent.target.getAttribute( 'href' )?.startsWith( '#' )\n\t\t\t) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\t// Manually handle link fragment navigation within the iframe. The iframe's\n\t\t\t\t// location is a blob URL, which can't be used to resolve relative links like\n\t\t\t\t// `#hash`. The relative link would be resolved against the iframe's base URL\n\t\t\t\t// or the parent frame's URL, causing the iframe to navigate to a completely\n\t\t\t\t// different page. Setting the `location.hash` works because it really sets the\n\t\t\t\t// blob URL's hash.\n\t\t\t\t//\n\t\t\t\t// Links with fragments are used for example with footnotes. Clicking on these\n\t\t\t\t// links will scroll smoothly to the anchors in the editor canvas.\n\t\t\t\tiFrameDocument.defaultView.location.hash = event.target\n\t\t\t\t\t.getAttribute( 'href' )\n\t\t\t\t\t.slice( 1 );\n\t\t\t}\n\t\t}\n\n\t\tconst { ownerDocument } = node;\n\n\t\t// Ideally ALL classes that are added through get_body_class should\n\t\t// be added in the editor too, which we'll somehow have to get from\n\t\t// the server in the future (which will run the PHP filters).\n\t\tsetBodyClasses(\n\t\t\tArray.from( ownerDocument.body.classList ).filter(\n\t\t\t\t( name ) =>\n\t\t\t\t\tname.startsWith( 'admin-color-' ) ||\n\t\t\t\t\tname.startsWith( 'post-type-' ) ||\n\t\t\t\t\tname === 'wp-embed-responsive'\n\t\t\t)\n\t\t);\n\n\t\tfunction onLoad() {\n\t\t\tconst { contentDocument } = node;\n\t\t\tconst { documentElement } = contentDocument;\n\t\t\tiFrameDocument = contentDocument;\n\t\t\tsetIframeDocument( contentDocument );\n\n\t\t\tdocumentElement.classList.add( 'block-editor-iframe__html' );\n\n\t\t\tcontentDocument.dir = ownerDocument.dir;\n\n\t\t\tfor ( const compatStyle of getCompatibilityStyles() ) {\n\t\t\t\tif ( contentDocument.getElementById( compatStyle.id ) ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tcontentDocument.head.appendChild(\n\t\t\t\t\tcompatStyle.cloneNode( true )\n\t\t\t\t);\n\n\t\t\t\tif ( ! isPreviewMode ) {\n\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t`${ compatStyle.id } was added to the iframe incorrectly. Please use block.json or enqueue_block_assets to add styles to the iframe.`,\n\t\t\t\t\t\tcompatStyle\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tiFrameDocument.addEventListener( 'click', interceptLinkClicks );\n\t\t}\n\n\t\tnode.addEventListener( 'load', onLoad );\n\n\t\treturn () => {\n\t\t\tsetIframeDocument( undefined );\n\t\t\tnode.removeEventListener( 'load', onLoad );\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t\tiFrameDocument?.removeEventListener( 'click', interceptLinkClicks );\n\t\t};\n\t}, [] );\n\n\tconst {\n\t\tcontentRef: scaleContentRef,\n\t\tcontainerRef,\n\t\tisZoomedOut,\n\t\tscaleContainerWidth,\n\t} = useScaleCanvas( {\n\t\tscale,\n\t\tframeSize: parseInt( frameSize ),\n\t\tiframeDocument,\n\t} );\n\n\tconst disabledRef = useDisabled( { isDisabled: ! readonly } );\n\n\tconst unguardedBodyRef = useMergeRefs( [\n\t\tuseBubbleEvents( iframeDocument ),\n\t\tcontentRef,\n\t\twritingFlowRef,\n\t\tdisabledRef,\n\t\tscaleContentRef,\n\t] );\n\n\t// Attach the body ref only when the iframe document and window are available.\n\t// When an iframe element is moved in the DOM, like when reordering a list,\n\t// its `window` object is destroyed and recreated, and the `defaultView` field is\n\t// briefly `null`. We need to guard for such calls of the ref callbacks.\n\tconst bodyRef = useRefEffect(\n\t\t( node ) => {\n\t\t\tif ( node.ownerDocument.defaultView ) {\n\t\t\t\tunguardedBodyRef( node );\n\t\t\t\treturn () => unguardedBodyRef( null );\n\t\t\t}\n\t\t\treturn () => {};\n\t\t},\n\t\t[ unguardedBodyRef ]\n\t);\n\n\tconst src = getIframeSrc( resolvedAssets );\n\n\t// Make sure to not render the before and after focusable div elements in view\n\t// mode. They're only needed to capture focus in edit mode.\n\tconst shouldRenderFocusCaptureElements = tabIndex >= 0 && ! isPreviewMode;\n\n\tconst iframe = (\n\t\t<>\n\t\t\t{ shouldRenderFocusCaptureElements && before }\n\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<iframe\n\t\t\t\t{ ...props }\n\t\t\t\tstyle={ {\n\t\t\t\t\t...props.style,\n\t\t\t\t\theight: props.style?.height,\n\t\t\t\t\tborder: 0,\n\t\t\t\t} }\n\t\t\t\tref={ useMergeRefs( [ ref, setRef ] ) }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\tsrc={ src }\n\t\t\t\ttitle={ title }\n\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\tif ( props.onKeyDown ) {\n\t\t\t\t\t\tprops.onKeyDown( event );\n\t\t\t\t\t}\n\t\t\t\t\t// If the event originates from inside the iframe, it means\n\t\t\t\t\t// it bubbled through the portal, but only with React\n\t\t\t\t\t// events. We need to bubble native events as well,\n\t\t\t\t\t// though by doing so we also trigger another React event,\n\t\t\t\t\t// so we need to stop the propagation of this event to avoid\n\t\t\t\t\t// duplication.\n\t\t\t\t\tif (\n\t\t\t\t\t\tevent.currentTarget.ownerDocument !==\n\t\t\t\t\t\tevent.target.ownerDocument\n\t\t\t\t\t) {\n\t\t\t\t\t\t// We should only stop propagation of the React event,\n\t\t\t\t\t\t// the native event should further bubble inside the\n\t\t\t\t\t\t// iframe to the document and window.\n\t\t\t\t\t\t// Alternatively, we could consider redispatching the\n\t\t\t\t\t\t// native event in the iframe.\n\t\t\t\t\t\tconst { stopPropagation } = event.nativeEvent;\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = () => {};\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = stopPropagation;\n\t\t\t\t\t\tbubbleEvent(\n\t\t\t\t\t\t\tevent,\n\t\t\t\t\t\t\twindow.KeyboardEvent,\n\t\t\t\t\t\t\tevent.currentTarget\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframeDocument &&\n\t\t\t\t\tcreatePortal(\n\t\t\t\t\t\t<body\n\t\t\t\t\t\t\tref={ bodyRef }\n\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t'block-editor-iframe__body',\n\t\t\t\t\t\t\t\t'editor-styles-wrapper',\n\t\t\t\t\t\t\t\t...bodyClasses\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<StyleProvider document={ iframeDocument }>\n\t\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t\t</StyleProvider>\n\t\t\t\t\t\t</body>,\n\t\t\t\t\t\tiframeDocument.documentElement\n\t\t\t\t\t) }\n\t\t\t</iframe>\n\t\t\t{ shouldRenderFocusCaptureElements && after }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<div className=\"block-editor-iframe__container\" ref={ containerRef }>\n\t\t\t<div\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'block-editor-iframe__scale-container',\n\t\t\t\t\tisZoomedOut && 'is-zoomed-out'\n\t\t\t\t) }\n\t\t\t\tstyle={ {\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width':\n\t\t\t\t\t\tisZoomedOut && `${ scaleContainerWidth }px`,\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframe }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nfunction IframeIfReady( props, ref ) {\n\tconst isInitialised = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().__internalIsInitialized,\n\t\t[]\n\t);\n\n\t// We shouldn't render the iframe until the editor settings are initialized.\n\t// The initial settings are needed to get the styles for the srcDoc, which\n\t// cannot be changed after the iframe is mounted. srcDoc is used to set\n\t// the initial iframe HTML, which is required to avoid a flash of unstyled\n\t// content.\n\tif ( ! isInitialised ) {\n\t\treturn null;\n\t}\n\n\treturn <Iframe { ...props } forwardedRef={ ref } />;\n}\n\nexport default forwardRef( IframeIfReady );\n"],
   "mappings": "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",
   "names": []
 }

package/build-module/components/image-editor/aspect-ratio-dropdown.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/image-editor/aspect-ratio-dropdown.js
+// packages/block-editor/src/components/image-editor/aspect-ratio-dropdown.jsx
 import { check, aspectRatio as aspectRatioIcon } from "@wordpress/icons";
 import { DropdownMenu, MenuGroup, MenuItem } from "@wordpress/components";
 import { __ } from "@wordpress/i18n";

package/build-module/components/image-editor/aspect-ratio-dropdown.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/image-editor/aspect-ratio-dropdown.js"],
+  "sources": ["../../../src/components/image-editor/aspect-ratio-dropdown.jsx"],
   "sourcesContent": ["import { check, aspectRatio as aspectRatioIcon } from '@wordpress/icons';\nimport { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useSettings } from '../use-settings';\nimport { POPOVER_PROPS } from './constants';\nimport { useImageEditingContext } from './context';\n\nfunction AspectRatioGroup( {\n\taspectRatios,\n\tisDisabled,\n\tlabel,\n\tonClick,\n\tvalue,\n} ) {\n\treturn (\n\t\t<MenuGroup label={ label }>\n\t\t\t{ aspectRatios.map( ( { name, slug, ratio } ) => (\n\t\t\t\t<MenuItem\n\t\t\t\t\tkey={ slug }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonClick( ratio );\n\t\t\t\t\t} }\n\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\tisSelected={ ratio === value }\n\t\t\t\t\ticon={ ratio === value ? check : undefined }\n\t\t\t\t>\n\t\t\t\t\t{ name }\n\t\t\t\t</MenuItem>\n\t\t\t) ) }\n\t\t</MenuGroup>\n\t);\n}\n\nexport function ratioToNumber( str ) {\n\t// TODO: support two-value aspect ratio?\n\t// https://css-tricks.com/almanac/properties/a/aspect-ratio/#aa-it-can-take-two-values\n\tconst [ a, b, ...rest ] = str.split( '/' ).map( Number );\n\tif (\n\t\ta <= 0 ||\n\t\tb <= 0 ||\n\t\tNumber.isNaN( a ) ||\n\t\tNumber.isNaN( b ) ||\n\t\trest.length\n\t) {\n\t\treturn NaN;\n\t}\n\treturn b ? a / b : a;\n}\n\nfunction presetRatioAsNumber( { ratio, ...rest } ) {\n\treturn {\n\t\tratio: ratioToNumber( ratio ),\n\t\t...rest,\n\t};\n}\n\nexport default function AspectRatioDropdown( { toggleProps } ) {\n\tconst { isInProgress, aspect, setAspect, defaultAspect } =\n\t\tuseImageEditingContext();\n\n\tconst [ defaultRatios, themeRatios, showDefaultRatios ] = useSettings(\n\t\t'dimensions.aspectRatios.default',\n\t\t'dimensions.aspectRatios.theme',\n\t\t'dimensions.defaultAspectRatios'\n\t);\n\n\treturn (\n\t\t<DropdownMenu\n\t\t\ticon={ aspectRatioIcon }\n\t\t\tlabel={ __( 'Aspect Ratio' ) }\n\t\t\tpopoverProps={ POPOVER_PROPS }\n\t\t\ttoggleProps={ toggleProps }\n\t\t>\n\t\t\t{ ( { onClose } ) => (\n\t\t\t\t<>\n\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\taspectRatios={ [\n\t\t\t\t\t\t\t// All ratios should be mirrored in AspectRatioTool in @wordpress/block-editor.\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tslug: 'original',\n\t\t\t\t\t\t\t\tname: __( 'Original' ),\n\t\t\t\t\t\t\t\tratio: defaultAspect,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t...( showDefaultRatios\n\t\t\t\t\t\t\t\t? defaultRatios\n\t\t\t\t\t\t\t\t\t\t.map( presetRatioAsNumber )\n\t\t\t\t\t\t\t\t\t\t.filter( ( { ratio } ) => ratio === 1 )\n\t\t\t\t\t\t\t\t: [] ),\n\t\t\t\t\t\t] }\n\t\t\t\t\t/>\n\t\t\t\t\t{ themeRatios?.length > 0 && (\n\t\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\t\tlabel={ __( 'Theme' ) }\n\t\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\t\taspectRatios={ themeRatios }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ showDefaultRatios && (\n\t\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\t\tlabel={ __( 'Landscape' ) }\n\t\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\t\taspectRatios={ defaultRatios\n\t\t\t\t\t\t\t\t.map( presetRatioAsNumber )\n\t\t\t\t\t\t\t\t.filter( ( { ratio } ) => ratio > 1 ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ showDefaultRatios && (\n\t\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\t\tlabel={ __( 'Portrait' ) }\n\t\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\t\taspectRatios={ defaultRatios\n\t\t\t\t\t\t\t\t.map( presetRatioAsNumber )\n\t\t\t\t\t\t\t\t.filter( ( { ratio } ) => ratio < 1 ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</>\n\t\t\t) }\n\t\t</DropdownMenu>\n\t);\n}\n"],
   "mappings": "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",
   "names": []

package/build-module/components/image-editor/context.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/image-editor/context.js
+// packages/block-editor/src/components/image-editor/context.jsx
 import { createContext, useContext, useMemo } from "@wordpress/element";
 import useSaveImage from "./use-save-image.mjs";
 import useTransformImage from "./use-transform-image.mjs";

package/build-module/components/image-editor/context.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/image-editor/context.js"],
+  "sources": ["../../../src/components/image-editor/context.jsx"],
   "sourcesContent": ["import { createContext, useContext, useMemo } from '@wordpress/element';\nimport useSaveImage from './use-save-image';\nimport useTransformImage from './use-transform-image';\n\nconst ImageEditingContext = createContext( {} );\nImageEditingContext.displayName = 'ImageEditingContext';\n\nexport const useImageEditingContext = () => useContext( ImageEditingContext );\n\nexport default function ImageEditingProvider( {\n\tid,\n\turl,\n\tnaturalWidth,\n\tnaturalHeight,\n\tonFinishEditing,\n\tonSaveImage,\n\tchildren,\n} ) {\n\tconst transformImage = useTransformImage( {\n\t\turl,\n\t\tnaturalWidth,\n\t\tnaturalHeight,\n\t} );\n\n\tconst saveImage = useSaveImage( {\n\t\tid,\n\t\turl,\n\t\tonSaveImage,\n\t\tonFinishEditing,\n\t\t...transformImage,\n\t} );\n\n\tconst providerValue = useMemo(\n\t\t() => ( {\n\t\t\t...transformImage,\n\t\t\t...saveImage,\n\t\t} ),\n\t\t[ transformImage, saveImage ]\n\t);\n\n\treturn (\n\t\t<ImageEditingContext.Provider value={ providerValue }>\n\t\t\t{ children }\n\t\t</ImageEditingContext.Provider>\n\t);\n}\n"],
   "mappings": ";AAAA,SAAS,eAAe,YAAY,eAAe;AACnD,OAAO,kBAAkB;AACzB,OAAO,uBAAuB;AAuC5B;AArCF,IAAM,sBAAsB,cAAe,CAAC,CAAE;AAC9C,oBAAoB,cAAc;AAE3B,IAAM,yBAAyB,MAAM,WAAY,mBAAoB;AAE7D,SAAR,qBAAuC;AAAA,EAC7C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,iBAAiB,kBAAmB;AAAA,IACzC;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAEF,QAAM,YAAY,aAAc;AAAA,IAC/B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACJ,CAAE;AAEF,QAAM,gBAAgB;AAAA,IACrB,OAAQ;AAAA,MACP,GAAG;AAAA,MACH,GAAG;AAAA,IACJ;AAAA,IACA,CAAE,gBAAgB,SAAU;AAAA,EAC7B;AAEA,SACC,oBAAC,oBAAoB,UAApB,EAA6B,OAAQ,eACnC,UACH;AAEF;",
   "names": []

package/build-module/components/image-editor/cropper.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/image-editor/cropper.js
+// packages/block-editor/src/components/image-editor/cropper.jsx
 import clsx from "clsx";
 import { Spinner } from "@wordpress/components";
 import { useResizeObserver } from "@wordpress/compose";

package/build-module/components/image-editor/cropper.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/image-editor/cropper.js"],
+  "sources": ["../../../src/components/image-editor/cropper.jsx"],
   "sourcesContent": ["import clsx from 'clsx';\nimport { Spinner } from '@wordpress/components';\nimport { useResizeObserver } from '@wordpress/compose';\nimport { ImageCropper as ImageCropperComponent } from '@wordpress/image-cropper';\nimport { useImageEditingContext } from './context';\n\nexport default function ImageCropper( {\n\turl,\n\twidth,\n\theight,\n\tnaturalHeight,\n\tnaturalWidth,\n\tborderProps,\n} ) {\n\tconst { isInProgress, editedUrl, rotation } = useImageEditingContext();\n\tconst [ contentResizeListener, { width: clientWidth } ] =\n\t\tuseResizeObserver();\n\n\tlet editedHeight = height || ( clientWidth * naturalHeight ) / naturalWidth;\n\n\tif ( rotation % 180 === 90 ) {\n\t\teditedHeight = ( clientWidth * naturalWidth ) / naturalHeight;\n\t}\n\n\tconst area = (\n\t\t<div\n\t\t\tclassName={ clsx(\n\t\t\t\t'wp-block-image__crop-area',\n\t\t\t\tborderProps?.className,\n\t\t\t\t{\n\t\t\t\t\t'is-applying': isInProgress,\n\t\t\t\t}\n\t\t\t) }\n\t\t\tstyle={ {\n\t\t\t\t...borderProps?.style,\n\t\t\t\twidth: width || clientWidth,\n\t\t\t\theight: editedHeight,\n\t\t\t} }\n\t\t>\n\t\t\t<ImageCropperComponent src={ editedUrl || url } />\n\t\t\t{ isInProgress && <Spinner /> }\n\t\t</div>\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t{ contentResizeListener }\n\t\t\t{ area }\n\t\t</>\n\t);\n}\n"],
   "mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,eAAe;AACxB,SAAS,yBAAyB;AAClC,SAAS,gBAAgB,6BAA6B;AACtD,SAAS,8BAA8B;AAqBrC,SAoBA,UANC,KAdD;AAnBa,SAAR,aAA+B;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,EAAE,cAAc,WAAW,SAAS,IAAI,uBAAuB;AACrE,QAAM,CAAE,uBAAuB,EAAE,OAAO,YAAY,CAAE,IACrD,kBAAkB;AAEnB,MAAI,eAAe,UAAY,cAAc,gBAAkB;AAE/D,MAAK,WAAW,QAAQ,IAAK;AAC5B,mBAAiB,cAAc,eAAiB;AAAA,EACjD;AAEA,QAAM,OACL;AAAA,IAAC;AAAA;AAAA,MACA,WAAY;AAAA,QACX;AAAA,QACA,aAAa;AAAA,QACb;AAAA,UACC,eAAe;AAAA,QAChB;AAAA,MACD;AAAA,MACA,OAAQ;AAAA,QACP,GAAG,aAAa;AAAA,QAChB,OAAO,SAAS;AAAA,QAChB,QAAQ;AAAA,MACT;AAAA,MAEA;AAAA,4BAAC,yBAAsB,KAAM,aAAa,KAAM;AAAA,QAC9C,gBAAgB,oBAAC,WAAQ;AAAA;AAAA;AAAA,EAC5B;AAGD,SACC,iCACG;AAAA;AAAA,IACA;AAAA,KACH;AAEF;",
   "names": []

package/build-module/components/image-editor/form-controls.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/image-editor/form-controls.js
+// packages/block-editor/src/components/image-editor/form-controls.jsx
 import { ToolbarButton } from "@wordpress/components";
 import { __ } from "@wordpress/i18n";
 import { useImageEditingContext } from "./context.mjs";

package/build-module/components/image-editor/form-controls.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/image-editor/form-controls.js"],
+  "sources": ["../../../src/components/image-editor/form-controls.jsx"],
   "sourcesContent": ["import { ToolbarButton } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useImageEditingContext } from './context';\n\nexport default function FormControls() {\n\tconst { isInProgress, apply, cancel } = useImageEditingContext();\n\treturn (\n\t\t<>\n\t\t\t<ToolbarButton onClick={ apply } disabled={ isInProgress }>\n\t\t\t\t{ __( 'Apply' ) }\n\t\t\t</ToolbarButton>\n\t\t\t<ToolbarButton onClick={ cancel }>{ __( 'Cancel' ) }</ToolbarButton>\n\t\t</>\n\t);\n}\n"],
   "mappings": ";AAAA,SAAS,qBAAqB;AAC9B,SAAS,UAAU;AACnB,SAAS,8BAA8B;AAKrC,mBACC,KADD;AAHa,SAAR,eAAgC;AACtC,QAAM,EAAE,cAAc,OAAO,OAAO,IAAI,uBAAuB;AAC/D,SACC,iCACC;AAAA,wBAAC,iBAAc,SAAU,OAAQ,UAAW,cACzC,aAAI,OAAQ,GACf;AAAA,IACA,oBAAC,iBAAc,SAAU,QAAW,aAAI,QAAS,GAAG;AAAA,KACrD;AAEF;",
   "names": []

package/build-module/components/image-editor/index.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/image-editor/index.js
+// packages/block-editor/src/components/image-editor/index.jsx
 import { ToolbarGroup, ToolbarItem } from "@wordpress/components";
 import deprecated from "@wordpress/deprecated";
 import { ImageCropperProvider } from "@wordpress/image-cropper";

package/build-module/components/image-editor/index.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/image-editor/index.js"],
+  "sources": ["../../../src/components/image-editor/index.jsx"],
   "sourcesContent": ["import { ToolbarGroup, ToolbarItem } from '@wordpress/components';\nimport deprecated from '@wordpress/deprecated';\nimport { ImageCropperProvider } from '@wordpress/image-cropper';\nimport AspectRatioDropdown from './aspect-ratio-dropdown';\nimport BlockControls from '../block-controls';\nimport ImageEditingProvider from './context';\nimport Cropper from './cropper';\nimport ZoomDropdown from './zoom-dropdown';\nimport RotationButton from './rotation-button';\nimport FormControls from './form-controls';\n\n/**\n * @deprecated since 7.1. The Media Editor modal is now the default crop\n * experience for core blocks. This component (exported as\n * `__experimentalImageEditor`) will be removed in a future major release.\n *\n * @param {Object}   root0                 Component props.\n * @param {number}   root0.id              Media attachment ID.\n * @param {string}   root0.url             Media URL.\n * @param {number}   root0.width           Rendered image width.\n * @param {number}   root0.height          Rendered image height.\n * @param {number}   root0.naturalHeight   Natural image height.\n * @param {number}   root0.naturalWidth    Natural image width.\n * @param {Function} root0.onSaveImage     Callback to save image attributes.\n * @param {Function} root0.onFinishEditing Callback when editing finishes.\n * @param {Object}   root0.borderProps     Border classes and styles.\n */\nexport default function ImageEditor( {\n\tid,\n\turl,\n\twidth,\n\theight,\n\tnaturalHeight,\n\tnaturalWidth,\n\tonSaveImage,\n\tonFinishEditing,\n\tborderProps,\n} ) {\n\tdeprecated( 'wp.blockEditor.__experimentalImageEditor', {\n\t\tsince: '7.1',\n\t\thint: 'The Media Editor modal is now the default crop experience for core blocks. This component will be removed in a future major release.',\n\t} );\n\n\treturn (\n\t\t<ImageCropperProvider>\n\t\t\t<ImageEditingProvider\n\t\t\t\tid={ id }\n\t\t\t\turl={ url }\n\t\t\t\tnaturalWidth={ naturalWidth }\n\t\t\t\tnaturalHeight={ naturalHeight }\n\t\t\t\tonSaveImage={ onSaveImage }\n\t\t\t\tonFinishEditing={ onFinishEditing }\n\t\t\t>\n\t\t\t\t<Cropper\n\t\t\t\t\tborderProps={ borderProps }\n\t\t\t\t\turl={ url }\n\t\t\t\t\twidth={ width }\n\t\t\t\t\theight={ height }\n\t\t\t\t\tnaturalHeight={ naturalHeight }\n\t\t\t\t\tnaturalWidth={ naturalWidth }\n\t\t\t\t/>\n\t\t\t\t<BlockControls>\n\t\t\t\t\t<ToolbarGroup>\n\t\t\t\t\t\t<ZoomDropdown />\n\t\t\t\t\t\t<ToolbarItem>\n\t\t\t\t\t\t\t{ ( toggleProps ) => (\n\t\t\t\t\t\t\t\t<AspectRatioDropdown\n\t\t\t\t\t\t\t\t\ttoggleProps={ toggleProps }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</ToolbarItem>\n\t\t\t\t\t\t<RotationButton />\n\t\t\t\t\t</ToolbarGroup>\n\t\t\t\t\t<ToolbarGroup>\n\t\t\t\t\t\t<FormControls />\n\t\t\t\t\t</ToolbarGroup>\n\t\t\t\t</BlockControls>\n\t\t\t</ImageEditingProvider>\n\t\t</ImageCropperProvider>\n\t);\n}\n"],
   "mappings": ";AAAA,SAAS,cAAc,mBAAmB;AAC1C,OAAO,gBAAgB;AACvB,SAAS,4BAA4B;AACrC,OAAO,yBAAyB;AAChC,OAAO,mBAAmB;AAC1B,OAAO,0BAA0B;AACjC,OAAO,aAAa;AACpB,OAAO,kBAAkB;AACzB,OAAO,oBAAoB;AAC3B,OAAO,kBAAkB;AA4CrB,cASC,YATD;AA1BW,SAAR,YAA8B;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,aAAY,4CAA4C;AAAA,IACvD,OAAO;AAAA,IACP,MAAM;AAAA,EACP,CAAE;AAEF,SACC,oBAAC,wBACA;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACD;AAAA,QACA,qBAAC,iBACA;AAAA,+BAAC,gBACA;AAAA,gCAAC,gBAAa;AAAA,YACd,oBAAC,eACE,WAAE,gBACH;AAAA,cAAC;AAAA;AAAA,gBACA;AAAA;AAAA,YACD,GAEF;AAAA,YACA,oBAAC,kBAAe;AAAA,aACjB;AAAA,UACA,oBAAC,gBACA,8BAAC,gBAAa,GACf;AAAA,WACD;AAAA;AAAA;AAAA,EACD,GACD;AAEF;",
   "names": []

package/build-module/components/image-editor/rotation-button.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/image-editor/rotation-button.js
+// packages/block-editor/src/components/image-editor/rotation-button.jsx
 import { ToolbarButton } from "@wordpress/components";
 import { __ } from "@wordpress/i18n";
 import { rotateRight as rotateRightIcon } from "@wordpress/icons";

package/build-module/components/image-editor/rotation-button.mjs.map CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/image-editor/rotation-button.js"],
+  "sources": ["../../../src/components/image-editor/rotation-button.jsx"],
   "sourcesContent": ["import { ToolbarButton } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { rotateRight as rotateRightIcon } from '@wordpress/icons';\nimport { useImageEditingContext } from './context';\n\nexport default function RotationButton() {\n\tconst { isInProgress, rotateClockwise } = useImageEditingContext();\n\treturn (\n\t\t<ToolbarButton\n\t\t\ticon={ rotateRightIcon }\n\t\t\tlabel={ __( 'Rotate' ) }\n\t\t\tonClick={ rotateClockwise }\n\t\t\tdisabled={ isInProgress }\n\t\t/>\n\t);\n}\n"],
   "mappings": ";AAAA,SAAS,qBAAqB;AAC9B,SAAS,UAAU;AACnB,SAAS,eAAe,uBAAuB;AAC/C,SAAS,8BAA8B;AAKrC;AAHa,SAAR,iBAAkC;AACxC,QAAM,EAAE,cAAc,gBAAgB,IAAI,uBAAuB;AACjE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,MAAO;AAAA,MACP,OAAQ,GAAI,QAAS;AAAA,MACrB,SAAU;AAAA,MACV,UAAW;AAAA;AAAA,EACZ;AAEF;",
   "names": []

package/build-module/components/image-editor/zoom-dropdown.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-// packages/block-editor/src/components/image-editor/zoom-dropdown.js
+// packages/block-editor/src/components/image-editor/zoom-dropdown.jsx
 import {
   ToolbarButton,
   RangeControl,