Svar react
Use when building, configuring, styling, or modifying any SVAR React UI component from the @svar-ui/react-* packages - widgets, layouts, menus, toolbars, calendars, popups, themes, and localesFrom its SKILL.md
npx -y skills add svar-widgets/skills --skill svar-reactAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
2 things to look at
- no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
- 2 stars2 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
SKILL.md
2.2 KB, 517 tokens by cl100k_base, as published. Nobody here has run it
SVAR React ships as a family of @svar-ui/react-* packages. This file routes to the per-package entry; each child file is standalone and contains the imports, public types, styling hooks, and recipes for its components.
Open the matching file for the package you are using. If the component you need is not listed in the routing table below, default to core/index.md
Component Routing
| File | Package | Components |
|---|---|---|
core/index.md | @svar-ui/react-core | buttons, inputs, selectors, calendars, dropdowns, popups, modals, themes, locale (40+ widgets) |
menu/index.md | @svar-ui/react-menu | Menu, MenuBar, DropDownMenu, ContextMenu, ActionMenu |
toolbar/index.md | @svar-ui/react-toolbar | Toolbar |
layout/index.md | @svar-ui/react-layout | Layout, Cell, Panel |
grid/index.md | @svar-ui/react-grid | Grid, HeaderMenu, Tooltip, ContextMenu, Toolbar |
editor/index.md | @svar-ui/react-editor | Editor |
filter/index.md | @svar-ui/react-filter | FilterBuilder, FilterEditor, FilterBar, FilterQuery |
gantt/index.md | @svar-ui/react-gantt | Gantt, Toolbar, ContextMenu, Editor, Tooltip, HeaderMenu |
tasklist/index.md | @svar-ui/react-tasklist | Tasklist |
comments/index.md | @svar-ui/react-comments | Comments |
filemanager/index.md | @svar-ui/react-filemanager | Filemanager |
Common Techniques
These apply to every @svar-ui/react-* package:
themes.md- theme wrappers, CSS variables, thecssprop convention, class hookslocales.md- locale context, bundled language packs, extending words and formats
The widget hierarchy need to be wrapped in a theme component to ensure proper styling Some widgets (grid,gantt,filemanager, etc) exports their own theme components that delegate to core theme and add their own variables
What ships with it: 56 files
267.7 KB alongside SKILL.md
comments/
- index.md9.0 KB
core/
- avatar.md1.9 KB
- button.md2.3 KB
- calendar.md2.6 KB
- checkbox.md2.5 KB
- colorboard.md1.7 KB
- colorpicker.md2.1 KB
- colorselect.md1.7 KB
- combo.md3.1 KB
- counter.md1.8 KB
- datepicker.md3.3 KB
- daterangepicker.md3.6 KB
- dropdown.md2.7 KB
- field.md2.0 KB
- fullscreen.md1.8 KB
- globals.md2.7 KB
- icon.md1.1 KB
- index.md2.6 KB
- locale.md2.8 KB
- modalarea.md1.7 KB
- modal.md2.4 KB
- month.md2.4 KB
- multicombo.md3.0 KB
- pager.md2.0 KB
- popup.md1.9 KB
- portal.md2.2 KB
- radio.md2.4 KB
- rangecalendar.md2.5 KB
- richselect.md2.8 KB
- segmented.md2.2 KB
- select.md1.9 KB
- sidearea.md1.4 KB
- slider.md1.7 KB
- suggest-dropdown.md2.7 KB
- switch.md1.4 KB
- tabs.md1.9 KB
- textarea.md1.5 KB
- text.md2.4 KB
- themes.md1.7 KB
- timepicker.md2.9 KB
16 more files not listed here. See all 56 in the repository.