@privyid/persona 1.1.2 → 1.2.0

package/dist/components/modal/Modal.vue

@@ -58,9 +58,9 @@
               data-testid="modal-body"
               class="modal__body"
               :class="[
-                { 'modal__body--scroll': modalBodyScrollable },
-                (size !== 'full' || freeDistraction) ? bodyClass : '',
-              ]">
+  { 'modal__body--scroll': modalBodyScrollable },
+  size !== 'full' || freeDistraction ? bodyClass : ''
+]">
               <div
                 v-if="size === 'full' && !freeDistraction"
                 class="modal--full__content">
@@ -122,176 +122,144 @@
   </transition>
 </template>
 
-<script lang="ts" setup>
-import type { PropType, VNode } from 'vue-demi'
+<script setup>
 import {
   computed,
   nextTick,
-  watch,
-} from 'vue-demi'
-import { onKeyStroke } from '@vueuse/core'
-import Heading from '../heading/Heading.vue'
-import Button from '../button/Button.vue'
-import IconClose from '@privyid/persona-icon/vue/close/16.vue'
-import IconCloseFull from '@privyid/persona-icon/vue/close/24.vue'
-import { useVModel } from '../input'
-import type { SizeVariant } from '.'
-
+  watch
+} from "vue-demi";
+import { onKeyStroke } from "@vueuse/core";
+import Heading from "../heading/Heading.vue";
+import Button from "../button/Button.vue";
+import IconClose from "@privyid/persona-icon/vue/close/16.vue";
+import IconCloseFull from "@privyid/persona-icon/vue/close/24.vue";
+import { useVModel } from "../input";
 const props = defineProps({
   title: {
-    type   : String,
-    default: undefined,
+    type: String,
+    default: void 0
   },
   text: {
-    type   : String,
-    default: undefined,
+    type: String,
+    default: void 0
   },
   modelValue: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   dismissable: {
-    type   : Boolean,
-    default: true,
+    type: Boolean,
+    default: true
   },
   size: {
-    type   : String as PropType<SizeVariant>,
-    default: 'md',
+    type: String,
+    default: "md"
   },
   noCloseOnEsc: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   banner: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   noCloseOnBackdrop: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   modalBodyScrollable: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   centered: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   freeDistraction: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   headerClass: {
     type: [
       String,
       Array,
-      Object,
+      Object
     ],
-    default: undefined,
+    default: void 0
   },
   dialogClass: {
     type: [
       String,
       Array,
-      Object,
+      Object
     ],
-    default: undefined,
+    default: void 0
   },
   contentClass: {
     type: [
       String,
       Array,
-      Object,
+      Object
     ],
-    default: undefined,
+    default: void 0
   },
   bodyClass: {
     type: [
       String,
       Array,
-      Object,
+      Object
     ],
-    default: undefined,
+    default: void 0
   },
   footerClass: {
     type: [
       String,
       Array,
-      Object,
+      Object
     ],
-    default: undefined,
+    default: void 0
   },
   noAnimation: {
-    type   : Boolean,
-    default: false,
-  },
-})
-
-const emit = defineEmits<{
-  'update:modelValue': [boolean],
-  'show': [],
-  'hide': [],
-  'close': [Event],
-}>()
-
-const model      = useVModel(props)
+    type: Boolean,
+    default: false
+  }
+});
+const emit = defineEmits(["update:modelValue", "show", "hide", "close"]);
+const model = useVModel(props);
 const classNames = computed(() => {
-  const result: string[] = ['']
-
-  // eslint-disable-next-line unicorn/explicit-length-check
+  const result = [""];
   if (props.size)
-    result.push(`modal--${props.size}`)
-
+    result.push(`modal--${props.size}`);
   if (props.centered)
-    result.push('modal--centered')
-
+    result.push("modal--centered");
   if (props.banner)
-    result.push('modal--banner')
-
-  if (props.freeDistraction && props.size === 'full')
-    result.push('modal--free-distraction')
-
-  return result
-})
-
-function close (): void {
-  const event = new CustomEvent('close')
-
-  emit('close', event)
-
+    result.push("modal--banner");
+  if (props.freeDistraction && props.size === "full")
+    result.push("modal--free-distraction");
+  return result;
+});
+function close() {
+  const event = new CustomEvent("close");
+  emit("close", event);
   if (!event.defaultPrevented)
-    model.value = false
+    model.value = false;
 }
