@jetbrains/ring-ui 4.1.5 → 5.0.0-beta.2

package/components/query-assist/query-assist__suggestions.js

@@ -1,100 +0,0 @@
-import React from 'react';
-
-import List from '../list/list';
-
-import styles from './query-assist.css';
-
-const ICON_ID_LENGTH = 44;
-
-
-export default class QueryAssistSuggestions {
-
-  /*
-  * Pay attention that this method produces not a 100% unique key.
-  * Consider to use a unique identifier provided by a server.
-   */
-  static createKey(suggestion) {
-    const {
-      description,
-      group,
-      icon,
-      option,
-      prefix = '',
-      suffix = ''
-    } = suggestion;
-
-    return prefix + option + suffix + group + description +
-      (icon ? icon.substring(icon.length - ICON_ID_LENGTH) : '');
-  }
-
-  static renderLabel(suggestion) {
-    const {
-      className,
-      matchingStart,
-      matchingEnd,
-      option,
-      prefix = '',
-      suffix = ''
-    } = suggestion;
-
-    let wrappedOption;
-    let before = '';
-    let after = '';
-
-    if (matchingStart !== matchingEnd) {
-      before = option.substring(0, matchingStart);
-      wrappedOption = (
-        <span className={styles.highlight}>
-          {option.substring(matchingStart, matchingEnd)}
-        </span>
-      );
-      after = option.substring(matchingEnd);
-    } else {
-      wrappedOption = option;
-    }
-
-    const wrappedPrefix = prefix && <span className={styles.service}>{prefix}</span>;
-    const wrappedSuffix = suffix && <span className={styles.service}>{suffix}</span>;
-
-    return (
-      <span className={className}>
-        {wrappedPrefix}{before}{wrappedOption}{after}{wrappedSuffix}
-      </span>
-    );
-  }
-
-  static renderGroupSeparator(suggestion, prevSuggestion) {
-    const {group, option} = suggestion;
-    const {SEPARATOR} = List.ListProps.Type;
-
-    if (prevSuggestion !== group) {
-      return {
-        key: option + group + SEPARATOR,
-        description: group,
-        rgItemType: SEPARATOR
-      };
-    }
-
-    return null;
-  }
-
-  static renderList(suggestions, suggestionRenderer) {
-    const renderedSuggestions = [];
-
-    suggestions.forEach((suggestion, index, arr) => {
-      const prevSuggestionGroup = arr[index - 1] && arr[index - 1].group;
-      const groupSeparator = QueryAssistSuggestions.renderGroupSeparator(
-        suggestion, prevSuggestionGroup
-      );
-
-      if (groupSeparator) {
-        renderedSuggestions.push(groupSeparator);
-      }
-
-      renderedSuggestions.push(suggestionRenderer(suggestion));
-    });
-
-    return renderedSuggestions;
-  }
-
-}

package/components/radio/radio.examples.js

@@ -1,58 +0,0 @@
-import React, {Fragment, useState} from 'react';
-
-import reactDecorator from '../../.storybook/react-decorator';
-
-import Radio from '@jetbrains/ring-ui/components/radio/radio';
-
-export default {
-  title: 'Components/Radio',
-  decorators: [reactDecorator()],
-
-  parameters: {
-    notes:
-      'Displays a radio button. Adopted from [react-radio-group](https://github.com/chenglou/react-radio-group).'
-  }
-};
-
-function RadioExample() {
-  const [value, onChange] = useState('one');
-  return (
-    <Fragment>
-      Selected: {value}
-      <Radio value={value} onChange={onChange}>
-        <Radio.Item value="one">One</Radio.Item>
-        <Radio.Item value="two">Two</Radio.Item>
-        <Radio.Item value="three">Three</Radio.Item>
-      </Radio>
-    </Fragment>
-  );
-}
-
-export const basic = () => <RadioExample/>;
-
-basic.storyName = 'basic';
-
-export const uncontrolled = () => (
-  <Radio>
-    <Radio.Item value="one" defaultChecked>
-      One
-    </Radio.Item>
-    <Radio.Item value="two">Two</Radio.Item>
-    <Radio.Item value="three">Three</Radio.Item>
-  </Radio>
-);
-
-uncontrolled.storyName = 'uncontrolled';
-uncontrolled.parameters = {hermione: {skip: true}};
-
-export const disabled = () => (
-  <Radio disabled>
-    <Radio.Item value="one" defaultChecked>
-      One
-    </Radio.Item>
-    <Radio.Item value="two">Two</Radio.Item>
-    <Radio.Item value="three">Three</Radio.Item>
-  </Radio>
-);
-
-disabled.storyName = 'disabled';

