diff --git a/ee/spec/frontend/audit_events/components/__snapshots__/audit_events_export_button_spec.js.snap b/ee/spec/frontend/audit_events/components/__snapshots__/audit_events_export_button_spec.js.snap
index b2f19b06699e95d0a3946f5ec02c399bb1982ff8..390f7a79f97c69541fba0a6c4cb359852a4791ec 100644
--- a/ee/spec/frontend/audit_events/components/__snapshots__/audit_events_export_button_spec.js.snap
+++ b/ee/spec/frontend/audit_events/components/__snapshots__/audit_events_export_button_spec.js.snap
@@ -2,6 +2,7 @@
 
 exports[`AuditEventsExportButton component Audit Events CSV export button matches the snapshot 1`] = `
 <gl-button-stub
+  buttontextclasses=""
   category="primary"
   href="http://example.com/audit_log_reports.csv?created_after=2020-12-12"
   icon="export"
diff --git a/ee/spec/frontend/compliance_dashboard/components/merge_requests/__snapshots__/merge_commits_export_button_spec.js.snap b/ee/spec/frontend/compliance_dashboard/components/merge_requests/__snapshots__/merge_commits_export_button_spec.js.snap
index 31a4af66ea12e08e8b698e796840cbb07f540056..231c127283f268e15b00eb3a2a854114ab8970f9 100644
--- a/ee/spec/frontend/compliance_dashboard/components/merge_requests/__snapshots__/merge_commits_export_button_spec.js.snap
+++ b/ee/spec/frontend/compliance_dashboard/components/merge_requests/__snapshots__/merge_commits_export_button_spec.js.snap
@@ -3,6 +3,7 @@
 exports[`MergeCommitsExportButton component Merge commit CSV export button matches the snapshot 1`] = `
 <div>
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     class="gl-align-self-center"
     href="/merge_commit_reports"
diff --git a/ee/spec/frontend/dependencies/components/__snapshots__/dependencies_actions_spec.js.snap b/ee/spec/frontend/dependencies/components/__snapshots__/dependencies_actions_spec.js.snap
index 4dbbb595504e9f9d68df3bcd1a722c82f46e7eeb..4c33a4a4df577b4979d5e4fe7c8bbba7b5ff96aa 100644
--- a/ee/spec/frontend/dependencies/components/__snapshots__/dependencies_actions_spec.js.snap
+++ b/ee/spec/frontend/dependencies/components/__snapshots__/dependencies_actions_spec.js.snap
@@ -79,6 +79,7 @@ exports[`DependenciesActions component matches the snapshot 1`] = `
     </gl-dropdown-stub>
      
     <gl-button-stub
+      buttontextclasses=""
       category="primary"
       class="flex-grow-0 js-sort-order"
       icon=""
@@ -94,6 +95,7 @@ exports[`DependenciesActions component matches the snapshot 1`] = `
   </div>
    
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     class="js-download"
     download="dependencies.json"
diff --git a/ee/spec/frontend/environments_dashboard/components/__snapshots__/dashboard_spec.js.snap b/ee/spec/frontend/environments_dashboard/components/__snapshots__/dashboard_spec.js.snap
index 0433bbe14c7c57bd9410d54e681e7f8e6fb86edd..71804261bb3a71587ebbfda3632b6d573eec9f3b 100644
--- a/ee/spec/frontend/environments_dashboard/components/__snapshots__/dashboard_spec.js.snap
+++ b/ee/spec/frontend/environments_dashboard/components/__snapshots__/dashboard_spec.js.snap
@@ -33,6 +33,7 @@ exports[`dashboard should match the snapshot 1`] = `
     </h1>
      
     <gl-button-stub
+      buttontextclasses=""
       category="primary"
       class="js-add-projects-button"
       icon=""
diff --git a/ee/spec/frontend/environments_dashboard/components/__snapshots__/project_header_spec.js.snap b/ee/spec/frontend/environments_dashboard/components/__snapshots__/project_header_spec.js.snap
index a0617a6a74f1aa721a0b57217f58f4baf8c8347c..26cef836970a4ce3504e07fa7aa54b16c5186dcc 100644
--- a/ee/spec/frontend/environments_dashboard/components/__snapshots__/project_header_spec.js.snap
+++ b/ee/spec/frontend/environments_dashboard/components/__snapshots__/project_header_spec.js.snap
@@ -68,6 +68,7 @@ exports[`Project Header matches the snapshot 1`] = `
     >
       <li>
         <gl-button-stub
