@progress/kendo-vue-dialogs 3.5.0 → 3.5.1-dev.202208150613

package/dist/es/WindowProps.js

@@ -1 +1 @@
-// tslint:enable:max-line-length
+export {}; // tslint:enable:max-line-length

package/dist/es/events.js

@@ -1 +1,2 @@
+export {};
 // tslint:enable:max-line-length

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-dialogs',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1659428826,
+    publishDate: 1660543150,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
 };

package/dist/esm/Dialog.d.ts

@@ -0,0 +1,99 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from './additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+import { DialogCloseEvent } from './events';
+/**
+ * Represents the props of the [KendoVue Dialog component]({% slug overview_dialog %}).
+ */
+export interface DialogProps {
+    /**
+     * Defines the string selector to the element to which the Dialog will be appended. Defaults to its parent element.
+     */
+    appendTo?: String;
+    /**
+     * Sets the title of the Dialog ([see example]({% slug title_dialog %})). If `title` is not specified, the Dialog does not render a **Close** button.
+     */
+    title?: string | any;
+    /**
+     * Defines the custom rendering of the title. Accepts a Vue component, a `render` function, or a slot name.
+     */
+    titleRender?: ((h: any, defaultRendering: any | null, props: any, listeners: any) => any) | string | any;
+    /**
+     * Sets a class of the Dialog DOM element.
+     */
+    className?: string;
+    /**
+     * Specifies whether a close button should be rendered at the top corner of the dialog.
+     */
+    closeIcon?: boolean;
+    /**
+     * Specifies the width of the Dialog ([see example]({% slug dimensions_dialog %})).
+     */
+    width?: number | string;
+    /**
+     * Specifies the height of the Dialog ([see example]({% slug dimensions_dialog %})).
+     */
+    height?: number | string;
+    /**
+     * Specifies the minimum width of the Dialog.
+     */
+    minWidth?: number | string;
+    /**
+     * Fires when the **Close** button in the title is clicked or when the `Esc` button is pressed.
+     */
+    onClose?: (event: DialogCloseEvent) => void;
+    /**
+     * Sets the `aria-labelledby` value.
+     */
+    id?: string;
+    /**
+     * Sets the `id` of the wrapper element.
+     */
+    wrapperId?: string;
+    /**
+     * Represents the `dir` HTML attribute.
+     */
+    dir?: string;
+    /**
+     * The styles that are applied to the Dialog.
+     */
+    style?: any;
+    /**
+     * The styles that are applied to the content of the Dialog.
+     */
+    contentStyle?: any;
+}
+/**
+ * @hidden
+ */
+export interface DialogMethods extends Vue2type {
+    handleCloseDialog: (event: any) => void;
+    handleKeyDown: (event: any) => void;
+    transformDimesion: (initialValue: string | number | undefined) => string;
+    getActionBarIndex: (children: any) => any;
+    generateTitleId: () => string;
+}
+/**
+ * @hidden
+ */
+export interface DialogState {
+    titleId?: string;
+    v3: boolean;
+    windowElement?: any;
+}
+/**
+ * @hidden
+ */
+export interface DialogAll extends DialogMethods, DialogState, DialogProps {
+}
+/**
+ * @hidden
+ */
+declare let DialogVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<DialogAll>, {}, RecordPropsDefinition<DialogProps>>;
+/**
+ * @hidden
+ */
+declare const Dialog: DefineComponent<DialogProps, any, {}, {}, DialogMethods, {}, {}, {}, string, DialogProps, DialogProps, {}>;
+export { Dialog, DialogVue2 };

package/dist/esm/Dialog.js