package/components/radio/radio.js

@@ -1,37 +0,0 @@
-import React, {Component} from 'react';
-import PropTypes from 'prop-types';
-
-import getUID from '../global/get-uid';
-
-import RadioItem, {RadioContext} from './radio__item';
-
-/**
- * @name Radio
- */
-
-export default class Radio extends Component {
-  static propTypes = {
-    name: PropTypes.string,
-    disabled: PropTypes.bool,
-    value: PropTypes.oneOfType([
-      PropTypes.string,
-      PropTypes.number,
-      PropTypes.bool
-    ]),
-    onChange: PropTypes.func,
-    children: PropTypes.node.isRequired
-  };
-
-  static Item = RadioItem;
-
-  uid = getUID('ring-radio-');
-
-  render() {
-    return (
-      <RadioContext.Provider value={{name: this.uid, ...this.props}}>
-        {this.props.children}
-      </RadioContext.Provider>
-    );
-  }
-}
-

package/components/radio/radio.test.js

@@ -1,90 +0,0 @@
-import React from 'react';
-import {Simulate} from 'react-dom/test-utils';
-import {shallow, mount} from 'enzyme';
-
-import Radio from './radio';
-
-describe('Radio', () => {
-  const factory = (props, refOne, refTwo) => (
-    <Radio
-      value={null}
-      {...props}
-    >
-      <Radio.Item
-        ref={refOne}
-        value="one"
-      >
-        {'One'}
-      </Radio.Item>
-      <Radio.Item
-        ref={refTwo}
-        value="two"
-      >
-        {'Two'}
-      </Radio.Item>
-      <Radio.Item value="three">{'Three'}</Radio.Item>
-    </Radio>
-  );
-  const shallowRadio = (props, refOne, refTwo) => shallow(factory(props, refOne, refTwo));
-
-  it('should create component', () => {
-    shallowRadio().should.exist;
-  });
-
-  it('should pass only child as is', () => {
-    const radio = shallow(
-      <Radio>
-        <test/>
-      </Radio>
-    );
-
-    radio.should.have.tagName('test');
-  });
-
-  describe('refs', () => {
-    const mountRadio = (props, refOne, refTwo) => mount(factory(props, refOne, refTwo));
-    it('should generate same name for items', () => {
-      let item1;
-      let item2;
-      mountRadio(
-        {},
-        itemRef => {
-          item1 = itemRef;
-        },
-        itemRef2 => {
-          item2 = itemRef2;
-        }
-      );
-      const name = item1.input.getAttribute('name');
-
-      item2.input.should.have.attribute('name', name);
-    });
-
-
-    it('should select item with value equal to one provided to group', () => {
-      let item;
-      mountRadio(
-        {
-          onChange: () => {}, // avoid "checked without onChange" warning
-          value: 'one'
-        },
-        itemRef => {
-          item = itemRef;
-        }
-      );
-
-      item.input.should.have.property('checked', true);
-    });
-
-    it('should call handler for onChange event', () => {
-      const onChange = sandbox.spy();
-      let item;
-      mountRadio({onChange}, itemRef => {
-        item = itemRef;
-      });
-      Simulate.change(item.input);
-
-      onChange.should.have.been.called;
-    });
-  });
-});

package/components/radio/radio__item.js

