Changelog
All notable changes to this project will be documented in this file.
The format is based on Keep a Changelog, and this project adheres to Semantic Versioning.
1.36.1 (2026-10-23)
fix: allow size overwrites (#193)
fix: allow size overwrites
- Add inherited
--orio-control-*variables for control and slider size tokens. - Keep control-local
--control-*styles higher priority than inherited overrides. - Document global and local control overrides.
- Update
useControlSizedocumentation and token definitions. - Add tests for defaults, ancestor overrides, and precedence.
- Update the documented test-suite count from 57 to 58.
fix: removed unneccessary orio classes from the components (#195)
fix: remove unnecessary Orio classes from components
- Replace the Button class
orio-button-elwithbutton-element. - Replace the NavButton class
orio-nav-button-elwithnav-button-element. - Replace the Map class
orio-mapwithmap. - Replace Tooltip’s prefixed classes with
tooltip,tooltip-content, andtooltip-arrow. Move tooltip styles into the scoped style block. - Update Tooltip documentation to describe scoped styles and the new arrow classes.
- Change the icon-registry examples to use the kebab-case
<orio-icon>tag. - Update Tooltip tests to query the new class names.
1.36.0 (2026-10-20)
feat: Implemented slider component
- Add the
SliderVue component with range input support, value clamping, step normalization, model updates, slots, attribute forwarding, and filled-track styling. - Add slider thumb and track size tokens for all control sizes.
- Add English and Ukrainian Slider documentation with usage examples, props, events, slots, keyboard support, and styling variables.
- Add Slider component routing entries and agent documentation.
- Add tests for attributes, value normalization, fractional steps, fill percentage, disabled state, labels, and form binding.
- Update component and test-suite counts to 68 components and 57 test suites.
1.35.0 (2026-10-17)
feat: modal opens and closes from the trigger like an iOS app launch
- Measure the modal’s laid-out rectangle and animate it from the trigger’s
originwith translation and scaling. - Reverse the morph on close and fade the modal near the end. Keep
originset until closing completes. - Fade the backdrop independently from the modal.
- Use
event.currentTargetfor the origin when available, withevent.targetas a fallback. CallopenModal(event)synchronously socurrentTargetis available. - Update the modal and
openModaldocumentation to describe the animation and event behavior.
1.34.0 (2026-10-02)
feat: to prop on Button and NavButton renders a real link with router navigation (#186)
feat: to prop on Button and NavButton renders a real link with router navigation
- Add a
toprop toButtonandNavButton. EnabledButtoncomponents render anchors withhrefvalues and retain their styling. - Route eligible internal clicks through Vue Router when available. Keep modifier-clicks, external URLs, protocol URLs, and fragment links under native browser behavior. Skip router navigation for links with a non-
_selftarget or adownloadattribute. - Keep disabled or loading
Buttoncomponents as buttons. Keep disabledNavButtoncomponents as disabled anchors without link behavior. - Preserve
NavButton’s caller-providedactivestate for styling andaria-current. - Add tests for link rendering, click handling, navigation, and disabled or loading behavior.
- Update component documentation and agent guidance with link usage and examples.
feat: map component + violet theme (#185)
feat: map component + violet theme
- Add
<orio-map>with pannable, zoomable MapLibre maps that display one coordinate and update the view when coordinates change. - Load MapLibre and its CSS on mount. Use OpenFreeMap light or dark styles by default, with no API key.
- Add
markerIcon,markerColor, and#markerslot options for marker customization. - Add
useMapStyleto select styles by mode and tint eligible water and road layers with the accent color. - When
mapStyleprovides a custom style URL, use that style instead of automatic mode styles and tinting. - Add the
violettheme to runtime theme options, theme switching, and theme documentation. - Add map translations, component and composable guidance, and a map documentation page with examples.
- Add Map component tests and update ThemeSwitcher tests for the
violettheme.
1.33.0 (2026-09-29)
feat: Add a long-press wrapper for components
- Add the
LongPresscomponent anduseLongPresscomposable. The composable triggers after a configurable hold delay or Safari force input, and cancels when the pointer is released, leaves, is cancelled, or moves beyond the configured tolerance. - Add
trigger,pressStart, andpressCancelcomponent events, plus press-state and disabled styling. Respect reduced-motion preferences. - Suppress the next non-keyboard click after a trigger. Handle nested targets so only the innermost long-press handler starts.
- Export the component, composable, and their public types from the runtime entry point.
- Add component and composable documentation, agent references, and tests.
- Update
usePressAndHolddescriptions to focus on auto-repeat and ramp behavior.
1.32.3 (2026-09-28)
Bug Fixes
1.32.2 (2026-09-22)
Bug Fixes
1.32.1 (2026-09-15)
Bug Fixes
1.32.0 (2026-09-15)
feat: Implemented toast component
- Add the
Toastcomponent with variants, actions, slots, accessibility roles, timeout progress, and close controls. - Add
useToastwith shared queues, targets, positions, limits, auto-dismiss, pause/resume, sticky toasts, and action handling. - Add automatic client-side host mounting through the Nuxt plugin.
- Add English and Ukrainian close-label translations.
- Add component and composable documentation.
- Add agent routing and implementation guidance for
ToastanduseToast. - Update feature and test-suite counts.
- Add comprehensive component, host, mounting, and composable tests.
- Update the pre-commit hook to initialize NVM before routing generation.
1.31.1 (2026-08-31)
fix: fixed the file upload that stripped the only one file; and attributes bind on the selectors
- Preserve all dropped files when
maxFilesis undefined. - Truncate files only when
maxFilesis configured. - Forward fallthrough attributes to
SelectorandTaggableSelectortrigger elements. - Update upload documentation to use
File[]with an empty-array default. - Add tests for upload behavior and selector attribute forwarding.
1.31.0 (2026-08-20)
Features
1.30.0 (2026-07-30)
Added
<orio-date-month-calendar>— 12-month (3×4) grid picker with year navigation, roving-focus keyboard a11y, markers and disabled-month support. Exported asDateMonthCalendarwithMonthCalendarProps.monthprop on<orio-date-picker>and<orio-date-range-picker>— swaps the day calendar for the month calendar and switches the trigger display toMMM yyyy. The range picker seeds its two panels to consecutive years instead of consecutive months in month mode.<orio-theme-switcher>/<orio-mode-switcher>— preconfiguredSelectorwrappers overuseTheme; select to persist accent theme or light/dark mode to cookies.ModeSwitcherlabels come from i18n.THEMES/MODESconstants exported from the package root, for building custom pickers.TaggableSelectoris now searchable and creatable — fuzzy search over string or object options (v-model:search), tag chips in the trigger, acreateevent fired from the "Create …" affordance or Enter when nothing matches, plusallowCreateandtagVariantprops. ExportedTaggableSelectorProps.- New
Selector#triggerslot props —isOpen,triggerKeydown,selectHighlighted,getOptionKey,getOptionLabel.triggerKeydownreuses the built-in roving list navigation and passes only ArrowUp/ArrowDown/Escape through when the event originates in an inner<input>or contenteditable, so a custom trigger can host a text field without hijacking typing. iconand default slots on<orio-dashed-container>, falling back to the existingicon/textprops.presentText/ ongoing ranges in<orio-view-dates>—end: nullnow renders a "Present" label (i18ndates.present);end: undefinedstill means a single date. ExportedViewDatesRange.- Icons:
add,close-rounded,upload-file,upload-file-filled,wrench. - Docs for MonthCalendar, ThemeSwitcher, ModeSwitcher; theming guide section on the ready-made switchers.
- Tests: new suites for CalendarGrid, MonthCalendar, DatePicker, DateRangePicker, DashedContainer, Icon, ThemeSwitcher, ModeSwitcher and TaggableSelector; expanded Selector, Calendar and ViewDates coverage.
Changed
- Calendar internals extracted — the day grid markup, cell states and marker classes moved into a shared
date/components/CalendarGrid.vue(CalendarCell), now used by bothCalendarandMonthCalendar. Marker resolution moved toutils/calendar-markers.ts(createMarkerResolver), with anormalizehook so month cells match day-precision marker bounds. CalendarMarker/MarkerVariantnow live inutils/calendar-markers.ts; still re-exported fromCalendar.vueand the package root.- Calendar cells report
outOfMonth: trueinstead ofinMonth: false. - Calendar arrow-key overflow now skips disabled days in the travel direction (capped at ~2 years) and PageUp/PageDown jumps a month, or a year with Shift.
- Opening a
Selectorlist always seeds the roving highlight, so the first arrow press moves from the selected item rather than nowhere. Custom triggers no longer need to touch the highlight.
Fixed
Selectorno longer throws in multi-select when the model value is not yet an array —isOptionSelectedguards withArray.isArray.PopoverandTooltipscroll/resize listeners drop the explicitwindowtarget, making them SSR-safe.<orio-view-dates>no longer formats anullend date as an empty string when the range is ongoing.
Accessibility
MonthCalendarandCalendarGridshiprole="grid", per-cellaria-labelfrom a locale-aware long format,aria-selected, and a single tab stop with roving focus.- The
TaggableSelectortrigger is a properrole="combobox"witharia-haspopup="listbox"/aria-expanded, keyboard-navigable via the sharedtriggerKeydownhandler. - Empty search results render
<orio-empty-state>instead of a bare string.
1.29.0 (2026-07-09)
Features
1.28.1 (2026-06-17)
Adds "xs" to the ControlSize union with a full CSS-variable token set in useControlSize.ts, introduces a pill boolean prop on Button.vue that applies --border-radius-pill, applies both to vertical NumberInput chevrons, pins horizontal NumberInput buttons to size="sm" with a z-index fix, and separately adds a sidebarSection helper to normalize VitePress sidebar links.
1.28.0 (2026-06-13)
This PR introduces a comprehensive infrastructure for generating, organizing, and distributing AI agent documentation from USAGE.md frontmatter metadata. It includes entry discovery and routing generation scripts, build-time automation via git hooks, a consumer-facing CLI, updated agent instructions with a new usage-auditor subagent, and 85+ component and composable usage documentation files.
1.27.0 (2026-06-06)
This PR establishes a Claude agent framework for the orio-ui Nuxt component library, defining three specialized subagents and comprehensive USAGE.md documentation. Agent roles include component discovery, integration workflow guidance, and useFilter API onboarding, complemented by per-component invariant documentation.
1.26.0 (2026-06-06)
This PR introduces the useFilter composable for managing named filter groups with shared registry-backed state, optional URL query synchronization, and computed active-filter lists, alongside comprehensive documentation and usage examples. It also enhances Button.vue to support customizable left and right icon slots with prop-based fallback rendering.
1.25.1 (2026-05-27)
Multiple runtime form and button components now source control attributes from orio-control-element's scoped control slot and merge those bindings with $attrs in templates; local redundant props (e.g., disabled, name) and explicit attribute bindings were removed.
1.25.0 (2026-05-26)
This PR adds a generic 2D roving-grid composable, integrates roving focus into Calendar navigation and day grid, updates ControlElement/Input/Button to pass merged control attrs, updates calendar i18n keys, and refreshes Calendar docs examples to new demo dates.
1.24.0 (2026-05-09)
This PR refactors the date picker system by introducing a reusable Calendar primitive component, restructuring DatePicker and DateRangePicker as higher-level wrappers, adding date utility functions, and updating documentation and tests to match the new architecture.
1.23.3 (2026-05-04)
The Canvas export functionality is refactored and exposed. Export logic is extracted into reusable renderCanvasSnapshot and performExport functions with new types (ExportOptions, ExportResult). An exportCanvas method is added to CanvasContext and implemented in the Canvas component, re-exported via the canvas runtime module.
1.23.2 (2026-04-30)
This PR introduces a named registry system for the Canvas component, enabling toolbars to be mounted anywhere in the component tree and bind to specific canvas instances by name. A canvasRegistry module tracks canvas contexts by identifier, while the Canvas component registers itself on mount and the Toolbar resolves its target canvas via an explicit canvas prop.
1.23.1 (2026-04-23)
The changes add two-finger touch gesture support to ZoomableContainer.vue, enabling pinch zoom and pan operations. When two touch pointers are detected, the component enters pinch mode, calculates zoom and pan transformations from the pinch midpoint, and gracefully handles state transitions when touches begin or end.
1.23.0 (2026-04-21)
Added a new CarouselPreview component, its documentation, and a runtime export. The component renders a horizontal thumbnail strip, syncs selection via a shared v-model:activeImage with the main carousel, and auto-hides when fewer than two images exist.
1.22.2 (2026-04-21)
This PR introduces interactive transformation tools for the Canvas component (rotate, resize, transform modes), adds image insertion and canvas export capabilities, implements a new ZoomableContainer component, extends canvas rendering to support node rotation, updates package exports to include canvas subpath, and provides comprehensive documentation for these features.
1.22.1 (2026-04-17)
Adds handle-based transform features (rotate, resize, combined transform), image import and canvas export tools, cursor-override API, rotated-node rendering and hit-testing, new tooltips/icons/docs, exports for new tools, and tests covering interactions and export behavior.
1.22.0 (2026-04-16)
Adds a new Canvas feature: a pluggable, tool-driven HTML <canvas> system with tool APIs, stage/toolbar UI, node CRUD/history composables, nine built-in tools, hit-testing utilities, docs, i18n, icon additions, and small auto-registration/theme fixes.
1.21.0 (2026-04-10)
Adds vue-i18n: new runtime i18n module and en/uk resources, a Nuxt runtime i18n plugin and module registration, package dependency update, localized component text and locale-aware formatting, docs/theme locale switcher, updated tests, and a new LocaleSwitcher component. (50 words)
1.20.0 (2026-04-06)
feat: Implemented list item and taggable select; Integrated list item into a select (#134)
Adds two new components (ListItem, TaggableSelector), updates Selector to render options via ListItem and delegate selectable/selected state, adjusts CheckBox and Tag typings/styling, updates public exports, and adds/updates documentation and site styling; docs component count changed from 32 → 34.
fix(button): Added possibility for the control element to fill the block (#132)
This PR updates the component count in documentation from 31 to 32, and adds a new optional fill prop to the ControlElement component that enables child elements to expand and fill available space through flexbox styling.
1.19.0 (2026-03-26)
Fixes: Adds a runtime control-size composable (provide/inject) and applies computed size token styles to components; refactors carousel measurement to use explicit measured dimensions and broader child selectors; replaces HTMLAudioElement playback with a cached Web Audio API pipeline and async play/prefetch.
Features: Adds a new Vue Form component with model-bound field wiring, submit emission, and loading/disabled handling, plus documentation and an export from the runtime index.
CI/CD: The PR updates the changelog injection workflow to use HTML comment markers instead of override blocks, renaming the job accordingly. Additionally, a new workflow is introduced that automatically enriches the changelog by extracting and inserting CodeRabbit summaries from referenced PRs into the latest version section.
1.18.1 (2026-03-22)
Bug Fixes
1.18.0 (2026-03-12)
Keyboard & Accessibility
- Full keyboard navigation for Selector — Arrow keys, Home/End, Enter/Space/Escape now navigate and select options with automatic scroll-into-view
- ARIA attributes — Selector exposes
aria-haspopup,aria-expanded,aria-multiselectable,aria-selected,role="listbox", androle="option"for screen reader support
Component Improvements
- Popover — Migrated to TypeScript with typed props (
position,offset,disabled), automatic fallback repositioning when the popover overflows the viewport - Badge — New option to hide the badge; updated documentation with additional examples
- Icon — Sizing now driven by
--control-icon-sizeCSS custom property instead of a static prop, allowing icons to auto-scale with ControlElement size variants
Architecture & Bug Fixes
- Standardized attribute forwarding — ControlElement uses
inheritAttrs: falsewith explicit$attrsbinding; all consumers (Button, Input, Textarea, Selector, CheckBox, etc.) cleanly separate control-level props from native HTML attributes forwarded to inner elements - RadioButton —
labelprop renamed totextto avoid collision withControlProps.label - Fixed input click handling — Removed
pointer-events: noneon inner layout so floating-label inputs correctly receive click events
Internal
- New
useListKeyboardcomposable — reusable keyboard navigation logic for list-based components - 20 files changed across the codebase with a net addition of ~200 lines
1.17.0 (2026-02-27)
Features
- add control-label-font-size variable and adjust inner layout spacing (54d3b55)
1.16.2 (2026-02-25)
Bug Fixes
- Added minimal appearance for carousel component (9e8e525)
- badge: reduce horizontal padding from 0.5rem to 0.35rem (4c843b3)
- effort to make ai-generated changelog (#105) (ec279f5)
1.16.1 (2026-02-24)
Bug Fixes
- missing import in urlSync composable (bc61531)
1.16.0 (2026-02-24)
Features
- added url syncer, reactively add given props to url (0f21903)
1.15.0 (2026-02-23)
Features
1.14.0 (2026-02-19)
Features
- Added sizing options for everything reasonable that is wrapped into control element (e3ddf68)
1.13.1 (2026-02-16)
Bug Fixes
- simplified dynamic size calculation for carousel with resize observer (cbc55f1)
1.13.0 (2026-02-11)
Features
- added inner label to number input element (f0076a6)
- added inner layout to input and textarea (3d825ca)
Bug Fixes
- improved accessibility on switch and datepicker (2113705)
- revised font-sizes and line-heights (2128a6e)
- small change for carousel, so that it only shows controls when there're more that 1 image (d26f36b)
1.12.2 (2026-02-06)
Bug Fixes
- Dynamic carousel sizing based on content inside (151a06f)
1.12.1 (2026-02-05)
Bug Fixes
- expose slot image from carousel, updated docs (006ecb0)
1.12.0 (2026-02-01)
Features
- Banner component (9eb9be1)
1.11.10 (2026-01-29)
Bug Fixes
- center the text inside the button (comes in handy for full-width buttons) (8a758f6)
- SSR friendly modal and updated exports (8f8f487)
1.11.9 (2026-01-28)
Bug Fixes
- added possibility to change validation rules (31435e5)
1.11.8 (2026-01-28)
Bug Fixes
- Improved modal (teleport to body + added header, footer and scrollable content) (c6bafdf)
1.11.7 (2026-01-28)
Bug Fixes
- better demonstration of component library and guide on overriding the themes (d75622c)
- blocking script in the nuxt module (e5419cf)
- deprecation warnings (967bfcb)
1.11.6 (2026-01-26)
Bug Fixes
- manifest change (b56e49f)
1.11.5 (2026-01-26)
Bug Fixes
- effort to fix npm publish (04dc290)
1.11.4 (2026-01-26)
Bug Fixes
- corrected docs and implemented interactive presentation for useTheme (2868a67)
1.11.3 (2026-01-26)
Bug Fixes
1.11.2 (2026-01-23)
Bug Fixes
1.11.1 (2026-01-22)
Bug Fixes
- override attrs on input field (2862d8a)
1.11.0 (2026-01-22)
Features
- added validator composable to validate non-form (and form) control elements (e43b5a6)
1.10.4 (2026-01-20)
Bug Fixes
- updated counts and link to a sound (1667151)
1.10.3 (2026-01-20)
Bug Fixes
- fixed docs for animated container, added fancy mechanical sound effect (used as composable) (14499ed)
1.10.2 (2026-01-20)
Bug Fixes
1.10.1 (2026-01-20)
Bug Fixes
- inherit correct line height, but remove it from number input controls (916b5d1)
1.10.0 (2026-01-19)
Features
- create badge component that can wrap any component and draw badge on top right of it (705e2af)
1.9.2 (2026-01-19)
Bug Fixes
- control element should take as much space in width as outer block allows (f177641)
1.9.1 (2026-01-19)
Bug Fixes
- hide standard controls (218c6fe)
1.9.0 (2026-01-19)
Features
- Implemented horizontal and vertical number inputs based on generic number input (5dbcb06)
1.8.0 (2026-01-17)
Features
- Implemented number input component (47da272)
1.7.5 (2026-01-16)
Bug Fixes
- inconsistencies between components and docs (83037e7)
- popover – removed default toggle in the popover itself (f01bea3)
1.7.4 (2026-01-16)
Bug Fixes
- Major fixes for Selector component (c6dfa91)
1.7.3 (2026-01-16)
Bug Fixes
- silly issue when you cancel the upload dialog - all files removed (49b0a43)
1.7.2 (2026-01-16)
Bug Fixes
- improved upload component, added maxFiles validation and disabled state (5082e97)
1.7.1 (2026-01-15)
Bug Fixes
- carousel margin (e1b27cd)
1.7.0 (2026-01-15)
Features
- implemented headless upload component (80cfdc6)
1.6.0 (2026-01-14)
Features
- implemented carousel for images (0934cb8)
Bug Fixes
1.5.0 (2026-01-10)
Features
- added inverse theme (black&white) (f74502a)
1.4.1 (2026-01-10)
Bug Fixes
1.4.0 (2026-01-09)
Features
- Created NavButton (ee45beb)
1.3.0 (2026-01-09)
Features
- added tooltip (f755617)
1.2.0 (2026-01-09)
Features
- Added normal theme and fixed some incostincest styles on multiple components (b4a8530)
1.1.0 (2026-01-08)
Features
- Added switch button (b0b0820)
1.0.6 (2026-01-08)
Bug Fixes
1.0.5 (2026-01-08)
Bug Fixes
- changed scss for gradient style to css (90e5297)
1.0.4 (2026-01-08)
Bug Fixes
- fixed css was not imported, global styling issues, able to switch themes natively now and small issues with components (433a796)
1.0.3 (2026-01-07)
Bug Fixes
- naturally prefix components (4c2c669)
1.0.2 (2026-01-07)
Bug Fixes
- fixed old layer syntax (extend) to modules (ac617f7)
1.0.1 (2026-01-07)
Bug Fixes
1.0.0 (2026-01-07)
Bug Fixes
0.1.0 - 2025-01-06
Added
Components (18 total)
- Button - Primary, secondary, subdued variants with loading states
- Input - Text input with label support
- Textarea - Multi-line text input
- CheckBox - Custom checkbox with icon states
- DatePicker - Date selection with month/year picker
- DateRangePicker - Start/end date selection with "Present" option
- Selector - Generic dropdown selector supporting single and multi-select
- Tag - Styled tag/badge component
- Icon - Custom SVG icon system with 12 bundled icons
- LoadingSpinner - Animated loading indicator
- Modal - Animated modal with origin morphing effect
- Popover - Smart-positioned popover with fallback placement
- EmptyState - Empty state placeholder with icon and description
- DashedContainer - Dashed border container with icon
- ControlElement - Form control wrapper for consistent styling
- Text (View) - Typography component with multiple variants
- Dates (View) - Date range display formatter
- Separator (View) - Visual divider component
Composables (4 total)
- useTheme - Theme and color mode management with localStorage persistence
- useModal - Modal state management with animation origin tracking
- useFuzzySearch - Fuzzy search powered by Fuse.js
- useApi - Type-safe API request wrapper using ofetch
Theming System
- 5 built-in accent themes: Navy, Ocean, Sunset, Forest, Purple
- Light and dark mode support
- 3-layer CSS variable system for easy customization
- Automatic theme persistence to localStorage
Icon System
- Custom icon registry with 12 bundled SVG icons
- Tree-shakeable icon loading
- Support for custom icon sizes and colors
- Icons included: loading-loop, chevron-down, chevron-up, edit, check, plus, calendar, close, search, upload, download, delete
Testing
- 71 unit tests with Vitest
- Component tests for all 18 components
- Composable tests for all 4 composables
- Full test coverage for core functionality
Documentation
- VitePress documentation site
- Getting Started guide
- Theming guide
- Component API documentation
- Composable usage examples
- Interactive playground app
Developer Experience
- Full TypeScript support with exported types
- Nuxt Layer architecture for seamless integration
- Auto-import for all components and composables
- ESLint + Prettier configuration
- Development playground for testing
Technical Details
- Built with Vue 3 Composition API
- Nuxt 3/4 compatible
- SSR-ready with proper client-side checks
- Tree-shakeable architecture
- Zero external icon dependencies
- Accessibility-focused components
Dependencies
- @vueuse/core ^11.0.0
- @vueuse/integrations ^11.0.0
- fuse.js ^7.0.0
- nanoid ^5.0.0
- ofetch ^1.5.1