+          buttontextclasses=""
           category="primary"
           class="js-remove-button"
           icon=""
diff --git a/ee/spec/frontend/projects/components/__snapshots__/project_adjourned_delete_button_spec.js.snap b/ee/spec/frontend/projects/components/__snapshots__/project_adjourned_delete_button_spec.js.snap
index 42f6bd33998efdfec0ea70da1aec4f58eb0197b3..14914632a3ffa8a79dbe5362174fb4e46f5bea89 100644
--- a/ee/spec/frontend/projects/components/__snapshots__/project_adjourned_delete_button_spec.js.snap
+++ b/ee/spec/frontend/projects/components/__snapshots__/project_adjourned_delete_button_spec.js.snap
@@ -17,6 +17,7 @@ exports[`Project remove modal initialized matches the snapshot 1`] = `
   />
    
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     icon=""
     role="button"
diff --git a/ee/spec/frontend/status_page_settings/__snapshots__/settings_form_spec.js.snap b/ee/spec/frontend/status_page_settings/__snapshots__/settings_form_spec.js.snap
index d275ee45c615591977672d2d18276096f48bb193..d2ae45a9aba46755dce86379a70d1c5cd777db8b 100644
--- a/ee/spec/frontend/status_page_settings/__snapshots__/settings_form_spec.js.snap
+++ b/ee/spec/frontend/status_page_settings/__snapshots__/settings_form_spec.js.snap
@@ -17,6 +17,7 @@ exports[`Status Page settings form default state should match the default snapsh
     </h4>
      
     <gl-button-stub
+      buttontextclasses=""
       category="primary"
       class="js-settings-toggle"
       icon=""
