@muten/shadcn 0.2.14 → 0.2.16

package/kit.css

@@ -5519,6 +5519,15 @@ a.cx-bc-item:hover { color: var(--foreground); }
 /* SidebarTrigger: in the icon column (its 32 px square sits where the rows' icons sit), folded or open */
 .cx-sb-trigger { align-self: flex-start; flex: none; margin-left: 0; }
 .cx-sidebar[data-collapsed="true"] .cx-sb-trigger { align-self: flex-start; }
+.cx-sidebar .cx-sb-trigger { width: 32px; height: 32px; }   /* the rows' square, so its centre is the column's */
+/* THE HEADER AND THE FOOTER USE THE ICON COLUMN TOO. Whatever leads a link or a menu button there (a logo, an avatar,
+   an icon) sits centred in a 32 px box exactly over the rows' icons, open or folded, so the logo, the trigger, every icon
+   and the avatar make one straight line and nothing moves sideways when the rail folds. Folded, a menu button closes
+   to that box (its words fade and the rail never crops the avatar). */
+.cx-sidebar :is(.cx-sb-head, .cx-sb-foot) > a, .cx-sidebar :is(.cx-sb-head, .cx-sb-foot) .cn-sidebar-menu-button { justify-content: flex-start; padding-left: 0; }
+.cx-sidebar :is(.cx-sb-head, .cx-sb-foot) > a > :first-child, .cx-sidebar :is(.cx-sb-head, .cx-sb-foot) .cn-sidebar-menu-button > :first-child { flex: none; width: 32px; display: flex; justify-content: center; object-fit: contain; }
+.cx-sidebar :is(.cx-sb-head, .cx-sb-foot) .cn-sidebar-menu-button { transition: width .2s var(--ease-out), padding .2s var(--ease-out); }
+.cx-sidebar[data-collapsed="true"] :is(.cx-sb-head, .cx-sb-foot) .cn-sidebar-menu-button { width: 32px; padding-right: 0; }
 
 /* Sheet: its content arrives a moment after the panel, one row after another; leaving, it goes with the panel */
 .cx-modal[data-mode="sheet"] .cx-modal-body > * { transition: opacity var(--t-pop) var(--ease-out), translate calc(var(--t-sheet) * .8) var(--ease-out); }
@@ -5630,3 +5639,13 @@ a.cx-bc-item:hover { color: var(--foreground); }
 .cx-sidebar[data-collapsed="true"] .cx-sb-fold > .cx-sb-fold-in { visibility: visible; }
 .cx-sidebar[data-collapsed="true"] :is(.cx-sb-rowtoggle, .cx-sb-chev) { display: none; }
 @media (prefers-reduced-motion: reduce) { .cx-sb-fold, .cx-sb-chev { transition: none; } }
+
+/* ═════ EVERYTHING YOU CAN CLICK SHOWS THE HAND ═════ */
+/* A browser gives a <button> the arrow, and shadcn gives menu items, options and selects `cursor: default` (the desktop-app
+   convention). On the web the hand is what says «this does something», so every enabled control takes it: buttons,
+   tabs, menu items, options, switches, checkboxes, toggles, triggers, labels of a box. Disabled ones keep the arrow, and a
+   modal's backdrop (a button that fills the screen) too. The :is() weighs as an element plus an attribute, so it wins
+   over the single-class `cursor: default` rules above. */
+:is(button, a[href], summary, select, label[for], input[type="checkbox"], input[type="radio"], input[type="range"], input[type="color"], input[type="file"],
+  [role="button"], [role="tab"], [role="menuitem"], [role="menuitemradio"], [role="menuitemcheckbox"], [role="option"], [role="switch"], [role="checkbox"], [role="radio"], [data-slot$="trigger"]):not(:disabled, [aria-disabled="true"], [data-disabled], .cx-overlay) { cursor: pointer; }
+:is(button, [role="button"], [role="menuitem"], [role="option"], [role="switch"], [role="tab"]):is(:disabled, [aria-disabled="true"], [data-disabled]) { cursor: not-allowed; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@muten/shadcn",
-  "version": "0.2.14",
+  "version": "0.2.16",
   "description": "shadcn-style component registry for muten - own-the-source parts you add with `muten add`.",
   "repository": {
     "type": "git",