@pylerai/design-system 2.3.1-rc.1 → 2.5.0

package/dist/tokens/pyler-light.js

@@ -10,11 +10,11 @@ const g = [
   "category",
   "icon"
 ];
-function c(e) {
+function h(e) {
   return e.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
 }
 function n(e) {
-  return e.split(".").map(c).join("-");
+  return e.split(".").map(h).join("-");
 }
 function i(e) {
   return `--ds-${n(e)}`;
@@ -22,11 +22,11 @@ function i(e) {
 function l(e) {
   return `bg-ds-${n(e)}`;
 }
-function h(e) {
+function c(e) {
   return typeof e == "object" && e !== null && "hex" in e && typeof e.hex == "string";
 }
 function s(e, r, a) {
-  if (h(e)) {
+  if (c(e)) {
     const t = r.join("."), o = r[0];
     return [
       {
@@ -49,14 +49,16 @@ const F = {
     white: { hex: "#FFFFFF" }
   },
   main: {
-    default: { hex: "#2C80F5" }
+    default: { hex: "#2C80F5" },
+    "sky-blue": { hex: "#BAD3F6" }
   },
   background: {
     default: { hex: "#FFFFFF" }
   },
   text: {
     strong: { hex: "#333333" },
-    normal: { hex: "#969696" },
+    medium: { hex: "#666666" },
+    normal: { hex: "#AFAFAF" },
     disabled: { hex: "#CCCCCC" }
   },
   line: {
@@ -66,7 +68,9 @@ const F = {
   surface: {
     strong: { hex: "#F5F5F5" },
     normal: { hex: "#F7F8F9" },
-    alternative: { hex: "#FFFFFF" }
+    alternative: { hex: "#FFFFFF" },
+    hovered: { hex: "#E2E2E2" },
+    disabled: { hex: "#EBEBEB" }
   },
   primary: {
     "blue-normal": { hex: "#2C80F5" },
@@ -83,17 +87,17 @@ const F = {
     "green-muted": { hex: "#F4FBF7" }
   },
   category: {
-    sexual: { hex: "#FF6355" },
-    violence: { hex: "#C06528" },
-    hate: { hex: "#6554C0" },
-    politics: { hex: "#0B945A" },
-    controversy: { hex: "#0098B2" },
+    sexual: { hex: "#E83535" },
+    violence: { hex: "#E48752" },
+    hate: { hex: "#914FD2" },
+    politics: { hex: "#0A9050" },
+    controversy: { hex: "#0D7E8C" },
     talk: { hex: "#2B70E4" },
-    overseas: { hex: "#E63FE1" },
-    religion: { hex: "#FFC400" },
-    custom: { hex: "#58CF04" },
-    sensitive: { hex: "#CC3D00" },
-    issue: { hex: "#00B8D9" }
+    overseas: { hex: "#F779F3" },
+    religion: { hex: "#F0A200" },
+    custom: { hex: "#8AAF12" },
+    sensitive: { hex: "#C82868" },
+    issue: { hex: "#57AAE0" }
   },
   icon: {
     strong: { hex: "#333333" },
@@ -112,7 +116,7 @@ const F = {
   ["category.custom", "Custom"],
   ["category.sensitive", "Sensitive"],
   ["category.issue", "Issue"]
-]), C = s(
+]), d = s(
   F,
   [],
   x
@@ -120,15 +124,15 @@ const F = {
 function u(e) {
   return i(e);
 }
-const d = u;
-function y(e) {
+const C = u;
+function E(e) {
   return n(e);
 }
 export {
   F as PYLER_LIGHT_COLOR_TOKENS,
   g as PYLER_LIGHT_GROUP_ORDER,
-  C as flatPylerLightTokens,
-  y as formatPylerPathForDisplay,
+  d as flatPylerLightTokens,
+  E as formatPylerPathForDisplay,
   u as getDsCssVar,
-  d as getPylerCssVar
+  C as getPylerCssVar
 };

package/dist/tokens/shadow-radius.d.ts

@@ -9,11 +9,11 @@
 export declare const DS_RADIUS: {
     /** 2px — 체크박스 등 가장 작은 요소 */
     readonly xs: "var(--ds-radius-xs)";
-    /** 4px — 작은 버튼(Height 36px 미만), 배지, 라벨 */
+    /** 4px — 작은 아이콘 버튼, 배지, 라벨 */
     readonly ss: "var(--ds-radius-ss)";
-    /** 8px — 주요 버튼, 인풋, 카드 */
+    /** 8px — 버튼(small 포함), 인풋, 카드 */
     readonly md: "var(--ds-radius-md)";
-    /** 12px — 모달 */
+    /** 12px — 모달, 스낵바 */
     readonly lg: "var(--ds-radius-lg)";
 };
 export type DsRadiusKey = keyof typeof DS_RADIUS;

package/dist/tokens/shadow-radius.js

@@ -2,11 +2,11 @@
 const s = {
   /** 2px — 체크박스 등 가장 작은 요소 */
   xs: "var(--ds-radius-xs)",
-  /** 4px — 작은 버튼(Height 36px 미만), 배지, 라벨 */
+  /** 4px — 작은 아이콘 버튼, 배지, 라벨 */
   ss: "var(--ds-radius-ss)",
-  /** 8px — 주요 버튼, 인풋, 카드 */
+  /** 8px — 버튼(small 포함), 인풋, 카드 */
   md: "var(--ds-radius-md)",
-  /** 12px — 모달 */
+  /** 12px — 모달, 스낵바 */
   lg: "var(--ds-radius-lg)"
 }, d = {
   /** 모달 이외 팝업, 드롭다운 리스트, 더보기 */

package/dist/tokens/typography.d.ts

@@ -82,9 +82,15 @@ export declare const PYLER_TYPOGRAPHY_STYLE: {
         readonly lineHeight: "var(--ds-type-label-1-r-line-height)";
         readonly fontWeight: "var(--ds-type-label-1-r-font-weight)";
     };
+    readonly label1Sb: {
+        readonly fontFamily: "var(--ds-font-sans)";
+        readonly fontSize: "var(--ds-type-label-1-sb-font-size)";
+        readonly lineHeight: "var(--ds-type-label-1-sb-line-height)";
+        readonly fontWeight: "var(--ds-type-label-1-sb-font-weight)";
+    };
 };
 export type PylerTypographyStyleKey = keyof typeof PYLER_TYPOGRAPHY_STYLE;
 /** Tailwind 유틸 접두사 `text-` 와 정렬 (예: title-1-sb → text-title-1-sb) */
-export type PylerTypographyScale = "title-1-sb" | "title-1-m" | "title-2-sb" | "body-1-m" | "body-1-r" | "body-2-sb" | "body-2-m" | "body-2-r" | "body-3-m" | "body-3-r" | "body-4-m" | "body-4-r" | "label-1-r";
+export type PylerTypographyScale = "title-1-sb" | "title-1-m" | "title-2-sb" | "body-1-m" | "body-1-r" | "body-2-sb" | "body-2-m" | "body-2-r" | "body-3-m" | "body-3-r" | "body-4-m" | "body-4-r" | "label-1-r" | "label-1-sb";
 /** 순수 CSS 클래스 (Tailwind/Chakra 없이) */
-export type PylerTypographyUtilityClass = "ds-type-title-1-sb" | "ds-type-title-1-m" | "ds-type-title-2-sb" | "ds-type-body-1-m" | "ds-type-body-1-r" | "ds-type-body-2-sb" | "ds-type-body-2-m" | "ds-type-body-2-r" | "ds-type-body-3-m" | "ds-type-body-3-r" | "ds-type-body-4-m" | "ds-type-body-4-r" | "ds-type-label-1-r";
+export type PylerTypographyUtilityClass = "ds-type-title-1-sb" | "ds-type-title-1-m" | "ds-type-title-2-sb" | "ds-type-body-1-m" | "ds-type-body-1-r" | "ds-type-body-2-sb" | "ds-type-body-2-m" | "ds-type-body-2-r" | "ds-type-body-3-m" | "ds-type-body-3-r" | "ds-type-body-4-m" | "ds-type-body-4-r" | "ds-type-label-1-r" | "ds-type-label-1-sb";

package/dist/tokens/typography.js

@@ -77,6 +77,12 @@ const t = {
     fontSize: "var(--ds-type-label-1-r-font-size)",
     lineHeight: "var(--ds-type-label-1-r-line-height)",
     fontWeight: "var(--ds-type-label-1-r-font-weight)"
+  },
+  label1Sb: {
+    fontFamily: "var(--ds-font-sans)",
+    fontSize: "var(--ds-type-label-1-sb-font-size)",
+    lineHeight: "var(--ds-type-label-1-sb-line-height)",
+    fontWeight: "var(--ds-type-label-1-sb-font-weight)"
   }
 };
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pylerai/design-system",
-  "version": "2.3.1-rc.1",
+  "version": "2.5.0",
   "description": "design-system for pyler frontend",
   "type": "module",
   "sideEffects": [

package/pyler-tailwind-colors.cjs

@@ -11,6 +11,7 @@ module.exports = {
     },
     main: {
       default: "var(--ds-main-default)",
+      "sky-blue": "var(--ds-main-sky-blue)",
     },
     background: {
       default: "var(--ds-background-default)",
@@ -21,6 +22,7 @@ module.exports = {
     },
     text: {
       strong: "var(--ds-text-strong)",
+      medium: "var(--ds-text-medium)",
       normal: "var(--ds-text-normal)",
       disabled: "var(--ds-text-disabled)",
     },
@@ -32,6 +34,8 @@ module.exports = {
       strong: "var(--ds-surface-strong)",
       normal: "var(--ds-surface-normal)",
       alternative: "var(--ds-surface-alternative)",
+      hovered: "var(--ds-surface-hovered)",
+      disabled: "var(--ds-surface-disabled)",
     },
     primary: {
       "blue-normal": "var(--ds-primary-blue-normal)",

package/pyler-typography.cjs

@@ -110,6 +110,13 @@ const pylerTypographyThemeExtend = {
         fontWeight: "var(--ds-type-label-1-r-font-weight)",
       },
     ],
+    "label-1-sb": [
+      "var(--ds-type-label-1-sb-font-size)",
+      {
+        lineHeight: "var(--ds-type-label-1-sb-line-height)",
+        fontWeight: "var(--ds-type-label-1-sb-font-weight)",
+      },
+    ],
   },
 };