alus-ui 0.1.1 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +35 -91
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -41,10 +41,20 @@ yarn add alus-ui
41
41
 
42
42
  ## Available Components
43
43
 
44
- ### Form Components (^\_^)b
44
+ The canonical export list is `src/lib/components/index.ts`.
45
45
 
46
- - **Button** - Accessible button with ARIA support and toggle states
47
- - **Input** - Text input with validation, error states, and accessibility
46
+ - **Form** (27): Button, Input, Checkbox, Radio, RadioGroup, Select, Textarea, Switch, Slider, FileInput, SearchInput, NumberInput, Form, Fieldset, Label, FieldError, InputGroup, Rating, IconButton, ToggleButton, AutoComplete, Calendar, DatePicker, DateRange, DateRangePicker, TimePicker, ColorPicker
47
+ - **Navigation** (11): Tabs, Accordion, Breadcrumb, Pagination, Link, ExternalLink, Navigation, Menu, SubMenu, Stepper, CommandMenu
48
+ - **Feedback** (13): Badge, Tag, Spinner, Skeleton, Progress, Alert, Callout, Banner, InlineMessage, LiveRegion, NotificationBell, Toast (+ Toaster)
49
+ - **Display** (18): Divider, Kbd, AspectRatio, Frame, Timestamp, CodeBlock, StatCard, Avatar, Card, Image, List, DataList, Table, TreeView, Timeline, Compare, Carousel
50
+ - **Overlay** (10): Modal, Dialog, Drawer, Sheet, Tooltip, Popover, Dropdown, Overlay, Lightbox, ContextMenu
51
+ - **Layout** (6): Stack, Flex, Grid, Container, Spacer, Columns
52
+ - **Interactive** (8): Sortable, Swipeable, Resizable, SplitView, Draggable, Droppable, InfiniteScroll, VirtualList
53
+ - **Utility** (5): VisuallyHidden, Portal, FocusTrap, ScreenReaderOnly, Conditional
54
+
55
+ Date components use [`@internationalized/date`](https://react-spectrum.adobe.com/internationalized/date/) for locale/timezone/non-Gregorian-calendar correctness.
56
+
57
+ **Out of scope** (use external libs): `RichTextEditor`, `DataGrid`, `Chart`, `VideoPlayer`, `AudioPlayer`, `MapView`. `Clone` is not implementable (Svelte 5 lacks `cloneElement`).
48
58
 
49
59
  ## Features
50
60
 
@@ -122,49 +132,35 @@ yarn add alus-ui
122
132
 
123
133
  ## Component API
124
134
 
125
- ### Button
135
+ Per-component prop documentation is not duplicated here — every component is fully typed, so use IDE IntelliSense or browse the source under `src/lib/components/{category}/{component}/`. Each component file has a `Props` interface at the top.
126
136
 
127
- ```svelte
128
- <Button type="button" disabled={false} aria-pressed={undefined} class="" onclick={() => {}}>
129
- Button content
130
- </Button>
131
- ```
137
+ Live, interactive examples for every component are in the showcase app at `src/routes/components/{component}/+page.svelte` (run `pnpm dev` from the repo root).
132
138
 
133
- **Props:**
139
+ ### Shared ARIA props
134
140
 
135
- - `type?: 'button' | 'submit' | 'reset'` - Button type (default: 'button')
136
- - `disabled?: boolean` - Disabled state
137
- - `aria-pressed?: boolean` - Toggle button state
138
- - `class?: string` - CSS classes for styling
139
- - All standard HTML button attributes
141
+ Most components accept these standard accessibility props in addition to their own:
140
142
 
141
- ### Input
143
+ - `aria-label?: string`
144
+ - `aria-labelledby?: string`
145
+ - `aria-describedby?: string`
146
+ - `class?: string`
142
147
 
143
- ```svelte
144
- <Input
145
- type="text"
146
- value={''}
147
- autocomplete="off"
148
- inputmode="text"
149
- aria-invalid={false}
150
- aria-label={undefined}
151
- aria-describedby={undefined}
152
- class=""
153
- oninput={(e) => {}}
154
- />
155
- ```
148
+ Interactive components additionally accept: `disabled`, `aria-disabled`, plus role-specific state like `aria-pressed`, `aria-expanded`, `aria-checked`, `aria-selected`, `aria-current`.
149
+
150
+ Form components additionally accept: `required`, `aria-invalid`, `aria-errormessage` (wired via the `validationAttrs` helper).
156
151
 
157
- **Props:**
152
+ ## Utilities
158
153
 
159
- - `type?: HTMLInputTypeAttribute` - Input type (default: 'text')
160
- - `value?: string` - Input value (use `bind:value` for two-way binding)
161
- - `autocomplete?: string` - Autocomplete attribute
162
- - `inputmode?: string` - Input mode for mobile keyboards
163
- - `aria-invalid?: boolean` - Invalid state for validation
164
- - `aria-label?: string` - Accessibility label
165
- - `aria-describedby?: string` - ID of describing element
166
- - `class?: string` - CSS classes for styling
167
- - All standard HTML input attributes
154
+ Beyond components, the package exports a small set of a11y/form utilities:
155
+
156
+ ```ts
157
+ import { labelAttrs, validationAttrs, interactiveStateAttrs, widgetAttrs, mergeAttrs } from 'alus-ui/a11y';
158
+ import { trap, focusFirst } from 'alus-ui/a11y';
159
+ import { generateCounterId } from 'alus-ui/a11y';
160
+ import { createFieldIds, createFormField } from 'alus-ui/utils/form';
161
+ ```
162
+
163
+ See `src/lib/utils/a11y/` and `src/lib/utils/form/` for full reference.
168
164
 
169
165
  ## Accessibility Features
170
166
 
@@ -208,58 +204,6 @@ pnpm build
208
204
  pnpm test
209
205
  ```
210
206
 
211
- ## Releasing
212
-
213
- Releases are driven by [release-it](https://github.com/release-it/release-it) + `@release-it/conventional-changelog`. Versions auto-bump from [Conventional Commits](https://www.conventionalcommits.org/) (`feat:` → minor, `fix:` → patch, `feat!:` / `BREAKING CHANGE:` → major).
214
-
215
- ### Prerequisites
216
-
217
- - Logged in to npm: `npm whoami` should print your username
218
- - `GITHUB_TOKEN` env var set (else release-it falls back to the web UI for the GitHub release)
219
- - Clean working tree on `main`
220
-
221
- ### Commands
222
-
223
- ```bash
224
- cd packages/alus
225
-
226
- pnpm release:dry # preview — no git/npm/github writes
227
- pnpm release # interactive — prompts for the bump
228
- pnpm release:patch # 0.1.0 → 0.1.1
229
- pnpm release:minor # 0.1.0 → 0.2.0
230
- pnpm release:major # 0.1.0 → 1.0.0
231
- ```
232
-
233
- ### What `pnpm release` does
234
-
235
- 1. `before:init` hook → `pnpm check` (svelte-check must pass)
236
- 2. Bumps `package.json` version
237
- 3. `after:bump` hook → `pnpm build` (regenerates `dist/`)
238
- 4. Writes `CHANGELOG.md` from conventional commits since the last tag
239
- 5. Commits `chore(release): v<version>` and tags `v<version>`
240
- 6. Pushes commit + tag to `origin/main`
241
- 7. Creates GitHub release with the changelog body
242
- 8. Publishes to npm (`npm publish` runs `prepublishOnly` → build + test again)
243
-
244
- ### Commit message conventions
245
-
246
- | Prefix | Section in CHANGELOG | Bump |
247
- | ------------ | -------------------- | ----- |
248
- | `feat:` | Features | minor |
249
- | `fix:` | Bug Fixes | patch |
250
- | `perf:` | Performance | patch |
251
- | `refactor:` | Refactors | patch |
252
- | `docs:` | Documentation | patch |
253
- | `test:` | Tests | patch |
254
- | `build:` | Build | patch |
255
- | `ci:` / `chore:` / `style:` | _(hidden)_ | none |
256
-
257
- Append `!` after the type (or include `BREAKING CHANGE:` in the body) for a major bump.
258
-
259
- ### Config
260
-
261
- Settings live in `packages/alus/.release-it.json`. Tag scheme is `v<version>`.
262
-
263
207
  ## License
264
208
 
265
209
  MIT
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "alus-ui",
3
- "version": "0.1.1",
3
+ "version": "0.1.2",
4
4
  "description": "Unstyled, accessible Svelte 5 components with full keyboard navigation and WCAG 2.1 AA compliance",
5
5
  "license": "MIT",
6
6
  "type": "module",