@jetbrains/ring-ui 4.1.12 → 5.0.0-beta.11

package/dist/tags-input/tags-input.d.ts

@@ -0,0 +1,154 @@
+import React, { Component, PureComponent, SyntheticEvent } from 'react';
+import PropTypes from 'prop-types';
+import Select, { SelectItem } from '../select/select';
+import { TagType } from '../tags-list/tags-list';
+import Caret from '../caret/caret';
+import { Filter } from '../select/select__popup';
+declare function noop(): void;
+export interface ToggleTagParams {
+    tag: TagType;
+}
+export interface TagsInputRequestParams {
+    query: string;
+}
+export interface TagsInputProps {
+    dataSource: (params: TagsInputRequestParams) => readonly SelectItem[] | Promise<readonly SelectItem[]>;
+    onAddTag: (params: ToggleTagParams) => void;
+    onRemoveTag: (params: ToggleTagParams) => void;
+    customTagComponent: Component;
+    maxPopupHeight: number;
+    minPopupWidth: number;
+    canNotBeEmpty: boolean;
+    disabled: boolean;
+    autoOpen: boolean;
+    renderOptimization: boolean;
+    legacyMode: boolean;
+    allowAddNewTags: boolean;
+    filter: boolean | Filter;
+    placeholder: string;
+    className?: string | null | undefined;
+    tags?: readonly TagType[] | null | undefined;
+    loadingMessage?: string | undefined;
+    notFoundMessage?: string | undefined;
+}
+interface TagsInputState {
+    tags: TagType[];
+    prevTags: TagType[] | null;
+    suggestions: SelectItem[];
+    loading: boolean;
+    focused: boolean;
+    query: string;
+    activeIndex: number | null | undefined;
+}
+export default class TagsInput extends PureComponent<TagsInputProps, TagsInputState> {
+    static propTypes: {
+        className: PropTypes.Requireable<string>;
+        tags: PropTypes.Requireable<any[]>;
+        /**
+         * Datasource should return array(or promise) of suggestions.
+         * Each suggestion should contain key and label fields.
+         * DataSource should handle caching and response racing (when later request
+         * responded earlier) by himself.
+         */
+        dataSource: PropTypes.Requireable<(...args: any[]) => any>;
+        onAddTag: PropTypes.Requireable<(...args: any[]) => any>;
+        onRemoveTag: PropTypes.Requireable<(...args: any[]) => any>;
+        customTagComponent: PropTypes.Requireable<React.Component<unknown, unknown, unknown>>;
+        maxPopupHeight: PropTypes.Requireable<number>;
+        minPopupWidth: PropTypes.Requireable<number>;
+        placeholder: PropTypes.Requireable<string>;
+        canNotBeEmpty: PropTypes.Requireable<boolean>;
+        disabled: PropTypes.Requireable<boolean>;
+        autoOpen: PropTypes.Requireable<boolean>;
+        renderOptimization: PropTypes.Requireable<boolean>;
+        legacyMode: PropTypes.Requireable<boolean>;
+        filter: PropTypes.Requireable<boolean | PropTypes.InferProps<{
+            fn: PropTypes.Requireable<(...args: any[]) => any>;
+        }>>;
+        loadingMessage: PropTypes.Requireable<string>;
+        notFoundMessage: PropTypes.Requireable<string>;
+        allowAddNewTags: PropTypes.Requireable<boolean>;
+    };
+    static defaultProps: {
+        dataSource: typeof noop;
+        onAddTag: typeof noop;
+        onRemoveTag: typeof noop;
+        customTagComponent: null;
+        maxPopupHeight: number;
+        minPopupWidth: number;
+        canNotBeEmpty: boolean;
+        disabled: boolean;
+        autoOpen: boolean;
+        renderOptimization: boolean;
+        legacyMode: boolean;
+        allowAddNewTags: boolean;
+        filter: {
+            fn: () => boolean;
+        };
+        placeholder: string;
+    };
+    constructor(props: TagsInputProps);
+    state: TagsInputState;
+    static getDerivedStateFromProps({ tags }: TagsInputProps, { prevTags }: TagsInputState): {
+        prevTags: readonly TagType[] | null | undefined;
+    };
+    componentDidMount(): void;
+    static ngModelStateField: string;
+    ngModelStateField: string;
+    node?: HTMLElement | null;
+    nodeRef: (node: HTMLElement | null) => void;
+    input?: HTMLInputElement | null;
+    caret?: Caret;
+    getInputNode(): HTMLInputElement | null | undefined;
+    setActiveIndex(activeIndex?: number | null): void;
+    focusInput: () => void;
+    addTag: (tag: TagType | null) => void;
+    onRemoveTag(tagToRemove: TagType): Promise<void | TagType[]>;
+    clickHandler: (event: SyntheticEvent) => void;
+    filterExistingTags: (suggestions: readonly SelectItem[]) => SelectItem<unknown>[];
+    loadSuggestions: (query?: string) => void;
+    private _focusHandler;
+    private _blurHandler;
+    selectTag: (moveForward?: boolean | undefined) => void;
+    handleKeyDown: (event: React.KeyboardEvent) => boolean;
+    handleClick: (arg: TagType) => () => void;
+    handleRemove: (arg: TagType) => () => Promise<void | TagType[]>;
+    handleTagCreation: (label: string) => void;
+    select?: Select | null;
+    selectRef: (el: Select | null) => void;
+    render(): JSX.Element;
+}
+export declare const RerenderableTagsInput: {
+    new (props: TagsInputProps): {
+        _propsCache: Readonly<TagsInputProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        rerender(props?: Partial<TagsInputProps>, callback?: (() => void) | undefined): void | Element | React.Component<TagsInputProps, any, any>;
+        node?: HTMLElement | null | undefined;
+        context: any;
+        setState<K extends keyof TagsInputState>(state: TagsInputState | ((prevState: Readonly<TagsInputState>, props: Readonly<TagsInputProps>) => TagsInputState | Pick<TagsInputState, K> | null) | Pick<TagsInputState, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        render(): React.ReactNode;
+        readonly props: Readonly<TagsInputProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        state: Readonly<TagsInputState>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        componentDidMount?(): void;
+        shouldComponentUpdate?(nextProps: Readonly<TagsInputProps>, nextState: Readonly<TagsInputState>, nextContext: any): boolean;
+        componentWillUnmount?(): void;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<TagsInputProps>, prevState: Readonly<TagsInputState>): any;
+        componentDidUpdate?(prevProps: Readonly<TagsInputProps>, prevState: Readonly<TagsInputState>, snapshot?: any): void;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<TagsInputProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<TagsInputProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<TagsInputProps>, nextState: Readonly<TagsInputState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<TagsInputProps>, nextState: Readonly<TagsInputState>, nextContext: any): void;
+    };
+};
+export declare type TagsInputAttrs = JSX.LibraryManagedAttributes<typeof TagsInput, TagsInputProps>;
+export {};

