@common-origin/design-system 3.0.0 → 3.1.0

package/dist/styles/icons.json

@@ -374,7 +374,6 @@
 		"aliases": [
 			"hamburger",
 			"nav",
-			"sidebar",
 			"navigation"
 		],
 		"intent": "Use to open a navigation menu or sidebar",
@@ -908,5 +907,35 @@
 		"intent": "Use for the cancelled status: stopped on purpose (decision 0045). Neutral colour, with a label",
 		"decorativeDefault": false,
 		"ariaLabelDefault": "Cancelled"
+	},
+	"home": {
+		"path": "M12 2.7L21 10.3V21H3V10.3Z M12 5.32L5 11.23V19H19V11.23Z M9 13H15V19H13V15H11V19H9Z",
+		"name": "home",
+		"description": "House outline with a door",
+		"category": "navigation",
+		"aliases": [
+			"house",
+			"dashboard",
+			"main",
+			"homepage"
+		],
+		"intent": "Use for a link to the product's home or start page",
+		"decorativeDefault": false,
+		"ariaLabelDefault": "Home"
+	},
+	"sidebar": {
+		"path": "M14 2C17.7712 2 19.6566 2.0003 20.8281 3.17188C21.9997 4.34345 22 6.22876 22 10V14C22 17.7712 21.9997 19.6566 20.8281 20.8281C19.803 21.8533 18.2315 21.982 15.3281 21.998L14 22H10L8.67188 21.998C5.8719 21.9826 4.31033 21.8625 3.2832 20.9346L3.17188 20.8281C2.14675 19.803 2.01797 18.2315 2.00195 15.3281L2 14V10C2 6.34627 2 4.46248 3.06543 3.2832L3.17188 3.17188C4.34345 2.0003 6.22876 2 10 2H14Z M10 4C8.05784 4 6.80197 4.00454 5.87695 4.12891C5.00986 4.24554 4.73816 4.43372 4.58594 4.58594C4.43372 4.73816 4.24554 5.00986 4.12891 5.87695C4.00454 6.80197 4 8.05784 4 10V14C4 15.9422 4.00454 17.198 4.12891 18.123C4.24554 18.9901 4.43372 19.2618 4.58594 19.4141C4.73816 19.5663 5.00986 19.7545 5.87695 19.8711C6.80197 19.9955 8.05784 20 10 20H14C15.9422 20 17.198 19.9955 18.123 19.8711C18.9901 19.7545 19.2618 19.5663 19.4141 19.4141C19.5663 19.2618 19.7545 18.9901 19.8711 18.123C19.9955 17.198 20 15.9422 20 14V10C20 8.05784 19.9955 6.80197 19.8711 5.87695C19.7545 5.00986 19.5663 4.73816 19.4141 4.58594C19.2618 4.43372 18.9901 4.24554 18.123 4.12891C17.198 4.00454 15.9422 4 14 4Z M8 4H10V20H8Z",
+		"name": "sidebar",
+		"description": "Rounded square with a narrow column on the left",
+		"category": "navigation",
+		"aliases": [
+			"panel",
+			"side-panel",
+			"drawer",
+			"rail"
+		],
+		"intent": "Use for a button that collapses or expands a sidebar",
+		"decorativeDefault": false,
+		"ariaLabelDefault": "Toggle sidebar"
 	}
 }

package/dist/styles/icons.json.mjs

