@manakind/manuia-ui 0.6.0 → 0.8.0

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

@@ -29,10 +29,10 @@
      */
     backdrop-filter: blur(4px);
 
-    &:hover {
-      box-shadow: var(--mui-tier-shadow-hover, var(--semantic-elevation-raised));
-    }
-
+    /*
+     * The lift is the promise of a click, so only a card with an `href` makes
+     * it. A static card stays put under the pointer.
+     */
     &[data-interactive] {
       transition:
         box-shadow 300ms cubic-bezier(0, 0, 0.2, 1),
@@ -40,6 +40,7 @@
         transform 300ms cubic-bezier(0, 0, 0.2, 1);
 
       &:hover {
+        box-shadow: var(--mui-tier-shadow-hover, var(--semantic-elevation-raised));
         transform: var(--mui-tier-hover-transform, none);
       }
     }
@@ -224,10 +225,11 @@
      */
     /*
      * The container query below keeps this on one line in the normal case.
-     * `flex-wrap` stays as the fallback for the two cases it cannot cover:
+     * `flex-wrap` stays as the fallback for the three cases it cannot cover:
      * a card given no `statusIcon` (the badge keeps its text rather than
-     * collapsing to a bare colour chip — see the query), and a browser
-     * without container queries. Wrapping to a second line is a mild,
+     * collapsing to a bare colour chip — see the query), a `periodLabel`
+     * that leaves no room for the status's text (see the query), and a
+     * browser without container queries. Wrapping to a second line is a mild,
      * legible degradation; the card is `overflow: hidden`, so without this
      * the failure mode is a silently clipped status instead.
      */
@@ -318,20 +320,31 @@
      * Getting that backwards is what made the first attempt fire at every
      * width on the goals page.
      *
-     * Measured across all five tiers with the label forced visible: the
-     * widest pairing is "Quarterly" against "Not Started" at 237px, and both
-     * `GoalType` and `GoalStatus` are closed unions, so nothing longer can
-     * arrive. 16rem (256px) collapses before that with 19px to spare.
+     * Two thresholds, because the status is two different widths. Measured
+     * with the label forced visible, the widest pairing is "Quarterly"
+     * against "Not Started", and both `GoalType` and `GoalStatus` are closed
+     * unions, so nothing longer can arrive:
+     *
+     * - the static badge needs 237px. 16rem (256px) collapses before that
+     *   with 19px to spare;
+     * - the status menu's trigger adds its chevron and padding, and needs
+     *   263px. 17.5rem (280px) keeps the same margin.
      *
-     * The number has moved twice. It was 16rem against 243px until a `ui-core`
-     * Badge change added ~12px to every status, leaving 1px of headroom — a
-     * threshold that had silently stopped working while every check stayed
-     * green — so it went to 17rem against 255px. The plain status badge (#177)
-     * then dropped the chip's padding and border, bringing the row to 237px.
-     * Re-measure this after any Badge geometry change, and keep the margin
-     * wide enough that normal drift cannot close it.
+     * The badge threshold has moved twice. It was 16rem against 243px until a
+     * `ui-core` Badge change added ~12px to every status, leaving 1px of
+     * headroom — a threshold that had silently stopped working while every
+     * check stayed green — so it went to 17rem against 255px. The plain status
+     * badge (#177) then dropped the chip's padding and border, bringing the
+     * row to 237px. Re-measure both after any Badge or trigger geometry change,
+     * and keep the margin wide enough that normal drift cannot close it.
      *
-     * The `Statuses` play function is the backstop that makes the margin
+     * A `periodLabel` ("Q1 2027") is left out of the measurement on purpose.
+     * It adds ~66px, which at the goals page's 22rem track pushes the status
+     * to a line of its own, and that wrap is the better outcome there: hiding
+     * the status's text on every quarterly card at the standard width would
+     * trade a readable status for a tidier row.
+     *
+     * The `Statuses` play function is the backstop that makes the margins
      * safe to reason about rather than something to over-pad: it fails if the
      * row ever overflows at a width where the label is meant to show.
      *
@@ -342,8 +355,8 @@
      * This does in CSS what Badge's `compact` prop does, because a container
      * query cannot set a prop. It hides our own `labelClassName`, never a
      * `ui-core` class. The badge is `plain`, so there is no chip to square up:
-     * only the label goes, and its `aria-label` keeps the accessible name
-     * identical at both widths.
+     * only the label goes, and its `aria-label` — and the trigger's own name —
+     * keep the accessible name identical at both widths.
      *
      * Badge wraps the label — and so applies this class — only when there is
      * an `icon`. A card that passed no `statusIcon` therefore keeps its text
@@ -355,6 +368,12 @@
       }
     }
 
+    @container mui-goal-card (max-width: 17.5rem) {
+      & .mui-goal-status-menu .mui-goal-card__status-label {
+        display: none;
+      }
+    }
+
     /*
      * A heading needn't differ in colour from the body; size and grouping
      * mark it. Set through the contract key `ui-core`'s title reads, so no
@@ -406,6 +425,12 @@
       color: var(--semantic-color-text-inverse);
     }
 
+    & .mui-goal-card__milestone-converted {
+      display: inline-flex;
+      flex-shrink: 0;
+      color: var(--semantic-color-text-muted);
+    }
+
     & .mui-goal-card__milestone--done {
       color: var(--semantic-color-text-muted);
       text-decoration: line-through;

package/dist/goal-card/goal-card.d.ts

@@ -1,13 +1,29 @@
 import { type IconSource } from '@manakind/ui-core';
+import type { ElementType, ReactNode } from 'react';
 import { type GoalCategory } from '../goal-categories';
+import { type GoalStatus } from '../goal-status-menu';
 import './goal-card.css';
 /** Manuia's goal timeframes, longest horizon first. */
 export type GoalType = '5 Year' | '1 Year' | 'Quarterly' | 'Monthly' | 'Weekly';
