@uniai-fe/uds-foundation 0.4.3 → 0.4.5

package/src/init/reset.scss

@@ -30,9 +30,26 @@
       "Pretendard JP",
       "Pretendard Variable",
       "Pretendard",
+      "Noto Sans KR",
+      -apple-system,
+      BlinkMacSystemFont,
+      "Apple SD Gothic Neo",
+      "Segoe UI",
+      Roboto,
+      "Helvetica",
+      "Helvetica Neue",
+      "Apple Color Emoji",
+      "Segoe UI Emoji",
+      "Segoe UI Symbol",
+      "Malgun Gothic",
+      "dotum",
+      Oxygen,
+      "Oxygen-Sans",
+      "Ubuntu",
+      "Cantarell",
       "Inter",
       sans-serif
-    ); // Pretendard/Inter 스택을 전역 기본값으로 유지한다.
+    ); // 변경 설명: legacy reset의 폰트 fallback 자산을 foundation standard reset fallback 체계로 승격한다.
   }
 
   *:focus,
@@ -121,6 +138,7 @@
   q::before,
   q::after {
     content: "";
+    content: none;
   }
 
   img,
@@ -179,6 +197,10 @@
     font-size: 0;
   }
 
+  mark {
+    display: inline;
+  }
+
   a {
     display: block;
     color: #333;
@@ -215,6 +237,8 @@
   }
 
   select::-ms-expand {
+    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+    filter: alpha(opacity=0);
     opacity: 0;
   }
 
@@ -251,10 +275,17 @@
     appearance: none;
   }
 
+  ::-webkit-search-cancel-button {
+    caret-color: transparent;
+    border-color: transparent;
+    display: none;
+  }
+
   ::-webkit-file-upload-button {
     appearance: button;
   }
 
+  input[type="text"],
   input[type="date"],
   input[type="number"] {
     appearance: none;
@@ -281,9 +312,18 @@
   }
 
   input[type="range"]::-webkit-slider-thumb {
+    -webkit-appearance: none;
+    -moz-appearance: none;
     appearance: none;
   }
 
+  input[type="range"]::-ms-track {
+    cursor: pointer;
+    background: transparent;
+    border-color: transparent;
+    color: transparent;
+  }
+
   input[type="checkbox"] {
     appearance: checkbox;
   }
@@ -293,6 +333,7 @@
   }
 
   progress {
+    -webkit-appearance: none;
     appearance: none;
     border: 1px solid #e1e1e1;
   }

package/src/types/theme-tokens.ts

@@ -1,81 +1,83 @@
+import type { color_primitive, color_semantic } from "../data/color";
+import type {
+  layout_breakpoint,
+  layout_radius,
+  layout_size,
+} from "../data/layout";
+import type { spacing_gap, spacing_padding } from "../data/spacing";
+import type { themeTokens } from "../data/tokens";
+import type { typography_tokens } from "../data/typography";
+
 /**
- * ThemeTypographyVariant; typography variant token 구조
- * @property {number} size font-size px 값
- * @property {string} line_height line-height 값
- * @property {number} letter_spacing letter-spacing 값
- * @property {number} font_weight font-weight 값
+ * ThemeColorPrimitive; primitive color token snapshot 타입
  */
-export interface ThemeTypographyVariant {
-  /**
-   * font-size px 값
-   */
-  readonly size: number;
-  /**
-   * line-height 값
-   */
-  readonly line_height: string;
-  /**
-   * letter-spacing 값
-   */
-  readonly letter_spacing: number;
-  /**
-   * font-weight 값
-   */
-  readonly font_weight: number;
-}
+export type ThemeColorPrimitive = typeof color_primitive;
 
 /**
- * ThemeColorPrimitive; primitive color token map
+ * ThemeColorSemantic; semantic color token snapshot 타입
  */
-export type ThemeColorPrimitive = Record<string, string>;
+export type ThemeColorSemantic = typeof color_semantic;
+
 /**
- * ThemeColorSemanticSection; semantic color nested token map
+ * ThemeColorSemanticSection; semantic color nested token map 호환 타입
  * @property {string | ThemeColorSemanticSection} [token] semantic color value 또는 하위 section
  */
 export interface ThemeColorSemanticSection {
   readonly [token: string]: string | ThemeColorSemanticSection;
 }
+
+/**
+ * ThemeSpacingPadding; spacing padding token snapshot 타입
+ */
+export type ThemeSpacingPadding = typeof spacing_padding;
+
 /**
- * ThemeSpacingScale; spacing scale token map
+ * ThemeSpacingGap; spacing gap token snapshot 타입
+ */
+export type ThemeSpacingGap = typeof spacing_gap;
+
+/**
+ * ThemeSpacingScale; spacing scale token map 호환 타입
  */
 export type ThemeSpacingScale = Record<string, number>;
+
+/**
+ * ThemeLayoutBreakpoint; layout breakpoint token snapshot 타입
+ */
+export type ThemeLayoutBreakpoint = typeof layout_breakpoint;
+
 /**
- * ThemeLayoutSizes; layout size token map
+ * ThemeLayoutSize; layout size token snapshot 타입
+ */
+export type ThemeLayoutSize = typeof layout_size;
+
+/**
+ * ThemeLayoutRadius; layout radius token snapshot 타입
+ */
+export type ThemeLayoutRadius = typeof layout_radius;
+
+/**
+ * ThemeLayoutSizes; layout size token map 호환 타입
  */
 export type ThemeLayoutSizes = Record<string, number>;
+
 /**
- * ThemeTypographyCategory; typography category token map
+ * ThemeTypography; typography token snapshot 타입
  */
-export type ThemeTypographyCategory = Record<string, ThemeTypographyVariant>;
+export type ThemeTypography = typeof typography_tokens;
+
+/**
+ * ThemeTypographyCategory; typography category token map 타입
+ */
+export type ThemeTypographyCategory = ThemeTypography[keyof ThemeTypography];
+
+/**
+ * ThemeTypographyVariant; typography variant token 구조
+ */
+export type ThemeTypographyVariant =
+  ThemeTypographyCategory[keyof ThemeTypographyCategory];
 
 /**
  * ThemeTokens; foundation token snapshot 전체 구조
- * @property {{ primitive: ThemeColorPrimitive; semantic: ThemeColorSemanticSection }} color color token 집합
- * @property {{ padding: ThemeSpacingScale; gap: ThemeSpacingScale }} spacing spacing token 집합
- * @property {{ breakpoint: Record<"xsmall" | "small" | "medium" | "large", number>; size: ThemeLayoutSizes; radius: { size: ThemeLayoutSizes; level: ThemeLayoutSizes } }} layout layout token 집합
- * @property {{ [category: string]: ThemeTypographyCategory }} typography typography token 집합
  */
-export interface ThemeTokens {
-  readonly color: {
-    readonly primitive: ThemeColorPrimitive;
-    readonly semantic: ThemeColorSemanticSection;
-  };
-  readonly spacing: {
-    readonly padding: ThemeSpacingScale;
-    readonly gap: ThemeSpacingScale;
-  };
-  readonly layout: {
-    readonly breakpoint: Record<
-      "xsmall" | "small" | "medium" | "large",
-      number
-    >;
-    readonly size: ThemeLayoutSizes;
-    readonly radius: {
-      readonly size: ThemeLayoutSizes;
-      readonly level: ThemeLayoutSizes;
-    };
-  };
-  readonly typography: {
-    readonly [category: string]: ThemeTypographyCategory;
-  };
-}
+export type ThemeTokens = typeof themeTokens;