📚 Релиз 1.1.0 (2-е поколение, React)
Алоха! Большое обновление новой библиотеки
Изменения:
— Input/Select/Multiselect: Параметр
— InputNumberStepper: Исправлен цвет подсказки в состоянии ошибки
— InputDate/Select: Исправлено положение выпадающего меню в некоторых позициях
— Select: Теперь при повторном нажатии на выбранную опцию значение в поле ввода стирается и в
— Breadcrumbs/Select/Multiselect: Добавлен параметр
— Multiselect: Теперь при
— Multiselect: Теперь теги в поле ввода нельзя удалить в состоянии
— DropdownMenu: Добавлены свойства
— ToastNotification: Исправлено отображение уведомлений на мобильных разрешениях
— ToastNotification: Теперь можно задать уникальный
— PickerDate/InputDate: Добавлен новый параметр
— InputDate: Исправлена ошибка из-за которой в
— Tabs: Улучшено управление с клавиатуры. Фокус теперь работает корректно
— Textarea: Теперь при включённом
— Drawer/Modal: Теперь при
— Во многих компонентах исправлены описания типов
— Много исправлений и улучшений сторибука
Алоха! Большое обновление новой библиотеки
Изменения:
— Input/Select/Multiselect: Параметр
fixedLabel теперь работает корректно— InputNumberStepper: Исправлен цвет подсказки в состоянии ошибки
— InputDate/Select: Исправлено положение выпадающего меню в некоторых позициях
— Select: Теперь при повторном нажатии на выбранную опцию значение в поле ввода стирается и в
onChange возвращается пустая строка— Breadcrumbs/Select/Multiselect: Добавлен параметр
isSelectedItemColored— Multiselect: Теперь при
autocomplete = false выпадающее меню закрывается при повторном клике по полю ввода— Multiselect: Теперь теги в поле ввода нельзя удалить в состоянии
disabled— DropdownMenu: Добавлены свойства
height: fit-content и width: max-content для рут-элемента— ToastNotification: Исправлено отображение уведомлений на мобильных разрешениях
— ToastNotification: Теперь можно задать уникальный
id для компонента. Двух и более нотификаций с одинаковым id существовать на странице не может— PickerDate/InputDate: Добавлен новый параметр
defaultShownDate , который задаёт дату, на которой пикер отобразит календарь при открытии— InputDate: Исправлена ошибка из-за которой в
onChange при isRange = true и невалидной второй дате возвращалось прошлое значение второго аргумента— Tabs: Улучшено управление с клавиатуры. Фокус теперь работает корректно
— Textarea: Теперь при включённом
autoHeight текст в поле отображается корректно— Drawer/Modal: Теперь при
overlay = false скролл по странице не блокируется. После закрытия компонента не остаётся свойства overflow-y: unset на body— Во многих компонентах исправлены описания типов
— Много исправлений и улучшений сторибука
🔥5❤2👍2🥰1
📙 Релиз 7.12.0 (1-е поколение, React)
Алоха! Провели работу по улучшению первого поколения
Исправления:
— Multiselect: Добавлена регистронезависимость автокомплита
— Multiselect: Исправлена логика снятия фокуса с поля ввода
— Select: Исправлен баг, из-за которого, при включенном
— InputDate: Исправлена ошибка, из-за которой обрезалась последняя цифра года
— InputDate: Теперь дата в поле ввода меняется на ближайшую доступную при редактировании, при условии, что установлены
— TabsGroup: Убран параметр
— Dropdown/DropdownMenu: Добавлены два новых параметра:
— Modal/Drawer: Добавлены параметры
— Drawer: Теперь при
— ToastProvider: Добавлены параметры
— Улучшения и исправления в сторибуке
Алоха! Провели работу по улучшению первого поколения
Исправления:
— Multiselect: Добавлена регистронезависимость автокомплита
— Multiselect: Исправлена логика снятия фокуса с поля ввода
— Select: Исправлен баг, из-за которого, при включенном
clearable, список открывался не с первого раза— InputDate: Исправлена ошибка, из-за которой обрезалась последняя цифра года
— InputDate: Теперь дата в поле ввода меняется на ближайшую доступную при редактировании, при условии, что установлены
minDate/maxDate— TabsGroup: Убран параметр
iconPosition. Настроить положение иконки можно в TabsItem— Dropdown/DropdownMenu: Добавлены два новых параметра:
rootClassName и rootStyle. Параметры className и style назначаются на само выпадающее меню и могут быть использованы с useInPortal— Modal/Drawer: Добавлены параметры
overlayClassName и overlayStyle для передачи стилей в Overlay— Drawer: Теперь при
overlay = false скролл по странице не блокируется. После закрытия компонента не остаётся свойства overflow-y: unset на body— ToastProvider: Добавлены параметры
className и style для контейнера уведомлений— Улучшения и исправления в сторибуке
❤6👍4
🪲 Релиз 1.2.0 (2-е поколение, React)
Алоха! В эту версию включили ряд изменений для еще более стабильной работы.
Изменения:
— TabsGroup: Убран параметр
— DropdownMenu: Исправлена работа и внешний вид компонента при включённом
— DropdownMenu: Добавлено ограничение высоты выпадающего меню
— Tooltip/Popover: Исправлена работа параметра
— Tooltip: Теперь дефолтное значение для параметра
— Loader: Добавлен новый вариант —
— InputDate: Исправлена ошибка, из-за которой обрезалась последняя цифра года
— InputDate: Теперь дата в поле ввода меняется на ближайшую доступную при редактировании, при условии, что установлены
— Select: Добавлен параметр
— Storybook: Добавлен раздел
— Исправления сторибука
Алоха! В эту версию включили ряд изменений для еще более стабильной работы.
Изменения:
— TabsGroup: Убран параметр
iconPosition. Настроить положение иконки можно в TabsItem— DropdownMenu: Исправлена работа и внешний вид компонента при включённом
virtualScroll— DropdownMenu: Добавлено ограничение высоты выпадающего меню
— Tooltip/Popover: Исправлена работа параметра
pointerIsCentered— Tooltip: Теперь дефолтное значение для параметра
trigger — hover— Loader: Добавлен новый вариант —
dots— InputDate: Исправлена ошибка, из-за которой обрезалась последняя цифра года
— InputDate: Теперь дата в поле ввода меняется на ближайшую доступную при редактировании, при условии, что установлены
minDate/maxDate— Select: Добавлен параметр
iconPrefix— Storybook: Добавлен раздел
Icons— Исправления сторибука
👍3🔥3
❇️ Релиз 1.2.1 (2-е поколение, React)
Алоха! Добавили переход между сторибуками, а также улучшили работу компонентов
Изменения:
— Select: Исправлена логика работы
— Select: Исправлена работа
— Tooltip/Popover: Всплывающий элемент теперь не находится в
— DropdownMenu: Теперь высота выпадающего меню уменьшается в зависимости от количества опций внутри. Свойство
— InputPassword: Обновлён пример в сторибуке, положение каретки больше не сбрасывается при взаимодействии с
— Storybook: Добавлен переключатель между разными версиями Дизайн-системы
Алоха! Добавили переход между сторибуками, а также улучшили работу компонентов
Изменения:
— Select: Исправлена логика работы
clearable при включённом autocomplete и выбранном значении— Select: Исправлена работа
callback-функции onChange при контролируемом использовании. Теперь onChange не срабатывает при изменении value, только при вводе пользователя. Больше нельзя изменить выбранный элемент при заданном статичном value— Tooltip/Popover: Всплывающий элемент теперь не находится в
DOM-дереве до своего появления— DropdownMenu: Теперь высота выпадающего меню уменьшается в зависимости от количества опций внутри. Свойство
max-height: 280px можно перезаписать, задав css стили по классу dropdown-menu, либо через параметр style. Также рекомендуется выставить высоту при использовании с virtualScroll— InputPassword: Обновлён пример в сторибуке, положение каретки больше не сбрасывается при взаимодействии с
iconSuffix— Storybook: Добавлен переключатель между разными версиями Дизайн-системы
❤5👍1
📎 Релиз 1.3.0 (2-е поколение, React)
Алоха! Обновили пакет с иконками, привели к соответствию описания параметров и поправили несколько багов.
Изменения:
— Select: Исправлена проблема, из-за которой переданное значение не отображалось при асинхронной подгрузке опций
— Drawer/Modal/InlineNotification: Добавлен новый параметр
— ToastNotification: Добавлены два новых параметра —
— ToastNotification: Значение
— Loader: Цвет при
— Обновление и исправления описания в типах пропсов
— Улучшения и исправления в сторибуке
✏️ Изменения @atomaro/icons 1.0.3:
— Исправлена передача значений в параметры
— Значения для дефолтных цветов заменены на соответствующие токены из пакета
Алоха! Обновили пакет с иконками, привели к соответствию описания параметров и поправили несколько багов.
Изменения:
— Select: Исправлена проблема, из-за которой переданное значение не отображалось при асинхронной подгрузке опций
— Drawer/Modal/InlineNotification: Добавлен новый параметр
transitionProps, позволяющий настроить анимацию появления/исчезания компонента— ToastNotification: Добавлены два новых параметра —
transitionGroupProps и cssTransitionProps— ToastNotification: Значение
z-index для контейнера уведомлений заменено на токен —atmr-z-index-toast— Loader: Цвет при
type="dots" теперь соответствует дизайну— Обновление и исправления описания в типах пропсов
— Улучшения и исправления в сторибуке
✏️ Изменения @atomaro/icons 1.0.3:
— Исправлена передача значений в параметры
fill и secondaryColor в цветных иконках категорий Alert и Rating— Значения для дефолтных цветов заменены на соответствующие токены из пакета
@atomaro/themes. Цвет иконок не поменялся👍4🔥2
🎆 Алоха! Привет-привет! Салют! 🎆
У нас радостная новость для всех, кто ждал дизайн-систему на Vue.js. Вы просили — мы сделали, протестировали и уже опубликовали Vue.js версию дизайн-системы Атомаро (Дизайн-системы Ростелекома) 2-го поколения.
Функциональность элементов системы в React и Vue идентична, те же компоненты, возможности, правила и дизайн-токены. Пакет с CSS-стилями (темы) единый для двух фреймворков. Нейминг некоторых пропсов может отличаться, чтобы следовать привычной логике Vue.js.
Написать новую версию дизайн-системы в короткий срок — большая и сложная задача. Нам помогла новая архитектура Атомаро 2-го поколения, вынесенные отдельно стили. И наши контрибьюторы из команды разработки «Личного кабинета юридического лица». Александр Меркулов, Даниил Галкин, Егор Мальцев, Сергей Чуян — наши герои, спасибо вам за помощь! 🙌
❗️Подключайте дизайн-систему к проектам на Vue.js, пишите нам о своем опыте использования, мы всегда открыты и готовы помочь.
У нас радостная новость для всех, кто ждал дизайн-систему на Vue.js. Вы просили — мы сделали, протестировали и уже опубликовали Vue.js версию дизайн-системы Атомаро (Дизайн-системы Ростелекома) 2-го поколения.
Функциональность элементов системы в React и Vue идентична, те же компоненты, возможности, правила и дизайн-токены. Пакет с CSS-стилями (темы) единый для двух фреймворков. Нейминг некоторых пропсов может отличаться, чтобы следовать привычной логике Vue.js.
Написать новую версию дизайн-системы в короткий срок — большая и сложная задача. Нам помогла новая архитектура Атомаро 2-го поколения, вынесенные отдельно стили. И наши контрибьюторы из команды разработки «Личного кабинета юридического лица». Александр Меркулов, Даниил Галкин, Егор Мальцев, Сергей Чуян — наши герои, спасибо вам за помощь! 🙌
❗️Подключайте дизайн-систему к проектам на Vue.js, пишите нам о своем опыте использования, мы всегда открыты и готовы помочь.
🔥7👍6❤2
🎄 Релиз 1.4.0 (2-е поколение, React)
Алоха! Предновогоднее обновление с новым переключением тем
✨ atomaro/themes 2.1.0
— Реализовали ссылочную систему для css-переменных
— Добавили описания ко всем токенам в темах
— Добавили классы для каждой темы Ростелекома:
•
•
•
•
— Инструкция по работе с классами в темах представлена на отдельной странице
✨ atomaro/icons 1.0.4
— Заменили кириллицу в названии иконок
— Убрано предупреждение о неправильном названии атрибута
✨ atomaro/ui-kit 1.4.0
— Box: Новый компонент. Служит оберткой для других компонентов, управляя их расположением и обеспечивая консистентность и эффективность в разработке интерфейсов
— BREAKING CHANGE! Stepper: Убран параметр
— Multiselect: Исправлена ситуация, при которой фокус не снимался при повторном нажатии на поле ввода
— Select: Теперь вызов колбеков
— Multiselect: Убраны лишние вызовы
— Multiselect: Исправлено отображение при включённом
— ToastNotificationsProvider: Теперь можно импортировать по относительному пути из
— Обновили документацию и исправили недочёты в сторибуке
Алоха! Предновогоднее обновление с новым переключением тем
✨ atomaro/themes 2.1.0
— Реализовали ссылочную систему для css-переменных
— Добавили описания ко всем токенам в темах
— Добавили классы для каждой темы Ростелекома:
•
rostelecom-default-dark.css — .Theme_root_rtk_default_dark•
rostelecom-default-light.css — .Theme_root_rtk_default_light•
rostelecom-purple-dark.css — .Theme_root_rtk_purple_dark•
rostelecom-purple-light.css — .Theme_root_rtk_purple_light— Инструкция по работе с классами в темах представлена на отдельной странице
✨ atomaro/icons 1.0.4
— Заменили кириллицу в названии иконок
EqualiserClear, Speed1x, Speed2x, Speed4x, Speed6x, Speed8x, Cookie— Убрано предупреждение о неправильном названии атрибута
clipRule в консоли✨ atomaro/ui-kit 1.4.0
— Box: Новый компонент. Служит оберткой для других компонентов, управляя их расположением и обеспечивая консистентность и эффективность в разработке интерфейсов
— BREAKING CHANGE! Stepper: Убран параметр
colorScheme. Теперь компонент представлен в двух вариантов — primary и secondary— Multiselect: Исправлена ситуация, при которой фокус не снимался при повторном нажатии на поле ввода
— Select: Теперь вызов колбеков
onBlur и onChange происходит в правильном порядке— Multiselect: Убраны лишние вызовы
onChange при использовании компонента— Multiselect: Исправлено отображение при включённом
virtualScroll— ToastNotificationsProvider: Теперь можно импортировать по относительному пути из
@atomaro/ui-kit— Обновили документацию и исправили недочёты в сторибуке
🔥5❤1👍1🏆1
🎄 Релиз 1.1.0 (2-е поколение, Vue)
Хо хо хо! Предновогоднее обновление с новым переключением тем для Vue
✨ atomaro/themes 2.1.0
— Реализовали ссылочную систему для css-переменных
— Добавили описания ко всем токенам в темах
— Добавили классы для каждой темы Ростелекома:
•
•
•
•
— Инструкция по работе с классами в темах представлена в Сторибуке
✨ atomaro/vue-icons 1.0.1
— Заменили кириллицу в названии иконок
— Убрано предупреждение о неправильном названии атрибута
✨ atomaro/vue-ui-kit 1.1.0
— Box: Новый компонент. Служит оберткой для других компонентов, управляя их расположением и обеспечивая консистентность и эффективность в разработке интерфейсов
— Storybook: исправлен баг при котором открывающиеся списки перекрывали таблицу с props
— BREAKING CHANGE! Stepper: Убран параметр
— Multiselect: Исправлена ситуация, при которой фокус не снимался при повторном нажатии на поле ввода
— Multiselect: Исправлено отображение при включённом
Хо хо хо! Предновогоднее обновление с новым переключением тем для Vue
✨ atomaro/themes 2.1.0
— Реализовали ссылочную систему для css-переменных
— Добавили описания ко всем токенам в темах
— Добавили классы для каждой темы Ростелекома:
•
rostelecom-default-dark.css — .Theme_root_rtk_default_dark•
rostelecom-default-light.css — .Theme_root_rtk_default_light•
rostelecom-purple-dark.css — .Theme_root_rtk_purple_dark•
rostelecom-purple-light.css — .Theme_root_rtk_purple_light— Инструкция по работе с классами в темах представлена в Сторибуке
✨ atomaro/vue-icons 1.0.1
— Заменили кириллицу в названии иконок
EqualiserClear, Speed1x, Speed2x, Speed4x, Speed6x, Speed8x, Cookie— Убрано предупреждение о неправильном названии атрибута
clipRule в консоли✨ atomaro/vue-ui-kit 1.1.0
— Box: Новый компонент. Служит оберткой для других компонентов, управляя их расположением и обеспечивая консистентность и эффективность в разработке интерфейсов
— Storybook: исправлен баг при котором открывающиеся списки перекрывали таблицу с props
— BREAKING CHANGE! Stepper: Убран параметр
colorScheme. Теперь компонент представлен в двух вариантах — primary и secondary— Multiselect: Исправлена ситуация, при которой фокус не снимался при повторном нажатии на поле ввода
— Multiselect: Исправлено отображение при включённом
virtualScroll❤3👍3🔥3
📚 Релиз 1.5.0 (2-е поколение, React) и 1.2.0 (Vue)
Алоха! Первый релиз в новом году. Улучшили работу компонентов и добавили новый пропс
📙 atomaro/vue-ui-kit 1.2.0 и atomaro/ui-kit 1.5.0
— Select: добавлен новый
— Modal: Изменены
— Drawer, Modal, Floating Action Button: исправлена работа
— InputDate: При повторном клике на иконку не закрывался календарь. Исправлено
— Slider: При включённом
📗 atomaro/vue-ui-kit 1.2.0
— DropdownMenu: Исправлена ошибка, при которой
— Tabs: исправлена ошибка рендера табов при использовании цикла
Алоха! Первый релиз в новом году. Улучшили работу компонентов и добавили новый пропс
📙 atomaro/vue-ui-kit 1.2.0 и atomaro/ui-kit 1.5.0
— Select: добавлен новый
prop deselectEnabled, переключающий возможность отмены выбора при повторном клике на опцию— Modal: Изменены
css-стили в компоненте. Убраны статически заданный отступ в контейнере и скругление— Drawer, Modal, Floating Action Button: исправлена работа
Overlay. Tеперь при использовании нескольких компонентов на странице оверлеи не накладываются друг на друга— InputDate: При повторном клике на иконку не закрывался календарь. Исправлено
— Slider: При включённом
disabled можно было выбрать значение по клику на трек. Исправлено📗 atomaro/vue-ui-kit 1.2.0
— DropdownMenu: Исправлена ошибка, при которой
divider выбирался как значение в Select— Tabs: исправлена ошибка рендера табов при использовании цикла
👍5❤1
Аллоха! 🧤
В этом году мы будем активно развивать возможности Атомаро (2-го поколения). Наполнять систему новыми компонентами и инструментами для ускорения вашей работы.
Хотим поделиться с вами планами на год и первый квартал. Мы добавили новый раздел “Roadmap” в Сторибуке, чтобы актуальная дорожная карта всегда был под рукой. Со временем она будет обновляться.
Посмотреть планы развития Дизайн-системы
Выпуск багфиксов по-прежнему в приоритете. Мы ждём любую обратную связь от вас. Пишите чего вам не хватает в Дизайн-системе, уточняйте планы, предлагайте новую функциональность. На связи!
В этом году мы будем активно развивать возможности Атомаро (2-го поколения). Наполнять систему новыми компонентами и инструментами для ускорения вашей работы.
Хотим поделиться с вами планами на год и первый квартал. Мы добавили новый раздел “Roadmap” в Сторибуке, чтобы актуальная дорожная карта всегда был под рукой. Со временем она будет обновляться.
Посмотреть планы развития Дизайн-системы
Выпуск багфиксов по-прежнему в приоритете. Мы ждём любую обратную связь от вас. Пишите чего вам не хватает в Дизайн-системе, уточняйте планы, предлагайте новую функциональность. На связи!
🔥8👍1
🟣 Релиз 7.12.2 (1-е поколение, React)
Алоха! Пара небольших, но важных исправлений в первом поколении
Изменения:
— SegmentedControl: Добавлен атрибут
— PickerDate: Теперь параметры
Алоха! Пара небольших, но важных исправлений в первом поколении
Изменения:
— SegmentedControl: Добавлен атрибут
aria-checked в Segment для отслеживания состояния— PickerDate: Теперь параметры
minDate и maxDate задают состояние disabled не только для дней, но и для месяцев и годов👍4🔥2
🌱 Релиз 1.6.0 (2-е поколение, React)
C наступлением весны! Мы подготовили новый компонент для ваших проектов и почистили зависимости в ui-kit
— Pagination: новый компонент. Позволяет переключаться между страницами в приложении, либо выводить нужное количество строк в таблице. Предусмотрено несколько типов отображения пагинации, дополнительные контролы и версия для отображения на мобильных устройствах. Примеры в Сторибуке
— Оптимизировали зависимости в пакете
C наступлением весны! Мы подготовили новый компонент для ваших проектов и почистили зависимости в ui-kit
— Pagination: новый компонент. Позволяет переключаться между страницами в приложении, либо выводить нужное количество строк в таблице. Предусмотрено несколько типов отображения пагинации, дополнительные контролы и версия для отображения на мобильных устройствах. Примеры в Сторибуке
— Оптимизировали зависимости в пакете
👍8
Релиз 1.3.0 (Vue)
Алоха! Продолжаем развивать компоненты и повышать качество их работы. Добавили отображение дизайн-токенов в Storybook, как базовых, так и всех компонентных
Новые возможности:
— InputDate: Добавлена возможность выбирать один и тот же день в формате
— Design Tokens: В
Исправлено:
— Slider: исправлена проблема с событием
— Typography: Добавили токен
— Input: исправлена работа фокуса
— DropdownMenu: переработаны пропсы, некоторые скоро будут удалены, подробнее в документации к компоненту
— SegmentedControl: исправлена работа
— Box: исправили проблему с импортом компонента по относительному пути и ошибку с зависимостями компонента
— Core: исправлена проблема использования нескольких тем на странице
— atomaro/cli: удалена из зависимостей
Алоха! Продолжаем развивать компоненты и повышать качество их работы. Добавили отображение дизайн-токенов в Storybook, как базовых, так и всех компонентных
Новые возможности:
— InputDate: Добавлена возможность выбирать один и тот же день в формате
isRange— Design Tokens: В
Storybook в сторях у каждого компонента добавилась вкладка с возможностью просматривать и редактировать токены. Так же добавился новый раздел DESIGN TOKENS с описанием базовых дизайн-токеновИсправлено:
— Slider: исправлена проблема с событием
change, которое не вызывалось при перетаскивании ползунка— Typography: Добавили токен
letter-spacing для вариантов description— Input: исправлена работа фокуса
— DropdownMenu: переработаны пропсы, некоторые скоро будут удалены, подробнее в документации к компоненту
— SegmentedControl: исправлена работа
v-model— Box: исправили проблему с импортом компонента по относительному пути и ошибку с зависимостями компонента
— Core: исправлена проблема использования нескольких тем на странице
— atomaro/cli: удалена из зависимостей
👍6
Релиз 1.7.0 (2-е поколение, React)
Алоха! Продолжаем развивать компоненты и повышать качество их работы. Добавили отображение дизайн-токенов в Storybook, как базовых, так и всех компонентных
Новые возможности:
— InputDate: Добавлена возможность выбирать один и тот же день в формате
— Design Tokens: в
Исправлено:
— Typography: Добавили токен
— InputDate: Исправлена ошибка SSR, из-за которой было невозможно выбрать вторую дату при
— Input: Исправлена ошибка фокуса
— DropdownMenu: Переработаны пропсы, некоторые скоро будут удалены, подробнее в документации к компоненту
Алоха! Продолжаем развивать компоненты и повышать качество их работы. Добавили отображение дизайн-токенов в Storybook, как базовых, так и всех компонентных
Новые возможности:
— InputDate: Добавлена возможность выбирать один и тот же день в формате
isRange— Design Tokens: в
Storybook в сторях у каждого компонента добавилась вкладка с возможностью просматривать и редактировать токены. Так же добавился новый раздел DESIGN TOKENS с описанием базовых дизайн-токеновИсправлено:
— Typography: Добавили токен
letter-spacing для вариантов description— InputDate: Исправлена ошибка SSR, из-за которой было невозможно выбрать вторую дату при
useInPortal = false— Input: Исправлена ошибка фокуса
— DropdownMenu: Переработаны пропсы, некоторые скоро будут удалены, подробнее в документации к компоненту
👍6🔥2