@vector-im/compound-design-tokens 1.6.0 → 1.7.0

package/assets/web/icons/admin.cjs

@@ -1,11 +1,13 @@
 var _reactJsxRuntime = require("react/jsx-runtime");
-function AdminIcon(props) {
+var React = require("react");
+function AdminIcon(props, ref) {
   return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
       fillRule: "evenodd",
@@ -16,4 +18,4 @@ function AdminIcon(props) {
 }
 ;
 AdminIcon.displayName = "AdminIcon";
-module.exports = AdminIcon;
+module.exports = React.forwardRef(AdminIcon);

package/assets/web/icons/admin.d.ts

@@ -1,10 +1,11 @@
-import * as React from "react";
+import React from "react";
 
 /**
  * admin.svg
  */
-declare const AdminIcon: React.FunctionComponent<
-    React.ComponentProps<"svg">
+declare const AdminIcon: React.ForwardRefExoticComponent<
+    Omit<React.SVGProps<SVGSVGElement>, "ref" | "children"> &
+    React.RefAttributes<SVGSVGElement>
 >;
 
 export default AdminIcon;

package/assets/web/icons/admin.js

@@ -1,11 +1,13 @@
+import { forwardRef } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
-function AdminIcon(props) {
+function AdminIcon(props, ref) {
   return /*#__PURE__*/_jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_jsx("path", {
       fillRule: "evenodd",
@@ -16,4 +18,4 @@ function AdminIcon(props) {
 }
 ;
 AdminIcon.displayName = "AdminIcon";
-export default AdminIcon;
+export default forwardRef(AdminIcon);

package/assets/web/icons/arrow-down.cjs

@@ -1,11 +1,13 @@
 var _reactJsxRuntime = require("react/jsx-runtime");
-function ArrowDownIcon(props) {
+var React = require("react");
+function ArrowDownIcon(props, ref) {
   return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
       d: "M12 4.5a1 1 0 0 1 1 1v10.586l4.293-4.293a1 1 0 0 1 1.414 1.414l-6 6a1 1 0 0 1-1.414 0l-6-6a1 1 0 1 1 1.414-1.414L11 16.086V5.5a1 1 0 0 1 1-1Z"
@@ -14,4 +16,4 @@ function ArrowDownIcon(props) {
 }
 ;
 ArrowDownIcon.displayName = "ArrowDownIcon";
-module.exports = ArrowDownIcon;
+module.exports = React.forwardRef(ArrowDownIcon);

package/assets/web/icons/arrow-down.d.ts

@@ -1,10 +1,11 @@
-import * as React from "react";
+import React from "react";
 
 /**
  * arrow-down.svg
  */
-declare const ArrowDownIcon: React.FunctionComponent<
-    React.ComponentProps<"svg">
+declare const ArrowDownIcon: React.ForwardRefExoticComponent<
+    Omit<React.SVGProps<SVGSVGElement>, "ref" | "children"> &
+    React.RefAttributes<SVGSVGElement>
 >;
 
 export default ArrowDownIcon;

package/assets/web/icons/arrow-down.js

@@ -1,11 +1,13 @@
+import { forwardRef } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
-function ArrowDownIcon(props) {
+function ArrowDownIcon(props, ref) {
   return /*#__PURE__*/_jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_jsx("path", {
       d: "M12 4.5a1 1 0 0 1 1 1v10.586l4.293-4.293a1 1 0 0 1 1.414 1.414l-6 6a1 1 0 0 1-1.414 0l-6-6a1 1 0 1 1 1.414-1.414L11 16.086V5.5a1 1 0 0 1 1-1Z"
@@ -14,4 +16,4 @@ function ArrowDownIcon(props) {
 }
 ;
 ArrowDownIcon.displayName = "ArrowDownIcon";
-export default ArrowDownIcon;
+export default forwardRef(ArrowDownIcon);

package/assets/web/icons/arrow-left.cjs

@@ -1,11 +1,13 @@
 var _reactJsxRuntime = require("react/jsx-runtime");
-function ArrowLeftIcon(props) {
+var React = require("react");
+function ArrowLeftIcon(props, ref) {
   return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
       d: "M12.207 5.293a1 1 0 0 1 0 1.414L7.914 11H18.5a1 1 0 1 1 0 2H7.914l4.293 4.293a1 1 0 0 1-1.414 1.414l-6-6a1 1 0 0 1 0-1.414l6-6a1 1 0 0 1 1.414 0Z"
@@ -14,4 +16,4 @@ function ArrowLeftIcon(props) {
 }
 ;
 ArrowLeftIcon.displayName = "ArrowLeftIcon";
-module.exports = ArrowLeftIcon;
+module.exports = React.forwardRef(ArrowLeftIcon);

package/assets/web/icons/arrow-left.d.ts

@@ -1,10 +1,11 @@
-import * as React from "react";
+import React from "react";
 
 /**
  * arrow-left.svg
  */
-declare const ArrowLeftIcon: React.FunctionComponent<
-    React.ComponentProps<"svg">
+declare const ArrowLeftIcon: React.ForwardRefExoticComponent<
+    Omit<React.SVGProps<SVGSVGElement>, "ref" | "children"> &
+    React.RefAttributes<SVGSVGElement>
 >;
 
 export default ArrowLeftIcon;

package/assets/web/icons/arrow-left.js

@@ -1,11 +1,13 @@
+import { forwardRef } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
-function ArrowLeftIcon(props) {
+function ArrowLeftIcon(props, ref) {
   return /*#__PURE__*/_jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_jsx("path", {
       d: "M12.207 5.293a1 1 0 0 1 0 1.414L7.914 11H18.5a1 1 0 1 1 0 2H7.914l4.293 4.293a1 1 0 0 1-1.414 1.414l-6-6a1 1 0 0 1 0-1.414l6-6a1 1 0 0 1 1.414 0Z"
@@ -14,4 +16,4 @@ function ArrowLeftIcon(props) {
 }
 ;
 ArrowLeftIcon.displayName = "ArrowLeftIcon";
-export default ArrowLeftIcon;
+export default forwardRef(ArrowLeftIcon);

package/assets/web/icons/arrow-right.cjs

@@ -1,11 +1,13 @@
 var _reactJsxRuntime = require("react/jsx-runtime");
-function ArrowRightIcon(props) {
+var React = require("react");
+function ArrowRightIcon(props, ref) {
   return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
       d: "M11.793 5.293a1 1 0 0 1 1.414 0l6 6a1 1 0 0 1 0 1.414l-6 6a1 1 0 0 1-1.414-1.414L16.086 13H5.5a1 1 0 1 1 0-2h10.586l-4.293-4.293a1 1 0 0 1 0-1.414Z"
@@ -14,4 +16,4 @@ function ArrowRightIcon(props) {
 }
 ;
 ArrowRightIcon.displayName = "ArrowRightIcon";
-module.exports = ArrowRightIcon;
+module.exports = React.forwardRef(ArrowRightIcon);

package/assets/web/icons/arrow-right.d.ts

@@ -1,10 +1,11 @@
-import * as React from "react";
+import React from "react";
 
 /**
  * arrow-right.svg
  */
-declare const ArrowRightIcon: React.FunctionComponent<
-    React.ComponentProps<"svg">
+declare const ArrowRightIcon: React.ForwardRefExoticComponent<
+    Omit<React.SVGProps<SVGSVGElement>, "ref" | "children"> &
+    React.RefAttributes<SVGSVGElement>
 >;
 
 export default ArrowRightIcon;

package/assets/web/icons/arrow-right.js

@@ -1,11 +1,13 @@
+import { forwardRef } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
-function ArrowRightIcon(props) {
+function ArrowRightIcon(props, ref) {
   return /*#__PURE__*/_jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_jsx("path", {
       d: "M11.793 5.293a1 1 0 0 1 1.414 0l6 6a1 1 0 0 1 0 1.414l-6 6a1 1 0 0 1-1.414-1.414L16.086 13H5.5a1 1 0 1 1 0-2h10.586l-4.293-4.293a1 1 0 0 1 0-1.414Z"
@@ -14,4 +16,4 @@ function ArrowRightIcon(props) {
 }
 ;
 ArrowRightIcon.displayName = "ArrowRightIcon";
-export default ArrowRightIcon;
+export default forwardRef(ArrowRightIcon);

package/assets/web/icons/arrow-up-right.cjs

@@ -1,11 +1,13 @@
 var _reactJsxRuntime = require("react/jsx-runtime");
-function ArrowUpRightIcon(props) {
+var React = require("react");
+function ArrowUpRightIcon(props, ref) {
   return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
       d: "M17.924 6.617a.996.996 0 0 1 .076.38V15a1 1 0 1 1-2 0V9.414l-8.293 8.293a1 1 0 0 1-1.414-1.414L14.586 8H9a1 1 0 0 1 0-2h8a.997.997 0 0 1 .924.617Z"
@@ -14,4 +16,4 @@ function ArrowUpRightIcon(props) {
 }
 ;
 ArrowUpRightIcon.displayName = "ArrowUpRightIcon";
-module.exports = ArrowUpRightIcon;
+module.exports = React.forwardRef(ArrowUpRightIcon);

package/assets/web/icons/arrow-up-right.d.ts

@@ -1,10 +1,11 @@
-import * as React from "react";
+import React from "react";
 
 /**
  * arrow-up-right.svg
  */
-declare const ArrowUpRightIcon: React.FunctionComponent<
-    React.ComponentProps<"svg">
+declare const ArrowUpRightIcon: React.ForwardRefExoticComponent<
+    Omit<React.SVGProps<SVGSVGElement>, "ref" | "children"> &
+    React.RefAttributes<SVGSVGElement>
 >;
 
 export default ArrowUpRightIcon;

package/assets/web/icons/arrow-up-right.js

@@ -1,11 +1,13 @@
+import { forwardRef } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
-function ArrowUpRightIcon(props) {
+function ArrowUpRightIcon(props, ref) {
   return /*#__PURE__*/_jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_jsx("path", {
       d: "M17.924 6.617a.996.996 0 0 1 .076.38V15a1 1 0 1 1-2 0V9.414l-8.293 8.293a1 1 0 0 1-1.414-1.414L14.586 8H9a1 1 0 0 1 0-2h8a.997.997 0 0 1 .924.617Z"
@@ -14,4 +16,4 @@ function ArrowUpRightIcon(props) {
 }
 ;
 ArrowUpRightIcon.displayName = "ArrowUpRightIcon";
-export default ArrowUpRightIcon;
+export default forwardRef(ArrowUpRightIcon);

package/assets/web/icons/arrow-up.cjs

@@ -1,11 +1,13 @@
 var _reactJsxRuntime = require("react/jsx-runtime");
-function ArrowUpIcon(props) {
+var React = require("react");
+function ArrowUpIcon(props, ref) {
   return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
       d: "M12 19.5a1 1 0 0 0 1-1V7.914l4.293 4.293a1 1 0 0 0 1.414-1.414l-6-6a1 1 0 0 0-1.414 0l-6 6a1 1 0 1 0 1.414 1.414L11 7.914V18.5a1 1 0 0 0 1 1Z"
@@ -14,4 +16,4 @@ function ArrowUpIcon(props) {
 }
 ;
 ArrowUpIcon.displayName = "ArrowUpIcon";
-module.exports = ArrowUpIcon;
+module.exports = React.forwardRef(ArrowUpIcon);

package/assets/web/icons/arrow-up.d.ts

@@ -1,10 +1,11 @@
-import * as React from "react";
+import React from "react";
 
 /**
  * arrow-up.svg
  */
-declare const ArrowUpIcon: React.FunctionComponent<
-    React.ComponentProps<"svg">
+declare const ArrowUpIcon: React.ForwardRefExoticComponent<
+    Omit<React.SVGProps<SVGSVGElement>, "ref" | "children"> &
+    React.RefAttributes<SVGSVGElement>
 >;
 
 export default ArrowUpIcon;

package/assets/web/icons/arrow-up.js

@@ -1,11 +1,13 @@
+import { forwardRef } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
-function ArrowUpIcon(props) {
+function ArrowUpIcon(props, ref) {
   return /*#__PURE__*/_jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_jsx("path", {
       d: "M12 19.5a1 1 0 0 0 1-1V7.914l4.293 4.293a1 1 0 0 0 1.414-1.414l-6-6a1 1 0 0 0-1.414 0l-6 6a1 1 0 1 0 1.414 1.414L11 7.914V18.5a1 1 0 0 0 1 1Z"
@@ -14,4 +16,4 @@ function ArrowUpIcon(props) {
 }
 ;
 ArrowUpIcon.displayName = "ArrowUpIcon";
-export default ArrowUpIcon;
+export default forwardRef(ArrowUpIcon);

package/assets/web/icons/attachment.cjs

@@ -1,11 +1,13 @@
 var _reactJsxRuntime = require("react/jsx-runtime");
-function AttachmentIcon(props) {
+var React = require("react");
+function AttachmentIcon(props, ref) {
   return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
       d: "M11.5 22c-1.533 0-2.833-.533-3.9-1.6C6.533 19.333 6 18.033 6 16.5V6c0-1.1.392-2.042 1.175-2.825C7.958 2.392 8.9 2 10 2s2.042.392 2.825 1.175C13.608 3.958 14 4.9 14 6v9.5c0 .7-.242 1.292-.725 1.775-.483.483-1.075.725-1.775.725s-1.292-.242-1.775-.725C9.242 16.792 9 16.2 9 15.5V6.75A.728.728 0 0 1 9.75 6a.729.729 0 0 1 .75.75v8.75c0 .283.096.52.287.712.192.192.43.288.713.288s.52-.096.713-.288a.968.968 0 0 0 .287-.712V6c0-.7-.242-1.292-.725-1.775C11.292 3.742 10.7 3.5 10 3.5s-1.292.242-1.775.725C7.742 4.708 7.5 5.3 7.5 6v10.5c0 1.1.392 2.042 1.175 2.825.783.783 1.725 1.175 2.825 1.175s2.042-.392 2.825-1.175c.783-.783 1.175-1.725 1.175-2.825V6.75a.728.728 0 0 1 .75-.75.728.728 0 0 1 .75.75v9.75c0 1.533-.533 2.833-1.6 3.9-1.067 1.067-2.367 1.6-3.9 1.6Z"
@@ -14,4 +16,4 @@ function AttachmentIcon(props) {
 }
 ;
 AttachmentIcon.displayName = "AttachmentIcon";
-module.exports = AttachmentIcon;
+module.exports = React.forwardRef(AttachmentIcon);

package/assets/web/icons/attachment.d.ts

@@ -1,10 +1,11 @@
-import * as React from "react";
+import React from "react";
 
 /**
  * attachment.svg
  */
-declare const AttachmentIcon: React.FunctionComponent<
-    React.ComponentProps<"svg">
+declare const AttachmentIcon: React.ForwardRefExoticComponent<
+    Omit<React.SVGProps<SVGSVGElement>, "ref" | "children"> &
+    React.RefAttributes<SVGSVGElement>
 >;
 
 export default AttachmentIcon;

package/assets/web/icons/attachment.js

@@ -1,11 +1,13 @@
+import { forwardRef } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
-function AttachmentIcon(props) {
+function AttachmentIcon(props, ref) {
   return /*#__PURE__*/_jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_jsx("path", {
       d: "M11.5 22c-1.533 0-2.833-.533-3.9-1.6C6.533 19.333 6 18.033 6 16.5V6c0-1.1.392-2.042 1.175-2.825C7.958 2.392 8.9 2 10 2s2.042.392 2.825 1.175C13.608 3.958 14 4.9 14 6v9.5c0 .7-.242 1.292-.725 1.775-.483.483-1.075.725-1.775.725s-1.292-.242-1.775-.725C9.242 16.792 9 16.2 9 15.5V6.75A.728.728 0 0 1 9.75 6a.729.729 0 0 1 .75.75v8.75c0 .283.096.52.287.712.192.192.43.288.713.288s.52-.096.713-.288a.968.968 0 0 0 .287-.712V6c0-.7-.242-1.292-.725-1.775C11.292 3.742 10.7 3.5 10 3.5s-1.292.242-1.775.725C7.742 4.708 7.5 5.3 7.5 6v10.5c0 1.1.392 2.042 1.175 2.825.783.783 1.725 1.175 2.825 1.175s2.042-.392 2.825-1.175c.783-.783 1.175-1.725 1.175-2.825V6.75a.728.728 0 0 1 .75-.75.728.728 0 0 1 .75.75v9.75c0 1.533-.533 2.833-1.6 3.9-1.067 1.067-2.367 1.6-3.9 1.6Z"
@@ -14,4 +16,4 @@ function AttachmentIcon(props) {
 }
 ;
 AttachmentIcon.displayName = "AttachmentIcon";
-export default AttachmentIcon;
+export default forwardRef(AttachmentIcon);

package/assets/web/icons/block.cjs

@@ -1,11 +1,13 @@
 var _reactJsxRuntime = require("react/jsx-runtime");
-function BlockIcon(props) {
+var React = require("react");
+function BlockIcon(props, ref) {
   return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
       d: "M12 22a9.738 9.738 0 0 1-3.9-.788 10.099 10.099 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.738 9.738 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.099 10.099 0 0 1 2.137-3.175c.9-.9 1.958-1.612 3.175-2.137A9.738 9.738 0 0 1 12 2a9.74 9.74 0 0 1 3.9.788 10.098 10.098 0 0 1 3.175 2.137c.9.9 1.613 1.958 2.137 3.175A9.738 9.738 0 0 1 22 12a9.738 9.738 0 0 1-.788 3.9 10.098 10.098 0 0 1-2.137 3.175c-.9.9-1.958 1.613-3.175 2.137A9.738 9.738 0 0 1 12 22Zm0-2c2.233 0 4.125-.775 5.675-2.325C19.225 16.125 20 14.233 20 12c0-.9-.146-1.767-.438-2.6A7.951 7.951 0 0 0 18.3 7.1L7.1 18.3c.7.55 1.467.97 2.3 1.262.833.292 1.7.438 2.6.438Zm-6.3-3.1L16.9 5.7a7.95 7.95 0 0 0-2.3-1.263A7.813 7.813 0 0 0 12 4c-2.233 0-4.125.775-5.675 2.325C4.775 7.875 4 9.767 4 12c0 .9.146 1.767.438 2.6A7.95 7.95 0 0 0 5.7 16.9Z"
@@ -14,4 +16,4 @@ function BlockIcon(props) {
 }
 ;
 BlockIcon.displayName = "BlockIcon";
-module.exports = BlockIcon;
+module.exports = React.forwardRef(BlockIcon);

package/assets/web/icons/block.d.ts

@@ -1,10 +1,11 @@
-import * as React from "react";
+import React from "react";
 
 /**
  * block.svg
  */
-declare const BlockIcon: React.FunctionComponent<
-    React.ComponentProps<"svg">
+declare const BlockIcon: React.ForwardRefExoticComponent<
+    Omit<React.SVGProps<SVGSVGElement>, "ref" | "children"> &
+    React.RefAttributes<SVGSVGElement>
 >;
 
 export default BlockIcon;

package/assets/web/icons/block.js

@@ -1,11 +1,13 @@
+import { forwardRef } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
-function BlockIcon(props) {
+function BlockIcon(props, ref) {
   return /*#__PURE__*/_jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_jsx("path", {
       d: "M12 22a9.738 9.738 0 0 1-3.9-.788 10.099 10.099 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.738 9.738 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.099 10.099 0 0 1 2.137-3.175c.9-.9 1.958-1.612 3.175-2.137A9.738 9.738 0 0 1 12 2a9.74 9.74 0 0 1 3.9.788 10.098 10.098 0 0 1 3.175 2.137c.9.9 1.613 1.958 2.137 3.175A9.738 9.738 0 0 1 22 12a9.738 9.738 0 0 1-.788 3.9 10.098 10.098 0 0 1-2.137 3.175c-.9.9-1.958 1.613-3.175 2.137A9.738 9.738 0 0 1 12 22Zm0-2c2.233 0 4.125-.775 5.675-2.325C19.225 16.125 20 14.233 20 12c0-.9-.146-1.767-.438-2.6A7.951 7.951 0 0 0 18.3 7.1L7.1 18.3c.7.55 1.467.97 2.3 1.262.833.292 1.7.438 2.6.438Zm-6.3-3.1L16.9 5.7a7.95 7.95 0 0 0-2.3-1.263A7.813 7.813 0 0 0 12 4c-2.233 0-4.125.775-5.675 2.325C4.775 7.875 4 9.767 4 12c0 .9.146 1.767.438 2.6A7.95 7.95 0 0 0 5.7 16.9Z"
@@ -14,4 +16,4 @@ function BlockIcon(props) {
 }
 ;
 BlockIcon.displayName = "BlockIcon";
-export default BlockIcon;
+export default forwardRef(BlockIcon);

package/assets/web/icons/bold.cjs

@@ -1,17 +1,19 @@
 var _reactJsxRuntime = require("react/jsx-runtime");
-function BoldIcon(props) {
+var React = require("react");
+function BoldIcon(props, ref) {
   return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
-      d: "M8.8 19c-.55 0-1.02-.196-1.412-.587A1.926 1.926 0 0 1 6.8 17V7c0-.55.196-1.02.588-1.412A1.926 1.926 0 0 1 8.8 5h3.525c1.083 0 2.083.333 3 1 .917.667 1.375 1.592 1.375 2.775 0 .85-.192 1.504-.575 1.963-.383.458-.742.787-1.075.987.417.183.88.525 1.387 1.025.509.5.763 1.25.763 2.25 0 1.483-.542 2.52-1.625 3.113-1.083.591-2.1.887-3.05.887H8.8Zm1.025-2.8h2.6c.8 0 1.287-.204 1.462-.612.175-.409.263-.705.263-.888 0-.183-.088-.48-.263-.887-.175-.409-.687-.613-1.537-.613H9.825v3Zm0-5.7h2.325c.55 0 .95-.142 1.2-.425a1.4 1.4 0 0 0 .375-.95c0-.4-.142-.725-.425-.975-.283-.25-.65-.375-1.1-.375H9.825V10.5Z"
+      d: "M8.8 19c-.55 0-1.02-.196-1.413-.587A1.926 1.926 0 0 1 6.8 17V7c0-.55.196-1.02.588-1.412A1.926 1.926 0 0 1 8.8 5h3.525c1.083 0 2.083.333 3 1 .917.667 1.375 1.592 1.375 2.775 0 .85-.192 1.504-.575 1.963-.383.458-.742.787-1.075.987.417.183.88.525 1.387 1.025.509.5.763 1.25.763 2.25 0 1.483-.542 2.52-1.625 3.113-1.083.591-2.1.887-3.05.887H8.8Zm1.025-2.8h2.6c.8 0 1.287-.204 1.462-.612.175-.409.263-.705.263-.888 0-.183-.088-.48-.263-.887-.175-.409-.687-.613-1.537-.613H9.825v3Zm0-5.7h2.325c.55 0 .95-.142 1.2-.425a1.4 1.4 0 0 0 .375-.95c0-.4-.142-.725-.425-.975-.283-.25-.65-.375-1.1-.375H9.825V10.5Z"
     })
   });
 }
 ;
 BoldIcon.displayName = "BoldIcon";
-module.exports = BoldIcon;
+module.exports = React.forwardRef(BoldIcon);

package/assets/web/icons/bold.d.ts

@@ -1,10 +1,11 @@
-import * as React from "react";
+import React from "react";
 
 /**
  * bold.svg
  */
-declare const BoldIcon: React.FunctionComponent<
-    React.ComponentProps<"svg">
+declare const BoldIcon: React.ForwardRefExoticComponent<
+    Omit<React.SVGProps<SVGSVGElement>, "ref" | "children"> &
+    React.RefAttributes<SVGSVGElement>
 >;
 
 export default BoldIcon;

package/assets/web/icons/bold.js

@@ -1,17 +1,19 @@
+import { forwardRef } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
-function BoldIcon(props) {
+function BoldIcon(props, ref) {
   return /*#__PURE__*/_jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_jsx("path", {
-      d: "M8.8 19c-.55 0-1.02-.196-1.412-.587A1.926 1.926 0 0 1 6.8 17V7c0-.55.196-1.02.588-1.412A1.926 1.926 0 0 1 8.8 5h3.525c1.083 0 2.083.333 3 1 .917.667 1.375 1.592 1.375 2.775 0 .85-.192 1.504-.575 1.963-.383.458-.742.787-1.075.987.417.183.88.525 1.387 1.025.509.5.763 1.25.763 2.25 0 1.483-.542 2.52-1.625 3.113-1.083.591-2.1.887-3.05.887H8.8Zm1.025-2.8h2.6c.8 0 1.287-.204 1.462-.612.175-.409.263-.705.263-.888 0-.183-.088-.48-.263-.887-.175-.409-.687-.613-1.537-.613H9.825v3Zm0-5.7h2.325c.55 0 .95-.142 1.2-.425a1.4 1.4 0 0 0 .375-.95c0-.4-.142-.725-.425-.975-.283-.25-.65-.375-1.1-.375H9.825V10.5Z"
+      d: "M8.8 19c-.55 0-1.02-.196-1.413-.587A1.926 1.926 0 0 1 6.8 17V7c0-.55.196-1.02.588-1.412A1.926 1.926 0 0 1 8.8 5h3.525c1.083 0 2.083.333 3 1 .917.667 1.375 1.592 1.375 2.775 0 .85-.192 1.504-.575 1.963-.383.458-.742.787-1.075.987.417.183.88.525 1.387 1.025.509.5.763 1.25.763 2.25 0 1.483-.542 2.52-1.625 3.113-1.083.591-2.1.887-3.05.887H8.8Zm1.025-2.8h2.6c.8 0 1.287-.204 1.462-.612.175-.409.263-.705.263-.888 0-.183-.088-.48-.263-.887-.175-.409-.687-.613-1.537-.613H9.825v3Zm0-5.7h2.325c.55 0 .95-.142 1.2-.425a1.4 1.4 0 0 0 .375-.95c0-.4-.142-.725-.425-.975-.283-.25-.65-.375-1.1-.375H9.825V10.5Z"
     })
   });
 }
 ;
 BoldIcon.displayName = "BoldIcon";
-export default BoldIcon;
+export default forwardRef(BoldIcon);

package/assets/web/icons/calendar.cjs

@@ -0,0 +1,19 @@
+var _reactJsxRuntime = require("react/jsx-runtime");
+var React = require("react");
+function CalendarIcon(props, ref) {
+  return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "currentColor",
+    viewBox: "0 0 24 24",
+    ref: ref,
+    ...props,
+    children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
+      d: "M5 22c-.55 0-1.02-.196-1.413-.587A1.926 1.926 0 0 1 3 20V6c0-.55.196-1.02.587-1.412A1.926 1.926 0 0 1 5 4h1V2h2v2h8V2h2v2h1c.55 0 1.02.196 1.413.588.391.391.587.862.587 1.412v14c0 .55-.196 1.02-.587 1.413A1.926 1.926 0 0 1 19 22H5Zm0-2h14V10H5v10ZM5 8h14V6H5v2Zm7 6a.968.968 0 0 1-.713-.287A.968.968 0 0 1 11 13c0-.283.096-.52.287-.713A.968.968 0 0 1 12 12c.283 0 .52.096.713.287.191.192.287.43.287.713s-.096.52-.287.713A.968.968 0 0 1 12 14Zm-4 0a.967.967 0 0 1-.713-.287A.968.968 0 0 1 7 13c0-.283.096-.52.287-.713A.967.967 0 0 1 8 12c.283 0 .52.096.713.287.191.192.287.43.287.713s-.096.52-.287.713A.967.967 0 0 1 8 14Zm8 0a.968.968 0 0 1-.713-.287A.968.968 0 0 1 15 13c0-.283.096-.52.287-.713A.968.968 0 0 1 16 12a.97.97 0 0 1 .712.287c.192.192.288.43.288.713s-.096.52-.288.713A.968.968 0 0 1 16 14Zm-4 4a.968.968 0 0 1-.713-.288A.968.968 0 0 1 11 17a.97.97 0 0 1 .287-.712A.968.968 0 0 1 12 16a.97.97 0 0 1 .713.288c.191.191.287.429.287.712s-.096.52-.287.712A.968.968 0 0 1 12 18Zm-4 0a.967.967 0 0 1-.713-.288A.968.968 0 0 1 7 17a.97.97 0 0 1 .287-.712A.967.967 0 0 1 8 16a.97.97 0 0 1 .713.288c.191.191.287.429.287.712s-.096.52-.287.712A.967.967 0 0 1 8 18Zm8 0a.968.968 0 0 1-.713-.288A.968.968 0 0 1 15 17a.97.97 0 0 1 .287-.712A.968.968 0 0 1 16 16c.283 0 .52.096.712.288.192.191.288.429.288.712s-.096.52-.288.712A.968.968 0 0 1 16 18Z"
+    })
+  });
+}
+;
+CalendarIcon.displayName = "CalendarIcon";
+module.exports = React.forwardRef(CalendarIcon);

package/assets/web/icons/calendar.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+
+/**
+ * calendar.svg
+ */
+declare const CalendarIcon: React.ForwardRefExoticComponent<
+    Omit<React.SVGProps<SVGSVGElement>, "ref" | "children"> &
+    React.RefAttributes<SVGSVGElement>
+>;
+
+export default CalendarIcon;

package/assets/web/icons/calendar.js

@@ -0,0 +1,19 @@
+import { forwardRef } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+function CalendarIcon(props, ref) {
+  return /*#__PURE__*/_jsx("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "1em",
+    height: "1em",
+    fill: "currentColor",
+    viewBox: "0 0 24 24",
+    ref: ref,
+    ...props,
+    children: /*#__PURE__*/_jsx("path", {
+      d: "M5 22c-.55 0-1.02-.196-1.413-.587A1.926 1.926 0 0 1 3 20V6c0-.55.196-1.02.587-1.412A1.926 1.926 0 0 1 5 4h1V2h2v2h8V2h2v2h1c.55 0 1.02.196 1.413.588.391.391.587.862.587 1.412v14c0 .55-.196 1.02-.587 1.413A1.926 1.926 0 0 1 19 22H5Zm0-2h14V10H5v10ZM5 8h14V6H5v2Zm7 6a.968.968 0 0 1-.713-.287A.968.968 0 0 1 11 13c0-.283.096-.52.287-.713A.968.968 0 0 1 12 12c.283 0 .52.096.713.287.191.192.287.43.287.713s-.096.52-.287.713A.968.968 0 0 1 12 14Zm-4 0a.967.967 0 0 1-.713-.287A.968.968 0 0 1 7 13c0-.283.096-.52.287-.713A.967.967 0 0 1 8 12c.283 0 .52.096.713.287.191.192.287.43.287.713s-.096.52-.287.713A.967.967 0 0 1 8 14Zm8 0a.968.968 0 0 1-.713-.287A.968.968 0 0 1 15 13c0-.283.096-.52.287-.713A.968.968 0 0 1 16 12a.97.97 0 0 1 .712.287c.192.192.288.43.288.713s-.096.52-.288.713A.968.968 0 0 1 16 14Zm-4 4a.968.968 0 0 1-.713-.288A.968.968 0 0 1 11 17a.97.97 0 0 1 .287-.712A.968.968 0 0 1 12 16a.97.97 0 0 1 .713.288c.191.191.287.429.287.712s-.096.52-.287.712A.968.968 0 0 1 12 18Zm-4 0a.967.967 0 0 1-.713-.288A.968.968 0 0 1 7 17a.97.97 0 0 1 .287-.712A.967.967 0 0 1 8 16a.97.97 0 0 1 .713.288c.191.191.287.429.287.712s-.096.52-.287.712A.967.967 0 0 1 8 18Zm8 0a.968.968 0 0 1-.713-.288A.968.968 0 0 1 15 17a.97.97 0 0 1 .287-.712A.968.968 0 0 1 16 16c.283 0 .52.096.712.288.192.191.288.429.288.712s-.096.52-.288.712A.968.968 0 0 1 16 18Z"
+    })
+  });
+}
+;
+CalendarIcon.displayName = "CalendarIcon";
+export default forwardRef(CalendarIcon);

package/assets/web/icons/chart.cjs

@@ -1,11 +1,13 @@
 var _reactJsxRuntime = require("react/jsx-runtime");
-function ChartIcon(props) {
+var React = require("react");
+function ChartIcon(props, ref) {
   return /*#__PURE__*/_reactJsxRuntime.jsx("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "1em",
     height: "1em",
     fill: "currentColor",
     viewBox: "0 0 24 24",
+    ref: ref,
     ...props,
     children: /*#__PURE__*/_reactJsxRuntime.jsx("path", {
       d: "M8 17a.97.97 0 0 0 .713-.288A.968.968 0 0 0 9 16v-5a.968.968 0 0 0-.287-.713A.967.967 0 0 0 8 10a.967.967 0 0 0-.713.287A.968.968 0 0 0 7 11v5c0 .283.096.52.287.712.192.192.43.288.713.288Zm4 0a.97.97 0 0 0 .713-.288A.968.968 0 0 0 13 16V8a.967.967 0 0 0-.287-.713A.968.968 0 0 0 12 7a.968.968 0 0 0-.713.287A.967.967 0 0 0 11 8v8c0 .283.096.52.287.712.192.192.43.288.713.288Zm4 0c.283 0 .52-.096.712-.288A.968.968 0 0 0 17 16v-2a.968.968 0 0 0-.288-.713A.968.968 0 0 0 16 13a.968.968 0 0 0-.713.287A.968.968 0 0 0 15 14v2c0 .283.096.52.287.712.192.192.43.288.713.288ZM5 21c-.55 0-1.02-.196-1.413-.587A1.926 1.926 0 0 1 3 19V5c0-.55.196-1.02.587-1.413A1.926 1.926 0 0 1 5 3h14c.55 0 1.02.196 1.413.587.39.393.587.863.587 1.413v14c0 .55-.196 1.02-.587 1.413A1.926 1.926 0 0 1 19 21H5Zm0-2h14V5H5v14Z"
@@ -14,4 +16,4 @@ function ChartIcon(props) {
 }
 ;
 ChartIcon.displayName = "ChartIcon";
-module.exports = ChartIcon;
+module.exports = React.forwardRef(ChartIcon);

package/assets/web/icons/chart.d.ts

@@ -1,10 +1,11 @@
-import * as React from "react";
+import React from "react";
 
 /**
  * chart.svg
  */
-declare const ChartIcon: React.FunctionComponent<
-    React.ComponentProps<"svg">
+declare const ChartIcon: React.ForwardRefExoticComponent<
+    Omit<React.SVGProps<SVGSVGElement>, "ref" | "children"> &
+    React.RefAttributes<SVGSVGElement>
 >;
 
 export default ChartIcon;