amelia-booking-ui 0.0.431 → 0.0.433

package/dist/types/App.vue.d.ts

@@ -1,2 +1,4 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+    buttonRef: unknown;
+}, HTMLDivElement>;
 export default _default;

package/dist/types/components/cascader/AmCascader.vue.d.ts

@@ -1,5 +1,4 @@
 interface Props {
-    popperBackground?: 'level-2-foreground' | 'level-1-foreground';
     dynamicWidth?: boolean;
     minWidth?: number;
     maxWidth?: number;
@@ -12,7 +11,6 @@ declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, imp
     onChange?: (...args: any[]) => any;
     "onUpdate:modelValue"?: (...args: any[]) => any;
 }>, {
-    popperBackground: "level-2-foreground" | "level-1-foreground";
     dynamicWidth: boolean;
     minWidth: number;
     maxWidth: number;

package/dist/types/components/color/AmColorPicker.vue.d.ts

@@ -2,14 +2,12 @@ type __VLS_Props = {
     modelValue: string;
     mode?: 'popover' | 'picker';
     valueOnClear?: string;
-    popperBackground?: 'level-2-foreground' | 'level-1-foreground';
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (...args: any[]) => void;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:modelValue"?: (...args: any[]) => any;
 }>, {
-    popperBackground: "level-2-foreground" | "level-1-foreground";
     mode: "popover" | "picker";
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     inputRef: unknown;

package/dist/types/components/datepicker/AmDatePicker.vue.d.ts

@@ -8,7 +8,6 @@ interface Props {
     prefixIconColorWhenActive?: string;
     clearIconType?: 'fill' | 'outline';
     type?: 'year' | 'years' | 'month' | 'months' | 'date' | 'dates' | 'datetime' | 'week' | 'datetimerange' | 'daterange' | 'monthrange' | 'yearrange';
-    popperBackground?: 'level-2-foreground' | 'level-1-foreground';
     rangeSeparator?: string;
     loading?: boolean;
     cellClassName?: (date: Date) => string;
@@ -22,7 +21,6 @@ declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, imp
     "onUpdate:modelValue"?: (...args: any[]) => any;
 }>, {
     type: "year" | "years" | "month" | "months" | "date" | "dates" | "datetime" | "week" | "datetimerange" | "daterange" | "monthrange" | "yearrange";
-    popperBackground: "level-2-foreground" | "level-1-foreground";
     prefixIcon: string;
     prefixIconColor: string;
     clearIconType: "fill" | "outline";

package/dist/types/components/editor/AmEditor.vue.d.ts

@@ -1,6 +1,5 @@
 type __VLS_Props = {
     modelValue?: string;
-    popperBackground?: 'level-2-foreground' | 'level-1-foreground';
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {
     editor: import('vue').ShallowRef<import('@tiptap/vue-3').Editor, import('@tiptap/vue-3').Editor>;
@@ -12,5 +11,7 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
     onInput?: (...args: any[]) => any;
     "onUpdate:modelValue"?: (...args: any[]) => any;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+    editorRef: HTMLDivElement;
+}, HTMLDivElement>;
 export default _default;

package/dist/types/components/filter/AmFilter.vue.d.ts

@@ -30,7 +30,6 @@ interface Props {
     popoverWidth?: string;
     showOnlyIconOnMobile?: boolean;
     type?: 'fill' | 'border';
-    popperBackground?: 'level-2-foreground' | 'level-1-foreground';
     isFullWidth?: boolean;
     remoteMethod?: (search: string) => Promise<void>;
 }
@@ -45,12 +44,12 @@ declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, imp
 }>, {
     type: "fill" | "border";
     size: "l" | "m" | "d" | "s" | "xs";
-    popperBackground: "level-2-foreground" | "level-1-foreground";
     placeholder: string;
     searchable: boolean;
     popoverWidth: string;
     isFullWidth: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+    filterContainerRef: HTMLDivElement;
     filterButtonRef: HTMLDivElement;
     filterPopoverRef: unknown;
 }, HTMLDivElement>;

package/dist/types/components/phone/AmPhoneInput.vue.d.ts

@@ -1,6 +1,5 @@
 interface Props {
     modelValue?: string | undefined;
-    popperBackground?: 'level-2-foreground' | 'level-1-foreground';
 }
 declare const _default: import('vue').DefineComponent<Props, {
     focus: () => void;
@@ -10,9 +9,8 @@ declare const _default: import('vue').DefineComponent<Props, {
 }, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
     "onUpdate:modelValue"?: (...args: any[]) => any;
     onUpdate?: (...args: any[]) => any;
-}>, {
-    popperBackground: "level-2-foreground" | "level-1-foreground";
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+    phoneInputRef: HTMLDivElement;
     vueTelRef: any;
 }, HTMLDivElement>;
 export default _default;

package/dist/types/components/popover/AmPopover.vue.d.ts

@@ -1,7 +1,12 @@
+import { Ref } from 'vue';
 interface Props {
     popperClass?: string;
-    popperBackground?: 'level-2-foreground' | 'level-1-foreground';
+    popperBackground?: 'level-2-foreground' | 'level-1-foreground' | null;
     isWithScrollbar?: boolean;
+    virtualRef?: Ref<globalThis.HTMLElement | null> | globalThis.HTMLElement | {
+        $el: globalThis.HTMLElement;
+    } | null;
+    virtualTriggering?: boolean;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -11,6 +16,7 @@ declare function __VLS_template(): {
         default?(_: {}): any;
     };
     refs: {
+        popoverContainerRef: HTMLDivElement;
         elPopoverRef: {
             $: import('vue').ComponentInternalInstance;
             $data: {};
@@ -555,6 +561,7 @@ declare function __VLS_template(): {
                 default?(_: {}): any;
             };
         };
+        referenceSlotRef: HTMLDivElement;
     };
     rootEl: HTMLDivElement;
 };
@@ -562,10 +569,15 @@ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<Props, {
     hide: () => void;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
-    popperBackground: "level-2-foreground" | "level-1-foreground";
     popperClass: string;
+    virtualRef: Ref<globalThis.HTMLElement | null> | globalThis.HTMLElement | {
+        $el: globalThis.HTMLElement;
+    } | null;
+    virtualTriggering: boolean;
+    popperBackground: "level-2-foreground" | "level-1-foreground" | null;
     isWithScrollbar: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+    popoverContainerRef: HTMLDivElement;
     elPopoverRef: {
         $: import('vue').ComponentInternalInstance;
         $data: {};
@@ -1110,6 +1122,7 @@ declare const __VLS_component: import('vue').DefineComponent<Props, {
             default?(_: {}): any;
         };
     };
+    referenceSlotRef: HTMLDivElement;
 }, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/types/components/select/AmSelect.vue.d.ts

@@ -9,7 +9,6 @@ interface Props {
     clearable?: boolean;
     multiple?: boolean;
     fullWidth?: boolean;
-    popperBackground?: 'level-2-foreground' | 'level-1-foreground';
     fitInputWidth?: boolean;
     automaticDropdown?: boolean;
 }
@@ -38,7 +37,6 @@ declare const __VLS_component: import('vue').DefineComponent<Props, {
 }>, {
     iconStartCategory: IconCategory;
     iconStartType: "fill" | "line" | "outline";
-    popperBackground: "level-2-foreground" | "level-1-foreground";
     automaticDropdown: boolean;
     fitInputWidth: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {

package/dist/types/index.d.ts

@@ -65,3 +65,4 @@ export type { IconCategory } from './types/icon-types';
 export type { FormInstance, FormValidateCallback } from 'element-plus';
 export type { RuleItem, ValidateError, ValidateFieldsError } from 'async-validator';
 export { default as utilCountries } from './utils/utilCountries.ts';
+export { usePopperBackground, type PopperBackgroundLevel } from './utils/utilPopper.ts';

package/dist/types/utils/utilPopper.d.ts

@@ -0,0 +1,11 @@
+import { Ref } from 'vue';
+export type PopperBackgroundLevel = 'level-1-foreground' | 'level-2-foreground';
+/**
+ * Vue composable for reactive popper background detection
+ * @param elementRef - Vue ref to the component element
+ * @returns Reactive computed property with the appropriate popper background
+ */
+declare const usePopperBackground: (elementRef: Ref<{
+    $el?: globalThis.Element;
+} | globalThis.Element | null>) => import('vue').ComputedRef<PopperBackgroundLevel>;
+export { usePopperBackground };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "amelia-booking-ui",
-  "version": "0.0.431",
+  "version": "0.0.433",
   "description": "A Vue 3 component library for Amelia Booking Plugin.",
   "type": "module",
   "repository": {