@allxsmith/bestax-bulma 5.1.3 → 5.2.1

package/dist/index.esm.js

@@ -1155,6 +1155,18 @@ Pagination.Ellipsis = PaginationEllipsis;
 Pagination.Previous = PaginationPrevious;
 Pagination.Next = PaginationNext;
 
+function stripRedundantLibraryPrefix(name, library) {
+    if (!name) {
+        return name;
+    }
+    if (library === 'fa' && name.startsWith('fa-')) {
+        return name.substring(3);
+    }
+    if (library === 'mdi' && name.startsWith('mdi-')) {
+        return name.substring(4);
+    }
+    return name;
+}
 function getIconClasses(library, name, variant, features) {
     let baseClass;
     let iconClass;
@@ -1228,6 +1240,7 @@ const Icon = ({ className, textColor, bgColor, name, library, variant, features,
     }
     const defaultLibrary = useIconLibrary();
     const finalLibrary = library || defaultLibrary || 'fa';
+    finalName = stripRedundantLibraryPrefix(finalName, finalLibrary);
     const { bulmaHelperClasses, rest } = useBulmaClasses({
         color: textColor,
         backgroundColor: bgColor,
@@ -2237,7 +2250,7 @@ const DialogContainer = () => {
 };
 
 const validButtonColors = [...validColors, 'text', 'ghost'];
-const Button = ({ color, size, isLight, isRounded, isLoading, isStatic, isFullWidth, isOutlined, isInverted, isFocused, isActive, isHovered, isDisabled, className, children, textColor, bgColor, as = 'button', href, onClick, target, rel, ...props }) => {
+const Button = ({ color, size, isLight, isRounded, isLoading, isStatic, isFullWidth, isOutlined, isInverted, isFocused, isActive, isHovered, isDisabled, className, children, textColor, bgColor, as: Component = 'button', href, onClick, target, rel, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
         color: textColor,
         backgroundColor: bgColor,
@@ -2260,9 +2273,9 @@ const Button = ({ color, size, isLight, isRounded, isLoading, isStatic, isFullWi
         'is-fullwidth': isFullWidth,
     });
     const buttonClasses = classNames(bulmaClasses, bulmaHelperClasses, className);
-    if (as === 'a') {
+    if (Component !== 'button') {
         const { type: _type, disabled: _disabled, form: _form, formAction: _formAction, formEncType: _formEncType, formMethod: _formMethod, formNoValidate: _formNoValidate, formTarget: _formTarget, name: _name, value: _value, autoFocus: _autoFocus, ...anchorRest } = rest;
-        return (jsx("a", { className: buttonClasses, href: href, target: target, rel: rel, "aria-disabled": isDisabled, tabIndex: isDisabled ? -1 : undefined, onClick: isDisabled
+        return (jsx(Component, { className: buttonClasses, href: href, target: target, rel: rel, "aria-disabled": isDisabled, tabIndex: isDisabled ? -1 : undefined, onClick: isDisabled
                 ? (e) => e.preventDefault()
                 : onClick, ...anchorRest, children: children }));
     }
@@ -2675,7 +2688,7 @@ const Image = ({ as, className, textColor, bgColor, size, isRounded, isRetina, s
     return (jsx(Tag, { className: imageClasses, ...rest, children: content }));
 };
 
-const Link = ({ className, textColor, bgColor, isActive, children, ...props }) => {
+const Link = ({ className, textColor, bgColor, isActive, as: Component = 'a', children, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
         color: textColor,
         backgroundColor: bgColor,
@@ -2685,7 +2698,7 @@ const Link = ({ className, textColor, bgColor, isActive, children, ...props }) =
         'is-active': isActive,
     });
     const linkClasses = classNames(bulmaClasses, bulmaHelperClasses, className);
-    return (jsx("a", { className: linkClasses || undefined, ...rest, children: children }));
+    return (jsx(Component, { className: linkClasses || undefined, ...rest, children: children }));
 };
 
 const ListItem = ({ className, textColor, bgColor, children, ...props }) => {