@ttoss/ui 1.31.0 → 1.31.1

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/dist/esm/index.js CHANGED
@@ -59,17 +59,7 @@ var Icon = React2.forwardRef(
59
59
  Icon.displayName = "Icon";
60
60
 
61
61
  // src/components/Button.tsx
62
- import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
63
- var RenderIcon = ({ icon }) => {
64
- if (!icon) {
65
- return null;
66
- }
67
- if (typeof icon === "string") {
68
- return /* @__PURE__ */ jsx3(Fragment2, { children: /* @__PURE__ */ jsx3(Icon, { icon }) });
69
- }
70
- return /* @__PURE__ */ jsx3(Fragment2, { children: icon });
71
- };
72
- var MemoizedRenderIcon = React3.memo(RenderIcon);
62
+ import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
73
63
  var Button = React3.forwardRef(
74
64
  (props, ref) => {
75
65
  const { children, leftIcon, rightIcon, ...restProps } = props;
@@ -77,6 +67,7 @@ var Button = React3.forwardRef(
77
67
  ButtonUi,
78
68
  {
79
69
  ref,
70
+ type: "button",
80
71
  ...restProps,
81
72
  sx: {
82
73
  cursor: "pointer",
@@ -88,9 +79,9 @@ var Button = React3.forwardRef(
88
79
  ...restProps.sx
89
80
  },
90
81
  children: [
91
- /* @__PURE__ */ jsx3(MemoizedRenderIcon, { icon: leftIcon }),
82
+ leftIcon && /* @__PURE__ */ jsx3(Icon, { inline: true, icon: leftIcon }),
92
83
  children,
93
- /* @__PURE__ */ jsx3(MemoizedRenderIcon, { icon: rightIcon })
84
+ rightIcon && /* @__PURE__ */ jsx3(Icon, { inline: true, icon: rightIcon })
94
85
  ]
95
86
  }
96
87
  );
package/dist/index.d.ts CHANGED
@@ -19,9 +19,13 @@ declare const ThemeProvider: ({ children, theme, fonts, }: ThemeProviderProps) =
19
19
 
20
20
  declare const useTheme: () => theme_ui.ThemeUIContextValue;
21
21
 
22
+ type IconType = string | IconifyIcon;
23
+ type IconProps = Omit<IconifyIconProps, 'ref'>;
24
+ declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<IconifyIconHTMLElement | null>>;
25
+
22
26
  type ButtonProps = ButtonProps$1 & {
23
- leftIcon?: React.ReactNode | string;
24
- rightIcon?: React.ReactNode | string;
27
+ leftIcon?: IconType;
28
+ rightIcon?: IconType;
25
29
  };
26
30
  declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
27
31
 
@@ -31,10 +35,6 @@ type InputProps = InputProps$1 & {
31
35
  };
32
36
  declare const Input: React__default.ForwardRefExoticComponent<Omit<InputProps, "ref"> & React__default.RefAttributes<HTMLInputElement>>;
33
37
 
34
- type IconType = string | IconifyIcon;
35
- type IconProps = Omit<IconifyIconProps, 'ref'>;
36
- declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<IconifyIconHTMLElement | null>>;
37
-
38
38
  declare const InfiniteLinearProgress: () => JSX.Element;
39
39
 
40
40
  export { Button, ButtonProps, Icon, IconProps, IconType, InfiniteLinearProgress, Input, InputProps, ThemeProvider, ThemeProviderProps, useTheme };
package/dist/index.js CHANGED
@@ -117,16 +117,6 @@ Icon.displayName = "Icon";
117
117
 
118
118
  // src/components/Button.tsx
119
119
  var import_jsx_runtime3 = require("react/jsx-runtime");
120
- var RenderIcon = ({ icon }) => {
121
- if (!icon) {
122
- return null;
123
- }
124
- if (typeof icon === "string") {
125
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon, { icon }) });
126
- }
127
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: icon });
128
- };
129
- var MemoizedRenderIcon = React3.memo(RenderIcon);
130
120
  var Button = React3.forwardRef(
131
121
  (props, ref) => {
132
122
  const { children, leftIcon, rightIcon, ...restProps } = props;
@@ -134,6 +124,7 @@ var Button = React3.forwardRef(
134
124
  import_theme_ui5.Button,
135
125
  {
136
126
  ref,
127
+ type: "button",
137
128
  ...restProps,
138
129
  sx: {
139
130
  cursor: "pointer",
@@ -145,9 +136,9 @@ var Button = React3.forwardRef(
145
136
  ...restProps.sx
146
137
  },
147
138
  children: [
148
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(MemoizedRenderIcon, { icon: leftIcon }),
139
+ leftIcon && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon, { inline: true, icon: leftIcon }),
149
140
  children,
150
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(MemoizedRenderIcon, { icon: rightIcon })
141
+ rightIcon && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon, { inline: true, icon: rightIcon })
151
142
  ]
152
143
  }
153
144
  );
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ttoss/ui",
3
- "version": "1.31.0",
3
+ "version": "1.31.1",
4
4
  "description": "Primitive layout, typographic, and other components for styling applications.",
5
5
  "license": "UNLICENSED",
6
6
  "author": "ttoss",
@@ -24,18 +24,19 @@
24
24
  "@emotion/react": "^11.10.6",
25
25
  "@iconify-icon/react": "^1.0.7",
26
26
  "@theme-ui/match-media": "^0.15.5",
27
- "@ttoss/theme": "^1.4.0",
27
+ "@ttoss/theme": "^1.4.1",
28
28
  "theme-ui": "^0.15.5"
29
29
  },
