fix(buttons): add tokens (patternfly#6127)

Author: mcoker

src/patternfly/components/Button/button--variations.hbs

@@ -0,0 +1,65 @@
+{{> button-list}}
+
+<br><br>
+
+<div><strong>Icon</strong></div>
+{{> button-list button--HasIcon=true}}
+
+<br><br>
+
+<div><strong>Icon end</strong></div>
+{{> button-list button--HasIconEnd=true}}
+
+{{#*inline "button-list"}}
+  {{#> button button--IsPrimary=true}}
+    Primary
+  {{/button}}
+
+  {{#> button button--IsSecondary=true}}
+    Secondary
+  {{/button}}
+
+  {{#> button button--IsSecondary=true button--IsDanger=true}}
+    Secondary danger
+  {{/button}}
+
+  {{#> button button--IsTertiary=true}}
+    Tertiary
+  {{/button}}
+
+  {{#> button button--IsDanger=true}}
+    Danger
+  {{/button}}
+
+  {{#> button button--IsWarning=true}}
+    Warning
+  {{/button}}
+
+  <br><br>
+
+  {{#> button button--IsLink=true}}
+    Link
+  {{/button}}
+
+  {{#> button button--IsLink=true button--IsDanger=true}}
+    Link danger
+  {{/button}}
+
+  {{#> button button--IsLink=true button--IsInline=true}}
+    Inline link
+  {{/button}}
+
+  {{#> button button--IsPlain=true button--attribute='aria-label="Remove"' button--HasIcon=false button--HasIconEnd=false}}
+    <i class="fas fa-times" aria-hidden="true"></i>
+  {{/button}}
+
+  <br><br>
+
+  {{#> button button--IsControl=true}}
+    Control
+  {{/button}}
+
+  {{#> button button--IsControl=true button--HasIcon=false button--HasIconEnd=false button--attribute='aria-label="Copy input"'}}
+    <i class="fas fa-copy" aria-hidden="true"></i>
+  {{/button}}
+{{/inline}}

src/patternfly/components/Button/button.hbs

@@ -1,9 +1,19 @@
 <{{#if button--type}}{{button--type}}{{else if button--IsInlineLinkSpan}}span{{else if button--IsAnchor}}a{{else}}button{{/if}} class="{{pfv}}button
+  {{#if button--IsPrimary}} pf-m-primary{{/if}}
+  {{#if button--IsSecondary}} pf-m-secondary{{/if}}
+  {{#if button--IsTertiary}} pf-m-tertiary{{/if}}
+  {{#if button--IsWarning}} pf-m-warning{{/if}}
+  {{#if button--IsDanger}} pf-m-danger{{/if}}
+  {{#if button--IsLink}} pf-m-link{{/if}}
+  {{#if button--IsPlain}} pf-m-plain{{/if}}
+  {{#if button--IsInline}} pf-m-inline{{/if}}
+  {{#if button--IsControl}} pf-m-control{{/if}}
   {{#if button--IsExpanded}} pf-m-expanded{{/if}}
   {{#if button--IsProgress}} pf-m-progress{{/if}}
   {{#if button--IsInProgress}} pf-m-in-progress{{/if}}
-  {{#if button--IsInline}} pf-m-inline{{/if}}
-  {{#if button--IsPlain}} pf-m-plain{{/if}}
+  {{#if button--IsAriaDisabled}} pf-m-aria-disabled{{/if}}
+  {{#if button--IsSmall}} pf-m-small{{/if}}
+  {{#if button--IsClicked}} pf-m-clicked{{/if}}
   {{#if button--IsDisabled}}
     {{#if (concat button--type button--IsInlineLinkSpan button--IsAnchor)}}
       pf-m-disabled
@@ -29,6 +39,9 @@
   {{#if button--aria-label}}
     aria-label="{{button--aria-label}}"
   {{/if}}
+  {{#if button--IsAriaDisabled}}
+    aria-disabled="true"
+  {{/if}}
   {{#if button--IsDisabled}}
     {{#unless (concat button--type button--IsInlineLinkSpan button--IsAnchor)}}
       disabled
@@ -43,5 +56,15 @@
   {{#if button--IsInProgress}}
     {{> button-progress}}
   {{/if}}
+  {{#if button--HasIcon}}
+    {{#> button-icon button-icon--modifier="pf-m-start"}}
+      <i class="fas fa-plus-circle" aria-hidden="true"></i>
+    {{/button-icon}}
+  {{/if}}
   {{> @partial-block}}
+  {{#if button--HasIconEnd}}
+    {{#> button-icon button-icon--modifier="pf-m-end"}}
+      <i class="fas fa-plus-circle" aria-hidden="true"></i>
+    {{/button-icon}}
+  {{/if}}
 </{{#if button--type}}{{button--type}}{{else if button--IsInlineLinkSpan}}span{{else if button--IsAnchor}}a{{else}}button{{/if}}>