(null)
+
+ const modelValue = useModel(props, 'modelValue')
+ const proxyChecked = computed({
+ get: () => modelValue.value !== undefined ? modelValue.value : openProp.value !== undefined ? openProp.value : undefined,
+ set: () => {
+ },
+ })
+
+ const { state, updateValue } = useControllable({
+ prop: computed(() => proxyChecked.value),
+ defaultProp: computed(() => defaultOpen.value),
+ onChange: (result: any) => {
+ modelValue.value = result
+ emit('openChange', result)
+ emit('update:modelValue', result)
+ },
+ initialValue: false,
+ })
+
+ dropdownMenuProvider({
+ scope: scopeOkuDropdownMenu.value,
+ triggerId: computed(() => useId()),
+ triggerRef,
+ contentId: computed(() => useId()),
+ open: computed(() => state.value),
+ onOpenChange: _open => updateValue(_open),
+ onOpenToggle: () => updateValue(!state.value),
+ modal,
+ })
+
+ return () => h(OkuMenu, {
+ ...attrs,
+ ...menuScope,
+ open: state.value,
+ onOpenChange: _open => updateValue(_open),
+ dir: dir.value,
+ modal: modal.value,
+ }, slots)
+ },
+})
+
+export const OkuDropdownMenu = dropdownMenu
diff --git a/packages/components/dropdown-menu/src/index.ts b/packages/components/dropdown-menu/src/index.ts
new file mode 100644
index 000000000..fe6b5cc9c
--- /dev/null
+++ b/packages/components/dropdown-menu/src/index.ts
@@ -0,0 +1,117 @@
+import type { } from '@floating-ui/vue'
+
+export { OkuDropdownMenuArrow } from './dropdown-menu-arrow'
+export { OkuDropdownMenuCheckboxItem } from './dropdown-menu-checkbox-item'
+export { OkuDropdownMenuContent } from './dropdown-menu-content'
+export { OkuDropdownMenuGroup } from './dropdown-menu-group'
+export { OkuDropdownMenuItemIndicator } from './dropdown-menu-item-indicator'
+export { OkuDropdownMenuItem } from './dropdown-menu-item'
+export { OkuDropdownMenuLabel } from './dropdown-menu-label'
+export { OkuDropdownMenuPortal } from './dropdown-menu-portal'
+export { OkuDropdownMenuRadioGroup } from './dropdown-menu-radio-group'
+export { OkuDropdownMenuRadioItem } from './dropdown-menu-radio-item'
+export { OkuDropdownMenuSeparator } from './dropdown-menu-separator'
+export { OkuDropdownMenuSubContent } from './dropdown-menu-sub-content'
+export { OkuDropdownMenuSubTrigger } from './dropdown-menu-sub-trigger'
+export { OkuDropdownMenuSub } from './dropdown-menu-sub'
+export { OkuDropdownMenuTrigger } from './dropdown-menu-trigger'
+export { OkuDropdownMenu } from './dropdown-menu'
+
+export type {
+ DropdownMenuArrowProps,
+ DropdownMenuArrowElement,
+ DropdownMenuArrowNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuCheckboxItemProps,
+ DropdownMenuCheckboxItemEmits,
+ DropdownMenuCheckboxItemElement,
+ DropdownMenuCheckboxItemNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuContentProps,
+ DropdownMenuContentEmits,
+ DropdownMenuContentElement,
+ DropdownMenuContentNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuGroupProps,
+ DropdownMenuGroupElement,
+ DropdownMenuGroupNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuItemIndicatorProps,
+ DropdownMenuItemIndicatorElement,
+ DropdownMenuItemIndicatorNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuItemProps,
+ DropdownMenuItemEmits,
+ DropdownMenuItemElement,
+ DropdownMenuItemNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuLabelProps,
+ DropdownMenuLabelElement,
+ DropdownMenuLabelNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuPortalProps,
+} from './props'
+
+export type {
+ DropdownMenuRadioGroupProps,
+ DropdownMenuRadioGroupElement,
+ DropdownMenuRadioGroupNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuRadioItemProps,
+ DropdownMenuRadioItemEmits,
+ DropdownMenuRadioItemElement,
+ DropdownMenuRadioItemNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuSeparatorProps,
+ DropdownMenuSeparatorElement,
+ DropdownMenuSeparatorNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuSubContentProps,
+ DropdownMenuSubContentEmits,
+ DropdownMenuSubContentElement,
+ DropdownMenuSubContentNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuSubTriggerProps,
+ DropdownMenuSubTriggerEmits,
+ DropdownMenuSubTriggerElement,
+ DropdownMenuSubTriggerNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuSubProps,
+ DropdownMenuSubEmits,
+} from './props'
+
+export type {
+ DropdownMenuTriggerProps,
+ DropdownMenuTriggerEmits,
+ DropdownMenuTriggerElement,
+ DropdownMenuTriggerNativeElement,
+} from './props'
+
+export type {
+ DropdownMenuProps,
+ DropdownMenuEmits,
+} from './props'
diff --git a/packages/components/dropdown-menu/src/props.ts b/packages/components/dropdown-menu/src/props.ts
new file mode 100644
index 000000000..09abc8c90
--- /dev/null
+++ b/packages/components/dropdown-menu/src/props.ts
@@ -0,0 +1,423 @@
+import type { PropType, Ref } from 'vue'
+import { primitiveProps, propsOmit } from '@oku-ui/primitive'
+import type { OkuElement, PrimitiveProps } from '@oku-ui/primitive'
+import { ScopePropObject, createProvideScope } from '@oku-ui/provide'
+import type { Scope } from '@oku-ui/provide'
+import type { Direction } from '@oku-ui/direction'
+import type { DismissableLayerEmits } from '@oku-ui/dismissable-layer'
+import type { FocusScopeEmits } from '@oku-ui/focus-scope'
+import { createMenuScope, menuArrowProps, menuCheckboxItemProps, menuContentProps, menuGroupProps, menuItemIndicatorProps, menuItemProps, menuLabelProps, menuPortalProps, menuRadioGroupProps, menuRadioItemProps, menuSeparatorProps, menuSubContentProps, menuSubTriggerProps } from '@oku-ui/menu'
+import type { MenuArrowElement, MenuArrowNativeElement, MenuArrowProps, MenuCheckboxItemElement, MenuCheckboxItemEmits, MenuCheckboxItemNativeElement, MenuCheckboxItemProps, MenuContentElement, MenuContentNativeElement, MenuContentProps, MenuGroupElement, MenuGroupNativeElement, MenuGroupProps, MenuItemElement, MenuItemEmits, MenuItemIndicatorElement, MenuItemIndicatorNativeElement, MenuItemIndicatorProps, MenuItemNativeElement, MenuItemProps, MenuLabelElement, MenuLabelNativeElement, MenuLabelProps, MenuPortalProps, MenuRadioGroupElement, MenuRadioGroupNativeElement, MenuRadioGroupProps, MenuRadioItemElement, MenuRadioItemEmits, MenuRadioItemNativeElement, MenuRadioItemProps, MenuSeparatorElement, MenuSeparatorNativeElement, MenuSeparatorProps, MenuSubContentElement, MenuSubContentEmits, MenuSubContentNativeElement, MenuSubContentProps, MenuSubTriggerElement, MenuSubTriggerEmits, MenuSubTriggerNativeElement, MenuSubTriggerProps } from '@oku-ui/menu'
+
+export type ScopedDropdownMenu = P & { scopeOkuDropdownMenu?: Scope }
+
+export const scopedDropdownMenuProps = {
+ scopeOkuDropdownMenu: {
+ ...ScopePropObject,
+ },
+}
+
+// NAMES
+export const DROPDOWN_MENU_NAME = 'OkuDropdownMenu'
+export const DROPDOWN_MENU_TRIGGER_NAME = 'OkuDropdownMenuTrigger'
+export const DROPDOWN_MENU_PORTAL_NAME = 'OkuDropdownMenuPortal'
+export const DROPDOWN_MENU_CONTENT_NAME = 'OkuDropdownMenuContent'
+export const DROPDOWN_MENU_GROUP_NAME = 'OkuDropdownMenuGroup'
+export const DROPDOWN_MENU_LABEL_NAME = 'OkuDropdownMenuLabel'
+export const DROPDOWN_MENU_ITEM_NAME = 'OkuDropdownMenuItem'
+export const DROPDOWN_MENU_CHECKBOX_ITEM_NAME = 'OkuDropdownMenuCheckboxItem'
+export const DROPDOWN_MENU_RADIO_GROUP_NAME = 'OkuDropdownMenuRadioGroup'
+export const DROPDOWN_MENU_RADIO_ITEM_NAME = 'OkuDropdownMenuRadioItem'
+export const DROPDOWN_MENU_ITEM_INDICATOR_NAME = 'OkuDropdownMenuItemIndicator'
+export const DROPDOWN_MENU_SEPARATOR_NAME = 'OkuDropdownMenuSeparator'
+export const DROPDOWN_MENU_ARROW_NAME = 'OkuDropdownMenuArrow'
+export const DROPDOWN_MENU_SUB_NAME = 'OkuDropdownMenuSub'
+export const DROPDOWN_MENU_SUB_TRIGGER_NAME = 'OkuDropdownMenuSubTrigger'
+export const DROPDOWN_MENU_SUB_CONTENT_NAME = 'OkuDropdownMenuSubContent'
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenu - dropdown-menu.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export const [createDropdownMenuProvide, createDropdownMenuScop] = createProvideScope(DROPDOWN_MENU_NAME, [
+ createMenuScope,
+])
+
+export const useMenuScope = createMenuScope()
+
+export type DropdownMenuInjectValue = {
+ triggerId: Ref
+ triggerRef: Ref
+ contentId: Ref
+ open: Ref
+ onOpenChange(open: boolean): void
+ onOpenToggle(): void
+ modal: Ref
+
+}
+
+export const [dropdownMenuProvider, useDropdownMenuInject]
+ = createDropdownMenuProvide(DROPDOWN_MENU_NAME)
+
+export interface DropdownMenuProps {
+ dir?: Direction
+ open?: boolean
+ defaultOpen?: boolean
+ modelValue?: boolean
+ modal: boolean
+}
+
+export type DropdownMenuEmits = {
+ openChange: [open: boolean]
+ 'update:modelValue': [open: boolean]
+}
+
+export const dropdownMenuProps = {
+ props: {
+ dir: {
+ type: String as PropType,
+ },
+ open: {
+ type: Boolean as PropType,
+ default: undefined,
+ },
+ defaultOpen: {
+ type: Boolean as PropType,
+ default: undefined,
+ },
+ modelValue: {
+ type: Boolean as PropType,
+ default: undefined,
+ },
+ modal: {
+ type: Boolean as PropType,
+ default: true,
+ },
+ },
+ emits: {
+ // eslint-disable-next-line unused-imports/no-unused-vars
+ 'openChange': (open: DropdownMenuEmits['openChange'][0]) => true,
+ // eslint-disable-next-line unused-imports/no-unused-vars
+ 'update:modelValue': (open: DropdownMenuEmits['update:modelValue'][0]) => true,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuTrigger - dropdown-menu-trigger.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuTriggerNativeElement = OkuElement<'button'>
+export type DropdownMenuTriggerElement = HTMLButtonElement
+
+export interface DropdownMenuTriggerProps extends PrimitiveProps {
+ disabled: boolean
+}
+
+export type DropdownMenuTriggerEmits = {
+ pointerdown: [event: PointerEvent]
+ keydown: [event: KeyboardEvent]
+}
+
+export const dropdownMenuTriggerProps = {
+ props: {
+ disabled: {
+ type: Boolean as PropType,
+ default: false,
+ },
+ ...primitiveProps,
+ },
+ emits: {
+ // eslint-disable-next-line unused-imports/no-unused-vars
+ pointerdown: (event: DropdownMenuTriggerEmits['pointerdown'][0]) => true,
+ // eslint-disable-next-line unused-imports/no-unused-vars
+ keydown: (event: DropdownMenuTriggerEmits['keydown'][0]) => true,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuPortal - dropdown-menu-portal.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export interface DropdownMenuPortalProps extends MenuPortalProps { }
+
+export const dropdownMenuPortalProps = {
+ props: {
+ ...menuPortalProps.props,
+ },
+ emits: {
+ ...menuPortalProps.emits,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuContent - dropdown-menu-content.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuContentNativeElement = MenuContentNativeElement
+export type DropdownMenuContentElement = MenuContentElement
+
+export interface DropdownMenuContentProps extends MenuContentProps { }
+
+export type DropdownMenuContentEmits = {
+ closeAutoFocus: [event: FocusScopeEmits['unmountAutoFocus'][0]]
+ interactOutside: [event: DismissableLayerEmits['interactOutside'][0]]
+}
+
+export const dropdownMenuContentProps = {
+ props: {
+ ...menuContentProps.props,
+ },
+ emits: {
+ ...propsOmit(menuContentProps.emits, ['entryFocus']),
+ // eslint-disable-next-line unused-imports/no-unused-vars
+ closeAutoFocus: (event: DropdownMenuContentEmits['closeAutoFocus'][0]) => true,
+ // eslint-disable-next-line unused-imports/no-unused-vars
+ interactOutside: (event: DropdownMenuContentEmits['interactOutside'][0]) => true,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuGroup - dropdown-menu-group.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuGroupNativeElement = MenuGroupNativeElement
+export type DropdownMenuGroupElement = MenuGroupElement
+
+export interface DropdownMenuGroupProps extends MenuGroupProps { }
+
+export const dropdownMenuGroupProps = {
+ props: {
+ ...menuGroupProps.props,
+ },
+ emits: {
+ ...menuGroupProps.emits,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuLabel - dropdown-menu-label.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuLabelNativeElement = MenuLabelNativeElement
+export type DropdownMenuLabelElement = MenuLabelElement
+
+export interface DropdownMenuLabelProps extends MenuLabelProps { }
+
+export const dropdownMenuLabelProps = {
+ props: {
+ ...menuLabelProps.props,
+ },
+ emits: {
+ ...menuLabelProps.emits,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuItem - dropdown-menu-item.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuItemNativeElement = MenuItemNativeElement
+export type DropdownMenuItemElement = MenuItemElement
+
+export interface DropdownMenuItemProps extends MenuItemProps { }
+
+export interface DropdownMenuItemEmits extends MenuItemEmits { }
+
+export const dropdownMenuItemProps = {
+ props: {
+ ...menuItemProps.props,
+ },
+ emits: {
+ ...menuItemProps.emits,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuCheckboxItem - dropdown-menu-Checkbox-item.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuCheckboxItemNativeElement = MenuCheckboxItemNativeElement
+export type DropdownMenuCheckboxItemElement = MenuCheckboxItemElement
+
+export interface DropdownMenuCheckboxItemProps extends MenuCheckboxItemProps { }
+
+export interface DropdownMenuCheckboxItemEmits extends MenuCheckboxItemEmits { }
+
+export const dropdownMenuCheckboxItemProps = {
+ props: {
+ ...menuCheckboxItemProps.props,
+ },
+ emits: {
+ ...menuCheckboxItemProps.emits,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuRadioGroup - dropdown-menu-radio-group.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuRadioGroupNativeElement = MenuRadioGroupNativeElement
+export type DropdownMenuRadioGroupElement = MenuRadioGroupElement
+
+export interface DropdownMenuRadioGroupProps extends MenuRadioGroupProps { }
+
+export const dropdownMenuRadioGroupProps = {
+ props: {
+ ...menuRadioGroupProps.props,
+ },
+ emits: {
+ ...menuRadioGroupProps.emits,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuRadioItem - dropdown-menu-radio-item.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuRadioItemNativeElement = MenuRadioItemNativeElement
+export type DropdownMenuRadioItemElement = MenuRadioItemElement
+
+export interface DropdownMenuRadioItemProps extends MenuRadioItemProps { }
+
+export interface DropdownMenuRadioItemEmits extends MenuRadioItemEmits { }
+
+export const dropdownMenuRadioItemProps = {
+ props: {
+ ...menuRadioItemProps.props,
+ },
+ emits: {
+ ...menuRadioItemProps.emits,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuItemIndicator - dropdown-menu--item-indicator.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuItemIndicatorNativeElement = MenuItemIndicatorNativeElement
+export type DropdownMenuItemIndicatorElement = MenuItemIndicatorElement
+
+export interface DropdownMenuItemIndicatorProps extends MenuItemIndicatorProps { }
+
+export const dropdownMenuItemIndicatorProps = {
+ props: {
+ ...menuItemIndicatorProps.props,
+ },
+ emits: {
+ ...menuItemIndicatorProps.emits,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuSeparator - dropdown-menu-separator.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuSeparatorNativeElement = MenuSeparatorNativeElement
+export type DropdownMenuSeparatorElement = MenuSeparatorElement
+
+export interface DropdownMenuSeparatorProps extends MenuSeparatorProps { }
+
+export const dropdownMenuSeparatorProps = {
+ props: {
+ ...menuSeparatorProps.props,
+ },
+ emits: {
+ ...menuSeparatorProps.emits,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuArrow - dropdown-menu-arrow.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuArrowNativeElement = MenuArrowNativeElement
+export type DropdownMenuArrowElement = MenuArrowElement
+
+export interface DropdownMenuArrowProps extends MenuArrowProps { }
+
+export const dropdownMenuArrowProps = {
+ props: {
+ ...menuArrowProps.props,
+ },
+ emits: {
+ ...menuArrowProps.emits,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuSub - dropdown-menu-sub.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export interface DropdownMenuSubProps {
+ open?: boolean
+ defaultOpen?: boolean
+ modelValue?: boolean
+}
+
+export type DropdownMenuSubEmits = {
+ openChange: [open: boolean]
+ 'update:modelValue': [open: boolean]
+}
+
+export const dropdownMenuSubProps = {
+ props: {
+ open: {
+ type: Boolean as PropType,
+ default: undefined,
+ },
+ defaultOpen: {
+ type: Boolean as PropType,
+ default: undefined,
+ },
+ modelValue: {
+ type: Boolean as PropType,
+ default: undefined,
+ },
+ },
+ emits: {
+ // eslint-disable-next-line unused-imports/no-unused-vars
+ 'openChange': (open: DropdownMenuSubEmits['openChange'][0]) => true,
+ // eslint-disable-next-line unused-imports/no-unused-vars
+ 'update:modelValue': (open: DropdownMenuSubEmits['update:modelValue'][0]) => true,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuSubTrigger - dropdown-menu-sub-trigger.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuSubTriggerNativeElement = MenuSubTriggerNativeElement
+export type DropdownMenuSubTriggerElement = MenuSubTriggerElement
+
+export interface DropdownMenuSubTriggerProps extends MenuSubTriggerProps { }
+
+export interface DropdownMenuSubTriggerEmits extends MenuSubTriggerEmits { }
+
+export const dropdownMenuSubTriggerProps = {
+ props: {
+ ...menuSubTriggerProps.props,
+ },
+ emits: {
+ ...menuSubTriggerProps.emits,
+ },
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * DropdownMenuSubContent - dropdown-menu-sub-content.ts
+ * ----------------------------------------------------------------------------------------------- */
+
+export type DropdownMenuSubContentNativeElement = MenuSubContentNativeElement
+export type DropdownMenuSubContentElement = MenuSubContentElement
+
+export interface DropdownMenuSubContentProps extends MenuSubContentProps { }
+
+export interface DropdownMenuSubContentEmits extends MenuSubContentEmits { }
+
+export const dropdownMenuSubContentProps = {
+ props: {
+ ...menuSubContentProps.props,
+ },
+ emits: {
+ ...menuSubContentProps.emits,
+ },
+}
diff --git a/packages/components/dropdown-menu/tsconfig.json b/packages/components/dropdown-menu/tsconfig.json
new file mode 100644
index 000000000..887182612
--- /dev/null
+++ b/packages/components/dropdown-menu/tsconfig.json
@@ -0,0 +1,8 @@
+{
+ "extends": "tsconfig/node18.json",
+ "include": [
+ "src/**/*",
+ "tests/**/*",
+ "node_modules/tsconfig"
+ ]
+}
diff --git a/packages/core/menu/src/index.ts b/packages/core/menu/src/index.ts
index ab2daf21e..c76c6003a 100644
--- a/packages/core/menu/src/index.ts
+++ b/packages/core/menu/src/index.ts
@@ -39,6 +39,7 @@ export type {
export type {
MenuCheckboxItemProps,
+ MenuCheckboxItemEmits,
MenuCheckboxItemElement,
MenuCheckboxItemNativeElement,
} from './props'
@@ -51,12 +52,14 @@ export type {
export type {
MenuContentImplProps,
+ MenuContentImplEmits,
MenuContentImplElement,
MenuContentImplNativeElement,
} from './props'
export type {
MenuRootContentTypeProps,
+ MenuRootContentTypeEmits,
MenuRootContentTypeElement,
MenuRootContentTypeNativeElement,
} from './props'
@@ -75,12 +78,14 @@ export type {
export type {
MenuItemProps,
+ MenuItemEmits,
MenuItemElement,
MenuItemNativeElement,
} from './props'
export type {
MenuItemImplProps,
+ MenuItemImplEmits,
MenuItemImplElement,
MenuItemImplNativeElement,
} from './props'
@@ -105,6 +110,7 @@ export type {
export type {
MenuRadioItemProps,
+ MenuRadioItemEmits,
MenuRadioItemElement,
MenuRadioItemNativeElement,
} from './props'
@@ -117,16 +123,36 @@ export type {
export type {
MenuSubProps,
+ MenuSubEmits,
} from './props'
export type {
MenuSubContentProps,
+ MenuSubContentEmits,
MenuSubContentElement,
MenuSubContentNativeElement,
} from './props'
export type {
MenuSubTriggerProps,
+ MenuSubTriggerEmits,
MenuSubTriggerElement,
MenuSubTriggerNativeElement,
} from './props'
+
+export {
+ createMenuScope,
+ menuPortalProps,
+ menuContentProps,
+ menuGroupProps,
+ menuLabelProps,
+ menuItemProps,
+ menuCheckboxItemProps,
+ menuRadioGroupProps,
+ menuRadioItemProps,
+ menuItemIndicatorProps,
+ menuSeparatorProps,
+ menuArrowProps,
+ menuSubTriggerProps,
+ menuSubContentProps,
+} from './props'
diff --git a/packages/core/menu/src/props.ts b/packages/core/menu/src/props.ts
index 36331be35..5cc72e6dd 100644
--- a/packages/core/menu/src/props.ts
+++ b/packages/core/menu/src/props.ts
@@ -178,7 +178,7 @@ export const menuPortalProps = {
}
/* -------------------------------------------------------------------------------------------------
- * MenuContentImpl - menu-content-impl
+ * MenuContentImpl - menu-content-impl
* ----------------------------------------------------------------------------------------------- */
export type MenuContentImplNativeElement = PopperContentNaviteElement
@@ -292,7 +292,7 @@ export const menuContentImplProps = {
}
/* -------------------------------------------------------------------------------------------------
- * MenuRootContentModal - menu-root-content-modal.ts
+ * MenuRootContentModal - menu-root-content-modal.ts
* ----------------------------------------------------------------------------------------------- */
export type MenuRootContentTypeNativeElement = MenuContentImplNativeElement
@@ -301,6 +301,7 @@ export type MenuRootContentTypeElement = MenuContentImplElement
export interface MenuRootContentTypeProps extends Omit { }
export type MenuRootContentTypeEmits = Omit
+
export const menuRootContentTypeProps = {
props: {
...propsOmit(menuContentImplProps.props, menuContentImplPrivateProps.propsKeys),
@@ -444,6 +445,7 @@ export const menuItemImplProps = {
export const ITEM_SELECT = 'menu.itemSelect'
export type MenuItemNativeElement = MenuItemImplNativeElement
+
export type MenuItemElement = MenuItemImplElement
export interface MenuItemProps extends MenuItemImplProps { }
@@ -619,6 +621,7 @@ export const menuSeparatorProps = {
export type MenuArrowNativeElement = PopperArrowNaviteElement
export type MenuArrowElement = PopperArrowElement
+
export interface MenuArrowProps extends PopperArrowProps { }
export const menuArrowProps = {
diff --git a/playground/nuxt3/package.json b/playground/nuxt3/package.json
index e5fb570c8..6f62eb148 100644
--- a/playground/nuxt3/package.json
+++ b/playground/nuxt3/package.json
@@ -22,6 +22,7 @@
"@oku-ui/collection": "workspace:^",
"@oku-ui/dialog": "workspace:^",
"@oku-ui/dismissable-layer": "workspace:^",
+ "@oku-ui/dropdown-menu": "workspace:^",
"@oku-ui/focus-scope": "workspace:^",
"@oku-ui/hover-card": "workspace:^",
"@oku-ui/label": "workspace:^",
diff --git a/playground/vue3/package.json b/playground/vue3/package.json
index 84028855d..fb53bf092 100644
--- a/playground/vue3/package.json
+++ b/playground/vue3/package.json
@@ -14,6 +14,7 @@
"@oku-ui/aspect-ratio": "workspace:^",
"@oku-ui/avatar": "workspace:^",
"@oku-ui/checkbox": "workspace:^",
+ "@oku-ui/dropdown-menu": "workspace:^",
"@oku-ui/label": "workspace:^",
"@oku-ui/menu": "workspace:^",
"@oku-ui/primitives": "workspace:^",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 8aa0ece46..c3297b186 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -21,6 +21,7 @@ overrides:
'@oku-ui/hover-card': workspace:^
'@oku-ui/label': workspace:^
'@oku-ui/menu': workspace:^
+ '@oku-ui/dropdown-menu': workspace:^
'@oku-ui/popover': workspace:^
'@oku-ui/popper': workspace:^
'@oku-ui/portal': workspace:^
@@ -97,6 +98,9 @@ importers:
'@oku-ui/dismissable-layer':
specifier: workspace:^
version: link:packages/core/dismissable-layer
+ '@oku-ui/dropdown-menu':
+ specifier: workspace:^
+ version: link:packages/components/dropdown-menu
'@oku-ui/focus-guards':
specifier: workspace:^
version: link:packages/core/focus-guards
@@ -507,6 +511,43 @@ importers:
specifier: workspace:^
version: link:../../tsconfig
+ packages/components/dropdown-menu:
+ dependencies:
+ '@floating-ui/vue':
+ specifier: ^1.0.2
+ version: 1.0.2(vue@3.3.7)
+ '@oku-ui/direction':
+ specifier: workspace:^
+ version: link:../../core/direction
+ '@oku-ui/dismissable-layer':
+ specifier: workspace:^
+ version: link:../../core/dismissable-layer
+ '@oku-ui/focus-scope':
+ specifier: workspace:^
+ version: link:../../core/focus-scope
+ '@oku-ui/menu':
+ specifier: workspace:^
+ version: link:../../core/menu
+ '@oku-ui/primitive':
+ specifier: workspace:^
+ version: link:../../core/primitive
+ '@oku-ui/provide':
+ specifier: workspace:^
+ version: link:../../core/provide
+ '@oku-ui/use-composable':
+ specifier: workspace:^
+ version: link:../../core/use-composable
+ '@oku-ui/utils':
+ specifier: workspace:^
+ version: link:../../core/utils
+ vue:
+ specifier: 3.3.7
+ version: 3.3.7(typescript@5.2.2)
+ devDependencies:
+ tsconfig:
+ specifier: workspace:^
+ version: link:../../tsconfig
+
packages/components/hover-card:
dependencies:
'@floating-ui/vue':
@@ -1525,6 +1566,9 @@ importers:
'@oku-ui/dismissable-layer':
specifier: workspace:^
version: link:../../packages/core/dismissable-layer
+ '@oku-ui/dropdown-menu':
+ specifier: workspace:^
+ version: link:../../packages/components/dropdown-menu
'@oku-ui/focus-scope':
specifier: workspace:^
version: link:../../packages/core/focus-scope
@@ -1616,6 +1660,9 @@ importers:
'@oku-ui/checkbox':
specifier: workspace:^
version: link:../../packages/components/checkbox
+ '@oku-ui/dropdown-menu':
+ specifier: workspace:^
+ version: link:../../packages/components/dropdown-menu
'@oku-ui/label':
specifier: workspace:^
version: link:../../packages/components/label
diff --git a/vitest.config.ts b/vitest.config.ts
index 3aa08533f..cad41e1f3 100644
--- a/vitest.config.ts
+++ b/vitest.config.ts
@@ -44,6 +44,7 @@ export default defineConfig({
'@oku-ui/dialog': 'packages/components/dialog/src',
'@oku-ui/primitives': 'packages/components/primitives/src',
'@oku-ui/accordion': 'packages/components/accordion/src',
+ '@oku-ui/dropdown': 'packages/components/dropdown/src',
'@oku-ui/menu': 'packages/core/menu/src',
'@oku-ui/dismissable-layer': 'packages/core/dismissable-layer/src',
| 
|
| [Context Menu](https://github.com/oku-ui/primitives/issues/8) | A menu that appears when a user interacts with an element's trigger | Not Started | - |
| [Dialog](https://oku-ui.com/primitives/components/dialog) | 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
| 
|