-export type GoalStatus = 'Not Started' | 'In Progress' | 'Completed';
 export interface GoalMilestone {
     id: string;
     title: string;
     completed: boolean;
+    /**
+     * The milestone has been turned into a goal of its own. Shown as a glyph
+     * beside the title, named "Converted to a goal" for assistive technology,
+     * so the glyph is never the only signal.
+     */
+    convertedToGoal?: boolean;
+}
+/**
+ * The props a `linkComponent` receives. A plain `'a'` and a router's link
+ * (Next's `Link`) both satisfy it.
+ */
+export interface GoalLinkProps {
+    href: string;
+    className?: string;
+    children?: ReactNode;
 }
 export interface GoalCardProps {
     /** Goal title. Rendered as the card's heading. */
@@ -28,6 +44,34 @@ export interface GoalCardProps {
      * outline differs per status, not just its hue.
      */
     statusIcon?: IconSource;
+    /**
+     * Called with a newly chosen status. When set, the status badge becomes a
+     * button opening a menu of the three statuses (see `GoalStatusMenu`), which
+     * stays operable on a linked card. Without it the badge is static.
+     */
+    onStatusChange?: (status: GoalStatus) => void;
+    /** Chevron after the status badge when it opens a menu. See `GoalStatusMenu`'s `indicator`. */
+    statusMenuIndicator?: IconSource;
+    /** Glyph marking the current status in the status menu. See `GoalStatusMenu`'s `itemIndicator`. */
+    statusMenuItemIndicator?: IconSource;
+    /**
+     * Where the card leads, usually the goal's own page. The title becomes the
+     * link and its hit area covers the card, which then takes its interactive
+     * styling; the status menu stays separately operable above it.
+     *
+     * Without it the card is static: no link, no hover or focus treatment.
+     */
+    href?: string;
+    /**
+     * What renders the link: `'a'` by default, or a router's link such as
+     * Next's `Link`. It receives `href`, `className` and the title as children.
+     */
+    linkComponent?: ElementType<GoalLinkProps>;
+    /**
+     * The specific period, beside the timeframe: "Q3", or "Q1 2027" outside
+     * the current year. Formatting is the caller's job.
+     */
+    periodLabel?: string;
     /** Categories this goal belongs to. */
     categories?: GoalCategory[];
     /** How many categories to show before collapsing into `+N more`. */
@@ -45,6 +89,8 @@ export interface GoalCardProps {
     typeIcon?: IconSource;
     /** Glyph for a completed milestone. Falls back to a filled dot. */
     milestoneIcon?: IconSource;
+    /** Glyph marking a milestone converted into a goal. Falls back to a built-in arrow. */
+    milestoneConvertedIcon?: IconSource;
     /**
      * Emblem shown on the higher tiers — the product uses a crown for 5 Year,
      * a shield for 1 Year, and a compass for Quarterly.
@@ -75,9 +121,11 @@ export interface GoalCardProps {
  * deliberate product signal, not decoration for its own sake: a five-year goal
  * should not look like a weekly one.
  *
- * The card is styled as interactive but is **not** operable on its own — wrap
- * it in a link or button so it is reachable by keyboard, exactly as `Card`'s
- * `interactive` prop documents.
+ * Give it an `href` and the card owns its link: the title is the link, its
+ * hit area stretches over the card (`ui-core`'s `CardLink`), and the status
+ * menu sits above it, separately operable. Don't wrap the card in a link —
+ * the status menu would then be a control nested inside a link, which is
+ * invalid and breaks keyboard and screen reader use.
  *
  * @remarks
  * The three highest tiers carry the full prestige treatment — gradient wash,
@@ -88,5 +136,5 @@ export interface GoalCardProps {
  * designed colours, so the shapes are right and the exact hues are pending a
  * design pass. See issue #34.
  */
-export declare function GoalCard({ title, description, type, status, statusIcon, categories, maxVisibleCategories, milestones, targetDate, typeIcon, milestoneIcon, emblemIcon, titleAs, className, }: GoalCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function GoalCard({ title, description, type, status, statusIcon, onStatusChange, statusMenuIndicator, statusMenuItemIndicator, href, linkComponent: LinkComponent, periodLabel, categories, maxVisibleCategories, milestones, targetDate, typeIcon, milestoneIcon, milestoneConvertedIcon, emblemIcon, titleAs, className, }: GoalCardProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=goal-card.d.ts.map

package/dist/goal-card/goal-card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"goal-card.d.ts","sourceRoot":"","sources":["../../src/goal-card/goal-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EASL,KAAK,UAAU,EAEhB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAkB,KAAK,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACvE,OAAO,iBAAiB,CAAC;AAEzB,uDAAuD;AACvD,MAAM,MAAM,QAAQ,GAAG,QAAQ,GAAG,QAAQ,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEhF,MAAM,MAAM,UAAU,GAAG,aAAa,GAAG,aAAa,GAAG,WAAW,CAAC;AAErE,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,aAAa;IAC5B,kDAAkD;IAClD,KAAK,EAAE,MAAM,CAAC;IACd,gCAAgC;IAChC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gDAAgD;IAChD,IAAI,EAAE,QAAQ,CAAC;IACf,yCAAyC;IACzC,MAAM,EAAE,UAAU,CAAC;IACnB;;;;;;;;OAQG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,uCAAuC;IACvC,UAAU,CAAC,EAAE,YAAY,EAAE,CAAC;IAC5B,oEAAoE;IACpE,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,+DAA+D;IAC/D,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;IAC7B,yGAAyG;IACzG,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAC;IACtB,mEAAmE;IACnE,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC7B,yBAAyB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA2BD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,MAAM,EACN,UAAU,EACV,UAAe,EACf,oBAAwB,EACxB,UAAU,EACV,UAAU,EACV,QAAQ,EACR,aAAa,EACb,UAAU,EACV,OAAc,EACd,SAAS,GACV,EAAE,aAAa,2CAkHf"}
+{"version":3,"file":"goal-card.d.ts","sourceRoot":"","sources":["../../src/goal-card/goal-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EASL,KAAK,UAAU,EAEhB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAkB,KAAK,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACvE,OAAO,EAAE,KAAK,UAAU,EAAkB,MAAM,qBAAqB,CAAC;AACtE,OAAO,iBAAiB,CAAC;AAEzB,uDAAuD;AACvD,MAAM,MAAM,QAAQ,GAAG,QAAQ,GAAG,QAAQ,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEhF,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED;;;GAGG;AACH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,MAAM,WAAW,aAAa;IAC5B,kDAAkD;IAClD,KAAK,EAAE,MAAM,CAAC;IACd,gCAAgC;IAChC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gDAAgD;IAChD,IAAI,EAAE,QAAQ,CAAC;IACf,yCAAyC;IACzC,MAAM,EAAE,UAAU,CAAC;IACnB;;;;;;;;OAQG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;;OAIG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IAC9C,+FAA+F;IAC/F,mBAAmB,CAAC,EAAE,UAAU,CAAC;IACjC,mGAAmG;IACnG,uBAAuB,CAAC,EAAE,UAAU,CAAC;IACrC;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,WAAW,CAAC,aAAa,CAAC,CAAC;IAC3C;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uCAAuC;IACvC,UAAU,CAAC,EAAE,YAAY,EAAE,CAAC;IAC5B,oEAAoE;IACpE,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,+DAA+D;IAC/D,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;IAC7B,yGAAyG;IACzG,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAC;IACtB,mEAAmE;IACnE,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B,uFAAuF;IACvF,sBAAsB,CAAC,EAAE,UAAU,CAAC;IACpC;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC7B,yBAAyB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAqBD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,MAAM,EACN,UAAU,EACV,cAAc,EACd,mBAAmB,EACnB,uBAAuB,EACvB,IAAI,EACJ,aAAa,EAAE,aAAmB,EAClC,WAAW,EACX,UAAe,EACf,oBAAwB,EACxB,UAAU,EACV,UAAU,EACV,QAAQ,EACR,aAAa,EACb,sBAAuC,EACvC,UAAU,EACV,OAAc,EACd,SAAS,GACV,EAAE,aAAa,2CAyHf"}

package/dist/goal-card/goal-card.js

@@ -1,12 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Badge, Card, CardContent, CardHeader, CardTitle, cx, Icon, Progress, } from '@manakind/ui-core';
+import { Card, CardContent, CardHeader, CardLink, CardTitle, cx, Icon, Progress, } from '@manakind/ui-core';
 import { GoalCategories } from '../goal-categories';
+import { GoalStatusMenu } from '../goal-status-menu';
 import './goal-card.css';
-const STATUS_VARIANT = {
-    'Not Started': 'muted',
-    'In Progress': 'info',
-    Completed: 'success',
-};
 /**
  * Emblem glyph size per tier, mirroring the product (20 / 16 / 14). The ring
  * around it is sized in CSS from the tier tokens; this is the icon inside it.
@@ -35,9 +31,11 @@ const TIER_CLASS = {
  * deliberate product signal, not decoration for its own sake: a five-year goal
  * should not look like a weekly one.
  *
- * The card is styled as interactive but is **not** operable on its own — wrap
- * it in a link or button so it is reachable by keyboard, exactly as `Card`'s
- * `interactive` prop documents.
+ * Give it an `href` and the card owns its link: the title is the link, its
+ * hit area stretches over the card (`ui-core`'s `CardLink`), and the status
+ * menu sits above it, separately operable. Don't wrap the card in a link —
+ * the status menu would then be a control nested inside a link, which is
+ * invalid and breaks keyboard and screen reader use.
  *
  * @remarks
  * The three highest tiers carry the full prestige treatment — gradient wash,
@@ -48,15 +46,9 @@ const TIER_CLASS = {
  * designed colours, so the shapes are right and the exact hues are pending a
  * design pass. See issue #34.
  */
-export function GoalCard({ title, description, type, status, statusIcon, categories = [], maxVisibleCategories = 3, milestones, targetDate, typeIcon, milestoneIcon, emblemIcon, titleAs = 'h3', className, }) {
+export function GoalCard({ title, description, type, status, statusIcon, onStatusChange, statusMenuIndicator, statusMenuItemIndicator, href, linkComponent: LinkComponent = 'a', periodLabel, categories = [], maxVisibleCategories = 3, milestones, targetDate, typeIcon, milestoneIcon, milestoneConvertedIcon = ConvertedArrow, emblemIcon, titleAs = 'h3', className, }) {
     const completed = milestones?.filter((m) => m.completed).length ?? 0;
     const total = milestones?.length ?? 0;
-    /*
-     * Labelled even though the text is visible on a wide card: the label is what
-     * survives when the container query hides `mui-goal-card__status-label`, and
-     * a badge cannot know which side of that query it is on.
-     */
-    const statusBadge = (_jsx(Badge, { variant: STATUS_VARIANT[status], appearance: "plain", icon: statusIcon, labelClassName: "mui-goal-card__status-label", "aria-label": status, children: status }));
     /*
      * Three decorative, inert spans are always in the tree, and CSS decides per
      * tier whether they show: the ornament frame and the four corner marks
@@ -67,6 +59,12 @@ export function GoalCard({ title, description, type, status, statusIcon, categor
      * treatment stays entirely in `goal-card.css` — one place to read what a
      * tier looks like, and no second definition here to drift from it.
      */
-    return (_jsxs(Card, { interactive: true, className: cx('mui-goal-card', `mui-goal-card--${TIER_CLASS[type]}`, className), children: [_jsx("span", { className: "mui-goal-card__ornament", "aria-hidden": "true" }), _jsxs("span", { className: "mui-goal-card__corners", "aria-hidden": "true", children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }), _jsxs(CardHeader, { className: "mui-goal-card__header", children: [_jsxs("div", { className: "mui-goal-card__meta", children: [_jsxs("span", { className: "mui-goal-card__meta-start", children: [emblemIcon && (_jsx("span", { className: "mui-goal-card__emblem", "aria-hidden": "true", children: _jsx(Icon, { source: emblemIcon, size: TIER_EMBLEM_ICON_SIZE[type] ?? 'md', decorative: true }) })), _jsxs("span", { className: "mui-goal-card__type", children: [typeIcon && _jsx(Icon, { source: typeIcon, size: "sm", decorative: true }), type] })] }), statusBadge] }), _jsx(GoalCategories, { className: "mui-goal-card__categories", categories: categories, maxVisible: maxVisibleCategories }), _jsx(CardTitle, { as: titleAs, className: "mui-goal-card__title", children: title }), _jsx("span", { className: "mui-goal-card__divider", "aria-hidden": "true" })] }), _jsxs(CardContent, { className: "mui-goal-card__content", children: [_jsx("p", { className: "mui-goal-card__description", children: description || 'No description provided.' }), total > 0 && (_jsxs("div", { className: "mui-goal-card__milestones", children: [_jsx(Progress, { size: "sm", value: completed, max: total, label: _jsx("span", { className: "mui-goal-card__milestones-label", children: "Milestones" }), valueText: `${completed} of ${total}` }), _jsx("ul", { className: "mui-goal-card__milestone-list", children: milestones?.map((milestone) => (_jsxs("li", { className: cx('mui-goal-card__milestone', milestone.completed && 'mui-goal-card__milestone--done'), children: [_jsx("span", { className: "mui-goal-card__milestone-marker", "aria-hidden": "true", children: milestone.completed && milestoneIcon && (_jsx(Icon, { source: milestoneIcon, size: "sm", decorative: true })) }), _jsx("span", { className: "mui-goal-card__milestone-title", children: milestone.title })] }, milestone.id))) })] })), targetDate && (_jsxs("p", { className: "mui-goal-card__target", children: [_jsx("span", { className: "mui-goal-card__target-label", children: "Target:" }), " ", targetDate] }))] })] }));
+    return (_jsxs(Card, { interactive: Boolean(href), className: cx('mui-goal-card', `mui-goal-card--${TIER_CLASS[type]}`, className), children: [_jsx("span", { className: "mui-goal-card__ornament", "aria-hidden": "true" }), _jsxs("span", { className: "mui-goal-card__corners", "aria-hidden": "true", children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }), _jsxs(CardHeader, { className: "mui-goal-card__header", children: [_jsxs("div", { className: "mui-goal-card__meta", children: [_jsxs("span", { className: "mui-goal-card__meta-start", children: [emblemIcon && (_jsx("span", { className: "mui-goal-card__emblem", "aria-hidden": "true", children: _jsx(Icon, { source: emblemIcon, size: TIER_EMBLEM_ICON_SIZE[type] ?? 'md', decorative: true }) })), _jsxs("span", { className: "mui-goal-card__type", children: [typeIcon && _jsx(Icon, { source: typeIcon, size: "sm", decorative: true }), type, periodLabel && (_jsxs("span", { className: "mui-goal-card__period", children: [' ', _jsx("span", { "aria-hidden": "true", children: "\u00B7" }), " ", periodLabel] }))] })] }), _jsx(GoalStatusMenu, { labelClassName: "mui-goal-card__status-label", status: status, statusIcon: statusIcon, onStatusChange: onStatusChange, indicator: statusMenuIndicator, itemIndicator: statusMenuItemIndicator })] }), _jsx(GoalCategories, { className: "mui-goal-card__categories", categories: categories, maxVisible: maxVisibleCategories }), _jsx(CardTitle, { as: titleAs, className: "mui-goal-card__title", children: href ? (_jsx(CardLink, { asChild: true, children: _jsx(LinkComponent, { href: href, children: title }) })) : (title) }), _jsx("span", { className: "mui-goal-card__divider", "aria-hidden": "true" })] }), _jsxs(CardContent, { className: "mui-goal-card__content", children: [_jsx("p", { className: "mui-goal-card__description", children: description || 'No description provided.' }), total > 0 && (_jsxs("div", { className: "mui-goal-card__milestones", children: [_jsx(Progress, { size: "sm", value: completed, max: total, label: _jsx("span", { className: "mui-goal-card__milestones-label", children: "Milestones" }), valueText: `${completed} of ${total}` }), _jsx("ul", { className: "mui-goal-card__milestone-list", children: milestones?.map((milestone) => (_jsxs("li", { className: cx('mui-goal-card__milestone', milestone.completed && 'mui-goal-card__milestone--done'), children: [_jsx("span", { className: "mui-goal-card__milestone-marker", "aria-hidden": "true", children: milestone.completed && milestoneIcon && (_jsx(Icon, { source: milestoneIcon, size: "sm", decorative: true })) }), _jsx("span", { className: "mui-goal-card__milestone-title", children: milestone.title }), milestone.convertedToGoal && (_jsx("span", { className: "mui-goal-card__milestone-converted", children: _jsx(Icon, { source: milestoneConvertedIcon, size: "sm", label: "Converted to a goal" }) }))] }, milestone.id))) })] })), targetDate && (_jsxs("p", { className: "mui-goal-card__target", children: [_jsx("span", { className: "mui-goal-card__target-label", children: "Target:" }), " ", targetDate] }))] })] }));
 }
+/*
+ * Fallback glyph, inlined because this package is public and may not
+ * reference the private icon package. Products pass their own.
+ */
+const ConvertedArrow = (props) => (_jsx("svg", { "aria-hidden": "true", viewBox: "0 0 16 16", fill: "none", ...props, children: _jsx("path", { d: "M5 11 11 5M6 5h5v5", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+ConvertedArrow.displayName = 'GoalCardConvertedArrow';
 //# sourceMappingURL=goal-card.js.map

package/dist/goal-card/goal-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"goal-card.js","sourceRoot":"","sources":["../../src/goal-card/goal-card.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"goal-card.js","sourceRoot":"","sources":["../../src/goal-card/goal-card.tsx"],"names":[],"mappings":"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"}

package/dist/goal-card/index.d.ts

@@ -1,3 +1,3 @@
-export type { GoalCardProps, GoalMilestone, GoalStatus, GoalType, } from './goal-card';
+export type { GoalCardProps, GoalLinkProps, GoalMilestone, GoalType } from './goal-card';
 export { GoalCard } from './goal-card';
 //# sourceMappingURL=index.d.ts.map

package/dist/goal-card/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/goal-card/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,aAAa,EACb,aAAa,EACb,UAAU,EACV,QAAQ,GACT,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/goal-card/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACzF,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC"}

package/dist/goal-card/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/goal-card/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/goal-card/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC"}

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

@@ -0,0 +1,10 @@
+@layer components {
+  .mui-goal-list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--semantic-space-gap);
+    margin: 0;
+    padding: 0;
+    list-style: none;
+  }
+}

package/dist/goal-list/goal-list.css.d.ts

@@ -0,0 +1,2 @@
+/* AUTOGENERATED: types for the stylesheet beside it. */
+export {};

package/dist/goal-list/goal-list.d.ts

@@ -0,0 +1,17 @@
+import type { ComponentProps } from 'react';
+import './goal-list.css';
+export interface GoalListProps extends ComponentProps<'ul'> {
+    /** `GoalListItem`s. Each renders its own `<li>`. */
+    children?: ComponentProps<'ul'>['children'];
+}
+/**
+ * The list view of Manuia's goals: a `<ul>` of `GoalListItem` rows, the
+ * compact counterpart to a grid of `GoalCard`s.
+ *
+ * A real list, so a screen reader announces how many goals there are and
+ * where in them the reader is. Name it with `aria-label` or
+ * `aria-labelledby` when the heading above it doesn't already say what it
+ * lists.
+ */
+export declare function GoalList({ className, children, ...props }: GoalListProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=goal-list.d.ts.map

package/dist/goal-list/goal-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"goal-list.d.ts","sourceRoot":"","sources":["../../src/goal-list/goal-list.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,iBAAiB,CAAC;AAEzB,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,IAAI,CAAC;IACzD,oDAAoD;IACpD,QAAQ,CAAC,EAAE,cAAc,CAAC,IAAI,CAAC,CAAC,UAAU,CAAC,CAAC;CAC7C;AAED;;;;;;;;GAQG;AACH,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,2CAMxE"}

package/dist/goal-list/goal-list.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cx } from '@manakind/ui-core';
+import './goal-list.css';
+/**
+ * The list view of Manuia's goals: a `<ul>` of `GoalListItem` rows, the
+ * compact counterpart to a grid of `GoalCard`s.
+ *
+ * A real list, so a screen reader announces how many goals there are and
+ * where in them the reader is. Name it with `aria-label` or
+ * `aria-labelledby` when the heading above it doesn't already say what it
+ * lists.
+ */
+export function GoalList({ className, children, ...props }) {
+    return (_jsx("ul", { className: cx('mui-goal-list', className), ...props, children: children }));
+}
+//# sourceMappingURL=goal-list.js.map

package/dist/goal-list/goal-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"goal-list.js","sourceRoot":"","sources":["../../src/goal-list/goal-list.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAC;AAEvC,OAAO,iBAAiB,CAAC;AAOzB;;;;;;;;GAQG;AACH,MAAM,UAAU,QAAQ,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAiB;IACvE,OAAO,CACL,aAAI,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC,KAAM,KAAK,YACrD,QAAQ,GACN,CACN,CAAC;AACJ,CAAC"}

package/dist/goal-list/index.d.ts

@@ -0,0 +1,3 @@
+export type { GoalListProps } from './goal-list';
+export { GoalList } from './goal-list';
+//# sourceMappingURL=index.d.ts.map

package/dist/goal-list/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/goal-list/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC"}

package/dist/goal-list/index.js

@@ -0,0 +1,2 @@
+export { GoalList } from './goal-list';
+//# sourceMappingURL=index.js.map

package/dist/goal-list/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/goal-list/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC"}

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

@@ -0,0 +1,112 @@
+@layer components {
+  .mui-goal-list-item {
+    /*
+     * The row lays out by its own width, not the viewport's, so a list in a
+     * narrow column collapses the same way a list on a phone does. The `<li>`
+     * is sized by the list, never by its content, so containment is safe.
+     */
+    container: mui-goal-list-item / inline-size;
+
+    /*
+     * A message passed as children sits under the row, inside the same item.
+     * The track is pinned to the item's width: left `auto`, a word too long
+     * to break in the message would widen the whole row past the list.
+     */
+    display: grid;
+    grid-template-columns: minmax(0, 1fr);
+    gap: var(--semantic-space-gap-tight);
+
+    /* Through the contract keys ui-core reads, so no specificity contest with `.ds-card`. */
+    & .mui-goal-list-item__card {
+      --ds-card-padding: var(--semantic-space-padding);
+      --ds-card-title-font-size: var(--primitives-font-size-md);
+      --ds-card-title-font-weight: var(--primitives-font-weight-regular);
+    }
+
+    /*
+     * 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.
+     */
+    & .mui-goal-list-item__row {
+      display: grid;
+      grid-template-columns: minmax(0, 1fr) fit-content(40%) auto;
+      grid-template-areas: "main categories status";
+      align-items: center;
+      gap: var(--semantic-space-gap) var(--semantic-space-gap-relaxed);
+    }
+
+    & .mui-goal-list-item__main {
+      grid-area: main;
+      display: flex;
+      flex-direction: column;
+      gap: var(--semantic-space-gap-tight);
+      min-width: 0;
+    }
+
+    /* 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 {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      gap: var(--semantic-space-gap-tight) var(--semantic-space-gap-relaxed);
+      margin: 0;
+      color: var(--semantic-color-text-muted);
+      font-size: var(--primitives-font-size-xs);
+    }
+
+    & .mui-goal-list-item__type {
+      display: inline-flex;
+      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. */
+    & .mui-goal-list-item__detail-label {
+      font-weight: var(--primitives-font-weight-semibold);
+      letter-spacing: 0.15em;
+      text-transform: uppercase;
+    }
+
+    & .mui-goal-list-item__categories {
+      grid-area: categories;
+      justify-content: flex-end;
+    }
+
+    & .mui-goal-list-item__status {
+      grid-area: status;
+      justify-self: end;
+    }
+
+    /*
+     * Narrow: the categories move to a line of their own and the status stays
+     * beside the title, where a reader scanning the list looks for it.
+     */
+    @container mui-goal-list-item (max-width: 36rem) {
+      & .mui-goal-list-item__row {
+        grid-template-columns: minmax(0, 1fr) auto;
+        grid-template-areas:
+          "main status"
+          "categories categories";
+        align-items: start;
+      }
+
+      & .mui-goal-list-item__categories {
+        justify-content: flex-start;
+      }
+    }
+  }
+}

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

@@ -0,0 +1,2 @@
+/* AUTOGENERATED: types for the stylesheet beside it. */
+export {};

package/dist/goal-list-item/goal-list-item.d.ts

@@ -0,0 +1,75 @@
+import { type IconSource } from '@manakind/ui-core';
+import type { ElementType, ReactNode } from 'react';
+import type { GoalLinkProps, GoalMilestone, GoalType } from '../goal-card';
+import { type GoalCategory } from '../goal-categories';
+import { type GoalStatus } from '../goal-status-menu';
+import './goal-list-item.css';
+export interface GoalListItemProps {
+    /** Goal title. Rendered as the row's heading, and as its link when there is an `href`. */
+    title: string;
+    /** Timeframe, shown as text beside its icon. */
+    type: GoalType;
+    /** Progress status, shown as a badge. */
+    status: GoalStatus;
+    /**
+     * Glyph for the status, supplied by the product. Strongly recommended, for
+     * `GoalCard`'s reason: a glyph whose outline differs per status keeps the
+     * status readable without its colour.
+     */
+    statusIcon?: IconSource;
+    /**
+     * Called with a newly chosen status. When set, the status badge opens a
+     * menu of the three statuses, separately operable from the row's link.
+     */
+    onStatusChange?: (status: GoalStatus) => void;
+    /** Chevron after the status badge when it opens a menu. See `GoalStatusMenu`'s `indicator`. */
+    statusMenuIndicator?: IconSource;
+    /** Glyph marking the current status in the status menu. See `GoalStatusMenu`'s `itemIndicator`. */
+    statusMenuItemIndicator?: IconSource;
+    /** The specific period beside the timeframe, such as "Q3" or "Q1 2027". Formatted by the caller. */
+    periodLabel?: string;
+    /** Categories this goal belongs to. */
+    categories?: GoalCategory[];
+    /** How many categories to show before collapsing into `+N more`. Defaults to 2, a row being narrower than a card. */
+    maxVisibleCategories?: number;
+    /** Milestones, summarised as "Milestones 2 of 3". */
+    milestones?: GoalMilestone[];
+    /** Pre-formatted target date. */
+    targetDate?: string;
+    /** Icon beside the timeframe, supplied by the product. */
+    typeIcon?: IconSource;
+    /**
+     * Where the row leads. The title becomes the link and its hit area covers
+     * the row; without it the row is static.
+     */
+    href?: string;
+    /** What renders the link: `'a'` by default, or a router's link such as Next's `Link`. */
+    linkComponent?: ElementType<GoalLinkProps>;
+    /** Heading level for the title. Defaults to `h3`; match the surrounding outline. */
+    titleAs?: 'h2' | 'h3' | 'h4';
+    /** Extra class names on the `<li>`. */
+    className?: string;
+    /**
+     * A message about this goal, shown under the row inside the same `<li>`:
+     * an `Alert` after a failed status change, say. Kept in the item so the
+     * list's item count stays the number of goals.
+     */
+    children?: ReactNode;
+}
+/**
+ * One Manuia goal as a compact row, for the list view. Render it inside a
+ * `GoalList`: it is the `<li>`.
+ *
+ * Carries what `GoalCard` does where a row has room for it — title,
+ * timeframe and period, categories, a milestone count, target date and the
+ * status — and leaves out the description, the milestone checklist and the
+ * prestige-tier decoration. Behaves like the card: with an `href` the title is
+ * the link and its hit area stretches over the row, and the status menu sits
+ * above it, separately operable.
+ *
+ * Wide, the row reads left to right: title over its details, then categories,
+ * then status. Narrow, the categories drop below and the status stays beside
+ * the title.
+ */
+export declare function GoalListItem({ title, type, status, statusIcon, onStatusChange, statusMenuIndicator, statusMenuItemIndicator, periodLabel, categories, maxVisibleCategories, milestones, targetDate, typeIcon, href, linkComponent: LinkComponent, titleAs, className, children, }: GoalListItemProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=goal-list-item.d.ts.map

package/dist/goal-list-item/goal-list-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"goal-list-item.d.ts","sourceRoot":"","sources":["../../src/goal-list-item/goal-list-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,KAAK,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACzF,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAC3E,OAAO,EAAkB,KAAK,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACvE,OAAO,EAAE,KAAK,UAAU,EAAkB,MAAM,qBAAqB,CAAC;AACtE,OAAO,sBAAsB,CAAC;AAE9B,MAAM,WAAW,iBAAiB;IAChC,0FAA0F;IAC1F,KAAK,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,IAAI,EAAE,QAAQ,CAAC;IACf,yCAAyC;IACzC,MAAM,EAAE,UAAU,CAAC;IACnB;;;;OAIG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IAC9C,+FAA+F;IAC/F,mBAAmB,CAAC,EAAE,UAAU,CAAC;IACjC,mGAAmG;IACnG,uBAAuB,CAAC,EAAE,UAAU,CAAC;IACrC,oGAAoG;IACpG,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uCAAuC;IACvC,UAAU,CAAC,EAAE,YAAY,EAAE,CAAC;IAC5B,qHAAqH;IACrH,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,qDAAqD;IACrD,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;IAC7B,iCAAiC;IACjC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,UAAU,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,yFAAyF;IACzF,aAAa,CAAC,EAAE,WAAW,CAAC,aAAa,CAAC,CAAC;IAC3C,oFAAoF;IACpF,OAAO,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC7B,uCAAuC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,IAAI,EACJ,MAAM,EACN,UAAU,EACV,cAAc,EACd,mBAAmB,EACnB,uBAAuB,EACvB,WAAW,EACX,UAAe,EACf,oBAAwB,EACxB,UAAU,EACV,UAAU,EACV,QAAQ,EACR,IAAI,EACJ,aAAa,EAAE,aAAmB,EAClC,OAAc,EACd,SAAS,EACT,QAAQ,GACT,EAAE,iBAAiB,2CA+DnB"}

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

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Card, CardLink, CardTitle, cx, Icon } from '@manakind/ui-core';
+import { GoalCategories } from '../goal-categories';
+import { GoalStatusMenu } from '../goal-status-menu';
+import './goal-list-item.css';
+/**
+ * One Manuia goal as a compact row, for the list view. Render it inside a
+ * `GoalList`: it is the `<li>`.
+ *
+ * Carries what `GoalCard` does where a row has room for it — title,
+ * timeframe and period, categories, a milestone count, target date and the
+ * status — and leaves out the description, the milestone checklist and the
+ * prestige-tier decoration. Behaves like the card: with an `href` the title is
+ * the link and its hit area stretches over the row, and the status menu sits
+ * above it, separately operable.
+ *
+ * Wide, the row reads left to right: title over its details, then categories,
+ * then status. Narrow, the categories drop below and the status stays beside
+ * the title.
+ */
+export function GoalListItem({ title, type, status, statusIcon, onStatusChange, statusMenuIndicator, statusMenuItemIndicator, periodLabel, categories = [], maxVisibleCategories = 2, milestones, targetDate, typeIcon, href, linkComponent: LinkComponent = 'a', titleAs = 'h3', className, children, }) {
+    const completed = milestones?.filter((m) => m.completed).length ?? 0;
+    const total = milestones?.length ?? 0;
+    return (_jsxs("li", { className: cx('mui-goal-list-item', className), children: [_jsx(Card, { interactive: Boolean(href), className: "mui-goal-list-item__card", children: _jsxs("div", { className: "mui-goal-list-item__row", children: [_jsxs("div", { className: "mui-goal-list-item__main", children: [_jsx(CardTitle, { as: titleAs, className: "mui-goal-list-item__title", children: href ? (_jsx(CardLink, { asChild: true, children: _jsx(LinkComponent, { href: href, children: title }) })) : (title) }), _jsxs("p", { className: "mui-goal-list-item__details", children: [_jsxs("span", { className: "mui-goal-list-item__type", children: [typeIcon && _jsx(Icon, { source: typeIcon, size: "sm", decorative: true }), type, periodLabel && (_jsxs("span", { className: "mui-goal-list-item__period", children: [' ', _jsx("span", { "aria-hidden": "true", children: "\u00B7" }), " ", periodLabel] }))] }), total > 0 && (_jsxs("span", { className: "mui-goal-list-item__detail", children: [_jsx("span", { className: "mui-goal-list-item__detail-label", children: "Milestones" }), " ", completed, ' ', "of ", total] })), targetDate && (_jsxs("span", { className: "mui-goal-list-item__detail", children: [_jsx("span", { className: "mui-goal-list-item__detail-label", children: "Target:" }), " ", targetDate] }))] })] }), _jsx(GoalCategories, { className: "mui-goal-list-item__categories", categories: categories, maxVisible: maxVisibleCategories }), _jsx(GoalStatusMenu, { className: "mui-goal-list-item__status", status: status, statusIcon: statusIcon, onStatusChange: onStatusChange, indicator: statusMenuIndicator, itemIndicator: statusMenuItemIndicator })] }) }), children] }));
+}
+//# sourceMappingURL=goal-list-item.js.map

package/dist/goal-list-item/goal-list-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"goal-list-item.js","sourceRoot":"","sources":["../../src/goal-list-item/goal-list-item.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,EAAE,IAAI,EAAmB,MAAM,mBAAmB,CAAC;AAGzF,OAAO,EAAE,cAAc,EAAqB,MAAM,oBAAoB,CAAC;AACvE,OAAO,EAAmB,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACtE,OAAO,sBAAsB,CAAC;AAuD9B;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,YAAY,CAAC,EAC3B,KAAK,EACL,IAAI,EACJ,MAAM,EACN,UAAU,EACV,cAAc,EACd,mBAAmB,EACnB,uBAAuB,EACvB,WAAW,EACX,UAAU,GAAG,EAAE,EACf,oBAAoB,GAAG,CAAC,EACxB,UAAU,EACV,UAAU,EACV,QAAQ,EACR,IAAI,EACJ,aAAa,EAAE,aAAa,GAAG,GAAG,EAClC,OAAO,GAAG,IAAI,EACd,SAAS,EACT,QAAQ,GACU;IAClB,MAAM,SAAS,GAAG,UAAU,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC;IACrE,MAAM,KAAK,GAAG,UAAU,EAAE,MAAM,IAAI,CAAC,CAAC;IAEtC,OAAO,CACL,cAAI,SAAS,EAAE,EAAE,CAAC,oBAAoB,EAAE,SAAS,CAAC,aAChD,KAAC,IAAI,IAAC,WAAW,EAAE,OAAO,CAAC,IAAI,CAAC,EAAE,SAAS,EAAC,0BAA0B,YACpE,eAAK,SAAS,EAAC,yBAAyB,aACtC,eAAK,SAAS,EAAC,0BAA0B,aACvC,KAAC,SAAS,IAAC,EAAE,EAAE,OAAO,EAAE,SAAS,EAAC,2BAA2B,YAC1D,IAAI,CAAC,CAAC,CAAC,CACN,KAAC,QAAQ,IAAC,OAAO,kBACf,KAAC,aAAa,IAAC,IAAI,EAAE,IAAI,YAAG,KAAK,GAAiB,GACzC,CACZ,CAAC,CAAC,CAAC,CACF,KAAK,CACN,GACS,EAEZ,aAAG,SAAS,EAAC,6BAA6B,aACxC,gBAAM,SAAS,EAAC,0BAA0B,aACvC,QAAQ,IAAI,KAAC,IAAI,IAAC,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAC,IAAI,EAAC,UAAU,SAAG,EAC3D,IAAI,EACJ,WAAW,IAAI,CACd,gBAAM,SAAS,EAAC,4BAA4B,aACzC,GAAG,EACJ,8BAAkB,MAAM,uBAAS,OAAE,WAAW,IACzC,CACR,IACI,EACN,KAAK,GAAG,CAAC,IAAI,CACZ,gBAAM,SAAS,EAAC,4BAA4B,aAC1C,eAAM,SAAS,EAAC,kCAAkC,2BAAkB,OAAE,SAAS,EAAE,GAAG,SAChF,KAAK,IACJ,CACR,EACA,UAAU,IAAI,CACb,gBAAM,SAAS,EAAC,4BAA4B,aAC1C,eAAM,SAAS,EAAC,kCAAkC,wBAAe,OAAE,UAAU,IACxE,CACR,IACC,IACA,EAEN,KAAC,cAAc,IACb,SAAS,EAAC,gCAAgC,EAC1C,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,oBAAoB,GAChC,EAEF,KAAC,cAAc,IACb,SAAS,EAAC,4BAA4B,EACtC,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,EAC9B,SAAS,EAAE,mBAAmB,EAC9B,aAAa,EAAE,uBAAuB,GACtC,IACE,GACD,EACN,QAAQ,IACN,CACN,CAAC;AACJ,CAAC"}

package/dist/goal-list-item/index.d.ts

@@ -0,0 +1,3 @@
+export type { GoalListItemProps } from './goal-list-item';
+export { GoalListItem } from './goal-list-item';
+//# sourceMappingURL=index.d.ts.map

package/dist/goal-list-item/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/goal-list-item/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/goal-list-item/index.js

@@ -0,0 +1,2 @@
+export { GoalListItem } from './goal-list-item';
+//# sourceMappingURL=index.js.map

package/dist/goal-list-item/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/goal-list-item/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC"}

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

@@ -0,0 +1,58 @@
+@layer components {
+  /*
+   * A bare button around the plain status badge. The badge keeps its own look;
+   * the button adds only what says "this opens something": the chevron, a fill
+   * on hover, and the focus ring.
+   */
+  /*
+   * The trigger raises itself above a host card's stretched link (ui-core's
+   * CardLink), so it keeps its own clicks wherever it sits. Only the trigger:
+   * the static badge stays under the link, so a click on it opens the goal
+   * like the rest of the card. 1 is the `raised` stacking layer
+   * (ds-config/scripts/stacking.ts).
+   */
+  .mui-goal-status-menu {
+    position: relative;
+    z-index: 1;
+    display: inline-flex;
+    align-items: center;
+    flex-shrink: 0;
+    gap: var(--semantic-space-gap-tight);
+    margin: 0;
+    padding: 0 var(--semantic-space-gap-tight);
+    border: 0;
+    border-radius: var(--semantic-radius-interactive);
+    background-color: transparent;
+    color: inherit;
+    font: inherit;
+    cursor: pointer;
+    transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
+
+    &:hover,
+    &[data-state="open"] {
+      background-color: var(--semantic-color-surface-muted);
+    }
+
+    &:focus-visible {
+      outline: 2px solid var(--semantic-color-focus-ring);
+      outline-offset: 3px;
+    }
+
+    & .mui-goal-status-menu__indicator {
+      color: var(--semantic-color-text-muted);
+      transform: rotate(90deg);
+      transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
+    }
+
+    &[data-state="open"] .mui-goal-status-menu__indicator {
+      transform: rotate(-90deg);
+    }
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .mui-goal-status-menu,
+  .mui-goal-status-menu .mui-goal-status-menu__indicator {
+    transition: none;
+  }
+}

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

@@ -0,0 +1,2 @@
+/* AUTOGENERATED: types for the stylesheet beside it. */
+export {};

package/dist/goal-status-menu/goal-status-menu.d.ts

@@ -0,0 +1,54 @@
+import { type IconSource } from '@manakind/ui-core';
+import './goal-status-menu.css';
+/** A Manuia goal's progress states, in the order a goal moves through them. */
+export declare const GOAL_STATUSES: readonly ["Not Started", "In Progress", "Completed"];
+export type GoalStatus = (typeof GOAL_STATUSES)[number];
+export interface GoalStatusMenuProps {
+    /** The goal's current status, shown as a badge. */
+    status: GoalStatus;
+    /**
+     * Glyph for the current status, supplied by the product so this package
+     * never imports an icon set. Pass one whose outline differs per status:
+     * a host may hide the badge's text through `labelClassName`, and the
+     * glyph is what is left.
+     */
+    statusIcon?: IconSource;
+    /**
+     * Called with the newly chosen status. When set, the badge becomes a
+     * button that opens a menu of the three statuses, the current one checked.
+     * Choosing the current status again closes the menu without calling this.
+     * Without it the badge is a plain, non-interactive status.
+     */
+    onStatusChange?: (status: GoalStatus) => void;
+    /**
+     * Glyph after the badge saying it opens a menu. Must point RIGHT, as
+     * Select's indicator does: it is turned down while closed and up while
+     * open, because the product's icon set has no down or up chevron.
+     * Defaults to a plain built-in chevron.
+     */
+    indicator?: IconSource;
+    /** Glyph marking the current status in the menu. Defaults to Menu's built-in check. */
+    itemIndicator?: IconSource;
+    /**
+     * A class for the badge's text, so a host can hide it when space runs out
+     * (GoalCard does, from a container query). The badge keeps its status as
+     * its accessible name, and the trigger keeps its own, so nothing is lost.
+     */
+    labelClassName?: string;
+    /** Extra class names on the outermost element: the trigger, or the badge when static. */
+    className?: string;
+}
+/**
+ * A goal's status badge which, given `onStatusChange`, opens a menu to change
+ * the status in place.
+ *
+ * Shared by `GoalCard` and `GoalListItem`. Inside a card or row that links to
+ * the goal, the trigger sits above the stretched link, so it keeps its own
+ * clicks and its own place in the tab order. The static badge does not: a
+ * click on it opens the goal like the rest of the card.
+ *
+ * The trigger is named "Status: In Progress. Change status": the current
+ * status and what pressing it does, which also names the menu it opens.
+ */
+export declare function GoalStatusMenu({ status, statusIcon, onStatusChange, indicator, itemIndicator, labelClassName, className, }: GoalStatusMenuProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=goal-status-menu.d.ts.map

package/dist/goal-status-menu/goal-status-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"goal-status-menu.d.ts","sourceRoot":"","sources":["../../src/goal-status-menu/goal-status-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,UAAU,EAGhB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,wBAAwB,CAAC;AAEhC,+EAA+E;AAC/E,eAAO,MAAM,aAAa,sDAAuD,CAAC;AAElF,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,CAAC,CAAC;AAaxD,MAAM,WAAW,mBAAmB;IAClC,mDAAmD;IACnD,MAAM,EAAE,UAAU,CAAC;IACnB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IAC9C;;;;;OAKG;IACH,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,uFAAuF;IACvF,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,yFAAyF;IACzF,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,UAAU,EACV,cAAc,EACd,SAAgC,EAChC,aAAa,EACb,cAAc,EACd,SAAS,GACV,EAAE,mBAAmB,2CAwCrB"}

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

@@ -0,0 +1,33 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge, cx, FallbackChevronRight, Icon, Menu, } from '@manakind/ui-core';
+import './goal-status-menu.css';
+/** A Manuia goal's progress states, in the order a goal moves through them. */
+export const GOAL_STATUSES = ['Not Started', 'In Progress', 'Completed'];
+const STATUS_VARIANT = {
+    'Not Started': 'muted',
+    'In Progress': 'info',
+    Completed: 'success',
+};
+const STATUS_ITEMS = GOAL_STATUSES.map((status) => ({
+    value: status,
+    label: status,
+}));
+/**
+ * A goal's status badge which, given `onStatusChange`, opens a menu to change
+ * the status in place.
+ *
+ * Shared by `GoalCard` and `GoalListItem`. Inside a card or row that links to
+ * the goal, the trigger sits above the stretched link, so it keeps its own
+ * clicks and its own place in the tab order. The static badge does not: a
+ * click on it opens the goal like the rest of the card.
+ *
+ * The trigger is named "Status: In Progress. Change status": the current
+ * 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 }));
+    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" })] }) }));
+}
+//# sourceMappingURL=goal-status-menu.js.map

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

@@ -0,0 +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"}

package/dist/goal-status-menu/index.d.ts

@@ -0,0 +1,3 @@
+export type { GoalStatus, GoalStatusMenuProps } from './goal-status-menu';
+export { GoalStatusMenu } from './goal-status-menu';
+//# sourceMappingURL=index.d.ts.map

package/dist/goal-status-menu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/goal-status-menu/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAC1E,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC"}

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

@@ -0,0 +1,2 @@
+export { GoalStatusMenu } from './goal-status-menu';
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/goal-status-menu/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/index.d.ts

@@ -12,5 +12,8 @@ export * from '@manakind/ui-core';
 export * from './category-card';
 export * from './goal-card';
 export * from './goal-categories';
+export * from './goal-list';
+export * from './goal-list-item';
+export * from './goal-status-menu';
 export * from './goal-tab-trigger';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC"}

package/dist/index.js

@@ -12,5 +12,8 @@ export * from '@manakind/ui-core';
 export * from './category-card';
 export * from './goal-card';
 export * from './goal-categories';
+export * from './goal-list';
+export * from './goal-list-item';
+export * from './goal-status-menu';
 export * from './goal-tab-trigger';
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC"}

package/package.json

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