From 319a8fcdbf89dd001532c68e7ce7d82a6b69ee0a Mon Sep 17 00:00:00 2001
From: Bernie Reiter <ockham@raz.or.at>
Date: Fri, 10 Apr 2020 18:52:20 +0200
Subject: [PATCH] Primitives: Add types (#21482)

---
 package-lock.json                             |    6 +
 package.json                                  |    1 +
 .../test/__snapshots__/control.js.snap        |    4 +-
 .../test/__snapshots__/index.js.snap          |    4 +-
 .../test/__snapshots__/index.js.snap          |   24 +-
 .../test/__snapshots__/index.js.snap          |    4 +-
 .../test/__snapshots__/index.js.snap          |    4 +-
 .../enable-custom-fields.js.snap              |    8 +-
 packages/primitives/CHANGELOG.md              |    4 +
 packages/primitives/package.json              |    1 +
 packages/primitives/src/svg/index.js          |   69 +-
 packages/primitives/tsconfig.json             |    9 +
 storybook/test/__snapshots__/index.js.snap    | 1916 ++++++++---------
 tsconfig.json                                 |    1 +
 14 files changed, 1071 insertions(+), 984 deletions(-)
 create mode 100644 packages/primitives/tsconfig.json

diff --git a/package-lock.json b/package-lock.json
index ad0c7ad9bbec35..243abb8e3407a8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9837,6 +9837,12 @@
 				"@types/responselike": "*"
 			}
 		},