@@ -1,69 +0,0 @@
-import React, {Component, createContext, forwardRef} from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-
-import getUID from '../global/get-uid';
-
-import styles from './radio.css';
-
-export const RadioContext = createContext({});
-
-export class Radio extends Component {
-  static propTypes = {
-    className: PropTypes.string,
-    children: PropTypes.node,
-    value: PropTypes.string,
-    name: PropTypes.string,
-    checked: PropTypes.bool,
-    onChange: PropTypes.func
-  };
-
-  uid = getUID('ring-radio-item-');
-
-  inputRef = el => {
-    this.input = el;
-  };
-
-  labelRef = el => {
-    this.label = el;
-  };
-
-  render() {
-    const {className, children, ...restProps} = this.props;
-
-    const classes = classNames(styles.radio, className);
-
-    return (
-      <label ref={this.labelRef} className={classes} htmlFor={this.uid}>
-        <input
-          name={name}
-          id={this.uid}
-          {...restProps}
-          ref={this.inputRef}
-          className={styles.input}
-          type="radio"
-        />
-        <span className={styles.circle}/>
-        <span className={styles.label}>{children}</span>
-      </label>
-    );
-  }
-}
-
-const RadioItem = forwardRef(function RadioItem(props, ref) {
-  return (
-    <RadioContext.Consumer>
-      {({value, onChange, ...restContext}) => (
-        <Radio
-          ref={ref}
-          {...restContext}
-          checked={value != null ? value === props.value : undefined}
-          onChange={onChange && (() => onChange(props.value))}
-          {...props}
-        />
-      )}
-    </RadioContext.Consumer>
-  );
-});
-RadioItem.propTypes = Radio.propTypes;
-export default RadioItem;

package/components/radio/radio__item.test.js

@@ -1,98 +0,0 @@
-import React from 'react';
-import {Simulate} from 'react-dom/test-utils';
-import {shallow, mount} from 'enzyme';
-
-import {Radio} from './radio__item';
-
-describe('Radio Item', () => {
-  function noop() {}
-
-  const factory = props => (
-    <Radio
-      checked={false}
-      onChange={noop}
-      value="test"
-      {...props}
-    >
-      {'test'}
-    </Radio>
-  );
-  const mountRadioItem = props => mount(factory(props));
-  const shallowRadioItem = props => shallow(factory(props));
-
-  it('should create component', () => {
-    shallowRadioItem().should.exist;
-  });
-
-  it('should render radio item', () => {
-    mountRadioItem().instance().input.should.have.property('type', 'radio');
-  });
-
-  it('should generate id if not passed', () => {
-    mountRadioItem().instance().input.should.have.property('id');
-  });
-
-  it('should generate unique id', () => {
-    const firstRadioItem = mountRadioItem();
-    const secondRadioItem = mountRadioItem();
-    const secondRadioId = secondRadioItem.instance().input.getAttribute('id');
-    firstRadioItem.instance().input.should.not.have.id(secondRadioId);
-  });
-
-  it('should set custom id', () => {
-    const radioItem = mountRadioItem({
-      id: 'test'
-    });
-
-    radioItem.instance().input.should.have.id('test');
-  });
-
-  it('should set name', () => {
-    const radioItem = mountRadioItem({
-      name: 'test'
-    });
-
-    radioItem.instance().input.should.have.property('name', 'test');
-  });
-
-  it('should call handler for click event', () => {
-    const clickHandler = sandbox.stub();
-    const radioItem = mountRadioItem({
-      onClick: clickHandler
-    });
-
-    Simulate.click(radioItem.instance().input);
-    clickHandler.should.have.been.called;
-  });
-
-  it('should be unchecked by default', () => {
-    const radioItem = mountRadioItem();
-
-    radioItem.instance().input.should.not.have.property('checked', true);
-  });
-
-  it('should check control', () => {
-    const radioItem = mountRadioItem({
-      checked: true,
-      onChange: () => {} // avoid "checked without onChange" warning
-    });
-
-    radioItem.instance().input.should.have.property('checked', true);
-  });
-
-  it('should be disabled', () => {
-    const radioItem = mountRadioItem({
-      disabled: true
-    });
-
-    radioItem.instance().input.should.be.disabled;
-  });
-
-
-  it('should connect labels with input by id', () => {
-    const radioItem = mountRadioItem();
-    const id = radioItem.instance().input.getAttribute('id');
-
-    radioItem.instance().label.should.have.attribute('for', id);
-  });
-});