✨ feat: Add SiliconCloud icon

sxjeru · sxjeru · commit e39bdc2e926d · 2024-06-28T14:36:01.000Z
diff --git a/README.md b/README.md
diff --git a/src/SiliconCloud/components/Avatar.tsx b/src/SiliconCloud/components/Avatar.tsx
@@ -0,0 +1,23 @@
+import { memo } from 'react';
+
+import IconAvatar, { type IconAvatarProps } from '@/IconAvatar';
+
+import { TITLE } from '../style';
+import Color from './Color';
+
+export type AvatarProps = Omit<IconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
+  return (
+    <IconAvatar
+      Icon={Color}
+      aria-label={TITLE}
+      background={background}
+      iconMultiple={1.12}
+      shape={'square'}
+      {...rest}
+    />
+  );
+});
+
+export default Avatar;
diff --git a/src/SiliconCloud/components/Color.tsx b/src/SiliconCloud/components/Color.tsx
@@ -0,0 +1,29 @@
+import { forwardRef } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = forwardRef(({ size = '1em', style, ...rest }, ref) => {
+  return (
+    <svg
+      height={size}
+      ref={ref}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="-0.5 0 28 28"
+      width={size}
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path
+        clipRule="evenodd"
+        d="M0 5.887v16.226a5.408 5.408 0 005.408 5.408h16.226a5.408 5.408 0 005.408-5.408V5.887A5.408 5.408 0 0021.634.48H5.408A5.408 5.408 0 000 5.887zm21.709-3.53h-1.69c-5.409 0-8.526 3.455-8.526 8.75v.909a6.948 6.948 0 104.893 5.289h5.323a2.545 2.545 0 000-5.09h-5.296v-1.332c0-2.029 1.465-3.493 3.606-3.493h1.69a2.517 2.517 0 000-5.033zM11.643 18.695a2.066 2.066 0 10-4.131 0 2.066 2.066 0 004.131 0z"
+        fill="#7C3AED"
+        fillRule="evenodd"
+      ></path>
+    </svg>
+  );
+});
+
+export default Icon;
diff --git a/src/SiliconCloud/components/Combine.tsx b/src/SiliconCloud/components/Combine.tsx
@@ -0,0 +1,29 @@
+import { memo } from 'react';
+
+import IconCombine, { type IconCombineProps } from '@/IconCombine';
+
+import { SPACE_MULTIPLE, TEXT_MULTIPLE, TITLE } from '../style';
+import Color from './Color';
+import Mono from './Mono';
+import Text from './Text';
+
+export interface CombineProps extends Omit<IconCombineProps, 'Icon' | 'Text'> {
+  type?: 'color' | 'mono';
+}
+const Combine = memo<CombineProps>(({ type = 'mono', extraStyle, ...rest }) => {
+  const Icon = type === 'color' ? Color : Mono;
+
+  return (
+    <IconCombine
+      Icon={Icon}
+      Text={Text}
+      aria-label={TITLE}
+      extraStyle={{ fontWeight: 500, ...extraStyle }}
+      spaceMultiple={SPACE_MULTIPLE}
+      textMultiple={TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
diff --git a/src/SiliconCloud/components/Mono.tsx b/src/SiliconCloud/components/Mono.tsx
@@ -0,0 +1,29 @@
+import { forwardRef } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = forwardRef(({ size = '1em', style, ...rest }, ref) => {
+  return (
+    <svg
+      fill="currentColor"
+      fillRule="evenodd"
+      height={size}
+      ref={ref}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="-0.5 0 28 28"
+      width={size}
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path
+        clipRule="evenodd"
+        d="M0 5.887v16.226a5.408 5.408 0 005.408 5.408h16.226a5.408 5.408 0 005.408-5.408V5.887A5.408 5.408 0 0021.634.48H5.408A5.408 5.408 0 000 5.887zm21.709-3.53h-1.69c-5.409 0-8.526 3.455-8.526 8.75v.909a6.948 6.948 0 104.893 5.289h5.323a2.545 2.545 0 000-5.09h-5.296v-1.332c0-2.029 1.465-3.493 3.606-3.493h1.69a2.517 2.517 0 000-5.033zM11.643 18.695a2.066 2.066 0 10-4.131 0 2.066 2.066 0 004.131 0z"
+      ></path>
+    </svg>
+  );
+});
+
+export default Icon;
diff --git a/src/SiliconCloud/components/Text.tsx b/src/SiliconCloud/components/Text.tsx
@@ -0,0 +1,28 @@
+import { forwardRef } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = forwardRef(({ size = '1em', style, ...rest }, ref) => {
+  return (
+    <svg
+      fill="currentColor"
+      fillRule="evenodd"
+      height={size}
+      ref={ref}
+      style={{ flex: 'none', lineHeight: 1, width: 'fit-content', ...style }}
+      viewBox="30 0 189 28"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path
+        clipRule="evenodd"
+        d="M53.845 22V6h2.785v16h-2.785zm7.598-16v12.534h13.99V22H60.487c-.499 0-.928-.219-1.289-.656-.36-.438-.54-.972-.54-1.602V6h2.785zM78.17 22V6h2.784v16H78.17zm55.782-3.466V6h2.66v16h-2.66L122.54 9.555V22h-2.66V7.245c0-.315.083-.586.249-.814.166-.228.374-.341.624-.341h1.787l11.413 12.444zM160.897 6v12.534h13.99V22h-14.946c-.499 0-.928-.219-1.288-.656-.36-.438-.54-.972-.54-1.602V6h2.784zm53.649 14.11c.998-1.26 1.496-2.766 1.496-4.516V6h-2.743v9.594c0 .805-.229 1.488-.686 2.048-.457.56-1.004.84-1.641.84h-3.782V6h-2.66v12.482h-3.824c-.637 0-1.178-.28-1.621-.84-.443-.56-.665-1.243-.665-2.048V6h-2.743v9.594c0 1.75.492 3.255 1.475 4.516.984 1.26 2.169 1.89 3.554 1.89h10.266c1.385 0 2.577-.63 3.574-1.89zM89.301 18.534H99.8V22H89.301c-1.136 0-2.189-.359-3.159-1.076-.97-.718-1.738-1.68-2.306-2.889-.568-1.207-.852-2.529-.852-3.964 0-1.47.284-2.81.852-4.017.568-1.208 1.337-2.17 2.306-2.888.97-.717 2.023-1.076 3.16-1.076H99.8v3.465H89.301c-.97 0-1.8.438-2.493 1.313-.693.875-1.04 1.943-1.04 3.203 0 1.225.347 2.275 1.04 3.15.692.876 1.523 1.313 2.493 1.313zm27.075 1.602c-.984 1.243-2.182 1.864-3.595 1.864h-6.634c-1.385 0-2.569-.621-3.553-1.864s-1.476-2.74-1.476-4.49v-3.15c0-1.75.492-3.256 1.476-4.516.984-1.26 2.168-1.89 3.553-1.89h6.634c1.413 0 2.611.63 3.595 1.89.984 1.26 1.476 2.765 1.476 4.516v3.15c0 1.75-.492 3.247-1.476 4.49zM155.374 6.09v3.465h-14.053v2.73h14.053v3.466h-13.989V22h-2.744v-8.267h-.007V6.5h.007v-.41h16.733zm36.799 14.046c-.983 1.243-2.182 1.864-3.595 1.864h-6.634c-1.385 0-2.569-.621-3.553-1.864s-1.475-2.74-1.475-4.49v-3.15c0-1.75.491-3.256 1.475-4.516.984-1.26 2.168-1.89 3.553-1.89h6.634c1.413 0 2.612.63 3.595 1.89.984 1.26 1.476 2.765 1.476 4.516v3.15c0 1.75-.492 3.247-1.476 4.49zm-141.478.446c-.748.945-1.649 1.418-2.702 1.418h-12.95v-3.466h12.95c.305 0 .561-.13.77-.393.207-.263.31-.587.31-.972s-.103-.709-.31-.971c-.209-.263-.465-.394-.77-.394h-9.127c-1.053 0-1.953-.473-2.702-1.418-.748-.945-1.122-2.083-1.122-3.413 0-1.33.374-2.468 1.122-3.413.748-.945 1.649-1.418 2.702-1.418H51.11v3.466H38.866c-.305 0-.561.131-.769.394-.208.262-.312.586-.312.971s.104.709.312.971c.208.263.464.394.769.394h9.127c1.053 0 1.954.473 2.702 1.418s1.122 2.083 1.122 3.413c0 1.33-.374 2.468-1.122 3.413zm63.728-10.134c-.458-.56-1.005-.84-1.642-.84h-6.634c-.637 0-1.177.28-1.62.84-.444.56-.666 1.243-.666 2.048v3.15c.001.805.222 1.488.666 2.048.443.56.983.84 1.62.84h6.634c.637 0 1.185-.28 1.642-.84.457-.56.686-1.242.686-2.048v-3.15c0-.805-.229-1.488-.686-2.048zm75.797 0c-.457-.56-1.005-.84-1.642-.84h-6.634c-.637 0-1.177.28-1.62.84-.444.56-.665 1.243-.665 2.048v3.15c0 .805.221 1.488.665 2.048.443.56.983.84 1.62.84h6.634c.637 0 1.185-.28 1.642-.84.457-.56.686-1.242.686-2.048v-3.15c0-.805-.229-1.488-.686-2.048z"
+      ></path>
+    </svg>
+  );
+});
+
+export default Icon;
diff --git a/src/SiliconCloud/index.md b/src/SiliconCloud/index.md
@@ -0,0 +1,73 @@
+---
+nav: Components
+group: Provider
+title: SiliconCloud (SiliconFlow)
+atomId: SiliconCloud
+description: https://siliconflow.cn/zh-cn/
+---
+
+## Icons
+
+```tsx
+import { SiliconCloud } from '@lobehub/icons';
+import { Flexbox } from 'react-layout-kit';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <SiliconCloud size={64} />
+    <SiliconCloud.Color size={64} />
+  </Flexbox>
+);
+```
+
+## Text
+
+```tsx
+import { SiliconCloud } from '@lobehub/icons';
+
+export default () => <SiliconCloud.Text size={48} />;
+```
+
+## Combine
+
+```tsx
+import { SiliconCloud } from '@lobehub/icons';
+import { Flexbox } from 'react-layout-kit';
+
+export default () => (
+  <Flexbox gap={16}>
+    <SiliconCloud.Combine size={64} />
+    <SiliconCloud.Combine size={64} type={'color'} />
+  </Flexbox>
+);
+```
+
+## Avatars
+
+```tsx
+import { SiliconCloud } from '@lobehub/icons';
+import { Flexbox } from 'react-layout-kit';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <SiliconCloud.Avatar size={64} background={SiliconCloud.colorPrimary} />
+    <SiliconCloud.Avatar size={64} />
+    <SiliconCloud.Avatar size={64} shape={'square'} />
+  </Flexbox>
+);
+```
+
+## Colors
+
+```tsx
+import { SiliconCloud } from '@lobehub/icons';
+import { Flexbox } from 'react-layout-kit';
+
+import ColorPreview from '../components/ColorPreview';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <ColorPreview color={SiliconCloud.colorPrimary} />
+  </Flexbox>
+);
+```
diff --git a/src/SiliconCloud/index.ts b/src/SiliconCloud/index.ts
@@ -0,0 +1,25 @@
+import Avatar from './components/Avatar';
+import Color from './components/Color';
+import Combine from './components/Combine';
+import Mono from './components/Mono';
+import Text from './components/Text';
+import { COLOR_PRIMARY, TITLE } from './style';
+
+export type CompoundedIcon = typeof Mono & {
+  Avatar: typeof Avatar;
+  Color: typeof Color;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Color = Color;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+
+export default Icons;
diff --git a/src/SiliconCloud/style.ts b/src/SiliconCloud/style.ts
@@ -0,0 +1,4 @@
+export const TITLE = 'SiliconCloud';
+export const TEXT_MULTIPLE = 0.75;
+export const SPACE_MULTIPLE = 0.3;
+export const COLOR_PRIMARY = '#EEEEEE';
diff --git a/src/index.ts b/src/index.ts
@@ -58,6 +58,7 @@ export { default as Pollinations, type CompoundedIcon as PollinationsProps } fro
 export { default as Qingyan, type CompoundedIcon as QingyanProps } from './Qingyan';
 export { default as Replicate, type CompoundedIcon as ReplicateProps } from './Replicate';
 export { default as Rwkv, type CompoundedIcon as RwkvProps } from './Rwkv';
+export { default as SiliconCloud, type CompoundedIcon as SiliconCloudProps } from './SiliconCloud';
 export { default as Spark, type CompoundedIcon as SparkProps } from './Spark';
 export { default as Stability, type CompoundedIcon as StabilityProps } from './Stability';
 export { default as Stepfun, type CompoundedIcon as StepfunProps } from './Stepfun';
