diff --git a/docs/lib/Components/InputGroupPage.js b/docs/lib/Components/InputGroupPage.js index 794e32866..1206b66f5 100644 --- a/docs/lib/Components/InputGroupPage.js +++ b/docs/lib/Components/InputGroupPage.js @@ -51,12 +51,6 @@ export default class InputGroupPage extends React.Component { className: PropTypes.string }; -InputGroupAddOn.propTypes = { - tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), - addonType: PropTypes.oneOf(['prepend', 'append']).isRequired, - className: PropTypes.string -}; - InputGroupButton.propTypes = { tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), addonType: PropTypes.oneOf(['prepend', 'append']).isRequired, @@ -79,7 +73,7 @@ InputGroupButton.propTypes = { - Addon Sizing + Input Group Sizing
diff --git a/docs/lib/examples/InputGroupAddon.js b/docs/lib/examples/InputGroupAddon.js index 9199934b5..da5c3345b 100644 --- a/docs/lib/examples/InputGroupAddon.js +++ b/docs/lib/examples/InputGroupAddon.js @@ -1,31 +1,23 @@ import React from 'react'; -import { InputGroup, InputGroupText, InputGroupAddon, Input } from 'reactstrap'; +import { InputGroup, InputGroupText, Input } from 'reactstrap'; const Example = (props) => { return (
- - To the Left! - + To the Left!
- - To the Right! - + To the Right!
- - To the Left! - + To the Left! - - To the Right! - + To the Right!
); diff --git a/docs/lib/examples/InputGroupButton.js b/docs/lib/examples/InputGroupButton.js index 2706f2355..13d42864b 100644 --- a/docs/lib/examples/InputGroupButton.js +++ b/docs/lib/examples/InputGroupButton.js @@ -1,8 +1,7 @@ import React, { useState } from 'react'; import { InputGroup, - InputGroupAddon, - InputGroupButtonDropdown, + Dropdown, Input, Button, DropdownToggle, @@ -21,13 +20,13 @@ const Example = (props) => { return (
- +
- + Button Dropdown @@ -38,11 +37,11 @@ const Example = (props) => { Another Action - +
- + @@ -52,9 +51,9 @@ const Example = (props) => { Another Action - + - +
); diff --git a/docs/lib/examples/InputGroupButtonShorthand.js b/docs/lib/examples/InputGroupButtonShorthand.js index 2d935da09..742fa171b 100644 --- a/docs/lib/examples/InputGroupButtonShorthand.js +++ b/docs/lib/examples/InputGroupButtonShorthand.js @@ -1,31 +1,23 @@ import React from 'react'; -import { InputGroup, InputGroupAddon, Button, Input } from 'reactstrap'; +import { InputGroup, Button, Input } from 'reactstrap'; const Example = (props) => { return (
- - - +
- - - +
- - - + - - - +
); diff --git a/docs/lib/examples/InputGroupOverview.js b/docs/lib/examples/InputGroupOverview.js index f16d4dd7b..39d0f7c37 100644 --- a/docs/lib/examples/InputGroupOverview.js +++ b/docs/lib/examples/InputGroupOverview.js @@ -1,48 +1,38 @@ import React from 'react'; -import { InputGroup, InputGroupAddon, InputGroupText, Input } from 'reactstrap'; +import { InputGroup, InputGroupText, Input } from 'reactstrap'; const Example = (props) => { return (
- - @ - + @
- - - - - + + +
- - @example.com - + @example.com
- - $ - $ - + $ + $ - - $ - $ - + $ + $
- $ + $ - .00 + .00
); diff --git a/docs/lib/examples/InputGroupSizing.js b/docs/lib/examples/InputGroupSizing.js index 1f7522119..57a857689 100644 --- a/docs/lib/examples/InputGroupSizing.js +++ b/docs/lib/examples/InputGroupSizing.js @@ -1,21 +1,21 @@ import React from 'react'; -import { InputGroup, InputGroupAddon, Input } from 'reactstrap'; +import { InputGroup, InputGroupText, Input } from 'reactstrap'; const Example = (props) => { return (
- @lg + @lg
- @normal + @normal
- @sm + @sm
diff --git a/src/Dropdown.js b/src/Dropdown.js index 7ae01117f..4ff39dc37 100644 --- a/src/Dropdown.js +++ b/src/Dropdown.js @@ -16,7 +16,6 @@ const propTypes = { isOpen: PropTypes.bool, nav: PropTypes.bool, active: PropTypes.bool, - addonType: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['prepend', 'append'])]), size: PropTypes.string, tag: tagPropType, toggle: PropTypes.func, @@ -34,7 +33,6 @@ const defaultProps = { direction: 'down', nav: false, active: false, - addonType: false, inNavbar: false, setActiveFromChild: false }; @@ -252,7 +250,6 @@ class Dropdown extends React.Component { nav, setActiveFromChild, active, - addonType, tag, menuRole, ...attrs @@ -275,10 +272,9 @@ class Dropdown extends React.Component { nav && active ? 'active' : false, setActiveFromChild && subItemIsActive ? 'active' : false, { - [`input-group-${addonType}`]: addonType, 'btn-group': group, [`btn-group-${size}`]: !!size, - dropdown: !group && !addonType, + dropdown: !group, show: isOpen, 'nav-item': nav } diff --git a/src/InputGroupAddon.js b/src/InputGroupAddon.js deleted file mode 100644 index 19767e87a..000000000 --- a/src/InputGroupAddon.js +++ /dev/null @@ -1,51 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import classNames from 'classnames'; -import { mapToCssModules, tagPropType } from './utils'; -import InputGroupText from './InputGroupText'; - -const propTypes = { - tag: tagPropType, - addonType: PropTypes.oneOf(['prepend', 'append']).isRequired, - children: PropTypes.node, - className: PropTypes.string, - cssModule: PropTypes.object, -}; - -const defaultProps = { - tag: 'div' -}; - -const InputGroupAddon = (props) => { - const { - className, - cssModule, - tag: Tag, - addonType, - children, - ...attributes - } = props; - - const classes = mapToCssModules(classNames( - className, - 'input-group-' + addonType - ), cssModule); - - // Convenience to assist with transition - if (typeof children === 'string') { - return ( - - - - ); - } - - return ( - - ); -}; - -InputGroupAddon.propTypes = propTypes; -InputGroupAddon.defaultProps = defaultProps; - -export default InputGroupAddon; diff --git a/src/__tests__/InputGroupAddon.spec.js b/src/__tests__/InputGroupAddon.spec.js deleted file mode 100644 index 2f0e86d55..000000000 --- a/src/__tests__/InputGroupAddon.spec.js +++ /dev/null @@ -1,51 +0,0 @@ -import React from 'react'; -import { shallow } from 'enzyme'; -import { InputGroupAddon, InputGroupText } from '../'; - -describe('InputGroupAddon', () => { - it('should render with "div" tag', () => { - const wrapper = shallow(Yo!); - - expect(wrapper.type()).toBe('div'); - }); - - it('should render children', () => { - const wrapper = shallow(Yo!); - - expect(wrapper.text()).toBe(''); - }); - - it('should render children provided', () => { - const wrapper = shallow(); - - expect(wrapper.childAt(0).type()).toBe('button'); - }); - - it('should render the string provided in the child InputGroupText', () => { - const wrapper = shallow(Yo!); - - expect(wrapper.childAt(0).type()).toBe(InputGroupText); - expect(wrapper.childAt(0).prop('children')).toBe('Yo!'); - }); - - it('should render with "input-group-*" classes', () => { - const wrapperPrepend = shallow(Yo!); - const wrapperAppend = shallow(Yo!); - - expect(wrapperPrepend.hasClass('input-group-prepend')).toBe(true); - expect(wrapperAppend.hasClass('input-group-append')).toBe(true); - }); - - it('should render additional classes', () => { - const wrapper = shallow(Yo!); - - expect(wrapper.hasClass('other')).toBe(true); - expect(wrapper.hasClass('input-group-append')).toBe(true); - }); - - it('should render custom tag', () => { - const wrapper = shallow(Yo!); - - expect(wrapper.type()).toBe('main'); - }); -}); diff --git a/src/index.js b/src/index.js index b1b9db4b9..3ddce3224 100644 --- a/src/index.js +++ b/src/index.js @@ -63,7 +63,6 @@ export FormGroup from './FormGroup'; export FormText from './FormText'; export Input from './Input'; export InputGroup from './InputGroup'; -export InputGroupAddon from './InputGroupAddon'; export InputGroupButtonDropdown from './InputGroupButtonDropdown'; export InputGroupText from './InputGroupText'; export Label from './Label'; diff --git a/types/index.d.ts b/types/index.d.ts index 5c5c680dd..d12420a32 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -82,8 +82,6 @@ export { default as Input } from './lib/Input'; export { InputProps } from './lib/Input'; export { default as InputGroup } from './lib/InputGroup'; export { InputGroupProps } from './lib/InputGroup'; -export { default as InputGroupAddon } from './lib/InputGroupAddon'; -export { InputGroupAddonProps } from './lib/InputGroupAddon'; export { default as InputGroupButtonDropdown } from './lib/InputGroupButtonDropdown'; export { InputGroupButtonDropdownProps } from './lib/InputGroupButtonDropdown'; export { default as InputGroupText } from './lib/InputGroupText'; diff --git a/types/lib/InputGroupAddon.d.ts b/types/lib/InputGroupAddon.d.ts deleted file mode 100644 index 1af263492..000000000 --- a/types/lib/InputGroupAddon.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -import * as React from 'react'; -import { CSSModule } from './index'; - -export interface InputGroupAddonProps - extends React.HTMLAttributes { - [key: string]: any; - tag?: React.ElementType; - cssModule?: CSSModule; - addonType: 'prepend' | 'append'; -} - -declare class InputGroupAddon extends React.Component {} -export default InputGroupAddon; diff --git a/types/lib/index.d.ts b/types/lib/index.d.ts index c795adbaa..6a345268d 100644 --- a/types/lib/index.d.ts +++ b/types/lib/index.d.ts @@ -86,8 +86,6 @@ export { default as Input } from './Input'; export { InputProps } from './Input'; export { default as InputGroup } from './InputGroup'; export { InputGroupProps } from './InputGroup'; -export { default as InputGroupAddon } from './InputGroupAddon'; -export { InputGroupAddonProps } from './InputGroupAddon'; export { default as InputGroupButtonDropdown } from './InputGroupButtonDropdown'; export { InputGroupButtonDropdownProps } from './InputGroupButtonDropdown'; export { default as InputGroupText } from './InputGroupText'; diff --git a/types/reactstrap-tests.tsx b/types/reactstrap-tests.tsx index 415592c9d..3a7c69854 100644 --- a/types/reactstrap-tests.tsx +++ b/types/reactstrap-tests.tsx @@ -44,7 +44,6 @@ import { FormText, Input, InputGroup, - InputGroupAddon, InputGroupButtonDropdown, InputGroupText, Pagination, @@ -1897,42 +1896,38 @@ const Example52 = (props: any) => { return (
- @ + @
- + - +
- @example.com + @example.com
- - $ - $ - + $ + $ - - $ - $ - + $ + $
- $ + $ - .00 + .00
); @@ -1942,19 +1937,19 @@ const Example53 = (props: any) => { return (
- To the Left! + To the Left!
- To the Right! + To the Right!
- To the Left! + To the Left! - To the Right! + To the Right!
); @@ -1964,17 +1959,17 @@ const Example54 = (props: any) => { return (
- @lg + @lg
- @normal + @normal
- @sm + @sm
@@ -1985,23 +1980,17 @@ const Example55 = (props: any) => { return (
- - - +
-
- - - - +
); @@ -2011,17 +2000,17 @@ const Example56 = (props: any) => { return (
- @lg + @lg
- @normal + @normal
- @sm + @sm
@@ -2032,23 +2021,17 @@ const Example57 = (props: any) => { return (
- - - +
-
- - - - +
); @@ -2058,25 +2041,25 @@ const Example58 = (props: any) => { return (
- To the Left! + To the Left!
- + To the Right! - +
- + To the Left! - + - + To the Right! - +
); @@ -4731,9 +4714,7 @@ const Example116 = (props: any) => { return (
- - - +
@@ -4764,9 +4745,7 @@ const Example116 = (props: any) => { - - - +
); @@ -4849,7 +4828,6 @@ import { default as FormGroup_ } from './lib/FormGroup'; /* tslint:disable-line: import { default as FormText_ } from './lib/FormText'; /* tslint:disable-line: no-relative-import-in-test */ import { default as Input_ } from './lib/Input'; /* tslint:disable-line: no-relative-import-in-test */ import { default as InputGroup_ } from './lib/InputGroup'; /* tslint:disable-line: no-relative-import-in-test */ -import { default as InputGroupAddon_ } from './lib/InputGroupAddon'; /* tslint:disable-line: no-relative-import-in-test */ import { default as InputGroupButtonDropdown_ } from './lib/InputGroupButtonDropdown'; /* tslint:disable-line: no-relative-import-in-test */ import { default as InputGroupText_ } from './lib/InputGroupText'; /* tslint:disable-line: no-relative-import-in-test */ import { default as Label_ } from './lib/Label'; /* tslint:disable-line: no-relative-import-in-test */ @@ -4951,12 +4929,6 @@ function AnyPropExample() { - { ()} /> ()} /> ()} {...htmlProps} /> - ()} - {...htmlProps} - addonType="append" - /> ()} {...htmlProps} />