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

package/dist/esm/FloatingActionButton/utils.js

@@ -0,0 +1,93 @@
+/**
+ * @hidden
+ */
+export var DEFAULT_OFFSET = '16px';
+/**
+ * @hidden
+ */
+export var toStringValues = function (val) {
+    if (typeof val === 'number') {
+        return val + 'px';
+    }
+    return val;
+};
+/**
+ * @hidden
+ */
+export var getAnchorAlign = function (fabAlign, rtl) {
+    var align = { horizontal: (rtl ? 'right' : 'left'), vertical: 'bottom' };
+    if (fabAlign.horizontal === 'end') {
+        align.horizontal = rtl ? 'left' : 'right';
+    }
+    return align;
+};
+/**
+ * @hidden
+ */
+export var getPopupAlign = function (fabAlign, rtl) {
+    var align = { horizontal: (rtl ? 'right' : 'left'), vertical: 'top' };
+    if (fabAlign.horizontal === 'end') {
+        align.horizontal = rtl ? 'left' : 'right';
+    }
+    return align;
+};
+/**
+ * @hidden
+ */
+export var getTextDirectionClass = function (rtl, hAlign) {
+    var al = hAlign === 'end' ? 'end' : 'start';
+    var directions = {
+        rtl: { end: 'k-text-left', start: 'k-text-right' },
+        ltr: { start: 'k-text-left', end: 'k-text-right' }
+    };
+    return directions[rtl][al];
+};
+/**
+ * @hidden
+ */
+export var position = function (ref, align, alignOffset, isRtl) {
+    var horizontal = align.horizontal;
+    var vertical = align.vertical;
+    if (ref) {
+        var xFab = alignOffset && alignOffset.x !== undefined ?
+            toStringValues(alignOffset.x) :
+            DEFAULT_OFFSET;
+        var xCenterFab = alignOffset && alignOffset.x !== undefined ?
+            "calc(50% + ".concat(toStringValues(alignOffset.x), ")") :
+            '50%';
+        var yFab = alignOffset && alignOffset.y !== undefined ?
+            toStringValues(alignOffset.y) :
+            DEFAULT_OFFSET;
+        var yCenterFab = alignOffset && alignOffset.y !== undefined ?
+            "calc(50% + ".concat(toStringValues(alignOffset.y), ")") :
+            '50%';
+        ref.style.setProperty(horizontalPosition(align, isRtl), horizontal === 'center' ? xCenterFab : xFab);
+        ref.style.setProperty(verticalPosition(align), vertical === 'middle' ? yCenterFab : yFab);
+        if (isRtl) {
+            if ((vertical === 'top' || vertical === 'bottom') && horizontal === 'start') {
+                ref.style.setProperty('left', 'unset');
+            }
+            if (vertical === 'middle' && horizontal === 'end') {
+                ref.style.setProperty('right', 'unset');
+            }
+            if (vertical === 'middle' && horizontal === 'start') {
+                ref.style.setProperty('left', 'unset');
+            }
+        }
+    }
+};
+var horizontalPosition = function (align, isRtl) {
+    var horizontal = align.horizontal;
+    return {
+        end: isRtl ? 'left' : 'right',
+        center: 'left',
+        start: isRtl ? 'right' : 'left'
+    }[horizontal || 'end'];
+};
+var verticalPosition = function (align) {
+    return {
+        top: 'top',
+        middle: 'top',
+        bottom: 'bottom'
+    }[align.vertical || 'bottom'];
+};

package/dist/esm/ListButton/ButtonItem.d.ts

@@ -0,0 +1,58 @@
+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;
+};
+/**
+ * The props of the ButtonItem component.
+ * The ButtonItem component renders each list item in the dropdown buttons list.
+ */
+export interface ButtonItemProps {
+    focused?: boolean;
+    index?: number;
+    item?: any;
+    render?: any;
+    dataItem: any;
+    id?: string;
+    textField?: string;
+}
+/**
+ * @hidden
+ */
+export interface ButtonItemState {
+}
+/**
+ * @hidden
+ */
+export interface ButtonItemComputed {
+    [key: string]: any;
+    wrapperClass: object;
+}
+/**
+ * @hidden
+ */
+export interface ButtonItemMethods {
+    [key: string]: any;
+    element: () => HTMLSpanElement | null;
+    onClick: (e: any) => void;
+    onDown: (e: any) => void;
+}
+/**
+ * @hidden
+ */
+export interface ButtonItemData {
+}
+/**
+ * @hidden
+ */
+export interface ButtonItemAll extends Vue2type, ButtonItemMethods, ButtonItemData, ButtonItemComputed, ButtonItemState {
+}
+/**
+ * @hidden
+ */
+declare let ButtonItemVue2: ComponentOptions<ButtonItemAll, DefaultData<ButtonItemData>, DefaultMethods<ButtonItemAll>, ButtonItemComputed, RecordPropsDefinition<ButtonItemProps>>;
+/**
+ * @hidden
+ */
+declare const ButtonItem: DefineComponent<ButtonItemProps, any, ButtonItemData, ButtonItemComputed, ButtonItemMethods, {}, {}, {}, string, ButtonItemProps, ButtonItemProps, {}>;
+export { ButtonItem, ButtonItemVue2 };

package/dist/esm/ListButton/ButtonItem.js

