💄 style: Add Bfl

canisminor1990 · canisminor1990 · commit 25d8264918bf · 2025-08-15T23:44:01.000+08:00
diff --git a/src/Bfl/components/Avatar.tsx b/src/Bfl/components/Avatar.tsx
@@ -0,0 +1,25 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconAvatar, { type IconAvatarProps } from '@/features/IconAvatar';
+
+import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+
+export type AvatarProps = Omit<IconAvatarProps, 'Icon'>;
+
+const Avatar = memo<AvatarProps>(({ ...rest }) => {
+  return (
+    <IconAvatar
+      Icon={Mono}
+      aria-label={TITLE}
+      background={AVATAR_BACKGROUND}
+      color={AVATAR_COLOR}
+      iconMultiple={AVATAR_ICON_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Avatar;
diff --git a/src/Bfl/components/Combine.tsx b/src/Bfl/components/Combine.tsx
@@ -0,0 +1,26 @@
+'use client';
+
+import { memo } from 'react';
+
+import IconCombine, { type IconCombineProps } from '@/features/IconCombine';
+
+import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
+import Mono from './Mono';
+import Text from './Text';
+
+export type CombineProps = Omit<IconCombineProps, 'Icon' | 'Text'>;
+
+const Combine = memo<CombineProps>(({ ...rest }) => {
+  return (
+    <IconCombine
+      Icon={Mono}
+      Text={Text as any}
+      aria-label={TITLE}
+      spaceMultiple={COMBINE_SPACE_MULTIPLE}
+      textMultiple={COMBINE_TEXT_MULTIPLE}
+      {...rest}
+    />
+  );
+});
+
+export default Combine;
diff --git a/src/Bfl/components/Mono.tsx b/src/Bfl/components/Mono.tsx
@@ -0,0 +1,27 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      fill="currentColor"
+      fillRule="evenodd"
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 24 24"
+      width={size}
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path d="M17.113 10.248H14.56l-2.553-3.616-7.963 11.27h2.558l5.405-7.654h2.552l-5.404 7.653h2.565l5.392-7.653L24 20 19.97 20v-2.091l-2.857-4.044-2.842 4.037V20H0L12.008 3l5.105 7.249z" />
+    </svg>
+  );
+});
+
+export default Icon;
diff --git a/src/Bfl/components/Text.tsx b/src/Bfl/components/Text.tsx
@@ -0,0 +1,26 @@
+'use client';
+
+import { memo } from 'react';
+
+import type { IconType } from '@/types';
+
+import { TITLE } from '../style';
+
+const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
+  return (
+    <svg
+      fill="currentColor"
+      fillRule="nonzero"
+      height={size}
+      style={{ flex: 'none', lineHeight: 1, ...style }}
+      viewBox="0 0 207 24"
+      xmlns="http://www.w3.org/2000/svg"
+      {...rest}
+    >
+      <title>{TITLE}</title>
+      <path d="M4.764 21.728v-2.605h5.447c.994 0 1.762-.271 2.304-.814.542-.56.813-1.32.813-2.28 0-.994-.29-1.781-.868-2.36-.578-.58-1.382-.869-2.412-.869H4.765v-2.605h5.04c.976 0 1.726-.235 2.25-.705s.786-1.149.786-2.036c0-.868-.253-1.528-.759-1.98-.488-.453-1.21-.679-2.168-.679H4.764V2.19h5.8c1.752 0 3.152.443 4.2 1.33 1.066.868 1.599 2.053 1.599 3.555 0 .94-.226 1.763-.678 2.47a4.432 4.432 0 01-1.761 1.6c-.74.38-1.581.57-2.52.57l.135-.57c.994 0 1.897.226 2.71.678a4.844 4.844 0 011.924 1.846c.488.796.732 1.718.732 2.768 0 1.067-.253 1.999-.759 2.795-.488.796-1.183 1.411-2.087 1.845-.885.434-1.933.651-3.143.651H4.764zm-2.764 0V2.19h3.523v19.538H2zm16.518 0V2.19h3.415v19.538h-3.415zm14.574 0a10.089 10.089 0 01-.217-1.194 19.36 19.36 0 01-.054-1.573h-.109v-6.567c0-.724-.208-1.267-.623-1.629-.397-.38-1.012-.57-1.843-.57-.813 0-1.463.154-1.951.462-.47.29-.759.714-.867 1.275h-3.28c.145-1.284.76-2.325 1.843-3.12 1.085-.797 2.539-1.195 4.364-1.195 1.896 0 3.333.434 4.308 1.303.976.85 1.464 2.107 1.464 3.772v6.268c0 .435.027.878.081 1.33.079.483.178.963.298 1.438h-3.414zM28.295 22c-1.391 0-2.502-.344-3.333-1.032-.813-.705-1.22-1.646-1.22-2.822 0-1.266.46-2.27 1.382-3.012.922-.742 2.222-1.239 3.902-1.492l4.31-.652v2.171l-3.74.57c-.813.127-1.427.353-1.843.679-.398.325-.596.777-.596 1.357 0 .524.19.931.569 1.22.38.272.903.408 1.572.408.975 0 1.788-.245 2.439-.733.65-.488.975-1.085.975-1.791l.38 2.09c-.362.995-.958 1.754-1.789 2.279-.813.507-1.816.76-3.008.76zm15.984 0c-1.391 0-2.62-.308-3.686-.923a6.757 6.757 0 01-2.493-2.55c-.596-1.104-.894-2.353-.894-3.746 0-1.393.298-2.623.894-3.69a6.757 6.757 0 012.493-2.55c1.066-.616 2.295-.924 3.686-.924 1.138 0 2.168.217 3.09.652a5.848 5.848 0 012.275 1.79c.597.76.976 1.647 1.139 2.66h-3.28c-.198-.742-.578-1.32-1.138-1.737-.56-.416-1.237-.624-2.032-.624-.74 0-1.382.181-1.924.543-.524.362-.93.877-1.22 1.547-.289.669-.433 1.447-.433 2.333 0 .905.144 1.692.433 2.361.29.67.705 1.194 1.247 1.574.542.362 1.174.543 1.897.543.795 0 1.472-.208 2.032-.624.56-.416.94-.995 1.139-1.737h3.279a5.719 5.719 0 01-1.166 2.687 6.201 6.201 0 01-2.276 1.79c-.903.417-1.924.625-3.062.625zm7.88-.272V2h3.414v19.728h-3.415zm8.915 0l-6.287-7.19 6.097-6.65h4.12l-7.046 7.273.19-1.275 7.127 7.842h-4.2zm9.132 0V2.19h3.523v19.538h-3.523zm1.68-7.842V11.09h10.976v2.795H71.887zm0-8.9V2.19h11.626v2.795H71.887zM91.08 22c-1.464 0-2.755-.308-3.875-.923a6.587 6.587 0 01-2.575-2.55c-.614-1.104-.921-2.362-.921-3.773 0-1.41.307-2.65.921-3.717a6.456 6.456 0 012.575-2.497c1.12-.615 2.411-.923 3.875-.923 1.481 0 2.773.308 3.875.923a6.458 6.458 0 012.575 2.497c.614 1.067.921 2.306.921 3.717s-.316 2.669-.948 3.772a6.589 6.589 0 01-2.575 2.551c-1.102.615-2.385.923-3.848.923zm0-2.74c.722 0 1.373-.182 1.951-.544.578-.38 1.03-.904 1.355-1.574.325-.687.488-1.492.488-2.415 0-1.357-.361-2.424-1.084-3.202-.705-.778-1.608-1.167-2.71-1.167-1.102 0-2.015.389-2.737 1.167-.723.778-1.084 1.845-1.084 3.202 0 .923.162 1.728.488 2.415.343.67.794 1.194 1.355 1.574.578.362 1.237.543 1.978.543zm8.799 2.468V7.89h3.333v3.338h.081v10.502h-3.414zm3.414-7.218l-.352-3.283c.325-1.176.876-2.072 1.653-2.687.777-.615 1.707-.923 2.791-.923.38 0 .651.036.813.109v3.23a1.048 1.048 0 00-.379-.055 5.517 5.517 0 00-.596-.027c-1.319 0-2.304.29-2.954.868-.65.579-.976 1.502-.976 2.768zM115.269 22c-1.463 0-2.746-.308-3.848-.923a6.647 6.647 0 01-2.548-2.55c-.596-1.086-.894-2.335-.894-3.746 0-1.41.298-2.65.894-3.717a6.46 6.46 0 012.548-2.524c1.084-.615 2.348-.923 3.794-.923 1.373 0 2.565.29 3.577.868a5.882 5.882 0 012.358 2.389c.56 1.03.84 2.234.84 3.61a8.039 8.039 0 01-.109 1.356h-11.788v-2.388h9.16l-.705.65c0-1.302-.298-2.279-.894-2.93-.597-.65-1.427-.977-2.493-.977-1.157 0-2.078.398-2.765 1.194-.668.796-1.002 1.945-1.002 3.447 0 1.483.334 2.623 1.002 3.419.687.778 1.654 1.167 2.9 1.167.723 0 1.355-.136 1.897-.407a2.5 2.5 0 001.192-1.248h3.225c-.451 1.302-1.219 2.333-2.303 3.093-1.066.76-2.412 1.14-4.038 1.14zm13.556 0c-1.915 0-3.442-.398-4.58-1.194-1.138-.814-1.762-1.936-1.87-3.365h3.117c.09.705.424 1.24 1.002 1.6.578.363 1.355.544 2.331.544.885 0 1.545-.136 1.978-.408.452-.289.678-.696.678-1.22 0-.38-.127-.688-.38-.923-.253-.253-.731-.462-1.436-.624l-2.222-.516c-1.518-.326-2.647-.832-3.388-1.52-.722-.705-1.084-1.583-1.084-2.632 0-1.284.488-2.289 1.464-3.012.993-.742 2.357-1.113 4.092-1.113 1.716 0 3.089.371 4.119 1.113 1.048.723 1.626 1.728 1.734 3.012h-3.116a1.736 1.736 0 00-.867-1.275c-.47-.29-1.121-.434-1.951-.434-.777 0-1.365.126-1.762.38-.398.235-.596.587-.596 1.058 0 .362.153.67.46.922.308.236.823.444 1.545.625l2.385.542c1.355.308 2.376.841 3.062 1.601a3.82 3.82 0 011.057 2.687c0 1.32-.506 2.343-1.517 3.066-1.012.724-2.43 1.086-4.255 1.086zm13.202 0c-1.698 0-2.954-.398-3.767-1.194-.795-.814-1.192-2.027-1.192-3.636V4.74l3.441-1.275v13.786c0 .669.181 1.166.542 1.492.362.326.931.489 1.708.489.307 0 .578-.018.813-.055a6.61 6.61 0 00.704-.19v2.66c-.216.108-.524.19-.921.244a7.48 7.48 0 01-1.328.109zm-7.615-11.425V7.89h9.864v2.686h-9.864zm15.355 11.153V2.19h3.523v19.538h-3.523zm1.68 0v-2.795h11.436v2.795h-11.436zm21.286 0a10.276 10.276 0 01-.217-1.194 19.467 19.467 0 01-.054-1.573h-.108v-6.567c0-.724-.208-1.267-.623-1.629-.398-.38-1.012-.57-1.843-.57-.813 0-1.464.154-1.952.462-.469.29-.758.714-.867 1.275h-3.279c.145-1.284.759-2.325 1.843-3.12 1.084-.797 2.538-1.195 4.363-1.195 1.897 0 3.333.434 4.309 1.303.975.85 1.463 2.107 1.463 3.772v6.268c0 .435.027.878.082 1.33.078.483.178.963.298 1.438h-3.415zm-4.797.272c-1.391 0-2.502-.344-3.333-1.032-.813-.705-1.22-1.646-1.22-2.822 0-1.266.461-2.27 1.383-3.012.921-.742 2.222-1.239 3.902-1.492l4.309-.652v2.171l-3.74.57c-.813.127-1.427.353-1.843.679-.397.325-.596.777-.596 1.357 0 .524.19.931.569 1.22.38.272.904.408 1.572.408.976 0 1.789-.245 2.439-.733.65-.488.976-1.085.976-1.791l.379 2.09c-.361.995-.958 1.754-1.788 2.279-.814.507-1.816.76-3.009.76zm18.093 0c-1.319 0-2.403-.308-3.252-.923-.831-.633-1.346-1.501-1.545-2.605l.244-.027v3.283h-3.333V2.19h3.414v8.82l-.244-.055a3.922 3.922 0 011.654-2.442c.885-.597 1.978-.896 3.279-.896 1.228 0 2.294.299 3.197.896.922.579 1.636 1.402 2.141 2.47.506 1.067.759 2.324.759 3.771 0 1.466-.262 2.741-.786 3.827-.524 1.085-1.255 1.926-2.195 2.523-.939.597-2.05.896-3.333.896zm-.867-2.823c1.102 0 1.978-.38 2.628-1.14.651-.777.976-1.863.976-3.256 0-1.393-.334-2.47-1.003-3.229-.65-.76-1.526-1.14-2.628-1.14-1.085 0-1.961.39-2.629 1.167-.669.76-1.003 1.837-1.003 3.23s.334 2.47 1.003 3.229c.668.76 1.554 1.14 2.656 1.14zM199.228 22c-1.915 0-3.442-.398-4.58-1.194-1.138-.814-1.762-1.936-1.87-3.365h3.117c.09.705.424 1.24 1.002 1.6.578.363 1.355.544 2.331.544.885 0 1.544-.136 1.978-.408.452-.289.678-.696.678-1.22 0-.38-.127-.688-.38-.923-.253-.253-.732-.462-1.436-.624l-2.222-.516c-1.518-.326-2.647-.832-3.388-1.52-.722-.705-1.084-1.583-1.084-2.632 0-1.284.488-2.289 1.464-3.012.993-.742 2.357-1.113 4.092-1.113 1.716 0 3.089.371 4.119 1.113 1.048.723 1.626 1.728 1.734 3.012h-3.116a1.741 1.741 0 00-.867-1.275c-.47-.29-1.12-.434-1.952-.434-.776 0-1.364.126-1.761.38-.398.235-.596.587-.596 1.058 0 .362.153.67.46.922.307.236.822.444 1.545.625l2.385.542c1.355.308 2.376.841 3.062 1.601A3.82 3.82 0 01205 17.848c0 1.32-.506 2.343-1.518 3.066-1.011.724-2.429 1.086-4.254 1.086z" />
+    </svg>
+  );
+});
+
+export default Icon;
diff --git a/src/Bfl/index.md b/src/Bfl/index.md
@@ -0,0 +1,66 @@
+---
+nav: Components
+group: Provider
+title: Black Forest Labs (bfl)
+atomId: Bfl
+description: https://bfl.ai
+---
+
+## Icons
+
+```tsx
+import { Bfl } from '@lobehub/icons';
+import { Flexbox } from 'react-layout-kit';
+
+export default () => <Bfl size={64} />;
+```
+
+## Text
+
+```tsx
+import { Bfl } from '@lobehub/icons';
+
+export default () => <Bfl.Text size={48} />;
+```
+
+## Combine
+
+```tsx
+import { Bfl } from '@lobehub/icons';
+import { Flexbox } from 'react-layout-kit';
+
+export default () => (
+  <Flexbox gap={16} align={'flex-start'}>
+    <Bfl.Combine size={64} />
+  </Flexbox>
+);
+```
+
+## Avatars
+
+```tsx
+import { Bfl } from '@lobehub/icons';
+import { Flexbox } from 'react-layout-kit';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <Bfl.Avatar size={64} />
+    <Bfl.Avatar size={64} shape={'square'} />
+  </Flexbox>
+);
+```
+
+## Colors
+
+```tsx
+import { Bfl } from '@lobehub/icons';
+import { Flexbox } from 'react-layout-kit';
+
+import ColorPreview from '../components/ColorPreview';
+
+export default () => (
+  <Flexbox gap={16} horizontal>
+    <ColorPreview color={Bfl.colorPrimary} />
+  </Flexbox>
+);
+```
diff --git a/src/Bfl/index.ts b/src/Bfl/index.ts
@@ -0,0 +1,21 @@
+import Avatar from './components/Avatar';
+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;
+  Combine: typeof Combine;
+  Text: typeof Text;
+  colorPrimary: string;
+  title: string;
+};
+
+const Icons = Mono as CompoundedIcon;
+Icons.Text = Text;
+Icons.Combine = Combine;
+Icons.Avatar = Avatar;
+Icons.colorPrimary = COLOR_PRIMARY;
+Icons.title = TITLE;
+export default Icons;
diff --git a/src/Bfl/style.ts b/src/Bfl/style.ts
@@ -0,0 +1,9 @@
+export const TITLE = 'Black Forest Labs';
+export const COMBINE_TEXT_MULTIPLE = 0.7;
+export const COMBINE_SPACE_MULTIPLE = 0.2;
+export const COLOR_PRIMARY = '#fff';
+
+// Avatar constants
+export const AVATAR_BACKGROUND = COLOR_PRIMARY;
+export const AVATAR_COLOR = '#000';
+export const AVATAR_ICON_MULTIPLE = 0.7;
diff --git a/src/features/providerConfig.tsx b/src/features/providerConfig.tsx
@@ -14,6 +14,7 @@ import AzureAI from '@/AzureAI';
 import Baichuan from '@/Baichuan';
 import BaiduCloud from '@/BaiduCloud';
 import Bedrock from '@/Bedrock';
