feat(SkeletonIcon): add SkeletonIcon component

packages/carbon-react/__tests__/index-test.js

@@ -140,6 +140,7 @@ describe('Carbon Components React', () => {
         "SideNavMenu",
         "SideNavMenuItem",
         "SideNavSwitcher",
+        "SkeletonIcon",
         "SkeletonPlaceholder",
         "SkeletonText",
         "SkipToContent",

packages/carbon-react/src/index.js

@@ -129,6 +129,7 @@ export {
   ToolbarDivider,
   ToolbarSearch,
   UnorderedList,
+  SkeletonIcon,
   SkeletonText,
   SkeletonPlaceholder,
   DataTableSkeleton,

packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap

@@ -5921,6 +5921,16 @@ Map {
     },
     "render": [Function],
   },
+  "SkeletonIcon" => Object {
+    "propTypes": Object {
+      "className": Object {
+        "type": "string",
+      },
+      "style": Object {
+        "type": "object",
+      },
+    },
+  },
   "SkeletonPlaceholder" => Object {
     "propTypes": Object {
       "className": Object {

packages/react/src/__tests__/index-test.js

@@ -132,6 +132,7 @@ describe('Carbon Components React', () => {
         "SideNavMenu",
         "SideNavMenuItem",
         "SideNavSwitcher",
+        "SkeletonIcon",
         "SkeletonPlaceholder",
         "SkeletonText",
         "SkipToContent",

packages/react/src/components/SkeletonIcon/SkeletonIcon-story.js

@@ -0,0 +1,35 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React from 'react';
+import SkeletonIcon from '../SkeletonIcon';
+
+const propsSkeleton = {
+  style: {
+    margin: '50px',
+  },
+};
+
+const propsSkeleton2 = {
+  style: {
+    margin: '50px',
+    width: '24px',
+    height: '24px',
+  },
+};
+
+export default {
+  title: 'Components/Skeleton/SkeletonIcon',
+  component: SkeletonIcon,
+};
+
+export const Default = () => (
+  <>
+    <SkeletonIcon {...propsSkeleton} />
+    <SkeletonIcon {...propsSkeleton2} />
+  </>
+);

packages/react/src/components/SkeletonIcon/SkeletonIcon-test.js

@@ -0,0 +1,21 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React from 'react';
+import SkeletonIcon from '../SkeletonIcon';
+import { shallow } from 'enzyme';
+import { settings } from 'carbon-components';
+
+const { prefix } = settings;
+
+describe('SkeletonIcon', () => {
+  const wrapper = shallow(<SkeletonIcon />);
+
+  it('Has the expected classes', () => {
+    expect(wrapper.hasClass(`${prefix}--icon--skeleton`)).toEqual(true);
+  });
+});

packages/react/src/components/SkeletonIcon/SkeletonIcon.js

@@ -0,0 +1,36 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import PropTypes from 'prop-types';
+import React from 'react';
+import classNames from 'classnames';
+import { usePrefix } from '../../internal/usePrefix';
+
+const SkeletonIcon = ({ className, ...other }) => {
+  const prefix = usePrefix();
+
+  const skeletonIconClasses = classNames({
+    [`${prefix}--icon--skeleton`]: true,
+    [className]: className,
+  });
+
+  return <div className={skeletonIconClasses} {...other} />;
+};
+
+SkeletonIcon.propTypes = {
+  /**
+   * Specify an optional className to add.
+   */
+  className: PropTypes.string,
+
+  /**
+   * The CSS styles.
+   */
+  style: PropTypes.object,
+};
+
+export default SkeletonIcon;

packages/react/src/components/SkeletonIcon/index.js

@@ -0,0 +1,8 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+export default from './SkeletonIcon';

packages/react/src/index.js

@@ -155,6 +155,7 @@ export TooltipIcon from './components/TooltipIcon';
 export UnorderedList from './components/UnorderedList';
 export SkeletonText from './components/SkeletonText';
 export SkeletonPlaceholder from './components/SkeletonPlaceholder';
+export SkeletonIcon from './components/SkeletonIcon';
 export DataTableSkeleton from './components/DataTableSkeleton';
 export AccordionSkeleton from './components/Accordion/Accordion.Skeleton';
 export BreadcrumbSkeleton from './components/Breadcrumb/Breadcrumb.Skeleton';