@@ -148,6 +149,7 @@ exports[`Status Page settings form default state should match the default snapsh
         class="gl-display-flex gl-justify-content-end"
       >
         <gl-button-stub
+          buttontextclasses=""
           category="primary"
           class="js-no-auto-disable"
           icon=""
diff --git a/ee/spec/frontend/threat_monitoring/components/policy_editor/__snapshots__/policy_editor_spec.js.snap b/ee/spec/frontend/threat_monitoring/components/policy_editor/__snapshots__/policy_editor_spec.js.snap
index f50340ad1308e09db797e7e3533c1fa78bbd5e35..effc823d36caa8df58121abf850810dae5471202 100644
--- a/ee/spec/frontend/threat_monitoring/components/policy_editor/__snapshots__/policy_editor_spec.js.snap
+++ b/ee/spec/frontend/threat_monitoring/components/policy_editor/__snapshots__/policy_editor_spec.js.snap
@@ -161,6 +161,7 @@ exports[`PolicyEditorApp component renders the policy editor layout 1`] = `
         class="gl-p-3 gl-rounded-base gl-border-1 gl-border-solid gl-border-gray-100 gl-mb-5"
       >
         <gl-button-stub
+          buttontextclasses=""
           category="primary"
           data-testid="add-rule"
           icon=""
@@ -216,6 +217,7 @@ spec:
       class="col-md-auto"
     >
       <gl-button-stub
+        buttontextclasses=""
         category="primary"
         data-testid="save-policy"
         icon=""
@@ -229,6 +231,7 @@ spec:
       <!---->
        
       <gl-button-stub
+        buttontextclasses=""
         category="secondary"
         href="/threat-monitoring"
         icon=""
diff --git a/package.json b/package.json
index ca76e4cab0b587990372bc7d11fdea7db1e8ebc2..307c24c80ce001b26705e7b1c22f9b11066b988d 100644
--- a/package.json
+++ b/package.json
@@ -43,7 +43,7 @@
     "@babel/preset-env": "^7.10.1",
     "@gitlab/at.js": "1.5.5",
     "@gitlab/svgs": "1.164.0",
-    "@gitlab/ui": "21.3.1",
+    "@gitlab/ui": "21.4.2",
     "@gitlab/visual-review-tools": "1.6.1",
     "@rails/actioncable": "^6.0.3-1",
     "@sentry/browser": "^5.22.3",
diff --git a/spec/frontend/add_context_commits_modal/components/__snapshots__/add_context_commits_modal_spec.js.snap b/spec/frontend/add_context_commits_modal/components/__snapshots__/add_context_commits_modal_spec.js.snap
deleted file mode 100644
index 5fad0d07f97008c9a2e47f44ff668face63e1b59..0000000000000000000000000000000000000000
--- a/spec/frontend/add_context_commits_modal/components/__snapshots__/add_context_commits_modal_spec.js.snap
+++ /dev/null
@@ -1,50 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`AddContextCommitsModal renders modal with 2 tabs 1`] = `
-<gl-modal-stub
-  body-class="add-review-item pt-0"
-  cancel-variant="light"
-  modalclass=""
-  modalid="add-review-item"
-  ok-disabled="true"
-  ok-title="Save changes"
-  scrollable="true"
-  size="md"
-  title="Add or remove previously merged commits"
-  titletag="h4"
->
-  <gl-tabs-stub
-    contentclass="pt-0"
-    theme="indigo"
-    value="0"
-  >
-    <gl-tab-stub>
-       
-      <div
-        class="mt-2"
-      >
-        <gl-search-box-by-type-stub
-          clearbuttontitle="Clear"
-          placeholder="Search by commit title or SHA"
-          value=""
-        />
-         
-        <review-tab-container-stub
-          commits=""
-          emptylisttext="Your search didn't match any commits. Try a different query."
-          loadingfailedtext="Unable to load commits. Try again later."
-        />
-      </div>
-    </gl-tab-stub>
-     
-    <gl-tab-stub>
-       
-      <review-tab-container-stub
-        commits=""
-        emptylisttext="Commits you select appear here. Go to the first tab and select commits to add to this merge request."
-        loadingfailedtext="Unable to load commits. Try again later."
-      />
-    </gl-tab-stub>
-  </gl-tabs-stub>
-</gl-modal-stub>
-`;
diff --git a/spec/frontend/alert_settings/__snapshots__/alert_settings_form_spec.js.snap b/spec/frontend/alert_settings/__snapshots__/alert_settings_form_spec.js.snap
index 16e92bf505a5d0f0c53a29b3baa24be805b31d47..a65d1eae2e380e74cead5381d860751160a1352d 100644
--- a/spec/frontend/alert_settings/__snapshots__/alert_settings_form_spec.js.snap
+++ b/spec/frontend/alert_settings/__snapshots__/alert_settings_form_spec.js.snap
@@ -26,7 +26,7 @@ exports[`AlertsSettingsForm with default values renders the initial template 1`]
     </gl-form-group-stub>
     <gl-form-group-stub label=\\"Authorization key\\" label-for=\\"authorization-key\\" label-class=\\"label-bold\\">
       <gl-form-input-group-stub value=\\"abcedfg123\\" predefinedoptions=\\"[object Object]\\" id=\\"authorization-key\\" readonly=\\"\\" class=\\"gl-mb-2\\"></gl-form-input-group-stub>
