Исправил. Опечатка была.

разве при отсутствии явного импорта не должна быть ошибка вообще?

Исправил.

окей, понял

ну тут собственно 2 кейса

два стула... ты хотел написать

Стул и табуретка.

1. мы что-то поместили в компонент. то есть мы прям явно перетянули какую-то кнопку на какую-то форму. 2. мы сделали новый компонент и поместили в него кнопку, а этот новый компонент поместили в форму

ну то есть это не синонимичные вещи, во втором кейсе возникает новый компонент в принципе, а в первом - нет

Стул и табуретка.

Ты пишешь на JSX, как все нормальные люди. Или...

1. мы что-то поместили в компонент. то есть мы прям явно перетянули какую-то кнопку на какую-то форму. 2. мы сделали новый компонент и поместили в него кнопку, а этот новый компонент поместили в форму

Напиши реализацию на псевдокоде, и всё поймёшь.

Например на гипотетическом XML.

Напиши реализацию на псевдокоде, и всё поймёшь.

ну ты же вроде бы её сам написал, чем плох твой пример?

ну ты же вроде бы её сам написал, чем плох твой пример?

Я имел ввиду, напиши реализацию на своём гипотетическом систаксисе.

И ты увидишь, что уттебя там 2 кейса будет при каждой вложенности.

Я имел ввиду, напиши реализацию на своём гипотетическом систаксисе.

каком гипотетическом синтаксисе? я хочу использовать jsx)

в ооообщем, за время этого диалога я успел немного подбухнуть

мб и правда что-то ускользает от моего орлиного взора

Вот теперь я запутался.

так что вернёмся к нему после праздников, я постараюсь накидать какой-нибудь прототипчик за эти выходные

?

я тут ща набрасываю))

Упрощай.

Пока что, тебе нужно всего 3 компонента.

Пока что, тебе нужно всего 3 компонента.

3? может два? это все же дерево, root-pane и list

3? может два? это все же дерево, root-pane и list

list?

3? может два? это все же дерево, root-pane и list

Один базовый, хранит состояние, содержит логику общего рендера (там много что будет интересного). Второй — область. Третий — кнопка, которую можно перетаскивать.

list?

ну типа лист в дереве, не пришло в голову быстро правильное название)

3? может два? это все же дерево, root-pane и list

Ну, это понятно. Но это только с точки зрения данных дерево.

Один базовый, хранит состояние, содержит логику общего рендера (там много что будет интересного). Второй — область. Третий — кнопка, которую можно перетаскивать.

я не очень понимаю ход твоих мыслей)

Ну, это понятно. Но это только с точки зрения данных дерево.

можно и с точки зрения рендера

я не очень понимаю ход твоих мыслей)

Я думаю о том, как сделать механизм ресайза.

Наиболее безболезненный вариант — отдельная граница-кнопка, которая плавает над всем вот этим вот.

и как сделать минимальный реконсилейшен при всей этой структуре тоже вопрос

По драг-старт она подписывает на себя родительский компонент, и он меняет свой стейт в соответствии с её положением.

Под драг-стоп — отписывает.

Профит.

Конечно же, нужно будет делать debounce, но это оптимизация, и отложим на потом.

ладно, это всё звучит не сложно

ладно, это всё звучит не сложно

Сложность в том, чтобы из списка сделать много квадратиков ;)

Вот здесь ты потрахаешься.

сложность в том, если нужен динамический контент чтобы панелей можно было делать не 2 а много

Список ты должен превратить в сетку.

список я думал деревце сделать

а вроде монга сама умеет

да очень удобно. все получилось спсб

Хм... А ты не опасаешься, что у тебя тогда там всякие рекурсии появятся? Они всё усложнят.

Я бы реализовал математический алгоритм рассчёта размеров областей.

И для него отдельные тесты накидал бы.

список я думал деревце сделать

все правильно мыслишь

да тут другая тема надо чтобы главную рабочую область можно было разделить как захочется юзеру

