diff --git a/src/runtime/composables/useModal.ts b/src/runtime/composables/useModal.ts index 50b6acdf70..2586ce2f84 100644 --- a/src/runtime/composables/useModal.ts +++ b/src/runtime/composables/useModal.ts @@ -8,19 +8,27 @@ export const modalInjectionKey: InjectionKey> = Symbol('n function _useModal () { const modalState = inject(modalInjectionKey) - + const isOpen = ref(false) function open (component: T, props?: Modal & ComponentProps) { + if (!modalState) { + throw new Error('useModal() is called without provider') + } + modalState.value = { component, props: props ?? {} } + isOpen.value = true } function close () { + if (!modalState) return + isOpen.value = false + modalState.value = { component: 'div', props: {} @@ -31,6 +39,8 @@ function _useModal () { * Allows updating the modal props */ function patch (props: Partial>) { + if (!modalState) return + modalState.value = { ...modalState.value, props: { @@ -41,11 +51,11 @@ function _useModal () { } return { - isOpen, open, close, - patch + patch, + isOpen } } -export const useModal = createSharedComposable(_useModal) \ No newline at end of file +export const useModal = createSharedComposable(_useModal) diff --git a/src/runtime/composables/useSlideover.ts b/src/runtime/composables/useSlideover.ts index 3f221e2ca6..f9d527ea79 100644 --- a/src/runtime/composables/useSlideover.ts +++ b/src/runtime/composables/useSlideover.ts @@ -1,55 +1,61 @@ import { ref, inject } from 'vue' -import { createSharedComposable } from '@vueuse/core' import type { ShallowRef, Component, InjectionKey } from 'vue' +import { createSharedComposable } from '@vueuse/core' import type { ComponentProps } from '../types/component' import type { Slideover, SlideoverState } from '../types/slideover' -export const slidOverInjectionKey: InjectionKey> = - Symbol('nuxt-ui.slideover') +export const slidOverInjectionKey: InjectionKey> = Symbol('nuxt-ui.slideover') function _useSlideover () { - const slideoverState = inject(slidOverInjectionKey) - const isOpen = ref(false) + const slideoverState = inject(slidOverInjectionKey) - function open (component: T, props?: Slideover & ComponentProps) { - if (!slideoverState) { - throw new Error('useSlideover() is called without provider') - } + const isOpen = ref(false) - slideoverState.value = { - component, - props: props ?? {} - } + function open (component: T, props?: Slideover & ComponentProps) { + if (!slideoverState) { + throw new Error('useSlideover() is called without provider') + } - isOpen.value = true + slideoverState.value = { + component, + props: props ?? {} } - function close () { - if (!slideoverState) return + isOpen.value = true + } - isOpen.value = false - } + function close () { + if (!slideoverState) return + + isOpen.value = false - /** - * Allows updating the slideover props - */ - function patch (props: Partial>) { - if (!slideoverState) return - - slideoverState.value = { - ...slideoverState.value, - props: { - ...slideoverState.value.props, - ...props - } - } + slideoverState.value = { + component: 'div', + props: {} } - return { - open, - close, - patch, - isOpen + } + + /** + * Allows updating the slideover props + */ + function patch (props: Partial>) { + if (!slideoverState) return + + slideoverState.value = { + ...slideoverState.value, + props: { + ...slideoverState.value.props, + ...props + } } + } + + return { + open, + close, + patch, + isOpen + } } export const useSlideover = createSharedComposable(_useSlideover)