mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-17 13:38:07 +01:00
Compare commits
1 Commits
feat/form-
...
content-3.
| Author | SHA1 | Date | |
|---|---|---|---|
|
15982f97e3 |
@@ -83,7 +83,7 @@ const groups = [
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template #billing-label="{ item }">
|
<template #billing-label="{ item }">
|
||||||
<span class="font-medium text-primary">{{ item.label }}</span>
|
{{ item.label }}
|
||||||
|
|
||||||
<UBadge variant="subtle" size="sm">
|
<UBadge variant="subtle" size="sm">
|
||||||
50% off
|
50% off
|
||||||
|
|||||||
@@ -1,119 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
const toast = useToast()
|
|
||||||
|
|
||||||
const groups = [{
|
|
||||||
id: 'actions',
|
|
||||||
label: 'Actions',
|
|
||||||
items: [{
|
|
||||||
label: 'Create new',
|
|
||||||
icon: 'i-lucide-plus',
|
|
||||||
children: [{
|
|
||||||
label: 'New file',
|
|
||||||
icon: 'i-lucide-file-plus',
|
|
||||||
suffix: 'Create a new file in the current directory',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
toast.add({ title: 'New file created!' })
|
|
||||||
},
|
|
||||||
kbds: ['meta', 'N']
|
|
||||||
}, {
|
|
||||||
label: 'New folder',
|
|
||||||
icon: 'i-lucide-folder-plus',
|
|
||||||
suffix: 'Create a new folder in the current directory',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
toast.add({ title: 'New folder created!' })
|
|
||||||
},
|
|
||||||
kbds: ['meta', 'F']
|
|
||||||
}, {
|
|
||||||
label: 'New project',
|
|
||||||
icon: 'i-lucide-folder-git',
|
|
||||||
suffix: 'Create a new project from a template',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
toast.add({ title: 'New project created!' })
|
|
||||||
},
|
|
||||||
kbds: ['meta', 'P']
|
|
||||||
}]
|
|
||||||
}, {
|
|
||||||
label: 'Share',
|
|
||||||
icon: 'i-lucide-share',
|
|
||||||
children: [{
|
|
||||||
label: 'Copy link',
|
|
||||||
icon: 'i-lucide-link',
|
|
||||||
suffix: 'Copy a link to the current item',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
toast.add({ title: 'Link copied to clipboard!' })
|
|
||||||
},
|
|
||||||
kbds: ['meta', 'L']
|
|
||||||
}, {
|
|
||||||
label: 'Share via email',
|
|
||||||
icon: 'i-lucide-mail',
|
|
||||||
suffix: 'Share the current item via email',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
toast.add({ title: 'Share via email dialog opened!' })
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
label: 'Share on social',
|
|
||||||
icon: 'i-lucide-share-2',
|
|
||||||
suffix: 'Share the current item on social media',
|
|
||||||
children: [{
|
|
||||||
label: 'Twitter',
|
|
||||||
icon: 'i-simple-icons-twitter',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
toast.add({ title: 'Shared on Twitter!' })
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
label: 'LinkedIn',
|
|
||||||
icon: 'i-simple-icons-linkedin',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
toast.add({ title: 'Shared on LinkedIn!' })
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
label: 'Facebook',
|
|
||||||
icon: 'i-simple-icons-facebook',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
toast.add({ title: 'Shared on Facebook!' })
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
}]
|
|
||||||
}, {
|
|
||||||
label: 'Settings',
|
|
||||||
icon: 'i-lucide-settings',
|
|
||||||
children: [{
|
|
||||||
label: 'General',
|
|
||||||
icon: 'i-lucide-sliders',
|
|
||||||
suffix: 'Configure general settings',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
toast.add({ title: 'General settings opened!' })
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
label: 'Appearance',
|
|
||||||
icon: 'i-lucide-palette',
|
|
||||||
suffix: 'Customize the appearance',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
toast.add({ title: 'Appearance settings opened!' })
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
label: 'Security',
|
|
||||||
icon: 'i-lucide-shield',
|
|
||||||
suffix: 'Manage security settings',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
toast.add({ title: 'Security settings opened!' })
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
}]
|
|
||||||
}]
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<UCommandPalette :groups="groups" class="flex-1" />
|
|
||||||
</template>
|
|
||||||
@@ -52,11 +52,9 @@ Each group contains an `items` array of objects that define the commands. Each i
|
|||||||
- `loading?: boolean`{lang="ts-type"}
|
- `loading?: boolean`{lang="ts-type"}
|
||||||
- `disabled?: boolean`{lang="ts-type"}
|
- `disabled?: boolean`{lang="ts-type"}
|
||||||
- [`slot?: string`{lang="ts-type"}](#with-custom-slot)
|
- [`slot?: string`{lang="ts-type"}](#with-custom-slot)
|
||||||
- `placeholder?: string`{lang="ts-type"} :badge{label="Soon"}
|
|
||||||
- `children?: CommandPaletteItem[]`{lang="ts-type"} :badge{label="Soon"}
|
|
||||||
- `onSelect?(e?: Event): void`{lang="ts-type"}
|
- `onSelect?(e?: Event): void`{lang="ts-type"}
|
||||||
- `class?: any`{lang="ts-type"}
|
- `class?: any`{lang="ts-type"}
|
||||||
- `ui?: { item?: ClassNameValue, itemLeadingIcon?: ClassNameValue, itemLeadingAvatarSize?: ClassNameValue, itemLeadingAvatar?: ClassNameValue, itemLeadingChipSize?: ClassNameValue, itemLeadingChip?: ClassNameValue, itemLabel?: ClassNameValue, itemLabelPrefix?: ClassNameValue, itemLabelBase?: ClassNameValue, itemLabelSuffix?: ClassNameValue, itemTrailing?: ClassNameValue, itemTrailingKbds?: ClassNameValue, itemTrailingKbdsSize?: ClassNameValue, itemTrailingHighlightedIcon?: ClassNameValue, itemTrailingIcon?: ClassNameValue }`{lang="ts-type"}
|
- `ui?: { item?: ClassNameValue, itemLeadingIcon?: ClassNameValue, itemLeadingAvatarSize?: ClassNameValue, itemLeadingAvatar?: ClassNameValue, itemLeadingChipSize?: ClassNameValue, itemLeadingChip?: ClassNameValue, itemLabel?: ClassNameValue, itemLabelPrefix?: ClassNameValue, itemLabelBase?: ClassNameValue, itemLabelSuffix?: ClassNameValue, itemTrailing?: ClassNameValue, itemTrailingKbds?: ClassNameValue, itemTrailingKbdsSize?: ClassNameValue, itemTrailingHighlightedIcon?: ClassNameValue, itemTrailingIcon?: ClassNameValue,}`{lang="ts-type"}
|
||||||
|
|
||||||
You can pass any property from the [Link](/components/link#props) component such as `to`, `target`, etc.
|
You can pass any property from the [Link](/components/link#props) component such as `to`, `target`, etc.
|
||||||
|
|
||||||
@@ -112,10 +110,6 @@ props:
|
|||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
::tip{to="#with-children-in-items"}
|
|
||||||
Each item can take a `children` array of objects with the following properties to create submenus:
|
|
||||||
::
|
|
||||||
|
|
||||||
### Multiple
|
### Multiple
|
||||||
|
|
||||||
Use the `multiple` prop to allow multiple selections.
|
Use the `multiple` prop to allow multiple selections.
|
||||||
@@ -252,128 +246,6 @@ You can customize this icon globally in your `vite.config.ts` under `ui.icons.se
|
|||||||
:::
|
:::
|
||||||
::
|
::
|
||||||
|
|
||||||
### Selected Icon
|
|
||||||
|
|
||||||
Use the `selected-icon` prop to customize the selected item [Icon](/components/icon). Defaults to `i-lucide-check`.
|
|
||||||
|
|
||||||
::component-code
|
|
||||||
---
|
|
||||||
collapse: true
|
|
||||||
hide:
|
|
||||||
- autofocus
|
|
||||||
ignore:
|
|
||||||
- groups
|
|
||||||
- modelValue
|
|
||||||
- multiple
|
|
||||||
- class
|
|
||||||
external:
|
|
||||||
- groups
|
|
||||||
- modelValue
|
|
||||||
class: '!p-0'
|
|
||||||
props:
|
|
||||||
multiple: true
|
|
||||||
autofocus: false
|
|
||||||
modelValue:
|
|
||||||
- label: 'Benjamin Canac'
|
|
||||||
suffix: 'benjamincanac'
|
|
||||||
avatar:
|
|
||||||
src: 'https://github.com/benjamincanac.png'
|
|
||||||
selectedIcon: 'i-lucide-circle-check'
|
|
||||||
groups:
|
|
||||||
- id: 'users'
|
|
||||||
label: 'Users'
|
|
||||||
items:
|
|
||||||
- label: 'Benjamin Canac'
|
|
||||||
suffix: 'benjamincanac'
|
|
||||||
avatar:
|
|
||||||
src: 'https://github.com/benjamincanac.png'
|
|
||||||
- label: 'Sylvain Marroufin'
|
|
||||||
suffix: 'smarroufin'
|
|
||||||
avatar:
|
|
||||||
src: 'https://github.com/smarroufin.png'
|
|
||||||
- label: 'Sébastien Chopin'
|
|
||||||
suffix: 'atinux'
|
|
||||||
avatar:
|
|
||||||
src: 'https://github.com/atinux.png'
|
|
||||||
- label: 'Romain Hamel'
|
|
||||||
suffix: 'romhml'
|
|
||||||
avatar:
|
|
||||||
src: 'https://github.com/romhml.png'
|
|
||||||
- label: 'Haytham A. Salama'
|
|
||||||
suffix: 'Haythamasalama'
|
|
||||||
avatar:
|
|
||||||
src: 'https://github.com/Haythamasalama.png'
|
|
||||||
- label: 'Daniel Roe'
|
|
||||||
suffix: 'danielroe'
|
|
||||||
avatar:
|
|
||||||
src: 'https://github.com/danielroe.png'
|
|
||||||
- label: 'Neil Richter'
|
|
||||||
suffix: 'noook'
|
|
||||||
avatar:
|
|
||||||
src: 'https://github.com/noook.png'
|
|
||||||
class: 'flex-1'
|
|
||||||
---
|
|
||||||
::
|
|
||||||
|
|
||||||
::framework-only
|
|
||||||
#nuxt
|
|
||||||
:::tip{to="/getting-started/icons/nuxt#theme"}
|
|
||||||
You can customize this icon globally in your `app.config.ts` under `ui.icons.check` key.
|
|
||||||
:::
|
|
||||||
|
|
||||||
#vue
|
|
||||||
:::tip{to="/getting-started/icons/vue#theme"}
|
|
||||||
You can customize this icon globally in your `vite.config.ts` under `ui.icons.check` key.
|
|
||||||
:::
|
|
||||||
::
|
|
||||||
|
|
||||||
### Trailing Icon :badge{label="Soon" class="align-text-top"}
|
|
||||||
|
|
||||||
Use the `trailing-icon` prop to customize the trailing [Icon](/components/icon) when an item has children. Defaults to `i-lucide-chevron-right`.
|
|
||||||
|
|
||||||
::component-code
|
|
||||||
---
|
|
||||||
collapse: true
|
|
||||||
prettier: true
|
|
||||||
hide:
|
|
||||||
- autofocus
|
|
||||||
ignore:
|
|
||||||
- groups
|
|
||||||
- class
|
|
||||||
external:
|
|
||||||
- groups
|
|
||||||
class: '!p-0'
|
|
||||||
props:
|
|
||||||
autofocus: false
|
|
||||||
trailingIcon: 'i-lucide-arrow-right'
|
|
||||||
groups:
|
|
||||||
- id: 'actions'
|
|
||||||
items:
|
|
||||||
- label: 'Share'
|
|
||||||
icon: 'i-lucide-share'
|
|
||||||
children:
|
|
||||||
- label: 'Email'
|
|
||||||
icon: 'i-lucide-mail'
|
|
||||||
- label: 'Copy'
|
|
||||||
icon: 'i-lucide-copy'
|
|
||||||
- label: 'Link'
|
|
||||||
icon: 'i-lucide-link'
|
|
||||||
class: 'flex-1'
|
|
||||||
---
|
|
||||||
::
|
|
||||||
|
|
||||||
::framework-only
|
|
||||||
#nuxt
|
|
||||||
:::tip{to="/getting-started/icons/nuxt#theme"}
|
|
||||||
You can customize this icon globally in your `app.config.ts` under `ui.icons.chevronRight` key.
|
|
||||||
:::
|
|
||||||
|
|
||||||
#vue
|
|
||||||
:::tip{to="/getting-started/icons/vue#theme"}
|
|
||||||
You can customize this icon globally in your `vite.config.ts` under `ui.icons.chevronRight` key.
|
|
||||||
:::
|
|
||||||
::
|
|
||||||
|
|
||||||
### Loading
|
### Loading
|
||||||
|
|
||||||
Use the `loading` prop to show a loading icon on the CommandPalette.
|
Use the `loading` prop to show a loading icon on the CommandPalette.
|
||||||
@@ -449,6 +321,37 @@ You can customize this icon globally in your `vite.config.ts` under `ui.icons.lo
|
|||||||
:::
|
:::
|
||||||
::
|
::
|
||||||
|
|
||||||
|
### Disabled
|
||||||
|
|
||||||
|
Use the `disabled` prop to disable the CommandPalette.
|
||||||
|
|
||||||
|
::component-code
|
||||||
|
---
|
||||||
|
collapse: true
|
||||||
|
hide:
|
||||||
|
- autofocus
|
||||||
|
ignore:
|
||||||
|
- groups
|
||||||
|
- class
|
||||||
|
external:
|
||||||
|
- groups
|
||||||
|
class: '!p-0'
|
||||||
|
props:
|
||||||
|
autofocus: false
|
||||||
|
disabled: true
|
||||||
|
groups:
|
||||||
|
- id: 'apps'
|
||||||
|
items:
|
||||||
|
- label: 'Calendar'
|
||||||
|
icon: 'i-lucide-calendar'
|
||||||
|
- label: 'Music'
|
||||||
|
icon: 'i-lucide-music'
|
||||||
|
- label: 'Maps'
|
||||||
|
icon: 'i-lucide-map'
|
||||||
|
class: 'flex-1'
|
||||||
|
---
|
||||||
|
::
|
||||||
|
|
||||||
### Close
|
### Close
|
||||||
|
|
||||||
Use the `close` prop to display a [Button](/components/button) to dismiss the CommandPalette.
|
Use the `close` prop to display a [Button](/components/button) to dismiss the CommandPalette.
|
||||||
@@ -565,124 +468,6 @@ You can customize this icon globally in your `vite.config.ts` under `ui.icons.cl
|
|||||||
:::
|
:::
|
||||||
::
|
::
|
||||||
|
|
||||||
### Back :badge{label="Soon" class="align-text-top"}
|
|
||||||
|
|
||||||
Use the `back` prop to customize or hide the back button (with `false` value) displayed when navigating into a submenu.
|
|
||||||
|
|
||||||
You can pass any property from the [Button](/components/button) component to customize it.
|
|
||||||
|
|
||||||
::component-code
|
|
||||||
---
|
|
||||||
collapse: true
|
|
||||||
prettier: true
|
|
||||||
hide:
|
|
||||||
- autofocus
|
|
||||||
ignore:
|
|
||||||
- back.color
|
|
||||||
- groups
|
|
||||||
- class
|
|
||||||
external:
|
|
||||||
- groups
|
|
||||||
class: '!p-0'
|
|
||||||
props:
|
|
||||||
autofocus: false
|
|
||||||
back:
|
|
||||||
color: primary
|
|
||||||
groups:
|
|
||||||
- id: 'actions'
|
|
||||||
items:
|
|
||||||
- label: 'Share'
|
|
||||||
icon: 'i-lucide-share'
|
|
||||||
children:
|
|
||||||
- label: 'Email'
|
|
||||||
icon: 'i-lucide-mail'
|
|
||||||
- label: 'Copy'
|
|
||||||
icon: 'i-lucide-copy'
|
|
||||||
- label: 'Link'
|
|
||||||
icon: 'i-lucide-link'
|
|
||||||
class: 'flex-1'
|
|
||||||
---
|
|
||||||
::
|
|
||||||
|
|
||||||
### Back Icon :badge{label="Soon" class="align-text-top"}
|
|
||||||
|
|
||||||
Use the `back-icon` prop to customize the back button [Icon](/components/icon). Defaults to `i-lucide-arrow-left`.
|
|
||||||
|
|
||||||
::component-code
|
|
||||||
---
|
|
||||||
collapse: true
|
|
||||||
hide:
|
|
||||||
- autofocus
|
|
||||||
ignore:
|
|
||||||
- class
|
|
||||||
- groups
|
|
||||||
- back
|
|
||||||
external:
|
|
||||||
- groups
|
|
||||||
class: '!p-0'
|
|
||||||
props:
|
|
||||||
autofocus: false
|
|
||||||
back: true
|
|
||||||
backIcon: 'i-lucide-house'
|
|
||||||
groups:
|
|
||||||
- id: 'actions'
|
|
||||||
items:
|
|
||||||
- label: 'Share'
|
|
||||||
icon: 'i-lucide-share'
|
|
||||||
children:
|
|
||||||
- label: 'Email'
|
|
||||||
icon: 'i-lucide-mail'
|
|
||||||
- label: 'Copy'
|
|
||||||
icon: 'i-lucide-copy'
|
|
||||||
- label: 'Link'
|
|
||||||
icon: 'i-lucide-link'
|
|
||||||
class: 'flex-1'
|
|
||||||
---
|
|
||||||
::
|
|
||||||
|
|
||||||
::framework-only
|
|
||||||
#nuxt
|
|
||||||
:::tip{to="/getting-started/icons/nuxt#theme"}
|
|
||||||
You can customize this icon globally in your `app.config.ts` under `ui.icons.arrowLeft` key.
|
|
||||||
:::
|
|
||||||
|
|
||||||
#vue
|
|
||||||
:::tip{to="/getting-started/icons/vue#theme"}
|
|
||||||
You can customize this icon globally in your `vite.config.ts` under `ui.icons.arrowLeft` key.
|
|
||||||
:::
|
|
||||||
::
|
|
||||||
|
|
||||||
### Disabled
|
|
||||||
|
|
||||||
Use the `disabled` prop to disable the CommandPalette.
|
|
||||||
|
|
||||||
::component-code
|
|
||||||
---
|
|
||||||
collapse: true
|
|
||||||
hide:
|
|
||||||
- autofocus
|
|
||||||
ignore:
|
|
||||||
- groups
|
|
||||||
- class
|
|
||||||
external:
|
|
||||||
- groups
|
|
||||||
class: '!p-0'
|
|
||||||
props:
|
|
||||||
autofocus: false
|
|
||||||
disabled: true
|
|
||||||
groups:
|
|
||||||
- id: 'apps'
|
|
||||||
items:
|
|
||||||
- label: 'Calendar'
|
|
||||||
icon: 'i-lucide-calendar'
|
|
||||||
- label: 'Music'
|
|
||||||
icon: 'i-lucide-music'
|
|
||||||
- label: 'Maps'
|
|
||||||
icon: 'i-lucide-map'
|
|
||||||
class: 'flex-1'
|
|
||||||
---
|
|
||||||
::
|
|
||||||
|
|
||||||
## Examples
|
## Examples
|
||||||
|
|
||||||
### Control selected item(s)
|
### Control selected item(s)
|
||||||
@@ -717,28 +502,6 @@ props:
|
|||||||
This example uses the `@update:model-value` event to reset the search term when an item is selected.
|
This example uses the `@update:model-value` event to reset the search term when an item is selected.
|
||||||
::
|
::
|
||||||
|
|
||||||
### With children in items :badge{label="Soon" class="align-text-top"}
|
|
||||||
|
|
||||||
You can create hierarchical menus by using the `children` property in items. When an item has children, it will automatically display a chevron icon and enable navigation into a submenu.
|
|
||||||
|
|
||||||
::component-example
|
|
||||||
---
|
|
||||||
collapse: true
|
|
||||||
prettier: true
|
|
||||||
name: 'command-palette-items-children-example'
|
|
||||||
class: '!p-0'
|
|
||||||
props:
|
|
||||||
autofocus: false
|
|
||||||
---
|
|
||||||
::
|
|
||||||
|
|
||||||
::note
|
|
||||||
When navigating into a submenu:
|
|
||||||
- The search term is reset
|
|
||||||
- A back button appears in the input
|
|
||||||
- You can go back to the previous group by pressing the :kbd{value="backspace"} key
|
|
||||||
::
|
|
||||||
|
|
||||||
### With fetched items
|
### With fetched items
|
||||||
|
|
||||||
You can fetch items from an API and use them in the CommandPalette.
|
You can fetch items from an API and use them in the CommandPalette.
|
||||||
@@ -895,7 +658,6 @@ You will have access to the following slots:
|
|||||||
|
|
||||||
::component-example
|
::component-example
|
||||||
---
|
---
|
||||||
collapse: true
|
|
||||||
name: 'command-palette-custom-slot-example'
|
name: 'command-palette-custom-slot-example'
|
||||||
class: '!p-0'
|
class: '!p-0'
|
||||||
props:
|
props:
|
||||||
|
|||||||
@@ -782,14 +782,6 @@ name: 'input-menu-countries-example'
|
|||||||
|
|
||||||
:component-emits
|
:component-emits
|
||||||
|
|
||||||
### Expose
|
|
||||||
|
|
||||||
When accessing the component via a template ref, you can use the following:
|
|
||||||
|
|
||||||
| Name | Type |
|
|
||||||
| ---- | ---- |
|
|
||||||
| `inputRef`{lang="ts-type"} | `Ref<InstanceType<typeof ComboboxTrigger> \| null>`{lang="ts-type"} |
|
|
||||||
|
|
||||||
## Theme
|
## Theme
|
||||||
|
|
||||||
:component-theme
|
:component-theme
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
---
|
---
|
||||||
title: InputNumber
|
title: InputNumber
|
||||||
description: An input for numerical values with a customizable range.
|
description: Input numerical values with a customizable range.
|
||||||
category: form
|
category: form
|
||||||
links:
|
links:
|
||||||
- label: NumberField
|
- label: NumberField
|
||||||
@@ -287,8 +287,8 @@ name: 'input-number-slots-example'
|
|||||||
When accessing the component via a template ref, you can use the following:
|
When accessing the component via a template ref, you can use the following:
|
||||||
|
|
||||||
| Name | Type |
|
| Name | Type |
|
||||||
| -------------------------- | ----------------------------------------------- |
|
|----------------------------|-------------------------------------------------|
|
||||||
| `inputRef`{lang="ts-type"} | `Ref<InstanceType<typeof NumberFieldInput> \| null>`{lang="ts-type"} |
|
| `inputRef`{lang="ts-type"} | `Ref<HTMLInputElement \| null>`{lang="ts-type"} |
|
||||||
|
|
||||||
## Theme
|
## Theme
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
---
|
---
|
||||||
title: InputTags
|
title: InputTags
|
||||||
description: An input element that displays interactive tags.
|
description: An input element that displays interactive tags.
|
||||||
category: form
|
|
||||||
links:
|
links:
|
||||||
- label: InputTags
|
- label: InputTags
|
||||||
icon: i-custom-reka-ui
|
icon: i-custom-reka-ui
|
||||||
@@ -277,8 +276,8 @@ name: 'input-tags-form-field-example'
|
|||||||
When accessing the component via a template ref, you can use the following:
|
When accessing the component via a template ref, you can use the following:
|
||||||
|
|
||||||
| Name | Type |
|
| Name | Type |
|
||||||
| -------------------------- | ----------------------------------------------- |
|
|----------------------------|-------------------------------------------------|
|
||||||
| `inputRef`{lang="ts-type"} | `Ref<InstanceType<typeof TagsInputInput> \| null>`{lang="ts-type"} |
|
| `inputRef`{lang="ts-type"} | `Ref<HTMLInputElement \| null>`{lang="ts-type"} |
|
||||||
|
|
||||||
## Theme
|
## Theme
|
||||||
|
|
||||||
|
|||||||
@@ -280,7 +280,7 @@ This example uses the `defineShortcuts` composable to focus the Input when the :
|
|||||||
|
|
||||||
### With mask
|
### With mask
|
||||||
|
|
||||||
There's no built-in support for masks, but you can use libraries like [maska](https://github.com/beholdr/maska) to mask the Input.
|
There's no built-in support for masks, but you can use librairies like [maska](https://github.com/beholdr/maska) to mask the Input.
|
||||||
|
|
||||||
::component-example
|
::component-example
|
||||||
---
|
---
|
||||||
|
|||||||
@@ -180,8 +180,6 @@ props:
|
|||||||
|
|
||||||
:component-emits
|
:component-emits
|
||||||
|
|
||||||
### Expose
|
|
||||||
|
|
||||||
When accessing the component via a template ref, you can use the following:
|
When accessing the component via a template ref, you can use the following:
|
||||||
|
|
||||||
| Name | Type |
|
| Name | Type |
|
||||||
|
|||||||
@@ -815,14 +815,6 @@ name: 'select-menu-countries-example'
|
|||||||
|
|
||||||
:component-emits
|
:component-emits
|
||||||
|
|
||||||
### Expose
|
|
||||||
|
|
||||||
When accessing the component via a template ref, you can use the following:
|
|
||||||
|
|
||||||
| Name | Type |
|
|
||||||
| ---- | ---- |
|
|
||||||
| `triggerRef`{lang="ts-type"} | `Ref<InstanceType<typeof ComboboxTrigger> \| null>`{lang="ts-type"} |
|
|
||||||
|
|
||||||
## Theme
|
## Theme
|
||||||
|
|
||||||
:component-theme
|
:component-theme
|
||||||
|
|||||||
@@ -709,14 +709,6 @@ collapse: true
|
|||||||
|
|
||||||
:component-emits
|
:component-emits
|
||||||
|
|
||||||
### Expose
|
|
||||||
|
|
||||||
When accessing the component via a template ref, you can use the following:
|
|
||||||
|
|
||||||
| Name | Type |
|
|
||||||
| ---- | ---- |
|
|
||||||
| `triggerRef`{lang="ts-type"} | `Ref<InstanceType<typeof SelectTrigger> \| null>`{lang="ts-type"} |
|
|
||||||
|
|
||||||
## Theme
|
## Theme
|
||||||
|
|
||||||
:component-theme
|
:component-theme
|
||||||
|
|||||||
@@ -242,14 +242,6 @@ You will have access to the following slots:
|
|||||||
|
|
||||||
:component-emits
|
:component-emits
|
||||||
|
|
||||||
### Expose
|
|
||||||
|
|
||||||
When accessing the component via a template ref, you can use the following:
|
|
||||||
|
|
||||||
| Name | Type |
|
|
||||||
| ---- | ---- |
|
|
||||||
| `triggersRef`{lang="ts-type"} | `Ref<ComponentPublicInstance[]>`{lang="ts-type"} |
|
|
||||||
|
|
||||||
## Theme
|
## Theme
|
||||||
|
|
||||||
:component-theme
|
:component-theme
|
||||||
|
|||||||
@@ -173,46 +173,6 @@ class: 'overflow-x-auto'
|
|||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
### Reverse
|
|
||||||
|
|
||||||
Use the reverse prop to reverse the direction of the Timeline.
|
|
||||||
|
|
||||||
::component-code
|
|
||||||
---
|
|
||||||
ignore:
|
|
||||||
- items
|
|
||||||
- class
|
|
||||||
- defaultValue
|
|
||||||
external:
|
|
||||||
- items
|
|
||||||
externalTypes:
|
|
||||||
- TimelineItem[]
|
|
||||||
props:
|
|
||||||
reverse: true
|
|
||||||
modelValue: 2
|
|
||||||
orientation: 'vertical'
|
|
||||||
items:
|
|
||||||
- date: 'Mar 15, 2025'
|
|
||||||
title: 'Project Kickoff'
|
|
||||||
description: 'Kicked off the project with team alignment.'
|
|
||||||
icon: 'i-lucide-rocket'
|
|
||||||
- date: 'Mar 22 2025'
|
|
||||||
title: 'Design Phase'
|
|
||||||
description: 'User research and design workshops.'
|
|
||||||
icon: 'i-lucide-palette'
|
|
||||||
- date: 'Mar 29 2025'
|
|
||||||
title: 'Development Sprint'
|
|
||||||
description: 'Frontend and backend development.'
|
|
||||||
icon: 'i-lucide-code'
|
|
||||||
- date: 'Apr 5 2025'
|
|
||||||
title: 'Testing & Deployment'
|
|
||||||
description: 'QA testing and performance optimization.'
|
|
||||||
icon: 'i-lucide-check-circle'
|
|
||||||
class: 'w-full'
|
|
||||||
class: 'overflow-x-auto'
|
|
||||||
---
|
|
||||||
::
|
|
||||||
|
|
||||||
## Examples
|
## Examples
|
||||||
|
|
||||||
### Control active item
|
### Control active item
|
||||||
|
|||||||
@@ -14,7 +14,7 @@
|
|||||||
"@iconify-json/lucide": "^1.2.47",
|
"@iconify-json/lucide": "^1.2.47",
|
||||||
"@iconify-json/simple-icons": "^1.2.38",
|
"@iconify-json/simple-icons": "^1.2.38",
|
||||||
"@iconify-json/vscode-icons": "^1.2.22",
|
"@iconify-json/vscode-icons": "^1.2.22",
|
||||||
"@nuxt/content": "^3.5.1",
|
"@nuxt/content": "^3.6.0",
|
||||||
"@nuxt/image": "^1.10.0",
|
"@nuxt/image": "^1.10.0",
|
||||||
"@nuxt/ui": "workspace:*",
|
"@nuxt/ui": "workspace:*",
|
||||||
"@nuxt/ui-pro": "https://pkg.pr.new/@nuxt/ui-pro@beebbd4",
|
"@nuxt/ui-pro": "https://pkg.pr.new/@nuxt/ui-pro@beebbd4",
|
||||||
|
|||||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.4 KiB |
@@ -74,51 +74,6 @@ const groups = computed(() => [{
|
|||||||
toast.add({ title: 'Label added!' })
|
toast.add({ title: 'Label added!' })
|
||||||
},
|
},
|
||||||
kbds: ['meta', 'L']
|
kbds: ['meta', 'L']
|
||||||
}, {
|
|
||||||
label: 'More actions',
|
|
||||||
placeholder: 'Search actions...',
|
|
||||||
children: [{
|
|
||||||
label: 'Create new file',
|
|
||||||
suffix: 'Create a new file in the current directory or workspace.',
|
|
||||||
icon: 'i-lucide-file-plus',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
|
|
||||||
toast.add({ title: 'New file added!' })
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
label: 'Create new folder',
|
|
||||||
suffix: 'Create a new folder in the current directory or workspace.',
|
|
||||||
icon: 'i-lucide-folder-plus',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
|
|
||||||
toast.add({ title: 'New folder added!' })
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
label: 'Share',
|
|
||||||
placeholder: 'Search share options...',
|
|
||||||
icon: 'i-lucide-share',
|
|
||||||
children: [{
|
|
||||||
label: 'Share with everyone',
|
|
||||||
suffix: 'Share with everyone in the current directory or workspace.',
|
|
||||||
icon: 'i-lucide-share',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
|
|
||||||
toast.add({ title: 'Shared with everyone!' })
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
label: 'Share with team',
|
|
||||||
suffix: 'Share with the team in the current directory or workspace.',
|
|
||||||
icon: 'i-lucide-users',
|
|
||||||
onSelect(e: Event) {
|
|
||||||
e.preventDefault()
|
|
||||||
|
|
||||||
toast.add({ title: 'Shared with team!' })
|
|
||||||
}
|
|
||||||
}]
|
|
||||||
}]
|
|
||||||
}]
|
}]
|
||||||
}])
|
}])
|
||||||
|
|
||||||
|
|||||||
@@ -5,9 +5,7 @@ const sizes = Object.keys(theme.variants.size) as Array<keyof typeof theme.varia
|
|||||||
|
|
||||||
const feedbacks = [
|
const feedbacks = [
|
||||||
{ description: 'This is a description' },
|
{ description: 'This is a description' },
|
||||||
{ error: true },
|
|
||||||
{ error: 'This is an error' },
|
{ error: 'This is an error' },
|
||||||
{ errors: ['This is an error', 'This is another error', 'This one is not visible'], maxErrors: 2 },
|
|
||||||
{ hint: 'This is a hint' },
|
{ hint: 'This is a hint' },
|
||||||
{ help: 'Help! I need somebody!' },
|
{ help: 'Help! I need somebody!' },
|
||||||
{ required: true }
|
{ required: true }
|
||||||
@@ -16,7 +14,7 @@ const feedbacks = [
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="flex flex-col items-center gap-4">
|
<div class="flex flex-col items-center gap-4">
|
||||||
<div class="flex flex-col gap-4 ms-[-92px]">
|
<div class="flex flex-col gap-4 ms-[-38px]">
|
||||||
<div v-for="(feedback, count) in feedbacks" :key="count" class="flex items-center">
|
<div v-for="(feedback, count) in feedbacks" :key="count" class="flex items-center">
|
||||||
<UFormField v-bind="feedback" label="Email" name="email">
|
<UFormField v-bind="feedback" label="Email" name="email">
|
||||||
<UInput placeholder="john@lennon.com" />
|
<UInput placeholder="john@lennon.com" />
|
||||||
|
|||||||
@@ -9,7 +9,6 @@ const orientations = Object.keys(theme.variants.orientation)
|
|||||||
const orientation = ref('vertical' as const)
|
const orientation = ref('vertical' as const)
|
||||||
const color = ref('primary' as const)
|
const color = ref('primary' as const)
|
||||||
const size = ref('md' as const)
|
const size = ref('md' as const)
|
||||||
const reverse = ref(false)
|
|
||||||
|
|
||||||
const items = [{
|
const items = [{
|
||||||
date: 'Mar 15, 2025',
|
date: 'Mar 15, 2025',
|
||||||
@@ -47,7 +46,6 @@ const value = ref('kickoff')
|
|||||||
<USelect v-model="orientation" :items="orientations" placeholder="Orientation" />
|
<USelect v-model="orientation" :items="orientations" placeholder="Orientation" />
|
||||||
<USelect v-model="size" :items="sizes" placeholder="Size" />
|
<USelect v-model="size" :items="sizes" placeholder="Size" />
|
||||||
<USelect v-model="value" :items="items.map(item => item.value)" placeholder="Value" />
|
<USelect v-model="value" :items="items.map(item => item.value)" placeholder="Value" />
|
||||||
<USelect v-model="reverse" :items="[true, false]" placeholder="Reverse" />
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<UTimeline
|
<UTimeline
|
||||||
@@ -56,7 +54,6 @@ const value = ref('kickoff')
|
|||||||
:orientation="orientation"
|
:orientation="orientation"
|
||||||
:size="size"
|
:size="size"
|
||||||
:items="items"
|
:items="items"
|
||||||
:reverse="reverse"
|
|
||||||
class="data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-96"
|
class="data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-96"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
208
pnpm-lock.yaml
generated
208
pnpm-lock.yaml
generated
@@ -240,8 +240,8 @@ importers:
|
|||||||
specifier: ^1.2.22
|
specifier: ^1.2.22
|
||||||
version: 1.2.22
|
version: 1.2.22
|
||||||
'@nuxt/content':
|
'@nuxt/content':
|
||||||
specifier: ^3.5.1
|
specifier: ^3.6.0
|
||||||
version: 3.5.1(magicast@0.3.5)(typescript@5.8.3)
|
version: 3.6.0(better-sqlite3@11.10.0)(magicast@0.3.5)
|
||||||
'@nuxt/image':
|
'@nuxt/image':
|
||||||
specifier: ^1.10.0
|
specifier: ^1.10.0
|
||||||
version: 1.10.0(db0@0.3.2(better-sqlite3@11.10.0))(ioredis@5.6.1)(magicast@0.3.5)
|
version: 1.10.0(db0@0.3.2(better-sqlite3@11.10.0))(ioredis@5.6.1)(magicast@0.3.5)
|
||||||
@@ -438,6 +438,10 @@ packages:
|
|||||||
'@antfu/utils@8.1.1':
|
'@antfu/utils@8.1.1':
|
||||||
resolution: {integrity: sha512-Mex9nXf9vR6AhcXmMrlz/HVgYYZpVGJ6YlPgwl7UnaFpnshXs6EK/oa5Gpf3CzENMjkvEx2tQtntGnb7UtSTOQ==}
|
resolution: {integrity: sha512-Mex9nXf9vR6AhcXmMrlz/HVgYYZpVGJ6YlPgwl7UnaFpnshXs6EK/oa5Gpf3CzENMjkvEx2tQtntGnb7UtSTOQ==}
|
||||||
|
|
||||||
|
'@apidevtools/json-schema-ref-parser@11.9.3':
|
||||||
|
resolution: {integrity: sha512-60vepv88RwcJtSHrD6MjIL6Ta3SOYbgfnkHb+ppAVK+o9mXprRtulx7VlRl3lN3bbvysAfCS7WMVfhUYemB0IQ==}
|
||||||
|
engines: {node: '>= 16'}
|
||||||
|
|
||||||
'@babel/code-frame@7.27.1':
|
'@babel/code-frame@7.27.1':
|
||||||
resolution: {integrity: sha512-cjQ7ZlQ0Mv3b47hABuTevyTuYN4i+loJKGeV9flcCgIK37cCXRh+L1bd3iBHlynerhQ7BhCkn2BPbQUL+rGqFg==}
|
resolution: {integrity: sha512-cjQ7ZlQ0Mv3b47hABuTevyTuYN4i+loJKGeV9flcCgIK37cCXRh+L1bd3iBHlynerhQ7BhCkn2BPbQUL+rGqFg==}
|
||||||
engines: {node: '>=6.9.0'}
|
engines: {node: '>=6.9.0'}
|
||||||
@@ -1375,6 +1379,9 @@ packages:
|
|||||||
'@jridgewell/trace-mapping@0.3.9':
|
'@jridgewell/trace-mapping@0.3.9':
|
||||||
resolution: {integrity: sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==}
|
resolution: {integrity: sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==}
|
||||||
|
|
||||||
|
'@jsdevtools/ono@7.1.3':
|
||||||
|
resolution: {integrity: sha512-4JQNk+3mVzK3xh2rqd6RB4J46qUR19azEHBneZyTZM+c456qOrbbM/5xcR8huNCCcbVt7+UmizG6GuUvPvKUYg==}
|
||||||
|
|
||||||
'@kwsites/file-exists@1.1.1':
|
'@kwsites/file-exists@1.1.1':
|
||||||
resolution: {integrity: sha512-m9/5YGR18lIwxSFDwfE3oA7bWuq9kdau6ugN4H2rJeyhFQZcG9AgSHkQtSD15a8WvTgfz9aikZMrKPHvbpqFiw==}
|
resolution: {integrity: sha512-m9/5YGR18lIwxSFDwfE3oA7bWuq9kdau6ugN4H2rJeyhFQZcG9AgSHkQtSD15a8WvTgfz9aikZMrKPHvbpqFiw==}
|
||||||
|
|
||||||
@@ -1441,17 +1448,20 @@ packages:
|
|||||||
engines: {node: ^16.10.0 || >=18.0.0}
|
engines: {node: ^16.10.0 || >=18.0.0}
|
||||||
hasBin: true
|
hasBin: true
|
||||||
|
|
||||||
'@nuxt/content@3.5.1':
|
'@nuxt/content@3.6.0':
|
||||||
resolution: {integrity: sha512-WmWgxt5gWPSHBzLBSBZHiU9jaOmTWINMAppWxZ43ZHZCfa0GvdR5+0uTto2EGITPrPsf6iYhKKzSfmJa+Xmp2Q==}
|
resolution: {integrity: sha512-iqkcWf8M00fq7ZqF2qaHgcoKzRVOTMUp7dLkPCBrARmAKvV4kHdYyKjcf94kiNeKzIeqa73l3c1P8YMno/GgRQ==}
|
||||||
peerDependencies:
|
peerDependencies:
|
||||||
'@electric-sql/pglite': '*'
|
'@electric-sql/pglite': '*'
|
||||||
'@libsql/client': '*'
|
'@libsql/client': '*'
|
||||||
|
better-sqlite3: 11.10.0
|
||||||
sqlite3: '*'
|
sqlite3: '*'
|
||||||
peerDependenciesMeta:
|
peerDependenciesMeta:
|
||||||
'@electric-sql/pglite':
|
'@electric-sql/pglite':
|
||||||
optional: true
|
optional: true
|
||||||
'@libsql/client':
|
'@libsql/client':
|
||||||
optional: true
|
optional: true
|
||||||
|
better-sqlite3:
|
||||||
|
optional: true
|
||||||
sqlite3:
|
sqlite3:
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
@@ -2200,24 +2210,33 @@ packages:
|
|||||||
'@shikijs/core@3.4.2':
|
'@shikijs/core@3.4.2':
|
||||||
resolution: {integrity: sha512-AG8vnSi1W2pbgR2B911EfGqtLE9c4hQBYkv/x7Z+Kt0VxhgQKcW7UNDVYsu9YxwV6u+OJrvdJrMq6DNWoBjihQ==}
|
resolution: {integrity: sha512-AG8vnSi1W2pbgR2B911EfGqtLE9c4hQBYkv/x7Z+Kt0VxhgQKcW7UNDVYsu9YxwV6u+OJrvdJrMq6DNWoBjihQ==}
|
||||||
|
|
||||||
'@shikijs/engine-javascript@3.4.2':
|
'@shikijs/core@3.6.0':
|
||||||
resolution: {integrity: sha512-1/adJbSMBOkpScCE/SB6XkjJU17ANln3Wky7lOmrnpl+zBdQ1qXUJg2GXTYVHRq+2j3hd1DesmElTXYDgtfSOQ==}
|
resolution: {integrity: sha512-9By7Xb3olEX0o6UeJyPLI1PE1scC4d3wcVepvtv2xbuN9/IThYN4Wcwh24rcFeASzPam11MCq8yQpwwzCgSBRw==}
|
||||||
|
|
||||||
'@shikijs/engine-oniguruma@3.4.2':
|
'@shikijs/engine-javascript@3.6.0':
|
||||||
resolution: {integrity: sha512-zcZKMnNndgRa3ORja6Iemsr3DrLtkX3cAF7lTJkdMB6v9alhlBsX9uNiCpqofNrXOvpA3h6lHcLJxgCIhVOU5Q==}
|
resolution: {integrity: sha512-7YnLhZG/TU05IHMG14QaLvTW/9WiK8SEYafceccHUSXs2Qr5vJibUwsDfXDLmRi0zHdzsxrGKpSX6hnqe0k8nA==}
|
||||||
|
|
||||||
'@shikijs/langs@3.4.2':
|
'@shikijs/engine-oniguruma@3.6.0':
|
||||||
resolution: {integrity: sha512-H6azIAM+OXD98yztIfs/KH5H4PU39t+SREhmM8LaNXyUrqj2mx+zVkr8MWYqjceSjDw9I1jawm1WdFqU806rMA==}
|
resolution: {integrity: sha512-nmOhIZ9yT3Grd+2plmW/d8+vZ2pcQmo/UnVwXMUXAKTXdi+LK0S08Ancrz5tQQPkxvjBalpMW2aKvwXfelauvA==}
|
||||||
|
|
||||||
|
'@shikijs/langs@3.6.0':
|
||||||
|
resolution: {integrity: sha512-IdZkQJaLBu1LCYCwkr30hNuSDfllOT8RWYVZK1tD2J03DkiagYKRxj/pDSl8Didml3xxuyzUjgtioInwEQM/TA==}
|
||||||
|
|
||||||
'@shikijs/themes@3.4.2':
|
'@shikijs/themes@3.4.2':
|
||||||
resolution: {integrity: sha512-qAEuAQh+brd8Jyej2UDDf+b4V2g1Rm8aBIdvt32XhDPrHvDkEnpb7Kzc9hSuHUxz0Iuflmq7elaDuQAP9bHIhg==}
|
resolution: {integrity: sha512-qAEuAQh+brd8Jyej2UDDf+b4V2g1Rm8aBIdvt32XhDPrHvDkEnpb7Kzc9hSuHUxz0Iuflmq7elaDuQAP9bHIhg==}
|
||||||
|
|
||||||
|
'@shikijs/themes@3.6.0':
|
||||||
|
resolution: {integrity: sha512-Fq2j4nWr1DF4drvmhqKq8x5vVQ27VncF8XZMBuHuQMZvUSS3NBgpqfwz/FoGe36+W6PvniZ1yDlg2d4kmYDU6w==}
|
||||||
|
|
||||||
'@shikijs/transformers@3.4.2':
|
'@shikijs/transformers@3.4.2':
|
||||||
resolution: {integrity: sha512-I5baLVi/ynLEOZoWSAMlACHNnG+yw5HDmse0oe+GW6U1u+ULdEB3UHiVWaHoJSSONV7tlcVxuaMy74sREDkSvg==}
|
resolution: {integrity: sha512-I5baLVi/ynLEOZoWSAMlACHNnG+yw5HDmse0oe+GW6U1u+ULdEB3UHiVWaHoJSSONV7tlcVxuaMy74sREDkSvg==}
|
||||||
|
|
||||||
'@shikijs/types@3.4.2':
|
'@shikijs/types@3.4.2':
|
||||||
resolution: {integrity: sha512-zHC1l7L+eQlDXLnxvM9R91Efh2V4+rN3oMVS2swCBssbj2U/FBwybD1eeLaq8yl/iwT+zih8iUbTBCgGZOYlVg==}
|
resolution: {integrity: sha512-zHC1l7L+eQlDXLnxvM9R91Efh2V4+rN3oMVS2swCBssbj2U/FBwybD1eeLaq8yl/iwT+zih8iUbTBCgGZOYlVg==}
|
||||||
|
|
||||||
|
'@shikijs/types@3.6.0':
|
||||||
|
resolution: {integrity: sha512-cLWFiToxYu0aAzJqhXTQsFiJRTFDAGl93IrMSBNaGSzs7ixkLfdG6pH11HipuWFGW5vyx4X47W8HDQ7eSrmBUg==}
|
||||||
|
|
||||||
'@shikijs/vscode-textmate@10.0.2':
|
'@shikijs/vscode-textmate@10.0.2':
|
||||||
resolution: {integrity: sha512-83yeghZ2xxin3Nj8z1NMd/NCuca+gsYXswywDy5bHvwlWL8tpTQmzGeUuHd9FC3E/SBEMvzJRwWEOz5gGes9Qg==}
|
resolution: {integrity: sha512-83yeghZ2xxin3Nj8z1NMd/NCuca+gsYXswywDy5bHvwlWL8tpTQmzGeUuHd9FC3E/SBEMvzJRwWEOz5gGes9Qg==}
|
||||||
|
|
||||||
@@ -2257,8 +2276,8 @@ packages:
|
|||||||
'@speed-highlight/core@1.2.7':
|
'@speed-highlight/core@1.2.7':
|
||||||
resolution: {integrity: sha512-0dxmVj4gxg3Jg879kvFS/msl4s9F3T9UXC1InxgOf7t5NvcPD97u/WTA5vL/IxWHMn7qSxBozqrnnE2wvl1m8g==}
|
resolution: {integrity: sha512-0dxmVj4gxg3Jg879kvFS/msl4s9F3T9UXC1InxgOf7t5NvcPD97u/WTA5vL/IxWHMn7qSxBozqrnnE2wvl1m8g==}
|
||||||
|
|
||||||
'@sqlite.org/sqlite-wasm@3.49.1-build4':
|
'@sqlite.org/sqlite-wasm@3.50.1-build1':
|
||||||
resolution: {integrity: sha512-TBbTTWhiI6v2CT7J1hij5shx+RGL4iICprVGYhO+LKv5Nbn3NeJPWCY8kMKL5vA6b33NeWkBk4dy6RFbNh3jBw==}
|
resolution: {integrity: sha512-yH4M/SHN98NibniIwTVk6rwTJjy7n39l7zwWY3u+qsfZBGTi4lC1uEl2NDvIlkzsFtfCBvHBJJFJ1iuU3UzzEQ==}
|
||||||
hasBin: true
|
hasBin: true
|
||||||
|
|
||||||
'@standard-schema/spec@1.0.0':
|
'@standard-schema/spec@1.0.0':
|
||||||
@@ -2418,6 +2437,9 @@ packages:
|
|||||||
'@types/json-schema@7.0.15':
|
'@types/json-schema@7.0.15':
|
||||||
resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
|
resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
|
||||||
|
|
||||||
|
'@types/lodash@4.17.17':
|
||||||
|
resolution: {integrity: sha512-RRVJ+J3J+WmyOTqnz3PiBLA501eKwXl2noseKOrNo/6+XEHjTAxO4xHvxQB6QuNm+s4WRbn6rSiap8+EA+ykFQ==}
|
||||||
|
|
||||||
'@types/mdast@4.0.4':
|
'@types/mdast@4.0.4':
|
||||||
resolution: {integrity: sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==}
|
resolution: {integrity: sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==}
|
||||||
|
|
||||||
@@ -4888,6 +4910,11 @@ packages:
|
|||||||
json-parse-even-better-errors@2.3.1:
|
json-parse-even-better-errors@2.3.1:
|
||||||
resolution: {integrity: sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==}
|
resolution: {integrity: sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==}
|
||||||
|
|
||||||
|
json-schema-to-typescript@15.0.4:
|
||||||
|
resolution: {integrity: sha512-Su9oK8DR4xCmDsLlyvadkXzX6+GGXJpbhwoLtOGArAG61dvbW4YQmSEno2y66ahpIdmLMg6YUf/QHLgiwvkrHQ==}
|
||||||
|
engines: {node: '>=16.0.0'}
|
||||||
|
hasBin: true
|
||||||
|
|
||||||
json-schema-traverse@0.4.1:
|
json-schema-traverse@0.4.1:
|
||||||
resolution: {integrity: sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==}
|
resolution: {integrity: sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==}
|
||||||
|
|
||||||
@@ -5350,6 +5377,9 @@ packages:
|
|||||||
engines: {node: '>=18.0.0'}
|
engines: {node: '>=18.0.0'}
|
||||||
hasBin: true
|
hasBin: true
|
||||||
|
|
||||||
|
minimark@0.2.0:
|
||||||
|
resolution: {integrity: sha512-AmtWU9pO0C2/3AM2pikaVhJ//8E5rOpJ7+ioFQfjIq+wCsBeuZoxPd97hBFZ9qrI7DMHZudwGH3r8A7BMnsIew==}
|
||||||
|
|
||||||
minimatch@10.0.1:
|
minimatch@10.0.1:
|
||||||
resolution: {integrity: sha512-ethXTt3SGGR+95gudmqJ1eNhRO7eGEGIgYA9vnPatK4/etz2MEVDno5GMCibdMTuBMyElzIlgxMna3K94XDIDQ==}
|
resolution: {integrity: sha512-ethXTt3SGGR+95gudmqJ1eNhRO7eGEGIgYA9vnPatK4/etz2MEVDno5GMCibdMTuBMyElzIlgxMna3K94XDIDQ==}
|
||||||
engines: {node: 20 || >=22}
|
engines: {node: 20 || >=22}
|
||||||
@@ -6462,8 +6492,8 @@ packages:
|
|||||||
shiki-transformer-color-highlight@1.0.0:
|
shiki-transformer-color-highlight@1.0.0:
|
||||||
resolution: {integrity: sha512-WwoXcbSQF4Hcfu/F4V7jvZxqmix4f8KNYNlYiNwz0w9RcABqhdNQOLeRRw3VNV2LBYdNcNR0qd9HVnlV+D+uzg==}
|
resolution: {integrity: sha512-WwoXcbSQF4Hcfu/F4V7jvZxqmix4f8KNYNlYiNwz0w9RcABqhdNQOLeRRw3VNV2LBYdNcNR0qd9HVnlV+D+uzg==}
|
||||||
|
|
||||||
shiki@3.4.2:
|
shiki@3.6.0:
|
||||||
resolution: {integrity: sha512-wuxzZzQG8kvZndD7nustrNFIKYJ1jJoWIPaBpVe2+KHSvtzMi4SBjOxrigs8qeqce/l3U0cwiC+VAkLKSunHQQ==}
|
resolution: {integrity: sha512-tKn/Y0MGBTffQoklaATXmTqDU02zx8NYBGQ+F6gy87/YjKbizcLd+Cybh/0ZtOBX9r1NEnAy/GTRDKtOsc1L9w==}
|
||||||
|
|
||||||
side-channel-list@1.0.0:
|
side-channel-list@1.0.0:
|
||||||
resolution: {integrity: sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==}
|
resolution: {integrity: sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==}
|
||||||
@@ -7625,12 +7655,6 @@ packages:
|
|||||||
peerDependencies:
|
peerDependencies:
|
||||||
zod: ^3.24.1
|
zod: ^3.24.1
|
||||||
|
|
||||||
zod-to-ts@1.2.0:
|
|
||||||
resolution: {integrity: sha512-x30XE43V+InwGpvTySRNz9kB7qFU8DlyEy7BsSTCHPH1R0QasMmHWZDCzYm6bVXtj/9NNJAZF3jW8rzFvH5OFA==}
|
|
||||||
peerDependencies:
|
|
||||||
typescript: ^4.9.4 || ^5.0.2
|
|
||||||
zod: ^3
|
|
||||||
|
|
||||||
zod@3.22.3:
|
zod@3.22.3:
|
||||||
resolution: {integrity: sha512-EjIevzuJRiRPbVH4mGc8nApb/lVLKVpmUhAaR5R5doKGfAnGJ6Gr3CViAVjP+4FWSxCsybeWQdcgCtbX+7oZug==}
|
resolution: {integrity: sha512-EjIevzuJRiRPbVH4mGc8nApb/lVLKVpmUhAaR5R5doKGfAnGJ6Gr3CViAVjP+4FWSxCsybeWQdcgCtbX+7oZug==}
|
||||||
|
|
||||||
@@ -7640,6 +7664,9 @@ packages:
|
|||||||
zod@3.25.57:
|
zod@3.25.57:
|
||||||
resolution: {integrity: sha512-6tgzLuwVST5oLUxXTmBqoinKMd3JeesgbgseXeFasKKj8Q1FCZrHnbqJOyiEvr4cVAlbug+CgIsmJ8cl/pU5FA==}
|
resolution: {integrity: sha512-6tgzLuwVST5oLUxXTmBqoinKMd3JeesgbgseXeFasKKj8Q1FCZrHnbqJOyiEvr4cVAlbug+CgIsmJ8cl/pU5FA==}
|
||||||
|
|
||||||
|
zod@3.25.63:
|
||||||
|
resolution: {integrity: sha512-3ttCkqhtpncYXfP0f6dsyabbYV/nEUW+Xlu89jiXbTBifUfjaSqXOG6JnQPLtqt87n7KAmnMqcjay6c0Wq0Vbw==}
|
||||||
|
|
||||||
zwitch@2.0.4:
|
zwitch@2.0.4:
|
||||||
resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
|
resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
|
||||||
|
|
||||||
@@ -7697,6 +7724,12 @@ snapshots:
|
|||||||
|
|
||||||
'@antfu/utils@8.1.1': {}
|
'@antfu/utils@8.1.1': {}
|
||||||
|
|
||||||
|
'@apidevtools/json-schema-ref-parser@11.9.3':
|
||||||
|
dependencies:
|
||||||
|
'@jsdevtools/ono': 7.1.3
|
||||||
|
'@types/json-schema': 7.0.15
|
||||||
|
js-yaml: 4.1.0
|
||||||
|
|
||||||
'@babel/code-frame@7.27.1':
|
'@babel/code-frame@7.27.1':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@babel/helper-validator-identifier': 7.27.1
|
'@babel/helper-validator-identifier': 7.27.1
|
||||||
@@ -8535,6 +8568,8 @@ snapshots:
|
|||||||
'@jridgewell/resolve-uri': 3.1.2
|
'@jridgewell/resolve-uri': 3.1.2
|
||||||
'@jridgewell/sourcemap-codec': 1.5.0
|
'@jridgewell/sourcemap-codec': 1.5.0
|
||||||
|
|
||||||
|
'@jsdevtools/ono@7.1.3': {}
|
||||||
|
|
||||||
'@kwsites/file-exists@1.1.1':
|
'@kwsites/file-exists@1.1.1':
|
||||||
dependencies:
|
dependencies:
|
||||||
debug: 4.3.7
|
debug: 4.3.7
|
||||||
@@ -8695,23 +8730,22 @@ snapshots:
|
|||||||
transitivePeerDependencies:
|
transitivePeerDependencies:
|
||||||
- magicast
|
- magicast
|
||||||
|
|
||||||
'@nuxt/content@3.5.1(magicast@0.3.5)(typescript@5.8.3)':
|
'@nuxt/content@3.6.0(better-sqlite3@11.10.0)(magicast@0.3.5)':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@nuxt/kit': 3.17.5(magicast@0.3.5)
|
'@nuxt/kit': 3.17.5(magicast@0.3.5)
|
||||||
'@nuxtjs/mdc': 0.17.0(magicast@0.3.5)
|
'@nuxtjs/mdc': 0.17.0(magicast@0.3.5)
|
||||||
'@shikijs/langs': 3.4.2
|
'@shikijs/langs': 3.6.0
|
||||||
'@sqlite.org/sqlite-wasm': 3.49.1-build4
|
'@sqlite.org/sqlite-wasm': 3.50.1-build1
|
||||||
'@webcontainer/env': 1.1.1
|
'@webcontainer/env': 1.1.1
|
||||||
better-sqlite3: 11.10.0
|
|
||||||
c12: 3.0.4(magicast@0.3.5)
|
c12: 3.0.4(magicast@0.3.5)
|
||||||
chokidar: 3.6.0
|
chokidar: 3.6.0
|
||||||
consola: 3.4.2
|
consola: 3.4.2
|
||||||
db0: 0.3.2(better-sqlite3@11.10.0)
|
db0: 0.3.2(better-sqlite3@11.10.0)
|
||||||
defu: 6.1.4
|
defu: 6.1.4
|
||||||
destr: 2.0.5
|
destr: 2.0.5
|
||||||
fast-glob: 3.3.3
|
|
||||||
git-url-parse: 16.1.0
|
git-url-parse: 16.1.0
|
||||||
jiti: 2.4.2
|
jiti: 2.4.2
|
||||||
|
json-schema-to-typescript: 15.0.4
|
||||||
knitwork: 1.2.0
|
knitwork: 1.2.0
|
||||||
listhen: 1.9.0
|
listhen: 1.9.0
|
||||||
mdast-util-to-hast: 13.2.0
|
mdast-util-to-hast: 13.2.0
|
||||||
@@ -8722,32 +8756,35 @@ snapshots:
|
|||||||
micromark-util-resolve-all: 2.0.1
|
micromark-util-resolve-all: 2.0.1
|
||||||
micromark-util-sanitize-uri: 2.0.1
|
micromark-util-sanitize-uri: 2.0.1
|
||||||
micromatch: 4.0.8
|
micromatch: 4.0.8
|
||||||
|
minimark: 0.2.0
|
||||||
minimatch: 10.0.1
|
minimatch: 10.0.1
|
||||||
nuxt-component-meta: 0.11.0(magicast@0.3.5)
|
nuxt-component-meta: 0.11.0(magicast@0.3.5)
|
||||||
|
nypm: 0.6.0
|
||||||
ohash: 2.0.11
|
ohash: 2.0.11
|
||||||
pathe: 2.0.3
|
pathe: 2.0.3
|
||||||
pkg-types: 2.1.0
|
pkg-types: 2.1.0
|
||||||
remark-mdc: 3.6.0
|
remark-mdc: 3.6.0
|
||||||
scule: 1.3.0
|
scule: 1.3.0
|
||||||
shiki: 3.4.2
|
shiki: 3.6.0
|
||||||
slugify: 1.6.6
|
slugify: 1.6.6
|
||||||
socket.io-client: 4.8.1
|
socket.io-client: 4.8.1
|
||||||
tar: 7.4.3
|
tar: 7.4.3
|
||||||
|
tinyglobby: 0.2.14
|
||||||
ufo: 1.6.1
|
ufo: 1.6.1
|
||||||
unified: 11.0.5
|
unified: 11.0.5
|
||||||
unist-util-stringify-position: 4.0.0
|
unist-util-stringify-position: 4.0.0
|
||||||
unist-util-visit: 5.0.0
|
unist-util-visit: 5.0.0
|
||||||
ws: 8.18.2
|
ws: 8.18.2
|
||||||
zod: 3.25.57
|
zod: 3.25.63
|
||||||
zod-to-json-schema: 3.24.5(zod@3.25.57)
|
zod-to-json-schema: 3.24.5(zod@3.25.63)
|
||||||
zod-to-ts: 1.2.0(typescript@5.8.3)(zod@3.25.57)
|
optionalDependencies:
|
||||||
|
better-sqlite3: 11.10.0
|
||||||
transitivePeerDependencies:
|
transitivePeerDependencies:
|
||||||
- bufferutil
|
- bufferutil
|
||||||
- drizzle-orm
|
- drizzle-orm
|
||||||
- magicast
|
- magicast
|
||||||
- mysql2
|
- mysql2
|
||||||
- supports-color
|
- supports-color
|
||||||
- typescript
|
|
||||||
- utf-8-validate
|
- utf-8-validate
|
||||||
|
|
||||||
'@nuxt/devalue@2.0.2': {}
|
'@nuxt/devalue@2.0.2': {}
|
||||||
@@ -9240,7 +9277,7 @@ snapshots:
|
|||||||
'@nuxtjs/mdc@0.17.0(magicast@0.3.5)':
|
'@nuxtjs/mdc@0.17.0(magicast@0.3.5)':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@nuxt/kit': 3.17.5(magicast@0.3.5)
|
'@nuxt/kit': 3.17.5(magicast@0.3.5)
|
||||||
'@shikijs/langs': 3.4.2
|
'@shikijs/langs': 3.6.0
|
||||||
'@shikijs/themes': 3.4.2
|
'@shikijs/themes': 3.4.2
|
||||||
'@shikijs/transformers': 3.4.2
|
'@shikijs/transformers': 3.4.2
|
||||||
'@types/hast': 3.0.4
|
'@types/hast': 3.0.4
|
||||||
@@ -9274,7 +9311,7 @@ snapshots:
|
|||||||
remark-rehype: 11.1.2
|
remark-rehype: 11.1.2
|
||||||
remark-stringify: 11.0.0
|
remark-stringify: 11.0.0
|
||||||
scule: 1.3.0
|
scule: 1.3.0
|
||||||
shiki: 3.4.2
|
shiki: 3.6.0
|
||||||
ufo: 1.6.1
|
ufo: 1.6.1
|
||||||
unified: 11.0.5
|
unified: 11.0.5
|
||||||
unist-builder: 4.0.0
|
unist-builder: 4.0.0
|
||||||
@@ -9787,25 +9824,36 @@ snapshots:
|
|||||||
'@types/hast': 3.0.4
|
'@types/hast': 3.0.4
|
||||||
hast-util-to-html: 9.0.5
|
hast-util-to-html: 9.0.5
|
||||||
|
|
||||||
'@shikijs/engine-javascript@3.4.2':
|
'@shikijs/core@3.6.0':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@shikijs/types': 3.4.2
|
'@shikijs/types': 3.6.0
|
||||||
|
'@shikijs/vscode-textmate': 10.0.2
|
||||||
|
'@types/hast': 3.0.4
|
||||||
|
hast-util-to-html: 9.0.5
|
||||||
|
|
||||||
|
'@shikijs/engine-javascript@3.6.0':
|
||||||
|
dependencies:
|
||||||
|
'@shikijs/types': 3.6.0
|
||||||
'@shikijs/vscode-textmate': 10.0.2
|
'@shikijs/vscode-textmate': 10.0.2
|
||||||
oniguruma-to-es: 4.3.3
|
oniguruma-to-es: 4.3.3
|
||||||
|
|
||||||
'@shikijs/engine-oniguruma@3.4.2':
|
'@shikijs/engine-oniguruma@3.6.0':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@shikijs/types': 3.4.2
|
'@shikijs/types': 3.6.0
|
||||||
'@shikijs/vscode-textmate': 10.0.2
|
'@shikijs/vscode-textmate': 10.0.2
|
||||||
|
|
||||||
'@shikijs/langs@3.4.2':
|
'@shikijs/langs@3.6.0':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@shikijs/types': 3.4.2
|
'@shikijs/types': 3.6.0
|
||||||
|
|
||||||
'@shikijs/themes@3.4.2':
|
'@shikijs/themes@3.4.2':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@shikijs/types': 3.4.2
|
'@shikijs/types': 3.4.2
|
||||||
|
|
||||||
|
'@shikijs/themes@3.6.0':
|
||||||
|
dependencies:
|
||||||
|
'@shikijs/types': 3.6.0
|
||||||
|
|
||||||
'@shikijs/transformers@3.4.2':
|
'@shikijs/transformers@3.4.2':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@shikijs/core': 3.4.2
|
'@shikijs/core': 3.4.2
|
||||||
@@ -9816,6 +9864,11 @@ snapshots:
|
|||||||
'@shikijs/vscode-textmate': 10.0.2
|
'@shikijs/vscode-textmate': 10.0.2
|
||||||
'@types/hast': 3.0.4
|
'@types/hast': 3.0.4
|
||||||
|
|
||||||
|
'@shikijs/types@3.6.0':
|
||||||
|
dependencies:
|
||||||
|
'@shikijs/vscode-textmate': 10.0.2
|
||||||
|
'@types/hast': 3.0.4
|
||||||
|
|
||||||
'@shikijs/vscode-textmate@10.0.2': {}
|
'@shikijs/vscode-textmate@10.0.2': {}
|
||||||
|
|
||||||
'@shuding/opentype.js@1.4.0-beta.0':
|
'@shuding/opentype.js@1.4.0-beta.0':
|
||||||
@@ -9843,7 +9896,7 @@ snapshots:
|
|||||||
|
|
||||||
'@speed-highlight/core@1.2.7': {}
|
'@speed-highlight/core@1.2.7': {}
|
||||||
|
|
||||||
'@sqlite.org/sqlite-wasm@3.49.1-build4': {}
|
'@sqlite.org/sqlite-wasm@3.50.1-build1': {}
|
||||||
|
|
||||||
'@standard-schema/spec@1.0.0': {}
|
'@standard-schema/spec@1.0.0': {}
|
||||||
|
|
||||||
@@ -9987,6 +10040,8 @@ snapshots:
|
|||||||
|
|
||||||
'@types/json-schema@7.0.15': {}
|
'@types/json-schema@7.0.15': {}
|
||||||
|
|
||||||
|
'@types/lodash@4.17.17': {}
|
||||||
|
|
||||||
'@types/mdast@4.0.4':
|
'@types/mdast@4.0.4':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@types/unist': 3.0.3
|
'@types/unist': 3.0.3
|
||||||
@@ -10713,6 +10768,7 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
bindings: 1.5.0
|
bindings: 1.5.0
|
||||||
prebuild-install: 7.1.3
|
prebuild-install: 7.1.3
|
||||||
|
optional: true
|
||||||
|
|
||||||
binary-extensions@2.3.0: {}
|
binary-extensions@2.3.0: {}
|
||||||
|
|
||||||
@@ -10727,6 +10783,7 @@ snapshots:
|
|||||||
buffer: 5.7.1
|
buffer: 5.7.1
|
||||||
inherits: 2.0.4
|
inherits: 2.0.4
|
||||||
readable-stream: 3.6.2
|
readable-stream: 3.6.2
|
||||||
|
optional: true
|
||||||
|
|
||||||
blake3-wasm@2.1.5: {}
|
blake3-wasm@2.1.5: {}
|
||||||
|
|
||||||
@@ -10882,7 +10939,8 @@ snapshots:
|
|||||||
optionalDependencies:
|
optionalDependencies:
|
||||||
fsevents: 2.3.3
|
fsevents: 2.3.3
|
||||||
|
|
||||||
chownr@1.1.4: {}
|
chownr@1.1.4:
|
||||||
|
optional: true
|
||||||
|
|
||||||
chownr@3.0.0: {}
|
chownr@3.0.0: {}
|
||||||
|
|
||||||
@@ -11294,10 +11352,12 @@ snapshots:
|
|||||||
decompress-response@6.0.0:
|
decompress-response@6.0.0:
|
||||||
dependencies:
|
dependencies:
|
||||||
mimic-response: 3.1.0
|
mimic-response: 3.1.0
|
||||||
|
optional: true
|
||||||
|
|
||||||
deep-eql@5.0.2: {}
|
deep-eql@5.0.2: {}
|
||||||
|
|
||||||
deep-extend@0.6.0: {}
|
deep-extend@0.6.0:
|
||||||
|
optional: true
|
||||||
|
|
||||||
deep-is@0.1.4: {}
|
deep-is@0.1.4: {}
|
||||||
|
|
||||||
@@ -11866,7 +11926,8 @@ snapshots:
|
|||||||
|
|
||||||
exit-hook@2.2.1: {}
|
exit-hook@2.2.1: {}
|
||||||
|
|
||||||
expand-template@2.0.3: {}
|
expand-template@2.0.3:
|
||||||
|
optional: true
|
||||||
|
|
||||||
expect-type@1.2.1: {}
|
expect-type@1.2.1: {}
|
||||||
|
|
||||||
@@ -12045,7 +12106,8 @@ snapshots:
|
|||||||
|
|
||||||
fresh@2.0.0: {}
|
fresh@2.0.0: {}
|
||||||
|
|
||||||
fs-constants@1.0.0: {}
|
fs-constants@1.0.0:
|
||||||
|
optional: true
|
||||||
|
|
||||||
fs.realpath@1.0.0: {}
|
fs.realpath@1.0.0: {}
|
||||||
|
|
||||||
@@ -12149,7 +12211,8 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
git-up: 8.1.1
|
git-up: 8.1.1
|
||||||
|
|
||||||
github-from-package@0.0.0: {}
|
github-from-package@0.0.0:
|
||||||
|
optional: true
|
||||||
|
|
||||||
github-slugger@2.0.0: {}
|
github-slugger@2.0.0: {}
|
||||||
|
|
||||||
@@ -12724,6 +12787,18 @@ snapshots:
|
|||||||
|
|
||||||
json-parse-even-better-errors@2.3.1: {}
|
json-parse-even-better-errors@2.3.1: {}
|
||||||
|
|
||||||
|
json-schema-to-typescript@15.0.4:
|
||||||
|
dependencies:
|
||||||
|
'@apidevtools/json-schema-ref-parser': 11.9.3
|
||||||
|
'@types/json-schema': 7.0.15
|
||||||
|
'@types/lodash': 4.17.17
|
||||||
|
is-glob: 4.0.3
|
||||||
|
js-yaml: 4.1.0
|
||||||
|
lodash: 4.17.21
|
||||||
|
minimist: 1.2.8
|
||||||
|
prettier: 3.5.3
|
||||||
|
tinyglobby: 0.2.14
|
||||||
|
|
||||||
json-schema-traverse@0.4.1: {}
|
json-schema-traverse@0.4.1: {}
|
||||||
|
|
||||||
json-schema@0.4.0: {}
|
json-schema@0.4.0: {}
|
||||||
@@ -13322,7 +13397,8 @@ snapshots:
|
|||||||
|
|
||||||
mimic-function@5.0.1: {}
|
mimic-function@5.0.1: {}
|
||||||
|
|
||||||
mimic-response@3.1.0: {}
|
mimic-response@3.1.0:
|
||||||
|
optional: true
|
||||||
|
|
||||||
min-indent@1.0.1: {}
|
min-indent@1.0.1: {}
|
||||||
|
|
||||||
@@ -13344,6 +13420,8 @@ snapshots:
|
|||||||
- bufferutil
|
- bufferutil
|
||||||
- utf-8-validate
|
- utf-8-validate
|
||||||
|
|
||||||
|
minimark@0.2.0: {}
|
||||||
|
|
||||||
minimatch@10.0.1:
|
minimatch@10.0.1:
|
||||||
dependencies:
|
dependencies:
|
||||||
brace-expansion: 2.0.1
|
brace-expansion: 2.0.1
|
||||||
@@ -13374,7 +13452,8 @@ snapshots:
|
|||||||
|
|
||||||
mitt@3.0.1: {}
|
mitt@3.0.1: {}
|
||||||
|
|
||||||
mkdirp-classic@0.5.3: {}
|
mkdirp-classic@0.5.3:
|
||||||
|
optional: true
|
||||||
|
|
||||||
mkdirp@3.0.1: {}
|
mkdirp@3.0.1: {}
|
||||||
|
|
||||||
@@ -13447,7 +13526,8 @@ snapshots:
|
|||||||
|
|
||||||
nanotar@0.2.0: {}
|
nanotar@0.2.0: {}
|
||||||
|
|
||||||
napi-build-utils@2.0.0: {}
|
napi-build-utils@2.0.0:
|
||||||
|
optional: true
|
||||||
|
|
||||||
napi-postinstall@0.2.4: {}
|
napi-postinstall@0.2.4: {}
|
||||||
|
|
||||||
@@ -13579,6 +13659,7 @@ snapshots:
|
|||||||
node-abi@3.75.0:
|
node-abi@3.75.0:
|
||||||
dependencies:
|
dependencies:
|
||||||
semver: 7.7.2
|
semver: 7.7.2
|
||||||
|
optional: true
|
||||||
|
|
||||||
node-addon-api@6.1.0:
|
node-addon-api@6.1.0:
|
||||||
optional: true
|
optional: true
|
||||||
@@ -14318,6 +14399,7 @@ snapshots:
|
|||||||
simple-get: 4.0.1
|
simple-get: 4.0.1
|
||||||
tar-fs: 2.1.3
|
tar-fs: 2.1.3
|
||||||
tunnel-agent: 0.6.0
|
tunnel-agent: 0.6.0
|
||||||
|
optional: true
|
||||||
|
|
||||||
precinct@12.2.0:
|
precinct@12.2.0:
|
||||||
dependencies:
|
dependencies:
|
||||||
@@ -14452,6 +14534,7 @@ snapshots:
|
|||||||
ini: 1.3.8
|
ini: 1.3.8
|
||||||
minimist: 1.2.8
|
minimist: 1.2.8
|
||||||
strip-json-comments: 2.0.1
|
strip-json-comments: 2.0.1
|
||||||
|
optional: true
|
||||||
|
|
||||||
react@19.1.0: {}
|
react@19.1.0: {}
|
||||||
|
|
||||||
@@ -14921,14 +15004,14 @@ snapshots:
|
|||||||
'@shikijs/types': 3.4.2
|
'@shikijs/types': 3.4.2
|
||||||
colorjs.io: 0.5.2
|
colorjs.io: 0.5.2
|
||||||
|
|
||||||
shiki@3.4.2:
|
shiki@3.6.0:
|
||||||
dependencies:
|
dependencies:
|
||||||
'@shikijs/core': 3.4.2
|
'@shikijs/core': 3.6.0
|
||||||
'@shikijs/engine-javascript': 3.4.2
|
'@shikijs/engine-javascript': 3.6.0
|
||||||
'@shikijs/engine-oniguruma': 3.4.2
|
'@shikijs/engine-oniguruma': 3.6.0
|
||||||
'@shikijs/langs': 3.4.2
|
'@shikijs/langs': 3.6.0
|
||||||
'@shikijs/themes': 3.4.2
|
'@shikijs/themes': 3.6.0
|
||||||
'@shikijs/types': 3.4.2
|
'@shikijs/types': 3.6.0
|
||||||
'@shikijs/vscode-textmate': 10.0.2
|
'@shikijs/vscode-textmate': 10.0.2
|
||||||
'@types/hast': 3.0.4
|
'@types/hast': 3.0.4
|
||||||
|
|
||||||
@@ -14964,13 +15047,15 @@ snapshots:
|
|||||||
|
|
||||||
signal-exit@4.1.0: {}
|
signal-exit@4.1.0: {}
|
||||||
|
|
||||||
simple-concat@1.0.1: {}
|
simple-concat@1.0.1:
|
||||||
|
optional: true
|
||||||
|
|
||||||
simple-get@4.0.1:
|
simple-get@4.0.1:
|
||||||
dependencies:
|
dependencies:
|
||||||
decompress-response: 6.0.0
|
decompress-response: 6.0.0
|
||||||
once: 1.4.0
|
once: 1.4.0
|
||||||
simple-concat: 1.0.1
|
simple-concat: 1.0.1
|
||||||
|
optional: true
|
||||||
|
|
||||||
simple-git@3.27.0:
|
simple-git@3.27.0:
|
||||||
dependencies:
|
dependencies:
|
||||||
@@ -15155,7 +15240,8 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
min-indent: 1.0.1
|
min-indent: 1.0.1
|
||||||
|
|
||||||
strip-json-comments@2.0.1: {}
|
strip-json-comments@2.0.1:
|
||||||
|
optional: true
|
||||||
|
|
||||||
strip-json-comments@3.1.1: {}
|
strip-json-comments@3.1.1: {}
|
||||||
|
|
||||||
@@ -15224,6 +15310,7 @@ snapshots:
|
|||||||
mkdirp-classic: 0.5.3
|
mkdirp-classic: 0.5.3
|
||||||
pump: 3.0.2
|
pump: 3.0.2
|
||||||
tar-stream: 2.2.0
|
tar-stream: 2.2.0
|
||||||
|
optional: true
|
||||||
|
|
||||||
tar-fs@3.0.9:
|
tar-fs@3.0.9:
|
||||||
dependencies:
|
dependencies:
|
||||||
@@ -15242,6 +15329,7 @@ snapshots:
|
|||||||
fs-constants: 1.0.0
|
fs-constants: 1.0.0
|
||||||
inherits: 2.0.4
|
inherits: 2.0.4
|
||||||
readable-stream: 3.6.2
|
readable-stream: 3.6.2
|
||||||
|
optional: true
|
||||||
|
|
||||||
tar-stream@3.1.7:
|
tar-stream@3.1.7:
|
||||||
dependencies:
|
dependencies:
|
||||||
@@ -15361,6 +15449,7 @@ snapshots:
|
|||||||
tunnel-agent@0.6.0:
|
tunnel-agent@0.6.0:
|
||||||
dependencies:
|
dependencies:
|
||||||
safe-buffer: 5.2.1
|
safe-buffer: 5.2.1
|
||||||
|
optional: true
|
||||||
|
|
||||||
type-check@0.4.0:
|
type-check@0.4.0:
|
||||||
dependencies:
|
dependencies:
|
||||||
@@ -16150,10 +16239,9 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
zod: 3.25.57
|
zod: 3.25.57
|
||||||
|
|
||||||
zod-to-ts@1.2.0(typescript@5.8.3)(zod@3.25.57):
|
zod-to-json-schema@3.24.5(zod@3.25.63):
|
||||||
dependencies:
|
dependencies:
|
||||||
typescript: 5.8.3
|
zod: 3.25.63
|
||||||
zod: 3.25.57
|
|
||||||
|
|
||||||
zod@3.22.3: {}
|
zod@3.22.3: {}
|
||||||
|
|
||||||
@@ -16161,4 +16249,6 @@ snapshots:
|
|||||||
|
|
||||||
zod@3.25.57: {}
|
zod@3.25.57: {}
|
||||||
|
|
||||||
|
zod@3.25.63: {}
|
||||||
|
|
||||||
zwitch@2.0.4: {}
|
zwitch@2.0.4: {}
|
||||||
|
|||||||
@@ -26,18 +26,13 @@ export interface CommandPaletteItem extends Omit<LinkProps, 'type' | 'raw' | 'cu
|
|||||||
loading?: boolean
|
loading?: boolean
|
||||||
disabled?: boolean
|
disabled?: boolean
|
||||||
slot?: string
|
slot?: string
|
||||||
/**
|
|
||||||
* The placeholder to display when the item has children.
|
|
||||||
*/
|
|
||||||
placeholder?: string
|
|
||||||
children?: CommandPaletteItem[]
|
|
||||||
onSelect?(e?: Event): void
|
onSelect?(e?: Event): void
|
||||||
class?: any
|
class?: any
|
||||||
ui?: Pick<CommandPalette['slots'], 'item' | 'itemLeadingIcon' | 'itemLeadingAvatarSize' | 'itemLeadingAvatar' | 'itemLeadingChipSize' | 'itemLeadingChip' | 'itemLabel' | 'itemLabelPrefix' | 'itemLabelBase' | 'itemLabelSuffix' | 'itemTrailing' | 'itemTrailingKbds' | 'itemTrailingKbdsSize' | 'itemTrailingHighlightedIcon' | 'itemTrailingIcon'>
|
ui?: Pick<CommandPalette['slots'], 'item' | 'itemLeadingIcon' | 'itemLeadingAvatarSize' | 'itemLeadingAvatar' | 'itemLeadingChipSize' | 'itemLeadingChip' | 'itemLabel' | 'itemLabelPrefix' | 'itemLabelBase' | 'itemLabelSuffix' | 'itemTrailing' | 'itemTrailingKbds' | 'itemTrailingKbdsSize' | 'itemTrailingHighlightedIcon' | 'itemTrailingIcon'>
|
||||||
[key: string]: any
|
[key: string]: any
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface CommandPaletteGroup<T extends CommandPaletteItem = CommandPaletteItem> {
|
export interface CommandPaletteGroup<T> {
|
||||||
id: string
|
id: string
|
||||||
label?: string
|
label?: string
|
||||||
slot?: string
|
slot?: string
|
||||||
@@ -57,7 +52,7 @@ export interface CommandPaletteGroup<T extends CommandPaletteItem = CommandPalet
|
|||||||
highlightedIcon?: string
|
highlightedIcon?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface CommandPaletteProps<G extends CommandPaletteGroup<T> = CommandPaletteGroup<any>, T extends CommandPaletteItem = CommandPaletteItem> extends Pick<ListboxRootProps, 'multiple' | 'disabled' | 'modelValue' | 'defaultValue' | 'highlightOnHover' | 'selectionBehavior'>, Pick<UseComponentIconsProps, 'loading' | 'loadingIcon'> {
|
export interface CommandPaletteProps<G, T> extends Pick<ListboxRootProps, 'multiple' | 'disabled' | 'modelValue' | 'defaultValue' | 'highlightOnHover'>, Pick<UseComponentIconsProps, 'loading' | 'loadingIcon'> {
|
||||||
/**
|
/**
|
||||||
* The element or component this component should render as.
|
* The element or component this component should render as.
|
||||||
* @defaultValue 'div'
|
* @defaultValue 'div'
|
||||||
@@ -75,12 +70,6 @@ export interface CommandPaletteProps<G extends CommandPaletteGroup<T> = CommandP
|
|||||||
* @IconifyIcon
|
* @IconifyIcon
|
||||||
*/
|
*/
|
||||||
selectedIcon?: string
|
selectedIcon?: string
|
||||||
/**
|
|
||||||
* The icon displayed when an item has children.
|
|
||||||
* @defaultValue appConfig.ui.icons.chevronRight
|
|
||||||
* @IconifyIcon
|
|
||||||
*/
|
|
||||||
trailingIcon?: string
|
|
||||||
/**
|
/**
|
||||||
* The placeholder text for the input.
|
* The placeholder text for the input.
|
||||||
* @defaultValue t('commandPalette.placeholder')
|
* @defaultValue t('commandPalette.placeholder')
|
||||||
@@ -104,18 +93,6 @@ export interface CommandPaletteProps<G extends CommandPaletteGroup<T> = CommandP
|
|||||||
* @IconifyIcon
|
* @IconifyIcon
|
||||||
*/
|
*/
|
||||||
closeIcon?: string
|
closeIcon?: string
|
||||||
/**
|
|
||||||
* Display a button to navigate back in history.
|
|
||||||
* `{ size: 'md', color: 'neutral', variant: 'link' }`{lang="ts-type"}
|
|
||||||
* @defaultValue true
|
|
||||||
*/
|
|
||||||
back?: boolean | ButtonProps
|
|
||||||
/**
|
|
||||||
* The icon displayed in the back button.
|
|
||||||
* @defaultValue appConfig.ui.icons.arrowLeft
|
|
||||||
* @IconifyIcon
|
|
||||||
*/
|
|
||||||
backIcon?: string
|
|
||||||
groups?: G[]
|
groups?: G[]
|
||||||
/**
|
/**
|
||||||
* Options for [useFuse](https://vueuse.org/integrations/useFuse).
|
* Options for [useFuse](https://vueuse.org/integrations/useFuse).
|
||||||
@@ -139,15 +116,14 @@ export interface CommandPaletteProps<G extends CommandPaletteGroup<T> = CommandP
|
|||||||
ui?: CommandPalette['slots']
|
ui?: CommandPalette['slots']
|
||||||
}
|
}
|
||||||
|
|
||||||
export type CommandPaletteEmits<T extends CommandPaletteItem = CommandPaletteItem> = ListboxRootEmits<T> & {
|
export type CommandPaletteEmits<T> = ListboxRootEmits<T> & {
|
||||||
'update:open': [value: boolean]
|
'update:open': [value: boolean]
|
||||||
}
|
}
|
||||||
|
|
||||||
type SlotProps<T> = (props: { item: T, index: number }) => any
|
type SlotProps<T> = (props: { item: T, index: number }) => any
|
||||||
|
|
||||||
export type CommandPaletteSlots<G extends CommandPaletteGroup<T> = CommandPaletteGroup<any>, T extends CommandPaletteItem = CommandPaletteItem> = {
|
export type CommandPaletteSlots<G extends { slot?: string }, T extends { slot?: string }> = {
|
||||||
'empty'(props: { searchTerm?: string }): any
|
'empty'(props: { searchTerm?: string }): any
|
||||||
'back'(props: { ui: { [K in keyof Required<CommandPalette['slots']>]: (props?: Record<string, any>) => string } }): any
|
|
||||||
'close'(props: { ui: { [K in keyof Required<CommandPalette['slots']>]: (props?: Record<string, any>) => string } }): any
|
'close'(props: { ui: { [K in keyof Required<CommandPalette['slots']>]: (props?: Record<string, any>) => string } }): any
|
||||||
'item': SlotProps<T>
|
'item': SlotProps<T>
|
||||||
'item-leading': SlotProps<T>
|
'item-leading': SlotProps<T>
|
||||||
@@ -158,7 +134,7 @@ export type CommandPaletteSlots<G extends CommandPaletteGroup<T> = CommandPalett
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script setup lang="ts" generic="G extends CommandPaletteGroup<T>, T extends CommandPaletteItem">
|
<script setup lang="ts" generic="G extends CommandPaletteGroup<T>, T extends CommandPaletteItem">
|
||||||
import { computed, ref, useTemplateRef } from 'vue'
|
import { computed } from 'vue'
|
||||||
import { ListboxRoot, ListboxFilter, ListboxContent, ListboxGroup, ListboxGroupLabel, ListboxItem, ListboxItemIndicator, useForwardProps, useForwardPropsEmits } from 'reka-ui'
|
import { ListboxRoot, ListboxFilter, ListboxContent, ListboxGroup, ListboxGroupLabel, ListboxItem, ListboxItemIndicator, useForwardProps, useForwardPropsEmits } from 'reka-ui'
|
||||||
import { defu } from 'defu'
|
import { defu } from 'defu'
|
||||||
import { reactivePick } from '@vueuse/core'
|
import { reactivePick } from '@vueuse/core'
|
||||||
@@ -181,8 +157,7 @@ import UKbd from './Kbd.vue'
|
|||||||
const props = withDefaults(defineProps<CommandPaletteProps<G, T>>(), {
|
const props = withDefaults(defineProps<CommandPaletteProps<G, T>>(), {
|
||||||
modelValue: '',
|
modelValue: '',
|
||||||
labelKey: 'label',
|
labelKey: 'label',
|
||||||
autofocus: true,
|
autofocus: true
|
||||||
back: true
|
|
||||||
})
|
})
|
||||||
const emits = defineEmits<CommandPaletteEmits<T>>()
|
const emits = defineEmits<CommandPaletteEmits<T>>()
|
||||||
const slots = defineSlots<CommandPaletteSlots<G, T>>()
|
const slots = defineSlots<CommandPaletteSlots<G, T>>()
|
||||||
@@ -192,7 +167,7 @@ const searchTerm = defineModel<string>('searchTerm', { default: '' })
|
|||||||
const { t } = useLocale()
|
const { t } = useLocale()
|
||||||
const appConfig = useAppConfig() as CommandPalette['AppConfig']
|
const appConfig = useAppConfig() as CommandPalette['AppConfig']
|
||||||
|
|
||||||
const rootProps = useForwardPropsEmits(reactivePick(props, 'as', 'disabled', 'multiple', 'modelValue', 'defaultValue', 'highlightOnHover', 'selectionBehavior'), emits)
|
const rootProps = useForwardPropsEmits(reactivePick(props, 'as', 'disabled', 'multiple', 'modelValue', 'defaultValue', 'highlightOnHover'), emits)
|
||||||
const inputProps = useForwardProps(reactivePick(props, 'loading', 'loadingIcon'))
|
const inputProps = useForwardProps(reactivePick(props, 'loading', 'loadingIcon'))
|
||||||
|
|
||||||
// eslint-disable-next-line vue/no-dupe-keys
|
// eslint-disable-next-line vue/no-dupe-keys
|
||||||
@@ -208,22 +183,18 @@ const fuse = computed(() => defu({}, props.fuse, {
|
|||||||
matchAllWhenSearchEmpty: true
|
matchAllWhenSearchEmpty: true
|
||||||
}))
|
}))
|
||||||
|
|
||||||
const history = ref<(CommandPaletteGroup & { placeholder?: string })[]>([])
|
const items = computed(() => props.groups?.filter((group) => {
|
||||||
|
|
||||||
const placeholder = computed(() => history.value[history.value.length - 1]?.placeholder || props.placeholder || t('commandPalette.placeholder'))
|
|
||||||
|
|
||||||
const groups = computed(() => history.value?.length ? [history.value[history.value.length - 1] as G] : props.groups)
|
|
||||||
|
|
||||||
const items = computed(() => groups.value?.filter((group) => {
|
|
||||||
if (!group.id) {
|
if (!group.id) {
|
||||||
console.warn(`[@nuxt/ui] CommandPalette group is missing an \`id\` property`)
|
console.warn(`[@nuxt/ui] CommandPalette group is missing an \`id\` property`)
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
if (group.ignoreFilter) {
|
if (group.ignoreFilter) {
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
return true
|
return true
|
||||||
})?.flatMap(group => group.items?.map(item => ({ ...item, group: group.id })) || []) || [])
|
}).flatMap(group => group.items?.map(item => ({ ...item, group: group.id })) || []) || [])
|
||||||
|
|
||||||
const { results: fuseResults } = useFuse<typeof items.value[number]>(searchTerm, items, fuse)
|
const { results: fuseResults } = useFuse<typeof items.value[number]>(searchTerm, items, fuse)
|
||||||
|
|
||||||
@@ -244,7 +215,7 @@ function getGroupWithItems(group: G, items: (T & { matches?: FuseResult<T>['matc
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const filteredGroups = computed(() => {
|
const groups = computed(() => {
|
||||||
const groupsById = fuseResults.value.reduce((acc, result) => {
|
const groupsById = fuseResults.value.reduce((acc, result) => {
|
||||||
const { item, matches } = result
|
const { item, matches } = result
|
||||||
if (!item.group) {
|
if (!item.group) {
|
||||||
@@ -258,7 +229,7 @@ const filteredGroups = computed(() => {
|
|||||||
}, {} as Record<string, (T & { matches?: FuseResult<T>['matches'] })[]>)
|
}, {} as Record<string, (T & { matches?: FuseResult<T>['matches'] })[]>)
|
||||||
|
|
||||||
const fuseGroups = Object.entries(groupsById).map(([id, items]) => {
|
const fuseGroups = Object.entries(groupsById).map(([id, items]) => {
|
||||||
const group = groups.value?.find(group => group.id === id)
|
const group = props.groups?.find(group => group.id === id)
|
||||||
if (!group) {
|
if (!group) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@@ -266,7 +237,7 @@ const filteredGroups = computed(() => {
|
|||||||
return getGroupWithItems(group, items)
|
return getGroupWithItems(group, items)
|
||||||
}).filter(group => !!group)
|
}).filter(group => !!group)
|
||||||
|
|
||||||
const nonFuseGroups = groups.value
|
const nonFuseGroups = props.groups
|
||||||
?.map((group, index) => ({ ...group, index }))
|
?.map((group, index) => ({ ...group, index }))
|
||||||
?.filter(group => group.ignoreFilter && group.items?.length)
|
?.filter(group => group.ignoreFilter && group.items?.length)
|
||||||
?.map(group => ({ ...getGroupWithItems(group, group.items || []), index: group.index })) || []
|
?.map(group => ({ ...getGroupWithItems(group, group.items || []), index: group.index })) || []
|
||||||
@@ -276,84 +247,20 @@ const filteredGroups = computed(() => {
|
|||||||
return acc
|
return acc
|
||||||
}, [...fuseGroups])
|
}, [...fuseGroups])
|
||||||
})
|
})
|
||||||
|
|
||||||
const listboxRootRef = useTemplateRef('listboxRootRef')
|
|
||||||
|
|
||||||
function navigate(item: T) {
|
|
||||||
if (!item.children?.length) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
history.value.push({
|
|
||||||
id: `history-${history.value.length}`,
|
|
||||||
label: item.label,
|
|
||||||
slot: item.slot,
|
|
||||||
placeholder: item.placeholder,
|
|
||||||
items: item.children
|
|
||||||
} as any)
|
|
||||||
|
|
||||||
searchTerm.value = ''
|
|
||||||
|
|
||||||
listboxRootRef.value?.highlightFirstItem()
|
|
||||||
}
|
|
||||||
|
|
||||||
function navigateBack() {
|
|
||||||
if (!history.value.length) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
history.value.pop()
|
|
||||||
|
|
||||||
searchTerm.value = ''
|
|
||||||
|
|
||||||
listboxRootRef.value?.highlightFirstItem()
|
|
||||||
}
|
|
||||||
|
|
||||||
function onBackspace() {
|
|
||||||
if (!searchTerm.value) {
|
|
||||||
navigateBack()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function onSelect(e: Event, item: T) {
|
|
||||||
if (item.children?.length) {
|
|
||||||
e.preventDefault()
|
|
||||||
|
|
||||||
navigate(item)
|
|
||||||
} else {
|
|
||||||
item.onSelect?.(e)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- eslint-disable vue/no-v-html -->
|
<!-- eslint-disable vue/no-v-html -->
|
||||||
<template>
|
<template>
|
||||||
<ListboxRoot v-bind="rootProps" ref="listboxRootRef" :class="ui.root({ class: [props.ui?.root, props.class] })">
|
<ListboxRoot v-bind="rootProps" :class="ui.root({ class: [props.ui?.root, props.class] })">
|
||||||
<ListboxFilter v-model="searchTerm" as-child>
|
<ListboxFilter v-model="searchTerm" as-child>
|
||||||
<UInput
|
<UInput
|
||||||
:placeholder="placeholder"
|
:placeholder="placeholder || t('commandPalette.placeholder')"
|
||||||
variant="none"
|
variant="none"
|
||||||
:autofocus="autofocus"
|
:autofocus="autofocus"
|
||||||
v-bind="inputProps"
|
v-bind="inputProps"
|
||||||
:icon="icon || appConfig.ui.icons.search"
|
:icon="icon || appConfig.ui.icons.search"
|
||||||
:class="ui.input({ class: props.ui?.input })"
|
:class="ui.input({ class: props.ui?.input })"
|
||||||
@keydown.backspace="onBackspace"
|
|
||||||
>
|
>
|
||||||
<template v-if="history?.length && (back || !!slots.back)" #leading>
|
|
||||||
<slot name="back" :ui="ui">
|
|
||||||
<UButton
|
|
||||||
:icon="backIcon || appConfig.ui.icons.arrowLeft"
|
|
||||||
size="md"
|
|
||||||
color="neutral"
|
|
||||||
variant="link"
|
|
||||||
:aria-label="t('commandPalette.back')"
|
|
||||||
v-bind="(typeof back === 'object' ? back as Partial<ButtonProps> : {})"
|
|
||||||
:class="ui.back({ class: props.ui?.back })"
|
|
||||||
@click="navigateBack"
|
|
||||||
/>
|
|
||||||
</slot>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template v-if="close || !!slots.close" #trailing>
|
<template v-if="close || !!slots.close" #trailing>
|
||||||
<slot name="close" :ui="ui">
|
<slot name="close" :ui="ui">
|
||||||
<UButton
|
<UButton
|
||||||
@@ -373,8 +280,8 @@ function onSelect(e: Event, item: T) {
|
|||||||
</ListboxFilter>
|
</ListboxFilter>
|
||||||
|
|
||||||
<ListboxContent :class="ui.content({ class: props.ui?.content })">
|
<ListboxContent :class="ui.content({ class: props.ui?.content })">
|
||||||
<div v-if="filteredGroups?.length" role="presentation" :class="ui.viewport({ class: props.ui?.viewport })">
|
<div v-if="groups?.length" role="presentation" :class="ui.viewport({ class: props.ui?.viewport })">
|
||||||
<ListboxGroup v-for="group in filteredGroups" :key="`group-${group.id}`" :class="ui.group({ class: props.ui?.group })">
|
<ListboxGroup v-for="group in groups" :key="`group-${group.id}`" :class="ui.group({ class: props.ui?.group })">
|
||||||
<ListboxGroupLabel v-if="get(group, props.labelKey as string)" :class="ui.label({ class: props.ui?.label })">
|
<ListboxGroupLabel v-if="get(group, props.labelKey as string)" :class="ui.label({ class: props.ui?.label })">
|
||||||
{{ get(group, props.labelKey as string) }}
|
{{ get(group, props.labelKey as string) }}
|
||||||
</ListboxGroupLabel>
|
</ListboxGroupLabel>
|
||||||
@@ -382,10 +289,10 @@ function onSelect(e: Event, item: T) {
|
|||||||
<ListboxItem
|
<ListboxItem
|
||||||
v-for="(item, index) in group.items"
|
v-for="(item, index) in group.items"
|
||||||
:key="`group-${group.id}-${index}`"
|
:key="`group-${group.id}-${index}`"
|
||||||
:value="omit(item, ['matches' as any, 'group' as any, 'onSelect', 'labelHtml', 'suffixHtml', 'children'])"
|
:value="omit(item, ['matches' as any, 'group' as any, 'onSelect', 'labelHtml', 'suffixHtml'])"
|
||||||
:disabled="item.disabled"
|
:disabled="item.disabled"
|
||||||
as-child
|
as-child
|
||||||
@select="onSelect($event, item)"
|
@select="item.onSelect"
|
||||||
>
|
>
|
||||||
<ULink v-slot="{ active, ...slotProps }" v-bind="pickLinkProps(item)" custom>
|
<ULink v-slot="{ active, ...slotProps }" v-bind="pickLinkProps(item)" custom>
|
||||||
<ULinkBase v-bind="slotProps" :class="ui.item({ class: [props.ui?.item, item.ui?.item, item.class], active: active || item.active })">
|
<ULinkBase v-bind="slotProps" :class="ui.item({ class: [props.ui?.item, item.ui?.item, item.class], active: active || item.active })">
|
||||||
@@ -416,20 +323,13 @@ function onSelect(e: Event, item: T) {
|
|||||||
|
|
||||||
<span :class="ui.itemTrailing({ class: [props.ui?.itemTrailing, item.ui?.itemTrailing] })">
|
<span :class="ui.itemTrailing({ class: [props.ui?.itemTrailing, item.ui?.itemTrailing] })">
|
||||||
<slot :name="((item.slot ? `${item.slot}-trailing` : group.slot ? `${group.slot}-trailing` : `item-trailing`) as keyof CommandPaletteSlots<G, T>)" :item="(item as any)" :index="index">
|
<slot :name="((item.slot ? `${item.slot}-trailing` : group.slot ? `${group.slot}-trailing` : `item-trailing`) as keyof CommandPaletteSlots<G, T>)" :item="(item as any)" :index="index">
|
||||||
<UIcon
|
<span v-if="item.kbds?.length" :class="ui.itemTrailingKbds({ class: [props.ui?.itemTrailingKbds, item.ui?.itemTrailingKbds] })">
|
||||||
v-if="item.children && item.children.length > 0"
|
|
||||||
:name="trailingIcon || appConfig.ui.icons.chevronRight"
|
|
||||||
:class="ui.itemTrailingIcon({ class: [props.ui?.itemTrailingIcon, item.ui?.itemTrailingIcon] })"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<span v-else-if="item.kbds?.length" :class="ui.itemTrailingKbds({ class: [props.ui?.itemTrailingKbds, item.ui?.itemTrailingKbds] })">
|
|
||||||
<UKbd v-for="(kbd, kbdIndex) in item.kbds" :key="kbdIndex" :size="((item.ui?.itemTrailingKbdsSize || props.ui?.itemTrailingKbdsSize || ui.itemTrailingKbdsSize()) as KbdProps['size'])" v-bind="typeof kbd === 'string' ? { value: kbd } : kbd" />
|
<UKbd v-for="(kbd, kbdIndex) in item.kbds" :key="kbdIndex" :size="((item.ui?.itemTrailingKbdsSize || props.ui?.itemTrailingKbdsSize || ui.itemTrailingKbdsSize()) as KbdProps['size'])" v-bind="typeof kbd === 'string' ? { value: kbd } : kbd" />
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<UIcon v-else-if="group.highlightedIcon" :name="group.highlightedIcon" :class="ui.itemTrailingHighlightedIcon({ class: [props.ui?.itemTrailingHighlightedIcon, item.ui?.itemTrailingHighlightedIcon] })" />
|
<UIcon v-else-if="group.highlightedIcon" :name="group.highlightedIcon" :class="ui.itemTrailingHighlightedIcon({ class: [props.ui?.itemTrailingHighlightedIcon, item.ui?.itemTrailingHighlightedIcon] })" />
|
||||||
</slot>
|
</slot>
|
||||||
|
|
||||||
<ListboxItemIndicator v-if="!item.children?.length" as-child>
|
<ListboxItemIndicator as-child>
|
||||||
<UIcon :name="selectedIcon || appConfig.ui.icons.check" :class="ui.itemTrailingIcon({ class: [props.ui?.itemTrailingIcon, item.ui?.itemTrailingIcon] })" />
|
<UIcon :name="selectedIcon || appConfig.ui.icons.check" :class="ui.itemTrailingIcon({ class: [props.ui?.itemTrailingIcon, item.ui?.itemTrailingIcon] })" />
|
||||||
</ListboxItemIndicator>
|
</ListboxItemIndicator>
|
||||||
</span>
|
</span>
|
||||||
|
|||||||
@@ -19,20 +19,6 @@ export interface FormFieldProps {
|
|||||||
description?: string
|
description?: string
|
||||||
help?: string
|
help?: string
|
||||||
error?: string | boolean
|
error?: string | boolean
|
||||||
|
|
||||||
/**
|
|
||||||
* An array of errors for this field.
|
|
||||||
* Note that only one error is displayed by default. You can use `maxErrors` to control the number of displayed errors.
|
|
||||||
* @defaultValue `1`
|
|
||||||
*/
|
|
||||||
errors?: string[]
|
|
||||||
|
|
||||||
/**
|
|
||||||
* The maximum number of errors to display. If `false` or negative, display all available errors.
|
|
||||||
* @defaultValue `1`
|
|
||||||
*/
|
|
||||||
maxErrors?: number | false
|
|
||||||
|
|
||||||
hint?: string
|
hint?: string
|
||||||
/**
|
/**
|
||||||
* @defaultValue 'md'
|
* @defaultValue 'md'
|
||||||
@@ -56,7 +42,7 @@ export interface FormFieldSlots {
|
|||||||
description(props: { description?: string }): any
|
description(props: { description?: string }): any
|
||||||
help(props: { help?: string }): any
|
help(props: { help?: string }): any
|
||||||
error(props: { error?: string | boolean }): any
|
error(props: { error?: string | boolean }): any
|
||||||
default(props: { error?: string | boolean, errors?: string[] }): any
|
default(props: { error?: string | boolean }): any
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -68,7 +54,7 @@ import { formFieldInjectionKey, inputIdInjectionKey } from '../composables/useFo
|
|||||||
import { tv } from '../utils/tv'
|
import { tv } from '../utils/tv'
|
||||||
import type { FormError, FormFieldInjectedOptions } from '../types/form'
|
import type { FormError, FormFieldInjectedOptions } from '../types/form'
|
||||||
|
|
||||||
const props = withDefaults(defineProps<FormFieldProps>(), { maxErrors: 1 })
|
const props = defineProps<FormFieldProps>()
|
||||||
const slots = defineSlots<FormFieldSlots>()
|
const slots = defineSlots<FormFieldSlots>()
|
||||||
|
|
||||||
const appConfig = useAppConfig() as FormField['AppConfig']
|
const appConfig = useAppConfig() as FormField['AppConfig']
|
||||||
@@ -80,24 +66,7 @@ const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.formField ||
|
|||||||
|
|
||||||
const formErrors = inject<Ref<FormError[]> | null>('form-errors', null)
|
const formErrors = inject<Ref<FormError[]> | null>('form-errors', null)
|
||||||
|
|
||||||
const errors = computed(() =>
|
const error = computed(() => props.error || formErrors?.value?.find(error => error.name && (error.name === props.name || (props.errorPattern && error.name.match(props.errorPattern))))?.message)
|
||||||
(props.error && typeof props.error === 'string' ? [props.error] : props.errors)
|
|
||||||
|| formErrors?.value?.flatMap((error) => {
|
|
||||||
if (!error.name) return []
|
|
||||||
if (error.name === props.name || (props.errorPattern && error.name.match(props.errorPattern))) {
|
|
||||||
return [error.message]
|
|
||||||
}
|
|
||||||
return []
|
|
||||||
}))
|
|
||||||
|
|
||||||
const error = computed(() => errors.value?.[0] ?? props.error)
|
|
||||||
|
|
||||||
const displayedErrors = computed(() =>
|
|
||||||
props.maxErrors === false
|
|
||||||
|| (!!props.maxErrors && props.maxErrors < 0)
|
|
||||||
? errors.value
|
|
||||||
: errors.value?.slice(0, props.maxErrors)
|
|
||||||
)
|
|
||||||
|
|
||||||
const id = ref(useId())
|
const id = ref(useId())
|
||||||
// Copies id's initial value to bind aria-attributes such as aria-describedby.
|
// Copies id's initial value to bind aria-attributes such as aria-describedby.
|
||||||
@@ -144,16 +113,9 @@ provide(formFieldInjectionKey, computed(() => ({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div :class="[(label || !!slots.label || description || !!slots.description) && ui.container({ class: props.ui?.container })]">
|
<div :class="[(label || !!slots.label || description || !!slots.description) && ui.container({ class: props.ui?.container })]">
|
||||||
<slot :error="error" :errors="errors" />
|
<slot :error="error" />
|
||||||
|
|
||||||
<template v-if="(typeof error === 'string' && error)">
|
<div v-if="(typeof error === 'string' && error) || !!slots.error" :id="`${ariaId}-error`" :class="ui.error({ class: props.ui?.error })">
|
||||||
<div v-for="err in displayedErrors" :id="`${ariaId}-error`" :key="err" :class="ui.error({ class: props.ui?.error })">
|
|
||||||
<slot name="error" :error="err">
|
|
||||||
{{ err }}
|
|
||||||
</slot>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<div v-else-if="!!slots.error" :id="`${ariaId}-error`" :class="ui.error({ class: props.ui?.error })">
|
|
||||||
<slot name="error" :error="error">
|
<slot name="error" :error="error">
|
||||||
{{ error }}
|
{{ error }}
|
||||||
</slot>
|
</slot>
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import type { AppConfig } from '@nuxt/schema'
|
import type { AppConfig } from '@nuxt/schema'
|
||||||
import type { TagsInputRootProps, TagsInputRootEmits, AcceptableInputValue } from 'reka-ui'
|
import type { TagsInputRootProps, AcceptableInputValue } from 'reka-ui'
|
||||||
import theme from '#build/ui/input-tags'
|
import theme from '#build/ui/input-tags'
|
||||||
import type { UseComponentIconsProps } from '../composables/useComponentIcons'
|
import type { UseComponentIconsProps } from '../composables/useComponentIcons'
|
||||||
import type { AvatarProps } from '../types'
|
import type { AvatarProps } from '../types'
|
||||||
@@ -44,10 +44,11 @@ export interface InputTagsProps<T extends InputTagItem = InputTagItem> extends P
|
|||||||
ui?: InputTags['slots']
|
ui?: InputTags['slots']
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface InputTagsEmits<T extends InputTagItem> extends TagsInputRootEmits<T> {
|
export type InputTagsEmits<T extends InputTagItem> = {
|
||||||
change: [event: Event]
|
'update:modelValue': [payload: T[]]
|
||||||
blur: [event: FocusEvent]
|
'change': [payload: Event]
|
||||||
focus: [event: FocusEvent]
|
'blur': [payload: FocusEvent]
|
||||||
|
'focus': [payload: FocusEvent]
|
||||||
}
|
}
|
||||||
|
|
||||||
type SlotProps<T extends InputTagItem> = (props: { item: T, index: number }) => any
|
type SlotProps<T extends InputTagItem> = (props: { item: T, index: number }) => any
|
||||||
@@ -71,7 +72,6 @@ import { useComponentIcons } from '../composables/useComponentIcons'
|
|||||||
import { useFormField } from '../composables/useFormField'
|
import { useFormField } from '../composables/useFormField'
|
||||||
import { tv } from '../utils/tv'
|
import { tv } from '../utils/tv'
|
||||||
import UIcon from './Icon.vue'
|
import UIcon from './Icon.vue'
|
||||||
import UAvatar from './Avatar.vue'
|
|
||||||
|
|
||||||
defineOptions({ inheritAttrs: false })
|
defineOptions({ inheritAttrs: false })
|
||||||
|
|
||||||
|
|||||||
@@ -245,10 +245,6 @@ function onUpdateOpen(value: boolean) {
|
|||||||
function isSelectItem(item: SelectItem): item is SelectItemBase {
|
function isSelectItem(item: SelectItem): item is SelectItemBase {
|
||||||
return typeof item === 'object' && item !== null
|
return typeof item === 'object' && item !== null
|
||||||
}
|
}
|
||||||
|
|
||||||
defineExpose({
|
|
||||||
triggerRef
|
|
||||||
})
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- eslint-disable vue/no-template-shadow -->
|
<!-- eslint-disable vue/no-template-shadow -->
|
||||||
|
|||||||
@@ -363,10 +363,6 @@ function onSelect(e: Event, item: SelectMenuItem) {
|
|||||||
function isSelectItem(item: SelectMenuItem): item is _SelectMenuItem {
|
function isSelectItem(item: SelectMenuItem): item is _SelectMenuItem {
|
||||||
return typeof item === 'object' && item !== null
|
return typeof item === 'object' && item !== null
|
||||||
}
|
}
|
||||||
|
|
||||||
defineExpose({
|
|
||||||
triggerRef
|
|
||||||
})
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- eslint-disable vue/no-template-shadow -->
|
<!-- eslint-disable vue/no-template-shadow -->
|
||||||
|
|||||||
@@ -61,13 +61,13 @@ export type TableRow<T> = Row<T>
|
|||||||
export type TableData = RowData
|
export type TableData = RowData
|
||||||
export type TableColumn<T extends TableData, D = unknown> = ColumnDef<T, D>
|
export type TableColumn<T extends TableData, D = unknown> = ColumnDef<T, D>
|
||||||
|
|
||||||
export interface TableOptions<T extends TableData = TableData> extends Omit<CoreOptions<T>, 'data' | 'columns' | 'getCoreRowModel' | 'state' | 'onStateChange' | 'renderFallbackValue'> {
|
export interface TableOptions<T extends TableData> extends Omit<CoreOptions<T>, 'data' | 'columns' | 'getCoreRowModel' | 'state' | 'onStateChange' | 'renderFallbackValue'> {
|
||||||
state?: CoreOptions<T>['state']
|
state?: CoreOptions<T>['state']
|
||||||
onStateChange?: CoreOptions<T>['onStateChange']
|
onStateChange?: CoreOptions<T>['onStateChange']
|
||||||
renderFallbackValue?: CoreOptions<T>['renderFallbackValue']
|
renderFallbackValue?: CoreOptions<T>['renderFallbackValue']
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface TableProps<T extends TableData = TableData> extends TableOptions<T> {
|
export interface TableProps<T extends TableData> extends TableOptions<T> {
|
||||||
/**
|
/**
|
||||||
* The element or component this component should render as.
|
* The element or component this component should render as.
|
||||||
* @defaultValue 'div'
|
* @defaultValue 'div'
|
||||||
@@ -172,7 +172,7 @@ export interface TableProps<T extends TableData = TableData> extends TableOption
|
|||||||
type DynamicHeaderSlots<T, K = keyof T> = Record<string, (props: HeaderContext<T, unknown>) => any> & Record<`${K extends string ? K : never}-header`, (props: HeaderContext<T, unknown>) => any>
|
type DynamicHeaderSlots<T, K = keyof T> = Record<string, (props: HeaderContext<T, unknown>) => any> & Record<`${K extends string ? K : never}-header`, (props: HeaderContext<T, unknown>) => any>
|
||||||
type DynamicCellSlots<T, K = keyof T> = Record<string, (props: CellContext<T, unknown>) => any> & Record<`${K extends string ? K : never}-cell`, (props: CellContext<T, unknown>) => any>
|
type DynamicCellSlots<T, K = keyof T> = Record<string, (props: CellContext<T, unknown>) => any> & Record<`${K extends string ? K : never}-cell`, (props: CellContext<T, unknown>) => any>
|
||||||
|
|
||||||
export type TableSlots<T extends TableData = TableData> = {
|
export type TableSlots<T> = {
|
||||||
expanded: (props: { row: Row<T> }) => any
|
expanded: (props: { row: Row<T> }) => any
|
||||||
empty: (props?: {}) => any
|
empty: (props?: {}) => any
|
||||||
loading: (props?: {}) => any
|
loading: (props?: {}) => any
|
||||||
@@ -226,7 +226,7 @@ const groupingState = defineModel<GroupingState>('grouping', { default: [] })
|
|||||||
const expandedState = defineModel<ExpandedState>('expanded', { default: {} })
|
const expandedState = defineModel<ExpandedState>('expanded', { default: {} })
|
||||||
const paginationState = defineModel<PaginationState>('pagination', { default: {} })
|
const paginationState = defineModel<PaginationState>('pagination', { default: {} })
|
||||||
|
|
||||||
const tableRef = ref<HTMLTableElement | null>(null)
|
const tableRef = ref<HTMLTableElement>()
|
||||||
|
|
||||||
const tableApi = useVueTable({
|
const tableApi = useVueTable({
|
||||||
...reactiveOmit(props, 'as', 'data', 'columns', 'caption', 'sticky', 'loading', 'loadingColor', 'loadingAnimation', 'class', 'ui'),
|
...reactiveOmit(props, 'as', 'data', 'columns', 'caption', 'sticky', 'loading', 'loadingColor', 'loadingAnimation', 'class', 'ui'),
|
||||||
|
|||||||
@@ -79,8 +79,7 @@ export type TabsSlots<T extends TabsItem = TabsItem> = {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script setup lang="ts" generic="T extends TabsItem">
|
<script setup lang="ts" generic="T extends TabsItem">
|
||||||
import type { ComponentPublicInstance } from 'vue'
|
import { computed } from 'vue'
|
||||||
import { ref, computed } from 'vue'
|
|
||||||
import { TabsRoot, TabsList, TabsIndicator, TabsTrigger, TabsContent, useForwardPropsEmits } from 'reka-ui'
|
import { TabsRoot, TabsList, TabsIndicator, TabsTrigger, TabsContent, useForwardPropsEmits } from 'reka-ui'
|
||||||
import { reactivePick } from '@vueuse/core'
|
import { reactivePick } from '@vueuse/core'
|
||||||
import { useAppConfig } from '#imports'
|
import { useAppConfig } from '#imports'
|
||||||
@@ -109,12 +108,6 @@ const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.tabs || {})
|
|||||||
size: props.size,
|
size: props.size,
|
||||||
orientation: props.orientation
|
orientation: props.orientation
|
||||||
}))
|
}))
|
||||||
|
|
||||||
const triggersRef = ref<ComponentPublicInstance[]>([])
|
|
||||||
|
|
||||||
defineExpose({
|
|
||||||
triggersRef
|
|
||||||
})
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -124,14 +117,7 @@ defineExpose({
|
|||||||
|
|
||||||
<slot name="list-leading" />
|
<slot name="list-leading" />
|
||||||
|
|
||||||
<TabsTrigger
|
<TabsTrigger v-for="(item, index) of items" :key="index" :value="item.value || String(index)" :disabled="item.disabled" :class="ui.trigger({ class: [props.ui?.trigger, item.ui?.trigger] })">
|
||||||
v-for="(item, index) of items"
|
|
||||||
:key="index"
|
|
||||||
:ref="el => (triggersRef[index] = el as ComponentPublicInstance)"
|
|
||||||
:value="item.value || String(index)"
|
|
||||||
:disabled="item.disabled"
|
|
||||||
:class="ui.trigger({ class: [props.ui?.trigger, item.ui?.trigger] })"
|
|
||||||
>
|
|
||||||
<slot name="leading" :item="item" :index="index">
|
<slot name="leading" :item="item" :index="index">
|
||||||
<UIcon v-if="item.icon" :name="item.icon" :class="ui.leadingIcon({ class: [props.ui?.leadingIcon, item.ui?.leadingIcon] })" />
|
<UIcon v-if="item.icon" :name="item.icon" :class="ui.leadingIcon({ class: [props.ui?.leadingIcon, item.ui?.leadingIcon] })" />
|
||||||
<UAvatar v-else-if="item.avatar" :size="((props.ui?.leadingAvatarSize || ui.leadingAvatarSize()) as AvatarProps['size'])" v-bind="item.avatar" :class="ui.leadingAvatar({ class: [props.ui?.leadingAvatar, item.ui?.leadingAvatar] })" />
|
<UAvatar v-else-if="item.avatar" :size="((props.ui?.leadingAvatarSize || ui.leadingAvatarSize()) as AvatarProps['size'])" v-bind="item.avatar" :class="ui.leadingAvatar({ class: [props.ui?.leadingAvatar, item.ui?.leadingAvatar] })" />
|
||||||
|
|||||||
@@ -41,7 +41,6 @@ export interface TimelineProps<T extends TimelineItem = TimelineItem> {
|
|||||||
*/
|
*/
|
||||||
orientation?: Timeline['variants']['orientation']
|
orientation?: Timeline['variants']['orientation']
|
||||||
defaultValue?: string | number
|
defaultValue?: string | number
|
||||||
reverse?: boolean
|
|
||||||
class?: any
|
class?: any
|
||||||
ui?: Timeline['slots']
|
ui?: Timeline['slots']
|
||||||
}
|
}
|
||||||
@@ -76,34 +75,16 @@ const appConfig = useAppConfig() as Timeline['AppConfig']
|
|||||||
const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.timeline || {}) })({
|
const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.timeline || {}) })({
|
||||||
orientation: props.orientation,
|
orientation: props.orientation,
|
||||||
size: props.size,
|
size: props.size,
|
||||||
color: props.color,
|
color: props.color
|
||||||
reverse: props.reverse
|
|
||||||
}))
|
}))
|
||||||
|
|
||||||
const currentStepIndex = computed(() => {
|
const currentStepIndex = computed(() => {
|
||||||
const value = modelValue.value ?? props.defaultValue
|
const value = modelValue.value ?? props.defaultValue
|
||||||
|
|
||||||
if (typeof value === 'string') {
|
return ((typeof value === 'string')
|
||||||
return props.items.findIndex(item => item.value === value) ?? -1
|
? props.items.findIndex(item => item.value === value)
|
||||||
}
|
: value) ?? -1
|
||||||
|
|
||||||
if (props.reverse) {
|
|
||||||
return value != null ? props.items.length - 1 - value : -1
|
|
||||||
} else {
|
|
||||||
return value ?? -1
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|
||||||
function getItemState(index: number): 'active' | 'completed' | undefined {
|
|
||||||
if (currentStepIndex.value === -1) return undefined
|
|
||||||
if (index === currentStepIndex.value) return 'active'
|
|
||||||
|
|
||||||
if (props.reverse) {
|
|
||||||
return index > currentStepIndex.value ? 'completed' : undefined
|
|
||||||
} else {
|
|
||||||
return index < currentStepIndex.value ? 'completed' : undefined
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -112,7 +93,7 @@ function getItemState(index: number): 'active' | 'completed' | undefined {
|
|||||||
v-for="(item, index) in items"
|
v-for="(item, index) in items"
|
||||||
:key="item.value ?? index"
|
:key="item.value ?? index"
|
||||||
:class="ui.item({ class: [props.ui?.item, item.ui?.item, item.class] })"
|
:class="ui.item({ class: [props.ui?.item, item.ui?.item, item.class] })"
|
||||||
:data-state="getItemState(index)"
|
:data-state="index < currentStepIndex ? 'completed' : index === currentStepIndex ? 'active' : undefined"
|
||||||
>
|
>
|
||||||
<div :class="ui.container({ class: [props.ui?.container, item.ui?.container] })">
|
<div :class="ui.container({ class: [props.ui?.container, item.ui?.container] })">
|
||||||
<UAvatar :size="size" :icon="item.icon" v-bind="typeof item.avatar === 'object' ? item.avatar : {}" :class="ui.indicator({ class: [props.ui?.indicator, item.ui?.indicator] })" :ui="{ icon: 'text-inherit', fallback: 'text-inherit' }">
|
<UAvatar :size="size" :icon="item.icon" v-bind="typeof item.avatar === 'object' ? item.avatar : {}" :class="ui.indicator({ class: [props.ui?.indicator, item.ui?.indicator] })" :ui="{ icon: 'text-inherit', fallback: 'text-inherit' }">
|
||||||
|
|||||||
@@ -25,8 +25,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'اكتب أمرًا أو ابحث...',
|
placeholder: 'اكتب أمرًا أو ابحث...',
|
||||||
noMatch: 'لا توجد نتائج مطابقة',
|
noMatch: 'لا توجد نتائج مطابقة',
|
||||||
noData: 'لا توجد بيانات',
|
noData: 'لا توجد بيانات',
|
||||||
close: 'إغلاق',
|
close: 'إغلاق'
|
||||||
back: 'رجوع'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'لا توجد نتائج مطابقة',
|
noMatch: 'لا توجد نتائج مطابقة',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Əmr daxil edin və ya axtarın...',
|
placeholder: 'Əmr daxil edin və ya axtarın...',
|
||||||
noMatch: 'Uyğun məlumat tapılmadı',
|
noMatch: 'Uyğun məlumat tapılmadı',
|
||||||
noData: 'Məlumat yoxdur',
|
noData: 'Məlumat yoxdur',
|
||||||
close: 'Bağla',
|
close: 'Bağla'
|
||||||
back: 'Geri'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Uyğun məlumat tapılmadı',
|
noMatch: 'Uyğun məlumat tapılmadı',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Въведете команда или потърсете...',
|
placeholder: 'Въведете команда или потърсете...',
|
||||||
noMatch: 'Няма съвпадение на данни',
|
noMatch: 'Няма съвпадение на данни',
|
||||||
noData: 'Няма данни',
|
noData: 'Няма данни',
|
||||||
close: 'Затворете',
|
close: 'Затворете'
|
||||||
back: 'Назад'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Няма съвпадение на данни',
|
noMatch: 'Няма съвпадение на данни',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'কমান্ড টাইপ করুন বা অনুসন্ধান করুন...',
|
placeholder: 'কমান্ড টাইপ করুন বা অনুসন্ধান করুন...',
|
||||||
noMatch: 'কোন মিল পাওয়া যায়নি',
|
noMatch: 'কোন মিল পাওয়া যায়নি',
|
||||||
noData: 'কোন তথ্য নেই',
|
noData: 'কোন তথ্য নেই',
|
||||||
close: 'বন্ধ করুন',
|
close: 'বন্ধ করুন'
|
||||||
back: 'পেছনে'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'কোন মিল পাওয়া যায়নি',
|
noMatch: 'কোন মিল পাওয়া যায়নি',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Escriu una ordre o cerca...',
|
placeholder: 'Escriu una ordre o cerca...',
|
||||||
noMatch: 'No hi ha dades coincidents',
|
noMatch: 'No hi ha dades coincidents',
|
||||||
noData: 'Sense dades',
|
noData: 'Sense dades',
|
||||||
close: 'Tancar',
|
close: 'Tancar'
|
||||||
back: 'Enrere'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'No hi ha dades coincidents',
|
noMatch: 'No hi ha dades coincidents',
|
||||||
|
|||||||
@@ -25,8 +25,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'فەرمانێک بنووسە یان بگەڕێ...',
|
placeholder: 'فەرمانێک بنووسە یان بگەڕێ...',
|
||||||
noMatch: 'هیچ ئەنجامێک نەدۆزرایەوە',
|
noMatch: 'هیچ ئەنجامێک نەدۆزرایەوە',
|
||||||
noData: 'هیچ داتایەک نییە',
|
noData: 'هیچ داتایەک نییە',
|
||||||
close: 'داخستن',
|
close: 'داخستن'
|
||||||
back: 'گەڕانەوە'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'هیچ ئەنجامێک نەدۆزرایەوە',
|
noMatch: 'هیچ ئەنجامێک نەدۆزرایەوە',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Zadejte příkaz nebo hledejte...',
|
placeholder: 'Zadejte příkaz nebo hledejte...',
|
||||||
noMatch: 'Žádná shoda',
|
noMatch: 'Žádná shoda',
|
||||||
noData: 'Žádná data',
|
noData: 'Žádná data',
|
||||||
close: 'Zavřít',
|
close: 'Zavřít'
|
||||||
back: 'Zpět'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Žádná shoda',
|
noMatch: 'Žádná shoda',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Skriv en kommando eller søg...',
|
placeholder: 'Skriv en kommando eller søg...',
|
||||||
noMatch: 'Ingen matchende data',
|
noMatch: 'Ingen matchende data',
|
||||||
noData: 'Ingen data',
|
noData: 'Ingen data',
|
||||||
close: 'Luk',
|
close: 'Luk'
|
||||||
back: 'Tilbage'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Ingen matchende data',
|
noMatch: 'Ingen matchende data',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Geben Sie einen Befehl ein oder suchen Sie...',
|
placeholder: 'Geben Sie einen Befehl ein oder suchen Sie...',
|
||||||
noMatch: 'Nichts gefunden',
|
noMatch: 'Nichts gefunden',
|
||||||
noData: 'Keine Daten',
|
noData: 'Keine Daten',
|
||||||
close: 'Schließen',
|
close: 'Schließen'
|
||||||
back: 'Zurück'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Nichts gefunden',
|
noMatch: 'Nichts gefunden',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Πληκτρολογήστε μια εντολή ή αναζητήστε...',
|
placeholder: 'Πληκτρολογήστε μια εντολή ή αναζητήστε...',
|
||||||
noMatch: 'Δεν βρέθηκαν δεδομένα',
|
noMatch: 'Δεν βρέθηκαν δεδομένα',
|
||||||
noData: 'Δεν υπάρχουν δεδομένα',
|
noData: 'Δεν υπάρχουν δεδομένα',
|
||||||
close: 'Κλείσιμο',
|
close: 'Κλείσιμο'
|
||||||
back: 'Πίσω'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Δεν βρέθηκαν δεδομένα',
|
noMatch: 'Δεν βρέθηκαν δεδομένα',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Type a command or search...',
|
placeholder: 'Type a command or search...',
|
||||||
noMatch: 'No matching data',
|
noMatch: 'No matching data',
|
||||||
noData: 'No data',
|
noData: 'No data',
|
||||||
close: 'Close',
|
close: 'Close'
|
||||||
back: 'Back'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'No matching data',
|
noMatch: 'No matching data',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Escribe un comando o busca...',
|
placeholder: 'Escribe un comando o busca...',
|
||||||
noMatch: 'No hay datos coincidentes',
|
noMatch: 'No hay datos coincidentes',
|
||||||
noData: 'Sin datos',
|
noData: 'Sin datos',
|
||||||
close: 'Cerrar',
|
close: 'Cerrar'
|
||||||
back: 'Atrás'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'No hay datos coincidentes',
|
noMatch: 'No hay datos coincidentes',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Sisesta käsk või otsi...',
|
placeholder: 'Sisesta käsk või otsi...',
|
||||||
noMatch: 'Pole vastavaid andmeid',
|
noMatch: 'Pole vastavaid andmeid',
|
||||||
noData: 'Pole andmeid',
|
noData: 'Pole andmeid',
|
||||||
close: 'Sulge',
|
close: 'Sulge'
|
||||||
back: 'Tagasi'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Pole vastavaid andmeid',
|
noMatch: 'Pole vastavaid andmeid',
|
||||||
|
|||||||
@@ -25,8 +25,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'یک دستور وارد کنید یا جستجو کنید...',
|
placeholder: 'یک دستور وارد کنید یا جستجو کنید...',
|
||||||
noMatch: 'دادهای یافت نشد',
|
noMatch: 'دادهای یافت نشد',
|
||||||
noData: 'دادهای موجود نیست',
|
noData: 'دادهای موجود نیست',
|
||||||
close: 'بستن',
|
close: 'بستن'
|
||||||
back: 'بازگشت'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'دادهای یافت نشد',
|
noMatch: 'دادهای یافت نشد',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Kirjoita komento tai hae...',
|
placeholder: 'Kirjoita komento tai hae...',
|
||||||
noMatch: 'Ei vastaavia tietoja',
|
noMatch: 'Ei vastaavia tietoja',
|
||||||
noData: 'Ei tietoja',
|
noData: 'Ei tietoja',
|
||||||
close: 'Sulje',
|
close: 'Sulje'
|
||||||
back: 'Takaisin'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Ei vastaavia tietoja',
|
noMatch: 'Ei vastaavia tietoja',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Tapez une commande ou recherchez...',
|
placeholder: 'Tapez une commande ou recherchez...',
|
||||||
noMatch: 'Aucune donnée correspondante',
|
noMatch: 'Aucune donnée correspondante',
|
||||||
noData: 'Aucune donnée',
|
noData: 'Aucune donnée',
|
||||||
close: 'Fermer',
|
close: 'Fermer'
|
||||||
back: 'Retour'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Aucune donnée correspondante',
|
noMatch: 'Aucune donnée correspondante',
|
||||||
|
|||||||
@@ -25,8 +25,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'הקלד פקודה...',
|
placeholder: 'הקלד פקודה...',
|
||||||
noMatch: 'לא נמצאה התאמה',
|
noMatch: 'לא נמצאה התאמה',
|
||||||
noData: 'אין נתונים זמינים',
|
noData: 'אין נתונים זמינים',
|
||||||
close: 'סגור',
|
close: 'סגור'
|
||||||
back: 'חזור'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'לא נמצאה התאמה',
|
noMatch: 'לא נמצאה התאמה',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'एक आदेश या खोज टाइप करें...',
|
placeholder: 'एक आदेश या खोज टाइप करें...',
|
||||||
noMatch: 'कोई मेल खाता डेटा नहीं',
|
noMatch: 'कोई मेल खाता डेटा नहीं',
|
||||||
noData: 'कोई डेटा नहीं',
|
noData: 'कोई डेटा नहीं',
|
||||||
close: 'बंद करें',
|
close: 'बंद करें'
|
||||||
back: 'वापस'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'कोई मेल खाता डेटा नहीं',
|
noMatch: 'कोई मेल खाता डेटा नहीं',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Írjon be egy parancsot vagy keressen...',
|
placeholder: 'Írjon be egy parancsot vagy keressen...',
|
||||||
noMatch: 'Nincs találat',
|
noMatch: 'Nincs találat',
|
||||||
noData: 'Nincs adat',
|
noData: 'Nincs adat',
|
||||||
close: 'Bezárás',
|
close: 'Bezárás'
|
||||||
back: 'Vissza'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Nincs találat',
|
noMatch: 'Nincs találat',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Մուտքագրեք հրաման կամ որոնեք...',
|
placeholder: 'Մուտքագրեք հրաման կամ որոնեք...',
|
||||||
noMatch: 'Համընկնումներ չեն գտնվել',
|
noMatch: 'Համընկնումներ չեն գտնվել',
|
||||||
noData: 'Տվյալներ չկան',
|
noData: 'Տվյալներ չկան',
|
||||||
close: 'Փակել',
|
close: 'Փակել'
|
||||||
back: 'Հետ'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Համընկնումներ չեն գտնվել',
|
noMatch: 'Համընկնումներ չեն գտնվել',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Ketik perintah atau cari...',
|
placeholder: 'Ketik perintah atau cari...',
|
||||||
noMatch: 'Tidak ada data yang cocok',
|
noMatch: 'Tidak ada data yang cocok',
|
||||||
noData: 'Tidak ada data',
|
noData: 'Tidak ada data',
|
||||||
close: 'Tutup',
|
close: 'Tutup'
|
||||||
back: 'Kembali'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Tidak ada data yang cocok',
|
noMatch: 'Tidak ada data yang cocok',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Digita un comando o cerca...',
|
placeholder: 'Digita un comando o cerca...',
|
||||||
noMatch: 'Nessun dato corrispondente',
|
noMatch: 'Nessun dato corrispondente',
|
||||||
noData: 'Nessun dato',
|
noData: 'Nessun dato',
|
||||||
close: 'Chiudi',
|
close: 'Chiudi'
|
||||||
back: 'Indietro'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Nessun dato corrispondente',
|
noMatch: 'Nessun dato corrispondente',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'コマンドを入力するか検索...',
|
placeholder: 'コマンドを入力するか検索...',
|
||||||
noMatch: '一致するデータがありません',
|
noMatch: '一致するデータがありません',
|
||||||
noData: 'データがありません',
|
noData: 'データがありません',
|
||||||
close: '閉じる',
|
close: '閉じる'
|
||||||
back: '戻る'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: '一致するデータがありません',
|
noMatch: '一致するデータがありません',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Команда енгізіңіз немесе іздеңіз...',
|
placeholder: 'Команда енгізіңіз немесе іздеңіз...',
|
||||||
noMatch: 'Сәйкес келетін деректер жоқ',
|
noMatch: 'Сәйкес келетін деректер жоқ',
|
||||||
noData: 'Деректер жоқ',
|
noData: 'Деректер жоқ',
|
||||||
close: 'Жабу',
|
close: 'Жабу'
|
||||||
back: 'Артқа'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Сәйкес келетін деректер жоқ',
|
noMatch: 'Сәйкес келетін деректер жоқ',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'វាយពាក្យបញ្ជា ឬស្វែងរក...',
|
placeholder: 'វាយពាក្យបញ្ជា ឬស្វែងរក...',
|
||||||
noMatch: 'មិនមានទិន្នន័យដែលត្រូវគ្នាទេ',
|
noMatch: 'មិនមានទិន្នន័យដែលត្រូវគ្នាទេ',
|
||||||
noData: 'មិនមានទិន្នន័យ',
|
noData: 'មិនមានទិន្នន័យ',
|
||||||
close: 'បិទ',
|
close: 'បិទ'
|
||||||
back: 'ត្រឡប់'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'មិនមានទិន្នន័យដែលត្រូវគ្នាទេ',
|
noMatch: 'មិនមានទិន្នន័យដែលត្រូវគ្នាទេ',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: '명령을 입력하거나 검색...',
|
placeholder: '명령을 입력하거나 검색...',
|
||||||
noMatch: '일치하는 데이터가 없습니다.',
|
noMatch: '일치하는 데이터가 없습니다.',
|
||||||
noData: '데이터가 없습니다.',
|
noData: '데이터가 없습니다.',
|
||||||
close: '닫기',
|
close: '닫기'
|
||||||
back: '뒤로'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: '일치하는 데이터가 없습니다.',
|
noMatch: '일치하는 데이터가 없습니다.',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Буйрук киргизиңиз же издөө…',
|
placeholder: 'Буйрук киргизиңиз же издөө…',
|
||||||
noMatch: 'Эч нерсе табылган жок',
|
noMatch: 'Эч нерсе табылган жок',
|
||||||
noData: 'Маалымат жок',
|
noData: 'Маалымат жок',
|
||||||
close: 'Жабуу',
|
close: 'Жабуу'
|
||||||
back: 'Артка'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Сүйлөшкөн маалыматтар жок',
|
noMatch: 'Сүйлөшкөн маалыматтар жок',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Tippt e Befeel oder sicht...',
|
placeholder: 'Tippt e Befeel oder sicht...',
|
||||||
noMatch: 'Keng entspriechend Donnéeën',
|
noMatch: 'Keng entspriechend Donnéeën',
|
||||||
noData: 'Keng Donnéeën',
|
noData: 'Keng Donnéeën',
|
||||||
close: 'Zoumaachen',
|
close: 'Zoumaachen'
|
||||||
back: 'Zréck'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Keng entspriechend Donnéeën',
|
noMatch: 'Keng entspriechend Donnéeën',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Įveskite komandą arba ieškokite...',
|
placeholder: 'Įveskite komandą arba ieškokite...',
|
||||||
noMatch: 'Nėra atitinkančių duomenų',
|
noMatch: 'Nėra atitinkančių duomenų',
|
||||||
noData: 'Nėra duomenų',
|
noData: 'Nėra duomenų',
|
||||||
close: 'Uždaryti',
|
close: 'Uždaryti'
|
||||||
back: 'Atgal'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Nėra atitinkančių duomenų',
|
noMatch: 'Nėra atitinkančių duomenų',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Комманд бичих эсвэл хайлт хийх...',
|
placeholder: 'Комманд бичих эсвэл хайлт хийх...',
|
||||||
noMatch: 'Тохирох мэдээлэл олдсонгүй',
|
noMatch: 'Тохирох мэдээлэл олдсонгүй',
|
||||||
noData: 'Мэдээлэл байхгүй',
|
noData: 'Мэдээлэл байхгүй',
|
||||||
close: 'Хаах',
|
close: 'Хаах'
|
||||||
back: 'Буцах'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Тохирох мэдээлэл олдсонгүй',
|
noMatch: 'Тохирох мэдээлэл олдсонгүй',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Taip arahan atau carian...',
|
placeholder: 'Taip arahan atau carian...',
|
||||||
noMatch: 'Tiada data yang sepadan',
|
noMatch: 'Tiada data yang sepadan',
|
||||||
noData: 'Tiada data',
|
noData: 'Tiada data',
|
||||||
close: 'Tutup',
|
close: 'Tutup'
|
||||||
back: 'Kembali'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Tiada data yang sepadan',
|
noMatch: 'Tiada data yang sepadan',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Skriv inn en kommando eller søk...',
|
placeholder: 'Skriv inn en kommando eller søk...',
|
||||||
noMatch: 'Ingen samsvarende data',
|
noMatch: 'Ingen samsvarende data',
|
||||||
noData: 'Ingen data',
|
noData: 'Ingen data',
|
||||||
close: 'Lukk',
|
close: 'Lukk'
|
||||||
back: 'Tilbake'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Ingen samsvarende data',
|
noMatch: 'Ingen samsvarende data',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Typ een commando of zoek...',
|
placeholder: 'Typ een commando of zoek...',
|
||||||
noMatch: 'Geen overeenkomende gegevens',
|
noMatch: 'Geen overeenkomende gegevens',
|
||||||
noData: 'Geen gegevens',
|
noData: 'Geen gegevens',
|
||||||
close: 'Sluiten',
|
close: 'Sluiten'
|
||||||
back: 'Terug'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Geen overeenkomende gegevens',
|
noMatch: 'Geen overeenkomende gegevens',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Wpisz polecenie lub wyszukaj...',
|
placeholder: 'Wpisz polecenie lub wyszukaj...',
|
||||||
noMatch: 'Brak pasujących danych',
|
noMatch: 'Brak pasujących danych',
|
||||||
noData: 'Brak danych',
|
noData: 'Brak danych',
|
||||||
close: 'Zamknij',
|
close: 'Zamknij'
|
||||||
back: 'Wstecz'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Brak pasujących danych',
|
noMatch: 'Brak pasujących danych',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Digite um comando ou pesquise...',
|
placeholder: 'Digite um comando ou pesquise...',
|
||||||
noMatch: 'Nenhum dado correspondente',
|
noMatch: 'Nenhum dado correspondente',
|
||||||
noData: 'Sem dados',
|
noData: 'Sem dados',
|
||||||
close: 'Fechar',
|
close: 'Fechar'
|
||||||
back: 'Voltar'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Nenhum dado correspondente',
|
noMatch: 'Nenhum dado correspondente',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Digite um comando ou pesquise...',
|
placeholder: 'Digite um comando ou pesquise...',
|
||||||
noMatch: 'Nenhum dado correspondente',
|
noMatch: 'Nenhum dado correspondente',
|
||||||
noData: 'Nenhum dado',
|
noData: 'Nenhum dado',
|
||||||
close: 'Fechar',
|
close: 'Fechar'
|
||||||
back: 'Voltar'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Nenhum dado correspondente',
|
noMatch: 'Nenhum dado correspondente',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Tastează o comandă sau caută...',
|
placeholder: 'Tastează o comandă sau caută...',
|
||||||
noMatch: 'Nu există date corespunzătoare',
|
noMatch: 'Nu există date corespunzătoare',
|
||||||
noData: 'Nu există date',
|
noData: 'Nu există date',
|
||||||
close: 'Închide',
|
close: 'Închide'
|
||||||
back: 'Înapoi'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Nu există date corespunzătoare',
|
noMatch: 'Nu există date corespunzătoare',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Введите команду или выполните поиск...',
|
placeholder: 'Введите команду или выполните поиск...',
|
||||||
noMatch: 'Совпадений не найдено',
|
noMatch: 'Совпадений не найдено',
|
||||||
noData: 'Нет данных',
|
noData: 'Нет данных',
|
||||||
close: 'Закрыть',
|
close: 'Закрыть'
|
||||||
back: 'Назад'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Совпадений не найдено',
|
noMatch: 'Совпадений не найдено',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Zadajte príkaz alebo vyhľadajte...',
|
placeholder: 'Zadajte príkaz alebo vyhľadajte...',
|
||||||
noMatch: 'Žiadna zhoda',
|
noMatch: 'Žiadna zhoda',
|
||||||
noData: 'Žiadne dáta',
|
noData: 'Žiadne dáta',
|
||||||
close: 'Zavrieť',
|
close: 'Zatvoriť'
|
||||||
back: 'Späť'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Žiadna zhoda',
|
noMatch: 'Žiadna zhoda',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Vpiši ukaz ali išči...',
|
placeholder: 'Vpiši ukaz ali išči...',
|
||||||
noMatch: 'Ni ujemanj',
|
noMatch: 'Ni ujemanj',
|
||||||
noData: 'Ni podatkov',
|
noData: 'Ni podatkov',
|
||||||
close: 'Zapri',
|
close: 'Zapri'
|
||||||
back: 'Nazaj'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Ni ujemanj',
|
noMatch: 'Ni ujemanj',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Skriv ett kommando eller sök...',
|
placeholder: 'Skriv ett kommando eller sök...',
|
||||||
noMatch: 'Inga matchande data',
|
noMatch: 'Inga matchande data',
|
||||||
noData: 'Inga data',
|
noData: 'Inga data',
|
||||||
close: 'Stäng',
|
close: 'Stäng'
|
||||||
back: 'Tillbaka'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Inga matchande data',
|
noMatch: 'Inga matchande data',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'พิมพ์คำสั่งหรือค้นหา...',
|
placeholder: 'พิมพ์คำสั่งหรือค้นหา...',
|
||||||
noMatch: 'ไม่พบข้อมูลที่ตรงกัน',
|
noMatch: 'ไม่พบข้อมูลที่ตรงกัน',
|
||||||
noData: 'ไม่มีข้อมูล',
|
noData: 'ไม่มีข้อมูล',
|
||||||
close: 'ปิด',
|
close: 'ปิด'
|
||||||
back: 'ย้อนกลับ'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'ไม่พบข้อมูลที่ตรงกัน',
|
noMatch: 'ไม่พบข้อมูลที่ตรงกัน',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Фармонро нависед ё ҷустуҷӯ кунед...',
|
placeholder: 'Фармонро нависед ё ҷустуҷӯ кунед...',
|
||||||
noMatch: 'Маълумоти мувофиқ ёфт нашуд',
|
noMatch: 'Маълумоти мувофиқ ёфт нашуд',
|
||||||
noData: 'Маълумот нест',
|
noData: 'Маълумот нест',
|
||||||
close: 'Бастан',
|
close: 'Бастан'
|
||||||
back: 'Бозгашт'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Маълумоти мувофиқ ёфт нашуд',
|
noMatch: 'Маълумоти мувофиқ ёфт нашуд',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Bir komut yazın veya arama yapın...',
|
placeholder: 'Bir komut yazın veya arama yapın...',
|
||||||
noMatch: 'Eşleşen veri yok',
|
noMatch: 'Eşleşen veri yok',
|
||||||
noData: 'Veri yok',
|
noData: 'Veri yok',
|
||||||
close: 'Kapat',
|
close: 'Kapat'
|
||||||
back: 'Geri'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Eşleşen veri yok',
|
noMatch: 'Eşleşen veri yok',
|
||||||
|
|||||||
@@ -25,8 +25,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'بۇيرۇق كىرگۈزۈڭ ياكى ئىزدەڭ...',
|
placeholder: 'بۇيرۇق كىرگۈزۈڭ ياكى ئىزدەڭ...',
|
||||||
noMatch: 'ماس كېلىدىغان سانلىق مەلۇمات يوق',
|
noMatch: 'ماس كېلىدىغان سانلىق مەلۇمات يوق',
|
||||||
noData: 'سانلىق مەلۇمات يوق',
|
noData: 'سانلىق مەلۇمات يوق',
|
||||||
close: 'تاقاش',
|
close: 'تاقاش'
|
||||||
back: 'قايتىش'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'ماس كېلىدىغان سانلىق مەلۇمات يوق',
|
noMatch: 'ماس كېلىدىغان سانلىق مەلۇمات يوق',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Введіть команду або шукайте...',
|
placeholder: 'Введіть команду або шукайте...',
|
||||||
noMatch: 'Збігів не знайдено',
|
noMatch: 'Збігів не знайдено',
|
||||||
noData: 'Немає даних',
|
noData: 'Немає даних',
|
||||||
close: 'Закрити',
|
close: 'Закрити'
|
||||||
back: 'Назад'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Збігів не знайдено',
|
noMatch: 'Збігів не знайдено',
|
||||||
|
|||||||
@@ -25,8 +25,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'کمانڈ ٹائپ کریں یا تلاش کریں...',
|
placeholder: 'کمانڈ ٹائپ کریں یا تلاش کریں...',
|
||||||
noMatch: 'کوئی ملتا جلتا ڈیٹا نہیں ملا',
|
noMatch: 'کوئی ملتا جلتا ڈیٹا نہیں ملا',
|
||||||
noData: 'کوئی ڈیٹا نہیں',
|
noData: 'کوئی ڈیٹا نہیں',
|
||||||
close: 'بند کریں',
|
close: 'بند کریں'
|
||||||
back: 'واپس'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'کوئی ملتا جلتا ڈیٹا نہیں ملا',
|
noMatch: 'کوئی ملتا جلتا ڈیٹا نہیں ملا',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Buyruq kiriting yoki qidiring...',
|
placeholder: 'Buyruq kiriting yoki qidiring...',
|
||||||
noMatch: 'Mos keluvchi natija topilmadi',
|
noMatch: 'Mos keluvchi natija topilmadi',
|
||||||
noData: 'Maʼlumot yoʻq',
|
noData: 'Maʼlumot yoʻq',
|
||||||
close: 'Yopish',
|
close: 'Yopish'
|
||||||
back: 'Orqaga'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Mos keluvchi natija topilmadi',
|
noMatch: 'Mos keluvchi natija topilmadi',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: 'Nhập lệnh hoặc tìm kiếm...',
|
placeholder: 'Nhập lệnh hoặc tìm kiếm...',
|
||||||
noMatch: 'Không có kết quả phù hợp',
|
noMatch: 'Không có kết quả phù hợp',
|
||||||
noData: 'Không có dữ liệu',
|
noData: 'Không có dữ liệu',
|
||||||
close: 'Đóng',
|
close: 'Đóng'
|
||||||
back: 'Quay lại'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: 'Không có kết quả phù hợp',
|
noMatch: 'Không có kết quả phù hợp',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: '输入命令或搜索...',
|
placeholder: '输入命令或搜索...',
|
||||||
noMatch: '没有匹配的数据',
|
noMatch: '没有匹配的数据',
|
||||||
noData: '没有数据',
|
noData: '没有数据',
|
||||||
close: '关闭',
|
close: '关闭'
|
||||||
back: '返回'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: '没有匹配的数据',
|
noMatch: '没有匹配的数据',
|
||||||
|
|||||||
@@ -24,8 +24,7 @@ export default defineLocale<Messages>({
|
|||||||
placeholder: '輸入命令或搜尋...',
|
placeholder: '輸入命令或搜尋...',
|
||||||
noMatch: '沒有相符的資料',
|
noMatch: '沒有相符的資料',
|
||||||
noData: '沒有資料',
|
noData: '沒有資料',
|
||||||
close: '關閉',
|
close: '關閉'
|
||||||
back: '返回'
|
|
||||||
},
|
},
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: '沒有相符的資料',
|
noMatch: '沒有相符的資料',
|
||||||
|
|||||||
@@ -19,7 +19,6 @@ export type Messages = {
|
|||||||
noMatch: string
|
noMatch: string
|
||||||
noData: string
|
noData: string
|
||||||
close: string
|
close: string
|
||||||
back: string
|
|
||||||
}
|
}
|
||||||
selectMenu: {
|
selectMenu: {
|
||||||
noMatch: string
|
noMatch: string
|
||||||
|
|||||||
@@ -5,7 +5,6 @@ export default (options: Required<ModuleOptions>) => ({
|
|||||||
root: 'flex flex-col min-h-0 min-w-0 divide-y divide-default',
|
root: 'flex flex-col min-h-0 min-w-0 divide-y divide-default',
|
||||||
input: '[&>input]:h-12',
|
input: '[&>input]:h-12',
|
||||||
close: '',
|
close: '',
|
||||||
back: 'p-0',
|
|
||||||
content: 'relative overflow-hidden flex flex-col',
|
content: 'relative overflow-hidden flex flex-col',
|
||||||
viewport: 'relative divide-y divide-default scroll-py-1 overflow-y-auto flex-1 focus:outline-none',
|
viewport: 'relative divide-y divide-default scroll-py-1 overflow-y-auto flex-1 focus:outline-none',
|
||||||
group: 'p-1 isolate',
|
group: 'p-1 isolate',
|
||||||
|
|||||||
@@ -29,11 +29,12 @@ export default (options: Required<ModuleOptions>) => ({
|
|||||||
|
|
||||||
color: {
|
color: {
|
||||||
...Object.fromEntries((options.theme.colors || []).map((color: string) => [color, {
|
...Object.fromEntries((options.theme.colors || []).map((color: string) => [color, {
|
||||||
indicator: `group-data-[state=completed]:bg-${color} group-data-[state=active]:bg-${color}`
|
indicator: `group-data-[state=completed]:bg-${color} group-data-[state=active]:bg-${color}`,
|
||||||
|
separator: `group-data-[state=completed]:bg-${color}`
|
||||||
}])),
|
}])),
|
||||||
neutral: {
|
neutral: {
|
||||||
indicator: 'group-data-[state=completed]:bg-inverted group-data-[state=active]:bg-inverted'
|
indicator: 'group-data-[state=completed]:bg-inverted group-data-[state=active]:bg-inverted',
|
||||||
|
separator: 'group-data-[state=completed]:bg-inverted'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -47,38 +48,10 @@ export default (options: Required<ModuleOptions>) => ({
|
|||||||
'xl': '',
|
'xl': '',
|
||||||
'2xl': '',
|
'2xl': '',
|
||||||
'3xl': ''
|
'3xl': ''
|
||||||
},
|
|
||||||
|
|
||||||
reverse: {
|
|
||||||
true: ''
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
compoundVariants: [...(options.theme.colors || []).map((color: string) => ({
|
compoundVariants: [{
|
||||||
color,
|
|
||||||
reverse: false,
|
|
||||||
class: {
|
|
||||||
separator: `group-data-[state=completed]:bg-${color}`
|
|
||||||
}
|
|
||||||
})), ...(options.theme.colors || []).map((color: string) => ({
|
|
||||||
color,
|
|
||||||
reverse: true,
|
|
||||||
class: {
|
|
||||||
separator: `group-data-[state=active]:bg-${color} group-data-[state=completed]:bg-${color}`
|
|
||||||
}
|
|
||||||
})), {
|
|
||||||
color: 'neutral',
|
|
||||||
reverse: false,
|
|
||||||
class: {
|
|
||||||
separator: 'group-data-[state=completed]:bg-inverted'
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
color: 'neutral',
|
|
||||||
reverse: true,
|
|
||||||
class: {
|
|
||||||
separator: 'group-data-[state=active]:bg-inverted group-data-[state=completed]:bg-inverted'
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
orientation: 'horizontal',
|
orientation: 'horizontal',
|
||||||
size: '3xs',
|
size: '3xs',
|
||||||
class: {
|
class: {
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { describe, it, expect } from 'vitest'
|
import { describe, it, expect } from 'vitest'
|
||||||
import CommandPalette, { type CommandPaletteProps, type CommandPaletteSlots } from '../../src/runtime/components/CommandPalette.vue'
|
import CommandPalette, { type CommandPaletteProps } from '../../src/runtime/components/CommandPalette.vue'
|
||||||
import ComponentRender from '../component-render'
|
import ComponentRender from '../component-render'
|
||||||
|
|
||||||
describe('CommandPalette', () => {
|
describe('CommandPalette', () => {
|
||||||
@@ -89,7 +89,7 @@ describe('CommandPalette', () => {
|
|||||||
['with item-trailing slot', { props, slots: { 'item-trailing': () => 'Item trailing slot' } }],
|
['with item-trailing slot', { props, slots: { 'item-trailing': () => 'Item trailing slot' } }],
|
||||||
['with custom slot', { props, slots: { custom: () => 'Custom slot' } }],
|
['with custom slot', { props, slots: { custom: () => 'Custom slot' } }],
|
||||||
['with close slot', { props: { ...props, close: true }, slots: { close: () => 'Close slot' } }]
|
['with close slot', { props: { ...props, close: true }, slots: { close: () => 'Close slot' } }]
|
||||||
])('renders %s correctly', async (nameOrHtml: string, options: { props?: CommandPaletteProps, slots?: Partial<CommandPaletteSlots> }) => {
|
])('renders %s correctly', async (nameOrHtml: string, options: { props?: CommandPaletteProps<typeof groups[number], typeof groups[number]['items'][number]>, slots?: Partial<any> }) => {
|
||||||
const html = await ComponentRender(nameOrHtml, options, CommandPalette)
|
const html = await ComponentRender(nameOrHtml, options, CommandPalette)
|
||||||
expect(html).toMatchSnapshot()
|
expect(html).toMatchSnapshot()
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -68,10 +68,6 @@ describe('FormField', () => {
|
|||||||
['with required', { props: { label: 'Username', required: true } }],
|
['with required', { props: { label: 'Username', required: true } }],
|
||||||
['with help', { props: { help: 'Username must be unique' } }],
|
['with help', { props: { help: 'Username must be unique' } }],
|
||||||
['with error', { props: { error: 'Username is already taken' } }],
|
['with error', { props: { error: 'Username is already taken' } }],
|
||||||
['with multiple errors', { props: { errors: ['Username is already taken', 'This should not be visible'] } }],
|
|
||||||
['with maxErrors', { props: { maxErrors: 2, errors: ['Username is already taken', 'This should be visible'] } }],
|
|
||||||
['with maxErrors negative', { props: { maxErrors: -1, errors: ['Username is already taken', 'This should be visible', 'This should be visible'] } }],
|
|
||||||
['with maxErrors false', { props: { maxErrors: false, errors: ['Username is already taken', 'This should be visible', 'This should be visible'] } }],
|
|
||||||
['with hint', { props: { hint: 'Use letters, numbers, and special characters' } }],
|
['with hint', { props: { hint: 'Use letters, numbers, and special characters' } }],
|
||||||
...sizes.map((size: string) => [`with size ${size}`, { props: { label: 'Username', description: 'Enter your username', size } }]),
|
...sizes.map((size: string) => [`with size ${size}`, { props: { label: 'Username', description: 'Enter your username', size } }]),
|
||||||
['with as', { props: { as: 'section' } }],
|
['with as', { props: { as: 'section' } }],
|
||||||
|
|||||||
@@ -162,7 +162,7 @@ describe('Table', () => {
|
|||||||
['with empty slot', { props: { columns }, slots: { empty: () => 'Empty slot' } }],
|
['with empty slot', { props: { columns }, slots: { empty: () => 'Empty slot' } }],
|
||||||
['with loading slot', { props: { columns, loading: true }, slots: { loading: () => 'Loading slot' } }],
|
['with loading slot', { props: { columns, loading: true }, slots: { loading: () => 'Loading slot' } }],
|
||||||
['with caption slot', { props, slots: { caption: () => 'Caption slot' } }]
|
['with caption slot', { props, slots: { caption: () => 'Caption slot' } }]
|
||||||
])('renders %s correctly', async (nameOrHtml: string, options: { props?: TableProps, slots?: Partial<TableSlots> }) => {
|
])('renders %s correctly', async (nameOrHtml: string, options: { props?: TableProps<typeof data[number]>, slots?: Partial<TableSlots<typeof data[number]>> }) => {
|
||||||
const html = await ComponentRender(nameOrHtml, options, Table)
|
const html = await ComponentRender(nameOrHtml, options, Table)
|
||||||
expect(html).toMatchSnapshot()
|
expect(html).toMatchSnapshot()
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -29,7 +29,7 @@ describe('Timeline', () => {
|
|||||||
title: 'Testing & Deployment',
|
title: 'Testing & Deployment',
|
||||||
description: 'QA testing and performance optimization. Deployed the application to production.',
|
description: 'QA testing and performance optimization. Deployed the application to production.',
|
||||||
icon: 'i-lucide-check-circle',
|
icon: 'i-lucide-check-circle',
|
||||||
value: 'testing-and-deployment'
|
value: 'deployment'
|
||||||
}]
|
}]
|
||||||
|
|
||||||
const props = { items }
|
const props = { items }
|
||||||
@@ -37,17 +37,14 @@ describe('Timeline', () => {
|
|||||||
it.each([
|
it.each([
|
||||||
// Props
|
// Props
|
||||||
['with items', { props }],
|
['with items', { props }],
|
||||||
['with modelValue', { props: { ...props, modelValue: 'design' } }],
|
['with modelValue', { props: { ...props, modelValue: 'assigned' } }],
|
||||||
['with defaultValue', { props: { ...props, defaultValue: 'design' } }],
|
['with defaultValue', { props: { ...props, defaultValue: 'assigned' } }],
|
||||||
['with neutral color', { props: { ...props, color: 'neutral' } }],
|
['with neutral color', { props: { ...props, color: 'neutral' } }],
|
||||||
...sizes.map((size: string) => [`with size ${size} horizontal`, { props: { ...props, size } }]),
|
...sizes.map((size: string) => [`with size ${size} horizontal`, { props: { ...props, size } }]),
|
||||||
...sizes.map((size: string) => [`with size ${size} vertical`, { props: { ...props, size, orientation: 'vertical' } }]),
|
...sizes.map((size: string) => [`with size ${size} vertical`, { props: { ...props, size, orientation: 'vertical' } }]),
|
||||||
['with as', { props: { ...props, as: 'section' } }],
|
['with as', { props: { ...props, as: 'section' } }],
|
||||||
['with class', { props: { ...props, class: 'gap-8' } }],
|
['with class', { props: { ...props, class: 'gap-8' } }],
|
||||||
['with ui', { props: { ...props, ui: { title: 'font-bold' } } }],
|
['with ui', { props: { ...props, ui: { title: 'font-bold' } } }],
|
||||||
['with reverse', { props: { ...props, reverse: true } }],
|
|
||||||
['with reverse and modelValue', { props: { ...props, reverse: true, modelValue: 'design' } }],
|
|
||||||
['with reverse and defaultValue', { props: { ...props, reverse: true, defaultValue: 'design' } }],
|
|
||||||
// Slots
|
// Slots
|
||||||
['with indicator slot', { props, slots: { indicator: () => 'Indicator slot' } }],
|
['with indicator slot', { props, slots: { indicator: () => 'Indicator slot' } }],
|
||||||
['with date slot', { props, slots: { date: () => 'Date slot' } }],
|
['with date slot', { props, slots: { date: () => 'Date slot' } }],
|
||||||
|
|||||||
@@ -148,59 +148,6 @@ exports[`FormField > renders with label slot correctly 1`] = `
|
|||||||
</div>"
|
</div>"
|
||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`FormField > renders with maxErrors correctly 1`] = `
|
|
||||||
"<div class="text-sm">
|
|
||||||
<div class="">
|
|
||||||
<!--v-if-->
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="">
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`FormField > renders with maxErrors false correctly 1`] = `
|
|
||||||
"<div class="text-sm">
|
|
||||||
<div class="">
|
|
||||||
<!--v-if-->
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="">
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`FormField > renders with maxErrors negative correctly 1`] = `
|
|
||||||
"<div class="text-sm">
|
|
||||||
<div class="">
|
|
||||||
<!--v-if-->
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="">
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`FormField > renders with multiple errors correctly 1`] = `
|
|
||||||
"<div class="text-sm">
|
|
||||||
<div class="">
|
|
||||||
<!--v-if-->
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="">
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`FormField > renders with required correctly 1`] = `
|
exports[`FormField > renders with required correctly 1`] = `
|
||||||
"<div class="text-sm">
|
"<div class="text-sm">
|
||||||
<div class="">
|
<div class="">
|
||||||
|
|||||||
@@ -148,59 +148,6 @@ exports[`FormField > renders with label slot correctly 1`] = `
|
|||||||
</div>"
|
</div>"
|
||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`FormField > renders with maxErrors correctly 1`] = `
|
|
||||||
"<div class="text-sm">
|
|
||||||
<div class="">
|
|
||||||
<!--v-if-->
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="">
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`FormField > renders with maxErrors false correctly 1`] = `
|
|
||||||
"<div class="text-sm">
|
|
||||||
<div class="">
|
|
||||||
<!--v-if-->
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="">
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`FormField > renders with maxErrors negative correctly 1`] = `
|
|
||||||
"<div class="text-sm">
|
|
||||||
<div class="">
|
|
||||||
<!--v-if-->
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="">
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`FormField > renders with multiple errors correctly 1`] = `
|
|
||||||
"<div class="text-sm">
|
|
||||||
<div class="">
|
|
||||||
<!--v-if-->
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="">
|
|
||||||
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`FormField > renders with required correctly 1`] = `
|
exports[`FormField > renders with required correctly 1`] = `
|
||||||
"<div class="text-sm">
|
"<div class="text-sm">
|
||||||
<div class="">
|
<div class="">
|
||||||
|
|||||||
@@ -137,7 +137,7 @@ exports[`Timeline > renders with date slot correctly 1`] = `
|
|||||||
|
|
||||||
exports[`Timeline > renders with defaultValue correctly 1`] = `
|
exports[`Timeline > renders with defaultValue correctly 1`] = `
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
<div class="group relative flex flex-1 gap-3">
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -147,7 +147,7 @@ exports[`Timeline > renders with defaultValue correctly 1`] = `
|
|||||||
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="active">
|
<div class="group relative flex flex-1 gap-3">
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -317,7 +317,7 @@ exports[`Timeline > renders with items correctly 1`] = `
|
|||||||
|
|
||||||
exports[`Timeline > renders with modelValue correctly 1`] = `
|
exports[`Timeline > renders with modelValue correctly 1`] = `
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
<div class="group relative flex flex-1 gap-3">
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -327,7 +327,7 @@ exports[`Timeline > renders with modelValue correctly 1`] = `
|
|||||||
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="active">
|
<div class="group relative flex flex-1 gap-3">
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -405,141 +405,6 @@ exports[`Timeline > renders with neutral color correctly 1`] = `
|
|||||||
</div>"
|
</div>"
|
||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`Timeline > renders with reverse and defaultValue correctly 1`] = `
|
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="active">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`Timeline > renders with reverse and modelValue correctly 1`] = `
|
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="active">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`Timeline > renders with reverse correctly 1`] = `
|
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`Timeline > renders with size 2xl horizontal correctly 1`] = `
|
exports[`Timeline > renders with size 2xl horizontal correctly 1`] = `
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
||||||
<div class="group relative flex flex-1 gap-3">
|
<div class="group relative flex flex-1 gap-3">
|
||||||
|
|||||||
@@ -137,7 +137,7 @@ exports[`Timeline > renders with date slot correctly 1`] = `
|
|||||||
|
|
||||||
exports[`Timeline > renders with defaultValue correctly 1`] = `
|
exports[`Timeline > renders with defaultValue correctly 1`] = `
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
<div class="group relative flex flex-1 gap-3">
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:rocket shrink-0 text-inherit" aria-hidden="true"></span></span>
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:rocket shrink-0 text-inherit" aria-hidden="true"></span></span>
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -147,7 +147,7 @@ exports[`Timeline > renders with defaultValue correctly 1`] = `
|
|||||||
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="active">
|
<div class="group relative flex flex-1 gap-3">
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:palette shrink-0 text-inherit" aria-hidden="true"></span></span>
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:palette shrink-0 text-inherit" aria-hidden="true"></span></span>
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -317,7 +317,7 @@ exports[`Timeline > renders with items correctly 1`] = `
|
|||||||
|
|
||||||
exports[`Timeline > renders with modelValue correctly 1`] = `
|
exports[`Timeline > renders with modelValue correctly 1`] = `
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
<div class="group relative flex flex-1 gap-3">
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:rocket shrink-0 text-inherit" aria-hidden="true"></span></span>
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:rocket shrink-0 text-inherit" aria-hidden="true"></span></span>
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -327,7 +327,7 @@ exports[`Timeline > renders with modelValue correctly 1`] = `
|
|||||||
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="active">
|
<div class="group relative flex flex-1 gap-3">
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:palette shrink-0 text-inherit" aria-hidden="true"></span></span>
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:palette shrink-0 text-inherit" aria-hidden="true"></span></span>
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -405,141 +405,6 @@ exports[`Timeline > renders with neutral color correctly 1`] = `
|
|||||||
</div>"
|
</div>"
|
||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`Timeline > renders with reverse and defaultValue correctly 1`] = `
|
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:rocket shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="active">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:palette shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:code shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:check-circle shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`Timeline > renders with reverse and modelValue correctly 1`] = `
|
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:rocket shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="active">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:palette shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:code shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3" data-state="completed">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:check-circle shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`Timeline > renders with reverse correctly 1`] = `
|
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:rocket shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:palette shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:code shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=active]:bg-primary group-data-[state=completed]:bg-primary"></div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="group relative flex flex-1 gap-3">
|
|
||||||
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><span class="iconify i-lucide:check-circle shrink-0 text-inherit" aria-hidden="true"></span></span>
|
|
||||||
<!--v-if-->
|
|
||||||
</div>
|
|
||||||
<div class="w-full mt-1.5 pb-6.5">
|
|
||||||
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
||||||
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
||||||
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>"
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`Timeline > renders with size 2xl horizontal correctly 1`] = `
|
exports[`Timeline > renders with size 2xl horizontal correctly 1`] = `
|
||||||
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
||||||
<div class="group relative flex flex-1 gap-3">
|
<div class="group relative flex flex-1 gap-3">
|
||||||
|
|||||||
Reference in New Issue
Block a user