Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Second layout prototype #53455

Draft
wants to merge 40 commits into
base: trunk
Choose a base branch
from
Draft

Second layout prototype #53455

Changes from 1 commit
Commits
Show all changes
40 commits
Select commit Hold shift + click to select a range
8325aae
Remove variation controls and allow switching on group
tellthemachines Aug 9, 2023
688346e
Add some controls
tellthemachines Aug 9, 2023
3c4845f
Move dimensions panel
tellthemachines Aug 9, 2023
f395507
Fix controls
tellthemachines Aug 9, 2023
af8e338
Width and height controls not working yet
tellthemachines Aug 10, 2023
c87ec0b
Functionality is half there
tellthemachines Aug 11, 2023
ff63077
prevent error
tellthemachines Aug 17, 2023
e7c2faf
Width/height controls working
tellthemachines Aug 18, 2023
270e374
It more or less works!!
tellthemachines Aug 18, 2023
54fc6d2
Fix matrix resetting values
tellthemachines Aug 18, 2023
3b51305
Fix justify value
tellthemachines Aug 18, 2023
cb8f488
reset justify and align on orientation change
tellthemachines Aug 18, 2023
4bc00eb
Fix defaults
tellthemachines Aug 18, 2023
1f91205
self width for stack children
tellthemachines Aug 18, 2023
bdec991
Align Row children
tellthemachines Aug 19, 2023
10fcead
Make proper fixed sizes
tellthemachines Aug 19, 2023
1eebaf6
constrained layout child controls logic
tellthemachines Aug 19, 2023
1c9fe86
persistent width and height
SaxonF Aug 22, 2023
1953f33
alignment options layout
SaxonF Aug 23, 2023
0a30f75
Add back group variation controls
tellthemachines Sep 1, 2023
27b33b3
Vertical and horizontal instead of matrix
tellthemachines Sep 4, 2023
04a20d6
Remove comment
tellthemachines Sep 4, 2023
9a89e07
Add icons to vertical and horizontal
tellthemachines Sep 4, 2023
5951c9a
Update gap control
tellthemachines Sep 4, 2023
38dbd2d
make icons pretty
tellthemachines Sep 4, 2023
e69c0b3
Conditionally display horizontal/vertical
tellthemachines Sep 4, 2023
268a437
Fix error in blocks with full align support
tellthemachines Sep 5, 2023
14da5cf
update content and wrap controls
SaxonF Sep 7, 2023
34bff07
fix alignment and spacing layout controls
SaxonF Sep 11, 2023
c38fae7
fix width/height bug
SaxonF Sep 11, 2023
f06216d
Fix error when block supports align is false
tellthemachines Sep 11, 2023
6e33ad6
Fix wrap bug
tellthemachines Sep 29, 2023
9a1bb27
Fix rebase issues
tellthemachines Jan 30, 2024
a8f1186
Fix align
tellthemachines Jan 30, 2024
865e750
Skip pesky tests
tellthemachines Jan 31, 2024
27dcb20
Fix e2e test
tellthemachines Jan 31, 2024
f418234
Fix alignment
tellthemachines Feb 5, 2024
4b9b395
Remove redundant props
tellthemachines Feb 5, 2024
c1e9334
Remove flex-basis
tellthemachines Feb 9, 2024
93aaaf0
fill width updates
SaxonF Feb 9, 2024
File filter

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
update content and wrap controls
  • Loading branch information
@SaxonF @tellthemachines
SaxonF authored and tellthemachines committed Feb 9, 2024
commit 14da5cf4a5cfa913de9969d7acc1460c261f1f3c
72 changes: 36 additions & 36 deletions packages/block-editor/src/hooks/layout.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -249,6 +249,7 @@ function LayoutPanelPure( { layout, style, setAttributes, name: blockName } ) {
{
key: 'fill',
value: 'fill',
__experimentalHint: 'Content fills width of container',
name: __( 'Fill' ),
},
];
Expand All @@ -257,6 +258,7 @@ function LayoutPanelPure( { layout, style, setAttributes, name: blockName } ) {
innerWidthOptions.unshift( {
key: 'fit',
value: 'fit',
__experimentalHint: 'Content only takes up as much space as needed',
name: __( 'Fit' ),
} );
}
Expand All @@ -265,6 +267,7 @@ function LayoutPanelPure( { layout, style, setAttributes, name: blockName } ) {
innerWidthOptions.unshift( {
key: 'theme',
value: 'theme',
__experimentalHint: 'Content width is set by theme',
name: __( 'Boxed' ),
} );
}
Expand Down Expand Up @@ -538,43 +541,40 @@ function LayoutPanelPure( { layout, style, setAttributes, name: blockName } ) {
</ToggleGroupControl>
</FlexBlock>
) }
<FlexBlock>
{ ( ( type === 'flex' &&
orientation === 'vertical' ) ||
type === 'default' ||
type === 'constrained' ) && (
<CustomSelectControl
label={ __( 'Content width' ) }
value={ selectedContentWidth }
options={ innerWidthOptions }
onChange={ onChangeInnerWidth }
__nextUnconstrainedWidth
__next36pxDefaultSize
/>
) }
{ type === 'flex' &&
orientation === 'horizontal' && (
<ToggleGroupControl
__nextHasNoMarginBottom
label={ __( 'Wrap' ) }
value={ flexWrap }
onChange={ onChangeWrap }
isBlock={ true }
>
<ToggleGroupControlOption
key={ 'wrap' }
value="wrap"
label={ __( 'Yes' ) }
/>
<ToggleGroupControlOption
key={ 'nowrap' }
value="nowrap"
label={ __( 'No' ) }
/>
</ToggleGroupControl>
) }
</FlexBlock>
<FlexBlock></FlexBlock>
</HStack>
{ type === 'flex' && orientation === 'horizontal' && (
<ToggleGroupControl
__nextHasNoMarginBottom
label={ __( 'Wrap' ) }
value={ flexWrap }
onChange={ onChangeWrap }
isBlock={ true }
>
<ToggleGroupControlOption
key={ 'wrap' }
value="wrap"
label={ __( 'Yes' ) }
/>
<ToggleGroupControlOption
key={ 'nowrap' }
value="nowrap"
label={ __( 'No' ) }
/>
</ToggleGroupControl>
) }
{ ( ( type === 'flex' && orientation === 'vertical' ) ||
type === 'default' ||
type === 'constrained' ) && (
<CustomSelectControl
label={ __( 'Content width' ) }
value={ selectedContentWidth }
options={ innerWidthOptions }
onChange={ onChangeInnerWidth }
__nextUnconstrainedWidth
__next36pxDefaultSize
/>
) }

{ type === 'grid' && (
<layoutType.inspectorControls
Expand Down