-      <gl-button-stub category=\\"primary\\" variant=\\"default\\" size=\\"medium\\" icon=\\"\\" disabled=\\"true\\" class=\\"gl-mt-3\\" role=\\"button\\" tabindex=\\"0\\">Reset key</gl-button-stub>
+      <gl-button-stub category=\\"primary\\" variant=\\"default\\" size=\\"medium\\" icon=\\"\\" buttontextclasses=\\"\\" disabled=\\"true\\" class=\\"gl-mt-3\\" role=\\"button\\" tabindex=\\"0\\">Reset key</gl-button-stub>
       <gl-modal-stub modalid=\\"authKeyModal\\" titletag=\\"h4\\" modalclass=\\"\\" size=\\"md\\" title=\\"Reset key\\" ok-title=\\"Reset key\\" ok-variant=\\"danger\\">
         Resetting the authorization key for this project will require updating the authorization key in every alert source it is enabled in.
       </gl-modal-stub>
@@ -35,13 +35,13 @@ exports[`AlertsSettingsForm with default values renders the initial template 1`]
       <gl-form-textarea-stub noresize=\\"true\\" id=\\"alert-json\\" disabled=\\"true\\" state=\\"true\\" placeholder=\\"Enter test alert JSON....\\" rows=\\"6\\" max-rows=\\"10\\"></gl-form-textarea-stub>
     </gl-form-group-stub>
     <div class=\\"gl-display-flex gl-justify-content-end\\">
-      <gl-button-stub category=\\"primary\\" variant=\\"default\\" size=\\"medium\\" icon=\\"\\" disabled=\\"true\\">Test alert payload</gl-button-stub>
+      <gl-button-stub category=\\"primary\\" variant=\\"default\\" size=\\"medium\\" icon=\\"\\" buttontextclasses=\\"\\" disabled=\\"true\\">Test alert payload</gl-button-stub>
     </div>
     <div class=\\"footer-block row-content-block gl-display-flex gl-justify-content-space-between\\">
-      <gl-button-stub category=\\"primary\\" variant=\\"default\\" size=\\"medium\\" icon=\\"\\" disabled=\\"true\\">
+      <gl-button-stub category=\\"primary\\" variant=\\"default\\" size=\\"medium\\" icon=\\"\\" buttontextclasses=\\"\\" disabled=\\"true\\">
         Cancel
       </gl-button-stub>
-      <gl-button-stub category=\\"primary\\" variant=\\"success\\" size=\\"medium\\" icon=\\"\\" disabled=\\"true\\">
+      <gl-button-stub category=\\"primary\\" variant=\\"success\\" size=\\"medium\\" icon=\\"\\" buttontextclasses=\\"\\" disabled=\\"true\\">
         Save changes
       </gl-button-stub>
     </div>
