button component now has icon spacing adjustment (for lucide icons)

Author: samejr

apps/webapp/app/components/Shortcuts.tsx

@@ -24,6 +24,8 @@ export function Shortcuts() {
           fullWidth
           textAlignLeft
           shortcut={{ modifiers: ["shift"], key: "?" }}
+          className="gap-x-0 pl-0.5"
+          iconSpacing="gap-x-0.5"
         >
           Shortcuts
         </Button>

apps/webapp/app/components/primitives/Buttons.tsx

@@ -177,6 +177,7 @@ export type ButtonContentPropsType = {
   variant: keyof typeof variant;
   shortcutPosition?: "before-trailing-icon" | "after-trailing-icon";
   tooltipDescription?: string;
+  iconSpacing?: string;
 };
 
 export function ButtonContent(props: ButtonContentPropsType) {
@@ -192,6 +193,7 @@ export function ButtonContent(props: ButtonContentPropsType) {
     className,
     showTooltip,
     tooltipDescription,
+    iconSpacing,
   } = props;
   const variation = allVariants.variant[props.variant];
 
@@ -216,7 +218,8 @@ export function ButtonContent(props: ButtonContentPropsType) {
         className={cn(
           textAlignLeft ? "text-left" : "justify-center",
           "flex w-full items-center",
-          iconSpacingClassName
+          iconSpacingClassName,
+          iconSpacing
         )}
       >
         {LeadingIcon &&