package/dist/tags-input/tags-input.js

@@ -8,12 +8,14 @@ import TagsList from '../tags-list/tags-list.js';
 import Caret from '../caret/caret.js';
 import memoize from '../global/memoize.js';
 import rerenderHOC from '../global/rerender-hoc.js';
-import '@jetbrains/icons/chevron-10px';
+import '@jetbrains/icons/chevron-down';
 import '@jetbrains/icons/close';
 import 'deep-equal';
 import '../dropdown/dropdown.js';
 import '../global/data-tests.js';
+import '../global/typescript-utils.js';
 import '../_helpers/anchor.js';
+import '@jetbrains/icons/chevron-10px';
 import '../icon/icon.js';
 import 'util-deprecate';
 import '../icon/icon__constants.js';
@@ -21,8 +23,8 @@ import '../_helpers/icon.js';
 import '../icon/icon__svg.js';
 import '../button/button.js';
 import 'focus-visible';
-import '../global/theme.js';
 import '../link/clickableLink.js';
+import '../global/controls-height.js';
 import '../_helpers/button__classes.js';
 import '../avatar/avatar.js';
 import '../global/url.js';
@@ -63,23 +65,20 @@ import '../list/list__separator.js';
 import '../list/list__hint.js';
 import '../list/consts.js';
 import '../input/input.js';
