Skip to content

Commit 005b0c4

Browse files
✨ feat: Add LG AI, Menlo
1 parent 8da1280 commit 005b0c4

File tree

22 files changed

+561
-6
lines changed

22 files changed

+561
-6
lines changed

src/LG/components/Avatar.tsx

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
'use client';
2+
3+
import { memo } from 'react';
4+
5+
import IconAvatar, { type IconAvatarProps } from '@/features/IconAvatar';
6+
7+
import { AVATAR_BACKGROUND, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
8+
import Inner from './Inner';
9+
10+
export type AvatarProps = Omit<IconAvatarProps, 'Icon'>;
11+
12+
const Avatar = memo<AvatarProps>(({ ...rest }) => {
13+
return (
14+
<IconAvatar
15+
Icon={Inner}
16+
aria-label={TITLE}
17+
background={AVATAR_BACKGROUND}
18+
iconMultiple={AVATAR_ICON_MULTIPLE}
19+
{...rest}
20+
/>
21+
);
22+
});
23+
24+
export default Avatar;

src/LG/components/Color.tsx

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
'use client';
2+
3+
import { memo } from 'react';
4+
5+
import type { IconType } from '@/types';
6+
7+
import { TITLE } from '../style';
8+
9+
const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
10+
return (
11+
<svg
12+
height={size}
13+
style={{ flex: 'none', lineHeight: 1, ...style }}
14+
viewBox="0 0 24 24"
15+
width={size}
16+
xmlns="http://www.w3.org/2000/svg"
17+
{...rest}
18+
>
19+
<title>{TITLE}</title>
20+
<path
21+
d="M12 0a12 12 0 110 24 12 12 0 010-24zm7.167 19.18a10.082 10.082 0 002.971-7.169v-.548l-.499.002h-6.68v1.12h6.038l-.002.034a9.038 9.038 0 01-8.993 8.41 8.957 8.957 0 01-6.375-2.642 8.963 8.963 0 01-2.64-6.376c0-2.406.939-4.67 2.64-6.373A8.961 8.961 0 0112 2.998l.572.007V1.882l-.57-.006A10.15 10.15 0 001.864 12.01c0 2.708 1.055 5.253 2.97 7.17A10.078 10.078 0 0012 22.15a10.08 10.08 0 007.171-2.97m-6.6-2.942V6.657h-1.14v10.705h3.529v-1.123H12.57zM9.704 8.183a1.533 1.533 0 10-3.067-.01 1.533 1.533 0 003.067.01z"
22+
fill="#C00C3F"
23+
/>
24+
</svg>
25+
);
26+
});
27+
28+
export default Icon;

src/LG/components/Combine.tsx

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
'use client';
2+
3+
import { memo } from 'react';
4+
5+
import IconCombine, { type IconCombineProps } from '@/features/IconCombine';
6+
7+
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
8+
import Color from './Color';
9+
import Mono from './Mono';
10+
import Text from './Text';
11+
12+
export interface CombineProps extends Omit<IconCombineProps, 'Icon' | 'Text'> {
13+
type?: 'color' | 'mono';
14+
}
15+
const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
16+
const Icon = type === 'color' ? Color : Mono;
17+
18+
return (
19+
<IconCombine
20+
Icon={Icon}
21+
Text={Text}
22+
aria-label={TITLE}
23+
spaceMultiple={COMBINE_SPACE_MULTIPLE}
24+
textMultiple={COMBINE_TEXT_MULTIPLE}
25+
{...rest}
26+
/>
27+
);
28+
});
29+
30+
export default Combine;

