optikos 0.0.0-stage → 0.2.0

package/CHANGELOG.md

@@ -0,0 +1,146 @@
+# Changelog
+
+All notable changes to this project are documented here. The format follows [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
+and the project uses [Semantic Versioning](https://semver.org/). Until 1.0, minor versions may contain breaking changes.
+
+## [Unreleased]
+
+## [0.2.0] - 2026-11-10
+
+### Added
+
+- Form utils: `showIf`/`enableIf` on any item of a form (a field hidden by its rule does not validate and is left out
+  of `getValues`), `Form.focusField(field)`, the form-level `dirty-change` event, and two components: `FormErrors`
+  (`type: 'formerrors'`, an error summary whose links reveal and focus each field) and `FormActions`
+  (`type: 'formactions'`, Cancel / Save with an "Unsaved changes" status, `requireChanges`, `sticky`).
+
+- `FieldList` component (`type: 'fieldlist'`): a repeating block of fields (add, remove, reorder rows, by mouse or
+  keyboard); it is one form field whose value is an array of row objects, with `min`/`max`, and validating the form
+  validates every row.
+
+- Compound fields: `FieldGroup` (`type: 'fieldgroup'`): several inputs under one label, one help line and one error
+  line (`role=group`); and `InputGroup` (`type: 'inputgroup'`): text (`R$`, `.com`) or buttons joined to any field's box,
+  the text read as part of the input's description.
+
+- Form layouts: `columns` on Form, FieldSet and FormSection (a responsive grid), `colspan: 'full'`, `labelWidth` (left
+  labels in a column), FieldSet `variant` (`box`, `line`, `plain`) and `description`, and the `FormSection` component
+  (`type: 'formsection'`): title and description beside the fields, stacked when the section is narrow.
+
+- Reload buttons: `reloadable` on Panel (so Window and Widget too) and on Tabs adds a ↻ that calls `onReload(panel)`; a
+  returned Promise shows the loading mask until it settles. `Panel.reload()`, `Tabs.reloadTab()`, `before-reload`/`reload`
+  events; R reloads a focused reloadable tab. New `refresh` icon.
+
+- Widget: `resizable` (the inner edge while docked, a corner grip once moved; a focusable splitter with arrow keys) and
+  the `resize({ width, height })` event.
+
+- `CodeViewer` component (`type: 'codeviewer'`): read-only code with syntax colors (ts/js, json, css, html, sh), line
+  numbers that a selection never copies, marked lines, `startLine`, wrap or scroll, and a copy button. The docs site
+  uses it for every code block, which also fixes the code fences of the guides (they were styled as inline code).
+
+- Menu: `group` on items (named `role=group` sections, ungrouped first) and `search: true` (a search field that filters
+  the items; a search that matches a group name shows the whole group). FilterBuilder fields take a `group` too, like
+  `Column.group`: the `pick` menu is grouped and searchable past 6 fields, and the field select uses `<optgroup>`s.
+
+- `Dial` component (`type: 'dial'`, `ui.dial`): picks one value from a range (an age, a year) or a list (the months) on
+  a flat ruler that slides under a fixed needle, with a large readout whose digits roll like an odometer. Snap points
+  (decades by default) get the labels, Page Up/Down jump between them, and a flick glides on to the nearest one ahead.
+  `shape: 'circle'` turns it into a clock face.
+
+- `addMessages(lang, messages)` (from `optikos` and `optikos/core`): adds translation keys to a locale without overwriting
+  keys the app already set.
+
+- `Grid<T>`: the record type flows from a typed `Store<T>` to `getSelection()`, `getStore()`, bulk and row actions and
+  column renderers; `Column.field` autocompletes the record's keys. `new Grid({ store })` infers it. Untyped grids keep
+  working as before (the default is `any`).
+
+- Documentation in English with a Portuguese translation (`docs/pt-BR/`); the docs site has a language picker
+  (English/Português) that also switches the components' own messages, and the MCP server takes a `lang` argument.
+
+- `defineTheme`: a plain value sets the group's own token (`radius: '0.75rem'` → `--op-radius`).
+- Docs site redesigned as a showcase: a landing page with a live form and measured sizes, recipes (complete small
+  screens whose shown code is the code that runs), a gallery of the demos (published with the site) and tabbed
+  component pages.
+
+- Grid plugins (`plugins: [...]`) and the first one, `cellEditing()`: double click or F2 to edit a cell, Enter to save,
+  Tab to the next editable cell; editors come from `Column.editor`. New Grid helpers for plugins: `cellAt`, `getCell`,
+  `getColumns`, `getActive`.
+
+- `Tree` component: expand/collapse, single or multiple selection, tri-state cascading checkboxes, children loaded on
+  demand, filter, and the WAI-ARIA tree keyboard.
+
+- `Toggle` (an on/off switch, `role="switch"`) and the `ui.toggle()` shortcut.
+
+- `CheckboxGroup` (several choices; the value is the list of checked values) and `ui.checkGroup()`.
+
+- `Badge` (status label or count in six tones) and `Chip` (selectable filter or removable tag).
+
+### Changed
+
+- No automatic focus on fields: on a phone it pops up the keyboard over the page. Window, Widget, `MessageBox.prompt`
+  and StepForm (on a new step) now focus the dialog, widget or step panel itself; `autoFocus: true` focuses the first
+  field as before. A Menu with `search` and the Grid's column menu open on their first item (typing a letter goes to
+  the search field), and LookupField's search window opens on the dialog. Focus that answers an explicit action stays:
+  adding a row, editing a cell, a failed validation jumping to the field.
+- MessageBox (`alert`, `confirm`, `prompt`) no longer dims the page: it is still modal, over a clear backdrop. Pass
+  `mask: true` to dim it. Window has the same `mask` option (default `true`) and `setMask`.
+- **Themes (breaking):** the package now ships only `light` (default), `dark` and `compact`. The default look is the
+  former `corporate` theme (steel blue on cool gray, small radii, hairline borders, a navy sidebar, 2.375rem controls,
+  2.75rem rows, 15px text) and `dark` is its night version. `optikos/themes/{corporate,brutal,soft,terminal,editorial,brand}.css`
+  were removed, and `ThemeName` keeps only `Light` and `Dark`. Grid headers and panel title bars now use the strong
+  border, the selected Grid row shows a primary bar (`--op-grid-selected-bar`, `--op-grid-selected-bar-width`), the
+  primary button has a subtle inner shadow (`--op-button-primary-shadow`) and the tab bar sits on `surface-2`; new
+  tokens `--op-grid-header-border` and `--op-panel-header-border`.
+- Grid: `role="grid"` (with focus, `aria-activedescendant`, row and column counts) moved from the root element to an inner
+  `.op-grid__table`, because the root also holds the bulk bar and the pager. Code that read those attributes from
+  `grid.el` should query `grid.el.querySelector('[role=grid]')`; `grid.focus()` keeps working.
+- Accessibility fixes found by automated axe checks in every theme: Button keeps its name while loading (and is
+  `aria-disabled`), Stepper steps keep their names on phones, DateField/DateRangeField follow the date picker combobox
+  pattern, an unnamed Dropdown dialog is named by its anchor, and contrast fixes in the light (`fg-muted`), `dark`
+  (primary), `soft`, `brutal`, `brand` and `brand night` themes and in Chat bubbles.
+- Each component now ships its own `en`/`pt-BR` messages, so the core is 2.2 kB (gzip) smaller and every standalone component about 0.5 kB smaller.
+  Custom locales passed to `setLocale({...})` keep working; missing keys still fall back to English.
+
+### Fixed
+
+- Floating elements (menus, dropdowns) taller than the room on both sides of their anchor are capped to the larger side
+  and scroll, instead of running off the window (long menus in big themes).
+
+- Tabs: each panel has `tabindex="0"` (WAI-ARIA tabs pattern), so a panel with nothing focusable inside, or one that
+  scrolls, can be reached with the keyboard.
+
+- `ariaLabel` on a field without a visible label now names its input (it used to land on the wrapper).
+- Grid: the row-actions column header has a (visually hidden) name.
+
+- `ui.grid(2, ...)` keeps the column count numeric, so the grid collapses to one column on narrow containers like
+  `layout: { type: 'grid', columns: 2 }` does.
+- `ui.*` containers accept declarative configs among their items (`ui.form([{ type: 'fieldset', ... }, ui.text(...)])`)
+  without a type error.
+
+- Store: sorting text is 13× faster (100k records: 5.4 s → 0.41 s). The comparison reuses one `Intl.Collator` instead of
+  building one per `localeCompare` call; the order is unchanged.
+
+## [0.1.0] - 2026-11-08
+
+First public release.
+
+### Added
+
+- Core: `Component`, `Container`, `Field`, the `create`/`register` registry, layouts (`fit`, `hbox`, `vbox`, `border`,
+  `grid`, `card`, responsive below a container width), validators, i18n (`en`, `pt-BR`), focus and positioning utilities,
+  list virtualization.
+- Data: `Store` with local or remote sorting, filter trees (AND/OR) and paging; `Model`; memory, function and REST proxies; formatters.
+- Components: button, icon, label; container, panel, viewport, fieldset, toolbar, spacer; textfield, textarea,
+  numberfield, secretfield, checkbox, radiogroup, select, combobox, suggestfield, lookupfield, datefield, daterangefield,
+  slider, listbox; form (with tabs) and stepform; grid, table, dataview, pagination, filterbuilder, searchgrid,
+  viewmanager; calendar; window, MessageBox, toast, menu, dropdown, tooltip, widget, commandpalette; tabs, breadcrumb,
+  navmenu, stepper; spinner and loading masks; chat.
+- `optikos/bind`: `signal`, `computed`, `effect`, `bind`, `fromStore`.
+- `optikos/motion`: animation helpers on the Web Animations API with one global setting and a kill switch.
+- `optikos/ui`: `ui.*` shortcuts and enums.
+- Themes: design tokens in `@layer optikos`, `defineTheme()`/`setTheme()`, and the ready-made themes `dark`, `compact`,
+  `corporate`, `soft`, `brutal`, `terminal`, `editorial` and `brand`.
+- Per-component entry points (`optikos/components/<name>`) and stylesheets (`optikos/css/<name>.css`).
+
+[Unreleased]: https://github.com/Denis-Zickuhr/optikos/compare/v0.2.0...HEAD
+[0.2.0]: https://github.com/Denis-Zickuhr/optikos/compare/v0.1.0...v0.2.0
+[0.1.0]: https://github.com/Denis-Zickuhr/optikos/releases/tag/v0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Denis Zickuhr
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,214 @@
-# Temporary Holding Version
+<p align="center"><img src="https://raw.githubusercontent.com/Denis-Zickuhr/optikos/main/site/seal.svg" alt="Optikos" width="150" /></p>
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+# Optikos
+
+[![npm](https://img.shields.io/npm/v/optikos)](https://www.npmjs.com/package/optikos)
+[![license: MIT](https://img.shields.io/badge/license-MIT-blue)](https://github.com/Denis-Zickuhr/optikos/blob/main/LICENSE)
+
+Declarative UI components in plain TypeScript: describe screens, forms, grids and windows as configuration objects,
+with no runtime dependencies.
+
+- **Fast**: no virtual DOM. Setters update only the part of the DOM that changed, and grids and long lists are virtualized.
+- **Light**: zero runtime dependencies. Each component can be imported on its own, and its size is checked on every build.
+- **Complete**: fields, pickers, data grid, filter builder, windows, menus, tabs, command palette, chat and more.
+- **Themeable**: every color, space, radius, font and shadow is a CSS custom property, and all styles live in `@layer optikos`.
+- **Accessible**: keyboard support, focus management and ARIA are part of each component's spec.
+- **Extensible**: your own components, layouts and themes use the same public API as the built-in ones.
+
+## Install
+
+```sh
+npm i optikos
+```
+
+## Quick start
+
+```ts
+import { create, toast, type Form } from 'optikos';
+import 'optikos/optikos.css';
+import 'optikos/themes/dark.css';
+
+document.documentElement.setAttribute('data-op-theme', 'dark');
+
+const form = create<Form>({
+  type: 'form',
+  items: [
+    { type: 'textfield', name: 'name', label: 'Name', required: true },
+    { type: 'textfield', name: 'email', label: 'Email', inputType: 'email' },
+    { type: 'select', name: 'plan', label: 'Plan', options: ['Free', 'Pro'] },
+  ],
+});
+
+create({
+  type: 'panel',
+  title: 'New customer',
+  renderTo: document.body,
+  items: [form],
+  buttons: [{ text: 'Save', variant: 'primary', handler: () => form.isValid() && toast(`Saved ${form.getValues().name}`) }],
+});
+```
+
+`create()` builds a component tree from a config. Each `type` is a registered component class, so you can also write
+`new TextField({ ... })`, or use the `ui` shortcuts:
+
+```ts
+import { ui } from 'optikos';
+
+const signup = ui.form([
+  ui.text('name', 'Name', { required: true }),
+  ui.email('email', 'Email'),
+  ui.row(ui.date('from', 'From'), ui.date('to', 'To')),
+  ui.primary('Sign up', () => signup.submit()),
+]);
+```
+
+### Data grid
+
+```ts
+import { create, Store } from 'optikos';
+
+const orders = new Store({
+  data: [
+    { id: 1, customer: 'Ada Lovelace', total: 120 },
+    { id: 2, customer: 'Alan Turing', total: 80 },
+  ],
+});
+
+create({
+  type: 'grid',
+  store: orders,
+  height: 320,
+  paging: true,
+  renderTo: document.body,
+  columns: [
+    { field: 'id', header: '#', width: 60, sortable: true },
+    { field: 'customer', header: 'Customer', flex: 1, sortable: true },
+    { field: 'total', header: 'Total', format: 'money', align: 'right' },
+  ],
+});
+
+orders.filter({ field: 'customer', op: 'contains', value: 'ada' });
+```
+
+A `Store` can also load from a function or a REST endpoint, with remote sorting, filtering and paging.
+
+### Reactive bindings (optional)
+
+Components only have setters. `optikos/bind` adds signals on top and calls those setters for you:
+
+```ts
+import { create, type Button } from 'optikos';
+import { signal, bind } from 'optikos/bind';
+
+const clicks = signal(0);
+const button = create<Button>({ type: 'button', text: 'Click me', renderTo: document.body, handler: () => clicks.update((n) => n + 1) });
+bind(button, { text: () => `Clicked ${clicks()} times` });
+```
+
+## Imports
+
+| Import | What you get |
+|---|---|
+| `optikos` | everything: core, data, themes, motion, `ui`, and every component registered |
+| `optikos/core` | `Component`, `Container`, `Field`, `create`, `register`, layouts, validators, i18n (no components) |
+| `optikos/components/<name>` | one component, which registers its `type` (e.g. `optikos/components/grid`) |
+| `optikos/data` | `Store`, `Model`, proxies, formatters |
+| `optikos/bind` | `signal`, `computed`, `effect`, `bind`, `fromStore` |
+| `optikos/motion` | animation helpers and the global motion settings |
+| `optikos/ui` | the `ui.*` shortcuts and enums (`Variant`, `Direction`, `Op`...) |
+| `optikos/optikos.css` | all styles: tokens, layouts and every component |
+| `optikos/css/<name>.css` | one stylesheet (`base.css` holds the tokens; `core.css`, `field.css` and `layout.css` are shared) |
+| `optikos/themes/<theme>.css` | a ready-made theme |
+
+Components register themselves when their module is imported, so the package is marked as having side effects.
+Importing from `optikos` therefore includes every component. To ship less, import the core and only the components you use:
+
+```ts
+import { create } from 'optikos/core';
+import 'optikos/components/button';
+import 'optikos/components/textfield';
+
+create({ type: 'textfield', label: 'Search', renderTo: document.body });
+```
+
+## Components
+
+| Category | Components (`type`) |
+|---|---|
+| Base | `button`, `icon`, `label`, `badge`, `chip` |
+| Layout | `container`, `panel`, `viewport`, `fieldset`, `toolbar`, `spacer`, plus the layouts `fit`, `hbox`, `vbox`, `border`, `grid`, `card` |
+| Fields | `textfield`, `textarea`, `numberfield`, `secretfield`, `checkbox`, `toggle`, `checkboxgroup`, `radiogroup`, `select`, `combobox`, `suggestfield`, `lookupfield`, `datefield`, `daterangefield`, `slider`, `listbox` |
+| Forms | `form` (validation, `load`/`getValues`, tabs), `stepform` (multi-step wizard) |
+| Data | `grid` (virtualized, sorting, selection, paging, column menu, bulk actions, inline editing with the `cellEditing()` plugin), `table`, `dataview`, `pagination`, `filterbuilder`, `searchgrid`, `viewmanager` (saved views), `tree` |
+| Dates | `calendar` (single date or range) |
+| Overlays | `window`, `MessageBox` (alert/confirm/prompt), `toast()`, `menu`, `dropdown`, `tooltip`, `widget`, `commandpalette` |
+| Navigation | `tabs`, `breadcrumb`, `navmenu`, `stepper` |
+| Feedback | `spinner`, plus `loading: true` on any component |
+| Chat | `chat` (messages, typing indicator, streaming replies, suggestions) |
+
+## Themes and tokens
+
+All styles are in `@layer optikos`, so any CSS you write outside a layer wins without `!important`.
+A theme is a value of `data-op-theme`, on `<html>` or on any element to scope it. Themes can be combined: `data-op-theme="dark compact"`.
+
+Ready-made themes: `light` (default, included in `optikos.css`), `dark` and `compact` (density). Each one is a file in
+`optikos/themes/<theme>.css`.
+
+Write a theme in CSS:
+
+```css
+@layer optikos {
+  [data-op-theme~='ocean'] { --op-color-primary: #0e7490; --op-radius: 0.125rem; }
+}
+```
+
+or in TypeScript, with typed keys:
+
+```ts
+import { defineTheme, setTheme } from 'optikos';
+
+const brand = defineTheme({
+  color: { primary: '#7c3aed', primarySoft: '#f5f3ff' },
+  button: { radius: '62.5rem' },
+}, 'brand');
+
+brand.inject();         // installs the CSS without activating it
+setTheme('dark brand'); // sets data-op-theme on <html> (or on any element: setTheme(names, el))
+```
+
+Components also accept per-instance tokens: `{ type: 'button', theme: { radius: '0' } }`.
+
+## Browser support
+
+Current evergreen browsers. The JavaScript targets ES2022, and the CSS uses cascade layers, `:has()`, `color-mix()`,
+`inert` and `dvh` units, which works in Chrome/Edge 111+, Firefox 121+ and Safari 16.2+. No polyfills are included.
+
+## Documentation and demos
+
+- [Docs site](https://denis-zickuhr.github.io/optikos/), in English and Portuguese: every component with live, editable
+  examples, its spec sheet, the guides and the design tokens.
+- [Docs sources](https://github.com/Denis-Zickuhr/optikos/tree/main/docs) (Portuguese translation in `docs/pt-BR`): one spec sheet per component in
+  [`docs/components`](https://github.com/Denis-Zickuhr/optikos/tree/main/docs/components), plus guides on
+  [theming](https://github.com/Denis-Zickuhr/optikos/blob/main/docs/theming.md),
+  [motion](https://github.com/Denis-Zickuhr/optikos/blob/main/docs/motion.md),
+  [`ui` shortcuts](https://github.com/Denis-Zickuhr/optikos/blob/main/docs/ui.md) and
+  [architecture decisions](https://github.com/Denis-Zickuhr/optikos/blob/main/docs/architecture.md) (in Portuguese).
+- [Recipes and live demos](https://denis-zickuhr.github.io/optikos/#/demos) on the docs site: CRM, admin dashboard, ERP,
+  chat, photo gallery, shop, event landing page, workbench, motion lab and customization ([source](https://github.com/Denis-Zickuhr/optikos/tree/main/demos)).
+
+## Contributing / Development
+
+```sh
+npm install
+npm run dev               # dev server: index of sandboxes and demos at /dev/
+npm run sandbox -- fields # one sandbox category
+npm run demo -- crm       # one demo
+npm run site              # living docs, with live reload
+npm run check             # generate index, typecheck, tests, build with size budgets
+```
+
+See [CONTRIBUTING.md](CONTRIBUTING.md) and the project rules in [AGENTS.md](AGENTS.md).
+
+## License
+
+[MIT](LICENSE) © Denis Zickuhr. The built-in icons come from Lucide and Feather; see [THIRD_PARTY_NOTICES.md](THIRD_PARTY_NOTICES.md).

package/THIRD_PARTY_NOTICES.md

@@ -0,0 +1,83 @@
+# Third-party notices
+
+Optikos is MIT licensed (see `LICENSE`). It ships the third-party material listed below.
+
+## Built-in icons
+
+The SVG paths of the built-in icons (`src/components/base/icon/icon.ts`, bundled into `dist/`) are taken from or
+derived from [Lucide](https://lucide.dev) (ISC) and [Feather](https://feathericons.com) (MIT). Lucide's own license
+also covers the Lucide icons that come from Feather. Both license texts follow.
+
+### Lucide — ISC License
+
+```
+ISC License
+
+Copyright (c) 2026 Lucide Icons and Contributors
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
+
+---
+
+The following Lucide icons are derived from the Feather project:
+
+airplay, alert-circle, alert-octagon, alert-triangle, aperture, arrow-down-circle, arrow-down-left, arrow-down-right, arrow-down, arrow-left-circle, arrow-left, arrow-right-circle, arrow-right, arrow-up-circle, arrow-up-left, arrow-up-right, arrow-up, at-sign, calendar, cast, check, chevron-down, chevron-left, chevron-right, chevron-up, chevrons-down, chevrons-left, chevrons-right, chevrons-up, circle, clipboard, clock, code, columns, command, compass, corner-down-left, corner-down-right, corner-left-down, corner-left-up, corner-right-down, corner-right-up, corner-up-left, corner-up-right, crosshair, database, divide-circle, divide-square, dollar-sign, download, external-link, feather, frown, hash, headphones, help-circle, info, italic, key, layout, life-buoy, link-2, link, loader, lock, log-in, log-out, maximize, meh, minimize, minimize-2, minus-circle, minus-square, minus, monitor, moon, more-horizontal, more-vertical, move, music, navigation-2, navigation, octagon, pause-circle, percent, plus-circle, plus-square, plus, power, radio, rss, search, server, share, shopping-bag, sidebar, smartphone, smile, square, table-2, tablet, target, terminal, trash-2, trash, triangle, tv, type, upload, x-circle, x-octagon, x-square, x, zoom-in, zoom-out
+
+The MIT License (MIT) (for the icons listed above)
+
+Copyright (c) 2013-present Cole Bemis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+```
+
+### Feather — MIT License
+
+```
+The MIT License (MIT)
+
+Copyright (c) 2013-2023 Cole Bemis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+```

package/dist/bind.js

@@ -0,0 +1,2 @@
+import"./chunk-4C666HHU.js";var s;function d(t){let n=t,e=new Set,o=(()=>(s&&(e.add(s),s.deps.add(e)),n));return o.set=r=>{if(!Object.is(r,n)){n=r;for(let i of[...e])i.run()}},o.update=r=>o.set(r(n)),o}function f(t){let n,e={deps:new Set,run(){for(let r of e.deps)r.delete(e);e.deps.clear(),n?.();let o=s;s=e;try{n=t()}finally{s=o}}};return e.run(),()=>{for(let o of e.deps)o.delete(e);e.deps.clear(),n?.()}}function a(t){let n=d(void 0);return f(()=>n.set(t())),n}function p(t){let n=d(0);return t.subscribe(()=>n.update(e=>e+1)),()=>(n(),t)}function l(t,n){for(let e in n){let o=`set${e[0].toUpperCase()}${e.slice(1)}`,r=t[o];if(typeof r!="function")throw new Error(`Optikos bind: ${t.constructor.name} has no ${o}()`);let i=n[e];t.own(f(()=>{r.call(t,i())}));let c=i.set;e==="value"&&c&&t.own(t.on("change",u=>c(u)))}}export{l as bind,a as computed,f as effect,p as fromStore,d as signal};
+//# sourceMappingURL=bind.js.map

package/dist/bind.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/bind/index.ts"],
+  "sourcesContent": ["// Optional reactive layer. Components only know setters; this module calls them from signals.\n// Nothing in `core` or `components` imports this file.\nimport type { Component } from '../core/component';\n\ntype Sub = () => void;\nlet running: Effect | undefined;\n\ninterface Effect {\n  run(): void;\n  deps: Set<Set<Effect>>;\n}\n\nexport interface Signal<T> {\n  (): T;\n  set(value: T): void;\n  update(fn: (v: T) => T): void;\n}\n\nexport function signal<T>(initial: T): Signal<T> {\n  let value = initial;\n  const subs = new Set<Effect>();\n  const read = (() => {\n    if (running) {\n      subs.add(running);\n      running.deps.add(subs);\n    }\n    return value;\n  }) as Signal<T>;\n  read.set = (v) => {\n    if (Object.is(v, value)) return;\n    value = v;\n    for (const e of [...subs]) e.run();\n  };\n  read.update = (fn) => read.set(fn(value));\n  return read;\n}\n\n/** Runs `fn` now and again whenever a signal it read changes. Returns the dispose function. */\nexport function effect(fn: () => void | Sub): () => void {\n  let cleanup: void | Sub;\n  const e: Effect = {\n    deps: new Set(),\n    run() {\n      for (const d of e.deps) d.delete(e);\n      e.deps.clear();\n      cleanup?.();\n      const prev = running;\n      running = e;\n      try {\n        cleanup = fn();\n      } finally {\n        running = prev;\n      }\n    },\n  };\n  e.run();\n  return () => {\n    for (const d of e.deps) d.delete(e);\n    e.deps.clear();\n    cleanup?.();\n  };\n}\n\n/** A read-only signal derived from others. */\nexport function computed<T>(fn: () => T): () => T {\n  const s = signal<T>(undefined as T);\n  effect(() => s.set(fn()));\n  return s;\n}\n\n/** Wraps a Store (or anything with `subscribe`) so reading it inside an effect/computed re-runs that effect on every change. Call it once, outside effects. */\nexport function fromStore<S extends { subscribe(fn: () => void): () => void }>(store: S): () => S {\n  const tick = signal(0);\n  store.subscribe(() => tick.update((n) => n + 1));\n  return () => (tick(), store);\n}\n\n/**\n * `bind(button, { text: () => `Count: ${n()}`, disabled: isBusy })` \u2192 `button.setText(...)`, `button.setDisabled(...)`\n * re-run when the sources change, and are disposed with the component. A source that is a writable signal on `value`\n * is two-way: the field's `change` event writes back.\n */\nexport function bind(cmp: Component<any>, map: Record<string, () => unknown>): void {\n  for (const key in map) {\n    const setter = `set${key[0].toUpperCase()}${key.slice(1)}`;\n    const fn = (cmp as unknown as Record<string, unknown>)[setter];\n    if (typeof fn !== 'function') throw new Error(`Optikos bind: ${cmp.constructor.name} has no ${setter}()`);\n    const src = map[key];\n    cmp.own(effect(() => void fn.call(cmp, src())));\n    const write = (src as { set?: (v: unknown) => void }).set;\n    if (key === 'value' && write) cmp.own(cmp.on('change', (v) => write(v)));\n  }\n}\n"],
+  "mappings": "4BAKA,IAAIA,EAaG,SAASC,EAAUC,EAAuB,CAC/C,IAAIC,EAAQD,EACNE,EAAO,IAAI,IACXC,GAAQ,KACRL,IACFI,EAAK,IAAIJ,CAAO,EAChBA,EAAQ,KAAK,IAAII,CAAI,GAEhBD,IAET,OAAAE,EAAK,IAAOC,GAAM,CAChB,GAAI,QAAO,GAAGA,EAAGH,CAAK,EACtB,CAAAA,EAAQG,EACR,QAAWC,IAAK,CAAC,GAAGH,CAAI,EAAGG,EAAE,IAAI,EACnC,EACAF,EAAK,OAAUG,GAAOH,EAAK,IAAIG,EAAGL,CAAK,CAAC,EACjCE,CACT,CAGO,SAASI,EAAOD,EAAkC,CACvD,IAAIE,EACE,EAAY,CAChB,KAAM,IAAI,IACV,KAAM,CACJ,QAAWC,KAAK,EAAE,KAAMA,EAAE,OAAO,CAAC,EAClC,EAAE,KAAK,MAAM,EACbD,IAAU,EACV,IAAME,EAAOZ,EACbA,EAAU,EACV,GAAI,CACFU,EAAUF,EAAG,CACf,QAAE,CACAR,EAAUY,CACZ,CACF,CACF,EACA,SAAE,IAAI,EACC,IAAM,CACX,QAAWD,KAAK,EAAE,KAAMA,EAAE,OAAO,CAAC,EAClC,EAAE,KAAK,MAAM,EACbD,IAAU,CACZ,CACF,CAGO,SAASG,EAAYL,EAAsB,CAChD,IAAMM,EAAIb,EAAU,MAAc,EAClC,OAAAQ,EAAO,IAAMK,EAAE,IAAIN,EAAG,CAAC,CAAC,EACjBM,CACT,CAGO,SAASC,EAA+DC,EAAmB,CAChG,IAAMC,EAAOhB,EAAO,CAAC,EACrB,OAAAe,EAAM,UAAU,IAAMC,EAAK,OAAQC,GAAMA,EAAI,CAAC,CAAC,EACxC,KAAOD,EAAK,EAAGD,EACxB,CAOO,SAASG,EAAKC,EAAqBC,EAA0C,CAClF,QAAWC,KAAOD,EAAK,CACrB,IAAME,EAAS,MAAMD,EAAI,CAAC,EAAE,YAAY,CAAC,GAAGA,EAAI,MAAM,CAAC,CAAC,GAClDd,EAAMY,EAA2CG,CAAM,EAC7D,GAAI,OAAOf,GAAO,WAAY,MAAM,IAAI,MAAM,iBAAiBY,EAAI,YAAY,IAAI,WAAWG,CAAM,IAAI,EACxG,IAAMC,EAAMH,EAAIC,CAAG,EACnBF,EAAI,IAAIX,EAAO,IAAG,CAAQD,EAAG,KAAKY,EAAKI,EAAI,CAAC,EAAC,CAAC,EAC9C,IAAMC,EAASD,EAAuC,IAClDF,IAAQ,SAAWG,GAAOL,EAAI,IAAIA,EAAI,GAAG,SAAWd,GAAMmB,EAAMnB,CAAC,CAAC,CAAC,CACzE,CACF",
+  "names": ["running", "signal", "initial", "value", "subs", "read", "v", "e", "fn", "effect", "cleanup", "d", "prev", "computed", "s", "fromStore", "store", "tick", "n", "bind", "cmp", "map", "key", "setter", "src", "write"]
+}

package/dist/chunk-23XLG2EM.js

@@ -0,0 +1,2 @@
+import{a as i}from"./chunk-A2NKDOYN.js";import{a as o}from"./chunk-TIPK3SCJ.js";var t=class extends i{baseCls="op-spacer";tag="span";onRender(){let e=this.config;e.width==null&&e.flex==null&&!e.line&&(this.el.style.flex="1"),this.setLine(!!e.line)}setLine(e){this.config.line=e,this.rendered&&(this.el.classList.toggle("op-spacer--line",e),e?this.el.setAttribute("role","separator"):this.el.setAttribute("aria-hidden","true"),e&&this.el.removeAttribute("aria-hidden"))}};o("spacer",t);export{t as a};
+//# sourceMappingURL=chunk-23XLG2EM.js.map

package/dist/chunk-23XLG2EM.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/layout/spacer/spacer.ts"],
+  "sourcesContent": ["import { Component, type ComponentConfig } from '../../../core/component';\nimport { register } from '../../../core/registry';\n\nexport interface SpacerConfig extends ComponentConfig {\n  /** Renders a vertical separator line. */\n  line?: boolean;\n}\n\n/** Without `width`/`flex` it takes the free space (`flex: 1`), pushing the next items away. */\nexport class Spacer extends Component<SpacerConfig> {\n  protected override baseCls = 'op-spacer';\n  protected override tag = 'span' as const;\n  protected override onRender() {\n    const c = this.config;\n    if (c.width == null && c.flex == null && !c.line) this.el.style.flex = '1';\n    this.setLine(!!c.line);\n  }\n  setLine(line: boolean) {\n    this.config.line = line;\n    if (!this.rendered) return;\n    this.el.classList.toggle('op-spacer--line', line);\n    if (line) this.el.setAttribute('role', 'separator');\n    else this.el.setAttribute('aria-hidden', 'true');\n    if (line) this.el.removeAttribute('aria-hidden');\n  }\n}\nregister('spacer', Spacer);\n"],
+  "mappings": "gFASO,IAAMA,EAAN,cAAqBC,CAAwB,CAC/B,QAAU,YACV,IAAM,OACN,UAAW,CAC5B,IAAMC,EAAI,KAAK,OACXA,EAAE,OAAS,MAAQA,EAAE,MAAQ,MAAQ,CAACA,EAAE,OAAM,KAAK,GAAG,MAAM,KAAO,KACvE,KAAK,QAAQ,CAAC,CAACA,EAAE,IAAI,CACvB,CACA,QAAQC,EAAe,CACrB,KAAK,OAAO,KAAOA,EACd,KAAK,WACV,KAAK,GAAG,UAAU,OAAO,kBAAmBA,CAAI,EAC5CA,EAAM,KAAK,GAAG,aAAa,OAAQ,WAAW,EAC7C,KAAK,GAAG,aAAa,cAAe,MAAM,EAC3CA,GAAM,KAAK,GAAG,gBAAgB,aAAa,EACjD,CACF,EACAC,EAAS,SAAUJ,CAAM",
+  "names": ["Spacer", "Component", "c", "line", "register"]
+}

package/dist/chunk-27UZFEXD.js

@@ -0,0 +1,2 @@
+import{a as S}from"./chunk-JOFQJGZK.js";import{a as F}from"./chunk-VU3GIDZ3.js";import{a as w}from"./chunk-GNU4VOOE.js";import{c as f}from"./chunk-ZWNQREWS.js";import{a as y}from"./chunk-2ZRNGG2N.js";import{a as l}from"./chunk-2ZUZ5HDL.js";import{a as v}from"./chunk-A2NKDOYN.js";import{b as p}from"./chunk-PZSHOSOS.js";import{a as x}from"./chunk-TIPK3SCJ.js";import{e as c,f as a}from"./chunk-MW3RWBZ7.js";c("en",{stepBack:"Back",stepNext:"Next",stepFinish:"Finish",stepReview:"Review"});c("pt-BR",{stepBack:"Voltar",stepNext:"Pr\xF3ximo",stepFinish:"Concluir",stepReview:"Revis\xE3o"});var d=class extends v{baseCls="op-stepform__review";setContent(e){this.el.replaceChildren(...e)}},m=class extends F{baseCls="op-form op-stepform";stepper;body;pane;backBtn;nextBtn;finishBtn;index=0;constructor(e){let t,i=e.steps??[],s=e.review?new d:void 0,r=new S({steps:[...i.map(({title:o,description:k,icon:_,optional:A})=>({title:o,description:k,icon:_,optional:A})),...s?[{title:e.reviewTitle??a("stepReview")}]:[]]}),n=[...i.map(o=>({type:"container",title:o.title,cls:"op-stepform__step",layout:o.layout??{type:"grid",columns:2,gap:12},items:o.items})),...s?[{type:"container",title:e.reviewTitle??a("stepReview"),cls:"op-stepform__step",items:[s]}]:[]],h=new f({cls:"op-stepform__body",flex:1,layout:{type:"card"},items:n}),u=new l({text:e.backText??a("stepBack"),handler:()=>t.back()}),b=new l({text:e.nextText??a("stepNext"),variant:"primary",handler:()=>t.next()}),g=new l({text:e.finishText??a("stepFinish"),variant:"primary",htmlType:"submit"}),B=e.cancelText?[new l({text:e.cancelText,variant:"ghost",handler:()=>t.emit("cancel")})]:[],T=new w({cls:"op-stepform__footer",items:[...B,"->",u,b,g]});super({...e,layout:{type:"vbox"},items:[r,h,T]}),t=this,Object.assign(this,{stepper:r,body:h,pane:s,backBtn:u,nextBtn:b,finishBtn:g}),r.on("before-select",o=>(t.goTo(o),!1)),h.on("activate",()=>t.onActivate())}cfg(){return this.config}count(){return this.body.items.length}real(){return this.count()-(this.pane?1:0)}getStep(){return this.index}getStepCount(){return this.count()}getStepper(){return this.stepper}stepFields(e){let t=this.body.items[e];return t instanceof f?t.query(i=>i instanceof y):[]}validateStep(e){if(e>=this.real())return!0;let t=this.stepFields(e).filter(i=>!i.validate());return this.stepper.setStepState(e,t.length?"error":"done"),!t.length}goTo(e){if(e<0||e>=this.count()||e===this.index||this.emit("before-step-change",this.index,e)===!1)return!1;let t=e;if(this.cfg().linear!==!1&&e>this.index){for(let i=this.index;i<e;i++)if(!this.validateStep(i)){t=i;break}}return t!==this.index&&this.body.setActiveItem(t),t!==e&&this.stepFields(t).find(i=>i.getError())?.focus(),t===e}next(){return this.goTo(this.index+1)}back(){return this.goTo(this.index-1)}onActivate(){let e=this.body.items.indexOf(this.body.getActiveItem());if(e<0)return;let t=this.index;this.index=e,this.stepper.setActive(e);let i=this.count()-1;this.backBtn.config.hidden=e===0,this.nextBtn.config.hidden=e===i,this.finishBtn.config.hidden=e!==i;for(let[s,r]of[[this.backBtn,e===0],[this.nextBtn,e===i],[this.finishBtn,e!==i]])s.rendered&&(s.el.hidden=r);if(this.pane&&e===i&&this.refreshReview(),e!==t&&(this.emit("step-change",e,t),this.rendered&&this.el.isConnected&&!this.stepFields(e).some(s=>s.getError()))){let s=this.body.items[e]?.el;this.config.autoFocus?this.stepFields(e)[0]?.focus():s&&(s.tabIndex=-1,s.focus())}}refreshReview(){let e=this.getValues(),t=this.cfg().review;if(typeof t=="function")return this.pane.setContent([t(e,this)]);let i=[];for(let s=0;s<this.real();s++){let r=this.stepFields(s).filter(n=>n.name);r.length&&(i.push(p("h3","op-stepform__review-title",{},String(this.body.items[s].config.title??""))),i.push(p("dl","op-stepform__review-list",{},...r.flatMap(n=>[p("dt","",{},n.config.label??n.config.boxLabel??n.name),p("dd","",{},this.show_(n))]))))}this.pane.setContent(i)}show_(e){let t=e.getValue();if(typeof t=="boolean")return t?"\u2713":"\u2014";if(e.config.inputType==="password")return t?"\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022":"\u2014";let i=e.getDisplayText();return i||(t&&typeof t=="object"&&!Array.isArray(t)?Object.values(t).filter(Boolean).join(" \u2013 ")||"\u2014":Array.isArray(t)&&t.join(", ")||"\u2014")}submit(){if(this.index<this.count()-1)return this.next(),!1;let e=super.submit();for(let t=0;t<this.real();t++)this.stepper.setStepState(t,this.stepFields(t).some(i=>i.getError())?"error":"done");return e&&this.emit("finish",this.getValues()),e}reset(){super.reset(),this.clearErrors();for(let e=0;e<this.count();e++)this.stepper.setStepState(e,"pending");this.index!==0&&this.body.setActiveItem(0)}};x("stepform",m);export{m as a};
+//# sourceMappingURL=chunk-27UZFEXD.js.map

package/dist/chunk-27UZFEXD.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/form/stepform/stepform.ts"],
+  "sourcesContent": ["import { Form, type FormConfig } from '../form/form';\nimport { Container, type ContainerConfig } from '../../../core/container';\nimport { Component } from '../../../core/component';\nimport { Field } from '../../../core/field';\nimport { register } from '../../../core/registry';\nimport { h } from '../../../core/dom';\nimport { t, addMessages } from '../../../core/i18n';\nimport type { LayoutSpec } from '../../../layout/layout';\nimport { Stepper } from '../../navigation/stepper/stepper';\nimport { Button } from '../../base/button/button';\nimport { Toolbar } from '../../layout/toolbar/toolbar';\nimport '../../layout/container/container';\n\naddMessages('en', {\n  stepBack: 'Back',\n  stepNext: 'Next',\n  stepFinish: 'Finish',\n  stepReview: 'Review',\n});\naddMessages('pt-BR', {\n  stepBack: 'Voltar',\n  stepNext: 'Pr\u00F3ximo',\n  stepFinish: 'Concluir',\n  stepReview: 'Revis\u00E3o',\n});\n\nexport interface FormStep {\n  title: string;\n  description?: string;\n  icon?: string;\n  /** May be left alone: the stepper says \"optional\" (its fields are still validated if filled wrongly). */\n  optional?: boolean;\n  items: ContainerConfig['items'];\n  /** Default: two columns (one on a phone). */\n  layout?: LayoutSpec;\n}\n\nexport interface StepFormConfig extends FormConfig {\n  steps: FormStep[];\n  /** Moving forward validates the steps on the way. `false` lets the user click any step. Default true. */\n  linear?: boolean;\n  /** Adds a last \"Review\" step with a summary of the values; a function renders the summary yourself. */\n  review?: boolean | ((values: Record<string, any>, form: StepForm) => string | Node);\n  reviewTitle?: string;\n  backText?: string;\n  nextText?: string;\n  finishText?: string;\n  /** Shows a Cancel button (fires `cancel`). */\n  cancelText?: string;\n  /** On a new step, focus its first field (a phone keyboard pops up). Default false: the step panel gets the focus. */\n  autoFocus?: boolean;\n}\n\n/** The summary pane of the review step. */\nclass ReviewPane extends Component {\n  protected override baseCls = 'op-stepform__review';\n  setContent(nodes: Array<Node | string>) {\n    this.el.replaceChildren(...nodes);\n  }\n}\n\n/** One form, several steps: a Stepper on top, one step at a time, Back / Next / Finish, validation per step and an optional review. */\nexport class StepForm extends Form {\n  protected override baseCls = 'op-form op-stepform';\n  private stepper!: Stepper;\n  private body!: Container;\n  private pane?: ReviewPane;\n  private backBtn!: Button;\n  private nextBtn!: Button;\n  private finishBtn!: Button;\n  private index = 0;\n\n  constructor(config: StepFormConfig) {\n    let me!: StepForm;\n    const steps = config.steps ?? [];\n    const review = config.review ? new ReviewPane() : undefined;\n    const stepper = new Stepper({ steps: [...steps.map(({ title, description, icon, optional }) => ({ title, description, icon, optional })), ...(review ? [{ title: config.reviewTitle ?? t('stepReview') }] : [])] });\n    const panels = [\n      ...steps.map((s) => ({ type: 'container', title: s.title, cls: 'op-stepform__step', layout: s.layout ?? { type: 'grid', columns: 2, gap: 12 }, items: s.items })),\n      ...(review ? [{ type: 'container', title: config.reviewTitle ?? t('stepReview'), cls: 'op-stepform__step', items: [review] }] : []),\n    ];\n    const body = new Container({ cls: 'op-stepform__body', flex: 1, layout: { type: 'card' }, items: panels as never });\n    const backBtn = new Button({ text: config.backText ?? t('stepBack'), handler: () => me.back() });\n    const nextBtn = new Button({ text: config.nextText ?? t('stepNext'), variant: 'primary', handler: () => me.next() });\n    const finishBtn = new Button({ text: config.finishText ?? t('stepFinish'), variant: 'primary', htmlType: 'submit' });\n    const cancel = config.cancelText ? [new Button({ text: config.cancelText, variant: 'ghost', handler: () => me.emit('cancel') })] : [];\n    const footer = new Toolbar({ cls: 'op-stepform__footer', items: [...cancel, '->', backBtn, nextBtn, finishBtn] });\n    super({ ...config, layout: { type: 'vbox' }, items: [stepper, body, footer] });\n    me = this;\n    Object.assign(this, { stepper, body, pane: review, backBtn, nextBtn, finishBtn });\n    stepper.on('before-select', (i: number) => (me.goTo(i), false));\n    body.on('activate', () => me.onActivate());\n  }\n\n  private cfg(): StepFormConfig {\n    return this.config as unknown as StepFormConfig;\n  }\n\n  private count(): number {\n    return this.body.items.length;\n  }\n  private real(): number {\n    return this.count() - (this.pane ? 1 : 0);\n  }\n\n  getStep(): number {\n    return this.index;\n  }\n  getStepCount(): number {\n    return this.count();\n  }\n  getStepper(): Stepper {\n    return this.stepper;\n  }\n\n  private stepFields(i: number): Field<any>[] {\n    const step = this.body.items[i];\n    return step instanceof Container ? (step.query((c) => c instanceof Field) as Field<any>[]) : [];\n  }\n\n  /** Validates one step's fields (marks the errors, sets its state on the stepper). */\n  validateStep(i: number): boolean {\n    if (i >= this.real()) return true;\n    const bad = this.stepFields(i).filter((f) => !f.validate());\n    this.stepper.setStepState(i, bad.length ? 'error' : 'done');\n    return !bad.length;\n  }\n\n  /** Moves to a step. Forward with `linear` validates the steps on the way and stops at the first invalid one. Returns whether it got there. */\n  goTo(j: number): boolean {\n    if (j < 0 || j >= this.count() || j === this.index) return false;\n    if (this.emit('before-step-change', this.index, j) === false) return false;\n    let target = j;\n    if (this.cfg().linear !== false && j > this.index) {\n      for (let k = this.index; k < j; k++) {\n        if (!this.validateStep(k)) {\n          target = k;\n          break;\n        }\n      }\n    }\n    if (target !== this.index) this.body.setActiveItem(target);\n    if (target !== j) this.stepFields(target).find((f) => f.getError())?.focus();\n    return target === j;\n  }\n  next(): boolean {\n    return this.goTo(this.index + 1);\n  }\n  back(): boolean {\n    return this.goTo(this.index - 1);\n  }\n\n  /** The card layout changed the visible step (by `goTo`, or because `validate` brought an invalid field into view). */\n  private onActivate(): void {\n    const i = this.body.items.indexOf(this.body.getActiveItem()!);\n    if (i < 0) return;\n    const from = this.index;\n    this.index = i;\n    this.stepper.setActive(i);\n    const last = this.count() - 1;\n    this.backBtn.config.hidden = i === 0;\n    this.nextBtn.config.hidden = i === last;\n    this.finishBtn.config.hidden = i !== last;\n    for (const [b, hide] of [[this.backBtn, i === 0], [this.nextBtn, i === last], [this.finishBtn, i !== last]] as const) if (b.rendered) b.el.hidden = hide;\n    if (this.pane && i === last) this.refreshReview();\n    if (i !== from) {\n      this.emit('step-change', i, from);\n      if (this.rendered && this.el.isConnected && !this.stepFields(i).some((f) => f.getError())) {\n        const panel = this.body.items[i]?.el;\n        if ((this.config as StepFormConfig).autoFocus) this.stepFields(i)[0]?.focus();\n        else if (panel) ((panel.tabIndex = -1), panel.focus());\n      }\n    }\n  }\n\n  private refreshReview(): void {\n    const values = this.getValues();\n    const fn = this.cfg().review;\n    if (typeof fn === 'function') return this.pane!.setContent([fn(values, this)]);\n    const out: Array<Node | string> = [];\n    for (let i = 0; i < this.real(); i++) {\n      const rows = this.stepFields(i).filter((f) => f.name);\n      if (!rows.length) continue;\n      out.push(h('h3', 'op-stepform__review-title', {}, String((this.body.items[i].config as { title?: string }).title ?? '')));\n      out.push(h('dl', 'op-stepform__review-list', {}, ...rows.flatMap((f) => [h('dt', '', {}, f.config.label ?? (f.config as { boxLabel?: string }).boxLabel ?? f.name!), h('dd', '', {}, this.show_(f))])));\n    }\n    this.pane!.setContent(out);\n  }\n\n  /** What the user sees for a field (its display text; ticks for booleans, dots for passwords). */\n  private show_(f: Field<any>): string {\n    const v = f.getValue();\n    if (typeof v === 'boolean') return v ? '\u2713' : '\u2014';\n    if ((f.config as { inputType?: string }).inputType === 'password') return v ? '\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022' : '\u2014';\n    const text = f.getDisplayText();\n    if (text) return text;\n    return v && typeof v === 'object' && !Array.isArray(v) ? Object.values(v).filter(Boolean).join(' \u2013 ') || '\u2014' : Array.isArray(v) ? v.join(', ') || '\u2014' : '\u2014';\n  }\n\n  /** Enter and the Finish button: Next on every step but the last; on the last, validate everything and `finish`. */\n  override submit(): boolean {\n    if (this.index < this.count() - 1) {\n      this.next();\n      return false;\n    }\n    const ok = super.submit();\n    for (let i = 0; i < this.real(); i++) this.stepper.setStepState(i, this.stepFields(i).some((f) => f.getError()) ? 'error' : 'done');\n    if (ok) this.emit('finish', this.getValues());\n    return ok;\n  }\n\n  /** Clears the values and goes back to the first step. */\n  override reset(): void {\n    super.reset();\n    this.clearErrors();\n    for (let i = 0; i < this.count(); i++) this.stepper.setStepState(i, 'pending');\n    if (this.index !== 0) this.body.setActiveItem(0);\n  }\n}\nregister('stepform', StepForm);\n"],
+  "mappings": "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",
+  "names": ["addMessages", "ReviewPane", "Component", "nodes", "StepForm", "Form", "config", "me", "steps", "review", "stepper", "Stepper", "title", "description", "icon", "optional", "t", "panels", "s", "body", "Container", "backBtn", "Button", "nextBtn", "finishBtn", "cancel", "footer", "Toolbar", "i", "step", "c", "Field", "bad", "f", "j", "target", "k", "from", "last", "b", "hide", "panel", "values", "fn", "out", "rows", "h", "v", "text", "ok", "register"]
+}

package/dist/chunk-2UPUC4RK.js

@@ -0,0 +1,2 @@
+var a={enabled:!0,respectReducedMotion:!0,ease:{out:"cubic-bezier(0, 0, 0.2, 1)",in:"cubic-bezier(0.4, 0, 1, 1)",inOut:"cubic-bezier(0.4, 0, 0.2, 1)"},duration:{dropdown:200,popover:200,modal:240,press:100,pulse:450,reveal:350,swap:220,move:450,enter:250},dropdownRange:[150,250],exitRatio:.8,stagger:{step:30,max:12},press:{scale:.97},popover:{scale:.95},stretch:{amount:.12},arc:{bend:.25},blur:4,rubber:{resistance:.55,settle:320},allowBounce:!1,originFromTrigger:!0};function p(e){if(/spring|elastic|bounce/i.test(e))return!0;let o=/cubic-bezier\(([^)]+)\)/i.exec(e);if(!o)return!1;let[,t,,n]=o[1].split(",").map(Number);return t<0||t>1||n<0||n>1}var r=structuredClone(a),i=new Set,c=(e,o)=>{let t=Array.isArray(e)?[...e]:{...e};for(let n in o)t[n]=o[n]&&typeof o[n]=="object"&&!Array.isArray(o[n])&&e[n]?c(e[n],o[n]):o[n];return t},m=()=>typeof matchMedia=="function"&&matchMedia("(prefers-reduced-motion: reduce)").matches;function u(){if(typeof document>"u")return;let e=r,o=s.isOn(),t=document.documentElement.style,n=(d,l)=>t.setProperty(`--op-motion-${d}`,String(l));n("ease-out",e.ease.out),n("ease-in",e.ease.in),n("ease-in-out",e.ease.inOut),n("press-scale",o?e.press.scale:1),n("press-duration",`${o?e.duration.press:0}ms`),n("popover-scale",o?e.popover.scale:1),n("dropdown-duration",`${o?s.dropdownMs():0}ms`),n("exit-ratio",e.exitRatio),n("stagger-step",`${o?e.stagger.step:0}ms`),n("blur",`${e.blur}px`),document.documentElement.classList.toggle("op-motion-off",!o)}var s={get(){return r},set(e){let o=[],t=c(r,e);for(let n of Object.keys(t.ease))!t.allowBounce&&p(t.ease[n])&&(o.push(`ease.${n}: "${t.ease[n]}" bounces (set allowBounce: true to use it)`),t.ease[n]=r.ease[n]);return r=t,u(),i.forEach(n=>n(r)),{rejected:o}},reset(){r=structuredClone(a),u(),i.forEach(e=>e(r))},enable(){s.set({enabled:!0})},disable(){s.set({enabled:!1})},isOn(){return r.enabled&&!(r.respectReducedMotion&&m())},dropdownMs(){let[e,o]=r.dropdownRange;return Math.max(e,Math.min(o,r.duration.dropdown))},ms(e,o="enter"){let t=e==="dropdown"?s.dropdownMs():r.duration[e];return o==="exit"?Math.round(t*r.exitRatio):t},easing(e){return e==="enter"?r.ease.out:e==="exit"?r.ease.in:r.ease.inOut},on(e){return i.add(e),()=>{i.delete(e)}}};u();export{a,p as b,s as c};
+//# sourceMappingURL=chunk-2UPUC4RK.js.map

package/dist/chunk-2UPUC4RK.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/motion/config.ts"],
+  "sourcesContent": ["/** Global motion settings: one object, one switch. Defaults are the numbers of the 20 motion rules. */\nexport interface MotionConfig {\n  enabled: boolean;\n  /** When true (default) a user who asked the OS for reduced motion gets none. */\n  respectReducedMotion: boolean;\n  ease: { out: string; in: string; inOut: string };\n  /** Milliseconds. */\n  duration: { dropdown: number; popover: number; modal: number; press: number; pulse: number; reveal: number; swap: number; move: number; enter: number };\n  /** The dropdown duration is clamped into this range (rule 2). */\n  dropdownRange: [number, number];\n  /** Exit duration = enter duration \u00D7 this (rule 15). */\n  exitRatio: number;\n  stagger: { step: number; max: number };\n  press: { scale: number };\n  popover: { scale: number };\n  stretch: { amount: number };\n  arc: { bend: number };\n  /** Blur in px used by crossfades (rule 18). */\n  blur: number;\n  rubber: { resistance: number; settle: number };\n  /** Rule 13: easings that overshoot are refused unless this is true. */\n  allowBounce: boolean;\n  originFromTrigger: boolean;\n}\n\nexport const DEFAULTS: MotionConfig = {\n  enabled: true,\n  respectReducedMotion: true,\n  ease: { out: 'cubic-bezier(0, 0, 0.2, 1)', in: 'cubic-bezier(0.4, 0, 1, 1)', inOut: 'cubic-bezier(0.4, 0, 0.2, 1)' },\n  duration: { dropdown: 200, popover: 200, modal: 240, press: 100, pulse: 450, reveal: 350, swap: 220, move: 450, enter: 250 },\n  dropdownRange: [150, 250],\n  exitRatio: 0.8,\n  stagger: { step: 30, max: 12 },\n  press: { scale: 0.97 },\n  popover: { scale: 0.95 },\n  stretch: { amount: 0.12 },\n  arc: { bend: 0.25 },\n  blur: 4,\n  rubber: { resistance: 0.55, settle: 320 },\n  allowBounce: false,\n  originFromTrigger: true,\n};\n\nexport type DeepPartial<T> = { [K in keyof T]?: T[K] extends object ? (T[K] extends unknown[] ? T[K] : DeepPartial<T[K]>) : T[K] };\n\n/** A `cubic-bezier` whose control points leave [0, 1] on the y axis overshoots (bounces); springs always do. */\nexport function isBouncy(easing: string): boolean {\n  if (/spring|elastic|bounce/i.test(easing)) return true;\n  const m = /cubic-bezier\\(([^)]+)\\)/i.exec(easing);\n  if (!m) return false;\n  const [, y1, , y2] = m[1].split(',').map(Number);\n  return y1 < 0 || y1 > 1 || y2 < 0 || y2 > 1;\n}\n\ntype Listener = (c: Readonly<MotionConfig>) => void;\nlet current: MotionConfig = structuredClone(DEFAULTS);\nconst listeners = new Set<Listener>();\n\nconst merge = (base: any, patch: any): any => {\n  const out = Array.isArray(base) ? [...base] : { ...base };\n  for (const k in patch) out[k] = patch[k] && typeof patch[k] === 'object' && !Array.isArray(patch[k]) && base[k] ? merge(base[k], patch[k]) : patch[k];\n  return out;\n};\n\nconst reduced = () => typeof matchMedia === 'function' && matchMedia('(prefers-reduced-motion: reduce)').matches;\n\n/** Writes the settings that CSS needs as custom properties on <html>, and the `op-motion-off` class. */\nfunction apply(): void {\n  if (typeof document === 'undefined') return;\n  const c = current;\n  const on = motion.isOn();\n  const s = document.documentElement.style;\n  const set = (k: string, v: string | number) => s.setProperty(`--op-motion-${k}`, String(v));\n  set('ease-out', c.ease.out);\n  set('ease-in', c.ease.in);\n  set('ease-in-out', c.ease.inOut);\n  set('press-scale', on ? c.press.scale : 1);\n  set('press-duration', `${on ? c.duration.press : 0}ms`);\n  set('popover-scale', on ? c.popover.scale : 1);\n  set('dropdown-duration', `${on ? motion.dropdownMs() : 0}ms`);\n  set('exit-ratio', c.exitRatio);\n  set('stagger-step', `${on ? c.stagger.step : 0}ms`);\n  set('blur', `${c.blur}px`);\n  document.documentElement.classList.toggle('op-motion-off', !on);\n}\n\nexport const motion = {\n  get(): Readonly<MotionConfig> {\n    return current;\n  },\n  /**\n   * Changes the settings (deep merge). Easings that bounce are refused while `allowBounce` is false; the rest of the patch\n   * still applies. Returns what was refused.\n   */\n  set(patch: DeepPartial<MotionConfig>): { rejected: string[] } {\n    const rejected: string[] = [];\n    const next = merge(current, patch) as MotionConfig;\n    for (const k of Object.keys(next.ease) as Array<keyof MotionConfig['ease']>) {\n      if (!next.allowBounce && isBouncy(next.ease[k])) {\n        rejected.push(`ease.${k}: \"${next.ease[k]}\" bounces (set allowBounce: true to use it)`);\n        next.ease[k] = current.ease[k];\n      }\n    }\n    current = next;\n    apply();\n    listeners.forEach((fn) => fn(current));\n    return { rejected };\n  },\n  reset(): void {\n    current = structuredClone(DEFAULTS);\n    apply();\n    listeners.forEach((fn) => fn(current));\n  },\n  enable(): void {\n    motion.set({ enabled: true });\n  },\n  disable(): void {\n    motion.set({ enabled: false });\n  },\n  /** Motion is switched on and the user did not ask for reduced motion (unless `respectReducedMotion` is off). */\n  isOn(): boolean {\n    return current.enabled && !(current.respectReducedMotion && reduced());\n  },\n  /** The dropdown duration, clamped into `dropdownRange`. */\n  dropdownMs(): number {\n    const [lo, hi] = current.dropdownRange;\n    return Math.max(lo, Math.min(hi, current.duration.dropdown));\n  },\n  /** Duration for a kind of motion in a phase: exits are `exitRatio` times shorter (rule 15). */\n  ms(kind: keyof MotionConfig['duration'], phase: 'enter' | 'exit' = 'enter'): number {\n    const base = kind === 'dropdown' ? motion.dropdownMs() : current.duration[kind];\n    return phase === 'exit' ? Math.round(base * current.exitRatio) : base;\n  },\n  /** Easing for a phase: entrances ease-out, exits ease-in, movement ease-in-out. */\n  easing(phase: 'enter' | 'exit' | 'move'): string {\n    return phase === 'enter' ? current.ease.out : phase === 'exit' ? current.ease.in : current.ease.inOut;\n  },\n  /** Subscribe to changes; returns the unsubscribe function. */\n  on(fn: Listener): () => void {\n    listeners.add(fn);\n    return () => void listeners.delete(fn);\n  },\n};\napply();\n"],
+  "mappings": "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",
+  "names": ["DEFAULTS", "isBouncy", "easing", "m", "y1", "y2", "current", "listeners", "merge", "base", "patch", "out", "k", "reduced", "apply", "c", "on", "motion", "s", "set", "v", "rejected", "next", "fn", "lo", "hi", "kind", "phase"]
+}

package/dist/chunk-2ZRNGG2N.js

@@ -0,0 +1,2 @@
+import{a as o}from"./chunk-A2NKDOYN.js";import{b as r,c as s}from"./chunk-PZSHOSOS.js";import{f as l}from"./chunk-MW3RWBZ7.js";var n=class extends o{baseCls="op-field";value;original;error="";inputEl;labelEl;helpEl;errorEl;dirty=!1;cancelSettle;constructor(e={}){super(e),this.value=this.original=e.value??this.emptyValue()}get name(){return this.config.name}emptyValue(){return""}isEmpty(e){return e==null||e===""||Array.isArray(e)&&!e.length}isEqual(e,t){return e===t||JSON.stringify(e)===JSON.stringify(t)}build(){let e=this.config,t=r("div",`${this.baseCls}${e.labelPos==="left"?" op-field--label-left":""}`);this.labelEl=r("label","op-field__label");let i=r("div","op-field__control",{},this.createControl());return this.helpEl=r("div","op-field__help",{id:`${this.id}-help`}),this.errorEl=r("div","op-field__error",{id:`${this.id}-error`,role:"alert"}),t.append(this.labelEl,i,this.helpEl,this.errorEl),t}onRender(){let e=this.config,t=this.inputEl;t.id||=s("op-input"),this.labelEl.htmlFor=t.id,e.ariaLabel&&t!==this.el&&(t.setAttribute("aria-label",e.ariaLabel),this.el.removeAttribute("aria-label")),this.setLabel(e.label??""),this.setHelp(e.help??""),this.setRequired(!!e.required),this.setReadonly(!!e.readonly),this.applyValue(this.value),this.paintError(),this.listen(this.el,"focusin",()=>{this.el.classList.add("is-focused"),this.emit("focus")}),this.listen(this.el,"focusout",i=>{this.el.contains(i.relatedTarget)||(this.flushSettled(),this.el.classList.remove("is-focused"),(e.validateOn??"blur")==="blur"&&this.validate(),this.emit("blur"))})}focusEl(){return this.render(),this.inputEl}getValue(){return this.value}setValue(e,t=!1){let i=this.value;this.value=e,this.rendered&&this.applyValue(e),this.isEqual(i,e)||this.changed(i,t)}commit(e){let t=this.value;this.value=e,this.isEqual(t,e)||this.changed(t,!1)}changed(e,t){this.updateDirty(),!t&&((this.config.validateOn==="change"||this.error)&&this.validate(),this.emit("change",this.value,e),this.queueSettled())}queueSettled(){this.cancelSettle?.(),this.cancelSettle=void 0;let e=this.config.debounce;if(!e)return void this.emit("settled",this.value);this.cancelSettle=this.later(()=>{this.cancelSettle=void 0,this.emit("settled",this.value)},e)}flushSettled(){this.cancelSettle&&(this.cancelSettle(),this.cancelSettle=void 0,this.emit("settled",this.value))}updateDirty(){let e=this.isDirty();e!==this.dirty&&(this.dirty=e,this.rendered&&this.el.classList.toggle("is-dirty",e),this.emit("dirty-change",e))}getDisplayText(){let e=this.value;return this.isEmpty(e)?"":String(e)}clear(){this.setValue(this.emptyValue())}isDirty(){return!this.isEqual(this.value,this.original)}markClean(){this.original=this.value,this.updateDirty()}reset(){this.setValue(this.original,!0),this.clearError()}check(){let e=this.value;if(this.isEmpty(e))return this.config.required?l("required"):"";for(let t of this.config.validators??[]){let i=t(e,this);if(typeof i=="string")return i}return""}validate(){let e=this.check();return e?this.setError(e):this.clearError(),!e}isValid(){return!this.check()}getError(){return this.error}setError(e){let t=this.error;this.error=e,this.paintError(),e&&e!==t&&this.emit("invalid",e)}clearError(){this.error&&(this.error="",this.paintError(),this.emit("valid"))}paintError(){this.rendered&&(this.errorEl.textContent=this.error,this.el.classList.toggle("is-invalid",!!this.error),this.inputEl.setAttribute("aria-invalid",String(!!this.error)),this.describe())}describe(){let e=[this.error&&this.errorEl.id,this.config.help&&this.helpEl.id].filter(Boolean);e.length?this.inputEl.setAttribute("aria-describedby",e.join(" ")):this.inputEl.removeAttribute("aria-describedby")}setLabel(e){this.config.label=e,this.rendered&&(this.labelEl.textContent=e,this.labelEl.hidden=!e)}setHelp(e){this.config.help=e,this.rendered&&(this.helpEl.textContent=e,this.helpEl.hidden=!e,this.describe())}setRequired(e){this.config.required=e,this.rendered&&(this.el.classList.toggle("is-required",e),this.inputEl.setAttribute("aria-required",String(e)))}setReadonly(e){this.config.readonly=e,this.rendered&&(this.el.classList.toggle("is-readonly",e),this.onReadonly(e))}setValidators(e){this.config.validators=e}onReadonly(e){}};export{n as a};
+//# sourceMappingURL=chunk-2ZRNGG2N.js.map