@@ -0,0 +1,177 @@
+// @ts-ignore
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+import { DialogTitleBar } from './DialogTitleBar.js';
+import { guid, Keys, templateRendering, hasListener, templateDefinition, getListeners, getDefaultSlots, validatePackage } from '@progress/kendo-vue-common';
+import { packageMetadata } from './package-metadata.js';
+import { DEFAULT_DIALOGS_ZINDEX } from './constants.js';
+/**
+ * @hidden
+ */
+
+var DialogVue2 = {
+  name: 'KendoDialog',
+  props: {
+    appendTo: String,
+    title: String,
+    titleRender: templateDefinition,
+    id: String,
+    wrapperId: String,
+    dir: String,
+    closeIcon: {
+      type: Boolean,
+      default: true
+    },
+    width: [String, Number],
+    height: [String, Number],
+    minWidth: [String, Number]
+  },
+  provide: function provide() {
+    return {
+      kCurrentZIndex: DEFAULT_DIALOGS_ZINDEX
+    };
+  },
+  created: function created() {
+    validatePackage(packageMetadata);
+    this.titleId = this.generateTitleId();
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    return {
+      v3: v3
+    };
+  },
+  mounted: function mounted() {
+    if (this.$props.appendTo) {
+      var body = document.querySelector(this.$props.appendTo);
+      this.windowElement = this.$refs.wrapper;
+      body.append(this.windowElement);
+    }
+  },
+  beforeDestroy: !!isV3 ? undefined : function () {
+    if (this.$props.appendTo) {
+      this.windowElement.remove();
+    }
+  },
+  // @ts-ignore
+  beforeUnmount: function beforeUnmount() {
+    if (this.$props.appendTo) {
+      this.windowElement.remove();
+    }
+  },
+  methods: {
+    handleCloseDialog: function handleCloseDialog(event) {
+      event.preventDefault();
+      this.$emit('close', {
+        event: event,
+        target: this
+      });
+    },
+    handleKeyDown: function handleKeyDown(event) {
+      if (event.keyCode === Keys.esc && hasListener.call(this, 'close')) {
+        event.preventDefault();
+        this.handleCloseDialog(event);
+      }
+    },
+    transformDimesion: function transformDimesion(initialValue) {
+      return typeof initialValue === 'string' ? initialValue.endsWith('px') || initialValue.endsWith('%') ? initialValue : initialValue + 'px' : initialValue + 'px';
+    },
+    getActionBarIndex: function getActionBarIndex(children) {
+      var actionBarIndex = children.findIndex(function (child) {
+        return child && child.tag && child.tag.toLowerCase().indexOf('dialogactionsbar') !== -1 || child.componentOptions && child.componentOptions.tag && child.componentOptions.tag.toLowerCase().indexOf('actions-bar') !== -1 || child.type && child.type.name && child.type.name.toLowerCase().indexOf('dialogactionsbar') !== -1;
+      });
+      return actionBarIndex;
+    },
+    generateTitleId: function generateTitleId() {
+      return 'dialog-title' + guid();
+    }
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var id = this.$props.id !== undefined ? this.$props.id : this.titleId;
+    var _a = this.$props,
+        title = _a.title,
+        width = _a.width,
+        height = _a.height,
+        minWidth = _a.minWidth,
+        dir = _a.dir,
+        contentStyle = _a.contentStyle,
+        wrapperId = _a.wrapperId;
+    var titleRender = this.$props.titleRender ? templateRendering.call(this, this.$props.titleRender, getListeners.call(this)) : null;
+    var defaultSlot = getDefaultSlots(this);
+    var content = defaultSlot || [];
+    width = this.transformDimesion(width);
+    height = this.transformDimesion(height);
+    minWidth = this.transformDimesion(minWidth);
+    var actionBarIndex = this.getActionBarIndex(content);
+    var actions;
+
+    if (actionBarIndex !== -1) {
+      actions = content[actionBarIndex];
+      content.splice(actionBarIndex, 1);
+    }
+
+    var closeIcon = this.$props.closeIcon !== undefined ? this.$props.closeIcon : true;
+    var dialog = h("div", {
+      ref: 'wrapper',
+      "class": 'k-dialog-wrapper',
+      onKeydown: this.handleKeyDown,
+      on: this.v3 ? undefined : {
+        "keydown": this.handleKeyDown
+      },
+      tabindex: 0,
+      attrs: this.v3 ? undefined : {
+        tabindex: 0,
+        id: wrapperId,
+        dir: dir
+      },
+      id: wrapperId,
+      dir: dir
+    }, [h("div", {
+      "class": "k-overlay"
+    }), h("div", {
+      "aria-labelledby": title || titleRender ? id : undefined,
+      attrs: this.v3 ? undefined : {
+        "aria-labelledby": title || titleRender ? id : undefined,
+        role: "dialog"
+      },
+      "class": "k-widget k-window k-dialog",
+      role: "dialog",
+      style: {
+        width: width,
+        height: height,
+        minWidth: minWidth
+      }
+    }, [(title || titleRender) && // @ts-ignore
+    h(DialogTitleBar, {
+      closeIcon: closeIcon,
+      attrs: this.v3 ? undefined : {
+        closeIcon: closeIcon,
+        id: id,
+        title: title,
+        titleRender: titleRender
+      },
+      onClosebuttonclick: this.handleCloseDialog,
+      on: this.v3 ? undefined : {
+        "closebuttonclick": this.handleCloseDialog
+      },
+      id: id,
+      title: title,
+      titleRender: titleRender
+    }), h("div", {
+      "class": "k-content k-window-content k-dialog-content",
+      style: contentStyle
+    }, [content]), actions])]);
+    return this.$props.appendTo ? h("div", [dialog]) : dialog;
+  }
+};
+/**
+ * @hidden
+ */
+
+var Dialog = DialogVue2;
+export { Dialog, DialogVue2 };

