@progress/kendo-react-inputs 6.1.1 → 7.0.0-develop.2

package/dist/npm/switch/Switch.d.ts

@@ -1,290 +0,0 @@
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { BaseEvent } from '@progress/kendo-react-common';
-import { ToggleBaseProps } from '../interfaces/ToggleBaseProps';
-import { FormComponent, FormComponentProps, FormComponentValidity } from '@progress/kendo-react-common';
-/**
- * The arguments for the `onChange` Switch event.
- */
-export interface SwitchChangeEvent extends BaseEvent<Switch> {
-    /**
-     * The new value of the Switch.
-     */
-    value: boolean;
-}
-/**
- * Represents the props of the [KendoReact Switch component]({% slug overview_switch %}).
- */
-export interface SwitchProps extends ToggleBaseProps, FormComponentProps {
-    /**
-     * Specifies the `accessKey` of the Switch.
-     */
-    accessKey?: string;
-    /**
-     * Sets the current value of the Switch ([see example]({% slug controlled_switch %})).
-     */
-    checked?: boolean;
-    /**
-     * Sets the `className` of the wrapping element of the Switch.
-     */
-    className?: string;
-    /**
-     * Sets the value of the Switch when it is initially displayed ([see example]({% slug default_state %})).
-     */
-    defaultChecked?: boolean;
-    /**
-     * Sets the default value of the Switch.
-     */
-    defaultValue?: any;
-    /**
-     * Disables the Switch when set to `true` ([see example]({% slug disabled_switch %})).
-     */
-    disabled?: boolean;
-    /**
-     * Sets the `dir` property of the wrapping element of the Switch.
-     */
-    dir?: string;
-    /**
-     * Sets the `id` of the Switch.
-     */
-    id?: string;
-    /**
-     * Configures the `size` of the Switch.
-     *
-     * The available options are:
-     * - small
-     * - medium
-     * - large
-     * - null&mdash;Does not set a size `className`.
-     *
-     * @default `medium`
-     */
-    size?: null | 'small' | 'medium' | 'large';
-    /**
-     * Configures the `trackRounded` of the Switch.
-     *
-     * The available options are:
-     * - small
-     * - medium
-     * - large
-     * - full
-     * - null&mdash;Does not set a trackRounded `className`.
-     *
-     * @default `full`
-     */
-    trackRounded?: null | 'small' | 'medium' | 'large' | 'full';
-    /**
-     * Configures the `thumbRounded` of the Switch.
-     *
-     * The available options are:
-     * - small
-     * - medium
-     * - large
-     * - full
-     * - null&mdash;Does not set a thumbRounded `className`.
-     *
-     * @default `full`
-     */
-    thumbRounded?: null | 'small' | 'medium' | 'large' | 'full';
-    /**
-     * 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;
-    /**
-     * Changes the **Off** label([see example]({% slug labels_switch %})).
-     */
-    offLabel?: string;
-    /**
-     * Fires each time the Switch gets blurred.
-     */
-    onBlur?: (event: React.FocusEvent<HTMLSpanElement>) => void;
-    /**
-     * Fires each time the user selects a new value ([see example]({% slug controlled_switch %})).
-     */
-    onChange?: (event: SwitchChangeEvent) => void;
-    /**
-     * Fires each time the Switch component gets focused.
-     */
-    onFocus?: (event: React.FocusEvent<HTMLSpanElement>) => void;
-    /**
-     * Changes the **On** label ([see example]({% slug labels_switch %})).
-     */
-    onLabel?: string;
-    /**
-     * Specifies the [`tabIndex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the component.
-     */
-    tabIndex?: number;
-    /**
-     * Sets the value of the Switch. It can either be of the primitive (string, number, boolean) or of the complex (array) type.
-     */
-    value?: string | number | string[] | boolean | null;
-    /**
-     * The accessible label of the component.
-     */
-    ariaLabel?: string;
-}
-/**
- * @hidden
- */
-export interface SwitchState {
-    checked: boolean;
-    focused: boolean;
-}
-/** @hidden */
-export declare class SwitchWithoutContext extends React.Component<SwitchProps, SwitchState> implements FormComponent {
-    static displayName: string;
-    /**
-     * Gets the value of the Switch.
-     */
-    get value(): boolean;
-    get element(): HTMLSpanElement | null;
-    get actionElement(): HTMLSpanElement | null;
-    /**
-     * Gets the `name` property of the Switch.
-     */
-    get name(): string | undefined;
-    /**
-     * Represents the validity state into which the Switch is set.
-     */
-    get validity(): FormComponentValidity;
-    /**
-     * @hidden
-     */
-    protected get validityStyles(): boolean;
-    /**
-     * @hidden
-     */
-    protected get required(): boolean;
-    /**
-     * @hidden
-     */
-    protected setValidity: () => void;
-    protected limit: (offset: number, drag: HTMLSpanElement, wrapper: HTMLSpanElement) => number;
-    protected toggle: (value: boolean, event: any) => void;
-    /**
-     * @hidden
-     */
-    static propTypes: {
-        accessKey: PropTypes.Requireable<string>;
-        checked: PropTypes.Requireable<boolean>;
-        className: PropTypes.Requireable<string>;
-        disabled: PropTypes.Requireable<boolean>;
-        defaultChecked: PropTypes.Requireable<boolean>;
-        size: PropTypes.Requireable<"small" | "medium" | "large" | null | undefined>;
-        trackRounded: PropTypes.Requireable<"small" | "medium" | "full" | "large" | null | undefined>;
-        thumbRounded: PropTypes.Requireable<"small" | "medium" | "full" | "large" | null | undefined>;
-        dir: PropTypes.Requireable<string>;
-        id: PropTypes.Requireable<string>;
-        ariaLabelledBy: PropTypes.Requireable<string>;
-        ariaDescribedBy: PropTypes.Requireable<string>;
-        offLabel: PropTypes.Requireable<string>;
-        required: PropTypes.Requireable<boolean>;
-        tabIndex: PropTypes.Requireable<number>;
-        valid: PropTypes.Requireable<boolean>;
-        validate: PropTypes.Requireable<boolean>;
-        validationMessage: PropTypes.Requireable<string>;
-        onBlur: PropTypes.Requireable<any>;
-        onChange: PropTypes.Requireable<any>;
-        onFocus: PropTypes.Requireable<any>;
-        onLabel: PropTypes.Requireable<string>;
-    };
-    /**
-     * @hidden
-     */
-    static defaultProps: {
-        disabled: boolean;
-        defaultChecked: boolean;
-        size: "small" | "medium" | "large" | null | undefined;
-        trackRounded: "small" | "medium" | "full" | "large" | null | undefined;
-        thumbRounded: "small" | "medium" | "full" | "large" | null | undefined;
-        offLabel: string;
-        onBlur: () => void;
-        onFocus: () => void;
-        onLabel: string;
-        required: boolean;
-        validityStyles: boolean;
-    };
-    /**
-     * @hidden
-     */
-    readonly state: SwitchState;
-    private _element;
-    private _wrapper;
-    private _input;
-    private _id;
-    private valueDuringOnChange;
-    private dir?;
-    private defaultValidationMessage;
-    private eventTimeStamp?;
-    /**
-     * @hidden
-     */
-    constructor(props: SwitchProps);
-    /**
-     * @hidden
-     */
-    componentDidMount(): void;
-    /**
-     * @hidden
-     */
-    componentDidUpdate(): void;
-    /**
-     * @hidden
-     */
-    focus: () => void;
-    /**
-     * @hidden
-     */
-    render(): JSX.Element;
-    private dummyInput;
-    private handleClick;
-    private handleKeyDown;
-    private handleWrapperFocus;
-    private handleWrapperBlur;
-}
-/**
- * Represents the PropsContext of the `Switch` component.
- * Used for global configuration of all `Switch` instances.
- *
- * For more information, refer to the [Inputs Props Context]({% slug props-context_inputs %}) article.
- */
-export declare const SwitchPropsContext: React.Context<(p: SwitchProps) => SwitchProps>;
-/**
- * Represent the `ref` of the Switch component.
- */
-export interface SwitchHandle extends Pick<SwitchWithoutContext, keyof SwitchWithoutContext> {
-    /**
-     * @hidden
-     */
-    actionElement: HTMLSpanElement | null;
-    /**
-     * Returns the HTML element of the Switch component.
-     */
-    element: HTMLSpanElement | null;
-    /**
-     * Gets the `name` property of the Switch.
-     */
-    name: string | undefined;
-    /**
-     * Represents the validity state into which the Switch is set.
-     */
-    validity: FormComponentValidity;
-    /**
-     * Gets the value of the Switch.
-     */
-    value: boolean;
-}
-/** @hidden */
-export declare type Switch = SwitchHandle;
-/**
- * Represents the [KendoReact Switch component]({% slug overview_switch %}).
- *
- * Accepts properties of type [SwitchProps]({% slug api_inputs_switchprops %}).
- * Obtaining the `ref` returns an object of type [SwitchHandle]({% slug api_inputs_switchhandle %}).
- */
-export declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<any>>;

