Update dropdown-menu and button to allow text buttons (#26425)

* Add text prop for button and dropdownmenu

Adds a new text property for button and dropdownmenu, if specified it
will show the text in the button field. You could specify icon={ null }
to have a text-only button.

Used to support social links size menu in #25921

* Update text rendering for both icon & text

- Show text if specified regardless of icon, allows for icon & text

- Switch text rendering, don't need a span tag, just use a fragment

packages/components/src/button/index.js

@@ -40,6 +40,7 @@ export function Button( props, ref ) {
 		shortcut,
 		label,
 		children,
+		text,
 		__experimentalIsFocusable: isFocusable,
 		...additionalProps
 	} = props;
@@ -111,6 +112,7 @@ export function Button( props, ref ) {
 			ref={ ref }
 		>
 			{ icon && <Icon icon={ icon } size={ iconSize } /> }
+			{ text && <>{ text }</> }
 			{ children }
 		</Tag>
 	);

packages/components/src/dropdown-menu/index.js

@@ -43,6 +43,7 @@ function DropdownMenu( {
 	toggleProps,
 	menuProps,
 	disableOpenOnArrowDown = false,
+	text,
 	// The following props exist for backward compatibility.
 	menuLabel,
 	position,
@@ -129,6 +130,7 @@ function DropdownMenu( {
 						aria-haspopup="true"
 						aria-expanded={ isOpen }
 						label={ label }
+						text={ text }
 						showTooltip={ toggleProps?.showTooltip ?? true }
 					>
 						{ mergedToggleProps.children }