package/dist/esm/DialogActionsBar.d.ts

@@ -0,0 +1,33 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from './additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+/**
+ * @hidden
+ */
+export interface DialogActionsBarProps {
+    layout: string;
+    buttonGroupClass?: boolean;
+}
+/**
+ * @hidden
+ */
+export interface DialogActionsBarComputed {
+    [key: string]: any;
+    wrapperClasses: object;
+}
+/**
+ * @hidden
+ */
+export interface DialogActionsBarAll extends DialogActionsBarComputed, DialogActionsBarProps, Vue2type {
+}
+/**
+ * @hidden
+ */
+declare let DialogActionsBarVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<DialogActionsBarAll>, {}, RecordPropsDefinition<DialogActionsBarProps>>;
+/**
+ * @hidden
+ */
+declare const DialogActionsBar: DefineComponent<{}, any, {}, {}, {}, {}, {}, {}, string, {}, {}, {}>;
+export { DialogActionsBar, DialogActionsBarVue2 };

package/dist/esm/DialogActionsBar.js

@@ -0,0 +1,58 @@
+// @ts-ignore
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+import { getDefaultSlots } from '@progress/kendo-vue-common';
+/**
+ * @hidden
+ */
+
+var DialogActionsBarVue2 = {
+  name: 'DialogActionsBar',
+  props: {
+    layout: {
+      type: String,
+      default: 'stretched'
+    },
+    buttonGroupClass: {
+      type: Boolean,
+      default: true
+    }
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    return {
+      v3: v3
+    };
+  },
+  computed: {
+    wrapperClasses: function wrapperClasses() {
+      var layout = this.$props.layout;
+      return {
+        'k-dialog-buttongroup': this.buttonGroupClass,
+        'k-actions': true,
+        'k-hstack': true,
+        'k-justify-content-start': layout === 'start',
+        'k-justify-content-center': layout === 'center',
+        'k-justify-content-end': layout === 'end',
+        'k-justify-content-stretch': layout === 'stretched'
+      };
+    }
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var defaultSlot = getDefaultSlots(this);
+    return h("div", {
+      "class": this.wrapperClasses
+    }, [defaultSlot]);
+  }
+};
+/**
+ * @hidden
+ */
+
+var DialogActionsBar = DialogActionsBarVue2;
+export { DialogActionsBar, DialogActionsBarVue2 };

package/dist/esm/DialogTitleBar.d.ts

@@ -0,0 +1,46 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from './additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+/**
+ * @hidden
+ */
+export interface DialogTitleBarProps {
+    /**
+     * @hidden
+     */
+    onClosebuttonclick?: (event: any) => void;
+    /**
+     * @hidden
+     */
+    id?: string;
+    /**
+     * @hidden
+     */
+    closeIcon?: boolean;
+    /**
+     * Sets the title of the Dialog .
+     *  If `title` of 'titleRender' is not specified, the Dialog does not render a **Close** button.
+     */
+    title?: string | any;
+    /**
+     * Defines the custom rendering of the title. Accepts a Vue component, a `render` function, or a slot name.
+     */
+    titleRender?: ((h: any, defaultRendering: any | null, props: any, listeners: any) => any) | string | any;
+}
+/**
+ * @hidden
+ */
+export interface DialogTitleBarMethods extends Vue2type {
+    onCloseButtonClick: (event: any) => void;
+}
+/**
+ * @hidden
+ */
+declare let DialogTitleBarVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<DialogTitleBarMethods>, {}, RecordPropsDefinition<DialogTitleBarProps>>;
+/**
+ * @hidden
+ */
+declare const DialogTitleBar: DefineComponent<DialogTitleBarProps, any, {}, {}, DialogTitleBarMethods, {}, {}, {}, string, DialogTitleBarProps, DialogTitleBarProps, {}>;
+export { DialogTitleBar, DialogTitleBarVue2 };

package/dist/esm/DialogTitleBar.js

