pure-react-ui 1.2.0 → 1.4.0

package/dist/index.js.map

@@ -1 +0,0 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AGqCO,MAAM,4CAAgC,CAAC,YAC5C,QAAQ,WACR,UAAU,iBACV,OAAO,mBACP,UAAU,iBACV,QAAQ,aACR,SAAS,aACT,YAAY,iBACZ,WAAW,gBACX,UAAU,kBACV,YAAY,gBACZ,SAAS,iBACT,YAAY,aACZ,OAAO,EACP,GAAG,MACJ;IACC,MAAM,aAAa,YAAY;IAC/B,MAAM,YAAY,CAAA,GAAA,sCAAI,EAAE,MAAM,CAAoB;IAElD,MAAM,cAAc,CAAC;QACnB,IAAI,UAAU,CAAC,cAAc,UAAU,OAAO,EAC5C,aAAa,GAAG,UAAU,OAAO;QAEnC,IAAI,WAAW,CAAC,YACd,QAAQ;IAEZ;IAEA,MAAM,eAAe,CAAC,OAA4C;QAChE,MAAM,SAAS,SAAS,aAAa,CAAC;QACtC,MAAM,OAAO,OAAO,qBAAqB;QACzC,MAAM,OAAO,KAAK,GAAG,CAAC,KAAK,KAAK,EAAE,KAAK,MAAM;QAC7C,MAAM,IAAI,MAAM,OAAO,GAAG,KAAK,IAAI,GAAG,OAAO;QAC7C,MAAM,IAAI,MAAM,OAAO,GAAG,KAAK,GAAG,GAAG,OAAO;QAE5C,OAAO,KAAK,CAAC,KAAK,GAAG,OAAO,KAAK,CAAC,MAAM,GAAG,GAAG,KAAK,EAAE,CAAC;QACtD,OAAO,KAAK,CAAC,IAAI,GAAG,GAAG,EAAE,EAAE,CAAC;QAC5B,OAAO,KAAK,CAAC,GAAG,GAAG,GAAG,EAAE,EAAE,CAAC;QAC3B,OAAO,SAAS,CAAC,GAAG,CAAC;QAErB,MAAM,iBAAiB,OAAO,aAAa,CAAC;QAC5C,IAAI,gBACF,eAAe,MAAM;QAGvB,OAAO,WAAW,CAAC;QAEnB,WAAW;YACT,OAAO,MAAM;QACf,GAAG;IACL;IAEA,qBACE,iCAAC;QACC,KAAK;QACL,WAAW,CAAC,gBAAgB,EAAE,QAAQ,SAAS,EAAE,KAAK,CAAC,EAAE,YAAY,iBAAiB,GAAG,CAAC,EACxF,UAAU,oBAAoB,GAC/B,mBAAmB,EAAE,UAAU,CAAC,EAAE,WAAW;QAC9C,UAAU;QACV,iBAAe;QACf,aAAW;QACX,SAAS;QACR,GAAG,IAAI;;YAEP,yBACC,gCAAC;gBAAK,WAAU;gBAAkB,eAAY;0BAC5C,cAAA,gCAAC;oBAAK,WAAU;;;YAGnB,YAAY,CAAC,yBAAW,gCAAC;gBAAK,WAAU;0BAAqB;;0BAC9D,gCAAC;gBAAK,WAAU;0BAAmB;;YAClC,aAAa,CAAC,yBAAW,gCAAC;gBAAK,WAAU;0BAAsB;;;;AAGtE","sources":["index.ts","components/index.ts","components/Button/index.ts","components/Button/Button.tsx"],"sourcesContent":["export * from './components';","export * from './Button';","export { Button } from './Button';\r\nexport type { ButtonProps } from './Button';","import React from 'react';\r\nimport './Button.css';\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n  children: React.ReactNode;\r\n  variant?:\r\n    | 'primary'\r\n    | 'secondary'\r\n    | 'success'\r\n    | 'danger'\r\n    | 'warning'\r\n    | 'info'\r\n    | 'outline-primary'\r\n    | 'outline-secondary'\r\n    | 'outline-success'\r\n    | 'outline-danger'\r\n    | 'outline-warning'\r\n    | 'outline-info'\r\n    | 'ghost-primary'\r\n    | 'ghost-secondary'\r\n    | 'ghost-success'\r\n    | 'ghost-danger'\r\n    | 'ghost-warning'\r\n    | 'ghost-info'\r\n    | 'gradient-primary'\r\n    | 'gradient-success'\r\n    | 'gradient-danger';\r\n  size?: 'xs' | 'small' | 'medium' | 'large' | 'xl';\r\n  loading?: boolean;\r\n  iconLeft?: React.ReactNode;\r\n  iconRight?: React.ReactNode;\r\n  fullWidth?: boolean;\r\n  rounded?: boolean;\r\n  elevation?: 'none' | 'sm' | 'md' | 'lg';\r\n  ripple?: boolean;\r\n}\r\n\r\nexport const Button: React.FC<ButtonProps> = ({\r\n  children,\r\n  variant = 'primary',\r\n  size = 'medium',\r\n  loading = false,\r\n  iconLeft,\r\n  iconRight,\r\n  fullWidth = false,\r\n  disabled = false,\r\n  rounded = false,\r\n  elevation = 'none',\r\n  ripple = true,\r\n  className = '',\r\n  onClick,\r\n  ...rest\r\n}) => {\r\n  const isDisabled = disabled || loading;\r\n  const buttonRef = React.useRef<HTMLButtonElement>(null);\r\n\r\n  const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\r\n    if (ripple && !isDisabled && buttonRef.current) {\r\n      createRipple(e, buttonRef.current);\r\n    }\r\n    if (onClick && !isDisabled) {\r\n      onClick(e);\r\n    }\r\n  };\r\n\r\n  const createRipple = (event: React.MouseEvent<HTMLButtonElement>, button: HTMLButtonElement) => {\r\n    const ripple = document.createElement('span');\r\n    const rect = button.getBoundingClientRect();\r\n    const size = Math.max(rect.width, rect.height);\r\n    const x = event.clientX - rect.left - size / 2;\r\n    const y = event.clientY - rect.top - size / 2;\r\n\r\n    ripple.style.width = ripple.style.height = `${size}px`;\r\n    ripple.style.left = `${x}px`;\r\n    ripple.style.top = `${y}px`;\r\n    ripple.classList.add('pru-btn-ripple');\r\n\r\n    const existingRipple = button.querySelector('.pru-btn-ripple');\r\n    if (existingRipple) {\r\n      existingRipple.remove();\r\n    }\r\n\r\n    button.appendChild(ripple);\r\n\r\n    setTimeout(() => {\r\n      ripple.remove();\r\n    }, 600);\r\n  };\r\n\r\n  return (\r\n    <button\r\n      ref={buttonRef}\r\n      className={`pru-btn pru-btn-${variant} pru-btn-${size} ${fullWidth ? 'pru-btn-full' : ''} ${\r\n        rounded ? 'pru-btn-rounded' : ''\r\n      } pru-btn-elevation-${elevation} ${className}`}\r\n      disabled={isDisabled}\r\n      aria-disabled={isDisabled}\r\n      aria-busy={loading}\r\n      onClick={handleClick}\r\n      {...rest}\r\n    >\r\n      {loading && (\r\n        <span className=\"pru-btn-spinner\" aria-hidden=\"true\">\r\n          <span className=\"pru-btn-spinner-inner\"></span>\r\n        </span>\r\n      )}\r\n      {iconLeft && !loading && <span className=\"pru-btn-icon-left\">{iconLeft}</span>}\r\n      <span className=\"pru-btn-content\">{children}</span>\r\n      {iconRight && !loading && <span className=\"pru-btn-icon-right\">{iconRight}</span>}\r\n    </button>\r\n  );\r\n};"],"names":[],"version":3,"file":"index.js.map"}