я поэтому и говорил про веса) то есть элементы на одном уровне вложенности должны боротся за свободное место в родительском элементе

и чтобы можно было на левую/правую панель добавить несколько панелек

и притом иметь ресайз ручной

Я бы пильнул компонент. Интересная идея. Для фана, ибо практического профита пока нет.

копец... чувствую себя странно

Я бы пильнул компонент. Интересная идея. Для фана, ибо практического профита пока нет.

попробуй может что получится мне все равно это пилить и потом опенсорсить

я поэтому и говорил про веса) то есть элементы на одном уровне вложенности должны боротся за свободное место в родительском элементе

Тогда сложно будет делать ресайз. Нельзя эту логику делегировать CSS.

Тогда сложно будет делать ресайз. Нельзя эту логику делегировать CSS.

ниче не сложно. в чем конкретно сложность то?

Тогда сложно будет делать ресайз. Нельзя эту логику делегировать CSS.

мне так тож говорили можно, если достаточно правильно подойти к теме

попробуй может что получится мне все равно это пилить и потом опенсорсить

Я могу присоединиться чисто гипотетически. Хоя вероятнее всего, забью х, т.к. дел дофига.

а по факту svg здесь только линии, остальное делает flexbox

ниче не сложно. в чем конкретно сложность то?

Юзер захочет поставить границу в определённом месте. Это может быть соотношение далеко не дискретных значений. Эти веса высчитывать придётся.

Не проще ли измерять это в пикселях от границы родительского контейнера?

ERROR: S client not available

Простота и гибкость.

Не проще ли измерять это в пикселях от границы родительского контейнера?

я тоже об этом думал как раз

Юзер захочет поставить границу в определённом месте. Это может быть соотношение далеко не дискретных значений. Эти веса высчитывать придётся.

согласен, это вот и есть математический расчет лэйаута

согласен, это вот и есть математический расчет лэйаута

Это мат. рассчёт положения границы. И он избыточен, когда его может не быть.

Ну как, не быть.

Он может быть проще.

непонятно только как строить это всё при рендере передаешь ему структуру данных он отрисовал, а как ему сказать, что пихать внутрь каждой панели..

А у компонента области свойство direction. И он создаёт рекурсию на себя, с direction={!props.direction}

Сделай так, чтобы просто сначала отрендерилась структура без поведения.

Без рассчёта.

какой бойлер взять? я то хз чем тут люди пользуются

А пропс direction пусть будет CSS-свойством flex-direction.

вот и готова у тебя дом-структура.

А у компонента области свойство direction. И он создаёт рекурсию на себя, с direction={!props.direction}

Это псевдокод, конечно же. Там не будет приведения к булеву.

какой бойлер взять? я то хз чем тут люди пользуются

Я для компонентов ничем не пользовался ещё.

для приложения

тестить же надо где-то

Мне недавно понадобилась фигня одна найти нигде не могу: Нужны панели на реакте, панели вроде как в IDE, перемещать можно по экрану, в панелях что-то размещать, изменять размер

вроде такого? https://github.com/STRML/react-grid-layout

https://camo.githubusercontent.com/8c68a2e6d6e01364247232267a5698ac0d9b63c6/687474703a2f2f692e696d6775722e636f6d2f6f6f314e5436632e676966

оооуу

воооууу

очень близко!!!

Подскажите карусель для реакта

очень близко!!!

там по сути можно ядро только использовать и намутить то, что тебе нужно

вроде такого? https://github.com/STRML/react-grid-layout

только оч странно он к верху прижимает

там по сути можно ядро только использовать и намутить то, что тебе нужно

ядро можно отдельно заимпортить?

ядро можно отдельно заимпортить?

под ядром я имел в виду draggable и resizable компонент, плюс насколько помню там есть контейнер для этого всего

наверняка настраивается

а там уже в своих компонентах подпиливаешь и все

ооо офигенно

этот проект состоит из неск проектов того же чувака

только оч странно он к верху прижимает

...вот без прилипаний https://strml.github.io/react-grid-layout/examples/11-no-vertical-compact.html