diff --git a/package.json b/package.json index 99b55bc..d8e0384 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "bbodek-ui", - "version": "0.0.280", + "version": "0.0.282", "type": "module", "author": "Bbodek", "license": "MIT", diff --git a/src/core/components/BottomSheet/index.tsx b/src/core/components/BottomSheet/index.tsx index 0a8f8b4..5424c37 100644 --- a/src/core/components/BottomSheet/index.tsx +++ b/src/core/components/BottomSheet/index.tsx @@ -38,23 +38,24 @@ const BottomSheet = forwardRef( > <div className={clsx( - 'animate-bottom-sheet overflow-y-hidden px-4 pt-4', + 'animate-bottom-sheet overflow-y-hidden', BOTTOM_SHEET_ROUNDED_VARIANTS_MAPPER[rounded], - className, )} > - {useCloseBtn ? ( - <div className='mb-4 flex'> - <button - className='ml-auto' - onClick={onClose} - aria-label='창 닫기' - > - {CloseIcon} - </button> - </div> - ) : null} - {children} + <div className={clsx('p-4', className)}> + {useCloseBtn ? ( + <div className='mb-4 flex'> + <button + className='ml-auto' + onClick={onClose} + aria-label='창 닫기' + > + {CloseIcon} + </button> + </div> + ) : null} + {children} + </div> </div> </ModalBase> ); diff --git a/src/core/components/BottomSheet/types/index.ts b/src/core/components/BottomSheet/types/index.ts index 36964e0..41c0d11 100644 --- a/src/core/components/BottomSheet/types/index.ts +++ b/src/core/components/BottomSheet/types/index.ts @@ -7,9 +7,11 @@ export type ButtonBottomSheetRoundedTypes = (typeof BOTTOM_SHEET_ROUNDED_VARIANTS)[keyof typeof BOTTOM_SHEET_ROUNDED_VARIANTS]; export interface BottomSheetProps - extends Pick<ModalBaseProps, 'target' | 'isOpen' | 'useClickOutsideEvent'>, + extends Pick< + ModalBaseProps, + 'target' | 'isOpen' | 'useClickOutsideEvent' | 'onClose' + >, Omit<HTMLAttributes<HTMLElement>, 'title'> { useCloseBtn?: boolean; - onClose: ModalBaseProps['onClose']; rounded?: ButtonBottomSheetRoundedTypes; } diff --git a/src/core/components/Modal/ModalBase/constants/index.ts b/src/core/components/Modal/ModalBase/constants/index.ts index 3148878..a856263 100644 --- a/src/core/components/Modal/ModalBase/constants/index.ts +++ b/src/core/components/Modal/ModalBase/constants/index.ts @@ -21,5 +21,5 @@ export const MODAL_DIMMED_COLOR: Record<VariantsType, string> = { export const MODAL_CONTENT_SIZE: Record<VariantsType, string> = { [VARIANTS.MODAL]: 'h-auto', [VARIANTS.DRAWER]: 'h-full', - [VARIANTS.BOTTOM_SHEET]: 'h-auto safe-area-bottom-pb bg-white', + [VARIANTS.BOTTOM_SHEET]: 'h-auto safe-area-bottom bg-white', } as const; diff --git a/src/styles/bbodek-theme.css b/src/styles/bbodek-theme.css index b9687d5..58cf67a 100644 --- a/src/styles/bbodek-theme.css +++ b/src/styles/bbodek-theme.css @@ -90,12 +90,6 @@ padding-bottom: calc(env(safe-area-inset-bottom)); } - .safe-area-bottom-pb { - padding-bottom: 1rem; - padding-bottom: calc(constant(safe-area-inset-bottom + 1rem)); - padding-bottom: calc(env(safe-area-inset-bottom + 1rem)); - } - .safe-area-y { @apply safe-area-top safe-area-bottom; }