@progress/kendo-vue-inputs 5.3.0-dev.202409130647 → 5.3.0-develop.1

package/dist/es/checkbox/Checkbox.js

@@ -1,363 +0,0 @@
-// @ts-ignore
-import * as Vue from 'vue';
-var allVue = Vue;
-var gh = allVue.h;
-var isV3 = allVue.version && allVue.version[0] === '3';
-var ref = allVue.ref;
-var inject = allVue.inject;
-import { Keys, classNames, guid, getTabIndex, getDefaultSlots, validatePackage, templateRendering, getTemplate, getListeners, kendoThemeMaps, setRef, getRef } from '@progress/kendo-vue-common';
-import { packageMetadata } from '../package-metadata';
-import { provideLocalizationService } from '@progress/kendo-vue-intl';
-import { messages, checkboxValidation, checkboxOptionalText } from '../messages/main';
-/**
- * @hidden
- */
-var CheckboxVue2 = {
-  name: 'KendoCheckbox',
-  // @ts-ignore
-  emits: {
-    'changemodel': null,
-    'update:modelValue': null,
-    change: null,
-    focus: null,
-    blur: null
-  },
-  model: {
-    event: 'changemodel'
-  },
-  inject: {
-    kendoLocalizationService: {
-      default: null
-    }
-  },
-  props: {
-    checked: {
-      type: Boolean,
-      default: undefined
-    },
-    defaultChecked: {
-      type: Boolean,
-      default: undefined
-    },
-    defaultValue: {
-      type: [String, Boolean],
-      default: undefined
-    },
-    modelValue: {
-      type: [String, Boolean],
-      default: undefined
-    },
-    dir: String,
-    disabled: Boolean,
-    id: String,
-    ariaLabelledBy: String,
-    ariaDescribedBy: String,
-    label: String,
-    labelRender: [String, Number, Boolean, Object],
-    labelPlacement: String,
-    labelOptional: Boolean,
-    labelClass: String,
-    name: String,
-    size: {
-      type: String,
-      default: 'medium',
-      validator: function validator(value) {
-        return [null, 'small', 'medium', 'large'].includes(value);
-      }
-    },
-    rounded: {
-      type: String,
-      default: 'medium',
-      validator: function validator(value) {
-        return [null, 'small', 'medium', 'large'].includes(value);
-      }
-    },
-    tabIndex: Number,
-    value: {
-      type: [String, Boolean],
-      default: undefined
-    },
-    validationMessage: String,
-    required: Boolean,
-    valid: {
-      type: Boolean,
-      default: undefined
-    },
-    validityStyles: {
-      type: Boolean,
-      default: true
-    }
-  },
-  data: function data() {
-    return {
-      valueDuringOnChange: undefined,
-      currentDir: 'ltr',
-      currentChecked: undefined,
-      currentValue: undefined
-    };
-  },
-  created: function created() {
-    validatePackage(packageMetadata);
-    this.calculatedId = guid();
-    if (this.$props.defaultChecked !== undefined) {
-      this.currentChecked = this.$props.defaultChecked;
-    }
-    if (this.$props.defaultValue !== undefined) {
-      this.currentValue = this.$props.defaultValue;
-    }
-    this.currentDir = this.$props.dir;
-  },
-  computed: {
-    valueIsBooleanOrNull: function valueIsBooleanOrNull() {
-      var value = this.$props.value;
-      return typeof value === 'boolean' || value === null;
-    },
-    isCheckedControlled: function isCheckedControlled() {
-      return this.$props.checked !== undefined;
-    },
-    isValueControlled: function isValueControlled() {
-      return this.$props.value !== undefined && this.valueIsBooleanOrNull;
-    },
-    computedValue: function computedValue() {
-      return this.$data.valueDuringOnChange !== undefined ? this.$data.valueDuringOnChange : this.$props.value !== undefined ? this.$props.value : this.$props.modelValue !== undefined ? this.$props.modelValue : this.$data.currentValue;
-    },
-    computedChecked: function computedChecked() {
-      return this.$data.valueDuringOnChange !== undefined ? this.$data.valueDuringOnChange : this.$props.checked !== undefined ? this.$props.checked : this.$props.modelValue !== undefined ? this.$props.modelValue : this.$data.currentChecked;
-    },
-    useValueAsChecked: function useValueAsChecked() {
-      return this.computedChecked === undefined && this.computedValue;
-    },
-    checkedProp: function checkedProp() {
-      return this.useValueAsChecked ? this.computedValue : this.computedChecked;
-    },
-    valueProp: function valueProp() {
-      var value = this.$props.value;
-      return this.useValueAsChecked || this.isValueControlled ? value === null ? value : undefined : value || this.computedValue;
-    },
-    indeterminateProp: function indeterminateProp() {
-      return this.checkedProp === null || this.valueProp === null;
-    },
-    isValid: function isValid() {
-      var valid = this.$props.valid;
-      return valid !== undefined ? valid : !this.$props.required ? true : this.computedChecked ? true : false;
-    },
-    labelComputedClass: function labelComputedClass() {
-      var _a;
-      return _a = {
-        'k-checkbox-label': true
-      }, _a[this.$props.labelClass] = this.$props.labelClass, _a;
-    }
-  },
-  mounted: function mounted() {
-    this.input = getRef(this, 'input');
-    if (!this.currentDir && window && this.$el) {
-      // Note: getComputedStyle forces reflow
-      var direction = window.getComputedStyle(this.$el).direction;
-      if (direction) {
-        this.currentDir = direction;
-      }
-    }
-    this.setValidity();
-  },
-  updated: function updated() {
-    if (!this.input) {
-      this.input = getRef(this, 'input');
-    }
-    this.setValidity();
-  },
-  // @ts-ignore
-  setup: !isV3 ? undefined : function () {
-    var v3 = !!isV3;
-    var inputRef = ref(null);
-    var kendoLocalizationService = inject('kendoLocalizationService', {});
-    return {
-      v3: v3,
-      inputRef: inputRef,
-      kendoLocalizationService: kendoLocalizationService
-    };
-  },
-  render: function render(createElement) {
-    var _a;
-    var h = gh || createElement;
-    var _b = this.$props,
-      ariaDescribedBy = _b.ariaDescribedBy,
-      ariaLabelledBy = _b.ariaLabelledBy,
-      disabled = _b.disabled,
-      id = _b.id,
-      label = _b.label,
-      labelRender = _b.labelRender,
-      labelPlacement = _b.labelPlacement,
-      name = _b.name,
-      labelOptional = _b.labelOptional,
-      tabIndex = _b.tabIndex,
-      required = _b.required,
-      validityStyles = _b.validityStyles,
-      size = _b.size,
-      rounded = _b.rounded;
-    var defaultSlot = getDefaultSlots(this);
-    var renderedLabel = label;
-    this.localizationService = provideLocalizationService(this);
-    this.defaultValidationMessage = this.localizeMessage(checkboxValidation);
-    this.optionalMessage = this.localizeMessage(checkboxOptionalText);
-    var checkboxClasses = classNames({
-      'k-checkbox-wrap': true,
-      'k-disabled': disabled
-    });
-    var inputClasses = classNames((_a = {
-      'k-checkbox': true
-    }, _a["k-checkbox-".concat(kendoThemeMaps.sizeMap[size])] = size, _a["k-rounded-".concat(kendoThemeMaps.roundedMap[rounded])] = rounded, _a['k-indeterminate'] = this.indeterminateProp, _a['k-disabled'] = disabled, _a['k-invalid'] = !this.isValid && validityStyles !== false, _a));
-    var checkboxInput = function checkboxInput() {
-      return h("input", {
-        type: 'checkbox',
-        attrs: this.v3 ? undefined : {
-          type: 'checkbox',
-          name: name,
-          id: id || this.calculatedId,
-          "aria-labelledby": ariaLabelledBy,
-          "aria-describedby": ariaDescribedBy,
-          disabled: disabled,
-          tabindex: getTabIndex(tabIndex, disabled),
-          role: 'checkbox',
-          required: required !== undefined ? required : false,
-          "aria-checked": this.computedChecked || this.checkedProp ? true : this.indeterminateProp ? 'mixed' : false,
-          "aria-disabled": disabled || undefined
-        },
-        "class": inputClasses,
-        name: name,
-        id: id || this.calculatedId,
-        ref: setRef(this, 'input'),
-        "aria-labelledby": ariaLabelledBy,
-        "aria-describedby": ariaDescribedBy,
-        checked: this.v3 ? Boolean(this.checkedProp) : null,
-        domProps: this.v3 ? undefined : {
-          "checked": Boolean(this.checkedProp)
-        },
-        disabled: disabled,
-        tabindex: getTabIndex(tabIndex, disabled),
-        role: 'checkbox',
-        required: required !== undefined ? required : false,
-        "aria-checked": this.computedChecked || this.checkedProp ? true : this.indeterminateProp ? 'mixed' : false,
-        "aria-disabled": disabled || undefined,
-        onChange: this.onChangeHandler,
-        on: this.v3 ? undefined : {
-          "change": this.onChangeHandler,
-          "keydown": this.onKeyDownHandler,
-          "focus": this.onFocusHandler,
-          "blur": this.onBlurHandler
-        },
-        onKeydown: this.onKeyDownHandler,
-        onFocus: this.onFocusHandler,
-        onBlur: this.onBlurHandler
-      });
-    };
-    if (labelRender) {
-      var renderTemplate = labelRender ? templateRendering.call(this, labelRender, getListeners.call(this)) : null;
-      renderedLabel = getTemplate.call(this, {
-        h: h,
-        template: renderTemplate
-      });
-    }
-    var checkboxLabel = function checkboxLabel() {
-      return renderedLabel !== undefined ? h("label", {
-        "class": this.labelComputedClass,
-        "for": id || this.calculatedId,
-        attrs: this.v3 ? undefined : {
-          "for": id || this.calculatedId
-        },
-        style: {
-          userSelect: 'none'
-        }
-      }, [renderedLabel, labelOptional && h("span", {
-        "class": "k-label-optional"
-      }, [this.optionalMessage])]) : null;
-    };
-    return labelPlacement === 'before' ? h("span", {
-      "class": checkboxClasses,
-      dir: 'rtl',
-      attrs: this.v3 ? undefined : {
-        dir: 'rtl'
-      }
-    }, [checkboxInput.call(this), checkboxLabel.call(this), defaultSlot]) : h("span", {
-      "class": checkboxClasses,
-      dir: this.currentDir,
-      attrs: this.v3 ? undefined : {
-        dir: this.currentDir
-      }
-    }, [checkboxInput.call(this), checkboxLabel.call(this), defaultSlot]);
-  },
-  methods: {
-    setValidity: function setValidity() {
-      var isValid = this.$props.valid !== undefined ? this.$props.valid : !this.$props.required ? true : this.computedChecked ? true : false;
-      // @ts-ignore
-      if (this.input && this.input.setCustomValidity) {
-        // @ts-ignore
-        this.input.setCustomValidity(isValid ? '' : this.$props.validationMessage || this.defaultValidationMessage);
-      }
-    },
-    localizeMessage: function localizeMessage(message) {
-      return this.localizationService.toLanguageString(message, messages[message]);
-    },
-    focusElement: function focusElement() {
-      if (this.input) {
-        // @ts-ignore
-        this.input.focus();
-      }
-    },
-    setValue: function setValue(e, val) {
-      this.$data.valueDuringOnChange = val;
-      var that = this;
-      this.$nextTick(function () {
-        if (!that.isCheckedControlled && !that.isValueControlled && !that.$props.disabled) {
-          that.currentValue = val;
-          that.currentChecked = val;
-        }
-        if (!that.$props.disabled) {
-          var handle = {
-            element: that.$el,
-            focus: null // focusElement
-          };
-
-          that.$emit('changemodel', val);
-          that.$emit('update:modelValue', val);
-          that.$emit('change', {
-            e: e,
-            handle: handle,
-            value: val
-          });
-        }
-        this.$data.valueDuringOnChange = undefined;
-      });
-    },
-    onChangeHandler: function onChangeHandler(e) {
-      var newValue = e.target.checked;
-      this.setValue(e, newValue);
-    },
-    onKeyDownHandler: function onKeyDownHandler(e) {
-      if (this.$props.disabled) {
-        return;
-      }
-      var keyCode = e.keyCode;
-      var currentVal = e.currentTarget.checked;
-      if (keyCode === Keys.space) {
-        e.preventDefault();
-        e.stopPropagation();
-        this.setValue(e, !currentVal);
-      }
-    },
-    onBlurHandler: function onBlurHandler(e) {
-      if (!this.$props.disabled) {
-        this.$emit('blur', e);
-      }
-    },
-    onFocusHandler: function onFocusHandler(e) {
-      if (!this.$props.disabled) {
-        this.$emit('focus', e);
-      }
-    }
-  }
-};
-/**
- * @hidden
- */
-var Checkbox = CheckboxVue2;
-export { Checkbox, CheckboxVue2 };

