shad-m 1.0.2 → 1.0.3

package/dist/components/button.js

@@ -0,0 +1,250 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var reactSlot = require('@radix-ui/react-slot');
+var classVarianceAuthority = require('class-variance-authority');
+var React = require('react');
+var types = require('@/lib/types');
+var utils = require('@/lib/utils');
+var UISystemProvider = require('@/providers/UISystemProvider');
+var spinner = require('./spinner');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+const buttonVariants = classVarianceAuthority.cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-base font-medium transition-colors focus-visible:outline-none disabled:pointer-events-none disabled:icon-muted-foreground disabled:text-muted-foreground disabled:bg-muted disabled:border-border data-[loading=true]:pointer-events-none data-[loading=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-6 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground icon-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground icon-destructive-foreground hover:bg-destructive/90",
+        outline: "border border-input bg-background hover:bg-accent hover:border-accent",
+        secondary: "bg-secondary border border-primary text-secondary-foreground icon-secondary-foreground hover:bg-accent active:bg-accent/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground hover:icon-accent-foreground",
+        link: "text-primary icon-primary underline-offset-4 hover:underline",
+        plain: "text-primary icon-primary hover:text-primary/80 w-max h-max",
+        "plain-error": "text-red-500 hover:text-red-500/80 w-max h-max",
+        icon: "bg-card text-foreground icon-foreground hover:bg-muted border border-border rounded-full shadow [&_svg]:size-6",
+        // Primary variants with solid colors
+        "primary-success": "bg-green-500 text-white icon-white hover:bg-green-600 active:bg-green-700",
+        "primary-warning": "bg-yellow-500 text-white icon-white hover:bg-yellow-600 active:bg-yellow-700",
+        "primary-info": "bg-blue-500 text-white icon-white hover:bg-primary active:bg-blue-700",
+        "primary-error": "bg-red-500 text-white icon-white hover:bg-red-600 active:bg-red-700",
+        // Soft variants with lighter backgrounds
+        "soft-success": "bg-green-50 text-green-600 icon-green-600 hover:bg-green-100 active:bg-green-200 border border-green-200",
+        "soft-warning": "bg-yellow-50 text-yellow-600 icon-yellow-600 hover:bg-yellow-100 active:bg-yellow-200 border border-yellow-200",
+        "soft-info": "bg-blue-50 text-primary icon-primary hover:bg-blue-100 active:bg-blue-200 border border-blue-200",
+        "soft-error": "bg-red-50 text-red-600 icon-red-600 hover:bg-red-100 active:bg-red-200 border border-red-200",
+        // Primary variants with solid colors
+        "heavy-success": "bg-green-500 text-white icon-white hover:bg-green-600 active:bg-green-700",
+        "heavy-warning": "bg-yellow-500 text-white icon-white hover:bg-yellow-600 active:bg-yellow-700",
+        "heavy-info": "bg-blue-500 text-white icon-white hover:bg-primary active:bg-blue-700",
+        "heavy-error": "bg-red-500 text-white icon-white hover:bg-red-600 active:bg-red-700",
+        // Soft variants with lighter backgrounds
+        "light-success": "bg-green-50 text-green-600 icon-green-600 hover:bg-green-100 active:bg-green-200 border border-green-200",
+        "light-warning": "bg-yellow-50 text-yellow-600 icon-yellow-600 hover:bg-yellow-100 active:bg-yellow-200 border border-yellow-200",
+        "light-info": "bg-blue-50 text-primary icon-primary hover:bg-blue-100 active:bg-blue-200 border border-blue-200",
+        "light-error": "bg-red-50 text-red-600 icon-red-600 hover:bg-red-100 active:bg-red-200 border border-red-200",
+        // Outline variants with borders
+        "outline-success": "border border-green-500 bg-transparent text-green-600 icon-green-600 hover:bg-green-50 active:bg-green-100",
+        "outline-warning": "border border-yellow-600 bg-transparent text-yellow-600 icon-yellow-600 hover:bg-yellow-50 active:bg-yellow-100",
+        "outline-info": "border border-blue-500 bg-transparent text-primary icon-primary hover:bg-blue-50 active:bg-blue-100",
+        "outline-error": "border border-red-500 bg-transparent text-red-600 icon-red-600 hover:bg-red-50 active:bg-red-100"
+      },
+      rounded: {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        md: "rounded-md",
+        lg: "rounded-lg",
+        xl: "rounded-xl",
+        full: "rounded-full"
+      },
+      size: {
+        default: "h-12 px-3 py-2",
+        sm: "h-10 px-3 py-2 [&_svg]:size-4",
+        lg: "h-14 px-3 py-2",
+        icon: "h-10 w-10"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      rounded: "md"
+    }
+  }
+);
+const Button = React__namespace.forwardRef(
+  ({
+    className,
+    trackingData,
+    trackingIndex,
+    trackingName,
+    blockSendTracking,
+    variant,
+    size,
+    rounded,
+    asChild = false,
+    loading = false,
+    children,
+    onClick,
+    disabled,
+    ...props
+  }, ref) => {
+    const Comp = asChild ? reactSlot.Slot : "button";
+    const getSpinnerVariant = () => {
+      if (variant === "default" || variant === "primary-success" || variant === "primary-warning" || variant === "primary-info" || variant === "primary-error") {
+        return "white";
+      }
+      if (variant === "soft-success") return "success";
+      if (variant === "soft-warning") return "warning";
+      if (variant === "soft-info") return "info";
+      if (variant === "soft-error") return "error";
+      if (variant === "outline-success") return "success";
+      if (variant === "outline-warning") return "warning";
+      if (variant === "outline-info") return "info";
+      if (variant === "outline-error") return "error";
+      if (variant === "destructive") return "white";
+      return "primary";
+    };
+    const spinnerVariant = getSpinnerVariant();
+    const { sendTrack } = UISystemProvider.useUISystemContext() || {};
+    const onClickFn = (e) => {
+      if (disabled || loading) {
+        return;
+      }
+      onClick?.(e);
+      if (!sendTrack || blockSendTracking) return;
+      const targetElm = e.target;
+      const buttonText = targetElm.innerText || targetElm.textContent || "";
+      const finalTrackingName = trackingName || `click_btn_${trackingData?.identity}`;
+      const otherData = {};
+      if (trackingIndex !== void 0 && trackingIndex !== null) {
+        otherData.index = trackingIndex;
+      }
+      const mergedTrackingData = { ...trackingData };
+      if (!mergedTrackingData.object_name && buttonText) {
+        mergedTrackingData.object_name = buttonText.trim();
+      }
+      sendTrack(finalTrackingName, types.TRACKING_TYPE.click, {
+        ...otherData,
+        ...mergedTrackingData
+      });
+    };
+    const isIconElement = (element) => {
+      if (element.type === "svg") {
+        return true;
+      }
+      const getComponentName = (type) => {
+        if (!type) return "";
+        if (type.displayName) return type.displayName;
+        if (type.name) return type.name;
+        if (type.$$typeof === /* @__PURE__ */ Symbol.for("react.memo") && type.type) {
+          return getComponentName(type.type);
+        }
+        if (type.$$typeof === /* @__PURE__ */ Symbol.for("react.forward_ref") && type.render) {
+          return getComponentName(type.render);
+        }
+        return "";
+      };
+      if (element.type) {
+        const componentName = getComponentName(element.type);
+        const lowerName = componentName.toLowerCase();
+        if (lowerName.includes("icon") || lowerName.includes("svg") || componentName.match(/Icon\d+$/) || // Matches Icon16, Icon24, etc.
+        componentName.match(/^[A-Z][a-zA-Z]*Icon/)) {
+          return true;
+        }
+      }
+      if (element.props?.className && typeof element.props.className === "string") {
+        const className2 = element.props.className;
+        if (className2.includes("ic-") || className2.includes("icon-")) {
+          return true;
+        }
+      }
+      if (element.props?.viewBox || element.props?.xmlns === "http://www.w3.org/2000/svg") {
+        return true;
+      }
+      return false;
+    };
+    const filterChildren = (children2) => {
+      return React__namespace.Children.map(children2, (child) => {
+        if (!React__namespace.isValidElement(child)) {
+          return child;
+        }
+        if (isIconElement(child)) {
+          return null;
+        }
+        if ((child.type === "div" || child.type === "span") && child.props?.children) {
+          const filteredChildren = filterChildren(child.props.children);
+          const hasContent = React__namespace.Children.toArray(filteredChildren).some(
+            (c) => c !== null && c !== void 0
+          );
+          if (!hasContent) {
+            return null;
+          }
+          return React__namespace.cloneElement(child, {}, filteredChildren);
+        }
+        return child;
+      });
+    };
+    const renderChildren = () => {
+      if (!loading) return children;
+      return filterChildren(children);
+    };
+    const finalRounded = size === "icon" && rounded === void 0 ? "full" : rounded;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      Comp,
+      {
+        className: utils.cn(buttonVariants({ variant, size, rounded: finalRounded, className })),
+        ref,
+        onClick: onClickFn,
+        disabled: disabled && !loading,
+        "data-loading": loading,
+        ...props,
+        children: [
+          loading && /* @__PURE__ */ jsxRuntime.jsx(spinner.Spinner, { size: "sm", variant: spinnerVariant }),
+          renderChildren()
+        ]
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+const buttonGroupVariants = classVarianceAuthority.cva("flex", {
+  variants: {
+    direction: {
+      horizontal: "space-x-3",
+      vertical: "space-y-2"
+    }
+  }
+});
+const ButtonGroup = React__namespace.forwardRef(
+  ({ asChild, className, direction = "horizontal", ...props }, ref) => {
+    const Comp = asChild ? reactSlot.Slot : "div";
+    return /* @__PURE__ */ jsxRuntime.jsx(Comp, { ref, className: utils.cn(buttonGroupVariants({ direction, className })), ...props });
+  }
+);
+ButtonGroup.displayName = "ButtonGroup";
+
+exports.Button = Button;
+exports.ButtonGroup = ButtonGroup;
+exports.buttonVariants = buttonVariants;
+//# sourceMappingURL=button.js.map
+//# sourceMappingURL=button.js.map

package/dist/components/button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/button.tsx"],"names":["cva","React","Slot","useUISystemContext","TRACKING_TYPE","className","children","jsxs","cn","jsx","Spinner"],"mappings":"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","file":"button.js","sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport * as React from 'react';\n\nimport { TRACKING_TYPE, TrackingPropsType } from '@/lib/types';\nimport { cn } from '@/lib/utils';\nimport { useUISystemContext } from '@/providers/UISystemProvider';\nimport { Spinner } from './spinner';\n\nconst buttonVariants = cva(\n  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-base font-medium transition-colors focus-visible:outline-none disabled:pointer-events-none disabled:icon-muted-foreground disabled:text-muted-foreground disabled:bg-muted disabled:border-border data-[loading=true]:pointer-events-none data-[loading=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-6 [&_svg]:shrink-0',\n  {\n    variants: {\n      variant: {\n        default: 'bg-primary text-primary-foreground icon-primary-foreground hover:bg-primary/90',\n        destructive:\n          'bg-destructive text-destructive-foreground icon-destructive-foreground hover:bg-destructive/90',\n        outline: 'border border-input bg-background hover:bg-accent hover:border-accent',\n        secondary:\n          'bg-secondary border border-primary text-secondary-foreground icon-secondary-foreground hover:bg-accent active:bg-accent/80',\n        ghost: 'hover:bg-accent hover:text-accent-foreground hover:icon-accent-foreground',\n        link: 'text-primary icon-primary underline-offset-4 hover:underline',\n        plain: 'text-primary icon-primary hover:text-primary/80 w-max h-max',\n        'plain-error': 'text-red-500 hover:text-red-500/80 w-max h-max',\n        icon: 'bg-card text-foreground icon-foreground hover:bg-muted border border-border rounded-full shadow [&_svg]:size-6',\n        // Primary variants with solid colors\n        'primary-success':\n          'bg-green-500 text-white icon-white hover:bg-green-600 active:bg-green-700',\n        'primary-warning':\n          'bg-yellow-500 text-white icon-white hover:bg-yellow-600 active:bg-yellow-700',\n        'primary-info': 'bg-blue-500 text-white icon-white hover:bg-primary active:bg-blue-700',\n        'primary-error': 'bg-red-500 text-white icon-white hover:bg-red-600 active:bg-red-700',\n        // Soft variants with lighter backgrounds\n        'soft-success':\n          'bg-green-50 text-green-600 icon-green-600 hover:bg-green-100 active:bg-green-200 border border-green-200',\n        'soft-warning':\n          'bg-yellow-50 text-yellow-600 icon-yellow-600 hover:bg-yellow-100 active:bg-yellow-200 border border-yellow-200',\n        'soft-info':\n          'bg-blue-50 text-primary icon-primary hover:bg-blue-100 active:bg-blue-200 border border-blue-200',\n        'soft-error':\n          'bg-red-50 text-red-600 icon-red-600 hover:bg-red-100 active:bg-red-200 border border-red-200',\n\n        // Primary variants with solid colors\n        'heavy-success':\n          'bg-green-500 text-white icon-white hover:bg-green-600 active:bg-green-700',\n        'heavy-warning':\n          'bg-yellow-500 text-white icon-white hover:bg-yellow-600 active:bg-yellow-700',\n        'heavy-info': 'bg-blue-500 text-white icon-white hover:bg-primary active:bg-blue-700',\n        'heavy-error': 'bg-red-500 text-white icon-white hover:bg-red-600 active:bg-red-700',\n        // Soft variants with lighter backgrounds\n        'light-success':\n          'bg-green-50 text-green-600 icon-green-600 hover:bg-green-100 active:bg-green-200 border border-green-200',\n        'light-warning':\n          'bg-yellow-50 text-yellow-600 icon-yellow-600 hover:bg-yellow-100 active:bg-yellow-200 border border-yellow-200',\n        'light-info':\n          'bg-blue-50 text-primary icon-primary hover:bg-blue-100 active:bg-blue-200 border border-blue-200',\n        'light-error':\n          'bg-red-50 text-red-600 icon-red-600 hover:bg-red-100 active:bg-red-200 border border-red-200',\n\n        // Outline variants with borders\n        'outline-success':\n          'border border-green-500 bg-transparent text-green-600 icon-green-600 hover:bg-green-50 active:bg-green-100',\n        'outline-warning':\n          'border border-yellow-600 bg-transparent text-yellow-600 icon-yellow-600 hover:bg-yellow-50 active:bg-yellow-100',\n        'outline-info':\n          'border border-blue-500 bg-transparent text-primary icon-primary hover:bg-blue-50 active:bg-blue-100',\n        'outline-error':\n          'border border-red-500 bg-transparent text-red-600 icon-red-600 hover:bg-red-50 active:bg-red-100',\n      },\n      rounded: {\n        none: 'rounded-none',\n        sm: 'rounded-sm',\n        md: 'rounded-md',\n        lg: 'rounded-lg',\n        xl: 'rounded-xl',\n        full: 'rounded-full',\n      },\n      size: {\n        default: 'h-12 px-3 py-2',\n        sm: 'h-10 px-3 py-2 [&_svg]:size-4',\n        lg: 'h-14 px-3 py-2',\n        icon: 'h-10 w-10',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n      rounded: 'md',\n    },\n  },\n);\n\ninterface TrackingData {\n  [key: string]: any;\n  identity?: string;\n  object_name?: string; // UI button name\n}\n\nexport interface ButtonProps\n  extends\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    TrackingPropsType,\n    VariantProps<typeof buttonVariants> {\n  asChild?: boolean;\n  loading?: boolean;\n  trackingData?: TrackingData;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      trackingData,\n      trackingIndex,\n      trackingName,\n      blockSendTracking,\n      variant,\n      size,\n      rounded,\n      asChild = false,\n      loading = false,\n      children,\n      onClick,\n      disabled,\n      ...props\n    },\n    ref,\n  ) => {\n    const Comp = asChild ? Slot : 'button';\n\n    // Determine spinner color based on button variant to match text color\n    const getSpinnerVariant = ():\n      | 'white'\n      | 'primary'\n      | 'success'\n      | 'warning'\n      | 'info'\n      | 'error' => {\n      // Primary variants: white text/spinner on colored background\n      if (\n        variant === 'default' ||\n        variant === 'primary-success' ||\n        variant === 'primary-warning' ||\n        variant === 'primary-info' ||\n        variant === 'primary-error'\n      ) {\n        return 'white';\n      }\n\n      // Soft variants: colored text/spinner on light background\n      if (variant === 'soft-success') return 'success';\n      if (variant === 'soft-warning') return 'warning';\n      if (variant === 'soft-info') return 'info';\n      if (variant === 'soft-error') return 'error';\n\n      // Outline variants: colored text/spinner with colored border\n      if (variant === 'outline-success') return 'success';\n      if (variant === 'outline-warning') return 'warning';\n      if (variant === 'outline-info') return 'info';\n      if (variant === 'outline-error') return 'error';\n\n      // Destructive variant: white text/spinner on red background\n      if (variant === 'destructive') return 'white';\n\n      // Default for other variants (secondary, outline, ghost)\n      return 'primary';\n    };\n\n    const spinnerVariant = getSpinnerVariant();\n\n    const { sendTrack } = useUISystemContext() || {};\n\n    const onClickFn: React.MouseEventHandler<any> = (e) => {\n      if (disabled || loading) {\n        return;\n      }\n      onClick?.(e);\n\n      // Only track if sendTrack exists and tracking is not blocked\n      if (!sendTrack || blockSendTracking) return;\n\n      const targetElm = e.target as HTMLElement;\n      const buttonText = targetElm.innerText || targetElm.textContent || '';\n\n      // Auto-generate trackingName based on button type if not provided\n      const finalTrackingName = trackingName || `click_btn_${trackingData?.identity}`;\n\n      // Prepare tracking data\n      const otherData: Record<string, any> = {};\n      if (trackingIndex !== undefined && trackingIndex !== null) {\n        otherData.index = trackingIndex;\n      }\n\n      // Auto-extract object_name from button text if not provided\n      const mergedTrackingData = { ...trackingData };\n      if (!mergedTrackingData.object_name && buttonText) {\n        mergedTrackingData.object_name = buttonText.trim();\n      }\n\n      // Send tracking event\n      sendTrack(finalTrackingName, TRACKING_TYPE.click, {\n        ...otherData,\n        ...mergedTrackingData,\n      });\n    };\n\n    const isIconElement = (element: React.ReactElement): boolean => {\n      // Check if it's an SVG element directly\n      if (element.type === 'svg') {\n        return true;\n      }\n\n      // Get component name from various React wrapper types\n      const getComponentName = (type: any): string => {\n        if (!type) return '';\n\n        // Direct function/class component\n        if (type.displayName) return type.displayName;\n        if (type.name) return type.name;\n\n        // React.memo wrapped component\n        if (type.$$typeof === Symbol.for('react.memo') && type.type) {\n          return getComponentName(type.type);\n        }\n\n        // React.forwardRef wrapped component\n        if (type.$$typeof === Symbol.for('react.forward_ref') && type.render) {\n          return getComponentName(type.render);\n        }\n\n        return '';\n      };\n\n      // Check if element is a React component\n      if (element.type) {\n        const componentName = getComponentName(element.type);\n        const lowerName = componentName.toLowerCase();\n\n        // Check for icon-related component names\n        if (\n          lowerName.includes('icon') ||\n          lowerName.includes('svg') ||\n          componentName.match(/Icon\\d+$/) || // Matches Icon16, Icon24, etc.\n          componentName.match(/^[A-Z][a-zA-Z]*Icon/) // Matches CheckIcon, AddIcon, etc.\n        ) {\n          return true;\n        }\n      }\n\n      // Check className for icon-related classes\n      if (element.props?.className && typeof element.props.className === 'string') {\n        const className = element.props.className;\n        if (className.includes('ic-') || className.includes('icon-')) {\n          return true;\n        }\n      }\n\n      // Check if element has SVG-related props\n      if (element.props?.viewBox || element.props?.xmlns === 'http://www.w3.org/2000/svg') {\n        return true;\n      }\n\n      return false;\n    };\n\n    const filterChildren = (children: React.ReactNode): React.ReactNode => {\n      return React.Children.map(children, (child) => {\n        if (!React.isValidElement(child)) {\n          return child;\n        }\n\n        // If it's an icon element, hide it completely\n        if (isIconElement(child)) {\n          return null;\n        }\n\n        // If it's a wrapper (div/span) that might contain icons, filter recursively\n        if ((child.type === 'div' || child.type === 'span') && child.props?.children) {\n          const filteredChildren = filterChildren(child.props.children);\n\n          // If all children were filtered out, don't render the wrapper\n          const hasContent = React.Children.toArray(filteredChildren).some(\n            (c) => c !== null && c !== undefined,\n          );\n\n          if (!hasContent) {\n            return null;\n          }\n\n          return React.cloneElement(child, {}, filteredChildren);\n        }\n\n        return child;\n      });\n    };\n\n    const renderChildren = () => {\n      if (!loading) return children;\n\n      // When loading, filter out all icon elements but keep text content\n      return filterChildren(children);\n    };\n\n    // Auto-set rounded to 'full' for icon size if not explicitly provided\n    const finalRounded = size === 'icon' && rounded === undefined ? 'full' : rounded;\n\n    return (\n      <Comp\n        className={cn(buttonVariants({ variant, size, rounded: finalRounded, className }))}\n        ref={ref}\n        onClick={onClickFn}\n        disabled={disabled && !loading}\n        data-loading={loading}\n        {...props}\n      >\n        {loading && <Spinner size=\"sm\" variant={spinnerVariant} />}\n        {renderChildren()}\n      </Comp>\n    );\n  },\n);\nButton.displayName = 'Button';\n\nconst buttonGroupVariants = cva('flex', {\n  variants: {\n    direction: {\n      horizontal: 'space-x-3',\n      vertical: 'space-y-2',\n    },\n  },\n});\n\ninterface ButtonGroupProps\n  extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof buttonGroupVariants> {\n  asChild?: boolean;\n}\n\nconst ButtonGroup = React.forwardRef<HTMLDivElement, ButtonGroupProps>(\n  ({ asChild, className, direction = 'horizontal', ...props }, ref) => {\n    const Comp = asChild ? Slot : 'div';\n\n    return (\n      <Comp ref={ref} className={cn(buttonGroupVariants({ direction, className }))} {...props} />\n    );\n  },\n);\n\nButtonGroup.displayName = 'ButtonGroup';\n\nexport { Button, ButtonGroup, buttonVariants };\n"]}

package/dist/components/button.mjs

@@ -0,0 +1,226 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Slot } from '@radix-ui/react-slot';
+import { cva } from 'class-variance-authority';
+import * as React from 'react';
+import { TRACKING_TYPE } from '@/lib/types';
+import { cn } from '@/lib/utils';
+import { useUISystemContext } from '@/providers/UISystemProvider';
+import { Spinner } from './spinner';
+
+const buttonVariants = cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-base font-medium transition-colors focus-visible:outline-none disabled:pointer-events-none disabled:icon-muted-foreground disabled:text-muted-foreground disabled:bg-muted disabled:border-border data-[loading=true]:pointer-events-none data-[loading=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-6 [&_svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground icon-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground icon-destructive-foreground hover:bg-destructive/90",
+        outline: "border border-input bg-background hover:bg-accent hover:border-accent",
+        secondary: "bg-secondary border border-primary text-secondary-foreground icon-secondary-foreground hover:bg-accent active:bg-accent/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground hover:icon-accent-foreground",
+        link: "text-primary icon-primary underline-offset-4 hover:underline",
+        plain: "text-primary icon-primary hover:text-primary/80 w-max h-max",
+        "plain-error": "text-red-500 hover:text-red-500/80 w-max h-max",
+        icon: "bg-card text-foreground icon-foreground hover:bg-muted border border-border rounded-full shadow [&_svg]:size-6",
+        // Primary variants with solid colors
+        "primary-success": "bg-green-500 text-white icon-white hover:bg-green-600 active:bg-green-700",
+        "primary-warning": "bg-yellow-500 text-white icon-white hover:bg-yellow-600 active:bg-yellow-700",
+        "primary-info": "bg-blue-500 text-white icon-white hover:bg-primary active:bg-blue-700",
+        "primary-error": "bg-red-500 text-white icon-white hover:bg-red-600 active:bg-red-700",
+        // Soft variants with lighter backgrounds
+        "soft-success": "bg-green-50 text-green-600 icon-green-600 hover:bg-green-100 active:bg-green-200 border border-green-200",
+        "soft-warning": "bg-yellow-50 text-yellow-600 icon-yellow-600 hover:bg-yellow-100 active:bg-yellow-200 border border-yellow-200",
+        "soft-info": "bg-blue-50 text-primary icon-primary hover:bg-blue-100 active:bg-blue-200 border border-blue-200",
+        "soft-error": "bg-red-50 text-red-600 icon-red-600 hover:bg-red-100 active:bg-red-200 border border-red-200",
+        // Primary variants with solid colors
+        "heavy-success": "bg-green-500 text-white icon-white hover:bg-green-600 active:bg-green-700",
+        "heavy-warning": "bg-yellow-500 text-white icon-white hover:bg-yellow-600 active:bg-yellow-700",
+        "heavy-info": "bg-blue-500 text-white icon-white hover:bg-primary active:bg-blue-700",
+        "heavy-error": "bg-red-500 text-white icon-white hover:bg-red-600 active:bg-red-700",
+        // Soft variants with lighter backgrounds
+        "light-success": "bg-green-50 text-green-600 icon-green-600 hover:bg-green-100 active:bg-green-200 border border-green-200",
+        "light-warning": "bg-yellow-50 text-yellow-600 icon-yellow-600 hover:bg-yellow-100 active:bg-yellow-200 border border-yellow-200",
+        "light-info": "bg-blue-50 text-primary icon-primary hover:bg-blue-100 active:bg-blue-200 border border-blue-200",
+        "light-error": "bg-red-50 text-red-600 icon-red-600 hover:bg-red-100 active:bg-red-200 border border-red-200",
+        // Outline variants with borders
+        "outline-success": "border border-green-500 bg-transparent text-green-600 icon-green-600 hover:bg-green-50 active:bg-green-100",
+        "outline-warning": "border border-yellow-600 bg-transparent text-yellow-600 icon-yellow-600 hover:bg-yellow-50 active:bg-yellow-100",
+        "outline-info": "border border-blue-500 bg-transparent text-primary icon-primary hover:bg-blue-50 active:bg-blue-100",
+        "outline-error": "border border-red-500 bg-transparent text-red-600 icon-red-600 hover:bg-red-50 active:bg-red-100"
+      },
+      rounded: {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        md: "rounded-md",
+        lg: "rounded-lg",
+        xl: "rounded-xl",
+        full: "rounded-full"
+      },
+      size: {
+        default: "h-12 px-3 py-2",
+        sm: "h-10 px-3 py-2 [&_svg]:size-4",
+        lg: "h-14 px-3 py-2",
+        icon: "h-10 w-10"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      rounded: "md"
+    }
+  }
+);
+const Button = React.forwardRef(
+  ({
+    className,
+    trackingData,
+    trackingIndex,
+    trackingName,
+    blockSendTracking,
+    variant,
+    size,
+    rounded,
+    asChild = false,
+    loading = false,
+    children,
+    onClick,
+    disabled,
+    ...props
+  }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    const getSpinnerVariant = () => {
+      if (variant === "default" || variant === "primary-success" || variant === "primary-warning" || variant === "primary-info" || variant === "primary-error") {
+        return "white";
+      }
+      if (variant === "soft-success") return "success";
+      if (variant === "soft-warning") return "warning";
+      if (variant === "soft-info") return "info";
+      if (variant === "soft-error") return "error";
+      if (variant === "outline-success") return "success";
+      if (variant === "outline-warning") return "warning";
+      if (variant === "outline-info") return "info";
+      if (variant === "outline-error") return "error";
+      if (variant === "destructive") return "white";
+      return "primary";
+    };
+    const spinnerVariant = getSpinnerVariant();
+    const { sendTrack } = useUISystemContext() || {};
+    const onClickFn = (e) => {
+      if (disabled || loading) {
+        return;
+      }
+      onClick?.(e);
+      if (!sendTrack || blockSendTracking) return;
+      const targetElm = e.target;
+      const buttonText = targetElm.innerText || targetElm.textContent || "";
+      const finalTrackingName = trackingName || `click_btn_${trackingData?.identity}`;
+      const otherData = {};
+      if (trackingIndex !== void 0 && trackingIndex !== null) {
+        otherData.index = trackingIndex;
+      }
+      const mergedTrackingData = { ...trackingData };
+      if (!mergedTrackingData.object_name && buttonText) {
+        mergedTrackingData.object_name = buttonText.trim();
+      }
+      sendTrack(finalTrackingName, TRACKING_TYPE.click, {
+        ...otherData,
+        ...mergedTrackingData
+      });
+    };
+    const isIconElement = (element) => {
+      if (element.type === "svg") {
+        return true;
+      }
+      const getComponentName = (type) => {
+        if (!type) return "";
+        if (type.displayName) return type.displayName;
+        if (type.name) return type.name;
+        if (type.$$typeof === /* @__PURE__ */ Symbol.for("react.memo") && type.type) {
+          return getComponentName(type.type);
+        }
+        if (type.$$typeof === /* @__PURE__ */ Symbol.for("react.forward_ref") && type.render) {
+          return getComponentName(type.render);
+        }
+        return "";
+      };
+      if (element.type) {
+        const componentName = getComponentName(element.type);
+        const lowerName = componentName.toLowerCase();
+        if (lowerName.includes("icon") || lowerName.includes("svg") || componentName.match(/Icon\d+$/) || // Matches Icon16, Icon24, etc.
+        componentName.match(/^[A-Z][a-zA-Z]*Icon/)) {
+          return true;
+        }
+      }
+      if (element.props?.className && typeof element.props.className === "string") {
+        const className2 = element.props.className;
+        if (className2.includes("ic-") || className2.includes("icon-")) {
+          return true;
+        }
+      }
+      if (element.props?.viewBox || element.props?.xmlns === "http://www.w3.org/2000/svg") {
+        return true;
+      }
+      return false;
+    };
+    const filterChildren = (children2) => {
+      return React.Children.map(children2, (child) => {
+        if (!React.isValidElement(child)) {
+          return child;
+        }
+        if (isIconElement(child)) {
+          return null;
+        }
+        if ((child.type === "div" || child.type === "span") && child.props?.children) {
+          const filteredChildren = filterChildren(child.props.children);
+          const hasContent = React.Children.toArray(filteredChildren).some(
+            (c) => c !== null && c !== void 0
+          );
+          if (!hasContent) {
+            return null;
+          }
+          return React.cloneElement(child, {}, filteredChildren);
+        }
+        return child;
+      });
+    };
+    const renderChildren = () => {
+      if (!loading) return children;
+      return filterChildren(children);
+    };
+    const finalRounded = size === "icon" && rounded === void 0 ? "full" : rounded;
+    return /* @__PURE__ */ jsxs(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, rounded: finalRounded, className })),
+        ref,
+        onClick: onClickFn,
+        disabled: disabled && !loading,
+        "data-loading": loading,
+        ...props,
+        children: [
+          loading && /* @__PURE__ */ jsx(Spinner, { size: "sm", variant: spinnerVariant }),
+          renderChildren()
+        ]
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+const buttonGroupVariants = cva("flex", {
+  variants: {
+    direction: {
+      horizontal: "space-x-3",
+      vertical: "space-y-2"
+    }
+  }
+});
+const ButtonGroup = React.forwardRef(
+  ({ asChild, className, direction = "horizontal", ...props }, ref) => {
+    const Comp = asChild ? Slot : "div";
+    return /* @__PURE__ */ jsx(Comp, { ref, className: cn(buttonGroupVariants({ direction, className })), ...props });
+  }
+);
+ButtonGroup.displayName = "ButtonGroup";
+
+export { Button, ButtonGroup, buttonVariants };
+//# sourceMappingURL=button.mjs.map
+//# sourceMappingURL=button.mjs.map

package/dist/components/button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/button.tsx"],"names":["className","children"],"mappings":"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","file":"button.mjs","sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport * as React from 'react';\n\nimport { TRACKING_TYPE, TrackingPropsType } from '@/lib/types';\nimport { cn } from '@/lib/utils';\nimport { useUISystemContext } from '@/providers/UISystemProvider';\nimport { Spinner } from './spinner';\n\nconst buttonVariants = cva(\n  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-base font-medium transition-colors focus-visible:outline-none disabled:pointer-events-none disabled:icon-muted-foreground disabled:text-muted-foreground disabled:bg-muted disabled:border-border data-[loading=true]:pointer-events-none data-[loading=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-6 [&_svg]:shrink-0',\n  {\n    variants: {\n      variant: {\n        default: 'bg-primary text-primary-foreground icon-primary-foreground hover:bg-primary/90',\n        destructive:\n          'bg-destructive text-destructive-foreground icon-destructive-foreground hover:bg-destructive/90',\n        outline: 'border border-input bg-background hover:bg-accent hover:border-accent',\n        secondary:\n          'bg-secondary border border-primary text-secondary-foreground icon-secondary-foreground hover:bg-accent active:bg-accent/80',\n        ghost: 'hover:bg-accent hover:text-accent-foreground hover:icon-accent-foreground',\n        link: 'text-primary icon-primary underline-offset-4 hover:underline',\n        plain: 'text-primary icon-primary hover:text-primary/80 w-max h-max',\n        'plain-error': 'text-red-500 hover:text-red-500/80 w-max h-max',\n        icon: 'bg-card text-foreground icon-foreground hover:bg-muted border border-border rounded-full shadow [&_svg]:size-6',\n        // Primary variants with solid colors\n        'primary-success':\n          'bg-green-500 text-white icon-white hover:bg-green-600 active:bg-green-700',\n        'primary-warning':\n          'bg-yellow-500 text-white icon-white hover:bg-yellow-600 active:bg-yellow-700',\n        'primary-info': 'bg-blue-500 text-white icon-white hover:bg-primary active:bg-blue-700',\n        'primary-error': 'bg-red-500 text-white icon-white hover:bg-red-600 active:bg-red-700',\n        // Soft variants with lighter backgrounds\n        'soft-success':\n          'bg-green-50 text-green-600 icon-green-600 hover:bg-green-100 active:bg-green-200 border border-green-200',\n        'soft-warning':\n          'bg-yellow-50 text-yellow-600 icon-yellow-600 hover:bg-yellow-100 active:bg-yellow-200 border border-yellow-200',\n        'soft-info':\n          'bg-blue-50 text-primary icon-primary hover:bg-blue-100 active:bg-blue-200 border border-blue-200',\n        'soft-error':\n          'bg-red-50 text-red-600 icon-red-600 hover:bg-red-100 active:bg-red-200 border border-red-200',\n\n        // Primary variants with solid colors\n        'heavy-success':\n          'bg-green-500 text-white icon-white hover:bg-green-600 active:bg-green-700',\n        'heavy-warning':\n          'bg-yellow-500 text-white icon-white hover:bg-yellow-600 active:bg-yellow-700',\n        'heavy-info': 'bg-blue-500 text-white icon-white hover:bg-primary active:bg-blue-700',\n        'heavy-error': 'bg-red-500 text-white icon-white hover:bg-red-600 active:bg-red-700',\n        // Soft variants with lighter backgrounds\n        'light-success':\n          'bg-green-50 text-green-600 icon-green-600 hover:bg-green-100 active:bg-green-200 border border-green-200',\n        'light-warning':\n          'bg-yellow-50 text-yellow-600 icon-yellow-600 hover:bg-yellow-100 active:bg-yellow-200 border border-yellow-200',\n        'light-info':\n          'bg-blue-50 text-primary icon-primary hover:bg-blue-100 active:bg-blue-200 border border-blue-200',\n        'light-error':\n          'bg-red-50 text-red-600 icon-red-600 hover:bg-red-100 active:bg-red-200 border border-red-200',\n\n        // Outline variants with borders\n        'outline-success':\n          'border border-green-500 bg-transparent text-green-600 icon-green-600 hover:bg-green-50 active:bg-green-100',\n        'outline-warning':\n          'border border-yellow-600 bg-transparent text-yellow-600 icon-yellow-600 hover:bg-yellow-50 active:bg-yellow-100',\n        'outline-info':\n          'border border-blue-500 bg-transparent text-primary icon-primary hover:bg-blue-50 active:bg-blue-100',\n        'outline-error':\n          'border border-red-500 bg-transparent text-red-600 icon-red-600 hover:bg-red-50 active:bg-red-100',\n      },\n      rounded: {\n        none: 'rounded-none',\n        sm: 'rounded-sm',\n        md: 'rounded-md',\n        lg: 'rounded-lg',\n        xl: 'rounded-xl',\n        full: 'rounded-full',\n      },\n      size: {\n        default: 'h-12 px-3 py-2',\n        sm: 'h-10 px-3 py-2 [&_svg]:size-4',\n        lg: 'h-14 px-3 py-2',\n        icon: 'h-10 w-10',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n      rounded: 'md',\n    },\n  },\n);\n\ninterface TrackingData {\n  [key: string]: any;\n  identity?: string;\n  object_name?: string; // UI button name\n}\n\nexport interface ButtonProps\n  extends\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    TrackingPropsType,\n    VariantProps<typeof buttonVariants> {\n  asChild?: boolean;\n  loading?: boolean;\n  trackingData?: TrackingData;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      trackingData,\n      trackingIndex,\n      trackingName,\n      blockSendTracking,\n      variant,\n      size,\n      rounded,\n      asChild = false,\n      loading = false,\n      children,\n      onClick,\n      disabled,\n      ...props\n    },\n    ref,\n  ) => {\n    const Comp = asChild ? Slot : 'button';\n\n    // Determine spinner color based on button variant to match text color\n    const getSpinnerVariant = ():\n      | 'white'\n      | 'primary'\n      | 'success'\n      | 'warning'\n      | 'info'\n      | 'error' => {\n      // Primary variants: white text/spinner on colored background\n      if (\n        variant === 'default' ||\n        variant === 'primary-success' ||\n        variant === 'primary-warning' ||\n        variant === 'primary-info' ||\n        variant === 'primary-error'\n      ) {\n        return 'white';\n      }\n\n      // Soft variants: colored text/spinner on light background\n      if (variant === 'soft-success') return 'success';\n      if (variant === 'soft-warning') return 'warning';\n      if (variant === 'soft-info') return 'info';\n      if (variant === 'soft-error') return 'error';\n\n      // Outline variants: colored text/spinner with colored border\n      if (variant === 'outline-success') return 'success';\n      if (variant === 'outline-warning') return 'warning';\n      if (variant === 'outline-info') return 'info';\n      if (variant === 'outline-error') return 'error';\n\n      // Destructive variant: white text/spinner on red background\n      if (variant === 'destructive') return 'white';\n\n      // Default for other variants (secondary, outline, ghost)\n      return 'primary';\n    };\n\n    const spinnerVariant = getSpinnerVariant();\n\n    const { sendTrack } = useUISystemContext() || {};\n\n    const onClickFn: React.MouseEventHandler<any> = (e) => {\n      if (disabled || loading) {\n        return;\n      }\n      onClick?.(e);\n\n      // Only track if sendTrack exists and tracking is not blocked\n      if (!sendTrack || blockSendTracking) return;\n\n      const targetElm = e.target as HTMLElement;\n      const buttonText = targetElm.innerText || targetElm.textContent || '';\n\n      // Auto-generate trackingName based on button type if not provided\n      const finalTrackingName = trackingName || `click_btn_${trackingData?.identity}`;\n\n      // Prepare tracking data\n      const otherData: Record<string, any> = {};\n      if (trackingIndex !== undefined && trackingIndex !== null) {\n        otherData.index = trackingIndex;\n      }\n\n      // Auto-extract object_name from button text if not provided\n      const mergedTrackingData = { ...trackingData };\n      if (!mergedTrackingData.object_name && buttonText) {\n        mergedTrackingData.object_name = buttonText.trim();\n      }\n\n      // Send tracking event\n      sendTrack(finalTrackingName, TRACKING_TYPE.click, {\n        ...otherData,\n        ...mergedTrackingData,\n      });\n    };\n\n    const isIconElement = (element: React.ReactElement): boolean => {\n      // Check if it's an SVG element directly\n      if (element.type === 'svg') {\n        return true;\n      }\n\n      // Get component name from various React wrapper types\n      const getComponentName = (type: any): string => {\n        if (!type) return '';\n\n        // Direct function/class component\n        if (type.displayName) return type.displayName;\n        if (type.name) return type.name;\n\n        // React.memo wrapped component\n        if (type.$$typeof === Symbol.for('react.memo') && type.type) {\n          return getComponentName(type.type);\n        }\n\n        // React.forwardRef wrapped component\n        if (type.$$typeof === Symbol.for('react.forward_ref') && type.render) {\n          return getComponentName(type.render);\n        }\n\n        return '';\n      };\n\n      // Check if element is a React component\n      if (element.type) {\n        const componentName = getComponentName(element.type);\n        const lowerName = componentName.toLowerCase();\n\n        // Check for icon-related component names\n        if (\n          lowerName.includes('icon') ||\n          lowerName.includes('svg') ||\n          componentName.match(/Icon\\d+$/) || // Matches Icon16, Icon24, etc.\n          componentName.match(/^[A-Z][a-zA-Z]*Icon/) // Matches CheckIcon, AddIcon, etc.\n        ) {\n          return true;\n        }\n      }\n\n      // Check className for icon-related classes\n      if (element.props?.className && typeof element.props.className === 'string') {\n        const className = element.props.className;\n        if (className.includes('ic-') || className.includes('icon-')) {\n          return true;\n        }\n      }\n\n      // Check if element has SVG-related props\n      if (element.props?.viewBox || element.props?.xmlns === 'http://www.w3.org/2000/svg') {\n        return true;\n      }\n\n      return false;\n    };\n\n    const filterChildren = (children: React.ReactNode): React.ReactNode => {\n      return React.Children.map(children, (child) => {\n        if (!React.isValidElement(child)) {\n          return child;\n        }\n\n        // If it's an icon element, hide it completely\n        if (isIconElement(child)) {\n          return null;\n        }\n\n        // If it's a wrapper (div/span) that might contain icons, filter recursively\n        if ((child.type === 'div' || child.type === 'span') && child.props?.children) {\n          const filteredChildren = filterChildren(child.props.children);\n\n          // If all children were filtered out, don't render the wrapper\n          const hasContent = React.Children.toArray(filteredChildren).some(\n            (c) => c !== null && c !== undefined,\n          );\n\n          if (!hasContent) {\n            return null;\n          }\n\n          return React.cloneElement(child, {}, filteredChildren);\n        }\n\n        return child;\n      });\n    };\n\n    const renderChildren = () => {\n      if (!loading) return children;\n\n      // When loading, filter out all icon elements but keep text content\n      return filterChildren(children);\n    };\n\n    // Auto-set rounded to 'full' for icon size if not explicitly provided\n    const finalRounded = size === 'icon' && rounded === undefined ? 'full' : rounded;\n\n    return (\n      <Comp\n        className={cn(buttonVariants({ variant, size, rounded: finalRounded, className }))}\n        ref={ref}\n        onClick={onClickFn}\n        disabled={disabled && !loading}\n        data-loading={loading}\n        {...props}\n      >\n        {loading && <Spinner size=\"sm\" variant={spinnerVariant} />}\n        {renderChildren()}\n      </Comp>\n    );\n  },\n);\nButton.displayName = 'Button';\n\nconst buttonGroupVariants = cva('flex', {\n  variants: {\n    direction: {\n      horizontal: 'space-x-3',\n      vertical: 'space-y-2',\n    },\n  },\n});\n\ninterface ButtonGroupProps\n  extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof buttonGroupVariants> {\n  asChild?: boolean;\n}\n\nconst ButtonGroup = React.forwardRef<HTMLDivElement, ButtonGroupProps>(\n  ({ asChild, className, direction = 'horizontal', ...props }, ref) => {\n    const Comp = asChild ? Slot : 'div';\n\n    return (\n      <Comp ref={ref} className={cn(buttonGroupVariants({ direction, className }))} {...props} />\n    );\n  },\n);\n\nButtonGroup.displayName = 'ButtonGroup';\n\nexport { Button, ButtonGroup, buttonVariants };\n"]}