@progress/kendo-react-common 13.3.0 → 13.4.0-develop.1

package/unstyled/icons.d.ts

@@ -0,0 +1,89 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { WidgetClassStructure } from './interfaces/common.js';
+/** Theme color options for the wrapper */
+export interface ThemeColorClasses {
+    /** The text color should inherit from its parent */
+    inherit?: string;
+    /** Text color for the primary theme */
+    primary?: string;
+    /** Text color for the secondary theme */
+    secondary?: string;
+    /** Text color for the tertiary theme */
+    tertiary?: string;
+    /** Text color for informational messages */
+    info?: string;
+    /** Text color indicating success */
+    success?: string;
+    /** Text color for warnings */
+    warning?: string;
+    /** Text color indicating errors */
+    error?: string;
+    /** Text color for dark theme */
+    dark?: string;
+    /** Text color for light theme */
+    light?: string;
+}
+/** Size options  */
+export interface SizeClasses {
+    /** Default size (16px by 16px) */
+    default?: string;
+    /** Extra small size (0.75 times the default size) */
+    xsmall?: string;
+    /** Small size (0.875 times the default size) */
+    small?: string;
+    /** Medium size, same as default (16px by 16px) */
+    medium?: string;
+    /** Large size (1.25 times the default size) */
+    large?: string;
+    /** Extra large size (1.5 times the default size) */
+    xlarge?: string;
+    /** Double extra large size (2 times the default size) */
+    xxlarge?: string;
+    /** Triple extra large size (3 times the default size) */
+    xxxlarge?: string;
+}
+/** Wrapper classes configuration */
+export interface WrapperClasses {
+    /** Main wrapper class */
+    main?: string;
+    /** SVG prefix class */
+    svgPrefix?: string;
+    /** SVG name prefix class */
+    namePrefix?: string;
+    /** Horizontal flip transformation */
+    flipH?: string;
+    /** Vertical flip transformation */
+    flipV?: string;
+    /** Theme color options for the wrapper */
+    themeColor?: ThemeColorClasses;
+    /** Size options for the wrapper */
+    size?: SizeClasses;
+}
+/** SVG classes configuration */
+export interface SvgClasses {
+    /** Main SVG class, sets fill and flex behavior */
+    main?: string;
+    /** Horizontal flip transformation for the SVG */
+    flipH?: string;
+    /** Vertical flip transformation for the SVG */
+    flipV?: string;
+}
+/**
+ * SVGIcon Classes
+ */
+export interface SVGIconClasses {
+    /** Wrapper configuration*/
+    wrapper?: WrapperClasses;
+    /** SVG configuration */
+    svg?: SvgClasses;
+}
+/**
+ * @hidden
+ */
+export declare const uSvgIcon: WidgetClassStructure;

package/unstyled/icons.mjs