@@ -359,7 +359,6 @@ var menu = {
 	aliases: [
 		"hamburger",
 		"nav",
-		"sidebar",
 		"navigation"
 	],
 	intent: "Use to open a navigation menu or sidebar",
@@ -894,6 +893,36 @@ var statusCancelled = {
 	decorativeDefault: false,
 	ariaLabelDefault: "Cancelled"
 };
+var home = {
+	path: "M12 2.7L21 10.3V21H3V10.3Z M12 5.32L5 11.23V19H19V11.23Z M9 13H15V19H13V15H11V19H9Z",
+	name: "home",
+	description: "House outline with a door",
+	category: "navigation",
+	aliases: [
+		"house",
+		"dashboard",
+		"main",
+		"homepage"
+	],
+	intent: "Use for a link to the product's home or start page",
+	decorativeDefault: false,
+	ariaLabelDefault: "Home"
+};
+var sidebar = {
+	path: "M14 2C17.7712 2 19.6566 2.0003 20.8281 3.17188C21.9997 4.34345 22 6.22876 22 10V14C22 17.7712 21.9997 19.6566 20.8281 20.8281C19.803 21.8533 18.2315 21.982 15.3281 21.998L14 22H10L8.67188 21.998C5.8719 21.9826 4.31033 21.8625 3.2832 20.9346L3.17188 20.8281C2.14675 19.803 2.01797 18.2315 2.00195 15.3281L2 14V10C2 6.34627 2 4.46248 3.06543 3.2832L3.17188 3.17188C4.34345 2.0003 6.22876 2 10 2H14Z M10 4C8.05784 4 6.80197 4.00454 5.87695 4.12891C5.00986 4.24554 4.73816 4.43372 4.58594 4.58594C4.43372 4.73816 4.24554 5.00986 4.12891 5.87695C4.00454 6.80197 4 8.05784 4 10V14C4 15.9422 4.00454 17.198 4.12891 18.123C4.24554 18.9901 4.43372 19.2618 4.58594 19.4141C4.73816 19.5663 5.00986 19.7545 5.87695 19.8711C6.80197 19.9955 8.05784 20 10 20H14C15.9422 20 17.198 19.9955 18.123 19.8711C18.9901 19.7545 19.2618 19.5663 19.4141 19.4141C19.5663 19.2618 19.7545 18.9901 19.8711 18.123C19.9955 17.198 20 15.9422 20 14V10C20 8.05784 19.9955 6.80197 19.8711 5.87695C19.7545 5.00986 19.5663 4.73816 19.4141 4.58594C19.2618 4.43372 18.9901 4.24554 18.123 4.12891C17.198 4.00454 15.9422 4 14 4Z M8 4H10V20H8Z",
+	name: "sidebar",
+	description: "Rounded square with a narrow column on the left",
+	category: "navigation",
+	aliases: [
+		"panel",
+		"side-panel",
+		"drawer",
+		"rail"
+	],
+	intent: "Use for a button that collapses or expands a sidebar",
+	decorativeDefault: false,
+	ariaLabelDefault: "Toggle sidebar"
+};
 var iconsJson = {
 	ai: ai,
 	add: add,
@@ -969,8 +998,10 @@ var iconsJson = {
 	statusPending: statusPending,
 	statusScheduled: statusScheduled,
 	statusNotStarted: statusNotStarted,
-	statusCancelled: statusCancelled
+	statusCancelled: statusCancelled,
+	home: home,
+	sidebar: sidebar
 };
 
-export { add, addRing, ai, arrowDown, arrowLeft, arrowRight, arrowUp, back, bell, cancel, caret, caretDown, caretUp, check, checkRing, close, copy, creditCard, crossCircle, iconsJson as default, directionRight, directionUp, edit, fileDocSearch, filter, info, kebab, lamp, lineOut, link, meatballs, menu, message, mic, move, order, paper, pause, play, playBack, refresh, remove, search, star, starFilled, statusCancelled, statusError, statusInProgress, statusInfo, statusNotStarted, statusPending, statusScheduled, statusSerious, statusSuccess, statusWarning, stop, table, trash, userBox, view, viewHide, wallet };
+export { add, addRing, ai, arrowDown, arrowLeft, arrowRight, arrowUp, back, bell, cancel, caret, caretDown, caretUp, check, checkRing, close, copy, creditCard, crossCircle, iconsJson as default, directionRight, directionUp, edit, fileDocSearch, filter, home, info, kebab, lamp, lineOut, link, meatballs, menu, message, mic, move, order, paper, pause, play, playBack, refresh, remove, search, sidebar, star, starFilled, statusCancelled, statusError, statusInProgress, statusInfo, statusNotStarted, statusPending, statusScheduled, statusSerious, statusSuccess, statusWarning, stop, table, trash, userBox, view, viewHide, wallet };
 //# sourceMappingURL=icons.json.mjs.map

package/dist/styles/icons.json.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"icons.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"icons.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/styles/tokens.d.mts

@@ -1212,9 +1212,13 @@ export type Tokens = {
                 };
             };
             title: {
-                /** Alert title style (h6), adjusted by title.fontWeight and title.lineHeight. */
+                /** Alert title style (h6), adjusted by title.lineHeight. */
                 typography: string;
-                /** Alert titles are semibold, heavier than h6's medium. */
+                /**
+                 * Alert title weight.
+                 *
+                 * @deprecated h6 is semibold since decision 0050, so the title takes its weight from title.typography. Use semantic.fontWeight.semibold. Removed in 4.0.
+                 */
                 fontWeight: string;
                 /** Alert titles use a tighter line height than h6. */
                 lineHeight: string;
@@ -1278,6 +1282,18 @@ export type Tokens = {
             /** Code line height. */
             lineHeight: string;
         };
+        sidebarNav: {
+            width: {
+                /** Width of a collapsed SidebarNav, the icon rail: the tallest dense row (size.row.sm, in comfortable) with an inset on each side. */
+                rail: string;
+                /** Width of an expanded SidebarNav with width="narrow": short labels. */
+                narrow: string;
+                /** Width of an expanded SidebarNav with the default width: labels with a trailing count. */
+                default: string;
+                /** Width of an expanded SidebarNav with width="wide": long titles, such as chat history. */
+                wide: string;
+            };
+        };
         slider: {
             thumb: {
                 shadow: {
@@ -1349,7 +1365,11 @@ export type Tokens = {
             };
         };
         transactionListItem: {
-            /** Minimum height of a TransactionListItem row, so rows line up in a list. */
+            /**
+             * Minimum height of a TransactionListItem row, so rows line up in a list.
+             *
+             * @deprecated Two-line rows share semantic.size.row.lg, which follows density (decision 0051). Removed in 4.0.
+             */
             minHeight: string;
         };
         status: {
@@ -1479,11 +1499,11 @@ export type Tokens = {
         fontWeight: {
             /** 400. Body text, captions, most UI text. */
             regular: string;
-            /** 500. Subheadings (h5, h6, subtitle), buttons, emphasis within UI text. */
+            /** 500. Subtitle, buttons, emphasis within UI text. */
             medium: string;
-            /** 600. Labels and short titles that need more weight than medium (label, Alert title). */
+            /** 600. Headings (h1 to h6), labels and short titles (label, Alert title). */
             semibold: string;
-            /** 700. Headings (display to h4), overline, strong indicators such as the required-field asterisk. */
+            /** 700. The display heading, overline, strong indicators such as the required-field asterisk. */
             bold: string;
         };
         border: {
@@ -1517,6 +1537,8 @@ export type Tokens = {
             '800': string;
             /** Size step for headers and indents, such as the AccountCard header. */
             '1200': string;
+            /** Size step for the collapsed SidebarNav rail: one icon row with an inset on each side. */
+            '1400': string;
             /** Size step for the comfortable ListItem expanded indent. */
             '1500': string;
             /** Size step for tall rows, such as the TransactionListItem minimum height. */
@@ -1529,7 +1551,11 @@ export type Tokens = {
             '4500': string;
             /** Size step for large illustrations, such as the large EmptyState image. */
             '5000': string;
-            /** Size step for narrow column widths: AccountCard, EmptyState actions. */
+            /** Size step for a narrow navigation column: the narrow SidebarNav. */
+            '5600': string;
+            /** Size step for a standard navigation column: the default SidebarNav. */
+            '6400': string;
+            /** Size step for narrow column widths: AccountCard, EmptyState actions, the wide SidebarNav, the widest a Tooltip grows. */
             '7500': string;
             /** Size step for readable text widths, such as EmptyState copy. */
             '9000': string;
@@ -1539,7 +1565,7 @@ export type Tokens = {
             '19200': string;
             /** Minimum pointer target for a control that's smaller to look at: its invisible hit area (WCAG 2.5.8, decision 0039). On touch screens, use touchTarget. */
             pointerTarget: string;
-            /** Minimum height of a tappable row or control on touch screens. */
+            /** Invisible hit area of a small control on touch screens, such as the Slider thumb. Not a row or control height: those follow density down to pointerTarget (decision 0051). */
             touchTarget: string;
             control: {
                 /** Minimum height of small controls: small Buttons and IconButtons, buttons inside fields (decision 0034). */
@@ -1549,6 +1575,14 @@ export type Tokens = {
                 /** Minimum height of large controls: text fields, Dropdown, SearchField, the default Button (decision 0034). */
                 lg: string;
             };
+            row: {
+                /** Minimum height of dense single-line rows: navigation items, menu items, dense table rows. Follows density down to the minimum pointer target (decision 0051). */
+                sm: string;
+                /** Minimum height of single-line list rows: ListItem and the rows built on it, such as ActionSheet actions and SearchField suggestions. Follows density (decision 0051). */
+                md: string;
+                /** Minimum height of two-line rows: TransactionListItem. Follows density (decision 0051). */
+                lg: string;
+            };
             overlay: {
                 /** Width of a small Modal, and the default width or height of a Sheet. */
                 sm: string;
@@ -1861,6 +1895,10 @@ export type Tokens = {
                 /** The default duration for state changes and short movements, such as a menu opening. */
                 moderate: string;
             };
+            delay: {
+                /** How long the pointer rests on a control before its Tooltip opens, so passing pointers don't open it. A wait before anything moves, not an animation duration. */
+                hint: string;
+            };
             easing: {
                 /** Easing for change on screen: something moving or resizing in place. */
                 standard: string;

package/dist/styles/tokens.d.ts

@@ -1212,9 +1212,13 @@ export type Tokens = {
                 };
             };
             title: {
-                /** Alert title style (h6), adjusted by title.fontWeight and title.lineHeight. */
+                /** Alert title style (h6), adjusted by title.lineHeight. */
                 typography: string;
-                /** Alert titles are semibold, heavier than h6's medium. */
+                /**
+                 * Alert title weight.
+                 *
+                 * @deprecated h6 is semibold since decision 0050, so the title takes its weight from title.typography. Use semantic.fontWeight.semibold. Removed in 4.0.
+                 */
                 fontWeight: string;
                 /** Alert titles use a tighter line height than h6. */
                 lineHeight: string;
@@ -1278,6 +1282,18 @@ export type Tokens = {
             /** Code line height. */
             lineHeight: string;
         };
+        sidebarNav: {
+            width: {
+                /** Width of a collapsed SidebarNav, the icon rail: the tallest dense row (size.row.sm, in comfortable) with an inset on each side. */
+                rail: string;
+                /** Width of an expanded SidebarNav with width="narrow": short labels. */
+                narrow: string;
+                /** Width of an expanded SidebarNav with the default width: labels with a trailing count. */
+                default: string;
+                /** Width of an expanded SidebarNav with width="wide": long titles, such as chat history. */
+                wide: string;
+            };
+        };
         slider: {
             thumb: {
                 shadow: {
@@ -1349,7 +1365,11 @@ export type Tokens = {
             };
         };
         transactionListItem: {
-            /** Minimum height of a TransactionListItem row, so rows line up in a list. */
+            /**
+             * Minimum height of a TransactionListItem row, so rows line up in a list.
+             *
+             * @deprecated Two-line rows share semantic.size.row.lg, which follows density (decision 0051). Removed in 4.0.
+             */
             minHeight: string;
         };
         status: {
@@ -1479,11 +1499,11 @@ export type Tokens = {
         fontWeight: {
             /** 400. Body text, captions, most UI text. */
             regular: string;
-            /** 500. Subheadings (h5, h6, subtitle), buttons, emphasis within UI text. */
+            /** 500. Subtitle, buttons, emphasis within UI text. */
             medium: string;
-            /** 600. Labels and short titles that need more weight than medium (label, Alert title). */
+            /** 600. Headings (h1 to h6), labels and short titles (label, Alert title). */
             semibold: string;
-            /** 700. Headings (display to h4), overline, strong indicators such as the required-field asterisk. */
+            /** 700. The display heading, overline, strong indicators such as the required-field asterisk. */
             bold: string;
         };
         border: {
@@ -1517,6 +1537,8 @@ export type Tokens = {
             '800': string;
             /** Size step for headers and indents, such as the AccountCard header. */
             '1200': string;
+            /** Size step for the collapsed SidebarNav rail: one icon row with an inset on each side. */
+            '1400': string;
             /** Size step for the comfortable ListItem expanded indent. */
             '1500': string;
             /** Size step for tall rows, such as the TransactionListItem minimum height. */
@@ -1529,7 +1551,11 @@ export type Tokens = {
             '4500': string;
             /** Size step for large illustrations, such as the large EmptyState image. */
             '5000': string;
-            /** Size step for narrow column widths: AccountCard, EmptyState actions. */
+            /** Size step for a narrow navigation column: the narrow SidebarNav. */
+            '5600': string;
+            /** Size step for a standard navigation column: the default SidebarNav. */
+            '6400': string;
+            /** Size step for narrow column widths: AccountCard, EmptyState actions, the wide SidebarNav, the widest a Tooltip grows. */
             '7500': string;
             /** Size step for readable text widths, such as EmptyState copy. */
             '9000': string;
@@ -1539,7 +1565,7 @@ export type Tokens = {
             '19200': string;
             /** Minimum pointer target for a control that's smaller to look at: its invisible hit area (WCAG 2.5.8, decision 0039). On touch screens, use touchTarget. */
             pointerTarget: string;
-            /** Minimum height of a tappable row or control on touch screens. */
+            /** Invisible hit area of a small control on touch screens, such as the Slider thumb. Not a row or control height: those follow density down to pointerTarget (decision 0051). */
             touchTarget: string;
             control: {
                 /** Minimum height of small controls: small Buttons and IconButtons, buttons inside fields (decision 0034). */
@@ -1549,6 +1575,14 @@ export type Tokens = {
                 /** Minimum height of large controls: text fields, Dropdown, SearchField, the default Button (decision 0034). */
                 lg: string;
             };
+            row: {
+                /** Minimum height of dense single-line rows: navigation items, menu items, dense table rows. Follows density down to the minimum pointer target (decision 0051). */
+                sm: string;
+                /** Minimum height of single-line list rows: ListItem and the rows built on it, such as ActionSheet actions and SearchField suggestions. Follows density (decision 0051). */
+                md: string;
+                /** Minimum height of two-line rows: TransactionListItem. Follows density (decision 0051). */
+                lg: string;
+            };
             overlay: {
                 /** Width of a small Modal, and the default width or height of a Sheet. */
                 sm: string;
@@ -1861,6 +1895,10 @@ export type Tokens = {
                 /** The default duration for state changes and short movements, such as a menu opening. */
                 moderate: string;
             };
+            delay: {
+                /** How long the pointer rests on a control before its Tooltip opens, so passing pointers don't open it. A wait before anything moves, not an animation duration. */
+                hint: string;
+            };
             easing: {
                 /** Easing for change on screen: something moving or resizing in place. */
                 standard: string;

package/dist/styles/tokens.json

@@ -786,7 +786,7 @@
         }
       },
       "title": {
-        "typography": "500 1.125rem/1.5rem 'Inter', sans-serif",
+        "typography": "600 1.125rem/1.5rem 'Inter', sans-serif",
         "fontWeight": "600",
         "lineHeight": "1.25rem"
       },
@@ -830,6 +830,14 @@
       "fontSize": "0.75rem",
       "lineHeight": "1.25rem"
     },
+    "sidebarNav": {
+      "width": {
+        "rail": "3.5rem",
+        "narrow": "14rem",
+        "default": "16rem",
+        "wide": "18.75rem"
+      }
+    },
     "slider": {
       "thumb": {
         "shadow": {
@@ -988,12 +996,15 @@
       "600": "1.5rem",
       "800": "2rem",
       "1200": "3rem",
+      "1400": "3.5rem",
       "1500": "3.75rem",
       "1800": "4.5rem",
       "2000": "5rem",
       "3000": "7.5rem",
       "4500": "11.25rem",
       "5000": "12.5rem",
+      "5600": "14rem",
+      "6400": "16rem",
       "7500": "18.75rem",
       "9000": "22.5rem",
       "10000": "25rem",
@@ -1005,6 +1016,11 @@
         "md": "2.5rem",
         "lg": "3rem"
       },
+      "row": {
+        "sm": "2rem",
+        "md": "3rem",
+        "lg": "4.5rem"
+      },
       "overlay": {
         "sm": "25rem",
         "md": "35rem",
@@ -1161,12 +1177,12 @@
     },
     "typography": {
       "display": "700 5rem/4.5rem 'Inter', sans-serif",
-      "h1": "700 3rem/3rem 'Inter', sans-serif",
-      "h2": "700 2rem/2.5rem 'Inter', sans-serif",
-      "h3": "700 1.75rem/2.25rem 'Inter', sans-serif",
-      "h4": "700 1.5rem/2rem 'Inter', sans-serif",
-      "h5": "500 1.25rem/1.75rem 'Inter', sans-serif",
-      "h6": "500 1.125rem/1.5rem 'Inter', sans-serif",
+      "h1": "600 3rem/3rem 'Inter', sans-serif",
+      "h2": "600 2rem/2.5rem 'Inter', sans-serif",
+      "h3": "600 1.75rem/2.25rem 'Inter', sans-serif",
+      "h4": "600 1.5rem/2rem 'Inter', sans-serif",
+      "h5": "600 1.25rem/1.75rem 'Inter', sans-serif",
+      "h6": "600 1.125rem/1.5rem 'Inter', sans-serif",
       "subtitle": "500 1rem/1.5rem 'Inter', sans-serif",
       "body": "400 1rem/1.5rem 'Inter', sans-serif",
       "small": "400 0.875rem/1.25rem 'Inter', sans-serif",
@@ -1181,6 +1197,9 @@
         "instant": "0ms",
         "moderate": "200ms"
       },
+      "delay": {
+        "hint": "500ms"
+      },
       "easing": {
         "standard": "ease-in-out",
         "decelerate": "ease-out",

package/dist/styles/tokens.json.mjs

@@ -785,7 +785,7 @@ var component = {
 			}
 		},
 		title: {
-			typography: "500 1.125rem/1.5rem 'Inter', sans-serif",
+			typography: "600 1.125rem/1.5rem 'Inter', sans-serif",
 			fontWeight: "600",
 			lineHeight: "1.25rem"
 		},
@@ -829,6 +829,14 @@ var component = {
 		fontSize: "0.75rem",
 		lineHeight: "1.25rem"
 	},
+	sidebarNav: {
+		width: {
+			rail: "3.5rem",
+			narrow: "14rem",
+			"default": "16rem",
+			wide: "18.75rem"
+		}
+	},
 	slider: {
 		thumb: {
 			shadow: {
@@ -987,12 +995,15 @@ var semantic = {
 		"600": "1.5rem",
 		"800": "2rem",
 		"1200": "3rem",
+		"1400": "3.5rem",
 		"1500": "3.75rem",
 		"1800": "4.5rem",
 		"2000": "5rem",
 		"3000": "7.5rem",
 		"4500": "11.25rem",
 		"5000": "12.5rem",
+		"5600": "14rem",
+		"6400": "16rem",
 		"7500": "18.75rem",
 		"9000": "22.5rem",
 		"10000": "25rem",
@@ -1004,6 +1015,11 @@ var semantic = {
 			md: "2.5rem",
 			lg: "3rem"
 		},
+		row: {
+			sm: "2rem",
+			md: "3rem",
+			lg: "4.5rem"
+		},
 		overlay: {
 			sm: "25rem",
 			md: "35rem",
@@ -1160,12 +1176,12 @@ var semantic = {
 	},
 	typography: {
 		display: "700 5rem/4.5rem 'Inter', sans-serif",
-		h1: "700 3rem/3rem 'Inter', sans-serif",
-		h2: "700 2rem/2.5rem 'Inter', sans-serif",
-		h3: "700 1.75rem/2.25rem 'Inter', sans-serif",
-		h4: "700 1.5rem/2rem 'Inter', sans-serif",
-		h5: "500 1.25rem/1.75rem 'Inter', sans-serif",
-		h6: "500 1.125rem/1.5rem 'Inter', sans-serif",
+		h1: "600 3rem/3rem 'Inter', sans-serif",
+		h2: "600 2rem/2.5rem 'Inter', sans-serif",
+		h3: "600 1.75rem/2.25rem 'Inter', sans-serif",
+		h4: "600 1.5rem/2rem 'Inter', sans-serif",
+		h5: "600 1.25rem/1.75rem 'Inter', sans-serif",
+		h6: "600 1.125rem/1.5rem 'Inter', sans-serif",
 		subtitle: "500 1rem/1.5rem 'Inter', sans-serif",
 		body: "400 1rem/1.5rem 'Inter', sans-serif",
 		small: "400 0.875rem/1.25rem 'Inter', sans-serif",
@@ -1180,6 +1196,9 @@ var semantic = {
 			instant: "0ms",
 			moderate: "200ms"
 		},
+		delay: {
+			hint: "500ms"
+		},
 		easing: {
 			standard: "ease-in-out",
 			decelerate: "ease-out",

package/dist/styles/tokens.json.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"tokens.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/tokens/index.js

@@ -789,7 +789,7 @@ var component = {
 			}
 		},
 		title: {
-			typography: "500 1.125rem/1.5rem 'Inter', sans-serif",
+			typography: "600 1.125rem/1.5rem 'Inter', sans-serif",
 			fontWeight: "600",
 			lineHeight: "1.25rem"
 		},
@@ -833,6 +833,14 @@ var component = {
 		fontSize: "0.75rem",
 		lineHeight: "1.25rem"
 	},
+	sidebarNav: {
+		width: {
+			rail: "3.5rem",
+			narrow: "14rem",
+			"default": "16rem",
+			wide: "18.75rem"
+		}
+	},
 	slider: {
 		thumb: {
 			shadow: {
@@ -991,12 +999,15 @@ var semantic = {
 		"600": "1.5rem",
 		"800": "2rem",
 		"1200": "3rem",
+		"1400": "3.5rem",
 		"1500": "3.75rem",
 		"1800": "4.5rem",
 		"2000": "5rem",
 		"3000": "7.5rem",
 		"4500": "11.25rem",
 		"5000": "12.5rem",
+		"5600": "14rem",
+		"6400": "16rem",
 		"7500": "18.75rem",
 		"9000": "22.5rem",
 		"10000": "25rem",
@@ -1008,6 +1019,11 @@ var semantic = {
 			md: "2.5rem",
 			lg: "3rem"
 		},
+		row: {
+			sm: "2rem",
+			md: "3rem",
+			lg: "4.5rem"
+		},
 		overlay: {
 			sm: "25rem",
 			md: "35rem",
@@ -1164,12 +1180,12 @@ var semantic = {
 	},
 	typography: {
 		display: "700 5rem/4.5rem 'Inter', sans-serif",
-		h1: "700 3rem/3rem 'Inter', sans-serif",
-		h2: "700 2rem/2.5rem 'Inter', sans-serif",
-		h3: "700 1.75rem/2.25rem 'Inter', sans-serif",
-		h4: "700 1.5rem/2rem 'Inter', sans-serif",
-		h5: "500 1.25rem/1.75rem 'Inter', sans-serif",
-		h6: "500 1.125rem/1.5rem 'Inter', sans-serif",
+		h1: "600 3rem/3rem 'Inter', sans-serif",
+		h2: "600 2rem/2.5rem 'Inter', sans-serif",
+		h3: "600 1.75rem/2.25rem 'Inter', sans-serif",
+		h4: "600 1.5rem/2rem 'Inter', sans-serif",
+		h5: "600 1.25rem/1.75rem 'Inter', sans-serif",
+		h6: "600 1.125rem/1.5rem 'Inter', sans-serif",
 		subtitle: "500 1rem/1.5rem 'Inter', sans-serif",
 		body: "400 1rem/1.5rem 'Inter', sans-serif",
 		small: "400 0.875rem/1.25rem 'Inter', sans-serif",
@@ -1184,6 +1200,9 @@ var semantic = {
 			instant: "0ms",
 			moderate: "200ms"
 		},
+		delay: {
+			hint: "500ms"
+		},
 		easing: {
 			standard: "ease-in-out",
 			decelerate: "ease-out",

package/dist/tokens/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/types/tokens.ts","../../src/tokens.ts"],"sourcesContent":["import tokensJson from '../styles/tokens.json'\nimport type { Tokens } from '../styles/tokens'\n\n// The published types come from the generated `src/styles/tokens.ts`, which carries each token's\n// description as JSDoc and `@deprecated` on deprecated tokens (decision 0033, #199). Declaring the\n// constant with that type also keeps emitted .d.ts files free of JSON imports, which consumers can\n// only resolve with `resolveJsonModule`.\nexport const tokens: Tokens = tokensJson\n\nexport type { Tokens }\nexport type TokensBase = Tokens['base']\nexport type TokensSemantic = Tokens['semantic']\nexport type TokensComponent = Tokens['component']\n","// Tokens-only export for standalone usage\nimport { tokens } from './types/tokens'\n\nexport { tokens }\nexport default tokens\n\nexport type {\n  Tokens,\n  TokensBase,\n  TokensSemantic,\n  TokensComponent\n} from './types/tokens'\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AACO,IAAM,MAAM,GAAW;;ACP9B;;;;;"}
+{"version":3,"file":"index.js","sources":["../../src/types/tokens.ts","../../src/tokens.ts"],"sourcesContent":["import tokensJson from '../styles/tokens.json'\nimport type { Tokens } from '../styles/tokens'\n\n// The published types come from the generated `src/styles/tokens.ts`, which carries each token's\n// description as JSDoc and `@deprecated` on deprecated tokens (decision 0033, #199). Declaring the\n// constant with that type also keeps emitted .d.ts files free of JSON imports, which consumers can\n// only resolve with `resolveJsonModule`.\nexport const tokens: Tokens = tokensJson\n\nexport type { Tokens }\nexport type TokensBase = Tokens['base']\nexport type TokensSemantic = Tokens['semantic']\nexport type TokensComponent = Tokens['component']\n","// Tokens-only export for standalone usage\nimport { tokens } from './types/tokens'\n\nexport { tokens }\nexport default tokens\n\nexport type {\n  Tokens,\n  TokensBase,\n  TokensSemantic,\n  TokensComponent\n} from './types/tokens'\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;AACA;AACA;AACA;AACO,IAAM,MAAM,GAAW;;ACP9B;;;;;"}