@mindlogic-ai/logician-ui 5.0.0-alpha.23 → 5.0.0-alpha.25

package/dist/components/Switch/SwitchControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SwitchControl.d.ts","sourceRoot":"","sources":["../../../src/components/Switch/SwitchControl.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,IAAI,YAAY,EAAsB,MAAM,kBAAkB,CAAC;AAK9E,eAAO,MAAM,aAAa,uHAkCzB,CAAC"}
+{"version":3,"file":"SwitchControl.d.ts","sourceRoot":"","sources":["../../../src/components/Switch/SwitchControl.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,IAAI,YAAY,EAAsB,MAAM,kBAAkB,CAAC;AAS9E,eAAO,MAAM,aAAa,uHA4CzB,CAAC"}

package/dist/components/Switch/SwitchControl.js

@@ -7,13 +7,26 @@ var react = require('@chakra-ui/react');
 var disabledControl = require('../../utils/disabledControl.js');
 var focusRing = require('../../utils/focusRing.js');
 
+// Drawn as an inset shadow, not a border, so the thumb's travel and the
+// track's size stay exactly what Chakra's recipe computes.
+const OFF_OUTLINE = 'inset 0 0 0 1px var(--chakra-colors-border-control)';
 const SwitchControl = React.forwardRef((props, ref) => (jsxRuntime.jsx(react.Switch.Control, { ref: ref, 
-    // The off-state track is a meter surface — its extent is the information —
-    // so it needs a visible fill, not just an edge. bg.muted (gray.100) is
-    // only ~1.03:1 against the bg.sunken page wash (gray.50) and vanishes
-    // there; bg.track (gray.300) reads as a filled track on any background.
-    // The checked state is the self-defining primary.main fill.
-    bg: "bg.track", _checked: { bg: 'primary.main' }, animationStyle: "feedback", transitionProperty: "background-color", _disabled: { ...disabledControl.disabledControl, cursor: 'not-allowed' }, ...focusRing.focusRing, ...props, children: jsxRuntime.jsx(react.Switch.Thumb
+    // Off is drawn the way an unchecked Checkbox is: a bg.surface track with a
+    // border.control outline and a border.control thumb, each at least 3:1
+    // against what it sits on (WCAG 1.4.11). The previous off state, a
+    // bg.track fill with a bg.surface thumb, measured 1.3:1 (light) and
+    // 1.4:1 (dark) between thumb and track, so the thumb's position, the only
+    // thing that tells off from on, could not be seen.
+    // On is success.solid with a success.onSolid thumb. With a black (light) or
+    // pale (dark) primary fill, neither state carried colour, and dark-mode
+    // "on" read as light-mode "off"; green gives both modes one meaning.
+    bg: "bg.surface", boxShadow: OFF_OUTLINE, _checked: { bg: 'success.solid', boxShadow: 'none' }, animationStyle: "feedback", transitionProperty: "background-color, box-shadow", _disabled: { ...disabledControl.disabledControl, cursor: 'not-allowed' }, ...focusRing.focusRing, 
+    // focusRing's shadow would replace the outline; keep both while off.
+    _focusVisible: {
+        ...focusRing.focusRing._focusVisible,
+        boxShadow: `${OFF_OUTLINE}, ${focusRing.FOCUS_RING_SHADOW}`,
+        _checked: { boxShadow: focusRing.FOCUS_RING_SHADOW },
+    }, ...props, children: jsxRuntime.jsx(react.Switch.Thumb
     // A toggle is the metaphor of a physical switch, so the thumb settles
     // slightly past its stop rather than easing to a halt. Chakra's default
     // is `translate` over `fast` on a plain curve; `overshoot` is the one
@@ -26,11 +39,10 @@ const SwitchControl = React.forwardRef((props, ref) => (jsxRuntime.jsx(react.Swi
         // curve that stays legible over the thumb's ~16px of travel, because it
         // reverses direction — `standard` vs `emphasized` would not.
         animationStyle: "spring", transitionProperty: "translate", 
-        // Chakra's default is a raw `white` thumb that stays `white` when
-        // checked via an undefined `colorPalette.contrast`. bg.surface reads
-        // as the same near-white in light and flips correctly in dark; the
-        // checked thumb is fg.onPrimary (cream) to match Checkbox/Radio.
-        bg: "bg.surface", _checked: { bg: 'fg.onPrimary' } }) })));
+        // Off: border.control, the same 3:1 control token as the outline.
+        // On: success.onSolid, the text colour success buttons put on the same
+        // fill (white in light, ink in dark).
+        bg: "border.control", _checked: { bg: 'success.onSolid' } }) })));
 SwitchControl.displayName = 'Switch.Control';
 
 exports.SwitchControl = SwitchControl;

