-
Notifications
You must be signed in to change notification settings - Fork 4.3k
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.
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
InputControl: Fix labelPosition rendering with new ui/flex component #29226
Conversation
Size Change: +42 B (0%) Total Size: 1.38 MB
ℹ️ View Unchanged
|
storybook/main.js
Outdated
webpackFinal: async ( config ) => { | ||
// Find the DefinePlugin | ||
const plugin = config.plugins.find( | ||
( p ) => p.definitions?.[ 'process.env' ] |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is causing an error for me when I run storybook:dev
:
[1] ERR! /Users/sara/projects/gutenberg/storybook/main.js:29
[1] ERR! ( p ) => p.definitions?.[ 'process.env' ]
[1] ERR! ^
[1] ERR!
[1] ERR! SyntaxError: Unexpected token '.'
[1] ERR! at wrapSafe (internal/modules/cjs/loader.js:915:16)
[1] ERR! at Module._compile (internal/modules/cjs/loader.js:963:27)
[1] ERR! at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)
[1] ERR! at Module.load (internal/modules/cjs/loader.js:863:32)
[1] ERR! at Function.Module._load (internal/modules/cjs/loader.js:708:14)
[1] ERR! at Module.require (internal/modules/cjs/loader.js:887:19)
[1] ERR! at require (internal/modules/cjs/helpers.js:74:18)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Interesting! It was fine for me. Lemme fix :)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM and tests great, thanks!
In this update, the
InputControl
component was updated to fix thelabelPosition
rendering.The issue was caused by how the previous vs. new ui/flex component rendered styles.
During the
ui/flex
integration, theinput-control/input-base
was flipped to use the__unstableVersion
ofnext
for Flex.Below is a screenshot of this working for the
SelectControl
component (from Storybook)Another adjustment was to Storybook itself. The webpack config was modified so that Storybook can correctly render components targeted/wrapped with "next" components.
This issue was recently discovered here:
#29159 (review)
How has this been tested?
Tested in local Storybook and in Gutenberg
labelPosition
knob to another valueChecklist: