From ea72cf12669b42e477ce3b388c5a00ecc2954e29 Mon Sep 17 00:00:00 2001 From: byeongin yoon Date: Thu, 27 Jun 2024 18:36:55 +0900 Subject: [PATCH 1/7] Fix: Correct variable name in color directive example code (#62912) - Change 'color' to 'colors' in destructured parameter of example code - Update ensures the example code accurately demonstrates correct usage Co-authored-by: byeongin Unlinked contributors: byeongin@shoplic.kr. --- packages/interactivity/src/hooks.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/interactivity/src/hooks.tsx b/packages/interactivity/src/hooks.tsx index d8aa43d2c0e5af..9af6fb00d6aba5 100644 --- a/packages/interactivity/src/hooks.tsx +++ b/packages/interactivity/src/hooks.tsx @@ -231,7 +231,7 @@ const directivePriorities: Record< string, number > = {}; * ```js * directive( * 'color', // Name without prefix and suffix. - * ( { directives: { color }, ref, evaluate } ) => + * ( { directives: { color: colors }, ref, evaluate } ) => * colors.forEach( ( color ) => { * if ( color.suffix = 'text' ) { * ref.style.setProperty( From 0e05f99c6a5ca08e9a325ef14ea99b8eadccf38b Mon Sep 17 00:00:00 2001 From: Jonathan Desrosiers <359867+desrosj@users.noreply.github.com> Date: Thu, 27 Jun 2024 10:09:25 -0400 Subject: [PATCH 2/7] Update Node.js to 20. (#62851) Co-authored-by: desrosj Co-authored-by: ellatrix --- packages/project-management-automation/action.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/project-management-automation/action.yml b/packages/project-management-automation/action.yml index 34490f539875cc..cf7f23a2174f28 100644 --- a/packages/project-management-automation/action.yml +++ b/packages/project-management-automation/action.yml @@ -6,5 +6,5 @@ inputs: description: Secret GitHub API token to use for making API requests. required: true runs: - using: node12 + using: node20 main: lib/index.js From fe67010143b20d23349051e80110aa1424e79999 Mon Sep 17 00:00:00 2001 From: Ella <4710635+ellatrix@users.noreply.github.com> Date: Thu, 27 Jun 2024 17:43:28 +0300 Subject: [PATCH 3/7] DataViews: simplify selection setting (#62846) Co-authored-by: ellatrix Co-authored-by: youknowriad Co-authored-by: jorgefilipecosta Co-authored-by: sirreal Co-authored-by: jsnajdr Co-authored-by: luisherranz Co-authored-by: oandregal --- .../dataviews/src/bulk-actions-toolbar.tsx | 7 +-- packages/dataviews/src/bulk-actions.tsx | 9 +++- packages/dataviews/src/dataviews.tsx | 43 +++++++++---------- packages/dataviews/src/private-types.tsx | 2 + .../src/single-selection-checkbox.tsx | 37 +++++----------- packages/dataviews/src/types.ts | 7 ++- packages/dataviews/src/view-grid.tsx | 33 +++----------- packages/dataviews/src/view-list.tsx | 6 +-- packages/dataviews/src/view-table.tsx | 39 +++++------------ 9 files changed, 70 insertions(+), 113 deletions(-) create mode 100644 packages/dataviews/src/private-types.tsx diff --git a/packages/dataviews/src/bulk-actions-toolbar.tsx b/packages/dataviews/src/bulk-actions-toolbar.tsx index 50a1386aadec0f..07edaa6cd394ca 100644 --- a/packages/dataviews/src/bulk-actions-toolbar.tsx +++ b/packages/dataviews/src/bulk-actions-toolbar.tsx @@ -20,6 +20,7 @@ import { useRegistry } from '@wordpress/data'; import { ActionWithModal } from './item-actions'; import type { Action } from './types'; import type { ActionTriggerProps } from './item-actions'; +import type { SetSelection } from './private-types'; interface ActionButtonProps< Item > { action: Action< Item >; @@ -32,14 +33,14 @@ interface ToolbarContentProps< Item > { selection: string[]; actionsToShow: Action< Item >[]; selectedItems: Item[]; - onSelectionChange: ( selection: Item[] ) => void; + onSelectionChange: SetSelection; } interface BulkActionsToolbarProps< Item > { data: Item[]; selection: string[]; actions: Action< Item >[]; - onSelectionChange: ( selection: Item[] ) => void; + onSelectionChange: SetSelection; getItemId: ( item: Item ) => string; } @@ -131,7 +132,7 @@ function renderToolbarContent< Item >( selectedItems: Item[], actionInProgress: string | null, setActionInProgress: ( actionId: string | null ) => void, - onSelectionChange: ( selection: Item[] ) => void + onSelectionChange: SetSelection ) { return ( <> diff --git a/packages/dataviews/src/bulk-actions.tsx b/packages/dataviews/src/bulk-actions.tsx index 7f743bbeea1a2d..adafbe5799ccb8 100644 --- a/packages/dataviews/src/bulk-actions.tsx +++ b/packages/dataviews/src/bulk-actions.tsx @@ -15,6 +15,7 @@ import { useRegistry } from '@wordpress/data'; */ import { unlock } from './lock-unlock'; import type { Action, ActionModal } from './types'; +import type { SetSelection } from './private-types'; const { DropdownMenuV2: DropdownMenu, @@ -46,7 +47,7 @@ interface BulkActionsProps< Item > { data: Item[]; actions: Action< Item >[]; selection: string[]; - onSelectionChange: ( selection: Item[] ) => void; + onSelectionChange: SetSelection; getItemId: ( item: Item ) => string; } @@ -248,7 +249,11 @@ export default function BulkActions< Item >( { disabled={ areAllSelected } hideOnClick={ false } onClick={ () => { - onSelectionChange( selectableItems ); + onSelectionChange( + selectableItems.map( ( item ) => + getItemId( item ) + ) + ); } } suffix={ numberSelectableItems } > diff --git a/packages/dataviews/src/dataviews.tsx b/packages/dataviews/src/dataviews.tsx index 476ed895ed5297..f179ee71dcf04b 100644 --- a/packages/dataviews/src/dataviews.tsx +++ b/packages/dataviews/src/dataviews.tsx @@ -7,7 +7,7 @@ import type { ComponentType } from 'react'; * WordPress dependencies */ import { __experimentalHStack as HStack } from '@wordpress/components'; -import { useMemo, useState, useCallback } from '@wordpress/element'; +import { useMemo, useState } from '@wordpress/element'; /** * Internal dependencies @@ -22,6 +22,7 @@ import BulkActions from './bulk-actions'; import { normalizeFields } from './normalize-fields'; import BulkActionsToolbar from './bulk-actions-toolbar'; import type { Action, Field, View, ViewBaseProps } from './types'; +import type { SetSelection, SelectionOrUpdater } from './private-types'; type ItemWithId = { id: string }; @@ -40,7 +41,7 @@ type DataViewsProps< Item > = { }; supportedLayouts: string[]; selection?: string[]; - setSelection?: ( selection: string[] ) => void; + setSelection?: SetSelection; onSelectionChange?: ( items: Item[] ) => void; } & ( Item extends ItemWithId ? { getItemId?: ( item: Item ) => string } @@ -83,26 +84,22 @@ export default function DataViews< Item >( { onSelectionChange = defaultOnSelectionChange, }: DataViewsProps< Item > ) { const [ selectionState, setSelectionState ] = useState< string[] >( [] ); - let selection, setSelection; - if ( - selectionProperty !== undefined && - setSelectionProperty !== undefined - ) { - selection = selectionProperty; - setSelection = setSelectionProperty; - } else { - selection = selectionState; - setSelection = setSelectionState; - } + const isUncontrolled = + selectionProperty === undefined || setSelectionProperty === undefined; + const selection = isUncontrolled ? selectionState : selectionProperty; + const setSelection = isUncontrolled + ? setSelectionState + : setSelectionProperty; const [ openedFilter, setOpenedFilter ] = useState< string | null >( null ); - const onSetSelection = useCallback( - ( items: Item[] ) => { - setSelection( items.map( ( item ) => getItemId( item ) ) ); - onSelectionChange( items ); - }, - [ setSelection, getItemId, onSelectionChange ] - ); + function setSelectionWithChange( value: SelectionOrUpdater ) { + const newValue = + typeof value === 'function' ? value( selection ) : value; + onSelectionChange( + data.filter( ( item ) => newValue.includes( getItemId( item ) ) ) + ); + return setSelection( value ); + } const ViewComponent = VIEW_LAYOUTS.find( ( v ) => v.type === view.type ) ?.component as ComponentType< ViewBaseProps< Item > >; @@ -149,7 +146,7 @@ export default function DataViews< Item >( { @@ -168,7 +165,7 @@ export default function DataViews< Item >( { getItemId={ getItemId } isLoading={ isLoading } onChangeView={ onChangeView } - onSelectionChange={ onSetSelection } + onSelectionChange={ setSelectionWithChange } selection={ _selection } setOpenedFilter={ setOpenedFilter } view={ view } @@ -184,7 +181,7 @@ export default function DataViews< Item >( { data={ data } actions={ actions } selection={ _selection } - onSelectionChange={ onSetSelection } + onSelectionChange={ setSelectionWithChange } getItemId={ getItemId } /> ) } diff --git a/packages/dataviews/src/private-types.tsx b/packages/dataviews/src/private-types.tsx new file mode 100644 index 00000000000000..d2d453e63599c9 --- /dev/null +++ b/packages/dataviews/src/private-types.tsx @@ -0,0 +1,2 @@ +export type SelectionOrUpdater = string[] | ( ( prev: string[] ) => string[] ); +export type SetSelection = ( selection: SelectionOrUpdater ) => void; diff --git a/packages/dataviews/src/single-selection-checkbox.tsx b/packages/dataviews/src/single-selection-checkbox.tsx index 84b359508663b3..c8490a8c71c327 100644 --- a/packages/dataviews/src/single-selection-checkbox.tsx +++ b/packages/dataviews/src/single-selection-checkbox.tsx @@ -8,12 +8,12 @@ import { CheckboxControl } from '@wordpress/components'; * Internal dependencies */ import type { Field } from './types'; +import type { SetSelection } from './private-types'; interface SingleSelectionCheckboxProps< Item > { selection: string[]; - onSelectionChange: ( selection: Item[] ) => void; + onSelectionChange: SetSelection; item: Item; - data: Item[]; getItemId: ( item: Item ) => string; primaryField?: Field< Item >; disabled: boolean; @@ -23,23 +23,22 @@ export default function SingleSelectionCheckbox< Item >( { selection, onSelectionChange, item, - data, getItemId, primaryField, disabled, }: SingleSelectionCheckboxProps< Item > ) { const id = getItemId( item ); - const isSelected = ! disabled && selection.includes( id ); + const checked = ! disabled && selection.includes( id ); let selectionLabel; if ( primaryField?.getValue && item ) { // eslint-disable-next-line @wordpress/valid-sprintf selectionLabel = sprintf( /* translators: %s: item title. */ - isSelected ? __( 'Deselect item: %s' ) : __( 'Select item: %s' ), + checked ? __( 'Deselect item: %s' ) : __( 'Select item: %s' ), primaryField.getValue( { item } ) ); } else { - selectionLabel = isSelected + selectionLabel = checked ? __( 'Select a new item' ) : __( 'Deselect item' ); } @@ -49,31 +48,17 @@ export default function SingleSelectionCheckbox< Item >( { __nextHasNoMarginBottom aria-label={ selectionLabel } aria-disabled={ disabled } - checked={ isSelected } + checked={ checked } onChange={ () => { if ( disabled ) { return; } - if ( ! isSelected ) { - onSelectionChange( - data.filter( ( _item ) => { - const itemId = getItemId?.( _item ); - return ( - itemId === id || selection.includes( itemId ) - ); - } ) - ); - } else { - onSelectionChange( - data.filter( ( _item ) => { - const itemId = getItemId?.( _item ); - return ( - itemId !== id && selection.includes( itemId ) - ); - } ) - ); - } + onSelectionChange( + selection.includes( id ) + ? selection.filter( ( itemId ) => id !== itemId ) + : [ ...selection, id ] + ); } } /> ); diff --git a/packages/dataviews/src/types.ts b/packages/dataviews/src/types.ts index 76b514755056a1..964523c72f8a68 100644 --- a/packages/dataviews/src/types.ts +++ b/packages/dataviews/src/types.ts @@ -3,6 +3,11 @@ */ import type { ReactElement, ReactNode } from 'react'; +/** + * Internal dependencies + */ +import type { SetSelection } from './private-types'; + export type SortDirection = 'asc' | 'desc'; /** @@ -383,7 +388,7 @@ export interface ViewBaseProps< Item > { getItemId: ( item: Item ) => string; isLoading?: boolean; onChangeView( view: View ): void; - onSelectionChange: ( items: Item[] ) => void; + onSelectionChange: SetSelection; selection: string[]; setOpenedFilter: ( fieldId: string ) => void; view: View; diff --git a/packages/dataviews/src/view-grid.tsx b/packages/dataviews/src/view-grid.tsx index 8fa9d6413d851d..56f856a5d82b29 100644 --- a/packages/dataviews/src/view-grid.tsx +++ b/packages/dataviews/src/view-grid.tsx @@ -23,11 +23,11 @@ import ItemActions from './item-actions'; import SingleSelectionCheckbox from './single-selection-checkbox'; import { useHasAPossibleBulkAction } from './bulk-actions'; import type { Action, NormalizedField, ViewGridProps } from './types'; +import type { SetSelection } from './private-types'; interface GridItemProps< Item > { selection: string[]; - data: Item[]; - onSelectionChange: ( items: Item[] ) => void; + onSelectionChange: SetSelection; getItemId: ( item: Item ) => string; item: Item; actions: Action< Item >[]; @@ -40,7 +40,6 @@ interface GridItemProps< Item > { function GridItem< Item >( { selection, - data, onSelectionChange, getItemId, item, @@ -68,27 +67,11 @@ function GridItem< Item >( { if ( ! hasBulkAction ) { return; } - if ( ! isSelected ) { - onSelectionChange( - data.filter( ( _item ) => { - const itemId = getItemId?.( _item ); - return ( - itemId === id || - selection.includes( itemId ) - ); - } ) - ); - } else { - onSelectionChange( - data.filter( ( _item ) => { - const itemId = getItemId?.( _item ); - return ( - itemId !== id && - selection.includes( itemId ) - ); - } ) - ); - } + onSelectionChange( + selection.includes( id ) + ? selection.filter( ( itemId ) => id !== itemId ) + : [ ...selection, id ] + ); } } } > @@ -104,7 +87,6 @@ function GridItem< Item >( { selection={ selection } onSelectionChange={ onSelectionChange } getItemId={ getItemId } - data={ data } primaryField={ primaryField } disabled={ ! hasBulkAction } /> @@ -239,7 +221,6 @@ export default function ViewGrid< Item >( { ( props: ViewListProps< Item > ) { ) ); - const onSelect = useCallback( - ( item: Item ) => onSelectionChange( [ item ] ), - [ onSelectionChange ] - ); + const onSelect = ( item: Item ) => + onSelectionChange( [ getItemId( item ) ] ); const getItemDomId = useCallback( ( item?: Item ) => diff --git a/packages/dataviews/src/view-table.tsx b/packages/dataviews/src/view-table.tsx index f09b46733e1a84..fbd1400a301a15 100644 --- a/packages/dataviews/src/view-table.tsx +++ b/packages/dataviews/src/view-table.tsx @@ -51,6 +51,7 @@ import type { ViewTable as ViewTableType, ViewTableProps, } from './types'; +import type { SetSelection } from './private-types'; const { DropdownMenuV2: DropdownMenu, @@ -71,7 +72,7 @@ interface HeaderMenuProps< Item > { interface BulkSelectionCheckboxProps< Item > { selection: string[]; - onSelectionChange: ( items: Item[] ) => void; + onSelectionChange: SetSelection; data: Item[]; actions: Action< Item >[]; getItemId: ( item: Item ) => string; @@ -86,8 +87,7 @@ interface TableRowProps< Item > { primaryField?: NormalizedField< Item >; selection: string[]; getItemId: ( item: Item ) => string; - onSelectionChange: ( items: Item[] ) => void; - data: Item[]; + onSelectionChange: SetSelection; } function WithDropDownMenuSeparators( { children }: { children: ReactNode } ) { @@ -276,7 +276,9 @@ function BulkSelectionCheckbox< Item >( { if ( areAllSelected ) { onSelectionChange( [] ); } else { - onSelectionChange( selectableItems ); + onSelectionChange( + selectableItems.map( ( item ) => getItemId( item ) ) + ); } } } aria-label={ @@ -296,7 +298,6 @@ function TableRow< Item >( { selection, getItemId, onSelectionChange, - data, }: TableRowProps< Item > ) { const hasPossibleBulkAction = useHasAPossibleBulkAction( actions, item ); const isSelected = hasPossibleBulkAction && selection.includes( id ); @@ -336,27 +337,11 @@ function TableRow< Item >( { ! isTouchDevice.current && document.getSelection()?.type !== 'Range' ) { - if ( ! isSelected ) { - onSelectionChange( - data.filter( ( _item ) => { - const itemId = getItemId?.( _item ); - return ( - itemId === id || - selection.includes( itemId ) - ); - } ) - ); - } else { - onSelectionChange( - data.filter( ( _item ) => { - const itemId = getItemId?.( _item ); - return ( - itemId !== id && - selection.includes( itemId ) - ); - } ) - ); - } + onSelectionChange( + selection.includes( id ) + ? selection.filter( ( itemId ) => id !== itemId ) + : [ ...selection, id ] + ); } } } > @@ -373,7 +358,6 @@ function TableRow< Item >( { selection={ selection } onSelectionChange={ onSelectionChange } getItemId={ getItemId } - data={ data } primaryField={ primaryField } disabled={ ! hasPossibleBulkAction } /> @@ -579,7 +563,6 @@ function ViewTable< Item >( { selection={ selection } getItemId={ getItemId } onSelectionChange={ onSelectionChange } - data={ data } /> ) ) } From b883f30722e84ffd98bc49a4829835eb0d664b15 Mon Sep 17 00:00:00 2001 From: Luis Herranz Date: Thu, 27 Jun 2024 18:49:49 +0200 Subject: [PATCH 4/7] Docs/iAPI: Recommend kebab-case in data-wp-class (#62817) * Recommend kebab-case in wp-class and remove outdated info about callback args * Trigger actions again Co-authored-by: luisherranz Co-authored-by: cbravobernal --- .../interactivity-api/api-reference.md | 32 ++++++++++++++++--- 1 file changed, 28 insertions(+), 4 deletions(-) diff --git a/docs/reference-guides/interactivity-api/api-reference.md b/docs/reference-guides/interactivity-api/api-reference.md index a898e437b40de8..acfba8c48af665 100644 --- a/docs/reference-guides/interactivity-api/api-reference.md +++ b/docs/reference-guides/interactivity-api/api-reference.md @@ -220,10 +220,36 @@ The `wp-class` directive is executed: - When the element is created - Each time there's a change on any of the properties of the `state` or `context` involved in getting the final value of the directive (inside the callback or the expression passed as reference) -When `wp-class` directive references a callback to get its final boolean value, the callback receives the class name: `className`. - The boolean value received by the directive is used to toggle (add when `true` or remove when `false`) the associated class name from the `class` attribute. +It's important to note that when using the `wp-class` directive, it's recommended to use kebab-case for class names instead of camelCase. This is because HTML attributes are not case-sensitive, and HTML will treat `data-wp-class--isDark` the same as `data-wp-class--isdark` or `DATA-WP-CLASS--ISDARK`. + +So, for example, use the class name `is-dark` instead of `isDark` and `data-wp-class--is-dark` instead of `data-wp-class--isDark`: + +```html + +
+ +
+ + +
+ +
+``` + +```css +/* Recommended */ +.is-dark { + /* ... */ +} + +/* Not recommended */ +.isDark { + /* ... */ +} +``` + ### `wp-style` This directive adds or removes inline style to an HTML element, depending on its value. It follows the syntax `data-wp-style--css-property`. @@ -256,8 +282,6 @@ The `wp-style` directive is executed: - When the element is created - Each time there's a change on any of the properties of the `state` or `context` involved in getting the final value of the directive (inside the callback or the expression passed as reference) -When `wp-style` directive references a callback to get its final value, the callback receives the class style property: `css-property`. - The value received by the directive is used to add or remove the style attribute with the associated CSS property: - If the value is `false`, the style attribute is removed: `
` From 6de2f42d09089b041540dbec02f54555c8a6e7f1 Mon Sep 17 00:00:00 2001 From: Dani Guardiola Date: Thu, 27 Jun 2024 19:25:32 +0200 Subject: [PATCH 5/7] Tabs: add vertical indicator animation (#62879) * Add vertical indicator animation. * Remove style overrides from preferences menu in the block editor. Co-authored-by: DaniGuardiola Co-authored-by: jasmussen --- packages/components/src/tabs/styles.ts | 12 ++++----- .../preferences-modal-tabs/style.scss | 25 ------------------- 2 files changed, 5 insertions(+), 32 deletions(-) diff --git a/packages/components/src/tabs/styles.ts b/packages/components/src/tabs/styles.ts index ce575c9f317794..83304a030330bb 100644 --- a/packages/components/src/tabs/styles.ts +++ b/packages/components/src/tabs/styles.ts @@ -36,22 +36,20 @@ export const TabListWrapper = styled.div` outline-offset: -1px; } &:not( [aria-orientation='vertical'] )::after { - left: var( --indicator-left ); bottom: 0; + left: var( --indicator-left ); width: var( --indicator-width ); height: 0; border-bottom: var( --wp-admin-border-width-focus ) solid ${ COLORS.theme.accent }; } &[aria-orientation='vertical']::after { - /* Temporarily hidden, context: https://github.com/WordPress/gutenberg/pull/60560#issuecomment-2126670072 */ - opacity: 0; - - right: 0; + z-index: -1; + left: 0; + width: 100%; top: var( --indicator-top ); height: var( --indicator-height ); - border-right: var( --wp-admin-border-width-focus ) solid - ${ COLORS.theme.accent }; + background-color: ${ COLORS.theme.gray[ 100 ] }; } `; diff --git a/packages/preferences/src/components/preferences-modal-tabs/style.scss b/packages/preferences/src/components/preferences-modal-tabs/style.scss index e20b9aa9064ed6..247da29eb5d12c 100644 --- a/packages/preferences/src/components/preferences-modal-tabs/style.scss +++ b/packages/preferences/src/components/preferences-modal-tabs/style.scss @@ -6,31 +6,6 @@ $vertical-tabs-width: 160px; // Aligns button text instead of button box. left: $grid-unit-20; width: $vertical-tabs-width; - - &::after { - content: none !important; - } -} - -.preferences__tabs-tab { - border-radius: $radius-block-ui; - font-weight: 400; - - &[aria-selected="true"] { - background: $gray-100; - box-shadow: none; - font-weight: 500; - } - - &[role="tab"]:focus:not(:disabled) { - box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); - // Windows high contrast mode. - outline: 2px solid transparent; - } - - &:focus-visible::before { - content: none; - } } .preferences__tabs-tabpanel { From 4cb5adf92b553a12fe24a9e7dc2fa4fd2d877f4e Mon Sep 17 00:00:00 2001 From: Ramon Date: Fri, 28 Jun 2024 10:18:07 +1000 Subject: [PATCH 6/7] Block styles variations E2E: wait for Save button before editing global styles (#62915) * Add blockName to the overrides array so getBlockName() can be called in the useSelect store subscription callback * Update e2e test to wait for save button between styles updates * Revert selector name Co-authored-by: ramonjd Co-authored-by: ellatrix Co-authored-by: andrewserong --- test/e2e/specs/site-editor/block-style-variations.spec.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/test/e2e/specs/site-editor/block-style-variations.spec.js b/test/e2e/specs/site-editor/block-style-variations.spec.js index fedcd0946eac86..6d139dd755b29f 100644 --- a/test/e2e/specs/site-editor/block-style-variations.spec.js +++ b/test/e2e/specs/site-editor/block-style-variations.spec.js @@ -149,12 +149,14 @@ test.describe( 'Block Style Variations', () => { }, }, } ); - // The save button has been re-enabled. + + // Wait for the save button to be re-enabled. await expect( page .getByRole( 'region', { name: 'Editor top bar' } ) .getByRole( 'button', { name: 'Save' } ) - ).toBeEnabled(); + ).toBeVisible(); + // Second revision (current). await siteEditorBlockStyleVariations.saveRevision( stylesPostId, { blocks: { From 55f3a98159a754cee5162a05852881fa168134a7 Mon Sep 17 00:00:00 2001 From: Daniel Richards Date: Fri, 28 Jun 2024 09:49:14 +0800 Subject: [PATCH 7/7] Fix second scrollbar when editing patterns in the post editor (#62909) Co-authored-by: talldan Co-authored-by: stokesman Co-authored-by: tellthemachines --- packages/edit-post/src/style.scss | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/edit-post/src/style.scss b/packages/edit-post/src/style.scss index a95c02242644b5..f77c8122ca2e55 100644 --- a/packages/edit-post/src/style.scss +++ b/packages/edit-post/src/style.scss @@ -31,11 +31,13 @@ body.js.block-editor-page { } } -// Target the editor UI excluding the visual editor contents, metaboxes and custom fields areas. +// Target the editor UI excluding the non-iframed visual editor contents, metaboxes +// and custom fields areas. .editor-header, .editor-text-editor, .editor-sidebar, -.editor-post-publish-panel { +.editor-post-publish-panel, +.edit-post-visual-editor.is-iframed { @include reset; }