Если есть JSON схема, то да моя библиотека должна вам помочь, конечно там не всё реализовано, но простые формы рисует.

Спасибо за пинг 😊

Прикольно, но доки не помешают👍🏻хоть ридми на вход

Валидация https://codechips.me/svelte-form-validation-with-yup/

А у тя AJV...

В самом конце проекта впервые столкнулся с ситуацией, когда нужен JSX, и чтобы его придумать, нужно городить костыли.

Делаю я, значит, красивый онбординг (видосик приложу). Визуальный компонент для онбординга реюзабельный, конечно. Хочет он принимать текст какой-то через слоты. А вёрстка накладывает ограничения: весь текст должен быть строго в <span> с определённым классом.
Варианта два: все потребители контента должны быть об этом в курсе или… экшен.

Вот сейчас я в компоненте же онбординга делаю такую вот грязюку, у всех потребителей её импортирую и вешаю на элемент слота с текстами. Как считаете, аукнется мне это или нет?

  export const textAction: Action = node =>
    node.querySelectorAll('p').forEach((el: HTMLParagraphElement) => {
      const span = document.createElement('span');
      span.className = 'back';
      span.innerHTML = el.innerHTML;
      el.innerHTML = '';
      el.appendChild(span);
    });

  export const textAction: Action = node =>
    node.querySelectorAll('p').forEach((el: HTMLParagraphElement) => {
      const span = document.createElement('span');
      span.className = 'back';
      span.innerHTML = el.innerHTML;
      el.innerHTML = '';
      el.appendChild(span);
    });

У меня сейчас только одна мысль: должно быть нельзя реактивно обновить контент в слотах, но у меня такого нет. Так что, по идее, всё шито-крыто.

В этом нужен span?

https://css-tricks.com/multi-line-padded-text/

Ага.
Хотел использовать крутое решение про box-decoration-break, а он сломан, если text-align:right, поэтому пришлось использовать метод про box-shadow. Одинаково хороши.

А я не понял в чем трабл про слоты, сорян...

Хочется:

<Onboarding>
  <div slot='text'>
    <p>Тут текст</p>
  </div>
</Onboarding>

, а надо:

<Onboarding>
  <div slot='text'>
    <p><span class='back'>Тут текст</span></p>
  </div>
</Onboarding>

И вот span.back надо множить на все параграфы. Это и плохо, потому что потребитель компонента ничего об этом span не знает, и банально не хочется повторяться.

В реакте-то можно б было придумать решений этой проблемы, которые бы оставили простой API surface компонента и убрали бы дублирование.

<Onboarding>
  <div slot='text'>
    <p>Тут текст</p>
  </div>
</Onboarding>

<Onboarding>
  <div slot='text'>
    <p><span class='back'>Тут текст</span></p>
  </div>
</Onboarding>

Ага. Уже понятнее )

А параграфов может быть несколько?

Ага. Они еще могут быть внутри дивов и всё такое.

Ёмана... типа строка с хтмл прилетает в Слот?

Ну обычный слот, да

Как сломан?

http://jsfiddle.net/cLh0onv3/1/