Add S2 Illustrations (#6851)

Author: devongovett

.parcelrc-build

@@ -6,7 +6,7 @@
     "style-types:*.ts": ["@parcel/transformer-typescript-types"],
     "packages/**/intl/*.json": ["parcel-transformer-intl"],
     "bundle-text:*.svg": ["@parcel/transformer-svg", "@parcel/transformer-inline-string"],
-    "packages/@react-spectrum/s2/s2wf-icons/*.svg": ["parcel-transformer-icon"],
+    "packages/@react-spectrum/s2/{s2wf-icons,spectrum-illustrations}/**/*.svg": ["parcel-transformer-icon"],
     // Disable PostCSS from running over style macro output
     "packages/@react-spectrum/s2/**/*.css": ["@parcel/transformer-css"],
     "*.svg": ["@parcel/transformer-svg-react"],

.storybook-s2/.parcelrc

@@ -3,7 +3,7 @@
   "resolvers": ["@parcel/resolver-glob", "parcel-resolver-storybook", "..."],
   "transformers": {
     "packages/@react-spectrum/s2/{src,stories}/*.{js,mjs,jsm,jsx,es6,cjs,ts,tsx}": ["parcel-transformer-react-docgen-typescript", "..."],
-    "packages/@react-spectrum/s2/s2wf-icons/*.svg": ["parcel-transformer-icon"],
+    "packages/@react-spectrum/s2/{s2wf-icons,spectrum-illustrations}/**/*.svg": ["parcel-transformer-icon"],
     "packages/*/*/intl/*.json": ["parcel-transformer-intl"],
     // Disable PostCSS from running over style macro output
     "*.css": ["@parcel/transformer-css"],

Makefile

@@ -35,7 +35,7 @@ clean_dist:
 	rm -rf packages/{react-aria,react-aria-components,react-stately}/i18n
 	rm -rf packages/@adobe/react-spectrum/i18n
 	rm -rf packages/@react-aria/i18n/server
-	rm -rf packages/@react-spectrum/s2/style/dist packages/@react-spectrum/s2/page.css packages/@react-spectrum/s2/icons
+	rm -rf packages/@react-spectrum/s2/style/dist packages/@react-spectrum/s2/page.css packages/@react-spectrum/s2/icons packages/@react-spectrum/s2/illustrations
 
 clean_parcel:
 	rm -rf .parcel-cache
@@ -107,6 +107,7 @@ build:
 		do node scripts/buildEsm.js $$pkg; \
 	done
 	node scripts/buildI18n.js
+	node scripts/copyIconDts.js
 
 website:
 	yarn build:docs --public-url /reactspectrum/$$(git rev-parse HEAD)/docs --dist-dir dist/$$(git rev-parse HEAD)/docs

packages/@react-spectrum/s2/.gitignore

@@ -1,2 +1,3 @@
 icons
+illustrations
 page.css

packages/@react-spectrum/s2/package.json

@@ -30,11 +30,18 @@
       "require": "./style/dist/main.cjs"
     },
     "./icons/*": {
-      "types": "./icon.d.ts",
+      "types": "./icons/*.d.ts",
       "module": "./icons/*.mjs",
       "import": "./icons/*.mjs",
       "require": "./icons/*.cjs"
-    }
+    },
+    "./illustrations/*": {
+      "types": "./illustrations/*.d.ts",
+      "module": "./illustrations/*.mjs",
+      "import": "./illustrations/*.mjs",
+      "require": "./illustrations/*.cjs"
+    },
+    "./illustrations/linear/internal/*": null
   },
   "targets": {
     "module": {},
@@ -72,6 +79,20 @@
       "isLibrary": true,
       "outputFormat": "commonjs",
       "includeNodeModules": false
+    },
+    "illustrations-module": {
+      "source": ["spectrum-illustrations/gradient/*.svg", "spectrum-illustrations/linear/*.tsx"],
+      "distDir": "illustrations",
+      "isLibrary": true,
+      "outputFormat": "esmodule",
+      "includeNodeModules": false
+    },
+    "illustrations-main": {
+      "source": ["spectrum-illustrations/gradient/*.svg", "spectrum-illustrations/linear/*.tsx"],
+      "distDir": "illustrations",
+      "isLibrary": true,
+      "outputFormat": "commonjs",
+      "includeNodeModules": false
     }
   },
   "browserslist": "last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions, last 2 Edge versions",
@@ -84,7 +105,7 @@
     "style/package.json",
     "page.css",
     "icons",
-    "icon.d.ts",
+    "illustrations",
     "src"
   ],
   "scripts": {