@codecademy/gamut-icons 8.1.2-alpha.b29ebf.0 → 8.1.2-alpha.dfdc7f.0

package/dist/icons/regular/LevelIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LevelIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var LevelIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LevelIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0.25 0.25 13.5 13.5",
@@ -36,23 +38,24 @@ export var LevelIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'level'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "level-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'level'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         d: "M4.975 7.45H1.15v5.4h3.825m4.05-8.1h-4.05v8.1h4.05m0-11.7h3.825v11.7H9.025z",
         strokeWidth: 0.9,
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
         strokeLinejoin: "round"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#level-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/LifePreserverIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LifePreserverIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var LifePreserverIcon = /*#__PURE__*/React.forwardRef(function (_ref, svg
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LifePreserverIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,14 +35,15 @@ export var LifePreserverIcon = /*#__PURE__*/React.forwardRef(function (_ref, svg
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'help-wheel'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
     }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "help-wheel-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'help-wheel'
-      }), /*#__PURE__*/_jsx("circle", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("circle", {
         cx: 12,
         cy: 12,
         r: 3.75,
@@ -67,7 +70,7 @@ export var LifePreserverIcon = /*#__PURE__*/React.forwardRef(function (_ref, svg
         strokeWidth: 1.5
       })]
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#help-wheel-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/LinkIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LinkIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var LinkIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LinkIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,23 +35,24 @@ export var LinkIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'hyperlink-2'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "hyperlink-2-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'hyperlink-2'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
         strokeLinejoin: "round",
         strokeWidth: 1.5,
         d: "M6.75 17.249l10.5-10.5m-9.515 5.272a4.472 4.472 0 00-3.417 1.3l-2.25 2.25a4.5 4.5 0 006.364 6.364l2.25-2.25a4.472 4.472 0 001.3-3.417m4.283-4.292a4.473 4.473 0 003.417-1.3l2.25-2.25a4.5 4.5 0 00-6.364-6.364l-2.25 2.25a4.475 4.475 0 00-1.295 3.417"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#hyperlink-2-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/LinkedinIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LinkedinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var LinkedinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LinkedinIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 16 16",
@@ -33,19 +35,20 @@ export var LinkedinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'linkedin'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "linkedin-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'linkedin'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         fill: "#fff",
         d: "M5.6 8.2c0-1.4 0-2.5-.1-3.5h2.9l.2 1.5h.1c.4-.7 1.5-1.8 3.4-1.8 2.2 0 3.9 1.5 3.9 4.7v6.4h-3.4v-6c0-1.4-.5-2.4-1.7-2.4-.9 0-1.5.6-1.7 1.3-.2.3-.2.6-.2.9v6.3H5.6V8.2zM.1 4.9h3.4v10.9H.1V4.9zm3.5-3c0 .9-.7 1.7-1.8 1.7S0 2.8 0 1.9C0 .9.7.2 1.8.2 3 .2 3.6.9 3.6 1.9z"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#linkedin-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/LinkedinOutlineIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LinkedinOutlineIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var LinkedinOutlineIcon = /*#__PURE__*/React.forwardRef(function (_ref, s
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LinkedinOutlineIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     "data-name": "Outline Version",
     xmlns: "http://www.w3.org/2000/svg",
@@ -34,18 +36,19 @@ export var LinkedinOutlineIcon = /*#__PURE__*/React.forwardRef(function (_ref, s
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'linkedin-2'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "linkedin-2-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'linkedin-2'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         d: "M.81 7.95a.75.75 0 00-.75.75v13.93a.75.75 0 00.75.75h4.86a.75.75 0 00.75-.75V8.7a.75.75 0 00-.75-.75zm4.11 13.93H1.56V9.45h3.36zM17.89 7.94a7.35 7.35 0 00-3.53.93V8.7a.75.75 0 00-.75-.75h-5.1a.75.75 0 00-.75.75v13.93a.75.75 0 00.75.75h5.11a.75.75 0 00.75-.75v-7.25a1.39 1.39 0 012.79 0v7.25a.75.75 0 00.75.75h5.36a.75.75 0 00.75-.75V15.5c-.02-4.67-2.35-7.56-6.13-7.56zm4.62 13.94h-3.86v-6.5a2.89 2.89 0 00-5.79 0v6.5h-3.6V9.45h3.61v.84a.75.75 0 001.26.55 6.07 6.07 0 013.77-1.4c2.93 0 4.62 2.21 4.62 6.06zM3.24 7.13A3.25 3.25 0 100 3.88a3.25 3.25 0 003.24 3.25zm0-5a1.75 1.75 0 11-1.75 1.75 1.75 1.75 0 011.75-1.75z"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#linkedin-2-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/ListIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var ListIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var ListIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('ListIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,14 +35,15 @@ export var ListIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'list-bullets'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
     }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "list-bullets-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'list-bullets'
-      }), /*#__PURE__*/_jsx("circle", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("circle", {
         cx: 3,
         cy: 2.998,
         r: 2.25,
@@ -76,7 +79,7 @@ export var ListIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
         d: "M8.25 3.748h15m-15 9h15m-15 9h15"
       })]
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#list-bullets-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/LocationPinIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LocationPinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var LocationPinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LocationPinIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,20 +35,21 @@ export var LocationPinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'location-pin'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
     }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "location-pin-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'location-pin'
