@lobehub/icons 1.0.0 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/Anthropic/components/Avatar.d.ts +5 -0
- package/es/Anthropic/components/Avatar.js +20 -0
- package/es/Anthropic/components/Mono.d.ts +3 -0
- package/es/Anthropic/components/Mono.js +31 -0
- package/es/Anthropic/components/Text.d.ts +3 -0
- package/es/Anthropic/components/Text.js +31 -0
- package/es/Anthropic/index.d.ts +11 -0
- package/es/Anthropic/index.js +9 -0
- package/es/Anthropic/style.d.ts +3 -0
- package/es/Anthropic/style.js +3 -0
- package/es/ChatGLM/components/Avatar.d.ts +5 -0
- package/es/ChatGLM/components/Avatar.js +26 -0
- package/es/ChatGLM/components/Color.d.ts +3 -0
- package/es/ChatGLM/components/Color.js +51 -0
- package/es/ChatGLM/components/Combine.d.ts +7 -0
- package/es/ChatGLM/components/Combine.js +25 -0
- package/es/ChatGLM/components/Mono.d.ts +3 -0
- package/es/ChatGLM/components/Mono.js +31 -0
- package/es/ChatGLM/components/Text.d.ts +3 -0
- package/es/ChatGLM/components/Text.js +31 -0
- package/es/ChatGLM/index.d.ts +16 -0
- package/es/ChatGLM/index.js +14 -0
- package/es/ChatGLM/style.d.ts +4 -0
- package/es/ChatGLM/style.js +4 -0
- package/es/Dalle/components/Combine.d.ts +5 -0
- package/es/Dalle/components/Combine.js +29 -0
- package/es/Dalle/components/Mono.d.ts +3 -0
- package/es/Dalle/components/Mono.js +31 -0
- package/es/Dalle/components/Text.d.ts +3 -0
- package/es/Dalle/components/Text.js +31 -0
- package/es/Dalle/index.d.ts +10 -0
- package/es/Dalle/index.js +9 -0
- package/es/Dalle/style.d.ts +3 -0
- package/es/Dalle/style.js +3 -0
- package/es/Gemini/components/Avatar.d.ts +5 -0
- package/es/Gemini/components/Avatar.js +20 -0
- package/es/Gemini/components/BrandColor.d.ts +3 -0
- package/es/Gemini/components/BrandColor.js +53 -0
- package/es/Gemini/components/BrandMono.d.ts +3 -0
- package/es/Gemini/components/BrandMono.js +31 -0
- package/es/Gemini/components/Color.d.ts +3 -0
- package/es/Gemini/components/Color.js +54 -0
- package/es/Gemini/components/Combine.d.ts +7 -0
- package/es/Gemini/components/Combine.js +25 -0
- package/es/Gemini/components/Mono.d.ts +3 -0
- package/es/Gemini/components/Mono.js +31 -0
- package/es/Gemini/components/Text.d.ts +3 -0
- package/es/Gemini/components/Text.js +31 -0
- package/es/Gemini/index.d.ts +20 -0
- package/es/Gemini/index.js +18 -0
- package/es/Gemini/style.d.ts +4 -0
- package/es/Gemini/style.js +4 -0
- package/es/IconAvatar/index.d.ts +15 -0
- package/es/IconAvatar/index.js +38 -0
- package/es/IconCombine/index.d.ts +17 -0
- package/es/IconCombine/index.js +49 -0
- package/es/OpenAI/components/Avatar.d.ts +7 -0
- package/es/OpenAI/components/Avatar.js +38 -0
- package/es/OpenAI/components/Combine.d.ts +5 -0
- package/es/OpenAI/components/Combine.js +25 -0
- package/es/OpenAI/components/Mono.d.ts +3 -0
- package/es/OpenAI/components/Mono.js +31 -0
- package/es/OpenAI/components/Text.d.ts +3 -0
- package/es/OpenAI/components/Text.js +31 -0
- package/es/OpenAI/index.d.ts +15 -0
- package/es/OpenAI/index.js +13 -0
- package/es/OpenAI/style.d.ts +5 -0
- package/es/OpenAI/style.js +5 -0
- package/es/Tongyi/components/Avatar.d.ts +5 -0
- package/es/Tongyi/components/Avatar.js +19 -0
- package/es/Tongyi/components/Color.d.ts +3 -0
- package/es/Tongyi/components/Color.js +53 -0
- package/es/Tongyi/components/Combine.d.ts +7 -0
- package/es/Tongyi/components/Combine.js +29 -0
- package/es/Tongyi/components/Mono.d.ts +3 -0
- package/es/Tongyi/components/Mono.js +31 -0
- package/es/Tongyi/components/Text.d.ts +3 -0
- package/es/Tongyi/components/Text.js +31 -0
- package/es/Tongyi/index.d.ts +16 -0
- package/es/Tongyi/index.js +14 -0
- package/es/Tongyi/style.d.ts +4 -0
- package/es/Tongyi/style.js +4 -0
- package/es/Wenxin/components/Avatar.d.ts +5 -0
- package/es/Wenxin/components/Avatar.js +19 -0
- package/es/Wenxin/components/Color.d.ts +3 -0
- package/es/Wenxin/components/Color.js +57 -0
- package/es/Wenxin/components/Combine.d.ts +7 -0
- package/es/Wenxin/components/Combine.js +25 -0
- package/es/Wenxin/components/Mono.d.ts +3 -0
- package/es/Wenxin/components/Mono.js +31 -0
- package/es/Wenxin/components/Text.d.ts +3 -0
- package/es/Wenxin/components/Text.js +31 -0
- package/es/Wenxin/index.d.ts +16 -0
- package/es/Wenxin/index.js +14 -0
- package/es/Wenxin/style.d.ts +4 -0
- package/es/Wenxin/style.js +4 -0
- package/es/Zhipu/components/Avatar.d.ts +2 -1
- package/es/Zhipu/components/Avatar.js +6 -15
- package/es/Zhipu/components/Combine.d.ts +2 -3
- package/es/Zhipu/components/Combine.js +9 -18
- package/es/Zhipu/components/Text.js +2 -1
- package/es/Zhipu/index.d.ts +15 -6
- package/es/Zhipu/index.js +13 -6
- package/es/components/ColorPreview/index.js +40 -0
- package/es/{Editor/Preview.d.ts → components/Editor/Color.d.ts} +1 -2
- package/es/components/Editor/Color.js +47 -0
- package/es/components/Editor/Mono.d.ts +8 -0
- package/es/components/Editor/Mono.js +47 -0
- package/es/components/Editor/Preview.d.ts +8 -0
- package/es/components/Editor/Preview.js +57 -0
- package/es/components/Editor/index.js +122 -0
- package/es/components/Editor/useSvgo.d.ts +6 -0
- package/es/components/Editor/useSvgo.js +51 -0
- package/es/components/IconPreview/ColorPreview.d.ts +6 -0
- package/es/{IconPreview → components/IconPreview}/ColorPreview.js +1 -2
- package/es/hooks/useFillId.d.ts +4 -0
- package/es/hooks/useFillId.js +7 -0
- package/es/index.d.ts +11 -4
- package/es/index.js +10 -5
- package/package.json +7 -9
- package/es/Editor/Preview.js +0 -93
- package/es/Editor/index.js +0 -67
- package/es/IconShowcase/index.d.ts +0 -11
- package/es/IconShowcase/index.js +0 -91
- /package/es/{IconPreview/ColorPreview.d.ts → components/ColorPreview/index.d.ts} +0 -0
- /package/es/{Editor → components/Editor}/data.d.ts +0 -0
- /package/es/{Editor → components/Editor}/data.js +0 -0
- /package/es/{Editor → components/Editor}/index.d.ts +0 -0
- /package/es/{Editor → components/Editor}/svgo.d.ts +0 -0
- /package/es/{Editor → components/Editor}/svgo.js +0 -0
- /package/es/{IconPreview → components/IconPreview}/index.d.ts +0 -0
- /package/es/{IconPreview → components/IconPreview}/index.js +0 -0
|
@@ -1,34 +1,25 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
|
-
var _excluded = ["type"
|
|
3
|
+
var _excluded = ["type"];
|
|
4
4
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
5
5
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
6
6
|
import { memo } from 'react';
|
|
7
|
-
import
|
|
7
|
+
import IconCombine from "../../IconCombine";
|
|
8
8
|
import { SPACE_MULTIPLE, TEXT_MULTIPLE } from "../style";
|
|
9
9
|
import Color from "./Color";
|
|
10
10
|
import Mono from "./Mono";
|
|
11
11
|
import Text from "./Text";
|
|
12
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
13
|
var Combine = /*#__PURE__*/memo(function (_ref) {
|
|
15
14
|
var _ref$type = _ref.type,
|
|
16
|
-
type = _ref$type === void 0 ? '
|
|
17
|
-
_ref$size = _ref.size,
|
|
18
|
-
size = _ref$size === void 0 ? 64 : _ref$size,
|
|
15
|
+
type = _ref$type === void 0 ? 'mono' : _ref$type,
|
|
19
16
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
20
17
|
var Icon = type === 'color' ? Color : Mono;
|
|
21
|
-
return /*#__PURE__*/
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
}, rest)
|
|
27
|
-
children: [/*#__PURE__*/_jsx(Icon, {
|
|
28
|
-
size: size
|
|
29
|
-
}), /*#__PURE__*/_jsx(Text, {
|
|
30
|
-
size: size * TEXT_MULTIPLE
|
|
31
|
-
})]
|
|
32
|
-
}));
|
|
18
|
+
return /*#__PURE__*/_jsx(IconCombine, _objectSpread({
|
|
19
|
+
Icon: Icon,
|
|
20
|
+
Text: Text,
|
|
21
|
+
spaceMultiple: SPACE_MULTIPLE,
|
|
22
|
+
textMultiple: TEXT_MULTIPLE
|
|
23
|
+
}, rest));
|
|
33
24
|
});
|
|
34
25
|
export default Combine;
|
package/es/Zhipu/index.d.ts
CHANGED
|
@@ -1,6 +1,15 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
export
|
|
1
|
+
import Avatar from './components/Avatar';
|
|
2
|
+
import Color from './components/Color';
|
|
3
|
+
import Combine from './components/Combine';
|
|
4
|
+
import Mono from './components/Mono';
|
|
5
|
+
import Text from './components/Text';
|
|
6
|
+
export type CompoundedIcon = typeof Mono & {
|
|
7
|
+
Avatar: typeof Avatar;
|
|
8
|
+
Color: typeof Color;
|
|
9
|
+
Combine: typeof Combine;
|
|
10
|
+
Mono: typeof Mono;
|
|
11
|
+
Text: typeof Text;
|
|
12
|
+
colorPrimary: string;
|
|
13
|
+
};
|
|
14
|
+
declare const Icons: CompoundedIcon;
|
|
15
|
+
export default Icons;
|
package/es/Zhipu/index.js
CHANGED
|
@@ -1,6 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
import Avatar from "./components/Avatar";
|
|
2
|
+
import Color from "./components/Color";
|
|
3
|
+
import Combine from "./components/Combine";
|
|
4
|
+
import Mono from "./components/Mono";
|
|
5
|
+
import Text from "./components/Text";
|
|
6
|
+
import { COLOR_PRIMARY } from "./style";
|
|
7
|
+
var Icons = Mono;
|
|
8
|
+
Icons.Color = Color;
|
|
9
|
+
Icons.Text = Text;
|
|
10
|
+
Icons.Combine = Combine;
|
|
11
|
+
Icons.Avatar = Avatar;
|
|
12
|
+
Icons.colorPrimary = COLOR_PRIMARY;
|
|
13
|
+
export default Icons;
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
|
+
var _templateObject, _templateObject2;
|
|
3
|
+
import { CopyButton } from '@lobehub/ui';
|
|
4
|
+
import { createStyles } from 'antd-style';
|
|
5
|
+
import { memo } from 'react';
|
|
6
|
+
import { Flexbox } from 'react-layout-kit';
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
|
+
var useStyles = createStyles(function (_ref) {
|
|
10
|
+
var css = _ref.css,
|
|
11
|
+
token = _ref.token,
|
|
12
|
+
cx = _ref.cx;
|
|
13
|
+
return {
|
|
14
|
+
btn: cx('copy-button', css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: absolute;\n top: 4px;\n right: 4px;\n opacity: 0;\n "])))),
|
|
15
|
+
container: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n position: relative;\n\n flex: none;\n\n min-width: 98px;\n height: 98px;\n padding-inline: 16px;\n\n font-family: ", ";\n line-height: 1;\n\n background: ", ";\n border: 1px solid ", ";\n border-radius: ", "px;\n\n &:hover {\n .copy-button {\n opacity: 1;\n }\n }\n "])), token.fontFamilyCode, token.colorBgContainer, token.colorBorder, token.borderRadius)
|
|
16
|
+
};
|
|
17
|
+
});
|
|
18
|
+
var IconPreview = /*#__PURE__*/memo(function (_ref2) {
|
|
19
|
+
var color = _ref2.color;
|
|
20
|
+
var _useStyles = useStyles(),
|
|
21
|
+
styles = _useStyles.styles;
|
|
22
|
+
return /*#__PURE__*/_jsxs(Flexbox, {
|
|
23
|
+
align: 'center',
|
|
24
|
+
className: styles.container,
|
|
25
|
+
justify: 'center',
|
|
26
|
+
style: {
|
|
27
|
+
background: color
|
|
28
|
+
},
|
|
29
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
30
|
+
style: {
|
|
31
|
+
color: '#fff'
|
|
32
|
+
},
|
|
33
|
+
children: color
|
|
34
|
+
}), /*#__PURE__*/_jsx(CopyButton, {
|
|
35
|
+
className: styles.btn,
|
|
36
|
+
content: color
|
|
37
|
+
})]
|
|
38
|
+
});
|
|
39
|
+
});
|
|
40
|
+
export default IconPreview;
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { type SvgoConfig } from './svgo';
|
|
3
2
|
interface PreviewProps {
|
|
4
|
-
config?: SvgoConfig;
|
|
5
3
|
svg: string;
|
|
6
4
|
title: string;
|
|
5
|
+
viewbox: string;
|
|
7
6
|
}
|
|
8
7
|
declare const Preview: import("react").NamedExoticComponent<PreviewProps>;
|
|
9
8
|
export default Preview;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
|
+
var _templateObject;
|
|
3
|
+
import { Highlighter } from '@lobehub/ui';
|
|
4
|
+
import { createStyles } from 'antd-style';
|
|
5
|
+
import { memo } from 'react';
|
|
6
|
+
import { Flexbox } from 'react-layout-kit';
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
|
+
var useStyles = createStyles(function (_ref) {
|
|
10
|
+
var css = _ref.css;
|
|
11
|
+
return {
|
|
12
|
+
code: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n pre {\n padding: 8px !important;\n }\n\n code {\n font-size: 12px;\n text-wrap: initial;\n }\n "])))
|
|
13
|
+
};
|
|
14
|
+
});
|
|
15
|
+
var Preview = /*#__PURE__*/memo(function (_ref2) {
|
|
16
|
+
var svg = _ref2.svg,
|
|
17
|
+
title = _ref2.title,
|
|
18
|
+
viewbox = _ref2.viewbox;
|
|
19
|
+
var _useStyles = useStyles(),
|
|
20
|
+
styles = _useStyles.styles;
|
|
21
|
+
return /*#__PURE__*/_jsxs(Flexbox, {
|
|
22
|
+
flex: 'none',
|
|
23
|
+
gap: 16,
|
|
24
|
+
style: {
|
|
25
|
+
position: 'relative',
|
|
26
|
+
width: '100%'
|
|
27
|
+
},
|
|
28
|
+
children: [/*#__PURE__*/_jsx(Flexbox, {
|
|
29
|
+
align: 'center',
|
|
30
|
+
gap: 8,
|
|
31
|
+
horizontal: true,
|
|
32
|
+
children: /*#__PURE__*/_jsx("h2", {
|
|
33
|
+
style: {
|
|
34
|
+
lineHeight: 1,
|
|
35
|
+
margin: 0
|
|
36
|
+
},
|
|
37
|
+
children: title
|
|
38
|
+
})
|
|
39
|
+
}), /*#__PURE__*/_jsx(Highlighter, {
|
|
40
|
+
className: styles.code,
|
|
41
|
+
language: 'tsx',
|
|
42
|
+
type: 'ghost',
|
|
43
|
+
children: "import { forwardRef } from 'react';\nimport type { IconType } from '@/types';\n\nconst Icon: IconType = forwardRef(({ size = '1em', style, ...rest }, ref) => {\n return (\n <svg\n height={size}\n ref={ref}\n style={{ flex: 'none', lineHeight: 1, ...style }}\n viewBox=\"".concat(viewbox, "\"\n width={size}\n xmlns=\"http://www.w3.org/2000/svg\"\n {...rest}\n >\n ").concat(svg, "\n </svg>\n );\n});\n\nexport default Icon;\n")
|
|
44
|
+
})]
|
|
45
|
+
});
|
|
46
|
+
});
|
|
47
|
+
export default Preview;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
|
+
var _templateObject;
|
|
3
|
+
import { Highlighter } from '@lobehub/ui';
|
|
4
|
+
import { createStyles } from 'antd-style';
|
|
5
|
+
import { memo } from 'react';
|
|
6
|
+
import { Flexbox } from 'react-layout-kit';
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
|
+
var useStyles = createStyles(function (_ref) {
|
|
10
|
+
var css = _ref.css;
|
|
11
|
+
return {
|
|
12
|
+
code: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n pre {\n padding: 8px !important;\n }\n\n code {\n font-size: 12px;\n text-wrap: initial;\n }\n "])))
|
|
13
|
+
};
|
|
14
|
+
});
|
|
15
|
+
var Preview = /*#__PURE__*/memo(function (_ref2) {
|
|
16
|
+
var svg = _ref2.svg,
|
|
17
|
+
title = _ref2.title,
|
|
18
|
+
viewbox = _ref2.viewbox;
|
|
19
|
+
var _useStyles = useStyles(),
|
|
20
|
+
styles = _useStyles.styles;
|
|
21
|
+
return /*#__PURE__*/_jsxs(Flexbox, {
|
|
22
|
+
flex: 'none',
|
|
23
|
+
gap: 16,
|
|
24
|
+
style: {
|
|
25
|
+
position: 'relative',
|
|
26
|
+
width: '100%'
|
|
27
|
+
},
|
|
28
|
+
children: [/*#__PURE__*/_jsx(Flexbox, {
|
|
29
|
+
align: 'center',
|
|
30
|
+
gap: 8,
|
|
31
|
+
horizontal: true,
|
|
32
|
+
children: /*#__PURE__*/_jsx("h2", {
|
|
33
|
+
style: {
|
|
34
|
+
lineHeight: 1,
|
|
35
|
+
margin: 0
|
|
36
|
+
},
|
|
37
|
+
children: title
|
|
38
|
+
})
|
|
39
|
+
}), /*#__PURE__*/_jsx(Highlighter, {
|
|
40
|
+
className: styles.code,
|
|
41
|
+
language: 'tsx',
|
|
42
|
+
type: 'ghost',
|
|
43
|
+
children: "import { forwardRef } from 'react';\nimport type { IconType } from '@/types';\n\nconst Icon: IconType = forwardRef(({ size = '1em', style, ...rest }, ref) => {\n return (\n <svg\n fill=\"currentColor\"\n fillRule=\"evenodd\"\n height={size}\n ref={ref}\n style={{ flex: 'none', lineHeight: 1, ...style }}\n viewBox=\"".concat(viewbox, "\"\n width={size}\n xmlns=\"http://www.w3.org/2000/svg\"\n {...rest}\n >\n ").concat(svg, "\n </svg>\n );\n});\n\nexport default Icon;\n")
|
|
44
|
+
})]
|
|
45
|
+
});
|
|
46
|
+
});
|
|
47
|
+
export default Preview;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
interface PreviewProps {
|
|
3
|
+
precent?: string;
|
|
4
|
+
svg: string;
|
|
5
|
+
title: string;
|
|
6
|
+
}
|
|
7
|
+
declare const Preview: import("react").ForwardRefExoticComponent<PreviewProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
8
|
+
export default Preview;
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
2
|
+
var _templateObject;
|
|
3
|
+
import { Highlighter, Tag } from '@lobehub/ui';
|
|
4
|
+
import { createStyles } from 'antd-style';
|
|
5
|
+
import { forwardRef } from 'react';
|
|
6
|
+
import { Flexbox } from 'react-layout-kit';
|
|
7
|
+
import IconPreview from "../IconPreview";
|
|
8
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
10
|
+
var useStyles = createStyles(function (_ref) {
|
|
11
|
+
var css = _ref.css;
|
|
12
|
+
return {
|
|
13
|
+
code: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n flex: 1;\n height: 96px;\n\n pre {\n padding: 8px !important;\n }\n\n code {\n font-size: 12px;\n text-wrap: initial;\n }\n "])))
|
|
14
|
+
};
|
|
15
|
+
});
|
|
16
|
+
var Preview = /*#__PURE__*/forwardRef(function (_ref2, ref) {
|
|
17
|
+
var svg = _ref2.svg,
|
|
18
|
+
title = _ref2.title,
|
|
19
|
+
precent = _ref2.precent;
|
|
20
|
+
var _useStyles = useStyles(),
|
|
21
|
+
styles = _useStyles.styles;
|
|
22
|
+
return /*#__PURE__*/_jsxs(Flexbox, {
|
|
23
|
+
flex: 'none',
|
|
24
|
+
gap: 16,
|
|
25
|
+
style: {
|
|
26
|
+
position: 'relative',
|
|
27
|
+
width: '100%'
|
|
28
|
+
},
|
|
29
|
+
children: [/*#__PURE__*/_jsxs(Flexbox, {
|
|
30
|
+
align: 'center',
|
|
31
|
+
gap: 8,
|
|
32
|
+
horizontal: true,
|
|
33
|
+
children: [/*#__PURE__*/_jsx("h2", {
|
|
34
|
+
style: {
|
|
35
|
+
lineHeight: 1,
|
|
36
|
+
margin: 0
|
|
37
|
+
},
|
|
38
|
+
children: title
|
|
39
|
+
}), precent && /*#__PURE__*/_jsx(Tag, {
|
|
40
|
+
children: precent
|
|
41
|
+
})]
|
|
42
|
+
}), /*#__PURE__*/_jsxs(Flexbox, {
|
|
43
|
+
gap: 8,
|
|
44
|
+
horizontal: true,
|
|
45
|
+
ref: ref,
|
|
46
|
+
children: [/*#__PURE__*/_jsx(IconPreview, {
|
|
47
|
+
children: svg
|
|
48
|
+
}), /*#__PURE__*/_jsx(Highlighter, {
|
|
49
|
+
className: styles.code,
|
|
50
|
+
language: 'tsx',
|
|
51
|
+
type: 'ghost',
|
|
52
|
+
children: svg
|
|
53
|
+
})]
|
|
54
|
+
})]
|
|
55
|
+
});
|
|
56
|
+
});
|
|
57
|
+
export default Preview;
|
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
3
|
+
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
4
|
+
var _templateObject;
|
|
5
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
6
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
7
|
+
import { StoryBook, useControls, useCreateStore } from '@lobehub/ui';
|
|
8
|
+
import { createStyles } from 'antd-style';
|
|
9
|
+
import { useEffect, useRef, useState } from 'react';
|
|
10
|
+
import { Flexbox } from 'react-layout-kit';
|
|
11
|
+
import { useSvgo } from "./useSvgo";
|
|
12
|
+
import Color from "./Color";
|
|
13
|
+
import Mono from "./Mono";
|
|
14
|
+
import Preview from "./Preview";
|
|
15
|
+
import { svgIcon } from "./data";
|
|
16
|
+
import { defaultPlugins } from "./svgo";
|
|
17
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
18
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
19
|
+
var useStyles = createStyles(function (_ref) {
|
|
20
|
+
var css = _ref.css,
|
|
21
|
+
token = _ref.token;
|
|
22
|
+
return {
|
|
23
|
+
container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n border: 1px solid ", ";\n border-radius: ", "px;\n "])), token.colorBorder, token.borderRadius)
|
|
24
|
+
};
|
|
25
|
+
});
|
|
26
|
+
export default (function () {
|
|
27
|
+
var colorRef = useRef(null);
|
|
28
|
+
var monoRef = useRef(null);
|
|
29
|
+
var _useState = useState('0 0 24 24'),
|
|
30
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
31
|
+
viewbox = _useState2[0],
|
|
32
|
+
setViewbox = _useState2[1];
|
|
33
|
+
var _useState3 = useState(''),
|
|
34
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
35
|
+
colorSvg = _useState4[0],
|
|
36
|
+
setColorSvg = _useState4[1];
|
|
37
|
+
var _useState5 = useState(''),
|
|
38
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
39
|
+
monoSvg = _useState6[0],
|
|
40
|
+
setMonoSvg = _useState6[1];
|
|
41
|
+
var _useStyles = useStyles(),
|
|
42
|
+
styles = _useStyles.styles;
|
|
43
|
+
var levaStore = useCreateStore();
|
|
44
|
+
var _useControls = useControls({
|
|
45
|
+
svg: {
|
|
46
|
+
rows: true,
|
|
47
|
+
value: svgIcon
|
|
48
|
+
}
|
|
49
|
+
}, {
|
|
50
|
+
store: levaStore
|
|
51
|
+
}),
|
|
52
|
+
svg = _useControls.svg;
|
|
53
|
+
var config = useControls('Config', defaultPlugins, {
|
|
54
|
+
collapsed: true
|
|
55
|
+
}, {
|
|
56
|
+
store: levaStore
|
|
57
|
+
});
|
|
58
|
+
var removeColor = {
|
|
59
|
+
addAttributesToSVGElement: {
|
|
60
|
+
attribute: {
|
|
61
|
+
'fill': 'currentColor',
|
|
62
|
+
'fill-rule': 'evenodd'
|
|
63
|
+
}
|
|
64
|
+
},
|
|
65
|
+
collapseGroups: true,
|
|
66
|
+
removeAttrs: {
|
|
67
|
+
attrs: ['fill', 'color', 'stroke', 'stroke-width', 'fill-rule']
|
|
68
|
+
}
|
|
69
|
+
};
|
|
70
|
+
var compression = useSvgo(svg, config);
|
|
71
|
+
var mono = useSvgo(svg, _objectSpread(_objectSpread({}, config), removeColor));
|
|
72
|
+
useEffect(function () {
|
|
73
|
+
var _monoRef$current;
|
|
74
|
+
if (mono.isLoading) return setMonoSvg('loading...');
|
|
75
|
+
setMonoSvg((monoRef === null || monoRef === void 0 || (_monoRef$current = monoRef.current) === null || _monoRef$current === void 0 || (_monoRef$current = _monoRef$current.querySelector('svg')) === null || _monoRef$current === void 0 ? void 0 : _monoRef$current.innerHTML) || '');
|
|
76
|
+
}, [mono]);
|
|
77
|
+
useEffect(function () {
|
|
78
|
+
var _colorRef$current, _colorRef$current2;
|
|
79
|
+
if (compression.isLoading) return setColorSvg('loading...');
|
|
80
|
+
setColorSvg((colorRef === null || colorRef === void 0 || (_colorRef$current = colorRef.current) === null || _colorRef$current === void 0 || (_colorRef$current = _colorRef$current.querySelector('svg')) === null || _colorRef$current === void 0 ? void 0 : _colorRef$current.innerHTML) || '');
|
|
81
|
+
var viewBox = colorRef === null || colorRef === void 0 || (_colorRef$current2 = colorRef.current) === null || _colorRef$current2 === void 0 || (_colorRef$current2 = _colorRef$current2.querySelector('svg')) === null || _colorRef$current2 === void 0 ? void 0 : _colorRef$current2.viewBox.baseVal;
|
|
82
|
+
if (viewBox) {
|
|
83
|
+
setViewbox("".concat(viewBox.x, " ").concat(viewBox.y, " ").concat(viewBox.width, " ").concat(viewBox.height));
|
|
84
|
+
}
|
|
85
|
+
}, [compression]);
|
|
86
|
+
return /*#__PURE__*/_jsx(StoryBook, {
|
|
87
|
+
className: styles.container,
|
|
88
|
+
levaStore: levaStore,
|
|
89
|
+
style: {
|
|
90
|
+
position: 'relative'
|
|
91
|
+
},
|
|
92
|
+
children: /*#__PURE__*/_jsxs(Flexbox, {
|
|
93
|
+
gap: 32,
|
|
94
|
+
style: {
|
|
95
|
+
overflow: 'hidden',
|
|
96
|
+
width: '100%'
|
|
97
|
+
},
|
|
98
|
+
children: [/*#__PURE__*/_jsx(Preview, {
|
|
99
|
+
svg: svg,
|
|
100
|
+
title: 'Original'
|
|
101
|
+
}), /*#__PURE__*/_jsx(Preview, {
|
|
102
|
+
precent: compression.precent,
|
|
103
|
+
ref: colorRef,
|
|
104
|
+
svg: compression.svg,
|
|
105
|
+
title: 'Compression'
|
|
106
|
+
}), /*#__PURE__*/_jsx(Preview, {
|
|
107
|
+
precent: mono.precent,
|
|
108
|
+
ref: monoRef,
|
|
109
|
+
svg: mono.svg,
|
|
110
|
+
title: 'Monochrome'
|
|
111
|
+
}), /*#__PURE__*/_jsx(Mono, {
|
|
112
|
+
svg: monoSvg,
|
|
113
|
+
title: 'Mono',
|
|
114
|
+
viewbox: viewbox
|
|
115
|
+
}), /*#__PURE__*/_jsx(Color, {
|
|
116
|
+
svg: colorSvg,
|
|
117
|
+
title: 'Color',
|
|
118
|
+
viewbox: viewbox
|
|
119
|
+
})]
|
|
120
|
+
})
|
|
121
|
+
});
|
|
122
|
+
});
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
3
|
+
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
4
|
+
import { useCallback, useEffect, useRef, useState } from 'react';
|
|
5
|
+
import SvgoClient from "./svgo";
|
|
6
|
+
export var useSvgo = function useSvgo(svg, config) {
|
|
7
|
+
var svgoInstance = useRef();
|
|
8
|
+
var _useState = useState(true),
|
|
9
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
10
|
+
isLoading = _useState2[0],
|
|
11
|
+
setIsLoading = _useState2[1];
|
|
12
|
+
var _useState3 = useState(svg),
|
|
13
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
14
|
+
newSvg = _useState4[0],
|
|
15
|
+
setNewSvg = _useState4[1];
|
|
16
|
+
var compressionSvg = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
|
|
17
|
+
var data;
|
|
18
|
+
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
19
|
+
while (1) switch (_context.prev = _context.next) {
|
|
20
|
+
case 0:
|
|
21
|
+
if (svgoInstance.current) {
|
|
22
|
+
_context.next = 2;
|
|
23
|
+
break;
|
|
24
|
+
}
|
|
25
|
+
return _context.abrupt("return");
|
|
26
|
+
case 2:
|
|
27
|
+
_context.next = 4;
|
|
28
|
+
return svgoInstance.current.optimize(svg);
|
|
29
|
+
case 4:
|
|
30
|
+
data = _context.sent;
|
|
31
|
+
setNewSvg(data);
|
|
32
|
+
setIsLoading(false);
|
|
33
|
+
case 7:
|
|
34
|
+
case "end":
|
|
35
|
+
return _context.stop();
|
|
36
|
+
}
|
|
37
|
+
}, _callee);
|
|
38
|
+
})), [svg]);
|
|
39
|
+
useEffect(function () {
|
|
40
|
+
svgoInstance.current = new SvgoClient(config);
|
|
41
|
+
}, [config]);
|
|
42
|
+
useEffect(function () {
|
|
43
|
+
setIsLoading(false);
|
|
44
|
+
compressionSvg();
|
|
45
|
+
}, [config, svg]);
|
|
46
|
+
return {
|
|
47
|
+
isLoading: isLoading,
|
|
48
|
+
precent: "".concat(-Math.floor((1 - newSvg.length / svg.length) * 100), "%"),
|
|
49
|
+
svg: newSvg
|
|
50
|
+
};
|
|
51
|
+
};
|
|
@@ -2,7 +2,6 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLit
|
|
|
2
2
|
var _templateObject, _templateObject2;
|
|
3
3
|
import { CopyButton } from '@lobehub/ui';
|
|
4
4
|
import { createStyles } from 'antd-style';
|
|
5
|
-
import { readableColor } from 'polished';
|
|
6
5
|
import { memo } from 'react';
|
|
7
6
|
import { Flexbox } from 'react-layout-kit';
|
|
8
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -29,7 +28,7 @@ var IconPreview = /*#__PURE__*/memo(function (_ref2) {
|
|
|
29
28
|
},
|
|
30
29
|
children: [/*#__PURE__*/_jsx("div", {
|
|
31
30
|
style: {
|
|
32
|
-
color:
|
|
31
|
+
color: '#fff'
|
|
33
32
|
},
|
|
34
33
|
children: color
|
|
35
34
|
}), /*#__PURE__*/_jsx(CopyButton, {
|
package/es/index.d.ts
CHANGED
|
@@ -1,4 +1,11 @@
|
|
|
1
|
-
export { default as
|
|
2
|
-
export { default as
|
|
3
|
-
export { default as
|
|
4
|
-
export
|
|
1
|
+
export { default as Anthropic, type CompoundedIcon as AnthropicProps } from './Anthropic';
|
|
2
|
+
export { default as ChatGLM, type CompoundedIcon as ChatGLMProps } from './ChatGLM';
|
|
3
|
+
export { default as Dalle, type CompoundedIcon as DalleProps } from './Dalle';
|
|
4
|
+
export { default as Gemini, type CompoundedIcon as GeminiProps } from './Gemini';
|
|
5
|
+
export { default as IconAvatar, type IconAvatarProps } from './IconAvatar';
|
|
6
|
+
export { default as IconCombine, type IconCombineProps } from './IconCombine';
|
|
7
|
+
export { default as OpenAI, type CompoundedIcon as OpenAIProps } from './OpenAI';
|
|
8
|
+
export { default as Tongyi, type CompoundedIcon as TongyiProps } from './Tongyi';
|
|
9
|
+
export type { IconType } from './types';
|
|
10
|
+
export { default as Wenxin, type CompoundedIcon as WenxinProps } from './Wenxin';
|
|
11
|
+
export { default as Zhipu, type CompoundedIcon as ZhipuProps } from './Zhipu';
|
package/es/index.js
CHANGED
|
@@ -1,5 +1,10 @@
|
|
|
1
|
-
export { default as
|
|
2
|
-
export { default as
|
|
3
|
-
export { default as
|
|
4
|
-
|
|
5
|
-
export {
|
|
1
|
+
export { default as Anthropic } from "./Anthropic";
|
|
2
|
+
export { default as ChatGLM } from "./ChatGLM";
|
|
3
|
+
export { default as Dalle } from "./Dalle";
|
|
4
|
+
export { default as Gemini } from "./Gemini";
|
|
5
|
+
export { default as IconAvatar } from "./IconAvatar";
|
|
6
|
+
export { default as IconCombine } from "./IconCombine";
|
|
7
|
+
export { default as OpenAI } from "./OpenAI";
|
|
8
|
+
export { default as Tongyi } from "./Tongyi";
|
|
9
|
+
export { default as Wenxin } from "./Wenxin";
|
|
10
|
+
export { default as Zhipu } from "./Zhipu";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lobehub/icons",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.2.0",
|
|
4
4
|
"description": "Popular LLM model brand svg logo and icon collection",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"lobehub",
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
"lint:md": "remark . --quiet --frail --output",
|
|
41
41
|
"lint:style": "stylelint \"{src,tests}/**/*.{js,jsx,ts,tsx}\" --fix",
|
|
42
42
|
"prepare": "husky install && npm run setup",
|
|
43
|
-
"prepublishOnly": "
|
|
43
|
+
"prepublishOnly": "npm run build",
|
|
44
44
|
"prettier": "prettier -c --write --no-error-on-unmatched-pattern \"**/**\"",
|
|
45
45
|
"pull": "git pull",
|
|
46
46
|
"release": "semantic-release",
|
|
@@ -72,14 +72,12 @@
|
|
|
72
72
|
},
|
|
73
73
|
"dependencies": {
|
|
74
74
|
"@babel/runtime": "^7",
|
|
75
|
-
"
|
|
76
|
-
"polished": "^4",
|
|
77
|
-
"react-layout-kit": "^1",
|
|
78
|
-
"svgo-browser": "^1"
|
|
75
|
+
"react-layout-kit": "^1"
|
|
79
76
|
},
|
|
80
77
|
"devDependencies": {
|
|
81
78
|
"@commitlint/cli": "^18",
|
|
82
79
|
"@lobehub/lint": "latest",
|
|
80
|
+
"@lobehub/ui": "^1",
|
|
83
81
|
"@testing-library/react": "^14",
|
|
84
82
|
"@types/pangu": "^4",
|
|
85
83
|
"@types/query-string": "^6",
|
|
@@ -105,15 +103,15 @@
|
|
|
105
103
|
"remark-cli": "^11",
|
|
106
104
|
"semantic-release": "^21",
|
|
107
105
|
"stylelint": "^15",
|
|
106
|
+
"svgo-browser": "^1",
|
|
108
107
|
"typescript": "^5",
|
|
109
108
|
"vitest": "latest"
|
|
110
109
|
},
|
|
111
110
|
"peerDependencies": {
|
|
112
|
-
"@lobehub/ui": ">=1",
|
|
113
|
-
"antd-style": ">=3",
|
|
114
111
|
"polished": ">=4",
|
|
115
112
|
"react": ">=18",
|
|
116
|
-
"react-dom": ">=18"
|
|
113
|
+
"react-dom": ">=18",
|
|
114
|
+
"react-layout-kit": ">=1"
|
|
117
115
|
},
|
|
118
116
|
"publishConfig": {
|
|
119
117
|
"access": "public",
|