+import '../global/prop-types.js';
+import '../global/composeRefs.js';
 import '../_helpers/input.js';
 import '../global/fuzzy-highlight.js';
 import '../select/select__popup.js';
 import '@jetbrains/icons/search';
 import '../loader-inline/loader-inline.js';
-import '../_helpers/inject-styles.js';
-import '../global/conic-gradient.js';
-import 'conic-gradient';
-import '../global/supports-css.js';
-import '../global/inject-styles.js';
-import '../global/radial-gradient-mask.js';
+import '../_helpers/loader-inline.js';
 import '../shortcuts/shortcuts-hoc.js';
 import '../text/text.js';
 import '../_helpers/select__filter.js';
 import '../tag/tag.js';
 
-var modules_5aa8aaf3 = {"tagsInput":"tagsInput_rui_7738","tagsInputLegacyMode":"tagsInputLegacyMode_rui_7738","tagsList":"tagsList_rui_7738","tag":"tag_rui_7738","tagsInputDisabled":"tagsInputDisabled_rui_7738","underline":"underline_rui_7738","tagsInputFocused":"tagsInputFocused_rui_7738","tagsSelect":"tagsSelect_rui_7738","focusUnderline":"focusUnderline_rui_7738"};
+var modules_5aa8aaf3 = {"outerContainer":"outerContainer_rui_90de","container":"container_rui_90de","input":"input_rui_90de","tagsInput":"tagsInput_rui_25d3","tagsInputLegacyMode":"tagsInputLegacyMode_rui_25d3","tagsList":"tagsList_rui_25d3","tag":"tag_rui_25d3","tagsInputDisabled":"tagsInputDisabled_rui_25d3","underline":"underline_rui_25d3","tagsInputFocused":"tagsInputFocused_rui_25d3","tagsSelect":"tagsSelect_rui_25d3","focusUnderline":"focusUnderline_rui_25d3"};
 
 function noop() {}
 /**
@@ -105,18 +104,34 @@ class TagsInput extends PureComponent {
       activeIndex: 0
     });
 
+    _defineProperty(this, "ngModelStateField", void 0);
+
+    _defineProperty(this, "node", void 0);
+
     _defineProperty(this, "nodeRef", node => {
       this.node = node;
     });
 
+    _defineProperty(this, "input", void 0);
+
+    _defineProperty(this, "caret", void 0);
+
     _defineProperty(this, "focusInput", () => {
-      this.getInputNode().focus();
+      var _this$getInputNode;
+
+      (_this$getInputNode = this.getInputNode()) === null || _this$getInputNode === void 0 ? void 0 : _this$getInputNode.focus();
     });
 
     _defineProperty(this, "addTag", tag => {
+      var _this$select, _this$select2;
+
+      if (tag == null) {
+        return;
+      }
+
       const isUniqueTag = this.state.tags.filter(item => tag.key === item.key).length === 0;
-      this.select.clear();
-      this.select.filterValue('');
+      (_this$select = this.select) === null || _this$select === void 0 ? void 0 : _this$select.clear();
+      (_this$select2 = this.select) === null || _this$select2 === void 0 ? void 0 : _this$select2.filterValue('');
 
       if (isUniqueTag) {
         this.setState(prevState => ({
@@ -130,11 +145,13 @@ class TagsInput extends PureComponent {
     });
 
     _defineProperty(this, "clickHandler", event => {
+      var _this$getInputNode2;
+
       if (event.target !== this.node) {
         return;
       }
 
-      this.loadSuggestions(this.getInputNode().value);
+      this.loadSuggestions((_this$getInputNode2 = this.getInputNode()) === null || _this$getInputNode2 === void 0 ? void 0 : _this$getInputNode2.value);
       this.focusInput();
     });
 
@@ -150,13 +167,11 @@ class TagsInput extends PureComponent {
         query
       }, async () => {
         try {
-          let allSuggestions = _this.props.dataSource({
+          const suggestionsResult = _this.props.dataSource({
             query
           });
 
-          if (typeof allSuggestions.then === 'function') {
-            allSuggestions = await allSuggestions;
-          }
+          const allSuggestions = Array.isArray(suggestionsResult) ? suggestionsResult : await suggestionsResult;
 
           const suggestions = _this.filterExistingTags(allSuggestions);
 
@@ -203,27 +218,35 @@ class TagsInput extends PureComponent {
     });
 
     _defineProperty(this, "handleKeyDown", event => {
+      var _this$select3, _this$select3$_popup;
+
       const key = getEventKey(event);
 
-      const isInputFocused = () => event.target.matches(this.getInputNode().tagName);
+      const isInputFocused = () => {
+        var _this$getInputNode$ta, _this$getInputNode3;
+
+        return event.target instanceof Element && event.target.matches((_this$getInputNode$ta = (_this$getInputNode3 = this.getInputNode()) === null || _this$getInputNode3 === void 0 ? void 0 : _this$getInputNode3.tagName) !== null && _this$getInputNode$ta !== void 0 ? _this$getInputNode$ta : '');
+      };
 
       if (key === ' ' && this.props.allowAddNewTags) {
+        var _this$getInputNode4;
+
         event.stopPropagation();
-        const value = this.getInputNode().value;
+        const value = (_this$getInputNode4 = this.getInputNode()) === null || _this$getInputNode4 === void 0 ? void 0 : _this$getInputNode4.value;
 
-        if (value !== '') {
+        if (value != null && value !== '') {
           this.handleTagCreation(value);
         }
 
         return true;
       }
 
-      if (this.select._popup.isVisible()) {
+      if ((_this$select3 = this.select) !== null && _this$select3 !== void 0 && (_this$select3$_popup = _this$select3._popup) !== null && _this$select3$_popup !== void 0 && _this$select3$_popup.isVisible()) {
         return true;
       }
 
       if (key === 'ArrowLeft') {
-        if (this.getInputNode() && this.caret.getPosition() > 0) {
+        if (this.getInputNode() && this.caret != null && this.caret.getPosition() > 0) {
           return true;
         }
 
@@ -234,7 +257,9 @@ class TagsInput extends PureComponent {
       if (key === 'ArrowRight' && !isInputFocused()) {
         if (this.state.activeIndex === this.state.tags.length - 1) {
           if (!this.props.disabled) {
-            this.getInputNode().focus();
+            var _this$getInputNode5;
+
+            (_this$getInputNode5 = this.getInputNode()) === null || _this$getInputNode5 === void 0 ? void 0 : _this$getInputNode5.focus();
             this.setActiveIndex();
           }
         } else {
@@ -245,18 +270,20 @@ class TagsInput extends PureComponent {
       }
 
       if (!this.props.disabled) {
-        if (key === 'Backspace' && !this.getInputNode().value) {
-          event.preventDefault();
-          const tagsLength = this.state.tags.length;
+        var _this$getInputNode6;
 
-          this.select._hidePopup(true); // otherwise confirmation may be overlapped by popup
+        if (key === 'Backspace' && !((_this$getInputNode6 = this.getInputNode()) !== null && _this$getInputNode6 !== void 0 && _this$getInputNode6.value)) {
+          var _this$select4;
 
+          event.preventDefault();
+          const tagsLength = this.state.tags.length;
+          (_this$select4 = this.select) === null || _this$select4 === void 0 ? void 0 : _this$select4._hidePopup(true); // otherwise confirmation may be overlapped by popup
 
           this.onRemoveTag(this.state.tags[tagsLength - 1]);
           return false;
         }
 
-        if ((key === 'Delete' || key === 'Backspace') && this.state.tags[this.state.activeIndex]) {
+        if ((key === 'Delete' || key === 'Backspace') && this.state.activeIndex != null && this.state.tags[this.state.activeIndex]) {
           this.onRemoveTag(this.state.tags[this.state.activeIndex]).then(() => this.selectTag(true));
           return false;
         }
@@ -278,6 +305,8 @@ class TagsInput extends PureComponent {
       });
     });
 
+    _defineProperty(this, "select", void 0);
+
     _defineProperty(this, "selectRef", el => {
       this.select = el;
     });
@@ -308,17 +337,23 @@ class TagsInput extends PureComponent {
 
   componentDidMount() {
     if (this.props.autoOpen && !this.props.disabled) {
+      var _this$select5;
+
       this.focusInput();
       this.loadSuggestions();
-
-      this.select._showPopup();
+      (_this$select5 = this.select) === null || _this$select5 === void 0 ? void 0 : _this$select5._showPopup();
     }
   }
 
   getInputNode() {
     if (!this.input) {
-      this.input = this.select.filter;
-      this.caret = new Caret(this.input);
+      var _this$select6;
+
+      this.input = (_this$select6 = this.select) === null || _this$select6 === void 0 ? void 0 : _this$select6.filter;
+
+      if (this.input) {
+        this.caret = new Caret(this.input);
+      }
     }
 
     return this.input;
@@ -429,13 +464,7 @@ _defineProperty(TagsInput, "propTypes", {
   dataSource: PropTypes.func,
   onAddTag: PropTypes.func,
   onRemoveTag: PropTypes.func,
-  customTagComponent: (props, propName, componentName) => {
-    if (props[propName] && !props[propName].prototype instanceof Component) {
-      return new Error(`Invalid prop ${propName} supplied to ${componentName}. Validation failed.`);
-    }
-
-    return null;
-  },
+  customTagComponent: PropTypes.instanceOf(Component),
   maxPopupHeight: PropTypes.number,
   minPopupWidth: PropTypes.number,
   placeholder: PropTypes.string,

package/dist/tags-input-ng/tags-input-ng.js

@@ -10,12 +10,14 @@ import 'prop-types';
 import 'classnames';
 import '../global/get-event-key.js';
 import '../select/select.js';
-import '@jetbrains/icons/chevron-10px';
+import '@jetbrains/icons/chevron-down';
 import '@jetbrains/icons/close';
 import 'deep-equal';
 import '../dropdown/dropdown.js';
 import '../global/data-tests.js';
+import '../global/typescript-utils.js';
 import '../_helpers/anchor.js';
+import '@jetbrains/icons/chevron-10px';
 import '../icon/icon.js';
 import 'util-deprecate';
 import '../icon/icon__constants.js';
@@ -24,8 +26,8 @@ import '../icon/icon__svg.js';
 import '../global/memoize.js';
 import '../button/button.js';
 import 'focus-visible';
-import '../global/theme.js';
 import '../link/clickableLink.js';
+import '../global/controls-height.js';
 import '../_helpers/button__classes.js';
 import '../avatar/avatar.js';
 import '../global/url.js';
@@ -65,18 +67,15 @@ import '../list/list__separator.js';
 import '../list/list__hint.js';
 import '../list/consts.js';
 import '../input/input.js';
+import '../global/prop-types.js';
+import '../global/composeRefs.js';
 import '../_helpers/input.js';
 import '../global/rerender-hoc.js';
 import '../global/fuzzy-highlight.js';
 import '../select/select__popup.js';
 import '@jetbrains/icons/search';
 import '../loader-inline/loader-inline.js';
-import '../_helpers/inject-styles.js';
-import '../global/conic-gradient.js';
-import 'conic-gradient';
-import '../global/supports-css.js';
-import '../global/inject-styles.js';
-import '../global/radial-gradient-mask.js';
+import '../_helpers/loader-inline.js';
 import '../shortcuts/shortcuts-hoc.js';
 import '../tags-list/tags-list.js';
 import '../tag/tag.js';

package/dist/tags-list/tags-list.d.ts

@@ -0,0 +1,46 @@
+import React, { Component, ComponentType, HTMLAttributes, ReactNode } from 'react';
+import PropTypes from 'prop-types';
+import { TagAttrs } from '../tag/tag';
+declare function noop(): void;
+export interface TagType extends Omit<TagAttrs, 'onClick'> {
+    label?: ReactNode;
+    key?: string | number | null | undefined;
+}
+export interface TagsListProps<T extends TagType> extends HTMLAttributes<HTMLElement> {
+    tags: readonly T[];
+    customTagComponent: ComponentType<TagAttrs>;
+    canNotBeEmpty: boolean;
+    disabled: boolean;
+    handleClick: (tag: T) => (e: React.MouseEvent<HTMLElement>) => void;
+    handleRemove: (tag: T) => (e: React.MouseEvent<HTMLElement>) => void;
+    activeIndex?: number | null | undefined;
+    tagClassName?: string | null | undefined;
+}
+/**
+ * @name Tags List
+ */
+export default class TagsList<T extends TagType> extends Component<TagsListProps<T>> {
+    static propTypes: {
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        tags: PropTypes.Requireable<any[]>;
+        customTagComponent: PropTypes.Requireable<PropTypes.ReactComponentLike>;
+        activeIndex: PropTypes.Requireable<number>;
+        canNotBeEmpty: PropTypes.Requireable<boolean>;
+        disabled: PropTypes.Requireable<boolean>;
+        handleClick: PropTypes.Requireable<(...args: any[]) => any>;
+        handleRemove: PropTypes.Requireable<(...args: any[]) => any>;
+        className: PropTypes.Requireable<string>;
+        tagClassName: PropTypes.Requireable<string>;
+    };
+    static defaultProps: {
+        customTagComponent: null;
+        canNotBeEmpty: boolean;
+        disabled: boolean;
+        handleClick: typeof noop;
+        handleRemove: typeof noop;
+    };
+    renderTag(tag: T, focusTag: boolean): JSX.Element;
+    render(): JSX.Element;
+}
+export declare type TagsListAttrs<T extends TagType = TagType> = JSX.LibraryManagedAttributes<typeof TagsList, TagsListProps<T>>;
+export {};