-      }), /*#__PURE__*/_jsx("path", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("path", {
         d: "M12.768 22.192A9.733 9.733 0 018.761 17.5h2.031a1 1 0 100-2H8.106a15 15 0 01-.4-3.5A15.263 15.263 0 018 9c11.014 0 13.746.008 14.486-.018a.942.942 0 00.892-1.375A11.944 11.944 0 0012.147 0C4.635.486.583 6.091.237 11.161A12.012 12.012 0 0012.206 24h.007a.984.984 0 00.957-.809.947.947 0 00-.402-.999zM6.062 15.5H2.853A9.888 9.888 0 012.67 9h3.285a17.823 17.823 0 00-.247 3 17.249 17.249 0 00.354 3.5zm6.145-13.331A10.161 10.161 0 0115.849 7H8.564a10.048 10.048 0 013.643-4.831zM20.873 7h-2.907a12.982 12.982 0 00-2.4-4.42A9.908 9.908 0 0120.873 7zM8.82 2.6A12.9 12.9 0 006.451 7H3.562A10.041 10.041 0 018.82 2.6zM3.866 17.5h2.741a12.715 12.715 0 002.213 3.9 10.04 10.04 0 01-4.954-3.9z"
       }), /*#__PURE__*/_jsx("path", {
         d: "M18.792 11a5.006 5.006 0 00-5 5c0 3.171 4.457 7.664 4.646 7.854a.5.5 0 00.707 0c.189-.19 4.647-4.683 4.647-7.854a5.006 5.006 0 00-5-5zm0 3.25a1.75 1.75 0 11-1.75 1.75 1.753 1.753 0 011.75-1.752z"
       })]
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#location-pin-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/Lock1Icon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var Lock1Icon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var Lock1Icon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('Lock1Icon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     viewBox: "0 0 140 140",
     xmlns: "http://www.w3.org/2000/svg",
@@ -33,14 +35,15 @@ export var Lock1Icon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'lock-one'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "lock-one-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'lock-one'
-      }), /*#__PURE__*/_jsxs("g", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsxs("g", {
         transform: "scale(5.83333)",
         children: [/*#__PURE__*/_jsx("title", {
           children: 'lock-1'
@@ -52,9 +55,9 @@ export var Lock1Icon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
           strokeLinejoin: "round",
           strokeWidth: 1.5
         })]
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#lock-one-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/LockHeavyIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LockHeavyIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var LockHeavyIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LockHeavyIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,18 +35,19 @@ export var LockHeavyIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'lock-1-heavy'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "lock-1-heavy-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'lock-1-heavy'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         d: "M19.5 9.5h-.75V6.75a6.75 6.75 0 00-13.5 0V9.5H4.5a2 2 0 00-2 2V22a2 2 0 002 2h15a2 2 0 002-2V11.5a2 2 0 00-2-2zm-9.5 6a2 2 0 113 1.723V19.5a1 1 0 01-2 0v-2.277a1.994 1.994 0 01-1-1.723zM7.75 6.75a4.25 4.25 0 018.5 0V9a.5.5 0 01-.5.5h-7.5a.5.5 0 01-.5-.5z"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#lock-1-heavy-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/LockIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LockIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var LockIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LockIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,14 +35,15 @@ export var LockIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'lock-1'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
     }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "lock-1-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'lock-1'
-      }), /*#__PURE__*/_jsx("rect", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("rect", {
         x: 3.75,
         y: 9.75,
         width: 16.5,
@@ -61,7 +64,7 @@ export var LockIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
         strokeWidth: 1.5
       })]
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#lock-1-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/MaintenanceIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var MaintenanceIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MaintenanceIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('MaintenanceIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,14 +35,15 @@ export var MaintenanceIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'safety-helmet-mine'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
     }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "safety-helmet-mine-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'safety-helmet-mine'
-      }), /*#__PURE__*/_jsx("path", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("path", {
         d: "M21 15.375v-1.5a9 9 0 00-18 0v1.5m5.25-12v7.5m7.5-7.5v7.5",
         fill: "none",
         stroke: "#fff",
@@ -65,7 +68,7 @@ export var MaintenanceIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
         d: "M16.5 15.375h6.75m-22.5 0H7.5m-3.75 3a2.774 2.774 0 011.5 2.25h13.5a2.774 2.774 0 011.5-2.25"
       })]
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#safety-helmet-mine-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/MapFingerIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var MapFingerIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MapFingerIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('MapFingerIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 140 140",
@@ -33,23 +35,24 @@ export var MapFingerIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'travel-map-finger'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "travel-map-finger-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'travel-map-finger'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         d: "M74.334 135.613l-16.129-18.135a9.084 9.084 0 1113.58-12.07l11.3 12.705v-52.5a8.75 8.75 0 1117.5 0V105h8.75a26.25 26.25 0 0126.25 26.25v4.375m-120.325-.63a73.587 73.587 0 01-7.093-15.517m-3.39-15.855a75.25 75.25 0 01.199-17.068m3.884-15.75a72.817 72.817 0 017.683-15.243m10.29-12.552a73.646 73.646 0 0113.493-10.425m14.734-6.767a54.56 54.56 0 018.25-2.246M83.084 4.363l26.25 26.25m0-26.25l-26.25 26.25",
         strokeWidth: 8.75,
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
         strokeLinejoin: "round"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#travel-map-finger-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/MapPinIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var MapPinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MapPinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('MapPinIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 140 140",
@@ -33,14 +35,15 @@ export var MapPinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'maps-pin-1'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "maps-pin-1-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'maps-pin-1'
-      }), /*#__PURE__*/_jsxs("g", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsxs("g", {
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
@@ -51,9 +54,9 @@ export var MapPinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
         }), /*#__PURE__*/_jsx("path", {
           d: "M109.375 66.057a26.25 26.25 0 0126.25 26.25c0 11.205-15.68 32.526-22.802 41.638a4.375 4.375 0 01-6.895 0c-7.123-9.106-22.803-30.432-22.803-41.638a26.25 26.25 0 0126.25-26.25z"
         })]
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#maps-pin-1-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",