@@ -5,7 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { base as e, icon as r, themeColorMap as i, sizeMap as p } from "./json-classes.mjs";
+import { base as e, icon as r, sizeMap as p, themeColorMap as i } from "./json-classes.mjs";
 const c = {
   wrapper: {
     main: `${e.prefix}-${r.prefix}`,

package/unstyled/inputs.d.ts

@@ -0,0 +1,213 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { WidgetClassStructure } from './interfaces/common.js';
+export interface RadioButtonClasses {
+    /** Input configurations */
+    input?: {
+        /** Class for the radio input */
+        radio?: string;
+        /** Size configurations for the radio input */
+        size?: {
+            /** Prefix for size classes */
+            prefix?: string;
+            /** Class for small size radio input */
+            small?: string;
+            /** Class for medium size radio input */
+            medium?: string;
+            /** Class for large size radio input */
+            large?: string;
+        };
+        /** Class for invalid state */
+        invalid?: string;
+        /** Class for checked state */
+        checked?: string;
+    };
+    /** Class for wrapping container */
+    wrap?: string;
+    /** Class for the label */
+    label?: string;
+}
+/**
+ * @hidden
+ */
+export declare const radioButtonClasses: RadioButtonClasses;
+/**
+ * @hidden
+ */
+export declare const uRadioButton: WidgetClassStructure;
+export interface RadioGroupClasses {
+    /** Unordered list (ul) configurations */
+    ul?: {
+        /** Main class for the ul element */
+        main?: string;
+        /** Class for horizontal list layout */
+        horizontal?: string;
+        /** Class for vertical list layout */
+        vertical?: string;
+    };
+    /** Item configurations inside the ul */
+    item?: {
+        /** Main class for the list item (li) element */
+        main?: string;
+        /** Class for disabled state of list item */
+        disabled?: string;
+    };
+}
+/**
+ * @hidden
+ */
+export declare const radioGroupClasses: RadioGroupClasses;
+/**
+ * @hidden
+ */
+export declare const uRadioGroup: WidgetClassStructure;
+export interface MaskedTextBoxClasses {
+    /** Wrapper configurations for the masked input */
+    wrapper?: {
+        /** Main class for the wrapper */
+        main?: string;
+        /** Class for the input element */
+        input?: string;
+        /** Size configurations for the input */
+        size?: {
+            /** Small size class */
+            small?: string;
+            /** Medium size class */
+            medium?: string;
+            /** Large size class */
+            large?: string;
+        };
+        /** Fill mode configurations for the input */
+        fillMode?: {
+            /** Solid fill mode class */
+            solid?: string;
+            /** Outline fill mode class */
+            outline?: string;
+            /** Flat fill mode class */
+            flat?: string;
+        };
+        /** Rounded border configurations */
+        rounded?: {
+            /** Small rounded border class */
+            small?: string;
+            /** Medium rounded border class */
+            medium?: string;
+            /** Large rounded border class */
+            large?: string;
+        };
+        /** Disabled state class */
+        disabled?: string;
+        /** Invalid state class */
+        invalid?: string;
+        /** RTL (right-to-left) layout class */
+        isRtl?: string;
+    };
+    /** Class for the inner part of the input */
+    inputInner?: string;
+}
+/**
+ * @hidden
+ */
+export declare const uMaskedTextBox: WidgetClassStructure;
+export interface TextBoxClasses {
+    /** Wrapper configurations for the text box */
+    wrapper?: {
+        /** Main class for the wrapper */
+        main?: string;
+        /** Class for the input element */
+        input?: string;
+        /** Size configurations for the input */
+        size?: {
+            /** Small size class */
+            small?: string;
+            /** Medium size class */
+            medium?: string;
+            /** Large size class */
+            large?: string;
+        };
+        /** Fill mode configurations for the input */
+        fillMode?: {
+            /** Solid fill mode class */
+            solid?: string;
+            /** Outline fill mode class */
+            outline?: string;
+            /** Flat fill mode class */
+            flat?: string;
+        };
+        /** Rounded border configurations */
+        rounded?: {
+            /** Small rounded border class */
+            small?: string;
+            /** Medium rounded border class */
+            medium?: string;
+            /** Large rounded border class */
+            large?: string;
+        };
+        /** Disabled state class */
+        disabled?: string;
+        /** Focused state class */
+        focused?: string;
+        /** Required state class */
+        required?: string;
+        /** Invalid state class */
+        invalid?: string;
+        /** RTL (right-to-left) layout class */
+        isRtl?: string;
+    };
+    /** Class for the inner part of the input */
+    inputInner?: string;
+    /** Prefix configurations for the input */
+    prefix?: {
+        /** Main class for the prefix */
+        main?: string;
+        /** Orientation configurations for the prefix */
+        orientation?: {
+            /** Horizontal orientation class */
+            horizontal?: string;
+            /** Vertical orientation class */
+            vertical?: string;
+        };
+    };
+    /** Suffix configurations for the input */
+    suffix?: {
+        /** Main class for the suffix */
+        main?: string;
+        /** Orientation configurations for the suffix */
+        orientation?: {
+            /** Horizontal orientation class */
+            horizontal?: string;
+            /** Vertical orientation class */
+            vertical?: string;
+        };
+    };
+}
+/**
+ * @hidden
+ */
+export declare const uTextBox: WidgetClassStructure;
+export interface InputClasses {
+    /** Input element configurations */
+    input?: {
+        /** Main class for the input, combining size, rounded, and fill mode */
+        main?: string;
+        /** Disabled state class */
+        disabled?: string;
+        /** Required state class */
+        required?: string;
+        /** Invalid state class */
+        invalid?: string;
+        /** RTL (right-to-left) layout class */
+        isRtl?: string;
+    };
+    /** Clear button class */
+    clearButton?: string;
+}
+/**
+ * @hidden
+ */
+export declare const uInput: WidgetClassStructure;

package/unstyled/inputs.mjs

@@ -6,7 +6,7 @@
  *-------------------------------------------------------------------------------------------
  */
 import { getClassByName as g } from "./interfaces/common.mjs";
-import { base as i, inputs as f, sizeMap as c, states as u, containers as z, elements as G, fillModeMap as x, roundedMap as v, orientationMap as b } from "./json-classes.mjs";
+import { base as i, inputs as f, elements as G, containers as z, states as u, sizeMap as c, roundedMap as x, fillModeMap as v, orientationMap as b } from "./json-classes.mjs";
 const s = `${i.prefix}-${f.input}`, y = `${i.prefix}-${f.maskedtextbox}`, m = `${i.prefix}-${f.radio}`, N = `${i.prefix}-${f.textbox}`, h = `${i.prefix}-${f.input}-${f.prefix}`, p = `${i.prefix}-${f.input}-${f.suffix}`, C = {
   input: {
     radio: m,
@@ -81,14 +81,14 @@ const s = `${i.prefix}-${f.input}`, y = `${i.prefix}-${f.maskedtextbox}`, m = `$
       large: `${s}-${c.large}`
     },
     fillMode: {
-      solid: `${s}-${x.solid}`,
-      outline: `${s}-${x.outline}`,
-      flat: `${s}-${x.flat}`
+      solid: `${s}-${v.solid}`,
+      outline: `${s}-${v.outline}`,
+      flat: `${s}-${v.flat}`
     },
     rounded: {
-      small: `${i.prefix}-${i.rounded}-${v.small}`,
-      medium: `${i.prefix}-${i.rounded}-${v.medium}`,
-      large: `${i.prefix}-${i.rounded}-${v.large}`
+      small: `${i.prefix}-${i.rounded}-${x.small}`,
+      medium: `${i.prefix}-${i.rounded}-${x.medium}`,
+      large: `${i.prefix}-${i.rounded}-${x.large}`
     },
     disabled: `${i.prefix}-${u.disabled}`,
     invalid: `${i.prefix}-${u.invalid}`,
@@ -121,14 +121,14 @@ const s = `${i.prefix}-${f.input}`, y = `${i.prefix}-${f.maskedtextbox}`, m = `$
       large: `${s}-${c.large}`
     },
     fillMode: {
-      solid: `${s}-${x.solid}`,
-      outline: `${s}-${x.outline}`,
-      flat: `${s}-${x.flat}`
+      solid: `${s}-${v.solid}`,
+      outline: `${s}-${v.outline}`,
+      flat: `${s}-${v.flat}`
     },
     rounded: {
-      small: `${i.prefix}-${i.rounded}-${v.small}`,
-      medium: `${i.prefix}-${i.rounded}-${v.medium}`,
-      large: `${i.prefix}-${i.rounded}-${v.large}`
+      small: `${i.prefix}-${i.rounded}-${x.small}`,
+      medium: `${i.prefix}-${i.rounded}-${x.medium}`,
+      large: `${i.prefix}-${i.rounded}-${x.large}`
     },
     disabled: `${i.prefix}-${u.disabled}`,
     focused: `${i.prefix}-${u.focus}`,
@@ -186,7 +186,7 @@ const s = `${i.prefix}-${f.input}`, y = `${i.prefix}-${f.maskedtextbox}`, m = `$
   }
 }, k = {
   input: {
-    main: `${s} ${s}-${c.medium} ${i.prefix}-${i.rounded}-${v.medium} ${s}-${x.solid}`,
+    main: `${s} ${s}-${c.medium} ${i.prefix}-${i.rounded}-${x.medium} ${s}-${v.solid}`,
     disabled: `${i.prefix}-${u.disabled}`,
     required: `${i.prefix}-${u.required}`,
     invalid: `${i.prefix}-${u.invalid}`,

package/unstyled/interfaces/common.d.ts

@@ -0,0 +1,138 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { AnimationClasses } from '../animations.js';
+import { ButtonClasses, ButtonGroupClasses, DropDownButtonClasses } from '../buttons.js';
+import { CalendarClasses, DateInputClasses, DateTimePickerClasses, TimeClasses, TimePickerClasses } from '../dateinputs.js';
+import { ComboBoxClasses, DropDownBaseClasses, DropDownListClasses, DropDownsActionSheetClasses } from '../dropdowns.js';
+import { FormClasses } from '../form.js';
+import { SVGIconClasses } from '../icons.js';
+import { InputClasses, MaskedTextBoxClasses, RadioButtonClasses, RadioGroupClasses, TextBoxClasses } from '../inputs.js';
+import { ErrorClasses, FloatingLabelClasses, HintClasses, LabelClasses } from '../labels.js';
+import { PopupClasses } from '../popup.js';
+/**
+ * @hidden
+ */
+export interface WidgetClassStructure {
+    [key: string]: (props: {
+        [key: string]: any;
+    }) => {
+        [key: string]: boolean;
+    } | string;
+}
+/**
+ * Animation classes
+ */
+export interface AnimationsClassStructure {
+    /** Animation styles and transition configuration */
+    uAnimation?: AnimationClasses;
+}
+/**
+ * Icons classes
+ */
+export interface IconsClassStructure {
+    /** SVG icon styling configuration */
+    uSvgIcon?: SVGIconClasses;
+}
+/**
+ * Buttons classes
+ */
+export interface ButtonsClassStructure {
+    /** Button component styling configuration */
+    uButton?: ButtonClasses;
+    /** Button group styling configuration */
+    uButtonGroup?: ButtonGroupClasses;
+    /** Drop-down button styling configuration */
+    uDropDownButton?: DropDownButtonClasses;
+}
+/**
+ * Popup classes
+ */
+export interface PopupClassStructure {
+    /** Popup component styling configuration */
+    uPopup?: PopupClasses;
+}
+/**
+ * Inputs classes
+ */
+export interface InputsClassStructure {
+    /** Masked text box styling configuration */
+    uMaskedTextBox?: MaskedTextBoxClasses;
+    /** Radio group styling configuration */
+    uRadioGroup?: RadioGroupClasses;
+    /** Radio button styling configuration */
+    uRadioButton?: RadioButtonClasses;
+    /** Text box styling configuration */
+    uTextBox?: TextBoxClasses;
+    /** Input component styling configuration */
+    uInput?: InputClasses;
+}
+/**
+ * DropDowns classes
+ */
+export interface DropDownsClassStructure {
+    /** DropDown action sheet styling configuration */
+    uDropDownsActionSheet?: DropDownsActionSheetClasses;
+    /** Base DropDown styling configuration */
+    uDropDownsBase?: DropDownBaseClasses;
+    /** DropDown list styling configuration */
+    uDropDownList?: DropDownListClasses;
+    /** ComboBox styling configuration */
+    uComboBox?: ComboBoxClasses;
+}
+/**
+ * Labels classes
+ */
+export interface LabelsClassStructure {
+    /** Error message styling configuration */
+    uError?: ErrorClasses;
+    /** Hint text styling configuration */
+    uHint?: HintClasses;
+    /** Label styling configuration */
+    uLabel?: LabelClasses;
+    /** Floating label styling configuration */
+    uFloatingLabel?: FloatingLabelClasses;
+}
+/**
+ * Form classes
+ */
+export interface FormClassStructure {
+    /** Form component styling configuration */
+    uForm?: FormClasses;
+}
+/**
+ * DateInputs classes
+ */
+export interface DateInputsClassStructure {
+    /** Calendar styling configuration */
+    uCalendar?: CalendarClasses;
+    /** Date input styling configuration */
+    uDateInput?: DateInputClasses;
+    /** Date time picker styling configuration */
+    uDateTimePicker?: DateTimePickerClasses;
+    /** Time component styling configuration */
+    uTime?: TimeClasses;
+    /** Time picker styling configuration */
+    uTimePicker?: TimePickerClasses;
+}
+/**
+ * @hidden
+ */
+export declare const getClassByName: (classedObject: {
+    [key: string]: any;
+}, name: string) => (props: {
+    [key: string]: any;
+}) => {
+    [x: number]: boolean;
+};
+/**
+ * @hidden
+ */
+export interface GridClassStructure {
+    /** Grid component styling configuration */
+    uGrid?: WidgetClassStructure;
+}