@urbicon-ui/blocks 6.9.0 → 6.11.0

package/dist/primitives/JourneyTimeline/journey-timeline.variants.js

@@ -1,95 +1,150 @@
 import { tv } from '../../utils/variants.js';
 export const journeyTimelineVariants = tv({
     slots: {
-        // Root wrapper. Always a <div> so the same element hosts the marker rail
-        // AND (horizontal only) the shared detail panel beneath it. The last node's
-        // connector is hidden in both orientations — nothing to connect onward to.
-        base: 'w-full [&_[data-journey-node]:last-child_[data-journey-connector]]:hidden',
+        // Root wrapper. Hosts the rail and — in panel mode — the shared readout.
+        base: 'w-full',
         // The ordered list of nodes. `flex-col` vertical, `flex-row` horizontal.
         rail: 'flex list-none m-0 p-0',
-        // A single node <li>.
+        // A single node <li>. Vertical: grid of [meta?] [marker column] [content];
+        // horizontal: flex row of trigger + connector group.
         node: 'group/node',
-        // The interactive header — marker + title/subtitle. A <button> for focusable
-        // nodes, a plain <div> for pure waypoints (focusable === false).
-        trigger: [
-            'flex items-center text-left w-full bg-transparent border-0 appearance-none p-1 -m-1',
-            'rounded-contain',
-            'transition-[color,background-color] duration-[var(--blocks-duration-fast)]',
-            'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50 focus-visible:ring-offset-2 focus-visible:ring-offset-surface-base'
+        // Chronicle-axis column (vertical): right-aligned, tabular — times, dates,
+        // versions. Rendered only when any node provides `meta` (or a meta snippet).
+        metaColumn: 'shrink-0 text-right',
+        meta: [
+            'font-mono tabular-nums leading-tight text-text-tertiary',
+            'transition-colors duration-[var(--blocks-duration-fast)]'
         ],
-        // The status-coloured circle.
+        // The spine: marker + connector line. Vertical: a narrow column the line
+        // grows down inside; horizontal: a full-width row the line grows right in.
+        markerColumn: 'flex items-center',
+        // The status dot. Deliberately small — the line is the protagonist, the
+        // dots are punctuation (contrast: Stepper's large glyph discs). The grid
+        // centring only matters when a `marker` snippet puts a glyph inside.
         marker: [
-            'flex items-center justify-center shrink-0 font-semibold rounded-commit border-2 box-border',
-            'transition-[color,background-color,border-color,box-shadow] duration-[var(--blocks-duration-fast)]'
+            'box-border grid shrink-0 place-items-center rounded-commit border-2',
+            'transition-[background-color,border-color,box-shadow] duration-[var(--blocks-duration-fast)]'
         ],
-        // Column (marker width) that carries the vertical connector below a marker.
-        // `flex-col` is essential: it makes the connector's `flex-1` grow *down* the
-        // column (a thin vertical line) instead of *across* it (a fat block).
-        connectorColumn: 'flex flex-col shrink-0 items-center',
-        // The connecting line between markers.
+        // The connecting line. Drawn with borders so `connectorStyle` can switch
+        // solid/dashed/dotted — the connector carries meaning, not just geometry.
         connector: [
-            'bg-border-subtle',
-            'transition-[background-color] duration-[var(--blocks-duration-normal)]'
+            'border-border-default',
+            'transition-[border-color] duration-[var(--blocks-duration-normal)]'
+        ],
+        // Content cell (vertical): card + segment label.
+        content: 'min-w-0',
+        // The focus surface around header + inline detail. Transparent at rest,
+        // elevated card when focused inline, selected tint when focused in panel
+        // mode — never a bare full-width grey block.
+        card: [
+            'rounded-contain border border-transparent',
+            'transition-[background-color,border-color,box-shadow] duration-[var(--blocks-duration-normal)] ease-[var(--blocks-ease-gentle)]'
+        ],
+        // Header row: the trigger plus the optional trailing area. Keeping
+        // `trailing` a *sibling* of the button (never a child) keeps interactive
+        // trailing content valid HTML and off the activation target.
+        header: 'flex',
+        // The interactive header — title + subtitle. A <button> for focusable
+        // nodes, a plain <div> for pure waypoints (focusable === false).
+        trigger: [
+            'flex appearance-none flex-col items-start gap-0.5 border-0 bg-transparent p-0 text-left',
+            'rounded-contain',
+            'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50 focus-visible:ring-offset-2 focus-visible:ring-offset-surface-base'
         ],
-        // Title + subtitle wrapper.
-        labelGroup: 'flex flex-col min-w-0',
+        // End-of-row content (badges, help, quick actions) beside the trigger.
+        trailing: 'flex shrink-0 items-center gap-1',
+        labelGroup: 'flex min-w-0 flex-col',
         title: [
-            'font-medium leading-tight truncate',
+            'font-medium leading-tight',
             'transition-colors duration-[var(--blocks-duration-fast)]'
         ],
-        subtitle: 'text-text-tertiary leading-tight mt-0.5 truncate',
-        // Lower row (vertical only): connector column + inline detail region.
-        body: 'flex',
+        subtitle: 'text-text-tertiary leading-tight mt-0.5',
+        // Label for the stretch between two nodes (duration, transport, gap…).
+        segment: 'text-text-quaternary leading-tight',
         // Grid-rows collapse wrapper (0fr → 1fr). Reduced-motion safe: the duration
         // token collapses to 1ms under prefers-reduced-motion (interaction.css).
         detail: [
             'grid',
             'transition-[grid-template-rows] duration-[var(--blocks-duration-normal)] ease-[var(--blocks-ease-smooth)]'
         ],
-        detailInner: 'overflow-hidden min-h-0',
+        detailInner: 'min-h-0 overflow-hidden',
         detailContent: 'text-text-secondary',
-        // Shared detail panel (horizontal only) rendered beneath the rail.
-        panel: 'text-text-secondary border border-border-subtle rounded-contain bg-surface-quiet'
+        // The stable readout (detail="panel" and every horizontal timeline).
+        panel: [
+            'text-text-secondary border border-border-default bg-surface-elevated rounded-contain',
+            'shadow-[var(--blocks-shadow-md)]'
+        ]
     },
     variants: {
         orientation: {
             vertical: {
-                rail: 'flex-col'
+                rail: 'flex-col',
+                node: 'grid',
+                markerColumn: 'flex-col',
+                connector: 'my-1 w-0 min-h-3 flex-1 border-l-2',
+                header: 'items-start gap-x-3',
+                trigger: 'min-w-0 flex-1',
+                trailing: 'ml-auto',
+                segment: 'flex items-center'
             },
             horizontal: {
-                // Column layout so the shared detail panel sits below the rail.
+                // Column layout so the shared panel sits below the rail.
                 base: 'flex flex-col',
                 rail: 'flex-row items-start',
-                // Each node grows to spread markers evenly; the last one hugs its content.
-                node: 'flex items-center [&:not(:last-child)]:flex-1',
-                // Compact header (marker + label side by side) so the connector can grow.
-                trigger: 'w-auto shrink-0'
+                // Stacked station: meta row above the spine, label pill below. Every
+                // node but the last stretches so the spine distributes the stations.
+                node: 'flex flex-col [&:not(:last-child)]:flex-1',
+                // Visual order is meta → spine → header, but the DOM keeps the header
+                // before the spine so a segment label is read *after* its node.
+                metaColumn: 'order-1 text-left',
+                markerColumn: 'order-2 w-full flex-row',
+                header: 'order-3 items-center gap-x-1.5 self-start',
+                // Shrink-to-fit pill around the labels only — the marker sits on the
+                // spine above, so the whole rail reads as stations on one line.
+                trigger: 'w-auto',
+                connector: 'h-0 min-w-3 flex-1 border-t-2',
+                // Segment labels sit *in* the line (line — label — line); they widen
+                // the gap instead of overlapping the next station's marker.
+                segment: 'shrink-0 whitespace-nowrap',
+                panel: 'mt-4 w-full'
             }
         },
         size: {
             sm: {
-                marker: 'size-7 text-xs',
-                connectorColumn: 'w-7',
-                trigger: 'gap-2',
+                meta: 'text-[11px]',
+                marker: 'size-2.5',
+                node: 'gap-x-2.5',
+                card: '-mx-1.5 px-1.5 py-1.5',
                 title: 'text-xs',
                 subtitle: 'text-[11px]',
-                detailContent: 'text-sm pl-2'
+                segment: 'text-[11px]',
+                content: 'pb-4',
+                detailContent: 'text-xs pt-2',
+                panel: 'p-3 text-xs'
             },
             md: {
-                marker: 'size-9 text-sm',
-                connectorColumn: 'w-9',
-                trigger: 'gap-2.5',
+                meta: 'text-xs',
+                marker: 'size-3',
+                node: 'gap-x-3',
+                card: '-mx-2 px-2 py-2',
                 title: 'text-sm',
                 subtitle: 'text-xs',
-                detailContent: 'text-sm pl-2.5'
+                segment: 'text-xs',
+                content: 'pb-5',
+                detailContent: 'text-sm pt-2.5',
+                panel: 'p-4 text-sm'
             },
             lg: {
-                marker: 'size-11 text-base',
-                connectorColumn: 'w-11',
-                trigger: 'gap-3',
+                meta: 'text-sm',
+                marker: 'size-3.5',
+                node: 'gap-x-3.5',
+                card: '-mx-2.5 px-2.5 py-2.5',
                 title: 'text-base',
                 subtitle: 'text-sm',
-                detailContent: 'text-base pl-3'
+                segment: 'text-sm',
+                content: 'pb-6',
+                detailContent: 'text-base pt-3',
+                panel: 'p-5 text-base'
             }
         },
         // Marker colour + title tone per journey status. Mirrors the semantic intent
@@ -97,71 +152,184 @@ export const journeyTimelineVariants = tv({
         // Progress and Stepper.
         status: {
             complete: {
-                marker: 'border-success bg-success text-text-on-primary'
+                marker: 'bg-success border-success',
+                title: 'text-text-primary'
             },
             active: {
-                marker: 'border-primary bg-primary text-text-on-primary shadow-[var(--blocks-shadow-sm)]',
+                marker: 'bg-primary border-primary ring-4 ring-primary/15',
                 title: 'text-text-primary'
             },
             pending: {
-                marker: 'border-border-default bg-surface-base text-text-tertiary'
+                marker: 'bg-surface-base border-border-strong',
+                title: 'text-text-secondary'
+            },
+            // Worth a look, does not block — hollow like pending but on the warning
+            // token, mirroring Stepper's per-step warning state.
+            attention: {
+                marker: 'bg-surface-base border-warning',
+                title: 'text-warning-emphasis'
             },
             blocked: {
-                marker: 'border-danger bg-danger text-text-on-primary',
+                marker: 'bg-danger border-danger',
                 title: 'text-danger'
             },
             skipped: {
-                marker: 'border-border-subtle bg-surface-subtle text-text-tertiary opacity-70',
+                marker: 'bg-surface-subtle border-border-subtle opacity-80',
                 title: 'text-text-tertiary'
             }
         },
-        // The currently expanded node. Distinct from DOM focus (focus-visible ring).
+        // The currently focused node. Distinct from DOM focus (focus-visible ring).
         focused: {
             true: {
-                trigger: 'bg-surface-subtle',
-                title: 'text-text-primary font-semibold'
+                meta: 'text-text-primary',
+                title: 'font-semibold text-text-primary'
             },
             false: {}
         },
         // Focusable nodes react to hover + show a pointer; pure waypoints do not.
         interactive: {
             true: {
-                trigger: 'cursor-pointer hover:bg-surface-hover'
+                trigger: 'cursor-pointer'
             },
             false: {
                 trigger: 'cursor-default'
             }
         },
-        // The connector segment leading out of a completed node reads as "travelled".
-        connectorComplete: {
+        // The connector leaving a completed node reads as "travelled".
+        travelled: {
             true: {
-                connector: 'bg-success'
+                connector: 'border-success'
             },
             false: {}
+        },
+        // Per-node line style — solid ride, dashed/dotted transfer or gap.
+        connectorStyle: {
+            solid: { connector: 'border-solid' },
+            dashed: { connector: 'border-dashed' },
+            dotted: { connector: 'border-dotted' }
+        },
+        // Where the focused detail lives (vertical only; horizontal is always panel).
+        detail: {
+            inline: {},
+            panel: {}
+        },
+        // Whether the chronicle axis (meta rail) is rendered — adds the grid column.
+        withMeta: {
+            true: { node: 'grid-cols-[auto_auto_minmax(0,1fr)]' },
+            false: { node: 'grid-cols-[auto_minmax(0,1fr)]' }
         }
     },
     compoundVariants: [
-        // Vertical connector geometry: a thin line that grows down the marker column.
+        // Size geometry that only applies to one orientation. Vertical: fixed
+        // meta/marker column widths + baseline offsets that align dot and title;
+        // horizontal: spine gaps + the label pill's optical left edge (-mx
+        // compensates px so title, marker and meta share one left line).
+        {
+            orientation: 'vertical',
+            size: 'sm',
+            class: {
+                metaColumn: 'w-10 pt-1.5',
+                markerColumn: 'w-3.5',
+                marker: 'mt-2',
+                segment: 'mt-1.5 gap-1'
+            }
+        },
         {
             orientation: 'vertical',
+            size: 'md',
             class: {
-                connector: 'w-0.5 flex-1 my-1 min-h-4 rounded-commit'
+                metaColumn: 'w-12 pt-2',
+                markerColumn: 'w-4',
+                marker: 'mt-2.5',
+                segment: 'mt-2 gap-1.5'
             }
         },
-        // Horizontal connector geometry: a thin line filling the gap to the next marker.
+        {
+            orientation: 'vertical',
+            size: 'lg',
+            class: {
+                metaColumn: 'w-14 pt-2.5',
+                markerColumn: 'w-5',
+                marker: 'mt-3',
+                segment: 'mt-2.5 gap-2'
+            }
+        },
+        // The fixed spine height keeps every marker on one line whether or not the
+        // station's outgoing segment carries a (taller) text label. The metaColumn
+        // min-height is the same guarantee for the chronicle row: it holds even
+        // when a consumer `meta` snippet renders nothing for some stations.
         {
             orientation: 'horizontal',
+            size: 'sm',
             class: {
-                connector: 'h-0.5 flex-1 mx-2 self-center rounded-commit'
+                node: 'gap-y-0.5',
+                metaColumn: 'min-h-3.5',
+                markerColumn: 'h-4 gap-1 pr-1',
+                trigger: '-ml-1.5 px-1.5 py-1'
             }
         },
-        // A focused pure waypoint keeps a bold title but gains no hover surface.
         {
-            interactive: false,
+            orientation: 'horizontal',
+            size: 'md',
+            class: {
+                node: 'gap-y-1',
+                metaColumn: 'min-h-4',
+                markerColumn: 'h-4 gap-1.5 pr-1.5',
+                trigger: '-ml-2 px-2 py-1.5'
+            }
+        },
+        {
+            orientation: 'horizontal',
+            size: 'lg',
+            class: {
+                node: 'gap-y-1',
+                metaColumn: 'min-h-4.5',
+                markerColumn: 'h-5 gap-2 pr-2',
+                trigger: '-ml-2.5 px-2.5 py-2'
+            }
+        },
+        // Vertical + panel: two-column layout on wide viewports; on narrow ones the
+        // readout docks to the viewport bottom while the rail scrolls behind it.
+        {
+            orientation: 'vertical',
+            detail: 'panel',
+            class: {
+                base: 'sm:grid sm:grid-cols-[minmax(0,1fr)_minmax(16rem,20rem)] sm:items-start sm:gap-x-6',
+                panel: 'max-sm:sticky max-sm:bottom-4 max-sm:z-[var(--z-docked)] max-sm:mt-4 sm:sticky sm:top-4'
+            }
+        },
+        // Focused inline node: the elevated card — the focus IS a surface change,
+        // not a grey backdrop.
+        {
+            detail: 'inline',
+            focused: true,
+            class: {
+                card: 'border-border-default bg-surface-elevated shadow-[var(--blocks-shadow-md)]'
+            }
+        },
+        // Focused row while the detail lives in the panel: quiet selected tint.
+        {
+            orientation: 'vertical',
+            detail: 'panel',
             focused: true,
             class: {
-                trigger: 'bg-transparent'
+                card: 'bg-surface-selected'
             }
+        },
+        { orientation: 'horizontal', focused: true, class: { trigger: 'bg-surface-selected' } },
+        // Hover affordance only on non-focused interactive nodes (a focused inline
+        // card must not flicker back to the hover tint).
+        {
+            orientation: 'vertical',
+            interactive: true,
+            focused: false,
+            class: { card: 'hover:bg-surface-hover' }
+        },
+        {
+            orientation: 'horizontal',
+            interactive: true,
+            focused: false,
+            class: { trigger: 'hover:bg-surface-hover' }
         }
     ],
     defaultVariants: {
@@ -170,6 +338,9 @@ export const journeyTimelineVariants = tv({
         status: 'pending',
         focused: false,
         interactive: true,
-        connectorComplete: false
+        travelled: false,
+        connectorStyle: 'solid',
+        detail: 'inline',
+        withMeta: false
     }
 });

package/dist/primitives/Tab/tab.variants.d.ts

@@ -62,7 +62,7 @@ export declare const tabVariants: (props?: import("../../utils/variants.js").TVP
     };
 }> | undefined) => {
     base: (props?: ({
-        variant?: "line" | "pills" | "enclosed" | "solid" | undefined;
+        variant?: "line" | "solid" | "pills" | "enclosed" | undefined;
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
         fullWidth?: boolean | undefined;
@@ -72,7 +72,7 @@ export declare const tabVariants: (props?: import("../../utils/variants.js").TVP
         className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
     }) | undefined) => string;
     list: (props?: ({
-        variant?: "line" | "pills" | "enclosed" | "solid" | undefined;
+        variant?: "line" | "solid" | "pills" | "enclosed" | undefined;
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
         fullWidth?: boolean | undefined;
@@ -82,7 +82,7 @@ export declare const tabVariants: (props?: import("../../utils/variants.js").TVP
         className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
     }) | undefined) => string;
     trigger: (props?: ({
-        variant?: "line" | "pills" | "enclosed" | "solid" | undefined;
+        variant?: "line" | "solid" | "pills" | "enclosed" | undefined;
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
         fullWidth?: boolean | undefined;
@@ -92,7 +92,7 @@ export declare const tabVariants: (props?: import("../../utils/variants.js").TVP
         className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
     }) | undefined) => string;
     icon: (props?: ({
-        variant?: "line" | "pills" | "enclosed" | "solid" | undefined;
+        variant?: "line" | "solid" | "pills" | "enclosed" | undefined;
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
         fullWidth?: boolean | undefined;
@@ -102,7 +102,7 @@ export declare const tabVariants: (props?: import("../../utils/variants.js").TVP
         className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
     }) | undefined) => string;
     label: (props?: ({
-        variant?: "line" | "pills" | "enclosed" | "solid" | undefined;
+        variant?: "line" | "solid" | "pills" | "enclosed" | undefined;
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
         fullWidth?: boolean | undefined;
@@ -112,7 +112,7 @@ export declare const tabVariants: (props?: import("../../utils/variants.js").TVP
         className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
     }) | undefined) => string;
     badge: (props?: ({
-        variant?: "line" | "pills" | "enclosed" | "solid" | undefined;
+        variant?: "line" | "solid" | "pills" | "enclosed" | undefined;
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
         fullWidth?: boolean | undefined;
@@ -122,7 +122,7 @@ export declare const tabVariants: (props?: import("../../utils/variants.js").TVP
         className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
     }) | undefined) => string;
     panel: (props?: ({
-        variant?: "line" | "pills" | "enclosed" | "solid" | undefined;
+        variant?: "line" | "solid" | "pills" | "enclosed" | undefined;
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
         fullWidth?: boolean | undefined;
@@ -132,7 +132,7 @@ export declare const tabVariants: (props?: import("../../utils/variants.js").TVP
         className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
     }) | undefined) => string;
     indicator: (props?: ({
-        variant?: "line" | "pills" | "enclosed" | "solid" | undefined;
+        variant?: "line" | "solid" | "pills" | "enclosed" | undefined;
         orientation?: "horizontal" | "vertical" | undefined;
         size?: "sm" | "md" | "lg" | undefined;
         fullWidth?: boolean | undefined;

package/dist/translations/de.d.ts

@@ -135,6 +135,7 @@ declare const _default: {
             readonly complete: "Abgeschlossen";
             readonly active: "In Bearbeitung";
             readonly pending: "Ausstehend";
+            readonly attention: "Aufmerksamkeit erforderlich";
             readonly blocked: "Blockiert";
             readonly skipped: "Übersprungen";
         };

package/dist/translations/de.js

@@ -135,6 +135,7 @@ export default {
             complete: 'Abgeschlossen',
             active: 'In Bearbeitung',
             pending: 'Ausstehend',
+            attention: 'Aufmerksamkeit erforderlich',
             blocked: 'Blockiert',
             skipped: 'Übersprungen'
         }

package/dist/translations/en.d.ts

@@ -135,6 +135,7 @@ declare const _default: {
             readonly complete: "Completed";
             readonly active: "In progress";
             readonly pending: "Pending";
+            readonly attention: "Needs attention";
             readonly blocked: "Blocked";
             readonly skipped: "Skipped";
         };

package/dist/translations/en.js

@@ -135,6 +135,7 @@ export default {
             complete: 'Completed',
             active: 'In progress',
             pending: 'Pending',
+            attention: 'Needs attention',
             blocked: 'Blocked',
             skipped: 'Skipped'
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@urbicon-ui/blocks",
-  "version": "6.9.0",
+  "version": "6.11.0",
   "description": "Svelte 5 UI component library with Tailwind CSS 4, OKLCH design tokens and zero runtime dependencies",
   "license": "MIT",
   "repository": {
@@ -91,8 +91,8 @@
     "@sveltejs/package": "^2.5.8",
     "@sveltejs/vite-plugin-svelte": "^7.0.0",
     "@tailwindcss/vite": "^4.3.1",
-    "@urbicon-ui/i18n": "6.9.0",
-    "@urbicon-ui/shared-types": "6.9.0",
+    "@urbicon-ui/i18n": "6.11.0",
+    "@urbicon-ui/shared-types": "6.11.0",
     "prettier": "^3.8.4",
     "prettier-plugin-svelte": "^4.1.1",
     "prettier-plugin-tailwindcss": "^0.8.0",