+		"@types/classnames": {
+			"version": "2.2.10",
+			"resolved": "https://registry.npmjs.org/@types/classnames/-/classnames-2.2.10.tgz",
+			"integrity": "sha512-1UzDldn9GfYYEsWWnn/P4wkTlkZDH7lDb0wBMGbtIQc9zXEQq7FlKBdZUn6OBqD8sKZZ2RQO2mAjGpXiDGoRmQ==",
+			"dev": true
+		},
 		"@types/color-name": {
 			"version": "1.1.1",
 			"resolved": "https://registry.npmjs.org/@types/color-name/-/color-name-1.1.1.tgz",
diff --git a/package.json b/package.json
index c58b999948fa3f..1b389b5c5407d2 100644
--- a/package.json
+++ b/package.json
@@ -89,6 +89,7 @@
 		"@storybook/addon-viewport": "5.3.2",
 		"@storybook/react": "5.3.2",
 		"@testing-library/react": "10.0.2",
+		"@types/classnames": "2.2.10",
 		"@types/lodash": "4.14.149",
 		"@types/prettier": "1.19.0",
 		"@types/qs": "6.9.1",
diff --git a/packages/block-editor/src/components/color-palette/test/__snapshots__/control.js.snap b/packages/block-editor/src/components/color-palette/test/__snapshots__/control.js.snap
index 0c9032a1c70c99..58b41fe54e38a3 100644
--- a/packages/block-editor/src/components/color-palette/test/__snapshots__/control.js.snap
+++ b/packages/block-editor/src/components/color-palette/test/__snapshots__/control.js.snap
@@ -53,9 +53,9 @@ exports[`ColorPaletteControl matches the snapshot 1`] = `
             type="button"
           />
           <svg
-            aria-hidden="true"
+            aria-hidden={true}
             fill="#000000"
-            focusable="false"
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
diff --git a/packages/components/src/color-palette/test/__snapshots__/index.js.snap b/packages/components/src/color-palette/test/__snapshots__/index.js.snap
index 760221f289041e..07eed8a9d5019f 100644
--- a/packages/components/src/color-palette/test/__snapshots__/index.js.snap
+++ b/packages/components/src/color-palette/test/__snapshots__/index.js.snap
@@ -367,9 +367,9 @@ exports[`ColorPalette should render a dynamic toolbar of colors 1`] = `
               xmlns="http://www.w3.org/2000/svg"
             >
               <svg
-                aria-hidden="true"
+                aria-hidden={true}
                 fill="#000000"
-                focusable="false"
+                focusable={false}
                 height={24}
                 role="img"
                 viewBox="0 0 24 24"
diff --git a/packages/components/src/color-picker/test/__snapshots__/index.js.snap b/packages/components/src/color-picker/test/__snapshots__/index.js.snap
index 434ed647095fdb..ee3e5fc66b2a31 100644
--- a/packages/components/src/color-picker/test/__snapshots__/index.js.snap
+++ b/packages/components/src/color-picker/test/__snapshots__/index.js.snap
@@ -155,8 +155,8 @@ exports[`ColorPicker should commit changes to all views on blur 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -329,8 +329,8 @@ exports[`ColorPicker should commit changes to all views on keyDown = DOWN 1`] =
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -503,8 +503,8 @@ exports[`ColorPicker should commit changes to all views on keyDown = ENTER 1`] =
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -677,8 +677,8 @@ exports[`ColorPicker should commit changes to all views on keyDown = UP 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -851,8 +851,8 @@ exports[`ColorPicker should only update input view for draft changes 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -1025,8 +1025,8 @@ exports[`ColorPicker should render color picker 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
diff --git a/packages/edit-post/src/components/header/more-menu/test/__snapshots__/index.js.snap b/packages/edit-post/src/components/header/more-menu/test/__snapshots__/index.js.snap
index 909241a36eaa02..9296591a638592 100644
--- a/packages/edit-post/src/components/header/more-menu/test/__snapshots__/index.js.snap
+++ b/packages/edit-post/src/components/header/more-menu/test/__snapshots__/index.js.snap
@@ -99,8 +99,8 @@ exports[`MoreMenu should match snapshot 1`] = `
                   xmlns="http://www.w3.org/2000/svg"
                 >
                   <svg
-                    aria-hidden="true"
-                    focusable="false"
+                    aria-hidden={true}
+                    focusable={false}
                     height={24}
                     role="img"
                     viewBox="0 0 24 24"
diff --git a/packages/edit-post/src/components/header/plugin-more-menu-item/test/__snapshots__/index.js.snap b/packages/edit-post/src/components/header/plugin-more-menu-item/test/__snapshots__/index.js.snap
index d847aadaff72ca..44ebe7ba7b2138 100644
--- a/packages/edit-post/src/components/header/plugin-more-menu-item/test/__snapshots__/index.js.snap
+++ b/packages/edit-post/src/components/header/plugin-more-menu-item/test/__snapshots__/index.js.snap
@@ -22,9 +22,9 @@ exports[`PluginMoreMenuItem renders menu item as button properly 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
+        aria-hidden={true}
         className="components-menu-items__item-icon"
-        focusable="false"
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
diff --git a/packages/edit-post/src/components/options-modal/options/test/__snapshots__/enable-custom-fields.js.snap b/packages/edit-post/src/components/options-modal/options/test/__snapshots__/enable-custom-fields.js.snap
index fd30201bd3b8d6..eb27081e91dc8f 100644
--- a/packages/edit-post/src/components/options-modal/options/test/__snapshots__/enable-custom-fields.js.snap
+++ b/packages/edit-post/src/components/options-modal/options/test/__snapshots__/enable-custom-fields.js.snap
@@ -22,9 +22,9 @@ exports[`EnableCustomFieldsOption renders a checked checkbox and a confirmation
           value="1"
         />
         <svg
-          aria-hidden="true"
+          aria-hidden={true}
           className="components-checkbox-control__checked"
-          focusable="false"
+          focusable={false}
           height={24}
           role="img"
           viewBox="0 0 24 24"
@@ -80,9 +80,9 @@ exports[`EnableCustomFieldsOption renders a checked checkbox when custom fields
           value="1"
         />
         <svg
-          aria-hidden="true"
+          aria-hidden={true}
           className="components-checkbox-control__checked"
-          focusable="false"
+          focusable={false}
           height={24}
           role="img"
           viewBox="0 0 24 24"
diff --git a/packages/primitives/CHANGELOG.md b/packages/primitives/CHANGELOG.md
index e597eb0e1e333d..480dc11051dadc 100644
--- a/packages/primitives/CHANGELOG.md
+++ b/packages/primitives/CHANGELOG.md
@@ -1,3 +1,7 @@
 ## Master
 
+Include TypeScript type declarations ([#21482](https://github.com/WordPress/gutenberg/pull/21482))
+
+## 1.0.0
+
 Initial release.
diff --git a/packages/primitives/package.json b/packages/primitives/package.json
index 89feb4127e47fa..7c21406159fa68 100644
--- a/packages/primitives/package.json
+++ b/packages/primitives/package.json
@@ -22,6 +22,7 @@
 	"module": "build-module/index.js",
 	"react-native": "src/index",
 	"sideEffects": false,
+	"types": "build-types",
 	"dependencies": {
 		"@babel/runtime": "^7.9.2",
 		"@wordpress/element": "file:../element",
diff --git a/packages/primitives/src/svg/index.js b/packages/primitives/src/svg/index.js
index 470ee1af88b86a..07b7350c117c59 100644
--- a/packages/primitives/src/svg/index.js
+++ b/packages/primitives/src/svg/index.js
@@ -8,26 +8,91 @@ import classnames from 'classnames';
  */
 import { createElement } from '@wordpress/element';
 
+// Disable reason: JSDoc linter doesn't seem to parse the union (`&`) correctly.
+/* eslint-disable jsdoc/valid-types */
+/** @typedef {{isPressed: boolean} & import('react').ComponentPropsWithoutRef<'svg'>} SVGProps */
+/* eslint-enable jsdoc/valid-types */
+
+/**
+ * @param {import('react').ComponentPropsWithoutRef<'circle'>} props
+ *
+ * @return {JSX.Element} Circle component
+ */
 export const Circle = ( props ) => createElement( 'circle', props );
+
+/**
+ * @param {import('react').ComponentPropsWithoutRef<'g'>} props
+ *
+ * @return {JSX.Element} G component
+ */
 export const G = ( props ) => createElement( 'g', props );
+
+/**
+ * @param {import('react').ComponentPropsWithoutRef<'path'>} props
+ *
+ * @return {JSX.Element} Path component
+ */
 export const Path = ( props ) => createElement( 'path', props );
+
+/**
+ * @param {import('react').ComponentPropsWithoutRef<'polygon'>} props
+ *
+ * @return {JSX.Element} Polygon component
+ */
 export const Polygon = ( props ) => createElement( 'polygon', props );
+
+/**
+ * @param {import('react').ComponentPropsWithoutRef<'rect'>} props
+ *
+ * @return {JSX.Element} Rect component
+ */
 export const Rect = ( props ) => createElement( 'rect', props );
+
+/**
+ * @param {import('react').ComponentPropsWithoutRef<'defs'>} props
+ *
+ * @return {JSX.Element} Defs component
+ */
 export const Defs = ( props ) => createElement( 'defs', props );
+
+/**
+ * @param {import('react').ComponentPropsWithoutRef<'radialGradient'>} props
+ *
+ * @return {JSX.Element} RadialGradient component
+ */
 export const RadialGradient = ( props ) =>
 	createElement( 'radialGradient', props );
+
+/**
+ * @param {import('react').ComponentPropsWithoutRef<'linearGradient'>} props
+ *
+ * @return {JSX.Element} LinearGradient component
+ */
 export const LinearGradient = ( props ) =>
 	createElement( 'linearGradient', props );
+
+/**
+ * @param {import('react').ComponentPropsWithoutRef<'stop'>} props
+ *
+ * @return {JSX.Element} Stop component
+ */
 export const Stop = ( props ) => createElement( 'stop', props );
 
+/**
+ *
+ * @param {SVGProps} props isPressed indicates whether the SVG should appear as pressed.
+ *                         Other props will be passed through to svg component.
+ *
+ * @return {JSX.Element} Stop component
+ */
 export const SVG = ( { className, isPressed, ...props } ) => {
 	const appliedProps = {
 		...props,
 		className:
 			classnames( className, { 'is-pressed': isPressed } ) || undefined,
 		role: 'img',
-		'aria-hidden': 'true',
-		focusable: 'false',
+		'aria-hidden': true,
+		focusable: false,
 	};
 
 	// Disable reason: We need to have a way to render HTML tag for web.
diff --git a/packages/primitives/tsconfig.json b/packages/primitives/tsconfig.json
new file mode 100644
index 00000000000000..085d6fa752ab04
--- /dev/null
+++ b/packages/primitives/tsconfig.json
@@ -0,0 +1,9 @@
+{
+	"extends": "../../tsconfig.base.json",
+	"compilerOptions": {
+		"rootDir": "src",
+		"declarationDir": "build-types"
+	},
+	"include": [ "src/**/*" ],
+	"references": [ { "path": "../element" } ]
+}
diff --git a/storybook/test/__snapshots__/index.js.snap b/storybook/test/__snapshots__/index.js.snap
index 914fcf1ffec427..bb0a5659eaaa81 100644
--- a/storybook/test/__snapshots__/index.js.snap
+++ b/storybook/test/__snapshots__/index.js.snap
@@ -59,8 +59,8 @@ exports[`Storyshots Components/Animate Appear Bottom Left 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -95,8 +95,8 @@ exports[`Storyshots Components/Animate Appear Bottom Right 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -131,8 +131,8 @@ exports[`Storyshots Components/Animate Appear Top Left 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -167,8 +167,8 @@ exports[`Storyshots Components/Animate Appear Top Right 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -201,8 +201,8 @@ exports[`Storyshots Components/Animate Default 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -235,8 +235,8 @@ exports[`Storyshots Components/Animate Loading 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -269,8 +269,8 @@ exports[`Storyshots Components/Animate Slide In 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -354,8 +354,8 @@ exports[`Storyshots Components/Button Buttons 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -372,8 +372,8 @@ exports[`Storyshots Components/Button Buttons 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -390,8 +390,8 @@ exports[`Storyshots Components/Button Buttons 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -408,8 +408,8 @@ exports[`Storyshots Components/Button Buttons 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -426,8 +426,8 @@ exports[`Storyshots Components/Button Buttons 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -476,8 +476,8 @@ exports[`Storyshots Components/Button Buttons 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -494,8 +494,8 @@ exports[`Storyshots Components/Button Buttons 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -512,8 +512,8 @@ exports[`Storyshots Components/Button Buttons 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -530,8 +530,8 @@ exports[`Storyshots Components/Button Buttons 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -548,8 +548,8 @@ exports[`Storyshots Components/Button Buttons 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -613,9 +613,9 @@ exports[`Storyshots Components/Button Disabled Focusable Icon 1`] = `
   type="button"
 >
   <svg
-    aria-hidden="true"
+    aria-hidden={true}
     className="dashicon dashicons-ellipsis"
-    focusable="false"
+    focusable={false}
     height={20}
     role="img"
     viewBox="0 0 20 20"
@@ -659,8 +659,8 @@ exports[`Storyshots Components/Button Grouped Icons 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -684,8 +684,8 @@ exports[`Storyshots Components/Button Grouped Icons 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -709,8 +709,8 @@ exports[`Storyshots Components/Button Grouped Icons 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -738,9 +738,9 @@ exports[`Storyshots Components/Button Icon 1`] = `
   type="button"
 >
   <svg
-    aria-hidden="true"
+    aria-hidden={true}
     className="dashicon dashicons-ellipsis"
-    focusable="false"
+    focusable={false}
     height={20}
     role="img"
     viewBox="0 0 20 20"
@@ -1886,9 +1886,9 @@ exports[`Storyshots Components/CheckboxControl All 1`] = `
         value="1"
       />
       <svg
-        aria-hidden="true"
+        aria-hidden={true}
         className="components-checkbox-control__checked"
-        focusable="false"
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -1935,9 +1935,9 @@ exports[`Storyshots Components/CheckboxControl Default 1`] = `
         value="1"
       />
       <svg
-        aria-hidden="true"
+        aria-hidden={true}
         className="components-checkbox-control__checked"
-        focusable="false"
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -2369,8 +2369,8 @@ exports[`Storyshots Components/ColorPicker Alpha Enabled 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -2543,8 +2543,8 @@ exports[`Storyshots Components/ColorPicker Default 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -2584,9 +2584,9 @@ exports[`Storyshots Components/CustomSelectControl Default 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="components-custom-select-control__button-icon"
-      focusable="false"
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -2613,10 +2613,10 @@ exports[`Storyshots Components/CustomSelectControl Default 1`] = `
 
 exports[`Storyshots Components/Dashicon Default 1`] = `
 <svg
-  aria-hidden="true"
+  aria-hidden={true}
   className="dashicon dashicons-wordpress"
   color="#0079AA"
-  focusable="false"
+  focusable={false}
   height={20}
   role="img"
   viewBox="0 0 20 20"
@@ -2748,8 +2748,8 @@ exports[`Storyshots Components/Draggable Default 1`] = `
       }
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -2789,8 +2789,8 @@ Array [
         type="button"
       >
         <svg
-          aria-hidden="true"
-          focusable="false"
+          aria-hidden={true}
+          focusable={false}
           height={24}
           role="img"
           viewBox="0 0 24 24"
@@ -2824,8 +2824,8 @@ Array [
         type="button"
       >
         <svg
-          aria-hidden="true"
-          focusable="false"
+          aria-hidden={true}
+          focusable={false}
           height={24}
           role="img"
           viewBox="0 0 24 24"
@@ -2856,9 +2856,9 @@ exports[`Storyshots Components/ExternalLink Default 1`] = `
     (opens in a new tab)
   </span>
   <svg
-    aria-hidden="true"
+    aria-hidden={true}
     className="components-external-link__icon"
-    focusable="false"
+    focusable={false}
     height={24}
     role="img"
     viewBox="0 0 24 24"
@@ -2906,9 +2906,9 @@ exports[`Storyshots Components/FontSizePicker Default 1`] = `
       >
         Normal
         <svg
-          aria-hidden="true"
+          aria-hidden={true}
           className="components-custom-select-control__button-icon"
-          focusable="false"
+          focusable={false}
           height={24}
           role="img"
           viewBox="0 0 24 24"
@@ -3197,9 +3197,9 @@ input[type='number'].emotion-18 {
       >
         Normal
         <svg
-          aria-hidden="true"
+          aria-hidden={true}
           className="components-custom-select-control__button-icon"
-          focusable="false"
+          focusable={false}
           height={24}
           role="img"
           viewBox="0 0 24 24"
@@ -3250,8 +3250,8 @@ input[type='number'].emotion-18 {
           className="emotion-0 emotion-1"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="-2 -2 24 24"
@@ -3331,8 +3331,8 @@ input[type='number'].emotion-18 {
           className="emotion-16 emotion-17"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="-2 -2 24 24"
@@ -3396,9 +3396,9 @@ exports[`Storyshots Components/FontSizePicker Without Custom Sizes 1`] = `
       >
         Normal
         <svg
-          aria-hidden="true"
+          aria-hidden={true}
           className="components-custom-select-control__button-icon"
-          focusable="false"
+          focusable={false}
           height={24}
           role="img"
           viewBox="0 0 24 24"
@@ -3455,9 +3455,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={20}
       role="img"
       viewBox="0 0 20 20"
@@ -3489,9 +3489,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={20}
       role="img"
       viewBox="0 0 20 20"
@@ -3523,9 +3523,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={20}
       role="img"
       viewBox="0 0 20 20"
@@ -3553,9 +3553,9 @@ Array [
 exports[`Storyshots Components/Icon Default 1`] = `
 <div>
   <svg
-    aria-hidden="true"
+    aria-hidden={true}
     className="dashicon dashicons-screenoptions"
-    focusable="false"
+    focusable={false}
     height="24"
     role="img"
     viewBox="0 0 20 20"
@@ -3590,9 +3590,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={14}
       role="img"
       viewBox="0 0 20 20"
@@ -3623,9 +3623,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={16}
       role="img"
       viewBox="0 0 20 20"
@@ -3656,9 +3656,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={20}
       role="img"
       viewBox="0 0 20 20"
@@ -3689,9 +3689,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 20 20"
@@ -3722,9 +3722,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={28}
       role="img"
       viewBox="0 0 20 20"
@@ -3755,9 +3755,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={32}
       role="img"
       viewBox="0 0 20 20"
@@ -3788,9 +3788,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={40}
       role="img"
       viewBox="0 0 20 20"
@@ -3821,9 +3821,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 20 20"
@@ -3854,9 +3854,9 @@ Array [
     }
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-screenoptions"
-      focusable="false"
+      focusable={false}
       height={56}
       role="img"
       viewBox="0 0 20 20"
@@ -3883,8 +3883,8 @@ Array [
 
 exports[`Storyshots Components/Icon With A Component 1`] = `
 <svg
-  aria-hidden="true"
-  focusable="false"
+  aria-hidden={true}
+  focusable={false}
   role="img"
 >
   <path
@@ -3895,8 +3895,8 @@ exports[`Storyshots Components/Icon With A Component 1`] = `
 
 exports[`Storyshots Components/Icon With A Function 1`] = `
 <svg
-  aria-hidden="true"
-  focusable="false"
+  aria-hidden={true}
+  focusable={false}
   role="img"
 >
   <path
@@ -3907,8 +3907,8 @@ exports[`Storyshots Components/Icon With A Function 1`] = `
 
 exports[`Storyshots Components/Icon With An SVG 1`] = `
 <svg
-  aria-hidden="true"
-  focusable="false"
+  aria-hidden={true}
+  focusable={false}
   height={24}
   role="img"
   width={24}
@@ -3967,9 +3967,9 @@ exports[`Storyshots Components/Panel Default 1`] = `
           aria-hidden="true"
         >
           <svg
-            aria-hidden="true"
+            aria-hidden={true}
             className="components-panel__arrow"
-            focusable="false"
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -4020,9 +4020,9 @@ exports[`Storyshots Components/Panel Multiple Bodies 1`] = `
           aria-hidden="true"
         >
           <svg
-            aria-hidden="true"
+            aria-hidden={true}
             className="components-panel__arrow"
-            focusable="false"
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -4059,9 +4059,9 @@ exports[`Storyshots Components/Panel Multiple Bodies 1`] = `
           aria-hidden="true"
         >
           <svg
-            aria-hidden="true"
+            aria-hidden={true}
             className="components-panel__arrow"
-            focusable="false"
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -4107,9 +4107,9 @@ exports[`Storyshots Components/Panel With Icon 1`] = `
           aria-hidden="true"
         >
           <svg
-            aria-hidden="true"
+            aria-hidden={true}
             className="components-panel__arrow"
-            focusable="false"
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -4123,9 +4123,9 @@ exports[`Storyshots Components/Panel With Icon 1`] = `
         </span>
         My Block Settings
         <svg
-          aria-hidden="true"
+          aria-hidden={true}
           className="dashicon dashicons-wordpress components-panel__icon"
-          focusable="false"
+          focusable={false}
           height={20}
           role="img"
           viewBox="0 0 20 20"
@@ -4155,9 +4155,9 @@ exports[`Storyshots Components/Placeholder Default 1`] = `
     className="components-placeholder__label"
   >
     <svg
-      aria-hidden="true"
+      aria-hidden={true}
       className="dashicon dashicons-smiley"
-      focusable="false"
+      focusable={false}
       height={20}
       role="img"
       viewBox="0 0 20 20"
@@ -6834,9 +6834,9 @@ input[type='number'].emotion-16 {
         className="emotion-14 emotion-15"
       >
         <svg
-          aria-hidden="true"
+          aria-hidden={true}
           className="dashicon dashicons-wordpress"
-          focusable="false"
+          focusable={false}
           height={20}
           role="img"
           viewBox="0 0 20 20"
@@ -7083,9 +7083,9 @@ input[type='number'].emotion-16 {
         className="emotion-0 emotion-1"
       >
         <svg
-          aria-hidden="true"
+          aria-hidden={true}
           className="dashicon dashicons-wordpress"
-          focusable="false"
+          focusable={false}
           height={20}
           role="img"
           viewBox="0 0 20 20"
@@ -8301,8 +8301,8 @@ exports[`Storyshots Components/Tip Default 1`] = `
   className="components-tip"
 >
   <svg
-    aria-hidden="true"
-    focusable="false"
+    aria-hidden={true}
+    focusable={false}
     height="24"
     role="img"
     viewBox="0 0 24 24"
@@ -8344,9 +8344,9 @@ exports[`Storyshots Components/ToggleControl Default 1`] = `
         className="components-form-toggle__thumb"
       />
       <svg
-        aria-hidden="true"
+        aria-hidden={true}
         className="components-form-toggle__on"
-        focusable="false"
+        focusable={false}
         height="6"
         role="img"
         viewBox="0 0 2 6"
@@ -8393,9 +8393,9 @@ exports[`Storyshots Components/ToggleControl With Help Text 1`] = `
         className="components-form-toggle__thumb"
       />
       <svg
-        aria-hidden="true"
+        aria-hidden={true}
         className="components-form-toggle__on"
-        focusable="false"
+        focusable={false}
         height="6"
         role="img"
         viewBox="0 0 2 6"
@@ -8475,8 +8475,8 @@ exports[`Storyshots Components/Toolbar Default 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -8513,8 +8513,8 @@ exports[`Storyshots Components/Toolbar Default 1`] = `
         type="button"
       >
         <svg
-          aria-hidden="true"
-          focusable="false"
+          aria-hidden={true}
+          focusable={false}
           height={24}
           role="img"
           viewBox="0 0 24 24"
@@ -8561,8 +8561,8 @@ exports[`Storyshots Components/Toolbar Default 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -8590,8 +8590,8 @@ exports[`Storyshots Components/Toolbar Default 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -8619,8 +8619,8 @@ exports[`Storyshots Components/Toolbar Default 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -8675,8 +8675,8 @@ exports[`Storyshots Components/Toolbar Default 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -8720,8 +8720,8 @@ exports[`Storyshots Components/Toolbar Toolbars 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -8748,8 +8748,8 @@ exports[`Storyshots Components/Toolbar Toolbars 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -8775,8 +8775,8 @@ exports[`Storyshots Components/Toolbar Toolbars 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -8860,8 +8860,8 @@ exports[`Storyshots Components/Toolbar Toolbars 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -8897,8 +8897,8 @@ exports[`Storyshots Components/Toolbar Toolbars 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -8933,8 +8933,8 @@ exports[`Storyshots Components/Toolbar Toolbars 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -8984,8 +8984,8 @@ exports[`Storyshots Components/Toolbar Toolbars 1`] = `
           type="button"
         >
           <svg
-            aria-hidden="true"
-            focusable="false"
+            aria-hidden={true}
+            focusable={false}
             height={24}
             role="img"
             viewBox="0 0 24 24"
@@ -9055,8 +9055,8 @@ exports[`Storyshots Components/Toolbar Without Group 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -9084,8 +9084,8 @@ exports[`Storyshots Components/Toolbar Without Group 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -9113,8 +9113,8 @@ exports[`Storyshots Components/Toolbar Without Group 1`] = `
     type="button"
   >
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -9147,8 +9147,8 @@ exports[`Storyshots Components/ToolbarGroup Default 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -9174,8 +9174,8 @@ exports[`Storyshots Components/ToolbarGroup Default 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -9201,8 +9201,8 @@ exports[`Storyshots Components/ToolbarGroup Default 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -9238,8 +9238,8 @@ exports[`Storyshots Components/ToolbarGroup With Controls Prop 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -9267,8 +9267,8 @@ exports[`Storyshots Components/ToolbarGroup With Controls Prop 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -9296,8 +9296,8 @@ exports[`Storyshots Components/ToolbarGroup With Controls Prop 1`] = `
       type="button"
     >
       <svg
-        aria-hidden="true"
-        focusable="false"
+        aria-hidden={true}
+        focusable={false}
         height={24}
         role="img"
         viewBox="0 0 24 24"
@@ -9565,8 +9565,8 @@ Array [
       Dashicons (corrected viewport)
     </h2>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -9578,8 +9578,8 @@ Array [
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -9591,8 +9591,8 @@ Array [
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -9609,8 +9609,8 @@ Array [
       Material and Other
     </h2>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -9622,8 +9622,8 @@ Array [
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -9635,8 +9635,8 @@ Array [
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -9694,8 +9694,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       alignCenter
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -9707,8 +9707,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -9720,8 +9720,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -9751,8 +9751,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       alignJustify
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -9764,8 +9764,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -9777,8 +9777,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -9808,8 +9808,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       alignLeft
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -9821,8 +9821,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -9834,8 +9834,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -9865,8 +9865,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       alignRight
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -9878,8 +9878,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -9891,8 +9891,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -9922,8 +9922,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       archive
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -9935,8 +9935,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -9948,8 +9948,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -9979,8 +9979,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       arrowDown
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -9992,8 +9992,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10005,8 +10005,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10036,8 +10036,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       arrowLeft
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10049,8 +10049,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10062,8 +10062,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10093,8 +10093,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       arrowRight
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10106,8 +10106,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10119,8 +10119,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10150,8 +10150,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       arrowUp
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10163,8 +10163,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10176,8 +10176,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10207,8 +10207,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       audio
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -10220,8 +10220,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -10233,8 +10233,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -10264,8 +10264,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       backup
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10277,8 +10277,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10290,8 +10290,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10321,8 +10321,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       blockDefault
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -10334,8 +10334,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -10347,8 +10347,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -10378,8 +10378,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       blockTable
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -10391,8 +10391,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -10404,8 +10404,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -10435,8 +10435,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       brush
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10448,8 +10448,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10461,8 +10461,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10492,8 +10492,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       button
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -10505,8 +10505,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -10518,8 +10518,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -10549,8 +10549,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       calendar
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -10562,8 +10562,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -10575,8 +10575,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -10606,8 +10606,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       camera
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10619,8 +10619,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10632,8 +10632,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10663,8 +10663,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       capturePhoto
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -10676,8 +10676,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -10689,8 +10689,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -10720,8 +10720,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       captureVideo
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -10733,8 +10733,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -10746,8 +10746,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -10777,8 +10777,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       category
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -10790,8 +10790,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -10803,8 +10803,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -10834,8 +10834,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       chartLine
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10847,8 +10847,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10860,8 +10860,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -10891,8 +10891,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       check
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -10904,8 +10904,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -10917,8 +10917,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -10948,8 +10948,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       chevronDown
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -10961,8 +10961,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -10974,8 +10974,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11005,8 +11005,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       chevronLeft
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11018,8 +11018,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11031,8 +11031,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11062,8 +11062,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       chevronRight
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11075,8 +11075,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11088,8 +11088,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11119,8 +11119,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       chevronUp
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11132,8 +11132,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11145,8 +11145,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11176,8 +11176,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       classic
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11189,8 +11189,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11202,8 +11202,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11233,8 +11233,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       closeCircleFilled
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11246,8 +11246,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11259,8 +11259,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11290,8 +11290,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       close
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11303,8 +11303,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11316,8 +11316,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11347,8 +11347,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       cloudUpload
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11360,8 +11360,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11373,8 +11373,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11404,8 +11404,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       cloud
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11417,8 +11417,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11430,8 +11430,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11461,8 +11461,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       code
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11474,8 +11474,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11487,8 +11487,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11518,8 +11518,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       cog
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11531,8 +11531,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11544,8 +11544,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11575,8 +11575,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       column
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11588,8 +11588,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11601,8 +11601,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11632,8 +11632,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       columns
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11645,8 +11645,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11658,8 +11658,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11689,8 +11689,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       comment
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11702,8 +11702,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11715,8 +11715,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11746,8 +11746,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       controlsRepeat
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11759,8 +11759,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11772,8 +11772,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -11803,8 +11803,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       cover
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11816,8 +11816,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11829,8 +11829,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11860,8 +11860,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       create
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11873,8 +11873,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11886,8 +11886,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11917,8 +11917,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       desktop
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11930,8 +11930,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -11943,8 +11943,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -11974,8 +11974,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       external
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -11987,8 +11987,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12000,8 +12000,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12031,8 +12031,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       file
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12044,8 +12044,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12057,8 +12057,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12088,8 +12088,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       formatBold
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12101,8 +12101,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12114,8 +12114,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12145,8 +12145,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       formatIndent
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12158,8 +12158,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12171,8 +12171,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12202,8 +12202,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       formatItalic
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12215,8 +12215,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12228,8 +12228,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12259,8 +12259,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       formatListBullets
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12272,8 +12272,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12285,8 +12285,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12316,8 +12316,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       formatListNumbered
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12329,8 +12329,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12342,8 +12342,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12373,8 +12373,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       formatLtr
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12386,8 +12386,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12399,8 +12399,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12430,8 +12430,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       formatOutdent
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12443,8 +12443,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12456,8 +12456,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12487,8 +12487,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       formatRtl
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12500,8 +12500,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12513,8 +12513,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12544,8 +12544,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       formatStrikethrough
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12557,8 +12557,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12570,8 +12570,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12601,8 +12601,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       gallery
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12614,8 +12614,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12627,8 +12627,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12658,8 +12658,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       globe
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12671,8 +12671,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12684,8 +12684,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12715,8 +12715,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       grid
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12728,8 +12728,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12741,8 +12741,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12772,8 +12772,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       group
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12785,8 +12785,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12798,8 +12798,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12829,8 +12829,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       heading
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12842,8 +12842,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12855,8 +12855,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -12886,8 +12886,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       help
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12899,8 +12899,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12912,8 +12912,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -12943,8 +12943,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       html
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -12956,8 +12956,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -12969,8 +12969,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -13000,8 +13000,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       image
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -13013,8 +13013,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -13026,8 +13026,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -13057,8 +13057,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       info
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -13070,8 +13070,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -13083,8 +13083,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -13114,8 +13114,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       insertAfter
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13127,8 +13127,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13140,8 +13140,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13171,8 +13171,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       insertBefore
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13184,8 +13184,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13197,8 +13197,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13228,8 +13228,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       keyboardClose
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13241,8 +13241,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13254,8 +13254,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13285,8 +13285,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       keyboardReturn
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13298,8 +13298,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13311,8 +13311,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13342,8 +13342,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       layout
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13355,8 +13355,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13368,8 +13368,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13399,8 +13399,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       link
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -13412,8 +13412,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -13425,8 +13425,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -13456,8 +13456,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       linkOff
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -13469,8 +13469,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -13482,8 +13482,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -13513,8 +13513,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       list
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -13526,8 +13526,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -13539,8 +13539,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -13570,8 +13570,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       mapMarker
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -13583,8 +13583,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -13596,8 +13596,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -13627,8 +13627,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       media
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13640,8 +13640,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13653,8 +13653,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13684,8 +13684,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       mediaAndText
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -13697,8 +13697,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -13710,8 +13710,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -13741,8 +13741,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       menu
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13754,8 +13754,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13767,8 +13767,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13798,8 +13798,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       minus
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13811,8 +13811,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13824,8 +13824,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -13855,8 +13855,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       mobile
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -13868,8 +13868,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -13881,8 +13881,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -13912,8 +13912,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       more
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -13925,8 +13925,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -13938,8 +13938,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -13969,8 +13969,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       moreHorizontal
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -13982,8 +13982,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -13995,8 +13995,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -14026,8 +14026,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       moreVertical
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -14039,8 +14039,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -14052,8 +14052,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -14083,8 +14083,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       navigation
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -14096,8 +14096,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -14109,8 +14109,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -14140,8 +14140,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       pageBreak
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -14153,8 +14153,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -14166,8 +14166,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -14197,8 +14197,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       page
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14210,8 +14210,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14223,8 +14223,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14254,8 +14254,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       paragraph
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -14267,8 +14267,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -14280,8 +14280,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -14311,8 +14311,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       positionCenter
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -14324,8 +14324,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -14337,8 +14337,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -14368,8 +14368,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       positionLeft
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -14381,8 +14381,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -14394,8 +14394,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -14425,8 +14425,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       positionRight
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -14438,8 +14438,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -14451,8 +14451,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -14482,8 +14482,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       pencil
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14495,8 +14495,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14508,8 +14508,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14539,8 +14539,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       pin
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14552,8 +14552,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14565,8 +14565,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14596,8 +14596,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       plugins
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14609,8 +14609,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14622,8 +14622,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14653,8 +14653,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       plusCircleFilled
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -14666,8 +14666,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -14679,8 +14679,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -14710,8 +14710,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       plusCircle
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14723,8 +14723,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14736,8 +14736,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -14767,8 +14767,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       plus
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -14780,8 +14780,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -14793,8 +14793,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -14824,8 +14824,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       postList
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -14873,8 +14873,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -14922,8 +14922,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -14989,8 +14989,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       preformatted
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15002,8 +15002,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15015,8 +15015,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15046,8 +15046,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       pullLeft
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15059,8 +15059,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15072,8 +15072,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15103,8 +15103,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       pullRight
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15116,8 +15116,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15129,8 +15129,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15160,8 +15160,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       pullquote
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15173,8 +15173,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15186,8 +15186,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15217,8 +15217,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       quote
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15230,8 +15230,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15243,8 +15243,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15274,8 +15274,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       redo
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15287,8 +15287,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15300,8 +15300,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15331,8 +15331,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       replace
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15344,8 +15344,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15357,8 +15357,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15388,8 +15388,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       resizeCornerNE
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15401,8 +15401,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15414,8 +15414,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15445,8 +15445,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       rss
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15458,8 +15458,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15471,8 +15471,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15502,8 +15502,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       search
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15515,8 +15515,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15528,8 +15528,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15559,8 +15559,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       separator
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15572,8 +15572,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15585,8 +15585,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15616,8 +15616,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       share
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15629,8 +15629,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15642,8 +15642,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15673,8 +15673,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       shortcode
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15686,8 +15686,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15699,8 +15699,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15730,8 +15730,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       starEmpty
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -15743,8 +15743,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -15756,8 +15756,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -15787,8 +15787,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       starFilled
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -15800,8 +15800,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -15813,8 +15813,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -15844,8 +15844,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       starHalf
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -15857,8 +15857,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -15870,8 +15870,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -15901,8 +15901,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       stretchFullWidth
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15914,8 +15914,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15927,8 +15927,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -15958,8 +15958,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       stretchWide
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -15971,8 +15971,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -15984,8 +15984,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -16015,8 +16015,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       tableColumnAfter
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16028,8 +16028,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16041,8 +16041,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16072,8 +16072,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       tableColumnBefore
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16085,8 +16085,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16098,8 +16098,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16129,8 +16129,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       tableColumnDelete
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16142,8 +16142,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16155,8 +16155,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16186,8 +16186,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       tableRowAfter
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16199,8 +16199,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16212,8 +16212,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16243,8 +16243,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       tableRowBefore
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16256,8 +16256,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16269,8 +16269,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16300,8 +16300,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       tableRowDelete
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16313,8 +16313,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16326,8 +16326,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16357,8 +16357,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       table
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -16370,8 +16370,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -16383,8 +16383,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -16414,8 +16414,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       tag
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -16427,8 +16427,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -16440,8 +16440,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -16471,8 +16471,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       textColor
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16484,8 +16484,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16497,8 +16497,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16528,8 +16528,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       tablet
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -16541,8 +16541,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -16554,8 +16554,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -16585,8 +16585,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       title
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -16598,8 +16598,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -16611,8 +16611,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -16642,8 +16642,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       trash
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16655,8 +16655,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16668,8 +16668,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16699,8 +16699,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       typography
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -16712,8 +16712,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -16725,8 +16725,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -16756,8 +16756,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       undo
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -16769,8 +16769,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -16782,8 +16782,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -16813,8 +16813,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       update
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16826,8 +16826,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16839,8 +16839,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
@@ -16870,8 +16870,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       upload
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -16883,8 +16883,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -16896,8 +16896,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -16927,8 +16927,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       verse
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -16940,8 +16940,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -16953,8 +16953,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -16984,8 +16984,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       video
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -16997,8 +16997,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -17010,8 +17010,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -17041,8 +17041,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       widget
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="0 0 24 24"
@@ -17054,8 +17054,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="0 0 24 24"
@@ -17067,8 +17067,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="0 0 24 24"
@@ -17098,8 +17098,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       wordpress
     </strong>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={24}
       role="img"
       viewBox="-2 -2 24 24"
@@ -17111,8 +17111,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={36}
       role="img"
       viewBox="-2 -2 24 24"
@@ -17124,8 +17124,8 @@ exports[`Storyshots Icons/Icon Library 1`] = `
       />
     </svg>
     <svg
-      aria-hidden="true"
-      focusable="false"
+      aria-hidden={true}
+      focusable={false}
       height={48}
       role="img"
       viewBox="-2 -2 24 24"
diff --git a/tsconfig.json b/tsconfig.json
index cabb422ec5e5ef..a180d9150813b2 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -12,6 +12,7 @@
 		{ "path": "packages/i18n" },
 		{ "path": "packages/is-shallow-equal" },
 		{ "path": "packages/prettier-config" },
+		{ "path": "packages/primitives" },
 		{ "path": "packages/priority-queue" },
 		{ "path": "packages/project-management-automation" },
 		{ "path": "packages/token-list" },