@abgov/design-tokens 1.7.1 → 1.9.0

package/data/component-design-tokens/linear-progress-design-tokens.json

@@ -0,0 +1,42 @@
+{
+  "linear-progress-height": {
+    "value": "{space.2xs}",
+    "type": "sizing",
+    "description": "4px - Height of the progress bar track"
+  },
+  "linear-progress-border-radius": {
+    "value": "{borderRadius.m}",
+    "type": "borderRadius",
+    "description": "8px - Border radius of progress bar and indicator"
+  },
+  "linear-progress-color-track": {
+    "value": "{color.greyscale.200}",
+    "type": "color",
+    "description": "Background color of the progress bar track"
+  },
+  "linear-progress-color-indicator": {
+    "value": "{color.info.default}",
+    "type": "color",
+    "description": "Color of the progress indicator (both determinate and indeterminate)"
+  },
+  "linear-progress-percentage-gap": {
+    "value": "{space.xs}",
+    "type": "spacing",
+    "description": "8px - Gap between the progress bar and percentage text"
+  },
+  "linear-progress-percentage-color": {
+    "value": "{color.text.secondary}",
+    "type": "color",
+    "description": "Color of the percentage text"
+  },
+  "linear-progress-percentage-text": {
+    "value": "{typography.body.xs}",
+    "type": "other",
+    "description": "Typography for the percentage text (14px/20px)"
+  },
+  "linear-progress-percentage-width": {
+    "value": "4ch",
+    "type": "sizing",
+    "description": "Fixed width for percentage text to prevent layout shift"
+  }
+}

package/data/component-design-tokens/push-drawer-design-tokens.json

@@ -0,0 +1,40 @@
+{
+  "push-drawer-border-radius": {
+    "value": "{borderRadius.none}",
+    "type": "borderRadius",
+    "description": "Border radius for drawer corners"
+  },
+  "push-drawer-content-padding-horizontal": {
+    "value": "{space.l}",
+    "type": "spacing",
+    "description": "Horizontal padding for content section"
+  },
+  "push-drawer-content-padding-vertical": {
+    "value": "{space.m}",
+    "type": "spacing",
+    "description": "Vertical padding for content section"
+  },
+  "push-drawer-actions-padding-top": {
+    "value": "{space.m}",
+    "type": "spacing",
+    "description": "Top padding for actions section"
+  },
+  "push-drawer-actions-padding-bottom": {
+    "value": "{space.l}",
+    "type": "spacing",
+    "description": "Bottom padding for actions section"
+  },
+  "push-drawer-heading-typography": {
+    "value": "{typography.heading.s}",
+    "type": "other",
+    "description": "Typography for drawer heading"
+  },
+  "push-drawer-transition-time": {
+    "value": "0.25s",
+    "type": "other"
+  },
+  "push-drawer-padding": {
+    "value": "{space.m}",
+    "type": "spacing"
+  }
+}

package/dist/tokens.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Mon, 17 Nov 2025 23:04:46 GMT
+ * Generated on Tue, 20 Jan 2026 20:52:47 GMT
  */
 
 :root {
@@ -144,9 +144,11 @@
   --goa-radio-border-radius: 50%;
   --goa-radio-border-checked-error-hover: 7px solid #ba0000;
   --goa-radio-border-checked-error-disabled: 7px solid #f58185;
+  --goa-push-drawer-transition-time: 0.25s;
   --goa-circular-progress-color-background: rgba(255, 255, 255, 0.9);
   --goa-popover-shadow: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.25));
   --goa-modal-shadow: 6px 6px 6px 6px rgba(0,0,0,0.16);
+  --goa-linear-progress-percentage-width: 4ch;
   --goa-text-input-transition: box-shadow 0.05s ease-in;
   --goa-app-header-nav-color-bg-link-item-in-menu: transparent;
   --goa-app-header-nav-color-bg-link-item-focus: transparent;
@@ -295,6 +297,12 @@
   --goa-radio-border-checked-disabled: 7px solid var(--goa-color-interactive-disabled);
   --goa-radio-border-checked: 7px solid var(--goa-color-interactive-default);
   --goa-radio-border: var(--goa-border-width-s) solid var(--goa-color-greyscale-700);
+  --goa-push-drawer-padding: var(--goa-space-m);
+  --goa-push-drawer-actions-padding-bottom: var(--goa-space-l);
+  --goa-push-drawer-actions-padding-top: var(--goa-space-m);
+  --goa-push-drawer-content-padding-vertical: var(--goa-space-m);
+  --goa-push-drawer-content-padding-horizontal: var(--goa-space-l);
+  --goa-push-drawer-border-radius: var(--goa-border-radius-none);
   --goa-circular-progress-small-margin-top: var(--goa-space-l);
   --goa-circular-progress-large-margin-top: var(--goa-space-xl);
   --goa-popover-padding: var(--goa-space-s);
