@kolkrabbi/kol-component 0.122.0 → 0.123.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kolkrabbi/kol-component",
-  "version": "0.122.0",
+  "version": "0.123.0",
   "description": "KOL design-system components — atoms through organisms, emitting canonical kol-* classes. Pairs with @kolkrabbi/kol-theme for styling.",
   "license": "MIT",
   "type": "module",

package/src/molecules/Dropdown.jsx

@@ -148,6 +148,13 @@ const Dropdown = ({
             return (
               <MenuDropdownItem
                 key={option.value}
+                /* NO HOVER STATE ANYWHERE ON A DROPDOWN (user 2026-08-28,
+                 * "delete any hover state on dropdowns"): the trigger was
+                 * already pinned in all three variants — primary and outline
+                 * back to rest in kol-theme, grey carrying no hover rule at
+                 * all — and this was the last one left, the option row's ink
+                 * brighten. The check mark is what marks the current value. */
+                hover={false}
                 onClick={() => handleSelect(option)}
                 shortcut={isActive ? <Icon name="check" size={11} /> : undefined}
               >

package/src/molecules/MenuItem.jsx

@@ -78,6 +78,11 @@ export function MenuItem({
 
 /**
  * MenuDropdownItem — action row inside a MenuItem's dropdown panel.
+ *
+ * `hover` (default true) — `false` drops the ink brighten, for a panel ruled
+ * to carry NO hover state at all (user 2026-08-28, on `Dropdown`: "delete any
+ * hover state on dropdowns"). Scoped to the caller: a MenuItem's own menu keeps
+ * its hover, because that ruling was about the select, not every panel.
  * Renders as a button so it picks up disabled, focus, and keyboard
  * activation. The parent MenuItem closes automatically on click via a
  * delegated handler that matches the `data-menu-item` attr.
@@ -89,7 +94,7 @@ export function MenuItem({
  *   - children  — main label, flex-1.
  *   - shortcut  — trailing content (text shortcut hint, ✓ marker, or icon).
  */
-export function MenuDropdownItem({ onClick, disabled, prefix, iconLeft, shortcut, children }) {
+export function MenuDropdownItem({ onClick, disabled, prefix, iconLeft, shortcut, hover = true, children }) {
   return (
     <button
       type="button"
@@ -97,7 +102,7 @@ export function MenuDropdownItem({ onClick, disabled, prefix, iconLeft, shortcut
       onClick={onClick}
       disabled={disabled}
       role="menuitem"
-      className="w-full kol-helper-12 px-3 h-8 shrink-0 inline-flex items-center gap-2 text-body hover:text-emphasis disabled:opacity-40 disabled:cursor-not-allowed text-left"
+      className={`w-full kol-helper-12 px-3 h-8 shrink-0 inline-flex items-center gap-2 text-body ${hover ? 'hover:text-emphasis' : ''} disabled:opacity-40 disabled:cursor-not-allowed text-left`}
     >
       {prefix && <span className="shrink-0 inline-flex items-center">{prefix}</span>}
       {iconLeft && <span className="shrink-0 w-4 inline-flex items-center justify-center">{iconLeft}</span>}