@@ -0,0 +1,138 @@
+// @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';
+/**
+ * @hidden
+ */
+
+var ButtonItemVue2 = {
+  name: 'KendoButtonItem',
+  // @ts-ignore
+  emits: {
+    click: null,
+    down: null
+  },
+  props: {
+    focused: Boolean,
+    index: Number,
+    item: Object,
+    render: [String, Object, Function],
+    dataItem: [String, Object],
+    id: String,
+    textField: String
+  },
+  computed: {
+    wrapperClass: function wrapperClass() {
+      return {
+        'k-item': true,
+        'k-focus': this.$props.focused
+      };
+    },
+    innerClass: function innerClass() {
+      var dataItem = this.$props.dataItem;
+      return {
+        'k-link k-menu-link': true,
+        'k-selected': dataItem.selected,
+        'k-disabled': dataItem.disabled
+      };
+    }
+  },
+  methods: {
+    onClick: function onClick(event) {
+      this.$emit('click', event, this.$props.index);
+    },
+    onDown: function onDown(event) {
+      this.$emit('down', event, this.$props.index);
+    }
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    return {
+      v3: v3
+    };
+  },
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var _a = this.$props,
+        dataItem = _a.dataItem,
+        id = _a.id,
+        render = _a.render;
+
+    var renderContent = function renderContent() {
+      var _a = this.$props,
+          textField = _a.textField,
+          index = _a.index;
+      var text = dataItem.text !== undefined ? dataItem.text : textField ? dataItem[textField] : dataItem;
+      var iconClass = dataItem.icon ? "k-icon k-i-".concat(dataItem.icon) : dataItem.iconClass;
+      var itemContent = h("span", {
+        tabindex: -1,
+        attrs: this.v3 ? undefined : {
+          tabindex: -1
+        },
+        "class": this.innerClass,
+        key: "icon"
+      }, [iconClass && h("span", {
+        "class": iconClass,
+        role: "presentation",
+        attrs: this.v3 ? undefined : {
+          role: "presentation"
+        }
+      }), dataItem.imageUrl && h("img", {
+        "class": "k-icon",
+        alt: "",
+        attrs: this.v3 ? undefined : {
+          alt: "",
+          src: dataItem.imageUrl,
+          role: "presentation"
+        },
+        src: dataItem.imageUrl,
+        role: "presentation",
+        key: "image"
+      }), text && h("span", {
+        "class": "k-menu-link-text"
+      }, [text])]);
+      return getTemplate.call(this, {
+        h: h,
+        template: this.$props.dataItem.render || render,
+        defaultRendering: itemContent,
+        additionalProps: {
+          item: dataItem,
+          itemIndex: index,
+          innerClass: this.innerClass,
+          focused: this.focused
+        }
+      });
+    };
+
+    var item = h("li", {
+      id: id,
+      attrs: this.v3 ? undefined : {
+        id: id,
+        role: "menuitem",
+        "aria-disabled": dataItem.disabled || undefined
+      },
+      "class": this.wrapperClass,
+      onClick: this.onClick,
+      on: this.v3 ? undefined : {
+        "click": this.onClick,
+        "mousedown": this.onDown,
+        "pointerdown": this.onDown
+      },
+      onMousedown: this.onDown,
+      onPointerdown: this.onDown,
+      role: "menuitem",
+      "aria-disabled": dataItem.disabled || undefined
+    }, [renderContent.call(this)]);
+    return item;
+  }
+};
+/**
+ * @hidden
+ */
+
+var ButtonItem = ButtonItemVue2;
+export { ButtonItem, ButtonItemVue2 };

package/dist/esm/ListButton/DropDownButton.d.ts

@@ -0,0 +1,66 @@
+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 { DropDownButtonProps } from './models/ListButtonProps';
+/**
+ * @hidden
+ */
+export interface DropDownButtonData {
+    focusedIndex?: number;
+    focused?: boolean;
+    currentOpened: boolean;
+}
+/**
+ * @hidden
+ */
+export interface DropDownButtonComputed {
+    [key: string]: any;
+    computedOpened: boolean;
+    wrapperClass: object;
+}
+/**
+ * @hidden
+ */
+export interface DropDownButtonMethods {
+    [key: string]: any;
+    element: () => HTMLButtonElement | null;
+    onKeyDown: (event: any) => void;
+    onFocus: (event: any) => void;
+    onBlur: (event: any) => void;
+    onItemClick: (event: any, clickedItemIndex: number) => void;
+    onItemDown: (event: any) => void;
+    mouseDown: (event: any) => void;
+    dispatchClickEvent: (dispatchedEvent: any, index: number) => void;
+    onClickMainButton: () => void;
+    dispatchPopupEvent: (dispatchedEvent: any, open: boolean) => void;
+    isItemDisabled: (index: number) => boolean;
+    isRtl: () => boolean;
+}
+/**
+ * @hidden
+ */
+export interface DropDownButtonState {
+    wrapper: HTMLDivElement | null;
+    mainButton: any;
+    guid: string;
+    buttonsData: Array<any>;
+    _anchor: string;
+    kendoAnchorRef: any;
+    v3: boolean;
+}
+/**
+ * @hidden
+ */
+export interface DropDownButtonAll extends Vue2type, DropDownButtonMethods, DropDownButtonData, DropDownButtonComputed, DropDownButtonState {
+}
+/**
+ * @hidden
+ */
+declare let DropDownButtonVue2: ComponentOptions<DropDownButtonAll, DefaultData<DropDownButtonData>, DefaultMethods<DropDownButtonAll>, DropDownButtonComputed, RecordPropsDefinition<DropDownButtonProps>>;
+/**
+ * @hidden
+ */
+declare const DropDownButton: DefineComponent<DropDownButtonProps, any, DropDownButtonData, DropDownButtonComputed, DropDownButtonMethods, {}, {}, {}, string, DropDownButtonProps, DropDownButtonProps, {}>;
+export { DropDownButton, DropDownButtonVue2 };