diff --git a/spec/frontend/code_navigation/components/__snapshots__/popover_spec.js.snap b/spec/frontend/code_navigation/components/__snapshots__/popover_spec.js.snap
index 745a163951a655b066c9c178655ef56606bcbf4c..62b751ec59b07c9810a2a80fbd4c19000fb5136e 100644
--- a/spec/frontend/code_navigation/components/__snapshots__/popover_spec.js.snap
+++ b/spec/frontend/code_navigation/components/__snapshots__/popover_spec.js.snap
@@ -56,6 +56,7 @@ exports[`Code navigation popover component renders popover 1`] = `
         class="popover-body border-top"
       >
         <gl-button-stub
+          buttontextclasses=""
           category="primary"
           class="w-100"
           data-testid="go-to-definition-btn"
diff --git a/spec/frontend/design_management/components/toolbar/__snapshots__/design_navigation_spec.js.snap b/spec/frontend/design_management/components/toolbar/__snapshots__/design_navigation_spec.js.snap
index a7d6145285c28540d419bf8c364e98fa8d4459d1..f6a941fc99c284d4275dd910d4f723b95ebbf3fd 100644
--- a/spec/frontend/design_management/components/toolbar/__snapshots__/design_navigation_spec.js.snap
+++ b/spec/frontend/design_management/components/toolbar/__snapshots__/design_navigation_spec.js.snap
@@ -13,6 +13,7 @@ exports[`Design management pagination component renders navigation buttons 1`] =
     class="ml-3 mr-3"
   >
     <gl-button-stub
+      buttontextclasses=""
       category="primary"
       class="js-previous-design"
       disabled="true"
@@ -23,6 +24,7 @@ exports[`Design management pagination component renders navigation buttons 1`] =
     />
      
     <gl-button-stub
+      buttontextclasses=""
       category="primary"
       class="js-next-design"
       icon="angle-right"
diff --git a/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap b/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap
index b286a74ebb8d00e7639d1f43e58ded546e4e1263..adf713d0811c3fd2602d3dae5cf6cb39e5b644d8 100644
--- a/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap
+++ b/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap
@@ -41,6 +41,7 @@ exports[`Design management toolbar component renders design and updated data 1`]
   />
    
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     href="/-/designs/306/7f747adcd4693afadbe968d7ba7d983349b9012d"
     icon="download"
diff --git a/spec/frontend/design_management/components/upload/__snapshots__/button_spec.js.snap b/spec/frontend/design_management/components/upload/__snapshots__/button_spec.js.snap
index 3d7939df28e861abdfb25ad77a602fa458907898..eaa7460ae151345a1a6db19e8cc0a6d6fb8115d3 100644
--- a/spec/frontend/design_management/components/upload/__snapshots__/button_spec.js.snap
+++ b/spec/frontend/design_management/components/upload/__snapshots__/button_spec.js.snap
@@ -5,6 +5,7 @@ exports[`Design management upload button component renders inverted upload desig
   isinverted="true"
 >
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     icon=""
     size="small"
