@mindlogic-ai/logician-ui 5.0.0-alpha.2 → 5.0.0-alpha.20

package/src/translations/Defaults.translations.json

@@ -223,6 +223,13 @@
     "ja": "ダウンロード中",
     "es": "Descargando"
   },
+  "processing": {
+    "ko": "처리 중",
+    "en": "Processing",
+    "zh": "处理中",
+    "ja": "処理中",
+    "es": "Procesando"
+  },
   "deleting": {
     "ko": "삭제 중",
     "en": "Deleting",
@@ -236,5 +243,12 @@
     "zh": "关闭",
     "ja": "閉じる",
     "es": "Cerrar"
+  },
+  "clear_selection": {
+    "ko": "선택 지우기",
+    "en": "Clear selection",
+    "zh": "清除选择",
+    "ja": "選択をクリア",
+    "es": "Borrar selección"
   }
 }

package/src/utils/disabledControl.ts

@@ -18,9 +18,16 @@ export const disabledControl = {
   boxShadow: 'none',
 } as const;
 
+/**
+ * Disabled look for fill-less (ghost) buttons — ghost Button, ghost
+ * IconButton. With no `disabled.bg` behind it the colour is the only cue, and
+ * `disabled.fg` sat ~1.4:1 from the resting ghost glyph (`fg.icon`), so the
+ * two read as the same state. `disabled.fgGhost` is a lighter grey (~2.7:1
+ * from `fg.icon` in light and dark).
+ */
 export const disabledText = {
   bg: 'transparent',
-  color: 'disabled.fg',
+  color: 'disabled.fgGhost',
   borderColor: 'transparent',
   opacity: 1,
   boxShadow: 'none',

package/src/utils/focusRing.ts

@@ -25,3 +25,26 @@ export const focusRing = {
     boxShadow: FOCUS_RING_SHADOW,
   },
 } as const;
+
+/**
+ * The same two bands as {@link FOCUS_RING_SHADOW}, drawn INSIDE the element's
+ * edge: the outer 2px in `focus.ring`, then the 2px `bg.canvas` band that keeps
+ * the ring legible against whatever fill the element has.
+ *
+ * {@link focusRing} needs 4px of clear space on every side, because both bands
+ * paint outside the box. Rows packed into a list cannot give it that — the band
+ * lands on the neighbouring row, which paints its own background back over
+ * half of it — and a list that scrolls (`overflow-x: auto`) clips it outright.
+ * Same colour and weight, inside the box instead.
+ */
+export const FOCUS_RING_INSET_SHADOW =
+  'inset 0 0 0 2px var(--chakra-colors-focus-ring), inset 0 0 0 4px var(--chakra-colors-bg-canvas)';
+
+/** {@link focusRing}'s inset counterpart, for rows in a dense or scrolling list. */
+export const focusRingInset = {
+  _focus: { outline: 'none' },
+  _focusVisible: {
+    outline: 'none',
+    boxShadow: FOCUS_RING_INSET_SHADOW,
+  },
+} as const;