@@ -337,6 +345,11 @@
   --goa-microsite-header-color-bg: var(--goa-color-greyscale-100);
   --goa-microsite-header-beta-badge-color: var(--goa-color-brand-default);
   --goa-microsite-header-alpha-badge-color: var(--goa-color-warning-default);
+  --goa-linear-progress-percentage-gap: var(--goa-space-xs);
+  --goa-linear-progress-color-indicator: var(--goa-color-info-default);
+  --goa-linear-progress-color-track: var(--goa-color-greyscale-200);
+  --goa-linear-progress-border-radius: var(--goa-border-radius-m);
+  --goa-linear-progress-height: var(--goa-space-2xs);
   --goa-text-input-color-icon: var(--goa-color-greyscale-black);
   --goa-text-input-size-icon: var(--goa-icon-size-4);
   --goa-text-input-space-btw-icon-text: var(--goa-space-xs);
@@ -679,6 +692,7 @@
   --goa-side-menu-color-menu-item: var(--goa-color-text-default);
   --goa-radio-label: var(--goa-typography-body-m);
   --goa-radio-description: var(--goa-typography-body-xs);
+  --goa-push-drawer-heading-typography: var(--goa-typography-heading-s);
   --goa-circular-progress-small-text: var(--goa-typography-body-m);
   --goa-circular-progress-large-text: var(--goa-typography-body-l);
   --goa-notification-banner-custom-color-text: var(--goa-color-text-light);
@@ -692,6 +706,8 @@
   --goa-microsite-header-color-version-number: var(--goa-color-text-secondary);
   --goa-microsite-header-beta-badge-color-text: var(--goa-color-text-light);
   --goa-microsite-header-alpha-badge-color-text: var(--goa-color-text-default);
+  --goa-linear-progress-percentage-text: var(--goa-typography-body-xs);
+  --goa-linear-progress-percentage-color: var(--goa-color-text-secondary);
   --goa-text-input-typography: var(--goa-typography-body-m);
   --goa-text-input-padding: 7px var(--goa-text-input-padding-lr) 9px;
   --goa-text-input-lt-content-color-text: var(--goa-color-text-default);

package/dist/tokens.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 17 Nov 2025 23:04:46 GMT
+// Generated on Tue, 20 Jan 2026 20:52:47 GMT
 
 $goa-accordion-color-bg-heading: #f1f1f1;
 $goa-accordion-color-bg-content: #ffffff;
@@ -452,6 +452,14 @@ $goa-text-input-size-icon: 1.5rem;
 $goa-text-input-color-icon: #333333;
 $goa-text-input-transition: box-shadow 0.05s ease-in;
 $goa-text-input-typography: 400 1.125rem/1.75rem acumin-pro-semi-condensed, helvetica-neue, arial, sans-serif;
+$goa-linear-progress-height: 0.25rem;
+$goa-linear-progress-border-radius: 0.25rem;
+$goa-linear-progress-color-track: #dcdcdc;
+$goa-linear-progress-color-indicator: #004a8f;
+$goa-linear-progress-percentage-gap: 0.5rem;
+$goa-linear-progress-percentage-color: #666666;
+$goa-linear-progress-percentage-text: 400 0.875rem/1.25rem acumin-pro-semi-condensed, helvetica-neue, arial, sans-serif;
+$goa-linear-progress-percentage-width: 4ch;
 $goa-microsite-header-alpha-badge-color: #f9ce2d;
 $goa-microsite-header-alpha-badge-color-text: #333333;
 $goa-microsite-header-beta-badge-color: #0081a2;
@@ -510,6 +518,14 @@ $goa-circular-progress-large-margin-top: 2rem;
 $goa-circular-progress-large-text: 400 1.5rem/2rem acumin-pro-semi-condensed, helvetica-neue, arial, sans-serif;
 $goa-circular-progress-small-margin-top: 1.5rem;
 $goa-circular-progress-small-text: 400 1.125rem/1.75rem acumin-pro-semi-condensed, helvetica-neue, arial, sans-serif;
+$goa-push-drawer-border-radius: 0;
+$goa-push-drawer-content-padding-horizontal: 1.5rem;
+$goa-push-drawer-content-padding-vertical: 1rem;
+$goa-push-drawer-actions-padding-top: 1rem;
+$goa-push-drawer-actions-padding-bottom: 1.5rem;
+$goa-push-drawer-heading-typography: 700 1.125rem/1.75rem acumin-pro-semi-condensed, helvetica-neue, arial, sans-serif;
+$goa-push-drawer-transition-time: 0.25s;
+$goa-push-drawer-padding: 1rem;
 $goa-radio-border: 1px solid #666666;
 $goa-radio-border-checked: 7px solid #0070c4;
 $goa-radio-border-checked-disabled: 7px solid #80b7e1;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/design-tokens",
-  "version": "1.7.1",
+  "version": "1.9.0",
   "main": "./index.js",
   "repository": {
     "type": "git",