src/LG/components/Inner.tsx

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
'use client';
2+
3+
import { memo } from 'react';
4+
5+
import type { IconType } from '@/types';
6+
7+
import { TITLE } from '../style';
8+
9+
const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
10+
return (
11+
<svg
12+
fill="currentColor"
13+
fillRule="evenodd"
14+
height={size}
15+
style={{ flex: 'none', lineHeight: 1, ...style }}
16+
viewBox="0 0 24 24"
17+
width={size}
18+
xmlns="http://www.w3.org/2000/svg"
19+
{...rest}
20+
>
21+
<title>{TITLE}</title>
22+
<path d="M19.167 19.18a10.082 10.082 0 002.97-7.169v-.549l-.498.003h-6.68v1.12h6.038l-.002.034a9.038 9.038 0 01-8.993 8.41 8.96 8.96 0 01-6.375-2.642 8.962 8.962 0 01-2.64-6.376c0-2.406.939-4.67 2.64-6.373A8.961 8.961 0 0112 2.998l.572.007V1.882l-.57-.007A10.15 10.15 0 001.864 12.011c0 2.708 1.055 5.253 2.97 7.17A10.079 10.079 0 0012 22.15a10.078 10.078 0 007.171-2.97m-6.6-2.942V6.656h-1.14v10.705h3.529V16.24H12.57zM9.703 8.183a1.533 1.533 0 10-3.066-.01 1.533 1.533 0 003.066.01z" />
23+
</svg>
24+
);
25+
});
26+
27+
export default Icon;

src/LG/components/Mono.tsx

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
'use client';
2+
3+
import { memo } from 'react';
4+
5+
import type { IconType } from '@/types';
6+
7+
import { TITLE } from '../style';
8+
9+
const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
10+
return (
11+
<svg
12+
fill="currentColor"
13+
fillRule="evenodd"
14+
height={size}
15+
style={{ flex: 'none', lineHeight: 1, ...style }}
16+
viewBox="0 0 24 24"
17+
width={size}
18+
xmlns="http://www.w3.org/2000/svg"
19+
{...rest}
20+
>
21+
<title>{TITLE}</title>
22+
23+
<path d="M12 0a12 12 0 110 24 12 12 0 010-24zm7.167 19.18a10.082 10.082 0 002.971-7.169v-.548l-.499.002h-6.68v1.12h6.038l-.002.034a9.038 9.038 0 01-8.993 8.41 8.957 8.957 0 01-6.375-2.642 8.963 8.963 0 01-2.64-6.376c0-2.406.939-4.67 2.64-6.373A8.961 8.961 0 0112 2.998l.572.007V1.882l-.57-.006A10.15 10.15 0 001.864 12.01c0 2.708 1.055 5.253 2.97 7.17A10.078 10.078 0 0012 22.15a10.08 10.08 0 007.171-2.97m-6.6-2.942V6.657h-1.14v10.705h3.529v-1.123H12.57zM9.704 8.183a1.533 1.533 0 10-3.067-.01 1.533 1.533 0 003.067.01z" />
24+
</svg>
25+
);
26+
});
27+
28+
export default Icon;

src/LG/components/Text.tsx

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
'use client';
2+
3+
import { memo } from 'react';
4+
5+
import type { IconType } from '@/types';
6+
7+
import { TITLE } from '../style';
8+
9+
const Icon: IconType = memo(({ size = '1em', style, ...rest }) => {
10+
return (
11+
<svg
12+
fill="currentColor"
13+
fillRule="nonzero"
14+
height={size}
15+
style={{ flex: 'none', lineHeight: 1, ...style }}
16+
viewBox="0 0 65 24"
17+
xmlns="http://www.w3.org/2000/svg"
18+
{...rest}
19+
>
20+
<title>{TITLE}</title>
21+
<path d="M6.422 17.93h9.17v3.783H2V2.287h4.422V17.93zm18.9-3.623h3.6v3.398c-.661.256-1.957.512-3.188.512-3.982 0-5.308-2.05-5.308-6.217 0-3.976 1.262-6.317 5.241-6.317 2.218 0 3.477.706 4.52 2.054l2.754-2.569C31.26 2.737 28.325 2 25.57 2c-6.192 0-9.444 3.427-9.444 9.966C16.125 18.473 19.06 22 25.54 22c2.972 0 5.878-.768 7.459-1.891v-9.426h-7.68l.002 3.624zM39 22l6.437-20h4.753l6.437 20H52.39l-2.852-10.418a102.698 102.698 0 01-.896-3.24 72.439 72.439 0 00-.869-3.292h-.109a88.125 88.125 0 01-.842 3.293c-.29 1.115-.58 2.195-.869 3.239L43.074 22H39zm3.993-5.128v-3.104h9.56v3.104h-9.56zM58.98 22V2H63v20h-4.02z" />
22+
</svg>
23+
);
24+
});
25+
26+
export default Icon;