30
30
  "peerDependencies": {
31
31
  "react": ">=16.8.0"
32
32
  },
33
33
  "devDependencies": {
34
- "@ttoss/config": "^1.29.0",
35
- "@ttoss/test-utils": "^1.20.7",
36
- "@types/jest": "^29.4.4",
34
+ "@ttoss/config": "^1.29.1",
35
+ "@ttoss/test-utils": "^1.20.8",
36
+ "@types/jest": "^29.5.0",
37
37
  "jest": "^29.5.0",
38
- "tsup": "^6.6.3"
38
+ "react": "^18.2.0",
39
+ "tsup": "^6.7.0"
39
40
  },
40
41
  "keywords": [
41
42
  "React",
@@ -45,5 +46,5 @@
45
46
  "publishConfig": {
46
47
  "access": "public"
47
48
  },
48
- "gitHead": "2dc5f62e02ab8c901d6bb603024488b6aa3dda2b"
49
+ "gitHead": "ee0c2e51d38f37f997c020d4303cf90be720ecb0"
49
50
  }
@@ -3,31 +3,13 @@ import {
3
3
  type ButtonProps as ButtonPropsUi,
4
4
  Button as ButtonUi,
5
5
  } from 'theme-ui';
6
- import { Icon } from './Icon';
6
+ import { Icon, IconType } from './Icon';
7
7
 
8
8
  export type ButtonProps = ButtonPropsUi & {
9
- leftIcon?: React.ReactNode | string;
10
- rightIcon?: React.ReactNode | string;
9
+ leftIcon?: IconType;
10
+ rightIcon?: IconType;
11
11
  };
12
12
 
13
- const RenderIcon = ({ icon }: { icon: React.ReactNode | string }) => {
14
- if (!icon) {
15
- return null;
16
- }
17
-
18
- if (typeof icon === 'string') {
19
- return (
20
- <>
21
- <Icon icon={icon} />
22
- </>
23
- );
24
- }
25
-
26
- return <>{icon}</>;
27
- };
28
-
29
- const MemoizedRenderIcon = React.memo(RenderIcon);
30
-
31
13
  export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
32
14
  (props, ref) => {
33
15
  const { children, leftIcon, rightIcon, ...restProps } = props;
@@ -35,6 +17,7 @@ export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
35
17
  return (
36
18
  <ButtonUi
37
19
  ref={ref}
20
+ type="button"
38
21
  {...restProps}
39
22
  sx={{
40
23
  cursor: 'pointer',
@@ -46,9 +29,9 @@ export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
46
29
  ...restProps.sx,
47
30
  }}
48
31
  >
49
- <MemoizedRenderIcon icon={leftIcon} />
32
+ {leftIcon && <Icon inline icon={leftIcon} />}
50
33
  {children}
51
- <MemoizedRenderIcon icon={rightIcon} />
34
+ {rightIcon && <Icon inline icon={rightIcon} />}
52
35
  </ButtonUi>
53
36
  );
54
37
  }