@ttoss/ui 1.36.8 → 1.36.9

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 (6) hide show
  1. package/dist/esm/index.js +10 -1
  2. package/dist/index.d.ts +1 -0
  3. package/dist/index.js +10 -1
  4. package/package.json +2 -2
  5. package/src/components/Button.tsx +4 -2
  6. package/src/components/CloseButton.tsx +5 -0
package/dist/esm/index.js CHANGED
@@ -90,6 +90,7 @@ var Button = /*#__PURE__*/React2.forwardRef((props, ref) => {
90
90
  children,
91
91
  leftIcon,
92
92
  rightIcon,
93
+ loading,
93
94
  ...restProps
94
95
  } = props;
95
96
  return /* @__PURE__ */jsxs3(ButtonUi, {
@@ -106,7 +107,10 @@ var Button = /*#__PURE__*/React2.forwardRef((props, ref) => {
106
107
  gap: "lg",
107
108
  ...restProps.sx
108
109
  },
109
- children: [leftIcon && /* @__PURE__ */jsx4(Icon, {
110
+ children: [loading && /* @__PURE__ */jsx4(Icon, {
111
+ inline: true,
112
+ icon: "three-dots-loading"
113
+ }), !loading && leftIcon && /* @__PURE__ */jsx4(Icon, {
110
114
  inline: true,
111
115
  icon: leftIcon
112
116
  }), children, rightIcon && /* @__PURE__ */jsx4(Icon, {
@@ -463,9 +467,14 @@ var CloseButton = /*#__PURE__*/React9.forwardRef(({
463
467
  display: "inline-flex",
464
468
  alignItems: "center",
465
469
  cursor: "pointer",
470
+ lineHeight: "normal",
466
471
  gap: "sm",
467
472
  padding: "sm",
468
473
  width: "fit-content",
474
+ transition: "all 0.2s",
475
+ "& > iconify-icon": {
476
+ fontSize: "base"
477
+ },
469
478
  ...sx
470
479
  },
471
480
  ...props,
package/dist/index.d.ts CHANGED
@@ -32,6 +32,7 @@ declare const Badge: ({ icon, children, sx, ...props }: BadgeProps) => react_jsx
32
32
  type ButtonProps = ButtonProps$1 & {
33
33
  leftIcon?: IconType;
34
34
  rightIcon?: IconType;
35
+ loading?: boolean;
35
36
  };
36
37
  declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
37
38
 
package/dist/index.js CHANGED
@@ -166,6 +166,7 @@ var Button = React2.forwardRef((props, ref) => {
166
166
  children,
167
167
  leftIcon,
168
168
  rightIcon,
169
+ loading,
169
170
  ...restProps
170
171
  } = props;
171
172
  return /* @__PURE__ */(0, import_jsx_runtime4.jsxs)(import_theme_ui5.Button, {
@@ -182,7 +183,10 @@ var Button = React2.forwardRef((props, ref) => {
182
183
  gap: "lg",
183
184
  ...restProps.sx
184
185
  },
185
- children: [leftIcon && /* @__PURE__ */(0, import_jsx_runtime4.jsx)(Icon, {
186
+ children: [loading && /* @__PURE__ */(0, import_jsx_runtime4.jsx)(Icon, {
187
+ inline: true,
188
+ icon: "three-dots-loading"
189
+ }), !loading && leftIcon && /* @__PURE__ */(0, import_jsx_runtime4.jsx)(Icon, {
186
190
  inline: true,
187
191
  icon: leftIcon
188
192
  }), children, rightIcon && /* @__PURE__ */(0, import_jsx_runtime4.jsx)(Icon, {
@@ -539,9 +543,14 @@ var CloseButton = React9.forwardRef(({
539
543
  display: "inline-flex",
540
544
  alignItems: "center",
541
545
  cursor: "pointer",
546
+ lineHeight: "normal",
542
547
  gap: "sm",
543
548
  padding: "sm",
544
549
  width: "fit-content",
550
+ transition: "all 0.2s",
551
+ "& > iconify-icon": {
552
+ fontSize: "base"
553
+ },
545
554
  ...sx
546
555
  },
547
556
  ...props,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ttoss/ui",
3
- "version": "1.36.8",
3
+ "version": "1.36.9",
4
4
  "description": "Primitive layout, typographic, and other components for styling applications.",
5
5
  "author": "ttoss",
6
6
  "contributors": [
@@ -19,7 +19,7 @@
19
19
  "@iconify-icon/react": "^1.0.7",
20
20
  "@theme-ui/match-media": "^0.15.7",
21
21
  "theme-ui": "^0.15.7",
22
- "@ttoss/theme": "^1.4.35"
22
+ "@ttoss/theme": "^1.4.36"
23
23
  },
24
24
  "peerDependencies": {
25
25
  "react": ">=16.8.0"
package/src/components/Button.tsx CHANGED
@@ -8,11 +8,12 @@ import { Icon, IconType } from './Icon';
8
8
  export type ButtonProps = ButtonPropsUi & {
9
9
  leftIcon?: IconType;
10
10
  rightIcon?: IconType;
11
+ loading?: boolean;
11
12
  };
12
13
 
13
14
  export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
14
15
  (props, ref) => {
15
- const { children, leftIcon, rightIcon, ...restProps } = props;
16
+ const { children, leftIcon, rightIcon, loading, ...restProps } = props;
16
17
 
17
18
  return (
18
19
  <ButtonUi
@@ -30,7 +31,8 @@ export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
30
31
  ...restProps.sx,
31
32
  }}
32
33
  >
33
- {leftIcon && <Icon inline icon={leftIcon} />}
34
+ {loading && <Icon inline icon="three-dots-loading" />}
35
+ {!loading && leftIcon && <Icon inline icon={leftIcon} />}
34
36
  {children}
35
37
  {rightIcon && <Icon inline icon={rightIcon} />}
36
38
  </ButtonUi>
package/src/components/CloseButton.tsx CHANGED
@@ -26,9 +26,14 @@ export const CloseButton = React.forwardRef<
26
26
  display: 'inline-flex',
27
27
  alignItems: 'center',
28
28
  cursor: 'pointer',
29
+ lineHeight: 'normal',
29
30
  gap: 'sm',
30
31
  padding: 'sm',
31
32
  width: 'fit-content',
33
+ transition: 'all 0.2s',
34
+ '& > iconify-icon': {
35
+ fontSize: 'base',
36
+ },
32
37
  ...sx,
33
38
  }}
34
39
  {...props}