@nation-a/ui 0.16.21 → 0.16.23

package/dist/styled-system/styles.css

@@ -1056,6 +1056,14 @@ html:not(#\#),body:not(#\#) {
   font-size: 16px;
 }
 
+.textStyle_en\.label\.caption\.10\.regular:not(#\#):not(#\#):not(#\#):not(#\#) {
+  letter-spacing: var(--letter-spacings-3xl);
+  font-family: var(--fonts-dm-sans);
+  font-weight: var(--font-weights-regular);
+  line-height: 120%;
+  font-size: 10px;
+}
+
 .textStyle_en\.label\.caption\.10\.semibold:not(#\#):not(#\#):not(#\#):not(#\#) {
   letter-spacing: var(--letter-spacings-3xl);
   font-family: var(--fonts-dm-sans);
@@ -1064,6 +1072,14 @@ html:not(#\#),body:not(#\#) {
   font-size: 10px;
 }
 
+.textStyle_en\.label\.caption\.12\.regular:not(#\#):not(#\#):not(#\#):not(#\#) {
+  letter-spacing: var(--letter-spacings-3xl);
+  font-family: var(--fonts-dm-sans);
+  font-weight: var(--font-weights-regular);
+  line-height: 120%;
+  font-size: 12px;
+}
+
 .textStyle_en\.label\.caption\.12\.semibold:not(#\#):not(#\#):not(#\#):not(#\#) {
   letter-spacing: var(--letter-spacings-3xl);
   font-family: var(--fonts-dm-sans);
@@ -1199,6 +1215,14 @@ html:not(#\#),body:not(#\#) {
   font-size: 16px;
 }
 
+.textStyle_kr\.label\.caption\.10\.regular:not(#\#):not(#\#):not(#\#):not(#\#) {
+  letter-spacing: var(--letter-spacings-3xl);
+  font-family: var(--fonts-pretendard);
+  font-weight: var(--font-weights-regular);
+  line-height: 120%;
+  font-size: 10px;
+}
+
 .textStyle_kr\.label\.caption\.10\.semibold:not(#\#):not(#\#):not(#\#):not(#\#) {
   letter-spacing: var(--letter-spacings-3xl);
   font-family: var(--fonts-pretendard);
@@ -1207,6 +1231,14 @@ html:not(#\#),body:not(#\#) {
   font-size: 10px;
 }
 
+.textStyle_kr\.label\.caption\.12\.regular:not(#\#):not(#\#):not(#\#):not(#\#) {
+  letter-spacing: var(--letter-spacings-3xl);
+  font-family: var(--fonts-pretendard);
+  font-weight: var(--font-weights-regular);
+  line-height: 120%;
+  font-size: 12px;
+}
+
 .textStyle_kr\.label\.caption\.12\.semibold:not(#\#):not(#\#):not(#\#):not(#\#) {
   letter-spacing: var(--letter-spacings-3xl);
   font-family: var(--fonts-pretendard);
@@ -1601,20 +1633,20 @@ html:not(#\#),body:not(#\#) {
   opacity: 0;
 }
 
-.c_content\.neutralInverse\.bold:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
-  color: var(--colors-content-neutral-inverse-bold);
+.c_white\.900A:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  color: var(--colors-white-900-a);
 }
 
-.w_4\.5:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
-  width: var(--sizes-4\.5);
+.c_content\.neutralInverse\.bold:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  color: var(--colors-content-neutral-inverse-bold);
 }
 
-.h_4\.5:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
-  height: var(--sizes-4\.5);
+.w_3\.5:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  width: var(--sizes-3\.5);
 }
 
-.bdr_sm:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
-  border-radius: var(--radii-sm);
+.h_3\.5:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  height: var(--sizes-3\.5);
 }
 
 .px_6:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
@@ -1770,6 +1802,10 @@ html:not(#\#),body:not(#\#) {
   padding-block: var(--spacing-2);
 }
 
+.bdr_sm:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  border-radius: var(--radii-sm);
+}
+
 .trs_background-color_0\.1s_ease-in-out:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
   transition: background-color 0.1s ease-in-out;
 }
@@ -1794,6 +1830,14 @@ html:not(#\#),body:not(#\#) {
   width: 64px;
 }
 
+.w_4\.5:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  width: var(--sizes-4\.5);
+}
+
+.h_4\.5:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  height: var(--sizes-4\.5);
+}
+
 .w_90vw:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
   width: 90vw;
 }
@@ -2419,8 +2463,12 @@ html:not(#\#),body:not(#\#) {
   top: 50%;
 }
 
-.bd-c_content\.neutral\.bold:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
-  border-color: var(--colors-content-neutral-bold);
+.bd-c_white\.900A:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  border-color: var(--colors-white-900-a);
+}
+
+.bd-w_1\.5px:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  border-width: 1.5px;
 }
 
 .trs-prop_border-color\,_background:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
