diff --git a/packages/react/src/components/CodeSnippet/CodeSnippet.Skeleton.js b/packages/react/src/components/CodeSnippet/CodeSnippet.Skeleton.js index 6972687f09e8..d4a8e2e4ddf8 100644 --- a/packages/react/src/components/CodeSnippet/CodeSnippet.Skeleton.js +++ b/packages/react/src/components/CodeSnippet/CodeSnippet.Skeleton.js @@ -5,61 +5,58 @@ * LICENSE file in the root directory of this source tree. */ -import PropTypes from 'prop-types'; -import React, { Component } from 'react'; -import classNames from 'classnames'; import { settings } from 'carbon-components'; +import cx from 'classnames'; +import PropTypes from 'prop-types'; +import React from 'react'; const { prefix } = settings; -export default class CodeSnippetSkeleton extends Component { - static propTypes = { - /** - * The type of code snippet - * can be single or multi - */ - type: PropTypes.oneOf(['single', 'multi']), - - /** - * Specify an optional className to be applied to the container node - */ - className: PropTypes.string, - }; - - static defaultProps = { - type: 'single', - }; - - render() { - const { className, type, ...other } = this.props; - - const codeSnippetClasses = classNames(className, { - [`${prefix}--snippet`]: true, - [`${prefix}--skeleton`]: true, - [`${prefix}--snippet--single`]: type === 'single', - [`${prefix}--snippet--multi`]: type === 'multi', - }); - - if (type === 'single') { - return ( -
-
- -
+function CodeSnippetSkeleton({ + className: containerClassName, + type = 'single', + ...rest +}) { + const className = cx(containerClassName, { + [`${prefix}--snippet`]: true, + [`${prefix}--skeleton`]: true, + [`${prefix}--snippet--single`]: type === 'single', + [`${prefix}--snippet--multi`]: type === 'multi', + }); + + if (type === 'single') { + return ( +
+
+
- ); - } +
+ ); + } - if (type === 'multi') { - return ( -
-
- - - -
+ if (type === 'multi') { + return ( +
+
+ + +
- ); - } +
+ ); } } + +CodeSnippetSkeleton.propTypes = { + /** + * The type of the code snippet, including single or multi + */ + type: PropTypes.oneOf(['single', 'multi']), + + /** + * Specify an optional className to be applied to the container node + */ + className: PropTypes.string, +}; + +export default CodeSnippetSkeleton;