chore: Add interface markdown for Button style API (#3600)

Author: DaemonCahill

src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap

@@ -4223,6 +4223,18 @@ If the \`rel\` property is provided, it overrides the default behavior.",
       "type": "string",
     },
     {
+      "description": "Specifies an object of selectors and properties that are used to apply custom styles.
+
+- \`root.background\` {active, default, disabled, hover} - (Optional) Background for component states.
+- \`root.borderColor\` {active, default, disabled, hover} - (Optional) Border color for component states.
+- \`root.borderRadius\` (string) - (Optional) Border radius style.
+- \`root.borderWidth\` (string) - (Optional) Border width style.
+- \`root.color\` {active, default, disabled, hover} - (Optional) Color for component states.
+- \`root.focusRing.borderColor\` (string) - (Optional) Focus ring border color.
+- \`root.focusRing.borderRadius\` (string) - (Optional) Focus ring border radius.
+- \`root.focusRing.borderWidth\` (string) - (Optional) Focus ring border width.
+- \`root.paddingBlock\` (string) - (Optional) Block dimension padding.
+- \`root.paddingInline\` (string) - (Optional) Inline dimension padding.",
       "inlineType": {
         "name": "ButtonProps.Style",
         "properties": [
@@ -20130,6 +20142,18 @@ It prevents users from clicking the button, but it can still be focused.",
       "type": "string",
     },
     {
+      "description": "Specifies an object of selectors and properties that are used to apply custom styles.
+
+- \`root.background\` {active, default, disabled, hover} - (Optional) Background for component states.
+- \`root.borderColor\` {active, default, disabled, hover} - (Optional) Border color for component states.
+- \`root.borderRadius\` (string) - (Optional) Border radius style.
+- \`root.borderWidth\` (string) - (Optional) Border width style.
+- \`root.color\` {active, default, disabled, hover} - (Optional) Color for component states.
+- \`root.focusRing.borderColor\` (string) - (Optional) Focus ring border color.
+- \`root.focusRing.borderRadius\` (string) - (Optional) Focus ring border radius.
+- \`root.focusRing.borderWidth\` (string) - (Optional) Focus ring border width.
+- \`root.paddingBlock\` (string) - (Optional) Block dimension padding.
+- \`root.paddingInline\` (string) - (Optional) Inline dimension padding.",
       "inlineType": {
         "name": "ButtonProps.Style",
         "properties": [

src/button/interfaces.ts

@@ -102,6 +102,18 @@ export interface BaseButtonProps {
   i18nStrings?: ButtonProps.I18nStrings;
 
   /**
+   * Specifies an object of selectors and properties that are used to apply custom styles.
+   *
+   * - `root.background` {active, default, disabled, hover} - (Optional) Background for component states.
+   * - `root.borderColor` {active, default, disabled, hover} - (Optional) Border color for component states.
+   * - `root.borderRadius` (string) - (Optional) Border radius style.
+   * - `root.borderWidth` (string) - (Optional) Border width style.
+   * - `root.color` {active, default, disabled, hover} - (Optional) Color for component states.
+   * - `root.focusRing.borderColor` (string) - (Optional) Focus ring border color.
+   * - `root.focusRing.borderRadius` (string) - (Optional) Focus ring border radius.
+   * - `root.focusRing.borderWidth` (string) - (Optional) Focus ring border width.
+   * - `root.paddingBlock` (string) - (Optional) Block dimension padding.
+   * - `root.paddingInline` (string) - (Optional) Inline dimension padding.
    * @awsuiSystem core
    */
   style?: ButtonProps.Style;