@manakind/manuia-ui 0.10.0 → 0.11.1

package/dist/category-card/category-card.css

@@ -23,6 +23,7 @@
 
     & .mui-category-card__meta {
       display: flex;
+      flex-wrap: wrap;
       align-items: flex-start;
       justify-content: space-between;
       gap: var(--semantic-space-gap);

package/dist/focus-item/focus-item.css

@@ -14,6 +14,7 @@
     display: grid;
     grid-template-columns: minmax(0, 1fr);
     gap: var(--semantic-space-gap-tight);
+    overflow-wrap: anywhere;
 
     & .mui-focus-item__card {
       --ds-card-padding: var(--semantic-space-padding);
@@ -22,12 +23,12 @@
     }
 
     /*
-     * Categories are capped at 40% of the row so long names wrap in their
-     * share instead of squeezing the title, as on GoalListItem.
+     * Categories and the toggle are capped so a long name or label wraps in
+     * its share instead of squeezing the title, as on GoalListItem.
      */
     & .mui-focus-item__row {
       display: grid;
-      grid-template-columns: minmax(0, 1fr) fit-content(40%) auto;
+      grid-template-columns: minmax(0, 1fr) fit-content(40%) fit-content(30%);
       grid-template-areas: "main categories toggle";
       align-items: center;
       gap: var(--semantic-space-gap) var(--semantic-space-gap-relaxed);
@@ -43,8 +44,6 @@
 
     & .mui-focus-item__title {
       --ds-card-text: var(--ds-card-text-muted);
-
-      overflow-wrap: anywhere;
     }
 
     & .mui-focus-item__details {
@@ -59,15 +58,10 @@
 
     & .mui-focus-item__kind {
       display: inline-flex;
+      flex-wrap: wrap;
       align-items: center;
       gap: var(--semantic-space-gap-tight);
       font-weight: var(--primitives-font-weight-semibold);
-      white-space: nowrap;
-    }
-
-    /* Details are product data (a project name), so they may break anywhere. */
-    & .mui-focus-item__detail {
-      overflow-wrap: anywhere;
     }
 
     & .mui-focus-item__actions {
@@ -80,10 +74,6 @@
       font-size: var(--primitives-font-size-sm);
     }
 
-    & .mui-focus-item__action {
-      overflow-wrap: anywhere;
-    }
-
     & .mui-focus-item__categories {
       grid-area: categories;
       justify-content: flex-end;
@@ -96,7 +86,7 @@
 
     @container mui-focus-item (max-width: 36rem) {
       & .mui-focus-item__row {
-        grid-template-columns: minmax(0, 1fr) auto;
+        grid-template-columns: minmax(0, 1fr) fit-content(50%);
         grid-template-areas:
           "main toggle"
           "categories categories";

package/dist/goal-card/goal-card.css

@@ -298,12 +298,13 @@
      */
     & .mui-goal-card__type {
       display: inline-flex;
+      flex-wrap: wrap;
+      max-width: 100%;
       align-items: center;
       gap: var(--component-goal-card-chip-gap);
       color: var(--mui-tier-badge-text, var(--semantic-color-text-muted));
       font-size: var(--component-goal-card-chip-font-size);
       font-weight: var(--primitives-font-weight-semibold);
-      white-space: nowrap;
     }
 
     & .mui-goal-card__categories {

package/dist/goal-categories/goal-categories.css

@@ -7,6 +7,7 @@
     margin: 0;
     padding: 0;
     list-style: none;
+    overflow-wrap: anywhere;
 
     & .mui-goal-categories__item {
       display: inline-flex;
@@ -14,7 +15,6 @@
       gap: var(--semantic-space-gap-tight);
       color: var(--semantic-color-text-muted);
       font-size: var(--primitives-font-size-sm);
-      white-space: nowrap;
     }
 
     /*

package/dist/goal-list-item/goal-list-item.css

@@ -15,6 +15,7 @@
     display: grid;
     grid-template-columns: minmax(0, 1fr);
     gap: var(--semantic-space-gap-tight);
+    overflow-wrap: anywhere;
 
     /* Through the contract keys ui-core reads, so no specificity contest with `.ds-card`. */
     & .mui-goal-list-item__card {
@@ -24,14 +25,14 @@
     }
 
     /*
-     * The categories' track is capped: left at `auto` it grows to their
-     * one-line width, and a goal with three long categories squeezed its own
-     * title into a sliver that the details then painted over. Capped, they
-     * wrap inside their share and the title keeps the rest.
+     * The categories' and status's tracks are capped: left at `auto` a track
+     * grows to its one-line width, and a goal with three long categories, or
+     * a status label too long to break, squeezed its own title into a sliver.
+     * Capped, they wrap inside their share and the title keeps the rest.
      */
     & .mui-goal-list-item__row {
       display: grid;
-      grid-template-columns: minmax(0, 1fr) fit-content(40%) auto;
+      grid-template-columns: minmax(0, 1fr) fit-content(40%) fit-content(30%);
       grid-template-areas: "main categories status";
       align-items: center;
       gap: var(--semantic-space-gap) var(--semantic-space-gap-relaxed);
@@ -48,8 +49,6 @@
     /* As on GoalCard: size and grouping mark the heading, not colour. */
     & .mui-goal-list-item__title {
       --ds-card-text: var(--ds-card-text-muted);
-
-      overflow-wrap: anywhere;
     }
 
     & .mui-goal-list-item__details {
@@ -64,14 +63,10 @@
 
     & .mui-goal-list-item__type {
       display: inline-flex;
+      flex-wrap: wrap;
       align-items: center;
       gap: var(--semantic-space-gap-tight);
       font-weight: var(--primitives-font-weight-semibold);
-      white-space: nowrap;
-    }
-
-    & .mui-goal-list-item__detail {
-      white-space: nowrap;
     }
 
     /* GoalCard's small-caps label, so the two views name their details alike. */
@@ -97,7 +92,7 @@
      */
     @container mui-goal-list-item (max-width: 36rem) {
       & .mui-goal-list-item__row {
-        grid-template-columns: minmax(0, 1fr) auto;
+        grid-template-columns: minmax(0, 1fr) fit-content(50%);
         grid-template-areas:
           "main status"
           "categories categories";

package/dist/goal-status-menu/goal-status-menu.css

@@ -17,6 +17,7 @@
     display: inline-flex;
     align-items: center;
     flex-shrink: 0;
+    max-width: 100%;
     gap: var(--semantic-space-gap-tight);
     margin: 0;
     padding: 0 var(--semantic-space-gap-tight);
@@ -38,6 +39,11 @@
       outline-offset: 3px;
     }
 
+    /* A Badge never gives way in a row, but inside the capped trigger it must, or the chevron goes. */
+    & .mui-goal-status-menu__badge {
+      flex-shrink: 1;
+    }
+
     & .mui-goal-status-menu__indicator {
       color: var(--semantic-color-text-muted);
       transform: rotate(90deg);

package/dist/goal-status-menu/goal-status-menu.js

@@ -25,7 +25,7 @@ const STATUS_ITEMS = GOAL_STATUSES.map((status) => ({
  * status and what pressing it does, which also names the menu it opens.
  */
 export function GoalStatusMenu({ status, statusIcon, onStatusChange, indicator = FallbackChevronRight, itemIndicator, labelClassName, className, }) {
-    const badge = (_jsx(Badge, { variant: STATUS_VARIANT[status], appearance: "plain", icon: statusIcon, labelClassName: cx('mui-goal-status-menu__label', labelClassName), "aria-label": status, className: onStatusChange ? undefined : className, children: status }));
+    const badge = (_jsx(Badge, { variant: STATUS_VARIANT[status], appearance: "plain", icon: statusIcon, labelClassName: cx('mui-goal-status-menu__label', labelClassName), "aria-label": status, className: onStatusChange ? 'mui-goal-status-menu__badge' : className, children: status }));
     if (!onStatusChange)
         return badge;
     return (_jsx(Menu, { label: "Status", items: STATUS_ITEMS, value: status, onValueChange: onStatusChange, itemIndicator: itemIndicator, trigger: _jsxs("button", { type: "button", className: cx('mui-goal-status-menu', className), "aria-label": `Status: ${status}. Change status`, children: [badge, _jsx(Icon, { source: indicator, size: "sm", decorative: true, className: "mui-goal-status-menu__indicator" })] }) }));

package/dist/goal-status-menu/goal-status-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"goal-status-menu.js","sourceRoot":"","sources":["../../src/goal-status-menu/goal-status-menu.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,KAAK,EACL,EAAE,EACF,oBAAoB,EACpB,IAAI,EAEJ,IAAI,GAEL,MAAM,mBAAmB,CAAC;AAC3B,OAAO,wBAAwB,CAAC;AAEhC,+EAA+E;AAC/E,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,aAAa,EAAE,aAAa,EAAE,WAAW,CAAU,CAAC;AAIlF,MAAM,cAAc,GAAqD;IACvE,aAAa,EAAE,OAAO;IACtB,aAAa,EAAE,MAAM;IACrB,SAAS,EAAE,SAAS;CACrB,CAAC;AAEF,MAAM,YAAY,GAA2B,aAAa,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;IAC1E,KAAK,EAAE,MAAM;IACb,KAAK,EAAE,MAAM;CACd,CAAC,CAAC,CAAC;AAsCJ;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,cAAc,CAAC,EAC7B,MAAM,EACN,UAAU,EACV,cAAc,EACd,SAAS,GAAG,oBAAoB,EAChC,aAAa,EACb,cAAc,EACd,SAAS,GACW;IACpB,MAAM,KAAK,GAAG,CACZ,KAAC,KAAK,IACJ,OAAO,EAAE,cAAc,CAAC,MAAM,CAAC,EAC/B,UAAU,EAAC,OAAO,EAClB,IAAI,EAAE,UAAU,EAChB,cAAc,EAAE,EAAE,CAAC,6BAA6B,EAAE,cAAc,CAAC,gBACrD,MAAM,EAClB,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,YAEhD,MAAM,GACD,CACT,CAAC;IAEF,IAAI,CAAC,cAAc;QAAE,OAAO,KAAK,CAAC;IAElC,OAAO,CACL,KAAC,IAAI,IACH,KAAK,EAAC,QAAQ,EACd,KAAK,EAAE,YAAY,EACnB,KAAK,EAAE,MAAM,EACb,aAAa,EAAE,cAAc,EAC7B,aAAa,EAAE,aAAa,EAC5B,OAAO,EACL,kBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,gBACpC,WAAW,MAAM,iBAAiB,aAE7C,KAAK,EACN,KAAC,IAAI,IACH,MAAM,EAAE,SAAS,EACjB,IAAI,EAAC,IAAI,EACT,UAAU,QACV,SAAS,EAAC,iCAAiC,GAC3C,IACK,GAEX,CACH,CAAC;AACJ,CAAC"}
+{"version":3,"file":"goal-status-menu.js","sourceRoot":"","sources":["../../src/goal-status-menu/goal-status-menu.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,KAAK,EACL,EAAE,EACF,oBAAoB,EACpB,IAAI,EAEJ,IAAI,GAEL,MAAM,mBAAmB,CAAC;AAC3B,OAAO,wBAAwB,CAAC;AAEhC,+EAA+E;AAC/E,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,aAAa,EAAE,aAAa,EAAE,WAAW,CAAU,CAAC;AAIlF,MAAM,cAAc,GAAqD;IACvE,aAAa,EAAE,OAAO;IACtB,aAAa,EAAE,MAAM;IACrB,SAAS,EAAE,SAAS;CACrB,CAAC;AAEF,MAAM,YAAY,GAA2B,aAAa,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;IAC1E,KAAK,EAAE,MAAM;IACb,KAAK,EAAE,MAAM;CACd,CAAC,CAAC,CAAC;AAsCJ;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,cAAc,CAAC,EAC7B,MAAM,EACN,UAAU,EACV,cAAc,EACd,SAAS,GAAG,oBAAoB,EAChC,aAAa,EACb,cAAc,EACd,SAAS,GACW;IACpB,MAAM,KAAK,GAAG,CACZ,KAAC,KAAK,IACJ,OAAO,EAAE,cAAc,CAAC,MAAM,CAAC,EAC/B,UAAU,EAAC,OAAO,EAClB,IAAI,EAAE,UAAU,EAChB,cAAc,EAAE,EAAE,CAAC,6BAA6B,EAAE,cAAc,CAAC,gBACrD,MAAM,EAClB,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,SAAS,YAEpE,MAAM,GACD,CACT,CAAC;IAEF,IAAI,CAAC,cAAc;QAAE,OAAO,KAAK,CAAC;IAElC,OAAO,CACL,KAAC,IAAI,IACH,KAAK,EAAC,QAAQ,EACd,KAAK,EAAE,YAAY,EACnB,KAAK,EAAE,MAAM,EACb,aAAa,EAAE,cAAc,EAC7B,aAAa,EAAE,aAAa,EAC5B,OAAO,EACL,kBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,gBACpC,WAAW,MAAM,iBAAiB,aAE7C,KAAK,EACN,KAAC,IAAI,IACH,MAAM,EAAE,SAAS,EACjB,IAAI,EAAC,IAAI,EACT,UAAU,QACV,SAAS,EAAC,iCAAiC,GAC3C,IACK,GAEX,CACH,CAAC;AACJ,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@manakind/manuia-ui",
-  "version": "0.10.0",
+  "version": "0.11.1",
   "type": "module",
   "license": "MIT",
   "repository": {
@@ -37,8 +37,8 @@
     "vr": "playwright test"
   },
   "dependencies": {
-    "@manakind/manuia-tokens": "0.9.0",
-    "@manakind/ui-core": "0.10.0"
+    "@manakind/manuia-tokens": "0.10.0",
+    "@manakind/ui-core": "0.11.1"
   },
   "peerDependencies": {
     "react": "^19.0.0",