package/dist/es/checkbox/interfaces/CheckboxChangeEvent.d.ts

@@ -1,9 +0,0 @@
-/**
- * The arguments for the `onChange` Checkbox event.
- */
-export interface CheckboxChangeEvent {
-    /**
-     * The new value of the Checkbox.
-     */
-    value: boolean;
-}

package/dist/es/checkbox/interfaces/CheckboxChangeEvent.js

@@ -1 +0,0 @@
-export {};

package/dist/es/checkbox/interfaces/CheckboxFocusEvent.d.ts

@@ -1,5 +0,0 @@
-/**
- * The arguments for the `onFocus` Checkbox event.
- */
-export interface CheckboxFocusEvent {
-}

package/dist/es/checkbox/interfaces/CheckboxFocusEvent.js

@@ -1 +0,0 @@
-export {};

package/dist/es/checkbox/interfaces/CheckboxProps.d.ts

@@ -1,114 +0,0 @@
-import { ToggleBaseProps } from '../../interfaces/ToggleBaseProps';
-import { FormComponentProps } from '@progress/kendo-vue-common';
-import { CheckboxChangeEvent } from './CheckboxChangeEvent';
-import { CheckboxFocusEvent } from './CheckboxFocusEvent';
-/**
- * Represents the props of the [Kendo UI for Vue Checkbox component]({% slug overview_checkbox %}).
- */
-export interface CheckboxProps extends ToggleBaseProps, FormComponentProps {
-    /**
-     * Sets the checked state of the Checkbox.
-     * Set to null to enable the indeterminate state of the Checkbox ([see example]({% slug overview_checkbox %})).
-     */
-    checked?: boolean | null;
-    /**
-     * @hidden
-     */
-    modelValue?: string | number | string[] | boolean | null;
-    /**
-     * If the type is different than boolean and the `checked` property is provided it's
-     *  passed to the underlying `input` element.
-     * If set to boolean and the `checked` property is omitted sets the checked state of the Checkbox.
-     * Set null to enable the indeterminate state of the Checkbox ([see example]({% slug overview_checkbox %})).
-     */
-    value?: string | number | string[] | boolean | null;
-    /**
-     * Sets the default value of checked attribute when used in
-     *  uncontrolled mode ([see example]({% slug default_state %})).
-     */
-    defaultChecked?: boolean;
-    /**
-     * The default value of the Checkbox.
-     */
-    defaultValue?: any;
-    /**
-     * Represents the `dir` HTML attribute. This is used to switch from LTR to RTL.
-     */
-    dir?: string;
-    /**
-     * Sets the disabled state of the Checkbox
-     * ([see example]({% slug disabled_checkbox %})).
-     */
-    disabled?: boolean;
-    /**
-     * Sets the `id` of the Checkbox.
-     */
-    id?: string;
-    /**
-     * Configures the `size` of the Checkbox.
-     *
-     * The available options are:
-     * - small
-     * - medium
-     * - large
-     * - null—Does not set a size `className`.
-     *
-     * @default `medium`
-     */
-    size?: null | 'small' | 'medium' | 'large' | string;
-    /**
-     * Configures the `rounded` style of the Checkbox.
-     *
-     * The available options are:
-     * - small
-     * - medium
-     * - large
-     * - null—Does not set a rounded `className`.
-     *
-     * @default `medium`
-     */
-    rounded?: null | 'small' | 'medium' | 'large' | string;
-    /**
-     * Identifies the element(s) which will describe the component, similar to [HTML aria-describedby attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute).
-     * For example these elements could contain error or hint message.
-     */
-    ariaDescribedBy?: string;
-    /**
-     * Identifies the element(s) which will label the component.
-     */
-    ariaLabelledBy?: string;
-    /**
-     * Sets the label of the Checkbox component ([see example]({% slug labels_checkbox %})).
-     */
-    label?: string | HTMLElement;
-    /**
-     * Sets the label render template of the Checkbox component.
-     *  Accepts a slot name, a `render` function, or a Vue component.
-     */
-    labelRender?: any;
-    /**
-     * Sets the label position of the Checkbox component 'before' | 'after' ([see example]({% slug labels_checkbox %})).
-     */
-    labelPlacement?: string;
-    /**
-     * Sets the optional text after the label of the Checkbox component.
-     */
-    labelOptional?: boolean;
-    /**
-     * Sets the `class` of the label element of the Checkbox.
-     */
-    labelClass?: string;
-    /**
-     * The event handler that will be fired when the user edits the value.
-     */
-    onChange?: (event: CheckboxChangeEvent) => void;
-    /**
-     * The event handler that will be fired when Checkbox is focused.
-     */
-    onFocus?: (event: CheckboxFocusEvent) => void;
-    /**
-     * Sets the `tabIndex` property of the Checkbox.
-     * Defaults to `0`.
-     */
-    tabIndex?: number;
-}

