@cloudflare/component-icon 6.6.25 → 7.0.1

package/lib/reactsvgs/renamed-icons-64px/ProductSecurityCenter.js

@@ -0,0 +1,32 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var React = _interopRequireWildcard(require("react"));
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var SvgProductSecurityCenter = function SvgProductSecurityCenter(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({}, props, {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 64 64",
+    "aria-hidden": !props['aria-label'],
+    focusable: "false"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M32.81 48.82a16.65 16.65 0 10-16.65-16.65 16.67 16.67 0 0016.65 16.65zm0-20.83a4.18 4.18 0 11-4.18 4.18A4.19 4.19 0 0132.81 28v-.01zM28.25 39a8.112 8.112 0 002.12 1v4.61a12.6 12.6 0 01-5.31-2.43L28.25 39zm6.12 1.23a8.2 8.2 0 002.33-.83l3.24 3.24a12.42 12.42 0 01-5.57 2.11v-4.52zm5.27-3.54a8.11 8.11 0 001-2.32h4.57a12.55 12.55 0 01-2.42 5.51l-3.15-3.19zm1.13-6.32a8 8 0 00-.94-2.37l3.23-3.22a12.599 12.599 0 012.25 5.55l-4.54.04zM37 25.17a7.939 7.939 0 00-2.2-.92v-4.56A12.51 12.51 0 0140.23 22L37 25.17zm-6.2-.92a8.12 8.12 0 00-2.09.85l-3.23-3.23a12.59 12.59 0 015.32-2.18v4.56zm-4.95 3.64a7.79 7.79 0 00-.9 2h-4.57a12.58 12.58 0 012.26-5.21l3.21 3.21zm-1 6c.138.736.384 1.447.73 2.11l-3.26 3.26a12.61 12.61 0 01-2-5.35l4.53-.02z"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M56 5.87H8.13L6.05 8v9.1H4.58v10h1.47v10H4.58v10h1.47v8.59l2.08 2.21H56l2.08-2.08V8L56 5.87zm-2.08 47.87H10.21V10h43.71v43.74z"
+  }));
+};
+
+var _default = SvgProductSecurityCenter;
+exports.default = _default;

