fix(calcite-button): Make shadow dom button 100% width (#9145)

**Related Issue:** #8490

## Summary
When the host element button is set to "full" the shadow dom button is set to 100% width to span the entire space.

---------

Co-authored-by: Matt Driscoll <mdriscoll@esri.com>

packages/calcite-components/src/components/button/button.e2e.ts

@@ -747,4 +747,15 @@ describe("calcite-button", () => {
     expect(button.getAttribute("aria-expanded")).toBe("true");
     expect(calciteButton.getAttribute("aria-expanded")).toBe("true");
   });
+
+  it("renders child element with same width as host", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<calcite-button width="full">Continue</calcite-button>`);
+    const elementHost = await page.find("calcite-button");
+    const elementAsButton = await page.find("calcite-button >>> button");
+    expect(elementHost).not.toBeNull();
+    expect(elementAsButton).not.toBeNull();
+    expect(elementHost).toEqualAttribute("width", "full");
+    expect(await elementAsButton.getComputedStyle()["width"]).toEqual(await elementHost.getComputedStyle()["width"]);
+  });
 });

packages/calcite-components/src/components/button/button.scss

@@ -685,6 +685,16 @@
   @apply text-0h w-11;
   min-block-size: theme("height.11");
 }
+
+:host(:is([scale="s"], [scale="m"], [scale="l"])[width="full"]) {
+  a,
+  button {
+    &:not(.content--slotted) {
+      inline-size: var(--calcite-container-size-content-fluid);
+    }
+  }
+}
+
 // accommodate for transparent buttons not having borders
 :host([scale="l"][appearance="transparent"]) button:not(.content--slotted),
 :host([scale="l"][appearance="transparent"]) a:not(.content--slotted) {