@cypress-design/react-icon 0.34.0 → 0.35.0

package/.turbo/turbo-build.log

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

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @cypress-design/react-icon
 
+## 0.35.0
+
+### Minor Changes
+
+- [#402](https://github.com/cypress-io/cypress-design/pull/402) [`6f2ae04`](https://github.com/cypress-io/cypress-design/commit/6f2ae04a7202e13deabf0bf981f035ed03f3616e) Thanks [@elevatebart](https://github.com/elevatebart)! - refactor and add the logo component
+
+### Patch Changes
+
+- Updated dependencies [[`6f2ae04`](https://github.com/cypress-io/cypress-design/commit/6f2ae04a7202e13deabf0bf981f035ed03f3616e)]:
+  - @cypress-design/icon-registry@0.38.0
+
 ## 0.34.0
 
 ### Minor Changes

package/animated/_IconGeneralChatBubble.tsx

@@ -1,10 +1,16 @@
 import * as React from 'react'
-import { iconGeneralChatBubble } from '@cypress-design/constants-icon'
+import { iconAnimatedGeneralChatBubble } from '@cypress-design/icon-registry'
 import { PathMorpher } from './_Morphers'
+import compileAttributes, { AnimatedProps } from './compileAttributes'
 
 const IconGeneralChatBubble: React.FC<
-  React.SVGProps<SVGSVGElement> & { animated: boolean }
-> = ({ animated, ...rest }) => {
+  AnimatedProps &
+    React.SVGProps<SVGSVGElement> & {
+      animated: boolean
+    }
+> = ({ animated, ...fullRest }) => {
+  const rest = compileAttributes(fullRest)
+
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
@@ -15,13 +21,13 @@ const IconGeneralChatBubble: React.FC<
       <PathMorpher
         className="icon-dark"
         fill="#1B1E2E"
-        {...iconGeneralChatBubble.small}
+        {...iconAnimatedGeneralChatBubble.small}
         animated={animated}
       />
       <PathMorpher
         className="icon-light"
         fill="#1B1E2E"
-        {...iconGeneralChatBubble.big}
+        {...iconAnimatedGeneralChatBubble.big}
         animated={animated}
       />
     </svg>

package/animated/_IconObjectGear.tsx

@@ -1,10 +1,15 @@
 import * as React from 'react'
-import { iconObjectGear } from '@cypress-design/constants-icon'
+import { iconAnimatedObjectGear } from '@cypress-design/icon-registry'
 import { PathMorpher } from './_Morphers'
+import compileAttributes, { AnimatedProps } from './compileAttributes'
 
 const IconObjectGear: React.FC<
-  React.SVGProps<SVGSVGElement> & { animated: boolean }
-> = ({ animated, ...rest }) => {
+  AnimatedProps &
+    React.SVGProps<SVGSVGElement> & {
+      animated: boolean
+    }
+> = ({ animated, ...fullRest }) => {
+  const rest = compileAttributes(fullRest)
   return (
     <svg
       viewBox="0 0 24 24"
@@ -15,7 +20,7 @@ const IconObjectGear: React.FC<
       <PathMorpher
         fillRule="evenodd"
         clipRule="evenodd"
-        {...iconObjectGear}
+        {...iconAnimatedObjectGear}
         fill="#1B1E2E"
         animated={animated}
         className="icon-light"

package/animated/_IconTechnologyGitBranches.tsx

@@ -1,10 +1,15 @@
 import * as React from 'react'
-import { iconTechnologyGitBranches } from '@cypress-design/constants-icon'
+import { iconAnimatedTechnologyGitBranches } from '@cypress-design/icon-registry'
 import { PathMorpher } from './_Morphers'
+import compileAttributes, { AnimatedProps } from './compileAttributes'
 
 const IconViewChart: React.FC<
-  React.SVGProps<SVGSVGElement> & { animated: boolean }
-> = ({ animated, ...rest }) => {
+  AnimatedProps &
+    React.SVGProps<SVGSVGElement> & {
+      animated: boolean
+    }
+> = ({ animated, ...fullRest }) => {
+  const rest = compileAttributes(fullRest)
   return (
     <svg
       viewBox="0 0 24 24"
@@ -13,13 +18,13 @@ const IconViewChart: React.FC<
       {...rest}
     >
       <PathMorpher
-        {...iconTechnologyGitBranches.left}
+        {...iconAnimatedTechnologyGitBranches.left}
         fill="#1B1E2E"
         className="icon-light"
         animated={animated}
       />
       <PathMorpher
-        {...iconTechnologyGitBranches.right}
+        {...iconAnimatedTechnologyGitBranches.right}
         fill="#747994"
         className="icon-dark"
         animated={animated}

package/animated/_IconTechnologyServer.tsx

@@ -1,10 +1,15 @@
 import * as React from 'react'
-import { iconTechnologyServer } from '@cypress-design/constants-icon'
+import { iconAnimatedTechnologyServer } from '@cypress-design/icon-registry'
 import { PathMorpher } from './_Morphers'
+import compileAttributes, { AnimatedProps } from './compileAttributes'
 
 const IconTechServer: React.FC<
-  React.SVGProps<SVGSVGElement> & { animated: boolean }
-> = ({ animated, ...rest }) => {
+  AnimatedProps &
+    React.SVGProps<SVGSVGElement> & {
+      animated: boolean
+    }
+> = ({ animated, ...fullRest }) => {
+  const rest = compileAttributes(fullRest)
   return (
     <svg
       width="24"
@@ -17,7 +22,7 @@ const IconTechServer: React.FC<
       <PathMorpher
         fillRule="evenodd"
         clipRule="evenodd"
-        {...iconTechnologyServer.top}
+        {...iconAnimatedTechnologyServer.top}
         animated={animated}
         fill="#1B1E2E"
         className="icon-light"
@@ -25,7 +30,7 @@ const IconTechServer: React.FC<
       <PathMorpher
         fillRule="evenodd"
         clipRule="evenodd"
-        {...iconTechnologyServer.middle}
+        {...iconAnimatedTechnologyServer.middle}
         animated={animated}
         fill="#9095AD"
         className="icon-dark"
@@ -34,7 +39,7 @@ const IconTechServer: React.FC<
       <PathMorpher
         fillRule="evenodd"
         clipRule="evenodd"
-        {...iconTechnologyServer.bottom}
+        {...iconAnimatedTechnologyServer.bottom}
         animated={animated}
         fill="#9095AD"
         className="icon-dark"

package/animated/_IconViewChart.tsx

@@ -1,10 +1,17 @@
 import * as React from 'react'
-import { iconViewChart } from '@cypress-design/constants-icon'
+import { iconAnimatedViewChart } from '@cypress-design/icon-registry'
 import { PathMorpher } from './_Morphers'
+import compileAttributes, { AnimatedProps } from './compileAttributes'
+import { HasSecondaryStrokeColor } from '@cypress-design/icon-registry'
 
 const IconViewChart: React.FC<
-  React.SVGProps<SVGSVGElement> & { animated: boolean }
-> = ({ animated, ...rest }) => {
+  AnimatedProps &
+    HasSecondaryStrokeColor &
+    React.SVGProps<SVGSVGElement> & {
+      animated: boolean
+    }
+> = ({ animated, ...fullRest }) => {
+  const rest = compileAttributes(fullRest)
   return (
     <svg
       viewBox="0 0 24 24"
@@ -13,19 +20,19 @@ const IconViewChart: React.FC<
       {...rest}
     >
       <PathMorpher
-        {...iconViewChart.topRight}
+        {...iconAnimatedViewChart.topRight}
         fill="#AFB3C7"
         className="icon-light"
         animated={animated}
       />
       <PathMorpher
-        {...iconViewChart.left}
+        {...iconAnimatedViewChart.left}
         fill="#1B1E2E"
         className="icon-dark-secondary"
         animated={animated}
       />
       <PathMorpher
-        {...iconViewChart.bottom}
+        {...iconAnimatedViewChart.bottom}
         fill="#747994"
         className="icon-dark"
         animated={animated}

package/animated/_testUtils.tsx

@@ -1,11 +1,18 @@
 import * as React from 'react'
 import { mount } from 'cypress/react18'
+import {
+  HasSecondaryFillColor,
+  HasSecondaryStrokeColor,
+} from '@cypress-design/icon-registry'
+import { AnimatedProps } from './compileAttributes'
 
 export function iconTests(
   Icon: React.FC<
-    React.SVGProps<SVGSVGElement> & {
-      animated: boolean
-    }
+    AnimatedProps &
+      HasSecondaryStrokeColor &
+      React.SVGProps<SVGSVGElement> & {
+        animated: boolean
+      }
   >,
 ) {
   it('renders', () => {
@@ -40,6 +47,29 @@ export function iconTests(
     cy.get('svg').click()
   })
 
+  it('renders with props', { viewportHeight: 550 }, () => {
+    const SUT = () => {
+      const [isActive, setIsActive] = React.useState(false)
+      return (
+        <>
+          <pre>{isActive ? 'active' : 'not active'}</pre>
+          <Icon
+            animated={isActive}
+            width={400}
+            height={400}
+            fillColor="indigo-500"
+            strokeColor="jade-300"
+            secondaryStrokeColor="purple-400"
+            onClick={() => setIsActive(!isActive)}
+          />
+        </>
+      )
+    }
+    mount(<SUT />)
+
+    cy.get('svg').click()
+  })
+
   it('renders both side by side', { viewportWidth: 900 }, () => {
     mount(
       <div className="bg-black flex gap-4 text-center text-2xl">

package/animated/compileAttributes.ts

@@ -0,0 +1,42 @@
+import {
+  HasFillColor,
+  HasStrokeColor,
+  ICON_COLOR_PROP_NAMES,
+  getComponentAttributes,
+} from '@cypress-design/icon-registry'
+import clsx from 'clsx'
+
+export interface AnimatedProps
+  extends HasStrokeColor,
+    HasFillColor,
+    React.SVGProps<SVGSVGElement> {
+  interactiveColorsOnGroup?: boolean
+  className?: string
+}
+
+export default function compileAttributes(fullRest: AnimatedProps) {
+  const { compiledClasses } = getComponentAttributes({
+    ...fullRest,
+    availableSizes: ['24'],
+  })
+
+  const rest = Object.entries(fullRest).reduce(
+    (acc: Record<string, any>, [key, value]) => {
+      if (
+        ICON_COLOR_PROP_NAMES.includes(
+          key as (typeof ICON_COLOR_PROP_NAMES)[number],
+        )
+      ) {
+        return acc
+      }
+
+      if (value) {
+        acc[key] = value
+      }
+
+      return acc
+    },
+    {},
+  )
+  return { ...rest, className: clsx(compiledClasses, fullRest.className) }
+}

package/dist/animated/_IconGeneralChatBubble.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
-declare const IconGeneralChatBubble: React.FC<React.SVGProps<SVGSVGElement> & {
+import { AnimatedProps } from './compileAttributes';
+declare const IconGeneralChatBubble: React.FC<AnimatedProps & React.SVGProps<SVGSVGElement> & {
     animated: boolean;
 }>;
 export default IconGeneralChatBubble;

package/dist/animated/_IconGeneralChatBubble.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_IconGeneralChatBubble.d.ts","sourceRoot":"./","sources":["animated/_IconGeneralChatBubble.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,QAAA,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CACnC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,CAuBtD,CAAA;AAED,eAAe,qBAAqB,CAAA"}
+{"version":3,"file":"_IconGeneralChatBubble.d.ts","sourceRoot":"./","sources":["animated/_IconGeneralChatBubble.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAA0B,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAEtE,QAAA,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CACnC,aAAa,GACX,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG;IAC9B,QAAQ,EAAE,OAAO,CAAA;CAClB,CAyBJ,CAAA;AAED,eAAe,qBAAqB,CAAA"}

package/dist/animated/_IconObjectGear.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
-declare const IconObjectGear: React.FC<React.SVGProps<SVGSVGElement> & {
+import { AnimatedProps } from './compileAttributes';
+declare const IconObjectGear: React.FC<AnimatedProps & React.SVGProps<SVGSVGElement> & {
     animated: boolean;
 }>;
 export default IconObjectGear;

package/dist/animated/_IconObjectGear.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_IconObjectGear.d.ts","sourceRoot":"./","sources":["animated/_IconObjectGear.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAC5B,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,CAoBtD,CAAA;AAED,eAAe,cAAc,CAAA"}
+{"version":3,"file":"_IconObjectGear.d.ts","sourceRoot":"./","sources":["animated/_IconObjectGear.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAA0B,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAEtE,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAC5B,aAAa,GACX,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG;IAC9B,QAAQ,EAAE,OAAO,CAAA;CAClB,CAqBJ,CAAA;AAED,eAAe,cAAc,CAAA"}

package/dist/animated/_IconTechnologyGitBranches.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
-declare const IconViewChart: React.FC<React.SVGProps<SVGSVGElement> & {
+import { AnimatedProps } from './compileAttributes';
+declare const IconViewChart: React.FC<AnimatedProps & React.SVGProps<SVGSVGElement> & {
     animated: boolean;
 }>;
 export default IconViewChart;

package/dist/animated/_IconTechnologyGitBranches.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_IconTechnologyGitBranches.d.ts","sourceRoot":"./","sources":["animated/_IconTechnologyGitBranches.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAC3B,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,CAuBtD,CAAA;AAED,eAAe,aAAa,CAAA"}
+{"version":3,"file":"_IconTechnologyGitBranches.d.ts","sourceRoot":"./","sources":["animated/_IconTechnologyGitBranches.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAA0B,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAEtE,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAC3B,aAAa,GACX,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG;IAC9B,QAAQ,EAAE,OAAO,CAAA;CAClB,CAwBJ,CAAA;AAED,eAAe,aAAa,CAAA"}

package/dist/animated/_IconTechnologyServer.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
-declare const IconTechServer: React.FC<React.SVGProps<SVGSVGElement> & {
+import { AnimatedProps } from './compileAttributes';
+declare const IconTechServer: React.FC<AnimatedProps & React.SVGProps<SVGSVGElement> & {
     animated: boolean;
 }>;
 export default IconTechServer;

package/dist/animated/_IconTechnologyServer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_IconTechnologyServer.d.ts","sourceRoot":"./","sources":["animated/_IconTechnologyServer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAC5B,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,CAsCtD,CAAA;AAED,eAAe,cAAc,CAAA"}
+{"version":3,"file":"_IconTechnologyServer.d.ts","sourceRoot":"./","sources":["animated/_IconTechnologyServer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAA0B,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAEtE,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAC5B,aAAa,GACX,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG;IAC9B,QAAQ,EAAE,OAAO,CAAA;CAClB,CAuCJ,CAAA;AAED,eAAe,cAAc,CAAA"}

package/dist/animated/_IconViewChart.d.ts

@@ -1,5 +1,7 @@
 import * as React from 'react';
-declare const IconViewChart: React.FC<React.SVGProps<SVGSVGElement> & {
+import { AnimatedProps } from './compileAttributes';
+import { HasSecondaryStrokeColor } from '@cypress-design/icon-registry';
+declare const IconViewChart: React.FC<AnimatedProps & HasSecondaryStrokeColor & React.SVGProps<SVGSVGElement> & {
     animated: boolean;
 }>;
 export default IconViewChart;

package/dist/animated/_IconViewChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_IconViewChart.d.ts","sourceRoot":"./","sources":["animated/_IconViewChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAC3B,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG;IAAE,QAAQ,EAAE,OAAO,CAAA;CAAE,CA8BtD,CAAA;AAED,eAAe,aAAa,CAAA"}
+{"version":3,"file":"_IconViewChart.d.ts","sourceRoot":"./","sources":["animated/_IconViewChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAA0B,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AACtE,OAAO,EAAE,uBAAuB,EAAE,MAAM,+BAA+B,CAAA;AAEvE,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAC3B,aAAa,GACX,uBAAuB,GACvB,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG;IAC9B,QAAQ,EAAE,OAAO,CAAA;CAClB,CA+BJ,CAAA;AAED,eAAe,aAAa,CAAA"}

package/dist/animated/compileAttributes.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { HasFillColor, HasStrokeColor } from '@cypress-design/icon-registry';
+export interface AnimatedProps extends HasStrokeColor, HasFillColor, React.SVGProps<SVGSVGElement> {
+    interactiveColorsOnGroup?: boolean;
+    className?: string;
+}
+export default function compileAttributes(fullRest: AnimatedProps): {
+    className: string;
+};
+//# sourceMappingURL=compileAttributes.d.ts.map

package/dist/animated/compileAttributes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"compileAttributes.d.ts","sourceRoot":"./","sources":["animated/compileAttributes.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,YAAY,EACZ,cAAc,EAGf,MAAM,+BAA+B,CAAA;AAGtC,MAAM,WAAW,aACf,SAAQ,cAAc,EACpB,YAAY,EACZ,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC;IAC/B,wBAAwB,CAAC,EAAE,OAAO,CAAA;IAClC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,QAAQ,EAAE,aAAa;;EAyBhE"}

package/dist/index.es.mjs

@@ -2,7 +2,7 @@ import * as React from 'react';
 import React__default from 'react';
 import clsx from 'clsx';
 import * as iconsRegistry from '@cypress-design/icon-registry';
-import { ICON_COLOR_PROP_NAMES, compileIcon } from '@cypress-design/icon-registry';
+import { ICON_COLOR_PROP_NAMES, compileIcon, getComponentAttributes, iconAnimatedGeneralChatBubble, iconAnimatedTechnologyGitBranches, iconAnimatedTechnologyServer, iconAnimatedViewChart, iconAnimatedObjectGear } from '@cypress-design/icon-registry';
 
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
@@ -1572,59 +1572,6 @@ var IconWindowCodeEditor = function (props) { return React.createElement('svg',
     }
 }, ["16", "24"], "window-code-editor")); };
 
-const iconGeneralChatBubble = {
-    small: {
-        d: 'M14 18 h-1 a3 3 0 0 1-3-3 v-1 h4 a3 3 0 0 0 3-3 V8 h2 a3 3 0 0 1 3 3 v4 a3 3 0 0 1-3 3 h0 v1.3 c0 .5-.6 1-1 .7Z',
-        dAnimated: 'M15 19 h-2 a3 3 0 0 1-3-3 v-1 h3 a5 5 0 0 0 5-5 V6 h3 a3 3 0 0 1 3 3 v7 a3 3 0 0 1-3 3 h-1 v1.7 c0 .6-.6 1-1.1.6Z',
-    },
-    big: {
-        d: 'M17 7a3 3 0 0 0-3-3H5a3 3 0 0 0-3 3v4a3 3 0 0 0 3 3v1.3c0 .5.6 1 1 .7l4-2h4a3 3 0 0 0 3-3V7ZM7 9c0 .5523-.4477 1-1 1-.5523 0-1-.4477-1-1 0-.5523.4477-1 1-1 .5523 0 1 .4477 1 1zM10.5 9c0 .5523-.4477 1-1 1-.5523 0-1-.4477-1-1 0-.5523.4477-1 1-1 .5523 0 1 .4477 1 1zm3.5 0c0 .5523-.4477 1-1 1-.5523 0-1-.4477-1-1 0-.5523.4477-1 1-1 .5523 0 1 .4477 1 1z',
-        dAnimated: 'M16 4a3 3 0 00-3-3h-10a3 3 0 00-3 3v6a3 3 0 003 3v1.8c0 .5.6 1 1 .7l5-2.5h4a3 3 0 003-3v-6zM5 7c0 .5523-.4477 1-1 1-.5523 0-1-.4477-1-1 0-.5523.4477-1 1-1 .5523 0 1 .4477 1 1zM9 7c0 .5523-.4477 1-1 1-.5523 0-1-.4477-1-1 0-.5523.4477-1 1-1 .5523 0 1 .4477 1 1zM13 7c0 .5523-.4477 1-1 1-.5523 0-1-.4477-1-1 0-.5523.4477-1 1-1 .5523 0 1 .4477 1 1z',
-    },
-};
-const iconObjectGear = {
-    d: 'M10 3.7507c0-.4142.3358-.75.75-.75l2.5 0c.4142 0 .75.3358.75.75l0 .9806c0 .3318.2197.6203.5291.7403.6771.2625 1.3032.6272 1.8594 1.0753.2583.2081.6179.254.9052.0881l.851-.4913c.3587-.2071.8174-.0842 1.0245.2745l1.25 2.1651c.2072.3587.0842.8174-.2745 1.0245l-.85.4908c-.2871.1657-.4272.4997-.3767.8273.054.3504.082.7093.082 1.0748 0 .3655-.028.7245-.082 1.0749-.0505.3276.0896.6616.3767.8273l.85.4908c.3587.2071.4816.6658.2745 1.0245l-1.25 2.1651c-.2071.3587-.6658.4816-1.0245.2745l-.851-.4913c-.2873-.1659-.6469-.12-.9052.0881-.5562.4481-1.1823.8128-1.8594 1.0753-.3094.1199-.5291.4084-.5291.7403l0 .9805c0 .4142-.3358.75-.75.75l-2.5 0c-.4142 0-.75-.3358-.75-.75l0-.9805c0-.3319-.2197-.6204-.5291-.7403-.6771-.2625-1.3032-.6272-1.8594-1.0753-.2583-.2081-.6179-.254-.9052-.0881l-.851.4913c-.3587.2071-.8174.0842-1.0245-.2745l-1.25-2.1651c-.2071-.3587-.0842-.8174.2745-1.0245l.8501-.4908c.2871-.1657.4271-.4997.3766-.8273-.054-.3504-.082-.7094-.082-1.0749 0-.3655.028-.7244.082-1.0748.0505-.3276-.0896-.6616-.3766-.8273l-.8501-.4908c-.3587-.2071-.4816-.6658-.2745-1.0245l1.25-2.1651c.2071-.3587.6658-.4816 1.0245-.2745l.851.4913c.2873.1659.6469.12.9052-.0881.5562-.4481 1.1823-.8129 1.8594-1.0753.3094-.1199.5291-.4084.5291-.7403l0-.9806zM14 12c0 1.1046-.8954 2-2 2-1.1046 0-2-.8954-2-2 0-1.1046.8954-2 2-2 1.1046 0 2 .8954 2 2z',
-    dAnimated: 'M3.288 10.4342c-.866-.5-1.1118-1.4174-.6977-2.1348l1.5-2.5981c.4142-.7174 1.3316-.9632 2.049-.5491l.9369.5409c.5913-.4615 1.2402-.833 1.9244-1.1093 0 0 0 0 0 0 0 0 0 0 0 0l-0-1.0834c-.0001-.8284.6716-1.5 1.4999-1.5l3-0c.8284-.0001 1.5.6716 1.5 1.4999l-.0001 1.0829c.34.138.6741.3008 1 .4889.326.1882.6339.3962.9234.6216 0 0 0 0 0 0 0 0 0 0 0 0l.9379-.5414c.7174-.4142 1.6348-.1685 2.049.5491l1.5 2.5981c.4142.7174.1684 1.6348-.5491 2.049l-.9383.5417c.1028.7307.1054 1.4783.0014 2.2212 0 0 0 0 0 0 0 0 0 0 0 0l.9369.5409c.7175.4142.9632 1.3316.5491 2.049l-1.5 2.5981c-.4142.7174-1.3315.9633-2.049.5491l-.9369-.5409c-.5913.4615-1.2401.8332-1.9243 1.1094 0 0 0 0 0 0 0 0 0 0 0 0l0 1.0834c-0 .8285-.6716 1.5001-1.5 1.5001l-3 0c-.8284-0-1.5-.6716-1.4999-1.5l-.0001-1.0829c-.34-.1379-.674-.3007-1-.4889-.3259-.1881-.634-.3961-.9234-.6216 0 0 0 0 0 0 0 0 0 0 0 0l-.9378.5414c-.7175.4142-1.6348.1685-2.049-.549l-1.5-2.5981c-.4142-.7174-.1685-1.6348.5491-2.0491l.9383-.5417c-.1029-.7306-.1054-1.4784-.0015-2.2212 0 0 0 0 0 0 0 0 0 0 0 0l-.9369-.5409zm5.2492-.4335c1.1045-1.9132 3.5509-2.5687 5.4641-1.4641 1.9132 1.1045 2.5686 3.551 1.4641 5.4641-1.1046 1.9132-3.551 2.5686-5.4641 1.4641-1.9132-1.1046-2.5687-3.5509-1.4641-5.4641z',
-};
-const iconTechnologyGitBranches = {
-    left: {
-        d: 'M11,4c0,-0.6,-0.4,-1,-1,-1h-4a3,3,0,0,0,-3,3v12a3,3,0,0,0,3,3h4c0.6,0,1,-0.4,1,-1v0a2,2,0,0,0,-0.8,-1.6l-3,-2.2a4,4,0,0,1,-1.8,-3.2v-0.5a1,1,0,1,1,2,0v0.5c0,0.6,0.3,1.2,0.8,1.6l2.7,2v-3.6a2,2,0,0,0,-0.8,-1.6l-1.6,-1.2a4,4,0,0,1,-1.5,-3.2v-0.5a1,1,0,0,1,2,0v0.5c0,0.6,0.3,1.2,0.8,1.6l1.2,0.9v-5.5z',
-        dAnimated: 'M11,3c0,-0.6,-0.4,-1,-1,-1h-5a3,3,0,0,0,-3,3v14a3,3,0,0,0,3,3h5c0.6,0,1,-0.4,1,-1v-0.5a2,2,0,0,0,-0.8,-1.6l-3,-2.2a4,4,0,0,1,-1.7,-3.3v-0.4a1,1,0,1,1,2,0v0.4c0,0.7,0.3,1.3,0.8,1.7l2.7,1.9v-4.5a2,2,0,0,0,-0.8,-1.6l-1.6,-1.2a4,4,0,0,1,-1.6,-3.2v-0.5a1,1,0,0,1,2,0v0.5c0,0.6,0.3,1.2,0.8,1.6l1.2,0.9v-6z',
-    },
-    right: {
-        d: 'M13 20C13 20.5523 13.4477 21 14 21H18C19.6569 21 21 19.6569 21 18V6C21 4.34315 19.6569 3 18 3H14C13.4477 3 13 3.44772 13 4V12.9554L14.7279 11.6115C15.2151 11.2325 15.5 10.6499 15.5 10.0328V9.5C15.5 8.94772 15.9477 8.5 16.5 8.5C17.0523 8.5 17.5 8.94772 17.5 9.5V10.0328C17.5 11.2671 16.9301 12.4323 15.9558 13.1902L13.7721 14.8885C13.2853 15.2672 13.0004 15.8493 13 16.4661V20Z',
-        dAnimated: 'M13 21C13 21.5523 13.4477 22 14 22H19C20.6569 22 22 20.6569 22 19V5C22 3.34315 20.6569 2 19 2H14C13.4477 2 13 2.44772 13 3V12.9554L14.7279 11.6115C15.2151 11.2325 15.5 10.6499 15.5 10.0328V9.5C15.5 8.94772 15.9477 8.5 16.5 8.5C17.0523 8.5 17.5 8.94772 17.5 9.5V10.0328C17.5 11.2671 16.9301 12.4323 15.9558 13.1902L13.7721 14.8885C13.2853 15.2672 13.0004 15.8493 13 16.4661V21Z',
-    },
-};
-const iconTechnologyServer = {
-    top: {
-        d: 'M 2 11 c 0 -1.1046 0.8954 -2 2 -2 h 16 c 1.1046 0 2 0.8954 2 2 v 2 c 0 1.1046 -0.8954 2 -2 2 h -16 c -1.1046 0 -2 -0.8954 -2 -2 v -2 z M 7 12 c 0 -0.5523 0.4477 -1 1 -1 h 11 c 0.5523 0 1 0.4477 1 1 c 0 0.5523 -0.4477 1 -1 1 h -11 c -0.5523 0 -1 -0.4477 -1 -1 z M 5 13 c 0.5523 0 1 -0.4477 1 -1 c 0 -0.5523 -0.4477 -1 -1 -1 c -0.5523 0 -1 0.4477 -1 1 c 0 0.5523 0.4477 1 1 1 z M 6.7011 9.7929 c -0.0156 -0.0156 -0.0409 -0.0156 -0.0566 0 c -0.0156 0.0156 -0.0156 0.0409 0 0.0566 l 0.0317 0.0317 l -0.0317 0.0317 c -0.0156 0.0156 -0.0156 0.0409 0 0.0566 c 0.0156 0.0156 0.0409 0.0156 0.0566 0 l 0.0317 -0.0317 l 0.0317 0.0317 c 0.0156 0.0156 0.0409 0.0156 0.0566 0 c 0.0156 -0.0156 0.0156 -0.0409 0 -0.0566 l -0.0317 -0.0317 l 0.0317 -0.0317 c 0.0156 -0.0156 0.0156 -0.0409 0 -0.0566 c -0.0156 -0.0156 -0.0409 -0.0156 -0.0566 0 l -0.0317 0.0317 l -0.0317 -0.0317 Z',
-        dAnimated: 'M 0 10 c 0 -1.1046 0.8954 -2 2 -2 h 20 c 1.1046 0 2 0.8954 2 2 v 4 c 0 1.1046 -0.8954 2 -2 2 h -20 c -1.1046 0 -2 -0.8954 -2 -2 v -4 z M 9 12 c 0 -0.5523 0.4477 -1 1 -1 h 11 c 0.5523 0 1 0.4477 1 1 c 0 0.5523 -0.4477 1 -1 1 h -11 c -0.5523 0 -1 -0.4477 -1 -1 z M 2 13 c 0.0221 0 0.04 -0.0179 0.04 -0.04 c 0 -0.0221 -0.0179 -0.04 -0.04 -0.04 c -0.0221 0 -0.04 0.0179 -0.04 0.04 c 0 0.0221 0.0179 0.04 0.04 0.04 z M 3.7071 9.7929 c -0.3905 -0.3905 -1.0237 -0.3905 -1.4142 0 c -0.3905 0.3905 -0.3905 1.0237 0 1.4142 l 0.7929 0.7929 l -0.7929 0.7929 c -0.3905 0.3905 -0.3905 1.0237 0 1.4142 c 0.3905 0.3905 1.0237 0.3905 1.4142 0 l 0.7929 -0.7929 l 0.7929 0.7929 c 0.3905 0.3905 1.0237 0.3905 1.4142 0 c 0.3905 -0.3905 0.3905 -1.0237 0 -1.4142 l -0.7929 -0.7929 l 0.7929 -0.7929 c 0.3905 -0.3905 0.3905 -1.0237 0 -1.4142 c -0.3905 -0.3905 -1.0237 -0.3905 -1.4142 0 l -0.7929 0.7929 l -0.7929 -0.7929 Z',
-    },
-    middle: {
-        d: 'M2 17C2 15.8954 2.89543 15 4 15H20C21.1046 15 22 15.8954 22 17V19C22 20.1046 21.1046 21 20 21H4C2.89543 21 2 20.1046 2 19V17ZM7 18C7 17.4477 7.44772 17 8 17H12C12.5523 17 13 17.4477 13 18C13 18.5523 12.5523 19 12 19H8C7.44772 19 7 18.5523 7 18ZM5 19C5.55228 19 6 18.5523 6 18C6 17.4477 5.55228 17 5 17C4.44772 17 4 17.4477 4 18C4 18.5523 4.44772 19 5 19Z',
-        dAnimated: 'M2 20C2 18.8954 2.89543 18 4 18H20C21.1046 18 22 18.8954 22 20V22C22 23.1046 21.1046 24 20 24H4C2.89543 24 2 23.1046 2 22V20ZM7 21C7 20.4477 7.44772 20 8 20H12C12.5523 20 13 20.4477 13 21C13 21.5523 12.5523 22 12 22H8C7.44772 22 7 21.5523 7 21ZM5 22C5.55228 22 6 21.5523 6 21C6 20.4477 5.55228 20 5 20C4.44772 20 4 20.4477 4 21C4 21.5523 4.44772 22 5 22Z',
-    },
-    bottom: {
-        d: 'M2 5C2 3.89543 2.89543 3 4 3H20C21.1046 3 22 3.89543 22 5V7C22 8.10457 21.1046 9 20 9H4C2.89543 9 2 8.10457 2 7V5ZM7 6C7 5.44772 7.44772 5 8 5H15C15.5523 5 16 5.44772 16 6C16 6.55228 15.5523 7 15 7H8C7.44772 7 7 6.55228 7 6ZM5 7C5.55228 7 6 6.55228 6 6C6 5.44772 5.55228 5 5 5C4.44772 5 4 5.44772 4 6C4 6.55228 4.44772 7 5 7Z',
-        dAnimated: 'M2 2C2 0.89543 2.89543 0 4 0H20C21.1046 0 22 0.895431 22 2V4C22 5.10457 21.1046 6 20 6H4C2.89543 6 2 5.10457 2 4V2ZM7 3C7 2.44772 7.44772 2 8 2H15C15.5523 2 16 2.44772 16 3C16 3.55228 15.5523 4 15 4H8C7.44772 4 7 3.55228 7 3ZM5 4C5.55228 4 6 3.55228 6 3C6 2.44772 5.55228 2 5 2C4.44772 2 4 2.44772 4 3C4 3.55228 4.44772 4 5 4Z',
-    },
-};
-const iconViewChart = {
-    bottom: {
-        d: 'M12,21a9,9,0,0,0,9,-8.3c0,-0.4,-0.3,-0.7,-0.8,-0.7h-7.8a1,1,0,0,0,-0.7,0.3l-5.5,5.5c-0.3,0.3,-0.3,0.8,0,1a9,9,0,0,0,5.8,2.2z',
-        dAnimated: 'M12.4,21.6a9,9,0,0,0,9,-8.3c0,-0.4,-0.3,-0.7,-0.8,-0.7h-7.8a1,1,0,0,0,-0.7,0.3l-5.5,5.5c-0.3,0.3,-0.3,0.8,0,1a9,9,0,0,0,5.8,2.2z',
-    },
-    left: {
-        d: 'M11.4,3a9,9,0,0,0,-6.3,14.8c0.3,0.3,0.8,0.3,1,0l5.6,-5.5c0.2,-0.2,0.3,-0.4,0.3,-0.7v-7.8c0,-0.5,-0.3,-0.8,-0.7,-0.8z',
-        dAnimated: 'M10.9,2.6a9,9,0,0,0,-6.3,14.8c0.3,0.3,0.8,0.3,1,0l5.6,-5.5c0.2,-0.2,0.3,-0.4,0.3,-0.7v-7.8c0,-0.5,-0.3,-0.8,-0.7,-0.8z',
-    },
-    topRight: {
-        d: 'M 21 11.3 C 20.67 6.86 17.14 3.33 12.7 3 C 12.3 3 12 3.3 12 3.8 L 12 11.3 C 12 11.7 12.3 12 12.8 12 L 20.2 12 C 20.7 12 21 11.7 21 11.3 Z',
-        dAnimated: 'M 23 10.55 c -0.37 -4.93 -4.29 -8.85 -9.22 -9.22 c -0.45 0 -0.78 0.33 -0.78 0.89 l 0 8.33 c 0 0.45 0.33 0.78 0.89 0.78 l 8.22 0 c 0.56 0 0.89 -0.33 0.89 -0.78 z',
-    },
-};
-
 function useAnimatedEffect(animated, dur) {
     var _a = React__default.useState(animated), prevAnimated = _a[0], setPrevAnimated = _a[1];
     var animateRef = React__default.useRef(null);
@@ -1653,44 +1600,64 @@ var PathMorpher = function (_a) {
                     : [d, dAnimated].join(';'), restart: "always" })));
 };
 
+function compileAttributes(fullRest) {
+    var compiledClasses = getComponentAttributes(__assign(__assign({}, fullRest), { availableSizes: ['24'] })).compiledClasses;
+    var rest = Object.entries(fullRest).reduce(function (acc, _a) {
+        var key = _a[0], value = _a[1];
+        if (ICON_COLOR_PROP_NAMES.includes(key)) {
+            return acc;
+        }
+        if (value) {
+            acc[key] = value;
+        }
+        return acc;
+    }, {});
+    return __assign(__assign({}, rest), { className: clsx(compiledClasses, fullRest.className) });
+}
+
 var IconGeneralChatBubble = function (_a) {
-    var animated = _a.animated, rest = __rest(_a, ["animated"]);
+    var animated = _a.animated, fullRest = __rest(_a, ["animated"]);
+    var rest = compileAttributes(fullRest);
     return (React.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, rest),
-        React.createElement(PathMorpher, __assign({ className: "icon-dark", fill: "#1B1E2E" }, iconGeneralChatBubble.small, { animated: animated })),
-        React.createElement(PathMorpher, __assign({ className: "icon-light", fill: "#1B1E2E" }, iconGeneralChatBubble.big, { animated: animated }))));
+        React.createElement(PathMorpher, __assign({ className: "icon-dark", fill: "#1B1E2E" }, iconAnimatedGeneralChatBubble.small, { animated: animated })),
+        React.createElement(PathMorpher, __assign({ className: "icon-light", fill: "#1B1E2E" }, iconAnimatedGeneralChatBubble.big, { animated: animated }))));
 };
 
 var IconViewChart$1 = function (_a) {
-    var animated = _a.animated, rest = __rest(_a, ["animated"]);
+    var animated = _a.animated, fullRest = __rest(_a, ["animated"]);
+    var rest = compileAttributes(fullRest);
     return (React.createElement("svg", __assign({ viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, rest),
-        React.createElement(PathMorpher, __assign({}, iconTechnologyGitBranches.left, { fill: "#1B1E2E", className: "icon-light", animated: animated })),
-        React.createElement(PathMorpher, __assign({}, iconTechnologyGitBranches.right, { fill: "#747994", className: "icon-dark", animated: animated }))));
+        React.createElement(PathMorpher, __assign({}, iconAnimatedTechnologyGitBranches.left, { fill: "#1B1E2E", className: "icon-light", animated: animated })),
+        React.createElement(PathMorpher, __assign({}, iconAnimatedTechnologyGitBranches.right, { fill: "#747994", className: "icon-dark", animated: animated }))));
 };
 
 var IconTechServer = function (_a) {
-    var animated = _a.animated, rest = __rest(_a, ["animated"]);
+    var animated = _a.animated, fullRest = __rest(_a, ["animated"]);
+    var rest = compileAttributes(fullRest);
     return (React.createElement("svg", __assign({ width: "24", height: "24", fill: "none", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, rest),
-        React.createElement(PathMorpher, __assign({ fillRule: "evenodd", clipRule: "evenodd" }, iconTechnologyServer.top, { animated: animated, fill: "#1B1E2E", className: "icon-light" })),
-        React.createElement(PathMorpher, __assign({ fillRule: "evenodd", clipRule: "evenodd" }, iconTechnologyServer.middle, { animated: animated, fill: "#9095AD", className: "icon-dark" })),
-        React.createElement(PathMorpher, __assign({ fillRule: "evenodd", clipRule: "evenodd" }, iconTechnologyServer.bottom, { animated: animated, fill: "#9095AD", className: "icon-dark" }))));
+        React.createElement(PathMorpher, __assign({ fillRule: "evenodd", clipRule: "evenodd" }, iconAnimatedTechnologyServer.top, { animated: animated, fill: "#1B1E2E", className: "icon-light" })),
+        React.createElement(PathMorpher, __assign({ fillRule: "evenodd", clipRule: "evenodd" }, iconAnimatedTechnologyServer.middle, { animated: animated, fill: "#9095AD", className: "icon-dark" })),
+        React.createElement(PathMorpher, __assign({ fillRule: "evenodd", clipRule: "evenodd" }, iconAnimatedTechnologyServer.bottom, { animated: animated, fill: "#9095AD", className: "icon-dark" }))));
 };
 
 var IconViewChart = function (_a) {
-    var animated = _a.animated, rest = __rest(_a, ["animated"]);
+    var animated = _a.animated, fullRest = __rest(_a, ["animated"]);
+    var rest = compileAttributes(fullRest);
     return (React.createElement("svg", __assign({ viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, rest),
-        React.createElement(PathMorpher, __assign({}, iconViewChart.topRight, { fill: "#AFB3C7", className: "icon-light", animated: animated })),
-        React.createElement(PathMorpher, __assign({}, iconViewChart.left, { fill: "#1B1E2E", className: "icon-dark-secondary", animated: animated })),
-        React.createElement(PathMorpher, __assign({}, iconViewChart.bottom, { fill: "#747994", className: "icon-dark", animated: animated, shapeRendering: "geometricPrecision" }))));
+        React.createElement(PathMorpher, __assign({}, iconAnimatedViewChart.topRight, { fill: "#AFB3C7", className: "icon-light", animated: animated })),
+        React.createElement(PathMorpher, __assign({}, iconAnimatedViewChart.left, { fill: "#1B1E2E", className: "icon-dark-secondary", animated: animated })),
+        React.createElement(PathMorpher, __assign({}, iconAnimatedViewChart.bottom, { fill: "#747994", className: "icon-dark", animated: animated, shapeRendering: "geometricPrecision" }))));
 };
 
 var IconObjectGear = function (_a) {
-    var animated = _a.animated, rest = __rest(_a, ["animated"]);
+    var animated = _a.animated, fullRest = __rest(_a, ["animated"]);
+    var rest = compileAttributes(fullRest);
     return (React.createElement("svg", __assign({ viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, rest),
-        React.createElement(PathMorpher, __assign({ fillRule: "evenodd", clipRule: "evenodd" }, iconObjectGear, { fill: "#1B1E2E", animated: animated, className: "icon-light" })),
+        React.createElement(PathMorpher, __assign({ fillRule: "evenodd", clipRule: "evenodd" }, iconAnimatedObjectGear, { fill: "#1B1E2E", animated: animated, className: "icon-light" })),
         React.createElement("circle", { cx: "12", cy: "12", r: "2", fill: "#9095AD", className: "icon-dark" })));
 };
 
 export { IconActionAdd, IconActionAddLarge, IconActionAddMedium, IconActionAddSmall, IconActionAddXsmall, IconActionDelete, IconActionDeleteCircle, IconActionDeleteLarge, IconActionDeleteMedium, IconActionDeleteSmall, IconActionDeleteXlarge, IconActionDeleteXsmall, IconActionDisableCircleSolid, IconActionExport, IconActionNext, IconActionPlayLarge, IconActionPlaySmall, IconActionPlayVideo, IconActionPower, IconActionQuestionMarkCircle, IconActionQuestionMarkDefault, IconActionQuestionMarkOutline, IconActionRecord, IconActionRefresh, IconActionRestart, IconActionStop, IconActionTestReplay, IconGeneralChatBubble as IconAnimatedGeneralChatBubble, IconObjectGear as IconAnimatedObjectGear, IconViewChart$1 as IconAnimatedTechnologyGitBranches, IconTechServer as IconAnimatedTechnologyServer, IconViewChart as IconAnimatedViewChart, IconArrowBottomRight, IconArrowCollapse, IconArrowDown, IconArrowExpand, IconArrowLeft, IconArrowOpposingUpDown, IconArrowOutlineDown, IconArrowRight, IconArrowRightLarge, IconArrowSquareDown, IconArrowTopRight, IconArrowUp, IconBrowserChrome, IconBrowserChromeBeta, IconBrowserChromeCanary, IconBrowserEdge, IconBrowserElectronDark, IconBrowserElectronLight, IconBrowserMozillaFirefox, IconBrowserSafari, IconBrowserWebkit, IconCheckmark, IconCheckmarkOutline, IconCheckmarkSmall, IconCheckmarkSolid, IconChevronDownDouble, IconChevronDownLarge, IconChevronDownMedium, IconChevronDownSmall, IconChevronLeftDouble, IconChevronLeftLarge, IconChevronLeftSmall, IconChevronRightDouble, IconChevronRightLarge, IconChevronRightSmall, IconChevronUpDouble, IconChevronUpLarge, IconChevronUpSmall, IconCurrencyEur, IconCurrencyGbp, IconCurrencyInr, IconCurrencyRub, IconCurrencyUsd, IconDeviceLaptop, IconDeviceSmartphone, IconDeviceTv, IconDocumentAdded, IconDocumentAddedSquarePlus, IconDocumentBlank, IconDocumentCode, IconDocumentDeleted, IconDocumentDownload, IconDocumentMinus, IconDocumentModified, IconDocumentModifiedSquareDot, IconDocumentPlus, IconDocumentPlusMinus, IconDocumentScript, IconDocumentSheet, IconDocumentStar, IconDocumentText, IconDotOutlineLarge, IconDotOutlineSmall, IconFileChangesAdded, IconFileChangesError, IconFileChangesSkipped, IconFileChangesWarning, IconGeneral1X, IconGeneralChatBubble$1 as IconGeneralChatBubble, IconGeneralClipboard, IconGeneralCommandKey, IconGeneralCrosshairs, IconGeneralEarth, IconGeneralEyeClosed, IconGeneralEyeOpen, IconGeneralGlobe, IconGeneralGrid2X2, IconGeneralGrid2X2Medium, IconGeneralGrid2X2Small, IconGeneralHandleVertical, IconGeneralLifeRing, IconGeneralOfficeBuilding, IconGeneralPlaceholder, IconGeneralRocket, IconLoading, IconMenuDotsVertical, IconMenuExpandLeft, IconMenuExpandRight, IconMenuHamburger, IconNumber1, IconNumber2, IconNumber3, IconNumber4, IconNumber5, IconNumberOctothorpe, IconObjectBook, IconObjectBookCode, IconObjectBookmark, IconObjectBox, IconObjectBoxOpen, IconObjectBriefcase, IconObjectBug, IconObjectBugLarge, IconObjectBugSmall, IconObjectChainLink, IconObjectFolderDark, IconObjectFolderDarkSmall, IconObjectFolderLight, IconObjectGear$1 as IconObjectGear, IconObjectGraduationCap, IconObjectLetter, IconObjectMagicWandDarkMode, IconObjectMagnifyingGlass, IconObjectOdometer, IconObjectPaperAirplane, IconObjectPinModern, IconObjectRuler, IconObjectSlidersRound, IconObjectTag, IconObjectTassel, IconOsApple, IconOsGeneric, IconOsLinux, IconOsWindows, IconSecurityKey, IconSecurityLockLocked, IconSecurityShieldCheck, IconSecurityShieldCross, IconShapeHeart, IconShapeLightningBolt, IconShapeMoonCrescent, IconShapeStar, IconShapeSunLong, IconSocialDiscordSolid, IconSocialEmail, IconSocialFacebookSolid, IconSocialGithubSolid, IconSocialLinkedinSolid, IconSocialTwitterSolid, IconSocialYoutubeSolid, IconStatusCancelledOutline, IconStatusCancelledSimple, IconStatusCancelledSolid, IconStatusErroredOutline, IconStatusErroredSimple, IconStatusErroredSolid, IconStatusFailedOutline, IconStatusFailedSimple, IconStatusFailedSolid, IconStatusFailingOutline, IconStatusFlaky, IconStatusPassedOutline, IconStatusPassedSimple, IconStatusPassedSolid, IconStatusPendingOutline, IconStatusPendingSimple, IconStatusPlaceholderSimple, IconStatusPlaceholderSolid, IconStatusQueuedOutline, IconStatusQueuedSimple, IconStatusRunningOutline, IconStatusRunningSimple, IconStatusSkippedOutline, IconStatusSkippedSimple, IconTechnologyAccessibility, IconTechnologyBranchH, IconTechnologyBranchHTall, IconTechnologyBrowserDark, IconTechnologyBrowserLight, IconTechnologyBrowserTesting2, IconTechnologyCodeEditor, IconTechnologyCommandLine, IconTechnologyCommandLineError, IconTechnologyCypress, IconTechnologyDashboardCheckmark, IconTechnologyDashboardFail, IconTechnologyDashboardRunning, IconTechnologyDollar, IconTechnologyDragProject, IconTechnologyElementSelector, IconTechnologyGitBranches, IconTechnologyImageScreenshot, IconTechnologyInfinityLoop, IconTechnologyLockedProject, IconTechnologyOctothorpe, IconTechnologyPullRequest, IconTechnologyServer, IconTechnologyServerAlt, IconTechnologyTerminal, IconTechnologyTerminalLog, IconTechnologyTestResults, IconTechnologyUiCoverage, IconTestingTypeComponent, IconTestingTypeComponentSolid, IconTestingTypeE2E, IconTestingTypeE2ESolid, IconTimeCalendarDay, IconTimeClock, IconTimeStopwatch, IconUserGeneralOutline, IconUserGeneralSolid, IconViewList, IconViewPieChart, IconViewPieChartAlt, IconViewTreeAlt, IconWarning, IconWarningCircle, IconWindowCodeEditor, compileReactIconProperties, Icon as default };
 //# sourceMappingURL=index.es.mjs.map
 
-/* <wind-keep class="filter icon-light-secondary icon-dark-secondary h-1 h-2"> */
+/* <wind-keep class="filter icon-light-secondary icon-dark-secondary"> */