[ui] standardize naming

apps/storybook/stories/dropdown-menu.stories.tsx

@@ -8,8 +8,8 @@ const DropdownMenuAlignments: ReadonlyArray<DropdownMenuAlignment> = [
   'end',
 ];
 const DropdownMenuSizes: ReadonlyArray<DropdownMenuSize> = [
+  'default',
   'inherit',
-  'regular',
 ];
 
 export default {
@@ -80,7 +80,7 @@ export function Basic({
 Basic.args = {
   align: 'start',
   label: 'More actions',
-  size: 'regular',
+  size: 'default',
 };
 
 export function Align() {
@@ -103,7 +103,7 @@ export function Align() {
 
   return (
     <div className="flex justify-between">
-      <DropdownMenu align="start" label="Select an action" size="regular">
+      <DropdownMenu align="start" label="Select an action" size="default">
         {menuItems.map(({ label, value }) => (
           <DropdownMenu.Item
             key={value}
@@ -115,7 +115,7 @@ export function Align() {
           />
         ))}
       </DropdownMenu>
-      <DropdownMenu align="end" label="Select an action" size="regular">
+      <DropdownMenu align="end" label="Select an action" size="default">
         {menuItems.map(({ label, value }) => (
           <DropdownMenu.Item
             key={value}

packages/ui/src/Banner/Banner.tsx

@@ -18,7 +18,7 @@ export default function Banner({ children, size = 'md', onHide }: Props) {
         size === 'sm' && 'text-sm',
         size === 'xs' && 'text-xs',
       )}>
-      <div className="mx-auto max-w-7xl py-3 px-3 sm:px-6 lg:px-8">
+      <div className="mx-auto max-w-7xl py-2 px-3 sm:px-6 lg:px-8">
         <div className="pr-16 sm:px-16 sm:text-center">
           <p className="font-medium text-white">{children}</p>
         </div>

packages/ui/src/DropdownMenu/DropdownMenu.tsx

@@ -6,7 +6,7 @@ import { ChevronDownIcon } from '@heroicons/react/24/solid';
 import DropdownMenuItem from './DropdownMenuItem';
 
 export type DropdownMenuAlignment = 'end' | 'start';
-export type DropdownMenuSize = 'inherit' | 'regular';
+export type DropdownMenuSize = 'default' | 'inherit';
 
 type Props = Readonly<{
   align?: DropdownMenuAlignment;
@@ -26,15 +26,15 @@ export default function DropdownMenu({
   align = 'start',
   children,
   label,
-  size = 'regular',
+  size = 'default',
 }: Props) {
   return (
     <Menu as="div" className="relative inline-block">
       <div className="flex">
         <Menu.Button
           className={clsx(
-            'group inline-flex justify-center font-medium text-slate-700 hover:text-slate-900',
-            size === 'regular' && 'text-sm',
+            'group inline-flex items-center justify-center font-medium text-slate-700 hover:text-slate-900',
+            size === 'default' && 'text-sm',
           )}>
           <div>{label}</div>
           <ChevronDownIcon