@ihabdevteam/core 0.130.0 → 0.131.0

package/dist/ihabdevteam-core.d.ts

@@ -1355,7 +1355,7 @@ export declare function copyText(text: string): Promise<boolean>;
  *
  * 값은 손으로 적고 `test/coreVersion.test.ts` 가 package.json 과 어긋나면 운다.
  */
-export declare const CORE_VERSION = "0.130.0";
+export declare const CORE_VERSION = "0.131.0";
 
 /** @public */
 declare const coreDefault: Record<string, unknown>;
@@ -3017,6 +3017,12 @@ export declare type NavItem = {
     label?: string;
     icon?: string;
     state?: string;
+    /**
+     * 단추 우상단 원형 숫자 배지(SideNav 항목 배지와 같은 모양). 0/undefined 면 숨기고, 99 에서 자른다.
+     * 배지는 낭독기에서 숨기고 개수는 단추 이름에 붙인다. 넘쳐 "…" 메뉴로 가면 메뉴 항목의 배지가 되고,
+     * "…" 단추에는 넘친 항목 개수의 합이 선다.
+     */
+    badgeCount?: number;
 };
 
 /**
@@ -6641,28 +6647,22 @@ export declare interface TopBannerProps {
     'aria-label'?: string;
 }
 
-/** @public */
-export declare const TOPIC_TYPES: ({
-    key: string;
-    label: string;
-    icon: string;
-    color: string;
-    subs: {
-        key: string;
-        label: string;
-    }[];
-    desc?: undefined;
-} | {
+/**
+ * 주제·세부 주제 목록(열쇠·이름·아이콘·색). **설명(desc)은 두지 않는다** — 코어·앱 어디에서도 주제 설명을
+ * 그리지 않고, 한때 7개 주제에 붙어 있던 '소음 환경 속 문장 이해 훈련' 은 훈련 유형(소음 하 문장 듣기)의
+ * 설명을 옮겨 붙인 값이었다(2026-09-14 걷음). 화면에 보이는 설명은 훈련 유형(`TRAINING_TYPES`)의 것이다.
+ * @public
+ */
+export declare const TOPIC_TYPES: {
     key: string;
     label: string;
     icon: string;
-    desc: string;
     color: string;
     subs: {
         key: string;
         label: string;
     }[];
-})[];
+}[];
 
 /**
  * 훈련 카테고리 데이터 DI — 앱에서 주입하는 함수 기반 인터페이스.

package/dist/packages/core/src/components/BottomNav.css

@@ -38,6 +38,21 @@
   overflow: hidden;
 }
 
+/* 단추 한 칸 — 단추와 같은 52px 이라 넘침 계산이 그대로다. 배지(.circle-badge--top-right)의 기준.
+   배지는 Badge 기본 코너(-6px)가 아니라 칸 안쪽 모서리(0)에 둔다 — .bottom-nav__items 가
+   overflow: hidden 이라 바깥으로 나간 6px 가 잘린다(넘침 계산을 위해 그 hidden 은 둬야 한다). */
+.bottom-nav__slot {
+  position: relative;
+  display: flex;
+  flex-shrink: 0;
+  width: 52px;
+  height: 52px;
+}
+.bottom-nav__slot .circle-badge--top-right {
+  top: 0;
+  right: 0;
+}
+
 .bottom-nav__right {
   display: flex;
   align-items: center;

package/dist/packages/core/src/components/BottomNav.d.ts

@@ -6,6 +6,12 @@ export type NavItem = {
     label?: string;
     icon?: string;
     state?: string;
+    /**
+     * 단추 우상단 원형 숫자 배지(SideNav 항목 배지와 같은 모양). 0/undefined 면 숨기고, 99 에서 자른다.
+     * 배지는 낭독기에서 숨기고 개수는 단추 이름에 붙인다. 넘쳐 "…" 메뉴로 가면 메뉴 항목의 배지가 되고,
+     * "…" 단추에는 넘친 항목 개수의 합이 선다.
+     */
+    badgeCount?: number;
 };
 /**
  * 항상 "더보기(…)" 메뉴에만 노출되는 유틸 항목(알림·설정·계정 등).

package/dist/packages/core/src/components/BottomNav.js

@@ -4,6 +4,7 @@ import { useCallback, useId, useMemo, useState, useRef, useEffect } from 'react'
 import { createPortal } from 'react-dom';
 import './BottomNav.css';
 import Button from './Button';
+import Badge from './Badge';
 import MenuTooltip from './Tooltip/MenuTooltip';
 // .tooltip-content(메뉴 표면)를 직접 쓰므로 정의 파일을 명시적으로 가져온다.
 // Tooltip.tsx만 이 CSS를 import하는데 BottomNav는 그 컴포넌트를 거치지 않아,
@@ -13,6 +14,8 @@ import { useAnchoredMenu } from '../hooks/useAnchoredMenu';
 import { useTranslation } from 'react-i18next';
 const BTN_SIZE = 52;
 const BTN_GAP = 10;
+/** 배지 숫자 — SideNav·MenuTooltip 과 같이 99 에서 자른다. 0 이하·없음은 0. */
+const badgeOf = (n) => (n && n > 0 ? n : 0);
 /** @public */
 export default function BottomNav({ items = [], activeKey, onChange, appMode, onAppModeChange, moreItems = [], }) {
     const { t } = useTranslation();
@@ -59,6 +62,8 @@ export default function BottomNav({ items = [], activeKey, onChange, appMode, on
         onScroll: 'ignore',
         onResize: 'ignore',
     });
+    /* 단추 이름에 개수를 붙인다 — 배지는 aria-hidden 이라 개수는 이름으로만 전해진다. */
+    const nameWithCount = useCallback((label, count) => count > 0 ? t('nav.badgeLabel', { label, count, defaultValue: '{{label}}, {{count}}개' }) : label, [t]);
     const handleModeChange = useCallback(() => onAppModeChange?.(nextMode), [onAppModeChange, nextMode]);
     // 넘친 nav 항목 또는 유틸 항목이 현재 활성 상태면 … 버튼에 그 아이콘/선택표시를 반영
     const activeMore = useMemo(() => hiddenItems.find(it => it.key === activeKey) ?? moreItems.find(it => it.selected || (it.key && it.key === activeKey)), [hiddenItems, activeKey, moreItems]);
@@ -68,6 +73,7 @@ export default function BottomNav({ items = [], activeKey, onChange, appMode, on
                 ...hiddenItems.map(it => ({
                     label: it.label,
                     icon: it.icon,
+                    badgeCount: it.badgeCount,
                     selected: it.key === activeKey,
                     closeOnSelect: true,
                     onClick: () => {
@@ -89,5 +95,10 @@ export default function BottomNav({ items = [], activeKey, onChange, appMode, on
                 })),
             ]
         }], [hiddenItems, moreItems, activeKey, onChange, handleCloseMore]);
-    return (_jsxs("nav", { className: "bottom-nav", "aria-label": t('nav.bottomNav', '하단 네비게이션'), children: [onAppModeChange && (_jsxs(_Fragment, { children: [_jsx("div", { className: "bottom-nav__left", children: _jsx(Button, { size: 52, type: "dot", icon: modeIcon, ariaLabel: modeLabel, className: "bottom-nav-item", onClick: handleModeChange }) }), _jsx("div", { className: "bottom-nav__divider", "aria-hidden": "true" })] })), _jsx("div", { className: "bottom-nav__items", ref: itemsRef, children: visibleItems.map((it) => (_jsx(Button, { size: 52, type: "dot", icon: it.icon, ariaLabel: it.label, selected: it.key === activeKey, disabled: it.state === 'disabled', className: "bottom-nav-item", onClick: () => it.key && onChange?.(it.key) }, it.key))) }), showMore && (_jsxs(_Fragment, { children: [_jsx("div", { className: "bottom-nav__divider", "aria-hidden": "true" }), _jsx("div", { className: "bottom-nav__right", children: _jsxs("div", { ref: moreRef, children: [_jsx(Button, { size: 52, type: "dot", icon: activeMore?.icon ?? 'ellipsis', ariaLabel: activeMore?.label ?? t('nav.more', '더보기'), selected: !!activeMore, className: "bottom-nav-item", onClick: handleToggleMore, "aria-expanded": moreOpen, "aria-controls": moreOpen ? moreMenuId : undefined }), moreOpen && createPortal(_jsx("div", { id: moreMenuId, role: "group", "aria-label": t('nav.moreMenu', '더보기 메뉴'), className: "tooltip-content", style: menuStyle, ref: menuRef, children: _jsx(MenuTooltip, { columns: moreColumns, onClose: handleCloseMore }) }), document.body)] }) })] }))] }));
+    // "…" 단추 배지 — 메뉴 안에서만 보이는 개수(넘친 항목 + 유틸)를 닫힌 채로도 알린다.
+    const moreBadge = [...hiddenItems, ...moreItems].reduce((sum, it) => sum + badgeOf(it.badgeCount), 0);
+    return (_jsxs("nav", { className: "bottom-nav", "aria-label": t('nav.bottomNav', '하단 네비게이션'), children: [onAppModeChange && (_jsxs(_Fragment, { children: [_jsx("div", { className: "bottom-nav__left", children: _jsx(Button, { size: 52, type: "dot", icon: modeIcon, ariaLabel: modeLabel, className: "bottom-nav-item", onClick: handleModeChange }) }), _jsx("div", { className: "bottom-nav__divider", "aria-hidden": "true" })] })), _jsx("div", { className: "bottom-nav__items", ref: itemsRef, children: visibleItems.map((it) => {
+                    const count = badgeOf(it.badgeCount);
+                    return (_jsxs("span", { className: "bottom-nav__slot", children: [_jsx(Button, { size: 52, type: "dot", icon: it.icon, ariaLabel: nameWithCount(it.label, count), selected: it.key === activeKey, disabled: it.state === 'disabled', className: "bottom-nav-item", onClick: () => it.key && onChange?.(it.key) }), count > 0 && (_jsx("span", { "aria-hidden": "true", children: _jsx(Badge, { type: "dot", position: "top-right", number: Math.min(count, 99), size: 24 }) }))] }, it.key));
+                }) }), showMore && (_jsxs(_Fragment, { children: [_jsx("div", { className: "bottom-nav__divider", "aria-hidden": "true" }), _jsx("div", { className: "bottom-nav__right", children: _jsxs("div", { ref: moreRef, className: "bottom-nav__slot", children: [_jsx(Button, { size: 52, type: "dot", icon: activeMore?.icon ?? 'ellipsis', ariaLabel: nameWithCount(activeMore?.label ?? t('nav.more', '더보기'), moreBadge), selected: !!activeMore, className: "bottom-nav-item", onClick: handleToggleMore, "aria-expanded": moreOpen, "aria-controls": moreOpen ? moreMenuId : undefined }), moreBadge > 0 && (_jsx("span", { "aria-hidden": "true", children: _jsx(Badge, { type: "dot", position: "top-right", number: Math.min(moreBadge, 99), size: 24 }) })), moreOpen && createPortal(_jsx("div", { id: moreMenuId, role: "group", "aria-label": t('nav.moreMenu', '더보기 메뉴'), className: "tooltip-content", style: menuStyle, ref: menuRef, children: _jsx(MenuTooltip, { columns: moreColumns, onClose: handleCloseMore }) }), document.body)] }) })] }))] }));
 }

package/dist/packages/core/src/components/Header.js

@@ -47,7 +47,8 @@ export default function Header({ activeKey, onChange, items, malgwiItems: _malgw
        캐스팅만 해 넘겨, 두 타입의 이름이 다른 칸이 조용히 버려졌다 — `disabled` 가 `state` 로
        안 가서 **비활성 항목이 모바일에서 눌렸고**, `href` 항목은 새 창 대신 `onChange(key)` 로
        갔다. SideNav 가 거르는 구획(section)·빈 항목도 같이 거른다.
-       (`badge` 는 BottomNav 에 받을 자리가 없어 아직 못 옮긴다.) */
+       `badge` 는 `badgeCount` 로 옮긴다 — BottomNav 가 단추 모서리(넘치면 "…" 단추와 메뉴 항목)에
+       SideNav 와 같은 원형 숫자 배지로 그린다. 예전엔 받을 자리가 없어 숙제 개수가 모바일에서 안 보였다. */
     const bottomItems = useMemo(() => (items ?? [])
         .filter(it => !it.section && (it.key || it.label))
         .map(it => ({
@@ -55,6 +56,7 @@ export default function Header({ activeKey, onChange, items, malgwiItems: _malgw
         label: typeof it.label === 'string' ? it.label : undefined,
         icon: it.icon,
         state: it.disabled ? 'disabled' : undefined,
+        badgeCount: it.badge,
     })), [items]);
     const handleBottomChange = useCallback((key) => {
         const it = items?.find(i => i.key === key);

package/dist/packages/core/src/components/PassCard/PassCardBg.css

@@ -37,3 +37,36 @@
   -webkit-mask: var(--symbol-url) center / contain no-repeat;
   mask: var(--symbol-url) center / contain no-repeat;
 }
+
+/* ── PassCardBg 컴포넌트 자체의 변형(default · blue · dark) ─────────────────
+   9종 배경은 각자 파일에 모양을 두고, 이 기본 컴포넌트의 원 셋과 변형은 규칙이 없어
+   세 변형이 똑같이(빈 바탕으로) 그려졌다(2026-09-14, 사용자가 정하도록 맡김).
+   **새 색은 쓰지 않는다** — 원 구도는 PassCardBgTwoCircle 과 같게(큰 원 우상단 · 작은 원
+   우하단)에 좌하단 원 하나를 더하고, 색은 브랜드·중립 토큰만 쓴다. 만료 카드
+   (.pass-card--expired)가 --color-main/sub 를 회색으로 바꾸는 규칙도 그대로 따라온다. */
+.pass-card-bg__circle {
+  position: absolute;
+  border-radius: 50%;
+  opacity: var(--pass-card-symbol-opacity, 0.75);
+}
+.pass-card-bg__circle--1 { width: 340px; height: 340px; top: -140px; right: -150px; }
+.pass-card-bg__circle--2 { width: 220px; height: 220px; bottom: -90px; right: -50px; }
+.pass-card-bg__circle--3 { width: 140px; height: 140px; bottom: -70px; left: -40px; }
+
+/* default — 흰 바탕 + main · sub 원(TwoCircle 과 같은 결) */
+.pass-card-bg--default { background: var(--color-pureWhite); }
+.pass-card-bg--default .pass-card-bg__circle--1 { background: var(--color-main); }
+.pass-card-bg--default .pass-card-bg__circle--2 { background: var(--color-sub); }
+.pass-card-bg--default .pass-card-bg__circle--3 { background: var(--color-main-a20); }
+
+/* blue — 짙은 main 바탕 + 흰 반투명 원 */
+.pass-card-bg--blue { background: var(--color-deepMain); }
+.pass-card-bg--blue .pass-card-bg__circle--1 { background: var(--color-white-a30); }
+.pass-card-bg--blue .pass-card-bg__circle--2 { background: var(--color-white-a10); }
+.pass-card-bg--blue .pass-card-bg__circle--3 { background: var(--color-white-a10); }
+
+/* dark — 검은 바탕 + main · sub 원 */
+.pass-card-bg--dark { background: var(--color-softBlack); }
+.pass-card-bg--dark .pass-card-bg__circle--1 { background: var(--color-main); }
+.pass-card-bg--dark .pass-card-bg__circle--2 { background: var(--color-sub); }
+.pass-card-bg--dark .pass-card-bg__circle--3 { background: var(--color-white-a10); }

package/dist/packages/core/src/i18n/locales/en.json

@@ -173,7 +173,8 @@
         "wordTable": "Word Table Creator",
         "company": "Company Info",
         "more": "More",
-        "moreMenu": "More menu"
+        "moreMenu": "More menu",
+        "badgeLabel": "{{label}}, {{count}}"
     },
     "settings": {
         "language": {

package/dist/packages/core/src/i18n/locales/ko.json

@@ -171,7 +171,8 @@
         "wordTable": "단어표 만들기",
         "company": "업체정보",
         "more": "더보기",
-        "moreMenu": "더보기 메뉴"
+        "moreMenu": "더보기 메뉴",
+        "badgeLabel": "{{label}}, {{count}}개"
     },
     "settings": {
         "language": {

package/dist/packages/core/src/utils/CategoryData.d.ts

@@ -6,28 +6,22 @@ export declare const TRAINING_TYPES: {
     icon: string;
     desc: string;
 }[];
-/** @public */
-export declare const TOPIC_TYPES: ({
-    key: string;
-    label: string;
-    icon: string;
-    color: string;
-    subs: {
-        key: string;
-        label: string;
-    }[];
-    desc?: undefined;
-} | {
+/**
+ * 주제·세부 주제 목록(열쇠·이름·아이콘·색). **설명(desc)은 두지 않는다** — 코어·앱 어디에서도 주제 설명을
+ * 그리지 않고, 한때 7개 주제에 붙어 있던 '소음 환경 속 문장 이해 훈련' 은 훈련 유형(소음 하 문장 듣기)의
+ * 설명을 옮겨 붙인 값이었다(2026-09-14 걷음). 화면에 보이는 설명은 훈련 유형(`TRAINING_TYPES`)의 것이다.
+ * @public
+ */
+export declare const TOPIC_TYPES: {
     key: string;
     label: string;
     icon: string;
-    desc: string;
     color: string;
     subs: {
         key: string;
         label: string;
     }[];
-})[];
+}[];
 /** 훈련 유형 i18n 키 매핑 */
 export declare const TRAINING_TYPE_I18N_KEY: Record<string, string>;
 /** 번역된 훈련 유형 레이블/설명 반환 */
@@ -38,7 +32,7 @@ export declare function translateTrainingTypes(t: TFunction): {
     desc: string;
 }[];
 /** 번역된 토픽/서브토픽 레이블 반환 — 컴포넌트에서 useMemo와 함께 사용 */
-export declare function translateTopicTypes(t: TFunction): ({
+export declare function translateTopicTypes(t: TFunction): {
     label: string;
     subs: {
         label: string;
@@ -47,18 +41,7 @@ export declare function translateTopicTypes(t: TFunction): ({
     key: string;
     icon: string;
     color: string;
-    desc?: undefined;
-} | {
-    label: string;
-    subs: {
-        label: string;
-        key: string;
-    }[];
-    key: string;
-    icon: string;
-    desc: string;
-    color: string;
-})[];
+}[];
 declare const _default: {
     TRAINING_TYPES: {
         key: string;
@@ -66,7 +49,7 @@ declare const _default: {
         icon: string;
         desc: string;
     }[];
-    TOPIC_TYPES: ({
+    TOPIC_TYPES: {
         key: string;
         label: string;
         icon: string;
@@ -75,17 +58,6 @@ declare const _default: {
             key: string;
             label: string;
         }[];
-        desc?: undefined;
-    } | {
-        key: string;
-        label: string;
-        icon: string;
-        desc: string;
-        color: string;
-        subs: {
-            key: string;
-            label: string;
-        }[];
-    })[];
+    }[];
 };
 export default _default;

package/dist/packages/core/src/utils/CategoryData.js

@@ -5,18 +5,23 @@ export const TRAINING_TYPES = [
     { key: "LONG_STORY", label: "긴 이야기 듣기", icon: "message-square-text", desc: "긴 이야기를 듣고 기억하여 다수의 문제를 풀어봅니다." },
     { key: "ORDERING_SENTENCE", label: "문장 순서화 하기", icon: "align-start-vertical", desc: "여러개의 짧은 문장을 듣고 기억하여 그 순서에 맞게 배열합니다." },
 ];
-/** @public */
+/**
+ * 주제·세부 주제 목록(열쇠·이름·아이콘·색). **설명(desc)은 두지 않는다** — 코어·앱 어디에서도 주제 설명을
+ * 그리지 않고, 한때 7개 주제에 붙어 있던 '소음 환경 속 문장 이해 훈련' 은 훈련 유형(소음 하 문장 듣기)의
+ * 설명을 옮겨 붙인 값이었다(2026-09-14 걷음). 화면에 보이는 설명은 훈련 유형(`TRAINING_TYPES`)의 것이다.
+ * @public
+ */
 export const TOPIC_TYPES = [
     { key: 'FOOD', label: '음식', icon: 'salad', color: '#FF8A65', subs: [{ key: 'TRKRFD', label: '한국 전통음식' }, { key: 'MDKRFD', label: '한국 현대음식' }, { key: 'WRLDFD', label: '세계의 음식' }, { key: 'MTRFRT', label: '식재료와 과일' }, { key: 'GEFDKL', label: '음식 상식' }] },
     { key: 'HLTH', label: '건강', icon: 'heart', color: '#66BB6A', subs: [{ key: 'HTETHB', label: '건강한 식습관' }, { key: 'DISILL', label: '병과 질환' }, { key: 'EXCISE', label: '운동' }, { key: 'GEHTKL', label: '건강상식' }] },
     { key: 'WETH', label: '날씨', icon: 'sun-medium', color: '#42A5F5', subs: [{ key: 'GESSKL', label: '계절상식' }, { key: 'SNWRAN', label: '눈과 비' }, { key: 'WTHFCT', label: '일기예보' }, { key: 'GEWTKL', label: '날씨상식' }] },
-    { key: 'PRSN', label: '인물', icon: 'user-round', desc: '소음 환경 속 문장 이해 훈련', color: '#AB47BC', subs: [{ key: 'JODYPS', label: '조선시대' }, { key: 'MDKRPS', label: '한국 근현대' }, { key: 'THKDPS', label: '삼국시대' }, { key: 'WRLART', label: '세계의 예술가' }, { key: 'WRLPSN', label: '세계의 인물' }] },
-    { key: 'KRCT', label: '한국문화', icon: 'bow-arrow', desc: '소음 환경 속 문장 이해 훈련', color: '#EC407A', subs: [{ key: 'KRLANG', label: '우리말' }, { key: 'TRPLCT', label: '전통놀이' }, { key: 'HERITG', label: '문화재' }, { key: 'EVTFES', label: '행사와 축제' }, { key: 'GECTKL', label: '상식' }] },
-    { key: 'STRY', label: '이야기', icon: 'message-circle', desc: '소음 환경 속 문장 이해 훈련', color: '#8D6E63', subs: [{ key: 'FRYTAL', label: '동화' }, { key: 'AMZING', label: '신기한 이야기' }, { key: 'DAYSTR', label: '일상 속 이야기' }] },
-    { key: 'LOCA', label: '지역', icon: 'map-pin', desc: '소음 환경 속 문장 이해 훈련', color: '#26A69A', subs: [{ key: 'KRLDMK', label: '한국의 명소' }, { key: 'SELNMK', label: '서울의 명소' }, { key: 'WRDTRB', label: '세계여행' }, { key: 'NAVIGT', label: '길 찾기' }] },
-    { key: 'SOAR', label: '사회와 예술', icon: 'landmark', desc: '소음 환경 속 문장 이해 훈련', color: '#5C6BC0', subs: [{ key: 'KRSOCI', label: '한국' }, { key: 'ECONEW', label: '경제와 뉴스' }, { key: 'GENART', label: '예술' }, { key: 'GELFKL', label: '생활 상식' }] },
-    { key: 'NTSC', label: '자연과 과학', icon: 'leaf', desc: '소음 환경 속 문장 이해 훈련', color: '#9CCC65', subs: [{ key: 'ANIMAL', label: '동물' }, { key: 'PLANTS', label: '식물' }, { key: 'ETHPLT', label: '지구' }, { key: 'TOLELC', label: '도구와 전자제품' }, { key: 'GESCKL', label: '과학상식' }] },
-    { key: 'SPRT', label: '스포츠', icon: 'trophy', desc: '소음 환경 속 문장 이해 훈련', color: '#FFCA28', subs: [{ key: 'INVDSP', label: '개인경기' }, { key: 'MARART', label: '격투기' }, { key: 'TEAMSP', label: '단체경기' }, { key: 'FOOTBL', label: '축구' }, { key: 'GESPKL', label: '스포츠 상식' }] },
+    { key: 'PRSN', label: '인물', icon: 'user-round', color: '#AB47BC', subs: [{ key: 'JODYPS', label: '조선시대' }, { key: 'MDKRPS', label: '한국 근현대' }, { key: 'THKDPS', label: '삼국시대' }, { key: 'WRLART', label: '세계의 예술가' }, { key: 'WRLPSN', label: '세계의 인물' }] },
+    { key: 'KRCT', label: '한국문화', icon: 'bow-arrow', color: '#EC407A', subs: [{ key: 'KRLANG', label: '우리말' }, { key: 'TRPLCT', label: '전통놀이' }, { key: 'HERITG', label: '문화재' }, { key: 'EVTFES', label: '행사와 축제' }, { key: 'GECTKL', label: '상식' }] },
+    { key: 'STRY', label: '이야기', icon: 'message-circle', color: '#8D6E63', subs: [{ key: 'FRYTAL', label: '동화' }, { key: 'AMZING', label: '신기한 이야기' }, { key: 'DAYSTR', label: '일상 속 이야기' }] },
+    { key: 'LOCA', label: '지역', icon: 'map-pin', color: '#26A69A', subs: [{ key: 'KRLDMK', label: '한국의 명소' }, { key: 'SELNMK', label: '서울의 명소' }, { key: 'WRDTRB', label: '세계여행' }, { key: 'NAVIGT', label: '길 찾기' }] },
+    { key: 'SOAR', label: '사회와 예술', icon: 'landmark', color: '#5C6BC0', subs: [{ key: 'KRSOCI', label: '한국' }, { key: 'ECONEW', label: '경제와 뉴스' }, { key: 'GENART', label: '예술' }, { key: 'GELFKL', label: '생활 상식' }] },
+    { key: 'NTSC', label: '자연과 과학', icon: 'leaf', color: '#9CCC65', subs: [{ key: 'ANIMAL', label: '동물' }, { key: 'PLANTS', label: '식물' }, { key: 'ETHPLT', label: '지구' }, { key: 'TOLELC', label: '도구와 전자제품' }, { key: 'GESCKL', label: '과학상식' }] },
+    { key: 'SPRT', label: '스포츠', icon: 'trophy', color: '#FFCA28', subs: [{ key: 'INVDSP', label: '개인경기' }, { key: 'MARART', label: '격투기' }, { key: 'TEAMSP', label: '단체경기' }, { key: 'FOOTBL', label: '축구' }, { key: 'GESPKL', label: '스포츠 상식' }] },
 ];
 /** 훈련 유형 i18n 키 매핑 */
 export const TRAINING_TYPE_I18N_KEY = {

package/dist/packages/core/src/version.d.ts

@@ -46,4 +46,4 @@
  *
  * 값은 손으로 적고 `test/coreVersion.test.ts` 가 package.json 과 어긋나면 운다.
  */
-export declare const CORE_VERSION = "0.130.0";
+export declare const CORE_VERSION = "0.131.0";

package/dist/packages/core/src/version.js

@@ -46,4 +46,4 @@
  *
  * 값은 손으로 적고 `test/coreVersion.test.ts` 가 package.json 과 어긋나면 운다.
  */
-export const CORE_VERSION = '0.130.0';
+export const CORE_VERSION = '0.131.0';