{"total":54,"entries":[{"id":"changelog/changelog/entries/2026-07-13-ai-chat-components.json","title":"New AI Chat Components","body":"A set of AI chat building blocks, ported over from [shadcn-vue](https://www.shadcn-vue.com/):\n\n- [**Attachment**](/components/attachment): Displays a file or image attachment with media, metadata, upload state, and actions.\n- [**Bubble**](/components/bubble): Displays conversational content in a message bubble, with variants, alignment, grouping, and reactions.\n- [**Marker**](/components/marker): Displays an inline status, system note, bordered row, or labeled separator in a conversation.\n- [**Message**](/components/message): Lays out a single message in a conversation, handling the avatar, alignment, header, and footer around it.\n- [**Message Scroller**](/components/message-scroller): A headless scroll container for chat transcripts. Anchors turns, follows streamed replies, restores your place when older history loads, and exposes composables to jump to any message.\n","breaking":false,"category":"feature","date":"2026-07-13","extension":"json","links":[],"meta":{},"slug":"2026-07-13-ai-chat-components","stem":"changelog/entries/2026-07-13-ai-chat-components","summary":"Added a set of AI chat building blocks ported from shadcn-vue: Attachment, Bubble, Marker, Message, and Message Scroller.","tags":["attachment","bubble","marker","message","message-scroller"],"__hash__":"LKg_mOhXvaOGlwTZTCsY3qJHlPgqocHn_NhSmbhGRCU"},{"id":"changelog/changelog/entries/2026-05-03-docd-integration.json","title":"Docd Documentation Layer","body":"- Integrated with the [Docd](https://docd.uithing.com){target=\"_blank\"} documentation layer.\n","breaking":false,"category":"dx","date":"2026-05-03","extension":"json","links":[],"meta":{},"slug":"2026-05-03-docd-integration","stem":"changelog/entries/2026-05-03-docd-integration","summary":"Integrated with the Docd documentation layer.","tags":["docs","docd"],"__hash__":"umBZJjSARECJnik2qyc1hjpF7fYUE5_3muIDB2Spesw"},{"id":"changelog/changelog/entries/2026-03-20-component-updates.json","title":"Component Updates","body":"- [**Sidebar**](/components/sidebar): Fixed an issue where the `SidebarProvider` was not persisting the open or closed state correctly with cookies. The provider now restores the saved state properly and keeps the cookie in sync with controlled updates.\n- **Class Overrides**: Updated component and prose style builders to normalize Vue class bindings with `normalizeClass(...)` before passing them into `tv()`. This removes the TypeScript errors introduced by the recent Vue class type change without narrowing the public `class` prop API.\n- [**Scrollspy**](/components/scrollspy): Added a shared `mode=\"multiple\"` option so docs and app layouts can mark every visible heading as active at once. The docs TOC rail now follows those active headings with a segmented zigzag highlight instead of a single active branch.\n","breaking":false,"category":"update","date":"2026-03-20","extension":"json","links":[],"meta":{},"slug":"2026-03-20-component-updates","stem":"changelog/entries/2026-03-20-component-updates","summary":"Fixed Sidebar cookie persistence, normalized class overrides across style builders, and added a shared multiple mode to Scrollspy.","tags":["sidebar","scrollspy"],"__hash__":"xXNWMSr5gMtGLqHyLZ-d5_RVm8-YaFe7uJWBtwwM6Go"},{"id":"changelog/changelog/entries/2026-03-20-developer-experience.json","title":"Developer Experience","body":"- **Agent Skills**: Added a new local `uithing` Codex skill for UI Thing workflows. It covers real CLI usage, component/docs/generator/MCP authoring inside this repo, and React or shadcn-style snippet conversion into native Vue, Nuxt, and UI Thing composition.\n","breaking":false,"category":"dx","date":"2026-03-20","extension":"json","links":[],"meta":{},"slug":"2026-03-20-developer-experience","stem":"changelog/entries/2026-03-20-developer-experience","summary":"Added a local Codex skill covering UI Thing workflows for components, docs, generators, and MCP authoring.","tags":["agent-skills","codex"],"__hash__":"9TYJfAog23CWXN3zkrvF0z-9sfWbSKuU0UNg_htlbdI"},{"id":"changelog/changelog/entries/2026-03-20-form-updates.json","title":"Form Updates","body":"- [**VeeSwitch**](/forms/veeswitch): Added a dedicated Vee-Validate switch wrapper with docs and examples, including settings and preferences card patterns. The wrapper now also aligns with the current Reka Switch value model so initial values and custom true/false values display correctly in the UI.\n","breaking":false,"category":"feature","date":"2026-03-20","extension":"json","links":[],"meta":{},"slug":"2026-03-20-form-updates","stem":"changelog/entries/2026-03-20-form-updates","summary":"Added a VeeSwitch form wrapper with docs, examples, and an aligned value model.","tags":["forms","veeswitch"],"__hash__":"waDk2bFGMB1WndSRFdl99HdrG6FuhfGIbi948N3ErOY"},{"id":"changelog/changelog/entries/2026-01-24-color-picker.json","title":"Color Picker","body":"- **Color Picker**: A versatile color picker component that supports multiple color formats (HEX, RGB, HSL) and includes features like alpha transparency, preset swatches, and a user-friendly interface. Check out the documentation [here](/components/color-picker).\n","breaking":false,"category":"feature","date":"2026-01-24","extension":"json","links":[],"meta":{},"slug":"2026-01-24-color-picker","stem":"changelog/entries/2026-01-24-color-picker","summary":"Added a versatile Color Picker component supporting HEX/RGB/HSL, alpha transparency, and preset swatches.","tags":["color-picker"],"__hash__":"Q3n2ZZAdjKBKmLiEtn29B2Qe7-Zhep_Dc8dMkI9Q3Po"},{"id":"changelog/changelog/entries/2026-01-03-component-updates.json","title":"Component Updates","body":"- [**Alert**](/components/alert): The Alert component has been updated to adjust the icon alignment when there is no title provided. Check out the updated documentation [here](/components/alert).\n- [**Sheet**](/components/sheet): The Sheet component has been updated to include a new `variant` prop that allows for different visual styles. A `fullscreen` prop was also introduced that will determine if the sheet takes up the entire screen or not. The default variant has been preserved, and additional variants can be explored in the documentation [here](/components/sheet).\n","breaking":false,"category":"update","date":"2026-01-03","extension":"json","links":[],"meta":{},"slug":"2026-01-03-component-updates","stem":"changelog/entries/2026-01-03-component-updates","summary":"Alert icon alignment fixed when no title is provided; Sheet gained a new variant prop and a fullscreen option.","tags":["alert","sheet"],"__hash__":"ZKfjgf5WP_orAOTbm3dmq0cqQrG0f3LRiT60gOr2txo"},{"id":"changelog/changelog/entries/2026-01-02-tanstack-table-fix.json","title":"Tanstack Table Fix","body":"- [**Tanstack Table**](/components/tanstacktable): The Tanstack Table component has been updated to fix an issue with column pinning styles. Pinned columns now have the correct background color applied. Check out the updated documentation [here](/components/tanstacktable).\n","breaking":false,"category":"update","date":"2026-01-02","extension":"json","links":[],"meta":{},"slug":"2026-01-02-tanstack-table-fix","stem":"changelog/entries/2026-01-02-tanstack-table-fix","summary":"Fixed an issue with column pinning styles in the Tanstack Table component.","tags":["tanstacktable"],"__hash__":"XVJf_-7vua_fwKpyWeHLgvh3wQlEjTmhEz4MarBYG64"},{"id":"changelog/changelog/entries/2026-01-01-flip-clock.json","title":"Flip Clock","body":"- **Flip Clock**: An animated split-flap clock that supports live time and countdown modes. Check out the documentation [here](/components/flip-clock).\n","breaking":false,"category":"feature","date":"2026-01-01","extension":"json","links":[],"meta":{},"slug":"2026-01-01-flip-clock","stem":"changelog/entries/2026-01-01-flip-clock","summary":"Added an animated split-flap Flip Clock component supporting live time and countdown modes.","tags":["flip-clock"],"__hash__":"bZwfoSjx_1U9lZnTROFoliOMD8IBSb4DKTADXov9pDc"},{"id":"changelog/changelog/entries/2025-12-29-qrcode-avatar-label-group.json","title":"QR Code & Avatar Label Group","body":"- **QR Code**: A component for generating and displaying QR codes with customizable styling and frame handles. Check out the documentation [here](/components/qrcode).\n- **Avatar Label Group**: A component for displaying an Avatar with associated title and subtitle. Check out the documentation [here](/components/avatar).\n","breaking":false,"category":"feature","date":"2025-12-29","extension":"json","links":[],"meta":{},"slug":"2025-12-29-qrcode-avatar-label-group","stem":"changelog/entries/2025-12-29-qrcode-avatar-label-group","summary":"Added a QR Code generator component and an Avatar Label Group for pairing an avatar with a title/subtitle.","tags":["qrcode","avatar"],"__hash__":"K0kfrMZCq2hQIRtV5NrfEeZ5dRimcVsAHX2IiJRzeaU"},{"id":"changelog/changelog/entries/2025-12-25-block-paths.json","title":"Block Paths","body":"The URL for several block paths have been updated to be more consistent. Some dashes were added here and there. This is only breaking if you were hardcoding the paths somewhere or add them bookmarked 👀...\n","breaking":true,"category":"update","date":"2025-12-25","extension":"json","links":[],"meta":{},"slug":"2025-12-25-block-paths","stem":"changelog/entries/2025-12-25-block-paths","summary":"Updated several block URL paths for consistency — breaking if you hardcoded or bookmarked old paths.","tags":["blocks"],"__hash__":"oV9JKCXhPPHs2tALujl0NsHFFOob_W3P08zwvBL5Axw"},{"id":"changelog/changelog/entries/2025-12-25-blocks-api.json","title":"Blocks API","body":"A new API endpoint has been added to get all blocks.\n\n**Endpoints:**\n\n- Get all blocks: [`/api/blocks`](/api/blocks)\n  - You can also filter with a search query\n- Get a block by name: [`/api/blocks/{name}`](/api/blocks/{name})\n- Get all block categories: [`/api/blocks/categories`](/api/blocks/categories)\n- Get blocks by category: [`/api/blocks/categories/{name}`](/api/blocks/categories/{name})\n","breaking":false,"category":"feature","date":"2025-12-25","extension":"json","links":[],"meta":{},"slug":"2025-12-25-blocks-api","stem":"changelog/entries/2025-12-25-blocks-api","summary":"Added new endpoints to list all blocks, fetch a block by name, and browse block categories.","tags":["api","blocks"],"__hash__":"7EP-nVvqf0ip0t5aQ0Q-2JRBI8io_jwZ_mHYspHbzFE"},{"id":"changelog/changelog/entries/2025-12-25-component-api.json","title":"Component API","body":"The component API now includes an endpoint to get a component by name.\n\nThe response now includes a `docsPath` property that contains the path to the documentation page for that component.\n\n**Endpoints:**\n\n- Get all components: [`/api/components`](/api/components)\n  - You can also filter with a search query\n- Get a component by name: [`/api/components/{name}`](/api/components/{name})\n","breaking":false,"category":"feature","date":"2025-12-25","extension":"json","links":[],"meta":{},"slug":"2025-12-25-component-api","stem":"changelog/entries/2025-12-25-component-api","summary":"The component API now supports fetching a component by name and includes a docsPath property.","tags":["api","components"],"__hash__":"c6Jr37pecdav4bn-4rJTZGvLSi-qsemyQtgeRiFBQDg"},{"id":"changelog/changelog/entries/2025-12-25-component-updates.json","title":"Component Updates","body":"- [**Fancy Icon**](/components/fancyicon): The fancy icon component has been updated to closer resemble the one from Untitled UI. From the start, it should have looked like that but I was too lazy. This update comes with some breaking changes. Be sure to check the docs [here](/components/fancyicon) for usage examples.\n- [**Icon**](/components/icon): The icon component has always been in the repo but there was no documentation for it. This was built because of an issue Where the Datatable component could not render icons from the official Nuxt Icon module.\n- [**Iframe (Lazy)**](/components/iframelazy): The Iframe Lazy component is another one that has always been buried in the codebase with no documentation lol. This component allows you to lazy load iframes only when they come into view. Check out the docs [here](/components/iframelazy).\n- [**Tanstack Table**](/components/tanstacktable): The Tanstack Table component has been updated. No breaking changes but new examples were added to showcase the updates. I am lazy, so I wanted a table that would just take an array of objects and generate the table for me. I also asked Claude to implement the server side pagination part. I may update this later to include other stuff... who knows.\n","breaking":true,"category":"update","date":"2025-12-25","extension":"json","links":[],"meta":{},"slug":"2025-12-25-component-updates","stem":"changelog/entries/2025-12-25-component-updates","summary":"Fancy Icon revamped to match Untitled UI (breaking), plus new docs for Icon and Iframe Lazy and new Tanstack Table examples.","tags":["fancyicon","icon","iframelazy","tanstacktable"],"__hash__":"lUrjMWvdB4Jf-DIrNhy2-_5hhWDvITrPjQJJnmTAIZg"},{"id":"changelog/changelog/entries/2025-12-25-landing-page-example.json","title":"Landing Page Example","body":"A new landing page example has been added to the [Examples](/examples/landing) section.\n","breaking":false,"category":"feature","date":"2025-12-25","extension":"json","links":[],"meta":{},"slug":"2025-12-25-landing-page-example","stem":"changelog/entries/2025-12-25-landing-page-example","summary":"Added a new landing page example to the Examples section.","tags":["examples"],"__hash__":"fTmM7yWoZ55ivD6NoPdnW2ESfUI_xZi4gw1HYzoMPho"},{"id":"changelog/changelog/entries/2025-12-25-mcp-server.json","title":"MCP Server","body":"🎄 Happy Holidays 🎄\n\nUI Thing now has an MCP server that powers its AI capabilities. This allows AI assistants like Claude Desktop, Cursor, and VS Code to access component source code, documentation, installation instructions, and more.\n\nLearn more about it at [Getting Started - MCP Server](/getting-started/mcp).\n","breaking":false,"category":"announcement","date":"2025-12-25","extension":"json","links":[],"meta":{},"slug":"2025-12-25-mcp-server","stem":"changelog/entries/2025-12-25-mcp-server","summary":"Launched an MCP server powering AI capabilities, giving assistants like Claude Desktop, Cursor, and VS Code access to component source, docs, and installation instructions.","tags":["mcp"],"__hash__":"DeGnYNGLELslKCyuD5Adre7KcADKyVBxM5stB_xL8VM"},{"id":"changelog/changelog/entries/2025-12-25-prose-api.json","title":"Prose API","body":"A new API endpoint has been added to get all prose components.\n\n**Endpoints:**\n\n- Get all prose components: [`/api/prose`](/api/prose)\n  - You can also filter with a search query\n- Get a prose component by name: [`/api/prose/{name}`](/api/prose/{name})\n","breaking":false,"category":"feature","date":"2025-12-25","extension":"json","links":[],"meta":{},"slug":"2025-12-25-prose-api","stem":"changelog/entries/2025-12-25-prose-api","summary":"Added new endpoints to list all prose components and fetch one by name.","tags":["api","prose"],"__hash__":"rueqOaODleEb6HgXo1zAc7Kj7l9b0tB9d7h5jVuFf3M"},{"id":"changelog/changelog/entries/2025-10-31-home-page-refactor.json","title":"Home Page Refactor","body":"Refactored the home page layout and added new HomeCards components for improved visual presentation.\n","breaking":false,"category":"update","date":"2025-10-31","extension":"json","links":[],"meta":{},"slug":"2025-10-31-home-page-refactor","stem":"changelog/entries/2025-10-31-home-page-refactor","summary":"Refactored the home page layout and added new HomeCards components.","tags":["home"],"__hash__":"9YePWNaal8Mlvg3u5q6AAd3uqXUG75DZRN2ieR4pnrs"},{"id":"changelog/changelog/entries/2025-10-31-new-field-components.json","title":"New Field Components","body":"Added new interactive field components to enhance user input experiences:\n\n- **DocsFieldHear** - A hearing-style interactive field component\n- **DocsFieldNotionPrompt** - Notion-style prompt field with mentions and context\n","breaking":false,"category":"feature","date":"2025-10-31","extension":"json","links":[],"meta":{},"slug":"2025-10-31-new-field-components","stem":"changelog/entries/2025-10-31-new-field-components","summary":"Added new interactive field components: DocsFieldHear and DocsFieldNotionPrompt.","tags":["docsfield"],"__hash__":"qoo1xz1AKixPNGgg25Jf2KCgaMauhambHZO-tsHOMoY"},{"id":"changelog/changelog/entries/2025-10-31-utilities.json","title":"Utilities","body":"Added `no-scrollbar` utility class for improved user experience on scrollable elements.\n","breaking":false,"category":"dx","date":"2025-10-31","extension":"json","links":[],"meta":{},"slug":"2025-10-31-utilities","stem":"changelog/entries/2025-10-31-utilities","summary":"Added a no-scrollbar utility class for scrollable elements.","tags":["css"],"__hash__":"iMHWdMcw86a7FCQX52tN1_0A_2_Mzpv34voRv5h5DLc"},{"id":"changelog/changelog/entries/2025-10-30-component-updates.json","title":"Component Updates","body":"- **Tiptap Editor**: Added new Tiptap editor block with toolbar and formatting options\n- **Nav Component**: Removed client-only wrapper for better performance\n- **Animated Tooltip**: Added new component with mouse tracking and animations\n","breaking":false,"category":"update","date":"2025-10-30","extension":"json","links":[],"meta":{},"slug":"2025-10-30-component-updates","stem":"changelog/entries/2025-10-30-component-updates","summary":"Added a new Tiptap editor block, removed the Nav component's client-only wrapper, and added an Animated Tooltip component.","tags":["tiptap","nav","tooltip"],"__hash__":"lDD3ldq5eydHFmH1nyd3bHMXtg5LgVsN4URJ1jVoy3U"},{"id":"changelog/changelog/entries/2025-10-30-documentation-updates.json","title":"Documentation Updates","body":"Enhanced documentation across multiple sections:\n\n- Updated sidebar documentation with detailed descriptions\n- Improved navigation documentation\n- Enhanced header section documentation with style descriptions\n","breaking":false,"category":"docs","date":"2025-10-30","extension":"json","links":[],"meta":{},"slug":"2025-10-30-documentation-updates","stem":"changelog/entries/2025-10-30-documentation-updates","summary":"Enhanced sidebar, navigation, and header documentation with more detailed descriptions.","tags":["sidebar","navigation","header"],"__hash__":"nG0N1eQUIg2udgvu_f6ZiiIjpi7E4ZIvXKCuU5ptd2Y"},{"id":"changelog/changelog/entries/2025-10-30-new-block-components.json","title":"New Block Components","body":"Expanded the blocks section with multiple new component categories:\n\n#### Testimonial Blocks\n\nAdded 8 new testimonial block variations featuring:\n\n- Carousel sliders with auto-rotation\n- Grid layouts with customer avatars\n- Star ratings and company logos\n- Masonry/Pinterest-style layouts\n\n#### Sign Up Blocks\n\nAdded 4 new sign up page designs:\n\n- Two-column layouts with feature showcases\n- Password confirmation fields\n- Social authentication options\n- Compact and minimal card designs\n\n#### Pricing Blocks\n\nAdded 4 new pricing section layouts:\n\n- Interactive annual/monthly toggles\n- Feature comparison grids\n- Popular plan badges\n- Four-tier pricing with custom options\n\n#### Login Blocks\n\nAdded 4 new login page designs:\n\n- Two-column layouts with security messages\n- Minimal card designs with icon headers\n- Social-first authentication layouts\n- Compact designs with terms notices\n\n#### Metric Blocks\n\nAdded 6 new metric display styles:\n\n- Icon-based compact layouts\n- Card-based designs with badges\n- Two-column contextual sections\n- Business metrics with growth indicators\n\n#### Newsletter Blocks\n\nCreated 5 new newsletter signup blocks:\n\n- Centered layouts with badges\n- Card-based split designs\n- Multi-field forms with checkboxes\n- Feature showcase grids\n","breaking":false,"category":"feature","date":"2025-10-30","extension":"json","links":[],"meta":{},"slug":"2025-10-30-new-block-components","stem":"changelog/entries/2025-10-30-new-block-components","summary":"Expanded the blocks section with new testimonial, sign up, pricing, login, metric, and newsletter block variations.","tags":["blocks"],"__hash__":"PtVD6VOytcYfdMbKcY9a6tr7AEd83uT1_xsJNfCnCes"},{"id":"changelog/changelog/entries/2025-10-27-infrastructure.json","title":"Infrastructure","body":"- Added Dockerfile for building and running the application\n- Updated to Nuxt v4.2\n","breaking":false,"category":"dx","date":"2025-10-27","extension":"json","links":[],"meta":{},"slug":"2025-10-27-infrastructure","stem":"changelog/entries/2025-10-27-infrastructure","summary":"Added a Dockerfile for building and running the app, and updated to Nuxt v4.2.","tags":["docker","nuxt"],"__hash__":"sCRlQwAkSCiUe9MWvBaqsXc_BD5NfdEhXMWKOLNURx8"},{"id":"changelog/changelog/entries/2025-10-27-new-block-components.json","title":"New Block Components","body":"#### Password Recovery & Reset\n\nImplemented password recovery and reset components with enhanced layouts and validation.\n\n#### Footer Components\n\nEnhanced footer components with multiple layouts and styles.\n\n#### Feature Blocks\n\nAdded multiple feature blocks with animations and responsive design.\n\n#### FAQ Components\n\nEnhanced FAQ components with multiple layouts and animations.\n\n#### Error Pages\n\nAdded custom error pages (404, 500, etc.) with animations and helpful suggestions.\n\n#### CTA Components\n\nEnhanced call-to-action components with animations and new styles.\n","breaking":false,"category":"feature","date":"2025-10-27","extension":"json","links":[],"meta":{},"slug":"2025-10-27-new-block-components","stem":"changelog/entries/2025-10-27-new-block-components","summary":"Added password recovery/reset, footer, feature, FAQ, error page, and CTA block components.","tags":["blocks"],"__hash__":"ueqFUvccODKZNE7kb4h45h_gniDR4DfdnIk4Qzv0gAY"},{"id":"changelog/changelog/entries/2025-10-20-prose-components.json","title":"Prose Components","body":"Added a comprehensive collection of prose components for enhanced content rendering and documentation:\n\n#### Typography Components\n\n- **ProseH1-H6** - Heading components with anchor link support and customizable styles\n- **ProseP** - Paragraph component with customizable classes\n- **ProseLead** - Lead paragraph component for introductory text\n- **ProseStrong** - Strong text rendering component\n- **ProseEm** - Emphasized text component\n- **ProseBlockquote** - Styled blockquote component\n- **ProseA** - Customizable anchor links with styling\n- **ProseHr** - Horizontal rule component\n\n#### List Components\n\n- **ProseUl, ProseOl, ProseLi** - List components with customizable styles\n- **ProseIconList** - Lists with icons and multiple variants\n\n#### Table Components\n\n- Added complete table prose components for documentation tables\n\n#### Code Components\n\n- **ProseCodeGroup** - Tabbed interface for multiple code snippets\n- **ProseCodeSnippet** - Dynamic code imports with syntax highlighting\n- **ProsePre** - Enhanced code blocks with file name display and meta parsing\n- **ProseCodeTree** - Interactive file navigation component\n- Code collapse functionality\n- Copy button for code blocks\n\n#### Documentation Components\n\n- **ProseField & ProseFieldGroup** - Enhanced documentation for component props\n- **ProseCallout** - Callout component with various styles and variants\n- **ProseCard** - Card component with animated border effects\n- **ProseCollapsible** - Collapsible content with customizable icons\n- **ProseTabs** - Tabbed content for documentation\n- **ProseImage** - Custom image with zoom functionality\n- **ProseColorModeImage** - Adaptive images for light/dark modes\n- **ProseSmartIcon** - Smart icon component\n\n#### Package Manager Components\n\n- **ProsePmInstall** - Package installation commands\n- **ProsePmRun** - Package manager script execution\n- **ProsePmX** - Package manager command execution\n- Added `usePm` composable for package manager integration\n\n#### Typography Documentation\n\nAdded comprehensive typography documentation showcasing all prose components and their usage.\n","breaking":false,"category":"feature","date":"2025-10-20","extension":"json","links":[],"meta":{},"slug":"2025-10-20-prose-components","stem":"changelog/entries/2025-10-20-prose-components","summary":"Added a comprehensive collection of prose components for content rendering and documentation, covering typography, lists, tables, code blocks, callouts, tabs, and package manager snippets.","tags":["prose"],"__hash__":"6oaDcZZOb_q3AzT_w4CLDtThBY0QRvEjSj_BXUSsIn0"},{"id":"changelog/changelog/entries/2025-02-27-timeline.json","title":"Timeline","body":"In this update, the [`Timeline`](/components/timeline) component was added.\n\nYou can add it by running\n\n```bash\nnpx ui-thing@latest add timeline\n```\n","breaking":false,"category":"feature","date":"2025-02-27","extension":"json","links":[],"meta":{},"slug":"2025-02-27-timeline","stem":"changelog/entries/2025-02-27-timeline","summary":"Added the Timeline component.","tags":["timeline"],"__hash__":"tgTWeWHlA372gaU7cI0Asb-8PoDbx7pbjGN9xELRXbw"},{"id":"changelog/changelog/entries/2025-02-09-description-list.json","title":"Description List","body":"The [`Description List`](/components/description-list) component was added.\n\nYou can try it out by running\n\n```bash\nnpx ui-thing@latest add description-list\n```\n","breaking":false,"category":"feature","date":"2025-02-09","extension":"json","links":[],"meta":{},"slug":"2025-02-09-description-list","stem":"changelog/entries/2025-02-09-description-list","summary":"Added the Description List component.","tags":["description-list"],"__hash__":"VGlfExGqDg-2bDU0zUU5TI0anPscIBIix5iYK1g5jjg"},{"id":"changelog/changelog/entries/2025-02-09-native-checkbox.json","title":"Native Checkbox","body":"The [`Native Checkbox`](/forms/veecheckbox-native) component was added.\n\nIt was added because of some array issues I had with the Checkbox from Radix Vue.\n\nYou can try it out by running\n\n```bash\nnpx ui-thing@latest add vee-native-checkbox\n```\n","breaking":false,"category":"feature","date":"2025-02-09","extension":"json","links":[],"meta":{},"slug":"2025-02-09-native-checkbox","stem":"changelog/entries/2025-02-09-native-checkbox","summary":"Added the Native Checkbox form component to resolve array issues with the Radix Vue Checkbox.","tags":["forms","checkbox"],"__hash__":"-3gRPCTKhV6zRX2S7fZIYYnbxLhIee_5ObTuVx8Fwpg"},{"id":"changelog/changelog/entries/2025-02-09-progress.json","title":"Progress","body":"In this update, the [`Progress`](/components/progress) component was updated.\n\nThere was an issue with how the transform value was being calculated.\n\nYou can update it by running\n\n```bash\nnpx ui-thing@latest add progress\n```\n","breaking":false,"category":"update","date":"2025-02-09","extension":"json","links":[],"meta":{},"slug":"2025-02-09-progress","stem":"changelog/entries/2025-02-09-progress","summary":"Fixed an issue with how the Progress component calculated its transform value.","tags":["progress"],"__hash__":"p8s-6BI7zQio3LBvjVDw1KMvkhflYYInJeAGvFS7rY0"},{"id":"changelog/changelog/entries/2025-02-07-loader.json","title":"Loader","body":"In this update, I added the [`Loader`](/components/loader) component.\n\nIt was recommended in this [issue](https://github.com/BayBreezy/ui-thing/issues/77).\n\nYou can try it out by running\n\n```bash\nnpx ui-thing@latest add loader\n```\n","breaking":false,"category":"feature","date":"2025-02-07","extension":"json","links":[],"meta":{},"slug":"2025-02-07-loader","stem":"changelog/entries/2025-02-07-loader","summary":"Added the Loader component, requested in issue #77.","tags":["loader"],"__hash__":"slzyxsKs2rrjWT35I3i2t4kwBuKLiDomcjhpvWAhgdg"},{"id":"changelog/changelog/entries/2025-02-02-form-builder.json","title":"Form Builder","body":"In this update, I added the [`Form Builder`](/forms/form-builder) component.\n\nI stumbled across an example in the Vee Validate docs and thought it would be nice to have something like this at hand.\n\nYou can try it out by running\n\n```bash\nnpx ui-thing@latest add vee-form-builder\n```\n","breaking":false,"category":"feature","date":"2025-02-02","extension":"json","links":[],"meta":{},"slug":"2025-02-02-form-builder","stem":"changelog/entries/2025-02-02-form-builder","summary":"Added the Form Builder component, inspired by an example from the Vee Validate docs.","tags":["forms","form-builder"],"__hash__":"J_OuW_CHDRCu3hmmfa4MvI6zZX4edUxrbkdPWVmImsI"},{"id":"changelog/changelog/entries/2025-01-15-datatables.json","title":"Datatables","body":"Im this update, I added some examples for the [`Datatables`](/components/datatable) component.\n\nThe examples are taken from the [Origin UI](https://originui.com/) library.\n\nThanks to the team over there for all the great free examples ❤️.\n\nYou can run this command to add the updated table component to your project\n\n```bash\nnpx ui-thing@latest add datatable\n```\n","breaking":false,"category":"update","date":"2025-01-15","extension":"json","links":[],"meta":{},"slug":"2025-01-15-datatables","stem":"changelog/entries/2025-01-15-datatables","summary":"Added new Datatables examples, taken from the Origin UI library.","tags":["datatable"],"__hash__":"6pVnaa3GhhUG4R8Yb7ZgCzLN000YK0y2oRWgtIYI9Ww"},{"id":"changelog/changelog/entries/2025-01-15-tabs.json","title":"Tabs","body":"Im this update, I added some examples for the [`Tabs`](/components/tabs) component.\n\nThe examples are taken from the [Origin UI](https://originui.com/) library.\n\nThanks to the team over there for all the great free examples ❤️.\n\nYou can run this command to add the updated tabs component to your project\n\n```bash\nnpx ui-thing@latest add tabs\n```\n","breaking":false,"category":"update","date":"2025-01-15","extension":"json","links":[],"meta":{},"slug":"2025-01-15-tabs","stem":"changelog/entries/2025-01-15-tabs","summary":"Added new Tabs examples, taken from the Origin UI library.","tags":["tabs"],"__hash__":"_XBeLMK098iPrfEBTQCDvfPr2Z6fChBul5gPAYAqqXA"},{"id":"changelog/changelog/entries/2025-01-14-table.json","title":"Table","body":"Im this update, I added some examples for the [`Table`](/components/table) component.\n\nThe examples are taken from the [Origin UI](https://originui.com/) library.\n\nThanks to the team over there for all the great free examples ❤️.\n\nYou can run this command to add the updated table component to your project\n\n```bash\nnpx ui-thing@latest add table\n```\n","breaking":false,"category":"update","date":"2025-01-14","extension":"json","links":[],"meta":{},"slug":"2025-01-14-table","stem":"changelog/entries/2025-01-14-table","summary":"Added new Table examples, taken from the Origin UI library.","tags":["table"],"__hash__":"vh9HqRWCIfdIR4TzyywMBO0O8OHJQVX5hpIaT1dp11o"},{"id":"changelog/changelog/entries/2024-12-28-avatar.json","title":"Avatar","body":"Im this update, I added some examples for the [`Avatar`](/components/avatar) component.\n\nThe examples are taken from the [Origin UI](https://originui.com/) library.\n\nThanks to the team over there for all the great free examples ❤️.\n","breaking":false,"category":"update","date":"2024-12-28","extension":"json","links":[],"meta":{},"slug":"2024-12-28-avatar","stem":"changelog/entries/2024-12-28-avatar","summary":"Added new Avatar examples, taken from the Origin UI library.","tags":["avatar"],"__hash__":"KrzFB4FzczfHew8T9II60D6T9Iv3sum2yywd6eO_0KU"},{"id":"changelog/changelog/entries/2024-12-27-input-textarea.json","title":"Input & Textarea","body":"In this update, the [`Input`](/components/input) and [`Textarea`](/components/textarea) components were updated.\n\nA new `pattern` & `maxlength` props was added to them both. Thanks to [arshx86](https://github.com/arshx86).\n\nYou can try them out by running\n\n```bash\nnpx ui-thing@latest add input textarea\n```\n","breaking":false,"category":"update","date":"2024-12-27","extension":"json","links":[],"meta":{},"slug":"2024-12-27-input-textarea","stem":"changelog/entries/2024-12-27-input-textarea","summary":"Added pattern and maxlength props to the Input and Textarea components.","tags":["input","textarea"],"__hash__":"Q97lCulnp0onR41cEsrwLfIAcHHZ74qDaoOJp3FUl_A"},{"id":"changelog/changelog/entries/2024-12-23-breadcrumbs.json","title":"Breadcrumbs","body":"In this update the [`Breadcrumbs`](/components/breadcrumbs) component got a little update. You can now pass a `slot` in the array of items & customize what is displayed in that slot.\n\n```html\n<template>\n  <UiBreadcrumbs :items=\"items\" class=\"justify-center\">\n    <template #select>\n      <UiSelect default-value=\"s1\">\n        <UiSelectTrigger class=\"h-9 w-36\" />\n        <UiSelectContent>\n          <UiSelectItem value=\"s1\">Orion</UiSelectItem>\n          <UiSelectItem value=\"s2\">Sigma</UiSelectItem>\n          <UiSelectItem value=\"s3\">Dorado</UiSelectItem>\n        </UiSelectContent>\n      </UiSelect>\n    </template>\n  </UiBreadcrumbs>\n</template>\n\n<script lang=\"ts\" setup>\n  import type { BreadcrumbItem } from \"~/components/Ui/Breadcrumbs.vue\";\n\n  const items: BreadcrumbItem[] = [{ label: \"Databases\" }, { slot: \"select\" }];\n</script>\n```\n\nYou can try it out by running\n\n```bash\nnpx ui-thing@latest add breadcrumbs\n```\n","breaking":false,"category":"update","date":"2024-12-23","extension":"json","links":[],"meta":{},"slug":"2024-12-23-breadcrumbs","stem":"changelog/entries/2024-12-23-breadcrumbs","summary":"Breadcrumbs component now supports a custom slot in the items array.","tags":["breadcrumbs"],"__hash__":"oTjDYyAbkD7PDFehqHB8C7t_rjfkJbWzPcUNnDrvDzk"},{"id":"changelog/changelog/entries/2024-12-23-pagination.json","title":"Pagination","body":"The [`Pagination`](/components/pagination) component got a little update too. For the core components, only an additional import statement was added from the Vue Use library.\n\nSome nice examples were copied over from the [Origin UI](https://originui.com/) library.\n\nYou can try it out by running\n\n```bash\nnpx ui-thing@latest add pagination\n```\n","breaking":false,"category":"update","date":"2024-12-23","extension":"json","links":[],"meta":{},"slug":"2024-12-23-pagination","stem":"changelog/entries/2024-12-23-pagination","summary":"Pagination component updated with an additional import from VueUse, plus new examples from Origin UI.","tags":["pagination"],"__hash__":"LSSGJqx-dTwugajNfjVnhtQj5qPKgvbuXT1cbRb1mgc"},{"id":"changelog/changelog/entries/2024-12-21-carousel.json","title":"Carousel","body":"In this update, the `Carousel` component was added.\n\nThanks to the [Shadcn Vue](https://www.shadcn-vue.com/) team for doing the heavy lifting.\n\nYou can try it out by running\n\n```bash\nnpx ui-thing@latest add carousel\n```\n","breaking":false,"category":"feature","date":"2024-12-21","extension":"json","links":[],"meta":{},"slug":"2024-12-21-carousel","stem":"changelog/entries/2024-12-21-carousel","summary":"Added the Carousel component, based on the Shadcn Vue implementation.","tags":["carousel"],"__hash__":"VdQJXPjNtoRQRu4tfb-6xiIJCifFkZcq7pGRxpGxqvc"},{"id":"changelog/changelog/entries/2024-12-17-alert.json","title":"Alert","body":"In this update, the `Alert` component was updated.\n\nSome cool examples were added from the [Origin UI](https://originui.com/) library.\n\nTo update just run this command in your project\n\n```bash\nnpx ui-thing@latest add alert\n```\n","breaking":false,"category":"update","date":"2024-12-17","extension":"json","links":[],"meta":{},"slug":"2024-12-17-alert","stem":"changelog/entries/2024-12-17-alert","summary":"Updated the Alert component with new examples from Origin UI.","tags":["alert"],"__hash__":"4yfRmMS-c6OrrMWE1LkujmAVvtuTySToHSsLLwItteE"},{"id":"changelog/changelog/entries/2024-12-17-vue-tippy.json","title":"Vue Tippy","body":"The Goodies section was updated with the [Vue Tippy](/goodies/vue-tippy) package.\n\nYou can create cool tooltips with it. The `Tooltip` component still works so now you have two options to choose from 🎉.\n","breaking":false,"category":"feature","date":"2024-12-17","extension":"json","links":[],"meta":{},"slug":"2024-12-17-vue-tippy","stem":"changelog/entries/2024-12-17-vue-tippy","summary":"Added the Vue Tippy package to the Goodies section for creating tooltips.","tags":["goodies","tooltip"],"__hash__":"wI0f_9b5YgwwPuEs4h3tQh2NDlJAu1XJnvM7dDYUexE"},{"id":"changelog/changelog/entries/2024-12-15-checkboxes.json","title":"Checkboxes","body":"I also add some examples of checkboxes from the [Origin UI](https://originui.com/) library. You can check them out here: [Checkboxes](/forms/veecheckbox#origin-ui-examples).\n","breaking":false,"category":"docs","date":"2024-12-15","extension":"json","links":[],"meta":{},"slug":"2024-12-15-checkboxes","stem":"changelog/entries/2024-12-15-checkboxes","summary":"Added checkbox examples from Origin UI.","tags":["checkbox"],"__hash__":"FymdJNwpnBZPlg9efzPAmgE2tbzN4eZKsiZSfJfjRCY"},{"id":"changelog/changelog/entries/2024-12-15-sliders.json","title":"Sliders","body":"In this update, the `Slider` component was updated to accommodate `vertical` orientation.\n\nWhile adding some examples from the [Origin UI](https://originui.com/) library, I noticed that the `Slider` component was missing the necessary classes that would make it work in a vertical orientation.\n","breaking":false,"category":"update","date":"2024-12-15","extension":"json","links":[],"meta":{},"slug":"2024-12-15-sliders","stem":"changelog/entries/2024-12-15-sliders","summary":"Updated the Slider component to support vertical orientation, fixing missing classes.","tags":["slider"],"__hash__":"X_p3xPA1wlbPEpTvuTLHgYs7h_rGgta0UUNkt_iEW_g"},{"id":"changelog/changelog/entries/2024-12-15-vertical-slider.json","title":"Vertical Slider","body":"You can check out all the awesome examples here: [Sliders](/components/slider#origin-ui-examples).\n","breaking":false,"category":"docs","date":"2024-12-15","extension":"json","links":[],"meta":{},"slug":"2024-12-15-vertical-slider","stem":"changelog/entries/2024-12-15-vertical-slider","summary":"Added vertical slider examples from Origin UI.","tags":["slider"],"__hash__":"LxjnBk8cBOzNrHnSy8SY_h7oyrQudd2_c8oJk-QFoMI"},{"id":"changelog/changelog/entries/2024-12-11-button-examples.json","title":"Button Examples","body":"I added more button examples to the [Button](/components/button) page. Shoutout to the [Origin UI](https://originui.com/) team for providing these examples 🙏.\n","breaking":false,"category":"docs","date":"2024-12-11","extension":"json","links":[],"meta":{},"slug":"2024-12-11-button-examples","stem":"changelog/entries/2024-12-11-button-examples","summary":"Added more Button examples from Origin UI.","tags":["button"],"__hash__":"O8N4p-6K2tZrYiwiTJifpuIMCiLo3WlmjdRZaqY3XZc"},{"id":"changelog/changelog/entries/2024-12-11-dialogs.json","title":"Dialogs","body":"Some dialog examples were added to the [Dialog](/components/dialog) page. These examples are taken from the [Origin UI](https://originui.com/) library as well. I hope to add some more examples soon.\n","breaking":false,"category":"docs","date":"2024-12-11","extension":"json","links":[],"meta":{},"slug":"2024-12-11-dialogs","stem":"changelog/entries/2024-12-11-dialogs","summary":"Added Dialog examples from Origin UI.","tags":["dialog"],"__hash__":"KuSCJwmhH6cTude86XoUBdQZvLNXaNdgKfGrmf3dI2s"},{"id":"changelog/changelog/entries/2024-12-11-refactor.json","title":"Refactor","body":"In this update, I made some minor fixes to some components that were using `className` instead of `class`.\n\nSome of the code examples were also updated:\n\n- [Dropdown Menu](/components/dropdownmenu)\n- [Navigation Menu](/components/navigationmenu)\n- [Sidebar](/components/sidebar)\n- [Stepper](/components/stepper)\n","breaking":false,"category":"dx","date":"2024-12-11","extension":"json","links":[],"meta":{},"slug":"2024-12-11-refactor","stem":"changelog/entries/2024-12-11-refactor","summary":"Fixed components using className instead of class; refreshed several code examples.","tags":["refactor"],"__hash__":"ZeZyPKiL4cu4FEUz8tlJt-9Hb-tCmXCRMoEytl_mH2I"},{"id":"changelog/changelog/entries/2024-12-01-vueform-slider.json","title":"VueForm Slider","body":"Let me start by giving credit to the [VueForm Slider](https://github.com/vueform/slider) creators ❤️.\n\nIn this release, I added the [`VeeVueFormSlider`](/forms/vee-vueformslider) component to the forms section.\n\nYes, there is an existing `Slider` component provided [here](/components/slider). The problem with this component is that the `v-model` directive returns an array. ALWAYS! This is coming from the implementation provided by Reka UI.\n\nBased on the issue raised here [#38](https://github.com/BayBreezy/ui-thing/issues/38), I decided to create a new slider component that returns a single value. This is the [`VeeVueFormSlider`](/forms/vee-vueformslider) component.\n\nThe cool thing is that this one has built in support for `vee-validate` 🙂.\n\nYou can try it out by running\n\n```bash\nnpx ui-thing@latest add vee-vue-form-slider\n```\n","breaking":false,"category":"feature","date":"2024-12-01","extension":"json","links":[],"meta":{},"slug":"2024-12-01-vueform-slider","stem":"changelog/entries/2024-12-01-vueform-slider","summary":"Added the VeeVueFormSlider form component, a single-value alternative to the array-based Slider v-model.","tags":["forms","slider"],"__hash__":"FUMz3hSQ8huXvT6zCLykhTVk4G5mugeALxB3B-d-7jo"},{"id":"changelog/changelog/entries/2024-11-20-sidebar-blocks.json","title":"Sidebar Blocks","body":"If you want to copy and paste some Sidebar blocks, you can check out the [Sidebar Blocks](/blocks/sidebar) page.\n\nThe examples are taken from the shadcn-ui library 🙂.\n","breaking":false,"category":"feature","date":"2024-11-20","extension":"json","links":[],"meta":{},"slug":"2024-11-20-sidebar-blocks","stem":"changelog/entries/2024-11-20-sidebar-blocks","summary":"Added copy-paste Sidebar blocks, taken from the shadcn-ui library.","tags":["blocks","sidebar"],"__hash__":"XZY6IU1FNFf2wNbOkSlRejdl7HkcLKEnOMWPONGyITI"},{"id":"changelog/changelog/entries/2024-11-20-sidebar-placeholder.json","title":"Sidebar & Placeholder","body":"In this release, the [`Sidebar`](/components/sidebar) component was added to the components section.\n\nThanks to this issue here [#32](https://github.com/BayBreezy/ui-thing/issues/32), I saw that shadcn-ui added a [`Sidebar`](/components/sidebar) component to their library.\n\nThe guys at shadcn-vue had already created a port of this, so I used most of that code to create the [`Sidebar`](/components/sidebar) component.\n\nThanks to all the great devs that made this component possible ❤️.\n\nAs for the [`Placeholder`](/components/placeholder) component, this one was taken from the guys at [Nuxt UI](https://ui.nuxt.com/) 🙏.\n","breaking":false,"category":"feature","date":"2024-11-20","extension":"json","links":[],"meta":{},"slug":"2024-11-20-sidebar-placeholder","stem":"changelog/entries/2024-11-20-sidebar-placeholder","summary":"Added the Sidebar component (ported from shadcn-vue) and the Placeholder component (from Nuxt UI).","tags":["sidebar","placeholder"],"__hash__":"AOWFyaKcrVsosOlf2C73B7D4yZ3tmmeKLmxRzXc8chs"},{"id":"changelog/changelog/entries/2024-11-14-input-examples.json","title":"Input Examples","body":"In this update, a tonne of Input examples were added to the [Vee Input](/forms/veeinput) page.\n\nThanks to the maintainers of the [Origin UI](https://originui.com/) library for providing these examples 🙏.\n\nCheck them out & let me know what you think.\n\nThe [`Password Strength`](/forms/veeinput#input-with-password-strength-indicator) example is really cool 😎.\n","breaking":false,"category":"docs","date":"2024-11-14","extension":"json","links":[],"meta":{},"slug":"2024-11-14-input-examples","stem":"changelog/entries/2024-11-14-input-examples","summary":"Added a ton of Input examples, including a Password Strength indicator, from Origin UI.","tags":["input","forms"],"__hash__":"tbGmR9inVR2oZ2PjwKBPAAvTays5326iOyrO-V5sdDA"},{"id":"changelog/changelog/entries/2024-10-31-button-styles.json","title":"Button Styles","body":"In this release, I added a few button styles to the [Button](/components/button) page.\n\nThe examples are taken from [Enhanced Button](https://enhanced-button.vercel.app/) ❤️.\n\nCheck them out & let me know what you think.\n","breaking":false,"category":"docs","date":"2024-10-31","extension":"json","links":[],"meta":{},"slug":"2024-10-31-button-styles","stem":"changelog/entries/2024-10-31-button-styles","summary":"Added a few new Button styles from Enhanced Button.","tags":["button"],"__hash__":"odpFj7UTBwCWHtjOvKm9RVtd_uHRUf9kYHO5XshvIz0"},{"id":"changelog/changelog/entries/2023-09-04-v2-launch.json","title":"UI Thing V2 Launch 🚀","body":"Launched version 2 of UI Thing with a complete rebuild featuring:\n\n- Modern component architecture\n- Enhanced documentation\n- Improved developer experience\n- New component library built on Reka UI\n- Update to Tailwind CSS v4\n- Comprehensive examples and blocks\n","breaking":true,"category":"announcement","date":"2023-09-04","extension":"json","links":[],"meta":{},"slug":"2023-09-04-v2-launch","stem":"changelog/entries/2023-09-04-v2-launch","summary":"Launched UI Thing V2 — a complete rebuild with a new Reka UI-based component architecture, Tailwind CSS v4, and improved docs/examples.","tags":["v2","launch"],"__hash__":"c9aSlJiw59ynwTlrbWgUbpO3E10uxnfKJYDgpWliir0"}]}