@nuxt/ui 2.16.0 → 2.18.0

package/dist/runtime/components/overlays/Slideover.vue.d.ts

@@ -1,4 +1,39 @@
 import type { WritableComputedRef, PropType } from 'vue';
+import type { Strategy } from '../../types.js';
+declare const config: {
+    wrapper: string;
+    overlay: {
+        base: string;
+        background: string;
+        transition: {
+            enter: string;
+            enterFrom: string;
+            enterTo: string;
+            leave: string;
+            leaveFrom: string;
+            leaveTo: string;
+        };
+    };
+    base: string;
+    background: string;
+    ring: string;
+    rounded: string;
+    padding: string;
+    shadow: string;
+    width: string;
+    height: string;
+    translate: {
+        base: string;
+        left: string;
+        right: string;
+        top: string;
+        bottom: string;
+    };
+    transition: {
+        enter: string;
+        leave: string;
+    };
+};
 declare const _default: import("vue").DefineComponent<{
     modelValue: {
         type: PropType<boolean>;
@@ -9,7 +44,7 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     side: {
-        type: PropType<"left" | "right">;
+        type: PropType<"left" | "right" | "top" | "bottom">;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -30,19 +65,55 @@ declare const _default: import("vue").DefineComponent<{
         default: () => string;
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }, {
-    ui: import("vue").ComputedRef<any>;
+    ui: import("vue").ComputedRef<{
+        wrapper: string;
+        overlay: {
+            base: string;
+            background: string;
+            transition: {
+                enter: string;
+                enterFrom: string;
+                enterTo: string;
+                leave: string;
+                leaveFrom: string;
+                leaveTo: string;
+            };
+        };
+        base: string;
+        background: string;
+        ring: string;
+        rounded: string;
+        padding: string;
+        shadow: string;
+        width: string;
+        height: string;
+        translate: {
+            base: string;
+            left: string;
+            right: string;
+            top: string;
+            bottom: string;
+        };
+        transition: {
+            enter: string;
+            leave: string;
+        };
+    }>;
     attrs: import("vue").ComputedRef<Pick<{
         [x: string]: unknown;
     }, string>>;
     isOpen: WritableComputedRef<boolean>;
-    transitionClass: import("vue").ComputedRef<any>;
+    transitionClass: import("vue").ComputedRef<{}>;
+    sideType: import("vue").ComputedRef<"horizontal" | "vertical" | "right">;
     onAfterLeave: () => void;
     close: (value: boolean) => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "close" | "close-prevented" | "after-leave")[], "update:modelValue" | "close" | "close-prevented" | "after-leave", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("close" | "update:modelValue" | "close-prevented" | "after-leave")[], "close" | "update:modelValue" | "close-prevented" | "after-leave", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: {
         type: PropType<boolean>;
         default: boolean;
@@ -52,7 +123,7 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     side: {
-        type: PropType<"left" | "right">;
+        type: PropType<"left" | "right" | "top" | "bottom">;
         default: string;
         validator: (value: string) => boolean;
     };
@@ -73,22 +144,24 @@ declare const _default: import("vue").DefineComponent<{
         default: () => string;
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }>> & {
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
-    onClose?: ((...args: any[]) => any) | undefined;
-    "onClose-prevented"?: ((...args: any[]) => any) | undefined;
-    "onAfter-leave"?: ((...args: any[]) => any) | undefined;
+    onClose?: (...args: any[]) => any;
+    "onUpdate:modelValue"?: (...args: any[]) => any;
+    "onClose-prevented"?: (...args: any[]) => any;
+    "onAfter-leave"?: (...args: any[]) => any;
 }, {
+    ui: {};
     class: any;
     transition: boolean;
-    ui: any;
-    modelValue: boolean;
     appear: boolean;
     overlay: boolean;
     preventClose: boolean;
-    side: "left" | "right";
+    side: "right" | "left" | "top" | "bottom";
+    modelValue: boolean;
 }, {}>;
 export default _default;

package/dist/runtime/components/overlays/Tooltip.vue.d.ts

@@ -1,9 +1,45 @@
 import type { PropType } from 'vue';
-import type { PopperOptions } from '../../types';
+import type { PopperOptions, Strategy } from '../../types.js';
+declare const config: {
+    wrapper: string;
+    container: string;
+    width: string;
+    background: string;
+    color: string;
+    shadow: string;
+    rounded: string;
+    ring: string;
+    base: string;
+    shortcuts: string;
+    middot: string;
+    transition: {
+        enterActiveClass: string;
+        enterFromClass: string;
+        enterToClass: string;
+        leaveActiveClass: string;
+        leaveFromClass: string;
+        leaveToClass: string;
+    };
+    popper: {
+        strategy: string;
+    };
+    default: {
+        openDelay: number;
+        closeDelay: number;
+    };
+    arrow: {
+        base: string;
+        ring: string;
+        rounded: string;
+        background: string;
+        shadow: string;
+        placement: string;
+    };
+};
 declare const _default: import("vue").DefineComponent<{
     text: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     prevent: {
         type: BooleanConstructor;
@@ -11,15 +47,15 @@ declare const _default: import("vue").DefineComponent<{
     };
     shortcuts: {
         type: PropType<string[]>;
-        default: () => never[];
+        default: () => any[];
     };
     openDelay: {
         type: NumberConstructor;
-        default: () => any;
+        default: () => number;
     };
     closeDelay: {
         type: NumberConstructor;
-        default: () => any;
+        default: () => number;
     };
     popper: {
         type: PropType<PopperOptions>;
@@ -30,11 +66,48 @@ declare const _default: import("vue").DefineComponent<{
         default: () => string;
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }, {
-    ui: import("vue").ComputedRef<any>;
+    ui: import("vue").ComputedRef<{
+        wrapper: string;
+        container: string;
+        width: string;
+        background: string;
+        color: string;
+        shadow: string;
+        rounded: string;
+        ring: string;
+        base: string;
+        shortcuts: string;
+        middot: string;
+        transition: {
+            enterActiveClass: string;
+            enterFromClass: string;
+            enterToClass: string;
+            leaveActiveClass: string;
+            leaveFromClass: string;
+            leaveToClass: string;
+        };
+        popper: {
+            strategy: string;
+        };
+        default: {
+            openDelay: number;
+            closeDelay: number;
+        };
+        arrow: {
+            base: string;
+            ring: string;
+            rounded: string;
+            background: string;
+            shadow: string;
+            placement: string;
+        };
+    }>;
     attrs: import("vue").ComputedRef<Pick<{
         [x: string]: unknown;
     }, string>>;
@@ -47,7 +120,7 @@ declare const _default: import("vue").DefineComponent<{
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     text: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     prevent: {
         type: BooleanConstructor;
@@ -55,15 +128,15 @@ declare const _default: import("vue").DefineComponent<{
     };
     shortcuts: {
         type: PropType<string[]>;
-        default: () => never[];
+        default: () => any[];
     };
     openDelay: {
         type: NumberConstructor;
-        default: () => any;
+        default: () => number;
     };
     closeDelay: {
         type: NumberConstructor;
-        default: () => any;
+        default: () => number;
     };
     popper: {
         type: PropType<PopperOptions>;
@@ -74,17 +147,19 @@ declare const _default: import("vue").DefineComponent<{
         default: () => string;
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }>>, {
-    text: string;
+    ui: {};
+    shortcuts: string[];
     class: any;
     popper: PopperOptions;
-    ui: any;
+    text: string;
     openDelay: number;
     closeDelay: number;
     prevent: boolean;
-    shortcuts: string[];
 }, {}>;
 export default _default;

package/dist/runtime/composables/{defineShortcuts.mjs → defineShortcuts.js}

@@ -1,7 +1,7 @@
 import { ref, computed } from "vue";
 import { logicAnd, logicNot } from "@vueuse/math";
 import { useEventListener, useDebounceFn } from "@vueuse/core";
-import { useShortcuts } from "./useShortcuts.mjs";
+import { useShortcuts } from "./useShortcuts.js";
 const chainedShortcutRegex = /^[^-]+.*-.*[^-]+$/;
 const combinedShortcutRegex = /^[^_]+.*_.*[^_]+$/;
 export const defineShortcuts = (config, options = {}) => {

package/dist/runtime/composables/{useButtonGroup.mjs → useButtonGroup.js}

@@ -44,16 +44,15 @@ export function useInjectButtonGroup({ ui, props }) {
     groupContext?.value.unregister(instance);
   });
   return {
-    size: computed(() => groupContext?.value.size || props.size),
+    size: computed(() => {
+      if (!groupContext?.value) return props.size;
+      return groupContext?.value.size ?? ui.value.default.size;
+    }),
     rounded: computed(() => {
-      if (!groupContext || positionInGroup.value === -1)
-        return ui.value.rounded;
-      if (groupContext.value.children.length === 1)
-        return groupContext.value.ui.rounded;
-      if (positionInGroup.value === 0)
-        return groupContext.value.rounded.start;
-      if (positionInGroup.value === groupContext.value.children.length - 1)
-        return groupContext.value.rounded.end;
+      if (!groupContext || positionInGroup.value === -1) return ui.value.rounded;
+      if (groupContext.value.children.length === 1) return groupContext.value.ui.rounded;
+      if (positionInGroup.value === 0) return groupContext.value.rounded.start;
+      if (positionInGroup.value === groupContext.value.children.length - 1) return groupContext.value.rounded.end;
       return "rounded-none";
     })
   };

package/dist/runtime/composables/{useCarouselScroll.mjs → useCarouselScroll.js}

@@ -11,11 +11,13 @@ export const useCarouselScroll = (el) => {
   function onMouseUp() {
     el.value.style.removeProperty("scroll-behavior");
     el.value.style.removeProperty("scroll-snap-type");
+    el.value.style.removeProperty("pointer-events");
     window.removeEventListener("mousemove", onMouseMove);
     window.removeEventListener("mouseup", onMouseUp);
   }
   function onMouseMove(e) {
     e.preventDefault();
+    el.value.style.pointerEvents = "none";
     const delta = e.pageX - x.value;
     x.value = e.pageX;
     el.value.scrollBy(-delta, 0);

package/dist/runtime/composables/useCopyToClipboard.d.ts

@@ -1,4 +1,4 @@
-import type { Notification } from '../types/notification';
+import type { Notification } from '../types/notification.js';
 export declare function useCopyToClipboard(options?: Partial<Notification>): {
     copy: (text: string, success?: {
         title?: string;

package/dist/runtime/composables/{useCopyToClipboard.mjs → useCopyToClipboard.js}

@@ -1,5 +1,5 @@
 import { useClipboard } from "@vueuse/core";
-import { useToast } from "./useToast.mjs";
+import { useToast } from "./useToast.js";
 export function useCopyToClipboard(options = {}) {
   const { copy: copyToClipboard, isSupported } = useClipboard();
   const toast = useToast();

package/dist/runtime/composables/useFormGroup.d.ts

@@ -7,12 +7,12 @@ type InputProps = {
     legend?: string | null;
 };
 export declare const useFormGroup: (inputProps?: InputProps, config?: any) => {
-    inputId: import("vue").ComputedRef<string | undefined>;
-    name: import("vue").ComputedRef<string | undefined>;
-    size: import("vue").ComputedRef<any>;
-    color: import("vue").ComputedRef<string | undefined>;
+    inputId: import("vue").ComputedRef<string>;
+    name: import("vue").ComputedRef<string>;
+    size: import("vue").ComputedRef<string | number | symbol>;
+    color: import("vue").ComputedRef<string>;
     emitFormBlur: () => void;
-    emitFormInput: import("@vueuse/core").PromisifyFn<() => void>;
+    emitFormInput: import("@vueuse/shared").PromisifyFn<() => void>;
     emitFormChange: () => void;
 };
 export {};

package/dist/runtime/composables/useFormGroup.js

@@ -0,0 +1,49 @@
+import { inject, ref, computed } from "vue";
+import { useDebounceFn } from "@vueuse/core";
+import { mergeConfig } from "../utils/index.js";
+import appConfig from "#build/app.config";
+import { formGroup } from "#ui/ui.config";
+const formGroupConfig = mergeConfig(appConfig.ui.strategy, appConfig.ui.formGroup, formGroup);
+export const useFormGroup = (inputProps, config) => {
+  const formBus = inject("form-events", void 0);
+  const formGroup2 = inject("form-group", void 0);
+  const formInputs = inject("form-inputs", void 0);
+  if (formGroup2) {
+    if (inputProps?.id) {
+      formGroup2.inputId.value = inputProps?.id;
+    }
+    if (formInputs) {
+      formInputs.value[formGroup2.name.value] = formGroup2.inputId.value;
+    }
+  }
+  const blurred = ref(false);
+  function emitFormEvent(type, path) {
+    if (formBus) {
+      formBus.emit({ type, path });
+    }
+  }
+  function emitFormBlur() {
+    emitFormEvent("blur", formGroup2?.name.value);
+    blurred.value = true;
+  }
+  function emitFormChange() {
+    emitFormEvent("change", formGroup2?.name.value);
+  }
+  const emitFormInput = useDebounceFn(() => {
+    if (blurred.value || formGroup2?.eagerValidation.value) {
+      emitFormEvent("input", formGroup2?.name.value);
+    }
+  }, 300);
+  return {
+    inputId: computed(() => inputProps?.id ?? formGroup2?.inputId.value),
+    name: computed(() => inputProps?.name ?? formGroup2?.name.value),
+    size: computed(() => {
+      const formGroupSize = config.size[formGroup2?.size.value] ? formGroup2?.size.value : null;
+      return inputProps?.size ?? formGroupSize ?? formGroupConfig?.default?.size;
+    }),
+    color: computed(() => formGroup2?.error?.value ? "red" : inputProps?.color),
+    emitFormBlur,
+    emitFormInput,
+    emitFormChange
+  };
+};

package/dist/runtime/composables/useModal.d.ts

@@ -1,12 +1,12 @@
 import type { ShallowRef, Component, InjectionKey } from 'vue';
-import type { ComponentProps } from '../types/component';
-import type { Modal, ModalState } from '../types/modal';
+import type { ComponentProps } from '../types/component.js';
+import type { Modal, ModalState } from '../types/modal.js';
 export declare const modalInjectionKey: InjectionKey<ShallowRef<ModalState>>;
 declare function _useModal(): {
     open: <T extends Component>(component: T, props?: Modal & ComponentProps<T>) => void;
     close: () => Promise<void>;
     reset: () => void;
-    patch: <T_1 extends Component = {}>(props: Partial<Modal & ComponentProps<T_1>>) => void;
+    patch: <T extends Component = {}>(props: Partial<Modal & ComponentProps<T>>) => void;
     isOpen: import("vue").Ref<boolean>;
 };
 export declare const useModal: typeof _useModal;

package/dist/runtime/composables/{useModal.mjs → useModal.js}

@@ -15,8 +15,7 @@ function _useModal() {
     isOpen.value = true;
   }
   async function close() {
-    if (!modalState)
-      return;
+    if (!modalState) return;
     isOpen.value = false;
   }
   function reset() {
@@ -26,8 +25,7 @@ function _useModal() {
     };
   }
   function patch(props) {
-    if (!modalState)
-      return;
+    if (!modalState) return;
     modalState.value = {
       ...modalState.value,
       props: {