Об этом проекте
Webcore UI (название пакета webcoreui) — это библиотека UI-компонентов с открытым исходным кодом от Frontendland. В README она описывается как настраиваемая библиотека компонентов Astro UI, стилизованная с помощью Sass, с поддержкой Svelte и React. Ее можно использовать как отдельный проект или интегрировать в существующие экосистемы Astro, Svelte или React; компоненты импортируются из webcoreui/astro, webcoreui/svelte или webcoreui/react. Документация доступна на сайте webcoreui.dev, включая инструкции по установке и визуальный конструктор.
Начать работу можно с помощью CLI через команду npm create webcore@latest. CLI позволяет создать новый проект Webcore, обновить конфигурационные файлы для существующего проекта Astro или создать проект из именованного шаблона, такого как Portfolio. Также возможна ручная установка с помощью npm i webcoreui или yarn add webcoreui. В проектах Astro добавляется интеграция webcore() в astro.config.mjs. В README указаны предварительные требования: Sass v1.100 и TypeScript v5.9, а также Astro v5.18 для Astro, Svelte v5.55 для Svelte и React/React DOM v19.2 для React. Также рекомендуется опционально добавить astro-purgecss для оптимизации размера CSS-бандла.
Настройка стилей осуществляется с помощью файла webcore.config.scss и глобального SCSS-файла, который вызывает миксин настройки webcoreui/styles. Параметры настройки включают includeResets, includeUtilities, includeTooltip, includeScrollbarStyles, includeBreakpoints, theme и themes. В README задокументированы CSS-переменные для настройки стилей компонентов с примерами для Avatar, Banner, BottomNavigation, Checkbox, Collapsible, Counter, Masonry, Progress, Radio, RangeSlider, Rating, Ribbon, полос прокрутки, Skeleton, Slider, SpeedDial, Spinner, Spoiler, Stepper, Switch, ThemeSwitcher, Timeline, Tooltips, радиуса границ и стилей блоков, таких как страница ошибки.
Репозиторий организует элементы построения интерфейса на компоненты, блоки и шаблоны. В списке компонентов значатся Accordion, Alert, AspectRatio, Avatar, Badge, Banner, BottomNavigation, Breadcrumb, Button, Card, Carousel, Checkbox, Collapsible, ConditionalWrapper, ContextMenu, Copy, Counter, DataTable, Flex, Footer, Grid, Group, Icon, Image, ImageLoader, Input, Kbd, List, Masonry, Menu, Modal, OTPInput, Pagination, Popover, Progress, Radio, RangeSlider, Rating, Ribbon, Select, Sheet, Sidebar, Skeleton, Slider, SpeedDial, Spinner, Spoiler, Stepper, Switch, Table, Tabs, Textarea, ThemeSwitcher, Timeline, Toast и Tooltip. Блоки включают Author, AvatarWithRating, BlogCard, CheckboxGroup, ComponentMap, DeviceMockup, Empty, ErrorPage, ExpandableTable, FAQ, Form, GridWithIcons, Hero, Icon, IconList, Layout, Maintenance, RadioGroup, SEO, SettingCard, SignUp, SocialProof, Socials, Team, Tiles и User. Шаблоны включают Authentication, Blog, Portfolio и ProductPage. Проект распространяется под лицензией MIT.
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.