Merge pull request #89 from vrk-kpa/feature/list-all-icons

Feature/list all icons

package.json

@@ -106,7 +106,7 @@
     "normalize.cssinjs": "1.0.5",
     "polished": "2.3.1",
     "react-svg": "7.2.2",
-    "suomifi-icons": "0.0.5"
+    "suomifi-icons": "0.0.6"
   },
   "peerDependencies": {
     "react": "16.6.3",

src/core/Button/Button.tsx

@@ -122,6 +122,7 @@ class ButtonWithIcon extends Component<ButtonProps> {
       <StyledButton {...passProps}>
         {!!icon && (
           <Icon
+            mousePointer={true}
             icon={icon}
             color={iconColor({ theme, disabled, invert: secondaryOrTertiary })}
             className={classnames(iconClassName, iconPropsClassName)}
@@ -131,6 +132,7 @@ class ButtonWithIcon extends Component<ButtonProps> {
         {passProps.children}
         {!!iconRight && (
           <Icon
+            mousePointer={true}
             icon={iconRight}
             color={iconColor({ theme, disabled, invert: secondaryOrTertiary })}
             className={classnames(

src/core/Form/Toggle/__snapshots__/Toggle.test.tsx.snap

@@ -185,6 +185,10 @@ exports[`calling render with the same component on the same container does not r
   cursor: pointer;
 }
 
+.emotion-1 * {
+  cursor: inherit;
+}
+
 <span
   class="fi-toggle emotion-3"
 >

src/core/Icon/Icon.baseStyles.tsx

@@ -6,5 +6,10 @@ export const iconBaseStyles = ({
 }: SuomifiIconProps) => css`
   display: inline-block;
   vertical-align: bottom;
-  ${!!mousePointer && 'cursor: pointer;'}
+  ${!!mousePointer &&
+    `cursor: pointer;
+      & * {
+        cursor: inherit;
+      }
+  `}
 `;

src/core/Icon/Icon.md

@@ -2,8 +2,36 @@
 <Icon ariaLabel="Login here" className="my-icon--test" />
 ```
 
-```jsx
-<Icon icon="map" />
-<Icon icon="info" />
-<Icon icon="link-list" />
+```jsx noeditor
+const styled = require('@emotion/styled').default;
+const { allIcons, allStaticIcons } = require('suomifi-icons');
+const clipboardCopy = require('clipboard-copy');
+const StyledIcon = styled(props => <Icon {...props} />)({
+  height: '50px',
+  width: 'auto',
+  margin: '8px'
+});
+
+<div>
+  <div>
+    {allIcons.map(icon => (
+      <StyledIcon
+        mousePointer
+        icon={icon}
+        key={icon}
+        onClick={() => clipboardCopy(icon)}
+      />
+    ))}
+  </div>
+  <div>
+    {allStaticIcons.map(icon => (
+      <StyledIcon
+        mousePointer
+        icon={icon}
+        key={icon}
+        onClick={() => clipboardCopy(icon)}
+      />
+    ))}
+  </div>
+</div>;
 ```

yarn.lock

@@ -9186,10 +9186,10 @@ sugarss@^2.0.0:
   dependencies:
     postcss "^7.0.2"
 
-[email protected].5:
-  version "0.0.5"
-  resolved "https://registry.yarnpkg.com/suomifi-icons/-/suomifi-icons-0.0.5.tgz#ca86d8a38c0f8c0264144022c6111ed97be09768"
-  integrity sha512-6eCOoKPLekuQlqSqn8Lp4+qpyvO5ifQPYdlW/CxK0V5zAbC8SKN8mDzwxNcbt3J1HzFRvXGfOYlS1lnAt0ylZQ==
+[email protected].6:
+  version "0.0.6"
+  resolved "https://registry.yarnpkg.com/suomifi-icons/-/suomifi-icons-0.0.6.tgz#7adb394c75922a1b9fe0e0c7f6f833848aa8b657"
+  integrity sha512-0KMl4guo1oMAnju4gOR+2fIGW3QTOGwof1/ZkAGtbASkUsOqkQr8nCP8mdOS9l1RM1jws4daHCAxWluTrtNkow==
   dependencies:
     "@types/react" "16.7.20"
     "@types/react-dom" "16.0.11"