mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-22 16:00:39 +01:00
docs(components): add page (#3365)
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: App
|
||||
description: Wraps your app to provide global configurations and more.
|
||||
category: layout
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A stacked set of collapsible panels.
|
||||
category: data
|
||||
links:
|
||||
- label: Accordion
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A callout to draw user's attention.
|
||||
category: element
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: AvatarGroup
|
||||
description: Stack multiple avatars in a group.
|
||||
category: element
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: An img element with fallback and Nuxt Image support.
|
||||
category: element
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A short text to represent a status or a category.
|
||||
category: element
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A hierarchy of links to navigate through a website.
|
||||
category: navigation
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: ButtonGroup
|
||||
description: Group multiple button-like elements together.
|
||||
category: element
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A button element that can act as a link or trigger an action.
|
||||
category: element
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: Calendar
|
||||
description: A calendar component for selecting single dates, multiple dates or date ranges.
|
||||
category: element
|
||||
links:
|
||||
- label: Calendar
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: Display content in a card with a header, body and footer.
|
||||
category: layout
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A carousel with motion and swipe built using Embla.
|
||||
category: data
|
||||
links:
|
||||
- label: Embla
|
||||
to: https://www.embla-carousel.com/api/
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: An input element to toggle between checked and unchecked states.
|
||||
category: form
|
||||
links:
|
||||
- label: Checkbox
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: An indicator of a numeric value or a state.
|
||||
category: element
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A collapsible element to toggle visibility of its content.
|
||||
category: element
|
||||
links:
|
||||
- label: Collapsible
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: ColorPicker
|
||||
description: A component to select a color.
|
||||
category: form
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: CommandPalette
|
||||
description: A command palette with full-text search powered by Fuse.js for efficient fuzzy matching.
|
||||
category: navigation
|
||||
links:
|
||||
- label: Fuse.js
|
||||
icon: i-custom-fuse-js
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A container lets you center and constrain the width of your content.
|
||||
category: layout
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: ContextMenu
|
||||
description: A menu to display actions when right-clicking on an element.
|
||||
category: overlay
|
||||
links:
|
||||
- label: ContextMenu
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A drawer that smoothly slides in & out of the screen.
|
||||
category: overlay
|
||||
links:
|
||||
- label: Drawer
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: DropdownMenu
|
||||
description: A menu to display actions when clicking on an element.
|
||||
category: overlay
|
||||
links:
|
||||
- label: DropdownMenu
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: FormField
|
||||
description: A wrapper for form elements that provides validation and error handling.
|
||||
category: form
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A form component with built-in validation and submission handling.
|
||||
category: form
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A component to display any icon from Iconify.
|
||||
category: element
|
||||
links:
|
||||
- label: Icônes
|
||||
to: https://icones.js.org/
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: InputMenu
|
||||
description: An autocomplete input with real-time suggestions.
|
||||
category: form
|
||||
links:
|
||||
- label: Combobox
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: InputNumber
|
||||
description: Input numerical values with a customizable range.
|
||||
category: form
|
||||
links:
|
||||
- label: Number Field
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: An input element to enter text.
|
||||
category: form
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: Keyboard Key
|
||||
description: A kbd element to display a keyboard key.
|
||||
category: element
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A wrapper around <NuxtLink> with extra props.
|
||||
category: navigation
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A dialog window that can be used to display a message or request user input.
|
||||
category: overlay
|
||||
links:
|
||||
- label: Dialog
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: NavigationMenu
|
||||
description: A list of links that can be displayed horizontally or vertically.
|
||||
category: navigation
|
||||
links:
|
||||
- label: NavigationMenu
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A list of buttons or links to navigate through pages.
|
||||
category: navigation
|
||||
links:
|
||||
- label: Pagination
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: PinInput
|
||||
description: An input element to enter a pin.
|
||||
category: form
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A non-modal dialog that floats around a trigger element.
|
||||
category: overlay
|
||||
links:
|
||||
- label: HoverCard
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: An indicator showing the progress of a task.
|
||||
category: element
|
||||
links:
|
||||
- label: Progress
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: RadioGroup
|
||||
description: A set of radio buttons to select a single option from a list.
|
||||
category: form
|
||||
links:
|
||||
- label: RadioGroup
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: SelectMenu
|
||||
description: An advanced searchable select element.
|
||||
category: form
|
||||
links:
|
||||
- label: Combobox
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A select element to choose from a list of options.
|
||||
category: form
|
||||
links:
|
||||
- label: Select
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: Separates content horizontally or vertically.
|
||||
category: layout
|
||||
links:
|
||||
- label: Separator
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A placeholder to show while content is loading.
|
||||
category: layout
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A dialog that slides in from any side of the screen.
|
||||
category: overlay
|
||||
links:
|
||||
- label: Dialog
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: An input to select a numeric value within a range.
|
||||
category: form
|
||||
links:
|
||||
- label: Slider
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A set of steps that are used to indicate progress through a multi-step process.
|
||||
category: navigation
|
||||
links:
|
||||
- label: Stepper
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A control that toggles between two states.
|
||||
category: form
|
||||
links:
|
||||
- label: Switch
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A responsive table element to display data in rows and columns.
|
||||
category: data
|
||||
links:
|
||||
- label: TanStack Table
|
||||
avatar:
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A set of tab panels that are displayed one at a time.
|
||||
category: navigation
|
||||
links:
|
||||
- label: Tabs
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A textarea element to input multi-line text.
|
||||
category: form
|
||||
links:
|
||||
- label: GitHub
|
||||
icon: i-simple-icons-github
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A succinct message to provide information or feedback to the user.
|
||||
category: overlay
|
||||
links:
|
||||
- label: Toast
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
description: A popup that reveals information when hovering over an element.
|
||||
category: overlay
|
||||
links:
|
||||
- label: Tooltip
|
||||
icon: i-custom-reka-ui
|
||||
|
||||
Reference in New Issue
Block a user