@ihabdevteam/core 0.16.0 → 0.17.0

package/dist/ihabdevteam-core.d.ts

@@ -5119,7 +5119,7 @@ export declare interface SliderProps {
 export declare function sortToValue(key: string, asc: boolean): string | undefined;
 
 /** @public */
-export declare function SoundCompass({ speakers, size, viewT, activeSpeakerId, playedIds, selectedId, answerId, showFeedback, clickable, onSelectSpeaker, buttonSize, showIcon, shortcutAnchor, shortcutScale, }: SoundCompassProps): JSX.Element;
+export declare function SoundCompass({ speakers, size, viewT, activeSpeakerId, playedIds, selectedId, answerId, showFeedback, clickable, onSelectSpeaker, buttonSize, showIcon, shortcutAnchor, shortcutScale, scaleShortcut, }: SoundCompassProps): JSX.Element;
 
 export declare interface SoundCompassExam {
     /** `<SoundCompass {...bind} />` 로 펼쳐 넣는 제어 props */
@@ -5208,6 +5208,17 @@ export declare interface SoundCompassProps {
      * 작아지고, 상한을 올려도 다음 소비자가 또 그 끝에서 막힌다. 그럴 때 직접 준다.
      */
     shortcutScale?: number;
+    /**
+     * 배지를 버튼 크기에 맞춰 스스로 키울지. 기본 꺼짐 — 배지는 24px 그대로다.
+     *
+     * 켜면 `clamp(0.75, buttonSize / 56, 3)` 이 걸린다(묶이지 않는 동안 버튼 대비
+     * 0.43 으로 일정). `shortcutScale` 을 직접 주면 이것과 무관하게 그 값이 이긴다.
+     *
+     * 0.17.0 전에는 이 자동 배율이 **묻지 않고 늘 걸렸다.** 배지를 24px 그대로 두고
+     * 싶은 소비자에게는 끌 방법이 없었고, 큰 버튼에서 배지가 갑자기 커지는 것이
+     * 놀라움이 됐다. 스스로 정하는 쪽을 기본으로 두지 않는다.
+     */
+    scaleShortcut?: boolean;
 }
 
 /**

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

@@ -58,6 +58,8 @@
   /* 호버·포커스도 상태 색과 같은 방식으로 연다 — 소비자가 바꿔 끼울 수 있게. */
   --scb-idle-hover-bg: var(--color-whiteLine);
   --scb-idle-hover-border: var(--color-lightGray);
+  /* 호버의 글자색. 기본은 idle 과 같다 — 주지 않으면 예전 그대로다. */
+  --scb-idle-hover-fg: var(--scb-idle-fg);
   --scb-focus-ring: var(--color-main);
 }
 
@@ -149,6 +151,7 @@
 .sound-compass__speaker-btn--idle:hover {
   background: var(--scb-idle-hover-bg);
   border-color: var(--scb-idle-hover-border);
+  color: var(--scb-idle-hover-fg);
 }
 /* :focus-visible 이라 마우스로 누를 때는 링이 안 뜨고 키보드로 옮길 때만 뜬다. */
 .sound-compass__speaker-btn:focus-visible {

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

@@ -52,6 +52,17 @@ export interface SoundCompassProps {
      * 작아지고, 상한을 올려도 다음 소비자가 또 그 끝에서 막힌다. 그럴 때 직접 준다.
      */
     shortcutScale?: number;
+    /**
+     * 배지를 버튼 크기에 맞춰 스스로 키울지. 기본 꺼짐 — 배지는 24px 그대로다.
+     *
+     * 켜면 `clamp(0.75, buttonSize / 56, 3)` 이 걸린다(묶이지 않는 동안 버튼 대비
+     * 0.43 으로 일정). `shortcutScale` 을 직접 주면 이것과 무관하게 그 값이 이긴다.
+     *
+     * 0.17.0 전에는 이 자동 배율이 **묻지 않고 늘 걸렸다.** 배지를 24px 그대로 두고
+     * 싶은 소비자에게는 끌 방법이 없었고, 큰 버튼에서 배지가 갑자기 커지는 것이
+     * 놀라움이 됐다. 스스로 정하는 쪽을 기본으로 두지 않는다.
+     */
+    scaleShortcut?: boolean;
 }
 /** @public */
-export default function SoundCompass({ speakers, size, viewT, activeSpeakerId, playedIds, selectedId, answerId, showFeedback, clickable, onSelectSpeaker, buttonSize, showIcon, shortcutAnchor, shortcutScale, }: SoundCompassProps): import("react").JSX.Element;
+export default function SoundCompass({ speakers, size, viewT, activeSpeakerId, playedIds, selectedId, answerId, showFeedback, clickable, onSelectSpeaker, buttonSize, showIcon, shortcutAnchor, shortcutScale, scaleShortcut, }: SoundCompassProps): import("react").JSX.Element;

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

@@ -14,7 +14,7 @@ import ShortcutBadge from './ShortcutBadge';
 import './SoundCompass.css';
 const lerp = (a, b, t) => a + (b - a) * t;
 /** @public */
-export default function SoundCompass({ speakers, size = 300, viewT = 0, activeSpeakerId = null, playedIds, selectedId = null, answerId = null, showFeedback = false, clickable = false, onSelectSpeaker, buttonSize = 40, showIcon = true, shortcutAnchor = 'top-right', shortcutScale, }) {
+export default function SoundCompass({ speakers, size = 300, viewT = 0, activeSpeakerId = null, playedIds, selectedId = null, answerId = null, showFeedback = false, clickable = false, onSelectSpeaker, buttonSize = 40, showIcon = true, shortcutAnchor = 'top-right', shortcutScale, scaleShortcut = false, }) {
     const t = Math.max(0, Math.min(1, viewT));
     const CENTER = size / 2;
     // ── 탑뷰 좌표 ──────────────────────────────────────────────────────────
@@ -162,12 +162,16 @@ export default function SoundCompass({ speakers, size = 300, viewT = 0, activeSp
                         // 3 이면 168px 까지 묶이지 않는다. 하한 0.75 는 배지가 읽히는 크기다.
                         //
                         // 그래도 이 식이 안 맞는 자리는 남는다 — 상한을 올려도 다음 소비자가 또
-                        // 그 끝에서 막힌다. 그래서 `shortcutScale` 로 직접 줄 수 있게 열어 두고,
-                        // 안 주면 이 식이 그대로 쓰인다.
+                        // 그 끝에서 막힌다. 그래서 `shortcutScale` 로 직접 줄 수 있게 열어 둔다.
+                        //
+                        // **둘 다 안 주면 변수를 아예 얹지 않는다.** 그러면 CSS 의 기본값 1 이
+                        // 살아 배지가 24px 그대로다. 예전에는 이 식이 묻지 않고 늘 걸렸다.
                         //
                         // 배율은 transform 이 아니라 변수로 넘긴다 — 배지의 anchor 가 같은 속성에
                         // translate 를 걸고 있어, 여기서 transform 을 걸면 그것을 지운다.
-                        ['--shortcut-badge-scale']: String(shortcutScale ?? Math.max(0.75, Math.min(3, buttonSize / 56))),
+                        ...(shortcutScale !== undefined || scaleShortcut
+                            ? { ['--shortcut-badge-scale']: String(shortcutScale ?? Math.max(0.75, Math.min(3, buttonSize / 56))) }
+                            : null),
                         pointerEvents: (clickable ? 'auto' : 'none'),
                         cursor: clickable ? 'pointer' : 'default',
                         // 호출된(=idle이 아닌) 스피커를 다른 스피커 위로 끌어올렸다가, 초기화되면 다시 낮춘다

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ihabdevteam/core",
-  "version": "0.16.0",
+  "version": "0.17.0",
   "private": false,
   "main": "dist/ihabdevteam-core.cjs.js",
   "module": "dist/ihabdevteam-core.esm.js",