-
-function closeOnBackdrop (): void {
+function closeOnBackdrop() {
   if (!props.noCloseOnBackdrop)
-    close()
+    close();
 }
-
-onKeyStroke('Escape', () => {
+onKeyStroke("Escape", () => {
   if (!props.noCloseOnEsc && model.value)
-    close()
-}, { eventName: 'keydown' })
-
+    close();
+}, { eventName: "keydown" });
 watch(model, (value) => {
   if (value === false) {
     nextTick(() => {
-      emit('close', new CustomEvent('close'))
-    })
+      emit("close", new CustomEvent("close"));
+    });
   }
-})
-
-interface SlotScope {
-  close (): void,
-}
-
-defineSlots<{
-  'header'(props: SlotScope): VNode[],
-  'body'(props: SlotScope): VNode[],
-  'footer'(props: SlotScope): VNode[],
-  'default'(props: SlotScope): VNode[],
-}>()
+});
+defineSlots();
 </script>
 
 <style lang="postcss">

package/dist/components/modal/Modal.vue.d.ts

@@ -0,0 +1,196 @@
+import type { PropType, VNode } from 'vue-demi';
+import type { SizeVariant } from '.';
+interface SlotScope {
+    close(): void;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        header(props: SlotScope): VNode[];
+        body(props: SlotScope): VNode[];
+        footer(props: SlotScope): VNode[];
+        default(props: SlotScope): VNode[];
+    }> & {
+        header(props: SlotScope): VNode[];
+        body(props: SlotScope): VNode[];
+        footer(props: SlotScope): VNode[];
+        default(props: SlotScope): VNode[];
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue-demi").DefineComponent<import("vue-demi").ExtractPropTypes<{
+    title: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    text: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    modelValue: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    dismissable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    size: {
+        type: PropType<SizeVariant>;
+        default: string;
+    };
+    noCloseOnEsc: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    banner: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    noCloseOnBackdrop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    modalBodyScrollable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    centered: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    freeDistraction: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    headerClass: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: undefined;
+    };
+    dialogClass: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: undefined;
+    };
+    contentClass: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: undefined;
+    };
+    bodyClass: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: undefined;
+    };
+    footerClass: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: undefined;
+    };
+    noAnimation: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {}, {}, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {
+    "update:modelValue": (args_0: boolean) => void;
+    close: (args_0: Event) => void;
+    show: () => void;
+    hide: () => void;
+}, string, import("vue-demi").PublicProps, Readonly<import("vue-demi").ExtractPropTypes<{
+    title: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    text: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    modelValue: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    dismissable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    size: {
+        type: PropType<SizeVariant>;
+        default: string;
+    };
+    noCloseOnEsc: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    banner: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    noCloseOnBackdrop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    modalBodyScrollable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    centered: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    freeDistraction: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    headerClass: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: undefined;
+    };
+    dialogClass: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: undefined;
+    };
+    contentClass: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: undefined;
+    };
+    bodyClass: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: undefined;
+    };
+    footerClass: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: undefined;
+    };
+    noAnimation: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((args_0: boolean) => any) | undefined;
+    onClose?: ((args_0: Event) => any) | undefined;
+    onShow?: (() => any) | undefined;
+    onHide?: (() => any) | undefined;
+}>, {
+    text: string;
+    size: SizeVariant;
+    title: string;
+    modelValue: boolean;
+    contentClass: string | unknown[] | Record<string, any>;
+    noAnimation: boolean;
+    dismissable: boolean;
+    bodyClass: string | unknown[] | Record<string, any>;
+    noCloseOnEsc: boolean;
+    banner: boolean;
+    noCloseOnBackdrop: boolean;
+    modalBodyScrollable: boolean;
+    centered: boolean;
+    freeDistraction: boolean;
+    headerClass: string | unknown[] | Record<string, any>;
+    dialogClass: string | unknown[] | Record<string, any>;
+    footerClass: string | unknown[] | Record<string, any>;
+}, {}, {}, {}, string, import("vue-demi").ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};