Skip to content

Commit

Permalink
Fix inversion between background and shadow values (#22)
Browse files Browse the repository at this point in the history
  • Loading branch information
Franck Gaudin authored May 15, 2024
2 parents ca3be1a + 68e75f3 commit c9d0197
Show file tree
Hide file tree
Showing 36 changed files with 135 additions and 130 deletions.
5 changes: 5 additions & 0 deletions .changeset/big-owls-peel.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@hopper-ui/icons-react16": patch
---

fix inversion between background and shadow values
8 changes: 4 additions & 4 deletions packages/icons-react16/scripts/svgo-config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,10 +13,10 @@ import {
export const colors: { [key: string]: string } = {
[PrimaryIconColor]: `var(--hop-Icon-placeholder-primary-icon, ${PrimaryIconColor})`,
[WarningWeakIconColor]: `var(--hop-Icon-placeholder-warning-icon-weak, ${WarningWeakIconColor})`,
[White]: `var(--hop-Richicon-placeholder-fill, ${WhiteHexadecimal})`,
[WhiteHexadecimal]: `var(--hop-Richicon-placeholder-fill, ${WhiteHexadecimal})`,
[DecorativeOption7IconColor]: `var(--hop-Richicon-placeholder-background, ${DecorativeOption7IconColor})`,
[DecorativeOption7SurfaceColor]: `var(--hop-Richicon-placeholder-shadow, ${DecorativeOption7SurfaceColor})`
[White]: `var(--hop-RichIcon-placeholder-fill, ${WhiteHexadecimal})`,
[WhiteHexadecimal]: `var(--hop-RichIcon-placeholder-fill, ${WhiteHexadecimal})`,
[DecorativeOption7IconColor]: `var(--hop-RichIcon-placeholder-shadow, ${DecorativeOption7IconColor})`,
[DecorativeOption7SurfaceColor]: `var(--hop-RichIcon-placeholder-background, ${DecorativeOption7SurfaceColor})`
};

const config : Config = {
Expand Down
54 changes: 27 additions & 27 deletions packages/icons-react16/src/RichIcon.module.css
View file
Original file line number Diff line number Diff line change
@@ -1,57 +1,57 @@
.hop-RichIcon {
/* These tokens needs to match the ones defined in the generateComponents script */
--hop-Richicon-placeholder-shadow: var(--hop-decorative-option7-surface);
--hop-Richicon-placeholder-background: var(--hop-decorative-option7-icon);
--hop-Richicon-placeholder-fill: var(--hop-samoyed);
--hop-RichIcon-placeholder-background: var(--hop-decorative-option7-surface);
--hop-RichIcon-placeholder-shadow: var(--hop-decorative-option7-icon);
--hop-RichIcon-placeholder-fill: var(--hop-samoyed);

display: inline-block;
flex-shrink: 0;
}

.hop-RichIcon--option1 {
--hop-Richicon-placeholder-shadow: var(--hop-decorative-option1-surface);
--hop-Richicon-placeholder-background: var(--hop-decorative-option1-icon);
--hop-Richicon-placeholder-fill: var(--hop-samoyed);
--hop-RichIcon-placeholder-background: var(--hop-decorative-option1-surface);
--hop-RichIcon-placeholder-shadow: var(--hop-decorative-option1-icon);
--hop-RichIcon-placeholder-fill: var(--hop-samoyed);
}

.hop-RichIcon--option2 {
--hop-Richicon-placeholder-shadow: var(--hop-decorative-option2-surface);
--hop-Richicon-placeholder-background: var(--hop-decorative-option2-icon);
--hop-Richicon-placeholder-fill: var(--hop-samoyed);
--hop-RichIcon-placeholder-background: var(--hop-decorative-option2-surface);
--hop-RichIcon-placeholder-shadow: var(--hop-decorative-option2-icon);
--hop-RichIcon-placeholder-fill: var(--hop-samoyed);
}

.hop-RichIcon--option3 {
--hop-Richicon-placeholder-shadow: var(--hop-decorative-option3-surface);
--hop-Richicon-placeholder-background: var(--hop-decorative-option3-icon);
--hop-Richicon-placeholder-fill: var(--hop-samoyed);
--hop-RichIcon-placeholder-background: var(--hop-decorative-option3-surface);
--hop-RichIcon-placeholder-shadow: var(--hop-decorative-option3-icon);
--hop-RichIcon-placeholder-fill: var(--hop-samoyed);
}

.hop-RichIcon--option4 {
--hop-Richicon-placeholder-shadow: var(--hop-decorative-option4-surface);
--hop-Richicon-placeholder-background: var(--hop-decorative-option4-icon);
--hop-Richicon-placeholder-fill: var(--hop-samoyed);
--hop-RichIcon-placeholder-background: var(--hop-decorative-option4-surface);
--hop-RichIcon-placeholder-shadow: var(--hop-decorative-option4-icon);
--hop-RichIcon-placeholder-fill: var(--hop-samoyed);
}

.hop-RichIcon--option5 {
--hop-Richicon-placeholder-shadow: var(--hop-decorative-option5-surface);
--hop-Richicon-placeholder-background: var(--hop-decorative-option5-icon);
--hop-Richicon-placeholder-fill: var(--hop-samoyed);
--hop-RichIcon-placeholder-background: var(--hop-decorative-option5-surface);
--hop-RichIcon-placeholder-shadow: var(--hop-decorative-option5-icon);
--hop-RichIcon-placeholder-fill: var(--hop-samoyed);
}

.hop-RichIcon--option6 {
--hop-Richicon-placeholder-shadow: var(--hop-decorative-option6-surface);
--hop-Richicon-placeholder-background: var(--hop-decorative-option6-icon);
--hop-Richicon-placeholder-fill: var(--hop-samoyed);
--hop-RichIcon-placeholder-background: var(--hop-decorative-option6-surface);
--hop-RichIcon-placeholder-shadow: var(--hop-decorative-option6-icon);
--hop-RichIcon-placeholder-fill: var(--hop-samoyed);
}

.hop-RichIcon--option7 {
--hop-Richicon-placeholder-shadow: var(--hop-decorative-option7-surface);
--hop-Richicon-placeholder-background: var(--hop-decorative-option7-icon);
--hop-Richicon-placeholder-fill: var(--hop-samoyed);
--hop-RichIcon-placeholder-background: var(--hop-decorative-option7-surface);
--hop-RichIcon-placeholder-shadow: var(--hop-decorative-option7-icon);
--hop-RichIcon-placeholder-fill: var(--hop-samoyed);
}

.hop-RichIcon--option8 {
--hop-Richicon-placeholder-shadow: var(--hop-decorative-option8-surface);
--hop-Richicon-placeholder-background: var(--hop-decorative-option8-icon);
--hop-Richicon-placeholder-fill: var(--hop-samoyed);
--hop-RichIcon-placeholder-background: var(--hop-decorative-option8-surface);
--hop-RichIcon-placeholder-shadow: var(--hop-decorative-option8-icon);
--hop-RichIcon-placeholder-fill: var(--hop-samoyed);
}
6 changes: 3 additions & 3 deletions packages/icons-react16/src/generated-rich-icon-components/ActionListRichIcon.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
import { createRichIcon } from "../createRichIcon.tsx";
import React, { forwardRef, type Ref, type SVGProps } from "react";

const ActionListRichIcon24 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={24} height={24} viewBox="0 0 24 24" ref={ref} {...props}><path fill="var(--hop-Richicon-placeholder-shadow, #E5DED6)" d="M0 12C0 5.373 5.373 0 12 0s12 5.373 12 12-5.373 12-12 12S0 18.627 0 12" /><path fill="var(--hop-Richicon-placeholder-background, #2A2620)" d="M6.848 4.551a1.2 1.2 0 0 1 .849-.351H17.4a1.2 1.2 0 0 1 1.2 1.2v12.103a1.2 1.2 0 0 1-.352.849l-1.097 1.096a1.2 1.2 0 0 1-.848.352H6.6a1.2 1.2 0 0 1-1.2-1.2V6.497a1.2 1.2 0 0 1 .351-.848z" /><path fill="var(--hop-Richicon-placeholder-fill, #fff)" fillRule="evenodd" d="M7.8 5.2h9.6c.11 0 .2.09.2.2v12a.2.2 0 0 1-.2.2H7.8a.2.2 0 0 1-.2-.2v-12c0-.11.09-.2.2-.2m5.4 3.1h3v-1h-3zm3 3.6h-3v-1h3zm-3 3.6h3v-1h-3zm-1.427-8.377-1.757 2.19a.5.5 0 0 1-.743.04l-.98-.978L9 7.667l.585.585 1.408-1.755zm-1.757 5.533 1.757-2.19-.78-.626-1.408 1.755L9 11.01l-.707.708.98.979a.5.5 0 0 0 .743-.041m1.757 1.41-1.757 2.19a.5.5 0 0 1-.743.04l-.98-.978L9 14.61l.585.585 1.408-1.755z" /></svg>);
const ActionListRichIcon32 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={32} height={32} viewBox="0 0 32 32" ref={ref} {...props}><path fill="var(--hop-Richicon-placeholder-shadow, #E5DED6)" d="M0 16C0 7.163 7.163 0 16 0s16 7.163 16 16-7.163 16-16 16S0 24.837 0 16" /><path fill="var(--hop-Richicon-placeholder-background, #2A2620)" d="M9.131 6.069a1.6 1.6 0 0 1 1.132-.469H23.2a1.6 1.6 0 0 1 1.6 1.6v16.137a1.6 1.6 0 0 1-.469 1.132L22.87 25.93a1.6 1.6 0 0 1-1.132.469H8.8a1.6 1.6 0 0 1-1.6-1.6V8.663a1.6 1.6 0 0 1 .469-1.132z" /><path fill="var(--hop-Richicon-placeholder-fill, #fff)" d="M10.4 6.6h12.8a.6.6 0 0 1 .6.6v16a.6.6 0 0 1-.6.6H10.4a.6.6 0 0 1-.6-.6v-16a.6.6 0 0 1 .6-.6" /><path fill="var(--hop-Richicon-placeholder-background, #2A2620)" fillRule="evenodd" d="M21.6 10.9h-4v-1h4zm0 4.8h-4v-1h4zm0 4.8h-4v-1h4zM15.463 9.523l-2.238 2.79a.5.5 0 0 1-.744.04l-1.188-1.187.707-.707.794.793 1.889-2.355zm0 4.457-2.238 2.79a.5.5 0 0 1-.744.04l-1.188-1.187.707-.707.794.793 1.889-2.355zm0 4.8-2.238 2.79a.5.5 0 0 1-.744.04l-1.188-1.187.707-.707.794.793 1.889-2.355z" /></svg>);
const ActionListRichIcon40 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={40} height={40} viewBox="0 0 40 40" ref={ref} {...props}><path fill="var(--hop-Richicon-placeholder-shadow, #E5DED6)" d="M0 20C0 8.954 8.954 0 20 0s20 8.954 20 20-8.954 20-20 20S0 31.046 0 20" /><path fill="var(--hop-Richicon-placeholder-background, #2A2620)" d="M11.414 7.586A2 2 0 0 1 12.828 7H29a2 2 0 0 1 2 2v20.172a2 2 0 0 1-.586 1.414l-1.828 1.828a2 2 0 0 1-1.414.586H11a2 2 0 0 1-2-2V10.828a2 2 0 0 1 .586-1.414z" /><path fill="var(--hop-Richicon-placeholder-fill, #fff)" d="M13 8.25h16a.75.75 0 0 1 .75.75v20a.75.75 0 0 1-.75.75H13a.75.75 0 0 1-.75-.75V9a.75.75 0 0 1 .75-.75" /><path fill="var(--hop-Richicon-placeholder-background, #2A2620)" fillRule="evenodd" d="M27 13.625h-5v-1.25h5zm0 6h-5v-1.25h5zm0 6h-5v-1.25h5zm-7.671-13.721L16.53 15.39a.625.625 0 0 1-.93.051l-1.485-1.484.884-.884.992.991 2.361-2.944zm0 5.571-2.798 3.487a.625.625 0 0 1-.93.052l-1.485-1.485.884-.884.992.992 2.361-2.944zm0 6-2.798 3.487a.625.625 0 0 1-.93.052l-1.485-1.485.884-.884.992.992 2.361-2.944z" /></svg>);
const ActionListRichIcon24 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={24} height={24} viewBox="0 0 24 24" ref={ref} {...props}><path fill="var(--hop-RichIcon-placeholder-background, #E5DED6)" d="M0 12C0 5.373 5.373 0 12 0s12 5.373 12 12-5.373 12-12 12S0 18.627 0 12" /><path fill="var(--hop-RichIcon-placeholder-shadow, #2A2620)" d="M6.848 4.551a1.2 1.2 0 0 1 .849-.351H17.4a1.2 1.2 0 0 1 1.2 1.2v12.103a1.2 1.2 0 0 1-.352.849l-1.097 1.096a1.2 1.2 0 0 1-.848.352H6.6a1.2 1.2 0 0 1-1.2-1.2V6.497a1.2 1.2 0 0 1 .351-.848z" /><path fill="var(--hop-RichIcon-placeholder-fill, #fff)" fillRule="evenodd" d="M7.8 5.2h9.6c.11 0 .2.09.2.2v12a.2.2 0 0 1-.2.2H7.8a.2.2 0 0 1-.2-.2v-12c0-.11.09-.2.2-.2m5.4 3.1h3v-1h-3zm3 3.6h-3v-1h3zm-3 3.6h3v-1h-3zm-1.427-8.377-1.757 2.19a.5.5 0 0 1-.743.04l-.98-.978L9 7.667l.585.585 1.408-1.755zm-1.757 5.533 1.757-2.19-.78-.626-1.408 1.755L9 11.01l-.707.708.98.979a.5.5 0 0 0 .743-.041m1.757 1.41-1.757 2.19a.5.5 0 0 1-.743.04l-.98-.978L9 14.61l.585.585 1.408-1.755z" /></svg>);
const ActionListRichIcon32 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={32} height={32} viewBox="0 0 32 32" ref={ref} {...props}><path fill="var(--hop-RichIcon-placeholder-background, #E5DED6)" d="M0 16C0 7.163 7.163 0 16 0s16 7.163 16 16-7.163 16-16 16S0 24.837 0 16" /><path fill="var(--hop-RichIcon-placeholder-shadow, #2A2620)" d="M9.131 6.069a1.6 1.6 0 0 1 1.132-.469H23.2a1.6 1.6 0 0 1 1.6 1.6v16.137a1.6 1.6 0 0 1-.469 1.132L22.87 25.93a1.6 1.6 0 0 1-1.132.469H8.8a1.6 1.6 0 0 1-1.6-1.6V8.663a1.6 1.6 0 0 1 .469-1.132z" /><path fill="var(--hop-RichIcon-placeholder-fill, #fff)" d="M10.4 6.6h12.8a.6.6 0 0 1 .6.6v16a.6.6 0 0 1-.6.6H10.4a.6.6 0 0 1-.6-.6v-16a.6.6 0 0 1 .6-.6" /><path fill="var(--hop-RichIcon-placeholder-shadow, #2A2620)" fillRule="evenodd" d="M21.6 10.9h-4v-1h4zm0 4.8h-4v-1h4zm0 4.8h-4v-1h4zM15.463 9.523l-2.238 2.79a.5.5 0 0 1-.744.04l-1.188-1.187.707-.707.794.793 1.889-2.355zm0 4.457-2.238 2.79a.5.5 0 0 1-.744.04l-1.188-1.187.707-.707.794.793 1.889-2.355zm0 4.8-2.238 2.79a.5.5 0 0 1-.744.04l-1.188-1.187.707-.707.794.793 1.889-2.355z" /></svg>);
const ActionListRichIcon40 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={40} height={40} viewBox="0 0 40 40" ref={ref} {...props}><path fill="var(--hop-RichIcon-placeholder-background, #E5DED6)" d="M0 20C0 8.954 8.954 0 20 0s20 8.954 20 20-8.954 20-20 20S0 31.046 0 20" /><path fill="var(--hop-RichIcon-placeholder-shadow, #2A2620)" d="M11.414 7.586A2 2 0 0 1 12.828 7H29a2 2 0 0 1 2 2v20.172a2 2 0 0 1-.586 1.414l-1.828 1.828a2 2 0 0 1-1.414.586H11a2 2 0 0 1-2-2V10.828a2 2 0 0 1 .586-1.414z" /><path fill="var(--hop-RichIcon-placeholder-fill, #fff)" d="M13 8.25h16a.75.75 0 0 1 .75.75v20a.75.75 0 0 1-.75.75H13a.75.75 0 0 1-.75-.75V9a.75.75 0 0 1 .75-.75" /><path fill="var(--hop-RichIcon-placeholder-shadow, #2A2620)" fillRule="evenodd" d="M27 13.625h-5v-1.25h5zm0 6h-5v-1.25h5zm0 6h-5v-1.25h5zm-7.671-13.721L16.53 15.39a.625.625 0 0 1-.93.051l-1.485-1.484.884-.884.992.991 2.361-2.944zm0 5.571-2.798 3.487a.625.625 0 0 1-.93.052l-1.485-1.485.884-.884.992.992 2.361-2.944zm0 6-2.798 3.487a.625.625 0 0 1-.93.052l-1.485-1.485.884-.884.992.992 2.361-2.944z" /></svg>);

