@cypress-design/react-statusicon 0.4.16 → 0.4.17

package/.turbo/turbo-build.log

@@ -8,5 +8,5 @@ $ rollup -c ./rollup.config.mjs
 index.ts
 
 Consumers of your bundle will have to use chunk.default to access their default export, which may not be what you want. Use `output.exports: "named"` to disable this warning.
-created ./dist/index.umd.js, ./dist/index.es.mjs in 12.5s
+created ./dist/index.umd.js, ./dist/index.es.mjs in 14.5s
 $ tsc --project ./tsconfig.build.json

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @cypress-design/react-statusicon
 
+## 0.4.17
+
+### Patch Changes
+
+- Updated dependencies [[`7f9ebbb`](https://github.com/cypress-io/cypress-design/commit/7f9ebbb83744d4109498f921f7de5539ccc3b479), [`2f984a0`](https://github.com/cypress-io/cypress-design/commit/2f984a02807f344a878ac65ac9fab62bc0c9442d)]:
+  - @cypress-design/react-icon@0.32.0
+
 ## 0.4.16
 
 ### Patch Changes

package/ReadMe.md

@@ -20,15 +20,17 @@ import StatusIcon from '@cypress-design/react-statusicon'
 
 The simple way of using the StatusIcon component
 
-```tsx
+```tsx live
 import StatusIcon from '@cypress-design/react-statusicon'
 
-export default () => <StatusIcon size="16" status="failed" variant="solid" />
+export default () => {
+  return <StatusIcon size="16" status="failed" variant="solid" />
+}
 ```
 
 The tree-shakable way (more optimized)
 
-```tsx
+```tsx live
 import { SolidStatusIcon } from '@cypress-design/react-statusicon'
 
 export default () => <SolidStatusIcon size="16" status="failed" />

package/dist/index.es.mjs

@@ -482,7 +482,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
 };
 
 var compileReactIconProperties = function (_a) {
-    var body = _a.body, defs = _a.defs, compiledClasses = _a.compiledClasses, size = _a.size, name = _a.name, attributes = __rest(_a, ["body", "defs", "compiledClasses", "size", "name"]);
+    var body = _a.body, defs = _a.defs, compiledClasses = _a.compiledClasses, size = _a.size, name = _a.name, alt = _a.alt, attributes = __rest(_a, ["body", "defs", "compiledClasses", "size", "name", "alt"]);
     var filteredAttributes = Object.keys(attributes).reduce(function (newAttributes, attrName) {
         if (!ICON_COLOR_PROP_NAMES.includes(attrName) &&
             attrName !== 'name') {
@@ -509,7 +509,11 @@ var compileReactIconProperties = function (_a) {
         }
     }, [defs, name, size]);
     var componentProps = __assign({ width: size, height: size, viewBox: "0 0 ".concat(size, " ").concat(size), fill: 'none', dangerouslySetInnerHTML: {
-            __html: body,
+            __html: alt
+                ? "<title>".concat(alt.replace(/[><]/g, function (s) {
+                    return s === '>' ? '&gt;' : '&lt;';
+                }), "</title>").concat(body)
+                : body,
         }, className: undefined }, filteredAttributes);
     if (attributes.className) {
         compiledClasses.push(attributes.className);
@@ -521,7 +525,7 @@ var compileReactIconProperties = function (_a) {
 };
 
 
-/* <wind-keep class="filter icon-light-secondary icon-dark-secondary"> */
+/* <wind-keep class="filter icon-light-secondary icon-dark-secondary h-1 h-2"> */
 
 var compileProps = function (_a) {
     var status = _a.status, statuses = _a.statuses, className = _a.className, size = _a.size, variantName = _a.variantName;