package/dist/npm/switch/Switch.js

@@ -1,334 +0,0 @@
-"use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Switch = exports.SwitchPropsContext = exports.SwitchWithoutContext = void 0;
-var React = require("react");
-var PropTypes = require("prop-types");
-var kendo_react_common_1 = require("@progress/kendo-react-common");
-var kendo_react_intl_1 = require("@progress/kendo-react-intl");
-var messages_1 = require("./../messages");
-var kendo_react_common_2 = require("@progress/kendo-react-common");
-var package_metadata_1 = require("../package-metadata");
-/** @hidden */
-var SwitchWithoutContext = /** @class */ (function (_super) {
-    __extends(SwitchWithoutContext, _super);
-    /**
-     * @hidden
-     */
-    function SwitchWithoutContext(props) {
-        var _this = _super.call(this, props) || this;
-        /**
-         * @hidden
-         */
-        _this.setValidity = function () {
-            if (_this._input && _this._input.setCustomValidity) {
-                _this._input.setCustomValidity(_this.validity.valid
-                    ? ''
-                    : _this.props.validationMessage ||
-                        _this.defaultValidationMessage.toLanguageString(messages_1.switchValidation, messages_1.messages[messages_1.switchValidation]));
-            }
-        };
-        _this.limit = function (offset, drag, wrapper) {
-            var wrapperWidth = wrapper.offsetWidth;
-            var margin = drag.offsetWidth;
-            if (offset < 0) {
-                return 0;
-            }
-            else if (offset > wrapperWidth - margin) {
-                return wrapperWidth - margin;
-            }
-            return offset;
-        };
-        _this.toggle = function (value, event) {
-            _this.setState({ checked: value });
-            _this.valueDuringOnChange = value;
-            (0, kendo_react_common_1.dispatchEvent)(_this.props.onChange, event, _this, { value: value });
-            _this.valueDuringOnChange = undefined;
-        };
-        _this._element = null;
-        _this._wrapper = null;
-        _this._input = null;
-        _this._id = (0, kendo_react_common_1.guid)();
-        _this.defaultValidationMessage = (0, kendo_react_intl_1.provideLocalizationService)(_this);
-        /**
-         * @hidden
-         */
-        _this.focus = function () {
-            if (_this.actionElement) {
-                _this.actionElement.focus();
-            }
-        };
-        _this.dummyInput = function (value) {
-            /* Dummy component to support forms */
-            return (React.createElement("input", { type: "checkbox", checked: _this.props.checked, ref: function (el) {
-                    _this._input = el;
-                }, tabIndex: -1, "aria-hidden": true, value: value, style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: 'absolute', left: '50%' }, onChange: kendo_react_common_1.noop, name: _this.name || undefined }));
-        };
-        _this.handleClick = function (event) {
-            if (_this.eventTimeStamp === event.timeStamp) {
-                // This is guard against the case when wrapped in label, click event is emmited twice
-                return;
-            }
-            _this.eventTimeStamp = event.timeStamp;
-            _this.toggle(!_this.value, event);
-        };
-        _this.handleKeyDown = function (event) {
-            if (_this.props.disabled) {
-                return;
-            }
-            var keyCode = event.keyCode;
-            if (keyCode === kendo_react_common_1.Keys.space || keyCode === kendo_react_common_1.Keys.enter) {
-                _this.toggle(!_this.value, event);
-                event.preventDefault();
-            }
-        };
-        _this.handleWrapperFocus = function (event) {
-            if (_this.props.disabled) {
-                return;
-            }
-            _this.setState({ focused: true });
-            var onFocus = _this.props.onFocus;
-            if (onFocus) {
-                onFocus.call(undefined, event);
-            }
-        };
-        _this.handleWrapperBlur = function (event) {
-            if (_this.props.disabled) {
-                return;
-            }
-            _this.setState({ focused: false });
-            var onBlur = _this.props.onBlur;
-            if (onBlur) {
-                onBlur.call(undefined, event);
-            }
-        };
-        (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
-        _this.state = {
-            checked: props.defaultChecked || SwitchWithoutContext.defaultProps.defaultChecked,
-            focused: false
-        };
-        return _this;
-    }
-    Object.defineProperty(SwitchWithoutContext.prototype, "value", {
-        /**
-         * Gets the value of the Switch.
-         */
-        get: function () {
-            return this.valueDuringOnChange !== undefined
-                ? this.valueDuringOnChange
-                : this.props.checked !== undefined
-                    ? this.props.checked
-                    : this.state.checked;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(SwitchWithoutContext.prototype, "element", {
-        get: function () {
-            return this._element;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(SwitchWithoutContext.prototype, "actionElement", {
-        get: function () {
-            return this._wrapper;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(SwitchWithoutContext.prototype, "name", {
-        /**
-         * Gets the `name` property of the Switch.
-         */
-        get: function () {
-            return this.props.name;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(SwitchWithoutContext.prototype, "validity", {
-        /**
-         * Represents the validity state into which the Switch is set.
-         */
-        get: function () {
-            var customError = this.props.validationMessage !== undefined;
-            var isValid = this.props.valid !== undefined ?
-                this.props.valid :
-                !this.props.required ?
-                    true :
-                    this.value ? true : false;
-            var valid = this.props.valid !== undefined ? this.props.valid : isValid;
-            return {
-                customError: customError,
-                valid: valid,
-                valueMissing: this.value === null
-            };
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(SwitchWithoutContext.prototype, "validityStyles", {
-        /**
-         * @hidden
-         */
-        get: function () {
-            return this.props.validityStyles !== undefined
-                ? this.props.validityStyles
-                : SwitchWithoutContext.defaultProps.validityStyles;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(SwitchWithoutContext.prototype, "required", {
-        /**
-         * @hidden
-         */
-        get: function () {
-            return this.props.required !== undefined
-                ? this.props.required
-                : SwitchWithoutContext.defaultProps.required;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    /**
-     * @hidden
-     */
-    SwitchWithoutContext.prototype.componentDidMount = function () {
-        this.setValidity();
-        // Due to dynamic dir calculation
-        this.forceUpdate();
-    };
-    /**
-     * @hidden
-     */
-    SwitchWithoutContext.prototype.componentDidUpdate = function () {
-        this.setValidity();
-    };
-    /**
-     * @hidden
-     */
-    SwitchWithoutContext.prototype.render = function () {
-        var _a, _b, _c;
-        var _this = this;
-        var focused = this.state.focused;
-        var _d = this.props, dir = _d.dir, disabled = _d.disabled, trackRounded = _d.trackRounded, thumbRounded = _d.thumbRounded, size = _d.size, offLabel = _d.offLabel, onLabel = _d.onLabel, tabIndex = _d.tabIndex;
-        this.dir = dir || (this.element && getComputedStyle(this.element).direction) || undefined;
-        var isValid = !this.validityStyles || this.validity.valid;
-        var switchClassName = (0, kendo_react_common_1.classNames)('k-switch', (_a = {},
-            _a["k-switch-".concat(kendo_react_common_1.kendoThemeMaps.sizeMap[size] || size)] = size,
-            _a["k-rounded-".concat(kendo_react_common_1.kendoThemeMaps.roundedMap[trackRounded] || trackRounded)] = trackRounded,
-            _a['k-switch-on'] = this.value,
-            _a['k-switch-off'] = !this.value,
-            _a['k-focus'] = focused,
-            _a['k-disabled'] = disabled,
-            _a['k-invalid'] = !isValid,
-            _a), this.props.className);
-        var ariaAttributes = {
-            'aria-checked': this.value,
-            'aria-disabled': disabled || undefined,
-            'aria-labelledby': this.props.ariaLabelledBy,
-            'aria-describedby': this.props.ariaDescribedBy,
-            'aria-label': this.props.ariaLabel
-        };
-        return (React.createElement("span", __assign({ ref: function (span) {
-                _this._wrapper = span;
-            }, role: 'switch' }, ariaAttributes, { className: switchClassName, dir: this.dir, onKeyDown: this.handleKeyDown, onClick: this.handleClick, onBlur: this.handleWrapperBlur, onFocus: this.handleWrapperFocus, tabIndex: (0, kendo_react_common_1.getTabIndex)(tabIndex, disabled, undefined), accessKey: this.props.accessKey, id: this.props.id || this._id }),
-            React.createElement("span", { className: (0, kendo_react_common_1.classNames)('k-switch-track', (_b = {}, _b["k-rounded-".concat(kendo_react_common_1.kendoThemeMaps.roundedMap[trackRounded] || trackRounded)] = trackRounded, _b)), ref: function (span) {
-                    _this._element = span;
-                } },
-                this.dummyInput(this.value),
-                React.createElement("span", { className: 'k-switch-label-on' }, onLabel),
-                React.createElement("span", { className: 'k-switch-label-off' }, offLabel)),
-            React.createElement("span", { className: 'k-switch-thumb-wrap' },
-                React.createElement("span", { className: (0, kendo_react_common_1.classNames)('k-switch-thumb', (_c = {}, _c["k-rounded-".concat(thumbRounded)] = thumbRounded, _c)) }))));
-    };
-    SwitchWithoutContext.displayName = 'Switch';
-    /**
-     * @hidden
-     */
-    SwitchWithoutContext.propTypes = {
-        accessKey: PropTypes.string,
-        checked: PropTypes.bool,
-        className: PropTypes.string,
-        disabled: PropTypes.bool,
-        defaultChecked: PropTypes.bool,
-        size: PropTypes.oneOf([null, 'small', 'medium', 'large']),
-        trackRounded: PropTypes.oneOf([null, 'small', 'medium', 'large', 'full']),
-        thumbRounded: PropTypes.oneOf([null, 'small', 'medium', 'large', 'full']),
-        dir: PropTypes.string,
-        id: PropTypes.string,
-        ariaLabelledBy: PropTypes.string,
-        ariaDescribedBy: PropTypes.string,
-        offLabel: PropTypes.string,
-        required: PropTypes.bool,
-        tabIndex: PropTypes.number,
-        valid: PropTypes.bool,
-        validate: PropTypes.bool,
-        validationMessage: PropTypes.string,
-        onBlur: PropTypes.any,
-        onChange: PropTypes.any,
-        onFocus: PropTypes.any,
-        onLabel: PropTypes.string
-    };
-    /**
-     * @hidden
-     */
-    SwitchWithoutContext.defaultProps = {
-        disabled: false,
-        defaultChecked: false,
-        size: 'medium',
-        trackRounded: 'full',
-        thumbRounded: 'full',
-        offLabel: 'OFF',
-        onBlur: kendo_react_common_1.noop,
-        onFocus: kendo_react_common_1.noop,
-        onLabel: 'ON',
-        required: false,
-        validityStyles: true
-    };
-    return SwitchWithoutContext;
-}(React.Component));
-exports.SwitchWithoutContext = SwitchWithoutContext;
-/**
- * Represents the PropsContext of the `Switch` component.
- * Used for global configuration of all `Switch` instances.
- *
- * For more information, refer to the [Inputs Props Context]({% slug props-context_inputs %}) article.
- */
-exports.SwitchPropsContext = (0, kendo_react_common_1.createPropsContext)();
-/* eslint-disable @typescript-eslint/no-redeclare -- intentionally naming the component the same as the type */
-/**
- * Represents the [KendoReact Switch component]({% slug overview_switch %}).
- *
- * Accepts properties of type [SwitchProps]({% slug api_inputs_switchprops %}).
- * Obtaining the `ref` returns an object of type [SwitchHandle]({% slug api_inputs_switchhandle %}).
- */
-exports.Switch = (0, kendo_react_common_1.withPropsContext)(exports.SwitchPropsContext, SwitchWithoutContext);
-exports.Switch.displayName = 'KendoReactSwitch';