@@ -2472,6 +2520,10 @@ html:not(#\#),body:not(#\#) {
   padding-right: var(--spacing-2);
 }
 
+.bd-c_content\.neutral\.bold:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  border-color: var(--colors-content-neutral-bold);
+}
+
 .bd-w_2px:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
   border-width: 2px;
 }
@@ -2658,6 +2710,10 @@ html:not(#\#),body:not(#\#) {
   height: 24px;
 }
 
+.disabled\:c_white\.500A:is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  color: var(--colors-white-500-a);
+}
+
 .\[\&_svg\]\:w_2\.5:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) svg {
   width: var(--sizes-2\.5);
 }
@@ -2666,12 +2722,12 @@ html:not(#\#),body:not(#\#) {
   height: var(--sizes-2\.5);
 }
 
-.checked\:bg_content\.neutral\.bold:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
-  background: var(--colors-content-neutral-bold);
+.checked\:bg_white\.900A:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  background: var(--colors-white-900-a);
 }
 
-.indeterminate\:bg_content\.neutral\.bold:is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state=indeterminate]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
-  background: var(--colors-content-neutral-bold);
+.indeterminate\:bg_white\.900A:is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state=indeterminate]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  background: var(--colors-white-900-a);
 }
 
 .disabled\:tch-a_none:is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
@@ -2766,6 +2822,10 @@ html:not(#\#),body:not(#\#) {
   gap: var(--spacing-6);
 }
 
+.checked\:bg_content\.neutral\.bold:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  background: var(--colors-content-neutral-bold);
+}
+
 .checked\:ring-o_-4px:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
   outline-offset: -4px;
 }
@@ -3170,12 +3230,12 @@ html:not(#\#),body:not(#\#) {
   border-color: var(--colors-border-neutral-disabled);
 }
 
-.indeterminate\:bd-c_content\.neutral\.bold:is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state=indeterminate]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
-  border-color: var(--colors-content-neutral-bold);
+.indeterminate\:bd-c_white\.900A:is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state=indeterminate]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+  border-color: var(--colors-white-900-a);
 }
 
-.disabled\:bd-c_content\.neutral\.disabled\!:is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#) {
-  border-color: var(--colors-content-neutral-disabled) !important;
+.disabled\:bd-c_white\.500A\!:is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#) {
+  border-color: var(--colors-white-500-a) !important;
 }
 
 .\[\&_textarea\]\:ov-y_auto:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) textarea {
@@ -3210,6 +3270,10 @@ html:not(#\#),body:not(#\#) {
   outline-width: 2px;
 }
 
+.disabled\:bd-c_content\.neutral\.disabled\!:is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#) {
+  border-color: var(--colors-content-neutral-disabled) !important;
+}
+
 .focusWithin\:bd-c_border\.neutral\.default:focus-within:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
   border-color: var(--colors-border-neutral-default);
 }
@@ -3234,12 +3298,12 @@ html:not(#\#),body:not(#\#) {
   background-color: var(--colors-background-neutral-default);
 }
 
-.checked\:disabled\:bg_content\.neutral\.disabled\!:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]):is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#) {
-  background: var(--colors-content-neutral-disabled) !important;
+.checked\:disabled\:bg_white\.500A\!:is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]):is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#) {
+  background: var(--colors-white-500-a) !important;
 }
 
-.indeterminate\:disabled\:bg_content\.neutral\.disabled\!:is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state=indeterminate]):is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#) {
-  background: var(--colors-content-neutral-disabled) !important;
+.indeterminate\:disabled\:bg_white\.500A\!:is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state=indeterminate]):is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#) {
+  background: var(--colors-white-500-a) !important;
 }
 
 .group:is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .placeholder\:groupDisabled\:c_content\.static\.white\.disabled::placeholder, .group:is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .placeholder\:groupDisabled\:c_content\.static\.white\.disabled[data-placeholder] {
@@ -3363,8 +3427,8 @@ html:not(#\#),body:not(#\#) {
 }
 
 @media (hover: hover) and (pointer: fine) {
-  .hover\:c_content\.neutral\.hovered:is(:hover, [data-hover]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
-    color: content.neutral.hovered;
+  .hover\:bd-c_white\.800A:is(:hover, [data-hover]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+    border-color: var(--colors-white-800-a);
 }
 }
 
@@ -3387,14 +3451,14 @@ html:not(#\#),body:not(#\#) {
 }
 
 @media (hover: hover) and (pointer: fine) {
-  .checked\:hover\:bg_content\.neutral\.subtle:is(:hover, [data-hover]):is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
-    background: var(--colors-content-neutral-subtle);
+  .checked\:hover\:bg_white\.800A:is(:hover, [data-hover]):is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+    background: var(--colors-white-800-a);
 }
 }
 
 @media (hover: hover) and (pointer: fine) {
-  .indeterminate\:hover\:bg_content\.neutral\.subtle:is(:hover, [data-hover]):is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state=indeterminate]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
-    background: var(--colors-content-neutral-subtle);
+  .indeterminate\:hover\:bg_white\.800A:is(:hover, [data-hover]):is(:indeterminate, [data-indeterminate], [aria-checked=mixed], [data-state=indeterminate]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+    background: var(--colors-white-800-a);
 }
 }
 
