@jetbrains/ring-ui 4.1.4 → 5.0.0-beta.1

package/dist/query-assist/query-assist.js

@@ -12,11 +12,11 @@ import { preventDefault, getRect } from '../global/dom.js';
 import Caret from '../caret/caret.js';
 import ContentEditable from '../contenteditable/contenteditable.js';
 import PopupMenu from '../popup-menu/popup-menu.js';
-import LoaderInline from '../loader-inline/loader-inline.js';
+import ThemedLoaderInline from '../loader-inline/loader-inline.js';
 import Shortcuts from '../shortcuts/shortcuts.js';
 import rerenderHOC from '../global/rerender-hoc.js';
 import Theme from '../global/theme.js';
-import Button from '../button/button.js';
+import ThemedButton from '../button/button.js';
 import { Q as QueryAssistSuggestions, m as modules_da7ab055 } from '../_helpers/query-assist__suggestions.js';
 import 'react-dom/server';
 import '../popup/popup.js';
@@ -123,10 +123,29 @@ function cleanText(text) {
 
 
 class QueryAssist extends Component {
-  constructor() {
+  static getDerivedStateFromProps(_ref, _ref2) {
+    let {
+      query
+    } = _ref;
+    let {
+      prevQuery
+    } = _ref2;
+    const nextState = {
+      prevQuery: query
+    };
+
+    if (typeof query === 'string' && query !== prevQuery) {
+      nextState.query = query;
+      nextState.placeholderEnabled = !query;
+    }
+
+    return nextState;
+  }
+
+  constructor(_props) {
     var _this;
 
-    super(...arguments);
+    super(_props);
     _this = this;
 
     _defineProperty(this, "state", {
@@ -138,10 +157,16 @@ class QueryAssist extends Component {
       showPopup: false
     });
 
+    _defineProperty(this, "immediateState", void 0);
+
+    _defineProperty(this, "requestData", void 0);
+
     _defineProperty(this, "ngModelStateField", ngModelStateField);
 
     _defineProperty(this, "historyStack", []);
 
+    _defineProperty(this, "mouseIsDownOnPopup", void 0);
+
     _defineProperty(this, "handleFocusChange", e => {
       // otherwise it's blur and false
       const focus = e.type === 'focus';
@@ -164,33 +189,41 @@ class QueryAssist extends Component {
       }
 
       this.setState({
-        shortcuts: !!focus
+        shortcuts: focus
       });
     });
 
+    _defineProperty(this, "node", void 0);
+
     _defineProperty(this, "nodeRef", node => {
       this.node = node;
     });
 
     _defineProperty(this, "setCaretPosition", function () {
       let params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      const queryLength = _this.immediateState.query != null && _this.immediateState.query.length;
+      const queryLength = _this.immediateState.query != null ? _this.immediateState.query.length : 0;
       const newCaretPosition = _this.immediateState.caret < queryLength ? _this.immediateState.caret : queryLength;
 
       if (params.fromContentEditable) {
-        _this.immediateState.selection = _this.immediateState.selection ? _this.immediateState.selection : _this.state.query && _this.state.query.length;
+        _this.immediateState.selection = _this.immediateState.selection ? _this.immediateState.selection : _this.state.query && _this.state.query.length || null;
       }
 
       if (_this.immediateState.focus && !_this.props.disabled) {
-        if (Number.isInteger(_this.immediateState.selection) && _this.immediateState.selection > -1) {
+        if (typeof _this.immediateState.selection === 'number' && Number.isInteger(_this.immediateState.selection) && _this.immediateState.selection > -1) {
+          var _this$caret;
+
           // Set to end of field value if newCaretPosition is inappropriate
-          _this.caret.setPosition(newCaretPosition >= 0 ? newCaretPosition : -1);
+          (_this$caret = _this.caret) === null || _this$caret === void 0 ? void 0 : _this$caret.setPosition(newCaretPosition >= 0 ? newCaretPosition : -1);
 
           _this.scrollInput();
-        } else if (_this.immediateState.selection && _this.immediateState.selection.startOffset !== undefined) {
-          _this.caret.setPosition(_this.immediateState.selection);
+        } else if (_this.immediateState.selection && typeof _this.immediateState.selection === 'object' && _this.immediateState.selection.startOffset !== undefined) {
+          var _this$caret2;
+
+          (_this$caret2 = _this.caret) === null || _this$caret2 === void 0 ? void 0 : _this$caret2.setPosition(_this.immediateState.selection);
         } else if (!_this.immediateState.selection || params.forceSetCaret) {
-          _this.caret.setPosition(-1);
+          var _this$caret3;
+
+          (_this$caret3 = _this.caret) === null || _this$caret3 === void 0 ? void 0 : _this$caret3.setPosition(-1);
         }
       }
     });
@@ -207,13 +240,17 @@ class QueryAssist extends Component {
       }
     });
 
+    _defineProperty(this, "isComposing", void 0);
+
     _defineProperty(this, "handleInput", e => {
+      var _this$caret4, _currentCaret$positio;
+
       this.togglePlaceholder();
-      const currentCaret = this.caret.getPosition();
+      const currentCaret = (_this$caret4 = this.caret) === null || _this$caret4 === void 0 ? void 0 : _this$caret4.getPosition();
       const props = {
         dirty: true,
         query: this.getQuery(),
-        caret: Number.isInteger(currentCaret) ? currentCaret : currentCaret.position,
+        caret: typeof currentCaret === 'number' ? currentCaret : (_currentCaret$positio = currentCaret === null || currentCaret === void 0 ? void 0 : currentCaret.position) !== null && _currentCaret$positio !== void 0 ? _currentCaret$positio : 0,
         focus: true
       };
 
@@ -230,7 +267,9 @@ class QueryAssist extends Component {
       this.props.onChange(props);
 
       if (props.query.length > 0) {
-        this.requestData();
+        var _this$requestData;
+
+        (_this$requestData = this.requestData) === null || _this$requestData === void 0 ? void 0 : _this$requestData.call(this);
       }
     });
 
@@ -271,8 +310,7 @@ class QueryAssist extends Component {
     });
 
     _defineProperty(this, "undo", e => {
-      // eslint-disable-next-line no-unused-vars
-      const [current, previous] = this.historyStack.splice(0, 2);
+      const previous = this.historyStack.splice(0, 2)[1];
 
       if (!previous) {
         return;
@@ -281,7 +319,9 @@ class QueryAssist extends Component {
       this.setState({
         query: previous.query
       }, () => {
-        this.caret.setPosition(previous.caret);
+        var _this$caret5;
+
+        (_this$caret5 = this.caret) === null || _this$caret5 === void 0 ? void 0 : _this$caret5.setPosition(previous.caret);
         this.handleInput(e);
       });
     });
@@ -298,12 +338,14 @@ class QueryAssist extends Component {
     });
 
     _defineProperty(this, "handleCaretMove", e => {
+      var _this$caret6, _currentCaret$positio2;
+
       if (this.isComposing) {
         return;
       }
 
-      const currentCaret = this.caret.getPosition();
-      const caret = Number.isInteger(currentCaret) ? currentCaret : currentCaret.position;
+      const currentCaret = (_this$caret6 = this.caret) === null || _this$caret6 === void 0 ? void 0 : _this$caret6.getPosition();
+      const caret = typeof currentCaret === 'number' ? currentCaret : (_currentCaret$positio2 = currentCaret === null || currentCaret === void 0 ? void 0 : currentCaret.position) !== null && _currentCaret$positio2 !== void 0 ? _currentCaret$positio2 : 0;
       const popupHidden = !this.state.showPopup && e.type === 'click';
 
       if (!this.props.disabled && (caret !== this.immediateState.caret || popupHidden)) {
@@ -311,7 +353,9 @@ class QueryAssist extends Component {
         this.scrollInput();
 
         if (this.immediateState.query.length > 0) {
-          this.requestData();
+          var _this$requestData2;
+
+          (_this$requestData2 = this.requestData) === null || _this$requestData2 === void 0 ? void 0 : _this$requestData2.call(this);
         }
       }
 
@@ -322,24 +366,26 @@ class QueryAssist extends Component {
       }
     });
 
-    _defineProperty(this, "handleStyleRangesResponse", _ref => {
+    _defineProperty(this, "handleStyleRangesResponse", _ref3 => {
       let {
         suggestions,
         ...restProps
-      } = _ref;
+      } = _ref3;
       return this.handleResponse(restProps);
     });
 
-    _defineProperty(this, "handleResponse", function (_ref2) {
+    _defineProperty(this, "handleResponse", function (_ref4) {
       let {
         query = '',
         caret = 0,
         styleRanges,
         suggestions = []
-      } = _ref2;
+      } = _ref4;
       let afterCompletion = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
       return new Promise((resolve, reject) => {
         if (query === _this.getQuery() && (caret === _this.immediateState.caret || _this.immediateState.caret === undefined)) {
+          var _this$caret7;
+
           // Do not setState on unmounted component
           if (!_this.node) {
             return;
@@ -359,7 +405,7 @@ class QueryAssist extends Component {
             state.styleRanges = styleRanges;
           }
 
-          _this.immediateState.selection = _this.caret.getPosition({
+          _this.immediateState.selection = (_this$caret7 = _this.caret) === null || _this$caret7 === void 0 ? void 0 : _this$caret7.getPosition({
             avoidFocus: true
           });
 
@@ -384,6 +430,8 @@ class QueryAssist extends Component {
     });
 
     _defineProperty(this, "handleComplete", (data, replace) => {
+      var _suggestion$caret, _suggestion$caret2, _this$requestData3;
+
       if (!data || !data.data) {
         this.handleApply();
         return;
@@ -395,13 +443,15 @@ class QueryAssist extends Component {
       const prefix = suggestion.prefix || '';
       const suffix = suggestion.suffix || '';
       const state = {
-        caret: suggestion.caret,
-        selection: suggestion.caret,
+        caret: (_suggestion$caret = suggestion.caret) !== null && _suggestion$caret !== void 0 ? _suggestion$caret : 0,
+        selection: (_suggestion$caret2 = suggestion.caret) !== null && _suggestion$caret2 !== void 0 ? _suggestion$caret2 : 0,
         query: query.substr(0, suggestion.completionStart) + prefix + suggestion.option + suffix
       };
 
       if (typeof replace === 'boolean' && replace) {
-        state.query += this.immediateState.query.substr(suggestion.completionEnd);
+        var _suggestion$completio;
+
+        state.query += this.immediateState.query.substr((_suggestion$completio = suggestion.completionEnd) !== null && _suggestion$completio !== void 0 ? _suggestion$completio : 0);
       } else {
         state.query += this.immediateState.query.substr(this.immediateState.caret);
       }
@@ -427,7 +477,7 @@ class QueryAssist extends Component {
       }
 
       this.closePopup();
-      this.requestData(true);
+      (_this$requestData3 = this.requestData) === null || _this$requestData3 === void 0 ? void 0 : _this$requestData3.call(this, true);
     });
 
     _defineProperty(this, "requestStyleRanges", () => {
@@ -468,7 +518,9 @@ class QueryAssist extends Component {
       preventDefault(e);
 
       if (!this.state.showPopup) {
-        this.requestData();
+        var _this$requestData4;
+
+        (_this$requestData4 = this.requestData) === null || _this$requestData4 === void 0 ? void 0 : _this$requestData4.call(this);
       }
     });
 
@@ -506,6 +558,10 @@ class QueryAssist extends Component {
       });
     });
 
+    _defineProperty(this, "input", void 0);
+
+    _defineProperty(this, "caret", void 0);
+
     _defineProperty(this, "inputRef", node => {
       if (!node) {
         return;
@@ -515,22 +571,32 @@ class QueryAssist extends Component {
       this.caret = new Caret(this.input);
     });
 
+    _defineProperty(this, "_popup", void 0);
+
     _defineProperty(this, "popupRef", node => {
       this._popup = node;
     });
 
+    _defineProperty(this, "placeholder", void 0);
+
     _defineProperty(this, "placeholderRef", node => {
       this.placeholder = node;
     });
 
+    _defineProperty(this, "glass", void 0);
+
     _defineProperty(this, "glassRef", node => {
       this.glass = node;
     });
 
+    _defineProperty(this, "loader", void 0);
+
     _defineProperty(this, "loaderRef", node => {
       this.loader = node;
     });
 
+    _defineProperty(this, "clear", void 0);
+
     _defineProperty(this, "clearRef", node => {
       this.clear = node;
     });
@@ -539,9 +605,9 @@ class QueryAssist extends Component {
 
     _defineProperty(this, "shortcutsMap", {
       del: noop,
-      enter: this.handleComplete,
-      'command+enter': this.handleComplete,
-      'ctrl+enter': this.handleComplete,
+      enter: () => this.handleComplete(),
+      'command+enter': () => this.handleComplete(),
+      'ctrl+enter': () => this.handleComplete(),
       'ctrl+space': this.handleCtrlSpace,
       tab: this.handleTab,
       'meta+z': this.undo,
@@ -551,32 +617,21 @@ class QueryAssist extends Component {
       home: noop,
       end: noop
     });
-  }
-
-  static getDerivedStateFromProps(_ref3, _ref4) {
-    let {
-      query
-    } = _ref3;
-    let {
-      prevQuery
-    } = _ref4;
-    const nextState = {
-      prevQuery: query
-    };
 
-    if (typeof query === 'string' && query !== prevQuery) {
-      nextState.query = query;
-      nextState.placeholderEnabled = !query;
-    }
+    const _query = _props.query || '';
 
-    return nextState;
+    this.immediateState = {
+      query: _query,
+      caret: typeof _props.caret === 'number' && Number.isFinite(_props.caret) ? _props.caret : _query.length,
+      focus: Boolean(_props.autoOpen || _props.focus)
+    };
   }
 
   componentDidMount() {
     const query = this.props.query || '';
     this.immediateState = {
       query,
-      caret: Number.isFinite(this.props.caret) ? this.props.caret : query.length,
+      caret: typeof this.props.caret === 'number' && Number.isFinite(this.props.caret) ? this.props.caret : query.length,
       focus: Boolean(this.props.autoOpen || this.props.focus)
     };
     this.setupRequestHandler(this.props.delay);
@@ -615,7 +670,9 @@ class QueryAssist extends Component {
       this.immediateState.query = query;
 
       if (query && prevProps.autoOpen && query.length > 0) {
-        this.requestData();
+        var _this$requestData5;
+
+        (_this$requestData5 = this.requestData) === null || _this$requestData5 === void 0 ? void 0 : _this$requestData5.call(this);
       } else if (query) {
         this.requestStyleRanges();
       }
@@ -637,15 +694,19 @@ class QueryAssist extends Component {
   }
 
   scrollInput() {
-    const caretOffset = this.caret.getOffset();
+    var _this$caret8, _this$input, _this$input2, _this$input3;
+
+    const caretOffset = (_this$caret8 = this.caret) === null || _this$caret8 === void 0 ? void 0 : _this$caret8.getOffset();
 
-    if (this.input.clientWidth !== this.input.scrollWidth && caretOffset > this.input.clientWidth) {
+    if (((_this$input = this.input) === null || _this$input === void 0 ? void 0 : _this$input.clientWidth) !== ((_this$input2 = this.input) === null || _this$input2 === void 0 ? void 0 : _this$input2.scrollWidth) && caretOffset != null && ((_this$input3 = this.input) === null || _this$input3 === void 0 ? void 0 : _this$input3.clientWidth) != null && caretOffset > this.input.clientWidth) {
       this.input.scrollLeft += caretOffset;
     }
   }
 
   getQuery() {
-    return this.input.textContent.replace(/\s/g, ' ');
+    var _this$input$textConte, _this$input4, _this$input4$textCont;
+
+    return (_this$input$textConte = (_this$input4 = this.input) === null || _this$input4 === void 0 ? void 0 : (_this$input4$textCont = _this$input4.textContent) === null || _this$input4$textCont === void 0 ? void 0 : _this$input4$textCont.replace(/\s/g, ' ')) !== null && _this$input$textConte !== void 0 ? _this$input$textConte : '';
   }
 
   isRenderingGlassOrLoader() {
@@ -660,11 +721,11 @@ class QueryAssist extends Component {
     const queryIsSame = ((_this$historyStack$ = this.historyStack[0]) === null || _this$historyStack$ === void 0 ? void 0 : _this$historyStack$.query) === state.query;
 
     if (queryIsSet && !queryIsSame) {
-      var _this$caret$getPositi, _this$caret;
+      var _this$caret$getPositi, _this$caret9;
 
       this.historyStack.unshift({
         query: state.query,
-        caret: (_this$caret$getPositi = (_this$caret = this.caret) === null || _this$caret === void 0 ? void 0 : _this$caret.getPosition({
+        caret: (_this$caret$getPositi = (_this$caret9 = this.caret) === null || _this$caret9 === void 0 ? void 0 : _this$caret9.getPosition({
           avoidFocus: true
         })) !== null && _this$caret$getPositi !== void 0 ? _this$caret$getPositi : -1
       });
@@ -708,12 +769,14 @@ class QueryAssist extends Component {
     const suggestion = suggestions && suggestions[0]; // Check if suggestion begins not from the end
 
     const completionStart = suggestion && suggestion.completionStart !== suggestion.completionEnd && suggestion.completionStart;
-    const inputChildren = this.input.firstChild && this.input.firstChild.children;
-    const completionStartNode = inputChildren && Number.isInteger(completionStart) && inputChildren[Math.min(completionStart, inputChildren.length - 1)];
+    const inputChildren = this.input.firstChild instanceof Element && this.input.firstChild.children;
+    const completionStartNode = inputChildren && typeof completionStart === 'number' && inputChildren[Math.min(completionStart, inputChildren.length - 1)];
     let offset = completionStartNode && getRect(completionStartNode).right - getRect(this.input).left;
 
     if (!offset) {
-      const caret = this.caret.getOffset(); // Do not compensate caret in the beginning of field
+      var _this$caret$getOffset, _this$caret10;
+
+      const caret = (_this$caret$getOffset = (_this$caret10 = this.caret) === null || _this$caret10 === void 0 ? void 0 : _this$caret10.getOffset()) !== null && _this$caret$getOffset !== void 0 ? _this$caret$getOffset : 0; // Do not compensate caret in the beginning of field
 
       if (caret === 0) {
         return minOffset;
@@ -727,10 +790,12 @@ class QueryAssist extends Component {
   }
 
   blurInput() {
-    this.immediateState.selection = {};
+    this.immediateState.selection = null;
 
     if (!this.props.focus) {
-      this.caret.target.blur();
+      var _this$caret11;
+
+      (_this$caret11 = this.caret) === null || _this$caret11 === void 0 ? void 0 : _this$caret11.target.blur();
     }
   }
   /**
@@ -811,7 +876,7 @@ class QueryAssist extends Component {
       });
     }
 
-    return Array.from(query).map((letter, index, letters) => {
+    return query && Array.from(query).map((letter, index, letters) => {
       const className = classNames(modules_da7ab055.letter, classes[index] || LETTER_DEFAULT_CLASS);
       const dataTest = letters.length - 1 === index ? 'ring-query-assist-last-letter' : null; // \u00a0 === &nbsp;
 
@@ -842,11 +907,11 @@ class QueryAssist extends Component {
   }
 
   renderActions() {
-    const actions = [].concat(this.props.actions || []);
+    const actions = [...(this.props.actions || [])];
     const renderClear = this.props.clear && !!this.state.query;
 
     if (renderClear) {
-      actions.push( /*#__PURE__*/React.createElement(Button, {
+      actions.push( /*#__PURE__*/React.createElement(ThemedButton, {
         icon: closeIcon,
         key: 'clearAction',
         className: modules_da7ab055.icon,
@@ -878,7 +943,6 @@ class QueryAssist extends Component {
       [`${modules_da7ab055.input} ring-js-shortcuts`]: true,
       [modules_da7ab055.inputGap]: actions.length || this.isRenderingGlassOrLoader() && !glass,
       [modules_da7ab055.inputGap2]: actions.length === 2,
-      // TODO: replace with flex-box layout
       [modules_da7ab055.inputLeftGap]: this.isRenderingGlassOrLoader() && glass,
       [modules_da7ab055.inputDisabled]: this.props.disabled
     });
@@ -890,7 +954,7 @@ class QueryAssist extends Component {
     }, this.state.shortcuts && /*#__PURE__*/React.createElement(Shortcuts, {
       map: this.shortcutsMap,
       scope: this.shortcutsScope
-    }), renderGlass && /*#__PURE__*/React.createElement(Button, {
+    }), renderGlass && /*#__PURE__*/React.createElement(ThemedButton, {
       icon: searchIcon,
       className: modules_da7ab055.icon,
       iconClassName: modules_da7ab055.iconInner,
@@ -903,7 +967,7 @@ class QueryAssist extends Component {
         [modules_da7ab055.loaderOnTheRight]: !glass
       }),
       ref: this.loaderRef
-    }, /*#__PURE__*/React.createElement(LoaderInline, {
+    }, /*#__PURE__*/React.createElement(ThemedLoaderInline, {
       theme: theme
     })), /*#__PURE__*/React.createElement(ContentEditable, {
       "aria-label": this.props.translations.searchTitle,
@@ -956,7 +1020,7 @@ class QueryAssist extends Component {
       maxHeight: PopupMenu.PopupProps.MaxHeight.SCREEN,
       onMouseDown: this.trackPopupMouseState,
       onMouseUp: this.trackPopupMouseState,
-      onSelect: this.handleComplete
+      onSelect: item => this.handleComplete(item)
     }));
   }
 

package/dist/query-assist/query-assist__suggestions.d.ts

@@ -0,0 +1,29 @@
+/// <reference types="react" />
+import { ListDataItem } from '../list/consts';
+export interface QueryAssistSuggestion {
+    description: string;
+    group: string;
+    icon?: string | undefined;
+    option: string;
+    prefix?: string | undefined;
+    suffix?: string | undefined;
+    className?: string | undefined;
+    matchingStart?: number;
+    matchingEnd?: number;
+    caret?: number;
+    completionStart?: number;
+    completionEnd?: number;
+}
+export interface SuggestionItem {
+    data?: QueryAssistSuggestion;
+}
+export default class QueryAssistSuggestions {
+    static createKey(suggestion: QueryAssistSuggestion): string;
+    static renderLabel(suggestion: QueryAssistSuggestion): JSX.Element;
+    static renderGroupSeparator(suggestion: QueryAssistSuggestion, prevSuggestion: string): {
+        key: string;
+        description: string;
+        rgItemType: import("../list/consts").Type;
+    } | null;
+    static renderList(suggestions: readonly QueryAssistSuggestion[], suggestionRenderer: (suggestion: QueryAssistSuggestion) => ListDataItem<SuggestionItem>): ListDataItem<SuggestionItem>[];
+}

package/dist/radio/radio.d.ts

@@ -0,0 +1,18 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { RadioProps } from './radio__item';
+/**
+ * @name Radio
+ */
+export default class Radio extends Component<RadioProps> {
+    static propTypes: {
+        name: PropTypes.Requireable<string>;
+        disabled: PropTypes.Requireable<boolean>;
+        value: PropTypes.Requireable<string | number | boolean>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
+    };
+    static Item: React.ForwardRefExoticComponent<import("./radio__item").RadioItemProps & React.RefAttributes<import("./radio__item").Radio>>;
+    uid: string;
+    render(): JSX.Element;
+}

package/dist/radio/radio__item.d.ts

@@ -0,0 +1,28 @@
+import React, { Component, InputHTMLAttributes } from 'react';
+import PropTypes from 'prop-types';
+export interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange'> {
+    value?: string | undefined;
+    onChange?: ((value: string) => void) | null | undefined;
+}
+export declare const RadioContext: React.Context<RadioProps>;
+export declare class Radio extends Component<InputHTMLAttributes<HTMLInputElement>> {
+    static propTypes: {
+        className: PropTypes.Requireable<string>;
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        value: PropTypes.Requireable<string>;
+        name: PropTypes.Requireable<string>;
+        checked: PropTypes.Requireable<boolean>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+    uid: string;
+    input?: HTMLElement | null;
+    inputRef: (el: HTMLElement | null) => void;
+    label?: HTMLElement | null;
+    labelRef: (el: HTMLElement | null) => void;
+    render(): JSX.Element;
+}
+export interface RadioItemProps extends InputHTMLAttributes<HTMLInputElement> {
+    value: string;
+}
+declare const RadioItem: React.ForwardRefExoticComponent<RadioItemProps & React.RefAttributes<Radio>>;
+export default RadioItem;

package/dist/radio/radio__item.js

@@ -12,10 +12,14 @@ class Radio extends Component {
 
     _defineProperty(this, "uid", getUID('ring-radio-item-'));
 
+    _defineProperty(this, "input", void 0);
+
     _defineProperty(this, "inputRef", el => {
       this.input = el;
     });
 
+    _defineProperty(this, "label", void 0);
+
     _defineProperty(this, "labelRef", el => {
       this.label = el;
     });
@@ -33,7 +37,6 @@ class Radio extends Component {
       className: classes,
       htmlFor: this.uid
     }, /*#__PURE__*/React.createElement("input", _extends({
-      name: name,
       id: this.uid
     }, restProps, {
       ref: this.inputRef,
@@ -68,7 +71,7 @@ const RadioItem = /*#__PURE__*/forwardRef(function RadioItem(props, ref) {
       ref: ref
     }, restContext, {
       checked: value != null ? value === props.value : undefined,
-      onChange: onChange && (() => onChange(props.value))
+      onChange: onChange != null ? () => onChange(props.value) : undefined
     }, props));
   });
 });