package/lib/reactsvgs/renamed-icons-64px/index.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _CirclePause = _interopRequireDefault(require("./CirclePause"));
+
+var _CirclePlay = _interopRequireDefault(require("./CirclePlay"));
+
+var _CircleStop = _interopRequireDefault(require("./CircleStop"));
+
+var _ProductSecurityCenter = _interopRequireDefault(require("./ProductSecurityCenter"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _default = {
+  'circle-pause': _CirclePause.default,
+  'circle-play': _CirclePlay.default,
+  'circle-stop': _CircleStop.default,
+  'product-security-center': _ProductSecurityCenter.default
+};
+exports.default = _default;

package/package.json

@@ -1,26 +1,25 @@
 {
   "name": "@cloudflare/component-icon",
   "description": "Cloudflare Icon Component",
-  "version": "6.6.25",
+  "version": "7.0.1",
   "main": "lib/index.js",
   "module": "es/index.js",
-  "author": "James Kyle <jkyle@cloudflare.com>",
+  "author": "Frontend Team <frontend@cloudflare.com>",
   "license": "BSD-3-Clause",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
   "dependencies": {
-    "@cloudflare/style-container": "^7.7.3",
-    "@cloudflare/types": "^6.13.8",
-    "prop-types": "^15.6.0"
+    "@cloudflare/style-container": "^7.7.5",
+    "@cloudflare/types": "^6.14.1"
   },
   "peerDependencies": {
     "react": "^15.0.0-0 || ^16.0.0-0 || ^17.0.0-0"
   },
   "devDependencies": {
-    "eslint": "^4.18.2",
-    "svgo": "^1.3.2"
+    "@svgr/cli": "6.2.1",
+    "eslint": "^4.18.2"
   },
   "stratus": {
     "srcDirectory": "./src",
@@ -31,7 +30,8 @@
   "scripts": {
     "test": "stratus test",
     "test-coverage": "stratus test --coverage",
-    "test-watch": "stratus test --watch"
+    "test-watch": "stratus test --watch",
+    "update-icons": "svgr ../../../../../product-design/icons/icons-exports"
   },
-  "gitHead": "5f559644050fc502ee487e85d04b5e8886bc52a8"
+  "gitHead": "698f4aeafa1c656214a4060be27aa6b194d82b10"
 }

package/svgr.config.js

@@ -0,0 +1,72 @@
+const path = require('path');
+const fs = require('fs');
+
+function camelCaseToDash(str) {
+  return str.replace(/([a-zA-Z])(?=[A-Z])/g, '$1-').toLowerCase();
+}
+
+// Our export needs to be an object keyed by the icon type (e.g. { 'workers': WorkersIcon })
+// Here we import each default export individually, and then create a single object to export
+function defaultIndexTemplate(filePaths) {
+  let indexString = filePaths
+    .map(filePath => {
+      const basename = path.basename(filePath, path.extname(filePath));
+      const exportName = /^\d/.test(basename) ? `Svg${basename}` : basename;
+      return `import ${exportName} from './${basename}';`;
+    })
+    .join('\n');
+
+  indexString += '\nexport default {\n';
+
+  indexString += filePaths
+    .map(filePath => {
+      const basename = path.basename(filePath, path.extname(filePath));
+      const typeName = camelCaseToDash(basename);
+
+      const exportName = /^\d/.test(basename) ? `Svg${basename}` : basename;
+      return `'${typeName}': ${exportName},`;
+    })
+    .join('\n');
+
+  indexString += '\n};';
+
+  // Generate a static list of all icon types, for use in internal documentation
+  let iconTypesString = `export default [\n`;
+  iconTypesString += filePaths
+    .map(filePath => {
+      const basename = path.basename(filePath, path.extname(filePath));
+      return `  '${camelCaseToDash(basename)}'`;
+    })
+    .join(',\n');
+  iconTypesString += '\n];\n';
+
+  fs.writeFileSync('./src/iconTypes.js', iconTypesString);
+
+  // Hacky, but until we switch to using the built-in 'typescript' option in svgr, let's handle our typedefs here too
+  let typeString = 'export type IconType =\n';
+  typeString += filePaths
+    .map(filePath => {
+      const basename = path.basename(filePath, path.extname(filePath));
+      return `  | '${camelCaseToDash(basename)}'`;
+    })
+    .join('\n');
+  typeString += ';\n';
+
+  fs.writeFileSync('./src/IconType.ts', typeString);
+
+  return indexString;
+}
+
+module.exports = {
+  outDir: './src/reactsvgs',
+  indexTemplate: defaultIndexTemplate,
+  expandProps: 'start',
+  svgProps: {
+    'aria-hidden': "{!props['aria-label']}",
+    focusable: 'false'
+  },
+  svgoConfig: {
+    plugins: ['removeStyleElement', 'removeTitle', 'prefixIds']
+  },
+  prettierConfig: JSON.parse(fs.readFileSync('../../../../.prettierrc'))
+};

package/lib/reactsvgs/Product__securityCenter.js

@@ -1,35 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-// THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY. USE component-icon/src/svgtoreact.sh TO MODIFY
-var Product__securityCenter = function Product__securityCenter(_ref) {
-  var className = _ref.className,
-      label = _ref.label;
-  return /*#__PURE__*/_react.default.createElement("svg", {
-    className: className,
-    "aria-label": label,
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 16 16"
-  }, /*#__PURE__*/_react.default.createElement("path", {
-    d: "M8.203 12.205a4.162 4.162 0 100-8.325 4.162 4.162 0 000 8.325zm0-5.208a1.045 1.045 0 11-1.045 1.046A1.047 1.047 0 018.203 7v-.003zM7.063 9.75c.163.109.342.193.53.25v1.152a3.15 3.15 0 01-1.328-.607l.798-.795zm1.53.307c.203-.039.4-.109.582-.207l.81.81a3.105 3.105 0 01-1.392.527v-1.13zm1.317-.885c.113-.179.197-.374.25-.58h1.143a3.137 3.137 0 01-.606 1.378l-.787-.798zm.283-1.58A2 2 0 009.958 7l.807-.805c.296.41.49.887.563 1.387l-1.135.01zm-.943-1.3a1.985 1.985 0 00-.55-.23v-1.14c.492.082.958.28 1.357.578l-.807.793zm-1.55-.23a2.03 2.03 0 00-.522.213l-.808-.808c.395-.281.85-.468 1.33-.544v1.14zm-1.237.91a1.948 1.948 0 00-.225.5H5.095c.087-.471.28-.917.565-1.302l.803.803zm-.25 1.5c.034.184.095.362.182.528l-.815.815a3.152 3.152 0 01-.5-1.338l1.133-.005z"
-  }), /*#__PURE__*/_react.default.createElement("path", {
-    d: "M14 1.468H2.033L1.513 2v2.275h-.368v2.5h.368v2.5h-.368v2.5h.368v2.147l.52.553H14l.52-.52V2L14 1.468zm-.52 11.967H2.553V2.5H13.48v10.935z"
-  }));
-};
-
-Product__securityCenter.propTypes = {
-  className: _propTypes.default.string.isRequired,
-  label: _propTypes.default.string.isRequired
-};
-var _default = Product__securityCenter;
-exports.default = _default;