From d8d4b0f09294e211f1d1ac74f2ed257048cd0d16 Mon Sep 17 00:00:00 2001
From: Yangshun Tay <tay.yang.shun@gmail.com>
Date: Fri, 28 Oct 2022 17:56:09 +0800
Subject: [PATCH] [ui] standardize naming

---
 apps/storybook/stories/dropdown-menu.stories.tsx | 8 ++++----
 packages/ui/src/Banner/Banner.tsx                | 2 +-
 packages/ui/src/DropdownMenu/DropdownMenu.tsx    | 8 ++++----
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/apps/storybook/stories/dropdown-menu.stories.tsx b/apps/storybook/stories/dropdown-menu.stories.tsx
index 28f07819..9a4fa01a 100644
--- a/apps/storybook/stories/dropdown-menu.stories.tsx
+++ b/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}
diff --git a/packages/ui/src/Banner/Banner.tsx b/packages/ui/src/Banner/Banner.tsx
index 41403cbb..1d41397d 100644
--- a/packages/ui/src/Banner/Banner.tsx
+++ b/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>
diff --git a/packages/ui/src/DropdownMenu/DropdownMenu.tsx b/packages/ui/src/DropdownMenu/DropdownMenu.tsx
index e3ccd4f2..6a57d9e9 100644
--- a/packages/ui/src/DropdownMenu/DropdownMenu.tsx
+++ b/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