package/dist/es/checkbox/interfaces/CheckboxProps.js

@@ -1 +0,0 @@
-export {};

package/dist/es/colors/ColorContrastLabels.d.ts

@@ -1,49 +0,0 @@
-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 { RGBA } from './models/rgba';
-/**
- * @hidden
- */
-export interface ColorContrastLabelsProps {
-    bgColor: RGBA;
-    rgba: RGBA;
-}
-/**
- * @hidden
- */
-export interface ColorContrastLabelsState {
-}
-/**
- * @hidden
- */
-export interface ColorContrastLabelsComputed {
-    [key: string]: any;
-}
-/**
- * @hidden
- */
-export interface ColorContrastLabelsMethods {
-    [key: string]: any;
-}
-/**
- * @hidden
- */
-export interface ColorContrastLabelsData {
-}
-/**
- * @hidden
- */
-export interface ColorContrastLabelsAll extends Vue2type, ColorContrastLabelsMethods, ColorContrastLabelsData, ColorContrastLabelsComputed, ColorContrastLabelsState {
-}
-/**
- * @hidden
- */
-declare let ColorContrastLabelsVue2: ComponentOptions<ColorContrastLabelsAll, DefaultData<ColorContrastLabelsData>, DefaultMethods<ColorContrastLabelsAll>, ColorContrastLabelsComputed, RecordPropsDefinition<ColorContrastLabelsProps>>;
-/**
- * @hidden
- */
-declare const ColorContrastLabels: DefineComponent<ColorContrastLabelsProps, any, ColorContrastLabelsData, ColorContrastLabelsComputed, ColorContrastLabelsMethods, {}, {}, {}, string, ColorContrastLabelsProps, ColorContrastLabelsProps, {}>;
-export { ColorContrastLabels, ColorContrastLabelsVue2 };

