@streamscloud/kit 0.9.8 → 0.9.10

package/dist/ui/input/cmp.input.svelte

@@ -240,7 +240,7 @@ or the clear button (see `HandleInput`'s availability pill).
   --sc-kit--input--font-size: var(--sc-kit--font-size--lg);
   --sc-kit--input--icon--size: var(--sc-kit--field--icon--size--lg);
 }
-.input:where(:hover) {
+.input:where(:hover:not(:focus-within)) {
   --sc-kit--input--border-color: var(--_in--border-color-hover);
 }
 .input:where(:focus-within) {

package/dist/ui/navigation/cmp.nav-menu-item.svelte

@@ -57,7 +57,7 @@ Renders as `<a>` when `href` is set, `<button>` otherwise. Active state is consu
 | Property | Description | Default |
 |---|---|---|
 | `--sc-kit--nav-menu-item--gap` | Gap between icon and label | `18px` |
-| `--sc-kit--nav-menu-item--icon-size` | Icon box size | `20px` |
+| `--sc-kit--nav-menu-item--icon-size` | Icon size (box + glyph) | `18px` |
 | `--sc-kit--nav-menu-item--radius` | Row radius | `--sc-kit--radius--sm` |
 | `--sc-kit--nav-menu-item--color` | Idle text/icon color | `--sc-kit--color--text--secondary` |
 | `--sc-kit--nav-menu-item--color--active` | Active / hover text color | `--sc-kit--color--text--primary` |
@@ -69,7 +69,7 @@ Renders as `<a>` when `href` is set, `<button>` otherwise. Active state is consu
 -->
 <style>.nav-menu-item {
   --_nav-menu-item--gap: var(--sc-kit--nav-menu-item--gap, 1.125rem);
-  --_nav-menu-item--icon-size: var(--sc-kit--nav-menu-item--icon-size, 1.25rem);
+  --_nav-menu-item--icon-size: var(--sc-kit--nav-menu-item--icon-size, 1.125rem);
   --_nav-menu-item--radius: var(--sc-kit--nav-menu-item--radius, var(--sc-kit--radius--sm));
   --_nav-menu-item--color: var(--sc-kit--nav-menu-item--color, var(--sc-kit--color--text--secondary));
   --_nav-menu-item--color-active: var(--sc-kit--nav-menu-item--color--active, var(--sc-kit--color--text--primary));
@@ -112,6 +112,7 @@ Renders as `<a>` when `href` is set, `<button>` otherwise. Active state is consu
 }
 
 .nav-menu-item__icon {
+  --sc-kit--icon--size: var(--_nav-menu-item--icon-size);
   position: relative;
   display: inline-flex;
   align-items: center;
@@ -121,11 +122,6 @@ Renders as `<a>` when `href` is set, `<button>` otherwise. Active state is consu
   height: var(--_nav-menu-item--icon-size);
   line-height: 0;
 }
-.nav-menu-item__icon :global(svg) {
-  width: 100%;
-  height: 100%;
-  fill: currentColor;
-}
 
 .nav-menu-item__badge {
   position: absolute;

package/dist/ui/navigation/cmp.nav-menu-item.svelte.d.ts

@@ -28,7 +28,7 @@ type Props = {
  * | Property | Description | Default |
  * |---|---|---|
  * | `--sc-kit--nav-menu-item--gap` | Gap between icon and label | `18px` |
- * | `--sc-kit--nav-menu-item--icon-size` | Icon box size | `20px` |
+ * | `--sc-kit--nav-menu-item--icon-size` | Icon size (box + glyph) | `18px` |
  * | `--sc-kit--nav-menu-item--radius` | Row radius | `--sc-kit--radius--sm` |
  * | `--sc-kit--nav-menu-item--color` | Idle text/icon color | `--sc-kit--color--text--secondary` |
  * | `--sc-kit--nav-menu-item--color--active` | Active / hover text color | `--sc-kit--color--text--primary` |

package/dist/ui/navigation/cmp.nav-rail-item.svelte

@@ -50,7 +50,7 @@ CSS variables (settable on the parent rail or any ancestor).
 | Property | Description | Default |
 |---|---|---|
 | `--sc-kit--nav-rail--item-width` | Tile width | `58px` |
-| `--sc-kit--nav-rail--item-icon-size` | Icon box size | `24px` |
+| `--sc-kit--nav-rail--item-icon-size` | Icon size (box + glyph) | `24px` |
 | `--sc-kit--nav-rail--item-label-size` | Label font size | `10px` |
 | `--sc-kit--nav-rail--item-radius` | Tile radius | `--sc-kit--radius--sm` |
 | `--sc-kit--nav-rail--item-color` | Idle text/icon color | `--sc-kit--color--text--secondary` |
@@ -98,6 +98,7 @@ CSS variables (settable on the parent rail or any ancestor).
 }
 
 .nav-rail-item__icon {
+  --sc-kit--icon--size: var(--_nav-rail--item-icon-size);
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -105,11 +106,6 @@ CSS variables (settable on the parent rail or any ancestor).
   height: var(--_nav-rail--item-icon-size);
   line-height: 0;
 }
-.nav-rail-item__icon :global(svg) {
-  width: 100%;
-  height: 100%;
-  fill: currentColor;
-}
 
 .nav-rail-item__label {
   font-size: var(--_nav-rail--item-label-size);

package/dist/ui/navigation/cmp.nav-rail-item.svelte.d.ts

@@ -26,7 +26,7 @@ type Props = {
  * | Property | Description | Default |
  * |---|---|---|
  * | `--sc-kit--nav-rail--item-width` | Tile width | `58px` |
- * | `--sc-kit--nav-rail--item-icon-size` | Icon box size | `24px` |
+ * | `--sc-kit--nav-rail--item-icon-size` | Icon size (box + glyph) | `24px` |
  * | `--sc-kit--nav-rail--item-label-size` | Label font size | `10px` |
  * | `--sc-kit--nav-rail--item-radius` | Tile radius | `--sc-kit--radius--sm` |
  * | `--sc-kit--nav-rail--item-color` | Idle text/icon color | `--sc-kit--color--text--secondary` |

package/dist/ui/numeral-input/cmp.numeral-input.svelte

@@ -266,7 +266,7 @@ requires a non-null value. CSS API mirrors `Input` for visual-language compatibi
   --sc-kit--numeral-input--font-size: var(--sc-kit--font-size--lg);
   --sc-kit--numeral-input--icon--size: var(--sc-kit--field--icon--size--lg);
 }
-.numeral-input:where(:hover) {
+.numeral-input:where(:hover:not(:focus-within)) {
   --sc-kit--numeral-input--border-color: var(--_ni--border-color-hover);
 }
 .numeral-input:where(:focus-within) {

package/dist/ui/rich-text-input/cmp.rich-text-input.svelte

@@ -224,7 +224,7 @@ body, or an external host element addressed by `options.fixedToolbarId`). Impera
 .rich-text-input--lg {
   --sc-kit--rich-text-input--root--font-size: 1rem;
 }
-.rich-text-input:where(:hover) {
+.rich-text-input:where(:hover:not(:focus-within)) {
   --sc-kit--rich-text-input--border-color: var(--_rti--border-color-hover);
 }
 .rich-text-input:where(:focus-within) {

package/dist/ui/select/_select-trigger.scss

@@ -63,13 +63,18 @@
     --sc-kit--select--trigger--icon--size: var(--sc-kit--field--icon--size--lg);
   }
 
-  &:where(:hover) {
+  &:where(:hover:not(:focus-within)) {
     --sc-kit--select--trigger--border-color: var(--_sel--border-color-hover);
   }
   &:where(:focus-within),
   &--open {
     --sc-kit--select--trigger--underline-color: var(--sc-kit--color--accent);
   }
+  // Popover portals focus away — :focus-within won't suppress the hover border while open.
+  // --error must stay after this block: it wins border-color by source order even while open.
+  &--open {
+    --sc-kit--select--trigger--border-color: unset;
+  }
 
   &--error {
     --sc-kit--select--trigger--border-color: var(--_sel--border-color-error);

package/dist/ui/select/cmp.singleselect-async.svelte

@@ -234,12 +234,15 @@ background--hover}`.
   --sc-kit--select--trigger--font-size: var(--sc-kit--font-size--lg);
   --sc-kit--select--trigger--icon--size: var(--sc-kit--field--icon--size--lg);
 }
-.singleselect:where(:hover) {
+.singleselect:where(:hover:not(:focus-within)) {
   --sc-kit--select--trigger--border-color: var(--_sel--border-color-hover);
 }
 .singleselect:where(:focus-within), .singleselect--open {
   --sc-kit--select--trigger--underline-color: var(--sc-kit--color--accent);
 }
+.singleselect--open {
+  --sc-kit--select--trigger--border-color: unset;
+}
 .singleselect--error {
   --sc-kit--select--trigger--border-color: var(--_sel--border-color-error);
   --sc-kit--select--trigger--underline-color: var(--sc-kit--color--danger);

package/dist/ui/select/multiselect-base.svelte

@@ -449,12 +449,15 @@ padding-inline, font-size, gap, max-width, remove-color, remove-color--hover}`.
   --sc-kit--select--trigger--font-size: var(--sc-kit--font-size--lg);
   --sc-kit--select--trigger--icon--size: var(--sc-kit--field--icon--size--lg);
 }
-.multiselect-trigger:where(:hover) {
+.multiselect-trigger:where(:hover:not(:focus-within)) {
   --sc-kit--select--trigger--border-color: var(--_sel--border-color-hover);
 }
 .multiselect-trigger:where(:focus-within), .multiselect-trigger--open {
   --sc-kit--select--trigger--underline-color: var(--sc-kit--color--accent);
 }
+.multiselect-trigger--open {
+  --sc-kit--select--trigger--border-color: unset;
+}
 .multiselect-trigger--error {
   --sc-kit--select--trigger--border-color: var(--_sel--border-color-error);
   --sc-kit--select--trigger--underline-color: var(--sc-kit--color--danger);

package/dist/ui/textarea/cmp.textarea.svelte

@@ -204,7 +204,7 @@ exposed via `bind:this`.
   --sc-kit--textarea--padding-inline: var(--sc-kit--field--padding-inline--lg);
   --sc-kit--textarea--font-size: var(--sc-kit--font-size--lg);
 }
-.textarea:where(:hover) {
+.textarea:where(:hover:not(:focus-within)) {
   --sc-kit--textarea--border-color: var(--_ta--border-color-hover);
 }
 .textarea:where(:focus-within) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamscloud/kit",
-  "version": "0.9.8",
+  "version": "0.9.10",
   "author": "StreamsCloud",
   "repository": {
     "type": "git",