npm publish (0.0.226)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bbodek-ui",
-  "version": "0.0.225",
+  "version": "0.0.226",
   "type": "module",
   "author": "Bbodek",
   "license": "MIT",

src/core/components/Modal/ModalPopUp/index.tsx

@@ -11,7 +11,9 @@ const ModalPopUp = forwardRef((
     {
       isOpen,
       children,
+      rounded,
       hasRounded = true,
+      hasShadow = true,
       ...props
     }: PropsWithChildren<ModalPopUpProps>,
     ref: React.Ref<HTMLDialogElement>,
@@ -31,8 +33,9 @@ const ModalPopUp = forwardRef((
       <Section
         element = "div"
         className = {clsx("animate-popup", className)}
+        rounded = {rounded}
         hasRounded = {hasRounded}
-        hasShadow
+        hasShadow = {hasShadow}
       >
         {children}
       </Section>

src/core/components/Modal/ModalPopUp/types/index.ts

@@ -3,4 +3,4 @@ import { HTMLAttributes } from "react";
 import { SectionProps } from "@/core/components/Section/types";
 import { ModalBaseProps } from "../../ModalBase/types";
 
-export interface ModalPopUpProps extends Pick<SectionProps<"section">, "hasRounded">, Pick<ModalBaseProps, "target" | "isOpen" | "onClose">, HTMLAttributes<HTMLElement> {}
+export interface ModalPopUpProps extends Pick<SectionProps<"section">, "hasRounded" | "hasShadow" | "rounded">, Pick<ModalBaseProps, "target" | "isOpen" | "onClose">, HTMLAttributes<HTMLElement> {}

src/core/components/Section/constants/index.ts

@@ -0,0 +1,17 @@
+import { RoundedType } from "../types";
+
+export const ROUNDED = {
+  ROUNDED_FULL: "rounded-full",
+  ROUNDED_20: "rounded-20",
+  ROUNDED_12: "rounded-12",
+  ROUNDED_6: "rounded-6",
+  ROUNDED_2: "rounded-2",
+} as const;
+
+export const SECTION_ROUNDED: Record<RoundedType, string> = {
+  [ROUNDED["ROUNDED_FULL"]]: "rounded-full",
+  [ROUNDED["ROUNDED_20"]]: "rounded-[1.25rem]",
+  [ROUNDED["ROUNDED_12"]]: "rounded-xl",
+  [ROUNDED["ROUNDED_6"]]: "rounded-md",
+  [ROUNDED["ROUNDED_2"]]: "rounded-sm",
+};

src/core/components/Section/index.tsx

@@ -1,12 +1,14 @@
 import clsx from "clsx";
 import React, { PropsWithChildren, forwardRef } from "react";
 
+import { ROUNDED, SECTION_ROUNDED } from "./constants";
 import { SectionProps } from "./types";
 
 const Section = forwardRef(
   <T extends React.ElementType>(
     {
       children,
+      rounded = ROUNDED["ROUNDED_20"],
       hasRounded = true,
       hasBorder = false,
       hasShadow = false,
@@ -24,7 +26,7 @@ const Section = forwardRef(
       className = {
         clsx(
           "bg-white",
-          hasRounded && "rounded-[1.25rem]",
+          hasRounded && SECTION_ROUNDED[rounded],
           hasBorder && "border border-gray-02",
           hasShadow && "shadow-section",
           className,

src/core/components/Section/types/index.ts

@@ -1,6 +1,11 @@
+import { ROUNDED } from "../constants";
+
 export interface SectionProps<T extends React.ElementType> extends React.HTMLAttributes<HTMLElement> {
+  rounded?: RoundedType;
   hasRounded?: boolean;
   hasBorder?: boolean;
   hasShadow?: boolean;
   element?: T;
 }
+
+export type RoundedType = typeof ROUNDED[keyof typeof ROUNDED];