0 Fork 0

mirror of https://github.com/webstudio-is/webstudio.git synced 2026-11-09 05:26:24 +09:00

T

Oleg Isonen fd7d34d312 Allow button children and inner text over properties (#1203 )

Fixes https://github.com/webstudio-is/webstudio-builder/issues/1198

## Description

- Button has a standard behavior with space key pressed that can't be
turned off, so we can't type a space
- Even if we work around the space behavior somehow, we still don't have
an ability for rich-text to accept any instance and that makes a use
case for icon button and button with icon on left/right impossible

The solution I went for is to make it container for accepting child
instances and edit text using InnerText property. This may be not as
intuitive as direct rich-text but its more capable.

Webflow does the same thing for a form button, though it uses an input
element.

<img width="1082" alt="Screenshot 2023-03-09 at 03 10 05"
src="https://user-images.githubusercontent.com/52824/223898596-a4aae718-32d6-4090-a6f9-3d883b587ef7.png">



## Steps for reproduction

1. add button
1. change inner text
1. add image or text components

## Code Review

- [ ] hi @TrySound , I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview
- [ ] @taylornowotny - please test 

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio-builder/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env.example`
and the `builder/env-check.js` if mandatory

2023-03-09 11:37:25 +01:00