package/dist/es/colors/ColorContrastLabels.js

@@ -1,109 +0,0 @@
-// @ts-ignore
-import * as Vue from 'vue';
-var allVue = Vue;
-var gh = allVue.h;
-var isV3 = allVue.version && allVue.version[0] === '3';
-import { provideLocalizationService } from '@progress/kendo-vue-intl';
-import { checkIcon, xIcon } from '@progress/kendo-svg-icons';
-import { messages, colorGradientContrastRatio, colorGradientAALevel, colorGradientAAALevel, colorGradientPass, colorGradientFail } from '../messages/main';
-import { getContrastFromTwoRGBAs } from './utils/color-parser';
-import { Icon } from '@progress/kendo-vue-common';
-/**
- * @hidden
- */
-var ColorContrastLabelsVue2 = {
-  name: 'KendoColorContrastLabels',
-  props: {
-    bgColor: Object,
-    rgba: Object
-  },
-  inject: {
-    kendoLocalizationService: {
-      default: null
-    }
-  },
-  // @ts-ignore
-  setup: !isV3 ? undefined : function () {
-    var v3 = !!isV3;
-    return {
-      v3: v3
-    };
-  },
-  // @ts-ignore
-  render: function render(createElement) {
-    var h = gh || createElement;
-    var ls = provideLocalizationService(this);
-    var contrastRatioMessage = ls.toLanguageString(colorGradientContrastRatio, messages[colorGradientContrastRatio]);
-    var AALevelMessage = ls.toLanguageString(colorGradientAALevel, messages[colorGradientAALevel]);
-    var AAALevelMessage = ls.toLanguageString(colorGradientAAALevel, messages[colorGradientAAALevel]);
-    var passMessage = ls.toLanguageString(colorGradientPass, messages[colorGradientPass]);
-    var failMessage = ls.toLanguageString(colorGradientFail, messages[colorGradientFail]);
-    var contrast = getContrastFromTwoRGBAs(this.$props.rgba, this.$props.bgColor);
-    var requiredAAContrast = 4.5.toFixed(1);
-    var requiredAAAContrast = 7.0.toFixed(1);
-    var contrastText = "".concat(contrastRatioMessage, ": ").concat(contrast.toFixed(2));
-    var aaText = "".concat(AALevelMessage, ": ").concat(requiredAAContrast);
-    var aaaText = "".concat(AAALevelMessage, ": ").concat(requiredAAAContrast);
-    var aaPass = contrast >= 4.5;
-    var aaaPass = contrast >= 7;
-    var success = h("span", {
-      key: 1,
-      "class": "k-contrast-validation k-text-success"
-    }, [passMessage, " ", h(Icon, {
-      name: "check",
-      attrs: this.v3 ? undefined : {
-        name: "check",
-        icon: checkIcon
-      },
-      icon: checkIcon
-    })]);
-    var error = h("span", {
-      key: 2,
-      "class": "k-contrast-validation k-text-error"
-    }, [failMessage, " ", h(Icon, {
-      name: "x",
-      attrs: this.v3 ? undefined : {
-        name: "x",
-        icon: xIcon
-      },
-      icon: xIcon
-    })]);
-    return h("div", {
-      "class": "k-vbox k-colorgradient-color-contrast"
-    }, [h("div", {
-      "class": "k-contrast-ratio"
-    }, [h("span", {
-      "class": "k-contrast-ratio-text"
-    }, [contrastText]), aaPass ? h("span", {
-      "class": "k-contrast-validation k-text-success"
-    }, [h(Icon, {
-      name: "check",
-      attrs: this.v3 ? undefined : {
-        name: "check",
-        icon: checkIcon
-      },
-      icon: checkIcon
-    }), aaaPass && h(Icon, {
-      name: "check",
-      attrs: this.v3 ? undefined : {
-        name: "check",
-        icon: checkIcon
-      },
-      icon: checkIcon
-    })]) : h("span", {
-      "class": "k-contrast-validation k-text-error"
-    }, [h(Icon, {
-      name: "x",
-      attrs: this.v3 ? undefined : {
-        name: "x",
-        icon: xIcon
-      },
-      icon: xIcon
-    })])]), h("div", [h("span", [aaText]), aaPass ? success : error]), h("div", [h("span", [aaaText]), aaaPass ? success : error])]);
-  }
-};
-/**
- * @hidden
- */
-var ColorContrastLabels = ColorContrastLabelsVue2;
-export { ColorContrastLabels, ColorContrastLabelsVue2 };