Sobre el proyecto
Webcore UI (nombre del paquete webcoreui) es una biblioteca de componentes UI open-source de Frontendland. El README la describe como una biblioteca de componentes UI para Astro con personalización mediante Sass, con soporte para Svelte y React. Puede usarse como proyecto independiente o integrarse en ecosistemas existentes de Astro, Svelte o React, y los componentes se importan desde webcoreui/astro, webcoreui/svelte o webcoreui/react. La documentación está disponible en webcoreui.dev, incluyendo guías de configuración y un constructor visual.
Getting started can be done with the CLI via npm create webcore@latest. The CLI can create a new Webcore project, update configuration files for an existing Astro project, or create a project from a named template such as Portfolio. Manual installation is also possible with npm i webcoreui or yarn add webcoreui. Astro projects add the webcore() integration to astro.config.mjs. The README notes prerequisites: Sass v1.100 and TypeScript v5.9, plus Astro v5.18 for Astro, Svelte v5.55 for Svelte, and React/React DOM v19.2 for React. It also recommends optionally adding astro-purgecss to improve CSS bundle size.
La configuración de estilos utiliza un archivo webcore.config.scss y un archivo SCSS global que llama al mixin webcoreui/styles setup. Las opciones de configuración incluyen includeResets, includeUtilities, includeTooltip, includeScrollbarStyles, includeBreakpoints, theme y themes. El README documenta variables CSS para personalizar estilos de componentes, con ejemplos para Avatar, Banner, BottomNavigation, Checkbox, Collapsible, Counter, Masonry, Progress, Radio, RangeSlider, Rating, Ribbon, scrollbars, Skeleton, Slider, SpeedDial, Spinner, Spoiler, Stepper, Switch, ThemeSwitcher, Timeline, Tooltips, border radius y estilos de bloque como la página de error.
El repositorio organiza piezas de construcción de UI en componentes, bloques y plantillas. Los componentes incluidos son 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 y Tooltip. Los bloques incluyen 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 y User. Las plantillas son Authentication, Blog, Portfolio y ProductPage. El proyecto tiene licencia MIT.
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.