@@ -3404,6 +3468,12 @@ html:not(#\#),body:not(#\#) {
 }
 }
 
+@media (hover: hover) and (pointer: fine) {
+  .checked\:hover\:bg_content\.neutral\.subtle:is(:hover, [data-hover]):is(:checked, [data-checked], [aria-checked=true], [data-state="checked"]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
+    background: var(--colors-content-neutral-subtle);
+}
+}
+
 @media (hover: hover) and (pointer: fine) {
   .disabled\:hover\:bg_initial:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
     background: initial;

package/dist/styled-system/types/prop-type.d.ts

@@ -208,7 +208,7 @@ export interface UtilityValues {
 	debug: boolean;
 	containerName: CssProperties["containerName"];
 	colorPalette: "neutral" | "black" | "white" | "red" | "orange" | "blue" | "green" | "purple" | "ohre" | "cyan" | "yellow" | "v3" | "content" | "content.neutral" | "content.neuroidPrimary" | "content.danger" | "content.warning" | "content.success" | "content.informative" | "content.zoltarinaPrimary" | "content.heydPrimary" | "content.static" | "content.static.white" | "content.static.black" | "content.heybeePrimary" | "content.neutralInverse" | "background" | "background.neutral" | "background.neuroidPrimary" | "background.neuroidSecondary" | "background.danger" | "background.warning" | "background.success" | "background.informative" | "background.zoltarinaPrimary" | "background.zoltarinaSecondary" | "background.heydPrimary" | "background.heydSecondary" | "background.static" | "background.static.whiteAlpha" | "background.static.blackAlpha" | "background.heybeePrimary" | "background.neutralInverse" | "background.v3" | "surface" | "shadow" | "scrim" | "skeleton" | "border" | "border.neutral" | "border.neuroidPrimary" | "border.danger" | "border.warning" | "border.success" | "border.informative" | "border.zoltarinaPrimary" | "border.heydPrimary" | "border.heybeePrimary";
-	textStyle: "body.md" | "body.lg" | "body.sm" | "label.sm" | "label.md" | "title.sm" | "title.md" | "title.lg" | "headline.sm" | "headline.md" | "display.md" | "display.lg" | "en.title.main.22.bold" | "en.title.main.24.bold" | "en.title.main.30.bold" | "en.title.main.56.bold" | "en.title.sub.16.bold" | "en.title.sub.18.bold" | "en.title.sub.20.bold" | "en.text.chat.14.bold" | "en.text.chat.14.regular" | "en.text.chat.16.bold" | "en.text.chat.16.regular" | "en.text.body.14.bold" | "en.text.body.14.regular" | "en.text.body.16.bold" | "en.text.body.16.regular" | "en.label.caption.10.semibold" | "en.label.caption.12.semibold" | "en.label.caption.14.semibold" | "kr.title.main.22.bold" | "kr.title.main.24.bold" | "kr.title.main.30.bold" | "kr.title.main.56.bold" | "kr.title.sub.16.bold" | "kr.title.sub.18.bold" | "kr.title.sub.20.bold" | "kr.text.chat.14.bold" | "kr.text.chat.14.regular" | "kr.text.chat.16.bold" | "kr.text.chat.16.regular" | "kr.text.body.14.bold" | "kr.text.body.14.regular" | "kr.text.body.16.bold" | "kr.text.body.16.regular" | "kr.label.caption.10.semibold" | "kr.label.caption.12.semibold" | "kr.label.caption.14.semibold";
+	textStyle: "body.md" | "body.lg" | "body.sm" | "label.sm" | "label.md" | "title.sm" | "title.md" | "title.lg" | "headline.sm" | "headline.md" | "display.md" | "display.lg" | "en.title.main.22.bold" | "en.title.main.24.bold" | "en.title.main.30.bold" | "en.title.main.56.bold" | "en.title.sub.16.bold" | "en.title.sub.18.bold" | "en.title.sub.20.bold" | "en.text.chat.14.bold" | "en.text.chat.14.regular" | "en.text.chat.16.bold" | "en.text.chat.16.regular" | "en.text.body.14.bold" | "en.text.body.14.regular" | "en.text.body.16.bold" | "en.text.body.16.regular" | "en.label.caption.10.regular" | "en.label.caption.10.semibold" | "en.label.caption.12.regular" | "en.label.caption.12.semibold" | "en.label.caption.14.semibold" | "kr.title.main.22.bold" | "kr.title.main.24.bold" | "kr.title.main.30.bold" | "kr.title.main.56.bold" | "kr.title.sub.16.bold" | "kr.title.sub.18.bold" | "kr.title.sub.20.bold" | "kr.text.chat.14.bold" | "kr.text.chat.14.regular" | "kr.text.chat.16.bold" | "kr.text.chat.16.regular" | "kr.text.body.14.bold" | "kr.text.body.14.regular" | "kr.text.body.16.bold" | "kr.text.body.16.regular" | "kr.label.caption.10.regular" | "kr.label.caption.10.semibold" | "kr.label.caption.12.regular" | "kr.label.caption.12.semibold" | "kr.label.caption.14.semibold";
 }
 
 

package/dist/types/components/Checkbox/checkbox.recipe.d.ts

@@ -3,9 +3,7 @@ export type CheckboxVariantProps = RecipeVariantProps<typeof checkboxRecipe>;
 export declare const checkboxRecipe: import('../../../styled-system/types').SlotRecipeRuntimeFn<"label" | "group" | "indicator" | "root" | "control", {
     variant: {
         square: {
-            control: {
-                borderRadius: "sm";
-            };
+            control: {};
         };
         round: {
             control: {

package/dist/types/components/Text/index.d.ts

@@ -273,7 +273,7 @@ declare const Text: import('react').ForwardRefExoticComponent<Omit<{
     part?: string | undefined | undefined;
     ref?: import('react').Ref<HTMLParagraphElement> | undefined;
 } & import('../../../styled-system/types').WithCss & {
-    variant?: "label.sm" | "body.md" | "body.lg" | "body.sm" | "label.md" | "title.sm" | "title.md" | "title.lg" | "headline.sm" | "headline.md" | "display.md" | "display.lg" | "title.main.22.bold" | "title.main.24.bold" | "title.main.30.bold" | "title.main.56.bold" | "title.sub.16.bold" | "title.sub.18.bold" | "title.sub.20.bold" | "text.chat.14.bold" | "text.chat.14.regular" | "text.chat.16.bold" | "text.chat.16.regular" | "text.body.14.bold" | "text.body.14.regular" | "text.body.16.bold" | "text.body.16.regular" | "label.caption.10.semibold" | "label.caption.12.semibold" | "label.caption.14.semibold" | undefined;
+    variant?: "label.sm" | "body.md" | "body.lg" | "body.sm" | "label.md" | "title.sm" | "title.md" | "title.lg" | "headline.sm" | "headline.md" | "display.md" | "display.lg" | "title.main.22.bold" | "title.main.24.bold" | "title.main.30.bold" | "title.main.56.bold" | "title.sub.16.bold" | "title.sub.18.bold" | "title.sub.20.bold" | "text.chat.14.bold" | "text.chat.14.regular" | "text.chat.16.bold" | "text.chat.16.regular" | "text.body.14.bold" | "text.body.14.regular" | "text.body.16.bold" | "text.body.16.regular" | "label.caption.10.semibold" | "label.caption.10.regular" | "label.caption.12.semibold" | "label.caption.12.regular" | "label.caption.14.semibold" | undefined;
     language?: "en" | "ko" | undefined;
     font?: "freeman" | "dmSans" | "pretendard" | "notoSans" | "inter" | undefined;
 }, "ref"> & import('react').RefAttributes<HTMLParagraphElement>>;

package/dist/types/components/Text/text.recipe.d.ts

@@ -66,7 +66,9 @@ export declare const textRecipe: import('../../../styled-system/types').RecipeRu
         'text.body.16.bold': {};
         'text.body.16.regular': {};
         'label.caption.10.semibold': {};
+        'label.caption.10.regular': {};
         'label.caption.12.semibold': {};
+        'label.caption.12.regular': {};
         'label.caption.14.semibold': {};
     };
     language: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nation-a/ui",
-  "version": "0.16.21",
+  "version": "0.16.23",
   "type": "module",
   "types": "./dist/types/index.d.ts",
   "main": "./dist/index.cjs",
@@ -22,8 +22,8 @@
     "react-dom": "^18.3.1",
     "react-hot-toast": "^2.5.2",
     "react-lottie": "^1.2.10",
-    "@nation-a/icons": "0.4.0",
-    "@nation-a/tokens": "0.4.1"
+    "@nation-a/icons": "0.4.2",
+    "@nation-a/tokens": "0.4.2"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^3",