@warkypublic/svelix

Svelix

@warkypublic/svelix — a Svelte 5 component library built on Skeleton UI and Tailwind CSS v4, focused on workflow-heavy UI, data-rich views, and content tooling.

Install

pnpm add @warkypublic/svelix

Usage

import { Button, Former, Gridler } from '@warkypublic/svelix';

Components

Layout & Structure

Export	Description
Boxer, BoxerTarget	Adaptive layout container with data-adapter support
Portal	Renders children outside the current DOM subtree
ErrorBoundary	Catches and displays component errors

Forms

Export	Description
Former, FormerButtonArea, FormerDrawer, FormerModal	Form builder with modal/drawer variants
createFormerState	Reactive form state factory
FormerResolveSpecAPI, FormerRestHeadSpecAPI	API adapters for form data sources
ButtonCtrl, IconButtonCtrl	Button and icon-button form controls
TextInputCtrl, TextAreaCtrl, PasswordInputCtrl	Text input controls
NumberInputCtrl, NativeSelectCtrl	Number and select controls
CheckBoxCtrl, SwitchCtrl	Checkbox and toggle controls; CheckBoxCtrl supports checkbox or switch presentation and boolean, integer, or string values
FileInputCtrl	Single-file picker with a compact file-type or image thumbnail, filename, and size
JsonCtrl	JSON editor control with a dialog editor and preview
DateTimeCtrl	Date/time picker control
CtrlFieldShell, InlineWrapper	Field shell and inline layout wrapper for form controls

Data Grids

Export	Description
Gridler, GridlerFull	Feature-rich data grid / table
GridlerResolveSpecAdapter, GridlerRestHeaderSpecAdapter	Data adapters for Gridler
SvarkGrid	SVAR-based grid with context menus and column mapping
SvarkResolveSpecAdapter, SvarkRestHeaderSpecAdapter	Data adapters for SvarkGrid

Card Grid

Export	Description
CardGrid, DefaultCard, CardGridFilterPanel	Filterable, sortable card grid

Menus & Overlays

Export	Description
BetterMenu, MenuRenderer	Enhanced dropdown menu
createBetterMenuStore	Store factory for menu state
OverlayStack	Stacked modal/overlay manager

Content & Markup

Export	Description
ContentEditor	Rich content editor (Carta Markdown + Monaco)
TextEditor, MarkdownViewer, MonacoEditor	Text, Markdown, and code editing components
CollaboraEditor, Office365Editor	Office document editor integrations
ImageViewer, AudioPlayer, VideoPlayer, PdfViewer	File media and PDF viewers
EmailViewer, ZipViewer, UnknownFile	Fallback file viewers

Trees

Export	Description
VTree	Virtualised tree view
VTreeResolveSpecAdapter	Data adapter for VTree

Global State

Export	Description
GlobalStateStoreProvider	App-level state provider
useGlobalStateStoreContext	Context accessor
t, _T, loadTranslations, appendTranslations, etc.	i18n helpers

Utilities & Misc

Export	Description
Button	Base button component
CaptureScreenshotComponent, CaptureScreen	Screenshot capture
errorManager	Global error manager
IconAdd, IconClose, IconEdit, IconSearch, etc.	SVG icon components

CSS Assets

Tailwind CSS source and theme files are published under @warkypublic/svelix/css/:

import '@warkypublic/svelix/css/tailwind-source.css';
import '@warkypublic/svelix/css/svelix_orange.css';

LLM Documentation

Extended architecture and implementation docs are published with the package under @warkypublic/svelix/llm/:

node_modules/@warkypublic/svelix/llm/README.md
node_modules/@warkypublic/svelix/llm/ARCHITECTURE.md
node_modules/@warkypublic/svelix/llm/COMPONENT_GUIDE.md
node_modules/@warkypublic/svelix/llm/FORMER_CONTROLLERS.md

Development

pnpm dev          # SvelteKit dev server
pnpm storybook    # Storybook on port 6006
pnpm build        # Build package
pnpm test         # Run unit tests
pnpm check        # Type-check .svelte files
pnpm lint         # ESLint