mirror of
https://github.com/hanzoai/icons.git
synced 2026-09-24 16:59:52 +00:00
✨ feat: make lobe icons support react native platform (#141)
* 🔧 chore: Init react-native package * ✨ feat: Support react native * 🐛 fix: adjust style & offset rn transform ease * 🐛 fix: gradient avatar icons & gradient compatibility * ✨ feat(RN): Support gradient avatar bg * ✨ feat(RN): dalle avatar icon * ✨ feat(RN): cogview & cogvideo icon * ✨ feat(RN): Dalle icon style * ✨ feat(RN): script update * ✨ feat(RN): support more feature icons * 💄 style: Update README * 📝 docs: Update README --------- Co-authored-by: canisminor1990 <[email protected]>
This commit is contained in:
Tsuki
committed by
GitHub
GitHub
co-authored by
canisminor1990
canisminor1990
parent
41070af749
commit
ab09b429df
Executable → Regular
@@ -37,6 +37,7 @@ Contributions, corrections & requests can be made on GitHub.
|
||||
|
||||
#### TOC
|
||||
|
||||
- [📦 Packages](#-packages)
|
||||
- [✨ Features](#-features)
|
||||
- [🤯 CDN Usage](#-cdn-usage)
|
||||
- [`A` CDN with SVG](#a-cdn-with-svg)
|
||||
@@ -57,6 +58,22 @@ Contributions, corrections & requests can be made on GitHub.
|
||||
|
||||
</details>
|
||||
|
||||
## 📦 Packages
|
||||
|
||||
| Logo | Package | Version | Downloads | Links |
|
||||
| ------------------------------------------------------------------------------------------------------------------------------ | -------------------------------- | --------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------- | --------------------------------------------------------------------------------- |
|
||||
| <img src="https://github.com/user-attachments/assets/411f5124-9460-43dc-9d91-3d3c3da05b30" alt="React logo" width="48"> | **`@lobehub/icons`** | [](https://www.npmjs.com/package/@lobehub/icons-static-svg) |  | [Source](https://github.com/lobehub/lobe-icons/tree/master/src) |
|
||||
| <img src="https://github.com/user-attachments/assets/d06378b5-46eb-4154-836d-b792d04ee3dd" alt="React Native logo" width="48"> | **`@lobehub/icons-rn`** | [](https://www.npmjs.com/package/@lobehub/icons-rn) |  | [Source](https://github.com/lobehub/lobe-icons/tree/master/packages/react-native) |
|
||||
| <img src="https://github.com/user-attachments/assets/6a0ce456-ab14-437c-93ec-2c05fecbb454" alt="SVG logo" width="48"> | **`@lobehub/icons-static-svg`** | [](https://www.npmjs.com/package/@lobehub/icons-static-svg) |  | [Source](https://github.com/lobehub/lobe-icons/tree/master/packages/static-svg) |
|
||||
| <img src="https://github.com/user-attachments/assets/f2ee638a-b02c-447d-bcb2-4455688b1438" alt="PNG logo" width="48"> | **`@lobehub/icons-static-png`** | [](https://www.npmjs.com/package/@lobehub/icons-static-png) |  | [Source](https://github.com/lobehub/lobe-icons/tree/master/packages/static-png) |
|
||||
| <img src="https://github.com/user-attachments/assets/bd610e9d-290e-4a60-a945-e9c5f84be962" alt="WebP logo" width="48"> | **`@lobehub/icons-static-webp`** | [](https://www.npmjs.com/package/@lobehub/icons-static-webp) |  | [Source](https://github.com/lobehub/lobe-icons/tree/master/packages/static-webp) |
|
||||
|
||||
<div align="right">
|
||||
|
||||
[![][back-to-top]](#readme-top)
|
||||
|
||||
</div>
|
||||
|
||||
## ✨ Features
|
||||
|
||||
- 🚀 **Lightweight & Scalable**: Icons are designed to be lightweight, utilizing highly optimized scalable vector graphics (SVG) for the best performance and quality.
|
||||
|
||||
@@ -27,6 +27,7 @@
|
||||
"es"
|
||||
],
|
||||
"scripts": {
|
||||
"auto-converter-web-icons-to-rn": "tsx scripts/rn-conversion/auto-converter.ts --lint",
|
||||
"build": "npm run build:toc && father build",
|
||||
"build:static": "tsx scripts/svgWorkflow/index.ts",
|
||||
"build:toc": "tsx scripts/tocWorkflow/index.ts",
|
||||
|
||||
@@ -0,0 +1,371 @@
|
||||
<a name="readme-top"></a>
|
||||
|
||||
<div align="center">
|
||||
|
||||
<img height="120" src="https://registry.npmmirror.com/@lobehub/assets-logo/1.0.0/files/assets/logo-3d.webp">
|
||||
<img height="120" src="https://gw.alipayobjects.com/zos/kitchen/qJ3l3EPsdW/split.svg">
|
||||
<img height="120" src="https://registry.npmmirror.com/@lobehub/fluent-emoji-3d/1.1.0/files/assets/1f968.webp">
|
||||
|
||||
# Lobe Icons React Native
|
||||
|
||||
`React Native Package`
|
||||
|
||||
Popular AI / LLM Model Brand Icons for React Native and Expo. See them all on one page at [icons.lobehub.com](https://icons.lobehub.com/).<br/>
|
||||
Contributions, corrections & requests can be made on GitHub.
|
||||
|
||||
[Changelog](./CHANGELOG.md) · [Report Bug][github-issues-link] · [Request Feature][github-issues-link]
|
||||
|
||||
<!-- SHIELD GROUP -->
|
||||
|
||||
[![][npm-release-shield]][npm-release-link]
|
||||
[![][vercel-shield]][vercel-link]
|
||||
[![][discord-shield]][discord-link]
|
||||
[![][npm-downloads-shield]][npm-downloads-link]<br/>
|
||||
[![][github-releasedate-shield]][github-releasedate-link]
|
||||
[![][github-action-test-shield]][github-action-test-link]
|
||||
[![][github-action-release-shield]][github-action-release-link]<br/>
|
||||
[![][github-contributors-shield]][github-contributors-link]
|
||||
[![][github-forks-shield]][github-forks-link]
|
||||
[![][github-stars-shield]][github-stars-link]
|
||||
[![][github-issues-shield]][github-issues-link]
|
||||
[![][github-license-shield]][github-license-link]
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
## 🚀 Installation
|
||||
|
||||
```bash
|
||||
npm install @lobehub/icons-rn
|
||||
# or
|
||||
yarn add @lobehub/icons-rn
|
||||
# or
|
||||
pnpm add @lobehub/icons-rn
|
||||
```
|
||||
|
||||
### Peer Dependencies
|
||||
|
||||
This package requires the following peer dependencies:
|
||||
|
||||
```bash
|
||||
npm install react-native-svg
|
||||
# or
|
||||
yarn add react-native-svg
|
||||
# or
|
||||
pnpm add react-native-svg
|
||||
```
|
||||
|
||||
#### Optional: Gradient Support
|
||||
|
||||
For gradient background support in Avatar components, install `react-native-linear-gradient`:
|
||||
|
||||
```bash
|
||||
npm install react-native-linear-gradient
|
||||
# or
|
||||
yarn add react-native-linear-gradient
|
||||
# or
|
||||
pnpm add react-native-linear-gradient
|
||||
```
|
||||
|
||||
> 💡 **Note**: If `react-native-linear-gradient` is not installed, gradient backgrounds will automatically fallback to solid colors.
|
||||
|
||||
## 📖 Usage
|
||||
|
||||
> 💡 **API Compatibility**: The React Native package API is almost identical to the web version. You can refer to the [web documentation](https://icons.lobehub.com) for comprehensive usage examples and advanced patterns.
|
||||
|
||||
### Basic Usage
|
||||
|
||||
```tsx
|
||||
import { Adobe } from '@lobehub/icons-rn';
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<Adobe size={32} />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
### With Styling
|
||||
|
||||
```tsx
|
||||
import { Adobe } from '@lobehub/icons-rn';
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<Adobe size={24} style={{ marginRight: 8, color: '#007AFF' }} />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
### Color Version
|
||||
|
||||
```tsx
|
||||
import { Adobe } from '@lobehub/icons-rn';
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<Adobe.Color size={32} />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
### Text Version
|
||||
|
||||
```tsx
|
||||
import { Adobe } from '@lobehub/icons-rn';
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<Adobe.Text size={32} />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
### Avatar Version
|
||||
|
||||
```tsx
|
||||
import { Adobe } from '@lobehub/icons-rn';
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<Adobe.Avatar size={48} />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
### Avatar with Gradient Background
|
||||
|
||||
```tsx
|
||||
import { Adobe } from '@lobehub/icons-rn';
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
{/* CSS gradient format - requires react-native-linear-gradient */}
|
||||
<Adobe.Avatar
|
||||
size={48}
|
||||
background="linear-gradient(45deg, #9AD8F8, #3D8FFF, #6350FB)"
|
||||
/>
|
||||
|
||||
{/* Automatic fallback to solid color if gradient library not available */}
|
||||
<Adobe.Avatar
|
||||
size={48}
|
||||
background="linear-gradient(to right, #FF6B35, #F7931E)"
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
### Combine Version (Icon + Text)
|
||||
|
||||
```tsx
|
||||
import { Adobe } from '@lobehub/icons-rn';
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<Adobe.Combine size={32} text="Adobe" textColor="#000000" />
|
||||
</View>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
## 🎨 API Reference
|
||||
|
||||
### Icon Props
|
||||
|
||||
| Prop | Type | Default | Description |
|
||||
| ------- | ----------- | -------------- | ------------------- |
|
||||
| `size` | `number` | `24` | Icon size in pixels |
|
||||
| `style` | `ViewStyle` | `undefined` | Additional styles |
|
||||
| `color` | `string` | `currentColor` | Icon color |
|
||||
|
||||
### Avatar Props
|
||||
|
||||
| Prop | Type | Default | Description |
|
||||
| -------------- | -------- | ----------- | ------------------------------------------------------------------ |
|
||||
| `size` | `number` | `24` | Avatar size in pixels |
|
||||
| `background` | `string` | Brand color | Background color or CSS gradient (e.g., `linear-gradient(...)`) |
|
||||
| `color` | `string` | `#FFFFFF` | Icon color |
|
||||
| `iconMultiple` | `number` | `0.6` | Icon size multiplier |
|
||||
|
||||
### Text Props
|
||||
|
||||
| Prop | Type | Default | Description |
|
||||
| ----------- | -------- | ---------- | ------------------- |
|
||||
| `size` | `number` | `24` | Text size in pixels |
|
||||
| `text` | `string` | Brand name | Custom text |
|
||||
| `textColor` | `string` | `#000000` | Text color |
|
||||
|
||||
### Combine Props
|
||||
|
||||
| Prop | Type | Default | Description |
|
||||
| --------------- | -------- | ---------- | --------------------------- |
|
||||
| `size` | `number` | `24` | Icon size in pixels |
|
||||
| `text` | `string` | Brand name | Custom text |
|
||||
| `textColor` | `string` | `#000000` | Text color |
|
||||
| `spaceMultiple` | `number` | `0.1` | Space between icon and text |
|
||||
| `textMultiple` | `number` | `0.6` | Text size multiplier |
|
||||
|
||||
## 🔧 TypeScript Support
|
||||
|
||||
This package includes full TypeScript support:
|
||||
|
||||
```tsx
|
||||
import { Adobe, type AdobeProps } from '@lobehub/icons-rn';
|
||||
|
||||
// All props are properly typed
|
||||
const MyComponent: React.FC = () => {
|
||||
return <Adobe size={32} />;
|
||||
};
|
||||
```
|
||||
|
||||
## 🎨 Gradient Background Support
|
||||
|
||||
Avatar components support CSS `linear-gradient` format for rich visual effects:
|
||||
|
||||
### Supported Gradient Formats
|
||||
|
||||
```tsx
|
||||
// Direction keywords
|
||||
<Adobe.Avatar background="linear-gradient(to right, #FF6B35, #F7931E)" />
|
||||
<Adobe.Avatar background="linear-gradient(to bottom, #667eea, #764ba2)" />
|
||||
|
||||
// Degree angles
|
||||
<Adobe.Avatar background="linear-gradient(45deg, #9AD8F8, #3D8FFF, #6350FB)" />
|
||||
<Adobe.Avatar background="linear-gradient(135deg, #667eea, #764ba2)" />
|
||||
|
||||
// Multiple colors with positions
|
||||
<Adobe.Avatar background="linear-gradient(90deg, #FF6B35 0%, #F7931E 50%, #C02425 100%)" />
|
||||
```
|
||||
|
||||
### Automatic Fallback
|
||||
|
||||
If `react-native-linear-gradient` is not installed or gradient parsing fails:
|
||||
|
||||
- **Extracts first color** from gradient as solid background
|
||||
- **Graceful degradation** - no crashes or broken UI
|
||||
- **Development-friendly** - works without additional setup
|
||||
|
||||
Example fallback behavior:
|
||||
```tsx
|
||||
// With library: Shows beautiful gradient
|
||||
// Without library: Shows solid #9AD8F8 background
|
||||
<Adobe.Avatar background="linear-gradient(45deg, #9AD8F8, #3D8FFF, #6350FB)" />
|
||||
```
|
||||
|
||||
## 📦 Available Icons
|
||||
|
||||
This package includes **225+ AI/LLM brand icons** across three main categories:
|
||||
|
||||
### 🤖 Model Icons
|
||||
|
||||
Popular AI models including:
|
||||
|
||||
- **Claude** (Anthropic), **GPT** (OpenAI), **Gemini** (Google)
|
||||
- **Qwen** (Alibaba), **DeepSeek**, **ChatGLM** (Zhipu)
|
||||
- **Llama** (Meta), **Mistral**, **RWKV**, and many more
|
||||
|
||||
### 🏢 Provider Icons
|
||||
|
||||
AI service providers such as:
|
||||
|
||||
- **OpenAI**, **Anthropic**, **Google**, **Microsoft**
|
||||
- **AWS Bedrock**, **Azure AI**, **Hugging Face**
|
||||
- **Groq**, **Together AI**, **Fireworks**, and others
|
||||
|
||||
### 🛠️ Application Icons
|
||||
|
||||
AI-powered applications including:
|
||||
|
||||
- **Adobe Firefly**, **Midjourney**, **Cursor**
|
||||
- **GitHub Copilot**, **Notion**, **Figma**
|
||||
- **ComfyUI**, **Gradio**, **LangChain**, and more
|
||||
|
||||
### 🌐 Complete Icon Gallery
|
||||
|
||||
View all available icons with interactive examples at [icons.lobehub.com](https://icons.lobehub.com).
|
||||
|
||||
Each icon supports multiple variants:
|
||||
|
||||
- **Monochrome** - Inherits color from parent
|
||||
- **Color** - Brand-specific colors
|
||||
- **Avatar** - Circular background style
|
||||
- **Text** - Brand name text
|
||||
- **Combine** - Icon + text combination
|
||||
|
||||
## 🔗 Web Compatibility
|
||||
|
||||
This React Native package maintains **API compatibility** with the web version. For comprehensive documentation, advanced usage patterns, and live examples, visit:
|
||||
|
||||
- 📚 **Documentation**: [icons.lobehub.com](https://icons.lobehub.com)
|
||||
- 🎮 **Interactive Examples**: All usage examples from the web docs work with React Native
|
||||
- 🔧 **Advanced Patterns**: Component composition, theming, and customization guides
|
||||
- 🎨 **Design Guidelines**: Icon sizing, spacing, and accessibility best practices
|
||||
|
||||
The main differences are:
|
||||
|
||||
- Uses `react-native-svg` instead of regular SVG
|
||||
- Requires `ViewStyle` instead of `CSSProperties` for styling
|
||||
- Uses React Native's theming instead of CSS variables
|
||||
|
||||
## 🆚 Comparison with Other Packages
|
||||
|
||||
| Package | Target | Bundle Size | Features |
|
||||
| --------------------------- | ------ | ----------- | --------------------- |
|
||||
| `@lobehub/icons` | Web | Larger | Full React components |
|
||||
| `@lobehub/icons-static-svg` | Static | Small | SVG files only |
|
||||
| `@lobehub/icons-rn` | Mobile | Optimized | RN components |
|
||||
|
||||
## 🤝 Contributing
|
||||
|
||||
We welcome contributions! Please see our [contributing guide](https://github.com/lobehub/lobe-icons/blob/master/CONTRIBUTING.md) for details.
|
||||
|
||||
## 📄 License
|
||||
|
||||
[![][fossa-license-shield]][fossa-license-link]
|
||||
|
||||
Copyright © 2023 [LobeHub][profile-link]. <br />
|
||||
This project is [MIT](./LICENSE) licensed.
|
||||
|
||||
<!-- LINK GROUP -->
|
||||
|
||||
[discord-link]: https://discord.gg/AYFPHvv2jT
|
||||
[discord-shield]: https://img.shields.io/discord/1127171173982154893?color=5865F2&label=discord&labelColor=black&logo=discord&logoColor=white&style=flat-square
|
||||
[fossa-license-link]: https://app.fossa.com/projects/git%2Bgithub.com%2Flobehub%2Flobe-icons
|
||||
[fossa-license-shield]: https://app.fossa.com/api/projects/git%2Bgithub.com%2Flobehub%2Flobe-icons.svg?type=large
|
||||
[github-action-release-link]: https://github.com/actions/workflows/lobehub/lobe-icons/release.yml
|
||||
[github-action-release-shield]: https://img.shields.io/github/actions/workflow/status/lobehub/lobe-icons/release.yml?label=release&labelColor=black&logo=githubactions&logoColor=white&style=flat-square
|
||||
[github-action-test-link]: https://github.com/actions/workflows/lobehub/lobe-icons/test.yml
|
||||
[github-action-test-shield]: https://img.shields.io/github/actions/workflow/status/lobehub/lobe-icons/test.yml?label=test&labelColor=black&logo=githubactions&logoColor=white&style=flat-square
|
||||
[github-contributors-link]: https://github.com/lobehub/lobe-icons/graphs/contributors
|
||||
[github-contributors-shield]: https://img.shields.io/github/contributors/lobehub/lobe-icons?color=c4f042&labelColor=black&style=flat-square
|
||||
[github-forks-link]: https://github.com/lobehub/lobe-icons/network/members
|
||||
[github-forks-shield]: https://img.shields.io/github/forks/lobehub/lobe-icons?color=8ae8ff&labelColor=black&style=flat-square
|
||||
[github-issues-link]: https://github.com/lobehub/lobe-icons/issues
|
||||
[github-issues-shield]: https://img.shields.io/github/issues/lobehub/lobe-icons?color=ff80eb&labelColor=black&style=flat-square
|
||||
[github-license-link]: https://github.com/lobehub/lobe-icons/blob/master/LICENSE
|
||||
[github-license-shield]: https://img.shields.io/github/license/lobehub/lobe-icons?color=white&labelColor=black&style=flat-square
|
||||
[github-releasedate-link]: https://github.com/lobehub/lobe-icons/releases
|
||||
[github-releasedate-shield]: https://img.shields.io/github/release-date/lobehub/lobe-icons?labelColor=black&style=flat-square
|
||||
[github-stars-link]: https://github.com/lobehub/lobe-icons/network/stargazers
|
||||
[github-stars-shield]: https://img.shields.io/github/stars/lobehub/lobe-icons?color=ffcb47&labelColor=black&style=flat-square
|
||||
[npm-downloads-link]: https://www.npmjs.com/package/@lobehub/icons-rn
|
||||
[npm-downloads-shield]: https://img.shields.io/npm/dt/@lobehub/icons-rn?labelColor=black&style=flat-square
|
||||
[npm-release-link]: https://www.npmjs.com/package/@lobehub/icons-rn
|
||||
[npm-release-shield]: https://img.shields.io/npm/v/@lobehub/icons-rn?color=369eff&labelColor=black&logo=npm&logoColor=white&style=flat-square
|
||||
[profile-link]: https://github.com/lobehub
|
||||
[vercel-link]: https://icons.lobehub.com
|
||||
[vercel-shield]: https://img.shields.io/website?down_message=offline&label=vercel&labelColor=black&logo=vercel&style=flat-square&up_message=online&url=https%3A%2F%2Fui.lobehub.com
|
||||
@@ -0,0 +1,4 @@
|
||||
module.exports = {
|
||||
indent: 2,
|
||||
remove: ['scripts', 'lint-staged', 'devDependencies', 'publishConfig', 'clean-package'],
|
||||
};
|
||||
@@ -0,0 +1,64 @@
|
||||
{
|
||||
"name": "@lobehub/icons-rn",
|
||||
"version": "1.0.0",
|
||||
"description": "Popular AI / LLM Model Brand Icons for React Native and Expo",
|
||||
"keywords": [
|
||||
"lobehub",
|
||||
"llm icons",
|
||||
"llm brand logo",
|
||||
"react-native",
|
||||
"expo",
|
||||
"react-native-svg",
|
||||
"mobile icons"
|
||||
],
|
||||
"homepage": "https://github.com/lobehub/lobe-icons",
|
||||
"bugs": {
|
||||
"url": "https://github.com/lobehub/lobe-icons/issues/new"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/lobehub/lobe-icons.git"
|
||||
},
|
||||
"license": "MIT",
|
||||
"author": "LobeHub <[email protected]>",
|
||||
"sideEffects": false,
|
||||
"main": "dist/index.js",
|
||||
"module": "dist/index.js",
|
||||
"react-native": "dist/index.js",
|
||||
"types": "dist/index.d.ts",
|
||||
"files": [
|
||||
"dist"
|
||||
],
|
||||
"scripts": {
|
||||
"prebuild": "npm run clean",
|
||||
"build": "NODE_OPTIONS=\"--max-old-space-size=16384 --max-semi-space-size=1024\" tsup",
|
||||
"build:dts-only": "NODE_OPTIONS=\"--max-old-space-size=26384 --max-semi-space-size=1024\" tsup --dts-only",
|
||||
"build:no-dts": "NODE_OPTIONS=\"--max-old-space-size=16384 --max-semi-space-size=1024\" tsup --no-dts",
|
||||
"clean": "rm -rf dist",
|
||||
"lint": "eslint \"{src,tests}/**/*.{js,jsx,ts,tsx}\" --fix",
|
||||
"prepack": "clean-package",
|
||||
"postpack": "clean-package restore",
|
||||
"test": "vitest",
|
||||
"test:coverage": "vitest --coverage",
|
||||
"test:run": "vitest run",
|
||||
"test:watch": "vitest --watch",
|
||||
"type-check": "tsc --noEmit"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^19.0.0",
|
||||
"@types/react-native": "^0.72.0",
|
||||
"clean-package": "^2.2.0",
|
||||
"tsup": "^8.5.0",
|
||||
"typescript": "^5.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8.0",
|
||||
"react-native": ">=0.76.9",
|
||||
"react-native-linear-gradient": ">=2.8.0",
|
||||
"react-native-svg": ">=15.8.0"
|
||||
},
|
||||
"publishConfig": {
|
||||
"access": "public",
|
||||
"registry": "https://registry.npmjs.org"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,215 @@
|
||||
import React, { memo, useMemo } from 'react';
|
||||
import { View, type ViewStyle } from 'react-native';
|
||||
|
||||
import type { RNIconProps } from '../types';
|
||||
|
||||
// Gradient parsing interfaces
|
||||
interface GradientInfo {
|
||||
colors: string[];
|
||||
end?: { x: number; y: number };
|
||||
locations?: number[];
|
||||
start?: { x: number; y: number };
|
||||
}
|
||||
|
||||
// Convert degrees to start/end coordinates
|
||||
const degreesToCoordinates = (degrees: number): { end: { x: number; y: number }; start: { x: number; y: number } } => {
|
||||
// Normalize degrees to 0-360
|
||||
const normalizedDegrees = ((degrees % 360) + 360) % 360;
|
||||
const radians = (normalizedDegrees * Math.PI) / 180;
|
||||
|
||||
// Calculate end coordinates based on angle
|
||||
const endX = Math.cos(radians - Math.PI / 2);
|
||||
const endY = Math.sin(radians - Math.PI / 2);
|
||||
|
||||
// Normalize to 0-1 range
|
||||
const start = { x: 0.5 - endX / 2, y: 0.5 - endY / 2 };
|
||||
const end = { x: 0.5 + endX / 2, y: 0.5 + endY / 2 };
|
||||
|
||||
return { end, start };
|
||||
};
|
||||
|
||||
// Convert CSS direction to react-native-linear-gradient coordinates
|
||||
const parseGradientDirection = (direction: string): { end: { x: number; y: number }; start: { x: number; y: number } } => {
|
||||
const directionMap: Record<string, { end: { x: number; y: number }; start: { x: number; y: number } }> = {
|
||||
'to bottom': { end: { x: 0, y: 1 }, start: { x: 0, y: 0 } },
|
||||
'to bottom left': { end: { x: 0, y: 1 }, start: { x: 1, y: 0 } },
|
||||
'to bottom right': { end: { x: 1, y: 1 }, start: { x: 0, y: 0 } },
|
||||
'to left': { end: { x: 0, y: 0 }, start: { x: 1, y: 0 } },
|
||||
'to right': { end: { x: 1, y: 0 }, start: { x: 0, y: 0 } },
|
||||
'to top': { end: { x: 0, y: 0 }, start: { x: 0, y: 1 } },
|
||||
'to top left': { end: { x: 0, y: 0 }, start: { x: 1, y: 1 } },
|
||||
'to top right': { end: { x: 1, y: 0 }, start: { x: 0, y: 1 } },
|
||||
};
|
||||
|
||||
// Handle keyword directions
|
||||
if (directionMap[direction]) {
|
||||
return directionMap[direction];
|
||||
}
|
||||
|
||||
// Handle degree values
|
||||
const degreeMatch = direction.match(/(-?\d+(?:\.\d+)?)deg/);
|
||||
if (degreeMatch) {
|
||||
const degrees = parseFloat(degreeMatch[1]);
|
||||
return degreesToCoordinates(degrees);
|
||||
}
|
||||
|
||||
// Default to bottom
|
||||
return directionMap['to bottom'];
|
||||
};
|
||||
|
||||
// Parse CSS linear-gradient string
|
||||
const parseLinearGradient = (gradientString: string): GradientInfo | null => {
|
||||
try {
|
||||
const match = gradientString.match(/linear-gradient\(([^)]+)\)/);
|
||||
if (!match) return null;
|
||||
|
||||
const parts = match[1].split(',').map(s => s.trim());
|
||||
if (parts.length < 2) return null;
|
||||
|
||||
let direction = parts[0];
|
||||
let colors: string[] = [];
|
||||
let locations: number[] | undefined;
|
||||
|
||||
// Check if first part is a color (no direction specified)
|
||||
const isColor = direction.match(/#[\dA-Fa-f]{6}|#[\dA-Fa-f]{3}|rgb|hsl/);
|
||||
const colorParts = isColor ? parts : parts.slice(1);
|
||||
|
||||
// Parse colors and optional locations
|
||||
const colorData = colorParts.map(part => {
|
||||
const colorMatch = part.match(/(#[\dA-Fa-f]{6}|#[\dA-Fa-f]{3}|rgb\([^)]+\)|rgba\([^)]+\)|hsl\([^)]+\)|hsla\([^)]+\))/);
|
||||
const percentMatch = part.match(/(\d+(?:\.\d+)?)%/);
|
||||
|
||||
if (colorMatch) {
|
||||
return {
|
||||
color: colorMatch[1],
|
||||
location: percentMatch ? parseFloat(percentMatch[1]) / 100 : undefined
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}).filter(Boolean);
|
||||
|
||||
colors = colorData.map(item => item!.color);
|
||||
const hasLocations = colorData.some(item => item!.location !== undefined);
|
||||
|
||||
if (hasLocations) {
|
||||
locations = colorData.map((item, index) => {
|
||||
return item!.location !== undefined ? item!.location : index / (colorData.length - 1);
|
||||
});
|
||||
}
|
||||
|
||||
// Parse direction
|
||||
const coordinates = isColor ?
|
||||
{ end: { x: 0, y: 1 }, start: { x: 0, y: 0 } } : // default to bottom
|
||||
parseGradientDirection(direction);
|
||||
|
||||
return {
|
||||
colors,
|
||||
...coordinates,
|
||||
locations,
|
||||
};
|
||||
} catch (error) {
|
||||
console.warn('Failed to parse gradient:', gradientString, error);
|
||||
return null;
|
||||
}
|
||||
};
|
||||
|
||||
// Extract fallback color from gradient string
|
||||
const extractFallbackColor = (gradientString: string): string => {
|
||||
const colorMatch = gradientString.match(/#[\dA-Fa-f]{6}|#[\dA-Fa-f]{3}/);
|
||||
return colorMatch ? colorMatch[0] : '#cccccc';
|
||||
};
|
||||
|
||||
// Check if background is a gradient
|
||||
const isGradient = (background?: string): boolean => {
|
||||
return background?.includes('linear-gradient(') ?? false;
|
||||
};
|
||||
|
||||
export interface RNIconAvatarProps {
|
||||
Icon?: React.ComponentType<RNIconProps>;
|
||||
background?: string;
|
||||
color?: string;
|
||||
iconMultiple?: number;
|
||||
iconStyle?: ViewStyle;
|
||||
shape?: 'circle' | 'square';
|
||||
size: number;
|
||||
style?: ViewStyle;
|
||||
}
|
||||
|
||||
const RNIconAvatar = memo<RNIconAvatarProps>(
|
||||
({
|
||||
shape = 'circle',
|
||||
color = '#fff',
|
||||
background,
|
||||
size,
|
||||
style,
|
||||
iconMultiple = 0.75,
|
||||
Icon,
|
||||
iconStyle,
|
||||
...rest
|
||||
}) => {
|
||||
const borderRadius = shape === 'circle' ? size / 2 : Math.floor(size * 0.1);
|
||||
|
||||
// Parse gradient information
|
||||
const gradientInfo = useMemo(() => {
|
||||
if (!background || !isGradient(background)) {
|
||||
return null;
|
||||
}
|
||||
return parseLinearGradient(background);
|
||||
}, [background]);
|
||||
|
||||
const containerStyle: ViewStyle = {
|
||||
alignItems: 'center',
|
||||
borderRadius,
|
||||
height: size,
|
||||
justifyContent: 'center',
|
||||
width: size,
|
||||
};
|
||||
|
||||
const combinedStyle = [containerStyle, style];
|
||||
|
||||
// Try to import LinearGradient dynamically
|
||||
let LinearGradient: any = null;
|
||||
try {
|
||||
LinearGradient = require('react-native-linear-gradient').default;
|
||||
} catch {
|
||||
// LinearGradient not available, will fall back to solid color
|
||||
}
|
||||
|
||||
// Render with gradient if available and parsed successfully
|
||||
if (gradientInfo && LinearGradient) {
|
||||
return (
|
||||
<LinearGradient
|
||||
colors={gradientInfo.colors}
|
||||
end={gradientInfo.end}
|
||||
locations={gradientInfo.locations}
|
||||
start={gradientInfo.start}
|
||||
style={combinedStyle}
|
||||
{...rest}
|
||||
>
|
||||
{Icon && <Icon color={color} size={Math.round(size * iconMultiple)} style={iconStyle} />}
|
||||
</LinearGradient>
|
||||
);
|
||||
}
|
||||
|
||||
// Fallback to solid color
|
||||
const fallbackBackground = isGradient(background || '')
|
||||
? extractFallbackColor(background || '')
|
||||
: background;
|
||||
|
||||
return (
|
||||
<View
|
||||
style={[
|
||||
combinedStyle,
|
||||
{
|
||||
backgroundColor: fallbackBackground,
|
||||
},
|
||||
]}
|
||||
{...rest}
|
||||
>
|
||||
{Icon && <Icon color={color} size={Math.round(size * iconMultiple)} style={iconStyle} />}
|
||||
</View>
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
export default RNIconAvatar;
|
||||
@@ -0,0 +1,78 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Text, View } from 'react-native';
|
||||
|
||||
import type { RNIconCombineProps } from '../types';
|
||||
|
||||
const RNIconCombine = memo<RNIconCombineProps>(
|
||||
({
|
||||
Icon,
|
||||
style,
|
||||
Text: TextComponent,
|
||||
size = 24,
|
||||
spaceMultiple = 1,
|
||||
textMultiple = 1,
|
||||
extra,
|
||||
extraStyle,
|
||||
showText = true,
|
||||
showLogo = true,
|
||||
iconProps,
|
||||
inverse,
|
||||
...rest
|
||||
}) => {
|
||||
const logo = Icon && showLogo && (
|
||||
<Icon
|
||||
size={size}
|
||||
{...(iconProps as any)}
|
||||
style={[
|
||||
inverse ? { marginLeft: size * spaceMultiple } : { marginRight: size * spaceMultiple },
|
||||
iconProps?.style,
|
||||
]}
|
||||
/>
|
||||
);
|
||||
|
||||
const text = showText && TextComponent && (
|
||||
<TextComponent color={rest.color} size={size * textMultiple} />
|
||||
);
|
||||
|
||||
return (
|
||||
<View
|
||||
style={[
|
||||
{
|
||||
alignItems: 'center',
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'flex-start',
|
||||
},
|
||||
style,
|
||||
]}
|
||||
{...rest}
|
||||
>
|
||||
{inverse ? (
|
||||
<>
|
||||
{text}
|
||||
{logo}
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
{logo}
|
||||
{text}
|
||||
</>
|
||||
)}
|
||||
{extra && (
|
||||
<Text
|
||||
style={[
|
||||
{
|
||||
fontSize: size * textMultiple * 0.95,
|
||||
lineHeight: size * textMultiple * 0.95,
|
||||
},
|
||||
extraStyle,
|
||||
]}
|
||||
>
|
||||
{extra}
|
||||
</Text>
|
||||
)}
|
||||
</View>
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
export default RNIconCombine;
|
||||
@@ -0,0 +1,44 @@
|
||||
import React, { memo } from 'react';
|
||||
import { View } from 'react-native';
|
||||
|
||||
import type { RNIconAvatarProps } from '../types';
|
||||
|
||||
import DefaultIcon from './DefaultIcon';
|
||||
|
||||
const DefaultAvatar = memo<Omit<RNIconAvatarProps, 'Icon'>>(
|
||||
({
|
||||
shape = 'circle',
|
||||
color = '#fff',
|
||||
background = '#f0f0f0',
|
||||
size,
|
||||
style,
|
||||
iconMultiple = 0.6,
|
||||
iconStyle,
|
||||
}) => {
|
||||
const borderRadius = shape === 'circle' ? size / 2 : Math.floor(size * 0.1);
|
||||
|
||||
return (
|
||||
<View
|
||||
style={[
|
||||
{
|
||||
alignItems: 'center',
|
||||
backgroundColor: background,
|
||||
borderRadius,
|
||||
height: size,
|
||||
justifyContent: 'center',
|
||||
width: size,
|
||||
},
|
||||
style,
|
||||
]}
|
||||
>
|
||||
<DefaultIcon
|
||||
color={color}
|
||||
size={size * iconMultiple}
|
||||
style={iconStyle}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
export default DefaultAvatar;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Text, type ViewStyle } from 'react-native';
|
||||
|
||||
import type { RNIconProps } from '../types';
|
||||
|
||||
interface DefaultIconProps extends RNIconProps {
|
||||
style?: ViewStyle;
|
||||
}
|
||||
|
||||
const DefaultIcon = memo<DefaultIconProps>(({ color = '#666', size = 12, style, ...rest }) => {
|
||||
return (
|
||||
<Text
|
||||
style={[
|
||||
{
|
||||
color,
|
||||
fontSize: size,
|
||||
fontWeight: 'bold',
|
||||
},
|
||||
style,
|
||||
]}
|
||||
{...rest}
|
||||
>
|
||||
🧠
|
||||
</Text>
|
||||
);
|
||||
});
|
||||
|
||||
export default DefaultIcon;
|
||||
@@ -0,0 +1,81 @@
|
||||
import React, { memo, useMemo } from 'react';
|
||||
import { type ViewStyle } from 'react-native';
|
||||
|
||||
import { rnModelMappings } from '../modelConfig';
|
||||
import DefaultAvatar from './DefaultAvatar';
|
||||
import DefaultIcon from './DefaultIcon';
|
||||
|
||||
export interface RNModelIconProps {
|
||||
model?: string;
|
||||
shape?: 'circle' | 'square';
|
||||
size?: number;
|
||||
style?: ViewStyle;
|
||||
type?: 'avatar' | 'mono' | 'color' | 'combine' | 'combine-color';
|
||||
}
|
||||
|
||||
const RNModelIcon = memo<RNModelIconProps>(
|
||||
({ model: originModel, size = 12, type = 'avatar', shape, ...rest }) => {
|
||||
const Render = useMemo(() => {
|
||||
if (!originModel) return undefined;
|
||||
const model = originModel.toLowerCase();
|
||||
for (const item of rnModelMappings) {
|
||||
if (item.keywords.some((keyword) => new RegExp(keyword, 'i').test(model))) {
|
||||
return item;
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
}, [originModel]);
|
||||
|
||||
const props = {
|
||||
size,
|
||||
...Render?.props,
|
||||
...rest,
|
||||
};
|
||||
|
||||
switch (type) {
|
||||
case 'avatar': {
|
||||
if (!Render?.Icon) return <DefaultAvatar shape={shape} {...props} />;
|
||||
return <Render.Icon.Avatar shape={shape} {...props} />;
|
||||
}
|
||||
case 'mono': {
|
||||
if (!Render?.Icon) return <DefaultIcon {...props} />;
|
||||
return <Render.Icon {...props} />;
|
||||
}
|
||||
case 'color': {
|
||||
if (!Render?.Icon) return <DefaultIcon {...props} />;
|
||||
return Render.Icon?.Color ? <Render.Icon.Color {...props} /> : <Render.Icon {...props} />;
|
||||
}
|
||||
case 'combine': {
|
||||
if (!Render?.Icon) return <DefaultIcon {...props} />;
|
||||
return Render.Icon?.Combine ? (
|
||||
<Render.Icon.Combine type={'mono'} {...props} />
|
||||
) : Render.Icon?.Brand ? (
|
||||
<Render.Icon.Brand {...props} />
|
||||
) : Render.Icon?.Text ? (
|
||||
<Render.Icon.Text {...props} />
|
||||
) : (
|
||||
<Render.Icon {...props} />
|
||||
);
|
||||
}
|
||||
case 'combine-color': {
|
||||
if (!Render?.Icon) return <DefaultIcon {...props} />;
|
||||
return Render.Icon?.Combine ? (
|
||||
<Render.Icon.Combine type={'color'} {...props} />
|
||||
) : Render.Icon?.BrandColor ? (
|
||||
<Render.Icon.BrandColor {...props} />
|
||||
) : Render.Icon?.Text ? (
|
||||
<Render.Icon.Text {...props} />
|
||||
) : (
|
||||
<Render.Icon {...props} />
|
||||
);
|
||||
}
|
||||
default: {
|
||||
return <DefaultIcon {...props} />;
|
||||
}
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
RNModelIcon.displayName = 'RNModelIcon';
|
||||
|
||||
export default RNModelIcon;
|
||||
@@ -0,0 +1,46 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Text, View, type ViewStyle } from 'react-native';
|
||||
|
||||
import RNModelIcon from '../ModelIcon';
|
||||
|
||||
export interface RNModelTagProps {
|
||||
model: string;
|
||||
style?: ViewStyle;
|
||||
textStyle?: ViewStyle;
|
||||
type?: 'color' | 'mono';
|
||||
}
|
||||
|
||||
const RNModelTag = memo<RNModelTagProps>(({ type = 'mono', model, style, textStyle, ...rest }) => (
|
||||
<View
|
||||
style={[
|
||||
{
|
||||
alignItems: 'center',
|
||||
backgroundColor: '#f5f5f5',
|
||||
borderRadius: 12,
|
||||
flexDirection: 'row',
|
||||
paddingHorizontal: 8,
|
||||
paddingVertical: 4,
|
||||
},
|
||||
style,
|
||||
]}
|
||||
{...rest}
|
||||
>
|
||||
<RNModelIcon model={model} size={12} type={type} />
|
||||
<Text
|
||||
style={[
|
||||
{
|
||||
color: '#666',
|
||||
fontSize: 12,
|
||||
marginLeft: 4,
|
||||
},
|
||||
textStyle,
|
||||
]}
|
||||
>
|
||||
{model}
|
||||
</Text>
|
||||
</View>
|
||||
));
|
||||
|
||||
RNModelTag.displayName = 'RNModelTag';
|
||||
|
||||
export default RNModelTag;
|
||||
@@ -0,0 +1,42 @@
|
||||
import React, { ReactNode, memo } from 'react';
|
||||
import { View, type ViewStyle } from 'react-native';
|
||||
|
||||
export interface RNProviderCombineProps {
|
||||
left: ReactNode;
|
||||
right: ReactNode;
|
||||
size?: number;
|
||||
style?: ViewStyle;
|
||||
}
|
||||
|
||||
const RNProviderCombine = memo<RNProviderCombineProps>(
|
||||
({ left, right, size = 24, style, ...rest }) => {
|
||||
return (
|
||||
<View
|
||||
style={[
|
||||
{
|
||||
alignItems: 'center',
|
||||
flexDirection: 'row',
|
||||
gap: size / 3,
|
||||
},
|
||||
style,
|
||||
]}
|
||||
{...rest}
|
||||
>
|
||||
{left}
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: '#e0e0e0',
|
||||
height: size * 0.6,
|
||||
marginHorizontal: size / 6,
|
||||
width: 1,
|
||||
}}
|
||||
/>
|
||||
{right}
|
||||
</View>
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
RNProviderCombine.displayName = 'RNProviderCombine';
|
||||
|
||||
export default RNProviderCombine;
|
||||
@@ -0,0 +1,63 @@
|
||||
import React, { memo, useMemo } from 'react';
|
||||
import { View, type ViewStyle } from 'react-native';
|
||||
|
||||
import { rnProviderMappings } from '../providerConfig';
|
||||
|
||||
export interface RNProviderCombineProps {
|
||||
provider?: string;
|
||||
size?: number;
|
||||
style?: ViewStyle;
|
||||
type?: 'mono' | 'color';
|
||||
}
|
||||
|
||||
const RNProviderCombineMain = memo<RNProviderCombineProps>(
|
||||
({ provider: originProvider, size = 12, type = 'color', style, ...rest }) => {
|
||||
const Render = useMemo(() => {
|
||||
if (!originProvider) return undefined;
|
||||
const provider = originProvider.toLowerCase();
|
||||
|
||||
for (const item of rnProviderMappings) {
|
||||
if (item.keywords.some((keyword) => keyword.toLowerCase() === provider)) {
|
||||
return item;
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
}, [originProvider]);
|
||||
|
||||
const iconProps = {
|
||||
size: size * (Render?.combineMultiple || 1),
|
||||
type,
|
||||
...Render?.props,
|
||||
};
|
||||
|
||||
let icon = Render?.Combine ? (
|
||||
<Render.Combine {...iconProps} />
|
||||
) : Render?.Icon?.Combine ? (
|
||||
<Render.Icon.Combine {...iconProps} />
|
||||
) : Render?.Icon?.Text ? (
|
||||
<Render.Icon.Text {...iconProps} />
|
||||
) : (
|
||||
<View style={{ backgroundColor: '#f0f0f0', height: size, width: size }} />
|
||||
);
|
||||
|
||||
return (
|
||||
<View
|
||||
style={[
|
||||
{
|
||||
alignItems: 'center',
|
||||
height: size * 1.5,
|
||||
justifyContent: 'center',
|
||||
},
|
||||
style,
|
||||
]}
|
||||
{...rest}
|
||||
>
|
||||
{icon}
|
||||
</View>
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
RNProviderCombineMain.displayName = 'RNProviderCombineMain';
|
||||
|
||||
export default RNProviderCombineMain;
|
||||
@@ -0,0 +1,44 @@
|
||||
import React, { memo } from 'react';
|
||||
import { View } from 'react-native';
|
||||
|
||||
import type { RNIconAvatarProps } from '../types';
|
||||
|
||||
import DefaultIcon from './DefaultIcon';
|
||||
|
||||
const DefaultAvatar = memo<Omit<RNIconAvatarProps, 'Icon'>>(
|
||||
({
|
||||
shape = 'circle',
|
||||
color = '#fff',
|
||||
background = '#f0f0f0',
|
||||
size,
|
||||
style,
|
||||
iconMultiple = 0.6,
|
||||
iconStyle,
|
||||
}) => {
|
||||
const borderRadius = shape === 'circle' ? size / 2 : Math.floor(size * 0.1);
|
||||
|
||||
return (
|
||||
<View
|
||||
style={[
|
||||
{
|
||||
alignItems: 'center',
|
||||
backgroundColor: background,
|
||||
borderRadius,
|
||||
height: size,
|
||||
justifyContent: 'center',
|
||||
width: size,
|
||||
},
|
||||
style,
|
||||
]}
|
||||
>
|
||||
<DefaultIcon
|
||||
color={color}
|
||||
size={size * iconMultiple}
|
||||
style={iconStyle}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
export default DefaultAvatar;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Text, type ViewStyle } from 'react-native';
|
||||
|
||||
import type { RNIconProps } from '../types';
|
||||
|
||||
interface DefaultIconProps extends RNIconProps {
|
||||
style?: ViewStyle;
|
||||
}
|
||||
|
||||
const DefaultIcon = memo<DefaultIconProps>(({ color = '#666', size = 12, style, ...rest }) => {
|
||||
return (
|
||||
<Text
|
||||
style={[
|
||||
{
|
||||
color,
|
||||
fontSize: size,
|
||||
fontWeight: 'bold',
|
||||
},
|
||||
style,
|
||||
]}
|
||||
{...rest}
|
||||
>
|
||||
📡
|
||||
</Text>
|
||||
);
|
||||
});
|
||||
|
||||
export default DefaultIcon;
|
||||
@@ -0,0 +1,87 @@
|
||||
import React, { memo, useMemo } from 'react';
|
||||
import { type ViewStyle } from 'react-native';
|
||||
|
||||
import { rnProviderMappings } from '../providerConfig';
|
||||
|
||||
import DefaultAvatar from './DefaultAvatar';
|
||||
import DefaultIcon from './DefaultIcon';
|
||||
|
||||
export interface RNProviderIconProps {
|
||||
forceMono?: boolean;
|
||||
provider?: string;
|
||||
shape?: 'circle' | 'square';
|
||||
size?: number;
|
||||
style?: ViewStyle;
|
||||
type?: 'avatar' | 'mono' | 'color' | 'combine' | 'combine-color';
|
||||
}
|
||||
|
||||
const RNProviderIcon = memo<RNProviderIconProps>(
|
||||
({ provider: originProvider, size = 12, type = 'avatar', forceMono, shape, ...rest }) => {
|
||||
const Render = useMemo(() => {
|
||||
if (!originProvider) return undefined;
|
||||
const provider = originProvider.toLowerCase();
|
||||
|
||||
for (const item of rnProviderMappings) {
|
||||
if (item.keywords.some((keyword) => keyword.toLowerCase() === provider)) {
|
||||
return item;
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
}, [originProvider]);
|
||||
|
||||
const props = {
|
||||
size,
|
||||
...Render?.props,
|
||||
...rest,
|
||||
};
|
||||
|
||||
switch (type) {
|
||||
case 'avatar': {
|
||||
if (!Render?.Icon) return <DefaultAvatar shape={shape} {...props} />;
|
||||
return <Render.Icon.Avatar shape={shape} {...props} />;
|
||||
}
|
||||
case 'mono': {
|
||||
if (!Render?.Icon) return <DefaultIcon {...props} />;
|
||||
if (!forceMono && originProvider === 'lobehub') {
|
||||
return Render.Icon?.Color ? <Render.Icon.Color {...props} /> : <Render.Icon {...props} />;
|
||||
}
|
||||
return <Render.Icon {...props} />;
|
||||
}
|
||||
case 'color': {
|
||||
if (!Render?.Icon) return <DefaultIcon {...props} />;
|
||||
return Render.Icon?.Color ? <Render.Icon.Color {...props} /> : <Render.Icon {...props} />;
|
||||
}
|
||||
case 'combine': {
|
||||
if (!Render?.Icon) return <DefaultIcon {...props} />;
|
||||
return Render.Icon?.Combine ? (
|
||||
<Render.Icon.Combine type={'mono'} {...props} />
|
||||
) : Render.Icon?.Brand ? (
|
||||
<Render.Icon.Brand {...props} />
|
||||
) : Render.Icon?.Text ? (
|
||||
<Render.Icon.Text {...props} />
|
||||
) : (
|
||||
<Render.Icon {...props} />
|
||||
);
|
||||
}
|
||||
case 'combine-color': {
|
||||
if (!Render?.Icon) return <DefaultIcon {...props} />;
|
||||
return Render.Icon?.Combine ? (
|
||||
<Render.Icon.Combine type={'color'} {...props} />
|
||||
) : Render.Icon?.BrandColor ? (
|
||||
<Render.Icon.BrandColor {...props} />
|
||||
) : Render.Icon?.Text ? (
|
||||
<Render.Icon.Text {...props} />
|
||||
) : (
|
||||
<Render.Icon {...props} />
|
||||
);
|
||||
}
|
||||
default: {
|
||||
return <DefaultIcon {...props} />;
|
||||
}
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
RNProviderIcon.displayName = 'RNProviderIcon';
|
||||
|
||||
export default RNProviderIcon;
|
||||
@@ -0,0 +1,3 @@
|
||||
export { default as RNIconAvatar, type RNIconAvatarProps } from './IconAvatar';
|
||||
export { default as RNIconCombine } from './IconCombine';
|
||||
export type { CompoundedIcon, RNIconCombineProps, RNIconProps, RNIconTextProps } from './types';
|
||||
@@ -0,0 +1,201 @@
|
||||
import { FC } from 'react';
|
||||
|
||||
import Adobe from '../icons/Adobe';
|
||||
import Ai21 from '../icons/Ai21';
|
||||
import Ai360 from '../icons/Ai360';
|
||||
import AiHubMix from '../icons/AiHubMix';
|
||||
import AiMass from '../icons/AiMass';
|
||||
import AionLabs from '../icons/AionLabs';
|
||||
import Anthropic from '../icons/Anthropic';
|
||||
import AssemblyAI from '../icons/AssemblyAI';
|
||||
import Aws from '../icons/Aws';
|
||||
import Aya from '../icons/Aya';
|
||||
import Baichuan from '../icons/Baichuan';
|
||||
import BurnCloud from '../icons/BurnCloud';
|
||||
import ByteDance from '../icons/ByteDance';
|
||||
import ChatGLM from '../icons/ChatGLM';
|
||||
import Claude from '../icons/Claude';
|
||||
import CodeGeeX from '../icons/CodeGeeX';
|
||||
import CogView from '../icons/CogView';
|
||||
import Cohere from '../icons/Cohere';
|
||||
import Dalle from '../icons/Dalle';
|
||||
import Dbrx from '../icons/Dbrx';
|
||||
import DeepMind from '../icons/DeepMind';
|
||||
import DeepSeek from '../icons/DeepSeek';
|
||||
import Doubao from '../icons/Doubao';
|
||||
import Fireworks from '../icons/Fireworks';
|
||||
import FishAudio from '../icons/FishAudio';
|
||||
import Flux from '../icons/Flux';
|
||||
import Gemini from '../icons/Gemini';
|
||||
import Gemma from '../icons/Gemma';
|
||||
import Google from '../icons/Google';
|
||||
import Grok from '../icons/Grok';
|
||||
import Hunyuan from '../icons/Hunyuan';
|
||||
import Ideogram from '../icons/Ideogram';
|
||||
import Inflection from '../icons/Inflection';
|
||||
import InternLM from '../icons/InternLM';
|
||||
import Jina from '../icons/Jina';
|
||||
import LLaVA from '../icons/LLaVA';
|
||||
import Liquid from '../icons/Liquid';
|
||||
import Meta from '../icons/Meta';
|
||||
import Microsoft from '../icons/Microsoft';
|
||||
import Minimax from '../icons/Minimax';
|
||||
import Mistral from '../icons/Mistral';
|
||||
import Moonshot from '../icons/Moonshot';
|
||||
// Import React Native icon components
|
||||
import OpenAI from '../icons/OpenAI';
|
||||
import OpenChat from '../icons/OpenChat';
|
||||
import OpenRouter from '../icons/OpenRouter';
|
||||
import PaLM from '../icons/PaLM';
|
||||
import Perplexity from '../icons/Perplexity';
|
||||
import Qiniu from '../icons/Qiniu';
|
||||
import Qwen from '../icons/Qwen';
|
||||
import Rwkv from '../icons/Rwkv';
|
||||
import SenseNova from '../icons/SenseNova';
|
||||
import Spark from '../icons/Spark';
|
||||
import Stability from '../icons/Stability';
|
||||
import Stepfun from '../icons/Stepfun';
|
||||
import Suno from '../icons/Suno';
|
||||
import Udio from '../icons/Udio';
|
||||
import Upstage from '../icons/Upstage';
|
||||
import V0 from '../icons/V0';
|
||||
import VertexAI from '../icons/VertexAI';
|
||||
import Voyage from '../icons/Voyage';
|
||||
import Wenxin from '../icons/Wenxin';
|
||||
import type { RNIconProps } from './types';
|
||||
|
||||
type RNModelIconType = FC<RNIconProps & any> & {
|
||||
Avatar: FC<any>;
|
||||
Brand?: FC<RNIconProps & any>;
|
||||
BrandColor?: FC<RNIconProps & any>;
|
||||
Color?: FC<RNIconProps & any>;
|
||||
Combine?: FC<any>;
|
||||
Text?: FC<RNIconProps & any>;
|
||||
};
|
||||
|
||||
// Define a type for our model mapping
|
||||
export interface RNModelMapping {
|
||||
Icon: RNModelIconType;
|
||||
keywords: string[];
|
||||
props?: any;
|
||||
}
|
||||
|
||||
// Create a mapping of model keywords to their respective Icon functions
|
||||
export const rnModelMappings: RNModelMapping[] = [
|
||||
{ Icon: OpenAI, keywords: ['gpt-3'], props: { type: 'gpt3' } },
|
||||
{ Icon: OpenAI, keywords: ['gpt-4'], props: { type: 'gpt4' } },
|
||||
{
|
||||
Icon: OpenAI,
|
||||
keywords: ['o1-', '^o1', '/o1', 'o3-', '^o3', '/o3', 'o4-', '^o4', '/o4'],
|
||||
props: { type: 'o1' },
|
||||
},
|
||||
{ Icon: Dalle, keywords: ['dalle', 'dall-e'] },
|
||||
{
|
||||
Icon: OpenAI,
|
||||
keywords: [
|
||||
'text-embedding-',
|
||||
'tts-',
|
||||
'whisper-',
|
||||
'codex',
|
||||
'davinci',
|
||||
'babbage',
|
||||
'omni-moderation',
|
||||
'text-moderation',
|
||||
'text-adb',
|
||||
'computer-use',
|
||||
],
|
||||
props: { type: 'platform' },
|
||||
},
|
||||
{
|
||||
Icon: OpenAI,
|
||||
keywords: ['^gpt-', '/gpt-', 'openai'],
|
||||
},
|
||||
{ Icon: ChatGLM, keywords: ['^glm-', '/glm-', 'chatglm'] },
|
||||
{ Icon: CodeGeeX, keywords: ['^codegeex', '/codegeex'] },
|
||||
{ Icon: Claude, keywords: ['claude'] },
|
||||
{ Icon: Anthropic, keywords: ['anthropic'] },
|
||||
{ Icon: Aws, keywords: ['titan'] },
|
||||
{ Icon: Fireworks, keywords: ['accounts/fireworks/models/fire'] },
|
||||
{ Icon: InternLM, keywords: ['internlm', 'internvl'] },
|
||||
{ Icon: Meta, keywords: ['llama', '/l3'] },
|
||||
{ Icon: LLaVA, keywords: ['llava'] },
|
||||
{ Icon: Gemini, keywords: ['gemini'] },
|
||||
{ Icon: DeepMind, keywords: ['^imagen-', '/imagen-', '^imagen\\d/'] },
|
||||
{ Icon: Gemma, keywords: ['gemma'] },
|
||||
{ Icon: Moonshot, keywords: ['kimi', 'moonshot'] },
|
||||
{ Icon: Qiniu, keywords: ['qiniu'] },
|
||||
{ Icon: Qwen, keywords: ['qwen', 'qwq', 'qvq', 'wanx'] },
|
||||
{ Icon: Minimax, keywords: ['minimax', 'abab'] },
|
||||
{
|
||||
Icon: Mistral,
|
||||
keywords: ['mistral', 'mixtral', 'codestral', 'mathstral', '/mn-', 'pixtral', 'ministral'],
|
||||
},
|
||||
{ Icon: Perplexity, keywords: ['pplx', 'sonar'] },
|
||||
{ Icon: DeepSeek, keywords: ['deepseek'] },
|
||||
{ Icon: OpenRouter, keywords: ['^openrouter'] },
|
||||
{ Icon: OpenChat, keywords: ['^openchat'] },
|
||||
{ Icon: Aya, keywords: ['aya'] },
|
||||
{ Icon: Cohere, keywords: ['command'] },
|
||||
{ Icon: Dbrx, keywords: ['dbrx'] },
|
||||
{ Icon: Stepfun, keywords: ['step'] },
|
||||
{ Icon: AiMass, keywords: ['taichu'] },
|
||||
{ Icon: Ai360, keywords: ['360gpt', '360zhinao'] },
|
||||
{ Icon: Baichuan, keywords: ['baichuan'] },
|
||||
{ Icon: Rwkv, keywords: ['rwkv', '/eagle-'] },
|
||||
{ Icon: Wenxin, keywords: ['ernie'] },
|
||||
{ Icon: Jina, keywords: ['^jina', '/jina'] },
|
||||
{ Icon: Doubao, keywords: ['^ep-', 'doubao-'] },
|
||||
{ Icon: Hunyuan, keywords: ['hunyuan'] },
|
||||
{ Icon: FishAudio, keywords: ['^d_', '^g_', '^wd_'] },
|
||||
{ Icon: ByteDance, keywords: ['skylark'] },
|
||||
{ Icon: BurnCloud, keywords: ['burncloud'] },
|
||||
{
|
||||
Icon: Stability,
|
||||
keywords: [
|
||||
'stable-diffusion',
|
||||
'stable-video',
|
||||
'stable-cascade',
|
||||
'sdxl',
|
||||
'stablelm',
|
||||
'^stable-',
|
||||
'^sd3',
|
||||
'^sd2',
|
||||
'^sd1',
|
||||
],
|
||||
},
|
||||
{ Icon: Flux, keywords: ['flux'] },
|
||||
{ Icon: Suno, keywords: ['suno'] },
|
||||
{ Icon: Microsoft, keywords: ['wizardlm', '/phi-', '^phi-', '-phi-'] },
|
||||
{ Icon: Adobe, keywords: ['firefly'] },
|
||||
{ Icon: Ai21, keywords: ['jamba', '^j2-', 'ai21'] },
|
||||
{ Icon: Upstage, keywords: ['^solar-', '/solar'] },
|
||||
{ Icon: PaLM, keywords: ['palm'] },
|
||||
{ Icon: SenseNova, keywords: ['SenseChat', 'SenseNova'] },
|
||||
{ Icon: Grok, keywords: ['^grok-', '/grok-'] },
|
||||
{ Icon: Ideogram, keywords: ['ideogram'] },
|
||||
{
|
||||
Icon: Spark,
|
||||
keywords: [
|
||||
'spark',
|
||||
'general$',
|
||||
'generalv3$',
|
||||
'generalv3.5$',
|
||||
'4.0ultra$',
|
||||
'pro-128k$',
|
||||
'^max-32k$',
|
||||
'^lite$',
|
||||
'^x1$',
|
||||
],
|
||||
},
|
||||
{ Icon: Udio, keywords: ['udio'] },
|
||||
{ Icon: Voyage, keywords: ['voyage'] },
|
||||
{ Icon: AssemblyAI, keywords: ['assemblyai'] },
|
||||
{ Icon: Liquid, keywords: ['liquid', 'lfm'] },
|
||||
{ Icon: Inflection, keywords: ['inflection-'] },
|
||||
{ Icon: AionLabs, keywords: ['aion-'] },
|
||||
{ Icon: AiHubMix, keywords: ['aihubmix'] },
|
||||
{ Icon: V0, keywords: ['^v0-'] },
|
||||
{ Icon: VertexAI, keywords: ['^veo-', '/veo-'] },
|
||||
{ Icon: Google, keywords: ['google'] },
|
||||
{ Icon: CogView, keywords: ['cogview'] },
|
||||
];
|
||||
@@ -0,0 +1,258 @@
|
||||
import { FC, memo } from 'react';
|
||||
|
||||
import type { RNIconProps, RNIconAvatarProps, RNIconCombineProps } from './types';
|
||||
|
||||
import { RNModelProvider } from './providerEnum';
|
||||
|
||||
// Import React Native icon components
|
||||
import Ai21 from '../icons/Ai21';
|
||||
import Ai302 from '../icons/Ai302';
|
||||
import Ai360 from '../icons/Ai360';
|
||||
import AiHubMix from '../icons/AiHubMix';
|
||||
import AiMass from '../icons/AiMass';
|
||||
import AlibabaCloud from '../icons/AlibabaCloud';
|
||||
import Anthropic from '../icons/Anthropic';
|
||||
import Aws from '../icons/Aws';
|
||||
import Azure from '../icons/Azure';
|
||||
import AzureAI from '../icons/AzureAI';
|
||||
import Baichuan from '../icons/Baichuan';
|
||||
import BaiduCloud from '../icons/BaiduCloud';
|
||||
import Bedrock from '../icons/Bedrock';
|
||||
import BurnCloud from '../icons/BurnCloud';
|
||||
import Claude from '../icons/Claude';
|
||||
import Cloudflare from '../icons/Cloudflare';
|
||||
import Cohere from '../icons/Cohere';
|
||||
import DeepSeek from '../icons/DeepSeek';
|
||||
import Doubao from '../icons/Doubao';
|
||||
import Fal from '../icons/Fal';
|
||||
import Fireworks from '../icons/Fireworks';
|
||||
import Gemini from '../icons/Gemini';
|
||||
import GiteeAI from '../icons/GiteeAI';
|
||||
import Github from '../icons/Github';
|
||||
import Google from '../icons/Google';
|
||||
import Groq from '../icons/Groq';
|
||||
import Higress from '../icons/Higress';
|
||||
import HuggingFace from '../icons/HuggingFace';
|
||||
import Hunyuan from '../icons/Hunyuan';
|
||||
import Infinigence from '../icons/Infinigence';
|
||||
import InternLM from '../icons/InternLM';
|
||||
import Jina from '../icons/Jina';
|
||||
import LmStudio from '../icons/LmStudio';
|
||||
import LobeHub from '../icons/LobeHub';
|
||||
import Minimax from '../icons/Minimax';
|
||||
import Mistral from '../icons/Mistral';
|
||||
import ModelScope from '../icons/ModelScope';
|
||||
import Moonshot from '../icons/Moonshot';
|
||||
import Novita from '../icons/Novita';
|
||||
import Nvidia from '../icons/Nvidia';
|
||||
import Ollama from '../icons/Ollama';
|
||||
import OpenAI from '../icons/OpenAI';
|
||||
import OpenRouter from '../icons/OpenRouter';
|
||||
import PPIO from '../icons/PPIO';
|
||||
import Perplexity from '../icons/Perplexity';
|
||||
import Player2 from '../icons/Player2';
|
||||
import Qiniu from '../icons/Qiniu';
|
||||
import Qwen from '../icons/Qwen';
|
||||
import SambaNova from '../icons/SambaNova';
|
||||
import Search1API from '../icons/Search1API';
|
||||
import SenseNova from '../icons/SenseNova';
|
||||
import SiliconCloud from '../icons/SiliconCloud';
|
||||
import Spark from '../icons/Spark';
|
||||
import Stepfun from '../icons/Stepfun';
|
||||
import TencentCloud from '../icons/TencentCloud';
|
||||
import Together from '../icons/Together';
|
||||
import Upstage from '../icons/Upstage';
|
||||
import V0 from '../icons/V0';
|
||||
import Vercel from '../icons/Vercel';
|
||||
import VertexAI from '../icons/VertexAI';
|
||||
import Vllm from '../icons/Vllm';
|
||||
import Volcengine from '../icons/Volcengine';
|
||||
import Wenxin from '../icons/Wenxin';
|
||||
import WorkersAI from '../icons/WorkersAI';
|
||||
import XAI from '../icons/XAI';
|
||||
import Xinference from '../icons/Xinference';
|
||||
import ZeroOne from '../icons/ZeroOne';
|
||||
import Zhipu from '../icons/Zhipu';
|
||||
|
||||
import Combine from './ProviderCombine/Combine';
|
||||
|
||||
type RNProviderIconType = FC<RNIconProps & any> & {
|
||||
Avatar: FC<Omit<RNIconAvatarProps, 'Icon'> & any>;
|
||||
Brand?: FC<RNIconProps & any>;
|
||||
BrandColor?: FC<RNIconProps & any>;
|
||||
Color?: FC<RNIconProps & any>;
|
||||
Combine?: FC<Omit<RNIconCombineProps, 'Icon' | 'Text'> & any>;
|
||||
Text?: FC<RNIconProps & any>;
|
||||
};
|
||||
|
||||
export interface RNProviderMapping {
|
||||
Combine?: FC<{ size: number; type: 'color' | 'mono' }>;
|
||||
Icon: RNProviderIconType;
|
||||
combineMultiple?: number;
|
||||
keywords: string[];
|
||||
props?: any;
|
||||
}
|
||||
|
||||
export const rnProviderMappings: RNProviderMapping[] = [
|
||||
{ Icon: LobeHub, keywords: [RNModelProvider.LobeHub] },
|
||||
{ Icon: Zhipu, combineMultiple: 1.25, keywords: [RNModelProvider.ZhiPu] },
|
||||
{
|
||||
Combine: memo(({ size = 24, type = 'color', ...props }) => (
|
||||
<Combine
|
||||
left={type === 'color' ? <Aws.Color size={size * 1.2} /> : <Aws size={size * 1.2} />}
|
||||
right={<Bedrock.Combine size={size} type={type} />}
|
||||
size={size}
|
||||
{...props}
|
||||
/>
|
||||
)),
|
||||
Icon: Bedrock,
|
||||
combineMultiple: 1.1,
|
||||
keywords: [RNModelProvider.Bedrock],
|
||||
},
|
||||
{ Icon: DeepSeek, combineMultiple: 1.16, keywords: [RNModelProvider.DeepSeek] },
|
||||
{
|
||||
Combine: memo(({ size = 24, type = 'color', ...props }) => (
|
||||
<Combine
|
||||
left={
|
||||
type === 'color' ? (
|
||||
<Google.BrandColor size={size * 0.95} />
|
||||
) : (
|
||||
<Google.Brand size={size * 0.95} />
|
||||
)
|
||||
}
|
||||
right={<Gemini.Combine size={size} type={type} />}
|
||||
size={size}
|
||||
{...props}
|
||||
/>
|
||||
)),
|
||||
Icon: Google,
|
||||
combineMultiple: 0.92,
|
||||
keywords: [RNModelProvider.Google],
|
||||
},
|
||||
{
|
||||
Combine: memo(({ size = 24, type = 'color', ...props }) => (
|
||||
<Combine
|
||||
left={<Azure.Combine size={size * 0.92} type={type} />}
|
||||
right={<OpenAI.Combine size={size} />}
|
||||
size={size}
|
||||
{...props}
|
||||
/>
|
||||
)),
|
||||
Icon: Azure,
|
||||
combineMultiple: 0.9,
|
||||
keywords: [RNModelProvider.Azure],
|
||||
},
|
||||
{ Icon: Moonshot, combineMultiple: 0.9, keywords: [RNModelProvider.Moonshot] },
|
||||
{ Icon: Novita, keywords: [RNModelProvider.Novita] },
|
||||
{ Icon: OpenAI, keywords: [RNModelProvider.OpenAI] },
|
||||
{ Icon: Ollama, combineMultiple: 1.16, keywords: [RNModelProvider.Ollama] },
|
||||
{ Icon: Perplexity, keywords: [RNModelProvider.Perplexity] },
|
||||
{ Icon: Minimax, combineMultiple: 1.3, keywords: [RNModelProvider.Minimax] },
|
||||
{ Icon: Mistral, keywords: [RNModelProvider.Mistral] },
|
||||
{
|
||||
Combine: memo(({ size = 24, type = 'color', ...props }) => (
|
||||
<Combine
|
||||
left={<Anthropic.Text size={size * 0.75} />}
|
||||
right={<Claude.Combine size={size} type={type} />}
|
||||
size={size}
|
||||
{...props}
|
||||
/>
|
||||
)),
|
||||
Icon: Anthropic,
|
||||
combineMultiple: 0.83,
|
||||
keywords: [RNModelProvider.Anthropic],
|
||||
},
|
||||
{ Icon: Groq, keywords: [RNModelProvider.Groq] },
|
||||
{ Icon: OpenRouter, combineMultiple: 0.8, keywords: [RNModelProvider.OpenRouter] },
|
||||
{ Icon: ZeroOne, combineMultiple: 1, keywords: [RNModelProvider.ZeroOne] },
|
||||
{ Icon: Together, keywords: [RNModelProvider.TogetherAI] },
|
||||
{ Icon: Qiniu, combineMultiple: 1.1, keywords: [RNModelProvider.Qiniu] },
|
||||
{
|
||||
Combine: memo(({ size = 24, type = 'color', ...props }) => (
|
||||
<Combine
|
||||
left={<AlibabaCloud.Combine size={size} type={type} />}
|
||||
right={<Qwen.Combine size={size * 0.9} type={type} />}
|
||||
size={size}
|
||||
{...props}
|
||||
/>
|
||||
)),
|
||||
Icon: AlibabaCloud,
|
||||
combineMultiple: 1.1,
|
||||
keywords: [RNModelProvider.Qwen],
|
||||
},
|
||||
{ Icon: Stepfun, combineMultiple: 0.83, keywords: [RNModelProvider.Stepfun] },
|
||||
{ Icon: Spark, combineMultiple: 0.92, keywords: [RNModelProvider.Spark] },
|
||||
{ Icon: Fireworks, combineMultiple: 1.14, keywords: [RNModelProvider.FireworksAI] },
|
||||
{ Icon: Baichuan, combineMultiple: 0.83, keywords: [RNModelProvider.Baichuan] },
|
||||
{ Icon: BurnCloud, combineMultiple: 1.2, keywords: [RNModelProvider.BurnCloud] },
|
||||
{ Icon: AiMass, combineMultiple: 1.16, keywords: [RNModelProvider.Taichu] },
|
||||
{ Icon: Ai360, combineMultiple: 0.83, keywords: [RNModelProvider.Ai360] },
|
||||
{ Icon: SiliconCloud, combineMultiple: 1, keywords: [RNModelProvider.SiliconCloud] },
|
||||
{ Icon: Upstage, combineMultiple: 0.9, keywords: [RNModelProvider.Upstage] },
|
||||
{ Icon: Ai21, combineMultiple: 0.9, keywords: [RNModelProvider.Ai21] },
|
||||
{ Icon: Player2, combineMultiple: 0.9, keywords: [RNModelProvider.Player2] },
|
||||
{ Icon: Github, combineMultiple: 0.95, keywords: [RNModelProvider.Github] },
|
||||
{ Icon: Doubao, keywords: [RNModelProvider.Doubao] },
|
||||
{ Icon: Hunyuan, keywords: [RNModelProvider.Hunyuan] },
|
||||
{ Icon: Nvidia, keywords: [RNModelProvider.Nvidia] },
|
||||
{ Icon: TencentCloud, keywords: [RNModelProvider.TencentCloud] },
|
||||
{
|
||||
Combine: memo(({ size = 24, type = 'color', ...props }) => (
|
||||
<Combine
|
||||
left={<BaiduCloud.Combine size={size * 0.9} type={type} />}
|
||||
right={<Wenxin.Combine extra={'千帆'} size={size} type={type} {...props} />}
|
||||
size={size}
|
||||
{...props}
|
||||
/>
|
||||
)),
|
||||
Icon: Wenxin,
|
||||
keywords: [RNModelProvider.Wenxin],
|
||||
},
|
||||
{ Icon: SenseNova, combineMultiple: 0.95, keywords: [RNModelProvider.SenseNova] },
|
||||
{ Icon: HuggingFace, combineMultiple: 1.16, keywords: [RNModelProvider.HuggingFace] },
|
||||
{ Icon: LmStudio, keywords: [RNModelProvider.LmStudio] },
|
||||
{ Icon: XAI, combineMultiple: 0.85, keywords: [RNModelProvider.XAI] },
|
||||
{
|
||||
Combine: memo(({ size = 24, type = 'color', ...props }) => (
|
||||
<Combine
|
||||
left={<Cloudflare.Combine size={size * 1.1} type={type} />}
|
||||
right={<WorkersAI.Combine size={size * 0.9} type={type} />}
|
||||
size={size}
|
||||
{...props}
|
||||
/>
|
||||
)),
|
||||
Icon: Cloudflare,
|
||||
combineMultiple: 1.1,
|
||||
keywords: [RNModelProvider.Cloudflare],
|
||||
},
|
||||
{ Icon: InternLM, combineMultiple: 0.95, keywords: [RNModelProvider.InternLM] },
|
||||
{ Icon: Higress, keywords: [RNModelProvider.Higress] },
|
||||
{ Icon: Vllm, combineMultiple: 0.85, keywords: [RNModelProvider.VLLM] },
|
||||
{ Icon: GiteeAI, combineMultiple: 0.95, keywords: [RNModelProvider.GiteeAI] },
|
||||
{ Icon: ModelScope, combineMultiple: 1.2, keywords: [RNModelProvider.ModelScope] },
|
||||
{ Icon: VertexAI, keywords: [RNModelProvider.VertexAI] },
|
||||
{ Icon: PPIO, combineMultiple: 0.85, keywords: [RNModelProvider.PPIO] },
|
||||
{ Icon: Jina, keywords: [RNModelProvider.Jina] },
|
||||
{ Icon: AzureAI, keywords: [RNModelProvider.AzureAI] },
|
||||
{ Icon: Volcengine, keywords: [RNModelProvider.Volcengine] },
|
||||
{ Icon: SambaNova, combineMultiple: 0.8, keywords: [RNModelProvider.SambaNova] },
|
||||
{ Icon: Cohere, keywords: [RNModelProvider.Cohere] },
|
||||
{ Icon: Search1API, combineMultiple: 0.9, keywords: [RNModelProvider.Search1API] },
|
||||
{ Icon: Infinigence, combineMultiple: 0.8, keywords: [RNModelProvider.InfiniAI] },
|
||||
{ Icon: Xinference, combineMultiple: 0.85, keywords: [RNModelProvider.Xinference] },
|
||||
{ Icon: Fal, combineMultiple: 0.8, keywords: [RNModelProvider.Fal] },
|
||||
{ Icon: Ai302, combineMultiple: 0.9, keywords: [RNModelProvider.Ai302] },
|
||||
{ Icon: AiHubMix, combineMultiple: 0.9, keywords: [RNModelProvider.AiHubMix] },
|
||||
{
|
||||
Combine: memo(({ size = 24, ...props }) => (
|
||||
<Combine
|
||||
left={<Vercel.Combine size={size * 0.9} />}
|
||||
right={<V0 size={size} />}
|
||||
size={size}
|
||||
{...props}
|
||||
/>
|
||||
)),
|
||||
Icon: Vercel,
|
||||
keywords: [RNModelProvider.V0],
|
||||
},
|
||||
];
|
||||
@@ -0,0 +1,65 @@
|
||||
export enum RNModelProvider {
|
||||
Ai21 = 'ai21',
|
||||
Ai302 = 'ai302',
|
||||
Ai360 = 'ai360',
|
||||
AiHubMix = 'aihubmix',
|
||||
Anthropic = 'anthropic',
|
||||
Azure = 'azure',
|
||||
AzureAI = 'azureai',
|
||||
Baichuan = 'baichuan',
|
||||
Bedrock = 'bedrock',
|
||||
BurnCloud = 'burncloud',
|
||||
Cloudflare = 'cloudflare',
|
||||
Cohere = 'cohere',
|
||||
DeepSeek = 'deepseek',
|
||||
Doubao = 'Doubao',
|
||||
Fal = 'fal',
|
||||
FireworksAI = 'fireworksai',
|
||||
GiteeAI = 'giteeai',
|
||||
Github = 'github',
|
||||
Google = 'google',
|
||||
Groq = 'groq',
|
||||
Higress = 'higress',
|
||||
HuggingFace = 'huggingface',
|
||||
Hunyuan = 'hunyuan',
|
||||
InfiniAI = 'infiniai',
|
||||
InternLM = 'internlm',
|
||||
Jina = 'jina',
|
||||
LmStudio = 'lmstudio',
|
||||
LobeHub = 'lobehub',
|
||||
Minimax = 'minimax',
|
||||
Mistral = 'mistral',
|
||||
ModelScope = 'modelscope',
|
||||
Moonshot = 'moonshot',
|
||||
Novita = 'novita',
|
||||
Nvidia = 'nvidia',
|
||||
Ollama = 'ollama',
|
||||
OpenAI = 'openai',
|
||||
OpenRouter = 'openrouter',
|
||||
PPIO = 'ppio',
|
||||
Perplexity = 'perplexity',
|
||||
Player2 = 'Player2',
|
||||
Qiniu = 'qiniu',
|
||||
Qwen = 'qwen',
|
||||
SambaNova = 'sambanova',
|
||||
Search1API = 'search1api',
|
||||
SenseNova = 'sensenova',
|
||||
SiliconCloud = 'siliconcloud',
|
||||
Spark = 'spark',
|
||||
Stepfun = 'stepfun',
|
||||
Taichu = 'taichu',
|
||||
TencentCloud = 'tencentcloud',
|
||||
TogetherAI = 'togetherai',
|
||||
Upstage = 'upstage',
|
||||
V0 = 'v0',
|
||||
VLLM = 'vllm',
|
||||
VertexAI = 'vertexai',
|
||||
Volcengine = 'volcengine',
|
||||
Wenxin = 'wenxin',
|
||||
XAI = 'xai',
|
||||
Xinference = 'xinference',
|
||||
ZeroOne = 'zeroone',
|
||||
ZhiPu = 'zhipu',
|
||||
}
|
||||
|
||||
export type RNModelProviderKey = Lowercase<keyof typeof RNModelProvider>;
|
||||
@@ -0,0 +1,49 @@
|
||||
import type { ComponentType } from 'react';
|
||||
import type { ViewStyle } from 'react-native';
|
||||
|
||||
export interface RNIconProps {
|
||||
color?: string;
|
||||
size?: number;
|
||||
style?: ViewStyle;
|
||||
}
|
||||
|
||||
export interface RNIconAvatarProps {
|
||||
Icon?: ComponentType<RNIconProps>;
|
||||
background?: string;
|
||||
color?: string;
|
||||
iconMultiple?: number;
|
||||
iconStyle?: ViewStyle;
|
||||
shape?: 'circle' | 'square';
|
||||
size: number;
|
||||
style?: ViewStyle;
|
||||
}
|
||||
|
||||
export interface RNIconTextProps extends RNIconProps {
|
||||
text?: string;
|
||||
textColor?: string;
|
||||
}
|
||||
|
||||
export interface RNIconCombineProps extends RNIconProps {
|
||||
Icon?: ComponentType<RNIconProps> | ComponentType<RNIconAvatarProps>;
|
||||
Text?: ComponentType<RNIconProps>;
|
||||
color?: string;
|
||||
extra?: string;
|
||||
extraStyle?: ViewStyle;
|
||||
iconProps?: Partial<RNIconAvatarProps>;
|
||||
inverse?: boolean;
|
||||
showLogo?: boolean;
|
||||
showText?: boolean;
|
||||
size?: number;
|
||||
spaceMultiple?: number;
|
||||
style?: ViewStyle;
|
||||
textMultiple?: number;
|
||||
}
|
||||
|
||||
export type CompoundedIcon = ComponentType<RNIconProps> & {
|
||||
Avatar: ComponentType<RNIconAvatarProps>;
|
||||
Color: ComponentType<RNIconProps>;
|
||||
Combine: ComponentType<RNIconCombineProps>;
|
||||
Text: ComponentType<RNIconTextProps>;
|
||||
colorPrimary: string;
|
||||
title: string;
|
||||
};
|
||||
@@ -0,0 +1,25 @@
|
||||
import { useMemo } from 'react';
|
||||
|
||||
export const useFillId = (namespace: string) => {
|
||||
const id = `lobe-icons-${namespace.toLowerCase()}-fill`;
|
||||
return useMemo(
|
||||
() => ({
|
||||
fill: `url(#${id})`,
|
||||
id,
|
||||
}),
|
||||
[namespace],
|
||||
);
|
||||
};
|
||||
|
||||
export const useFillIds = (namespace: string, length: number) => {
|
||||
return useMemo(() => {
|
||||
const ids = Array.from({ length }, (_, i) => {
|
||||
const id = `lobe-icons-${namespace.toLowerCase()}-fill-${i}`;
|
||||
return {
|
||||
fill: `url(#${id})`,
|
||||
id,
|
||||
};
|
||||
});
|
||||
return ids;
|
||||
}, [namespace, length]);
|
||||
};
|
||||
@@ -0,0 +1,22 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
|
||||
|
||||
import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
|
||||
import Mono from './Mono';
|
||||
|
||||
export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
|
||||
|
||||
const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
|
||||
return (
|
||||
<RNIconAvatar
|
||||
Icon={Mono}
|
||||
aria-label={TITLE}
|
||||
background={background || AVATAR_BACKGROUND}
|
||||
color={AVATAR_COLOR}
|
||||
iconMultiple={AVATAR_ICON_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
export default Avatar;
|
||||
@@ -0,0 +1,19 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
|
||||
return (
|
||||
<Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
|
||||
<Path
|
||||
d="M14.86 3H23v19zM9.14 3H1v19zM11.992 9.998L17.182 22h-3.394l-1.549-3.813h-3.79z"
|
||||
fill="#EB1000"
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AdobeColor';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconCombine, type RNIconCombineProps } from '@/features';
|
||||
|
||||
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
|
||||
import Color from './Color';
|
||||
import Mono from './Mono';
|
||||
import Text from './Text';
|
||||
|
||||
export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
|
||||
type?: 'color' | 'mono';
|
||||
}
|
||||
const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
|
||||
const Icon = type === 'color' ? Color : Mono;
|
||||
|
||||
return (
|
||||
<RNIconCombine
|
||||
Icon={Icon}
|
||||
Text={Text}
|
||||
aria-label={TITLE}
|
||||
spaceMultiple={COMBINE_SPACE_MULTIPLE}
|
||||
textMultiple={COMBINE_TEXT_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
export default Combine;
|
||||
@@ -0,0 +1,27 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 24 24"
|
||||
width={size}
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M14.86 3H23v19zM9.14 3H1v19zM11.992 9.998L17.182 22h-3.394l-1.549-3.813h-3.79z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AdobeMono';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,27 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 78 24"
|
||||
width={size * 3.25} // 保持宽高比
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M13.541 17.383H7.113l-1.336 4.116c-.055.166-.166.222-.333.222H2.216c-.196 0-.251-.083-.196-.278l5.568-16.05c.11-.278.222-.612.25-1.67 0-.138.083-.194.194-.194h4.425c.139 0 .194.028.222.14l6.345 17.802c.057.167.029.25-.167.25H15.24c-.139 0-.222-.056-.305-.167l-1.392-4.173v.002zm-1.057-3.45c-.528-1.836-1.64-5.203-2.197-7.205h-.03c-.444 1.893-1.418 4.951-2.142 7.205h4.37zm6.687 1.028c0-4.005 2.978-7.314 8.071-7.314.222 0 .473 0 .89.027v-5.48c0-.138.083-.194.194-.194h3.535c.111 0 .139.056.139.167v16.438c0 .67.056 1.502.112 2.032 0 .166-.027.222-.167.278A14.056 14.056 0 0126.435 22c-4.119-.002-7.264-2.31-7.264-7.039zm8.961-3.977c-.278-.083-.64-.111-1.029-.111-2.116 0-3.951 1.28-3.951 3.894 0 2.753 1.585 3.95 3.673 3.95.473 0 .918-.056 1.307-.167v-7.566zm19.39 3.754c0 4.368-2.81 7.262-6.845 7.262-4.732 0-6.846-3.561-6.846-7.15 0-3.95 2.615-7.205 6.93-7.205 4.451.002 6.762 3.367 6.762 7.093zm-6.929-3.865c-1.64 0-2.865 1.418-2.865 3.922 0 2.42 1.14 3.977 3.032 3.977 1.615 0 2.839-1.363 2.839-3.922 0-2.197-.919-3.977-3.006-3.977zM52.914 2c.223 0 .278.056.278.25l.028 5.703c.695-.223 1.502-.306 2.338-.306 4.09 0 6.678 2.892 6.678 6.62 0 5.172-4.118 7.731-8.376 7.731-1.447 0-2.95-.166-4.342-.64a.268.268 0 01-.194-.25V2.223c0-.166.083-.222.222-.222h3.368zm5.37 12.628c0-2.531-1.474-3.727-3.45-3.727-.863 0-1.252.139-1.614.25v7.538c.334.055.669.083 1.03.083 2.087 0 4.035-1.28 4.035-4.144zm9.034 1.224c.14 1.585 1.28 2.892 3.978 2.892a9.04 9.04 0 003.424-.64c.111-.055.194-.027.194.112v2.643c0 .222-.055.278-.194.36-1.114.502-2.338.78-4.286.78-5.204 0-7.04-3.588-7.04-7.01 0-3.866 2.338-7.344 6.707-7.344 4.229 0 5.899 3.228 5.899 6.01 0 .834-.056 1.557-.139 1.835-.028.139-.083.194-.223.223-.39.084-1.447.14-2.866.14h-5.454zm3.617-2.725c.89 0 1.308-.03 1.391-.057.028-.028.028-.139.028-.167 0-.695-.555-2.226-2.393-2.226-1.753 0-2.477 1.309-2.644 2.448l3.618.002z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AdobeText';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,24 @@
|
||||
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;
|
||||
@@ -0,0 +1,9 @@
|
||||
export const TITLE = 'Adobe';
|
||||
export const COMBINE_TEXT_MULTIPLE = 0.6;
|
||||
export const COMBINE_SPACE_MULTIPLE = 0.3;
|
||||
export const COLOR_PRIMARY = '#EB1000';
|
||||
|
||||
// Avatar constants
|
||||
export const AVATAR_BACKGROUND = COLOR_PRIMARY;
|
||||
export const AVATAR_COLOR = '#fff';
|
||||
export const AVATAR_ICON_MULTIPLE = 0.6;
|
||||
@@ -0,0 +1,22 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
|
||||
|
||||
import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
|
||||
import Mono from './Mono';
|
||||
|
||||
export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
|
||||
|
||||
const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
|
||||
return (
|
||||
<RNIconAvatar
|
||||
Icon={Mono}
|
||||
aria-label={TITLE}
|
||||
background={background || AVATAR_BACKGROUND}
|
||||
color={AVATAR_COLOR}
|
||||
iconMultiple={AVATAR_ICON_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
export default Avatar;
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,25 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconCombine, type RNIconCombineProps } from '@/features';
|
||||
|
||||
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
|
||||
import Avatar from './Avatar';
|
||||
import Text from './Text';
|
||||
|
||||
export type CombineProps = Omit<RNIconCombineProps, 'Icon' | 'Text'>;
|
||||
|
||||
const Combine = memo<CombineProps>(({ iconProps, ...rest }) => {
|
||||
return (
|
||||
<RNIconCombine
|
||||
Icon={Avatar}
|
||||
Text={Text as any}
|
||||
aria-label={TITLE}
|
||||
iconProps={{ shape: 'square', ...iconProps }}
|
||||
spaceMultiple={COMBINE_SPACE_MULTIPLE}
|
||||
textMultiple={COMBINE_TEXT_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
export default Combine;
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,27 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 135 24"
|
||||
width={size * 5.63} // 保持宽高比
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M11.96 15.469H6.414L5.26 19.015c-.048.144-.144.192-.288.192H2.186c-.168 0-.216-.072-.168-.24L6.822 5.14c.095-.24.192-.528.216-1.439 0-.12.072-.167.168-.167h3.819c.12 0 .167.024.191.12l5.476 15.338c.05.144.025.216-.143.216h-3.123c-.12 0-.192-.048-.264-.144l-1.2-3.595-.001.001zm-4.682-2.972h3.77c-.456-1.582-1.416-4.483-1.896-6.208h-.025c-.384 1.63-1.225 4.266-1.85 6.208zm15.81 6.949c-3.554 0-6.268-1.99-6.268-6.063 0-3.451 2.57-6.303 6.965-6.303.192 0 .409 0 .768.024V2.383c0-.12.072-.168.168-.168h3.05c.097 0 .12.048.12.144v14.163c0 .577.048 1.294.097 1.75 0 .144-.024.192-.144.24a12.15 12.15 0 01-4.756.935v-.001zm1.465-2.971v-6.52c-.24-.07-.552-.095-.888-.095-1.826 0-3.41 1.103-3.41 3.355 0 2.372 1.368 3.403 3.17 3.403.408 0 .793-.048 1.128-.143zM35.452 7.08c3.842 0 5.836 2.9 5.836 6.11 0 3.764-2.426 6.257-5.908 6.257-4.084 0-5.909-3.068-5.909-6.16 0-3.403 2.258-6.208 5.982-6.208l-.001.001zm-.144 2.78c-1.417 0-2.473 1.222-2.473 3.38 0 2.084.983 3.426 2.617 3.426 1.393 0 2.45-1.174 2.45-3.379 0-1.893-.793-3.427-2.594-3.427zm7.727-7.645h2.907c.191 0 .24.048.24.216l.023 4.914c.6-.193 1.297-.265 2.018-.265 3.53 0 5.764 2.492 5.764 5.704 0 4.457-3.554 6.662-7.23 6.662-1.248 0-2.546-.144-3.746-.551a.23.23 0 01-.168-.216V2.407c0-.144.072-.192.192-.192zm7.541 10.88c0-2.18-1.272-3.21-2.977-3.21-.746 0-1.081.119-1.394.214v6.495c.289.048.578.072.89.072 1.8 0 3.481-1.102 3.481-3.57zM63.08 14.15h-4.707c.12 1.366 1.104 2.492 3.433 2.492a7.814 7.814 0 002.955-.551c.096-.048.168-.024.168.095v2.278c0 .191-.048.24-.168.311-.961.432-2.018.67-3.7.67-4.49 0-6.075-3.09-6.075-6.038 0-3.331 2.017-6.328 5.788-6.328 3.65 0 5.092 2.781 5.092 5.177 0 .72-.048 1.343-.12 1.582-.024.12-.072.168-.193.193-.336.071-1.249.12-2.473.12zm-4.707-2.348h3.121c.769 0 1.13-.025 1.201-.049.024-.024.024-.12.024-.143 0-.6-.48-1.918-2.066-1.918-1.512 0-2.137 1.127-2.281 2.109zm17.467 1.342v5.87c0 .145-.072.193-.193.193H72.67c-.12 0-.168-.072-.168-.192V3.7c0-.12.048-.167.192-.167h9.51c.145 0 .193.048.217.191l.263 2.589c.024.143-.047.192-.191.192H75.84v3.642h5.98c.144 0 .216.048.216.193v2.611c0 .145-.072.193-.192.193H75.84zm8.016 5.847V7.511c0-.144.072-.191.217-.191h2.953c.144 0 .193.023.193.19v11.481c0 .168-.049.216-.217.216h-2.906c-.143 0-.24-.048-.24-.216zM85.562 6.05c-1.13 0-1.874-.768-1.874-1.87 0-1.103.793-1.87 1.898-1.87 1.153 0 1.849.791 1.849 1.87 0 1.126-.768 1.87-1.873 1.87zm3.84 1.27h2.617c.145 0 .217.047.29.19.14.435.22.887.239 1.344.793-.935 2.137-1.774 3.819-1.774.169 0 .216.048.216.192v2.924c0 .144-.047.168-.24.168-1.73-.048-3.098.454-3.626 1.054v7.597c0 .168-.072.192-.217.192h-2.906c-.168 0-.24-.048-.24-.216v-8.245c0-1.054-.025-2.42-.12-3.283 0-.12.047-.143.168-.143zm15.756 6.83h-4.708c.12 1.366 1.105 2.492 3.434 2.492a7.818 7.818 0 002.955-.551c.096-.048.168-.024.168.095v2.278c0 .191-.048.24-.168.311-.96.432-2.018.67-3.699.67-4.49 0-6.076-3.09-6.076-6.038 0-3.331 2.017-6.328 5.787-6.328 3.651 0 5.093 2.781 5.093 5.177 0 .72-.048 1.343-.12 1.582-.024.12-.072.168-.193.193-.335.071-1.248.12-2.473.12zm-4.708-2.348h3.123c.768 0 1.128-.025 1.2-.049.024-.024.024-.12.024-.143 0-.6-.48-1.918-2.065-1.918-1.514 0-2.138 1.127-2.282 2.109zm9.523-1.703h-1.442c-.096-.023-.144-.071-.144-.215V7.463c0-.12.048-.143.144-.143h1.442v-.384c0-1.127.167-1.99.504-2.707.624-1.343 1.777-2.229 3.747-2.229.48 0 .936.047 1.224.142.144.073.168.12.168.265v2.372c0 .095-.048.168-.192.144-.216-.072-.504-.072-.696-.072-.889 0-1.417.479-1.417 1.822v.647h2.042c.167 0 .191.047.191.167v2.397c0 .144-.048.192-.191.215h-2.042v8.892c0 .144-.024.216-.24.216h-2.883c-.168 0-.215-.048-.215-.216v-8.893.001zm6.453 6.04V2.429c0-.142.072-.214.24-.214h2.882c.144 0 .216.072.216.216v13.42c0 .671.216.91.792.91.193 0 .24 0 .433-.022.096 0 .12.023.12.143v2.085c0 .168-.024.216-.144.287-.312.12-.744.193-1.514.193-1.705 0-3.025-.648-3.025-3.308zm4.928-8.82h3.218c.12 0 .192.024.24.168 1.37 4.075 2.113 6.591 2.426 7.813.792-2.516 1.537-4.817 2.45-7.813.047-.12.144-.167.264-.167h2.882c.168 0 .193.071.144.215-1.705 5.344-4.371 11.984-6.172 16.057-.048.12-.096.168-.313.192l-3.026.216c-.167 0-.217-.072-.144-.216.72-1.414 1.44-3.02 2.21-4.817.048-.144.072-.216.024-.383-.673-1.654-2.955-7.31-4.371-11.073-.048-.12.024-.191.168-.191z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AdobeFireflyText';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,24 @@
|
||||
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;
|
||||
@@ -0,0 +1,9 @@
|
||||
export const TITLE = 'AdobeFirefly';
|
||||
export const COMBINE_TEXT_MULTIPLE = 0.75;
|
||||
export const COMBINE_SPACE_MULTIPLE = 0.3;
|
||||
export const COLOR_PRIMARY = '#EB1000';
|
||||
|
||||
// Avatar constants
|
||||
export const AVATAR_BACKGROUND = COLOR_PRIMARY;
|
||||
export const AVATAR_COLOR = '#fff';
|
||||
export const AVATAR_ICON_MULTIPLE = 0.6;
|
||||
@@ -0,0 +1,22 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
|
||||
|
||||
import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
|
||||
import Mono from './Mono';
|
||||
|
||||
export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
|
||||
|
||||
const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
|
||||
return (
|
||||
<RNIconAvatar
|
||||
Icon={Mono}
|
||||
aria-label={TITLE}
|
||||
background={background || AVATAR_BACKGROUND}
|
||||
color={AVATAR_COLOR}
|
||||
iconMultiple={AVATAR_ICON_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
export default Avatar;
|
||||
@@ -0,0 +1,24 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconCombine, type RNIconCombineProps } from '@/features';
|
||||
|
||||
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
|
||||
import Mono from './Mono';
|
||||
import Text from './Text';
|
||||
|
||||
export type CombineProps = Omit<RNIconCombineProps, 'Icon' | 'Text'>;
|
||||
|
||||
const Combine = memo<CombineProps>(({ ...rest }) => {
|
||||
return (
|
||||
<RNIconCombine
|
||||
Icon={Mono}
|
||||
Text={Text as any}
|
||||
aria-label={TITLE}
|
||||
spaceMultiple={COMBINE_SPACE_MULTIPLE}
|
||||
textMultiple={COMBINE_TEXT_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
export default Combine;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 24 24"
|
||||
width={size}
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
clipRule="evenodd"
|
||||
d="M7.675.281A.609.609 0 018.32.014l10.047 2.222 2.511.555.628.139.157.034.04.01.01.001a.04.04 0 01.002.001l.06.016a.609.609 0 01.408.688l-3.63 19.82a.609.609 0 01-.989.358L1.718 10.605a.609.609 0 01-.123-.794l6.08-9.53zM3.34 10.374l13.118 10.971-5.76-13.394-7.358 2.423zm8.519-2.805l5.874 13.659L20.77 4.635l-8.912 2.934zM3.539 9.026l6.675-2.197-2.123-4.937L3.54 9.026zm7.836-2.58l8.195-2.698-1.466-.324-8.872-1.962 2.143 4.984z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AguiMono';
|
||||
|
||||
export default Icon;
|
||||
File diff suppressed because one or more lines are too long
@@ -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;
|
||||
@@ -0,0 +1,9 @@
|
||||
export const TITLE = 'AG-UI';
|
||||
export const COMBINE_TEXT_MULTIPLE = 0.7;
|
||||
export const COMBINE_SPACE_MULTIPLE = 0.3;
|
||||
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;
|
||||
@@ -0,0 +1,23 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
|
||||
|
||||
import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
|
||||
import Mono from './Mono';
|
||||
|
||||
export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
|
||||
|
||||
const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
|
||||
return (
|
||||
<RNIconAvatar
|
||||
Icon={Mono}
|
||||
aria-label={TITLE}
|
||||
background={background || AVATAR_BACKGROUND}
|
||||
color={AVATAR_COLOR}
|
||||
iconMultiple={AVATAR_ICON_MULTIPLE}
|
||||
iconStyle={{ marginLeft: -rest.size * 0.05 }}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
export default Avatar;
|
||||
@@ -0,0 +1 @@
|
||||
export { default } from './Text';
|
||||
@@ -0,0 +1,31 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 103 24"
|
||||
width={size * 4.29} // 保持宽高比
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M15.064 21.643l-.74-2.335H7.487l-.741 2.335H2L8.862 2.414h4.09l6.944 19.23h-4.832zM10.92 7.908L8.56 15.819h4.666l-2.305-7.911zm9.504-5.494h4.501v19.23h-4.501V2.413zm5.714 15.3a8.84 8.84 0 011.057-2.691 7.78 7.78 0 011.606-1.868 16.915 16.915 0 012.045-1.456c.567-.33 1.093-.646 1.578-.948.447-.275.874-.582 1.276-.92.348-.289.64-.638.865-1.03.214-.391.323-.832.315-1.278 0-.769-.21-1.323-.63-1.662-.447-.347-1-.526-1.565-.508A2.475 2.475 0 0030.943 6c-.467.43-.7 1.15-.7 2.156h-4.42a6.493 6.493 0 01.454-2.445c.294-.74.749-1.406 1.33-1.95a6.26 6.26 0 012.142-1.291A8.363 8.363 0 0132.657 2a9.048 9.048 0 012.512.344c.76.21 1.472.565 2.1 1.044a4.972 4.972 0 011.44 1.813c.374.823.557 1.72.536 2.623a4.64 4.64 0 01-.522 2.198 7.454 7.454 0 01-1.276 1.758c-.497.508-1.044.963-1.633 1.36-.586.394-1.117.728-1.592 1.003-.66.44-1.204.82-1.633 1.14a7.753 7.753 0 00-1.03.892 2.403 2.403 0 00-.535.852 3.128 3.128 0 00-.15 1.017h8.234v3.598h-13.34c-.023-1.32.102-2.637.371-3.928zM39.958 5.792c.769.016 1.538-.053 2.292-.206a3.307 3.307 0 001.386-.618 2.14 2.14 0 00.686-1.044c.137-.491.202-1 .192-1.51h3.926v19.23h-4.528V8.923h-3.954V5.792z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M53.534 2.414h4.199v19.23h-4.2V2.413zm19.704 5.978v13.241h-4.2v-1.868a3.434 3.434 0 01-.659.865 4.24 4.24 0 01-.946.686c-.371.198-.762.354-1.167.466-.41.118-.835.178-1.262.179a6.33 6.33 0 01-2.622-.536 6.207 6.207 0 01-2.044-1.456 6.455 6.455 0 01-1.318-2.197 8.402 8.402 0 010-5.522 6.455 6.455 0 011.318-2.198 6.207 6.207 0 012.044-1.455 6.329 6.329 0 012.622-.535c.427.001.852.061 1.263.179.406.113.798.274 1.166.48.347.194.666.434.947.715.257.252.48.539.659.851V8.392h4.199zm-7.356 10c.445.006.886-.088 1.29-.275a3.147 3.147 0 001.634-1.8c.156-.417.235-.859.233-1.304a3.546 3.546 0 00-.879-2.363 3.056 3.056 0 00-.989-.742 3.168 3.168 0 00-2.58 0 3.06 3.06 0 00-.989.742 3.549 3.549 0 00-.878 2.363c-.002.445.077.888.233 1.305a3.153 3.153 0 001.634 1.8c.404.187.845.28 1.29.273zm12.459 3.251h-4.2V2.414h4.2v7.883a4.218 4.218 0 011.619-1.566c.37-.202.76-.364 1.166-.48.415-.12.845-.18 1.276-.179a6.33 6.33 0 012.622.536c.773.34 1.47.836 2.044 1.456a6.47 6.47 0 011.318 2.197 8.413 8.413 0 010 5.522 6.47 6.47 0 01-1.318 2.198 6.203 6.203 0 01-2.044 1.456 6.33 6.33 0 01-2.622.535 4.577 4.577 0 01-1.276-.178 6.213 6.213 0 01-1.166-.466 4.12 4.12 0 01-.96-.687 3.435 3.435 0 01-.66-.865v1.867zm3.184-3.241c.436.004.868-.09 1.263-.275a3.148 3.148 0 001.634-1.8c.156-.416.235-.859.232-1.304a3.547 3.547 0 00-.878-2.363 3.056 3.056 0 00-.99-.741 2.901 2.901 0 00-1.261-.276 3.012 3.012 0 00-2.305 1.016 3.546 3.546 0 00-.879 2.362 3.66 3.66 0 00.233 1.305c.145.395.364.759.645 1.072a3.1 3.1 0 002.306 1.004zm15.219-4.56a20.56 20.56 0 011.646.535c.479.175.932.415 1.345.714.38.28.695.642.92 1.058.244.494.362 1.042.343 1.593a3.937 3.937 0 01-.467 1.992 3.71 3.71 0 01-1.29 1.319c-.587.353-1.234.6-1.907.727-.765.15-1.542.224-2.32.22-1.885 0-3.372-.412-4.46-1.236-1.09-.824-1.413-2.006-1.413-3.544h3.897c0 .696.197 1.195.59 1.497a2.43 2.43 0 001.524.453c.434.019.866-.08 1.248-.288a1.018 1.018 0 00.48-.948.898.898 0 00-.205-.618 1.982 1.982 0 00-.632-.44 7.884 7.884 0 00-1.097-.412c-.45-.137-.985-.306-1.606-.508a21.019 21.019 0 01-1.565-.535 5.688 5.688 0 01-1.304-.7 2.978 2.978 0 01-.891-1.045 3.427 3.427 0 01-.33-1.593c0-1.374.526-2.39 1.578-3.05 1.053-.659 2.475-.989 4.268-.99a8.335 8.335 0 012.512.344c.652.192 1.26.514 1.784.948.457.39.818.878 1.057 1.429.238.555.36 1.153.357 1.758h-4.145a1.798 1.798 0 00-.425-1.278 1.71 1.71 0 00-1.304-.453 2.04 2.04 0 00-1.098.289.972.972 0 00-.467.892.828.828 0 00.22.591c.185.182.405.327.645.426.344.15.697.279 1.057.384.42.13.905.285 1.455.468z"
|
||||
fill="#E91E63"
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'Ai21BrandColor';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,24 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconCombine, type RNIconCombineProps } from '@/features';
|
||||
|
||||
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
|
||||
import Brand from './Brand';
|
||||
import BrandColor from './BrandColor';
|
||||
|
||||
export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
|
||||
type: 'mono' | 'color';
|
||||
}
|
||||
const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
|
||||
return (
|
||||
<RNIconCombine
|
||||
Text={type === 'mono' ? Brand : BrandColor}
|
||||
aria-label={TITLE}
|
||||
spaceMultiple={COMBINE_SPACE_MULTIPLE}
|
||||
textMultiple={COMBINE_TEXT_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
export default Combine;
|
||||
@@ -0,0 +1,27 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 24 24"
|
||||
width={size}
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M6.47 17l-.367-1.189H2.718L2.35 17H0l3.398-9.789h2.026L8.864 17H6.47zm-2.052-6.993l-1.17 4.028H5.56l-1.142-4.028zm4.707-2.796h2.23V17h-2.23V7.211zM11.955 15c.1-.483.277-.946.524-1.37.214-.359.482-.68.795-.951.32-.273.658-.52 1.013-.741.28-.168.54-.33.781-.483.222-.14.433-.296.632-.468.172-.148.317-.325.428-.525.107-.199.16-.423.157-.65 0-.392-.104-.674-.313-.846a1.176 1.176 0 00-.775-.259 1.207 1.207 0 00-.863.329c-.231.219-.347.585-.347 1.098H11.8a3.387 3.387 0 01.224-1.245c.146-.377.371-.716.66-.993.306-.29.667-.514 1.06-.657A4.04 4.04 0 0115.183 7c.42-.002.84.057 1.244.175.376.107.73.287 1.04.531.305.246.55.562.714.923.185.419.275.875.265 1.335.005.39-.084.774-.259 1.12-.167.328-.38.63-.632.894-.246.259-.517.49-.808.693-.29.2-.554.37-.789.51-.326.224-.596.417-.809.58a3.872 3.872 0 00-.51.455 1.229 1.229 0 00-.265.434 1.633 1.633 0 00-.074.517h4.078V17h-6.606a9.24 9.24 0 01.183-2zM18.8 8.93a5.05 5.05 0 001.135-.105c.25-.049.484-.156.686-.314.163-.139.28-.324.34-.532.068-.25.1-.51.095-.77H23V17h-2.243v-6.475H18.8V8.93z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'Ai21Mono';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,31 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 103 24"
|
||||
width={size * 4.29} // 保持宽高比
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M15.064 21.643l-.74-2.335H7.487l-.741 2.335H2L8.862 2.414h4.09l6.944 19.23h-4.832zM10.92 7.908L8.56 15.819h4.666l-2.305-7.911zm9.504-5.494h4.501v19.23h-4.501V2.413zm5.714 15.3a8.84 8.84 0 011.057-2.691 7.78 7.78 0 011.606-1.868 16.915 16.915 0 012.045-1.456c.567-.33 1.093-.646 1.578-.948.447-.275.874-.582 1.276-.92.348-.289.64-.638.865-1.03.214-.391.323-.832.315-1.278 0-.769-.21-1.323-.63-1.662-.447-.347-1-.526-1.565-.508A2.475 2.475 0 0030.943 6c-.467.43-.7 1.15-.7 2.156h-4.42a6.493 6.493 0 01.454-2.445c.294-.74.749-1.406 1.33-1.95a6.26 6.26 0 012.142-1.291A8.363 8.363 0 0132.657 2a9.048 9.048 0 012.512.344c.76.21 1.472.565 2.1 1.044a4.972 4.972 0 011.44 1.813c.374.823.557 1.72.536 2.623a4.64 4.64 0 01-.522 2.198 7.454 7.454 0 01-1.276 1.758c-.497.508-1.044.963-1.633 1.36-.586.394-1.117.728-1.592 1.003-.66.44-1.204.82-1.633 1.14a7.753 7.753 0 00-1.03.892 2.403 2.403 0 00-.535.852 3.128 3.128 0 00-.15 1.017h8.234v3.598h-13.34c-.023-1.32.102-2.637.371-3.928zM39.958 5.792c.769.016 1.538-.053 2.292-.206a3.307 3.307 0 001.386-.618 2.14 2.14 0 00.686-1.044c.137-.491.202-1 .192-1.51h3.926v19.23h-4.528V8.923h-3.954V5.792z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M53.534 2.414h4.199v19.23h-4.2V2.413zm19.704 5.978v13.241h-4.2v-1.868a3.434 3.434 0 01-.659.865 4.24 4.24 0 01-.946.686c-.371.198-.762.354-1.167.466-.41.118-.835.178-1.262.179a6.33 6.33 0 01-2.622-.536 6.207 6.207 0 01-2.044-1.456 6.455 6.455 0 01-1.318-2.197 8.402 8.402 0 010-5.522 6.455 6.455 0 011.318-2.198 6.207 6.207 0 012.044-1.455 6.329 6.329 0 012.622-.535c.427.001.852.061 1.263.179.406.113.798.274 1.166.48.347.194.666.434.947.715.257.252.48.539.659.851V8.392h4.199zm-7.356 10c.445.006.886-.088 1.29-.275a3.147 3.147 0 001.634-1.8c.156-.417.235-.859.233-1.304a3.546 3.546 0 00-.879-2.363 3.056 3.056 0 00-.989-.742 3.168 3.168 0 00-2.58 0 3.06 3.06 0 00-.989.742 3.549 3.549 0 00-.878 2.363c-.002.445.077.888.233 1.305a3.153 3.153 0 001.634 1.8c.404.187.845.28 1.29.273zm12.459 3.251h-4.2V2.414h4.2v7.883a4.218 4.218 0 011.619-1.566c.37-.202.76-.364 1.166-.48.415-.12.845-.18 1.276-.179a6.33 6.33 0 012.622.536c.773.34 1.47.836 2.044 1.456a6.47 6.47 0 011.318 2.197 8.413 8.413 0 010 5.522 6.47 6.47 0 01-1.318 2.198 6.203 6.203 0 01-2.044 1.456 6.33 6.33 0 01-2.622.535 4.577 4.577 0 01-1.276-.178 6.213 6.213 0 01-1.166-.466 4.12 4.12 0 01-.96-.687 3.435 3.435 0 01-.66-.865v1.867zm3.184-3.241c.436.004.868-.09 1.263-.275a3.148 3.148 0 001.634-1.8c.156-.416.235-.859.232-1.304a3.547 3.547 0 00-.878-2.363 3.056 3.056 0 00-.99-.741 2.901 2.901 0 00-1.261-.276 3.012 3.012 0 00-2.305 1.016 3.546 3.546 0 00-.879 2.362 3.66 3.66 0 00.233 1.305c.145.395.364.759.645 1.072a3.1 3.1 0 002.306 1.004zm15.219-4.56a20.56 20.56 0 011.646.535c.479.175.932.415 1.345.714.38.28.695.642.92 1.058.244.494.362 1.042.343 1.593a3.937 3.937 0 01-.467 1.992 3.71 3.71 0 01-1.29 1.319c-.587.353-1.234.6-1.907.727-.765.15-1.542.224-2.32.22-1.885 0-3.372-.412-4.46-1.236-1.09-.824-1.413-2.006-1.413-3.544h3.897c0 .696.197 1.195.59 1.497a2.43 2.43 0 001.524.453c.434.019.866-.08 1.248-.288a1.018 1.018 0 00.48-.948.898.898 0 00-.205-.618 1.982 1.982 0 00-.632-.44 7.884 7.884 0 00-1.097-.412c-.45-.137-.985-.306-1.606-.508a21.019 21.019 0 01-1.565-.535 5.688 5.688 0 01-1.304-.7 2.978 2.978 0 01-.891-1.045 3.427 3.427 0 01-.33-1.593c0-1.374.526-2.39 1.578-3.05 1.053-.659 2.475-.989 4.268-.99a8.335 8.335 0 012.512.344c.652.192 1.26.514 1.784.948.457.39.818.878 1.057 1.429.238.555.36 1.153.357 1.758h-4.145a1.798 1.798 0 00-.425-1.278 1.71 1.71 0 00-1.304-.453 2.04 2.04 0 00-1.098.289.972.972 0 00-.467.892.828.828 0 00.22.591c.185.182.405.327.645.426.344.15.697.279 1.057.384.42.13.905.285 1.455.468z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'Ai21Text';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,30 @@
|
||||
import Avatar from './components/Avatar';
|
||||
import Brand from './components/Brand';
|
||||
import BrandColor from './components/BrandColor';
|
||||
import Combine from './components/Combine';
|
||||
import Mono from './components/Mono';
|
||||
import Text from './components/Text';
|
||||
import { COLOR_GRADIENT, COLOR_PRIMARY, TITLE } from './style';
|
||||
|
||||
export type CompoundedIcon = typeof Mono & {
|
||||
Avatar: typeof Avatar;
|
||||
Brand: typeof Brand;
|
||||
BrandColor: typeof BrandColor;
|
||||
|
||||
Combine: typeof Combine;
|
||||
Text: typeof Text;
|
||||
colorGradient: string;
|
||||
colorPrimary: string;
|
||||
title: string;
|
||||
};
|
||||
|
||||
const Icons = Mono as CompoundedIcon;
|
||||
Icons.Text = Text;
|
||||
Icons.Brand = Brand;
|
||||
Icons.BrandColor = BrandColor;
|
||||
Icons.Combine = Combine;
|
||||
Icons.Avatar = Avatar;
|
||||
Icons.colorPrimary = COLOR_PRIMARY;
|
||||
Icons.colorGradient = COLOR_GRADIENT;
|
||||
Icons.title = TITLE;
|
||||
export default Icons;
|
||||
@@ -0,0 +1,10 @@
|
||||
export const TITLE = 'AI21';
|
||||
export const COMBINE_TEXT_MULTIPLE = 0.75;
|
||||
export const COMBINE_SPACE_MULTIPLE = 0.2;
|
||||
export const COLOR_PRIMARY = '#E91E63';
|
||||
export const COLOR_GRADIENT = 'linear-gradient(-45deg, #F68CB2, #E91E63)';
|
||||
|
||||
// Avatar constants
|
||||
export const AVATAR_BACKGROUND = COLOR_PRIMARY;
|
||||
export const AVATAR_COLOR = '#fff';
|
||||
export const AVATAR_ICON_MULTIPLE = 0.7;
|
||||
@@ -0,0 +1,21 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
|
||||
|
||||
import { AVATAR_BACKGROUND, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
|
||||
import Inner from './Inner';
|
||||
|
||||
export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
|
||||
|
||||
const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
|
||||
return (
|
||||
<RNIconAvatar
|
||||
Icon={Inner}
|
||||
aria-label={TITLE}
|
||||
background={background || AVATAR_BACKGROUND}
|
||||
iconMultiple={AVATAR_ICON_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
export default Avatar;
|
||||
@@ -0,0 +1,27 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
|
||||
return (
|
||||
<Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
|
||||
<Path
|
||||
d="M13.086 23.25c5.614 0 10.164-4.559 10.164-10.182 0-5.624-4.55-10.182-10.164-10.182-5.613 0-10.163 4.558-10.163 10.182 0 5.623 4.55 10.182 10.163 10.182z"
|
||||
fill="#3F3FAA"
|
||||
/>
|
||||
<Path
|
||||
d="M10.914 21.114c5.613 0 10.163-4.559 10.163-10.182S16.527.75 10.914.75C5.3.75.75 5.309.75 10.932S5.3 21.114 10.914 21.114z"
|
||||
fill="#8E47FF"
|
||||
/>
|
||||
<Path
|
||||
d="M10.755 17.708c-.722 0-1.416-.24-1.995-.69a3.25 3.25 0 01-1.23-2.177 3.248 3.248 0 01-.006-.782c-.201.04-.407.056-.618.056a3.265 3.265 0 01-3.261-3.262A3.27 3.27 0 017.65 7.67a3.27 3.27 0 013.241-3.638 3.266 3.266 0 013.242 3.577 3.269 3.269 0 012.694 5.693 3.227 3.227 0 01-2.365.782 3.26 3.26 0 01-.466-.066c0 .008.005.014.005.02a3.254 3.254 0 01-.664 2.41 3.235 3.235 0 01-2.583 1.259zm-1.808-4.313c-.228.397-.32.847-.263 1.304a2.092 2.092 0 002.335 1.826 2.086 2.086 0 001.398-.791 2.08 2.08 0 00.425-1.548 2.091 2.091 0 00-.405-1.004 3.253 3.253 0 01-.39-.462.58.58 0 11.947-.675c.044.062.088.117.137.173a.61.61 0 01.111.101l.056.071a2.096 2.096 0 003.49-1.405 2.096 2.096 0 00-1.93-2.248 2.076 2.076 0 00-1.251.304.579.579 0 01-.648.061.59.59 0 01-.233-.796A2.102 2.102 0 0010.888 5.2 2.1 2.1 0 009.14 8.457l.03.056c.61.594.993 1.42.993 2.339A3.273 3.273 0 018.947 13.4v-.005zM6.901 8.752a2.098 2.098 0 00-2.092 2.1c0 1.16.936 2.101 2.092 2.101a2.1 2.1 0 000-4.201z"
|
||||
fill="#fff"
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'Ai302Color';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconCombine, type RNIconCombineProps } from '@/features';
|
||||
|
||||
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
|
||||
import Color from './Color';
|
||||
import Mono from './Mono';
|
||||
import Text from './Text';
|
||||
|
||||
export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
|
||||
type?: 'color' | 'mono';
|
||||
}
|
||||
const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
|
||||
const Icon = type === 'color' ? Color : Mono;
|
||||
|
||||
return (
|
||||
<RNIconCombine
|
||||
Icon={Icon}
|
||||
Text={Text}
|
||||
aria-label={TITLE}
|
||||
spaceMultiple={COMBINE_SPACE_MULTIPLE}
|
||||
textMultiple={COMBINE_TEXT_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
export default Combine;
|
||||
@@ -0,0 +1,27 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 24 24"
|
||||
width={size}
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M11.88 21.5a4.49 4.49 0 01-2.772-.959 4.516 4.516 0 01-1.71-3.024 4.513 4.513 0 01-.007-1.086 4.46 4.46 0 01-.859.078A4.537 4.537 0 012 11.975c0-2.5 2.036-4.54 4.532-4.54.356 0 .7.041 1.034.12A4.543 4.543 0 0112.07 2.5c2.497 0 4.525 2.04 4.525 4.54 0 .145-.005.286-.02.43a4.596 4.596 0 011.125-.056 4.542 4.542 0 014.18 4.864 4.507 4.507 0 01-1.562 3.103 4.484 4.484 0 01-3.287 1.085 4.54 4.54 0 01-.647-.091c0 .01.007.019.007.028a4.522 4.522 0 01-.922 3.349 4.496 4.496 0 01-3.019 1.713 4.53 4.53 0 01-.57.035zm-2.512-5.993a2.893 2.893 0 00-.366 1.812 2.906 2.906 0 003.244 2.538 2.899 2.899 0 001.943-1.1 2.89 2.89 0 00.59-2.15 2.905 2.905 0 00-.562-1.396 4.516 4.516 0 01-.542-.641.807.807 0 01.19-1.128.805.805 0 011.126.19c.061.085.122.163.19.24a.846.846 0 01.155.14c.028.034.05.067.077.1.474.429 1.08.692 1.731.74 1.605.12 3-1.09 3.118-2.693a2.913 2.913 0 00-2.681-3.124 2.884 2.884 0 00-1.739.423.804.804 0 01-.9.085.82.82 0 01-.324-1.107c.234-.425.359-.905.359-1.396a2.92 2.92 0 00-2.914-2.918A2.919 2.919 0 009.15 7.04c0 .576.168 1.13.485 1.608.016.024.03.053.043.077a4.52 4.52 0 011.379 3.25c0 1.426-.66 2.707-1.689 3.54v-.008zm-2.843-6.45a2.914 2.914 0 00-2.906 2.918c0 1.61 1.3 2.92 2.906 2.92a2.92 2.92 0 000-5.838z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'Ai302Inner';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,41 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 24 24"
|
||||
width={size}
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M19.04 4.818a10.171 10.171 0 014.21 8.25c0 5.623-4.55 10.182-10.163 10.182a10.142 10.142 0 01-8.129-4.07 10.102 10.102 0 005.956 1.934c5.613 0 10.163-4.56 10.163-10.182 0-2.295-.759-4.411-2.037-6.114z"
|
||||
fill={color}
|
||||
fillOpacity=".5"
|
||||
/>
|
||||
<Path
|
||||
d="M10.887 5.2c1.156 0 2.097.944 2.097 2.1 0 .354-.09.7-.258 1.006a.591.591 0 00.233.797c.215.117.47.084.647-.062.375-.232.811-.338 1.251-.305a2.098 2.098 0 011.931 2.248 2.097 2.097 0 01-2.244 1.939 2.082 2.082 0 01-1.246-.533c-.019-.024-.036-.047-.056-.07a.617.617 0 00-.111-.102 2.113 2.113 0 01-.137-.173.58.58 0 10-.947.675c.118.167.247.323.39.462.22.291.36.637.405 1.005a2.08 2.08 0 01-.425 1.546 2.088 2.088 0 01-1.398.792 2.094 2.094 0 01-2.335-1.827 2.083 2.083 0 01.263-1.304v.005a3.273 3.273 0 001.216-2.546c0-.92-.383-1.745-.993-2.34l-.03-.055A2.101 2.101 0 0110.887 5.2z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M6.901 8.752a2.1 2.1 0 010 4.201 2.097 2.097 0 01-2.091-2.1c0-1.159.937-2.101 2.091-2.101z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
clipRule="evenodd"
|
||||
d="M10.914.75c5.613 0 10.163 4.559 10.163 10.182s-4.55 10.182-10.163 10.182S.75 16.555.75 10.932C.75 5.308 5.301.75 10.914.75zm-.021 3.283A3.27 3.27 0 007.65 7.671a3.27 3.27 0 00-4.006 3.182c0 1.8 1.464 3.262 3.262 3.262.211 0 .417-.016.618-.055-.03.258-.028.516.005.78a3.25 3.25 0 001.23 2.178 3.234 3.234 0 002.407.665 3.236 3.236 0 002.173-1.234c.535-.689.77-1.545.663-2.41 0-.006-.005-.013-.005-.02.151.033.309.055.466.066a3.228 3.228 0 002.365-.781 3.27 3.27 0 00-1.884-5.734 3.31 3.31 0 00-.81.04 3.266 3.266 0 00-3.241-3.577z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'Ai302Mono';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 80 24"
|
||||
width={size * 3.33} // 保持宽高比
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
clipRule="evenodd"
|
||||
d="M2 18.092c0-.626.54-1.082 1.271-1.082.54 0 .955.285 1.272.826.666 1.167 1.78 1.937 3.654 1.937 2.352 0 3.718-1.423 3.718-3.446 0-2.137-1.557-3.56-3.973-3.56h-.221c-.826 0-1.303-.455-1.303-1.11 0-.654.477-1.11 1.303-1.11h.19c2.098 0 3.592-1.224 3.592-3.247 0-1.852-1.302-3.076-3.463-3.076-1.781 0-2.767.797-3.307 1.852-.286.541-.7.826-1.24.826-.731 0-1.24-.427-1.24-1.053 0-.171.064-.427.126-.598.666-1.738 2.606-3.247 5.754-3.247 3.782 0 6.103 2.165 6.103 5.185 0 2.051-1.27 3.446-2.67 4.214v.057c1.4.512 3.082 2.222 3.082 4.843 0 3.361-2.67 5.697-6.451 5.697-3.307 0-5.276-1.48-6.102-3.36A1.6 1.6 0 012 18.098v-.007zM17.51 11.997c0-4.556.221-5.583.476-6.323C18.846 3.309 20.91 2 23.897 2c2.988 0 5.054 1.31 5.911 3.674.255.74.476 1.767.476 6.323 0 4.556-.221 5.583-.476 6.323-.857 2.364-2.923 3.674-5.91 3.674-2.988 0-5.055-1.31-5.912-3.674-.255-.74-.476-1.767-.476-6.323zm6.39 7.777c1.59 0 2.766-.655 3.273-1.938.221-.598.35-1.423.35-5.84 0-4.415-.127-5.24-.35-5.838-.51-1.281-1.686-1.938-3.274-1.938s-2.766.655-3.273 1.938c-.221.597-.35 1.423-.35 5.839s.126 5.241.35 5.839c.51 1.28 1.685 1.938 3.273 1.938zM33.974 19.031l7.375-8.43c.985-1.14 1.495-2.138 1.495-3.333 0-1.767-1.303-3.048-3.402-3.048-1.907 0-2.957.91-3.433 2.336-.221.626-.7.94-1.24.94-.795 0-1.336-.428-1.336-1.11 0-.114.032-.314.065-.428C34.008 3.964 35.945 2 39.538 2c3.592 0 6.039 2.25 6.039 5.27 0 1.738-.762 3.19-2.13 4.7l-6.612 7.434v.056h7.661c.826 0 1.302.456 1.302 1.11 0 .655-.476 1.11-1.302 1.11H34.483c-.826 0-1.302-.455-1.302-1.053 0-.512.221-.91.795-1.596h-.002zM50.312 18.372c.986 0 1.812.784 1.812 1.721s-.826 1.721-1.812 1.721c-.985 0-1.811-.784-1.811-1.72 0-.938.826-1.722 1.811-1.722zM55.237 20.085l6.645-16.491c.35-.91.89-1.423 1.842-1.423.953 0 1.557.512 1.907 1.423l6.547 16.49c.064.171.126.37.126.57 0 .712-.605 1.167-1.335 1.167-.636 0-1.145-.313-1.367-.91l-1.462-3.732h-8.867L57.81 20.91c-.222.598-.731.91-1.367.91-.73 0-1.335-.454-1.335-1.166 0-.2.064-.399.126-.57h.002zm11.984-5.242l-3.433-8.801h-.095l-3.497 8.801h7.025zM75.33 3.935c0-1.127.571-1.813 1.335-1.813s1.336.686 1.336 1.813V20.01c0 1.127-.572 1.813-1.336 1.813-.764 0-1.335-.686-1.335-1.813V3.935z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'Ai302Text';
|
||||
|
||||
export default Icon;
|
||||
@@ -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;
|
||||
@@ -0,0 +1,9 @@
|
||||
export const TITLE = '302.AI';
|
||||
export const COLOR_PRIMARY = '#8E47FF';
|
||||
export const COMBINE_TEXT_MULTIPLE = 0.8;
|
||||
export const COMBINE_SPACE_MULTIPLE = 0.15;
|
||||
|
||||
// Avatar constants
|
||||
export const AVATAR_BACKGROUND = COLOR_PRIMARY;
|
||||
export const AVATAR_COLOR = '#FFF';
|
||||
export const AVATAR_ICON_MULTIPLE = 0.8;
|
||||
@@ -0,0 +1,22 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
|
||||
|
||||
import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
|
||||
import Mono from './Mono';
|
||||
|
||||
export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
|
||||
|
||||
const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
|
||||
return (
|
||||
<RNIconAvatar
|
||||
Icon={Mono}
|
||||
aria-label={TITLE}
|
||||
background={background || AVATAR_BACKGROUND}
|
||||
color={AVATAR_COLOR}
|
||||
iconMultiple={AVATAR_ICON_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
export default Avatar;
|
||||
@@ -0,0 +1,85 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Defs, LinearGradient, Path, Stop, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
import { useFillIds } from '@/hooks/useFillId';
|
||||
|
||||
import { TITLE } from '../style';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
|
||||
const [a, b, c, d, e] = useFillIds(TITLE, 5);
|
||||
return (
|
||||
<Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
|
||||
<Path
|
||||
clipRule="evenodd"
|
||||
d="M12 0h.018c1.473-.002 2.88.261 4.179.754C20.755 2.456 24 6.85 24 12c0 6.627-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zm8.604 18.967A11.024 11.024 0 0023.07 12c0-1.717-.39-3.344-1.089-4.794a2.59 2.59 0 01-3.214.62 6.278 6.278 0 01-1.333-.992C16.283 5.73 15.109 4.66 13.696 3.9c-3.211-1.729-6.825-1.501-9.695.447A11.033 11.033 0 00.93 12c0 1.663.367 3.241 1.024 4.657.75-.973 2.131-1.346 3.232-.71.667.384 1.257.92 1.837 1.447l.176.16c1.365 1.234 2.794 2.355 4.558 2.965 3.053 1.053 6.356.437 8.847-1.552z"
|
||||
fill={a.fill}
|
||||
fillRule="evenodd"
|
||||
/>
|
||||
<Path
|
||||
d="M5.643 10.312c-.83.11-1.401.766-1.408 1.618a1.715 1.715 0 001.45 1.72c.805.128 1.64-.426 1.87-1.26.046-.167.076-.338.106-.51.025-.14.05-.282.084-.42.318-1.317 1.237-1.95 2.788-1.93 1.086.013 1.318.271 1.68 1.855.017.076.043.151.07.226.26.714.976 1.17 1.67 1.065a1.647 1.647 0 001.38-1.438c.083-.729-.348-1.264-1.122-1.575-.34-.136-.664-.158-.995-.141-.726.037-1.121-.36-1.339-.977a3.359 3.359 0 01-.134-.65c-.014-.093-.027-.186-.043-.278-.156-.887-.835-1.51-1.669-1.532-.791-.02-1.464.551-1.665 1.418l-.06.27-.025.117c-.355 1.636-.974 2.205-2.638 2.422z"
|
||||
fill={b.fill}
|
||||
/>
|
||||
<Path
|
||||
d="M18.059 13.644c.989-.206 1.577-.838 1.592-1.697.015-.83-.624-1.582-1.46-1.724-.77-.13-1.599.383-1.844 1.18-.069.22-.117.448-.165.676-.06.29-.122.58-.225.854-.367.986-1.593 1.546-2.926 1.394-.824-.095-1.106-.446-1.342-1.674-.18-.938-.864-1.535-1.681-1.467-.85.07-1.515.829-1.468 1.673.05.892.678 1.44 1.705 1.489 1.375.064 1.75.396 1.926 1.787.067.531.267.967.685 1.288 1.02.783 2.407.208 2.66-1.108l.022-.114c.152-.796.3-1.577 1.04-2.101.36-.255.761-.326 1.166-.397.105-.019.21-.037.315-.06z"
|
||||
fill={c.fill}
|
||||
/>
|
||||
<Path d="M13.83 7.961a.755.755 0 11-1.51 0 .755.755 0 011.51 0z" fill={d.fill} />
|
||||
<Path d="M10.809 16.678a.755.755 0 100-1.511.755.755 0 000 1.51z" fill={e.fill} />
|
||||
<Defs>
|
||||
<LinearGradient gradientUnits="userSpaceOnUse" id={a.id} x1="12" x2="12" y1="0" y2="24">
|
||||
<Stop stopColor="#12B7FA" />
|
||||
<Stop offset="100%" stopColor="#006ffb" />
|
||||
</LinearGradient>
|
||||
<LinearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id={b.id}
|
||||
x1="11.943"
|
||||
x2="11.943"
|
||||
y1="6.085"
|
||||
y2="17.778"
|
||||
>
|
||||
<Stop stopColor="#006ffb" />
|
||||
<Stop offset="100%" stopColor="#12B7FA" />
|
||||
</LinearGradient>
|
||||
<LinearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id={c.id}
|
||||
x1="11.943"
|
||||
x2="11.943"
|
||||
y1="6.085"
|
||||
y2="17.778"
|
||||
>
|
||||
<Stop stopColor="#006ffb" />
|
||||
<Stop offset="100%" stopColor="#12B7FA" />
|
||||
</LinearGradient>
|
||||
<LinearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id={d.id}
|
||||
x1="11.943"
|
||||
x2="11.943"
|
||||
y1="6.085"
|
||||
y2="17.778"
|
||||
>
|
||||
<Stop stopColor="#006ffb" />
|
||||
<Stop offset="100%" stopColor="#12B7FA" />
|
||||
</LinearGradient>
|
||||
<LinearGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
id={e.id}
|
||||
x1="11.943"
|
||||
x2="11.943"
|
||||
y1="6.085"
|
||||
y2="17.778"
|
||||
>
|
||||
<Stop stopColor="#006ffb" />
|
||||
<Stop offset="100%" stopColor="#12B7FA" />
|
||||
</LinearGradient>
|
||||
</Defs>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'Ai360Color';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconCombine, type RNIconCombineProps } from '@/features';
|
||||
|
||||
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
|
||||
import Color from './Color';
|
||||
import Mono from './Mono';
|
||||
import Text from './Text';
|
||||
|
||||
export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
|
||||
type?: 'color' | 'mono';
|
||||
}
|
||||
const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
|
||||
const Icon = type === 'color' ? Color : Mono;
|
||||
|
||||
return (
|
||||
<RNIconCombine
|
||||
Icon={Icon}
|
||||
Text={Text}
|
||||
aria-label={TITLE}
|
||||
spaceMultiple={COMBINE_SPACE_MULTIPLE}
|
||||
textMultiple={COMBINE_TEXT_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
export default Combine;
|
||||
@@ -0,0 +1,38 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 24 24"
|
||||
width={size}
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
clipRule="evenodd"
|
||||
d="M12 0h.018c1.473-.002 2.88.261 4.179.754C20.755 2.456 24 6.85 24 12c0 6.627-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zm8.604 18.967A11.024 11.024 0 0023.07 12c0-1.717-.39-3.344-1.089-4.794a2.59 2.59 0 01-3.214.62 6.278 6.278 0 01-1.333-.992C16.283 5.73 15.109 4.66 13.696 3.9c-3.211-1.729-6.825-1.501-9.695.447A11.033 11.033 0 00.93 12c0 1.663.367 3.241 1.024 4.657.75-.973 2.131-1.346 3.232-.71.667.384 1.257.92 1.837 1.447l.176.16c1.365 1.234 2.794 2.355 4.558 2.965 3.053 1.053 6.356.437 8.847-1.552z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M5.643 10.312c-.83.11-1.401.766-1.408 1.618a1.715 1.715 0 001.45 1.72c.805.128 1.64-.426 1.87-1.26.046-.167.076-.338.106-.51.025-.14.05-.282.084-.42.318-1.317 1.237-1.95 2.788-1.93 1.086.013 1.318.271 1.68 1.855.017.076.043.151.07.226.26.714.976 1.17 1.67 1.065a1.647 1.647 0 001.38-1.438c.083-.729-.348-1.264-1.122-1.575-.34-.136-.664-.158-.995-.141-.726.037-1.121-.36-1.339-.977a3.359 3.359 0 01-.134-.65c-.014-.093-.027-.186-.043-.278-.156-.887-.835-1.51-1.669-1.532-.791-.02-1.464.551-1.665 1.418l-.06.27-.025.117c-.355 1.636-.974 2.205-2.638 2.422z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M18.059 13.644c.989-.206 1.577-.838 1.592-1.697.015-.83-.624-1.582-1.46-1.724-.77-.13-1.599.383-1.844 1.18-.069.22-.117.448-.165.676-.06.29-.122.58-.225.854-.367.986-1.593 1.546-2.926 1.394-.824-.095-1.106-.446-1.342-1.674-.18-.938-.864-1.535-1.681-1.467-.85.07-1.515.829-1.468 1.673.05.892.678 1.44 1.705 1.489 1.375.064 1.75.396 1.926 1.787.067.531.267.967.685 1.288 1.02.783 2.407.208 2.66-1.108l.022-.114c.152-.796.3-1.577 1.04-2.101.36-.255.761-.326 1.166-.397.105-.019.21-.037.315-.06z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path d="M13.83 7.961a.755.755 0 11-1.51 0 .755.755 0 011.51 0z" fill={color} />
|
||||
<Path d="M10.809 16.678a.755.755 0 100-1.511.755.755 0 000 1.51z" fill={color} />
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'Ai360Mono';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,32 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 78 24"
|
||||
width={size * 3.25} // 保持宽高比
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M17.978 2H2v1.196c0 1.02.827 1.847 1.848 1.847h14.565a3.913 3.913 0 013.913 3.914v1.304H3.956v3.043h18.37v1.848a3.913 3.913 0 01-3.913 3.913H3.848c-1.02 0-1.848.827-1.848 1.848V22h15.978a7.391 7.391 0 007.392-7.391V9.39A7.391 7.391 0 0017.978 2z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
clipRule="evenodd"
|
||||
d="M27.978 8.957A6.956 6.956 0 0134.935 2h15.87v1.304c0 .96-.78 1.74-1.74 1.74H34.826a3.913 3.913 0 00-3.913 3.913v1.304h15a4.783 4.783 0 014.783 4.783v2.173A4.783 4.783 0 0145.913 22H34.935a6.956 6.956 0 01-6.957-6.957V8.957zm2.935 4.239v1.848c0 2.22 1.8 4.021 4.022 4.021h10.76c1.201 0 2.175-.973 2.175-2.174V15.37c0-1.201-.974-2.174-2.174-2.174H30.913zM60.26 2.109a6.848 6.848 0 00-6.847 6.848v6.195A6.848 6.848 0 0060.261 22h9.13a6.848 6.848 0 006.848-6.848V8.957a6.848 6.848 0 00-6.848-6.848h-9.13zm0 2.934a3.913 3.913 0 00-3.912 3.914v6.195a3.913 3.913 0 003.913 3.913h9.13a3.913 3.913 0 003.913-3.913V8.957a3.913 3.913 0 00-3.913-3.914h-9.13z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'Ai360Text';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,27 @@
|
||||
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_GRADIENT, COLOR_PRIMARY, TITLE } from './style';
|
||||
|
||||
export type CompoundedIcon = typeof Mono & {
|
||||
Avatar: typeof Avatar;
|
||||
Color: typeof Color;
|
||||
Combine: typeof Combine;
|
||||
Text: typeof Text;
|
||||
colorGradient: string;
|
||||
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.colorGradient = COLOR_GRADIENT;
|
||||
Icons.title = TITLE;
|
||||
|
||||
export default Icons;
|
||||
@@ -0,0 +1,10 @@
|
||||
export const TITLE = 'AI360';
|
||||
export const COMBINE_TEXT_MULTIPLE = 0.7;
|
||||
export const COMBINE_SPACE_MULTIPLE = 0.2;
|
||||
export const COLOR_PRIMARY = '#006ffb';
|
||||
export const COLOR_GRADIENT = 'linear-gradient(to bottom, #12B7FA, #006ffb)';
|
||||
|
||||
// Avatar constants
|
||||
export const AVATAR_BACKGROUND = COLOR_GRADIENT;
|
||||
export const AVATAR_COLOR = '#fff';
|
||||
export const AVATAR_ICON_MULTIPLE = 0.75;
|
||||
@@ -0,0 +1,22 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
|
||||
|
||||
import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
|
||||
import Inner from './Inner';
|
||||
|
||||
export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
|
||||
|
||||
const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
|
||||
return (
|
||||
<RNIconAvatar
|
||||
Icon={Inner}
|
||||
aria-label={TITLE}
|
||||
background={background || AVATAR_BACKGROUND}
|
||||
color={AVATAR_COLOR}
|
||||
iconMultiple={AVATAR_ICON_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
export default Avatar;
|
||||
@@ -0,0 +1,25 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
|
||||
return (
|
||||
<Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
|
||||
<Path
|
||||
d="M12 24c6.627 0 12-5.373 12-12S18.627 0 12 0 0 5.373 0 12s5.373 12 12 12z"
|
||||
fill="#006FFB"
|
||||
/>
|
||||
<Path
|
||||
clipRule="evenodd"
|
||||
d="M11.24 8.393c.095-.644.302-1.47.624-2.48L12 5.496l.136.417c.322 1.01.53 1.836.624 2.48.071.472.071 1.072 0 1.8-.072.731-.072 1.336 0 1.814.106.7.426 1.281.96 1.744a2.795 2.795 0 001.89.708 2.78 2.78 0 002.034-.84c.56-.559.842-1.234.848-2.024.003-.7.075-1.472.216-2.316.069-.422.14-.775.21-1.06l.095-.384.168.356a7.862 7.862 0 01.76 3.244v.16a7.84 7.84 0 01-.624 3.089 7.952 7.952 0 01-4.228 4.228 7.841 7.841 0 01-3.089.623 7.84 7.84 0 01-3.089-.623 7.952 7.952 0 01-4.228-4.228 7.84 7.84 0 01-.623-3.09v-.159a7.862 7.862 0 01.759-3.244l.169-.356.093.385c.072.284.143.637.211 1.059.141.844.213 1.616.216 2.316.006.79.29 1.465.848 2.024.563.56 1.241.84 2.035.84.715 0 1.345-.236 1.889-.708a2.79 2.79 0 00.96-1.744c.073-.478.073-1.083 0-1.814-.071-.728-.071-1.328 0-1.8zm.76 9.694c1.097 0 2.125-.26 3.085-.778a6.379 6.379 0 001.77-1.399c.063-.07-.01-.178-.101-.153-.37.1-.75.15-1.144.15a4.236 4.236 0 01-2.18-.59 4.253 4.253 0 01-1.35-1.233.099.099 0 00-.16 0 4.253 4.253 0 01-1.35 1.232 4.236 4.236 0 01-2.18.591c-.393 0-.774-.05-1.143-.15-.091-.025-.165.083-.102.153a6.38 6.38 0 001.77 1.399c.96.518 1.988.778 3.085.778z"
|
||||
fill="#fff"
|
||||
fillRule="evenodd"
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AiHubMixColor';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconCombine, type RNIconCombineProps } from '@/features';
|
||||
|
||||
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
|
||||
import Color from './Color';
|
||||
import Mono from './Mono';
|
||||
import Text from './Text';
|
||||
|
||||
export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
|
||||
type?: 'color' | 'mono';
|
||||
}
|
||||
const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
|
||||
const Icon = type === 'color' ? Color : Mono;
|
||||
|
||||
return (
|
||||
<RNIconCombine
|
||||
Icon={Icon}
|
||||
Text={Text}
|
||||
aria-label={TITLE}
|
||||
spaceMultiple={COMBINE_SPACE_MULTIPLE}
|
||||
textMultiple={COMBINE_TEXT_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
export default Combine;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 24 24"
|
||||
width={size}
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
clipRule="evenodd"
|
||||
d="M10.853 6.285c.141-.972.455-2.221.942-3.747l.205-.63.206.63c.486 1.526.8 2.775.942 3.748.108.713.108 1.62 0 2.72-.109 1.105-.109 2.019 0 2.741a4.218 4.218 0 001.452 2.635 4.224 4.224 0 002.855 1.07c1.2 0 2.224-.423 3.074-1.268.846-.845 1.273-1.865 1.282-3.06.005-1.058.114-2.225.326-3.5.104-.637.21-1.17.319-1.6l.142-.581.255.538A11.88 11.88 0 0124 10.883v.24c0 1.63-.314 3.186-.942 4.669a12.017 12.017 0 01-6.39 6.39 11.848 11.848 0 01-4.668.942c-1.629 0-3.185-.314-4.668-.942a12.016 12.016 0 01-6.39-6.39A11.848 11.848 0 010 11.124v-.241A11.881 11.881 0 011.148 5.98l.255-.538.141.58c.11.43.215.964.32 1.601.212 1.275.32 2.442.325 3.5.01 1.195.437 2.215 1.282 3.06.85.845 1.875 1.268 3.075 1.268a4.225 4.225 0 002.854-1.07 4.218 4.218 0 001.453-2.635c.108-.722.108-1.636 0-2.741-.109-1.1-.109-2.007 0-2.72zM12 20.936a9.651 9.651 0 004.661-1.176 9.643 9.643 0 002.677-2.113c.095-.107-.017-.27-.154-.232a6.574 6.574 0 01-1.73.227 6.402 6.402 0 01-3.293-.893c-.82-.478-1.5-1.099-2.04-1.862a.149.149 0 00-.242 0 6.427 6.427 0 01-2.04 1.862 6.402 6.402 0 01-3.293.893 6.574 6.574 0 01-1.73-.227c-.137-.037-.248.125-.154.232a9.643 9.643 0 002.677 2.113A9.651 9.651 0 0012 20.935z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AiHubMixInner';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 24 24"
|
||||
width={size}
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
clipRule="evenodd"
|
||||
d="M24 12c0 6.627-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0s12 5.373 12 12zM11.864 5.913c-.322 1.01-.53 1.836-.623 2.48-.072.472-.072 1.072 0 1.8.072.731.072 1.336 0 1.814a2.79 2.79 0 01-.961 1.744 2.795 2.795 0 01-1.89.708 2.78 2.78 0 01-2.034-.84 2.792 2.792 0 01-.848-2.024c-.003-.7-.075-1.472-.216-2.316-.068-.422-.139-.775-.21-1.06l-.094-.384-.17.356a7.862 7.862 0 00-.758 3.244v.16a7.84 7.84 0 00.623 3.089 7.952 7.952 0 004.228 4.228 7.84 7.84 0 003.09.623 7.841 7.841 0 003.088-.623 7.952 7.952 0 004.228-4.228 7.84 7.84 0 00.624-3.09v-.159a7.862 7.862 0 00-.76-3.244l-.168-.356-.094.385c-.072.284-.142.637-.211 1.059-.14.844-.212 1.616-.216 2.316a2.793 2.793 0 01-.848 2.024 2.78 2.78 0 01-2.034.84 2.795 2.795 0 01-1.89-.708 2.79 2.79 0 01-.96-1.744c-.072-.478-.072-1.083 0-1.814.071-.728.071-1.328 0-1.8-.094-.644-.302-1.47-.624-2.48L12 5.496l-.136.417zm3.22 11.396a6.387 6.387 0 01-3.084.778 6.387 6.387 0 01-3.084-.778 6.38 6.38 0 01-1.771-1.399c-.063-.07.01-.178.102-.153.369.1.75.15 1.144.15.781 0 1.508-.197 2.18-.59a4.253 4.253 0 001.349-1.233.099.099 0 01.16 0c.357.505.807.916 1.35 1.232.672.394 1.398.591 2.18.591.393 0 .775-.05 1.144-.15.09-.025.164.083.102.153a6.379 6.379 0 01-1.771 1.399z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AiHubMixMono';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 144 24"
|
||||
width={size * 6} // 保持宽高比
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
clipRule="evenodd"
|
||||
d="M2 22.569L8.27 1h5.957l6.238 21.569h-3.48l-1.442-5.084h-8.59l-1.442 5.084H2zm5.8-8.166h6.897L11.499 3.064h-.502L7.8 14.404zM23.532 22.569V7.379h3.23v15.19h-3.23zm1.63-17.255c-.627 0-1.16-.195-1.598-.586-.418-.41-.627-.934-.627-1.571 0-.637.209-1.15.627-1.54.439-.412.971-.617 1.599-.617.647 0 1.18.205 1.598.616.418.39.627.904.627 1.54 0 .638-.209 1.161-.627 1.572-.418.39-.95.586-1.598.586zM31.46 22.569V1h3.385v9.244h9.217V1h3.386v21.569h-3.386v-9.306h-9.217v9.306H31.46zM58.052 22.846c-1.17 0-2.215-.257-3.135-.77a5.497 5.497 0 01-2.163-2.188c-.523-.945-.784-2.075-.784-3.39v-9.12h3.23v8.905c0 1.314.333 2.29 1.002 2.927.67.616 1.6.924 2.79.924 1.317 0 2.373-.431 3.167-1.294.815-.883 1.223-2.146 1.223-3.79V7.378h3.229v15.19h-3.167v-2.28h-.502c-.292.616-.815 1.202-1.567 1.757-.752.534-1.86.8-3.323.8zM80.319 23c-1.505 0-2.665-.267-3.48-.801-.794-.534-1.39-1.13-1.787-1.787h-.502v2.157h-3.166V1h3.23v8.443h.5c.251-.411.586-.802 1.004-1.171.418-.39.972-.709 1.661-.955.69-.247 1.536-.37 2.54-.37 1.296 0 2.487.308 3.574.924 1.086.616 1.954 1.51 2.602 2.68.647 1.172.971 2.569.971 4.191v.462c0 1.644-.334 3.05-1.003 4.222-.648 1.15-1.515 2.033-2.602 2.65-1.066.616-2.246.924-3.542.924zm-.94-2.773c1.4 0 2.549-.442 3.448-1.325.92-.883 1.38-2.147 1.38-3.79v-.277c0-1.623-.45-2.876-1.349-3.76-.899-.883-2.059-1.324-3.48-1.324-1.38 0-2.529.441-3.448 1.325-.9.883-1.349 2.136-1.349 3.759v.277c0 1.643.45 2.907 1.349 3.79.92.883 2.069 1.325 3.448 1.325zM91.374 22.569V1h6.364l4.796 19.35h.502L107.832 1h6.364v21.569h-3.292V3.342h-.501l-4.765 19.227h-5.706L95.167 3.342h-.502v19.227h-3.291zM118.868 22.569V7.379h3.229v15.19h-3.229zm1.63-17.255c-.627 0-1.16-.195-1.599-.586-.418-.41-.627-.934-.627-1.571 0-.637.209-1.15.627-1.54.439-.412.972-.617 1.599-.617.648 0 1.181.205 1.599.616.418.39.627.904.627 1.54 0 .638-.209 1.161-.627 1.572-.418.39-.951.586-1.599.586zM125.573 22.568l5.894-7.672-5.769-7.518h3.793l4.044 5.454h.502l4.044-5.454h3.825l-5.8 7.518L142 22.568h-3.856l-4.107-5.577h-.502l-4.106 5.577h-3.856z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AiHubMixText';
|
||||
|
||||
export default Icon;
|
||||
@@ -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;
|
||||
@@ -0,0 +1,9 @@
|
||||
export const TITLE = 'AiHubMix';
|
||||
export const COMBINE_TEXT_MULTIPLE = 0.7;
|
||||
export const COMBINE_SPACE_MULTIPLE = 0.2;
|
||||
export const COLOR_PRIMARY = '#006FFB';
|
||||
|
||||
// Avatar constants
|
||||
export const AVATAR_BACKGROUND = COLOR_PRIMARY;
|
||||
export const AVATAR_COLOR = '#fff';
|
||||
export const AVATAR_ICON_MULTIPLE = 0.75;
|
||||
@@ -0,0 +1,22 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
|
||||
|
||||
import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
|
||||
import Color from './Color';
|
||||
|
||||
export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
|
||||
|
||||
const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
|
||||
return (
|
||||
<RNIconAvatar
|
||||
Icon={Color}
|
||||
aria-label={TITLE}
|
||||
background={background || AVATAR_BACKGROUND}
|
||||
color={AVATAR_COLOR}
|
||||
iconMultiple={AVATAR_ICON_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
export default Avatar;
|
||||
@@ -0,0 +1,23 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
|
||||
return (
|
||||
<Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
|
||||
<Path
|
||||
d="M8.858 17.115c.156-.414.065-.273.495.098 2.073 1.792 10.334-1.855 9.035-3.987-1.605-2.223-7.924-.72-11.499-.048.57-.259 2.835-.998 3.686-1.213 1.169-.296 1.65-.392 2.738-.651-2.45.25-6.216 1.493-9.687 2.797 1.692-1.346 5.077-2.538 5.854-2.901-1.606.363-4.596 1.708-6.845 2.845C1.358 14.7.932 14.94 0 15.458c.696-.595 1.53-1.383 2.951-2.216 1.714-1.003 1.815-1.048 2.333-1.359-1.244.518-2.383 1.037-3.16 1.296.773-.534 2.227-1.347 2.797-1.606-.173.015-.518.155-.725.207 1.036-.57 1.799-.83 2.234-.97 7.42-2.442 15.999-2.182 17.32.528 1.322 2.71-2.766 6.486-8.347 7.709-.966.212-1.821.328-2.626.358-.836.031-1.448-.005-2.037-.12-1.563-.305-2.237-1.232-1.882-2.17z"
|
||||
fill="#003E97"
|
||||
/>
|
||||
<Path
|
||||
d="M11.5 6.185c.673.104.984.156 1.347.156-.57-.363-.702-.405-2.02-1.14 1.294-.103 1.906-.024 3.366-.052-.621-.362-.932-.362-1.605-.673a33.982 33.982 0 012.797-.104 1.3 1.3 0 00-.415-.362c1.45-.052 3.51.096 4.685.62 2.292 1.027 1.995 2.619-.57 3.063-.471.081-1.315.148-1.874.15a12.536 12.536 0 01-2.138-.212c-1.871-.358-3.314-.98-3.573-1.446z"
|
||||
fill="#D70D19"
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AiMassColor';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconCombine, type RNIconCombineProps } from '@/features';
|
||||
|
||||
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
|
||||
import Color from './Color';
|
||||
import Mono from './Mono';
|
||||
import Text from './Text';
|
||||
|
||||
export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
|
||||
type?: 'color' | 'mono';
|
||||
}
|
||||
const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
|
||||
const Icon = type === 'color' ? Color : Mono;
|
||||
|
||||
return (
|
||||
<RNIconCombine
|
||||
Icon={Icon}
|
||||
Text={Text}
|
||||
aria-label={TITLE}
|
||||
spaceMultiple={COMBINE_SPACE_MULTIPLE}
|
||||
textMultiple={COMBINE_TEXT_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
export default Combine;
|
||||
@@ -0,0 +1,31 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 24 24"
|
||||
width={size}
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M8.858 17.115c.156-.414.065-.273.495.098 2.073 1.792 10.334-1.855 9.035-3.987-1.605-2.223-7.924-.72-11.499-.048.57-.259 2.835-.998 3.686-1.213 1.169-.296 1.65-.392 2.738-.651-2.45.25-6.216 1.493-9.687 2.797 1.692-1.346 5.077-2.538 5.854-2.901-1.606.363-4.596 1.708-6.845 2.845C1.358 14.7.932 14.94 0 15.458c.696-.595 1.53-1.383 2.951-2.216 1.714-1.003 1.815-1.048 2.333-1.359-1.244.518-2.383 1.037-3.16 1.296.773-.534 2.227-1.347 2.797-1.606-.173.015-.518.155-.725.207 1.036-.57 1.799-.83 2.234-.97 7.42-2.442 15.999-2.182 17.32.528 1.322 2.71-2.766 6.486-8.347 7.709-.966.212-1.821.328-2.626.358-.836.031-1.448-.005-2.037-.12-1.563-.305-2.237-1.232-1.882-2.17z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M11.5 6.185c.673.104.984.156 1.347.156-.57-.363-.702-.405-2.02-1.14 1.294-.103 1.906-.024 3.366-.052-.621-.362-.932-.362-1.605-.673a33.982 33.982 0 012.797-.104 1.3 1.3 0 00-.415-.362c1.45-.052 3.51.096 4.685.62 2.292 1.027 1.995 2.619-.57 3.063-.471.081-1.315.148-1.874.15a12.536 12.536 0 01-2.138-.212c-1.871-.358-3.314-.98-3.573-1.446z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AiMassMono';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,48 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 85 24"
|
||||
width={size * 3.54} // 保持宽高比
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M22.843 4.53h5.492c.462-.837.88-1.68 1.255-2.53l3.293.361a33.006 33.006 0 01-1.094 2.17H42.08v2.63H30.233a63.053 63.053 0 01-2.65 3.875h4.276V8.145h3.033v2.891h6.526v2.63h-6.526v4.64c0 .99-.218 1.756-.653 2.298-.435.543-1.04.867-1.817.974-.777.107-2.035.161-3.775.161a59.253 59.253 0 00-.683-3.012c1.09.107 2.001.16 2.73.16.777 0 1.165-.408 1.165-1.224v-3.996h-7.81v-2.771a46.257 46.257 0 002.72-3.735h-3.926V4.53z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M27.06 14.129c1.513 1.204 2.303 1.813 2.37 1.827a68.168 68.168 0 01-5.04 5 26.022 26.022 0 00-2.089-2.129 74.242 74.242 0 004.76-4.699zM37.763 14.49l4.9 3.896-2.048 2.269a83.452 83.452 0 00-4.7-4.177l1.848-1.988zM69.892 4.912c-.884-1.165-1.68-2.136-2.39-2.912l-2.169 1.386c.79.977 1.453 1.854 1.988 2.63h-3.453v2.59h3.875c-1.138 2.196-2.497 3.936-4.076 5.221.294.964.562 1.968.803 3.012a29.13 29.13 0 001.827-1.917V22h2.53v-7.41a63.278 63.278 0 012.129 1.948l1.446-1.747a58.297 58.297 0 00-1.386-1.144c.716-.864 1.372-1.7 1.968-2.51l-1.847-1.165a30.83 30.83 0 01-1.637 2.51 34.808 34.808 0 00-.673-.512v-.362a34.102 34.102 0 001.908-3.243V6.016h-2.5l1.657-1.104z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M75.253 18.406c.294 1.11.529 2.128.703 3.052 1.606-.034 2.834-.087 3.685-.16.856-.074 1.519-.416 1.987-1.025.476-.609.713-1.486.713-2.63l.1-2.701.242-11.617H71.357v2.53h2.35c-.06 3.414-.184 5.757-.372 7.028a12.246 12.246 0 01-1.184 3.745c-.61 1.225-1.476 2.32-2.6 3.284.95.776 1.72 1.466 2.308 2.068 1.346-1.312 2.363-2.795 3.053-4.448.696-1.653 1.114-3.19 1.255-4.608.14-1.42.26-3.775.361-7.069h3.263c-.08 6.466-.157 10.198-.23 11.195-.074.997-.586 1.496-1.537 1.496-.877 0-1.8-.047-2.771-.14zM51.377 6.719h-7.891V9.49h7.51c-.63 3.842-3.273 7.115-7.932 9.82.59.588 1.366 1.485 2.33 2.69 4.23-3.333 6.834-6.707 7.81-10.12 1.507 4.457 4.044 7.79 7.611 10a63.48 63.48 0 012.39-2.952c-4.19-1.707-6.981-4.853-8.374-9.438h7.892V6.719H54.47c.1-1.553.16-3.052.18-4.498h-3.092a45.95 45.95 0 01-.18 4.498z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M52.361 16.317l-1.887 1.567a85.846 85.846 0 012.69 3.413l2.21-1.807a139.506 139.506 0 01-3.013-3.173z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
clipRule="evenodd"
|
||||
d="M15.795 6.84a47.97 47.97 0 005.02-2.39L19.35 2.602A29.062 29.062 0 0115.795 4.5V2.08h-2.45v5.462c0 1.72.707 2.66 2.119 2.822-.81.475-1.71.95-2.7 1.425l-4.298.15c1.593-.521 2.965-.997 4.116-1.425L10.906 9.37l1.496-.2c.013-.844.053-1.613.12-2.31l-2.61.342V5.755h2.63V3.606h-2.63V2.141h-2.41v5.361l-1.566.19V3.186h-2.41v4.799L2 8.164l.402 2.43 7.55-1.084c-1.593.944-3.427 1.7-5.502 2.27l.642 1.967a76.252 76.252 0 013.886-.291 40.34 40.34 0 01-5.552 1.797l.783 2.27a90.76 90.76 0 012.871-.242 26.332 26.332 0 01-4.88 2.43c.63.91 1.072 1.593 1.326 2.048a36.647 36.647 0 004.327-2.249 17 17 0 01.492 2.35c1.111 0 2.082-.024 2.912-.07.83-.041 1.426-.245 1.787-.613.362-.368.542-.877.542-1.526V16.94l4.649-.17c.415.36.806.712 1.175 1.053l1.747-1.626a87.341 87.341 0 00-4.74-3.514l-1.525 1.285 1.335 1.084-7.982.402c2.838-.977 6.064-2.196 9.679-3.655l-1.607-1.405h2.35c.756 0 1.372-.144 1.847-.432.475-.288.793-.706.954-1.255.167-.556.331-1.386.492-2.49-.562-.188-1.346-.502-2.35-.944-.073 1.42-.214 2.27-.421 2.55-.201.281-.583.422-1.145.422H16.86c-.71 0-1.064-.361-1.064-1.084v-.322zM7.954 17.22l3.002-.16v1.506c0 .348-.084.593-.251.733-.168.14-.492.211-.974.211-.536 0-1.115-.027-1.737-.08.408-.248.82-.509 1.235-.783L7.954 17.22z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M21.598 19.751A68.556 68.556 0 0015.916 17l-1.265 1.888a63.801 63.801 0 015.642 2.891l1.305-2.028z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AiMassText';
|
||||
|
||||
export default Icon;
|
||||
@@ -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;
|
||||
@@ -0,0 +1,9 @@
|
||||
export const TITLE = 'AiMass';
|
||||
export const COMBINE_TEXT_MULTIPLE = 0.65;
|
||||
export const COMBINE_SPACE_MULTIPLE = 0.2;
|
||||
export const COLOR_PRIMARY = '#fff';
|
||||
|
||||
// Avatar constants
|
||||
export const AVATAR_BACKGROUND = COLOR_PRIMARY;
|
||||
export const AVATAR_COLOR = '#fff';
|
||||
export const AVATAR_ICON_MULTIPLE = 0.8;
|
||||
@@ -0,0 +1,22 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
|
||||
|
||||
import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
|
||||
import Mono from './Mono';
|
||||
|
||||
export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
|
||||
|
||||
const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
|
||||
return (
|
||||
<RNIconAvatar
|
||||
Icon={Mono}
|
||||
aria-label={TITLE}
|
||||
background={background || AVATAR_BACKGROUND}
|
||||
color={AVATAR_COLOR}
|
||||
iconMultiple={AVATAR_ICON_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
export default Avatar;
|
||||
@@ -0,0 +1,31 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, ...rest }) => {
|
||||
return (
|
||||
<Svg height={size} style={style} viewBox="0 0 24 24" width={size} {...rest}>
|
||||
<Path
|
||||
d="M15.028 14.16c-.035.384.089.773.353 1.057.265.284.639.434.978.568.37.145.692.263 1.038.468.33.195.622.437.866.736a3.082 3.082 0 01-.212 4.134 3.006 3.006 0 01-4.094.14 4.75 4.75 0 01-.797-.938c-.338-2.214.318-4.533 1.868-6.165z"
|
||||
fill="#85A8FF"
|
||||
/>
|
||||
<Path
|
||||
d="M16.457 13.024c.372-.217.72-.37 1.125-.513.39-.136.787-.249 1.188-.35.4-.102.803-.188 1.207-.275.403-.086.804-.17 1.194-.318 1.91-.733 3.067-2.7 2.788-4.746-.28-2.045-1.92-3.622-3.956-3.805-.925-.082-1.818.138-2.644.524-.824.384-1.578.93-2.234 1.555-1.325 1.26-2.305 2.878-2.902 4.6a13.445 13.445 0 00-.684 5.426c.07.91.234 1.827.496 2.703.256.859.627 1.746 1.126 2.498a7.535 7.535 0 01.545-4.166c.572-1.3 1.521-2.415 2.751-3.133z"
|
||||
fill="#0057CC"
|
||||
/>
|
||||
<Path
|
||||
d="M7.962 14.27a3.817 3.817 0 00-.419-.413c.188.325.207.695.128 1.05a2.44 2.44 0 01-.474.961 4.096 4.096 0 01-.786.736c-.253.19-.623.431-.852.658a2.093 2.093 0 00-.334 2.534 2.048 2.048 0 002.352.946c.5-.148.925-.48 1.262-.86.34-.385.617-.842.836-1.304a6.87 6.87 0 00-1.713-4.308z"
|
||||
fill="#85A8FF"
|
||||
/>
|
||||
<Path
|
||||
d="M3.687 5.396c1.387-.001 2.733.777 3.708 1.65 1.035.927 1.836 2.108 2.364 3.392.53 1.29.786 2.686.776 4.08-.01 1.354-.274 2.822-.86 4.06a6.874 6.874 0 00-1.713-4.31 3.405 3.405 0 00-.606-.554 3.085 3.085 0 00-.73-.369c-.506-.181-1.078-.266-1.604-.324-.543-.062-1.088-.098-1.63-.179-.556-.083-1.055-.206-1.551-.497A3.737 3.737 0 01.127 8.157a3.696 3.696 0 013.56-2.76z"
|
||||
fill="#0057CC"
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AiStudioColor';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconCombine, type RNIconCombineProps } from '@/features';
|
||||
|
||||
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
|
||||
import Color from './Color';
|
||||
import Mono from './Mono';
|
||||
import Text from './Text';
|
||||
|
||||
export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
|
||||
type?: 'color' | 'mono';
|
||||
}
|
||||
const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
|
||||
const Icon = type === 'color' ? Color : Mono;
|
||||
|
||||
return (
|
||||
<RNIconCombine
|
||||
Icon={Icon}
|
||||
Text={Text}
|
||||
aria-label={TITLE}
|
||||
spaceMultiple={COMBINE_SPACE_MULTIPLE}
|
||||
textMultiple={COMBINE_TEXT_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
export default Combine;
|
||||
@@ -0,0 +1,27 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 24 24"
|
||||
width={size}
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M17.582 12.511a6.242 6.242 0 00-1.125.513c-1.221.713-2.008 1.191-1.076 2.193.265.284.639.434.978.568l.09.035c.334.13.63.245.948.433.33.195.622.437.866.736a3.082 3.082 0 01-.212 4.134 3.006 3.006 0 01-4.094.14 4.75 4.75 0 01-.797-.938l-.001-.006c-.498-.751-.868-1.637-1.124-2.494a12.997 12.997 0 01-.496-2.703 13.445 13.445 0 01.684-5.426c.597-1.722 1.577-3.34 2.902-4.6.656-.625 1.41-1.171 2.234-1.555.826-.386 1.72-.606 2.644-.524 2.035.183 3.676 1.76 3.956 3.805.28 2.046-.877 4.013-2.788 4.746-.377.144-.765.226-1.155.31l-.04.008c-.403.087-.806.173-1.206.275-.401.101-.798.214-1.188.35zM7.394 7.046c-.974-.873-2.32-1.651-3.707-1.65a3.696 3.696 0 00-3.56 2.761 3.737 3.737 0 001.714 4.188c.496.291.995.414 1.551.497.347.052.695.086 1.044.12.195.018.39.037.586.059.526.058 1.098.143 1.603.324.931.333 1.264.587 1.046 1.561a2.44 2.44 0 01-.474.962 4.096 4.096 0 01-.786.736c-.066.05-.14.102-.217.157-.219.157-.465.334-.635.501a2.093 2.093 0 00-.334 2.534 2.048 2.048 0 002.352.946c.5-.148.925-.48 1.262-.86.34-.385.617-.842.836-1.304.586-1.238.85-2.706.86-4.06a10.555 10.555 0 00-.776-4.08c-.528-1.284-1.33-2.465-2.365-3.392z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AiStudioMono';
|
||||
|
||||
export default Icon;
|
||||
File diff suppressed because one or more lines are too long
@@ -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;
|
||||
@@ -0,0 +1,9 @@
|
||||
export const TITLE = 'Google AI Studio';
|
||||
export const COMBINE_TEXT_MULTIPLE = 0.75;
|
||||
export const COMBINE_SPACE_MULTIPLE = 0.2;
|
||||
export const COLOR_PRIMARY = '#0057CC';
|
||||
|
||||
// Avatar constants
|
||||
export const AVATAR_BACKGROUND = COLOR_PRIMARY;
|
||||
export const AVATAR_COLOR = '#fff';
|
||||
export const AVATAR_ICON_MULTIPLE = 0.75;
|
||||
@@ -0,0 +1,22 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
|
||||
|
||||
import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
|
||||
import Mono from './Mono';
|
||||
|
||||
export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
|
||||
|
||||
const Avatar = memo<AvatarProps>(({ background, ...rest }) => {
|
||||
return (
|
||||
<RNIconAvatar
|
||||
Icon={Mono}
|
||||
aria-label={TITLE}
|
||||
background={background || AVATAR_BACKGROUND}
|
||||
color={AVATAR_COLOR}
|
||||
iconMultiple={AVATAR_ICON_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
export default Avatar;
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,28 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconCombine, type RNIconCombineProps } from '@/features';
|
||||
|
||||
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
|
||||
import Color from './Color';
|
||||
import Mono from './Mono';
|
||||
import Text from './Text';
|
||||
|
||||
export interface CombineProps extends Omit<RNIconCombineProps, 'Icon' | 'Text'> {
|
||||
type?: 'color' | 'mono';
|
||||
}
|
||||
const Combine = memo<CombineProps>(({ type = 'mono', ...rest }) => {
|
||||
const Icon = type === 'color' ? Color : Mono;
|
||||
|
||||
return (
|
||||
<RNIconCombine
|
||||
Icon={Icon}
|
||||
Text={Text}
|
||||
aria-label={TITLE}
|
||||
spaceMultiple={COMBINE_SPACE_MULTIPLE}
|
||||
textMultiple={COMBINE_TEXT_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
export default Combine;
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,27 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="nonzero"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 135 24"
|
||||
width={size * 5.63} // 保持宽高比
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M131.939 10.694l-3.909.241a2.018 2.018 0 00-.431-.902 2.283 2.283 0 00-.872-.652c-.354-.167-.778-.25-1.273-.25-.661 0-1.219.14-1.673.42-.455.275-.682.642-.682 1.103 0 .368.147.678.441.932.294.254.799.458 1.513.612l2.787.561c1.497.307 2.612.802 3.347 1.483.735.682 1.103 1.577 1.103 2.687 0 1.009-.297 1.894-.892 2.656-.588.761-1.397 1.356-2.426 1.784-1.022.42-2.201.631-3.538.631-2.038 0-3.661-.424-4.871-1.273-1.202-.855-1.907-2.018-2.115-3.488l4.2-.22c.127.621.434 1.096.922 1.423.488.32 1.113.481 1.874.481.749 0 1.35-.144 1.804-.43.461-.295.695-.672.702-1.133a1.178 1.178 0 00-.491-.953c-.321-.253-.815-.447-1.483-.58l-2.666-.532c-1.504-.3-2.623-.822-3.358-1.564-.728-.741-1.093-1.687-1.093-2.836 0-.989.268-1.841.802-2.556.541-.715 1.3-1.266 2.275-1.654.983-.387 2.132-.581 3.448-.581 1.945 0 3.475.41 4.591 1.233 1.122.822 1.777 1.94 1.964 3.357zM101.831 21.7V1.174h4.27V8.89h.13a5.65 5.65 0 01.812-1.263c.361-.434.829-.795 1.403-1.082.582-.294 1.303-.441 2.165-.441 1.123 0 2.159.294 3.107.882.949.581 1.708 1.46 2.276 2.636.568 1.17.851 2.636.851 4.4 0 1.717-.277 3.167-.831 4.35-.548 1.176-1.297 2.068-2.245 2.676-.943.601-1.998.902-3.168.902-.828 0-1.533-.137-2.114-.411-.575-.274-1.046-.618-1.414-1.032a5.266 5.266 0 01-.842-1.273h-.19V21.7h-4.21zm4.18-7.697c0 .915.127 1.714.381 2.395.254.682.621 1.213 1.102 1.594.481.374 1.066.561 1.754.561.695 0 1.283-.19 1.764-.571.481-.388.845-.922 1.093-1.604.254-.688.381-1.48.381-2.375 0-.889-.124-1.67-.371-2.345-.247-.675-.612-1.203-1.093-1.584-.481-.38-1.072-.571-1.774-.571-.695 0-1.283.183-1.764.551-.474.367-.838.889-1.092 1.563-.254.675-.381 1.47-.381 2.386zM90.334 21.99c-.983 0-1.858-.17-2.626-.511a4.228 4.228 0 01-1.824-1.534c-.441-.681-.662-1.53-.662-2.545 0-.856.157-1.574.471-2.155a3.814 3.814 0 011.283-1.403 6.222 6.222 0 011.844-.802 14.06 14.06 0 012.185-.381 55.38 55.38 0 002.165-.26c.548-.088.946-.214 1.193-.382.247-.167.37-.414.37-.741v-.06c0-.635-.2-1.126-.6-1.474-.395-.347-.956-.52-1.684-.52-.769 0-1.38.17-1.835.51a2.352 2.352 0 00-.902 1.263l-3.949-.32c.2-.936.595-1.745 1.183-2.426.588-.688 1.347-1.216 2.275-1.584.936-.374 2.018-.561 3.248-.561.855 0 1.673.1 2.455.3.789.201 1.487.512 2.095.933.615.42 1.1.962 1.453 1.623.354.655.531 1.44.531 2.356v10.383h-4.049v-2.135h-.12a4.346 4.346 0 01-.992 1.273c-.415.361-.912.645-1.494.852-.581.2-1.252.301-2.014.301zm1.222-2.947c.629 0 1.183-.123 1.664-.37a2.948 2.948 0 001.133-1.023c.274-.427.41-.912.41-1.453v-1.634a2.286 2.286 0 01-.55.24c-.228.068-.485.131-.772.191-.288.054-.575.104-.862.15l-.782.11a5.28 5.28 0 00-1.313.352c-.374.16-.665.377-.872.651-.207.267-.31.601-.31 1.002 0 .582.21 1.026.63 1.333.428.301.97.451 1.624.451zM70.574 21.7V1.174h4.34v16.948h8.8V21.7h-13.14zM51.803 12.8v8.9h-4.27V6.303h4.07v2.717h.18a4.295 4.295 0 011.714-2.125c.802-.528 1.774-.792 2.917-.792 1.069 0 2 .234 2.796.702.795.467 1.413 1.135 1.854 2.004.441.862.662 1.891.662 3.087V21.7h-4.27v-9.04c.007-.942-.234-1.677-.722-2.205-.487-.535-1.159-.802-2.014-.802-.575 0-1.083.124-1.524.37a2.584 2.584 0 00-1.022 1.083c-.24.468-.364 1.033-.37 1.694zM37.745 22c-1.557 0-2.904-.33-4.04-.992a6.79 6.79 0 01-2.615-2.787c-.615-1.196-.922-2.582-.922-4.159 0-1.59.307-2.98.922-4.17.614-1.195 1.486-2.124 2.616-2.786 1.135-.668 2.482-1.002 4.039-1.002 1.556 0 2.9.334 4.029 1.002A6.691 6.691 0 0144.4 9.893c.614 1.189.922 2.579.922 4.17 0 1.576-.308 2.962-.922 4.158a6.771 6.771 0 01-2.626 2.787c-1.13.661-2.473.992-4.03.992zm.02-3.307c.708 0 1.3-.2 1.774-.602.474-.407.832-.962 1.072-1.664.247-.701.371-1.5.371-2.395s-.124-1.694-.37-2.395c-.241-.702-.599-1.257-1.073-1.664-.475-.408-1.066-.612-1.774-.612-.715 0-1.317.204-1.804.612-.481.407-.846.962-1.093 1.664-.24.701-.36 1.5-.36 2.395s.12 1.694.36 2.395c.247.702.611 1.257 1.093 1.664.487.401 1.089.602 1.804.602zM23.663 21.7V6.303h4.27V21.7h-4.27zm2.145-17.38a2.32 2.32 0 01-1.633-.632c-.448-.427-.672-.938-.672-1.533 0-.588.224-1.093.672-1.514A2.3 2.3 0 0125.808 0c.635 0 1.176.214 1.624.641.454.421.681.926.681 1.514 0 .595-.227 1.106-.681 1.533a2.285 2.285 0 01-1.624.632zM6.65 21.7H2L9.086 1.174h5.593L21.755 21.7h-4.65L11.962 5.864h-.16L6.65 21.7zm-.29-8.068h10.985v3.388H6.36v-3.388z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AionLabsText';
|
||||
|
||||
export default Icon;
|
||||
@@ -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;
|
||||
@@ -0,0 +1,9 @@
|
||||
export const TITLE = 'AionLabs';
|
||||
export const COMBINE_TEXT_MULTIPLE = 0.8;
|
||||
export const COMBINE_SPACE_MULTIPLE = 0.2;
|
||||
export const COLOR_PRIMARY = '#0f172a';
|
||||
|
||||
// Avatar constants
|
||||
export const AVATAR_BACKGROUND = '#fff';
|
||||
export const AVATAR_COLOR = COLOR_PRIMARY;
|
||||
export const AVATAR_ICON_MULTIPLE = 0.8;
|
||||
@@ -0,0 +1,19 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconAvatar, type RNIconAvatarProps } from '@/features';
|
||||
|
||||
import { AVATAR_BACKGROUND, AVATAR_COLOR, AVATAR_ICON_MULTIPLE, TITLE } from '../style';
|
||||
import Mono from './Mono';
|
||||
|
||||
export type AvatarProps = Omit<RNIconAvatarProps, 'Icon'>;
|
||||
const Avatar = memo<AvatarProps>(({ background, ...rest }) => (
|
||||
<RNIconAvatar
|
||||
Icon={Mono}
|
||||
aria-label={TITLE}
|
||||
background={background || AVATAR_BACKGROUND}
|
||||
color={AVATAR_COLOR}
|
||||
iconMultiple={AVATAR_ICON_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
));
|
||||
export default Avatar;
|
||||
@@ -0,0 +1,24 @@
|
||||
import React, { memo } from 'react';
|
||||
|
||||
import { RNIconCombine, type RNIconCombineProps } from '@/features';
|
||||
|
||||
import { COMBINE_SPACE_MULTIPLE, COMBINE_TEXT_MULTIPLE, TITLE } from '../style';
|
||||
import Mono from './Mono';
|
||||
import Text from './Text';
|
||||
|
||||
export type CombineProps = Omit<RNIconCombineProps, 'Icon' | 'Text'>;
|
||||
|
||||
const Combine = memo<CombineProps>(({ ...rest }) => {
|
||||
return (
|
||||
<RNIconCombine
|
||||
Icon={Mono}
|
||||
Text={Text as any}
|
||||
aria-label={TITLE}
|
||||
spaceMultiple={COMBINE_SPACE_MULTIPLE}
|
||||
textMultiple={COMBINE_TEXT_MULTIPLE}
|
||||
{...rest}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
export default Combine;
|
||||
@@ -0,0 +1,27 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="evenodd"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 24 24"
|
||||
width={size}
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M2.373 4.301L1 7.663a4.608 4.608 0 012.602 2.602c.976 2.422-.18 5.169-2.566 6.145L2.41 19.77c2.096-.867 3.723-2.494 4.554-4.59A8.346 8.346 0 002.374 4.3zM5.916 21.072L8.084 24c1.049-.759 1.988-1.699 2.783-2.71l-2.819-2.242a11.324 11.324 0 01-2.132 2.024zM14.157 12.036c0-4.699-2.277-9.144-6.073-11.928L5.916 3.036c2.891 2.096 4.59 5.458 4.626 9.036A14.81 14.81 0 0016.578 24l2.133-2.928c-2.856-2.132-4.554-5.458-4.554-9.036zM18.82 2.964L16.722 0a14.601 14.601 0 00-2.964 2.82l2.82 2.24a11.256 11.256 0 012.24-2.096zM21.277 14.06c-1.12-2.421-.036-5.313 2.386-6.433l-1.518-3.29a8.457 8.457 0 00-4.193 4.265c-1.916 4.265 0 9.29 4.301 11.17l1.482-3.29a4.862 4.862 0 01-2.458-2.422z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AlephAlphaMono';
|
||||
|
||||
export default Icon;
|
||||
@@ -0,0 +1,35 @@
|
||||
import React, { memo } from 'react';
|
||||
import { Path, Svg } from 'react-native-svg';
|
||||
|
||||
import type { RNIconProps } from '@/features';
|
||||
|
||||
const Icon = memo<RNIconProps>(({ size = 24, style, color = '#000000', ...rest }) => {
|
||||
return (
|
||||
<Svg
|
||||
color={color}
|
||||
fillRule="nonzero"
|
||||
height={size}
|
||||
style={style}
|
||||
viewBox="0 0 224 24"
|
||||
width={size * 9.33} // 保持宽高比
|
||||
{...rest}
|
||||
>
|
||||
<Path
|
||||
d="M7.789 22H2L8.956 2H17.1l6.956 20h-6.178l-3.167-9.911-1.578-5.222h-.422l-1.633 5.222L7.788 22zm12.178-3.856H6.056v-4.888h13.91v4.888zM32.156 22h-5.623V2h5.623v20zm10.022 0h-14.09v-5.044h14.09V22zM51.011 22h-5.655V2h5.6l.055 20zM61.556 7.044H46.933V2h14.623v5.044zm-.434 7.434H46.933V9.467h14.19v5.01zM61.556 22H46.933v-5.044h14.623V22zM91.833 22h-5.622V2h5.622v20zm10.434-7.522H87.722V9.433h14.545v5.045zM105 22h-5.722V2h5.622l.1 20zM120.444 22h-5.788l6.955-20h8.156l6.955 20h-6.144l-3.167-9.911-1.578-5.222h-.466l-1.656 5.222L120.444 22zm12.267-3.856h-13.922v-4.888H132.7v4.888h.011zM144.789 22h-5.511V2h5.6l-.089 20zm10.044 0h-14.089v-5.044h14.089V22zM184.367 22h-5.622V2h5.622v20zm10.433-7.522h-14.544V9.433H194.8v5.045zM197.511 22h-5.6V2h5.6v20zM205.767 22h-5.789l6.955-20h8.145l6.955 20h-6.222l-3.167-9.911-1.577-5.222h-.423l-1.655 5.222L205.767 22zm12.266-3.856h-13.911v-4.888h13.911v4.888zM71.133 22h-5.6V2h5.6v20z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M75.3 16.7h-7.578v-5h7.367a3.224 3.224 0 001.944-.433 3.805 3.805 0 000-3.8 3.216 3.216 0 00-1.944-.422h-7.367V2.01H75.3a9.402 9.402 0 014.156.867 6.578 6.578 0 012.722 2.533 8.668 8.668 0 010 7.956 6.404 6.404 0 01-2.722 2.489 9.205 9.205 0 01-4.156.778v.066zM163.633 22h-5.622V2h5.622v20z"
|
||||
fill={color}
|
||||
/>
|
||||
<Path
|
||||
d="M167.489 16.7h-7.578v-5h7.367a3.223 3.223 0 001.944-.433 3.804 3.804 0 000-3.8 3.215 3.215 0 00-1.944-.422h-7.367V2.01h7.578a9.4 9.4 0 014.155.867 6.58 6.58 0 012.723 2.533 8.667 8.667 0 010 7.956 6.405 6.405 0 01-2.723 2.489 9.204 9.204 0 01-4.155.778v.066z"
|
||||
fill={color}
|
||||
/>
|
||||
</Svg>
|
||||
);
|
||||
});
|
||||
|
||||
Icon.displayName = 'AlephAlphaText';
|
||||
|
||||
export default Icon;
|
||||
@@ -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;
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user