package/dist/components/Switch/SwitchControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"SwitchControl.js","sources":["../../../src/components/Switch/SwitchControl.tsx"],"sourcesContent":[null],"names":["forwardRef","_jsx","ChakraSwitch","disabledControl","focusRing"],"mappings":";;;;;;;;;MAMa,aAAa,GAAGA,gBAAU,CACrC,CAAC,KAAK,EAAE,GAAG,MACTC,cAAA,CAACC,YAAY,CAAC,OAAO,EAAA,EACnB,GAAG,EAAE,GAAG;;;;;;AAMR,IAAA,EAAE,EAAC,UAAU,EACb,QAAQ,EAAE,EAAE,EAAE,EAAE,cAAc,EAAE,EAChC,cAAc,EAAC,UAAU,EACzB,kBAAkB,EAAC,kBAAkB,EACrC,SAAS,EAAE,EAAE,GAAGC,+BAAe,EAAE,MAAM,EAAE,aAAa,EAAE,EAAA,GACpDC,mBAAS,EAAA,GACT,KAAK,YAETH,cAAA,CAACC,YAAY,CAAC;;;;;;;;;;;;AAMZ,QAAA,cAAc,EAAC,QAAQ,EACvB,kBAAkB,EAAC,WAAW;;;;;AAK9B,QAAA,EAAE,EAAC,YAAY,EACf,QAAQ,EAAE,EAAE,EAAE,EAAE,cAAc,EAAE,EAAA,CAChC,EAAA,CACmB,CACxB;AAEH,aAAa,CAAC,WAAW,GAAG,gBAAgB;;;;"}
+{"version":3,"file":"SwitchControl.js","sources":["../../../src/components/Switch/SwitchControl.tsx"],"sourcesContent":[null],"names":["forwardRef","_jsx","ChakraSwitch","disabledControl","focusRing","FOCUS_RING_SHADOW"],"mappings":";;;;;;;;;AAMA;AACA;AACA,MAAM,WAAW,GAAG,qDAAqD;MAE5D,aAAa,GAAGA,gBAAU,CACrC,CAAC,KAAK,EAAE,GAAG,MACTC,cAAA,CAACC,YAAY,CAAC,OAAO,EAAA,EACnB,GAAG,EAAE,GAAG;;;;;;;;;;AAUR,IAAA,EAAE,EAAC,YAAY,EACf,SAAS,EAAE,WAAW,EACtB,QAAQ,EAAE,EAAE,EAAE,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,EAAE,EACpD,cAAc,EAAC,UAAU,EACzB,kBAAkB,EAAC,8BAA8B,EACjD,SAAS,EAAE,EAAE,GAAGC,+BAAe,EAAE,MAAM,EAAE,aAAa,EAAE,KACpDC,mBAAS;;AAEb,IAAA,aAAa,EAAE;QACb,GAAGA,mBAAS,CAAC,aAAa;AAC1B,QAAA,SAAS,EAAE,CAAA,EAAG,WAAW,CAAA,EAAA,EAAKC,2BAAiB,CAAA,CAAE;AACjD,QAAA,QAAQ,EAAE,EAAE,SAAS,EAAEA,2BAAiB,EAAE;AAC3C,KAAA,EAAA,GACG,KAAK,EAAA,QAAA,EAETJ,cAAA,CAACC,YAAY,CAAC;;;;;;;;;;;;AAMZ,QAAA,cAAc,EAAC,QAAQ,EACvB,kBAAkB,EAAC,WAAW;;;;AAI9B,QAAA,EAAE,EAAC,gBAAgB,EACnB,QAAQ,EAAE,EAAE,EAAE,EAAE,iBAAiB,EAAE,EAAA,CACnC,EAAA,CACmB,CACxB;AAEH,aAAa,CAAC,WAAW,GAAG,gBAAgB;;;;"}

package/dist/components/Switch/SwitchControl.mjs

@@ -3,15 +3,28 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Switch } from '@chakra-ui/react';
 import { disabledControl } from '../../utils/disabledControl.mjs';
-import { focusRing } from '../../utils/focusRing.mjs';
+import { FOCUS_RING_SHADOW, focusRing } from '../../utils/focusRing.mjs';
 
+// Drawn as an inset shadow, not a border, so the thumb's travel and the
+// track's size stay exactly what Chakra's recipe computes.
+const OFF_OUTLINE = 'inset 0 0 0 1px var(--chakra-colors-border-control)';
 const SwitchControl = forwardRef((props, ref) => (jsx(Switch.Control, { ref: ref, 
-    // The off-state track is a meter surface — its extent is the information —
-    // so it needs a visible fill, not just an edge. bg.muted (gray.100) is
-    // only ~1.03:1 against the bg.sunken page wash (gray.50) and vanishes
-    // there; bg.track (gray.300) reads as a filled track on any background.
-    // The checked state is the self-defining primary.main fill.
-    bg: "bg.track", _checked: { bg: 'primary.main' }, animationStyle: "feedback", transitionProperty: "background-color", _disabled: { ...disabledControl, cursor: 'not-allowed' }, ...focusRing, ...props, children: jsx(Switch.Thumb
+    // Off is drawn the way an unchecked Checkbox is: a bg.surface track with a
+    // border.control outline and a border.control thumb, each at least 3:1
+    // against what it sits on (WCAG 1.4.11). The previous off state, a
+    // bg.track fill with a bg.surface thumb, measured 1.3:1 (light) and
+    // 1.4:1 (dark) between thumb and track, so the thumb's position, the only
+    // thing that tells off from on, could not be seen.
+    // On is success.solid with a success.onSolid thumb. With a black (light) or
+    // pale (dark) primary fill, neither state carried colour, and dark-mode
+    // "on" read as light-mode "off"; green gives both modes one meaning.
+    bg: "bg.surface", boxShadow: OFF_OUTLINE, _checked: { bg: 'success.solid', boxShadow: 'none' }, animationStyle: "feedback", transitionProperty: "background-color, box-shadow", _disabled: { ...disabledControl, cursor: 'not-allowed' }, ...focusRing, 
+    // focusRing's shadow would replace the outline; keep both while off.
+    _focusVisible: {
+        ...focusRing._focusVisible,
+        boxShadow: `${OFF_OUTLINE}, ${FOCUS_RING_SHADOW}`,
+        _checked: { boxShadow: FOCUS_RING_SHADOW },
+    }, ...props, children: jsx(Switch.Thumb
     // A toggle is the metaphor of a physical switch, so the thumb settles
     // slightly past its stop rather than easing to a halt. Chakra's default
     // is `translate` over `fast` on a plain curve; `overshoot` is the one
@@ -24,11 +37,10 @@ const SwitchControl = forwardRef((props, ref) => (jsx(Switch.Control, { ref: ref
         // curve that stays legible over the thumb's ~16px of travel, because it
         // reverses direction — `standard` vs `emphasized` would not.
         animationStyle: "spring", transitionProperty: "translate", 
-        // Chakra's default is a raw `white` thumb that stays `white` when
-        // checked via an undefined `colorPalette.contrast`. bg.surface reads
-        // as the same near-white in light and flips correctly in dark; the
-        // checked thumb is fg.onPrimary (cream) to match Checkbox/Radio.
-        bg: "bg.surface", _checked: { bg: 'fg.onPrimary' } }) })));
+        // Off: border.control, the same 3:1 control token as the outline.
+        // On: success.onSolid, the text colour success buttons put on the same
+        // fill (white in light, ink in dark).
+        bg: "border.control", _checked: { bg: 'success.onSolid' } }) })));
 SwitchControl.displayName = 'Switch.Control';
 
 export { SwitchControl };

