@bubo-squared/ui-framework 0.1.92 → 0.1.93

package/dist/index.cjs

@@ -143,8 +143,8 @@ var Button = React.forwardRef(
       size = "md",
       asChild = false,
       children,
-      suffixIcon,
-      prefixIcon,
+      trailingIcon,
+      leadingIcon,
       ...rest
     } = props;
     const Comp = asChild ? import_react_slot.Slot : "button";
@@ -155,9 +155,9 @@ var Button = React.forwardRef(
         ref,
         ...rest,
         children: [
-          prefixIcon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: cn(buttonIconVariants({ size })), children: prefixIcon }),
+          leadingIcon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: cn(buttonIconVariants({ size })), children: leadingIcon }),
           /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: cn(buttonTextVariants({ size })), children }),
-          suffixIcon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: cn(buttonIconVariants({ size })), children: suffixIcon })
+          trailingIcon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: cn(buttonIconVariants({ size })), children: trailingIcon })
         ]
       }
     );
@@ -361,8 +361,8 @@ var LinkButton = React4.forwardRef(
       size = "sm",
       asChild = false,
       children,
-      suffixIcon,
-      prefixIcon,
+      trailingIcon,
+      leadingIcon,
       ...rest
     } = props;
     const Comp = asChild ? import_react_slot3.Slot : "button";
@@ -373,9 +373,9 @@ var LinkButton = React4.forwardRef(
         ref,
         ...rest,
         children: [
-          prefixIcon && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cn(linkButtonIconVariants({ size })), children: prefixIcon }),
+          leadingIcon && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cn(linkButtonIconVariants({ size })), children: leadingIcon }),
           /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cn(linkButtonTextVariants({ size })), children }),
-          suffixIcon && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cn(linkButtonIconVariants({ size })), children: suffixIcon })
+          trailingIcon && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cn(linkButtonIconVariants({ size })), children: trailingIcon })
         ]
       }
     );
@@ -2145,6 +2145,7 @@ var SearchInput = (props) => {
     className,
     leadingIcon,
     showLeadingIcon = true,
+    trailingIcon,
     ...inputProps
   } = props;
   const inputRef = React28.useRef(null);
@@ -2152,6 +2153,7 @@ var SearchInput = (props) => {
     if (disabled) return;
     inputRef.current?.focus();
   };
+  const showTrailingIcon = !!trailingIcon;
   return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "flex flex-col gap-2 items-start min-w-[343px]", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "relative w-full", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
     InputShell,
     {
@@ -2176,7 +2178,8 @@ var SearchInput = (props) => {
             style: { marginBottom: 0 },
             ...inputProps
           }
-        )
+        ),
+        showTrailingIcon && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: cn("cursor-pointer", iconWrapperVariants2({ size, disabled: !!disabled })), children: trailingIcon })
       ]
     }
   ) }) });
@@ -2964,7 +2967,7 @@ var React33 = require("react");
 var import_jsx_runtime35 = require("react/jsx-runtime");
 var WebsiteInput = (props) => {
   const {
-    hierarchy = "prefix",
+    hierarchy = "leading",
     protocolLabel = "http://",
     icon,
     size = "large",
@@ -2972,7 +2975,7 @@ var WebsiteInput = (props) => {
     className,
     ...rest
   } = props;
-  const isPrefix = hierarchy === "prefix";
+  const isLeading = hierarchy === "leading";
   const baseClass = cn(
     "[&>span]:w-[unset] hover:bg-[unset]",
     !disabled && "[&:not(:focus-within):hover]:shadow-[0_0_0_var(--focus-ring-spread)_var(--background-secondary-hover)]",
@@ -2990,18 +2993,18 @@ var WebsiteInput = (props) => {
     "border-(--border-secondary)",
     // divider color
     disabled && "border-(--border-secondary-disabled) hover:border-(--border-secondary-disabled)",
-    isPrefix ? "border-r" : "border-l"
+    isLeading ? "border-r" : "border-l"
   );
   const iconWrapperClass = cn(
     "flex items-center justify-center shrink-0",
     size === "extra-large" ? "[&>svg]:w-6 [&>svg]:h-6" : "[&>svg]:w-5 [&>svg]:h-5",
     disabled ? "text-(--icon-primary-disabled)" : "text-(--icon-primary) group-hover:text-(--icon-primary-hover) group-focus-within:text-(--icon-primary-focus)"
   );
-  const prefixAddon = /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: baseAddonClass, children: [
+  const leadingAddon = /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: baseAddonClass, children: [
     /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: addonTextClass, children: protocolLabel }),
     icon != null && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: iconWrapperClass, children: icon })
   ] });
-  const suffixAddon = /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: baseAddonClass, children: [
+  const trailingAddon = /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: baseAddonClass, children: [
     icon != null && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: iconWrapperClass, children: icon }),
     /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: addonTextClass, children: protocolLabel })
   ] });
@@ -3012,8 +3015,8 @@ var WebsiteInput = (props) => {
       size,
       disabled,
       className: cn(baseClass, className),
-      leadingIcon: isPrefix ? prefixAddon : void 0,
-      trailingIcon: !isPrefix ? suffixAddon : void 0
+      leadingIcon: isLeading ? leadingAddon : void 0,
+      trailingIcon: !isLeading ? trailingAddon : void 0
     }
   );
 };