Upgrade @hashicorp/design-system-components and ember-cli-clipboard (#44

)

* Upgrade @hashicorp/design-system-component and ember-cli-clipboard

* Changeset

* Upgrade @hashicorp/design-system-components to 2.10.0

* Update changeset copy

.changeset/clever-moons-cover.md

@@ -0,0 +1,5 @@
+---
+'@hashicorp/consul-ui-toolkit': patch
+---
+
+Upgrade @hashicorp/design-system-component -> 2.10.0 and ember-cli-clipboard -> 1.0.0

documentation/package.json

@@ -30,7 +30,7 @@
     "@glimmer/component": "^1.1.2",
     "@glimmer/tracking": "^1.1.2",
     "@hashicorp/consul-ui-toolkit": "^0.1.0",
-    "@hashicorp/design-system-components": "2.8.1",
+    "@hashicorp/design-system-components": "^2.10.0",
     "@hashicorp/ember-flight-icons": "^3.0.6",
     "@types/qunit": "latest",
     "@typescript-eslint/eslint-plugin": "^5.2.0",
@@ -42,7 +42,7 @@
     "ember-cli": "~4.11.0",
     "ember-cli-app-version": "^6.0.0",
     "ember-cli-babel": "^7.26.11",
-    "ember-cli-clipboard": "^0.16.0",
+    "ember-cli-clipboard": "^1.0.0",
     "ember-cli-dependency-checker": "^3.3.1",
     "ember-cli-htmlbars": "^6.2.0",
     "ember-cli-inject-live-reload": "^2.1.0",

toolkit/package.json

@@ -51,13 +51,14 @@
     "@babel/plugin-transform-typescript": "^7.22.10",
     "@babel/preset-typescript": "^7.21.0",
     "@embroider/addon-dev": "^3.0.0",
-    "@hashicorp/design-system-components": "2.8.1",
+    "@hashicorp/design-system-components": "^2.10.0",
     "@rollup/plugin-babel": "^5.3.0",
     "@types/ember": "^4.0.3",
     "@types/ungap__structured-clone": "^0.3.0",
     "@typescript-eslint/eslint-plugin": "^5.2.0",
     "@typescript-eslint/parser": "^5.2.0",
     "concurrently": "^7.2.1",
+    "ember-cli-clipboard": "^1.0.0",
     "ember-inflector": "^4.0.2",
     "ember-template-lint": "^4.0.0",
     "eslint": "^7.32.0",

toolkit/src/components/cut/copy-block/index.hbs

@@ -2,13 +2,26 @@
   Copyright (c) HashiCorp, Inc.
 }}
 
-<div class="cut-copy-block" ...attributes>
+<div class='cut-copy-block' ...attributes>
   <div data-test-copy-block-content>{{yield}}</div>
-  <div class="cut-copy-block__copy-button">
-    <CopyButton @clipboardText={{@clipboardText}}
-                @success={{perform this.copied}}
-                class={{if this.isSuccessfullyCopied 'cut-copy-block__copy-button--checked' ''}}>
-      <FlightIcon @name={{if this.isSuccessfullyCopied 'clipboard-checked' 'clipboard-copy'}} @size="16"/>
+  <div class='cut-copy-block__copy-button'>
+    <CopyButton
+      @text={{@clipboardText}}
+      @onSuccess={{perform this.copied}}
+      class={{if
+        this.isSuccessfullyCopied
+        'cut-copy-block__copy-button--checked'
+        ''
+      }}
+    >
+      <FlightIcon
+        @name={{if
+          this.isSuccessfullyCopied
+          'clipboard-checked'
+          'clipboard-copy'
+        }}
+        @size='16'
+      />
     </CopyButton>
   </div>
 </div>