package/dist/components/Switch/SwitchControl.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SwitchControl.mjs","sources":["../../../src/components/Switch/SwitchControl.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraSwitch"],"mappings":";;;;;;;MAMa,aAAa,GAAG,UAAU,CACrC,CAAC,KAAK,EAAE,GAAG,MACTA,GAAA,CAACC,MAAY,CAAC,OAAO,EAAA,EACnB,GAAG,EAAE,GAAG;;;;;;AAMR,IAAA,EAAE,EAAC,UAAU,EACb,QAAQ,EAAE,EAAE,EAAE,EAAE,cAAc,EAAE,EAChC,cAAc,EAAC,UAAU,EACzB,kBAAkB,EAAC,kBAAkB,EACrC,SAAS,EAAE,EAAE,GAAG,eAAe,EAAE,MAAM,EAAE,aAAa,EAAE,EAAA,GACpD,SAAS,EAAA,GACT,KAAK,YAETD,GAAA,CAACC,MAAY,CAAC;;;;;;;;;;;;AAMZ,QAAA,cAAc,EAAC,QAAQ,EACvB,kBAAkB,EAAC,WAAW;;;;;AAK9B,QAAA,EAAE,EAAC,YAAY,EACf,QAAQ,EAAE,EAAE,EAAE,EAAE,cAAc,EAAE,EAAA,CAChC,EAAA,CACmB,CACxB;AAEH,aAAa,CAAC,WAAW,GAAG,gBAAgB;;;;"}
+{"version":3,"file":"SwitchControl.mjs","sources":["../../../src/components/Switch/SwitchControl.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraSwitch"],"mappings":";;;;;;;AAMA;AACA;AACA,MAAM,WAAW,GAAG,qDAAqD;MAE5D,aAAa,GAAG,UAAU,CACrC,CAAC,KAAK,EAAE,GAAG,MACTA,GAAA,CAACC,MAAY,CAAC,OAAO,EAAA,EACnB,GAAG,EAAE,GAAG;;;;;;;;;;AAUR,IAAA,EAAE,EAAC,YAAY,EACf,SAAS,EAAE,WAAW,EACtB,QAAQ,EAAE,EAAE,EAAE,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,EAAE,EACpD,cAAc,EAAC,UAAU,EACzB,kBAAkB,EAAC,8BAA8B,EACjD,SAAS,EAAE,EAAE,GAAG,eAAe,EAAE,MAAM,EAAE,aAAa,EAAE,KACpD,SAAS;;AAEb,IAAA,aAAa,EAAE;QACb,GAAG,SAAS,CAAC,aAAa;AAC1B,QAAA,SAAS,EAAE,CAAA,EAAG,WAAW,CAAA,EAAA,EAAK,iBAAiB,CAAA,CAAE;AACjD,QAAA,QAAQ,EAAE,EAAE,SAAS,EAAE,iBAAiB,EAAE;AAC3C,KAAA,EAAA,GACG,KAAK,EAAA,QAAA,EAETD,GAAA,CAACC,MAAY,CAAC;;;;;;;;;;;;AAMZ,QAAA,cAAc,EAAC,QAAQ,EACvB,kBAAkB,EAAC,WAAW;;;;AAI9B,QAAA,EAAE,EAAC,gBAAgB,EACnB,QAAQ,EAAE,EAAE,EAAE,EAAE,iBAAiB,EAAE,EAAA,CACnC,EAAA,CACmB,CACxB;AAEH,aAAa,CAAC,WAAW,GAAG,gBAAgB;;;;"}

package/dist/components/Toast/Toast.styles.d.ts