src/LG/index.md

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
---
2+
nav: Components
3+
group: Provider
4+
title: LG AI (KMMLU/EXAONE)
5+
atomId: LG
6+
description: https://www.lgresearch.ai
7+
---
8+
9+
## Icons
10+
11+
```tsx
12+
import { LG } from '@lobehub/icons';
13+
import { Flexbox } from 'react-layout-kit';
14+
15+
export default () => (
16+
<Flexbox gap={16} horizontal>
17+
<LG size={64} />
18+
<LG.Color size={64} />
19+
</Flexbox>
20+
);
21+
```
22+
23+
## Text
24+
25+
```tsx
26+
import { LG } from '@lobehub/icons';
27+
28+
export default () => <LG.Text size={64} />;
29+
```
30+
31+
## Combine
32+
33+
```tsx
34+
import { LG } from '@lobehub/icons';
35+
import { Flexbox } from 'react-layout-kit';
36+
37+
export default () => (
38+
<Flexbox gap={16} align={'flex-start'}>
39+
<LG.Combine size={64} />
40+
<LG.Combine size={64} type={'color'} />
41+
</Flexbox>
42+
);
43+
```
44+
45+
## Avatars
46+
47+
```tsx
48+
import { LG } from '@lobehub/icons';
49+
import { Flexbox } from 'react-layout-kit';
50+
51+
export default () => (
52+
<Flexbox gap={16} horizontal>
53+
<LG.Avatar size={64} />
54+
<LG.Avatar size={64} shape={'square'} />
55+
</Flexbox>
56+
);
57+
```
58+
59+
## Colors
60+
61+
```tsx
62+
import { LG } from '@lobehub/icons';
63+
import { Flexbox } from 'react-layout-kit';
64+
65+
import ColorPreview from '../components/ColorPreview';
66+
67+
export default () => (
68+
<Flexbox gap={16} horizontal>
69+
<ColorPreview color={LG.colorPrimary} />
70+
</Flexbox>
71+
);
72+
```

src/LG/index.ts

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import Avatar from './components/Avatar';
2+
import Color from './components/Color';
3+
import Combine from './components/Combine';
4+
import Mono from './components/Mono';
5+
import Text from './components/Text';
6+
import { COLOR_PRIMARY, TITLE } from './style';
7+
8+
export type CompoundedIcon = typeof Mono & {
9+
Avatar: typeof Avatar;
10+
Color: typeof Color;
11+
Combine: typeof Combine;
12+
Text: typeof Text;
13+
colorPrimary: string;
14+
title: string;
15+
};
16+
17+
const Icons = Mono as CompoundedIcon;
18+
Icons.Color = Color;
19+
Icons.Text = Text;
20+
Icons.Combine = Combine;
21+
Icons.Avatar = Avatar;
22+
Icons.colorPrimary = COLOR_PRIMARY;
23+
Icons.title = TITLE;
24+
25+
export default Icons;

src/LG/style.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export const TITLE = 'LG AI';
2+
export const COLOR_PRIMARY = '#C00C3F';
3+
export const COMBINE_TEXT_MULTIPLE = 0.9;
4+
export const COMBINE_SPACE_MULTIPLE = 0.2;
5+
6+
// Avatar constants
7+
export const AVATAR_BACKGROUND = COLOR_PRIMARY;
8+
export const AVATAR_COLOR = '#FFF';
9+
export const AVATAR_ICON_MULTIPLE = 1;

src/Menlo/components/Avatar.tsx

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
'use client';
2+
3+
import { memo } from 'react';
4+
5+
import IconAvatar, { type IconAvatarProps } from '@/features/IconAvatar';
6+
7+
import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
8+
import Mono from './Mono';
9+
10+
export type AvatarProps = Omit<IconAvatarProps, 'Icon'>;
11+
12+
const Avatar = memo<AvatarProps>(({ ...rest }) => {
13+
return (
14+
<IconAvatar
15+
Icon={Mono}
16+
aria-label={TITLE}
17+
background={AVATAR_BACKGROUND}
18+
color={AVATAR_COLOR}
19+
iconMultiple={AVATAR_ICON_MULTIPLE}
20+
{...rest}
21+
/>
22+
);
23+
});
24+
25+
export default Avatar;

0 commit comments

Comments
 (0)