@bagelink/vue 0.0.805 → 0.0.809

package/src/plugins/modal.ts

@@ -19,7 +19,7 @@ export interface ModalFormOptions extends ModalOptions {
 	'onSubmit'?: (formData: any) => any
 	'onDelete'?: (id: string) => Promise<void>
 	'onError'?: (err: any) => void
-	'modelValue'?: Record<string, any>
+	'modelValue'?: { [key: string]: any }
 	'onUpdate:modelValue'?: (val: any) => void
 }
 
@@ -39,7 +39,7 @@ type ModalType = 'modal' | 'modalForm' | 'confirmModal'
 type ConfirmModalUserOptions = string | { title: string, message: string, confirmText?: string, cancelText?: string, confirmBtnColor?: string, cancelBtnColor?: string }
 
 export interface ModalComponentProps {
-	componentSlots: Record<string, any>
+	componentSlots: { [key: string]: any }
 	modalType: ModalType
 	modalOptions: ModalOptions | ModalFormOptions | ModalConfirmOptions
 }
@@ -50,8 +50,8 @@ export interface ModalFormComponentProps extends ModalComponentProps {
 }
 
 export interface ModalApi {
-	showModal: (options: ModalOptions, slots?: Record<string, any>) => ModalComponentProps | undefined
-	showModalForm: (options: ModalFormOptions, slots?: Record<string, any>) => ModalFormComponentProps | undefined
+	showModal: (options: ModalOptions, slots?: { [key: string]: any }) => ModalComponentProps | undefined
+	showModalForm: (options: ModalFormOptions, slots?: { [key: string]: any }) => ModalFormComponentProps | undefined
 	hideModal: (index?: number) => void
 	confirmModal: (options: ConfirmModalUserOptions) => Promise<boolean>
 }
@@ -86,7 +86,7 @@ export const ModalPlugin: Plugin = {
 		const showModal = (
 			modalType: ModalType,
 			options: ModalOptions | ModalFormOptions,
-			slots: Record<string, any> = {}
+			slots: { [key: string]: any } = {}
 		): ModalComponentProps | ModalFormComponentProps | undefined => {
 			const modalComponent = {
 				modalOptions: options,
@@ -102,9 +102,9 @@ export const ModalPlugin: Plugin = {
 		}
 
 		app.provide(ModalSymbol, {
-			showModal: (options: ModalOptions, slots?: Record<string, any>) => showModal('modal', options, slots),
+			showModal: (options: ModalOptions, slots?: { [key: string]: any }) => showModal('modal', options, slots),
 
-			showModalForm: (options: ModalFormOptions, slots?: Record<string, any>) => showModal('modalForm', options, slots) as ModalFormComponentProps,
+			showModalForm: (options: ModalFormOptions, slots?: { [key: string]: any }) => showModal('modalForm', options, slots) as ModalFormComponentProps,
 
 			confirmModal: (options: ConfirmModalUserOptions) => confirmModal(options),
 

package/src/styles/appearance.css

@@ -478,6 +478,20 @@
     object-fit: scale-down;
 }
 
+
+.shadow-10 {
+    box-shadow: 0 0 10px 0 var(--bgl-shadow) !important;
+}
+
+.shadow-20,
+.shadow {
+    box-shadow: 0 0 20px 0 var(--bgl-shadow) !important;
+}
+
+.shadow-30 {
+    box-shadow: 0 0 30px 0 var(--bgl-shadow) !important;
+}
+
 .shadow-light {
     box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1) !important;
 }
@@ -1118,4 +1132,26 @@
     .m_user-select-all {
         user-select: all;
     }
+
+    .m_shadow-10 {
+        box-shadow: 0 0 10px 0 var(--bgl-shadow) !important;
+    }
+
+    .m_shadow-20,
+    .m_shadow {
+        box-shadow: 0 0 20px 0 var(--bgl-shadow) !important;
+    }
+
+    .m_shadow-30 {
+        box-shadow: 0 0 30px 0 var(--bgl-shadow) !important;
+    }
+
+    .m_shadow-light {
+        box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1) !important;
+    }
+
+    .m_shadow-txt {
+        filter: drop-shadow(0 0 10px var(--bgl-black-tint));
+    }
+
 }