changed to custom prop

cerner · Oct 19, 2023 · f90274c · f90274c
1 parent ec690dd
commit f90274c
Show file tree

Hide file tree

Showing 20 changed files with 6 additions and 184 deletions.
diff --git a/packages/terra-action-header/tests/jest/__snapshots__/ActionHeader.test.jsx.snap b/packages/terra-action-header/tests/jest/__snapshots__/ActionHeader.test.jsx.snap
@@ -21,7 +21,6 @@ exports[`ActionHeader correctly applies the theme context className 1`] = `
         isDisabled={false}
         isIconOnly={true}
         isReversed={false}
-        isSelectable={false}
         onClick={[Function]}
         text="Terra.actionHeader.close"
         type="button"
@@ -76,7 +75,6 @@ exports[`ActionHeader correctly applies the theme context className 1`] = `
         isDisabled={false}
         isIconOnly={true}
         isReversed={false}
-        isSelectable={false}
         onClick={[Function]}
         text="Terra.actionHeader.maximize"
         type="button"
@@ -117,7 +115,6 @@ exports[`ActionHeader should render an action header with back and close buttons
         isDisabled={false}
         isIconOnly={true}
         isReversed={false}
-        isSelectable={false}
         onClick={[Function]}
         text="Terra.actionHeader.close"
         type="button"
@@ -144,7 +141,6 @@ exports[`ActionHeader should render an action header with back and close buttons
         isDisabled={false}
         isIconOnly={true}
         isReversed={false}
-        isSelectable={false}
         onClick={[Function]}
         text="Terra.actionHeader.back"
         type="button"
@@ -178,7 +174,6 @@ exports[`ActionHeader should render an action header with back button and title
         isDisabled={false}
         isIconOnly={true}
         isReversed={false}
-        isSelectable={false}
         onClick={[Function]}
         text="Terra.actionHeader.back"
         type="button"
@@ -210,7 +205,6 @@ exports[`ActionHeader should render an action header with close button and title
         isDisabled={false}
         isIconOnly={true}
         isReversed={false}
-        isSelectable={false}
         onClick={[Function]}
         text="Terra.actionHeader.close"
         type="button"
@@ -239,7 +233,6 @@ exports[`ActionHeader should render an action header with custom button and titl
     isDisabled={false}
     isIconOnly={false}
     isReversed={false}
-    isSelectable={false}
     onClick={[Function]}
     text="Custom Button"
     type="button"
@@ -281,7 +274,6 @@ exports[`ActionHeader should render an action header with maximize button and ti
         isDisabled={false}
         isIconOnly={true}
         isReversed={false}
-        isSelectable={false}
         onClick={[Function]}
         text="Terra.actionHeader.maximize"
         type="button"
@@ -316,7 +308,6 @@ exports[`ActionHeader should render an action header with minimize button and ti
         isDisabled={false}
         isIconOnly={true}
         isReversed={false}
-        isSelectable={false}
         onClick={[Function]}
         text="Terra.actionHeader.minimize"
         type="button"
@@ -343,7 +334,6 @@ exports[`ActionHeader should render an action header with multiple custom button
       isDisabled={false}
       isIconOnly={false}
       isReversed={false}
-      isSelectable={false}
       onClick={[Function]}
       text="Custom Button"
       type="button"
@@ -355,7 +345,6 @@ exports[`ActionHeader should render an action header with multiple custom button
       isDisabled={false}
       isIconOnly={false}
       isReversed={false}
-      isSelectable={false}
       onClick={[Function]}
       text="Custom Button"
       type="button"
@@ -390,7 +379,6 @@ exports[`ActionHeader should render an action header with next and previous butt
           isDisabled={false}
           isIconOnly={true}
           isReversed={false}
-          isSelectable={false}
           onClick={[Function]}
           text="Terra.actionHeader.previous"
           type="button"
@@ -409,7 +397,6 @@ exports[`ActionHeader should render an action header with next and previous butt
           isDisabled={false}
           isIconOnly={true}
           isReversed={false}
-          isSelectable={false}
           onClick={[Function]}
           text="Terra.actionHeader.next"
           type="button"
@@ -457,7 +444,6 @@ exports[`ActionHeader should render an action header with title, enabled next bu
           isDisabled={true}
           isIconOnly={true}
           isReversed={false}
-          isSelectable={false}
           text="Terra.actionHeader.previous"
           type="button"
           variant="utility"
@@ -475,7 +461,6 @@ exports[`ActionHeader should render an action header with title, enabled next bu
           isDisabled={false}
           isIconOnly={true}
           isReversed={false}
-          isSelectable={false}
           onClick={[Function]}
           text="Terra.actionHeader.next"
           type="button"
@@ -513,7 +498,6 @@ exports[`ActionHeader should render an action header with title, enabled previou
           isDisabled={false}
           isIconOnly={true}
           isReversed={false}
-          isSelectable={false}
           onClick={[Function]}
           text="Terra.actionHeader.previous"
           type="button"
@@ -532,7 +516,6 @@ exports[`ActionHeader should render an action header with title, enabled previou
           isDisabled={true}
           isIconOnly={true}
           isReversed={false}
-          isSelectable={false}
           text="Terra.actionHeader.next"
           type="button"
           variant="utility"

diff --git a/packages/terra-alert/tests/jest/__snapshots__/Alert.test.jsx.snap b/packages/terra-alert/tests/jest/__snapshots__/Alert.test.jsx.snap
@@ -317,7 +317,6 @@ exports[`Alert of type success with an action button text content should render
         isDisabled={false}
         isIconOnly={false}
         isReversed={false}
-        isSelectable={false}
         onClick={[MockFunction]}
         text="Action"
         type="button"
@@ -968,7 +967,6 @@ exports[`Dismissible Alert of type custom with action button, custom title and t
         isDisabled={false}
         isIconOnly={false}
         isReversed={false}
-        isSelectable={false}
         onClick={[MockFunction]}
         text="Action"
         type="button"
@@ -981,7 +979,6 @@ exports[`Dismissible Alert of type custom with action button, custom title and t
         isDisabled={false}
         isIconOnly={false}
         isReversed={false}
-        isSelectable={false}
         onClick={[MockFunction]}
         text="Terra.alert.dismiss"
         type="button"
@@ -1043,7 +1040,6 @@ exports[`Dismissible Alert that includes actions section should render an alert
         isDisabled={false}
         isIconOnly={false}
         isReversed={false}
-        isSelectable={false}
         onClick={[MockFunction]}
         text="Terra.alert.dismiss"
         type="button"

diff --git a/packages/terra-button-group/tests/jest/__snapshots__/ButtonGroup.test.jsx.snap b/packages/terra-button-group/tests/jest/__snapshots__/ButtonGroup.test.jsx.snap
@@ -35,7 +35,6 @@ exports[`correctly applies the theme context className 1`] = `
           isDisabled={false}
           isIconOnly={false}
           isReversed={false}
-          isSelectable={false}
           onBlur={[Function]}
           onClick={[Function]}
           onFocus={[Function]}
@@ -88,7 +87,6 @@ exports[`correctly applies the theme context className 1`] = `
           isDisabled={false}
           isIconOnly={false}
           isReversed={false}
-          isSelectable={false}
           onBlur={[Function]}
           onClick={[Function]}
           onFocus={[Function]}

diff --git a/packages/terra-button-group/tests/jest/__snapshots__/ButtonGroupButton.test.jsx.snap b/packages/terra-button-group/tests/jest/__snapshots__/ButtonGroupButton.test.jsx.snap
@@ -20,7 +20,6 @@ exports[`correctly applies the theme context className 1`] = `
       isDisabled={false}
       isIconOnly={false}
       isReversed={false}
-      isSelectable={false}
       onBlur={[Function]}
       onFocus={[Function]}
       onKeyDown={[Function]}
@@ -66,7 +65,6 @@ exports[`should render a default component 1`] = `
   isDisabled={false}
   isIconOnly={false}
   isReversed={false}
-  isSelectable={false}
   onBlur={[Function]}
   onFocus={[Function]}
   onKeyDown={[Function]}
@@ -86,7 +84,6 @@ exports[`should render as disabled 1`] = `
   isDisabled={true}
   isIconOnly={false}
   isReversed={false}
-  isSelectable={false}
   onBlur={[Function]}
   onFocus={[Function]}
   onKeyDown={[Function]}
@@ -111,7 +108,6 @@ exports[`should render with icon only 1`] = `
   isDisabled={false}
   isIconOnly={true}
   isReversed={false}
-  isSelectable={false}
   onBlur={[Function]}
   onFocus={[Function]}
   onKeyDown={[Function]}
@@ -131,7 +127,6 @@ exports[`should render with onBlur 1`] = `
   isDisabled={false}
   isIconOnly={false}
   isReversed={false}
-  isSelectable={false}
   onBlur={[Function]}
   onFocus={[Function]}
   onKeyDown={[Function]}
@@ -151,7 +146,6 @@ exports[`should render with onClick 1`] = `
   isDisabled={false}
   isIconOnly={false}
   isReversed={false}
-  isSelectable={false}
   onBlur={[Function]}
   onClick={[Function]}
   onFocus={[Function]}
@@ -172,7 +166,6 @@ exports[`should render with onFocus 1`] = `
   isDisabled={false}
   isIconOnly={false}
   isReversed={false}
-  isSelectable={false}
   onBlur={[Function]}
   onFocus={[Function]}
   onKeyDown={[Function]}
@@ -192,7 +185,6 @@ exports[`should render with onKeyDown 1`] = `
   isDisabled={false}
   isIconOnly={false}
   isReversed={false}
-  isSelectable={false}
   onBlur={[Function]}
   onFocus={[Function]}
   onKeyDown={[Function]}
@@ -212,7 +204,6 @@ exports[`should render with onKeyUp 1`] = `
   isDisabled={false}
   isIconOnly={false}
   isReversed={false}
-  isSelectable={false}
   onBlur={[Function]}
   onFocus={[Function]}
   onKeyDown={[Function]}

diff --git a/packages/terra-button/src/Button.jsx b/packages/terra-button/src/Button.jsx
@@ -101,16 +101,6 @@ const propTypes = {
    * Sets the button variant. One of `neutral`,  `emphasis`, `ghost`, `de-emphasis`, `action` or `utility`.
    */
   variant: PropTypes.oneOf([ButtonVariants.NEUTRAL, ButtonVariants.EMPHASIS, ButtonVariants.GHOST, ButtonVariants['DE-EMPHASIS'], ButtonVariants.ACTION, ButtonVariants.UTILITY]),
-  /**
-   * @private
-   * Whether or not the button can be selected (toggleable button).
-   */
-  isSelectable: PropTypes.bool,
-  /**
-   * @private
-   * Callback function when the state changes. Parameters are (event, toggleState).
-   */
-  onChange: PropTypes.func,
 };
 
 const defaultProps = {
@@ -123,7 +113,6 @@ const defaultProps = {
   title: undefined,
   type: ButtonTypes.BUTTON,
   variant: ButtonVariants.NEUTRAL,
-  isSelectable: false,
 };
 
 class Button extends React.Component {
@@ -157,7 +146,9 @@ class Button extends React.Component {
   }
 
   handleOnChange(event) {
+    // eslint-disable-next-line react/prop-types
     if (this.props.onChange && this.props.isSelectable) {
+      // eslint-disable-next-line react/prop-types
       this.props.onChange(event, this.state.isSelected);
     }
   }
@@ -260,15 +251,15 @@ class Button extends React.Component {
       onKeyUp,
       refCallback,
       title,
-      isSelectable,
-      onChange,
       ...customProps
     } = this.props;
 
     const theme = this.context;
     const isMac = () => navigator.userAgent.indexOf('Mac') !== -1;
     const buttonLabelCx = isMac() ? 'button-label-mac' : 'button-label-win';
 
+    // TODO: Custom prop `isSelectable` is used for fusion pass through passivity and should be removed after Fusion Phase2 release.
+
     const buttonClasses = classNames(
       cx([
         'button',
@@ -278,7 +269,7 @@ class Button extends React.Component {
         { compact: isCompact },
         { 'is-active': this.state.active && !isDisabled },
         { 'is-focused': this.state.focused && !isDisabled },
-        { 'is-selected': isSelectable && this.state.isSelected && !isDisabled },
+        { 'is-selected': customProps.isSelectable && this.state.isSelected && !isDisabled },
         theme.className,
       ]),
       customProps.className,
@@ -332,11 +323,6 @@ class Button extends React.Component {
       customProps.role = 'button';
     }
 
-    if (isSelectable) {
-      // eslint-disable-next-line no-console
-      console.warn('`isSelectable` prop will be deprecated in future and we do not recommend it for use');
-    }
-
     return (
       <ComponentType
         {...customProps}
@@ -355,7 +341,7 @@ class Button extends React.Component {
         onFocus={this.handleFocus}
         href={href}
         ref={refCallback}
-        aria-pressed={isSelectable ? this.state.isSelected : undefined}
+        aria-pressed={customProps.isSelectable ? this.state.isSelected : undefined}
       >
         {buttonLabel}
       </ComponentType>

diff --git a/packages/terra-button/tests/jest/Button.test.jsx b/packages/terra-button/tests/jest/Button.test.jsx
@@ -263,9 +263,4 @@ it('correctly applies the theme context className', () => {
   );
   expect(button).toMatchSnapshot();
 });
-
-it('should render a selectable button', () => {
-  const button = shallow(<Button text="Selectable Button" isSelectable />);
-  expect(button).toMatchSnapshot();
-});
 /* eslint-enable react/forbid-dom-props */
diff --git a/packages/terra-button/tests/jest/__snapshots__/Button.test.jsx.snap b/packages/terra-button/tests/jest/__snapshots__/Button.test.jsx.snap
@@ -14,7 +14,6 @@ exports[`correctly applies the theme context className 1`] = `
     isDisabled={false}
     isIconOnly={false}
     isReversed={false}
-    isSelectable={false}
     text="neutral"
     type="button"
     variant="neutral"
@@ -52,7 +51,6 @@ exports[`should pass in refCallback as the ref prop of the input element 1`] = `
   isDisabled={false}
   isIconOnly={false}
   isReversed={false}
-  isSelectable={false}
   refCallback={
     [MockFunction] {
       "calls": Array [
@@ -369,32 +367,6 @@ exports[`should render a neutral button 1`] = `
 </button>
 `;
 
-exports[`should render a selectable button 1`] = `
-<button
-  aria-disabled={false}
-  aria-pressed={false}
-  className="button neutral"
-  disabled={false}
-  onBlur={[Function]}
-  onClick={[Function]}
-  onFocus={[Function]}
-  onKeyDown={[Function]}
-  onKeyUp={[Function]}
-  onMouseDown={[Function]}
-  type="button"
->
-  <span
-    className="button-label-win text-only"
-  >
-    <span
-      className=""
-    >
-      Selectable Button
-    </span>
-  </span>
-</button>
-`;
-
 exports[`should render a utility button 1`] = `
 <button
   aria-disabled={false}

diff --git a/...eference/clinical-lowlight-theme/en/chrome_tiny/button-spec/selected-button.png b/...eference/clinical-lowlight-theme/en/chrome_tiny/button-spec/selected-button.png
diff --git a/...erence/clinical-lowlight-theme/en/chrome_tiny/button-spec/unselected-button.png b/...erence/clinical-lowlight-theme/en/chrome_tiny/button-spec/unselected-button.png
diff --git a/...s__/reference/orion-fusion-theme/en/chrome_tiny/button-spec/selected-button.png b/...s__/reference/orion-fusion-theme/en/chrome_tiny/button-spec/selected-button.png
diff --git a/..._/reference/orion-fusion-theme/en/chrome_tiny/button-spec/unselected-button.png b/..._/reference/orion-fusion-theme/en/chrome_tiny/button-spec/unselected-button.png
diff --git a/...__/reference/terra-default-theme/en/chrome_tiny/button-spec/selected-button.png b/...__/reference/terra-default-theme/en/chrome_tiny/button-spec/selected-button.png
diff --git a/.../reference/terra-default-theme/en/chrome_tiny/button-spec/unselected-button.png b/.../reference/terra-default-theme/en/chrome_tiny/button-spec/unselected-button.png