@progress/kendo-react-inputs 5.17.0-dev.202308141334 → 5.17.0-dev.202308171202

package/dist/es/checkbox/Checkbox.js

@@ -51,9 +51,9 @@ export var Checkbox = React.forwardRef(function (directProps, target) {
     var _a;
     validatePackage(packageMetadata);
     var props = usePropsContext(CheckboxPropsContext, directProps);
-    var _b = props, ariaDescribedBy = _b.ariaDescribedBy, ariaLabelledBy = _b.ariaLabelledBy, checked = _b.checked, className = _b.className, children = _b.children, defaultChecked = _b.defaultChecked, disabled = _b.disabled, defaultValue = _b.defaultValue, id = _b.id, size = _b.size, rounded = _b.rounded, label = _b.label, labelPlacement = _b.labelPlacement, name = _b.name, labelOptional = _b.labelOptional, onChange = _b.onChange, onFocus = _b.onFocus, onBlur = _b.onBlur, tabIndex = _b.tabIndex, value = _b.value, required = _b.required, valid = _b.valid, validationMessage = _b.validationMessage, validityStyles = _b.validityStyles, 
+    var _b = props, ariaDescribedBy = _b.ariaDescribedBy, ariaLabelledBy = _b.ariaLabelledBy, checked = _b.checked, className = _b.className, labelClassName = _b.labelClassName, children = _b.children, defaultChecked = _b.defaultChecked, disabled = _b.disabled, defaultValue = _b.defaultValue, id = _b.id, size = _b.size, rounded = _b.rounded, label = _b.label, labelPlacement = _b.labelPlacement, name = _b.name, labelOptional = _b.labelOptional, onChange = _b.onChange, onFocus = _b.onFocus, onBlur = _b.onBlur, tabIndex = _b.tabIndex, value = _b.value, required = _b.required, valid = _b.valid, validationMessage = _b.validationMessage, validityStyles = _b.validityStyles, 
     // Removed to support direct use in Form Field component
-    visited = _b.visited, touched = _b.touched, modified = _b.modified, others = __rest(_b, ["ariaDescribedBy", "ariaLabelledBy", "checked", "className", "children", "defaultChecked", "disabled", "defaultValue", "id", "size", "rounded", "label", "labelPlacement", "name", "labelOptional", "onChange", "onFocus", "onBlur", "tabIndex", "value", "required", "valid", "validationMessage", "validityStyles", "visited", "touched", "modified"]);
+    visited = _b.visited, touched = _b.touched, modified = _b.modified, others = __rest(_b, ["ariaDescribedBy", "ariaLabelledBy", "checked", "className", "labelClassName", "children", "defaultChecked", "disabled", "defaultValue", "id", "size", "rounded", "label", "labelPlacement", "name", "labelOptional", "onChange", "onFocus", "onBlur", "tabIndex", "value", "required", "valid", "validationMessage", "validityStyles", "visited", "touched", "modified"]);
     var elementRef = React.useRef(null);
     var focusElement = React.useCallback(function () {
         if (elementRef.current) {
@@ -159,7 +159,7 @@ export var Checkbox = React.forwardRef(function (directProps, target) {
     // removing value prop is required due to bug in react where
     // value set to undefined override default submit value
     valueProp === undefined ? (React.createElement("input", __assign({}, inputProps))) : (React.createElement("input", __assign({}, inputProps, { value: valueIsBoolean ? undefined : valueProp === null ? '' : valueProp })))));
-    var checkboxLabel = (React.createElement(React.Fragment, null, label !== undefined ? (React.createElement("label", { className: 'k-checkbox-label', htmlFor: id || calculatedId, style: { userSelect: 'none' } },
+    var checkboxLabel = (React.createElement(React.Fragment, null, label !== undefined ? (React.createElement("label", { className: classNames('k-checkbox-label', labelClassName), htmlFor: id || calculatedId, style: { userSelect: 'none' } },
         label,
         labelOptional && React.createElement("span", { className: "k-label-optional" }, optionalMessage))) : null));
     return (React.createElement(React.Fragment, null, (labelPlacement === 'before') ? (React.createElement("span", { className: checkboxClasses, dir: 'rtl' },

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

@@ -28,6 +28,10 @@ export interface CheckboxProps extends ToggleBaseProps, FormComponentProps, Omit
      * Sets the `className` of the wrapping element of the Checkbox.
      */
     className?: string;
+    /**
+     * Sets the `className` of the label element of the Checkbox.
+     */
+    labelClassName?: string;
     /**
      * The React elements that are passed as children to the rendered component.
      */

package/dist/es/input/Input.d.ts

@@ -15,6 +15,10 @@ export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElem
      * Renders a floating label for the Input component.
      */
     label?: string;
+    /**
+     * Sets a `className` for the floating label.
+     */
+    labelClassName?: string;
     /**
      * Represents the Input value.
      */
@@ -55,6 +59,7 @@ export declare class InputWithoutContext extends React.Component<InputProps, Inp
      */
     static propTypes: {
         label: PropTypes.Requireable<string>;
+        labelClassName: PropTypes.Requireable<string>;
         validationMessage: PropTypes.Requireable<string>;
         required: PropTypes.Requireable<boolean>;
         validate: PropTypes.Requireable<boolean>;

package/dist/es/input/Input.js

@@ -199,9 +199,9 @@ var InputWithoutContext = /** @class */ (function (_super) {
      */
     InputWithoutContext.prototype.render = function () {
         var _this = this;
-        var _a = this.props, className = _a.className, label = _a.label, id = _a.id, validationMessage = _a.validationMessage, defaultValue = _a.defaultValue, valid = _a.valid, 
+        var _a = this.props, className = _a.className, label = _a.label, labelClassName = _a.labelClassName, id = _a.id, validationMessage = _a.validationMessage, defaultValue = _a.defaultValue, valid = _a.valid, 
         // Removed to support direct use in Form Field component
-        visited = _a.visited, touched = _a.touched, modified = _a.modified, ariaLabelledBy = _a.ariaLabelledBy, ariaDescribedBy = _a.ariaDescribedBy, validityStyles = _a.validityStyles, style = _a.style, ariaLabel = _a.ariaLabel, props = __rest(_a, ["className", "label", "id", "validationMessage", "defaultValue", "valid", "visited", "touched", "modified", "ariaLabelledBy", "ariaDescribedBy", "validityStyles", "style", "ariaLabel"]);
+        visited = _a.visited, touched = _a.touched, modified = _a.modified, ariaLabelledBy = _a.ariaLabelledBy, ariaDescribedBy = _a.ariaDescribedBy, validityStyles = _a.validityStyles, style = _a.style, ariaLabel = _a.ariaLabel, props = __rest(_a, ["className", "label", "labelClassName", "id", "validationMessage", "defaultValue", "valid", "visited", "touched", "modified", "ariaLabelledBy", "ariaDescribedBy", "validityStyles", "style", "ariaLabel"]);
         var inputId = id || this._inputId;
         var isValid = !this.validityStyles || this.validity.valid;
         var inputClassName = classNames(className, 'k-input k-input-md k-rounded-md k-input-solid');
@@ -211,7 +211,7 @@ var InputWithoutContext = /** @class */ (function (_super) {
                 _this._input = el;
             } })));
         return label ?
-            (React.createElement(FloatingLabel, { label: label, editorId: inputId, editorValue: String(this.value), editorValid: isValid, editorDisabled: props.disabled, editorPlaceholder: props.placeholder, children: textbox, style: style, dir: props.dir }))
+            (React.createElement(FloatingLabel, { label: label, labelClassName: labelClassName, editorId: inputId, editorValue: String(this.value), editorValid: isValid, editorDisabled: props.disabled, editorPlaceholder: props.placeholder, children: textbox, style: style, dir: props.dir }))
             : textbox;
     };
     InputWithoutContext.displayName = 'Input';
@@ -220,6 +220,7 @@ var InputWithoutContext = /** @class */ (function (_super) {
      */
     InputWithoutContext.propTypes = {
         label: PropTypes.string,
+        labelClassName: PropTypes.string,
         validationMessage: PropTypes.string,
         required: PropTypes.bool,
         validate: PropTypes.bool,

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-react-inputs',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1692018124,
+    publishDate: 1692271414,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
 };

package/dist/npm/checkbox/Checkbox.js

@@ -54,9 +54,9 @@ exports.Checkbox = React.forwardRef(function (directProps, target) {
     var _a;
     (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
     var props = (0, kendo_react_common_1.usePropsContext)(exports.CheckboxPropsContext, directProps);
-    var _b = props, ariaDescribedBy = _b.ariaDescribedBy, ariaLabelledBy = _b.ariaLabelledBy, checked = _b.checked, className = _b.className, children = _b.children, defaultChecked = _b.defaultChecked, disabled = _b.disabled, defaultValue = _b.defaultValue, id = _b.id, size = _b.size, rounded = _b.rounded, label = _b.label, labelPlacement = _b.labelPlacement, name = _b.name, labelOptional = _b.labelOptional, onChange = _b.onChange, onFocus = _b.onFocus, onBlur = _b.onBlur, tabIndex = _b.tabIndex, value = _b.value, required = _b.required, valid = _b.valid, validationMessage = _b.validationMessage, validityStyles = _b.validityStyles, 
+    var _b = props, ariaDescribedBy = _b.ariaDescribedBy, ariaLabelledBy = _b.ariaLabelledBy, checked = _b.checked, className = _b.className, labelClassName = _b.labelClassName, children = _b.children, defaultChecked = _b.defaultChecked, disabled = _b.disabled, defaultValue = _b.defaultValue, id = _b.id, size = _b.size, rounded = _b.rounded, label = _b.label, labelPlacement = _b.labelPlacement, name = _b.name, labelOptional = _b.labelOptional, onChange = _b.onChange, onFocus = _b.onFocus, onBlur = _b.onBlur, tabIndex = _b.tabIndex, value = _b.value, required = _b.required, valid = _b.valid, validationMessage = _b.validationMessage, validityStyles = _b.validityStyles, 
     // Removed to support direct use in Form Field component
-    visited = _b.visited, touched = _b.touched, modified = _b.modified, others = __rest(_b, ["ariaDescribedBy", "ariaLabelledBy", "checked", "className", "children", "defaultChecked", "disabled", "defaultValue", "id", "size", "rounded", "label", "labelPlacement", "name", "labelOptional", "onChange", "onFocus", "onBlur", "tabIndex", "value", "required", "valid", "validationMessage", "validityStyles", "visited", "touched", "modified"]);
+    visited = _b.visited, touched = _b.touched, modified = _b.modified, others = __rest(_b, ["ariaDescribedBy", "ariaLabelledBy", "checked", "className", "labelClassName", "children", "defaultChecked", "disabled", "defaultValue", "id", "size", "rounded", "label", "labelPlacement", "name", "labelOptional", "onChange", "onFocus", "onBlur", "tabIndex", "value", "required", "valid", "validationMessage", "validityStyles", "visited", "touched", "modified"]);
     var elementRef = React.useRef(null);
     var focusElement = React.useCallback(function () {
         if (elementRef.current) {
@@ -162,7 +162,7 @@ exports.Checkbox = React.forwardRef(function (directProps, target) {
     // removing value prop is required due to bug in react where
     // value set to undefined override default submit value
     valueProp === undefined ? (React.createElement("input", __assign({}, inputProps))) : (React.createElement("input", __assign({}, inputProps, { value: valueIsBoolean ? undefined : valueProp === null ? '' : valueProp })))));
-    var checkboxLabel = (React.createElement(React.Fragment, null, label !== undefined ? (React.createElement("label", { className: 'k-checkbox-label', htmlFor: id || calculatedId, style: { userSelect: 'none' } },
+    var checkboxLabel = (React.createElement(React.Fragment, null, label !== undefined ? (React.createElement("label", { className: (0, kendo_react_common_1.classNames)('k-checkbox-label', labelClassName), htmlFor: id || calculatedId, style: { userSelect: 'none' } },
         label,
         labelOptional && React.createElement("span", { className: "k-label-optional" }, optionalMessage))) : null));
     return (React.createElement(React.Fragment, null, (labelPlacement === 'before') ? (React.createElement("span", { className: checkboxClasses, dir: 'rtl' },

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

@@ -28,6 +28,10 @@ export interface CheckboxProps extends ToggleBaseProps, FormComponentProps, Omit
      * Sets the `className` of the wrapping element of the Checkbox.
      */
     className?: string;
+    /**
+     * Sets the `className` of the label element of the Checkbox.
+     */
+    labelClassName?: string;
     /**
      * The React elements that are passed as children to the rendered component.
      */

package/dist/npm/input/Input.d.ts

@@ -15,6 +15,10 @@ export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElem
      * Renders a floating label for the Input component.
      */
     label?: string;
+    /**
+     * Sets a `className` for the floating label.
+     */
+    labelClassName?: string;
     /**
      * Represents the Input value.
      */
@@ -55,6 +59,7 @@ export declare class InputWithoutContext extends React.Component<InputProps, Inp
      */
     static propTypes: {
         label: PropTypes.Requireable<string>;
+        labelClassName: PropTypes.Requireable<string>;
         validationMessage: PropTypes.Requireable<string>;
         required: PropTypes.Requireable<boolean>;
         validate: PropTypes.Requireable<boolean>;

package/dist/npm/input/Input.js

@@ -202,9 +202,9 @@ var InputWithoutContext = /** @class */ (function (_super) {
      */
     InputWithoutContext.prototype.render = function () {
         var _this = this;
-        var _a = this.props, className = _a.className, label = _a.label, id = _a.id, validationMessage = _a.validationMessage, defaultValue = _a.defaultValue, valid = _a.valid, 
+        var _a = this.props, className = _a.className, label = _a.label, labelClassName = _a.labelClassName, id = _a.id, validationMessage = _a.validationMessage, defaultValue = _a.defaultValue, valid = _a.valid, 
         // Removed to support direct use in Form Field component
-        visited = _a.visited, touched = _a.touched, modified = _a.modified, ariaLabelledBy = _a.ariaLabelledBy, ariaDescribedBy = _a.ariaDescribedBy, validityStyles = _a.validityStyles, style = _a.style, ariaLabel = _a.ariaLabel, props = __rest(_a, ["className", "label", "id", "validationMessage", "defaultValue", "valid", "visited", "touched", "modified", "ariaLabelledBy", "ariaDescribedBy", "validityStyles", "style", "ariaLabel"]);
+        visited = _a.visited, touched = _a.touched, modified = _a.modified, ariaLabelledBy = _a.ariaLabelledBy, ariaDescribedBy = _a.ariaDescribedBy, validityStyles = _a.validityStyles, style = _a.style, ariaLabel = _a.ariaLabel, props = __rest(_a, ["className", "label", "labelClassName", "id", "validationMessage", "defaultValue", "valid", "visited", "touched", "modified", "ariaLabelledBy", "ariaDescribedBy", "validityStyles", "style", "ariaLabel"]);
         var inputId = id || this._inputId;
         var isValid = !this.validityStyles || this.validity.valid;
         var inputClassName = (0, kendo_react_common_1.classNames)(className, 'k-input k-input-md k-rounded-md k-input-solid');
@@ -214,7 +214,7 @@ var InputWithoutContext = /** @class */ (function (_super) {
                 _this._input = el;
             } })));
         return label ?
-            (React.createElement(kendo_react_labels_1.FloatingLabel, { label: label, editorId: inputId, editorValue: String(this.value), editorValid: isValid, editorDisabled: props.disabled, editorPlaceholder: props.placeholder, children: textbox, style: style, dir: props.dir }))
+            (React.createElement(kendo_react_labels_1.FloatingLabel, { label: label, labelClassName: labelClassName, editorId: inputId, editorValue: String(this.value), editorValid: isValid, editorDisabled: props.disabled, editorPlaceholder: props.placeholder, children: textbox, style: style, dir: props.dir }))
             : textbox;
     };
     InputWithoutContext.displayName = 'Input';
@@ -223,6 +223,7 @@ var InputWithoutContext = /** @class */ (function (_super) {
      */
     InputWithoutContext.propTypes = {
         label: PropTypes.string,
+        labelClassName: PropTypes.string,
         validationMessage: PropTypes.string,
         required: PropTypes.bool,
         validate: PropTypes.bool,

package/dist/npm/package-metadata.js

@@ -8,7 +8,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-react-inputs',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1692018124,
+    publishDate: 1692271414,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
 };