add option to show a caret in a umb-button

src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbutton.directive.js

@@ -66,6 +66,7 @@ Use this directive to render an umbraco button. The directive can be used to gen
 @param {string=} size Set a button icon ("xs", "m", "l", "xl").
 @param {boolean=} disabled Set to <code>true</code> to disable the button.
 @param {string=} addEllipsis Adds an ellipsis character (…) to the button label which means the button will open a dialog or prompt the user for more information.
+@param {string=} showCaret Shows a caret on the right side of the button label
 
 **/
 
@@ -93,7 +94,8 @@ Use this directive to render an umbraco button. The directive can be used to gen
                 disabled: "<?",
                 size: "@?",
                 alias: "@?",
-                addEllipsis: "@?"
+                addEllipsis: "@?",
+                showCaret: "@?"
             }
         });
 

src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button.less

@@ -29,6 +29,11 @@
    opacity: 0;
 }
 
+.umb-button .umb-button__caret {
+   margin-top: 0;
+   margin-left: 3px;
+}
+
 .umb-button__progress {
    position: absolute;
    left: 50%;

src/Umbraco.Web.UI.Client/src/views/components/buttons/umb-button.html

@@ -11,6 +11,7 @@
         <span class="umb-button__content" ng-class="{'-hidden': vm.innerState !== 'init'}">
             <i ng-if="vm.icon" class="{{vm.icon}} umb-button__icon"></i>
             {{vm.buttonLabel}}
+            <span ng-if="vm.showCaret" class="umb-button__caret caret"></span>
         </span>
     </a>
 
@@ -18,6 +19,7 @@
         <span class="umb-button__content" ng-class="{'-hidden': vm.innerState !== 'init'}">
             <i ng-if="vm.icon" class="{{vm.icon}} umb-button__icon"></i>
             {{vm.buttonLabel}}
+            <span ng-if="vm.showCaret" class="umb-button__caret caret"></span>
         </span>
     </button>
 
@@ -25,6 +27,7 @@
         <span class="umb-button__content" ng-class="{'-hidden': vm.innerState !== 'init'}">
             <i ng-if="vm.icon" class="{{vm.icon}} umb-button__icon"></i>
             {{vm.buttonLabel}}
+            <span ng-if="vm.showCaret" class="umb-button__caret caret"></span>
         </span>
     </button>