uibee 3.1.1 → 3.1.2
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.
|
@@ -2649,7 +2649,9 @@ const variants = {
|
|
|
2649
2649
|
success: "bg-green-600 text-white hover:brightness-110",
|
|
2650
2650
|
info: "bg-blue-600 text-white hover:brightness-110"
|
|
2651
2651
|
};
|
|
2652
|
-
const base = "cursor-pointer
|
|
2652
|
+
const base = "cursor-pointer rounded-md h-9 flex items-center justify-center gap-2 select-none text-sm font-medium transition-all duration-150";
|
|
2653
|
+
const withText = "px-4 w-fit";
|
|
2654
|
+
const iconOnly = "w-9";
|
|
2653
2655
|
const disabledCls = "opacity-40 cursor-not-allowed pointer-events-none";
|
|
2654
2656
|
const iconWrap = (icon) => icon ? /* @__PURE__ */ jsx("span", {
|
|
2655
2657
|
className: "[&>svg]:w-4 [&>svg]:h-4 flex items-center",
|
|
@@ -2657,7 +2659,8 @@ const iconWrap = (icon) => icon ? /* @__PURE__ */ jsx("span", {
|
|
|
2657
2659
|
}) : null;
|
|
2658
2660
|
function Button({ text, className, icon, path, variant = "primary", type, onClick, disabled }) {
|
|
2659
2661
|
const color = variants[variant];
|
|
2660
|
-
const
|
|
2662
|
+
const sizing = icon && !text ? iconOnly : withText;
|
|
2663
|
+
const cls = `${base} ${sizing} ${color} ${disabled ? disabledCls : ""} ${className || ""}`;
|
|
2661
2664
|
if (!path) return /* @__PURE__ */ jsxs("button", {
|
|
2662
2665
|
type: type || "button",
|
|
2663
2666
|
disabled,
|
|
@@ -2672,7 +2675,7 @@ function Button({ text, className, icon, path, variant = "primary", type, onClic
|
|
|
2672
2675
|
});
|
|
2673
2676
|
return /* @__PURE__ */ jsxs(Link, {
|
|
2674
2677
|
href: path,
|
|
2675
|
-
className: `${base} ${color} ${className || ""}`,
|
|
2678
|
+
className: `${base} ${sizing} ${color} ${className || ""}`,
|
|
2676
2679
|
children: [iconWrap(icon), text]
|
|
2677
2680
|
});
|
|
2678
2681
|
}
|
package/package.json
CHANGED
|
@@ -21,7 +21,9 @@ const variants = {
|
|
|
21
21
|
info: 'bg-blue-600 text-white hover:brightness-110',
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
-
const base = 'cursor-pointer
|
|
24
|
+
const base = 'cursor-pointer rounded-md h-9 flex items-center justify-center gap-2 select-none text-sm font-medium transition-all duration-150'
|
|
25
|
+
const withText = 'px-4 w-fit'
|
|
26
|
+
const iconOnly = 'w-9'
|
|
25
27
|
const disabledCls = 'opacity-40 cursor-not-allowed pointer-events-none'
|
|
26
28
|
|
|
27
29
|
const iconWrap = (icon: ButtonProps['icon']) =>
|
|
@@ -38,7 +40,8 @@ export default function Button({
|
|
|
38
40
|
disabled,
|
|
39
41
|
}: ButtonProps) {
|
|
40
42
|
const color = variants[variant]
|
|
41
|
-
const
|
|
43
|
+
const sizing = icon && !text ? iconOnly : withText
|
|
44
|
+
const cls = `${base} ${sizing} ${color} ${disabled ? disabledCls : ''} ${className || ''}`
|
|
42
45
|
|
|
43
46
|
if (!path) {
|
|
44
47
|
return (
|
|
@@ -65,7 +68,7 @@ export default function Button({
|
|
|
65
68
|
}
|
|
66
69
|
|
|
67
70
|
return (
|
|
68
|
-
<Link href={path} className={`${base} ${color} ${className || ''}`}>
|
|
71
|
+
<Link href={path} className={`${base} ${sizing} ${color} ${className || ''}`}>
|
|
69
72
|
{iconWrap(icon)}
|
|
70
73
|
{text}
|
|
71
74
|
</Link>
|