@lobehub/ui 1.102.0 → 1.103.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.
Files changed (7) hide show
  1. package/es/ConfigProvider/index.d.ts +1 -1
  2. package/es/ConfigProvider/index.js +1 -1
  3. package/es/FluentEmoji/index.js +2 -3
  4. package/es/Logo/index.js +14 -20
  5. package/es/SelectWithImg/index.js +4 -3
  6. package/es/SelectWithImg/styles.js +2 -2
  7. package/package.json +1 -1
package/es/ConfigProvider/index.d.ts CHANGED
@@ -4,7 +4,7 @@ type CdnFn = ({ pkg, version, path }: CdnApi) => string;
4
4
  export interface Config {
5
5
  customCdnFn?: CdnFn;
6
6
  imgAs?: ElementType;
7
- proxy: CDN | 'custom';
7
+ proxy?: CDN | 'custom';
8
8
  }
9
9
  export declare const ConfigContext: import("react").Context<Config | null>;
10
10
  declare const ConfigProvider: import("react").NamedExoticComponent<{
package/es/ConfigProvider/index.js CHANGED
@@ -24,7 +24,7 @@ var fallback = function fallback(_ref2) {
24
24
  export var useCdnFn = function useCdnFn() {
25
25
  var config = useContext(ConfigContext);
26
26
  if (!config) return fallback;
27
- if (config.proxy !== 'custom') return function (_ref3) {
27
+ if ((config === null || config === void 0 ? void 0 : config.proxy) !== 'custom') return function (_ref3) {
28
28
  var pkg = _ref3.pkg,
29
29
  version = _ref3.version,
30
30
  path = _ref3.path;
package/es/FluentEmoji/index.js CHANGED
@@ -75,13 +75,12 @@ var FluentEmoji = /*#__PURE__*/memo(function (_ref) {
75
75
  }, style),
76
76
  children: /*#__PURE__*/_jsx(Img, {
77
77
  alt: emoji,
78
- height: "100%",
79
- loading: "lazy",
78
+ height: size,
80
79
  onError: function onError() {
81
80
  return setLoadingFail(true);
82
81
  },
83
82
  src: emojiUrl,
84
- width: "100%"
83
+ width: size
85
84
  })
86
85
  });
87
86
  });
package/es/Logo/index.js CHANGED
@@ -34,11 +34,10 @@ var Logo = /*#__PURE__*/memo(function (_ref) {
34
34
  {
35
35
  logoComponent = /*#__PURE__*/_jsx(Img, _objectSpread({
36
36
  alt: "lobehub",
37
+ height: size,
37
38
  src: genCdnUrl(LOGO_3D),
38
- style: _objectSpread({
39
- height: size,
40
- width: size
41
- }, style)
39
+ style: style,
40
+ width: size
42
41
  }, props));
43
42
  break;
44
43
  }
@@ -46,21 +45,19 @@ var Logo = /*#__PURE__*/memo(function (_ref) {
46
45
  {
47
46
  logoComponent = /*#__PURE__*/_jsx(Img, {
48
47
  alt: "lobehub",
48
+ height: size,
49
49
  src: genCdnUrl(LOGO_FLAT),
50
- style: _objectSpread({
51
- height: size,
52
- width: size
53
- }, style)
50
+ style: style,
51
+ width: size
54
52
  });
55
53
  break;
56
54
  }
57
55
  case 'high-contrast':
58
56
  {
59
57
  logoComponent = /*#__PURE__*/_jsx(LogoHighContrast, _objectSpread({
60
- style: _objectSpread({
61
- height: size,
62
- width: size
63
- }, style)
58
+ height: size,
59
+ style: style,
60
+ width: size
64
61
  }, props));
65
62
  break;
66
63
  }
@@ -68,10 +65,9 @@ var Logo = /*#__PURE__*/memo(function (_ref) {
68
65
  {
69
66
  logoComponent = /*#__PURE__*/_jsx(LogoText, _objectSpread({
70
67
  className: className,
71
- style: _objectSpread({
72
- height: size,
73
- width: 'auto'
74
- }, style)
68
+ height: size,
69
+ style: style,
70
+ width: size * 2.9375
75
71
  }, props));
76
72
  break;
77
73
  }
@@ -80,11 +76,9 @@ var Logo = /*#__PURE__*/memo(function (_ref) {
80
76
  logoComponent = /*#__PURE__*/_jsxs(_Fragment, {
81
77
  children: [/*#__PURE__*/_jsx(Img, {
82
78
  alt: "lobehub",
79
+ height: size,
83
80
  src: genCdnUrl(LOGO_3D),
84
- style: {
85
- height: size,
86
- width: size
87
- }
81
+ width: size
88
82
  }), /*#__PURE__*/_jsx(LogoText, {
89
83
  style: {
90
84
  height: size,
package/es/SelectWithImg/index.js CHANGED
@@ -6,6 +6,7 @@ import { Icon } from "./..";
6
6
  import { memo } from 'react';
7
7
  import { Flexbox } from 'react-layout-kit';
8
8
  import useControlledState from 'use-merge-value';
9
+ import Img from "../Img";
9
10
  import { useStyles } from "./styles";
10
11
  import { jsx as _jsx } from "react/jsx-runtime";
11
12
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -57,11 +58,11 @@ var SelectWithImg = /*#__PURE__*/memo(function (_ref) {
57
58
  }),
58
59
  children: /*#__PURE__*/_jsx("div", {
59
60
  className: styles.img,
60
- style: {
61
- backgroundImage: "url(".concat(item.img, ")"),
61
+ children: /*#__PURE__*/_jsx(Img, {
62
62
  height: height,
63
+ src: item.img,
63
64
  width: width
64
- }
65
+ })
65
66
  })
66
67
  }), /*#__PURE__*/_jsxs(Flexbox, {
67
68
  align: 'center',
package/es/SelectWithImg/styles.js CHANGED
@@ -6,12 +6,12 @@ export var useStyles = createStyles(function (_ref) {
6
6
  token = _ref.token,
7
7
  cx = _ref.cx;
8
8
  var hover = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n &:hover {\n border-color: ", ";\n box-shadow: 0 0 0 2px ", ";\n }\n "])), token.colorText, token.colorText);
9
- var img = cx(css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n background-repeat: no-repeat;\n background-position: center center;\n background-size: cover;\n border-radius: ", "px;\n box-shadow: inset 0 0 0 2px ", ";\n\n transition: all 100ms ", ";\n "])), token.borderRadius, token.colorSplit, token.motionEaseOut), hover);
9
+ var img = cx(css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n position: relative;\n overflow: hidden;\n border-radius: ", "px;\n transition: all 100ms ", ";\n\n &::before {\n content: '';\n\n position: absolute;\n inset: 0;\n\n display: block;\n\n width: 100%;\n height: 100%;\n\n border-radius: inherit;\n box-shadow: inset 0 0 0 2px ", ";\n }\n "])), token.borderRadius, token.motionEaseOut, token.colorSplit), hover);
10
10
  return {
11
11
  active: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n color: ", ";\n "])), token.colorText),
12
12
  container: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n cursor: pointer;\n color: ", ";\n "])), token.colorTextDescription),
13
13
  img: img,
14
- imgActive: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n box-shadow: 0 0 0 2px ", ";\n\n .", " {\n box-shadow: none;\n }\n "])), token.colorTextTertiary, img),
14
+ imgActive: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n box-shadow: 0 0 0 2px ", ";\n\n .", ":before {\n box-shadow: none;\n }\n "])), token.colorTextTertiary, img),
15
15
  imgCtn: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n background: ", ";\n border-radius: ", "px;\n\n ", "\n "])), token.colorFillTertiary, token.borderRadius, hover)
16
16
  };
17
17
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lobehub/ui",
3
- "version": "1.102.0",
3
+ "version": "1.103.0",
4
4
  "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
5
5
  "keywords": [
6
6
  "lobehub",