Build an inline edit control (34)

[minevskiy]

SFX Dashboards have custom inline input fields which should be replaced with accessible ones. An inline input is rendered as a label by default. When clicked (or tabbed in), it's rendered as an input. When the focus is lost, the current input value is saved and the input is rendered as a label again.

Acceptance criteria:

• The best example is found on the Panels page https://core-202.lightningdesignsystem.com/components/panels (Click on Form with Inline Edit & Form with Inline Edit Active to see the different states).
• Inline edit control that looks like a label but shows an edit button
• A user can edit the text shown within the control
• Control only supports text. No emoji or image support.
• Must be accessibility compliant

[arunjeetsingh]

From @jamin-hall

"Keith Willoughby's team is working on a project that will need to leverage the inline form pattern from SLDS. The best example is found on the Panels page https://core-202.lightningdesignsystem.com/components/panels (Click on Form with Inline Edit & Form with Inline Edit Active to see the different states)."

[arunjeetsingh]

@tweettypography @interactivellama The inline edit issue I was talking about. @jamin-hall provided details about where it is in the lightning design system.

[arunjeetsingh]

@minevskiy I assume you guys still need this for 204?

[minevskiy]

@arunjeetsingh , yes, we still need it to be accessibility compliant.