package/dist/tags-list/tags-list.js

@@ -13,8 +13,8 @@ import '../global/memoize.js';
 import '../button/button.js';
 import 'focus-visible';
 import '@jetbrains/icons/chevron-10px';
-import '../global/theme.js';
 import '../link/clickableLink.js';
+import '../global/controls-height.js';
 import '../_helpers/button__classes.js';
 
 function noop() {}
@@ -66,13 +66,7 @@ class TagsList extends Component {
 _defineProperty(TagsList, "propTypes", {
   children: PropTypes.node,
   tags: PropTypes.array,
-  customTagComponent: (props, propName, componentName) => {
-    if (props[propName] && !props[propName].prototype instanceof Component) {
-      return new Error(`Invalid prop ${propName} supplied to ${componentName}. Validation failed.`);
-    }
-
-    return null;
-  },
+  customTagComponent: PropTypes.elementType,
   activeIndex: PropTypes.number,
   canNotBeEmpty: PropTypes.bool,
   disabled: PropTypes.bool,

package/dist/text/text.d.ts

@@ -0,0 +1,17 @@
+import { Component, HTMLAttributes } from 'react';
+import PropTypes from 'prop-types';
+export interface TextProps extends HTMLAttributes<HTMLElement> {
+    info?: boolean | null | undefined;
+    'data-test'?: string | null | undefined;
+}
+/**
+ * @name Text
+ */
+export default class Text extends Component<TextProps> {
+    static propTypes: {
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        info: PropTypes.Requireable<boolean>;
+        className: PropTypes.Requireable<string>;
+    };
+    render(): JSX.Element;
+}

package/dist/text/text.js

@@ -3,7 +3,7 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 
-var modules_78d1bce6 = {"text":"text_rui_594d","info":"info_rui_594d"};
+var modules_78d1bce6 = {"text":"text_rui_e570","info":"info_rui_e570"};
 
 /**
  * @name Text

package/dist/toggle/toggle.d.ts

@@ -0,0 +1,39 @@
+import { InputHTMLAttributes, PureComponent, ReactNode } from 'react';
+import PropTypes from 'prop-types';
+export declare const Size: {
+    Size14: string;
+    Size16: string;
+    Size20: string;
+};
+/**
+  * @name Toggle
+  */
+export interface ToggleProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    size: string;
+    pale?: boolean | null | undefined;
+    leftLabel?: ReactNode;
+    'data-test'?: string | null | undefined;
+}
+declare class Toggle extends PureComponent<ToggleProps> {
+    static propTypes: {
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        name: PropTypes.Requireable<string>;
+        className: PropTypes.Requireable<string>;
+        title: PropTypes.Requireable<string>;
+        leftLabel: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        defaultChecked: PropTypes.Requireable<boolean>;
+        checked: PropTypes.Requireable<boolean>;
+        disabled: PropTypes.Requireable<boolean>;
+        pale: PropTypes.Requireable<boolean>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onTransitionEnd: PropTypes.Requireable<(...args: any[]) => any>;
+        size: PropTypes.Requireable<string>;
+        'data-test': PropTypes.Requireable<string>;
+    };
+    static defaultProps: {
+        size: string;
+    };
+    render(): JSX.Element;
+}
+export declare type ToggleAttrs = JSX.LibraryManagedAttributes<typeof Toggle, ToggleProps>;
+export default Toggle;

package/dist/toggle/toggle.js

@@ -2,18 +2,15 @@ import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBa
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import { withTheme } from '../global/theme.js';
 import joinDataTestAttributes from '../global/data-tests.js';
 
-var modules_331c5aa7 = {"unit":"8px","padding":"2px","disabled-line-color":"hsla(0,0%,100%,.9)","duration":".3s","timing-function":"cubic-bezier(.23,1,.32,1)","toggle":"toggle_rui_0d32","switch":"switch_rui_0d32","disabled":"disabled_rui_0d32","label":"label_rui_0d32","leftLabel":"leftLabel_rui_0d32","light":"light_rui_0d32","dark":"dark_rui_0d32","switchWrapper":"switchWrapper_rui_0d32","input":"input_rui_0d32","size20":"size20_rui_0d32","paleSwitch":"paleSwitch_rui_0d32"};
+var modules_331c5aa7 = {"unit":"8px","padding":"2px","disabled-line-color":"hsla(0,0%,100%,.9)","duration":".3s","timing-function":"cubic-bezier(.23,1,.32,1)","toggle":"toggle_rui_843e","switch":"switch_rui_843e","disabled":"disabled_rui_843e","label":"label_rui_843e","leftLabel":"leftLabel_rui_843e","switchWrapper":"switchWrapper_rui_843e","input":"input_rui_843e","size16":"size16_rui_843e","size14":"size14_rui_843e","size20":"size20_rui_843e","paleSwitch":"paleSwitch_rui_843e"};
 
 const Size = {
+  Size14: modules_331c5aa7.size14,
   Size16: modules_331c5aa7.size16,
   Size20: modules_331c5aa7.size20
 };
-/**
-  * @name Toggle
-  */
 
 class Toggle extends PureComponent {
   render() {
@@ -24,13 +21,12 @@ class Toggle extends PureComponent {
       pale,
       title,
       leftLabel,
-      theme,
       size = Size.Size16,
       'data-test': dataTest,
       onTransitionEnd,
       ...restProps
     } = this.props;
-    const classes = classNames(className, size, modules_331c5aa7.toggle, modules_331c5aa7[theme], disabled && modules_331c5aa7.disabled);
+    const classes = classNames(className, size, modules_331c5aa7.toggle, disabled && modules_331c5aa7.disabled);
     return /*#__PURE__*/React.createElement("label", {
       className: classes,
       title: title,
@@ -67,11 +63,12 @@ _defineProperty(Toggle, "propTypes", {
   pale: PropTypes.bool,
   onChange: PropTypes.func,
   onTransitionEnd: PropTypes.func,
-  theme: PropTypes.string,
   size: PropTypes.oneOf(Object.values(Size)),
   'data-test': PropTypes.string
 });
 
-var Toggle$1 = withTheme()(Toggle);
+_defineProperty(Toggle, "defaultProps", {
+  size: Size.Size14
+});
 
-export { Size, Toggle$1 as default };
+export { Size, Toggle as default };

package/dist/toggle-ng/toggle-ng.js

@@ -8,7 +8,6 @@ import '../global/ring-angular-component.js';
 import '../global/react-dom-renderer.js';
 import 'prop-types';
 import 'classnames';
-import '../global/theme.js';
 import '../global/data-tests.js';
 
 var toggleNg = angularComponentFactory(Toggle, 'Toggle').name;