From ce30f9030b6c120978e7eff0f1093220af71b964 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ula=C5=9F=20Turan?=
 <56156254+ulasturann@users.noreply.github.com>
Date: Fri, 3 Mar 2023 16:59:22 +0300
Subject: [PATCH] Fix #4093: Button: Size 'large' or 'lg' (#4121)

* Fix #4093: Button: Size 'large' or 'lg'

* Update API doc

---------

Co-authored-by: GitHub Actions Bot <>
---
 components/doc/common/apidoc/index.json | 4 ++--
 components/lib/button/Button.js         | 7 ++++++-
 components/lib/button/button.d.ts       | 4 ++--
 3 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/components/doc/common/apidoc/index.json b/components/doc/common/apidoc/index.json
index 4c22e76754..f585db0206 100644
--- a/components/doc/common/apidoc/index.json
+++ b/components/doc/common/apidoc/index.json
@@ -3228,9 +3228,9 @@
                             "name": "size",
                             "optional": true,
                             "readonly": false,
-                            "type": "\"sm\" | \"lg\"",
+                            "type": "\"small\" | \"large\"",
                             "default": "",
-                            "description": "Defines the size of the button, valid values are \"sm\" and \"lg\"."
+                            "description": "Defines the size of the button, valid values are \"small\" and \"large\"."
                         },
                         {
                             "name": "text",
diff --git a/components/lib/button/Button.js b/components/lib/button/Button.js
index ea65596d9e..79e3a927c3 100644
--- a/components/lib/button/Button.js
+++ b/components/lib/button/Button.js
@@ -50,6 +50,11 @@ export const Button = React.memo(
         const showTooltip = !disabled || (props.tooltipOptions && props.tooltipOptions.showOnDisabled);
         const hasTooltip = ObjectUtils.isNotEmpty(props.tooltip) && showTooltip;
         const otherProps = ButtonBase.getOtherProps(props);
+        const sizeMapping = {
+            large: 'lg',
+            small: 'sm'
+        };
+        const size = sizeMapping[props.size];
         const className = classNames('p-button p-component', props.className, {
             'p-button-icon-only': (props.icon || (props.loading && props.loadingIcon)) && !props.label && !props.children,
             'p-button-vertical': (props.iconPos === 'top' || props.iconPos === 'bottom') && props.label,
@@ -62,7 +67,7 @@ export const Button = React.memo(
             'p-button-rounded': props.rounded,
             'p-button-loading-label-only': props.loading && !props.icon && props.label,
             [`p-button-loading-${props.iconPos}`]: props.loading && props.loadingIcon && props.label,
-            [`p-button-${props.size}`]: props.size,
+            [`p-button-${size}`]: size,
             [`p-button-${props.severity}`]: props.severity
         });
 
diff --git a/components/lib/button/button.d.ts b/components/lib/button/button.d.ts
index 3f4774edc1..ef3bed212b 100644
--- a/components/lib/button/button.d.ts
+++ b/components/lib/button/button.d.ts
@@ -68,9 +68,9 @@ export interface ButtonProps extends Omit<React.DetailedHTMLProps<React.ButtonHT
      */
     severity?: 'secondary' | 'success' | 'info' | 'warning' | 'danger' | 'help' | undefined;
     /**
-     * Defines the size of the button, valid values are "sm" and "lg".
+     * Defines the size of the button, valid values are "small" and "large".
      */
-    size?: 'sm' | 'lg' | undefined;
+    size?: 'small' | 'large' | undefined;
     /**
      * Position of the icon, valid values are "left", "right", "top" and "bottom".
      * @defaultValue left