Open eolme opened 8 months ago
Привет! Такое мы правили, но ещё не релизили, можно попросить проверить, исправилось ли на свежей версии?
Можно установить версию с этого билда
@BlackySoul
Версия ^5 и ^6-beta
@BlackySoul
Версия ^5 и ^6-beta
Это для 6-beta, могу подготовить для v5, если так будет удобнее проверить
Привет! Такое мы правили, но ещё не релизили, можно попросить проверить, исправилось ли на свежей версии?
Можно установить версию с этого билда
У v5 не воспроизводится, а на 6 бэтке билд указаный вами уже с фиксом
вот пример с фиксом https://codesandbox.io/p/sandbox/silly-lamport-ls4g4j
@levtsypanov не вижу CSS Modules
@BlackySoul что изменилось то? Вот строка, все те же стили и в твоей ветке: https://github.com/VKCOM/VKUI/blob/6cdce09c895ff7c556896643a5ded8a1cf295c1c/packages/vkui/src/components/Clickable/Clickable.module.css#L30
@levtsypanov не вижу CSS Modules
@BlackySoul что изменилось то? Вот строка, все те же стили и в твоей ветке:
Конкретно в той ветке - ничего, что касается Tappable
, это просто самая свежая на данный момент версия была
По Tappable
вливали такое изменение, на тестовых наших средах помогло, если у тебя не так, то поделись, пожалуйста, что используешь (cra/next, какие сборщики и т.п.)
Импорты CSS Modules вообще говоря не гарантируют порядок, как бы не хотелось, и какими-либо хаками тут не хотелось бы обойтись, нужно либо поддерживать атомарность, без пересечений и переопределений с одинаковой специфичностью, как вариант можно решать теми же vkuiInternal
, либо явным разделением переопределений по флагам из пропов
Импорты CSS Modules вообще говоря не гарантируют порядок, как бы не хотелось, и какими-либо хаками тут не хотелось бы обойтись, нужно либо поддерживать атомарность, без пересечений и переопределений с одинаковой специфичностью, как вариант можно решать теми же
vkuiInternal
, либо явным разделением переопределений по флагам из пропов
Соглы, это одна из проблем CSS Modules 😞
Такой импорт не панацея, но частично должен решить проблему, по-крайней мере с Tappable
.
Этот issue можно отнести к вот этой задаче:
На самом деле эту проблему можно попробовать решить с помощью @layer.
layers.css
@layer vkui.clickable, vkui.tappable;
@layer vkui.tappable, vkui.button;
Clickable.module.css
@layer vkui.clickable {
...
}
Tappable.module.css
@layer vkui.tappable {
...
}
Button.module.css
@layer vkui.button {
...
}
Есть только проблема того, что layers.css должен импортироваться раньше всех
Описание
Например, при импорте
Button
порядокЧто приводит к тому, что
Clickable
перезаписывает правилаTappable
иButton
и тдК тому же правила внутри очень сильно друг друга переназначают, например, специфичность
Clickable > *
выше чемTappable_Tappable__stateLayer
и ripple effect рисуется неправильноВерсия
^5 и ^6-beta
В каких браузерах воспроизводится проблема?
No response
Шаги воспроизведения
No response
Ожидаемое поведение
No response
Скриншоты
https://github.com/VKCOM/VKUI/assets/11076888/9c018c97-a921-4ba1-bb8d-08f5d3c034a6
Пример с воспроизведением
No response