@@ -30,6 +31,7 @@ exports[`Design management upload button component renders inverted upload desig
 exports[`Design management upload button component renders loading icon 1`] = `
 <div>
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     disabled="true"
     icon=""
@@ -62,6 +64,7 @@ exports[`Design management upload button component renders loading icon 1`] = `
 exports[`Design management upload button component renders upload design button 1`] = `
 <div>
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     icon=""
     size="small"
diff --git a/spec/frontend/design_management/pages/__snapshots__/index_spec.js.snap b/spec/frontend/design_management/pages/__snapshots__/index_spec.js.snap
index b80b7fdb43eca0edc73549109db7e9e745750e3d..07ba6c7309e7810d1054eb4b34f731ed8caa3a6c 100644
--- a/spec/frontend/design_management/pages/__snapshots__/index_spec.js.snap
+++ b/spec/frontend/design_management/pages/__snapshots__/index_spec.js.snap
@@ -110,6 +110,7 @@ exports[`Design management index page designs renders designs list and header wi
         class="qa-selector-toolbar gl-display-flex gl-align-items-center"
       >
         <gl-button-stub
+          buttontextclasses=""
           category="primary"
           class="gl-mr-4 js-select-all"
           icon=""
diff --git a/spec/frontend/design_management/pages/design/__snapshots__/index_spec.js.snap b/spec/frontend/design_management/pages/design/__snapshots__/index_spec.js.snap
index c849e4d4ed6412182b6b4505e99b209c9e91a1cc..8546f9fbf51eb22fa52ade24ce1f4fb3556e12da 100644
--- a/spec/frontend/design_management/pages/design/__snapshots__/index_spec.js.snap
+++ b/spec/frontend/design_management/pages/design/__snapshots__/index_spec.js.snap
@@ -67,6 +67,7 @@ exports[`Design management design index page renders design index 1`] = `
     />
      
     <gl-button-stub
+      buttontextclasses=""
       category="primary"
       class="link-inherit-color gl-text-body gl-text-decoration-none gl-font-weight-bold gl-mb-4"
       data-testid="resolved-comments"
diff --git a/spec/frontend/grafana_integration/components/__snapshots__/grafana_integration_spec.js.snap b/spec/frontend/grafana_integration/components/__snapshots__/grafana_integration_spec.js.snap
index 0befe1aa1922436a3eab58362f0b3903db910211..dd889e2ab6ffb5629921056c794203f7b322cdec 100644
--- a/spec/frontend/grafana_integration/components/__snapshots__/grafana_integration_spec.js.snap
+++ b/spec/frontend/grafana_integration/components/__snapshots__/grafana_integration_spec.js.snap
@@ -17,6 +17,7 @@ exports[`grafana integration component default state to match the default snapsh
     </h3>
      
     <gl-button-stub
+      buttontextclasses=""
       category="primary"
       class="js-settings-toggle"
       icon=""
@@ -96,6 +97,7 @@ exports[`grafana integration component default state to match the default snapsh
         class="gl-display-flex gl-justify-content-end"
       >
         <gl-button-stub
+          buttontextclasses=""
           category="primary"
           icon=""
           size="medium"
diff --git a/spec/frontend/incidents_settings/components/__snapshots__/alerts_form_spec.js.snap b/spec/frontend/incidents_settings/components/__snapshots__/alerts_form_spec.js.snap
index cab2165b5db5b1bd2f5050d39d00f3ecbe8e2ed1..cd8a3d7a38127270871e41ef4d4ec66d624e83de 100644
--- a/spec/frontend/incidents_settings/components/__snapshots__/alerts_form_spec.js.snap
+++ b/spec/frontend/incidents_settings/components/__snapshots__/alerts_form_spec.js.snap
@@ -97,6 +97,7 @@ exports[`Alert integration settings form default state should match the default
       class="gl-display-flex gl-justify-content-end"
     >
       <gl-button-stub
+        buttontextclasses=""
         category="primary"
         class="js-no-auto-disable"
         data-qa-selector="save_changes_button"
diff --git a/spec/frontend/incidents_settings/components/__snapshots__/incidents_settings_tabs_spec.js.snap b/spec/frontend/incidents_settings/components/__snapshots__/incidents_settings_tabs_spec.js.snap
index 3ad4c13382de2bff9b0faed828dffcd04cf55feb..53c3e131466502e6a85350fd9ade4572c4f495a5 100644
--- a/spec/frontend/incidents_settings/components/__snapshots__/incidents_settings_tabs_spec.js.snap
+++ b/spec/frontend/incidents_settings/components/__snapshots__/incidents_settings_tabs_spec.js.snap
@@ -18,6 +18,7 @@ exports[`IncidentsSettingTabs should render the component 1`] = `
     </h4>
      
     <gl-button-stub
+      buttontextclasses=""
       category="primary"
       class="js-settings-toggle"
       icon=""
diff --git a/spec/frontend/incidents_settings/components/__snapshots__/pagerduty_form_spec.js.snap b/spec/frontend/incidents_settings/components/__snapshots__/pagerduty_form_spec.js.snap
index 78bb238fcb62aa78493cc2fa630d98012e5b2a44..a6c910f9023880f9ef3c47fac70b61c9df3f30e3 100644
--- a/spec/frontend/incidents_settings/components/__snapshots__/pagerduty_form_spec.js.snap
+++ b/spec/frontend/incidents_settings/components/__snapshots__/pagerduty_form_spec.js.snap
@@ -46,6 +46,7 @@ exports[`Alert integration settings form should match the default snapshot 1`] =
         class="gl-display-flex gl-justify-content-end"
       >
         <gl-button-stub
+          buttontextclasses=""
           category="primary"
           class="gl-mt-3"
           data-testid="webhook-reset-btn"
@@ -80,6 +81,7 @@ exports[`Alert integration settings form should match the default snapshot 1`] =
       class="gl-display-flex gl-justify-content-end"
     >
       <gl-button-stub
+        buttontextclasses=""
         category="primary"
         class="js-no-auto-disable"
         icon=""
diff --git a/spec/frontend/packages/shared/components/__snapshots__/package_list_row_spec.js.snap b/spec/frontend/packages/shared/components/__snapshots__/package_list_row_spec.js.snap
index 6aaefed92d045a07943b229634e2b7fc105d3c50..cf5451490eb19495bbd8853a8da716cd86f781c4 100644
--- a/spec/frontend/packages/shared/components/__snapshots__/package_list_row_spec.js.snap
+++ b/spec/frontend/packages/shared/components/__snapshots__/package_list_row_spec.js.snap
@@ -118,6 +118,7 @@ exports[`packages_list_row renders 1`] = `
     >
       <gl-button-stub
         aria-label="Remove package"
+        buttontextclasses=""
         category="primary"
         data-testid="action-delete"
         icon="remove"
diff --git a/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap b/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap
index 2fbc700d4f54f03dcf500624adcb79c8be2c6f30..ddeaa2a79dbf96c9acd3950f70b14aacdf7d91ab 100644
--- a/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap
+++ b/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap
@@ -39,6 +39,7 @@ exports[`User Operation confirmation modal renders modal with form included 1`]
     />
   </form>
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     icon=""
     size="medium"
@@ -48,6 +49,7 @@ exports[`User Operation confirmation modal renders modal with form included 1`]
   </gl-button-stub>
    
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     disabled="true"
     icon=""
@@ -60,6 +62,7 @@ exports[`User Operation confirmation modal renders modal with form included 1`]
   </gl-button-stub>
    
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     disabled="true"
     icon=""
diff --git a/spec/frontend/projects/components/__snapshots__/project_delete_button_spec.js.snap b/spec/frontend/projects/components/__snapshots__/project_delete_button_spec.js.snap
index 455467e7b29484f53a0eb7c08ca7554bb7f7a9d1..a0fd60125464f0ea39efc5fc633159d1c86e6edd 100644
--- a/spec/frontend/projects/components/__snapshots__/project_delete_button_spec.js.snap
+++ b/spec/frontend/projects/components/__snapshots__/project_delete_button_spec.js.snap
@@ -17,6 +17,7 @@ exports[`Project remove modal initialized matches the snapshot 1`] = `
   />
    
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     icon=""
     role="button"
diff --git a/spec/frontend/projects/components/shared/__snapshots__/delete_button_spec.js.snap b/spec/frontend/projects/components/shared/__snapshots__/delete_button_spec.js.snap
index 692b8f6cf52b242cd514ad5d48896113af0c1fd9..4630415f61c91fb0c9172aa688444744f7ff3a2d 100644
--- a/spec/frontend/projects/components/shared/__snapshots__/delete_button_spec.js.snap
+++ b/spec/frontend/projects/components/shared/__snapshots__/delete_button_spec.js.snap
@@ -18,6 +18,7 @@ exports[`Project remove modal intialized matches the snapshot 1`] = `
   />
    
   <gl-button-stub
+    buttontextclasses=""
     category="primary"
     icon=""
     role="button"
@@ -84,6 +85,7 @@ exports[`Project remove modal intialized matches the snapshot 1`] = `
      
     <template>
       <gl-button-stub
+        buttontextclasses=""
         category="primary"
         class="js-modal-action-cancel"
         icon=""
@@ -98,6 +100,7 @@ exports[`Project remove modal intialized matches the snapshot 1`] = `
       <!---->
        
       <gl-button-stub
+        buttontextclasses=""
         category="primary"
         class="js-modal-action-primary"
         disabled="true"
diff --git a/spec/frontend/serverless/components/__snapshots__/empty_state_spec.js.snap b/spec/frontend/serverless/components/__snapshots__/empty_state_spec.js.snap
index 22689080063f1d90f6765f9f9e56e00258573d35..6b3d65ff037f1ba832e4c10a6bedc96f06bbb470 100644
--- a/spec/frontend/serverless/components/__snapshots__/empty_state_spec.js.snap
+++ b/spec/frontend/serverless/components/__snapshots__/empty_state_spec.js.snap
@@ -11,7 +11,7 @@ exports[`EmptyStateComponent should render content 1`] = `
       <p>In order to start using functions as a service, you must first install Knative on your Kubernetes cluster. <gl-link-stub href=\\"/help\\">More information</gl-link-stub>
       </p>
       <div>
-        <gl-button-stub category=\\"primary\\" variant=\\"success\\" size=\\"medium\\" icon=\\"\\" href=\\"/clusters\\">Install Knative</gl-button-stub>
+        <gl-button-stub category=\\"primary\\" variant=\\"success\\" size=\\"medium\\" icon=\\"\\" buttontextclasses=\\"\\" href=\\"/clusters\\">Install Knative</gl-button-stub>
         <!---->
       </div>
     </div>
diff --git a/spec/frontend/vue_shared/components/__snapshots__/clone_dropdown_spec.js.snap b/spec/frontend/vue_shared/components/__snapshots__/clone_dropdown_spec.js.snap
index dfd114a2d1cb874e553250b3b5b84287379b005e..ec4a81054dba630521efbd633d8fa74f99fdcfd2 100644
--- a/spec/frontend/vue_shared/components/__snapshots__/clone_dropdown_spec.js.snap
+++ b/spec/frontend/vue_shared/components/__snapshots__/clone_dropdown_spec.js.snap
@@ -39,6 +39,7 @@ exports[`Clone Dropdown Button rendering matches the snapshot 1`] = `
             tag="div"
           >
             <gl-button-stub
+              buttontextclasses=""
               category="primary"
               class="d-inline-flex"
               data-clipboard-text="ssh://foo.bar"
@@ -80,6 +81,7 @@ exports[`Clone Dropdown Button rendering matches the snapshot 1`] = `
             tag="div"
           >
             <gl-button-stub
+              buttontextclasses=""
               category="primary"
               class="d-inline-flex"
               data-clipboard-text="http://foo.bar"
diff --git a/yarn.lock b/yarn.lock
index 9bb1756daa6c4107c9562e9f3cb1644faf723b08..d9967c03d4edbdb1c0869299c5a777ef3f54e5af 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -848,10 +848,10 @@
   resolved "https://registry.yarnpkg.com/@gitlab/svgs/-/svgs-1.164.0.tgz#6cefad871c45f945ef92b99015d0f510b1d2de4a"
   integrity sha512-a9e/cYUc1QQk7azjH4x/m6/p3icavwGEi5F9ipNlDqiJtUor5tqojxvMxPOhuVbN/mTwnC6lGsSZg4tqTsdJAQ==
 
-"@gitlab/ui@21.3.1":
-  version "21.3.1"
-  resolved "https://registry.yarnpkg.com/@gitlab/ui/-/ui-21.3.1.tgz#027b767804540539da73d4874370895d7398adea"
-  integrity sha512-ynyg8i8W8Ud+GoySr4hAjJoW55kWMwSEFLX5MEX8CbdqGurkTLqHYLLpXPBSSnVEcw4stR+bFbKSc35rmBkWPA==
+"@gitlab/ui@21.4.2":
+  version "21.4.2"
+  resolved "https://registry.yarnpkg.com/@gitlab/ui/-/ui-21.4.2.tgz#c3d36167ab4df49ce978e20bdd3790e716f5a2d1"
+  integrity sha512-p8ujeGvCG06Opn0eQlrwZyi9v9RK3T2V4TUcljTAUYDdm0p23qJjjIlFjfGHlQsNg0wRgnkbKFXfkZ/Oy8GyiQ==
   dependencies:
     "@babel/standalone" "^7.0.0"
     "@gitlab/vue-toasted" "^1.3.0"