@una-ui/nuxt 0.47.2 → 0.48.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/module.json +1 -1
- package/dist/module.mjs +1 -1
- package/dist/runtime/components/elements/Button.vue +2 -0
- package/dist/runtime/components/navigation-menu/NavigationMenu.vue +128 -0
- package/dist/runtime/components/navigation-menu/NavigationMenuContent.vue +31 -0
- package/dist/runtime/components/navigation-menu/NavigationMenuContentItem.vue +49 -0
- package/dist/runtime/components/navigation-menu/NavigationMenuIndicator.vue +29 -0
- package/dist/runtime/components/navigation-menu/NavigationMenuItem.vue +12 -0
- package/dist/runtime/components/navigation-menu/NavigationMenuLink.vue +41 -0
- package/dist/runtime/components/navigation-menu/NavigationMenuList.vue +33 -0
- package/dist/runtime/components/navigation-menu/NavigationMenuTrigger.vue +49 -0
- package/dist/runtime/components/navigation-menu/NavigationMenuViewport.vue +39 -0
- package/dist/runtime/plugins/theme.client.d.ts +1 -1
- package/dist/runtime/plugins/theme.server.d.ts +1 -1
- package/dist/runtime/types/button.d.ts +2 -0
- package/dist/runtime/types/index.d.ts +1 -0
- package/dist/runtime/types/index.js +1 -0
- package/dist/runtime/types/navigation-menu.d.ts +136 -0
- package/dist/runtime/types/navigation-menu.js +0 -0
- package/package.json +4 -4
package/dist/module.json
CHANGED
package/dist/module.mjs
CHANGED
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
<script setup lang="ts" generic="T extends U[], U extends NNavigationMenuItemProps">
|
|
2
|
+
import type { NavigationMenuRootEmits } from 'reka-ui'
|
|
3
|
+
import type { NNavigationMenuItemProps, NNavigationMenuProps } from '../../types'
|
|
4
|
+
import { createReusableTemplate, reactiveOmit } from '@vueuse/core'
|
|
5
|
+
import { NavigationMenuRoot, useForwardPropsEmits } from 'reka-ui'
|
|
6
|
+
import { cn, omitProps } from '../../utils'
|
|
7
|
+
import NavigationMenuContent from './NavigationMenuContent.vue'
|
|
8
|
+
import NavigationMenuContentItem from './NavigationMenuContentItem.vue'
|
|
9
|
+
import NavigationMenuIndicator from './NavigationMenuIndicator.vue'
|
|
10
|
+
import NavigationMenuItem from './NavigationMenuItem.vue'
|
|
11
|
+
import NavigationMenuLink from './NavigationMenuLink.vue'
|
|
12
|
+
import NavigationMenuList from './NavigationMenuList.vue'
|
|
13
|
+
import NavigationMenuTrigger from './NavigationMenuTrigger.vue'
|
|
14
|
+
import NavigationMenuViewport from './NavigationMenuViewport.vue'
|
|
15
|
+
|
|
16
|
+
defineOptions({
|
|
17
|
+
inheritAttrs: false,
|
|
18
|
+
})
|
|
19
|
+
|
|
20
|
+
const props = withDefaults(defineProps<NNavigationMenuProps<T>>(), {
|
|
21
|
+
orientation: 'horizontal',
|
|
22
|
+
unmountOnHide: true,
|
|
23
|
+
})
|
|
24
|
+
const emits = defineEmits<NavigationMenuRootEmits>()
|
|
25
|
+
|
|
26
|
+
const rootProps = reactiveOmit(props, ['navigationMenu', 'navigationMenuLink', 'una', 'items'])
|
|
27
|
+
const forwarded = useForwardPropsEmits(rootProps, emits)
|
|
28
|
+
|
|
29
|
+
const [DefineLinkTemplate, ReuseLinkTemplate] = createReusableTemplate()
|
|
30
|
+
</script>
|
|
31
|
+
|
|
32
|
+
<template>
|
|
33
|
+
<NavigationMenuRoot
|
|
34
|
+
v-slot="{ modelValue }"
|
|
35
|
+
v-bind="forwarded"
|
|
36
|
+
:class="cn(
|
|
37
|
+
'navigation-menu',
|
|
38
|
+
props.una?.navigationMenu,
|
|
39
|
+
props.class,
|
|
40
|
+
)"
|
|
41
|
+
>
|
|
42
|
+
<slot :items="items">
|
|
43
|
+
<DefineLinkTemplate v-slot="{ link, isList }">
|
|
44
|
+
<component
|
|
45
|
+
:is="isList ? NavigationMenuContentItem : NavigationMenuLink"
|
|
46
|
+
:size
|
|
47
|
+
:una
|
|
48
|
+
:disabled="link.disabled"
|
|
49
|
+
v-bind="{ ...link, ...props._navigationMenuLink }"
|
|
50
|
+
/>
|
|
51
|
+
</DefineLinkTemplate>
|
|
52
|
+
|
|
53
|
+
<NavigationMenuList
|
|
54
|
+
v-bind="props._navigationMenuList"
|
|
55
|
+
:una
|
|
56
|
+
:orientation
|
|
57
|
+
>
|
|
58
|
+
<slot name="list" :items="items">
|
|
59
|
+
<template
|
|
60
|
+
v-for="item, idx in items"
|
|
61
|
+
:key="item"
|
|
62
|
+
>
|
|
63
|
+
<NavigationMenuItem
|
|
64
|
+
v-if="item.items && item.items?.length > 0"
|
|
65
|
+
v-bind="props._navigationMenuItem"
|
|
66
|
+
:value="item.value"
|
|
67
|
+
:una
|
|
68
|
+
>
|
|
69
|
+
<slot :name="item.slot || 'item'" :item="item" :active="item.active">
|
|
70
|
+
<NavigationMenuTrigger
|
|
71
|
+
:size
|
|
72
|
+
:una
|
|
73
|
+
:navigation-menu="item?._navigationMenuTrigger?.navigationMenu ?? item.navigationMenu ?? navigationMenu"
|
|
74
|
+
:disabled="item?._navigationMenuTrigger?.disabled ?? item.disabled ?? disabled"
|
|
75
|
+
v-bind="{ ...omitProps(item, ['items']), ...props._navigationMenuTrigger, ...item?._navigationMenuTrigger }"
|
|
76
|
+
>
|
|
77
|
+
<slot name="trigger" :model-value :item="item" :index="idx" />
|
|
78
|
+
</NavigationMenuTrigger>
|
|
79
|
+
|
|
80
|
+
<NavigationMenuContent
|
|
81
|
+
v-bind="props._navigationMenuContent"
|
|
82
|
+
:una
|
|
83
|
+
>
|
|
84
|
+
<slot :name="item.slot ? `${item.slot}-content` : 'item-content'" :items="item.items" :item="item">
|
|
85
|
+
<ul class="navigation-menu-content-list">
|
|
86
|
+
<ReuseLinkTemplate
|
|
87
|
+
v-for="(child, childIndex) in item.items"
|
|
88
|
+
:key="childIndex"
|
|
89
|
+
:link="child"
|
|
90
|
+
:is-list="true"
|
|
91
|
+
:navigation-menu-link
|
|
92
|
+
/>
|
|
93
|
+
</ul>
|
|
94
|
+
</slot>
|
|
95
|
+
</NavigationMenuContent>
|
|
96
|
+
</slot>
|
|
97
|
+
</NavigationMenuItem>
|
|
98
|
+
<NavigationMenuItem
|
|
99
|
+
v-else
|
|
100
|
+
v-bind="props._navigationMenuItem"
|
|
101
|
+
:value="item.value"
|
|
102
|
+
:una
|
|
103
|
+
>
|
|
104
|
+
<slot :name="item.slot || 'item'" :item="item">
|
|
105
|
+
<ReuseLinkTemplate
|
|
106
|
+
:link="item"
|
|
107
|
+
:is-list="false"
|
|
108
|
+
:navigation-menu="item.navigationMenu ?? navigationMenu"
|
|
109
|
+
/>
|
|
110
|
+
</slot>
|
|
111
|
+
</NavigationMenuItem>
|
|
112
|
+
</template>
|
|
113
|
+
</slot>
|
|
114
|
+
<NavigationMenuIndicator
|
|
115
|
+
v-if="indicator"
|
|
116
|
+
:una
|
|
117
|
+
/>
|
|
118
|
+
</NavigationMenuList>
|
|
119
|
+
</slot>
|
|
120
|
+
|
|
121
|
+
<slot name="viewport">
|
|
122
|
+
<NavigationMenuViewport
|
|
123
|
+
v-bind="props._navigationMenuViewport"
|
|
124
|
+
:orientation="props.orientation"
|
|
125
|
+
/>
|
|
126
|
+
</slot>
|
|
127
|
+
</NavigationMenuRoot>
|
|
128
|
+
</template>
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import type { NavigationMenuContentEmits } from 'reka-ui'
|
|
3
|
+
import type { NNavigationMenuContentProps } from '../../types'
|
|
4
|
+
import { reactiveOmit } from '@vueuse/core'
|
|
5
|
+
import {
|
|
6
|
+
NavigationMenuContent,
|
|
7
|
+
useForwardPropsEmits,
|
|
8
|
+
} from 'reka-ui'
|
|
9
|
+
import { cn } from '../../utils'
|
|
10
|
+
|
|
11
|
+
const props = defineProps<NNavigationMenuContentProps>()
|
|
12
|
+
const emits = defineEmits<NavigationMenuContentEmits>()
|
|
13
|
+
|
|
14
|
+
const delegatedProps = reactiveOmit(props, 'class')
|
|
15
|
+
|
|
16
|
+
const forwarded = useForwardPropsEmits(delegatedProps, emits)
|
|
17
|
+
</script>
|
|
18
|
+
|
|
19
|
+
<template>
|
|
20
|
+
<NavigationMenuContent
|
|
21
|
+
v-bind="forwarded"
|
|
22
|
+
:class="cn(
|
|
23
|
+
'navigation-menu-content',
|
|
24
|
+
'data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52',
|
|
25
|
+
props.una?.navigationMenuContent,
|
|
26
|
+
props.class,
|
|
27
|
+
)"
|
|
28
|
+
>
|
|
29
|
+
<slot />
|
|
30
|
+
</NavigationMenuContent>
|
|
31
|
+
</template>
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import type { NavigationMenuLinkEmits } from 'reka-ui'
|
|
3
|
+
import type { NNavigationMenuListItemProps } from '../../types'
|
|
4
|
+
import { useForwardPropsEmits } from 'reka-ui'
|
|
5
|
+
import { cn } from '../../utils'
|
|
6
|
+
import NavigationMenuLink from './NavigationMenuLink.vue'
|
|
7
|
+
|
|
8
|
+
const props = defineProps<NNavigationMenuListItemProps>()
|
|
9
|
+
const emits = defineEmits<NavigationMenuLinkEmits>()
|
|
10
|
+
|
|
11
|
+
const forwarded = useForwardPropsEmits(props, emits)
|
|
12
|
+
</script>
|
|
13
|
+
|
|
14
|
+
<template>
|
|
15
|
+
<NavigationMenuLink
|
|
16
|
+
v-bind="forwarded"
|
|
17
|
+
:class="cn(
|
|
18
|
+
'navigation-menu-content-item',
|
|
19
|
+
props.una?.navigationMenuContentItem,
|
|
20
|
+
props.class,
|
|
21
|
+
)"
|
|
22
|
+
>
|
|
23
|
+
<slot>
|
|
24
|
+
<div
|
|
25
|
+
:class="cn(
|
|
26
|
+
'navigation-menu-content-item-wrapper',
|
|
27
|
+
props.una?.navigationMenuContentItemWrapper,
|
|
28
|
+
)"
|
|
29
|
+
>
|
|
30
|
+
<p
|
|
31
|
+
:class="cn(
|
|
32
|
+
'navigation-menu-content-item-label',
|
|
33
|
+
props.una?.navigationMenuContentItemLabel,
|
|
34
|
+
)"
|
|
35
|
+
>
|
|
36
|
+
{{ label }}
|
|
37
|
+
</p>
|
|
38
|
+
<p
|
|
39
|
+
v-if="description" :class="cn(
|
|
40
|
+
'navigation-menu-content-item-description',
|
|
41
|
+
props.una?.navigationMenuContentItemDescription,
|
|
42
|
+
)"
|
|
43
|
+
>
|
|
44
|
+
{{ description }}
|
|
45
|
+
</p>
|
|
46
|
+
</div>
|
|
47
|
+
</slot>
|
|
48
|
+
</NavigationMenuLink>
|
|
49
|
+
</template>
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import type { NNavigationMenuIndicatorProps } from '../../types'
|
|
3
|
+
import { reactiveOmit } from '@vueuse/core'
|
|
4
|
+
import { NavigationMenuIndicator, useForwardProps } from 'reka-ui'
|
|
5
|
+
import { cn } from '../../utils'
|
|
6
|
+
|
|
7
|
+
const props = defineProps<NNavigationMenuIndicatorProps>()
|
|
8
|
+
|
|
9
|
+
const delegatedProps = reactiveOmit(props, 'class')
|
|
10
|
+
|
|
11
|
+
const forwardedProps = useForwardProps(delegatedProps)
|
|
12
|
+
</script>
|
|
13
|
+
|
|
14
|
+
<template>
|
|
15
|
+
<NavigationMenuIndicator
|
|
16
|
+
v-bind="forwardedProps"
|
|
17
|
+
:class="cn(
|
|
18
|
+
'navigation-menu-indicator',
|
|
19
|
+
props.una?.navigationMenuIndicator,
|
|
20
|
+
props.class,
|
|
21
|
+
)"
|
|
22
|
+
>
|
|
23
|
+
<slot />
|
|
24
|
+
<div
|
|
25
|
+
class="navigation-menu-indicator-arrow"
|
|
26
|
+
:class="props.una?.navigationMenuIndicatorArrow"
|
|
27
|
+
/>
|
|
28
|
+
</NavigationMenuIndicator>
|
|
29
|
+
</template>
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import type { NNavigationMenuItemProps } from '../../types'
|
|
3
|
+
import { NavigationMenuItem } from 'reka-ui'
|
|
4
|
+
|
|
5
|
+
const props = defineProps<NNavigationMenuItemProps>()
|
|
6
|
+
</script>
|
|
7
|
+
|
|
8
|
+
<template>
|
|
9
|
+
<NavigationMenuItem v-bind="props">
|
|
10
|
+
<slot />
|
|
11
|
+
</NavigationMenuItem>
|
|
12
|
+
</template>
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import type { NavigationMenuLinkEmits } from 'reka-ui'
|
|
3
|
+
import type { NNavigationMenuLinkProps } from '../../types'
|
|
4
|
+
import { NavigationMenuLink, useForwardPropsEmits } from 'reka-ui'
|
|
5
|
+
import { cn } from '../../utils'
|
|
6
|
+
import Button from '../elements/Button.vue'
|
|
7
|
+
|
|
8
|
+
defineOptions({
|
|
9
|
+
inheritAttrs: false,
|
|
10
|
+
})
|
|
11
|
+
|
|
12
|
+
const props = withDefaults(defineProps<NNavigationMenuLinkProps>(), {
|
|
13
|
+
navigationMenuLink: 'ghost-white',
|
|
14
|
+
btn: '~',
|
|
15
|
+
as: Button,
|
|
16
|
+
})
|
|
17
|
+
const emits = defineEmits<NavigationMenuLinkEmits>()
|
|
18
|
+
|
|
19
|
+
const forwarded = useForwardPropsEmits(props, emits)
|
|
20
|
+
</script>
|
|
21
|
+
|
|
22
|
+
<template>
|
|
23
|
+
<NavigationMenuLink
|
|
24
|
+
v-bind="!props.asChild ? {
|
|
25
|
+
...$attrs,
|
|
26
|
+
...forwarded,
|
|
27
|
+
class: cn(
|
|
28
|
+
'navigation-menu-link group',
|
|
29
|
+
props.una?.navigationMenuLink,
|
|
30
|
+
props.class,
|
|
31
|
+
),
|
|
32
|
+
navigationMenuLink: btn !== '~' ? undefined : navigationMenuLink,
|
|
33
|
+
navigationMenu: btn === '~' ? props.navigationMenu : undefined,
|
|
34
|
+
} : {}"
|
|
35
|
+
:as-child
|
|
36
|
+
:as
|
|
37
|
+
:active
|
|
38
|
+
>
|
|
39
|
+
<slot :active="active" />
|
|
40
|
+
</NavigationMenuLink>
|
|
41
|
+
</template>
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import type { NNavigationMenuListProps } from '../../types'
|
|
3
|
+
import { NavigationMenuList, useForwardProps } from 'reka-ui'
|
|
4
|
+
import { computed } from 'vue'
|
|
5
|
+
import { cn } from '../../utils'
|
|
6
|
+
|
|
7
|
+
const props = defineProps<NNavigationMenuListProps>()
|
|
8
|
+
|
|
9
|
+
const delegatedProps = computed(() => {
|
|
10
|
+
const { class: _, ...delegated } = props
|
|
11
|
+
|
|
12
|
+
return delegated
|
|
13
|
+
})
|
|
14
|
+
|
|
15
|
+
const forwardedProps = useForwardProps(delegatedProps)
|
|
16
|
+
</script>
|
|
17
|
+
|
|
18
|
+
<template>
|
|
19
|
+
<NavigationMenuList
|
|
20
|
+
v-bind="forwardedProps"
|
|
21
|
+
:class="
|
|
22
|
+
cn(
|
|
23
|
+
'group',
|
|
24
|
+
'navigation-menu-list',
|
|
25
|
+
props.orientation === 'vertical' ? 'navigation-menu-list-vertical' : 'navigation-menu-list-horizontal',
|
|
26
|
+
props.una?.navigationMenuList,
|
|
27
|
+
props.class,
|
|
28
|
+
)
|
|
29
|
+
"
|
|
30
|
+
>
|
|
31
|
+
<slot />
|
|
32
|
+
</NavigationMenuList>
|
|
33
|
+
</template>
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import type { NNavigationMenuTriggerProps } from '../../types'
|
|
3
|
+
import { reactiveOmit } from '@vueuse/core'
|
|
4
|
+
import {
|
|
5
|
+
NavigationMenuTrigger,
|
|
6
|
+
useForwardProps,
|
|
7
|
+
} from 'reka-ui'
|
|
8
|
+
import { cn } from '../../utils'
|
|
9
|
+
import Button from '../elements/Button.vue'
|
|
10
|
+
|
|
11
|
+
defineOptions({
|
|
12
|
+
inheritAttrs: false,
|
|
13
|
+
})
|
|
14
|
+
|
|
15
|
+
const props = withDefaults(defineProps<NNavigationMenuTriggerProps>(), {
|
|
16
|
+
btn: '~',
|
|
17
|
+
navigationMenu: 'ghost-white',
|
|
18
|
+
trailing: 'navigation-menu-trigger-trailing-icon',
|
|
19
|
+
as: Button,
|
|
20
|
+
})
|
|
21
|
+
|
|
22
|
+
const delegatedProps = reactiveOmit(props, 'class')
|
|
23
|
+
|
|
24
|
+
const forwardedProps = useForwardProps(delegatedProps)
|
|
25
|
+
</script>
|
|
26
|
+
|
|
27
|
+
<template>
|
|
28
|
+
<NavigationMenuTrigger
|
|
29
|
+
v-bind="!props.asChild ? {
|
|
30
|
+
...$attrs,
|
|
31
|
+
...forwardedProps,
|
|
32
|
+
class: cn(
|
|
33
|
+
'navigation-menu-trigger group',
|
|
34
|
+
props.una?.navigationMenuTrigger,
|
|
35
|
+
props.class,
|
|
36
|
+
),
|
|
37
|
+
navigationMenu: btn === '~' ? navigationMenu : undefined,
|
|
38
|
+
una: {
|
|
39
|
+
btnTrailing: cn('navigation-menu-trigger-trailing', forwardedProps.una?.btnTrailing),
|
|
40
|
+
...props.una,
|
|
41
|
+
},
|
|
42
|
+
} : {}"
|
|
43
|
+
:as-child="props.asChild"
|
|
44
|
+
:as="props.as"
|
|
45
|
+
:disabled
|
|
46
|
+
>
|
|
47
|
+
<slot />
|
|
48
|
+
</NavigationMenuTrigger>
|
|
49
|
+
</template>
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import type { NNavigationMenuViewportProps } from '../../types'
|
|
3
|
+
import { reactiveOmit } from '@vueuse/core'
|
|
4
|
+
import { NavigationMenuViewport, useForwardProps } from 'reka-ui'
|
|
5
|
+
import { cn } from '../../utils'
|
|
6
|
+
|
|
7
|
+
defineOptions({
|
|
8
|
+
inheritAttrs: false,
|
|
9
|
+
})
|
|
10
|
+
|
|
11
|
+
const props = defineProps<NNavigationMenuViewportProps>()
|
|
12
|
+
|
|
13
|
+
const delegatedProps = reactiveOmit(props, 'class')
|
|
14
|
+
|
|
15
|
+
const forwardedProps = useForwardProps(delegatedProps)
|
|
16
|
+
</script>
|
|
17
|
+
|
|
18
|
+
<template>
|
|
19
|
+
<div
|
|
20
|
+
:class="cn(
|
|
21
|
+
'navigation-menu-viewport-wrapper',
|
|
22
|
+
props.orientation === 'horizontal' && 'navigation-menu-viewport-wrapper-horizontal',
|
|
23
|
+
props.orientation === 'vertical' && 'navigation-menu-viewport-wrapper-vertical',
|
|
24
|
+
props.una?.navigationMenuViewportWrapper,
|
|
25
|
+
props.class,
|
|
26
|
+
)"
|
|
27
|
+
>
|
|
28
|
+
<NavigationMenuViewport
|
|
29
|
+
v-bind="{ ...forwardedProps, ...$attrs }"
|
|
30
|
+
:class="
|
|
31
|
+
cn(
|
|
32
|
+
'navigation-menu-viewport',
|
|
33
|
+
'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90',
|
|
34
|
+
props.una?.navigationMenuViewport,
|
|
35
|
+
)
|
|
36
|
+
"
|
|
37
|
+
/>
|
|
38
|
+
</div>
|
|
39
|
+
</template>
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: import("
|
|
1
|
+
declare const _default: import("nuxt/app").Plugin<Record<string, unknown>> & import("nuxt/app").ObjectPlugin<Record<string, unknown>>;
|
|
2
2
|
export default _default;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: import("
|
|
1
|
+
declare const _default: import("nuxt/app").Plugin<Record<string, unknown>> & import("nuxt/app").ObjectPlugin<Record<string, unknown>>;
|
|
2
2
|
export default _default;
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
import type { NavigationMenuContentProps, NavigationMenuIndicatorProps, NavigationMenuItemProps, NavigationMenuLinkProps, NavigationMenuListProps, NavigationMenuRootProps, NavigationMenuSubProps, NavigationMenuTriggerProps, NavigationMenuViewportProps } from 'reka-ui';
|
|
2
|
+
import type { HTMLAttributes } from 'vue';
|
|
3
|
+
import type { NButtonProps } from './button.js';
|
|
4
|
+
interface BaseExtensions {
|
|
5
|
+
/** CSS class for the component */
|
|
6
|
+
class?: HTMLAttributes['class'];
|
|
7
|
+
/** Size of the component */
|
|
8
|
+
size?: HTMLAttributes['class'];
|
|
9
|
+
}
|
|
10
|
+
export interface NNavigationMenuProps<T> extends Omit<NavigationMenuRootProps, 'class'>, Pick<NNavigationMenuTriggerProps, 'navigationMenu' | 'disabled'>, Pick<NNavigationMenuLinkProps, 'navigationMenuLink'>, BaseExtensions {
|
|
11
|
+
/**
|
|
12
|
+
* The array of items that is passed to the navigation menu.
|
|
13
|
+
*
|
|
14
|
+
* @default []
|
|
15
|
+
*/
|
|
16
|
+
items?: T;
|
|
17
|
+
/** Whether to show the indicator or not */
|
|
18
|
+
indicator?: boolean;
|
|
19
|
+
/** Props for the navigation menu trigger */
|
|
20
|
+
_navigationMenuTrigger?: Partial<NNavigationMenuTriggerProps>;
|
|
21
|
+
/** Props for the navigation menu content */
|
|
22
|
+
_navigationMenuContent?: Partial<NNavigationMenuContentProps>;
|
|
23
|
+
/** Props for the navigation menu item */
|
|
24
|
+
_navigationMenuItem?: Partial<NNavigationMenuItemProps>;
|
|
25
|
+
/** Props for the navigation menu viewport */
|
|
26
|
+
_navigationMenuViewport?: Partial<NNavigationMenuViewportProps>;
|
|
27
|
+
/** Props for the navigation menu list */
|
|
28
|
+
_navigationMenuList?: Partial<NNavigationMenuListProps>;
|
|
29
|
+
/** Props for the navigation menu list item */
|
|
30
|
+
_navigationMenuListItem?: Partial<NNavigationMenuListItemProps>;
|
|
31
|
+
/** Props for the navigation menu link */
|
|
32
|
+
_navigationMenuLink?: Partial<NNavigationMenuLinkProps>;
|
|
33
|
+
/** Props for the navigation menu indicator */
|
|
34
|
+
_navigationMenuIndicator?: Partial<NNavigationMenuIndicatorProps>;
|
|
35
|
+
/**
|
|
36
|
+
* `UnaUI` preset configuration
|
|
37
|
+
*
|
|
38
|
+
* @see https://github.com/una-ui/una-ui/blob/main/packages/preset/src/_shortcuts/navigation-menu.ts
|
|
39
|
+
*/
|
|
40
|
+
una?: NNavigationMenuUnaProps;
|
|
41
|
+
}
|
|
42
|
+
export interface NNavigationMenuTriggerProps extends NavigationMenuTriggerProps, Omit<NButtonProps, 'una'> {
|
|
43
|
+
/**
|
|
44
|
+
* Allows you to add `UnaUI` button preset properties,
|
|
45
|
+
* Think of it as a shortcut for adding options or variants to the preset if available.
|
|
46
|
+
*
|
|
47
|
+
* @see https://github.com/una-ui/una-ui/blob/main/packages/preset/src/_shortcuts/navigation-menu.ts
|
|
48
|
+
* @example
|
|
49
|
+
* navigation-menu="solid-indigo"
|
|
50
|
+
*/
|
|
51
|
+
navigationMenu?: string;
|
|
52
|
+
/** Additional properties for the una component */
|
|
53
|
+
una?: Pick<NNavigationMenuUnaProps, 'navigationMenuTrigger' | 'navigationMenuDefaultVariant'> & NButtonProps['una'];
|
|
54
|
+
}
|
|
55
|
+
export interface NNavigationMenuContentProps extends NavigationMenuContentProps, BaseExtensions {
|
|
56
|
+
/** Additional properties for the una component */
|
|
57
|
+
una?: NNavigationMenuUnaProps['navigationMenuContent'];
|
|
58
|
+
}
|
|
59
|
+
export interface NNavigationMenuItemProps extends NavigationMenuItemProps, Omit<NNavigationMenuTriggerProps, 'una'>, Pick<NNavigationMenuLinkProps, 'active' | 'onSelect'>, Pick<NNavigationMenuProps<NNavigationMenuItemProps[]>, '_navigationMenuLink' | '_navigationMenuTrigger'> {
|
|
60
|
+
/** Slot of the navigation menu item */
|
|
61
|
+
slot?: string;
|
|
62
|
+
/** The array of links that is passed to the navigation menu items. */
|
|
63
|
+
items?: NNavigationMenuLinkProps[];
|
|
64
|
+
/** Additional properties for the una component */
|
|
65
|
+
una?: Pick<NNavigationMenuUnaProps, 'navigationMenuTrigger' | 'navigationMenuContent'>;
|
|
66
|
+
}
|
|
67
|
+
export interface NNavigationMenuIndicatorProps extends NavigationMenuIndicatorProps, BaseExtensions {
|
|
68
|
+
/** Additional properties for the una component */
|
|
69
|
+
una?: NNavigationMenuUnaProps['navigationMenuIndicator'];
|
|
70
|
+
}
|
|
71
|
+
export interface NNavigationMenuLinkProps extends NavigationMenuLinkProps, Omit<NButtonProps, 'size'>, BaseExtensions {
|
|
72
|
+
/**
|
|
73
|
+
* Allows you to add `UnaUI` button preset properties,
|
|
74
|
+
* Think of it as a shortcut for adding options or variants to the preset if available.
|
|
75
|
+
*
|
|
76
|
+
* @see https://github.com/una-ui/una-ui/blob/main/packages/preset/src/_shortcuts/navigation-menu.ts
|
|
77
|
+
* @example
|
|
78
|
+
* navigation-menu-link="ghost-gray"
|
|
79
|
+
*/
|
|
80
|
+
navigationMenuLink?: string;
|
|
81
|
+
/** Event handler called when the link is clicked */
|
|
82
|
+
onSelect?: (e: Event) => void;
|
|
83
|
+
/** Additional properties for the una component */
|
|
84
|
+
una?: NNavigationMenuUnaProps['navigationMenuLink'] & NButtonProps['una'];
|
|
85
|
+
}
|
|
86
|
+
export interface NNavigationMenuListProps extends NavigationMenuListProps, Pick<NavigationMenuRootProps, 'orientation'>, BaseExtensions {
|
|
87
|
+
/** Additional properties for the una component */
|
|
88
|
+
una?: NNavigationMenuUnaProps['navigationMenuList'];
|
|
89
|
+
}
|
|
90
|
+
export interface NNavigationMenuListItemProps extends NNavigationMenuLinkProps {
|
|
91
|
+
/** Description of the link. This is only used when `orientation` is `horizontal`. */
|
|
92
|
+
description?: string;
|
|
93
|
+
/** Additional properties for the una component */
|
|
94
|
+
una?: Pick<NNavigationMenuUnaProps, 'navigationMenuListItem' | 'navigationMenuContentItem' | 'navigationMenuContentItemWrapper' | 'navigationMenuContentItemLabel' | 'navigationMenuContentItemDescription'>;
|
|
95
|
+
}
|
|
96
|
+
export interface NNavigationMenuSubProps extends NavigationMenuSubProps {
|
|
97
|
+
}
|
|
98
|
+
export interface NNavigationMenuViewportProps extends NavigationMenuViewportProps, Pick<NavigationMenuRootProps, 'orientation'>, Pick<BaseExtensions, 'class'> {
|
|
99
|
+
/** Additional properties for the una component */
|
|
100
|
+
una?: Pick<NNavigationMenuUnaProps, 'navigationMenuViewport' | 'navigationMenuViewportWrapper'>;
|
|
101
|
+
}
|
|
102
|
+
interface NNavigationMenuUnaProps {
|
|
103
|
+
/** CSS class for the navigation menu */
|
|
104
|
+
navigationMenu?: HTMLAttributes['class'];
|
|
105
|
+
/** CSS class for the navigation menu content */
|
|
106
|
+
navigationMenuContent?: HTMLAttributes['class'];
|
|
107
|
+
/** CSS class for the navigation menu content item */
|
|
108
|
+
navigationMenuContentItem?: HTMLAttributes['class'];
|
|
109
|
+
/** CSS class for the navigation menu content item wrapper */
|
|
110
|
+
navigationMenuContentItemWrapper?: HTMLAttributes['class'];
|
|
111
|
+
/** CSS class for the navigation menu content item label */
|
|
112
|
+
navigationMenuContentItemLabel?: HTMLAttributes['class'];
|
|
113
|
+
/** CSS class for the navigation menu content item description */
|
|
114
|
+
navigationMenuContentItemDescription?: HTMLAttributes['class'];
|
|
115
|
+
/** CSS class for the navigation menu trigger */
|
|
116
|
+
navigationMenuTrigger?: HTMLAttributes['class'];
|
|
117
|
+
/** CSS class for the navigation menu trigger default variant */
|
|
118
|
+
navigationMenuDefaultVariant?: HTMLAttributes['class'];
|
|
119
|
+
/** CSS class for the navigation menu list */
|
|
120
|
+
navigationMenuList?: HTMLAttributes['class'];
|
|
121
|
+
/** CSS class for the navigation menu list item */
|
|
122
|
+
navigationMenuListItem?: HTMLAttributes['class'];
|
|
123
|
+
/** CSS class for the navigation menu item */
|
|
124
|
+
navigationMenuItem?: HTMLAttributes['class'];
|
|
125
|
+
/** CSS class for the navigation menu link */
|
|
126
|
+
navigationMenuLink?: HTMLAttributes['class'];
|
|
127
|
+
/** CSS class for the navigation menu indicator */
|
|
128
|
+
navigationMenuIndicator?: HTMLAttributes['class'];
|
|
129
|
+
/** CSS class for the navigation menu indicator arrow */
|
|
130
|
+
navigationMenuIndicatorArrow?: HTMLAttributes['class'];
|
|
131
|
+
/** CSS class for the navigation menu viewport */
|
|
132
|
+
navigationMenuViewport?: HTMLAttributes['class'];
|
|
133
|
+
/** CSS class for the navigation menu viewport wrapper */
|
|
134
|
+
navigationMenuViewportWrapper?: HTMLAttributes['class'];
|
|
135
|
+
}
|
|
136
|
+
export {};
|
|
File without changes
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@una-ui/nuxt",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.48.0",
|
|
5
5
|
"description": "Nuxt module for @una-ui",
|
|
6
6
|
"author": "Phojie Rengel <phojrengel@gmail.com>",
|
|
7
7
|
"license": "MIT",
|
|
@@ -59,11 +59,11 @@
|
|
|
59
59
|
"typescript": "5.6.3",
|
|
60
60
|
"unocss": "^66.0.0",
|
|
61
61
|
"unocss-preset-animations": "^1.1.1",
|
|
62
|
-
"@una-ui/extractor-vue-script": "^0.
|
|
63
|
-
"@una-ui/preset": "^0.
|
|
62
|
+
"@una-ui/extractor-vue-script": "^0.48.0",
|
|
63
|
+
"@una-ui/preset": "^0.48.0"
|
|
64
64
|
},
|
|
65
65
|
"devDependencies": {
|
|
66
|
-
"@iconify-json/lucide": "^1.2.
|
|
66
|
+
"@iconify-json/lucide": "^1.2.34",
|
|
67
67
|
"@iconify-json/radix-icons": "^1.2.2",
|
|
68
68
|
"@iconify-json/tabler": "^1.2.17",
|
|
69
69
|
"@nuxt/module-builder": "^0.8.4",
|