@react-spectrum/parcel-transformer-s2-icon 3.0.0-nightly-086ad3115-240912 → 3.0.0-nightly-73414999f-240914

package/IconTransformer.js

@@ -57,10 +57,10 @@ module.exports = new Transformer({
           'var(--spectrum-global-color-gray-800, #292929)': `var(--iconPrimary, var(--lightningcss-light, ${tokens['gray-800'].sets.light.value}) var(--lightningcss-dark, ${tokens['gray-800'].sets.dark.value}))`
         },
         typescript: true,
+        ref: true,
         plugins: ['@svgr/plugin-svgo', '@svgr/plugin-jsx']
       })
-    ).replace('export default SvgComponent;', '');
-    // will need to use svgr's templating to add ref support if we want that https://github.com/facebook/create-react-app/pull/5457
+    ).replace('export default ForwardRef;', '');
     let newFile = template(asset, iconName, optimized);
     return [{
       type: 'tsx',
@@ -87,6 +87,7 @@ function template(asset, iconName, svg) {
 import {IconProps, ${context}, IconContextValue} from '${normalizedPath.includes('@react-spectrum/s2') ? '~/src/Icon' : '@react-spectrum/s2'}';
 import {SVGProps, useRef} from 'react';
 import {useContextProps} from 'react-aria-components';
+import {SkeletonWrapper, useSkeletonIcon} from '~/src/Skeleton';
 
 ${svg.replace('import { SVGProps } from "react";', '')}
 
@@ -110,15 +111,17 @@ export default function ${iconRename}(props: IconProps) {
   }
 
   let svg = (
-    <SvgComponent
-      {...otherProps}
-      focusable={false}
-      aria-label={ariaLabel}
-      aria-hidden={ariaLabel ? (ariaHidden || undefined) : true}
-      role="img"
-      data-slot={slot}
-      className={(UNSAFE_className ?? '') + ' ' + (styles || '')}
-      style={UNSAFE_style} />
+    <SkeletonWrapper>
+      <ForwardRef
+        {...otherProps}
+        focusable={false}
+        aria-label={ariaLabel}
+        aria-hidden={ariaLabel ? (ariaHidden || undefined) : true}
+        role="img"
+        data-slot={slot}
+        className={(UNSAFE_className ?? '') + ' ' + useSkeletonIcon(styles)}
+        style={UNSAFE_style} />
+    </SkeletonWrapper>
   );
 
   if (render) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-spectrum/parcel-transformer-s2-icon",
-  "version": "3.0.0-nightly-086ad3115-240912",
+  "version": "3.0.0-nightly-73414999f-240914",
   "main": "IconTransformer.js",
   "engines": {
     "parcel": "2.0.0-dev.1599"