+import Bfl from '@/Bfl';
 import BurnCloud from '@/BurnCloud';
 import Claude from '@/Claude';
 import Cloudflare from '@/Cloudflare';
@@ -255,4 +256,5 @@ export const providerMappings: ProviderMapping[] = [
     Icon: Vercel,
     keywords: [ModelProvider.V0],
   },
+  { Icon: Bfl, keywords: [ModelProvider.Bfl] },
 ];
diff --git a/src/features/providerEnum.ts b/src/features/providerEnum.ts
@@ -8,6 +8,7 @@ export enum ModelProvider {
   AzureAI = 'azureai',
   Baichuan = 'baichuan',
   Bedrock = 'bedrock',
+  Bfl = 'bfl',
   BurnCloud = 'burncloud',
   Cloudflare = 'cloudflare',
   Cohere = 'cohere',
diff --git a/src/icons.ts b/src/icons.ts
@@ -26,6 +26,7 @@ export { default as Baidu, type CompoundedIcon as BaiduProps } from './Baidu';
 export { default as BaiduCloud, type CompoundedIcon as BaiduCloudProps } from './BaiduCloud';
 export { default as Baseten, type CompoundedIcon as BasetenProps } from './Baseten';
 export { default as Bedrock, type CompoundedIcon as BedrockProps } from './Bedrock';
+export { default as Bfl, type CompoundedIcon as BflProps } from './Bfl';
 export { default as Bilibili, type CompoundedIcon as BilibiliProps } from './Bilibili';
 export {
   default as BilibiliIndex,
diff --git a/src/toc.ts b/src/toc.ts
@@ -556,6 +556,25 @@ const toc: IconToc[] = [
     },
     title: 'Bedrock',
   },
+  {
+    color: '#fff',
+    desc: 'https://bfl.ai',
+    docsUrl: 'bfl',
+    fullTitle: 'Black Forest Labs (bfl)',
+    group: 'provider',
+    id: 'Bfl',
+    param: {
+      hasAvatar: true,
+      hasBrand: false,
+      hasBrandColor: false,
+      hasColor: false,
+      hasCombine: true,
+      hasText: true,
+      hasTextCn: false,
+      hasTextColor: false,
+    },
+    title: 'Black Forest Labs',
+  },
   {
     color: '#FB7299',
     desc: 'https://github.com/bilibili',