@@ -0,0 +1,82 @@
+// @ts-ignore
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+import { getTemplate } from '@progress/kendo-vue-common';
+import { Button } from '@progress/kendo-vue-buttons';
+/**
+ * @hidden
+ */
+
+var DialogTitleBarVue2 = {
+  props: {
+    id: String,
+    closeIcon: {
+      type: Boolean,
+      default: true
+    },
+    title: String,
+    titleRender: [String, Function, Object]
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    return {
+      v3: v3
+    };
+  },
+  methods: {
+    onCloseButtonClick: function onCloseButtonClick(e) {
+      this.$emit('closebuttonclick', e);
+    }
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var _a = this.$props,
+        id = _a.id,
+        closeIcon = _a.closeIcon,
+        titleRender = _a.titleRender,
+        title = _a.title;
+    var titleElement;
+    titleElement = getTemplate.call(this, {
+      h: h,
+      template: titleRender,
+      defaultRendering: title
+    });
+    return h("div", {
+      "class": "k-window-titlebar k-dialog-titlebar k-header",
+      id: id,
+      attrs: this.v3 ? undefined : {
+        id: id
+      }
+    }, [h("div", {
+      "class": "k-window-title k-dialog-title"
+    }, [titleElement]), h("div", {
+      "class": "k-window-actions k-dialog-actions"
+    }, [closeIcon && // @ts-ignore
+    h(Button, {
+      type: "button",
+      attrs: this.v3 ? undefined : {
+        type: "button",
+        fillMode: 'flat',
+        "aria-label": "Close",
+        icon: 'x'
+      },
+      fillMode: 'flat',
+      "aria-label": "Close",
+      icon: 'x',
+      onClick: this.onCloseButtonClick,
+      on: this.v3 ? undefined : {
+        "click": this.onCloseButtonClick
+      }
+    })])]);
+  }
+};
+/**
+ * @hidden
+ */
+
+var DialogTitleBar = DialogTitleBarVue2;
+export { DialogTitleBar, DialogTitleBarVue2 };

package/dist/esm/StageEnum.d.ts

@@ -0,0 +1,5 @@
+export declare enum windowStage {
+    DEFAULT = "DEFAULT",
+    FULLSCREEN = "FULLSCREEN",
+    MINIMIZED = "MINIMIZED"
+}

package/dist/esm/StageEnum.js

@@ -0,0 +1,6 @@
+export var windowStage;
+(function (windowStage) {
+    windowStage["DEFAULT"] = "DEFAULT";
+    windowStage["FULLSCREEN"] = "FULLSCREEN";
+    windowStage["MINIMIZED"] = "MINIMIZED";
+})(windowStage || (windowStage = {}));

package/dist/esm/Window.d.ts

@@ -0,0 +1,75 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from './additionalTypes';
+import { WindowProps } from './WindowProps';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+import { windowStage } from './StageEnum';
+/**
+ * @hidden
+ */
+export interface WindowComputed {
+    [key: string]: any;
+    computedTop: number;
+    computedLeft: number;
+    computedWidth: number;
+    computedHeight: number;
+    windowStage: any;
+}
+/**
+ * @hidden
+ */
+interface WindowData {
+    currentStage: windowStage | string;
+    isDragging: boolean;
+    currentTop: number;
+    currentLeft: number;
+    currentWidth: number;
+    currentHeight: number;
+}
+/**
+ * @hidden
+ */
+interface WindowState {
+    windowCoordinatesState: any;
+    draggable: any;
+    windowElement: any;
+}
+/**
+ * @hidden
+ */
+export interface WindowMethods extends Vue2type {
+    getInitialTop: () => number;
+    getInitialLeft: () => number;
+    getInitialWidth: () => number;
+    getInitialHeight: () => number;
+    dispatchMoveEvent: (eventName: string, event: any, drag: boolean, end: boolean | undefined) => void;
+    handleFullscreen: (event: any) => void;
+    handleCloseWindow: (event: any) => void;
+    handleRestore: (event: any) => void;
+    handleMinimize: (event: any) => void;
+    handleDoubleClick: (e: any) => void;
+    handleResize: (event: any, props: {
+        end: boolean;
+        direction: string;
+    }) => void;
+    onPress: (data: any) => void;
+    onDrag: (data: any) => void;
+    onRelease: (data: any) => void;
+    handleKeyDown: (event: any) => void;
+    handleBrowserWindowResize: () => void;
+}
+/**
+ * @hidden
+ */
+export interface WindowAll extends WindowMethods, WindowData, WindowState, WindowComputed {
+}
+/**
+ * @hidden
+ */
+declare let WindowVue2: ComponentOptions<Vue2type, DefaultData<WindowData>, DefaultMethods<WindowAll>, WindowComputed, RecordPropsDefinition<WindowProps>>;
+/**
+ * @hidden
+ */
+declare const Window: DefineComponent<WindowProps, any, WindowData, WindowComputed, WindowMethods, {}, {}, {}, string, WindowProps, WindowProps, {}>;
+export { Window, WindowVue2 };