@@ -5,12 +5,15 @@ import type { ToastStatus } from './Toast.types';
  *
  * Each status is bg `{s}.bg` + text `{s}.fg` + a 1px `{s}.border` outline —
  * `info` reads its own `info.*` family instead of borrowing `primary.*`.
- * `neutral` carries no status (it is the default when none is given) and is
- * inverted: the tooltip pair `tooltip.bg` / `tooltip.fg`. A `bg.surface` toast
- * was white on a white canvas in light mode, set apart only by a 1px border
- * and the shadow — a "링크를 복사했어요" confirmation was easy to miss. The
- * tooltip pair already flips per mode (ink in light, off-white in dark), so the
- * toast stays the highest-contrast thing on the page in both.
+ * `neutral` carries no status (it is the default when none is given) and sits
+ * on the muted ground: `bg.muted` + `fg.default` + a `border.default` outline.
+ * Not `bg.surface` — that was white on a white canvas in light mode, set apart
+ * only by a 1px border and the shadow, so a "링크를 복사했어요" confirmation was
+ * easy to miss. Not the inverted tooltip pair either — ink (#252525) is
+ * `primary.main`, the user's own chat bubble, so a plain "복사 완료" read as
+ * the heaviest thing on the page, louder than an error toast. `bg.muted` is
+ * already a registered separation from `bg.canvas` (see `contrast.test.ts`)
+ * and flips per mode with the rest of the neutral ramp.
  */
 export declare const toastStyles: Record<ToastStatus, BoxProps>;
 /**

package/dist/components/Toast/Toast.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE5C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,WAAW,EAAE,MAAM,CAAC,WAAW,EAAE,QAAQ,CA0BrD,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,WAAW,EAAE,QAAQ,CAiC3D,CAAC;AA0BF,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,WAAW,EAAE,QAAQ,CAiCtD,CAAC;AAEF,6EAA6E;AAC7E,eAAO,MAAM,sBAAsB,OAAO,CAAC;AAE3C;;;GAGG;AACH,eAAO,MAAM,qBAAqB,OAAO,CAAC"}
+{"version":3,"file":"Toast.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE5C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,WAAW,EAAE,MAAM,CAAC,WAAW,EAAE,QAAQ,CA0BrD,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,WAAW,EAAE,QAAQ,CA+B3D,CAAC;AA0BF,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,WAAW,EAAE,QAAQ,CA+BtD,CAAC;AAEF,6EAA6E;AAC7E,eAAO,MAAM,sBAAsB,OAAO,CAAC;AAE3C;;;GAGG;AACH,eAAO,MAAM,qBAAqB,OAAO,CAAC"}

package/dist/components/Toast/Toast.styles.js

@@ -6,12 +6,15 @@
  *
  * Each status is bg `{s}.bg` + text `{s}.fg` + a 1px `{s}.border` outline —
  * `info` reads its own `info.*` family instead of borrowing `primary.*`.
- * `neutral` carries no status (it is the default when none is given) and is
- * inverted: the tooltip pair `tooltip.bg` / `tooltip.fg`. A `bg.surface` toast
- * was white on a white canvas in light mode, set apart only by a 1px border
- * and the shadow — a "링크를 복사했어요" confirmation was easy to miss. The
- * tooltip pair already flips per mode (ink in light, off-white in dark), so the
- * toast stays the highest-contrast thing on the page in both.
+ * `neutral` carries no status (it is the default when none is given) and sits
+ * on the muted ground: `bg.muted` + `fg.default` + a `border.default` outline.
+ * Not `bg.surface` — that was white on a white canvas in light mode, set apart
+ * only by a 1px border and the shadow, so a "링크를 복사했어요" confirmation was
+ * easy to miss. Not the inverted tooltip pair either — ink (#252525) is
+ * `primary.main`, the user's own chat bubble, so a plain "복사 완료" read as
+ * the heaviest thing on the page, louder than an error toast. `bg.muted` is
+ * already a registered separation from `bg.canvas` (see `contrast.test.ts`)
+ * and flips per mode with the rest of the neutral ramp.
  */
 const toastStyles = {
     info: {
@@ -35,9 +38,9 @@ const toastStyles = {
         borderColor: 'danger.border',
     },
     neutral: {
-        bg: 'tooltip.bg',
-        color: 'tooltip.fg',
-        borderColor: 'tooltip.bg',
+        bg: 'bg.muted',
+        color: 'fg.default',
+        borderColor: 'border.default',
     },
 };
 /**
@@ -71,11 +74,9 @@ const closeButtonStyles = {
         },
     },
     neutral: {
-        color: 'tooltip.fg',
+        color: 'fg.muted',
         _hover: {
-            // A tint of the toast's own text colour: no surface token sits on the
-            // inverted ground in both modes.
-            bg: 'color-mix(in srgb, var(--chakra-colors-tooltip-fg) 16%, transparent)',
+            bg: 'layer.1.active',
         },
     },
 };
@@ -129,11 +130,9 @@ const actionStyles = {
     },
     neutral: {
         ...actionBase,
-        color: 'tooltip.fg',
-        _hover: {
-            bg: 'color-mix(in srgb, var(--chakra-colors-tooltip-fg) 16%, transparent)',
-        },
-        _focusVisible: { outline: '2px solid', outlineColor: 'tooltip.fg' },
+        color: 'fg.default',
+        _hover: { bg: 'layer.1.active' },
+        _focusVisible: { outline: '2px solid', outlineColor: 'fg.default' },
     },
 };
 /** Default duration (ms) of a toast without an action, when none is given */

package/dist/components/Toast/Toast.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.styles.js","sources":["../../../src/components/Toast/Toast.styles.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
+{"version":3,"file":"Toast.styles.js","sources":["../../../src/components/Toast/Toast.styles.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/dist/components/Toast/Toast.styles.mjs

@@ -4,12 +4,15 @@
  *
  * Each status is bg `{s}.bg` + text `{s}.fg` + a 1px `{s}.border` outline —
  * `info` reads its own `info.*` family instead of borrowing `primary.*`.
- * `neutral` carries no status (it is the default when none is given) and is
- * inverted: the tooltip pair `tooltip.bg` / `tooltip.fg`. A `bg.surface` toast
- * was white on a white canvas in light mode, set apart only by a 1px border
- * and the shadow — a "링크를 복사했어요" confirmation was easy to miss. The
- * tooltip pair already flips per mode (ink in light, off-white in dark), so the
- * toast stays the highest-contrast thing on the page in both.
+ * `neutral` carries no status (it is the default when none is given) and sits
+ * on the muted ground: `bg.muted` + `fg.default` + a `border.default` outline.
+ * Not `bg.surface` — that was white on a white canvas in light mode, set apart
+ * only by a 1px border and the shadow, so a "링크를 복사했어요" confirmation was
+ * easy to miss. Not the inverted tooltip pair either — ink (#252525) is
+ * `primary.main`, the user's own chat bubble, so a plain "복사 완료" read as
+ * the heaviest thing on the page, louder than an error toast. `bg.muted` is
+ * already a registered separation from `bg.canvas` (see `contrast.test.ts`)
+ * and flips per mode with the rest of the neutral ramp.
  */
 const toastStyles = {
     info: {
@@ -33,9 +36,9 @@ const toastStyles = {
         borderColor: 'danger.border',
     },
     neutral: {
-        bg: 'tooltip.bg',
-        color: 'tooltip.fg',
-        borderColor: 'tooltip.bg',
+        bg: 'bg.muted',
+        color: 'fg.default',
+        borderColor: 'border.default',
     },
 };
 /**
@@ -69,11 +72,9 @@ const closeButtonStyles = {
         },
     },
     neutral: {
-        color: 'tooltip.fg',
+        color: 'fg.muted',
         _hover: {
-            // A tint of the toast's own text colour: no surface token sits on the
-            // inverted ground in both modes.
-            bg: 'color-mix(in srgb, var(--chakra-colors-tooltip-fg) 16%, transparent)',
+            bg: 'layer.1.active',
         },
     },
 };
@@ -127,11 +128,9 @@ const actionStyles = {
     },
     neutral: {
         ...actionBase,
-        color: 'tooltip.fg',
-        _hover: {
-            bg: 'color-mix(in srgb, var(--chakra-colors-tooltip-fg) 16%, transparent)',
-        },
-        _focusVisible: { outline: '2px solid', outlineColor: 'tooltip.fg' },
+        color: 'fg.default',
+        _hover: { bg: 'layer.1.active' },
+        _focusVisible: { outline: '2px solid', outlineColor: 'fg.default' },
     },
 };
 /** Default duration (ms) of a toast without an action, when none is given */

package/dist/components/Toast/Toast.styles.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.styles.mjs","sources":["../../../src/components/Toast/Toast.styles.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
+{"version":3,"file":"Toast.styles.mjs","sources":["../../../src/components/Toast/Toast.styles.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/dist/theme/palette.generated.d.ts

@@ -324,7 +324,7 @@ export declare const SCHEMES: {
             readonly "success-bg": "#E5EDDD";
             readonly "success-border": "#C5D4B5";
             readonly "success-fg": "#556344";
-            readonly "success-solid": "#5E7A37";
+            readonly "success-solid": "#30862D";
             readonly "success-onSolid": "#FFFFFF";
             readonly "warning-bg": "#FEE9BC";
             readonly "warning-border": "#F0CF83";
@@ -506,7 +506,7 @@ export declare const SCHEMES: {
             readonly "success-bg": "#E5EDDD";
             readonly "success-border": "#7D8B6E";
             readonly "success-fg": "#445133";
-            readonly "success-solid": "#47611D";
+            readonly "success-solid": "#036805";
             readonly "success-onSolid": "#FFFFFF";
             readonly "warning-bg": "#FEE9BC";
             readonly "warning-border": "#A28336";
@@ -690,7 +690,7 @@ export declare const SCHEMES: {
             readonly "success-bg": "#E5EDDD";
             readonly "success-border": "#C5D4B5";
             readonly "success-fg": "#556344";
-            readonly "success-solid": "#5E7A37";
+            readonly "success-solid": "#30862D";
             readonly "success-onSolid": "#FFFFFF";
             readonly "warning-bg": "#FEE9BC";
             readonly "warning-border": "#F0CF83";
@@ -872,7 +872,7 @@ export declare const SCHEMES: {
             readonly "success-bg": "#E5EDDD";
             readonly "success-border": "#7D8B6E";
             readonly "success-fg": "#445133";
-            readonly "success-solid": "#47611D";
+            readonly "success-solid": "#036805";
             readonly "success-onSolid": "#FFFFFF";
             readonly "warning-bg": "#FEE9BC";
             readonly "warning-border": "#A28336";

package/dist/theme/palette.generated.js

@@ -330,7 +330,7 @@ const SCHEMES = {
             "success-bg": "#E5EDDD",
             "success-border": "#C5D4B5",
             "success-fg": "#556344",
-            "success-solid": "#5E7A37",
+            "success-solid": "#30862D",
             "success-onSolid": "#FFFFFF",
             "warning-bg": "#FEE9BC",
             "warning-border": "#F0CF83",
@@ -512,7 +512,7 @@ const SCHEMES = {
             "success-bg": "#E5EDDD",
             "success-border": "#7D8B6E",
             "success-fg": "#445133",
-            "success-solid": "#47611D",
+            "success-solid": "#036805",
             "success-onSolid": "#FFFFFF",
             "warning-bg": "#FEE9BC",
             "warning-border": "#A28336",
@@ -696,7 +696,7 @@ const SCHEMES = {
             "success-bg": "#E5EDDD",
             "success-border": "#C5D4B5",
             "success-fg": "#556344",
-            "success-solid": "#5E7A37",
+            "success-solid": "#30862D",
             "success-onSolid": "#FFFFFF",
             "warning-bg": "#FEE9BC",
             "warning-border": "#F0CF83",
@@ -878,7 +878,7 @@ const SCHEMES = {
             "success-bg": "#E5EDDD",
             "success-border": "#7D8B6E",
             "success-fg": "#445133",
-            "success-solid": "#47611D",
+            "success-solid": "#036805",
             "success-onSolid": "#FFFFFF",
             "warning-bg": "#FEE9BC",
             "warning-border": "#A28336",

package/dist/theme/palette.generated.mjs

@@ -328,7 +328,7 @@ const SCHEMES = {
             "success-bg": "#E5EDDD",
             "success-border": "#C5D4B5",
             "success-fg": "#556344",
-            "success-solid": "#5E7A37",
+            "success-solid": "#30862D",
             "success-onSolid": "#FFFFFF",
             "warning-bg": "#FEE9BC",
             "warning-border": "#F0CF83",
@@ -510,7 +510,7 @@ const SCHEMES = {
             "success-bg": "#E5EDDD",
             "success-border": "#7D8B6E",
             "success-fg": "#445133",
-            "success-solid": "#47611D",
+            "success-solid": "#036805",
             "success-onSolid": "#FFFFFF",
             "warning-bg": "#FEE9BC",
             "warning-border": "#A28336",
@@ -694,7 +694,7 @@ const SCHEMES = {
             "success-bg": "#E5EDDD",
             "success-border": "#C5D4B5",
             "success-fg": "#556344",
-            "success-solid": "#5E7A37",
+            "success-solid": "#30862D",
             "success-onSolid": "#FFFFFF",
             "warning-bg": "#FEE9BC",
             "warning-border": "#F0CF83",
@@ -876,7 +876,7 @@ const SCHEMES = {
             "success-bg": "#E5EDDD",
             "success-border": "#7D8B6E",
             "success-fg": "#445133",
-            "success-solid": "#47611D",
+            "success-solid": "#036805",
             "success-onSolid": "#FFFFFF",
             "warning-bg": "#FEE9BC",
             "warning-border": "#A28336",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mindlogic-ai/logician-ui",
-  "version": "5.0.0-alpha.23",
+  "version": "5.0.0-alpha.25",
   "description": "A comprehensive React design system built on Chakra UI",
   "main": "dist/index.js",
   "module": "dist/index.mjs",

package/src/components/Switch/Switch.stories.tsx

@@ -179,14 +179,22 @@ export const UsageTokens: Story = {
   render: () => (
     <TokenTable
       rows={[
-        { token: 'bg.track', use: <T en="Track when off" ko="꺼짐 트랙" /> },
-        { token: 'primary.main', use: <T en="Track when on" ko="켜짐 트랙" /> },
+        { token: 'bg.surface', use: <T en="Track when off" ko="꺼짐 트랙" /> },
         {
-          token: 'bg.surface',
-          use: <T en="Thumb when off" ko="꺼짐 손잡이" />,
+          token: 'border.control',
+          use: (
+            <T
+              en="Track outline and thumb when off"
+              ko="꺼짐 트랙 테두리·손잡이"
+            />
+          ),
         },
         {
-          token: 'fg.onPrimary',
+          token: 'success.solid',
+          use: <T en="Track when on" ko="켜짐 트랙" />,
+        },
+        {
+          token: 'success.onSolid',
           use: <T en="Thumb when on" ko="켜짐 손잡이" />,
         },
         {

package/src/components/Switch/Switch.usage.mdx

@@ -128,8 +128,9 @@ What Switch does for you:
 
 - A native checkbox input carries the state, so Tab focuses it and Space
   toggles it.
-- The keyboard focus ring shows on the track (WCAG 2.4.7). The off track is
-  `bg.track`, a filled track that stays visible on any surface (WCAG 1.4.11).
+- The keyboard focus ring shows on the track (WCAG 2.4.7). Off is drawn like an
+  unchecked Checkbox: a `border.control` outline and thumb, at least 3:1 on any
+  surface (WCAG 1.4.11).
 
 What you still have to do:
 
@@ -160,8 +161,8 @@ Switch가 알아서 하는 일
 
 - 상태는 네이티브 체크박스 입력이 가지고 있어서 Tab으로 초점을 옮기고 Space로 바꿀 수
   있습니다.
-- 키보드 초점 링이 트랙에 보입니다(WCAG 2.4.7). 꺼짐 트랙은 어떤 면 위에서도 보이도록
-  채워진 `bg.track`을 씁니다(WCAG 1.4.11).
+- 키보드 초점 링이 트랙에 보입니다(WCAG 2.4.7). 꺼짐은 체크하지 않은 Checkbox처럼
+  `border.control` 테두리와 손잡이로 그려, 어떤 면 위에서도 3:1 이상입니다(WCAG 1.4.11).
 
 직접 챙겨야 하는 일
 

package/src/components/Switch/SwitchControl.tsx

@@ -2,23 +2,38 @@ import { forwardRef } from 'react';
 import { Switch as ChakraSwitch, SwitchControlProps } from '@chakra-ui/react';
 
 import { disabledControl } from '@/utils/disabledControl';
-import { focusRing } from '@/utils/focusRing';
+import { FOCUS_RING_SHADOW, focusRing } from '@/utils/focusRing';
+
+// Drawn as an inset shadow, not a border, so the thumb's travel and the
+// track's size stay exactly what Chakra's recipe computes.
+const OFF_OUTLINE = 'inset 0 0 0 1px var(--chakra-colors-border-control)';
 
 export const SwitchControl = forwardRef<HTMLSpanElement, SwitchControlProps>(
   (props, ref) => (
     <ChakraSwitch.Control
       ref={ref}
-      // The off-state track is a meter surface — its extent is the information —
-      // so it needs a visible fill, not just an edge. bg.muted (gray.100) is
-      // only ~1.03:1 against the bg.sunken page wash (gray.50) and vanishes
-      // there; bg.track (gray.300) reads as a filled track on any background.
-      // The checked state is the self-defining primary.main fill.
-      bg="bg.track"
-      _checked={{ bg: 'primary.main' }}
+      // Off is drawn the way an unchecked Checkbox is: a bg.surface track with a
+      // border.control outline and a border.control thumb, each at least 3:1
+      // against what it sits on (WCAG 1.4.11). The previous off state, a
+      // bg.track fill with a bg.surface thumb, measured 1.3:1 (light) and
+      // 1.4:1 (dark) between thumb and track, so the thumb's position, the only
+      // thing that tells off from on, could not be seen.
+      // On is success.solid with a success.onSolid thumb. With a black (light) or
+      // pale (dark) primary fill, neither state carried colour, and dark-mode
+      // "on" read as light-mode "off"; green gives both modes one meaning.
+      bg="bg.surface"
+      boxShadow={OFF_OUTLINE}
+      _checked={{ bg: 'success.solid', boxShadow: 'none' }}
       animationStyle="feedback"
-      transitionProperty="background-color"
+      transitionProperty="background-color, box-shadow"
       _disabled={{ ...disabledControl, cursor: 'not-allowed' }}
       {...focusRing}
+      // focusRing's shadow would replace the outline; keep both while off.
+      _focusVisible={{
+        ...focusRing._focusVisible,
+        boxShadow: `${OFF_OUTLINE}, ${FOCUS_RING_SHADOW}`,
+        _checked: { boxShadow: FOCUS_RING_SHADOW },
+      }}
       {...props}
     >
       <ChakraSwitch.Thumb
@@ -29,12 +44,11 @@ export const SwitchControl = forwardRef<HTMLSpanElement, SwitchControlProps>(
         // reverses direction — `standard` vs `emphasized` would not.
         animationStyle="spring"
         transitionProperty="translate"
-        // Chakra's default is a raw `white` thumb that stays `white` when
-        // checked via an undefined `colorPalette.contrast`. bg.surface reads
-        // as the same near-white in light and flips correctly in dark; the
-        // checked thumb is fg.onPrimary (cream) to match Checkbox/Radio.
-        bg="bg.surface"
-        _checked={{ bg: 'fg.onPrimary' }}
+        // Off: border.control, the same 3:1 control token as the outline.
+        // On: success.onSolid, the text colour success buttons put on the same
+        // fill (white in light, ink in dark).
+        bg="border.control"
+        _checked={{ bg: 'success.onSolid' }}
       />
     </ChakraSwitch.Control>
   )

package/src/components/Toast/Toast.styles.ts

@@ -7,12 +7,15 @@ import type { ToastStatus } from './Toast.types';
  *
  * Each status is bg `{s}.bg` + text `{s}.fg` + a 1px `{s}.border` outline —
  * `info` reads its own `info.*` family instead of borrowing `primary.*`.
- * `neutral` carries no status (it is the default when none is given) and is
- * inverted: the tooltip pair `tooltip.bg` / `tooltip.fg`. A `bg.surface` toast
- * was white on a white canvas in light mode, set apart only by a 1px border
- * and the shadow — a "링크를 복사했어요" confirmation was easy to miss. The
- * tooltip pair already flips per mode (ink in light, off-white in dark), so the
- * toast stays the highest-contrast thing on the page in both.
+ * `neutral` carries no status (it is the default when none is given) and sits
+ * on the muted ground: `bg.muted` + `fg.default` + a `border.default` outline.
+ * Not `bg.surface` — that was white on a white canvas in light mode, set apart
+ * only by a 1px border and the shadow, so a "링크를 복사했어요" confirmation was
+ * easy to miss. Not the inverted tooltip pair either — ink (#252525) is
+ * `primary.main`, the user's own chat bubble, so a plain "복사 완료" read as
+ * the heaviest thing on the page, louder than an error toast. `bg.muted` is
+ * already a registered separation from `bg.canvas` (see `contrast.test.ts`)
+ * and flips per mode with the rest of the neutral ramp.
  */
 export const toastStyles: Record<ToastStatus, BoxProps> = {
   info: {
@@ -36,9 +39,9 @@ export const toastStyles: Record<ToastStatus, BoxProps> = {
     borderColor: 'danger.border',
   },
   neutral: {
-    bg: 'tooltip.bg',
-    color: 'tooltip.fg',
-    borderColor: 'tooltip.bg',
+    bg: 'bg.muted',
+    color: 'fg.default',
+    borderColor: 'border.default',
   },
 };
 
@@ -73,11 +76,9 @@ export const closeButtonStyles: Record<ToastStatus, BoxProps> = {
     },
   },
   neutral: {
-    color: 'tooltip.fg',
+    color: 'fg.muted',
     _hover: {
-      // A tint of the toast's own text colour: no surface token sits on the
-      // inverted ground in both modes.
-      bg: 'color-mix(in srgb, var(--chakra-colors-tooltip-fg) 16%, transparent)',
+      bg: 'layer.1.active',
     },
   },
 };
@@ -133,11 +134,9 @@ export const actionStyles: Record<ToastStatus, BoxProps> = {
   },
   neutral: {
     ...actionBase,
-    color: 'tooltip.fg',
-    _hover: {
-      bg: 'color-mix(in srgb, var(--chakra-colors-tooltip-fg) 16%, transparent)',
-    },
-    _focusVisible: { outline: '2px solid', outlineColor: 'tooltip.fg' },
+    color: 'fg.default',
+    _hover: { bg: 'layer.1.active' },
+    _focusVisible: { outline: '2px solid', outlineColor: 'fg.default' },
   },
 };
 

package/src/components/Toast/Toast.usage.mdx

@@ -97,7 +97,7 @@ then goes away on its own.
 
 | Status | Means | Use for |
 | --- | --- | --- |
-| `neutral` (default) | A plain result with no status; no icon. Inverted (`tooltip.bg` / `tooltip.fg`) so it stands out on a white page | Copied, moved, sent |
+| `neutral` (default) | A plain result with no status; no icon. Muted ground (`bg.muted` / `fg.default`, `border.default` outline): visible on a white page without outweighing a status toast | Copied, moved, sent |
 | `success` | Done as asked | Saved, uploaded, deleted |
 | `info` | A fact about what just happened; nothing is wrong | Export ready, model switched for you |
 | `warning` | Done, but not quite as expected | Some files skipped |
@@ -111,7 +111,7 @@ then goes away on its own.
 
 | 상태 | 뜻 | 예 |
 | --- | --- | --- |
-| `neutral` (기본) | 상태가 없는 단순한 결과이며 아이콘도 없음. 흰 화면에서도 잘 보이도록 반전색(`tooltip.bg` / `tooltip.fg`)을 씀 | 복사, 이동, 전송 |
+| `neutral` (기본) | 상태가 없는 단순한 결과이며 아이콘도 없음. 흰 화면에서 보이되 상태 토스트보다 튀지 않도록 은은한 바탕(`bg.muted` / `fg.default`, `border.default` 테두리)을 씀 | 복사, 이동, 전송 |
 | `success` | 요청한 대로 끝남 | 저장, 업로드, 삭제 |
 | `info` | 방금 일어난 일에 대한 사실이며, 문제가 있다는 뜻은 아님 | 내보내기 완료, 모델 자동 변경 |
 | `warning` | 끝났지만 예상과 조금 다름 | 일부 파일 건너뜀 |

package/src/theme/palette.generated.ts

@@ -332,7 +332,7 @@ export const SCHEMES = {
       "success-bg": "#E5EDDD",
       "success-border": "#C5D4B5",
       "success-fg": "#556344",
-      "success-solid": "#5E7A37",
+      "success-solid": "#30862D",
       "success-onSolid": "#FFFFFF",
       "warning-bg": "#FEE9BC",
       "warning-border": "#F0CF83",
@@ -514,7 +514,7 @@ export const SCHEMES = {
       "success-bg": "#E5EDDD",
       "success-border": "#7D8B6E",
       "success-fg": "#445133",
-      "success-solid": "#47611D",
+      "success-solid": "#036805",
       "success-onSolid": "#FFFFFF",
       "warning-bg": "#FEE9BC",
       "warning-border": "#A28336",
@@ -698,7 +698,7 @@ export const SCHEMES = {
       "success-bg": "#E5EDDD",
       "success-border": "#C5D4B5",
       "success-fg": "#556344",
-      "success-solid": "#5E7A37",
+      "success-solid": "#30862D",
       "success-onSolid": "#FFFFFF",
       "warning-bg": "#FEE9BC",
       "warning-border": "#F0CF83",
@@ -880,7 +880,7 @@ export const SCHEMES = {
       "success-bg": "#E5EDDD",
       "success-border": "#7D8B6E",
       "success-fg": "#445133",
-      "success-solid": "#47611D",
+      "success-solid": "#036805",
       "success-onSolid": "#FFFFFF",
       "warning-bg": "#FEE9BC",
       "warning-border": "#A28336",