@norges-domstoler/dds-design-tokens 3.0.0 → 3.0.2

package/README.md

@@ -1,101 +1,101 @@
-# @norges-domstoler/dds-design-tokens
-
-[![Version](https://img.shields.io/npm/v/@norges-domstoler/dds-design-tokens)](https://www.npmjs.com/package/@norges-domstoler/dds-design-tokens)
-
-Biblioteket inneholder design tokens brukt i [Domstolenes designsystem Elsa](https://design.domstol.no/): farger, typografi, avstander skygger og størrelser. Design tokens kan brukes i domstolenes tjenester i bl.a. global styling og custom elementer. Ellers er det obligatorisk å bruke komponentbiblioteket [dds-components](https://www.npmjs.com/package/@norges-domstoler/dds-components).
-
-## 🔍 Oversikt
-
-Design tokens består av base-tokens og referanse-tokens. Base-tokens er variabler genererte fra Figma styles og tilsvarer identiteten til domstolene definert i designprofilen.
-
-Referanse-tokens (OBS! under arbeid) bruker base-tokens til å definere logikk for hvordan base-tokens skal brukes videre i komponenter og andre elementer. F.eks., referanse-tokens kan spesifisere hva fokusfargen skal være, eller font og farge for label i skjemakomponenter. Tanken med referanse-tokens er å gjøre det enklere å gjenbruke koden og eventuelt endre på styling i komponenter ved å endre kun på tokens, uten å røre CSS inni komponentene.
-
-### 📃 Tilgjengelige base-tokens
-
-- border
-- borderRadius
-- breakpoints
-- colors
-- font
-- fontPackages (kun JS)
-- grid
-- iconSizes
-- innerShadow
-- outerShadow
-- spacing
-
-## 📦 Installasjon
-
-```sh
-npm install @norges-domstoler/dds-design-tokens
-```
-
-## 🔨 Bruk
-
-Design tokens er eksportert som JS-konstanter, CSS-variabler og SCSS-variabler. Les mer under [Kom i gang](https://design.domstol.no/987b33f71/p/956e78-kom-i-gang/b/0174a7) og [Design tokens](https://design.domstol.no/987b33f71/p/18bd6f-design-tokens/b/499a2c) i dokumentasjonen.
-
-### JS
-
-```js
-import * as React from "react";
-import { render } from "react-dom";
-import { ddsBaseTokens } from "@norges-domstoler/dds-design-tokens";
-
-const { colors: Colors, spacing: Spacing } = ddsBaseTokens;
-
-const style = {
-  backgroundColor: Colors.DdsColorPrimaryBase,
-  padding: Spacing.SizesDdsSpacingLocalX075,
-};
-
-const App = () => <div style={style}>Tekst</div>;
-
-render(<App />, document.getElementById("root"));
-```
-
-### CSS
-
-```css
-@import "@norges-domstoler/dds-design-tokens/dist/css/colors.css";
-
-body {
-  background-color: var(--dds-color-primary-base);
-}
-```
-
-### SCSS
-
-```scss
-@use "@norges-domstoler/dds-design-tokens/dist/scss/colors" as colors;
-
-body {
-  background-color: colors.$dds-color-primary-base;
-}
-```
-
-## ⌨️ For bidragsytere
-
-Bilioteket ligger under `/tokens`.
-
-### Installasjon
-
-Klon repoet og installer style-dictionary i `/tokens/dds`:
-
-```
-cd tokens/dds
-npm install -D style-dictionary
-```
-
-### Generere design tokens i kode
-
-Biblioteket bruker [Style-dictionary](https://amzn.github.io/style-dictionary) for å generere design tokens som JS-konstanter, CSS-variabler og SCSS-variabler fra en eller flere JSON-filer. JSON-filen(e) ligger i `/dds/properties`. For å generere variabler fra JSON kjør følgende kommando fra `/dds`:
-
-```
-npm run build-tokens
-```
-
-Genererte variabler ligger i `/dds/build` organisert etter plattform.
-
-### Build
-
-Det brukes custom build for generering av variabler, den ligger i `/dds/build.js`. I tillegg spesifiserer `/dds/config.json` hva output skal være og mappestruktur for den etter `npm run build-tokens` kjøres.
+# @norges-domstoler/dds-design-tokens
+
+[![Version](https://img.shields.io/npm/v/@norges-domstoler/dds-design-tokens)](https://www.npmjs.com/package/@norges-domstoler/dds-design-tokens)
+
+Biblioteket inneholder design tokens brukt i [Domstolenes designsystem Elsa](https://design.domstol.no/): farger, typografi, avstander skygger og størrelser. Design tokens kan brukes i domstolenes tjenester i bl.a. global styling og custom elementer. Ellers er det obligatorisk å bruke komponentbiblioteket [dds-components](https://www.npmjs.com/package/@norges-domstoler/dds-components).
+
+## 🔍 Oversikt
+
+Design tokens består av base-tokens og referanse-tokens. Base-tokens er variabler genererte fra Figma styles og tilsvarer identiteten til domstolene definert i designprofilen.
+
+Referanse-tokens (OBS! under arbeid) bruker base-tokens til å definere logikk for hvordan base-tokens skal brukes videre i komponenter og andre elementer. F.eks., referanse-tokens kan spesifisere hva fokusfargen skal være, eller font og farge for label i skjemakomponenter. Tanken med referanse-tokens er å gjøre det enklere å gjenbruke koden og eventuelt endre på styling i komponenter ved å endre kun på tokens, uten å røre CSS inni komponentene.
+
+### 📃 Tilgjengelige base-tokens
+
+- border
+- borderRadius
+- breakpoints
+- colors
+- font
+- fontPackages (kun JS)
+- grid
+- iconSizes
+- innerShadow
+- outerShadow
+- spacing
+
+## 📦 Installasjon
+
+```sh
+npm install @norges-domstoler/dds-design-tokens
+```
+
+## 🔨 Bruk
+
+Design tokens er eksportert som JS-konstanter, CSS-variabler og SCSS-variabler. Les mer under [Kom i gang](https://design.domstol.no/987b33f71/p/956e78-kom-i-gang/b/0174a7) og [Design tokens](https://design.domstol.no/987b33f71/p/18bd6f-design-tokens/b/499a2c) i dokumentasjonen.
+
+### JS
+
+```js
+import * as React from "react";
+import { render } from "react-dom";
+import { ddsBaseTokens } from "@norges-domstoler/dds-design-tokens";
+
+const { colors: Colors, spacing: Spacing } = ddsBaseTokens;
+
+const style = {
+  backgroundColor: Colors.DdsColorPrimaryBase,
+  padding: Spacing.SizesDdsSpacingLocalX075,
+};
+
+const App = () => <div style={style}>Tekst</div>;
+
+render(<App />, document.getElementById("root"));
+```
+
+### CSS
+
+```css
+@import "@norges-domstoler/dds-design-tokens/dist/css/colors.css";
+
+body {
+  background-color: var(--dds-color-primary-base);
+}
+```
+
+### SCSS
+
+```scss
+@use "@norges-domstoler/dds-design-tokens/dist/scss/colors" as colors;
+
+body {
+  background-color: colors.$dds-color-primary-base;
+}
+```
+
+## ⌨️ For bidragsytere
+
+Bilioteket ligger under `/tokens`.
+
+### Installasjon
+
+Klon repoet og installer style-dictionary i `/tokens/dds`:
+
+```
+cd tokens/dds
+npm install -D style-dictionary
+```
+
+### Generere design tokens i kode
+
+Biblioteket bruker [Style-dictionary](https://amzn.github.io/style-dictionary) for å generere design tokens som JS-konstanter, CSS-variabler og SCSS-variabler fra en eller flere JSON-filer. JSON-filen(e) ligger i `/dds/properties`. For å generere variabler fra JSON kjør følgende kommando fra `/dds`:
+
+```
+npm run build-tokens
+```
+
+Genererte variabler ligger i `/dds/build` organisert etter plattform.
+
+### Build
+
+Det brukes custom build for generering av variabler, den ligger i `/dds/build.js`. I tillegg spesifiserer `/dds/config.json` hva output skal være og mappestruktur for den etter `npm run build-tokens` kjøres.

package/dist/cjs/dds/build/js/border.d.ts

@@ -1,34 +1,34 @@
-/**
- * Do not edit directly
- * Generated on Thu, 22 Sep 2022 09:11:12 GMT
- */
-export declare const BordersDdsBorderFocusBaseStrokeAlign = "inside";
-export declare const BordersDdsBorderFocusBaseStrokeMiterLimit = 4;
-export declare const BordersDdsBorderFocusBaseStrokeWeight = "1px";
-export declare const BordersDdsBorderFocusBaseStrokeWeightNumberPx = 1;
-export declare const BordersDdsBorderFocusBaseStroke = "rgba(98, 90, 31, 1)";
-export declare const BordersDdsBorderFocusOndarkStrokeAlign = "inside";
-export declare const BordersDdsBorderFocusOndarkStrokeMiterLimit = 4;
-export declare const BordersDdsBorderFocusOndarkStrokeWeight = "1px";
-export declare const BordersDdsBorderFocusOndarkStrokeWeightNumberPx = 1;
-export declare const BordersDdsBorderFocusOndarkStroke = "rgba(251, 243, 184, 1)";
-export declare const BordersDdsBorderFocusInputfieldStrokeAlign = "inside";
-export declare const BordersDdsBorderFocusInputfieldStrokeMiterLimit = 4;
-export declare const BordersDdsBorderFocusInputfieldStrokeWeight = "2px";
-export declare const BordersDdsBorderFocusInputfieldStrokeWeightNumberPx = 2;
-export declare const BordersDdsBorderFocusInputfieldStroke = "rgba(46, 120, 170, 1)";
-export declare const BordersDdsBorderFocusCardStrokeAlign = "outside";
-export declare const BordersDdsBorderFocusCardStrokeMiterLimit = 4;
-export declare const BordersDdsBorderFocusCardStrokeWeight = "2px";
-export declare const BordersDdsBorderFocusCardStrokeWeightNumberPx = 2;
-export declare const BordersDdsBorderFocusCardStroke = "rgba(98, 90, 31, 1)";
-export declare const BordersDdsBorderStyleLightStrokeAlign = "inside";
-export declare const BordersDdsBorderStyleLightStrokeMiterLimit = 4;
-export declare const BordersDdsBorderStyleLightStrokeWeight = "1px";
-export declare const BordersDdsBorderStyleLightStrokeWeightNumberPx = 1;
-export declare const BordersDdsBorderStyleLightStroke = "rgba(172, 187, 198, 1)";
-export declare const BordersDdsBorderStyleDarkStrokeAlign = "inside";
-export declare const BordersDdsBorderStyleDarkStrokeMiterLimit = 4;
-export declare const BordersDdsBorderStyleDarkStrokeWeight = "1px";
-export declare const BordersDdsBorderStyleDarkStrokeWeightNumberPx = 1;
-export declare const BordersDdsBorderStyleDarkStroke = "rgba(53, 71, 84, 1)";
+/**
+ * Do not edit directly
+ * Generated on Thu, 22 Sep 2022 09:11:12 GMT
+ */
+export declare const BordersDdsBorderFocusBaseStrokeAlign = "inside";
+export declare const BordersDdsBorderFocusBaseStrokeMiterLimit = 4;
+export declare const BordersDdsBorderFocusBaseStrokeWeight = "1px";
+export declare const BordersDdsBorderFocusBaseStrokeWeightNumberPx = 1;
+export declare const BordersDdsBorderFocusBaseStroke = "rgba(98, 90, 31, 1)";
+export declare const BordersDdsBorderFocusOndarkStrokeAlign = "inside";
+export declare const BordersDdsBorderFocusOndarkStrokeMiterLimit = 4;
+export declare const BordersDdsBorderFocusOndarkStrokeWeight = "1px";
+export declare const BordersDdsBorderFocusOndarkStrokeWeightNumberPx = 1;
+export declare const BordersDdsBorderFocusOndarkStroke = "rgba(251, 243, 184, 1)";
+export declare const BordersDdsBorderFocusInputfieldStrokeAlign = "inside";
+export declare const BordersDdsBorderFocusInputfieldStrokeMiterLimit = 4;
+export declare const BordersDdsBorderFocusInputfieldStrokeWeight = "2px";
+export declare const BordersDdsBorderFocusInputfieldStrokeWeightNumberPx = 2;
+export declare const BordersDdsBorderFocusInputfieldStroke = "rgba(46, 120, 170, 1)";
+export declare const BordersDdsBorderFocusCardStrokeAlign = "outside";
+export declare const BordersDdsBorderFocusCardStrokeMiterLimit = 4;
+export declare const BordersDdsBorderFocusCardStrokeWeight = "2px";
+export declare const BordersDdsBorderFocusCardStrokeWeightNumberPx = 2;
+export declare const BordersDdsBorderFocusCardStroke = "rgba(98, 90, 31, 1)";
+export declare const BordersDdsBorderStyleLightStrokeAlign = "inside";
+export declare const BordersDdsBorderStyleLightStrokeMiterLimit = 4;
+export declare const BordersDdsBorderStyleLightStrokeWeight = "1px";
+export declare const BordersDdsBorderStyleLightStrokeWeightNumberPx = 1;
+export declare const BordersDdsBorderStyleLightStroke = "rgba(172, 187, 198, 1)";
+export declare const BordersDdsBorderStyleDarkStrokeAlign = "inside";
+export declare const BordersDdsBorderStyleDarkStrokeMiterLimit = 4;
+export declare const BordersDdsBorderStyleDarkStrokeWeight = "1px";
+export declare const BordersDdsBorderStyleDarkStrokeWeightNumberPx = 1;
+export declare const BordersDdsBorderStyleDarkStroke = "rgba(53, 71, 84, 1)";

package/dist/cjs/dds/build/js/borderRadius.d.ts

@@ -1,34 +1,34 @@
-/**
- * Do not edit directly
- * Generated on Thu, 22 Sep 2022 09:11:12 GMT
- */
-export declare const RadiiDdsBorderRadius1Radius = "2px";
-export declare const RadiiDdsBorderRadius1RadiusNumberPx = 2;
-export declare const RadiiDdsBorderRadius1RadiiTopLeft = "2px";
-export declare const RadiiDdsBorderRadius1RadiiTopLeftNumberPx = 2;
-export declare const RadiiDdsBorderRadius1RadiiTopRight = "2px";
-export declare const RadiiDdsBorderRadius1RadiiTopRightNumberPx = 2;
-export declare const RadiiDdsBorderRadius1RadiiBottomRight = "2px";
-export declare const RadiiDdsBorderRadius1RadiiBottomRightNumberPx = 2;
-export declare const RadiiDdsBorderRadius1RadiiBottomLeft = "2px";
-export declare const RadiiDdsBorderRadius1RadiiBottomLeftNumberPx = 2;
-export declare const RadiiDdsBorderRadius2Radius = "4px";
-export declare const RadiiDdsBorderRadius2RadiusNumberPx = 4;
-export declare const RadiiDdsBorderRadius2RadiiTopLeft = "4px";
-export declare const RadiiDdsBorderRadius2RadiiTopLeftNumberPx = 4;
-export declare const RadiiDdsBorderRadius2RadiiTopRight = "4px";
-export declare const RadiiDdsBorderRadius2RadiiTopRightNumberPx = 4;
-export declare const RadiiDdsBorderRadius2RadiiBottomRight = "4px";
-export declare const RadiiDdsBorderRadius2RadiiBottomRightNumberPx = 4;
-export declare const RadiiDdsBorderRadius2RadiiBottomLeft = "4px";
-export declare const RadiiDdsBorderRadius2RadiiBottomLeftNumberPx = 4;
-export declare const RadiiDdsBorderRadius3Radius = "8px";
-export declare const RadiiDdsBorderRadius3RadiusNumberPx = 8;
-export declare const RadiiDdsBorderRadius3RadiiTopLeft = "8px";
-export declare const RadiiDdsBorderRadius3RadiiTopLeftNumberPx = 8;
-export declare const RadiiDdsBorderRadius3RadiiTopRight = "8px";
-export declare const RadiiDdsBorderRadius3RadiiTopRightNumberPx = 8;
-export declare const RadiiDdsBorderRadius3RadiiBottomRight = "8px";
-export declare const RadiiDdsBorderRadius3RadiiBottomRightNumberPx = 8;
-export declare const RadiiDdsBorderRadius3RadiiBottomLeft = "8px";
-export declare const RadiiDdsBorderRadius3RadiiBottomLeftNumberPx = 8;
+/**
+ * Do not edit directly
+ * Generated on Thu, 22 Sep 2022 09:11:12 GMT
+ */
+export declare const RadiiDdsBorderRadius1Radius = "2px";
+export declare const RadiiDdsBorderRadius1RadiusNumberPx = 2;
+export declare const RadiiDdsBorderRadius1RadiiTopLeft = "2px";
+export declare const RadiiDdsBorderRadius1RadiiTopLeftNumberPx = 2;
+export declare const RadiiDdsBorderRadius1RadiiTopRight = "2px";
+export declare const RadiiDdsBorderRadius1RadiiTopRightNumberPx = 2;
+export declare const RadiiDdsBorderRadius1RadiiBottomRight = "2px";
+export declare const RadiiDdsBorderRadius1RadiiBottomRightNumberPx = 2;
+export declare const RadiiDdsBorderRadius1RadiiBottomLeft = "2px";
+export declare const RadiiDdsBorderRadius1RadiiBottomLeftNumberPx = 2;
+export declare const RadiiDdsBorderRadius2Radius = "4px";
+export declare const RadiiDdsBorderRadius2RadiusNumberPx = 4;
+export declare const RadiiDdsBorderRadius2RadiiTopLeft = "4px";
+export declare const RadiiDdsBorderRadius2RadiiTopLeftNumberPx = 4;
+export declare const RadiiDdsBorderRadius2RadiiTopRight = "4px";
+export declare const RadiiDdsBorderRadius2RadiiTopRightNumberPx = 4;
+export declare const RadiiDdsBorderRadius2RadiiBottomRight = "4px";
+export declare const RadiiDdsBorderRadius2RadiiBottomRightNumberPx = 4;
+export declare const RadiiDdsBorderRadius2RadiiBottomLeft = "4px";
+export declare const RadiiDdsBorderRadius2RadiiBottomLeftNumberPx = 4;
+export declare const RadiiDdsBorderRadius3Radius = "8px";
+export declare const RadiiDdsBorderRadius3RadiusNumberPx = 8;
+export declare const RadiiDdsBorderRadius3RadiiTopLeft = "8px";
+export declare const RadiiDdsBorderRadius3RadiiTopLeftNumberPx = 8;
+export declare const RadiiDdsBorderRadius3RadiiTopRight = "8px";
+export declare const RadiiDdsBorderRadius3RadiiTopRightNumberPx = 8;
+export declare const RadiiDdsBorderRadius3RadiiBottomRight = "8px";
+export declare const RadiiDdsBorderRadius3RadiiBottomRightNumberPx = 8;
+export declare const RadiiDdsBorderRadius3RadiiBottomLeft = "8px";
+export declare const RadiiDdsBorderRadius3RadiiBottomLeftNumberPx = 8;

package/dist/cjs/dds/build/js/breakpoints.d.ts

@@ -1,14 +1,14 @@
-/**
- * Do not edit directly
- * Generated on Thu, 22 Sep 2022 09:11:12 GMT
- */
-export declare const DdsBreakpointXs = "1px";
-export declare const DdsBreakpointXsNumberPx = 1;
-export declare const DdsBreakpointSm = "600px";
-export declare const DdsBreakpointSmNumberPx = 600;
-export declare const DdsBreakpointMd = "960px";
-export declare const DdsBreakpointMdNumberPx = 960;
-export declare const DdsBreakpointLg = "1280px";
-export declare const DdsBreakpointLgNumberPx = 1280;
-export declare const DdsBreakpointXl = "1920px";
-export declare const DdsBreakpointXlNumberPx = 1920;
+/**
+ * Do not edit directly
+ * Generated on Thu, 22 Sep 2022 09:11:12 GMT
+ */
+export declare const DdsBreakpointXs = "1px";
+export declare const DdsBreakpointXsNumberPx = 1;
+export declare const DdsBreakpointSm = "600px";
+export declare const DdsBreakpointSmNumberPx = 600;
+export declare const DdsBreakpointMd = "960px";
+export declare const DdsBreakpointMdNumberPx = 960;
+export declare const DdsBreakpointLg = "1280px";
+export declare const DdsBreakpointLgNumberPx = 1280;
+export declare const DdsBreakpointXl = "1920px";
+export declare const DdsBreakpointXlNumberPx = 1920;

package/dist/cjs/dds/build/js/colors.d.ts

@@ -1,70 +1,70 @@
-/**
- * Do not edit directly
- * Generated on Thu, 22 Sep 2022 09:11:12 GMT
- */
-export declare const DdsColorPrimaryLightest = "rgba(234, 239, 244, 1)";
-export declare const DdsColorPrimaryLighter = "rgba(172, 187, 198, 1)";
-export declare const DdsColorPrimaryLight = "rgba(79, 106, 126, 1)";
-export declare const DdsColorPrimaryBase = "rgba(53, 71, 84, 1)";
-export declare const DdsColorPrimaryDark = "rgba(49, 61, 69, 1)";
-export declare const DdsColorPrimaryDarker = "rgba(32, 43, 50, 1)";
-export declare const DdsColorPrimaryDarkest = "rgba(21, 28, 34, 1)";
-export declare const DdsColorNeutralsWhite = "rgba(255, 255, 255, 1)";
-export declare const DdsColorNeutralsGray1 = "rgba(248, 249, 249, 1)";
-export declare const DdsColorNeutralsGray2 = "rgba(235, 236, 238, 1)";
-export declare const DdsColorNeutralsGray3 = "rgba(207, 212, 215, 1)";
-export declare const DdsColorNeutralsGray4 = "rgba(173, 181, 186, 1)";
-export declare const DdsColorNeutralsGray5 = "rgba(119, 131, 140, 1)";
-export declare const DdsColorNeutralsGray6 = "rgba(84, 92, 98, 1)";
-export declare const DdsColorNeutralsGray7 = "rgba(58, 65, 70, 1)";
-export declare const DdsColorNeutralsGray8 = "rgba(34, 39, 42, 1)";
-export declare const DdsColorNeutralsGray9 = "rgba(11, 13, 14, 1)";
-export declare const DdsColorInteractiveLightest = "rgba(234, 242, 247, 1)";
-export declare const DdsColorInteractiveLighter = "rgba(171, 201, 221, 1)";
-export declare const DdsColorInteractiveLight = "rgba(109, 161, 196, 1)";
-export declare const DdsColorInteractiveBase = "rgba(46, 120, 170, 1)";
-export declare const DdsColorInteractiveDark = "rgba(37, 96, 136, 1)";
-export declare const DdsColorInteractiveDarker = "rgba(28, 72, 102, 1)";
-export declare const DdsColorInteractiveDarkest = "rgba(18, 48, 68, 1)";
-export declare const DdsColorSecondaryLightest = "rgba(230, 237, 237, 1)";
-export declare const DdsColorSecondaryLighter = "rgba(205, 219, 219, 1)";
-export declare const DdsColorSecondaryLight = "rgba(184, 205, 205, 1)";
-export declare const DdsColorSecondaryBase = "rgba(154, 184, 183, 1)";
-export declare const DdsColorSecondaryDark = "rgba(123, 147, 146, 1)";
-export declare const DdsColorSecondaryDarker = "rgba(77, 100, 99, 1)";
-export declare const DdsColorSecondaryDarkest = "rgba(62, 74, 73, 1)";
-export declare const DdsColorTertiaryLightest = "rgba(255, 230, 223, 1)";
-export declare const DdsColorTertiaryLighter = "rgba(255, 214, 202, 1)";
-export declare const DdsColorTertiaryLight = "rgba(246, 193, 177, 1)";
-export declare const DdsColorTertiaryBase = "rgba(242, 166, 143, 1)";
-export declare const DdsColorTertiaryDark = "rgba(245, 152, 119, 1)";
-export declare const DdsColorTertiaryDarker = "rgba(242, 126, 85, 1)";
-export declare const DdsColorTertiaryDarkest = "rgba(194, 101, 68, 1)";
-export declare const DdsColorSuccessLightest = "rgba(240, 249, 240, 1)";
-export declare const DdsColorSuccessLighter = "rgba(193, 229, 194, 1)";
-export declare const DdsColorSuccessLight = "rgba(147, 210, 148, 1)";
-export declare const DdsColorSuccessBase = "rgba(101, 190, 102, 1)";
-export declare const DdsColorSuccessDark = "rgba(81, 152, 82, 1)";
-export declare const DdsColorSuccessDarker = "rgba(61, 114, 61, 1)";
-export declare const DdsColorSuccessDarkest = "rgba(40, 76, 41, 1)";
-export declare const DdsColorDangerLightest = "rgba(251, 235, 235, 1)";
-export declare const DdsColorDangerLighter = "rgba(239, 175, 175, 1)";
-export declare const DdsColorDangerLight = "rgba(228, 115, 115, 1)";
-export declare const DdsColorDangerBase = "rgba(216, 55, 55, 1)";
-export declare const DdsColorDangerDark = "rgba(173, 44, 44, 1)";
-export declare const DdsColorDangerDarker = "rgba(130, 33, 33, 1)";
-export declare const DdsColorDangerDarkest = "rgba(86, 22, 22, 1)";
-export declare const DdsColorWarningLightest = "rgba(254, 252, 237, 1)";
-export declare const DdsColorWarningLighter = "rgba(251, 243, 184, 1)";
-export declare const DdsColorWarningLight = "rgba(247, 233, 130, 1)";
-export declare const DdsColorWarningBase = "rgba(244, 224, 77, 1)";
-export declare const DdsColorWarningDark = "rgba(195, 179, 62, 1)";
-export declare const DdsColorWarningDarker = "rgba(146, 134, 46, 1)";
-export declare const DdsColorWarningDarkest = "rgba(98, 90, 31, 1)";
-export declare const DdsColorInfoLightest = "rgba(241, 248, 253, 1)";
-export declare const DdsColorInfoLighter = "rgba(200, 227, 245, 1)";
-export declare const DdsColorInfoLight = "rgba(158, 206, 238, 1)";
-export declare const DdsColorInfoBase = "rgba(117, 185, 230, 1)";
-export declare const DdsColorInfoDark = "rgba(94, 148, 184, 1)";
-export declare const DdsColorInfoDarker = "rgba(70, 111, 138, 1)";
-export declare const DdsColorInfoDarkest = "rgba(47, 74, 92, 1)";
+/**
+ * Do not edit directly
+ * Generated on Thu, 22 Sep 2022 09:11:12 GMT
+ */
+export declare const DdsColorPrimaryLightest = "rgba(234, 239, 244, 1)";
+export declare const DdsColorPrimaryLighter = "rgba(172, 187, 198, 1)";
+export declare const DdsColorPrimaryLight = "rgba(79, 106, 126, 1)";
+export declare const DdsColorPrimaryBase = "rgba(53, 71, 84, 1)";
+export declare const DdsColorPrimaryDark = "rgba(49, 61, 69, 1)";
+export declare const DdsColorPrimaryDarker = "rgba(32, 43, 50, 1)";
+export declare const DdsColorPrimaryDarkest = "rgba(21, 28, 34, 1)";
+export declare const DdsColorNeutralsWhite = "rgba(255, 255, 255, 1)";
+export declare const DdsColorNeutralsGray1 = "rgba(248, 249, 249, 1)";
+export declare const DdsColorNeutralsGray2 = "rgba(235, 236, 238, 1)";
+export declare const DdsColorNeutralsGray3 = "rgba(207, 212, 215, 1)";
+export declare const DdsColorNeutralsGray4 = "rgba(173, 181, 186, 1)";
+export declare const DdsColorNeutralsGray5 = "rgba(119, 131, 140, 1)";
+export declare const DdsColorNeutralsGray6 = "rgba(84, 92, 98, 1)";
+export declare const DdsColorNeutralsGray7 = "rgba(58, 65, 70, 1)";
+export declare const DdsColorNeutralsGray8 = "rgba(34, 39, 42, 1)";
+export declare const DdsColorNeutralsGray9 = "rgba(11, 13, 14, 1)";
+export declare const DdsColorInteractiveLightest = "rgba(234, 242, 247, 1)";
+export declare const DdsColorInteractiveLighter = "rgba(171, 201, 221, 1)";
+export declare const DdsColorInteractiveLight = "rgba(109, 161, 196, 1)";
+export declare const DdsColorInteractiveBase = "rgba(46, 120, 170, 1)";
+export declare const DdsColorInteractiveDark = "rgba(37, 96, 136, 1)";
+export declare const DdsColorInteractiveDarker = "rgba(28, 72, 102, 1)";
+export declare const DdsColorInteractiveDarkest = "rgba(18, 48, 68, 1)";
+export declare const DdsColorSecondaryLightest = "rgba(230, 237, 237, 1)";
+export declare const DdsColorSecondaryLighter = "rgba(205, 219, 219, 1)";
+export declare const DdsColorSecondaryLight = "rgba(184, 205, 205, 1)";
+export declare const DdsColorSecondaryBase = "rgba(154, 184, 183, 1)";
+export declare const DdsColorSecondaryDark = "rgba(123, 147, 146, 1)";
+export declare const DdsColorSecondaryDarker = "rgba(77, 100, 99, 1)";
+export declare const DdsColorSecondaryDarkest = "rgba(62, 74, 73, 1)";
+export declare const DdsColorTertiaryLightest = "rgba(255, 230, 223, 1)";
+export declare const DdsColorTertiaryLighter = "rgba(255, 214, 202, 1)";
+export declare const DdsColorTertiaryLight = "rgba(246, 193, 177, 1)";
+export declare const DdsColorTertiaryBase = "rgba(242, 166, 143, 1)";
+export declare const DdsColorTertiaryDark = "rgba(245, 152, 119, 1)";
+export declare const DdsColorTertiaryDarker = "rgba(242, 126, 85, 1)";
+export declare const DdsColorTertiaryDarkest = "rgba(194, 101, 68, 1)";
+export declare const DdsColorSuccessLightest = "rgba(240, 249, 240, 1)";
+export declare const DdsColorSuccessLighter = "rgba(193, 229, 194, 1)";
+export declare const DdsColorSuccessLight = "rgba(147, 210, 148, 1)";
+export declare const DdsColorSuccessBase = "rgba(101, 190, 102, 1)";
+export declare const DdsColorSuccessDark = "rgba(81, 152, 82, 1)";
+export declare const DdsColorSuccessDarker = "rgba(61, 114, 61, 1)";
+export declare const DdsColorSuccessDarkest = "rgba(40, 76, 41, 1)";
+export declare const DdsColorDangerLightest = "rgba(251, 235, 235, 1)";
+export declare const DdsColorDangerLighter = "rgba(239, 175, 175, 1)";
+export declare const DdsColorDangerLight = "rgba(228, 115, 115, 1)";
+export declare const DdsColorDangerBase = "rgba(216, 55, 55, 1)";
+export declare const DdsColorDangerDark = "rgba(173, 44, 44, 1)";
+export declare const DdsColorDangerDarker = "rgba(130, 33, 33, 1)";
+export declare const DdsColorDangerDarkest = "rgba(86, 22, 22, 1)";
+export declare const DdsColorWarningLightest = "rgba(254, 252, 237, 1)";
+export declare const DdsColorWarningLighter = "rgba(251, 243, 184, 1)";
+export declare const DdsColorWarningLight = "rgba(247, 233, 130, 1)";
+export declare const DdsColorWarningBase = "rgba(244, 224, 77, 1)";
+export declare const DdsColorWarningDark = "rgba(195, 179, 62, 1)";
+export declare const DdsColorWarningDarker = "rgba(146, 134, 46, 1)";
+export declare const DdsColorWarningDarkest = "rgba(98, 90, 31, 1)";
+export declare const DdsColorInfoLightest = "rgba(241, 248, 253, 1)";
+export declare const DdsColorInfoLighter = "rgba(200, 227, 245, 1)";
+export declare const DdsColorInfoLight = "rgba(158, 206, 238, 1)";
+export declare const DdsColorInfoBase = "rgba(117, 185, 230, 1)";
+export declare const DdsColorInfoDark = "rgba(94, 148, 184, 1)";
+export declare const DdsColorInfoDarker = "rgba(70, 111, 138, 1)";
+export declare const DdsColorInfoDarkest = "rgba(47, 74, 92, 1)";