export const ActionListRichIcon = createRichIcon(ActionListRichIcon24, ActionListRichIcon32, ActionListRichIcon40, "ActionListRichIcon");
6 changes: 3 additions & 3 deletions packages/icons-react16/src/generated-rich-icon-components/AnonymousRichIcon.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
import { createRichIcon } from "../createRichIcon.tsx";
import React, { forwardRef, type Ref, type SVGProps } from "react";

const AnonymousRichIcon24 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={24} height={24} viewBox="0 0 24 24" ref={ref} {...props}><path fill="var(--hop-Richicon-placeholder-shadow, #E5DED6)" d="M0 12C0 5.373 5.373 0 12 0s12 5.373 12 12-5.373 12-12 12S0 18.627 0 12" /><path fill="var(--hop-Richicon-placeholder-background, #2A2620)" d="M20.4 11.4c0 2.46-.983 4.417-2.7 6-1.583 1.717-3.84 3-6.3 3a7.8 7.8 0 0 1-7.8-7.8c0-2.46.9-3.9 2.4-5.7 1.77-2.125 4.14-3.3 6.6-3.3a7.8 7.8 0 0 1 7.8 7.8" /><path fill="var(--hop-Richicon-placeholder-fill, #fff)" fillRule="evenodd" d="M12.6 18.2a6.8 6.8 0 1 0 0-13.6 6.8 6.8 0 0 0 0 13.6m-3-7.361a1.2 1.2 0 1 0 0-2.4 1.2 1.2 0 0 0 0 2.4m7.2-1.2a1.2 1.2 0 1 1-2.4 0 1.2 1.2 0 0 1 2.4 0m-7.557 3.248a.5.5 0 0 0-.78.626A5.3 5.3 0 0 0 12.6 15.5a5.3 5.3 0 0 0 4.137-1.987.5.5 0 0 0-.78-.626A4.29 4.29 0 0 1 12.6 14.5a4.3 4.3 0 0 1-3.357-1.613" /></svg>);
const AnonymousRichIcon32 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={32} height={32} viewBox="0 0 32 32" ref={ref} {...props}><path fill="var(--hop-Richicon-placeholder-shadow, #E5DED6)" d="M0 16C0 7.163 7.163 0 16 0s16 7.163 16 16-7.163 16-16 16S0 24.837 0 16" /><path fill="var(--hop-Richicon-placeholder-background, #2A2620)" d="M27.2 15.2c0 3.28-1.31 5.89-3.6 8-2.11 2.29-5.12 4-8.4 4-5.744 0-10.4-4.656-10.4-10.4 0-3.28 1.2-5.2 3.2-7.6 2.36-2.833 5.52-4.4 8.8-4.4 5.744 0 10.4 4.656 10.4 10.4" /><path fill="var(--hop-Richicon-placeholder-fill, #fff)" fillRule="evenodd" d="M16.8 24.6a9.4 9.4 0 1 0 0-18.8 9.4 9.4 0 0 0 0 18.8m-4-10.2a1.2 1.2 0 1 0 0-2.4 1.2 1.2 0 0 0 0 2.4m9.2-1.2a1.2 1.2 0 1 1-2.4 0 1.2 1.2 0 0 1 2.4 0m-9.806 4.087a.5.5 0 0 0-.78.626A6.89 6.89 0 0 0 16.8 20.5c2.18 0 4.123-1.01 5.386-2.587a.5.5 0 1 0-.78-.626A5.89 5.89 0 0 1 16.8 19.5a5.89 5.89 0 0 1-4.606-2.213" /></svg>);
const AnonymousRichIcon40 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={40} height={40} viewBox="0 0 40 40" ref={ref} {...props}><path fill="var(--hop-Richicon-placeholder-shadow, #E5DED6)" d="M0 20C0 8.954 8.954 0 20 0s20 8.954 20 20-8.954 20-20 20S0 31.046 0 20" /><path fill="var(--hop-Richicon-placeholder-background, #2A2620)" d="M34 19c0 4.1-1.638 7.362-4.5 10-2.638 2.862-6.4 5-10.5 5-7.18 0-13-5.82-13-13 0-4.1 1.5-6.5 4-9.5C12.951 7.959 16.9 6 21 6c7.18 0 13 5.82 13 13" /><path fill="var(--hop-Richicon-placeholder-fill, #fff)" fillRule="evenodd" d="M21 30.75c6.49 0 11.75-5.26 11.75-11.75S27.49 7.25 21 7.25 9.25 12.51 9.25 19 14.51 30.75 21 30.75M16 18a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3m11.5-1.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m-12.258 5.11a.625.625 0 0 0-.975.78A8.61 8.61 0 0 0 21 25.626a8.61 8.61 0 0 0 6.733-3.234.625.625 0 1 0-.975-.782A7.36 7.36 0 0 1 21 24.375a7.36 7.36 0 0 1-5.758-2.766" /></svg>);
const AnonymousRichIcon24 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={24} height={24} viewBox="0 0 24 24" ref={ref} {...props}><path fill="var(--hop-RichIcon-placeholder-background, #E5DED6)" d="M0 12C0 5.373 5.373 0 12 0s12 5.373 12 12-5.373 12-12 12S0 18.627 0 12" /><path fill="var(--hop-RichIcon-placeholder-shadow, #2A2620)" d="M20.4 11.4c0 2.46-.983 4.417-2.7 6-1.583 1.717-3.84 3-6.3 3a7.8 7.8 0 0 1-7.8-7.8c0-2.46.9-3.9 2.4-5.7 1.77-2.125 4.14-3.3 6.6-3.3a7.8 7.8 0 0 1 7.8 7.8" /><path fill="var(--hop-RichIcon-placeholder-fill, #fff)" fillRule="evenodd" d="M12.6 18.2a6.8 6.8 0 1 0 0-13.6 6.8 6.8 0 0 0 0 13.6m-3-7.361a1.2 1.2 0 1 0 0-2.4 1.2 1.2 0 0 0 0 2.4m7.2-1.2a1.2 1.2 0 1 1-2.4 0 1.2 1.2 0 0 1 2.4 0m-7.557 3.248a.5.5 0 0 0-.78.626A5.3 5.3 0 0 0 12.6 15.5a5.3 5.3 0 0 0 4.137-1.987.5.5 0 0 0-.78-.626A4.29 4.29 0 0 1 12.6 14.5a4.3 4.3 0 0 1-3.357-1.613" /></svg>);
const AnonymousRichIcon32 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={32} height={32} viewBox="0 0 32 32" ref={ref} {...props}><path fill="var(--hop-RichIcon-placeholder-background, #E5DED6)" d="M0 16C0 7.163 7.163 0 16 0s16 7.163 16 16-7.163 16-16 16S0 24.837 0 16" /><path fill="var(--hop-RichIcon-placeholder-shadow, #2A2620)" d="M27.2 15.2c0 3.28-1.31 5.89-3.6 8-2.11 2.29-5.12 4-8.4 4-5.744 0-10.4-4.656-10.4-10.4 0-3.28 1.2-5.2 3.2-7.6 2.36-2.833 5.52-4.4 8.8-4.4 5.744 0 10.4 4.656 10.4 10.4" /><path fill="var(--hop-RichIcon-placeholder-fill, #fff)" fillRule="evenodd" d="M16.8 24.6a9.4 9.4 0 1 0 0-18.8 9.4 9.4 0 0 0 0 18.8m-4-10.2a1.2 1.2 0 1 0 0-2.4 1.2 1.2 0 0 0 0 2.4m9.2-1.2a1.2 1.2 0 1 1-2.4 0 1.2 1.2 0 0 1 2.4 0m-9.806 4.087a.5.5 0 0 0-.78.626A6.89 6.89 0 0 0 16.8 20.5c2.18 0 4.123-1.01 5.386-2.587a.5.5 0 1 0-.78-.626A5.89 5.89 0 0 1 16.8 19.5a5.89 5.89 0 0 1-4.606-2.213" /></svg>);
const AnonymousRichIcon40 = forwardRef((props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => <svg width={40} height={40} viewBox="0 0 40 40" ref={ref} {...props}><path fill="var(--hop-RichIcon-placeholder-background, #E5DED6)" d="M0 20C0 8.954 8.954 0 20 0s20 8.954 20 20-8.954 20-20 20S0 31.046 0 20" /><path fill="var(--hop-RichIcon-placeholder-shadow, #2A2620)" d="M34 19c0 4.1-1.638 7.362-4.5 10-2.638 2.862-6.4 5-10.5 5-7.18 0-13-5.82-13-13 0-4.1 1.5-6.5 4-9.5C12.951 7.959 16.9 6 21 6c7.18 0 13 5.82 13 13" /><path fill="var(--hop-RichIcon-placeholder-fill, #fff)" fillRule="evenodd" d="M21 30.75c6.49 0 11.75-5.26 11.75-11.75S27.49 7.25 21 7.25 9.25 12.51 9.25 19 14.51 30.75 21 30.75M16 18a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3m11.5-1.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m-12.258 5.11a.625.625 0 0 0-.975.78A8.61 8.61 0 0 0 21 25.626a8.61 8.61 0 0 0 6.733-3.234.625.625 0 1 0-.975-.782A7.36 7.36 0 0 1 21 24.375a7.36 7.36 0 0 1-5.758-2.766" /></svg>);

export const AnonymousRichIcon = createRichIcon(AnonymousRichIcon24, AnonymousRichIcon32, AnonymousRichIcon40, "AnonymousRichIcon");
Loading

0 comments on commit c9d0197

Please sign in to comment.