diff --git a/packages/material-ui-icons/builder.js b/packages/material-ui-icons/builder.js index b596c6ca153f7d..54044d5051f2de 100755 --- a/packages/material-ui-icons/builder.js +++ b/packages/material-ui-icons/builder.js @@ -119,9 +119,10 @@ async function worker({ svgPath, options, renameFilter, template }) { .replace(//g, ''); const result = await svgo.optimize(input); + // Extract the paths from the svg string // Clean xml paths - const paths = result.data + let paths = result.data .replace(/]*>/g, '') .replace(/<\/svg>/g, '') .replace(/"\/>/g, '" />') @@ -131,6 +132,14 @@ async function worker({ svgPath, options, renameFilter, template }) { .replace(/clip-rule=/g, 'clipRule=') .replace(/fill-rule=/g, 'fillRule='); + const size = Number(svgPath.match(/^.*_([0-9]+)px.svg$/)[1]); + + if (size !== 24) { + const scale = Math.round((24 / size) * 100) / 100; // Keep a maximum of 2 decimals + paths = paths.replace('clipPath="url(#b)" ', ''); + paths = paths.replace(/ {}; - } - - rimraf.sync(`${options.outputDir}/*.js`); // Clean old files - - let renameFilter = options.renameFilter; - if (typeof renameFilter === 'string') { - /* eslint-disable-next-line global-require, import/no-dynamic-require */ - renameFilter = require(renameFilter).default; - } - if (typeof renameFilter !== 'function') { - throw Error('renameFilter must be a function'); - } - const exists1 = await fse.exists(options.outputDir); - if (!exists1) { - await fse.mkdir(options.outputDir); - } - - const [svgPaths, template] = await Promise.all([ - globAsync(path.join(options.svgDir, options.glob)), - fse.readFile(path.join(__dirname, 'templateSvgIcon.js'), { - encoding: 'utf8', - }), - ]); - - const queue = new Queue( - svgPath => { - return worker({ - svgPath, - options, - renameFilter, - template, - }); - }, - { concurrency: 4 }, - ); - - queue.push(svgPaths); - await queue.wait({ empty: true }); - - await generateIndex(options); - - if (options.disableLog) { - // bring back stdout - process.stdout.write = originalWrite; + try { + let originalWrite; + + options.glob = options.glob || '/**/*.svg'; + options.innerPath = options.innerPath || ''; + options.renameFilter = options.renameFilter || RENAME_FILTER_DEFAULT; + options.disableLog = options.disableLog || false; + + // Disable console.log opt, used for tests + if (options.disableLog) { + originalWrite = process.stdout.write; + process.stdout.write = () => {}; + } + + rimraf.sync(`${options.outputDir}/*.js`); // Clean old files + + let renameFilter = options.renameFilter; + if (typeof renameFilter === 'string') { + /* eslint-disable-next-line global-require, import/no-dynamic-require */ + renameFilter = require(renameFilter).default; + } + if (typeof renameFilter !== 'function') { + throw Error('renameFilter must be a function'); + } + const exists1 = await fse.exists(options.outputDir); + if (!exists1) { + await fse.mkdir(options.outputDir); + } + + const [svgPaths, template] = await Promise.all([ + globAsync(path.join(options.svgDir, options.glob)), + fse.readFile(path.join(__dirname, 'templateSvgIcon.js'), { + encoding: 'utf8', + }), + ]); + + const queue = new Queue( + svgPath => { + return worker({ + svgPath, + options, + renameFilter, + template, + }); + }, + { concurrency: 8 }, + ); + + queue.push(svgPaths); + await queue.wait({ empty: true }); + + await generateIndex(options); + + if (options.disableLog) { + // bring back stdout + process.stdout.write = originalWrite; + } + } catch (err) { + console.log(err); } } diff --git a/packages/material-ui-icons/package.json b/packages/material-ui-icons/package.json index 05436673f5fe8f..bb8d6d0a048d17 100644 --- a/packages/material-ui-icons/package.json +++ b/packages/material-ui-icons/package.json @@ -26,7 +26,7 @@ "test:unit": "cd ../../ && ./node_modules/.bin/cross-env NODE_ENV=test ./node_modules/.bin/mocha packages/material-ui-icons/{,**/}*.test.js", "test:watch": "yarn test:unit --watch", "src:download": "cd ../../ && ./node_modules/.bin/babel-node packages/material-ui-icons/scripts/download.js", - "src:icons": "cd ../../ && node_modules/.bin/babel-node packages/material-ui-icons/builder.js --output-dir packages/material-ui-icons/src --svg-dir packages/material-ui-icons/material-io-tools-icons --glob '/**/*_24px.svg' --renameFilter ./renameFilters/material-design-icons.js", + "src:icons": "cd ../../ && UV_THREADPOOL_SIZE=64 node_modules/.bin/babel-node packages/material-ui-icons/builder.js --output-dir packages/material-ui-icons/src --svg-dir packages/material-ui-icons/material-io-tools-icons --renameFilter ./renameFilters/material-design-icons.js", "prebuild": "../../node_modules/.bin/rimraf material-design-icons && ../../node_modules/.bin/rimraf build", "build:es2015": "../../node_modules/.bin/cross-env NODE_ENV=production ../../node_modules/.bin/babel ./src --out-dir ./build", "build:es2015modules": "../../node_modules/.bin/cross-env NODE_ENV=production BABEL_ENV=modules ../../node_modules/.bin/babel ./src/index.js --out-file ./build/index.es.js", diff --git a/packages/material-ui-icons/renameFilters/material-design-icons.js b/packages/material-ui-icons/renameFilters/material-design-icons.js index c2ed9048cddf1b..13d8c8d87fb0b6 100644 --- a/packages/material-ui-icons/renameFilters/material-design-icons.js +++ b/packages/material-ui-icons/renameFilters/material-design-icons.js @@ -5,7 +5,7 @@ function myDestRewriter(svgPathObj: Object) { fileName = fileName .slice(3) - .replace('_24px.svg', '.js') + .replace(/_([0-9]+)px\.svg/, '.js') .replace(/(^.)|(_)(.)/g, (match, p1, p2, p3) => (p1 || p3).toUpperCase()); if (fileName.indexOf('3dRotation') === 0) { diff --git a/packages/material-ui-icons/scripts/download.js b/packages/material-ui-icons/scripts/download.js index 158ed32d9ccb59..703b6117c58667 100644 --- a/packages/material-ui-icons/scripts/download.js +++ b/packages/material-ui-icons/scripts/download.js @@ -16,41 +16,19 @@ const themeMap = { sharp: '_sharp', }; -// Some icons have different sizes. -const sizes = { - cast_for_education: { - baseline: 48, - }, - domain: { - baseline: 48, - }, - play_circle_filled_white: { - baseline: 48, - }, - settings: { - baseline: 20, - }, - star_rate: { - baseline: 18, - outline: 18, - round: 18, - twotone: 18, - sharp: 18, - }, - weekend: { - baseline: 48, - }, -}; - function downloadIcon(icon) { console.log(`downloadIcon ${icon.index}: ${icon.id}`); return Promise.all( Object.keys(themeMap).map(async theme => { - const size = sizes[icon.id] && sizes[icon.id][theme] ? sizes[icon.id][theme] : 24; - const response = await fetch( - `https://material.io/tools/icons/static/icons/${theme}-${icon.id}-${size}px.svg`, - ); + let endUrl; + if (icon.imageUrls && icon.imageUrls[theme]) { + endUrl = icon.imageUrls[theme]; + } else { + endUrl = `${theme}-${icon.id}-24px.svg`; + } + const size = endUrl.match(/^.*-([0-9]+)px.svg$/)[1]; + const response = await fetch(`https://material.io/tools/icons/static/icons/${endUrl}`); if (response.status !== 200) { throw new Error(`status ${response.status}`); } diff --git a/packages/material-ui-icons/src/CastForEducation.js b/packages/material-ui-icons/src/CastForEducation.js new file mode 100644 index 00000000000000..63247a75516572 --- /dev/null +++ b/packages/material-ui-icons/src/CastForEducation.js @@ -0,0 +1,6 @@ +import React from 'react'; +import createSvgIcon from './utils/createSvgIcon'; + +export default createSvgIcon( + +, 'CastForEducation'); diff --git a/packages/material-ui-icons/src/Domain.js b/packages/material-ui-icons/src/Domain.js new file mode 100644 index 00000000000000..e51f21e6878ac8 --- /dev/null +++ b/packages/material-ui-icons/src/Domain.js @@ -0,0 +1,6 @@ +import React from 'react'; +import createSvgIcon from './utils/createSvgIcon'; + +export default createSvgIcon( + +, 'Domain'); diff --git a/packages/material-ui-icons/src/PlayCircleFilledWhite.js b/packages/material-ui-icons/src/PlayCircleFilledWhite.js new file mode 100644 index 00000000000000..563f85455b418b --- /dev/null +++ b/packages/material-ui-icons/src/PlayCircleFilledWhite.js @@ -0,0 +1,6 @@ +import React from 'react'; +import createSvgIcon from './utils/createSvgIcon'; + +export default createSvgIcon( + +, 'PlayCircleFilledWhite'); diff --git a/packages/material-ui-icons/src/Settings.js b/packages/material-ui-icons/src/Settings.js new file mode 100644 index 00000000000000..6212b055f0b0d6 --- /dev/null +++ b/packages/material-ui-icons/src/Settings.js @@ -0,0 +1,6 @@ +import React from 'react'; +import createSvgIcon from './utils/createSvgIcon'; + +export default createSvgIcon( + +, 'Settings'); diff --git a/packages/material-ui-icons/src/StarRate.js b/packages/material-ui-icons/src/StarRate.js new file mode 100644 index 00000000000000..b3f0d1a55f324e --- /dev/null +++ b/packages/material-ui-icons/src/StarRate.js @@ -0,0 +1,6 @@ +import React from 'react'; +import createSvgIcon from './utils/createSvgIcon'; + +export default createSvgIcon( + +, 'StarRate'); diff --git a/packages/material-ui-icons/src/StarRateOutlined.js b/packages/material-ui-icons/src/StarRateOutlined.js new file mode 100644 index 00000000000000..a415600ef6f85f --- /dev/null +++ b/packages/material-ui-icons/src/StarRateOutlined.js @@ -0,0 +1,6 @@ +import React from 'react'; +import createSvgIcon from './utils/createSvgIcon'; + +export default createSvgIcon( + +, 'StarRateOutlined'); diff --git a/packages/material-ui-icons/src/StarRateRounded.js b/packages/material-ui-icons/src/StarRateRounded.js new file mode 100644 index 00000000000000..ae6c145ec3718a --- /dev/null +++ b/packages/material-ui-icons/src/StarRateRounded.js @@ -0,0 +1,6 @@ +import React from 'react'; +import createSvgIcon from './utils/createSvgIcon'; + +export default createSvgIcon( + +, 'StarRateRounded'); diff --git a/packages/material-ui-icons/src/StarRateSharp.js b/packages/material-ui-icons/src/StarRateSharp.js new file mode 100644 index 00000000000000..fba6a833216727 --- /dev/null +++ b/packages/material-ui-icons/src/StarRateSharp.js @@ -0,0 +1,6 @@ +import React from 'react'; +import createSvgIcon from './utils/createSvgIcon'; + +export default createSvgIcon( + +, 'StarRateSharp'); diff --git a/packages/material-ui-icons/src/StarRateTwoTone.js b/packages/material-ui-icons/src/StarRateTwoTone.js new file mode 100644 index 00000000000000..730b76e6733569 --- /dev/null +++ b/packages/material-ui-icons/src/StarRateTwoTone.js @@ -0,0 +1,6 @@ +import React from 'react'; +import createSvgIcon from './utils/createSvgIcon'; + +export default createSvgIcon( + +, 'StarRateTwoTone'); diff --git a/packages/material-ui-icons/src/Weekend.js b/packages/material-ui-icons/src/Weekend.js new file mode 100644 index 00000000000000..b2cd7c82d15324 --- /dev/null +++ b/packages/material-ui-icons/src/Weekend.js @@ -0,0 +1,6 @@ +import React from 'react'; +import createSvgIcon from './utils/createSvgIcon'; + +export default createSvgIcon( + +, 'Weekend'); diff --git a/packages/material-ui-icons/src/index.js b/packages/material-ui-icons/src/index.js index 543d9d6362c9af..28631fce179f87 100644 --- a/packages/material-ui-icons/src/index.js +++ b/packages/material-ui-icons/src/index.js @@ -889,6 +889,7 @@ export { default as CastConnectedOutlined } from './CastConnectedOutlined'; export { default as CastConnectedRounded } from './CastConnectedRounded'; export { default as CastConnectedSharp } from './CastConnectedSharp'; export { default as CastConnectedTwoTone } from './CastConnectedTwoTone'; +export { default as CastForEducation } from './CastForEducation'; export { default as CastForEducationOutlined } from './CastForEducationOutlined'; export { default as CastForEducationRounded } from './CastForEducationRounded'; export { default as CastForEducationSharp } from './CastForEducationSharp'; @@ -1397,6 +1398,7 @@ export { default as DockOutlined } from './DockOutlined'; export { default as DockRounded } from './DockRounded'; export { default as DockSharp } from './DockSharp'; export { default as DockTwoTone } from './DockTwoTone'; +export { default as Domain } from './Domain'; export { default as DomainDisabled } from './DomainDisabled'; export { default as DomainDisabledOutlined } from './DomainDisabledOutlined'; export { default as DomainDisabledRounded } from './DomainDisabledRounded'; @@ -3530,6 +3532,7 @@ export { default as PlayCircleFilledOutlined } from './PlayCircleFilledOutlined' export { default as PlayCircleFilledRounded } from './PlayCircleFilledRounded'; export { default as PlayCircleFilledSharp } from './PlayCircleFilledSharp'; export { default as PlayCircleFilledTwoTone } from './PlayCircleFilledTwoTone'; +export { default as PlayCircleFilledWhite } from './PlayCircleFilledWhite'; export { default as PlayCircleFilledWhiteOutlined } from './PlayCircleFilledWhiteOutlined'; export { default as PlayCircleFilledWhiteRounded } from './PlayCircleFilledWhiteRounded'; export { default as PlayCircleFilledWhiteSharp } from './PlayCircleFilledWhiteSharp'; @@ -4009,6 +4012,7 @@ export { default as SentimentVerySatisfiedOutlined } from './SentimentVerySatisf export { default as SentimentVerySatisfiedRounded } from './SentimentVerySatisfiedRounded'; export { default as SentimentVerySatisfiedSharp } from './SentimentVerySatisfiedSharp'; export { default as SentimentVerySatisfiedTwoTone } from './SentimentVerySatisfiedTwoTone'; +export { default as Settings } from './Settings'; export { default as SettingsApplications } from './SettingsApplications'; export { default as SettingsApplicationsOutlined } from './SettingsApplicationsOutlined'; export { default as SettingsApplicationsRounded } from './SettingsApplicationsRounded'; @@ -4380,6 +4384,11 @@ export { default as StarHalfRounded } from './StarHalfRounded'; export { default as StarHalfSharp } from './StarHalfSharp'; export { default as StarHalfTwoTone } from './StarHalfTwoTone'; export { default as StarOutlined } from './StarOutlined'; +export { default as StarRate } from './StarRate'; +export { default as StarRateOutlined } from './StarRateOutlined'; +export { default as StarRateRounded } from './StarRateRounded'; +export { default as StarRateSharp } from './StarRateSharp'; +export { default as StarRateTwoTone } from './StarRateTwoTone'; export { default as StarRounded } from './StarRounded'; export { default as Stars } from './Stars'; export { default as StarSharp } from './StarSharp'; @@ -5128,6 +5137,7 @@ export { default as WebOutlined } from './WebOutlined'; export { default as WebRounded } from './WebRounded'; export { default as WebSharp } from './WebSharp'; export { default as WebTwoTone } from './WebTwoTone'; +export { default as Weekend } from './Weekend'; export { default as WeekendOutlined } from './WeekendOutlined'; export { default as WeekendRounded } from './WeekendRounded'; export { default as WeekendSharp } from './WeekendSharp';