Removing SVG components

Sticking with importing data URIs for now
This commit is contained in:
Jeff Avallone 2018-02-11 06:45:39 -05:00
parent c368e9031f
commit 810b37aa47
7 changed files with 19 additions and 99 deletions

View File

@ -43,7 +43,6 @@
"react": "^16.2.0",
"react-dom": "^16.2.0",
"style-loader": "^0.20.1",
"svg-react-loader": "^0.4.5",
"uglifyjs-webpack-plugin": "^1.1.8",
"url-loader": "^0.6.2",
"webpack": "^3.10.0",

View File

@ -1,19 +1,12 @@
import React from 'react';
import PropTypes from 'prop-types';
//import style from './style.css';
const renderIcon = icon => {
if (!icon) {
return;
}
if (typeof icon === 'string') {
return <img src={ icon }/>;
} else {
const Icon = icon;
return <Icon/>;
}
return <img src={ icon }/>;
};
const Message = ({ icon, heading, children }) => (
@ -24,11 +17,7 @@ const Message = ({ icon, heading, children }) => (
);
Message.propTypes = {
icon: PropTypes.oneOfType([
PropTypes.element,
PropTypes.func,
PropTypes.string
]),
icon: PropTypes.string,
heading: PropTypes.string.isRequired,
children: PropTypes.element.isRequired
};

View File

@ -14,9 +14,8 @@ test('Message rendering', () => {
});
test('Message rendering with icon', () => {
const Icon = () => 'Sample icon SVG';
const component = renderer.create(
<Message heading="Testing" icon={ Icon }>
<Message heading="Testing" icon="sample-icon-url">
<p>Message content</p>
</Message>
);

View File

@ -18,7 +18,9 @@ exports[`Message rendering with icon 1`] = `
className="message"
>
<h2>
Sample icon SVG
<img
src="sample-icon-url"
/>
Testing
</h2>
<p>

View File

@ -4,10 +4,10 @@ import ReactDOM from 'react-dom';
import '../style.css';
import Message from '../components/Message';
import ErrorIcon from '!svg-react-loader!feather-icons/dist/icons/alert-octagon.svg';
import errorIcon from 'feather-icons/dist/icons/alert-octagon.svg';
ReactDOM.render(
<Message icon={ ErrorIcon } heading="404 Page Not Found">
<Message icon={ errorIcon } heading="404 Page Not Found">
<p>The page you have requested could not be found</p>
</Message>,
document.getElementById('root'));

View File

@ -120,7 +120,6 @@ li {
margin: var(--spacing-margin) 0;
}
.message h2 svg,
.message h2 img {
margin-right: 0.5rem;
height: 3rem;

View File

@ -321,10 +321,6 @@ atob@^2.0.0:
version "2.0.3"
resolved "https://registry.yarnpkg.com/atob/-/atob-2.0.3.tgz#19c7a760473774468f20b2d2d03372ad7d4cbf5d"
atob@~1.1.0:
version "1.1.3"
resolved "https://registry.yarnpkg.com/atob/-/atob-1.1.3.tgz#95f13629b12c3a51a5d215abdce2aa9f32f80773"
autoprefixer@^6.3.1:
version "6.7.7"
resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-6.7.7.tgz#1dbd1c835658e35ce3f9984099db00585c782014"
@ -1820,15 +1816,6 @@ css-what@2.1:
version "2.1.0"
resolved "https://registry.yarnpkg.com/css-what/-/css-what-2.1.0.tgz#9467d032c38cfaefb9f2d79501253062f87fa1bd"
css@2.2.1:
version "2.2.1"
resolved "https://registry.yarnpkg.com/css/-/css-2.2.1.tgz#73a4c81de85db664d4ee674f7d47085e3b2d55dc"
dependencies:
inherits "^2.0.1"
source-map "^0.1.38"
source-map-resolve "^0.3.0"
urix "^0.1.0"
cssdb@^1.5:
version "1.5.0"
resolved "https://registry.yarnpkg.com/cssdb/-/cssdb-1.5.0.tgz#e6179657bf96eb063eb316b2f5a5f4c4a2633df7"
@ -4455,14 +4442,6 @@ loader-runner@^2.3.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.3.0.tgz#f482aea82d543e07921700d5a46ef26fdac6b8a2"
loader-utils@1.1.0, loader-utils@^1.0.2, loader-utils@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.1.0.tgz#c98aef488bcceda2ffb5e2de646d6a754429f5cd"
dependencies:
big.js "^3.1.3"
emojis-list "^2.0.0"
json5 "^0.5.0"
loader-utils@^0.2.11, loader-utils@^0.2.14, loader-utils@^0.2.15, loader-utils@^0.2.16:
version "0.2.17"
resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-0.2.17.tgz#f86e6374d43205a6e6c60e9196f17c0299bfb348"
@ -4472,6 +4451,14 @@ loader-utils@^0.2.11, loader-utils@^0.2.14, loader-utils@^0.2.15, loader-utils@^
json5 "^0.5.0"
object-assign "^4.0.1"
loader-utils@^1.0.2, loader-utils@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.1.0.tgz#c98aef488bcceda2ffb5e2de646d6a754429f5cd"
dependencies:
big.js "^3.1.3"
emojis-list "^2.0.0"
json5 "^0.5.0"
locate-path@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-2.0.0.tgz#2b568b265eec944c6d9c0de9c3dbbbca0354cd8e"
@ -4516,7 +4503,7 @@ lodash@3.x, lodash@^3.2.0:
version "3.10.1"
resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
lodash@^4.0.0, lodash@^4.13.1, lodash@^4.14.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.3.0:
lodash@^4.13.1, lodash@^4.14.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.3.0:
version "4.17.5"
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.5.tgz#99a92d65c0272debe8c96b6057bc8fbfa3bed511"
@ -6189,10 +6176,6 @@ querystringify@~1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-1.0.0.tgz#6286242112c5b712fa654e526652bf6a13ff05cb"
ramda@0.21.0:
version "0.21.0"
resolved "https://registry.yarnpkg.com/ramda/-/ramda-0.21.0.tgz#a001abedb3ff61077d4ff1d577d44de77e8d0a35"
randomatic@^1.1.3:
version "1.1.7"
resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-1.1.7.tgz#c7abe9cc8b87c0baa876b19fde83fd464797e38c"
@ -6581,7 +6564,7 @@ resolve-from@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-3.0.0.tgz#b22c7af7d9d6881bc8b6e653335eebcb0a188748"
resolve-url@^0.2.1, resolve-url@~0.2.1:
resolve-url@^0.2.1:
version "0.2.1"
resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
@ -6641,10 +6624,6 @@ rx-lite@*, rx-lite@^4.0.8:
version "4.0.8"
resolved "https://registry.yarnpkg.com/rx-lite/-/rx-lite-4.0.8.tgz#0b1e11af8bc44836f04a6407e92da42467b79444"
rx@4.1.0:
version "4.1.0"
resolved "https://registry.yarnpkg.com/rx/-/rx-4.1.0.tgz#a5f13ff79ef3b740fe30aa803fb09f98805d4782"
safe-buffer@5.1.1, safe-buffer@^5.0.1, safe-buffer@^5.1.0, safe-buffer@^5.1.1, safe-buffer@~5.1.0, safe-buffer@~5.1.1:
version "5.1.1"
resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.1.tgz#893312af69b2123def71f57889001671eeb2c853"
@ -6906,15 +6885,6 @@ source-list-map@~0.1.7:
version "0.1.8"
resolved "https://registry.yarnpkg.com/source-list-map/-/source-list-map-0.1.8.tgz#c550b2ab5427f6b3f21f5afead88c4f5587b2106"
source-map-resolve@^0.3.0:
version "0.3.1"
resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.3.1.tgz#610f6122a445b8dd51535a2a71b783dfc1248761"
dependencies:
atob "~1.1.0"
resolve-url "~0.2.1"
source-map-url "~0.3.0"
urix "~0.1.0"
source-map-resolve@^0.5.0:
version "0.5.1"
resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.5.1.tgz#7ad0f593f2281598e854df80f19aae4b92d7a11a"
@ -6941,20 +6911,10 @@ source-map-url@^0.4.0:
version "0.4.0"
resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
source-map-url@~0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.3.0.tgz#7ecaf13b57bcd09da8a40c5d269db33799d4aaf9"
source-map@0.5.x, source-map@^0.5.3, source-map@^0.5.6, source-map@^0.5.7, source-map@~0.5.1, source-map@~0.5.6:
version "0.5.7"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
source-map@^0.1.38:
version "0.1.43"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.1.43.tgz#c24bc146ca517c1471f5dacbe2571b2b7f9e3346"
dependencies:
amdefine ">=0.0.4"
source-map@^0.4.4, source-map@~0.4.1:
version "0.4.4"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.4.4.tgz#eba4f5da9c0dc999de68032d8b4f76173652036b"
@ -7222,17 +7182,6 @@ supports-color@^5.1.0:
dependencies:
has-flag "^2.0.0"
svg-react-loader@^0.4.5:
version "0.4.5"
resolved "https://registry.yarnpkg.com/svg-react-loader/-/svg-react-loader-0.4.5.tgz#1f324c9c7b858f5c89fac752bbe9ca3f6214f850"
dependencies:
css "2.2.1"
loader-utils "1.1.0"
ramda "0.21.0"
rx "4.1.0"
traverse "0.6.6"
xml2js "0.4.17"
svg2png@~3.0.1:
version "3.0.1"
resolved "https://registry.yarnpkg.com/svg2png/-/svg2png-3.0.1.tgz#a2644d68b0231ac00af431aa163714ff17106447"
@ -7417,10 +7366,6 @@ tr46@^1.0.0:
dependencies:
punycode "^2.1.0"
traverse@0.6.6:
version "0.6.6"
resolved "https://registry.yarnpkg.com/traverse/-/traverse-0.6.6.tgz#cbdf560fd7b9af632502fed40f918c157ea97137"
trim-newlines@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/trim-newlines/-/trim-newlines-1.0.0.tgz#5887966bb582a4503a41eb524f7d35011815a613"
@ -7608,7 +7553,7 @@ upper-case@^1.1.1:
version "1.1.3"
resolved "https://registry.yarnpkg.com/upper-case/-/upper-case-1.1.3.tgz#f6b4501c2ec4cdd26ba78be7222961de77621598"
urix@^0.1.0, urix@~0.1.0:
urix@^0.1.0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/urix/-/urix-0.1.0.tgz#da937f7a62e21fec1fd18d49b35c2935067a6c72"
@ -8038,13 +7983,6 @@ xml-parse-from-string@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/xml-parse-from-string/-/xml-parse-from-string-1.0.1.tgz#a9029e929d3dbcded169f3c6e28238d95a5d5a28"
xml2js@0.4.17:
version "0.4.17"
resolved "https://registry.yarnpkg.com/xml2js/-/xml2js-0.4.17.tgz#17be93eaae3f3b779359c795b419705a8817e868"
dependencies:
sax ">=0.6.0"
xmlbuilder "^4.1.0"
xml2js@>=0.2.4, xml2js@^0.4.5:
version "0.4.19"
resolved "https://registry.yarnpkg.com/xml2js/-/xml2js-0.4.19.tgz#686c20f213209e94abf0d1bcf1efaa291c7827a7"
@ -8052,12 +7990,6 @@ xml2js@>=0.2.4, xml2js@^0.4.5:
sax ">=0.6.0"
xmlbuilder "~9.0.1"
xmlbuilder@^4.1.0:
version "4.2.1"
resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-4.2.1.tgz#aa58a3041a066f90eaa16c2f5389ff19f3f461a5"
dependencies:
lodash "^4.0.0"
xmlbuilder@~9.0.1:
version "9.0.7"
resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-9.0.7.tgz#132ee63d2ec5565c557e20f4c22df9aca686b10d"